Niklas/shadcn-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

docs: sidebar

Browse Source
This commit is contained in:
zernonia 2024-11-25 18:01:47 +08:00
parent 99c685e411
commit 41d836335f
150 changed files with 6280 additions and 343 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/www/.vitepress/theme/components/BlockContainer.vue
View File

@ -220,10 +220,6 @@ watch([style, codeConfig], async () => {
</TabsContent>
<TabsContent value="code" class="h-[--height]">
<BlockViewerCode v-if="componentRegistry" :item="componentRegistry" />
<!-- <div
class="language-vue !h-full !max-h-[none] !mt-0"
v-html="codeHtml"
/> -->
</TabsContent>
</Tabs>
</template>

6
apps/www/.vitepress/theme/components/BlockPage.vue
View File

@ -1,4 +1,5 @@
<script setup lang="ts">
import { cn } from '@/lib/utils'
import { useUrlSearchParams } from '@vueuse/core'
import ComponentLoader from './ComponentLoader.vue'
@ -6,7 +7,10 @@ const params = useUrlSearchParams('history')
</script>
<template>
<div v-if="params.name" :class="params.containerClass">
<div
v-if="params.name"
:class="cn('preview flex h-screen w-full justify-center p-10 items-center', params.containerClass)"
>
<ComponentLoader :key="params.style?.toString()" :name="params.name?.toString()" :type-name="'block'" />
</div>
</template>

2
apps/www/.vitepress/theme/components/BlockPreview.vue
View File

@ -12,7 +12,7 @@ const isLoading = ref(true)
<template>
<div class="relative rounded-lg border overflow-hidden bg-background" :class="[container ? '' : 'aspect-[4/2.5]']">
<div v-if="isLoading" class="flex items-center justify-center h-full">
<div v-if="isLoading" class="flex items-center justify-center h-full w-full z-10 relative">
<Spinner />
</div>
<div

4
apps/www/.vitepress/theme/components/Blocks.vue
View File

@ -1,6 +1,5 @@
<script setup lang="ts">
import { Button } from '@/registry/new-york/ui/button'
import { Index } from '../../../__registry__'
import Announcement from '../components/Announcement.vue'
import PageAction from '../components/PageAction.vue'
@ -10,8 +9,7 @@ import PageHeaderDescription from '../components/PageHeaderDescription.vue'
import PageHeaderHeading from '../components/PageHeaderHeading.vue'
import BlockContainer from './BlockContainer.vue'
// const blocks = ['Sidebar01', 'Sidebar02', 'Sidebar03', 'Sidebar04', 'Sidebar05', 'Sidebar06', 'Sidebar07', 'Sidebar08', 'Sidebar09', 'Sidebar10', 'Sidebar11', 'Sidebar12', 'Sidebar13', 'Sidebar14', 'Sidebar15', 'Login01']
const blocks = Object.values(Index['new-york']).filter((i: any) => i.type === 'registry:block' && i.name.includes('Sidebar')).map((i: any) => i.name)
const blocks = ['Sidebar01', 'Sidebar02', 'Sidebar03', 'Sidebar04', 'Sidebar05', 'Sidebar06', 'Sidebar07', 'Sidebar08', 'Sidebar09', 'Sidebar10', 'Sidebar11', 'Sidebar12', 'Sidebar13', 'Sidebar14', 'Sidebar15', 'Login01']
</script>
<template>

4
apps/www/.vitepress/theme/components/TableOfContent.vue
View File

@ -60,8 +60,8 @@ onContentUpdated(() => {
</script>
<template>
<div class="hidden text-sm xl:block">
<div class="no-scrollbar h-full overflow-auto pb-10 space-y-2">
<div class="hidden xl:block no-scrollbar h-full overflow-auto pb-16">
<div class="space-y-2">
<p class="font-medium">
On This Page
</p>

6
apps/www/.vitepress/theme/style.css
View File

@ -223,7 +223,7 @@ pre code {
}
.line-numbers-wrapper {
@apply font-mono;
@apply !font-mono;
}
pre code .line {
@ -231,7 +231,9 @@ pre code .line {
}
.line-number {
@apply !text-sm !inline-block text-muted-foreground leading-[--vp-code-line-height];
font-size: .75rem ;
color: hsla(0, 0%, 98%, .4) ;
@apply !inline-block leading-[--vp-code-line-height];
}
::view-transition-old(root),

35
apps/www/.vitepress/theme/styles/vp-doc.css
View File

@ -171,39 +171,26 @@
* Table
* -------------------------------------------------------------------------- */
/* .vp-doc table {
display: block;
border-collapse: collapse;
margin: 20px 0;
overflow-x: auto;
.vp-doc table {
@apply relative w-full overflow-hidden border-none text-sm;
}
.vp-doc tr {
border-top: 1px solid var(--vp-c-divider);
transition: background-color 0.5s;
@apply m-0 border-b;
}
.vp-doc tr:nth-child(2n) {
background-color: var(--vp-c-bg-soft);
}
.vp-doc th,
.vp-doc td {
border: 1px solid var(--vp-c-divider);
padding: 8px 16px;
.vp-doc tbody tr:last-child {
@apply border-b-0;
}
.vp-doc th {
text-align: left;
font-size: 14px;
font-weight: 600;
color: var(--vp-c-text-2);
background-color: var(--vp-c-bg-soft);
@apply px-4 py-2 text-left font-bold [&[align=center]]:text-center [&[align=right]]:text-right;
}
.vp-doc td {
font-size: 14px;
} */
@apply px-4 py-2 text-left [&[align=center]]:text-center [&[align=right]]:text-right;
}
/**
* Decorational elements
@ -427,7 +414,7 @@
z-index: 3;
border-right: 1px solid var(--vp-code-block-divider-color);
padding-top: 14px;
padding-left: 8px;
padding-left: 20px;
width: 32px;
text-align: center;
font-family: var(--vp-font-family-mono);

904
apps/www/__registry__/block.ts
View File

@ -191,6 +191,232 @@ export const Index: Record<string, any> = {
category: "",
subcategory: ""
},
"DemoSidebar": {
name: "DemoSidebar",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebar.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebar.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebar.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebar.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarControlled": {
name: "DemoSidebarControlled",
description: "",
type: "registry:block",
registryDependencies: ["button","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarControlled.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarControlled.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarControlled.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarControlled.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarFooter": {
name: "DemoSidebarFooter",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarFooter.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarFooter.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarFooter.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarFooter.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroup": {
name: "DemoSidebarGroup",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarGroup.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarGroup.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarGroup.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarGroup.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroupAction": {
name: "DemoSidebarGroupAction",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarGroupAction.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarGroupAction.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarGroupAction.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarGroupAction.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroupCollapsible": {
name: "DemoSidebarGroupCollapsible",
description: "",
type: "registry:block",
registryDependencies: ["collapsible","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarGroupCollapsible.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarGroupCollapsible.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarGroupCollapsible.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarGroupCollapsible.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarHeader": {
name: "DemoSidebarHeader",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarHeader.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarHeader.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarHeader.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarHeader.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenu": {
name: "DemoSidebarMenu",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenu.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarMenu.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenu.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarMenu.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuAction": {
name: "DemoSidebarMenuAction",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenuAction.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarMenuAction.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenuAction.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarMenuAction.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuBadge": {
name: "DemoSidebarMenuBadge",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenuBadge.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarMenuBadge.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenuBadge.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarMenuBadge.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuCollapsible": {
name: "DemoSidebarMenuCollapsible",
description: "",
type: "registry:block",
registryDependencies: ["collapsible","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenuCollapsible.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarMenuCollapsible.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenuCollapsible.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarMenuCollapsible.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuSub": {
name: "DemoSidebarMenuSub",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenuSub.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarMenuSub.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenuSub.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarMenuSub.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"Login01": {
name: "Login01",
description: "",
type: "registry:block",
registryDependencies: ["LoginForm.vue","button","card","input","label"],
files: [{
path: "registry/new-york/block/Login01/page.vue",
type: "registry:page",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/Login01/page.vue?raw").then((m) => m.default)
},{
path: "registry/new-york/block/Login01/components/LoginForm.vue",
type: "registry:component",
target: "",
raw: () => import("@/registry/new-york/block/Login01/components/LoginForm.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/Login01/page.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/Login01/page.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"Sidebar01": {
name: "Sidebar01",
description: "",
@ -888,6 +1114,232 @@ export const Index: Record<string, any> = {
category: "",
subcategory: ""
},
"DemoSidebar": {
name: "DemoSidebar",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebar.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebar.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebar.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebar.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarControlled": {
name: "DemoSidebarControlled",
description: "",
type: "registry:block",
registryDependencies: ["button","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarControlled.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarControlled.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarControlled.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarControlled.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarFooter": {
name: "DemoSidebarFooter",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarFooter.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarFooter.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarFooter.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarFooter.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroup": {
name: "DemoSidebarGroup",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarGroup.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarGroup.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarGroup.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarGroup.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroupAction": {
name: "DemoSidebarGroupAction",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarGroupAction.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarGroupAction.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarGroupAction.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarGroupAction.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroupCollapsible": {
name: "DemoSidebarGroupCollapsible",
description: "",
type: "registry:block",
registryDependencies: ["collapsible","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarGroupCollapsible.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarGroupCollapsible.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarGroupCollapsible.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarGroupCollapsible.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarHeader": {
name: "DemoSidebarHeader",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarHeader.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarHeader.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarHeader.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarHeader.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenu": {
name: "DemoSidebarMenu",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenu.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarMenu.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenu.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarMenu.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuAction": {
name: "DemoSidebarMenuAction",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenuAction.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarMenuAction.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenuAction.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarMenuAction.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuBadge": {
name: "DemoSidebarMenuBadge",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenuBadge.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarMenuBadge.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenuBadge.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarMenuBadge.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuCollapsible": {
name: "DemoSidebarMenuCollapsible",
description: "",
type: "registry:block",
registryDependencies: ["collapsible","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenuCollapsible.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarMenuCollapsible.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenuCollapsible.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarMenuCollapsible.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuSub": {
name: "DemoSidebarMenuSub",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenuSub.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/DemoSidebarMenuSub.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenuSub.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/DemoSidebarMenuSub.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"Login01": {
name: "Login01",
description: "",
type: "registry:block",
registryDependencies: ["LoginForm.vue","button","card","input","label"],
files: [{
path: "registry/new-york/block/Login01/page.vue",
type: "registry:page",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/new-york/block/Login01/page.vue?raw").then((m) => m.default)
},{
path: "registry/new-york/block/Login01/components/LoginForm.vue",
type: "registry:component",
target: "",
raw: () => import("@/registry/new-york/block/Login01/components/LoginForm.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/new-york/block/Login01/page.vue").then((m) => m.default),
raw: () => import("@/registry/new-york/block/Login01/page.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"Sidebar01": {
name: "Sidebar01",
description: "",
@ -1586,6 +2038,232 @@ export const Index: Record<string, any> = {
category: "",
subcategory: ""
},
"DemoSidebar": {
name: "DemoSidebar",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebar.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebar.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebar.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebar.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarControlled": {
name: "DemoSidebarControlled",
description: "",
type: "registry:block",
registryDependencies: ["button","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarControlled.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarControlled.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarControlled.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarControlled.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarFooter": {
name: "DemoSidebarFooter",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarFooter.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarFooter.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarFooter.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarFooter.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroup": {
name: "DemoSidebarGroup",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarGroup.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarGroup.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarGroup.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarGroup.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroupAction": {
name: "DemoSidebarGroupAction",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarGroupAction.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarGroupAction.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarGroupAction.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarGroupAction.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroupCollapsible": {
name: "DemoSidebarGroupCollapsible",
description: "",
type: "registry:block",
registryDependencies: ["collapsible","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarGroupCollapsible.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarGroupCollapsible.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarGroupCollapsible.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarGroupCollapsible.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarHeader": {
name: "DemoSidebarHeader",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarHeader.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarHeader.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarHeader.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarHeader.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenu": {
name: "DemoSidebarMenu",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenu.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarMenu.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarMenu.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarMenu.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuAction": {
name: "DemoSidebarMenuAction",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenuAction.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarMenuAction.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarMenuAction.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarMenuAction.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuBadge": {
name: "DemoSidebarMenuBadge",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenuBadge.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarMenuBadge.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarMenuBadge.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarMenuBadge.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuCollapsible": {
name: "DemoSidebarMenuCollapsible",
description: "",
type: "registry:block",
registryDependencies: ["collapsible","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenuCollapsible.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarMenuCollapsible.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarMenuCollapsible.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarMenuCollapsible.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuSub": {
name: "DemoSidebarMenuSub",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenuSub.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarMenuSub.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarMenuSub.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarMenuSub.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"Login01": {
name: "Login01",
description: "",
type: "registry:block",
registryDependencies: ["LoginForm.vue","button","card","input","label"],
files: [{
path: "registry/default/block/Login01/page.vue",
type: "registry:page",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/Login01/page.vue?raw").then((m) => m.default)
},{
path: "registry/default/block/Login01/components/LoginForm.vue",
type: "registry:component",
target: "",
raw: () => import("@/registry/default/block/Login01/components/LoginForm.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/Login01/page.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/Login01/page.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"Sidebar01": {
name: "Sidebar01",
description: "",
@ -2283,6 +2961,232 @@ export const Index: Record<string, any> = {
category: "",
subcategory: ""
},
"DemoSidebar": {
name: "DemoSidebar",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebar.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebar.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebar.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebar.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarControlled": {
name: "DemoSidebarControlled",
description: "",
type: "registry:block",
registryDependencies: ["button","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarControlled.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarControlled.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarControlled.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarControlled.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarFooter": {
name: "DemoSidebarFooter",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarFooter.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarFooter.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarFooter.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarFooter.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroup": {
name: "DemoSidebarGroup",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarGroup.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarGroup.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarGroup.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarGroup.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroupAction": {
name: "DemoSidebarGroupAction",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarGroupAction.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarGroupAction.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarGroupAction.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarGroupAction.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroupCollapsible": {
name: "DemoSidebarGroupCollapsible",
description: "",
type: "registry:block",
registryDependencies: ["collapsible","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarGroupCollapsible.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarGroupCollapsible.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarGroupCollapsible.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarGroupCollapsible.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarHeader": {
name: "DemoSidebarHeader",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarHeader.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarHeader.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarHeader.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarHeader.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenu": {
name: "DemoSidebarMenu",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenu.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarMenu.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarMenu.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarMenu.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuAction": {
name: "DemoSidebarMenuAction",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenuAction.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarMenuAction.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarMenuAction.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarMenuAction.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuBadge": {
name: "DemoSidebarMenuBadge",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenuBadge.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarMenuBadge.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarMenuBadge.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarMenuBadge.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuCollapsible": {
name: "DemoSidebarMenuCollapsible",
description: "",
type: "registry:block",
registryDependencies: ["collapsible","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenuCollapsible.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarMenuCollapsible.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarMenuCollapsible.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarMenuCollapsible.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuSub": {
name: "DemoSidebarMenuSub",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenuSub.vue",
type: "registry:block",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/DemoSidebarMenuSub.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/DemoSidebarMenuSub.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/DemoSidebarMenuSub.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"Login01": {
name: "Login01",
description: "",
type: "registry:block",
registryDependencies: ["LoginForm.vue","button","card","input","label"],
files: [{
path: "registry/default/block/Login01/page.vue",
type: "registry:page",
target: "pages/dashboard/index.vue",
raw: () => import("@/registry/default/block/Login01/page.vue?raw").then((m) => m.default)
},{
path: "registry/default/block/Login01/components/LoginForm.vue",
type: "registry:component",
target: "",
raw: () => import("@/registry/default/block/Login01/components/LoginForm.vue?raw").then((m) => m.default)
}],
component: () => import("@/registry/default/block/Login01/page.vue").then((m) => m.default),
raw: () => import("@/registry/default/block/Login01/page.vue?raw").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"Sidebar01": {
name: "Sidebar01",
description: "",

796
apps/www/__registry__/index.ts
View File

@ -5235,6 +5235,205 @@ export const Index: Record<string, any> = {
category: "",
subcategory: ""
},
"DemoSidebar": {
name: "DemoSidebar",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebar.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebar.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarControlled": {
name: "DemoSidebarControlled",
description: "",
type: "registry:block",
registryDependencies: ["button","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarControlled.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarControlled.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarFooter": {
name: "DemoSidebarFooter",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarFooter.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarFooter.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroup": {
name: "DemoSidebarGroup",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarGroup.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarGroup.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroupAction": {
name: "DemoSidebarGroupAction",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarGroupAction.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarGroupAction.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroupCollapsible": {
name: "DemoSidebarGroupCollapsible",
description: "",
type: "registry:block",
registryDependencies: ["collapsible","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarGroupCollapsible.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarGroupCollapsible.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarHeader": {
name: "DemoSidebarHeader",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarHeader.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarHeader.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenu": {
name: "DemoSidebarMenu",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenu.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenu.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuAction": {
name: "DemoSidebarMenuAction",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenuAction.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenuAction.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuBadge": {
name: "DemoSidebarMenuBadge",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenuBadge.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenuBadge.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuCollapsible": {
name: "DemoSidebarMenuCollapsible",
description: "",
type: "registry:block",
registryDependencies: ["collapsible","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenuCollapsible.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenuCollapsible.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuSub": {
name: "DemoSidebarMenuSub",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenuSub.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenuSub.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"Login01": {
name: "Login01",
description: "",
type: "registry:block",
registryDependencies: ["LoginForm.vue","button","card","input","label"],
files: [{
path: "registry/new-york/block/Login01/page.vue",
type: "registry:page",
target: "pages/dashboard/index.vue"
},{
path: "registry/new-york/block/Login01/components/LoginForm.vue",
type: "registry:component",
target: ""
}],
component: () => import("@/registry/new-york/block/Login01/page.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"Sidebar01": {
name: "Sidebar01",
description: "",
@ -10880,6 +11079,205 @@ export const Index: Record<string, any> = {
category: "",
subcategory: ""
},
"DemoSidebar": {
name: "DemoSidebar",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebar.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebar.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarControlled": {
name: "DemoSidebarControlled",
description: "",
type: "registry:block",
registryDependencies: ["button","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarControlled.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarControlled.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarFooter": {
name: "DemoSidebarFooter",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarFooter.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarFooter.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroup": {
name: "DemoSidebarGroup",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarGroup.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarGroup.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroupAction": {
name: "DemoSidebarGroupAction",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarGroupAction.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarGroupAction.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroupCollapsible": {
name: "DemoSidebarGroupCollapsible",
description: "",
type: "registry:block",
registryDependencies: ["collapsible","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarGroupCollapsible.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarGroupCollapsible.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarHeader": {
name: "DemoSidebarHeader",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarHeader.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarHeader.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenu": {
name: "DemoSidebarMenu",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenu.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenu.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuAction": {
name: "DemoSidebarMenuAction",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenuAction.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenuAction.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuBadge": {
name: "DemoSidebarMenuBadge",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenuBadge.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenuBadge.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuCollapsible": {
name: "DemoSidebarMenuCollapsible",
description: "",
type: "registry:block",
registryDependencies: ["collapsible","sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenuCollapsible.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenuCollapsible.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuSub": {
name: "DemoSidebarMenuSub",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/new-york/block/DemoSidebarMenuSub.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/new-york/block/DemoSidebarMenuSub.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"Login01": {
name: "Login01",
description: "",
type: "registry:block",
registryDependencies: ["LoginForm.vue","button","card","input","label"],
files: [{
path: "registry/new-york/block/Login01/page.vue",
type: "registry:page",
target: "pages/dashboard/index.vue"
},{
path: "registry/new-york/block/Login01/components/LoginForm.vue",
type: "registry:component",
target: ""
}],
component: () => import("@/registry/new-york/block/Login01/page.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"Sidebar01": {
name: "Sidebar01",
description: "",
@ -16541,6 +16939,205 @@ export const Index: Record<string, any> = {
category: "",
subcategory: ""
},
"DemoSidebar": {
name: "DemoSidebar",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebar.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebar.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarControlled": {
name: "DemoSidebarControlled",
description: "",
type: "registry:block",
registryDependencies: ["button","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarControlled.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarControlled.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarFooter": {
name: "DemoSidebarFooter",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarFooter.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarFooter.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroup": {
name: "DemoSidebarGroup",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarGroup.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarGroup.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroupAction": {
name: "DemoSidebarGroupAction",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarGroupAction.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarGroupAction.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroupCollapsible": {
name: "DemoSidebarGroupCollapsible",
description: "",
type: "registry:block",
registryDependencies: ["collapsible","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarGroupCollapsible.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarGroupCollapsible.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarHeader": {
name: "DemoSidebarHeader",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarHeader.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarHeader.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenu": {
name: "DemoSidebarMenu",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenu.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarMenu.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuAction": {
name: "DemoSidebarMenuAction",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenuAction.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarMenuAction.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuBadge": {
name: "DemoSidebarMenuBadge",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenuBadge.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarMenuBadge.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuCollapsible": {
name: "DemoSidebarMenuCollapsible",
description: "",
type: "registry:block",
registryDependencies: ["collapsible","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenuCollapsible.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarMenuCollapsible.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuSub": {
name: "DemoSidebarMenuSub",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenuSub.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarMenuSub.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"Login01": {
name: "Login01",
description: "",
type: "registry:block",
registryDependencies: ["LoginForm.vue","button","card","input","label"],
files: [{
path: "registry/default/block/Login01/page.vue",
type: "registry:page",
target: "pages/dashboard/index.vue"
},{
path: "registry/default/block/Login01/components/LoginForm.vue",
type: "registry:component",
target: ""
}],
component: () => import("@/registry/default/block/Login01/page.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"Sidebar01": {
name: "Sidebar01",
description: "",
@ -22186,6 +22783,205 @@ export const Index: Record<string, any> = {
category: "",
subcategory: ""
},
"DemoSidebar": {
name: "DemoSidebar",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebar.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebar.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarControlled": {
name: "DemoSidebarControlled",
description: "",
type: "registry:block",
registryDependencies: ["button","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarControlled.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarControlled.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarFooter": {
name: "DemoSidebarFooter",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarFooter.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarFooter.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroup": {
name: "DemoSidebarGroup",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarGroup.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarGroup.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroupAction": {
name: "DemoSidebarGroupAction",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarGroupAction.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarGroupAction.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarGroupCollapsible": {
name: "DemoSidebarGroupCollapsible",
description: "",
type: "registry:block",
registryDependencies: ["collapsible","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarGroupCollapsible.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarGroupCollapsible.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarHeader": {
name: "DemoSidebarHeader",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarHeader.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarHeader.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenu": {
name: "DemoSidebarMenu",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenu.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarMenu.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuAction": {
name: "DemoSidebarMenuAction",
description: "",
type: "registry:block",
registryDependencies: ["dropdown-menu","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenuAction.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarMenuAction.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuBadge": {
name: "DemoSidebarMenuBadge",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenuBadge.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarMenuBadge.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuCollapsible": {
name: "DemoSidebarMenuCollapsible",
description: "",
type: "registry:block",
registryDependencies: ["collapsible","sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenuCollapsible.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarMenuCollapsible.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"DemoSidebarMenuSub": {
name: "DemoSidebarMenuSub",
description: "",
type: "registry:block",
registryDependencies: ["sidebar"],
files: [{
path: "registry/default/block/DemoSidebarMenuSub.vue",
type: "registry:block",
target: "pages/dashboard/index.vue"
}],
component: () => import("@/registry/default/block/DemoSidebarMenuSub.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"Login01": {
name: "Login01",
description: "",
type: "registry:block",
registryDependencies: ["LoginForm.vue","button","card","input","label"],
files: [{
path: "registry/default/block/Login01/page.vue",
type: "registry:page",
target: "pages/dashboard/index.vue"
},{
path: "registry/default/block/Login01/components/LoginForm.vue",
type: "registry:component",
target: ""
}],
component: () => import("@/registry/default/block/Login01/page.vue").then((m) => m.default),
source: "",
category: "",
subcategory: ""
},
"Sidebar01": {
name: "Sidebar01",
description: "",

1054
apps/www/src/content/docs/components/sidebar.md
View File

File diff suppressed because it is too large Load Diff

16
apps/www/src/public/r/styles/default/DemoSidebar.json Normal file
View File

@ -0,0 +1,16 @@
{
"name": "DemoSidebar",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"sidebar"
],
"files": [
{
"path": "block/DemoSidebar.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarInset,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/default/ui/sidebar'\n\nimport { Calendar, Home, Inbox, Search, Settings } from 'lucide-vue-next'\n\n// Menu items.\nconst items = [\n {\n title: 'Home',\n url: '#',\n icon: Home,\n },\n {\n title: 'Inbox',\n url: '#',\n icon: Inbox,\n },\n {\n title: 'Calendar',\n url: '#',\n icon: Calendar,\n },\n {\n title: 'Search',\n url: '#',\n icon: Search,\n },\n {\n title: 'Settings',\n url: '#',\n icon: Settings,\n },\n]\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Application</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in items\" :key=\"item.title\">\n <SidebarMenuButton as-child>\n <a :href=\"item.url\">\n <component :is=\"item.icon\" />\n <span>{{ item.title }}</span>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n <SidebarInset>\n <header class=\"flex items-center justify-between px-4 h-12\">\n <SidebarTrigger />\n </header>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

17
apps/www/src/public/r/styles/default/DemoSidebarControlled.json Normal file
View File

@ -0,0 +1,17 @@
{
"name": "DemoSidebarControlled",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"button",
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarControlled.vue",
"content": "<script setup lang=\"ts\">\nimport { Button } from '@/registry/default/ui/button'\n\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarInset,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n} from '@/registry/default/ui/sidebar'\nimport {\n Frame,\n LifeBuoy,\n Map,\n PanelLeftClose,\n PanelLeftOpen,\n PieChart,\n Send,\n} from 'lucide-vue-next'\nimport { ref } from 'vue'\n\nconst projects = [\n {\n name: 'Design Engineering',\n url: '#',\n icon: Frame,\n },\n {\n name: 'Sales & Marketing',\n url: '#',\n icon: PieChart,\n },\n {\n name: 'Travel',\n url: '#',\n icon: Map,\n },\n {\n name: 'Support',\n url: '#',\n icon: LifeBuoy,\n },\n {\n name: 'Feedback',\n url: '#',\n icon: Send,\n },\n]\n\nconst open = ref(true)\n</script>\n\n<template>\n <SidebarProvider v-model:open=\"open\">\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Projects</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"project in projects\" :key=\"project.name\">\n <SidebarMenuButton as-child>\n <a :href=\"project.url\">\n <component :is=\"project.icon\" />\n <span>{{ project.name }}</span>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n <SidebarInset>\n <header className=\"flex items-center h-12 px-4 justify-between\">\n <Button\n size=\"sm\"\n variant=\"ghost\"\n @click=\"open = !open\"\n >\n <PanelLeftClose v-if=\"open\" />\n <PanelLeftOpen v-else />\n <span>{{ open ? 'Close' : 'Open' }} Sidebar</span>\n </Button>\n </header>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

17
apps/www/src/public/r/styles/default/DemoSidebarFooter.json Normal file
View File

@ -0,0 +1,17 @@
{
"name": "DemoSidebarFooter",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"dropdown-menu",
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarFooter.vue",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger,\n} from '@/registry/default/ui/dropdown-menu'\n\nimport {\n Sidebar,\n SidebarContent,\n SidebarFooter,\n SidebarHeader,\n SidebarInset,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/default/ui/sidebar'\nimport { ChevronDown, ChevronUp, User2 } from 'lucide-vue-next'\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarHeader />\n <SidebarContent />\n <SidebarFooter>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\">\n Username\n <ChevronUp class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n side=\"top\"\n class=\"w-[--reka-popper-anchor-width]\"\n >\n <DropdownMenuItem>\n <span>Account</span>\n </DropdownMenuItem>\n <DropdownMenuItem>\n <span>Billing</span>\n </DropdownMenuItem>\n <DropdownMenuItem>\n <span>Sign out</span>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarFooter>\n </Sidebar>\n <SidebarInset>\n <header class=\"flex items-center justify-between px-4 h-12\">\n <SidebarTrigger />\n </header>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

16
apps/www/src/public/r/styles/default/DemoSidebarGroup.json Normal file
View File

@ -0,0 +1,16 @@
{
"name": "DemoSidebarGroup",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarGroup.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n} from '@/registry/default/ui/sidebar'\n\nimport { LifeBuoy, Send } from 'lucide-vue-next'\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Help</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton>\n <LifeBuoy />\n Support\n </SidebarMenuButton>\n </SidebarMenuItem>\n <SidebarMenuItem>\n <SidebarMenuButton>\n <Send />\n Feedback\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

18
apps/www/src/public/r/styles/default/DemoSidebarGroupAction.json Normal file
View File

@ -0,0 +1,18 @@
{
"name": "DemoSidebarGroupAction",
"type": "registry:block",
"dependencies": [
"vue-sonner"
],
"registryDependencies": [
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarGroupAction.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupAction,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n} from '@/registry/default/ui/sidebar'\nimport {\n ChevronDown,\n Frame,\n LifeBuoy,\n Map,\n PieChart,\n Plus,\n Send,\n} from 'lucide-vue-next'\n\nimport { toast, Toaster } from 'vue-sonner'\n</script>\n\n<template>\n <SidebarProvider>\n <Toaster\n position=\"bottom-left\"\n :toast-options=\"{\n class: 'ml-[160px]',\n }\"\n />\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Projects</SidebarGroupLabel>\n <SidebarGroupAction\n title=\"Add Project\"\n @click=\"() => toast('You clicked the group action!')\"\n >\n <Plus /> <span class=\"sr-only\">Add Project</span>\n </SidebarGroupAction>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton as-child>\n <a href=\"#\">\n <Frame />\n <span>Design Engineering</span>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n <SidebarMenuItem>\n <SidebarMenuButton as-child>\n <a href=\"#\">\n <PieChart />\n <span>Sales & Marketing</span>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n <SidebarMenuItem>\n <SidebarMenuButton as-child>\n <a href=\"#\">\n <Map />\n <span>Travel</span>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

17
apps/www/src/public/r/styles/default/DemoSidebarGroupCollapsible.json Normal file
View File

@ -0,0 +1,17 @@
{
"name": "DemoSidebarGroupCollapsible",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"collapsible",
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarGroupCollapsible.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '@/registry/default/ui/collapsible'\n\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n} from '@/registry/default/ui/sidebar'\nimport { ChevronDown, LifeBuoy, Send } from 'lucide-vue-next'\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarContent>\n <Collapsible :default-open=\"true\" class=\"group/collapsible\">\n <SidebarGroup>\n <SidebarGroupLabel\n as-child\n class=\"text-sm hover:bg-sidebar-accent hover:text-sidebar-accent-foreground\"\n >\n <CollapsibleTrigger>\n Help\n <ChevronDown class=\"ml-auto transition-transform group-data-[state=open]/collapsible:rotate-180\" />\n </CollapsibleTrigger>\n </SidebarGroupLabel>\n <CollapsibleContent>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton>\n <LifeBuoy />\n Support\n </SidebarMenuButton>\n </SidebarMenuItem>\n <SidebarMenuItem>\n <SidebarMenuButton>\n <Send />\n Feedback\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </CollapsibleContent>\n </SidebarGroup>\n </Collapsible>\n </SidebarContent>\n </Sidebar>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

17
apps/www/src/public/r/styles/default/DemoSidebarHeader.json Normal file
View File

@ -0,0 +1,17 @@
{
"name": "DemoSidebarHeader",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"dropdown-menu",
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarHeader.vue",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\n\nimport {\n Sidebar,\n SidebarHeader,\n SidebarInset,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/new-york/ui/sidebar'\nimport { ChevronDown } from 'lucide-vue-next'\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarHeader>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\">\n Select Workspace\n <ChevronDown class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent class=\"w-[--reka-popper-anchor-width]\">\n <DropdownMenuItem>\n <span>Acme Inc</span>\n </DropdownMenuItem>\n <DropdownMenuItem>\n <span>Acme Corp.</span>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarHeader>\n </Sidebar>\n <SidebarInset>\n <header class=\"flex items-center justify-between px-4 h-12\">\n <SidebarTrigger />\n </header>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

16
apps/www/src/public/r/styles/default/DemoSidebarMenu.json Normal file
View File

@ -0,0 +1,16 @@
{
"name": "DemoSidebarMenu",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarMenu.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n} from '@/registry/default/ui/sidebar'\n\nimport { Frame, LifeBuoy, Map, PieChart, Send } from 'lucide-vue-next'\n\nconst projects = [\n {\n name: 'Design Engineering',\n url: '#',\n icon: Frame,\n },\n {\n name: 'Sales & Marketing',\n url: '#',\n icon: PieChart,\n },\n {\n name: 'Travel',\n url: '#',\n icon: Map,\n },\n {\n name: 'Support',\n url: '#',\n icon: LifeBuoy,\n },\n {\n name: 'Feedback',\n url: '#',\n icon: Send,\n },\n]\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Projects</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"project in projects\" :key=\"project.name\">\n <SidebarMenuButton as-child>\n <a :href=\"project.url\">\n <component :is=\"project.icon\" />\n <span>{{ project.name }}</span>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

17
apps/www/src/public/r/styles/default/DemoSidebarMenuAction.json Normal file
View File

@ -0,0 +1,17 @@
{
"name": "DemoSidebarMenuAction",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"dropdown-menu",
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarMenuAction.vue",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger,\n} from '@/registry/default/ui/dropdown-menu'\n\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuAction,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n} from '@/registry/default/ui/sidebar'\nimport {\n Frame,\n LifeBuoy,\n Map,\n MoreHorizontal,\n PieChart,\n Send,\n} from 'lucide-vue-next'\n\nconst projects = [\n {\n name: 'Design Engineering',\n url: '#',\n icon: Frame,\n },\n {\n name: 'Sales & Marketing',\n url: '#',\n icon: PieChart,\n },\n {\n name: 'Travel',\n url: '#',\n icon: Map,\n },\n {\n name: 'Support',\n url: '#',\n icon: LifeBuoy,\n },\n {\n name: 'Feedback',\n url: '#',\n icon: Send,\n },\n]\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Projects</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"project in projects\" :key=\"project.name\">\n <SidebarMenuButton\n as-child\n class=\"group-has-[[data-state=open]]/menu-item:bg-sidebar-accent\"\n >\n <a :href=\"project.url\">\n <component :is=\"project.icon\" />\n <span>{{ project.name }}</span>\n </a>\n </SidebarMenuButton>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuAction>\n <MoreHorizontal />\n <span class=\"sr-only\">More</span>\n </SidebarMenuAction>\n </DropdownMenuTrigger>\n <DropdownMenuContent side=\"right\" align=\"start\">\n <DropdownMenuItem>\n <span>Edit Project</span>\n </DropdownMenuItem>\n <DropdownMenuItem>\n <span>Delete Project</span>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

16
apps/www/src/public/r/styles/default/DemoSidebarMenuBadge.json Normal file
View File

@ -0,0 +1,16 @@
{
"name": "DemoSidebarMenuBadge",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarMenuBadge.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuBadge,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n} from '@/registry/default/ui/sidebar'\n\nimport { Frame, LifeBuoy, Map, PieChart, Send } from 'lucide-vue-next'\n\nconst projects = [\n {\n name: 'Design Engineering',\n url: '#',\n icon: Frame,\n badge: '24',\n },\n {\n name: 'Sales & Marketing',\n url: '#',\n icon: PieChart,\n badge: '12',\n },\n {\n name: 'Travel',\n url: '#',\n icon: Map,\n badge: '3',\n },\n {\n name: 'Support',\n url: '#',\n icon: LifeBuoy,\n badge: '21',\n },\n {\n name: 'Feedback',\n url: '#',\n icon: Send,\n badge: '8',\n },\n]\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Projects</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"project in projects\" :key=\"project.name\">\n <SidebarMenuButton\n as-child\n class=\"group-has-[[data-state=open]]/menu-item:bg-sidebar-accent\"\n >\n <a :href=\"project.url\">\n <component :is=\"project.icon\" />\n <span>{{ project.name }}</span>\n </a>\n </SidebarMenuButton>\n <SidebarMenuBadge>{{ project.badge }}</SidebarMenuBadge>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

17
apps/www/src/public/r/styles/default/DemoSidebarMenuCollapsible.json Normal file
View File

@ -0,0 +1,17 @@
{
"name": "DemoSidebarMenuCollapsible",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"collapsible",
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarMenuCollapsible.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '@/registry/default/ui/collapsible'\n\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n SidebarProvider,\n} from '@/registry/default/ui/sidebar'\nimport { ChevronRight } from 'lucide-vue-next'\n\nconst items = [\n {\n title: 'Getting Started',\n url: '#',\n items: [\n {\n title: 'Installation',\n url: '#',\n },\n {\n title: 'Project Structure',\n url: '#',\n },\n ],\n },\n {\n title: 'Building Your Application',\n url: '#',\n items: [\n {\n title: 'Routing',\n url: '#',\n },\n {\n title: 'Data Fetching',\n url: '#',\n isActive: true,\n },\n {\n title: 'Rendering',\n url: '#',\n },\n {\n title: 'Caching',\n url: '#',\n },\n {\n title: 'Styling',\n url: '#',\n },\n {\n title: 'Optimizing',\n url: '#',\n },\n {\n title: 'Configuring',\n url: '#',\n },\n {\n title: 'Testing',\n url: '#',\n },\n {\n title: 'Authentication',\n url: '#',\n },\n {\n title: 'Deploying',\n url: '#',\n },\n {\n title: 'Upgrading',\n url: '#',\n },\n {\n title: 'Examples',\n url: '#',\n },\n ],\n },\n {\n title: 'API Reference',\n url: '#',\n items: [\n {\n title: 'Components',\n url: '#',\n },\n {\n title: 'File Conventions',\n url: '#',\n },\n {\n title: 'Functions',\n url: '#',\n },\n {\n title: 'next.config.js Options',\n url: '#',\n },\n {\n title: 'CLI',\n url: '#',\n },\n {\n title: 'Edge Runtime',\n url: '#',\n },\n ],\n },\n {\n title: 'Architecture',\n url: '#',\n items: [\n {\n title: 'Accessibility',\n url: '#',\n },\n {\n title: 'Fast Refresh',\n url: '#',\n },\n {\n title: 'Next.js Compiler',\n url: '#',\n },\n {\n title: 'Supported Browsers',\n url: '#',\n },\n {\n title: 'Turbopack',\n url: '#',\n },\n ],\n },\n]\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupContent>\n <SidebarMenu>\n <Collapsible\n v-for=\"(item, index) in items\"\n :key=\"index\"\n class=\"group/collapsible\"\n :default-open=\"index === 0\"\n >\n <SidebarMenuItem>\n <CollapsibleTrigger as-child>\n <SidebarMenuButton>\n <span>{{ item.title }}</span>\n <ChevronRight class=\"transition-transform ml-auto group-data-[state=open]/collapsible:rotate-90\" />\n </SidebarMenuButton>\n </CollapsibleTrigger>\n <CollapsibleContent>\n <SidebarMenuSub>\n <SidebarMenuSubItem v-for=\"(subItem, subIndex) in item.items\" :key=\"subIndex\">\n <SidebarMenuSubButton as-child>\n <a :href=\"subItem.url\">\n <span>{{ subItem.title }}</span>\n </a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </CollapsibleContent>\n </SidebarMenuItem>\n </Collapsible>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

16
apps/www/src/public/r/styles/default/DemoSidebarMenuSub.json Normal file
View File

@ -0,0 +1,16 @@
{
"name": "DemoSidebarMenuSub",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarMenuSub.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n SidebarProvider,\n} from '@/registry/default/ui/sidebar'\n\nconst items = [\n {\n title: 'Getting Started',\n url: '#',\n items: [\n {\n title: 'Installation',\n url: '#',\n },\n {\n title: 'Project Structure',\n url: '#',\n },\n ],\n },\n {\n title: 'Building Your Application',\n url: '#',\n items: [\n {\n title: 'Routing',\n url: '#',\n },\n {\n title: 'Data Fetching',\n url: '#',\n isActive: true,\n },\n {\n title: 'Rendering',\n url: '#',\n },\n {\n title: 'Caching',\n url: '#',\n },\n {\n title: 'Styling',\n url: '#',\n },\n {\n title: 'Optimizing',\n url: '#',\n },\n {\n title: 'Configuring',\n url: '#',\n },\n {\n title: 'Testing',\n url: '#',\n },\n {\n title: 'Authentication',\n url: '#',\n },\n {\n title: 'Deploying',\n url: '#',\n },\n {\n title: 'Upgrading',\n url: '#',\n },\n {\n title: 'Examples',\n url: '#',\n },\n ],\n },\n {\n title: 'API Reference',\n url: '#',\n items: [\n {\n title: 'Components',\n url: '#',\n },\n {\n title: 'File Conventions',\n url: '#',\n },\n {\n title: 'Functions',\n url: '#',\n },\n {\n title: 'next.config.js Options',\n url: '#',\n },\n {\n title: 'CLI',\n url: '#',\n },\n {\n title: 'Edge Runtime',\n url: '#',\n },\n ],\n },\n {\n title: 'Architecture',\n url: '#',\n items: [\n {\n title: 'Accessibility',\n url: '#',\n },\n {\n title: 'Fast Refresh',\n url: '#',\n },\n {\n title: 'Next.js Compiler',\n url: '#',\n },\n {\n title: 'Supported Browsers',\n url: '#',\n },\n {\n title: 'Turbopack',\n url: '#',\n },\n ],\n },\n]\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"(item, index) in items\" :key=\"index\">\n <SidebarMenuButton as-child>\n <a :href=\"item.url\">\n <span>{{ item.title }}</span>\n </a>\n </SidebarMenuButton>\n <SidebarMenuSub>\n <SidebarMenuSubItem v-for=\"(subItem, subIndex) in item.items\" :key=\"subIndex\">\n <SidebarMenuSubButton as-child>\n <a :href=\"subItem.url\">\n <span>{{ subItem.title }}</span>\n </a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

26
apps/www/src/public/r/styles/default/Login01.json Normal file
View File

@ -0,0 +1,26 @@
{
"name": "Login01",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"LoginForm.vue",
"button",
"card",
"input",
"label"
],
"files": [
{
"path": "block/Login01/page.vue",
"content": "<script lang=\"ts\">\nexport const description\n = 'A simple login form with email and password. The submit button says \\'Sign in\\'.'\nexport const iframeHeight = '870px'\nexport const containerClass = 'w-full h-full'\n</script>\n\n<script setup lang=\"ts\">\nimport LoginForm from '@/registry/new-york/block/Login01/components/LoginForm.vue'\n</script>\n\n<template>\n <div className=\"flex h-screen w-full items-center justify-center px-4\">\n <LoginForm />\n </div>\n</template>\n",
"type": "registry:page",
"target": "pages/dashboard/index.vue"
},
{
"path": "block/Login01/components/LoginForm.vue",
"content": "<script setup lang=\"ts\">\nimport { Button } from '@/registry/new-york/ui/button'\nimport {\n Card,\n CardContent,\n CardDescription,\n CardHeader,\n CardTitle,\n} from '@/registry/new-york/ui/card'\nimport { Input } from '@/registry/new-york/ui/input'\nimport { Label } from '@/registry/new-york/ui/label'\n</script>\n\n<template>\n <Card class=\"mx-auto max-w-sm\">\n <CardHeader>\n <CardTitle class=\"text-2xl\">\n Login\n </CardTitle>\n <CardDescription>\n Enter your email below to login to your account\n </CardDescription>\n </CardHeader>\n <CardContent>\n <div class=\"grid gap-4\">\n <div class=\"grid gap-2\">\n <Label for=\"email\">Email</Label>\n <Input\n id=\"email\"\n type=\"email\"\n placeholder=\"m@example.com\"\n required\n />\n </div>\n <div class=\"grid gap-2\">\n <div class=\"flex items-center\">\n <Label for=\"password\">Password</Label>\n <a href=\"#\" class=\"ml-auto inline-block text-sm underline\">\n Forgot your password?\n </a>\n </div>\n <Input id=\"password\" type=\"password\" required />\n </div>\n <Button type=\"submit\" class=\"w-full\">\n Login\n </Button>\n <Button variant=\"outline\" class=\"w-full\">\n Login with Google\n </Button>\n </div>\n <div class=\"mt-4 text-center text-sm\">\n Don't have an account?\n <a href=\"#\" class=\"underline\">\n Sign up\n </a>\n </div>\n </CardContent>\n </Card>\n</template>\n",
"type": "registry:component",
"target": ""
}
]
}

8
apps/www/src/public/r/styles/default/Sidebar01.json
View File

@ -15,25 +15,25 @@
"files": [
{
"path": "block/Sidebar01/page.vue",
"content": "<script lang=\"ts\">\nexport const iframeHeight = '800px'\nexport const description\n = 'A simple sidebar with navigation grouped by section.'\n</script>\n\n<script setup lang=\"ts\">\nimport AppSidebar from '@/registry/new-york/block/Sidebar01/components/AppSidebar.vue'\nimport {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbList,\n BreadcrumbPage,\n BreadcrumbSeparator,\n} from '@/registry/new-york/ui/breadcrumb'\nimport { Separator } from '@/registry/new-york/ui/separator'\nimport {\n SidebarInset,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/new-york/ui/sidebar'\n</script>\n\n<template>\n <SidebarProvider>\n <AppSidebar />\n <SidebarInset>\n <header class=\"flex h-16 shrink-0 items-center gap-2 border-b px-4\">\n <SidebarTrigger class=\"-ml-1\" />\n <Separator orientation=\"vertical\" class=\"mr-2 h-4\" />\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem class=\"hidden md:block\">\n <BreadcrumbLink href=\"#\">\n Building Your Application\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator class=\"hidden md:block\" />\n <BreadcrumbItem>\n <BreadcrumbPage>Data Fetching</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n </header>\n <div class=\"flex flex-1 flex-col gap-4 p-4\">\n <div class=\"grid auto-rows-min gap-4 md:grid-cols-3\">\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n </div>\n <div class=\"min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min\" />\n </div>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"content": "<script lang=\"ts\">\nexport const iframeHeight = '800px'\nexport const description\n = 'A simple sidebar with navigation grouped by section.'\n</script>\n\n<script setup lang=\"ts\">\nimport AppSidebar from '@/registry/default/block/Sidebar01/components/AppSidebar.vue'\nimport {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbList,\n BreadcrumbPage,\n BreadcrumbSeparator,\n} from '@/registry/default/ui/breadcrumb'\nimport { Separator } from '@/registry/default/ui/separator'\nimport {\n SidebarInset,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/default/ui/sidebar'\n</script>\n\n<template>\n <SidebarProvider>\n <AppSidebar />\n <SidebarInset>\n <header class=\"flex h-16 shrink-0 items-center gap-2 border-b px-4\">\n <SidebarTrigger class=\"-ml-1\" />\n <Separator orientation=\"vertical\" class=\"mr-2 h-4\" />\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem class=\"hidden md:block\">\n <BreadcrumbLink href=\"#\">\n Building Your Application\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator class=\"hidden md:block\" />\n <BreadcrumbItem>\n <BreadcrumbPage>Data Fetching</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n </header>\n <div class=\"flex flex-1 flex-col gap-4 p-4\">\n <div class=\"grid auto-rows-min gap-4 md:grid-cols-3\">\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n </div>\n <div class=\"min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min\" />\n </div>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"type": "registry:page",
"target": "pages/dashboard/index.vue"
},
{
"path": "block/Sidebar01/components/AppSidebar.vue",
"content": "<script setup lang=\"ts\">\nimport SearchForm from '@/registry/new-york/block/Sidebar01/components/SearchForm.vue'\nimport VersionSwitcher from '@/registry/new-york/block/Sidebar01/components/VersionSwitcher.vue'\n\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarHeader,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n type SidebarProps,\n SidebarRail,\n} from '@/registry/new-york/ui/sidebar'\n\nconst props = defineProps<SidebarProps>()\n\n// This is sample data.\nconst data = {\n versions: ['1.0.1', '1.1.0-alpha', '2.0.0-beta1'],\n navMain: [\n {\n title: 'Getting Started',\n url: '#',\n items: [\n {\n title: 'Installation',\n url: '#',\n },\n {\n title: 'Project Structure',\n url: '#',\n },\n ],\n },\n {\n title: 'Building Your Application',\n url: '#',\n items: [\n {\n title: 'Routing',\n url: '#',\n },\n {\n title: 'Data Fetching',\n url: '#',\n isActive: true,\n },\n {\n title: 'Rendering',\n url: '#',\n },\n {\n title: 'Caching',\n url: '#',\n },\n {\n title: 'Styling',\n url: '#',\n },\n {\n title: 'Optimizing',\n url: '#',\n },\n {\n title: 'Configuring',\n url: '#',\n },\n {\n title: 'Testing',\n url: '#',\n },\n {\n title: 'Authentication',\n url: '#',\n },\n {\n title: 'Deploying',\n url: '#',\n },\n {\n title: 'Upgrading',\n url: '#',\n },\n {\n title: 'Examples',\n url: '#',\n },\n ],\n },\n {\n title: 'API Reference',\n url: '#',\n items: [\n {\n title: 'Components',\n url: '#',\n },\n {\n title: 'File Conventions',\n url: '#',\n },\n {\n title: 'Functions',\n url: '#',\n },\n {\n title: 'next.config.js Options',\n url: '#',\n },\n {\n title: 'CLI',\n url: '#',\n },\n {\n title: 'Edge Runtime',\n url: '#',\n },\n ],\n },\n {\n title: 'Architecture',\n url: '#',\n items: [\n {\n title: 'Accessibility',\n url: '#',\n },\n {\n title: 'Fast Refresh',\n url: '#',\n },\n {\n title: 'Next.js Compiler',\n url: '#',\n },\n {\n title: 'Supported Browsers',\n url: '#',\n },\n {\n title: 'Turbopack',\n url: '#',\n },\n ],\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarHeader>\n <VersionSwitcher\n :versions=\"data.versions\"\n :default-version=\"data.versions[0]\"\n />\n <SearchForm />\n </SidebarHeader>\n <SidebarContent>\n <SidebarGroup v-for=\"item in data.navMain\" :key=\"item.title\">\n <SidebarGroupLabel>{{ item.title }}</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"childItem in item.items\" :key=\"childItem.title\">\n <SidebarMenuButton as-child :is-active=\"childItem.isActive\">\n <a :href=\"childItem.url\">{{ childItem.title }}</a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n <SidebarRail />\n </Sidebar>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport SearchForm from '@/registry/default/block/Sidebar01/components/SearchForm.vue'\nimport VersionSwitcher from '@/registry/default/block/Sidebar01/components/VersionSwitcher.vue'\n\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarHeader,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n type SidebarProps,\n SidebarRail,\n} from '@/registry/default/ui/sidebar'\n\nconst props = defineProps<SidebarProps>()\n\n// This is sample data.\nconst data = {\n versions: ['1.0.1', '1.1.0-alpha', '2.0.0-beta1'],\n navMain: [\n {\n title: 'Getting Started',\n url: '#',\n items: [\n {\n title: 'Installation',\n url: '#',\n },\n {\n title: 'Project Structure',\n url: '#',\n },\n ],\n },\n {\n title: 'Building Your Application',\n url: '#',\n items: [\n {\n title: 'Routing',\n url: '#',\n },\n {\n title: 'Data Fetching',\n url: '#',\n isActive: true,\n },\n {\n title: 'Rendering',\n url: '#',\n },\n {\n title: 'Caching',\n url: '#',\n },\n {\n title: 'Styling',\n url: '#',\n },\n {\n title: 'Optimizing',\n url: '#',\n },\n {\n title: 'Configuring',\n url: '#',\n },\n {\n title: 'Testing',\n url: '#',\n },\n {\n title: 'Authentication',\n url: '#',\n },\n {\n title: 'Deploying',\n url: '#',\n },\n {\n title: 'Upgrading',\n url: '#',\n },\n {\n title: 'Examples',\n url: '#',\n },\n ],\n },\n {\n title: 'API Reference',\n url: '#',\n items: [\n {\n title: 'Components',\n url: '#',\n },\n {\n title: 'File Conventions',\n url: '#',\n },\n {\n title: 'Functions',\n url: '#',\n },\n {\n title: 'next.config.js Options',\n url: '#',\n },\n {\n title: 'CLI',\n url: '#',\n },\n {\n title: 'Edge Runtime',\n url: '#',\n },\n ],\n },\n {\n title: 'Architecture',\n url: '#',\n items: [\n {\n title: 'Accessibility',\n url: '#',\n },\n {\n title: 'Fast Refresh',\n url: '#',\n },\n {\n title: 'Next.js Compiler',\n url: '#',\n },\n {\n title: 'Supported Browsers',\n url: '#',\n },\n {\n title: 'Turbopack',\n url: '#',\n },\n ],\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarHeader>\n <VersionSwitcher\n :versions=\"data.versions\"\n :default-version=\"data.versions[0]\"\n />\n <SearchForm />\n </SidebarHeader>\n <SidebarContent>\n <SidebarGroup v-for=\"item in data.navMain\" :key=\"item.title\">\n <SidebarGroupLabel>{{ item.title }}</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"childItem in item.items\" :key=\"childItem.title\">\n <SidebarMenuButton as-child :is-active=\"childItem.isActive\">\n <a :href=\"childItem.url\">{{ childItem.title }}</a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n <SidebarRail />\n </Sidebar>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar01/components/SearchForm.vue",
"content": "<script setup lang=\"ts\">\nimport { Label } from '@/registry/new-york/ui/label'\nimport {\n SidebarGroup,\n SidebarGroupContent,\n SidebarInput,\n} from '@/registry/new-york/ui/sidebar'\nimport { Search } from 'lucide-vue-next'\n</script>\n\n<template>\n <form>\n <SidebarGroup class=\"py-0\">\n <SidebarGroupContent class=\"relative\">\n <Label for=\"search\" class=\"sr-only\">\n Search\n </Label>\n <SidebarInput\n id=\"search\"\n placeholder=\"Search the docs...\"\n class=\"pl-8\"\n />\n <Search class=\"pointer-events-none absolute left-2 top-1/2 size-4 -translate-y-1/2 select-none opacity-50\" />\n </SidebarGroupContent>\n </SidebarGroup>\n </form>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport { Label } from '@/registry/default/ui/label'\nimport {\n SidebarGroup,\n SidebarGroupContent,\n SidebarInput,\n} from '@/registry/default/ui/sidebar'\nimport { Search } from 'lucide-vue-next'\n</script>\n\n<template>\n <form>\n <SidebarGroup class=\"py-0\">\n <SidebarGroupContent class=\"relative\">\n <Label for=\"search\" class=\"sr-only\">\n Search\n </Label>\n <SidebarInput\n id=\"search\"\n placeholder=\"Search the docs...\"\n class=\"pl-8\"\n />\n <Search class=\"pointer-events-none absolute left-2 top-1/2 size-4 -translate-y-1/2 select-none opacity-50\" />\n </SidebarGroupContent>\n </SidebarGroup>\n </form>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar01/components/VersionSwitcher.vue",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\n\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n} from '@/registry/new-york/ui/sidebar'\nimport { Check, ChevronsUpDown, GalleryVerticalEnd } from 'lucide-vue-next'\n\nimport { ref } from 'vue'\n\nconst props = defineProps<{\n versions: string[]\n defaultVersion: string\n}>()\n\nconst selectedVersion = ref(props.defaultVersion)\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <GalleryVerticalEnd class=\"size-4\" />\n </div>\n <div class=\"flex flex-col gap-0.5 leading-none\">\n <span class=\"font-semibold\">Documentation</span>\n <span class=\"\">v{{ selectedVersion }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--radix-dropdown-menu-trigger-width]\"\n align=\"start\"\n >\n <DropdownMenuItem\n v-for=\"version in versions\"\n :key=\"version\"\n @select=\"selectedVersion = version\"\n >\n v{{ version }}\n <Check v-if=\"version === selectedVersion\" class=\"ml-auto\" />\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger,\n} from '@/registry/default/ui/dropdown-menu'\n\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n} from '@/registry/default/ui/sidebar'\nimport { Check, ChevronsUpDown, GalleryVerticalEnd } from 'lucide-vue-next'\n\nimport { ref } from 'vue'\n\nconst props = defineProps<{\n versions: string[]\n defaultVersion: string\n}>()\n\nconst selectedVersion = ref(props.defaultVersion)\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <GalleryVerticalEnd class=\"size-4\" />\n </div>\n <div class=\"flex flex-col gap-0.5 leading-none\">\n <span class=\"font-semibold\">Documentation</span>\n <span class=\"\">v{{ selectedVersion }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--reka-dropdown-menu-trigger-width]\"\n align=\"start\"\n >\n <DropdownMenuItem\n v-for=\"version in versions\"\n :key=\"version\"\n @select=\"selectedVersion = version\"\n >\n v{{ version }}\n <Check v-if=\"version === selectedVersion\" class=\"ml-auto\" />\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"type": "registry:component",
"target": ""
}

2
apps/www/src/public/r/styles/default/Sidebar02.json
View File

@ -34,7 +34,7 @@
},
{
"path": "block/Sidebar02/components/VersionSwitcher.vue",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger,\n} from '@/registry/default/ui/dropdown-menu'\n\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n} from '@/registry/default/ui/sidebar'\nimport { Check, ChevronsUpDown, GalleryVerticalEnd } from 'lucide-vue-next'\nimport { ref } from 'vue'\n\nconst props = defineProps<{\n versions: string[]\n defaultVersion: string\n}>()\n\nconst selectedVersion = ref(props.defaultVersion)\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <GalleryVerticalEnd class=\"size-4\" />\n </div>\n <div class=\"flex flex-col gap-0.5 leading-none\">\n <span class=\"font-semibold\">Documentation</span>\n <span class=\"\">v{{ selectedVersion }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--radix-dropdown-menu-trigger-width]\"\n align=\"start\"\n >\n <DropdownMenuItem\n v-for=\"version in versions\"\n :key=\"version\"\n @select=\"selectedVersion = version\"\n >\n v{{ version }}\n <Check v-if=\"selectedVersion === version\" class=\"ml-auto\" />\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger,\n} from '@/registry/default/ui/dropdown-menu'\n\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n} from '@/registry/default/ui/sidebar'\nimport { Check, ChevronsUpDown, GalleryVerticalEnd } from 'lucide-vue-next'\nimport { ref } from 'vue'\n\nconst props = defineProps<{\n versions: string[]\n defaultVersion: string\n}>()\n\nconst selectedVersion = ref(props.defaultVersion)\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <GalleryVerticalEnd class=\"size-4\" />\n </div>\n <div class=\"flex flex-col gap-0.5 leading-none\">\n <span class=\"font-semibold\">Documentation</span>\n <span class=\"\">v{{ selectedVersion }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--reka-dropdown-menu-trigger-width]\"\n align=\"start\"\n >\n <DropdownMenuItem\n v-for=\"version in versions\"\n :key=\"version\"\n @select=\"selectedVersion = version\"\n >\n v{{ version }}\n <Check v-if=\"selectedVersion === version\" class=\"ml-auto\" />\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"type": "registry:component",
"target": ""
}

2
apps/www/src/public/r/styles/default/Sidebar03.json
View File

@ -17,7 +17,7 @@
},
{
"path": "block/Sidebar03/components/AppSidebar.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarHeader,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n type SidebarProps,\n SidebarRail,\n} from '@/registry/new-york/ui/sidebar'\n\nimport { GalleryVerticalEnd } from 'lucide-vue-next'\n\nconst props = defineProps<SidebarProps>()\n\n// This is sample data.\nconst data = {\n navMain: [\n {\n title: 'Getting Started',\n url: '#',\n items: [\n {\n title: 'Installation',\n url: '#',\n },\n {\n title: 'Project Structure',\n url: '#',\n },\n ],\n },\n {\n title: 'Building Your Application',\n url: '#',\n items: [\n {\n title: 'Routing',\n url: '#',\n },\n {\n title: 'Data Fetching',\n url: '#',\n isActive: true,\n },\n {\n title: 'Rendering',\n url: '#',\n },\n {\n title: 'Caching',\n url: '#',\n },\n {\n title: 'Styling',\n url: '#',\n },\n {\n title: 'Optimizing',\n url: '#',\n },\n {\n title: 'Configuring',\n url: '#',\n },\n {\n title: 'Testing',\n url: '#',\n },\n {\n title: 'Authentication',\n url: '#',\n },\n {\n title: 'Deploying',\n url: '#',\n },\n {\n title: 'Upgrading',\n url: '#',\n },\n {\n title: 'Examples',\n url: '#',\n },\n ],\n },\n {\n title: 'API Reference',\n url: '#',\n items: [\n {\n title: 'Components',\n url: '#',\n },\n {\n title: 'File Conventions',\n url: '#',\n },\n {\n title: 'Functions',\n url: '#',\n },\n {\n title: 'next.config.js Options',\n url: '#',\n },\n {\n title: 'CLI',\n url: '#',\n },\n {\n title: 'Edge Runtime',\n url: '#',\n },\n ],\n },\n {\n title: 'Architecture',\n url: '#',\n items: [\n {\n title: 'Accessibility',\n url: '#',\n },\n {\n title: 'Fast Refresh',\n url: '#',\n },\n {\n title: 'Next.js Compiler',\n url: '#',\n },\n {\n title: 'Supported Browsers',\n url: '#',\n },\n {\n title: 'Turbopack',\n url: '#',\n },\n ],\n },\n {\n title: 'Community',\n url: '#',\n items: [\n {\n title: 'Contribution Guide',\n url: '#',\n },\n ],\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarHeader>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton size=\"lg\" as-child>\n <a href=\"#\">\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <GalleryVerticalEnd class=\"size-4\" />\n </div>\n <div class=\"flex flex-col gap-0.5 leading-none\">\n <span class=\"font-semibold\">Documentation</span>\n <span class=\"\">v1.0.0</span>\n </div>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarHeader>\n <SidebarContent>\n <SidebarGroup>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in data.navMain\" :key=\"item.title\">\n <SidebarMenuButton as-child>\n <a :href=\"item.url\" class=\"font-medium\">\n {{ item.title }}\n </a>\n </SidebarMenuButton>\n <SidebarMenuSub v-if=\"item.items.length\">\n <SidebarMenuSubItem v-for=\"childItem in item.items\" :key=\"childItem.title\">\n <SidebarMenuSubButton as-child :is-active=\"childItem.isActive\">\n <a :href=\"childItem.url\">{{ childItem.title }}</a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroup>\n </SidebarContent>\n <SidebarRail />\n </Sidebar>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarHeader,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n type SidebarProps,\n SidebarRail,\n} from '@/registry/default/ui/sidebar'\n\nimport { GalleryVerticalEnd } from 'lucide-vue-next'\n\nconst props = defineProps<SidebarProps>()\n\n// This is sample data.\nconst data = {\n navMain: [\n {\n title: 'Getting Started',\n url: '#',\n items: [\n {\n title: 'Installation',\n url: '#',\n },\n {\n title: 'Project Structure',\n url: '#',\n },\n ],\n },\n {\n title: 'Building Your Application',\n url: '#',\n items: [\n {\n title: 'Routing',\n url: '#',\n },\n {\n title: 'Data Fetching',\n url: '#',\n isActive: true,\n },\n {\n title: 'Rendering',\n url: '#',\n },\n {\n title: 'Caching',\n url: '#',\n },\n {\n title: 'Styling',\n url: '#',\n },\n {\n title: 'Optimizing',\n url: '#',\n },\n {\n title: 'Configuring',\n url: '#',\n },\n {\n title: 'Testing',\n url: '#',\n },\n {\n title: 'Authentication',\n url: '#',\n },\n {\n title: 'Deploying',\n url: '#',\n },\n {\n title: 'Upgrading',\n url: '#',\n },\n {\n title: 'Examples',\n url: '#',\n },\n ],\n },\n {\n title: 'API Reference',\n url: '#',\n items: [\n {\n title: 'Components',\n url: '#',\n },\n {\n title: 'File Conventions',\n url: '#',\n },\n {\n title: 'Functions',\n url: '#',\n },\n {\n title: 'next.config.js Options',\n url: '#',\n },\n {\n title: 'CLI',\n url: '#',\n },\n {\n title: 'Edge Runtime',\n url: '#',\n },\n ],\n },\n {\n title: 'Architecture',\n url: '#',\n items: [\n {\n title: 'Accessibility',\n url: '#',\n },\n {\n title: 'Fast Refresh',\n url: '#',\n },\n {\n title: 'Next.js Compiler',\n url: '#',\n },\n {\n title: 'Supported Browsers',\n url: '#',\n },\n {\n title: 'Turbopack',\n url: '#',\n },\n ],\n },\n {\n title: 'Community',\n url: '#',\n items: [\n {\n title: 'Contribution Guide',\n url: '#',\n },\n ],\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarHeader>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton size=\"lg\" as-child>\n <a href=\"#\">\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <GalleryVerticalEnd class=\"size-4\" />\n </div>\n <div class=\"flex flex-col gap-0.5 leading-none\">\n <span class=\"font-semibold\">Documentation</span>\n <span class=\"\">v1.0.0</span>\n </div>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarHeader>\n <SidebarContent>\n <SidebarGroup>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in data.navMain\" :key=\"item.title\">\n <SidebarMenuButton as-child>\n <a :href=\"item.url\" class=\"font-medium\">\n {{ item.title }}\n </a>\n </SidebarMenuButton>\n <SidebarMenuSub v-if=\"item.items.length\">\n <SidebarMenuSubItem v-for=\"childItem in item.items\" :key=\"childItem.title\">\n <SidebarMenuSubButton as-child :is-active=\"childItem.isActive\">\n <a :href=\"childItem.url\">{{ childItem.title }}</a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroup>\n </SidebarContent>\n <SidebarRail />\n </Sidebar>\n</template>\n",
"type": "registry:component",
"target": ""
}

8
apps/www/src/public/r/styles/default/Sidebar06.json
View File

@ -18,25 +18,25 @@
"files": [
{
"path": "block/Sidebar06/page.vue",
"content": "<script lang=\"ts\">\nexport const iframeHeight = '800px'\nexport const description = 'A sidebar with submenus as dropdowns.'\n</script>\n\n<script setup lang=\"ts\">\nimport AppSidebar from '@/registry/new-york/block/Sidebar06/components/AppSidebar.vue'\nimport {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbList,\n BreadcrumbPage,\n BreadcrumbSeparator,\n} from '@/registry/new-york/ui/breadcrumb'\nimport { Separator } from '@/registry/new-york/ui/separator'\nimport {\n SidebarInset,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/new-york/ui/sidebar'\n</script>\n\n<template>\n <SidebarProvider>\n <AppSidebar />\n <SidebarInset>\n <header class=\"flex h-16 shrink-0 items-center gap-2 border-b px-4\">\n <SidebarTrigger class=\"-ml-1\" />\n <Separator orientation=\"vertical\" class=\"mr-2 h-4\" />\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem class=\"hidden md:block\">\n <BreadcrumbLink href=\"#\">\n Building Your Application\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator class=\"hidden md:block\" />\n <BreadcrumbItem>\n <BreadcrumbPage>Data Fetching</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n </header>\n <div class=\"flex flex-1 flex-col gap-4 p-4\">\n <div class=\"grid auto-rows-min gap-4 md:grid-cols-3\">\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n </div>\n <div class=\"min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min\" />\n </div>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"content": "<script lang=\"ts\">\nexport const iframeHeight = '800px'\nexport const description = 'A sidebar with submenus as dropdowns.'\n</script>\n\n<script setup lang=\"ts\">\nimport AppSidebar from '@/registry/default/block/Sidebar06/components/AppSidebar.vue'\nimport {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbList,\n BreadcrumbPage,\n BreadcrumbSeparator,\n} from '@/registry/default/ui/breadcrumb'\nimport { Separator } from '@/registry/default/ui/separator'\nimport {\n SidebarInset,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/default/ui/sidebar'\n</script>\n\n<template>\n <SidebarProvider>\n <AppSidebar />\n <SidebarInset>\n <header class=\"flex h-16 shrink-0 items-center gap-2 border-b px-4\">\n <SidebarTrigger class=\"-ml-1\" />\n <Separator orientation=\"vertical\" class=\"mr-2 h-4\" />\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem class=\"hidden md:block\">\n <BreadcrumbLink href=\"#\">\n Building Your Application\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator class=\"hidden md:block\" />\n <BreadcrumbItem>\n <BreadcrumbPage>Data Fetching</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n </header>\n <div class=\"flex flex-1 flex-col gap-4 p-4\">\n <div class=\"grid auto-rows-min gap-4 md:grid-cols-3\">\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n </div>\n <div class=\"min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min\" />\n </div>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"type": "registry:page",
"target": "pages/dashboard/index.vue"
},
{
"path": "block/Sidebar06/components/AppSidebar.vue",
"content": "<script setup lang=\"ts\">\nimport NavMain from '@/registry/new-york/block/Sidebar06/components/NavMain.vue'\nimport SidebarOptInForm from '@/registry/new-york/block/Sidebar06/components/SidebarOptInForm.vue'\n\nimport {\n Sidebar,\n SidebarContent,\n SidebarFooter,\n SidebarHeader,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n type SidebarProps,\n SidebarRail,\n} from '@/registry/new-york/ui/sidebar'\nimport { GalleryVerticalEnd } from 'lucide-vue-next'\n\nconst props = defineProps<SidebarProps>()\n\n// This is sample data.\nconst data = {\n navMain: [\n {\n title: 'Getting Started',\n url: '#',\n items: [\n {\n title: 'Installation',\n url: '#',\n },\n {\n title: 'Project Structure',\n url: '#',\n },\n ],\n },\n {\n title: 'Building Your Application',\n url: '#',\n items: [\n {\n title: 'Routing',\n url: '#',\n },\n {\n title: 'Data Fetching',\n url: '#',\n isActive: true,\n },\n {\n title: 'Rendering',\n url: '#',\n },\n {\n title: 'Caching',\n url: '#',\n },\n {\n title: 'Styling',\n url: '#',\n },\n {\n title: 'Optimizing',\n url: '#',\n },\n {\n title: 'Configuring',\n url: '#',\n },\n {\n title: 'Testing',\n url: '#',\n },\n {\n title: 'Authentication',\n url: '#',\n },\n {\n title: 'Deploying',\n url: '#',\n },\n {\n title: 'Upgrading',\n url: '#',\n },\n {\n title: 'Examples',\n url: '#',\n },\n ],\n },\n {\n title: 'API Reference',\n url: '#',\n items: [\n {\n title: 'Components',\n url: '#',\n },\n {\n title: 'File Conventions',\n url: '#',\n },\n {\n title: 'Functions',\n url: '#',\n },\n {\n title: 'next.config.js Options',\n url: '#',\n },\n {\n title: 'CLI',\n url: '#',\n },\n {\n title: 'Edge Runtime',\n url: '#',\n },\n ],\n },\n {\n title: 'Architecture',\n url: '#',\n items: [\n {\n title: 'Accessibility',\n url: '#',\n },\n {\n title: 'Fast Refresh',\n url: '#',\n },\n {\n title: 'Next.js Compiler',\n url: '#',\n },\n {\n title: 'Supported Browsers',\n url: '#',\n },\n {\n title: 'Turbopack',\n url: '#',\n },\n ],\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarHeader>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton size=\"lg\" as-child>\n <a href=\"#\">\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <GalleryVerticalEnd class=\"size-4\" />\n </div>\n <div class=\"flex flex-col gap-0.5 leading-none\">\n <span class=\"font-semibold\">Documentation</span>\n <span class=\"\">v1.0.0</span>\n </div>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarHeader>\n <SidebarContent>\n <NavMain :items=\"data.navMain\" />\n </SidebarContent>\n <SidebarFooter>\n <div class=\"p-1\">\n <SidebarOptInForm />\n </div>\n </SidebarFooter>\n <SidebarRail />\n </Sidebar>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport NavMain from '@/registry/default/block/Sidebar06/components/NavMain.vue'\nimport SidebarOptInForm from '@/registry/default/block/Sidebar06/components/SidebarOptInForm.vue'\n\nimport {\n Sidebar,\n SidebarContent,\n SidebarFooter,\n SidebarHeader,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n type SidebarProps,\n SidebarRail,\n} from '@/registry/default/ui/sidebar'\nimport { GalleryVerticalEnd } from 'lucide-vue-next'\n\nconst props = defineProps<SidebarProps>()\n\n// This is sample data.\nconst data = {\n navMain: [\n {\n title: 'Getting Started',\n url: '#',\n items: [\n {\n title: 'Installation',\n url: '#',\n },\n {\n title: 'Project Structure',\n url: '#',\n },\n ],\n },\n {\n title: 'Building Your Application',\n url: '#',\n items: [\n {\n title: 'Routing',\n url: '#',\n },\n {\n title: 'Data Fetching',\n url: '#',\n isActive: true,\n },\n {\n title: 'Rendering',\n url: '#',\n },\n {\n title: 'Caching',\n url: '#',\n },\n {\n title: 'Styling',\n url: '#',\n },\n {\n title: 'Optimizing',\n url: '#',\n },\n {\n title: 'Configuring',\n url: '#',\n },\n {\n title: 'Testing',\n url: '#',\n },\n {\n title: 'Authentication',\n url: '#',\n },\n {\n title: 'Deploying',\n url: '#',\n },\n {\n title: 'Upgrading',\n url: '#',\n },\n {\n title: 'Examples',\n url: '#',\n },\n ],\n },\n {\n title: 'API Reference',\n url: '#',\n items: [\n {\n title: 'Components',\n url: '#',\n },\n {\n title: 'File Conventions',\n url: '#',\n },\n {\n title: 'Functions',\n url: '#',\n },\n {\n title: 'next.config.js Options',\n url: '#',\n },\n {\n title: 'CLI',\n url: '#',\n },\n {\n title: 'Edge Runtime',\n url: '#',\n },\n ],\n },\n {\n title: 'Architecture',\n url: '#',\n items: [\n {\n title: 'Accessibility',\n url: '#',\n },\n {\n title: 'Fast Refresh',\n url: '#',\n },\n {\n title: 'Next.js Compiler',\n url: '#',\n },\n {\n title: 'Supported Browsers',\n url: '#',\n },\n {\n title: 'Turbopack',\n url: '#',\n },\n ],\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarHeader>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton size=\"lg\" as-child>\n <a href=\"#\">\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <GalleryVerticalEnd class=\"size-4\" />\n </div>\n <div class=\"flex flex-col gap-0.5 leading-none\">\n <span class=\"font-semibold\">Documentation</span>\n <span class=\"\">v1.0.0</span>\n </div>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarHeader>\n <SidebarContent>\n <NavMain :items=\"data.navMain\" />\n </SidebarContent>\n <SidebarFooter>\n <div class=\"p-1\">\n <SidebarOptInForm />\n </div>\n </SidebarFooter>\n <SidebarRail />\n </Sidebar>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar06/components/NavMain.vue",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\n\nimport {\n SidebarGroup,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n} from '@/registry/new-york/ui/sidebar'\nimport { useMediaQuery } from '@vueuse/core'\nimport { type LucideIcon, MoreHorizontal } from 'lucide-vue-next'\n\ndefineProps<{\n items: {\n title: string\n url: string\n icon?: LucideIcon\n isActive?: boolean\n items?: {\n title: string\n url: string\n }[]\n }[]\n}>()\n\nconst isMobile = useMediaQuery('(max-width: 768px)')\n</script>\n\n<template>\n <SidebarGroup>\n <SidebarMenu>\n <DropdownMenu v-for=\"item in items\" :key=\"item.title\">\n <SidebarMenuItem>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\">\n {{ item.title }} <MoreHorizontal class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n v-if=\"item.items?.length\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n :align=\"isMobile ? 'end' : 'start'\"\n class=\"min-w-56 rounded-lg\"\n >\n <DropdownMenuItem v-for=\"childItem in item.items\" :key=\"childItem.title\" as-child>\n <a :href=\"childItem.url\">{{ childItem.title }}</a>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </SidebarMenuItem>\n </DropdownMenu>\n </SidebarMenu>\n </SidebarGroup>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger,\n} from '@/registry/default/ui/dropdown-menu'\n\nimport {\n SidebarGroup,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n} from '@/registry/default/ui/sidebar'\nimport { useMediaQuery } from '@vueuse/core'\nimport { type LucideIcon, MoreHorizontal } from 'lucide-vue-next'\n\ndefineProps<{\n items: {\n title: string\n url: string\n icon?: LucideIcon\n isActive?: boolean\n items?: {\n title: string\n url: string\n }[]\n }[]\n}>()\n\nconst isMobile = useMediaQuery('(max-width: 768px)')\n</script>\n\n<template>\n <SidebarGroup>\n <SidebarMenu>\n <DropdownMenu v-for=\"item in items\" :key=\"item.title\">\n <SidebarMenuItem>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\">\n {{ item.title }} <MoreHorizontal class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n v-if=\"item.items?.length\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n :align=\"isMobile ? 'end' : 'start'\"\n class=\"min-w-56 rounded-lg\"\n >\n <DropdownMenuItem v-for=\"childItem in item.items\" :key=\"childItem.title\" as-child>\n <a :href=\"childItem.url\">{{ childItem.title }}</a>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </SidebarMenuItem>\n </DropdownMenu>\n </SidebarMenu>\n </SidebarGroup>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar06/components/SidebarOptInForm.vue",
"content": "<script setup lang=\"ts\">\nimport { Button } from '@/registry/new-york/ui/button'\nimport {\n Card,\n CardContent,\n CardDescription,\n CardHeader,\n CardTitle,\n} from '@/registry/new-york/ui/card'\nimport { SidebarInput } from '@/registry/new-york/ui/sidebar'\n</script>\n\n<template>\n <Card class=\"shadow-none\">\n <form>\n <CardHeader class=\"p-4 pb-0\">\n <CardTitle class=\"text-sm\">\n Subscribe to our newsletter\n </CardTitle>\n <CardDescription>\n Opt-in to receive updates and news about the sidebar.\n </CardDescription>\n </CardHeader>\n <CardContent class=\"grid gap-2.5 p-4\">\n <SidebarInput type=\"email\" placeholder=\"Email\" />\n <Button\n class=\"w-full bg-sidebar-primary text-sidebar-primary-foreground shadow-none\"\n size=\"sm\"\n >\n Subscribe\n </Button>\n </CardContent>\n </form>\n </Card>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport { Button } from '@/registry/default/ui/button'\nimport {\n Card,\n CardContent,\n CardDescription,\n CardHeader,\n CardTitle,\n} from '@/registry/default/ui/card'\nimport { SidebarInput } from '@/registry/default/ui/sidebar'\n</script>\n\n<template>\n <Card class=\"shadow-none\">\n <form>\n <CardHeader class=\"p-4 pb-0\">\n <CardTitle class=\"text-sm\">\n Subscribe to our newsletter\n </CardTitle>\n <CardDescription>\n Opt-in to receive updates and news about the sidebar.\n </CardDescription>\n </CardHeader>\n <CardContent class=\"grid gap-2.5 p-4\">\n <SidebarInput type=\"email\" placeholder=\"Email\" />\n <Button\n class=\"w-full bg-sidebar-primary text-sidebar-primary-foreground shadow-none\"\n size=\"sm\"\n >\n Subscribe\n </Button>\n </CardContent>\n </form>\n </Card>\n</template>\n",
"type": "registry:component",
"target": ""
}

12
apps/www/src/public/r/styles/default/Sidebar07.json
View File

@ -18,37 +18,37 @@
"files": [
{
"path": "block/Sidebar07/page.vue",
"content": "<script lang=\"ts\">\nexport const description\n = 'A sidebar that collapses to icons.'\nexport const iframeHeight = '800px'\nexport const containerClass = 'w-full h-full'\n</script>\n\n<script setup lang=\"ts\">\nimport AppSidebar from '@/registry/new-york/block/Sidebar07/components/AppSidebar.vue'\nimport {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbList,\n BreadcrumbPage,\n BreadcrumbSeparator,\n} from '@/registry/new-york/ui/breadcrumb'\nimport { Separator } from '@/registry/new-york/ui/separator'\nimport {\n SidebarInset,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/new-york/ui/sidebar'\n</script>\n\n<template>\n <SidebarProvider>\n <AppSidebar />\n <SidebarInset>\n <header class=\"flex h-16 shrink-0 items-center gap-2 transition-[width,height] ease-linear group-has-[[data-collapsible=icon]]/sidebar-wrapper:h-12\">\n <div class=\"flex items-center gap-2 px-4\">\n <SidebarTrigger class=\"-ml-1\" />\n <Separator orientation=\"vertical\" class=\"mr-2 h-4\" />\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem class=\"hidden md:block\">\n <BreadcrumbLink href=\"#\">\n Building Your Application\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator class=\"hidden md:block\" />\n <BreadcrumbItem>\n <BreadcrumbPage>Data Fetching</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n </div>\n </header>\n <div class=\"flex flex-1 flex-col gap-4 p-4 pt-0\">\n <div class=\"grid auto-rows-min gap-4 md:grid-cols-3\">\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n </div>\n <div class=\"min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min\" />\n </div>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"content": "<script lang=\"ts\">\nexport const description\n = 'A sidebar that collapses to icons.'\nexport const iframeHeight = '800px'\nexport const containerClass = 'w-full h-full'\n</script>\n\n<script setup lang=\"ts\">\nimport AppSidebar from '@/registry/default/block/Sidebar07/components/AppSidebar.vue'\nimport {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbList,\n BreadcrumbPage,\n BreadcrumbSeparator,\n} from '@/registry/default/ui/breadcrumb'\nimport { Separator } from '@/registry/default/ui/separator'\nimport {\n SidebarInset,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/default/ui/sidebar'\n</script>\n\n<template>\n <SidebarProvider>\n <AppSidebar />\n <SidebarInset>\n <header class=\"flex h-16 shrink-0 items-center gap-2 transition-[width,height] ease-linear group-has-[[data-collapsible=icon]]/sidebar-wrapper:h-12\">\n <div class=\"flex items-center gap-2 px-4\">\n <SidebarTrigger class=\"-ml-1\" />\n <Separator orientation=\"vertical\" class=\"mr-2 h-4\" />\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem class=\"hidden md:block\">\n <BreadcrumbLink href=\"#\">\n Building Your Application\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator class=\"hidden md:block\" />\n <BreadcrumbItem>\n <BreadcrumbPage>Data Fetching</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n </div>\n </header>\n <div class=\"flex flex-1 flex-col gap-4 p-4 pt-0\">\n <div class=\"grid auto-rows-min gap-4 md:grid-cols-3\">\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n </div>\n <div class=\"min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min\" />\n </div>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"type": "registry:page",
"target": "pages/dashboard/index.vue"
},
{
"path": "block/Sidebar07/components/AppSidebar.vue",
"content": "<script setup lang=\"ts\">\nimport type { SidebarProps } from '@/registry/new-york/ui/sidebar'\n\nimport NavMain from '@/registry/new-york/block/Sidebar07/components/NavMain.vue'\nimport NavProjects from '@/registry/new-york/block/Sidebar07/components/NavProjects.vue'\nimport NavUser from '@/registry/new-york/block/Sidebar07/components/NavUser.vue'\nimport TeamSwitcher from '@/registry/new-york/block/Sidebar07/components/TeamSwitcher.vue'\nimport {\n Sidebar,\n SidebarContent,\n SidebarFooter,\n SidebarHeader,\n SidebarRail,\n} from '@/registry/new-york/ui/sidebar'\n\nimport {\n AudioWaveform,\n BookOpen,\n Bot,\n Command,\n Frame,\n GalleryVerticalEnd,\n Map,\n PieChart,\n Settings2,\n SquareTerminal,\n} from 'lucide-vue-next'\n\nconst props = withDefaults(defineProps<SidebarProps>(), {\n collapsible: 'icon',\n})\n\n// This is sample data.\nconst data = {\n user: {\n name: 'shadcn',\n email: 'm@example.com',\n avatar: '/avatars/shadcn.jpg',\n },\n teams: [\n {\n name: 'Acme Inc',\n logo: GalleryVerticalEnd,\n plan: 'Enterprise',\n },\n {\n name: 'Acme Corp.',\n logo: AudioWaveform,\n plan: 'Startup',\n },\n {\n name: 'Evil Corp.',\n logo: Command,\n plan: 'Free',\n },\n ],\n navMain: [\n {\n title: 'Playground',\n url: '#',\n icon: SquareTerminal,\n isActive: true,\n items: [\n {\n title: 'History',\n url: '#',\n },\n {\n title: 'Starred',\n url: '#',\n },\n {\n title: 'Settings',\n url: '#',\n },\n ],\n },\n {\n title: 'Models',\n url: '#',\n icon: Bot,\n items: [\n {\n title: 'Genesis',\n url: '#',\n },\n {\n title: 'Explorer',\n url: '#',\n },\n {\n title: 'Quantum',\n url: '#',\n },\n ],\n },\n {\n title: 'Documentation',\n url: '#',\n icon: BookOpen,\n items: [\n {\n title: 'Introduction',\n url: '#',\n },\n {\n title: 'Get Started',\n url: '#',\n },\n {\n title: 'Tutorials',\n url: '#',\n },\n {\n title: 'Changelog',\n url: '#',\n },\n ],\n },\n {\n title: 'Settings',\n url: '#',\n icon: Settings2,\n items: [\n {\n title: 'General',\n url: '#',\n },\n {\n title: 'Team',\n url: '#',\n },\n {\n title: 'Billing',\n url: '#',\n },\n {\n title: 'Limits',\n url: '#',\n },\n ],\n },\n ],\n projects: [\n {\n name: 'Design Engineering',\n url: '#',\n icon: Frame,\n },\n {\n name: 'Sales & Marketing',\n url: '#',\n icon: PieChart,\n },\n {\n name: 'Travel',\n url: '#',\n icon: Map,\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarHeader>\n <TeamSwitcher :teams=\"data.teams\" />\n </SidebarHeader>\n <SidebarContent>\n <NavMain :items=\"data.navMain\" />\n <NavProjects :projects=\"data.projects\" />\n </SidebarContent>\n <SidebarFooter>\n <NavUser :user=\"data.user\" />\n </SidebarFooter>\n <SidebarRail />\n </Sidebar>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport type { SidebarProps } from '@/registry/default/ui/sidebar'\n\nimport NavMain from '@/registry/default/block/Sidebar07/components/NavMain.vue'\nimport NavProjects from '@/registry/default/block/Sidebar07/components/NavProjects.vue'\nimport NavUser from '@/registry/default/block/Sidebar07/components/NavUser.vue'\nimport TeamSwitcher from '@/registry/default/block/Sidebar07/components/TeamSwitcher.vue'\nimport {\n Sidebar,\n SidebarContent,\n SidebarFooter,\n SidebarHeader,\n SidebarRail,\n} from '@/registry/default/ui/sidebar'\n\nimport {\n AudioWaveform,\n BookOpen,\n Bot,\n Command,\n Frame,\n GalleryVerticalEnd,\n Map,\n PieChart,\n Settings2,\n SquareTerminal,\n} from 'lucide-vue-next'\n\nconst props = withDefaults(defineProps<SidebarProps>(), {\n collapsible: 'icon',\n})\n\n// This is sample data.\nconst data = {\n user: {\n name: 'shadcn',\n email: 'm@example.com',\n avatar: '/avatars/shadcn.jpg',\n },\n teams: [\n {\n name: 'Acme Inc',\n logo: GalleryVerticalEnd,\n plan: 'Enterprise',\n },\n {\n name: 'Acme Corp.',\n logo: AudioWaveform,\n plan: 'Startup',\n },\n {\n name: 'Evil Corp.',\n logo: Command,\n plan: 'Free',\n },\n ],\n navMain: [\n {\n title: 'Playground',\n url: '#',\n icon: SquareTerminal,\n isActive: true,\n items: [\n {\n title: 'History',\n url: '#',\n },\n {\n title: 'Starred',\n url: '#',\n },\n {\n title: 'Settings',\n url: '#',\n },\n ],\n },\n {\n title: 'Models',\n url: '#',\n icon: Bot,\n items: [\n {\n title: 'Genesis',\n url: '#',\n },\n {\n title: 'Explorer',\n url: '#',\n },\n {\n title: 'Quantum',\n url: '#',\n },\n ],\n },\n {\n title: 'Documentation',\n url: '#',\n icon: BookOpen,\n items: [\n {\n title: 'Introduction',\n url: '#',\n },\n {\n title: 'Get Started',\n url: '#',\n },\n {\n title: 'Tutorials',\n url: '#',\n },\n {\n title: 'Changelog',\n url: '#',\n },\n ],\n },\n {\n title: 'Settings',\n url: '#',\n icon: Settings2,\n items: [\n {\n title: 'General',\n url: '#',\n },\n {\n title: 'Team',\n url: '#',\n },\n {\n title: 'Billing',\n url: '#',\n },\n {\n title: 'Limits',\n url: '#',\n },\n ],\n },\n ],\n projects: [\n {\n name: 'Design Engineering',\n url: '#',\n icon: Frame,\n },\n {\n name: 'Sales & Marketing',\n url: '#',\n icon: PieChart,\n },\n {\n name: 'Travel',\n url: '#',\n icon: Map,\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarHeader>\n <TeamSwitcher :teams=\"data.teams\" />\n </SidebarHeader>\n <SidebarContent>\n <NavMain :items=\"data.navMain\" />\n <NavProjects :projects=\"data.projects\" />\n </SidebarContent>\n <SidebarFooter>\n <NavUser :user=\"data.user\" />\n </SidebarFooter>\n <SidebarRail />\n </Sidebar>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar07/components/NavMain.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '@/registry/new-york/ui/collapsible'\nimport {\n SidebarGroup,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n} from '@/registry/new-york/ui/sidebar'\nimport { ChevronRight, type LucideIcon } from 'lucide-vue-next'\n\ndefineProps<{\n items: {\n title: string\n url: string\n icon?: LucideIcon\n isActive?: boolean\n items?: {\n title: string\n url: string\n }[]\n }[]\n}>()\n</script>\n\n<template>\n <SidebarGroup>\n <SidebarGroupLabel>Platform</SidebarGroupLabel>\n <SidebarMenu>\n <Collapsible\n v-for=\"item in items\"\n :key=\"item.title\"\n as-child\n :default-open=\"item.isActive\"\n class=\"group/collapsible\"\n >\n <SidebarMenuItem>\n <CollapsibleTrigger as-child>\n <SidebarMenuButton :tooltip=\"item.title\">\n <component :is=\"item.icon\" v-if=\"item.icon\" />\n <span>{{ item.title }}</span>\n <ChevronRight class=\"ml-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90\" />\n </SidebarMenuButton>\n </CollapsibleTrigger>\n <CollapsibleContent>\n <SidebarMenuSub>\n <SidebarMenuSubItem v-for=\"subItem in item.items\" :key=\"subItem.title\">\n <SidebarMenuSubButton as-child>\n <a :href=\"subItem.url\">\n <span>{{ subItem.title }}</span>\n </a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </CollapsibleContent>\n </SidebarMenuItem>\n </Collapsible>\n </SidebarMenu>\n </SidebarGroup>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '@/registry/default/ui/collapsible'\nimport {\n SidebarGroup,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n} from '@/registry/default/ui/sidebar'\nimport { ChevronRight, type LucideIcon } from 'lucide-vue-next'\n\ndefineProps<{\n items: {\n title: string\n url: string\n icon?: LucideIcon\n isActive?: boolean\n items?: {\n title: string\n url: string\n }[]\n }[]\n}>()\n</script>\n\n<template>\n <SidebarGroup>\n <SidebarGroupLabel>Platform</SidebarGroupLabel>\n <SidebarMenu>\n <Collapsible\n v-for=\"item in items\"\n :key=\"item.title\"\n as-child\n :default-open=\"item.isActive\"\n class=\"group/collapsible\"\n >\n <SidebarMenuItem>\n <CollapsibleTrigger as-child>\n <SidebarMenuButton :tooltip=\"item.title\">\n <component :is=\"item.icon\" v-if=\"item.icon\" />\n <span>{{ item.title }}</span>\n <ChevronRight class=\"ml-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90\" />\n </SidebarMenuButton>\n </CollapsibleTrigger>\n <CollapsibleContent>\n <SidebarMenuSub>\n <SidebarMenuSubItem v-for=\"subItem in item.items\" :key=\"subItem.title\">\n <SidebarMenuSubButton as-child>\n <a :href=\"subItem.url\">\n <span>{{ subItem.title }}</span>\n </a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </CollapsibleContent>\n </SidebarMenuItem>\n </Collapsible>\n </SidebarMenu>\n </SidebarGroup>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar07/components/NavProjects.vue",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\n\nimport {\n SidebarGroup,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuAction,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n Folder,\n Forward,\n type LucideIcon,\n MoreHorizontal,\n Trash2,\n} from 'lucide-vue-next'\n\ndefineProps<{\n projects: {\n name: string\n url: string\n icon: LucideIcon\n }[]\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarGroup class=\"group-data-[collapsible=icon]:hidden\">\n <SidebarGroupLabel>Projects</SidebarGroupLabel>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in projects\" :key=\"item.name\">\n <SidebarMenuButton as-child>\n <a :href=\"item.url\">\n <component :is=\"item.icon\" />\n <span>{{ item.name }}</span>\n </a>\n </SidebarMenuButton>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuAction show-on-hover>\n <MoreHorizontal />\n <span class=\"sr-only\">More</span>\n </SidebarMenuAction>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-48 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n :align=\"isMobile ? 'end' : 'start'\"\n >\n <DropdownMenuItem>\n <Folder class=\"text-muted-foreground\" />\n <span>View Project</span>\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Forward class=\"text-muted-foreground\" />\n <span>Share Project</span>\n </DropdownMenuItem>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <Trash2 class=\"text-muted-foreground\" />\n <span>Delete Project</span>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n <SidebarMenuItem>\n <SidebarMenuButton class=\"text-sidebar-foreground/70\">\n <MoreHorizontal class=\"text-sidebar-foreground/70\" />\n <span>More</span>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroup>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/default/ui/dropdown-menu'\n\nimport {\n SidebarGroup,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuAction,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/default/ui/sidebar'\nimport {\n Folder,\n Forward,\n type LucideIcon,\n MoreHorizontal,\n Trash2,\n} from 'lucide-vue-next'\n\ndefineProps<{\n projects: {\n name: string\n url: string\n icon: LucideIcon\n }[]\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarGroup class=\"group-data-[collapsible=icon]:hidden\">\n <SidebarGroupLabel>Projects</SidebarGroupLabel>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in projects\" :key=\"item.name\">\n <SidebarMenuButton as-child>\n <a :href=\"item.url\">\n <component :is=\"item.icon\" />\n <span>{{ item.name }}</span>\n </a>\n </SidebarMenuButton>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuAction show-on-hover>\n <MoreHorizontal />\n <span class=\"sr-only\">More</span>\n </SidebarMenuAction>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-48 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n :align=\"isMobile ? 'end' : 'start'\"\n >\n <DropdownMenuItem>\n <Folder class=\"text-muted-foreground\" />\n <span>View Project</span>\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Forward class=\"text-muted-foreground\" />\n <span>Share Project</span>\n </DropdownMenuItem>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <Trash2 class=\"text-muted-foreground\" />\n <span>Delete Project</span>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n <SidebarMenuItem>\n <SidebarMenuButton class=\"text-sidebar-foreground/70\">\n <MoreHorizontal class=\"text-sidebar-foreground/70\" />\n <span>More</span>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroup>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar07/components/NavUser.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Avatar,\n AvatarFallback,\n AvatarImage,\n} from '@/registry/new-york/ui/avatar'\n\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n BadgeCheck,\n Bell,\n ChevronsUpDown,\n CreditCard,\n LogOut,\n Sparkles,\n} from 'lucide-vue-next'\n\nconst props = defineProps<{\n user: {\n name: string\n email: string\n avatar: string\n }\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto size-4\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n align=\"end\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"p-0 font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <Sparkles />\n Upgrade to Pro\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <BadgeCheck />\n Account\n </DropdownMenuItem>\n <DropdownMenuItem>\n <CreditCard />\n Billing\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Bell />\n Notifications\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <LogOut />\n Log out\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n Avatar,\n AvatarFallback,\n AvatarImage,\n} from '@/registry/default/ui/avatar'\n\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/default/ui/dropdown-menu'\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/default/ui/sidebar'\nimport {\n BadgeCheck,\n Bell,\n ChevronsUpDown,\n CreditCard,\n LogOut,\n Sparkles,\n} from 'lucide-vue-next'\n\nconst props = defineProps<{\n user: {\n name: string\n email: string\n avatar: string\n }\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto size-4\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--reka-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n align=\"end\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"p-0 font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <Sparkles />\n Upgrade to Pro\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <BadgeCheck />\n Account\n </DropdownMenuItem>\n <DropdownMenuItem>\n <CreditCard />\n Billing\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Bell />\n Notifications\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <LogOut />\n Log out\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar07/components/TeamSwitcher.vue",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\n\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport { ChevronsUpDown, Plus } from 'lucide-vue-next'\n\nimport { type Component, ref } from 'vue'\n\nconst props = defineProps<{\n teams: {\n name: string\n logo: Component\n plan: string\n }[]\n}>()\n\nconst { isMobile } = useSidebar()\nconst activeTeam = ref(props.teams[0])\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <component :is=\"activeTeam.logo\" class=\"size-4\" />\n </div>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">\n {{ activeTeam.name }}\n </span>\n <span class=\"truncate text-xs\">{{ activeTeam.plan }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n align=\"start\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"text-xs text-muted-foreground\">\n Teams\n </DropdownMenuLabel>\n <DropdownMenuItem\n v-for=\"(team, index) in teams\"\n :key=\"team.name\"\n class=\"gap-2 p-2\"\n @click=\"activeTeam = team\"\n >\n <div class=\"flex size-6 items-center justify-center rounded-sm border\">\n <component :is=\"team.logo\" class=\"size-4 shrink-0\" />\n </div>\n {{ team.name }}\n <DropdownMenuShortcut>⌘{{ index + 1 }}</DropdownMenuShortcut>\n </DropdownMenuItem>\n <DropdownMenuSeparator />\n <DropdownMenuItem class=\"gap-2 p-2\">\n <div class=\"flex size-6 items-center justify-center rounded-md border bg-background\">\n <Plus class=\"size-4\" />\n </div>\n <div class=\"font-medium text-muted-foreground\">\n Add team\n </div>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuTrigger,\n} from '@/registry/default/ui/dropdown-menu'\n\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/default/ui/sidebar'\nimport { ChevronsUpDown, Plus } from 'lucide-vue-next'\n\nimport { type Component, ref } from 'vue'\n\nconst props = defineProps<{\n teams: {\n name: string\n logo: Component\n plan: string\n }[]\n}>()\n\nconst { isMobile } = useSidebar()\nconst activeTeam = ref(props.teams[0])\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <component :is=\"activeTeam.logo\" class=\"size-4\" />\n </div>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">\n {{ activeTeam.name }}\n </span>\n <span class=\"truncate text-xs\">{{ activeTeam.plan }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--reka-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n align=\"start\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"text-xs text-muted-foreground\">\n Teams\n </DropdownMenuLabel>\n <DropdownMenuItem\n v-for=\"(team, index) in teams\"\n :key=\"team.name\"\n class=\"gap-2 p-2\"\n @click=\"activeTeam = team\"\n >\n <div class=\"flex size-6 items-center justify-center rounded-sm border\">\n <component :is=\"team.logo\" class=\"size-4 shrink-0\" />\n </div>\n {{ team.name }}\n <DropdownMenuShortcut>⌘{{ index + 1 }}</DropdownMenuShortcut>\n </DropdownMenuItem>\n <DropdownMenuSeparator />\n <DropdownMenuItem class=\"gap-2 p-2\">\n <div class=\"flex size-6 items-center justify-center rounded-md border bg-background\">\n <Plus class=\"size-4\" />\n </div>\n <div class=\"font-medium text-muted-foreground\">\n Add team\n </div>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"type": "registry:component",
"target": ""
}

12
apps/www/src/public/r/styles/default/Sidebar08.json
View File

@ -18,37 +18,37 @@
"files": [
{
"path": "block/Sidebar08/page.vue",
"content": "<script lang=\"ts\">\nexport const description = 'An inset sidebar with secondary navigation.'\nexport const iframeHeight = '800px'\n</script>\n\n<script setup lang=\"ts\">\nimport AppSidebar from '@/registry/new-york/block/Sidebar08/components/AppSidebar.vue'\nimport {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbList,\n BreadcrumbPage,\n BreadcrumbSeparator,\n} from '@/registry/new-york/ui/breadcrumb'\nimport { Separator } from '@/registry/new-york/ui/separator'\nimport {\n SidebarInset,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/new-york/ui/sidebar'\n</script>\n\n<template>\n <SidebarProvider>\n <AppSidebar />\n <SidebarInset>\n <header class=\"flex h-16 shrink-0 items-center gap-2\">\n <div class=\"flex items-center gap-2 px-4\">\n <SidebarTrigger class=\"-ml-1\" />\n <Separator orientation=\"vertical\" class=\"mr-2 h-4\" />\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem class=\"hidden md:block\">\n <BreadcrumbLink href=\"#\">\n Building Your Application\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator class=\"hidden md:block\" />\n <BreadcrumbItem>\n <BreadcrumbPage>Data Fetching</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n </div>\n </header>\n <div class=\"flex flex-1 flex-col gap-4 p-4 pt-0\">\n <div class=\"grid auto-rows-min gap-4 md:grid-cols-3\">\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n </div>\n <div class=\"min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min\" />\n </div>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"content": "<script lang=\"ts\">\nexport const description = 'An inset sidebar with secondary navigation.'\nexport const iframeHeight = '800px'\n</script>\n\n<script setup lang=\"ts\">\nimport AppSidebar from '@/registry/default/block/Sidebar08/components/AppSidebar.vue'\nimport {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbList,\n BreadcrumbPage,\n BreadcrumbSeparator,\n} from '@/registry/default/ui/breadcrumb'\nimport { Separator } from '@/registry/default/ui/separator'\nimport {\n SidebarInset,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/default/ui/sidebar'\n</script>\n\n<template>\n <SidebarProvider>\n <AppSidebar />\n <SidebarInset>\n <header class=\"flex h-16 shrink-0 items-center gap-2\">\n <div class=\"flex items-center gap-2 px-4\">\n <SidebarTrigger class=\"-ml-1\" />\n <Separator orientation=\"vertical\" class=\"mr-2 h-4\" />\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem class=\"hidden md:block\">\n <BreadcrumbLink href=\"#\">\n Building Your Application\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator class=\"hidden md:block\" />\n <BreadcrumbItem>\n <BreadcrumbPage>Data Fetching</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n </div>\n </header>\n <div class=\"flex flex-1 flex-col gap-4 p-4 pt-0\">\n <div class=\"grid auto-rows-min gap-4 md:grid-cols-3\">\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n </div>\n <div class=\"min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min\" />\n </div>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"type": "registry:page",
"target": "pages/dashboard/index.vue"
},
{
"path": "block/Sidebar08/components/AppSidebar.vue",
"content": "<script setup lang=\"ts\">\nimport NavMain from '@/registry/new-york/block/Sidebar08/components/NavMain.vue'\n\nimport NavProjects from '@/registry/new-york/block/Sidebar08/components/NavProjects.vue'\nimport NavSecondary from '@/registry/new-york/block/Sidebar08/components/NavSecondary.vue'\nimport NavUser from '@/registry/new-york/block/Sidebar08/components/NavUser.vue'\nimport {\n Sidebar,\n SidebarContent,\n SidebarFooter,\n SidebarHeader,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n type SidebarProps,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n BookOpen,\n Bot,\n Command,\n Frame,\n LifeBuoy,\n Map,\n PieChart,\n Send,\n Settings2,\n SquareTerminal,\n} from 'lucide-vue-next'\n\nconst props = withDefaults(defineProps<SidebarProps>(), {\n variant: 'inset',\n})\n\nconst data = {\n user: {\n name: 'shadcn',\n email: 'm@example.com',\n avatar: '/avatars/shadcn.jpg',\n },\n navMain: [\n {\n title: 'Playground',\n url: '#',\n icon: SquareTerminal,\n isActive: true,\n items: [\n {\n title: 'History',\n url: '#',\n },\n {\n title: 'Starred',\n url: '#',\n },\n {\n title: 'Settings',\n url: '#',\n },\n ],\n },\n {\n title: 'Models',\n url: '#',\n icon: Bot,\n items: [\n {\n title: 'Genesis',\n url: '#',\n },\n {\n title: 'Explorer',\n url: '#',\n },\n {\n title: 'Quantum',\n url: '#',\n },\n ],\n },\n {\n title: 'Documentation',\n url: '#',\n icon: BookOpen,\n items: [\n {\n title: 'Introduction',\n url: '#',\n },\n {\n title: 'Get Started',\n url: '#',\n },\n {\n title: 'Tutorials',\n url: '#',\n },\n {\n title: 'Changelog',\n url: '#',\n },\n ],\n },\n {\n title: 'Settings',\n url: '#',\n icon: Settings2,\n items: [\n {\n title: 'General',\n url: '#',\n },\n {\n title: 'Team',\n url: '#',\n },\n {\n title: 'Billing',\n url: '#',\n },\n {\n title: 'Limits',\n url: '#',\n },\n ],\n },\n ],\n navSecondary: [\n {\n title: 'Support',\n url: '#',\n icon: LifeBuoy,\n },\n {\n title: 'Feedback',\n url: '#',\n icon: Send,\n },\n ],\n projects: [\n {\n name: 'Design Engineering',\n url: '#',\n icon: Frame,\n },\n {\n name: 'Sales & Marketing',\n url: '#',\n icon: PieChart,\n },\n {\n name: 'Travel',\n url: '#',\n icon: Map,\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarHeader>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton size=\"lg\" as-child>\n <a href=\"#\">\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <Command class=\"size-4\" />\n </div>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">Acme Inc</span>\n <span class=\"truncate text-xs\">Enterprise</span>\n </div>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarHeader>\n <SidebarContent>\n <NavMain :items=\"data.navMain\" />\n <NavProjects :projects=\"data.projects\" />\n <NavSecondary :items=\"data.navSecondary\" class=\"mt-auto\" />\n </SidebarContent>\n <SidebarFooter>\n <NavUser :user=\"data.user\" />\n </SidebarFooter>\n </Sidebar>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport NavMain from '@/registry/default/block/Sidebar08/components/NavMain.vue'\n\nimport NavProjects from '@/registry/default/block/Sidebar08/components/NavProjects.vue'\nimport NavSecondary from '@/registry/default/block/Sidebar08/components/NavSecondary.vue'\nimport NavUser from '@/registry/default/block/Sidebar08/components/NavUser.vue'\nimport {\n Sidebar,\n SidebarContent,\n SidebarFooter,\n SidebarHeader,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n type SidebarProps,\n} from '@/registry/default/ui/sidebar'\nimport {\n BookOpen,\n Bot,\n Command,\n Frame,\n LifeBuoy,\n Map,\n PieChart,\n Send,\n Settings2,\n SquareTerminal,\n} from 'lucide-vue-next'\n\nconst props = withDefaults(defineProps<SidebarProps>(), {\n variant: 'inset',\n})\n\nconst data = {\n user: {\n name: 'shadcn',\n email: 'm@example.com',\n avatar: '/avatars/shadcn.jpg',\n },\n navMain: [\n {\n title: 'Playground',\n url: '#',\n icon: SquareTerminal,\n isActive: true,\n items: [\n {\n title: 'History',\n url: '#',\n },\n {\n title: 'Starred',\n url: '#',\n },\n {\n title: 'Settings',\n url: '#',\n },\n ],\n },\n {\n title: 'Models',\n url: '#',\n icon: Bot,\n items: [\n {\n title: 'Genesis',\n url: '#',\n },\n {\n title: 'Explorer',\n url: '#',\n },\n {\n title: 'Quantum',\n url: '#',\n },\n ],\n },\n {\n title: 'Documentation',\n url: '#',\n icon: BookOpen,\n items: [\n {\n title: 'Introduction',\n url: '#',\n },\n {\n title: 'Get Started',\n url: '#',\n },\n {\n title: 'Tutorials',\n url: '#',\n },\n {\n title: 'Changelog',\n url: '#',\n },\n ],\n },\n {\n title: 'Settings',\n url: '#',\n icon: Settings2,\n items: [\n {\n title: 'General',\n url: '#',\n },\n {\n title: 'Team',\n url: '#',\n },\n {\n title: 'Billing',\n url: '#',\n },\n {\n title: 'Limits',\n url: '#',\n },\n ],\n },\n ],\n navSecondary: [\n {\n title: 'Support',\n url: '#',\n icon: LifeBuoy,\n },\n {\n title: 'Feedback',\n url: '#',\n icon: Send,\n },\n ],\n projects: [\n {\n name: 'Design Engineering',\n url: '#',\n icon: Frame,\n },\n {\n name: 'Sales & Marketing',\n url: '#',\n icon: PieChart,\n },\n {\n name: 'Travel',\n url: '#',\n icon: Map,\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarHeader>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton size=\"lg\" as-child>\n <a href=\"#\">\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <Command class=\"size-4\" />\n </div>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">Acme Inc</span>\n <span class=\"truncate text-xs\">Enterprise</span>\n </div>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarHeader>\n <SidebarContent>\n <NavMain :items=\"data.navMain\" />\n <NavProjects :projects=\"data.projects\" />\n <NavSecondary :items=\"data.navSecondary\" class=\"mt-auto\" />\n </SidebarContent>\n <SidebarFooter>\n <NavUser :user=\"data.user\" />\n </SidebarFooter>\n </Sidebar>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar08/components/NavMain.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '@/registry/new-york/ui/collapsible'\nimport {\n SidebarGroup,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuAction,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n} from '@/registry/new-york/ui/sidebar'\nimport { ChevronRight, type LucideIcon } from 'lucide-vue-next'\n\ndefineProps<{\n items: {\n title: string\n url: string\n icon: LucideIcon\n isActive?: boolean\n items?: {\n title: string\n url: string\n }[]\n }[]\n}>()\n</script>\n\n<template>\n <SidebarGroup>\n <SidebarGroupLabel>Platform</SidebarGroupLabel>\n <SidebarMenu>\n <Collapsible v-for=\"item in items\" :key=\"item.title\" as-child :default-open=\"item.isActive\">\n <SidebarMenuItem>\n <SidebarMenuButton as-child :tooltip=\"item.title\">\n <a :href=\"item.url\">\n <component :is=\"item.icon\" />\n <span>{{ item.title }}</span>\n </a>\n </SidebarMenuButton>\n <template v-if=\"item.items?.length\">\n <CollapsibleTrigger as-child>\n <SidebarMenuAction class=\"data-[state=open]:rotate-90\">\n <ChevronRight />\n <span class=\"sr-only\">Toggle</span>\n </SidebarMenuAction>\n </CollapsibleTrigger>\n <CollapsibleContent>\n <SidebarMenuSub>\n <SidebarMenuSubItem v-for=\"subItem in item.items\" :key=\"subItem.title\">\n <SidebarMenuSubButton as-child>\n <a :href=\"subItem.url\">\n <span>{{ subItem.title }}</span>\n </a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </CollapsibleContent>\n </template>\n </SidebarMenuItem>\n </Collapsible>\n </SidebarMenu>\n </SidebarGroup>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '@/registry/default/ui/collapsible'\nimport {\n SidebarGroup,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuAction,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n} from '@/registry/default/ui/sidebar'\nimport { ChevronRight, type LucideIcon } from 'lucide-vue-next'\n\ndefineProps<{\n items: {\n title: string\n url: string\n icon: LucideIcon\n isActive?: boolean\n items?: {\n title: string\n url: string\n }[]\n }[]\n}>()\n</script>\n\n<template>\n <SidebarGroup>\n <SidebarGroupLabel>Platform</SidebarGroupLabel>\n <SidebarMenu>\n <Collapsible v-for=\"item in items\" :key=\"item.title\" as-child :default-open=\"item.isActive\">\n <SidebarMenuItem>\n <SidebarMenuButton as-child :tooltip=\"item.title\">\n <a :href=\"item.url\">\n <component :is=\"item.icon\" />\n <span>{{ item.title }}</span>\n </a>\n </SidebarMenuButton>\n <template v-if=\"item.items?.length\">\n <CollapsibleTrigger as-child>\n <SidebarMenuAction class=\"data-[state=open]:rotate-90\">\n <ChevronRight />\n <span class=\"sr-only\">Toggle</span>\n </SidebarMenuAction>\n </CollapsibleTrigger>\n <CollapsibleContent>\n <SidebarMenuSub>\n <SidebarMenuSubItem v-for=\"subItem in item.items\" :key=\"subItem.title\">\n <SidebarMenuSubButton as-child>\n <a :href=\"subItem.url\">\n <span>{{ subItem.title }}</span>\n </a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </CollapsibleContent>\n </template>\n </SidebarMenuItem>\n </Collapsible>\n </SidebarMenu>\n </SidebarGroup>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar08/components/NavProjects.vue",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\n\nimport {\n SidebarGroup,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuAction,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n Folder,\n Forward,\n type LucideIcon,\n MoreHorizontal,\n Trash2,\n} from 'lucide-vue-next'\n\ndefineProps<{\n projects: {\n name: string\n url: string\n icon: LucideIcon\n }[]\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarGroup class=\"group-data-[collapsible=icon]:hidden\">\n <SidebarGroupLabel>Projects</SidebarGroupLabel>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in projects\" :key=\"item.name\">\n <SidebarMenuButton as-child>\n <a :href=\"item.url\">\n <component :is=\"item.icon\" />\n <span>{{ item.name }}</span>\n </a>\n </SidebarMenuButton>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuAction show-on-hover>\n <MoreHorizontal />\n <span class=\"sr-only\">More</span>\n </SidebarMenuAction>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-48 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n :align=\"isMobile ? 'end' : 'start'\"\n >\n <DropdownMenuItem>\n <Folder class=\"text-muted-foreground\" />\n <span>View Project</span>\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Forward class=\"text-muted-foreground\" />\n <span>Share Project</span>\n </DropdownMenuItem>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <Trash2 class=\"text-muted-foreground\" />\n <span>Delete Project</span>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n <SidebarMenuItem>\n <SidebarMenuButton class=\"text-sidebar-foreground/70\">\n <MoreHorizontal class=\"text-sidebar-foreground/70\" />\n <span>More</span>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroup>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/default/ui/dropdown-menu'\n\nimport {\n SidebarGroup,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuAction,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/default/ui/sidebar'\nimport {\n Folder,\n Forward,\n type LucideIcon,\n MoreHorizontal,\n Trash2,\n} from 'lucide-vue-next'\n\ndefineProps<{\n projects: {\n name: string\n url: string\n icon: LucideIcon\n }[]\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarGroup class=\"group-data-[collapsible=icon]:hidden\">\n <SidebarGroupLabel>Projects</SidebarGroupLabel>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in projects\" :key=\"item.name\">\n <SidebarMenuButton as-child>\n <a :href=\"item.url\">\n <component :is=\"item.icon\" />\n <span>{{ item.name }}</span>\n </a>\n </SidebarMenuButton>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuAction show-on-hover>\n <MoreHorizontal />\n <span class=\"sr-only\">More</span>\n </SidebarMenuAction>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-48 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n :align=\"isMobile ? 'end' : 'start'\"\n >\n <DropdownMenuItem>\n <Folder class=\"text-muted-foreground\" />\n <span>View Project</span>\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Forward class=\"text-muted-foreground\" />\n <span>Share Project</span>\n </DropdownMenuItem>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <Trash2 class=\"text-muted-foreground\" />\n <span>Delete Project</span>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n <SidebarMenuItem>\n <SidebarMenuButton class=\"text-sidebar-foreground/70\">\n <MoreHorizontal class=\"text-sidebar-foreground/70\" />\n <span>More</span>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroup>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar08/components/NavSecondary.vue",
"content": "<script setup lang=\"ts\">\nimport type { LucideIcon } from 'lucide-vue-next'\n\nimport {\n SidebarGroup,\n SidebarGroupContent,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n} from '@/registry/new-york/ui/sidebar'\n\nconst props = defineProps<{\n items: {\n title: string\n url: string\n icon: LucideIcon\n }[]\n}>()\n</script>\n\n<template>\n <SidebarGroup>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in items\" :key=\"item.title\">\n <SidebarMenuButton as-child size=\"sm\">\n <a :href=\"item.url\">\n <component :is=\"item.icon\" />\n <span>{{ item.title }}</span>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport type { LucideIcon } from 'lucide-vue-next'\n\nimport {\n SidebarGroup,\n SidebarGroupContent,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n} from '@/registry/default/ui/sidebar'\n\nconst props = defineProps<{\n items: {\n title: string\n url: string\n icon: LucideIcon\n }[]\n}>()\n</script>\n\n<template>\n <SidebarGroup>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in items\" :key=\"item.title\">\n <SidebarMenuButton as-child size=\"sm\">\n <a :href=\"item.url\">\n <component :is=\"item.icon\" />\n <span>{{ item.title }}</span>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar08/components/NavUser.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Avatar,\n AvatarFallback,\n AvatarImage,\n} from '@/registry/new-york/ui/avatar'\n\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n BadgeCheck,\n Bell,\n ChevronsUpDown,\n CreditCard,\n LogOut,\n Sparkles,\n} from 'lucide-vue-next'\n\nconst props = defineProps<{\n user: {\n name: string\n email: string\n avatar: string\n }\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto size-4\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n align=\"end\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"p-0 font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <Sparkles />\n Upgrade to Pro\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <BadgeCheck />\n Account\n </DropdownMenuItem>\n <DropdownMenuItem>\n <CreditCard />\n Billing\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Bell />\n Notifications\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <LogOut />\n Log out\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n Avatar,\n AvatarFallback,\n AvatarImage,\n} from '@/registry/default/ui/avatar'\n\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/default/ui/dropdown-menu'\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/default/ui/sidebar'\nimport {\n BadgeCheck,\n Bell,\n ChevronsUpDown,\n CreditCard,\n LogOut,\n Sparkles,\n} from 'lucide-vue-next'\n\nconst props = defineProps<{\n user: {\n name: string\n email: string\n avatar: string\n }\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto size-4\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--reka-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n align=\"end\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"p-0 font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <Sparkles />\n Upgrade to Pro\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <BadgeCheck />\n Account\n </DropdownMenuItem>\n <DropdownMenuItem>\n <CreditCard />\n Billing\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Bell />\n Notifications\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <LogOut />\n Log out\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"type": "registry:component",
"target": ""
}

6
apps/www/src/public/r/styles/default/Sidebar09.json
View File

File diff suppressed because one or more lines are too long

16
apps/www/src/public/r/styles/default/Sidebar10.json
View File

File diff suppressed because one or more lines are too long

2
apps/www/src/public/r/styles/default/Sidebar11.json
View File

@ -13,7 +13,7 @@
"files": [
{
"path": "block/Sidebar11/page.vue",
"content": "<script lang=\"ts\">\nexport const description = 'A sidebar with a collapsible file tree.'\nexport const iframeHeight = '800px'\n</script>\n\n<script setup lang=\"ts\">\nimport AppSidebar from '@/registry/new-york/block/Sidebar11/components/AppSidebar.vue'\nimport {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbList,\n BreadcrumbPage,\n BreadcrumbSeparator,\n} from '@/registry/new-york/ui/breadcrumb'\nimport { Separator } from '@/registry/new-york/ui/separator'\nimport {\n SidebarInset,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/new-york/ui/sidebar'\n</script>\n\n<template>\n <SidebarProvider>\n <AppSidebar />\n <SidebarInset>\n <header class=\"flex h-16 shrink-0 items-center gap-2 border-b px-4\">\n <SidebarTrigger class=\"-ml-1\" />\n <Separator orientation=\"vertical\" class=\"mr-2 h-4\" />\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem class=\"hidden md:block\">\n <BreadcrumbLink href=\"#\">\n components\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator class=\"hidden md:block\" />\n <BreadcrumbItem class=\"hidden md:block\">\n <BreadcrumbLink href=\"#\">\n ui\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator class=\"hidden md:block\" />\n <BreadcrumbItem>\n <BreadcrumbPage>button.tsx</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n </header>\n <div class=\"flex flex-1 flex-col gap-4 p-4\">\n <div class=\"grid auto-rows-min gap-4 md:grid-cols-3\">\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n </div>\n <div class=\"min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min\" />\n </div>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"content": "<script lang=\"ts\">\nexport const description = 'A sidebar with a collapsible file tree.'\nexport const iframeHeight = '800px'\n</script>\n\n<script setup lang=\"ts\">\nimport AppSidebar from '@/registry/default/block/Sidebar11/components/AppSidebar.vue'\nimport {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbList,\n BreadcrumbPage,\n BreadcrumbSeparator,\n} from '@/registry/default/ui/breadcrumb'\nimport { Separator } from '@/registry/default/ui/separator'\nimport {\n SidebarInset,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/default/ui/sidebar'\n</script>\n\n<template>\n <SidebarProvider>\n <AppSidebar />\n <SidebarInset>\n <header class=\"flex h-16 shrink-0 items-center gap-2 border-b px-4\">\n <SidebarTrigger class=\"-ml-1\" />\n <Separator orientation=\"vertical\" class=\"mr-2 h-4\" />\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem class=\"hidden md:block\">\n <BreadcrumbLink href=\"#\">\n components\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator class=\"hidden md:block\" />\n <BreadcrumbItem class=\"hidden md:block\">\n <BreadcrumbLink href=\"#\">\n ui\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator class=\"hidden md:block\" />\n <BreadcrumbItem>\n <BreadcrumbPage>button.tsx</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n </header>\n <div class=\"flex flex-1 flex-col gap-4 p-4\">\n <div class=\"grid auto-rows-min gap-4 md:grid-cols-3\">\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n </div>\n <div class=\"min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min\" />\n </div>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"type": "registry:page",
"target": "pages/dashboard/index.vue"
},

10
apps/www/src/public/r/styles/default/Sidebar12.json
View File

@ -18,31 +18,31 @@
"files": [
{
"path": "block/Sidebar12/page.vue",
"content": "<script lang=\"ts\">\nexport const description = 'A sidebar with a calendar.'\nexport const iframeHeight = '800px'\n</script>\n\n<script setup lang=\"ts\">\nimport AppSidebar from '@/registry/new-york/block/Sidebar12/components/AppSidebar.vue'\nimport {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbList,\n BreadcrumbPage,\n} from '@/registry/new-york/ui/breadcrumb'\nimport { Separator } from '@/registry/new-york/ui/separator'\nimport {\n SidebarInset,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/new-york/ui/sidebar'\n</script>\n\n<template>\n <SidebarProvider>\n <AppSidebar />\n <SidebarInset>\n <header class=\"sticky top-0 flex h-16 shrink-0 items-center gap-2 border-b bg-background px-4\">\n <SidebarTrigger class=\"-ml-1\" />\n <Separator orientation=\"vertical\" class=\"mr-2 h-4\" />\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem>\n <BreadcrumbPage>October 2024</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n </header>\n <div class=\"flex flex-1 flex-col gap-4 p-4\">\n <div class=\"grid auto-rows-min gap-4 md:grid-cols-5\">\n <div v-for=\"i in 20\" :key=\"i\" class=\"aspect-square rounded-xl bg-muted/50\" />\n </div>\n </div>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"content": "<script lang=\"ts\">\nexport const description = 'A sidebar with a calendar.'\nexport const iframeHeight = '800px'\n</script>\n\n<script setup lang=\"ts\">\nimport AppSidebar from '@/registry/default/block/Sidebar12/components/AppSidebar.vue'\nimport {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbList,\n BreadcrumbPage,\n} from '@/registry/default/ui/breadcrumb'\nimport { Separator } from '@/registry/default/ui/separator'\nimport {\n SidebarInset,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/default/ui/sidebar'\n</script>\n\n<template>\n <SidebarProvider>\n <AppSidebar />\n <SidebarInset>\n <header class=\"sticky top-0 flex h-16 shrink-0 items-center gap-2 border-b bg-background px-4\">\n <SidebarTrigger class=\"-ml-1\" />\n <Separator orientation=\"vertical\" class=\"mr-2 h-4\" />\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem>\n <BreadcrumbPage>October 2024</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n </header>\n <div class=\"flex flex-1 flex-col gap-4 p-4\">\n <div class=\"grid auto-rows-min gap-4 md:grid-cols-5\">\n <div v-for=\"i in 20\" :key=\"i\" class=\"aspect-square rounded-xl bg-muted/50\" />\n </div>\n </div>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"type": "registry:page",
"target": "pages/dashboard/index.vue"
},
{
"path": "block/Sidebar12/components/AppSidebar.vue",
"content": "<script setup lang=\"ts\">\nimport Calendars from '@/registry/new-york/block/Sidebar12/components/Calendars.vue'\n\nimport DatePicker from '@/registry/new-york/block/Sidebar12/components/DatePicker.vue'\nimport NavUser from '@/registry/new-york/block/Sidebar12/components/NavUser.vue'\nimport {\n Sidebar,\n SidebarContent,\n SidebarFooter,\n SidebarHeader,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n type SidebarProps,\n SidebarRail,\n SidebarSeparator,\n} from '@/registry/new-york/ui/sidebar'\nimport { Plus } from 'lucide-vue-next'\n\nconst props = defineProps<SidebarProps>()\n// This is sample data.\nconst data = {\n user: {\n name: 'shadcn',\n email: 'm@example.com',\n avatar: '/avatars/shadcn.jpg',\n },\n calendars: [\n {\n name: 'My Calendars',\n items: ['Personal', 'Work', 'Family'],\n },\n {\n name: 'Favorites',\n items: ['Holidays', 'Birthdays'],\n },\n {\n name: 'Other',\n items: ['Travel', 'Reminders', 'Deadlines'],\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarHeader class=\"h-16 border-b border-sidebar-border\">\n <NavUser :user=\"data.user\" />\n </SidebarHeader>\n <SidebarContent>\n <DatePicker />\n <SidebarSeparator class=\"mx-0\" />\n <Calendars :calendars=\"data.calendars\" />\n </SidebarContent>\n <SidebarFooter>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton>\n <Plus />\n <span>New Calendar</span>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarFooter>\n <SidebarRail />\n </Sidebar>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport Calendars from '@/registry/default/block/Sidebar12/components/Calendars.vue'\n\nimport DatePicker from '@/registry/default/block/Sidebar12/components/DatePicker.vue'\nimport NavUser from '@/registry/default/block/Sidebar12/components/NavUser.vue'\nimport {\n Sidebar,\n SidebarContent,\n SidebarFooter,\n SidebarHeader,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n type SidebarProps,\n SidebarRail,\n SidebarSeparator,\n} from '@/registry/default/ui/sidebar'\nimport { Plus } from 'lucide-vue-next'\n\nconst props = defineProps<SidebarProps>()\n// This is sample data.\nconst data = {\n user: {\n name: 'shadcn',\n email: 'm@example.com',\n avatar: '/avatars/shadcn.jpg',\n },\n calendars: [\n {\n name: 'My Calendars',\n items: ['Personal', 'Work', 'Family'],\n },\n {\n name: 'Favorites',\n items: ['Holidays', 'Birthdays'],\n },\n {\n name: 'Other',\n items: ['Travel', 'Reminders', 'Deadlines'],\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarHeader class=\"h-16 border-b border-sidebar-border\">\n <NavUser :user=\"data.user\" />\n </SidebarHeader>\n <SidebarContent>\n <DatePicker />\n <SidebarSeparator class=\"mx-0\" />\n <Calendars :calendars=\"data.calendars\" />\n </SidebarContent>\n <SidebarFooter>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton>\n <Plus />\n <span>New Calendar</span>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarFooter>\n <SidebarRail />\n </Sidebar>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar12/components/Calendars.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '@/registry/new-york/ui/collapsible'\n\nimport {\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarSeparator,\n} from '@/registry/new-york/ui/sidebar'\nimport { Check, ChevronRight } from 'lucide-vue-next'\n\nconst props = defineProps<{\n calendars: {\n name: string\n items: string[]\n }[]\n}>()\n</script>\n\n<template>\n <template v-for=\"(calendar, index) in calendars\" :key=\"calendar.name\">\n <SidebarGroup class=\"py-0\">\n <Collapsible\n :default-open=\"index === 0\"\n class=\"group/collapsible\"\n >\n <SidebarGroupLabel\n as-child\n class=\"group/label w-full text-sm text-sidebar-foreground hover:bg-sidebar-accent hover:text-sidebar-accent-foreground\"\n >\n <CollapsibleTrigger>\n {{ calendar.name }}\n <ChevronRight class=\"ml-auto transition-transform group-data-[state=open]/collapsible:rotate-90\" />\n </CollapsibleTrigger>\n </SidebarGroupLabel>\n <CollapsibleContent>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"(item, index) in calendar.items\" :key=\"item\">\n <SidebarMenuButton>\n <div\n :data-active=\"index < 2\"\n class=\"group/calendar-item flex aspect-square size-4 shrink-0 items-center justify-center rounded-sm border border-sidebar-border text-sidebar-primary-foreground data-[active=true]:border-sidebar-primary data-[active=true]:bg-sidebar-primary\"\n >\n <Check class=\"hidden size-3 group-data-[active=true]/calendar-item:block\" />\n </div>\n {{ item }}\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </CollapsibleContent>\n </Collapsible>\n </SidebarGroup>\n <SidebarSeparator class=\"mx-0\" />\n </template>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '@/registry/default/ui/collapsible'\n\nimport {\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarSeparator,\n} from '@/registry/default/ui/sidebar'\nimport { Check, ChevronRight } from 'lucide-vue-next'\n\nconst props = defineProps<{\n calendars: {\n name: string\n items: string[]\n }[]\n}>()\n</script>\n\n<template>\n <template v-for=\"(calendar, index) in calendars\" :key=\"calendar.name\">\n <SidebarGroup class=\"py-0\">\n <Collapsible\n :default-open=\"index === 0\"\n class=\"group/collapsible\"\n >\n <SidebarGroupLabel\n as-child\n class=\"group/label w-full text-sm text-sidebar-foreground hover:bg-sidebar-accent hover:text-sidebar-accent-foreground\"\n >\n <CollapsibleTrigger>\n {{ calendar.name }}\n <ChevronRight class=\"ml-auto transition-transform group-data-[state=open]/collapsible:rotate-90\" />\n </CollapsibleTrigger>\n </SidebarGroupLabel>\n <CollapsibleContent>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"(item, index) in calendar.items\" :key=\"item\">\n <SidebarMenuButton>\n <div\n :data-active=\"index < 2\"\n class=\"group/calendar-item flex aspect-square size-4 shrink-0 items-center justify-center rounded-sm border border-sidebar-border text-sidebar-primary-foreground data-[active=true]:border-sidebar-primary data-[active=true]:bg-sidebar-primary\"\n >\n <Check class=\"hidden size-3 group-data-[active=true]/calendar-item:block\" />\n </div>\n {{ item }}\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </CollapsibleContent>\n </Collapsible>\n </SidebarGroup>\n <SidebarSeparator class=\"mx-0\" />\n </template>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar12/components/DatePicker.vue",
"content": "<script setup lang=\"ts\">\nimport { Calendar } from '@/registry/new-york/ui/calendar'\nimport {\n SidebarGroup,\n SidebarGroupContent,\n} from '@/registry/new-york/ui/sidebar'\n</script>\n\n<template>\n <SidebarGroup class=\"px-0\">\n <SidebarGroupContent>\n <Calendar class=\"[&_[role=gridcell].bg-accent]:bg-sidebar-primary [&_[role=gridcell].bg-accent]:text-sidebar-primary-foreground [&_[role=gridcell]]:w-[33px]\" />\n </SidebarGroupContent>\n </SidebarGroup>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport { Calendar } from '@/registry/default/ui/calendar'\nimport {\n SidebarGroup,\n SidebarGroupContent,\n} from '@/registry/default/ui/sidebar'\n</script>\n\n<template>\n <SidebarGroup class=\"px-0\">\n <SidebarGroupContent>\n <Calendar class=\"[&_[role=gridcell].bg-accent]:bg-sidebar-primary [&_[role=gridcell].bg-accent]:text-sidebar-primary-foreground [&_[role=gridcell]]:w-[33px]\" />\n </SidebarGroupContent>\n </SidebarGroup>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar12/components/NavUser.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Avatar,\n AvatarFallback,\n AvatarImage,\n} from '@/registry/new-york/ui/avatar'\n\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n BadgeCheck,\n Bell,\n ChevronsUpDown,\n CreditCard,\n LogOut,\n Sparkles,\n} from 'lucide-vue-next'\n\nconst props = defineProps<{\n user: {\n name: string\n email: string\n avatar: string\n }\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto size-4\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n align=\"start\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"p-0 font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <Sparkles />\n Upgrade to Pro\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <BadgeCheck />\n Account\n </DropdownMenuItem>\n <DropdownMenuItem>\n <CreditCard />\n Billing\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Bell />\n Notifications\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <LogOut />\n Log out\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n Avatar,\n AvatarFallback,\n AvatarImage,\n} from '@/registry/default/ui/avatar'\n\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/default/ui/dropdown-menu'\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/default/ui/sidebar'\nimport {\n BadgeCheck,\n Bell,\n ChevronsUpDown,\n CreditCard,\n LogOut,\n Sparkles,\n} from 'lucide-vue-next'\n\nconst props = defineProps<{\n user: {\n name: string\n email: string\n avatar: string\n }\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto size-4\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--reka-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n align=\"start\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"p-0 font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <Sparkles />\n Upgrade to Pro\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <BadgeCheck />\n Account\n </DropdownMenuItem>\n <DropdownMenuItem>\n <CreditCard />\n Billing\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Bell />\n Notifications\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <LogOut />\n Log out\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"type": "registry:component",
"target": ""
}

4
apps/www/src/public/r/styles/default/Sidebar13.json
View File

@ -12,13 +12,13 @@
"files": [
{
"path": "block/Sidebar13/page.vue",
"content": "<script lang=\"ts\">\nexport const description = 'A sidebar in a dialog.'\nexport const iframeHeight = '800px'\n</script>\n\n<script setup lang=\"ts\">\nimport SettingsDialog from '@/registry/new-york/block/Sidebar13/components/SettingsDialog.vue'\n</script>\n\n<template>\n <div className=\"flex h-svh items-center justify-center\">\n <SettingsDialog />\n </div>\n</template>\n",
"content": "<script lang=\"ts\">\nexport const description = 'A sidebar in a dialog.'\nexport const iframeHeight = '800px'\n</script>\n\n<script setup lang=\"ts\">\nimport SettingsDialog from '@/registry/default/block/Sidebar13/components/SettingsDialog.vue'\n</script>\n\n<template>\n <div class=\"flex h-svh items-center justify-center\">\n <SettingsDialog />\n </div>\n</template>\n",
"type": "registry:page",
"target": "pages/dashboard/index.vue"
},
{
"path": "block/Sidebar13/components/SettingsDialog.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbList,\n BreadcrumbPage,\n BreadcrumbSeparator,\n} from '@/registry/new-york/ui/breadcrumb'\n\nimport { Button } from '@/registry/new-york/ui/button'\nimport {\n Dialog,\n DialogContent,\n DialogDescription,\n DialogTitle,\n DialogTrigger,\n} from '@/registry/new-york/ui/dialog'\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n Bell,\n Check,\n Globe,\n Home,\n Keyboard,\n Link,\n Lock,\n Menu,\n MessageCircle,\n Paintbrush,\n Settings,\n Video,\n} from 'lucide-vue-next'\nimport { ref } from 'vue'\n\nconst data = {\n nav: [\n { name: 'Notifications', icon: Bell },\n { name: 'Navigation', icon: Menu },\n { name: 'Home', icon: Home },\n { name: 'Appearance', icon: Paintbrush },\n { name: 'Messages & media', icon: MessageCircle },\n { name: 'Language & region', icon: Globe },\n { name: 'Accessibility', icon: Keyboard },\n { name: 'Mark as read', icon: Check },\n { name: 'Audio & video', icon: Video },\n { name: 'Connected accounts', icon: Link },\n { name: 'Privacy & visibility', icon: Lock },\n { name: 'Advanced', icon: Settings },\n ],\n}\n\nconst open = ref(true)\n</script>\n\n<template>\n <Dialog v-model:open=\"open\">\n <DialogTrigger as-child>\n <Button size=\"sm\">\n Open Dialog\n </Button>\n </DialogTrigger>\n <DialogContent class=\"overflow-hidden p-0 md:max-h-[500px] md:max-w-[700px] lg:max-w-[800px]\">\n <DialogTitle class=\"sr-only\">\n Settings\n </DialogTitle>\n <DialogDescription class=\"sr-only\">\n Customize your settings here.\n </DialogDescription>\n <SidebarProvider class=\"items-start\">\n <Sidebar collapsible=\"none\" class=\"hidden md:flex\">\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in data.nav\" :key=\"item.name\">\n <SidebarMenuButton\n as-child\n :is-active=\"item.name === 'Messages & media'\"\n >\n <a href=\"#\">\n <component :is=\"item.icon\" />\n <span>{{ item.name }}</span>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n <main class=\"flex h-[480px] flex-1 flex-col overflow-hidden\">\n <header class=\"flex h-16 shrink-0 items-center gap-2 transition-[width,height] ease-linear group-has-[[data-collapsible=icon]]/sidebar-wrapper:h-12\">\n <div class=\"flex items-center gap-2 px-4\">\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem class=\"hidden md:block\">\n <BreadcrumbLink href=\"#\">\n Settings\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator class=\"hidden md:block\" />\n <BreadcrumbItem>\n <BreadcrumbPage>Messages & media</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n </div>\n </header>\n <div class=\"flex flex-1 flex-col gap-4 overflow-y-auto p-4 pt-0\">\n <div\n v-for=\"i in 10\"\n :key=\"i\"\n class=\"aspect-video max-w-3xl rounded-xl bg-muted/50\"\n />\n </div>\n </main>\n </SidebarProvider>\n </DialogContent>\n </Dialog>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbList,\n BreadcrumbPage,\n BreadcrumbSeparator,\n} from '@/registry/default/ui/breadcrumb'\n\nimport { Button } from '@/registry/default/ui/button'\nimport {\n Dialog,\n DialogContent,\n DialogDescription,\n DialogTitle,\n DialogTrigger,\n} from '@/registry/default/ui/dialog'\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n} from '@/registry/default/ui/sidebar'\nimport {\n Bell,\n Check,\n Globe,\n Home,\n Keyboard,\n Link,\n Lock,\n Menu,\n MessageCircle,\n Paintbrush,\n Settings,\n Video,\n} from 'lucide-vue-next'\nimport { ref } from 'vue'\n\nconst data = {\n nav: [\n { name: 'Notifications', icon: Bell },\n { name: 'Navigation', icon: Menu },\n { name: 'Home', icon: Home },\n { name: 'Appearance', icon: Paintbrush },\n { name: 'Messages & media', icon: MessageCircle },\n { name: 'Language & region', icon: Globe },\n { name: 'Accessibility', icon: Keyboard },\n { name: 'Mark as read', icon: Check },\n { name: 'Audio & video', icon: Video },\n { name: 'Connected accounts', icon: Link },\n { name: 'Privacy & visibility', icon: Lock },\n { name: 'Advanced', icon: Settings },\n ],\n}\n\nconst open = ref(true)\n</script>\n\n<template>\n <Dialog v-model:open=\"open\">\n <DialogTrigger as-child>\n <Button size=\"sm\">\n Open Dialog\n </Button>\n </DialogTrigger>\n <DialogContent class=\"overflow-hidden p-0 md:max-h-[500px] md:max-w-[700px] lg:max-w-[800px]\">\n <DialogTitle class=\"sr-only\">\n Settings\n </DialogTitle>\n <DialogDescription class=\"sr-only\">\n Customize your settings here.\n </DialogDescription>\n <SidebarProvider class=\"items-start\">\n <Sidebar collapsible=\"none\" class=\"hidden md:flex\">\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in data.nav\" :key=\"item.name\">\n <SidebarMenuButton\n as-child\n :is-active=\"item.name === 'Messages & media'\"\n >\n <a href=\"#\">\n <component :is=\"item.icon\" />\n <span>{{ item.name }}</span>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n <main class=\"flex h-[480px] flex-1 flex-col overflow-hidden\">\n <header class=\"flex h-16 shrink-0 items-center gap-2 transition-[width,height] ease-linear group-has-[[data-collapsible=icon]]/sidebar-wrapper:h-12\">\n <div class=\"flex items-center gap-2 px-4\">\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem class=\"hidden md:block\">\n <BreadcrumbLink href=\"#\">\n Settings\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator class=\"hidden md:block\" />\n <BreadcrumbItem>\n <BreadcrumbPage>Messages & media</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n </div>\n </header>\n <div class=\"flex flex-1 flex-col gap-4 overflow-y-auto p-4 pt-0\">\n <div\n v-for=\"i in 10\"\n :key=\"i\"\n class=\"aspect-video max-w-3xl rounded-xl bg-muted/50\"\n />\n </div>\n </main>\n </SidebarProvider>\n </DialogContent>\n </Dialog>\n</template>\n",
"type": "registry:component",
"target": ""
}

4
apps/www/src/public/r/styles/default/Sidebar14.json
View File

@ -10,13 +10,13 @@
"files": [
{
"path": "block/Sidebar14/page.vue",
"content": "<script lang=\"ts\">\nexport const iframeHeight = '800px'\nexport const description = 'A sidebar on the right.'\n</script>\n\n<script setup lang=\"ts\">\nimport AppSidebar from '@/registry/new-york/block/Sidebar14/components/AppSidebar.vue'\nimport {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbList,\n BreadcrumbPage,\n BreadcrumbSeparator,\n} from '@/registry/new-york/ui/breadcrumb'\nimport {\n SidebarInset,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/new-york/ui/sidebar'\n</script>\n\n<template>\n <SidebarProvider>\n <SidebarInset>\n <header class=\"flex h-16 shrink-0 items-center gap-2 border-b px-4\">\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem class=\"hidden md:block\">\n <BreadcrumbLink href=\"#\">\n Building Your Application\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator class=\"hidden md:block\" />\n <BreadcrumbItem>\n <BreadcrumbPage>Data Fetching</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n <SidebarTrigger class=\"-mr-1 ml-auto rotate-180\" />\n </header>\n <div class=\"flex flex-1 flex-col gap-4 p-4\">\n <div class=\"grid auto-rows-min gap-4 md:grid-cols-3\">\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n </div>\n <div class=\"min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min\" />\n </div>\n </SidebarInset>\n <AppSidebar side=\"right\" />\n </SidebarProvider>\n</template>\n",
"content": "<script lang=\"ts\">\nexport const iframeHeight = '800px'\nexport const description = 'A sidebar on the right.'\n</script>\n\n<script setup lang=\"ts\">\nimport AppSidebar from '@/registry/default/block/Sidebar14/components/AppSidebar.vue'\nimport {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbList,\n BreadcrumbPage,\n BreadcrumbSeparator,\n} from '@/registry/default/ui/breadcrumb'\nimport {\n SidebarInset,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/default/ui/sidebar'\n</script>\n\n<template>\n <SidebarProvider>\n <SidebarInset>\n <header class=\"flex h-16 shrink-0 items-center gap-2 border-b px-4\">\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem class=\"hidden md:block\">\n <BreadcrumbLink href=\"#\">\n Building Your Application\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator class=\"hidden md:block\" />\n <BreadcrumbItem>\n <BreadcrumbPage>Data Fetching</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n <SidebarTrigger class=\"-mr-1 ml-auto rotate-180\" />\n </header>\n <div class=\"flex flex-1 flex-col gap-4 p-4\">\n <div class=\"grid auto-rows-min gap-4 md:grid-cols-3\">\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n <div class=\"aspect-video rounded-xl bg-muted/50\" />\n </div>\n <div class=\"min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min\" />\n </div>\n </SidebarInset>\n <AppSidebar side=\"right\" />\n </SidebarProvider>\n</template>\n",
"type": "registry:page",
"target": "pages/dashboard/index.vue"
},
{
"path": "block/Sidebar14/components/AppSidebar.vue",
"content": "<script setup lang=\"ts\">\nimport type {\n SidebarProps,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n SidebarRail,\n} from '@/registry/new-york/ui/sidebar'\n\nconst props = defineProps<SidebarProps>()\n\n// This is sample data.\nconst data = {\n navMain: [\n {\n title: 'Getting Started',\n url: '#',\n items: [\n {\n title: 'Installation',\n url: '#',\n },\n {\n title: 'Project Structure',\n url: '#',\n },\n ],\n },\n {\n title: 'Building Your Application',\n url: '#',\n items: [\n {\n title: 'Routing',\n url: '#',\n },\n {\n title: 'Data Fetching',\n url: '#',\n isActive: true,\n },\n {\n title: 'Rendering',\n url: '#',\n },\n {\n title: 'Caching',\n url: '#',\n },\n {\n title: 'Styling',\n url: '#',\n },\n {\n title: 'Optimizing',\n url: '#',\n },\n {\n title: 'Configuring',\n url: '#',\n },\n {\n title: 'Testing',\n url: '#',\n },\n {\n title: 'Authentication',\n url: '#',\n },\n {\n title: 'Deploying',\n url: '#',\n },\n {\n title: 'Upgrading',\n url: '#',\n },\n {\n title: 'Examples',\n url: '#',\n },\n ],\n },\n {\n title: 'API Reference',\n url: '#',\n items: [\n {\n title: 'Components',\n url: '#',\n },\n {\n title: 'File Conventions',\n url: '#',\n },\n {\n title: 'Functions',\n url: '#',\n },\n {\n title: 'next.config.js Options',\n url: '#',\n },\n {\n title: 'CLI',\n url: '#',\n },\n {\n title: 'Edge Runtime',\n url: '#',\n },\n ],\n },\n {\n title: 'Architecture',\n url: '#',\n items: [\n {\n title: 'Accessibility',\n url: '#',\n },\n {\n title: 'Fast Refresh',\n url: '#',\n },\n {\n title: 'Next.js Compiler',\n url: '#',\n },\n {\n title: 'Supported Browsers',\n url: '#',\n },\n {\n title: 'Turbopack',\n url: '#',\n },\n ],\n },\n {\n title: 'Community',\n url: '#',\n items: [\n {\n title: 'Contribution Guide',\n url: '#',\n },\n ],\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Table of Contents</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in data.navMain\" :key=\"item.title\">\n <SidebarMenuButton as-child>\n <a :href=\"item.url\" className=\"font-medium\">\n {{ item.title }}\n </a>\n </SidebarMenuButton>\n <SidebarMenuSub v-if=\"item.items.length\">\n <SidebarMenuSubItem v-for=\"subItem in item.items\" :key=\"subItem.title\">\n <SidebarMenuSubButton\n as-child\n :is-active=\"subItem.isActive\"\n >\n <a :href=\"subItem.url\">{{ subItem.title }}</a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n <SidebarRail />\n </Sidebar>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport type {\n SidebarProps,\n} from '@/registry/default/ui/sidebar'\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n SidebarRail,\n} from '@/registry/default/ui/sidebar'\n\nconst props = defineProps<SidebarProps>()\n\n// This is sample data.\nconst data = {\n navMain: [\n {\n title: 'Getting Started',\n url: '#',\n items: [\n {\n title: 'Installation',\n url: '#',\n },\n {\n title: 'Project Structure',\n url: '#',\n },\n ],\n },\n {\n title: 'Building Your Application',\n url: '#',\n items: [\n {\n title: 'Routing',\n url: '#',\n },\n {\n title: 'Data Fetching',\n url: '#',\n isActive: true,\n },\n {\n title: 'Rendering',\n url: '#',\n },\n {\n title: 'Caching',\n url: '#',\n },\n {\n title: 'Styling',\n url: '#',\n },\n {\n title: 'Optimizing',\n url: '#',\n },\n {\n title: 'Configuring',\n url: '#',\n },\n {\n title: 'Testing',\n url: '#',\n },\n {\n title: 'Authentication',\n url: '#',\n },\n {\n title: 'Deploying',\n url: '#',\n },\n {\n title: 'Upgrading',\n url: '#',\n },\n {\n title: 'Examples',\n url: '#',\n },\n ],\n },\n {\n title: 'API Reference',\n url: '#',\n items: [\n {\n title: 'Components',\n url: '#',\n },\n {\n title: 'File Conventions',\n url: '#',\n },\n {\n title: 'Functions',\n url: '#',\n },\n {\n title: 'next.config.js Options',\n url: '#',\n },\n {\n title: 'CLI',\n url: '#',\n },\n {\n title: 'Edge Runtime',\n url: '#',\n },\n ],\n },\n {\n title: 'Architecture',\n url: '#',\n items: [\n {\n title: 'Accessibility',\n url: '#',\n },\n {\n title: 'Fast Refresh',\n url: '#',\n },\n {\n title: 'Next.js Compiler',\n url: '#',\n },\n {\n title: 'Supported Browsers',\n url: '#',\n },\n {\n title: 'Turbopack',\n url: '#',\n },\n ],\n },\n {\n title: 'Community',\n url: '#',\n items: [\n {\n title: 'Contribution Guide',\n url: '#',\n },\n ],\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Table of Contents</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in data.navMain\" :key=\"item.title\">\n <SidebarMenuButton as-child>\n <a :href=\"item.url\" class=\"font-medium\">\n {{ item.title }}\n </a>\n </SidebarMenuButton>\n <SidebarMenuSub v-if=\"item.items.length\">\n <SidebarMenuSubItem v-for=\"subItem in item.items\" :key=\"subItem.title\">\n <SidebarMenuSubButton\n as-child\n :is-active=\"subItem.isActive\"\n >\n <a :href=\"subItem.url\">{{ subItem.title }}</a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n <SidebarRail />\n </Sidebar>\n</template>\n",
"type": "registry:component",
"target": ""
}

24
apps/www/src/public/r/styles/default/Sidebar15.json
View File

File diff suppressed because one or more lines are too long

16
apps/www/src/public/r/styles/new-york/DemoSidebar.json Normal file
View File

@ -0,0 +1,16 @@
{
"name": "DemoSidebar",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"sidebar"
],
"files": [
{
"path": "block/DemoSidebar.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarInset,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/new-york/ui/sidebar'\n\nimport { Calendar, Home, Inbox, Search, Settings } from 'lucide-vue-next'\n\n// Menu items.\nconst items = [\n {\n title: 'Home',\n url: '#',\n icon: Home,\n },\n {\n title: 'Inbox',\n url: '#',\n icon: Inbox,\n },\n {\n title: 'Calendar',\n url: '#',\n icon: Calendar,\n },\n {\n title: 'Search',\n url: '#',\n icon: Search,\n },\n {\n title: 'Settings',\n url: '#',\n icon: Settings,\n },\n]\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Application</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in items\" :key=\"item.title\">\n <SidebarMenuButton as-child>\n <a :href=\"item.url\">\n <component :is=\"item.icon\" />\n <span>{{ item.title }}</span>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n <SidebarInset>\n <header class=\"flex items-center justify-between px-4 h-12\">\n <SidebarTrigger />\n </header>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

17
apps/www/src/public/r/styles/new-york/DemoSidebarControlled.json Normal file
View File

@ -0,0 +1,17 @@
{
"name": "DemoSidebarControlled",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"button",
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarControlled.vue",
"content": "<script setup lang=\"ts\">\nimport { Button } from '@/registry/new-york/ui/button'\n\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarInset,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n Frame,\n LifeBuoy,\n Map,\n PanelLeftClose,\n PanelLeftOpen,\n PieChart,\n Send,\n} from 'lucide-vue-next'\nimport { ref } from 'vue'\n\nconst projects = [\n {\n name: 'Design Engineering',\n url: '#',\n icon: Frame,\n },\n {\n name: 'Sales & Marketing',\n url: '#',\n icon: PieChart,\n },\n {\n name: 'Travel',\n url: '#',\n icon: Map,\n },\n {\n name: 'Support',\n url: '#',\n icon: LifeBuoy,\n },\n {\n name: 'Feedback',\n url: '#',\n icon: Send,\n },\n]\n\nconst open = ref(true)\n</script>\n\n<template>\n <SidebarProvider v-model:open=\"open\">\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Projects</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"project in projects\" :key=\"project.name\">\n <SidebarMenuButton as-child>\n <a :href=\"project.url\">\n <component :is=\"project.icon\" />\n <span>{{ project.name }}</span>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n <SidebarInset>\n <header className=\"flex items-center h-12 px-4 justify-between\">\n <Button\n size=\"sm\"\n variant=\"ghost\"\n @click=\"open = !open\"\n >\n <PanelLeftClose v-if=\"open\" />\n <PanelLeftOpen v-else />\n <span>{{ open ? 'Close' : 'Open' }} Sidebar</span>\n </Button>\n </header>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

17
apps/www/src/public/r/styles/new-york/DemoSidebarFooter.json Normal file
View File

@ -0,0 +1,17 @@
{
"name": "DemoSidebarFooter",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"dropdown-menu",
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarFooter.vue",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\n\nimport {\n Sidebar,\n SidebarContent,\n SidebarFooter,\n SidebarHeader,\n SidebarInset,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/new-york/ui/sidebar'\nimport { ChevronDown, ChevronUp, User2 } from 'lucide-vue-next'\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarHeader />\n <SidebarContent />\n <SidebarFooter>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\">\n Username\n <ChevronUp class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n side=\"top\"\n class=\"w-[--reka-popper-anchor-width]\"\n >\n <DropdownMenuItem>\n <span>Account</span>\n </DropdownMenuItem>\n <DropdownMenuItem>\n <span>Billing</span>\n </DropdownMenuItem>\n <DropdownMenuItem>\n <span>Sign out</span>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarFooter>\n </Sidebar>\n <SidebarInset>\n <header class=\"flex items-center justify-between px-4 h-12\">\n <SidebarTrigger />\n </header>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

16
apps/www/src/public/r/styles/new-york/DemoSidebarGroup.json Normal file
View File

@ -0,0 +1,16 @@
{
"name": "DemoSidebarGroup",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarGroup.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n} from '@/registry/new-york/ui/sidebar'\n\nimport { LifeBuoy, Send } from 'lucide-vue-next'\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Help</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton>\n <LifeBuoy />\n Support\n </SidebarMenuButton>\n </SidebarMenuItem>\n <SidebarMenuItem>\n <SidebarMenuButton>\n <Send />\n Feedback\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

18
apps/www/src/public/r/styles/new-york/DemoSidebarGroupAction.json Normal file
View File

@ -0,0 +1,18 @@
{
"name": "DemoSidebarGroupAction",
"type": "registry:block",
"dependencies": [
"vue-sonner"
],
"registryDependencies": [
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarGroupAction.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupAction,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n ChevronDown,\n Frame,\n LifeBuoy,\n Map,\n PieChart,\n Plus,\n Send,\n} from 'lucide-vue-next'\n\nimport { toast, Toaster } from 'vue-sonner'\n</script>\n\n<template>\n <SidebarProvider>\n <Toaster\n position=\"bottom-left\"\n :toast-options=\"{\n class: 'ml-[160px]',\n }\"\n />\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Projects</SidebarGroupLabel>\n <SidebarGroupAction\n title=\"Add Project\"\n @click=\"() => toast('You clicked the group action!')\"\n >\n <Plus /> <span class=\"sr-only\">Add Project</span>\n </SidebarGroupAction>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton as-child>\n <a href=\"#\">\n <Frame />\n <span>Design Engineering</span>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n <SidebarMenuItem>\n <SidebarMenuButton as-child>\n <a href=\"#\">\n <PieChart />\n <span>Sales & Marketing</span>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n <SidebarMenuItem>\n <SidebarMenuButton as-child>\n <a href=\"#\">\n <Map />\n <span>Travel</span>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

17
apps/www/src/public/r/styles/new-york/DemoSidebarGroupCollapsible.json Normal file
View File

@ -0,0 +1,17 @@
{
"name": "DemoSidebarGroupCollapsible",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"collapsible",
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarGroupCollapsible.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '@/registry/new-york/ui/collapsible'\n\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n} from '@/registry/new-york/ui/sidebar'\nimport { ChevronDown, LifeBuoy, Send } from 'lucide-vue-next'\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarContent>\n <Collapsible :default-open=\"true\" class=\"group/collapsible\">\n <SidebarGroup>\n <SidebarGroupLabel\n as-child\n class=\"text-sm hover:bg-sidebar-accent hover:text-sidebar-accent-foreground\"\n >\n <CollapsibleTrigger>\n Help\n <ChevronDown class=\"ml-auto transition-transform group-data-[state=open]/collapsible:rotate-180\" />\n </CollapsibleTrigger>\n </SidebarGroupLabel>\n <CollapsibleContent>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton>\n <LifeBuoy />\n Support\n </SidebarMenuButton>\n </SidebarMenuItem>\n <SidebarMenuItem>\n <SidebarMenuButton>\n <Send />\n Feedback\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </CollapsibleContent>\n </SidebarGroup>\n </Collapsible>\n </SidebarContent>\n </Sidebar>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

17
apps/www/src/public/r/styles/new-york/DemoSidebarHeader.json Normal file
View File

@ -0,0 +1,17 @@
{
"name": "DemoSidebarHeader",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"dropdown-menu",
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarHeader.vue",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\n\nimport {\n Sidebar,\n SidebarHeader,\n SidebarInset,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n SidebarTrigger,\n} from '@/registry/new-york/ui/sidebar'\nimport { ChevronDown } from 'lucide-vue-next'\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarHeader>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\">\n Select Workspace\n <ChevronDown class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent class=\"w-[--reka-popper-anchor-width]\">\n <DropdownMenuItem>\n <span>Acme Inc</span>\n </DropdownMenuItem>\n <DropdownMenuItem>\n <span>Acme Corp.</span>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarHeader>\n </Sidebar>\n <SidebarInset>\n <header class=\"flex items-center justify-between px-4 h-12\">\n <SidebarTrigger />\n </header>\n </SidebarInset>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

16
apps/www/src/public/r/styles/new-york/DemoSidebarMenu.json Normal file
View File

@ -0,0 +1,16 @@
{
"name": "DemoSidebarMenu",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarMenu.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n} from '@/registry/new-york/ui/sidebar'\n\nimport { Frame, LifeBuoy, Map, PieChart, Send } from 'lucide-vue-next'\n\nconst projects = [\n {\n name: 'Design Engineering',\n url: '#',\n icon: Frame,\n },\n {\n name: 'Sales & Marketing',\n url: '#',\n icon: PieChart,\n },\n {\n name: 'Travel',\n url: '#',\n icon: Map,\n },\n {\n name: 'Support',\n url: '#',\n icon: LifeBuoy,\n },\n {\n name: 'Feedback',\n url: '#',\n icon: Send,\n },\n]\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Projects</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"project in projects\" :key=\"project.name\">\n <SidebarMenuButton as-child>\n <a :href=\"project.url\">\n <component :is=\"project.icon\" />\n <span>{{ project.name }}</span>\n </a>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

17
apps/www/src/public/r/styles/new-york/DemoSidebarMenuAction.json Normal file
View File

@ -0,0 +1,17 @@
{
"name": "DemoSidebarMenuAction",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"dropdown-menu",
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarMenuAction.vue",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\n\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuAction,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n Frame,\n LifeBuoy,\n Map,\n MoreHorizontal,\n PieChart,\n Send,\n} from 'lucide-vue-next'\n\nconst projects = [\n {\n name: 'Design Engineering',\n url: '#',\n icon: Frame,\n },\n {\n name: 'Sales & Marketing',\n url: '#',\n icon: PieChart,\n },\n {\n name: 'Travel',\n url: '#',\n icon: Map,\n },\n {\n name: 'Support',\n url: '#',\n icon: LifeBuoy,\n },\n {\n name: 'Feedback',\n url: '#',\n icon: Send,\n },\n]\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Projects</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"project in projects\" :key=\"project.name\">\n <SidebarMenuButton\n as-child\n class=\"group-has-[[data-state=open]]/menu-item:bg-sidebar-accent\"\n >\n <a :href=\"project.url\">\n <component :is=\"project.icon\" />\n <span>{{ project.name }}</span>\n </a>\n </SidebarMenuButton>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuAction>\n <MoreHorizontal />\n <span class=\"sr-only\">More</span>\n </SidebarMenuAction>\n </DropdownMenuTrigger>\n <DropdownMenuContent side=\"right\" align=\"start\">\n <DropdownMenuItem>\n <span>Edit Project</span>\n </DropdownMenuItem>\n <DropdownMenuItem>\n <span>Delete Project</span>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

16
apps/www/src/public/r/styles/new-york/DemoSidebarMenuBadge.json Normal file
View File

@ -0,0 +1,16 @@
{
"name": "DemoSidebarMenuBadge",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarMenuBadge.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuBadge,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarProvider,\n} from '@/registry/new-york/ui/sidebar'\n\nimport { Frame, LifeBuoy, Map, PieChart, Send } from 'lucide-vue-next'\n\nconst projects = [\n {\n name: 'Design Engineering',\n url: '#',\n icon: Frame,\n badge: '24',\n },\n {\n name: 'Sales & Marketing',\n url: '#',\n icon: PieChart,\n badge: '12',\n },\n {\n name: 'Travel',\n url: '#',\n icon: Map,\n badge: '3',\n },\n {\n name: 'Support',\n url: '#',\n icon: LifeBuoy,\n badge: '21',\n },\n {\n name: 'Feedback',\n url: '#',\n icon: Send,\n badge: '8',\n },\n]\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Projects</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"project in projects\" :key=\"project.name\">\n <SidebarMenuButton\n as-child\n class=\"group-has-[[data-state=open]]/menu-item:bg-sidebar-accent\"\n >\n <a :href=\"project.url\">\n <component :is=\"project.icon\" />\n <span>{{ project.name }}</span>\n </a>\n </SidebarMenuButton>\n <SidebarMenuBadge>{{ project.badge }}</SidebarMenuBadge>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

17
apps/www/src/public/r/styles/new-york/DemoSidebarMenuCollapsible.json Normal file
View File

@ -0,0 +1,17 @@
{
"name": "DemoSidebarMenuCollapsible",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"collapsible",
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarMenuCollapsible.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '@/registry/new-york/ui/collapsible'\n\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n SidebarProvider,\n} from '@/registry/new-york/ui/sidebar'\nimport { ChevronRight } from 'lucide-vue-next'\n\nconst items = [\n {\n title: 'Getting Started',\n url: '#',\n items: [\n {\n title: 'Installation',\n url: '#',\n },\n {\n title: 'Project Structure',\n url: '#',\n },\n ],\n },\n {\n title: 'Building Your Application',\n url: '#',\n items: [\n {\n title: 'Routing',\n url: '#',\n },\n {\n title: 'Data Fetching',\n url: '#',\n isActive: true,\n },\n {\n title: 'Rendering',\n url: '#',\n },\n {\n title: 'Caching',\n url: '#',\n },\n {\n title: 'Styling',\n url: '#',\n },\n {\n title: 'Optimizing',\n url: '#',\n },\n {\n title: 'Configuring',\n url: '#',\n },\n {\n title: 'Testing',\n url: '#',\n },\n {\n title: 'Authentication',\n url: '#',\n },\n {\n title: 'Deploying',\n url: '#',\n },\n {\n title: 'Upgrading',\n url: '#',\n },\n {\n title: 'Examples',\n url: '#',\n },\n ],\n },\n {\n title: 'API Reference',\n url: '#',\n items: [\n {\n title: 'Components',\n url: '#',\n },\n {\n title: 'File Conventions',\n url: '#',\n },\n {\n title: 'Functions',\n url: '#',\n },\n {\n title: 'next.config.js Options',\n url: '#',\n },\n {\n title: 'CLI',\n url: '#',\n },\n {\n title: 'Edge Runtime',\n url: '#',\n },\n ],\n },\n {\n title: 'Architecture',\n url: '#',\n items: [\n {\n title: 'Accessibility',\n url: '#',\n },\n {\n title: 'Fast Refresh',\n url: '#',\n },\n {\n title: 'Next.js Compiler',\n url: '#',\n },\n {\n title: 'Supported Browsers',\n url: '#',\n },\n {\n title: 'Turbopack',\n url: '#',\n },\n ],\n },\n]\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupContent>\n <SidebarMenu>\n <Collapsible\n v-for=\"(item, index) in items\"\n :key=\"index\"\n class=\"group/collapsible\"\n :default-open=\"index === 0\"\n >\n <SidebarMenuItem>\n <CollapsibleTrigger as-child>\n <SidebarMenuButton>\n <span>{{ item.title }}</span>\n <ChevronRight class=\"transition-transform ml-auto group-data-[state=open]/collapsible:rotate-90\" />\n </SidebarMenuButton>\n </CollapsibleTrigger>\n <CollapsibleContent>\n <SidebarMenuSub>\n <SidebarMenuSubItem v-for=\"(subItem, subIndex) in item.items\" :key=\"subIndex\">\n <SidebarMenuSubButton as-child>\n <a :href=\"subItem.url\">\n <span>{{ subItem.title }}</span>\n </a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </CollapsibleContent>\n </SidebarMenuItem>\n </Collapsible>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

16
apps/www/src/public/r/styles/new-york/DemoSidebarMenuSub.json Normal file
View File

@ -0,0 +1,16 @@
{
"name": "DemoSidebarMenuSub",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"sidebar"
],
"files": [
{
"path": "block/DemoSidebarMenuSub.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n SidebarProvider,\n} from '@/registry/new-york/ui/sidebar'\n\nconst items = [\n {\n title: 'Getting Started',\n url: '#',\n items: [\n {\n title: 'Installation',\n url: '#',\n },\n {\n title: 'Project Structure',\n url: '#',\n },\n ],\n },\n {\n title: 'Building Your Application',\n url: '#',\n items: [\n {\n title: 'Routing',\n url: '#',\n },\n {\n title: 'Data Fetching',\n url: '#',\n isActive: true,\n },\n {\n title: 'Rendering',\n url: '#',\n },\n {\n title: 'Caching',\n url: '#',\n },\n {\n title: 'Styling',\n url: '#',\n },\n {\n title: 'Optimizing',\n url: '#',\n },\n {\n title: 'Configuring',\n url: '#',\n },\n {\n title: 'Testing',\n url: '#',\n },\n {\n title: 'Authentication',\n url: '#',\n },\n {\n title: 'Deploying',\n url: '#',\n },\n {\n title: 'Upgrading',\n url: '#',\n },\n {\n title: 'Examples',\n url: '#',\n },\n ],\n },\n {\n title: 'API Reference',\n url: '#',\n items: [\n {\n title: 'Components',\n url: '#',\n },\n {\n title: 'File Conventions',\n url: '#',\n },\n {\n title: 'Functions',\n url: '#',\n },\n {\n title: 'next.config.js Options',\n url: '#',\n },\n {\n title: 'CLI',\n url: '#',\n },\n {\n title: 'Edge Runtime',\n url: '#',\n },\n ],\n },\n {\n title: 'Architecture',\n url: '#',\n items: [\n {\n title: 'Accessibility',\n url: '#',\n },\n {\n title: 'Fast Refresh',\n url: '#',\n },\n {\n title: 'Next.js Compiler',\n url: '#',\n },\n {\n title: 'Supported Browsers',\n url: '#',\n },\n {\n title: 'Turbopack',\n url: '#',\n },\n ],\n },\n]\n</script>\n\n<template>\n <SidebarProvider>\n <Sidebar>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"(item, index) in items\" :key=\"index\">\n <SidebarMenuButton as-child>\n <a :href=\"item.url\">\n <span>{{ item.title }}</span>\n </a>\n </SidebarMenuButton>\n <SidebarMenuSub>\n <SidebarMenuSubItem v-for=\"(subItem, subIndex) in item.items\" :key=\"subIndex\">\n <SidebarMenuSubButton as-child>\n <a :href=\"subItem.url\">\n <span>{{ subItem.title }}</span>\n </a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n </Sidebar>\n </SidebarProvider>\n</template>\n",
"type": "registry:block",
"target": "pages/dashboard/index.vue"
}
]
}

26
apps/www/src/public/r/styles/new-york/Login01.json Normal file
View File

@ -0,0 +1,26 @@
{
"name": "Login01",
"type": "registry:block",
"dependencies": [],
"registryDependencies": [
"LoginForm.vue",
"button",
"card",
"input",
"label"
],
"files": [
{
"path": "block/Login01/page.vue",
"content": "<script lang=\"ts\">\nexport const description\n = 'A simple login form with email and password. The submit button says \\'Sign in\\'.'\nexport const iframeHeight = '870px'\nexport const containerClass = 'w-full h-full'\n</script>\n\n<script setup lang=\"ts\">\nimport LoginForm from '@/registry/new-york/block/Login01/components/LoginForm.vue'\n</script>\n\n<template>\n <div className=\"flex h-screen w-full items-center justify-center px-4\">\n <LoginForm />\n </div>\n</template>\n",
"type": "registry:page",
"target": "pages/dashboard/index.vue"
},
{
"path": "block/Login01/components/LoginForm.vue",
"content": "<script setup lang=\"ts\">\nimport { Button } from '@/registry/new-york/ui/button'\nimport {\n Card,\n CardContent,\n CardDescription,\n CardHeader,\n CardTitle,\n} from '@/registry/new-york/ui/card'\nimport { Input } from '@/registry/new-york/ui/input'\nimport { Label } from '@/registry/new-york/ui/label'\n</script>\n\n<template>\n <Card class=\"mx-auto max-w-sm\">\n <CardHeader>\n <CardTitle class=\"text-2xl\">\n Login\n </CardTitle>\n <CardDescription>\n Enter your email below to login to your account\n </CardDescription>\n </CardHeader>\n <CardContent>\n <div class=\"grid gap-4\">\n <div class=\"grid gap-2\">\n <Label for=\"email\">Email</Label>\n <Input\n id=\"email\"\n type=\"email\"\n placeholder=\"m@example.com\"\n required\n />\n </div>\n <div class=\"grid gap-2\">\n <div class=\"flex items-center\">\n <Label for=\"password\">Password</Label>\n <a href=\"#\" class=\"ml-auto inline-block text-sm underline\">\n Forgot your password?\n </a>\n </div>\n <Input id=\"password\" type=\"password\" required />\n </div>\n <Button type=\"submit\" class=\"w-full\">\n Login\n </Button>\n <Button variant=\"outline\" class=\"w-full\">\n Login with Google\n </Button>\n </div>\n <div class=\"mt-4 text-center text-sm\">\n Don't have an account?\n <a href=\"#\" class=\"underline\">\n Sign up\n </a>\n </div>\n </CardContent>\n </Card>\n</template>\n",
"type": "registry:component",
"target": ""
}
]
}

2
apps/www/src/public/r/styles/new-york/Sidebar01.json
View File

@ -33,7 +33,7 @@
},
{
"path": "block/Sidebar01/components/VersionSwitcher.vue",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\n\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n} from '@/registry/new-york/ui/sidebar'\nimport { Check, ChevronsUpDown, GalleryVerticalEnd } from 'lucide-vue-next'\n\nimport { ref } from 'vue'\n\nconst props = defineProps<{\n versions: string[]\n defaultVersion: string\n}>()\n\nconst selectedVersion = ref(props.defaultVersion)\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <GalleryVerticalEnd class=\"size-4\" />\n </div>\n <div class=\"flex flex-col gap-0.5 leading-none\">\n <span class=\"font-semibold\">Documentation</span>\n <span class=\"\">v{{ selectedVersion }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--radix-dropdown-menu-trigger-width]\"\n align=\"start\"\n >\n <DropdownMenuItem\n v-for=\"version in versions\"\n :key=\"version\"\n @select=\"selectedVersion = version\"\n >\n v{{ version }}\n <Check v-if=\"version === selectedVersion\" class=\"ml-auto\" />\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\n\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n} from '@/registry/new-york/ui/sidebar'\nimport { Check, ChevronsUpDown, GalleryVerticalEnd } from 'lucide-vue-next'\n\nimport { ref } from 'vue'\n\nconst props = defineProps<{\n versions: string[]\n defaultVersion: string\n}>()\n\nconst selectedVersion = ref(props.defaultVersion)\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <GalleryVerticalEnd class=\"size-4\" />\n </div>\n <div class=\"flex flex-col gap-0.5 leading-none\">\n <span class=\"font-semibold\">Documentation</span>\n <span class=\"\">v{{ selectedVersion }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--reka-dropdown-menu-trigger-width]\"\n align=\"start\"\n >\n <DropdownMenuItem\n v-for=\"version in versions\"\n :key=\"version\"\n @select=\"selectedVersion = version\"\n >\n v{{ version }}\n <Check v-if=\"version === selectedVersion\" class=\"ml-auto\" />\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"type": "registry:component",
"target": ""
}

2
apps/www/src/public/r/styles/new-york/Sidebar02.json
View File

@ -34,7 +34,7 @@
},
{
"path": "block/Sidebar02/components/VersionSwitcher.vue",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\n\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n} from '@/registry/new-york/ui/sidebar'\nimport { Check, ChevronsUpDown, GalleryVerticalEnd } from 'lucide-vue-next'\nimport { ref } from 'vue'\n\nconst props = defineProps<{\n versions: string[]\n defaultVersion: string\n}>()\n\nconst selectedVersion = ref(props.defaultVersion)\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <GalleryVerticalEnd class=\"size-4\" />\n </div>\n <div class=\"flex flex-col gap-0.5 leading-none\">\n <span class=\"font-semibold\">Documentation</span>\n <span class=\"\">v{{ selectedVersion }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--radix-dropdown-menu-trigger-width]\"\n align=\"start\"\n >\n <DropdownMenuItem\n v-for=\"version in versions\"\n :key=\"version\"\n @select=\"selectedVersion = version\"\n >\n v{{ version }}\n <Check v-if=\"selectedVersion === version\" class=\"ml-auto\" />\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\n\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n} from '@/registry/new-york/ui/sidebar'\nimport { Check, ChevronsUpDown, GalleryVerticalEnd } from 'lucide-vue-next'\nimport { ref } from 'vue'\n\nconst props = defineProps<{\n versions: string[]\n defaultVersion: string\n}>()\n\nconst selectedVersion = ref(props.defaultVersion)\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <GalleryVerticalEnd class=\"size-4\" />\n </div>\n <div class=\"flex flex-col gap-0.5 leading-none\">\n <span class=\"font-semibold\">Documentation</span>\n <span class=\"\">v{{ selectedVersion }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--reka-dropdown-menu-trigger-width]\"\n align=\"start\"\n >\n <DropdownMenuItem\n v-for=\"version in versions\"\n :key=\"version\"\n @select=\"selectedVersion = version\"\n >\n v{{ version }}\n <Check v-if=\"selectedVersion === version\" class=\"ml-auto\" />\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"type": "registry:component",
"target": ""
}

4
apps/www/src/public/r/styles/new-york/Sidebar07.json
View File

@ -42,13 +42,13 @@
},
{
"path": "block/Sidebar07/components/NavUser.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Avatar,\n AvatarFallback,\n AvatarImage,\n} from '@/registry/new-york/ui/avatar'\n\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n BadgeCheck,\n Bell,\n ChevronsUpDown,\n CreditCard,\n LogOut,\n Sparkles,\n} from 'lucide-vue-next'\n\nconst props = defineProps<{\n user: {\n name: string\n email: string\n avatar: string\n }\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto size-4\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n align=\"end\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"p-0 font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <Sparkles />\n Upgrade to Pro\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <BadgeCheck />\n Account\n </DropdownMenuItem>\n <DropdownMenuItem>\n <CreditCard />\n Billing\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Bell />\n Notifications\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <LogOut />\n Log out\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n Avatar,\n AvatarFallback,\n AvatarImage,\n} from '@/registry/new-york/ui/avatar'\n\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n BadgeCheck,\n Bell,\n ChevronsUpDown,\n CreditCard,\n LogOut,\n Sparkles,\n} from 'lucide-vue-next'\n\nconst props = defineProps<{\n user: {\n name: string\n email: string\n avatar: string\n }\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto size-4\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--reka-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n align=\"end\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"p-0 font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <Sparkles />\n Upgrade to Pro\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <BadgeCheck />\n Account\n </DropdownMenuItem>\n <DropdownMenuItem>\n <CreditCard />\n Billing\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Bell />\n Notifications\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <LogOut />\n Log out\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar07/components/TeamSwitcher.vue",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\n\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport { ChevronsUpDown, Plus } from 'lucide-vue-next'\n\nimport { type Component, ref } from 'vue'\n\nconst props = defineProps<{\n teams: {\n name: string\n logo: Component\n plan: string\n }[]\n}>()\n\nconst { isMobile } = useSidebar()\nconst activeTeam = ref(props.teams[0])\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <component :is=\"activeTeam.logo\" class=\"size-4\" />\n </div>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">\n {{ activeTeam.name }}\n </span>\n <span class=\"truncate text-xs\">{{ activeTeam.plan }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n align=\"start\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"text-xs text-muted-foreground\">\n Teams\n </DropdownMenuLabel>\n <DropdownMenuItem\n v-for=\"(team, index) in teams\"\n :key=\"team.name\"\n class=\"gap-2 p-2\"\n @click=\"activeTeam = team\"\n >\n <div class=\"flex size-6 items-center justify-center rounded-sm border\">\n <component :is=\"team.logo\" class=\"size-4 shrink-0\" />\n </div>\n {{ team.name }}\n <DropdownMenuShortcut>⌘{{ index + 1 }}</DropdownMenuShortcut>\n </DropdownMenuItem>\n <DropdownMenuSeparator />\n <DropdownMenuItem class=\"gap-2 p-2\">\n <div class=\"flex size-6 items-center justify-center rounded-md border bg-background\">\n <Plus class=\"size-4\" />\n </div>\n <div class=\"font-medium text-muted-foreground\">\n Add team\n </div>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\n\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport { ChevronsUpDown, Plus } from 'lucide-vue-next'\n\nimport { type Component, ref } from 'vue'\n\nconst props = defineProps<{\n teams: {\n name: string\n logo: Component\n plan: string\n }[]\n}>()\n\nconst { isMobile } = useSidebar()\nconst activeTeam = ref(props.teams[0])\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <div class=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n <component :is=\"activeTeam.logo\" class=\"size-4\" />\n </div>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">\n {{ activeTeam.name }}\n </span>\n <span class=\"truncate text-xs\">{{ activeTeam.plan }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--reka-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n align=\"start\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"text-xs text-muted-foreground\">\n Teams\n </DropdownMenuLabel>\n <DropdownMenuItem\n v-for=\"(team, index) in teams\"\n :key=\"team.name\"\n class=\"gap-2 p-2\"\n @click=\"activeTeam = team\"\n >\n <div class=\"flex size-6 items-center justify-center rounded-sm border\">\n <component :is=\"team.logo\" class=\"size-4 shrink-0\" />\n </div>\n {{ team.name }}\n <DropdownMenuShortcut>⌘{{ index + 1 }}</DropdownMenuShortcut>\n </DropdownMenuItem>\n <DropdownMenuSeparator />\n <DropdownMenuItem class=\"gap-2 p-2\">\n <div class=\"flex size-6 items-center justify-center rounded-md border bg-background\">\n <Plus class=\"size-4\" />\n </div>\n <div class=\"font-medium text-muted-foreground\">\n Add team\n </div>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"type": "registry:component",
"target": ""
}

2
apps/www/src/public/r/styles/new-york/Sidebar08.json
View File

@ -48,7 +48,7 @@
},
{
"path": "block/Sidebar08/components/NavUser.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Avatar,\n AvatarFallback,\n AvatarImage,\n} from '@/registry/new-york/ui/avatar'\n\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n BadgeCheck,\n Bell,\n ChevronsUpDown,\n CreditCard,\n LogOut,\n Sparkles,\n} from 'lucide-vue-next'\n\nconst props = defineProps<{\n user: {\n name: string\n email: string\n avatar: string\n }\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto size-4\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n align=\"end\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"p-0 font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <Sparkles />\n Upgrade to Pro\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <BadgeCheck />\n Account\n </DropdownMenuItem>\n <DropdownMenuItem>\n <CreditCard />\n Billing\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Bell />\n Notifications\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <LogOut />\n Log out\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n Avatar,\n AvatarFallback,\n AvatarImage,\n} from '@/registry/new-york/ui/avatar'\n\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n BadgeCheck,\n Bell,\n ChevronsUpDown,\n CreditCard,\n LogOut,\n Sparkles,\n} from 'lucide-vue-next'\n\nconst props = defineProps<{\n user: {\n name: string\n email: string\n avatar: string\n }\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto size-4\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--reka-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n align=\"end\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"p-0 font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <Sparkles />\n Upgrade to Pro\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <BadgeCheck />\n Account\n </DropdownMenuItem>\n <DropdownMenuItem>\n <CreditCard />\n Billing\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Bell />\n Notifications\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <LogOut />\n Log out\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"type": "registry:component",
"target": ""
}

2
apps/www/src/public/r/styles/new-york/Sidebar09.json
View File

@ -28,7 +28,7 @@
},
{
"path": "block/Sidebar09/components/NavUser.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Avatar,\n AvatarFallback,\n AvatarImage,\n} from '@/registry/new-york/ui/avatar'\n\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n BadgeCheck,\n Bell,\n ChevronsUpDown,\n CreditCard,\n LogOut,\n Sparkles,\n} from 'lucide-vue-next'\n\nconst props = defineProps<{\n user: {\n name: string\n email: string\n avatar: string\n }\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground md:h-8 md:p-0\"\n >\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto size-4\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n align=\"end\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"p-0 font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <Sparkles />\n Upgrade to Pro\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <BadgeCheck />\n Account\n </DropdownMenuItem>\n <DropdownMenuItem>\n <CreditCard />\n Billing\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Bell />\n Notifications\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <LogOut />\n Log out\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n Avatar,\n AvatarFallback,\n AvatarImage,\n} from '@/registry/new-york/ui/avatar'\n\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n BadgeCheck,\n Bell,\n ChevronsUpDown,\n CreditCard,\n LogOut,\n Sparkles,\n} from 'lucide-vue-next'\n\nconst props = defineProps<{\n user: {\n name: string\n email: string\n avatar: string\n }\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground md:h-8 md:p-0\"\n >\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto size-4\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--reka-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n align=\"end\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"p-0 font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <Sparkles />\n Upgrade to Pro\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <BadgeCheck />\n Account\n </DropdownMenuItem>\n <DropdownMenuItem>\n <CreditCard />\n Billing\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Bell />\n Notifications\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <LogOut />\n Log out\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"type": "registry:component",
"target": ""
}

2
apps/www/src/public/r/styles/new-york/Sidebar10.json
View File

@ -57,7 +57,7 @@
},
{
"path": "block/Sidebar10/components/NavWorkspaces.vue",
"content": "<script setup lang=\"ts\">\nimport type { Component } from 'vue'\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '@/registry/new-york/ui/collapsible'\n\nimport {\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuAction,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n} from '@/registry/new-york/ui/sidebar'\nimport { ChevronRight, MoreHorizontal, Plus } from 'lucide-vue-next'\n\ndefineProps<{\n workspaces: {\n name: string\n emoji: string\n pages: {\n name: string\n emoji: string\n }[]\n }[]\n}>()\n</script>\n\n<template>\n <SidebarGroup>\n <SidebarGroupLabel>Workspaces</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <Collapsible v-for=\"workspace in workspaces\" :key=\"workspace.name\">\n <SidebarMenuItem>\n <SidebarMenuButton as-child>\n <a href=\"#\">\n <span>{{ workspace.emoji }}</span>\n <span>{{ workspace.name }}</span>\n </a>\n </SidebarMenuButton>\n <CollapsibleTrigger as-child>\n <SidebarMenuAction\n class=\"left-2 bg-sidebar-accent text-sidebar-accent-foreground data-[state=open]:rotate-90\"\n show-on-hover\n >\n <ChevronRight />\n </SidebarMenuAction>\n </CollapsibleTrigger>\n <SidebarMenuAction show-on-hover>\n <Plus />\n </SidebarMenuAction>\n <CollapsibleContent>\n <SidebarMenuSub>\n <SidebarMenuSubItem v-for=\"page in workspace.pages\" :key=\"page.name\">\n <SidebarMenuSubButton as-child>\n <a href=\"#\">\n <span>{{ page.emoji }}</span>\n <span>{{ page.name }}</span>\n </a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </CollapsibleContent>\n </SidebarMenuItem>\n </Collapsible>\n\n <SidebarMenuItem>\n <SidebarMenuButton class=\"text-sidebar-foreground/70\">\n <MoreHorizontal />\n <span>More</span>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '@/registry/new-york/ui/collapsible'\n\nimport {\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuAction,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n} from '@/registry/new-york/ui/sidebar'\nimport { ChevronRight, MoreHorizontal, Plus } from 'lucide-vue-next'\n\ndefineProps<{\n workspaces: {\n name: string\n emoji: string\n pages: {\n name: string\n emoji: string\n }[]\n }[]\n}>()\n</script>\n\n<template>\n <SidebarGroup>\n <SidebarGroupLabel>Workspaces</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <Collapsible v-for=\"workspace in workspaces\" :key=\"workspace.name\">\n <SidebarMenuItem>\n <SidebarMenuButton as-child>\n <a href=\"#\">\n <span>{{ workspace.emoji }}</span>\n <span>{{ workspace.name }}</span>\n </a>\n </SidebarMenuButton>\n <CollapsibleTrigger as-child>\n <SidebarMenuAction\n class=\"left-2 bg-sidebar-accent text-sidebar-accent-foreground data-[state=open]:rotate-90\"\n show-on-hover\n >\n <ChevronRight />\n </SidebarMenuAction>\n </CollapsibleTrigger>\n <SidebarMenuAction show-on-hover>\n <Plus />\n </SidebarMenuAction>\n <CollapsibleContent>\n <SidebarMenuSub>\n <SidebarMenuSubItem v-for=\"page in workspace.pages\" :key=\"page.name\">\n <SidebarMenuSubButton as-child>\n <a href=\"#\">\n <span>{{ page.emoji }}</span>\n <span>{{ page.name }}</span>\n </a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </CollapsibleContent>\n </SidebarMenuItem>\n </Collapsible>\n\n <SidebarMenuItem>\n <SidebarMenuButton class=\"text-sidebar-foreground/70\">\n <MoreHorizontal />\n <span>More</span>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n</template>\n",
"type": "registry:component",
"target": ""
},

2
apps/www/src/public/r/styles/new-york/Sidebar12.json
View File

@ -42,7 +42,7 @@
},
{
"path": "block/Sidebar12/components/NavUser.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Avatar,\n AvatarFallback,\n AvatarImage,\n} from '@/registry/new-york/ui/avatar'\n\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n BadgeCheck,\n Bell,\n ChevronsUpDown,\n CreditCard,\n LogOut,\n Sparkles,\n} from 'lucide-vue-next'\n\nconst props = defineProps<{\n user: {\n name: string\n email: string\n avatar: string\n }\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto size-4\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n align=\"start\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"p-0 font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <Sparkles />\n Upgrade to Pro\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <BadgeCheck />\n Account\n </DropdownMenuItem>\n <DropdownMenuItem>\n <CreditCard />\n Billing\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Bell />\n Notifications\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <LogOut />\n Log out\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n Avatar,\n AvatarFallback,\n AvatarImage,\n} from '@/registry/new-york/ui/avatar'\n\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n BadgeCheck,\n Bell,\n ChevronsUpDown,\n CreditCard,\n LogOut,\n Sparkles,\n} from 'lucide-vue-next'\n\nconst props = defineProps<{\n user: {\n name: string\n email: string\n avatar: string\n }\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto size-4\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--reka-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n align=\"start\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"p-0 font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <Sparkles />\n Upgrade to Pro\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <BadgeCheck />\n Account\n </DropdownMenuItem>\n <DropdownMenuItem>\n <CreditCard />\n Billing\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Bell />\n Notifications\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <LogOut />\n Log out\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"type": "registry:component",
"target": ""
}

2
apps/www/src/public/r/styles/new-york/Sidebar13.json
View File

@ -12,7 +12,7 @@
"files": [
{
"path": "block/Sidebar13/page.vue",
"content": "<script lang=\"ts\">\nexport const description = 'A sidebar in a dialog.'\nexport const iframeHeight = '800px'\n</script>\n\n<script setup lang=\"ts\">\nimport SettingsDialog from '@/registry/new-york/block/Sidebar13/components/SettingsDialog.vue'\n</script>\n\n<template>\n <div className=\"flex h-svh items-center justify-center\">\n <SettingsDialog />\n </div>\n</template>\n",
"content": "<script lang=\"ts\">\nexport const description = 'A sidebar in a dialog.'\nexport const iframeHeight = '800px'\n</script>\n\n<script setup lang=\"ts\">\nimport SettingsDialog from '@/registry/new-york/block/Sidebar13/components/SettingsDialog.vue'\n</script>\n\n<template>\n <div class=\"flex h-svh items-center justify-center\">\n <SettingsDialog />\n </div>\n</template>\n",
"type": "registry:page",
"target": "pages/dashboard/index.vue"
},

2
apps/www/src/public/r/styles/new-york/Sidebar14.json
View File

@ -16,7 +16,7 @@
},
{
"path": "block/Sidebar14/components/AppSidebar.vue",
"content": "<script setup lang=\"ts\">\nimport type {\n SidebarProps,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n SidebarRail,\n} from '@/registry/new-york/ui/sidebar'\n\nconst props = defineProps<SidebarProps>()\n\n// This is sample data.\nconst data = {\n navMain: [\n {\n title: 'Getting Started',\n url: '#',\n items: [\n {\n title: 'Installation',\n url: '#',\n },\n {\n title: 'Project Structure',\n url: '#',\n },\n ],\n },\n {\n title: 'Building Your Application',\n url: '#',\n items: [\n {\n title: 'Routing',\n url: '#',\n },\n {\n title: 'Data Fetching',\n url: '#',\n isActive: true,\n },\n {\n title: 'Rendering',\n url: '#',\n },\n {\n title: 'Caching',\n url: '#',\n },\n {\n title: 'Styling',\n url: '#',\n },\n {\n title: 'Optimizing',\n url: '#',\n },\n {\n title: 'Configuring',\n url: '#',\n },\n {\n title: 'Testing',\n url: '#',\n },\n {\n title: 'Authentication',\n url: '#',\n },\n {\n title: 'Deploying',\n url: '#',\n },\n {\n title: 'Upgrading',\n url: '#',\n },\n {\n title: 'Examples',\n url: '#',\n },\n ],\n },\n {\n title: 'API Reference',\n url: '#',\n items: [\n {\n title: 'Components',\n url: '#',\n },\n {\n title: 'File Conventions',\n url: '#',\n },\n {\n title: 'Functions',\n url: '#',\n },\n {\n title: 'next.config.js Options',\n url: '#',\n },\n {\n title: 'CLI',\n url: '#',\n },\n {\n title: 'Edge Runtime',\n url: '#',\n },\n ],\n },\n {\n title: 'Architecture',\n url: '#',\n items: [\n {\n title: 'Accessibility',\n url: '#',\n },\n {\n title: 'Fast Refresh',\n url: '#',\n },\n {\n title: 'Next.js Compiler',\n url: '#',\n },\n {\n title: 'Supported Browsers',\n url: '#',\n },\n {\n title: 'Turbopack',\n url: '#',\n },\n ],\n },\n {\n title: 'Community',\n url: '#',\n items: [\n {\n title: 'Contribution Guide',\n url: '#',\n },\n ],\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Table of Contents</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in data.navMain\" :key=\"item.title\">\n <SidebarMenuButton as-child>\n <a :href=\"item.url\" className=\"font-medium\">\n {{ item.title }}\n </a>\n </SidebarMenuButton>\n <SidebarMenuSub v-if=\"item.items.length\">\n <SidebarMenuSubItem v-for=\"subItem in item.items\" :key=\"subItem.title\">\n <SidebarMenuSubButton\n as-child\n :is-active=\"subItem.isActive\"\n >\n <a :href=\"subItem.url\">{{ subItem.title }}</a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n <SidebarRail />\n </Sidebar>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport type {\n SidebarProps,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n SidebarRail,\n} from '@/registry/new-york/ui/sidebar'\n\nconst props = defineProps<SidebarProps>()\n\n// This is sample data.\nconst data = {\n navMain: [\n {\n title: 'Getting Started',\n url: '#',\n items: [\n {\n title: 'Installation',\n url: '#',\n },\n {\n title: 'Project Structure',\n url: '#',\n },\n ],\n },\n {\n title: 'Building Your Application',\n url: '#',\n items: [\n {\n title: 'Routing',\n url: '#',\n },\n {\n title: 'Data Fetching',\n url: '#',\n isActive: true,\n },\n {\n title: 'Rendering',\n url: '#',\n },\n {\n title: 'Caching',\n url: '#',\n },\n {\n title: 'Styling',\n url: '#',\n },\n {\n title: 'Optimizing',\n url: '#',\n },\n {\n title: 'Configuring',\n url: '#',\n },\n {\n title: 'Testing',\n url: '#',\n },\n {\n title: 'Authentication',\n url: '#',\n },\n {\n title: 'Deploying',\n url: '#',\n },\n {\n title: 'Upgrading',\n url: '#',\n },\n {\n title: 'Examples',\n url: '#',\n },\n ],\n },\n {\n title: 'API Reference',\n url: '#',\n items: [\n {\n title: 'Components',\n url: '#',\n },\n {\n title: 'File Conventions',\n url: '#',\n },\n {\n title: 'Functions',\n url: '#',\n },\n {\n title: 'next.config.js Options',\n url: '#',\n },\n {\n title: 'CLI',\n url: '#',\n },\n {\n title: 'Edge Runtime',\n url: '#',\n },\n ],\n },\n {\n title: 'Architecture',\n url: '#',\n items: [\n {\n title: 'Accessibility',\n url: '#',\n },\n {\n title: 'Fast Refresh',\n url: '#',\n },\n {\n title: 'Next.js Compiler',\n url: '#',\n },\n {\n title: 'Supported Browsers',\n url: '#',\n },\n {\n title: 'Turbopack',\n url: '#',\n },\n ],\n },\n {\n title: 'Community',\n url: '#',\n items: [\n {\n title: 'Contribution Guide',\n url: '#',\n },\n ],\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Table of Contents</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in data.navMain\" :key=\"item.title\">\n <SidebarMenuButton as-child>\n <a :href=\"item.url\" class=\"font-medium\">\n {{ item.title }}\n </a>\n </SidebarMenuButton>\n <SidebarMenuSub v-if=\"item.items.length\">\n <SidebarMenuSubItem v-for=\"subItem in item.items\" :key=\"subItem.title\">\n <SidebarMenuSubButton\n as-child\n :is-active=\"subItem.isActive\"\n >\n <a :href=\"subItem.url\">{{ subItem.title }}</a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n <SidebarRail />\n </Sidebar>\n</template>\n",
"type": "registry:component",
"target": ""
}

8
apps/www/src/public/r/styles/new-york/Sidebar15.json
View File

@ -30,7 +30,7 @@
},
{
"path": "block/Sidebar15/components/AppSidebar.vue",
"content": "<script setup lang=\"ts\">\nimport type {\n SidebarProps,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n SidebarRail,\n} from '@/registry/new-york/ui/sidebar'\n\nconst props = defineProps<SidebarProps>()\n\n// This is sample data.\nconst data = {\n navMain: [\n {\n title: 'Getting Started',\n url: '#',\n items: [\n {\n title: 'Installation',\n url: '#',\n },\n {\n title: 'Project Structure',\n url: '#',\n },\n ],\n },\n {\n title: 'Building Your Application',\n url: '#',\n items: [\n {\n title: 'Routing',\n url: '#',\n },\n {\n title: 'Data Fetching',\n url: '#',\n isActive: true,\n },\n {\n title: 'Rendering',\n url: '#',\n },\n {\n title: 'Caching',\n url: '#',\n },\n {\n title: 'Styling',\n url: '#',\n },\n {\n title: 'Optimizing',\n url: '#',\n },\n {\n title: 'Configuring',\n url: '#',\n },\n {\n title: 'Testing',\n url: '#',\n },\n {\n title: 'Authentication',\n url: '#',\n },\n {\n title: 'Deploying',\n url: '#',\n },\n {\n title: 'Upgrading',\n url: '#',\n },\n {\n title: 'Examples',\n url: '#',\n },\n ],\n },\n {\n title: 'API Reference',\n url: '#',\n items: [\n {\n title: 'Components',\n url: '#',\n },\n {\n title: 'File Conventions',\n url: '#',\n },\n {\n title: 'Functions',\n url: '#',\n },\n {\n title: 'next.config.js Options',\n url: '#',\n },\n {\n title: 'CLI',\n url: '#',\n },\n {\n title: 'Edge Runtime',\n url: '#',\n },\n ],\n },\n {\n title: 'Architecture',\n url: '#',\n items: [\n {\n title: 'Accessibility',\n url: '#',\n },\n {\n title: 'Fast Refresh',\n url: '#',\n },\n {\n title: 'Next.js Compiler',\n url: '#',\n },\n {\n title: 'Supported Browsers',\n url: '#',\n },\n {\n title: 'Turbopack',\n url: '#',\n },\n ],\n },\n {\n title: 'Community',\n url: '#',\n items: [\n {\n title: 'Contribution Guide',\n url: '#',\n },\n ],\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Table of Contents</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in data.navMain\" :key=\"item.title\">\n <SidebarMenuButton as-child>\n <a :href=\"item.url\" className=\"font-medium\">\n {{ item.title }}\n </a>\n </SidebarMenuButton>\n <SidebarMenuSub v-if=\"item.items.length\">\n <SidebarMenuSubItem v-for=\"subItem in item.items\" :key=\"subItem.title\">\n <SidebarMenuSubButton\n as-child\n :is-active=\"subItem.isActive\"\n >\n <a :href=\"subItem.url\">{{ subItem.title }}</a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n <SidebarRail />\n </Sidebar>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport type {\n SidebarProps,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n Sidebar,\n SidebarContent,\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n SidebarRail,\n} from '@/registry/new-york/ui/sidebar'\n\nconst props = defineProps<SidebarProps>()\n\n// This is sample data.\nconst data = {\n navMain: [\n {\n title: 'Getting Started',\n url: '#',\n items: [\n {\n title: 'Installation',\n url: '#',\n },\n {\n title: 'Project Structure',\n url: '#',\n },\n ],\n },\n {\n title: 'Building Your Application',\n url: '#',\n items: [\n {\n title: 'Routing',\n url: '#',\n },\n {\n title: 'Data Fetching',\n url: '#',\n isActive: true,\n },\n {\n title: 'Rendering',\n url: '#',\n },\n {\n title: 'Caching',\n url: '#',\n },\n {\n title: 'Styling',\n url: '#',\n },\n {\n title: 'Optimizing',\n url: '#',\n },\n {\n title: 'Configuring',\n url: '#',\n },\n {\n title: 'Testing',\n url: '#',\n },\n {\n title: 'Authentication',\n url: '#',\n },\n {\n title: 'Deploying',\n url: '#',\n },\n {\n title: 'Upgrading',\n url: '#',\n },\n {\n title: 'Examples',\n url: '#',\n },\n ],\n },\n {\n title: 'API Reference',\n url: '#',\n items: [\n {\n title: 'Components',\n url: '#',\n },\n {\n title: 'File Conventions',\n url: '#',\n },\n {\n title: 'Functions',\n url: '#',\n },\n {\n title: 'next.config.js Options',\n url: '#',\n },\n {\n title: 'CLI',\n url: '#',\n },\n {\n title: 'Edge Runtime',\n url: '#',\n },\n ],\n },\n {\n title: 'Architecture',\n url: '#',\n items: [\n {\n title: 'Accessibility',\n url: '#',\n },\n {\n title: 'Fast Refresh',\n url: '#',\n },\n {\n title: 'Next.js Compiler',\n url: '#',\n },\n {\n title: 'Supported Browsers',\n url: '#',\n },\n {\n title: 'Turbopack',\n url: '#',\n },\n ],\n },\n {\n title: 'Community',\n url: '#',\n items: [\n {\n title: 'Contribution Guide',\n url: '#',\n },\n ],\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar v-bind=\"props\">\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Table of Contents</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <SidebarMenuItem v-for=\"item in data.navMain\" :key=\"item.title\">\n <SidebarMenuButton as-child>\n <a :href=\"item.url\" class=\"font-medium\">\n {{ item.title }}\n </a>\n </SidebarMenuButton>\n <SidebarMenuSub v-if=\"item.items.length\">\n <SidebarMenuSubItem v-for=\"subItem in item.items\" :key=\"subItem.title\">\n <SidebarMenuSubButton\n as-child\n :is-active=\"subItem.isActive\"\n >\n <a :href=\"subItem.url\">{{ subItem.title }}</a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n </SidebarContent>\n <SidebarRail />\n </Sidebar>\n</template>\n",
"type": "registry:component",
"target": ""
},
@ -66,13 +66,13 @@
},
{
"path": "block/Sidebar15/components/NavUser.vue",
"content": "<script setup lang=\"ts\">\nimport {\n Avatar,\n AvatarFallback,\n AvatarImage,\n} from '@/registry/new-york/ui/avatar'\n\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n BadgeCheck,\n Bell,\n ChevronsUpDown,\n CreditCard,\n LogOut,\n Sparkles,\n} from 'lucide-vue-next'\n\nconst props = defineProps<{\n user: {\n name: string\n email: string\n avatar: string\n }\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto size-4\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n align=\"start\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"p-0 font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <Sparkles />\n Upgrade to Pro\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <BadgeCheck />\n Account\n </DropdownMenuItem>\n <DropdownMenuItem>\n <CreditCard />\n Billing\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Bell />\n Notifications\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <LogOut />\n Log out\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n Avatar,\n AvatarFallback,\n AvatarImage,\n} from '@/registry/new-york/ui/avatar'\n\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from '@/registry/new-york/ui/dropdown-menu'\nimport {\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n useSidebar,\n} from '@/registry/new-york/ui/sidebar'\nimport {\n BadgeCheck,\n Bell,\n ChevronsUpDown,\n CreditCard,\n LogOut,\n Sparkles,\n} from 'lucide-vue-next'\n\nconst props = defineProps<{\n user: {\n name: string\n email: string\n avatar: string\n }\n}>()\n\nconst { isMobile } = useSidebar()\n</script>\n\n<template>\n <SidebarMenu>\n <SidebarMenuItem>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <SidebarMenuButton\n size=\"lg\"\n class=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n >\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n <ChevronsUpDown class=\"ml-auto size-4\" />\n </SidebarMenuButton>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n class=\"w-[--reka-dropdown-menu-trigger-width] min-w-56 rounded-lg\"\n :side=\"isMobile ? 'bottom' : 'right'\"\n align=\"start\"\n :side-offset=\"4\"\n >\n <DropdownMenuLabel class=\"p-0 font-normal\">\n <div class=\"flex items-center gap-2 px-1 py-1.5 text-left text-sm\">\n <Avatar class=\"h-8 w-8 rounded-lg\">\n <AvatarImage :src=\"user.avatar\" :alt=\"user.name\" />\n <AvatarFallback class=\"rounded-lg\">\n CN\n </AvatarFallback>\n </Avatar>\n <div class=\"grid flex-1 text-left text-sm leading-tight\">\n <span class=\"truncate font-semibold\">{{ user.name }}</span>\n <span class=\"truncate text-xs\">{{ user.email }}</span>\n </div>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <Sparkles />\n Upgrade to Pro\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem>\n <BadgeCheck />\n Account\n </DropdownMenuItem>\n <DropdownMenuItem>\n <CreditCard />\n Billing\n </DropdownMenuItem>\n <DropdownMenuItem>\n <Bell />\n Notifications\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem>\n <LogOut />\n Log out\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </SidebarMenuItem>\n </SidebarMenu>\n</template>\n",
"type": "registry:component",
"target": ""
},
{
"path": "block/Sidebar15/components/NavWorkspaces.vue",
"content": "<script setup lang=\"ts\">\nimport type { Component } from 'vue'\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '@/registry/new-york/ui/collapsible'\n\nimport {\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuAction,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n} from '@/registry/new-york/ui/sidebar'\nimport { ChevronRight, MoreHorizontal, Plus } from 'lucide-vue-next'\n\ndefineProps<{\n workspaces: {\n name: string\n emoji: string\n pages: {\n name: string\n emoji: string\n }[]\n }[]\n}>()\n</script>\n\n<template>\n <SidebarGroup>\n <SidebarGroupLabel>Workspaces</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <Collapsible v-for=\"workspace in workspaces\" :key=\"workspace.name\">\n <SidebarMenuItem>\n <SidebarMenuButton as-child>\n <a href=\"#\">\n <span>{{ workspace.emoji }}</span>\n <span>{{ workspace.name }}</span>\n </a>\n </SidebarMenuButton>\n <CollapsibleTrigger as-child>\n <SidebarMenuAction\n class=\"left-2 bg-sidebar-accent text-sidebar-accent-foreground data-[state=open]:rotate-90\"\n show-on-hover\n >\n <ChevronRight />\n </SidebarMenuAction>\n </CollapsibleTrigger>\n <SidebarMenuAction show-on-hover>\n <Plus />\n </SidebarMenuAction>\n <CollapsibleContent>\n <SidebarMenuSub>\n <SidebarMenuSubItem v-for=\"page in workspace.pages\" :key=\"page.name\">\n <SidebarMenuSubButton as-child>\n <a href=\"#\">\n <span>{{ page.emoji }}</span>\n <span>{{ page.name }}</span>\n </a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </CollapsibleContent>\n </SidebarMenuItem>\n </Collapsible>\n\n <SidebarMenuItem>\n <SidebarMenuButton class=\"text-sidebar-foreground/70\">\n <MoreHorizontal />\n <span>More</span>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '@/registry/new-york/ui/collapsible'\n\nimport {\n SidebarGroup,\n SidebarGroupContent,\n SidebarGroupLabel,\n SidebarMenu,\n SidebarMenuAction,\n SidebarMenuButton,\n SidebarMenuItem,\n SidebarMenuSub,\n SidebarMenuSubButton,\n SidebarMenuSubItem,\n} from '@/registry/new-york/ui/sidebar'\nimport { ChevronRight, MoreHorizontal, Plus } from 'lucide-vue-next'\n\ndefineProps<{\n workspaces: {\n name: string\n emoji: string\n pages: {\n name: string\n emoji: string\n }[]\n }[]\n}>()\n</script>\n\n<template>\n <SidebarGroup>\n <SidebarGroupLabel>Workspaces</SidebarGroupLabel>\n <SidebarGroupContent>\n <SidebarMenu>\n <Collapsible v-for=\"workspace in workspaces\" :key=\"workspace.name\">\n <SidebarMenuItem>\n <SidebarMenuButton as-child>\n <a href=\"#\">\n <span>{{ workspace.emoji }}</span>\n <span>{{ workspace.name }}</span>\n </a>\n </SidebarMenuButton>\n <CollapsibleTrigger as-child>\n <SidebarMenuAction\n class=\"left-2 bg-sidebar-accent text-sidebar-accent-foreground data-[state=open]:rotate-90\"\n show-on-hover\n >\n <ChevronRight />\n </SidebarMenuAction>\n </CollapsibleTrigger>\n <SidebarMenuAction show-on-hover>\n <Plus />\n </SidebarMenuAction>\n <CollapsibleContent>\n <SidebarMenuSub>\n <SidebarMenuSubItem v-for=\"page in workspace.pages\" :key=\"page.name\">\n <SidebarMenuSubButton as-child>\n <a href=\"#\">\n <span>{{ page.emoji }}</span>\n <span>{{ page.name }}</span>\n </a>\n </SidebarMenuSubButton>\n </SidebarMenuSubItem>\n </SidebarMenuSub>\n </CollapsibleContent>\n </SidebarMenuItem>\n </Collapsible>\n\n <SidebarMenuItem>\n <SidebarMenuButton class=\"text-sidebar-foreground/70\">\n <MoreHorizontal />\n <span>More</span>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroupContent>\n </SidebarGroup>\n</template>\n",
"type": "registry:component",
"target": ""
},
@ -84,7 +84,7 @@
},
{
"path": "block/Sidebar15/components/SidebarRight.vue",
"content": "<script setup lang=\"ts\">\nimport Calendars from '@/registry/new-york/block/Sidebar15/components/Calendars.vue'\n\nimport DatePicker from '@/registry/new-york/block/Sidebar15/components/DatePicker.vue'\nimport NavUser from '@/registry/new-york/block/Sidebar15/components/NavUser.vue'\nimport {\n Sidebar,\n SidebarContent,\n SidebarFooter,\n SidebarHeader,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n type SidebarProps,\n SidebarRail,\n SidebarSeparator,\n} from '@/registry/new-york/ui/sidebar'\nimport { Plus } from 'lucide-vue-next'\n\nconst props = withDefaults(defineProps<SidebarProps>(), {\n collapsible: 'none',\n})\n\n// This is sample data.\nconst data = {\n user: {\n name: 'shadcn',\n email: 'm@example.com',\n avatar: '/avatars/shadcn.jpg',\n },\n calendars: [\n {\n name: 'My Calendars',\n items: ['Personal', 'Work', 'Family'],\n },\n {\n name: 'Favorites',\n items: ['Holidays', 'Birthdays'],\n },\n {\n name: 'Other',\n items: ['Travel', 'Reminders', 'Deadlines'],\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar\n class=\"sticky hidden lg:flex top-0 h-svh border-l\"\n v-bind=\"props\"\n >\n <SidebarHeader class=\"h-16 border-b border-sidebar-border\">\n <NavUser :user=\"data.user\" />\n </SidebarHeader>\n <SidebarContent>\n <DatePicker />\n <SidebarSeparator class=\"mx-0\" />\n <Calendars :calendars=\"data.calendars\" />\n </SidebarContent>\n <SidebarFooter>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton>\n <Plus />\n <span>New Calendar</span>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarFooter>\n </Sidebar>\n</template>\n",
"content": "<script setup lang=\"ts\">\nimport Calendars from '@/registry/new-york/block/Sidebar15/components/Calendars.vue'\n\nimport DatePicker from '@/registry/new-york/block/Sidebar15/components/DatePicker.vue'\nimport NavUser from '@/registry/new-york/block/Sidebar15/components/NavUser.vue'\nimport {\n Sidebar,\n SidebarContent,\n SidebarFooter,\n SidebarHeader,\n SidebarMenu,\n SidebarMenuButton,\n SidebarMenuItem,\n type SidebarProps,\n SidebarSeparator,\n} from '@/registry/new-york/ui/sidebar'\nimport { Plus } from 'lucide-vue-next'\n\nconst props = withDefaults(defineProps<SidebarProps>(), {\n collapsible: 'none',\n})\n\n// This is sample data.\nconst data = {\n user: {\n name: 'shadcn',\n email: 'm@example.com',\n avatar: '/avatars/shadcn.jpg',\n },\n calendars: [\n {\n name: 'My Calendars',\n items: ['Personal', 'Work', 'Family'],\n },\n {\n name: 'Favorites',\n items: ['Holidays', 'Birthdays'],\n },\n {\n name: 'Other',\n items: ['Travel', 'Reminders', 'Deadlines'],\n },\n ],\n}\n</script>\n\n<template>\n <Sidebar\n class=\"sticky hidden lg:flex top-0 h-svh border-l\"\n v-bind=\"props\"\n >\n <SidebarHeader class=\"h-16 border-b border-sidebar-border\">\n <NavUser :user=\"data.user\" />\n </SidebarHeader>\n <SidebarContent>\n <DatePicker />\n <SidebarSeparator class=\"mx-0\" />\n <Calendars :calendars=\"data.calendars\" />\n </SidebarContent>\n <SidebarFooter>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton>\n <Plus />\n <span>New Calendar</span>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarFooter>\n </Sidebar>\n</template>\n",
"type": "registry:component",
"target": ""
},

572
apps/www/src/public/r/temp.json
View File

File diff suppressed because one or more lines are too long

75
apps/www/src/registry/default/block/DemoSidebar.vue Normal file
View File

@ -0,0 +1,75 @@
<script setup lang="ts">
import {
Sidebar,
SidebarContent,
SidebarGroup,
SidebarGroupContent,
SidebarGroupLabel,
SidebarInset,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
SidebarProvider,
SidebarTrigger,
} from '@/registry/default/ui/sidebar'
import { Calendar, Home, Inbox, Search, Settings } from 'lucide-vue-next'
// Menu items.
const items = [
{
title: 'Home',
url: '#',
icon: Home,
},
{
title: 'Inbox',
url: '#',
icon: Inbox,
},
{
title: 'Calendar',
url: '#',
icon: Calendar,
},
{
title: 'Search',
url: '#',
icon: Search,
},
{
title: 'Settings',
url: '#',
icon: Settings,
},
]
</script>
<template>
<SidebarProvider>
<Sidebar>
<SidebarContent>
<SidebarGroup>
<SidebarGroupLabel>Application</SidebarGroupLabel>
<SidebarGroupContent>
<SidebarMenu>
<SidebarMenuItem v-for="item in items" :key="item.title">
<SidebarMenuButton as-child>
<a :href="item.url">
<component :is="item.icon" />
<span>{{ item.title }}</span>
</a>
</SidebarMenuButton>
</SidebarMenuItem>
</SidebarMenu>
</SidebarGroupContent>
</SidebarGroup>
</SidebarContent>
</Sidebar>
<SidebarInset>
<header class="flex items-center justify-between px-4 h-12">
<SidebarTrigger />
</header>
</SidebarInset>
</SidebarProvider>
</template>

93
apps/www/src/registry/default/block/DemoSidebarControlled.vue Normal file
View File

@ -0,0 +1,93 @@
<script setup lang="ts">
import { Button } from '@/registry/default/ui/button'
import {
Sidebar,
SidebarContent,
SidebarGroup,
SidebarGroupContent,
SidebarGroupLabel,
SidebarInset,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
SidebarProvider,
} from '@/registry/default/ui/sidebar'
import {
Frame,
LifeBuoy,
Map,
PanelLeftClose,
PanelLeftOpen,
PieChart,
Send,
} from 'lucide-vue-next'
import { ref } from 'vue'
const projects = [
{
name: 'Design Engineering',
url: '#',
icon: Frame,
},
{
name: 'Sales & Marketing',
url: '#',
icon: PieChart,
},
{
name: 'Travel',
url: '#',
icon: Map,
},
{
name: 'Support',
url: '#',
icon: LifeBuoy,
},
{
name: 'Feedback',
url: '#',
icon: Send,
},
]
const open = ref(true)
</script>
<template>
<SidebarProvider v-model:open="open">
<Sidebar>
<SidebarContent>
<SidebarGroup>
<SidebarGroupLabel>Projects</SidebarGroupLabel>
<SidebarGroupContent>
<SidebarMenu>
<SidebarMenuItem v-for="project in projects" :key="project.name">
<SidebarMenuButton as-child>
<a :href="project.url">
<component :is="project.icon" />
<span>{{ project.name }}</span>
</a>
</SidebarMenuButton>
</SidebarMenuItem>
</SidebarMenu>
</SidebarGroupContent>
</SidebarGroup>
</SidebarContent>
</Sidebar>
<SidebarInset>
<header className="flex items-center h-12 px-4 justify-between">
<Button
size="sm"
variant="ghost"
@click="open = !open"
>
<PanelLeftClose v-if="open" />
<PanelLeftOpen v-else />
<span>{{ open ? 'Close' : 'Open' }} Sidebar</span>
</Button>
</header>
</SidebarInset>
</SidebarProvider>
</template>

64
apps/www/src/registry/default/block/DemoSidebarFooter.vue Normal file
View File

@ -0,0 +1,64 @@
<script setup lang="ts">
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
} from '@/registry/default/ui/dropdown-menu'
import {
Sidebar,
SidebarContent,
SidebarFooter,
SidebarHeader,
SidebarInset,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
SidebarProvider,
SidebarTrigger,
} from '@/registry/default/ui/sidebar'
import { ChevronUp } from 'lucide-vue-next'
</script>
<template>
<SidebarProvider>
<Sidebar>
<SidebarHeader />
<SidebarContent />
<SidebarFooter>
<SidebarMenu>
<SidebarMenuItem>
<DropdownMenu>
<DropdownMenuTrigger as-child>
<SidebarMenuButton class="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground">
Username
<ChevronUp class="ml-auto" />
</SidebarMenuButton>
</DropdownMenuTrigger>
<DropdownMenuContent
side="top"
class="w-[--reka-popper-anchor-width]"
>
<DropdownMenuItem>
<span>Account</span>
</DropdownMenuItem>
<DropdownMenuItem>
<span>Billing</span>
</DropdownMenuItem>
<DropdownMenuItem>
<span>Sign out</span>
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</SidebarMenuItem>
</SidebarMenu>
</SidebarFooter>
</Sidebar>
<SidebarInset>
<header class="flex items-center justify-between px-4 h-12">
<SidebarTrigger />
</header>
</SidebarInset>
</SidebarProvider>
</template>

43
apps/www/src/registry/default/block/DemoSidebarGroup.vue Normal file
View File

@ -0,0 +1,43 @@
<script setup lang="ts">
import {
Sidebar,
SidebarContent,
SidebarGroup,
SidebarGroupContent,
SidebarGroupLabel,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
SidebarProvider,
} from '@/registry/default/ui/sidebar'
import { LifeBuoy, Send } from 'lucide-vue-next'
</script>
<template>
<SidebarProvider>
<Sidebar>
<SidebarContent>
<SidebarGroup>
<SidebarGroupLabel>Help</SidebarGroupLabel>
<SidebarGroupContent>
<SidebarMenu>
<SidebarMenuItem>
<SidebarMenuButton>
<LifeBuoy />
Support
</SidebarMenuButton>
</SidebarMenuItem>
<SidebarMenuItem>
<SidebarMenuButton>
<Send />
Feedback
</SidebarMenuButton>
</SidebarMenuItem>
</SidebarMenu>
</SidebarGroupContent>
</SidebarGroup>
</SidebarContent>
</Sidebar>
</SidebarProvider>
</template>

74
apps/www/src/registry/default/block/DemoSidebarGroupAction.vue Normal file
View File

@ -0,0 +1,74 @@
<script setup lang="ts">
import {
Sidebar,
SidebarContent,
SidebarGroup,
SidebarGroupAction,
SidebarGroupContent,
SidebarGroupLabel,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
SidebarProvider,
} from '@/registry/default/ui/sidebar'
import {
Frame,
Map,
PieChart,
Plus,
} from 'lucide-vue-next'
import { toast, Toaster } from 'vue-sonner'
</script>
<template>
<SidebarProvider>
<Toaster
position="bottom-left"
:toast-options="{
class: 'ml-[160px]',
}"
/>
<Sidebar>
<SidebarContent>
<SidebarGroup>
<SidebarGroupLabel>Projects</SidebarGroupLabel>
<SidebarGroupAction
title="Add Project"
@click="() => toast('You clicked the group action!')"
>
<Plus /> <span class="sr-only">Add Project</span>
</SidebarGroupAction>
<SidebarGroupContent>
<SidebarMenu>
<SidebarMenuItem>
<SidebarMenuButton as-child>
<a href="#">
<Frame />
<span>Design Engineering</span>
</a>
</SidebarMenuButton>
</SidebarMenuItem>
<SidebarMenuItem>
<SidebarMenuButton as-child>
<a href="#">
<PieChart />
<span>Sales & Marketing</span>
</a>
</SidebarMenuButton>
</SidebarMenuItem>
<SidebarMenuItem>
<SidebarMenuButton as-child>
<a href="#">
<Map />
<span>Travel</span>
</a>
</SidebarMenuButton>
</SidebarMenuItem>
</SidebarMenu>
</SidebarGroupContent>
</SidebarGroup>
</SidebarContent>
</Sidebar>
</SidebarProvider>
</template>

60
apps/www/src/registry/default/block/DemoSidebarGroupCollapsible.vue Normal file
View File

@ -0,0 +1,60 @@
<script setup lang="ts">
import {
Collapsible,
CollapsibleContent,
CollapsibleTrigger,
} from '@/registry/default/ui/collapsible'
import {
Sidebar,
SidebarContent,
SidebarGroup,
SidebarGroupContent,
SidebarGroupLabel,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
SidebarProvider,
} from '@/registry/default/ui/sidebar'
import { ChevronDown, LifeBuoy, Send } from 'lucide-vue-next'
</script>
<template>
<SidebarProvider>
<Sidebar>
<SidebarContent>
<Collapsible :default-open="true" class="group/collapsible">
<SidebarGroup>
<SidebarGroupLabel
as-child
class="text-sm hover:bg-sidebar-accent hover:text-sidebar-accent-foreground"
>
<CollapsibleTrigger>
Help
<ChevronDown class="ml-auto transition-transform group-data-[state=open]/collapsible:rotate-180" />
</CollapsibleTrigger>
</SidebarGroupLabel>
<CollapsibleContent>
<SidebarGroupContent>
<SidebarMenu>
<SidebarMenuItem>
<SidebarMenuButton>
<LifeBuoy />
Support
</SidebarMenuButton>
</SidebarMenuItem>
<SidebarMenuItem>
<SidebarMenuButton>
<Send />
Feedback
</SidebarMenuButton>
</SidebarMenuItem>
</SidebarMenu>
</SidebarGroupContent>
</CollapsibleContent>
</SidebarGroup>
</Collapsible>
</SidebarContent>
</Sidebar>
</SidebarProvider>
</template>

54
apps/www/src/registry/default/block/DemoSidebarHeader.vue Normal file
View File

@ -0,0 +1,54 @@
<script setup lang="ts">
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
} from '@/registry/default/ui/dropdown-menu'
import {
Sidebar,
SidebarHeader,
SidebarInset,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
SidebarProvider,
SidebarTrigger,
} from '@/registry/default/ui/sidebar'
import { ChevronDown } from 'lucide-vue-next'
</script>
<template>
<SidebarProvider>
<Sidebar>
<SidebarHeader>
<SidebarMenu>
<SidebarMenuItem>
<DropdownMenu>
<DropdownMenuTrigger as-child>
<SidebarMenuButton class="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground">
Select Workspace
<ChevronDown class="ml-auto" />
</SidebarMenuButton>
</DropdownMenuTrigger>
<DropdownMenuContent class="w-[--reka-popper-anchor-width]">
<DropdownMenuItem>
<span>Acme Inc</span>
</DropdownMenuItem>
<DropdownMenuItem>
<span>Acme Corp.</span>
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</SidebarMenuItem>
</SidebarMenu>
</SidebarHeader>
</Sidebar>
<SidebarInset>
<header class="flex items-center justify-between px-4 h-12">
<SidebarTrigger />
</header>
</SidebarInset>
</SidebarProvider>
</template>

67
apps/www/src/registry/default/block/DemoSidebarMenu.vue Normal file
View File

@ -0,0 +1,67 @@
<script setup lang="ts">
import {
Sidebar,
SidebarContent,
SidebarGroup,
SidebarGroupContent,
SidebarGroupLabel,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
SidebarProvider,
} from '@/registry/default/ui/sidebar'
import { Frame, LifeBuoy, Map, PieChart, Send } from 'lucide-vue-next'
const projects = [
{
name: 'Design Engineering',
url: '#',
icon: Frame,
},
{
name: 'Sales & Marketing',
url: '#',
icon: PieChart,
},
{
name: 'Travel',
url: '#',
icon: Map,
},
{
name: 'Support',
url: '#',
icon: LifeBuoy,
},
{
name: 'Feedback',
url: '#',
icon: Send,
},
]
</script>
<template>
<SidebarProvider>
<Sidebar>
<SidebarContent>
<SidebarGroup>
<SidebarGroupLabel>Projects</SidebarGroupLabel>
<SidebarGroupContent>
<SidebarMenu>
<SidebarMenuItem v-for="project in projects" :key="project.name">
<SidebarMenuButton as-child>
<a :href="project.url">
<component :is="project.icon" />
<span>{{ project.name }}</span>
</a>
</SidebarMenuButton>
</SidebarMenuItem>
</SidebarMenu>
</SidebarGroupContent>
</SidebarGroup>
</SidebarContent>
</Sidebar>
</SidebarProvider>
</template>

100
apps/www/src/registry/default/block/DemoSidebarMenuAction.vue Normal file
View File

@ -0,0 +1,100 @@
<script setup lang="ts">
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
} from '@/registry/default/ui/dropdown-menu'
import {
Sidebar,
SidebarContent,
SidebarGroup,
SidebarGroupContent,
SidebarGroupLabel,
SidebarMenu,
SidebarMenuAction,
SidebarMenuButton,
SidebarMenuItem,
SidebarProvider,
} from '@/registry/default/ui/sidebar'
import {
Frame,
LifeBuoy,
Map,
MoreHorizontal,
PieChart,
Send,
} from 'lucide-vue-next'
const projects = [
{
name: 'Design Engineering',
url: '#',
icon: Frame,
},
{
name: 'Sales & Marketing',
url: '#',
icon: PieChart,
},
{
name: 'Travel',
url: '#',
icon: Map,
},
{
name: 'Support',
url: '#',
icon: LifeBuoy,
},
{
name: 'Feedback',
url: '#',
icon: Send,
},
]
</script>
<template>
<SidebarProvider>
<Sidebar>
<SidebarContent>
<SidebarGroup>
<SidebarGroupLabel>Projects</SidebarGroupLabel>
<SidebarGroupContent>
<SidebarMenu>
<SidebarMenuItem v-for="project in projects" :key="project.name">
<SidebarMenuButton
as-child
class="group-has-[[data-state=open]]/menu-item:bg-sidebar-accent"
>
<a :href="project.url">
<component :is="project.icon" />
<span>{{ project.name }}</span>
</a>
</SidebarMenuButton>
<DropdownMenu>
<DropdownMenuTrigger as-child>
<SidebarMenuAction>
<MoreHorizontal />
<span class="sr-only">More</span>
</SidebarMenuAction>
</DropdownMenuTrigger>
<DropdownMenuContent side="right" align="start">
<DropdownMenuItem>
<span>Edit Project</span>
</DropdownMenuItem>
<DropdownMenuItem>
<span>Delete Project</span>
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</SidebarMenuItem>
</SidebarMenu>
</SidebarGroupContent>
</SidebarGroup>
</SidebarContent>
</Sidebar>
</SidebarProvider>
</template>

77
apps/www/src/registry/default/block/DemoSidebarMenuBadge.vue Normal file
View File

@ -0,0 +1,77 @@
<script setup lang="ts">
import {
Sidebar,
SidebarContent,
SidebarGroup,
SidebarGroupContent,
SidebarGroupLabel,
SidebarMenu,
SidebarMenuBadge,
SidebarMenuButton,
SidebarMenuItem,
SidebarProvider,
} from '@/registry/default/ui/sidebar'
import { Frame, LifeBuoy, Map, PieChart, Send } from 'lucide-vue-next'
const projects = [
{
name: 'Design Engineering',
url: '#',
icon: Frame,
badge: '24',
},
{
name: 'Sales & Marketing',
url: '#',
icon: PieChart,
badge: '12',
},
{
name: 'Travel',
url: '#',
icon: Map,
badge: '3',
},
{
name: 'Support',
url: '#',
icon: LifeBuoy,
badge: '21',
},
{
name: 'Feedback',
url: '#',
icon: Send,
badge: '8',
},
]
</script>
<template>
<SidebarProvider>
<Sidebar>
<SidebarContent>
<SidebarGroup>
<SidebarGroupLabel>Projects</SidebarGroupLabel>
<SidebarGroupContent>
<SidebarMenu>
<SidebarMenuItem v-for="project in projects" :key="project.name">
<SidebarMenuButton
as-child
class="group-has-[[data-state=open]]/menu-item:bg-sidebar-accent"
>
<a :href="project.url">
<component :is="project.icon" />
<span>{{ project.name }}</span>
</a>
</SidebarMenuButton>
<SidebarMenuBadge>{{ project.badge }}</SidebarMenuBadge>
</SidebarMenuItem>
</SidebarMenu>
</SidebarGroupContent>
</SidebarGroup>
</SidebarContent>
</Sidebar>
</SidebarProvider>
</template>

191
apps/www/src/registry/default/block/DemoSidebarMenuCollapsible.vue Normal file
View File

@ -0,0 +1,191 @@
<script setup lang="ts">
import {
Collapsible,
CollapsibleContent,
CollapsibleTrigger,
} from '@/registry/default/ui/collapsible'
import {
Sidebar,
SidebarContent,
SidebarGroup,
SidebarGroupContent,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
SidebarMenuSub,
SidebarMenuSubButton,
SidebarMenuSubItem,
SidebarProvider,
} from '@/registry/default/ui/sidebar'
import { ChevronRight } from 'lucide-vue-next'
const items = [
{
title: 'Getting Started',
url: '#',
items: [
{
title: 'Installation',
url: '#',
},
{
title: 'Project Structure',
url: '#',
},
],
},
{
title: 'Building Your Application',
url: '#',
items: [
{
title: 'Routing',
url: '#',
},
{
title: 'Data Fetching',
url: '#',
isActive: true,
},
{
title: 'Rendering',
url: '#',
},
{
title: 'Caching',
url: '#',
},
{
title: 'Styling',
url: '#',
},
{
title: 'Optimizing',
url: '#',
},
{
title: 'Configuring',
url: '#',
},
{
title: 'Testing',
url: '#',
},
{
title: 'Authentication',
url: '#',
},
{
title: 'Deploying',
url: '#',
},
{
title: 'Upgrading',
url: '#',
},
{
title: 'Examples',
url: '#',
},
],
},
{
title: 'API Reference',
url: '#',
items: [
{
title: 'Components',
url: '#',
},
{
title: 'File Conventions',
url: '#',
},
{
title: 'Functions',
url: '#',
},
{
title: 'next.config.js Options',
url: '#',
},
{
title: 'CLI',
url: '#',
},
{
title: 'Edge Runtime',
url: '#',
},
],
},
{
title: 'Architecture',
url: '#',
items: [
{
title: 'Accessibility',
url: '#',
},
{
title: 'Fast Refresh',
url: '#',
},
{
title: 'Next.js Compiler',
url: '#',
},
{
title: 'Supported Browsers',
url: '#',
},
{
title: 'Turbopack',
url: '#',
},
],
},
]
</script>
<template>
<SidebarProvider>
<Sidebar>
<SidebarContent>
<SidebarGroup>
<SidebarGroupContent>
<SidebarMenu>
<Collapsible
v-for="(item, index) in items"
:key="index"
class="group/collapsible"
:default-open="index === 0"
>
<SidebarMenuItem>
<CollapsibleTrigger as-child>
<SidebarMenuButton>
<span>{{ item.title }}</span>
<ChevronRight class="transition-transform ml-auto group-data-[state=open]/collapsible:rotate-90" />
</SidebarMenuButton>
</CollapsibleTrigger>
<CollapsibleContent>
<SidebarMenuSub>
<SidebarMenuSubItem v-for="(subItem, subIndex) in item.items" :key="subIndex">
<SidebarMenuSubButton as-child>
<a :href="subItem.url">
<span>{{ subItem.title }}</span>
</a>
</SidebarMenuSubButton>
</SidebarMenuSubItem>
</SidebarMenuSub>
</CollapsibleContent>
</SidebarMenuItem>
</Collapsible>
</SidebarMenu>
</SidebarGroupContent>
</SidebarGroup>
</SidebarContent>
</Sidebar>
</SidebarProvider>
</template>

174
apps/www/src/registry/default/block/DemoSidebarMenuSub.vue Normal file
View File

@ -0,0 +1,174 @@
<script setup lang="ts">
import {
Sidebar,
SidebarContent,
SidebarGroup,
SidebarGroupContent,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
SidebarMenuSub,
SidebarMenuSubButton,
SidebarMenuSubItem,
SidebarProvider,
} from '@/registry/default/ui/sidebar'
const items = [
{
title: 'Getting Started',
url: '#',
items: [
{
title: 'Installation',
url: '#',
},
{
title: 'Project Structure',
url: '#',
},
],
},
{
title: 'Building Your Application',
url: '#',
items: [
{
title: 'Routing',
url: '#',
},
{
title: 'Data Fetching',
url: '#',
isActive: true,
},
{
title: 'Rendering',
url: '#',
},
{
title: 'Caching',
url: '#',
},
{
title: 'Styling',
url: '#',
},
{
title: 'Optimizing',
url: '#',
},
{
title: 'Configuring',
url: '#',
},
{
title: 'Testing',
url: '#',
},
{
title: 'Authentication',
url: '#',
},
{
title: 'Deploying',
url: '#',
},
{
title: 'Upgrading',
url: '#',
},
{
title: 'Examples',
url: '#',
},
],
},
{
title: 'API Reference',
url: '#',
items: [
{
title: 'Components',
url: '#',
},
{
title: 'File Conventions',
url: '#',
},
{
title: 'Functions',
url: '#',
},
{
title: 'next.config.js Options',
url: '#',
},
{
title: 'CLI',
url: '#',
},
{
title: 'Edge Runtime',
url: '#',
},
],
},
{
title: 'Architecture',
url: '#',
items: [
{
title: 'Accessibility',
url: '#',
},
{
title: 'Fast Refresh',
url: '#',
},
{
title: 'Next.js Compiler',
url: '#',
},
{
title: 'Supported Browsers',
url: '#',
},
{
title: 'Turbopack',
url: '#',
},
],
},
]
</script>
<template>
<SidebarProvider>
<Sidebar>
<SidebarContent>
<SidebarGroup>
<SidebarGroupContent>
<SidebarMenu>
<SidebarMenuItem v-for="(item, index) in items" :key="index">
<SidebarMenuButton as-child>
<a :href="item.url">
<span>{{ item.title }}</span>
</a>
</SidebarMenuButton>
<SidebarMenuSub>
<SidebarMenuSubItem v-for="(subItem, subIndex) in item.items" :key="subIndex">
<SidebarMenuSubButton as-child>
<a :href="subItem.url">
<span>{{ subItem.title }}</span>
</a>
</SidebarMenuSubButton>
</SidebarMenuSubItem>
</SidebarMenuSub>
</SidebarMenuItem>
</SidebarMenu>
</SidebarGroupContent>
</SidebarGroup>
</SidebarContent>
</Sidebar>
</SidebarProvider>
</template>

59
apps/www/src/registry/default/block/Login01/components/LoginForm.vue Normal file
View File

@ -0,0 +1,59 @@
<script setup lang="ts">
import { Button } from '@/registry/default/ui/button'
import {
Card,
CardContent,
CardDescription,
CardHeader,
CardTitle,
} from '@/registry/default/ui/card'
import { Input } from '@/registry/default/ui/input'
import { Label } from '@/registry/default/ui/label'
</script>
<template>
<Card class="mx-auto max-w-sm">
<CardHeader>
<CardTitle class="text-2xl">
Login
</CardTitle>
<CardDescription>
Enter your email below to login to your account
</CardDescription>
</CardHeader>
<CardContent>
<div class="grid gap-4">
<div class="grid gap-2">
<Label for="email">Email</Label>
<Input
id="email"
type="email"
placeholder="m@example.com"
required
/>
</div>
<div class="grid gap-2">
<div class="flex items-center">
<Label for="password">Password</Label>
<a href="#" class="ml-auto inline-block text-sm underline">
Forgot your password?
</a>
</div>
<Input id="password" type="password" required />
</div>
<Button type="submit" class="w-full">
Login
</Button>
<Button variant="outline" class="w-full">
Login with Google
</Button>
</div>
<div class="mt-4 text-center text-sm">
Don't have an account?
<a href="#" class="underline">
Sign up
</a>
</div>
</CardContent>
</Card>
</template>

16
apps/www/src/registry/default/block/Login01/page.vue Normal file
View File

@ -0,0 +1,16 @@
<script lang="ts">
export const description
= 'A simple login form with email and password. The submit button says \'Sign in\'.'
export const iframeHeight = '870px'
export const containerClass = 'w-full h-full'
</script>
<script setup lang="ts">
import LoginForm from '@/registry/default/block/Login01/components/LoginForm.vue'
</script>
<template>
<div className="flex h-screen w-full items-center justify-center px-4">
<LoginForm />
</div>
</template>

6
apps/www/src/registry/default/block/Sidebar01/components/AppSidebar.vue
View File

@ -1,6 +1,6 @@
<script setup lang="ts">
import SearchForm from '@/registry/new-york/block/Sidebar01/components/SearchForm.vue'
import VersionSwitcher from '@/registry/new-york/block/Sidebar01/components/VersionSwitcher.vue'
import SearchForm from '@/registry/default/block/Sidebar01/components/SearchForm.vue'
import VersionSwitcher from '@/registry/default/block/Sidebar01/components/VersionSwitcher.vue'
import {
Sidebar,
@ -14,7 +14,7 @@ import {
SidebarMenuItem,
type SidebarProps,
SidebarRail,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
const props = defineProps<SidebarProps>()

4
apps/www/src/registry/default/block/Sidebar01/components/SearchForm.vue
View File

@ -1,10 +1,10 @@
<script setup lang="ts">
import { Label } from '@/registry/new-york/ui/label'
import { Label } from '@/registry/default/ui/label'
import {
SidebarGroup,
SidebarGroupContent,
SidebarInput,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import { Search } from 'lucide-vue-next'
</script>

4
apps/www/src/registry/default/block/Sidebar01/components/VersionSwitcher.vue
View File

@ -4,13 +4,13 @@ import {
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
} from '@/registry/new-york/ui/dropdown-menu'
} from '@/registry/default/ui/dropdown-menu'
import {
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import { Check, ChevronsUpDown, GalleryVerticalEnd } from 'lucide-vue-next'
import { ref } from 'vue'

8
apps/www/src/registry/default/block/Sidebar01/page.vue
View File

@ -5,7 +5,7 @@ export const description
</script>
<script setup lang="ts">
import AppSidebar from '@/registry/new-york/block/Sidebar01/components/AppSidebar.vue'
import AppSidebar from '@/registry/default/block/Sidebar01/components/AppSidebar.vue'
import {
Breadcrumb,
BreadcrumbItem,
@ -13,13 +13,13 @@ import {
BreadcrumbList,
BreadcrumbPage,
BreadcrumbSeparator,
} from '@/registry/new-york/ui/breadcrumb'
import { Separator } from '@/registry/new-york/ui/separator'
} from '@/registry/default/ui/breadcrumb'
import { Separator } from '@/registry/default/ui/separator'
import {
SidebarInset,
SidebarProvider,
SidebarTrigger,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
</script>
<template>

2
apps/www/src/registry/default/block/Sidebar03/components/AppSidebar.vue
View File

@ -12,7 +12,7 @@ import {
SidebarMenuSubItem,
type SidebarProps,
SidebarRail,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import { GalleryVerticalEnd } from 'lucide-vue-next'

8
apps/www/src/registry/default/block/Sidebar03/page.vue
View File

@ -4,7 +4,7 @@ export const description = 'A sidebar with submenus.'
</script>
<script setup lang="ts">
import AppSidebar from '@/registry/new-york/block/Sidebar03/components/AppSidebar.vue'
import AppSidebar from '@/registry/default/block/Sidebar03/components/AppSidebar.vue'
import {
Breadcrumb,
BreadcrumbItem,
@ -12,13 +12,13 @@ import {
BreadcrumbList,
BreadcrumbPage,
BreadcrumbSeparator,
} from '@/registry/new-york/ui/breadcrumb'
import { Separator } from '@/registry/new-york/ui/separator'
} from '@/registry/default/ui/breadcrumb'
import { Separator } from '@/registry/default/ui/separator'
import {
SidebarInset,
SidebarProvider,
SidebarTrigger,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
</script>
<template>

2
apps/www/src/registry/default/block/Sidebar04/components/AppSidebar.vue
View File

@ -11,7 +11,7 @@ import {
SidebarMenuSubButton,
SidebarMenuSubItem,
type SidebarProps,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import { GalleryVerticalEnd } from 'lucide-vue-next'

8
apps/www/src/registry/default/block/Sidebar04/page.vue
View File

@ -4,7 +4,7 @@ export const description = 'A floating sidebar with submenus.'
</script>
<script setup lang="ts">
import AppSidebar from '@/registry/new-york/block/Sidebar04/components/AppSidebar.vue'
import AppSidebar from '@/registry/default/block/Sidebar04/components/AppSidebar.vue'
import {
Breadcrumb,
BreadcrumbItem,
@ -12,13 +12,13 @@ import {
BreadcrumbList,
BreadcrumbPage,
BreadcrumbSeparator,
} from '@/registry/new-york/ui/breadcrumb'
import { Separator } from '@/registry/new-york/ui/separator'
} from '@/registry/default/ui/breadcrumb'
import { Separator } from '@/registry/default/ui/separator'
import {
SidebarInset,
SidebarProvider,
SidebarTrigger,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
</script>
<template>

6
apps/www/src/registry/default/block/Sidebar05/components/AppSidebar.vue
View File

@ -1,10 +1,10 @@
<script setup lang="ts">
import SearchForm from '@/registry/new-york/block/Sidebar05/components/SearchForm.vue'
import SearchForm from '@/registry/default/block/Sidebar05/components/SearchForm.vue'
import {
Collapsible,
CollapsibleContent,
CollapsibleTrigger,
} from '@/registry/new-york/ui/collapsible'
} from '@/registry/default/ui/collapsible'
import {
Sidebar,
SidebarContent,
@ -18,7 +18,7 @@ import {
SidebarMenuSubItem,
type SidebarProps,
SidebarRail,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import { GalleryVerticalEnd, Minus, Plus } from 'lucide-vue-next'
const props = defineProps<SidebarProps>()

4
apps/www/src/registry/default/block/Sidebar05/components/SearchForm.vue
View File

@ -1,10 +1,10 @@
<script setup lang="ts">
import { Label } from '@/registry/new-york/ui/label'
import { Label } from '@/registry/default/ui/label'
import {
SidebarGroup,
SidebarGroupContent,
SidebarInput,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import { Search } from 'lucide-vue-next'
</script>

8
apps/www/src/registry/default/block/Sidebar05/page.vue
View File

@ -4,7 +4,7 @@ export const description = 'A sidebar with collapsible submenus.'
</script>
<script setup lang="ts">
import AppSidebar from '@/registry/new-york/block/Sidebar01/components/AppSidebar.vue'
import AppSidebar from '@/registry/default/block/Sidebar01/components/AppSidebar.vue'
import {
Breadcrumb,
BreadcrumbItem,
@ -12,13 +12,13 @@ import {
BreadcrumbList,
BreadcrumbPage,
BreadcrumbSeparator,
} from '@/registry/new-york/ui/breadcrumb'
import { Separator } from '@/registry/new-york/ui/separator'
} from '@/registry/default/ui/breadcrumb'
import { Separator } from '@/registry/default/ui/separator'
import {
SidebarInset,
SidebarProvider,
SidebarTrigger,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
</script>
<template>

6
apps/www/src/registry/default/block/Sidebar06/components/AppSidebar.vue
View File

@ -1,6 +1,6 @@
<script setup lang="ts">
import NavMain from '@/registry/new-york/block/Sidebar06/components/NavMain.vue'
import SidebarOptInForm from '@/registry/new-york/block/Sidebar06/components/SidebarOptInForm.vue'
import NavMain from '@/registry/default/block/Sidebar06/components/NavMain.vue'
import SidebarOptInForm from '@/registry/default/block/Sidebar06/components/SidebarOptInForm.vue'
import {
Sidebar,
@ -12,7 +12,7 @@ import {
SidebarMenuItem,
type SidebarProps,
SidebarRail,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import { GalleryVerticalEnd } from 'lucide-vue-next'
const props = defineProps<SidebarProps>()

4
apps/www/src/registry/default/block/Sidebar06/components/NavMain.vue
View File

@ -4,14 +4,14 @@ import {
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
} from '@/registry/new-york/ui/dropdown-menu'
} from '@/registry/default/ui/dropdown-menu'
import {
SidebarGroup,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import { useMediaQuery } from '@vueuse/core'
import { type LucideIcon, MoreHorizontal } from 'lucide-vue-next'

6
apps/www/src/registry/default/block/Sidebar06/components/SidebarOptInForm.vue
View File

@ -1,13 +1,13 @@
<script setup lang="ts">
import { Button } from '@/registry/new-york/ui/button'
import { Button } from '@/registry/default/ui/button'
import {
Card,
CardContent,
CardDescription,
CardHeader,
CardTitle,
} from '@/registry/new-york/ui/card'
import { SidebarInput } from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/card'
import { SidebarInput } from '@/registry/default/ui/sidebar'
</script>
<template>

8
apps/www/src/registry/default/block/Sidebar06/page.vue
View File

@ -4,7 +4,7 @@ export const description = 'A sidebar with submenus as dropdowns.'
</script>
<script setup lang="ts">
import AppSidebar from '@/registry/new-york/block/Sidebar06/components/AppSidebar.vue'
import AppSidebar from '@/registry/default/block/Sidebar06/components/AppSidebar.vue'
import {
Breadcrumb,
BreadcrumbItem,
@ -12,13 +12,13 @@ import {
BreadcrumbList,
BreadcrumbPage,
BreadcrumbSeparator,
} from '@/registry/new-york/ui/breadcrumb'
import { Separator } from '@/registry/new-york/ui/separator'
} from '@/registry/default/ui/breadcrumb'
import { Separator } from '@/registry/default/ui/separator'
import {
SidebarInset,
SidebarProvider,
SidebarTrigger,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
</script>
<template>

12
apps/www/src/registry/default/block/Sidebar07/components/AppSidebar.vue
View File

@ -1,17 +1,17 @@
<script setup lang="ts">
import type { SidebarProps } from '@/registry/new-york/ui/sidebar'
import type { SidebarProps } from '@/registry/default/ui/sidebar'
import NavMain from '@/registry/new-york/block/Sidebar07/components/NavMain.vue'
import NavProjects from '@/registry/new-york/block/Sidebar07/components/NavProjects.vue'
import NavUser from '@/registry/new-york/block/Sidebar07/components/NavUser.vue'
import TeamSwitcher from '@/registry/new-york/block/Sidebar07/components/TeamSwitcher.vue'
import NavMain from '@/registry/default/block/Sidebar07/components/NavMain.vue'
import NavProjects from '@/registry/default/block/Sidebar07/components/NavProjects.vue'
import NavUser from '@/registry/default/block/Sidebar07/components/NavUser.vue'
import TeamSwitcher from '@/registry/default/block/Sidebar07/components/TeamSwitcher.vue'
import {
Sidebar,
SidebarContent,
SidebarFooter,
SidebarHeader,
SidebarRail,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import {
AudioWaveform,

4
apps/www/src/registry/default/block/Sidebar07/components/NavMain.vue
View File

@ -3,7 +3,7 @@ import {
Collapsible,
CollapsibleContent,
CollapsibleTrigger,
} from '@/registry/new-york/ui/collapsible'
} from '@/registry/default/ui/collapsible'
import {
SidebarGroup,
SidebarGroupLabel,
@ -13,7 +13,7 @@ import {
SidebarMenuSub,
SidebarMenuSubButton,
SidebarMenuSubItem,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import { ChevronRight, type LucideIcon } from 'lucide-vue-next'
defineProps<{

4
apps/www/src/registry/default/block/Sidebar07/components/NavProjects.vue
View File

@ -5,7 +5,7 @@ import {
DropdownMenuItem,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from '@/registry/new-york/ui/dropdown-menu'
} from '@/registry/default/ui/dropdown-menu'
import {
SidebarGroup,
@ -15,7 +15,7 @@ import {
SidebarMenuButton,
SidebarMenuItem,
useSidebar,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import {
Folder,
Forward,

6
apps/www/src/registry/default/block/Sidebar07/components/NavUser.vue
View File

@ -3,7 +3,7 @@ import {
Avatar,
AvatarFallback,
AvatarImage,
} from '@/registry/new-york/ui/avatar'
} from '@/registry/default/ui/avatar'
import {
DropdownMenu,
@ -13,13 +13,13 @@ import {
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from '@/registry/new-york/ui/dropdown-menu'
} from '@/registry/default/ui/dropdown-menu'
import {
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
useSidebar,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import {
BadgeCheck,
Bell,

4
apps/www/src/registry/default/block/Sidebar07/components/TeamSwitcher.vue
View File

@ -7,14 +7,14 @@ import {
DropdownMenuSeparator,
DropdownMenuShortcut,
DropdownMenuTrigger,
} from '@/registry/new-york/ui/dropdown-menu'
} from '@/registry/default/ui/dropdown-menu'
import {
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
useSidebar,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import { ChevronsUpDown, Plus } from 'lucide-vue-next'
import { type Component, ref } from 'vue'

8
apps/www/src/registry/default/block/Sidebar07/page.vue
View File

@ -6,7 +6,7 @@ export const containerClass = 'w-full h-full'
</script>
<script setup lang="ts">
import AppSidebar from '@/registry/new-york/block/Sidebar07/components/AppSidebar.vue'
import AppSidebar from '@/registry/default/block/Sidebar07/components/AppSidebar.vue'
import {
Breadcrumb,
BreadcrumbItem,
@ -14,13 +14,13 @@ import {
BreadcrumbList,
BreadcrumbPage,
BreadcrumbSeparator,
} from '@/registry/new-york/ui/breadcrumb'
import { Separator } from '@/registry/new-york/ui/separator'
} from '@/registry/default/ui/breadcrumb'
import { Separator } from '@/registry/default/ui/separator'
import {
SidebarInset,
SidebarProvider,
SidebarTrigger,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
</script>
<template>

10
apps/www/src/registry/default/block/Sidebar08/components/AppSidebar.vue
View File

@ -1,9 +1,9 @@
<script setup lang="ts">
import NavMain from '@/registry/new-york/block/Sidebar08/components/NavMain.vue'
import NavMain from '@/registry/default/block/Sidebar08/components/NavMain.vue'
import NavProjects from '@/registry/new-york/block/Sidebar08/components/NavProjects.vue'
import NavSecondary from '@/registry/new-york/block/Sidebar08/components/NavSecondary.vue'
import NavUser from '@/registry/new-york/block/Sidebar08/components/NavUser.vue'
import NavProjects from '@/registry/default/block/Sidebar08/components/NavProjects.vue'
import NavSecondary from '@/registry/default/block/Sidebar08/components/NavSecondary.vue'
import NavUser from '@/registry/default/block/Sidebar08/components/NavUser.vue'
import {
Sidebar,
SidebarContent,
@ -13,7 +13,7 @@ import {
SidebarMenuButton,
SidebarMenuItem,
type SidebarProps,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import {
BookOpen,
Bot,

4
apps/www/src/registry/default/block/Sidebar08/components/NavMain.vue
View File

@ -3,7 +3,7 @@ import {
Collapsible,
CollapsibleContent,
CollapsibleTrigger,
} from '@/registry/new-york/ui/collapsible'
} from '@/registry/default/ui/collapsible'
import {
SidebarGroup,
SidebarGroupLabel,
@ -14,7 +14,7 @@ import {
SidebarMenuSub,
SidebarMenuSubButton,
SidebarMenuSubItem,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import { ChevronRight, type LucideIcon } from 'lucide-vue-next'
defineProps<{

4
apps/www/src/registry/default/block/Sidebar08/components/NavProjects.vue
View File

@ -5,7 +5,7 @@ import {
DropdownMenuItem,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from '@/registry/new-york/ui/dropdown-menu'
} from '@/registry/default/ui/dropdown-menu'
import {
SidebarGroup,
@ -15,7 +15,7 @@ import {
SidebarMenuButton,
SidebarMenuItem,
useSidebar,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import {
Folder,
Forward,

2
apps/www/src/registry/default/block/Sidebar08/components/NavSecondary.vue
View File

@ -7,7 +7,7 @@ import {
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
const props = defineProps<{
items: {

6
apps/www/src/registry/default/block/Sidebar08/components/NavUser.vue
View File

@ -3,7 +3,7 @@ import {
Avatar,
AvatarFallback,
AvatarImage,
} from '@/registry/new-york/ui/avatar'
} from '@/registry/default/ui/avatar'
import {
DropdownMenu,
@ -13,13 +13,13 @@ import {
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from '@/registry/new-york/ui/dropdown-menu'
} from '@/registry/default/ui/dropdown-menu'
import {
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
useSidebar,
} from '@/registry/new-york/ui/sidebar'
} from '@/registry/default/ui/sidebar'
import {
BadgeCheck,
Bell,

Some files were not shown because too many files have changed in this diff Show More