49 lines
1.5 KiB
TypeScript
49 lines
1.5 KiB
TypeScript
'use client';
|
|
|
|
import React from 'react';
|
|
import { File, Folder, Files } from '@/registry/components/files';
|
|
|
|
export const FilesAdvancedDemo = () => {
|
|
return (
|
|
<Files className="max-w-[500px] w-full" defaultOpen={['app']}>
|
|
<Folder
|
|
name="app"
|
|
className="text-amber-500 justify-between"
|
|
sideComponent={<div className="bg-amber-500 rounded-full size-2" />}
|
|
defaultOpen={['(home)']}
|
|
>
|
|
<Folder
|
|
name="(home)"
|
|
className="text-green-500 justify-between"
|
|
sideComponent={<div className="bg-green-500 rounded-full size-2" />}
|
|
>
|
|
<File
|
|
name="page.tsx"
|
|
className="text-green-500 justify-between"
|
|
sideComponent={<span className="font-medium">U</span>}
|
|
/>
|
|
<File
|
|
name="layout.tsx"
|
|
className="text-green-500 justify-between"
|
|
sideComponent={<span className="font-medium">U</span>}
|
|
/>
|
|
</Folder>
|
|
<File name="layout.tsx" />
|
|
<File
|
|
name="page.tsx"
|
|
className="text-amber-500 justify-between"
|
|
sideComponent={<span className="font-medium">M</span>}
|
|
/>
|
|
<File name="global.css" />
|
|
</Folder>
|
|
<Folder name="components">
|
|
<File name="button.tsx" />
|
|
<File name="tabs.tsx" />
|
|
<File name="dialog.tsx" />
|
|
<Folder name="empty" />
|
|
</Folder>
|
|
<File name="package.json" />
|
|
</Files>
|
|
);
|
|
};
|