在北美流行的 React,Tailwind, Next.js, framer-motion 技术栈下,看起来很多人选择了 shadcn/ui 或 ...
Our sidebar is kind of buggy and not well scaled, just in general very huge. It also takes a lot of effort to manage it. Shadcn has released a sidebar we want to implement: https://ui.shadcn.com/docs/components/sidebar More specifically ...
import { Sidebar, SidebarContent } from "@/components/ui/sidebar" export function AppSidebar() { return ( <Sidebar> <SidebarContent /> </Sidebar> ) }Copy Now, let's add a SidebarMenu to the sidebar. We'll use the SidebarMenu component in a SidebarGroup. components/app-sidebar.tsx impo...
sidebar-07.json sidebar-09.json sidebar.json registry default block demo-sidebar-rsc.tsx sidebar-02 page.tsx sidebar-07/components app-sidebar.tsx nav-main.tsx team-switcher.tsx sidebar-09/components app-sidebar.tsx ui sidebar.tsx new-york block demo-sidebar-menu-badge.tsx...
The best shadcn/ui kit for Figma - a comprehensive collection of customizable components, charts and assets based on the popular shadcn/ui.
@radix-ui/react-checkbox @radix-ui/react-context-menu @radix-ui/react-dialog @radix-ui/react-dropdown-menu @radix-ui/react-label @radix-ui/react-popover @radix-ui/react-radio-group @radix-ui/react-scroll-area @radix-ui/react-select ...
Installing Shadcn/UI Creating our Pages Advanced Editor Configuration Prisma Configuration Sidebar Configuration and CRUD Operations Editor and Database Synchronization Summary 1. Resources We are going to use the following technologies: Next.js13.4 as the framework ...
The best shadcn/ui kit for Figma - a comprehensive collection of customizable components, charts and assets based on the popular shadcn/ui.
@ferdiunal/refinedev-shadcn-ui 1.0.7•Public• Publisheda year ago refindev-shadcn-ui Sponsors License Dependencies (30) @hookform/resolvers @radix-ui/react-avatar @radix-ui/react-checkbox @radix-ui/react-dialog @radix-ui/react-dropdown-menu ...
SidebarFooter, SidebarHeader, SidebarMenu, SidebarMenuButton, SidebarMenuItem, } from '@/components/ui/sidebar'; const data = { user: { name: '谢明伟', email: 'baiwumm@foxmail.com', avatar: 'logo.svg', }, }; export default function AppSideBar({ ...props }: React.ComponentProps<type...