51:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 52:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 53:Te44,"use client" // next import Link from "next/link" import { usePathname } from "next/navigation" // shadcn import { Badge } from "@/components/ui/badge" // project-imports import CATEGORY_COUNTS from "@/category-counts.json" import { NAV_COMPONENTS } from "@/components-grid" import { cn } from "@/lib/utils" interface ComponentListProps { search?: string onSelect?: () => void } // ------------------------------ | LAYOUT - COMPONENT LIST | ------------------------------ // export default function ComponentList({ search = "", onSelect, }: ComponentListProps) { const pathname = usePathname() const filteredSections = NAV_COMPONENTS.map((section) => ({ ...section, items: section.items.filter( (item) => item.title.toLowerCase().includes(search.toLowerCase()) || item.slug.toLowerCase().includes(search.toLowerCase()) ), })).filter((section) => section.items.length > 0) const totalComponents = NAV_COMPONENTS.reduce((total, section) => { return ( total + section.items.reduce((secTotal, item) => { return ( secTotal + (CATEGORY_COUNTS[item.slug as keyof typeof CATEGORY_COUNTS] || 0) ) }, 0) ) }, 0) return (

All Component {totalComponents} {filteredSections.map((section) => (

{section.title}

{section.items.map((item) => { const href = `/components/${item.slug}` const isActive = pathname === href return (

{item.title} {item.badge && ( {item.badge.label} )}

{CATEGORY_COUNTS[item.slug as keyof typeof CATEGORY_COUNTS] || 0} ) })}

))}

) } 54:T772,{ "accordion": 10, "alert": 46, "alert-dialog": 10, "aspect-ratio": 5, "attachment": 5, "avatar": 15, "badge": 37, "layout": 14, "breadcrumb": 11, "bubble": 8, "button": 49, "button-group": 15, "calendar": 12, "card": 24, "carousel": 9, "changelog": 3, "chart": 10, "checkbox": 11, "collapsible": 6, "combobox": 14, "command": 9, "context-menu": 13, "coupon": 3, "cursor": 3, "data-table": 4, "date-picker": 8, "dialog": 15, "drawer": 6, "dropdown-menu": 25, "empty": 8, "field": 12, "hover-card": 5, "input": 16, "input-group": 22, "input-otp": 11, "item": 15, "kbd": 7, "label": 4, "list-group": 13, "marker": 7, "menubar": 8, "message": 5, "message-scroller": 9, "native-select": 3, "navigation-menu": 3, "pagination": 11, "popover": 8, "progress": 20, "questionnaire": 7, "radio": 1, "radio-group": 9, "resizable": 7, "scroll-area": 5, "select": 10, "separator": 8, "sheet": 5, "sidebar": 17, "skeleton": 8, "slider": 8, "sonner": 8, "spinner": 21, "switch": 11, "table": 6, "tabs": 10, "textarea": 8, "timeline": 7, "toggle": 6, "toggle-group": 8, "tooltip": 11, "tree-view": 7, "typography": 22, "contact": 24, "content": 17, "cta": 12, "e-commerce": 25, "faq": 19, "feature": 42, "footer": 21, "gallery": 11, "hero": 32, "landing": 14, "portfolio": 11, "pricing": 19, "process": 13, "small-hero": 7, "statistics": 13, "team": 14, "testimonial": 24, "bento": 8, "charts": 8, "check-mail": 2, "code-verification": 7, "coming-soon": 2, "component-layout": 1, "dashboard-layout": 1, "doc-layout": 1, "error-404": 2, "error-500": 2, "forgot-password": 5, "join-waitlist": 1, "login": 7, "navbar": 11, "reset-password": 1, "sign-up": 7, "tables": 1, "under-construction": 2, "widgets": 20 } 55:T3adc,export interface CategoryItem { title: string slug: string badge?: { label: string } breakpoints?: { xs?: number sm?: number md?: number lg?: number xl?: number xxl?: number } } export interface NavSection { title: string items: CategoryItem[] } export interface DocItem { title: string slug: string } export const NAV_DOCS: DocItem[] = [ { title: "Introduction", slug: "introduction" }, { title: "Pro Purchase Guide", slug: "pro-purchase-guide" }, { title: "Installation", slug: "installation" }, { title: "Shadcn CLI", slug: "cli" }, { title: "Components", slug: "components" }, { title: "Blocks", slug: "blocks" }, { title: "Templates", slug: "templates" }, { title: "Admin Dashboard", slug: "admin-dashboard" }, { title: "Figma", slug: "figma" }, { title: "MCP", slug: "mcp" }, { title: "Changelog", slug: "changelog" }, { title: "License", slug: "license" }, ] export const NAV_COMPONENTS: NavSection[] = [ { title: "Inputs", items: [ { title: "Button", slug: "button", breakpoints: { xl: 3, lg: 2, xs: 1 } }, { title: "Button Group", slug: "button-group", breakpoints: { xxl: 3, lg: 2, sm: 1, xs: 1 }, }, { title: "Checkbox", slug: "checkbox", breakpoints: { lg: 2, xs: 1 }, }, { title: "Combobox", slug: "combobox", breakpoints: { xl: 3, lg: 2, xs: 1 }, }, { title: "Command", slug: "command", breakpoints: { xl: 3, lg: 2, md: 1, sm: 1, xs: 1 }, }, { title: "Date Picker", slug: "date-picker", breakpoints: { xl: 3, lg: 2, md: 1, sm: 1, xs: 1 }, }, { title: "Input", slug: "input", breakpoints: { lg: 2, md: 2, sm: 1, xs: 1 }, }, { title: "Input Group", slug: "input-group", breakpoints: { md: 2, sm: 1, xs: 1 }, }, { title: "Input OTP", slug: "input-otp", breakpoints: { md: 2, xs: 1 } }, { title: "Item", slug: "item", breakpoints: { md: 2, xs: 1 } }, { title: "Native Select", slug: "native-select", breakpoints: { lg: 3, md: 2, sm: 1, xs: 1 }, }, { title: "Questionnaire", slug: "questionnaire", breakpoints: { xl: 2, lg: 2, md: 1, sm: 1, xs: 1 }, }, { title: "Radio", slug: "radio", breakpoints: { xs: 1 } }, { title: "Radio Group", slug: "radio-group", breakpoints: { lg: 2, md: 1, sm: 1, xs: 1 }, }, { title: "Select", slug: "select", breakpoints: { lg: 3, md: 2, sm: 1, xs: 1 }, }, { title: "Slider", slug: "slider", breakpoints: { xl: 3, lg: 2, md: 2, sm: 1, xs: 1 }, }, { title: "Switch", slug: "switch", breakpoints: { md: 2, sm: 2, xs: 1 } }, { title: "Textarea", slug: "textarea", breakpoints: { lg: 2, md: 2, sm: 1, xs: 1 }, }, { title: "Toggle", slug: "toggle", breakpoints: { sm: 2, xs: 1 } }, { title: "Toggle Group", slug: "toggle-group", breakpoints: { md: 2, sm: 1, xs: 1 }, }, { title: "Calendar", slug: "calendar", breakpoints: { lg: 2, sm: 1, xs: 1 }, }, ], }, { title: "Data Display", items: [ { title: "Coupon", slug: "coupon", breakpoints: { lg: 2, md: 2, sm: 1, xs: 1 }, }, { title: "Attachment", slug: "attachment", breakpoints: { lg: 2, xs: 1 }, }, { title: "Avatar", slug: "avatar", breakpoints: { lg: 3, sm: 2, xs: 1 } }, { title: "Badge", slug: "badge", breakpoints: { lg: 3, sm: 2, xs: 1 } }, { title: "Bubble", slug: "bubble", breakpoints: { lg: 2, xs: 1 }, }, { title: "Card", slug: "card", breakpoints: { lg: 2, md: 1, sm: 1, xs: 1 }, }, { title: "Carousel", slug: "carousel", breakpoints: { xl: 2, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Chart", slug: "chart", breakpoints: { xl: 2, lg: 2, md: 1, sm: 1, xs: 1 }, }, { title: "Data Table", slug: "data-table", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Empty", slug: "empty", breakpoints: { xl: 3, lg: 2, md: 2, sm: 1, xs: 1 }, }, { title: "Field", slug: "field", breakpoints: { lg: 2, md: 2, sm: 1, xs: 1 }, }, { title: "Hover Card", slug: "hover-card", breakpoints: { md: 2, sm: 1, xs: 1 }, }, { title: "Kbd", slug: "kbd", breakpoints: { md: 2, sm: 2, xs: 1 } }, { title: "Label", slug: "label", breakpoints: { xs: 1 } }, { title: "Marker", slug: "marker", breakpoints: { lg: 2, xs: 1 }, }, { title: "Message", slug: "message", breakpoints: { lg: 2, xs: 1 }, }, { title: "Message Scroller", slug: "message-scroller", breakpoints: { lg: 2, xs: 1 }, }, { title: "List Group", slug: "list-group", breakpoints: { lg: 2, md: 1, sm: 1, xs: 1 }, }, { title: "Scroll Area", slug: "scroll-area", breakpoints: { lg: 2, md: 1, sm: 1, xs: 1 }, }, { title: "Separator", slug: "separator", breakpoints: { md: 2, sm: 1, xs: 1 }, }, { title: "Table", slug: "table", breakpoints: { xl: 2, md: 1, sm: 1, xs: 1 }, }, { title: "Tooltip", slug: "tooltip", breakpoints: { lg: 3, sm: 2, xs: 1 }, }, { title: "Typography", slug: "typography", breakpoints: { xl: 2, lg: 2, md: 1, sm: 1, xs: 1 }, }, { title: "Aspect Ratio", slug: "aspect-ratio", breakpoints: { md: 2, sm: 1, xs: 1 }, }, { title: "Skeleton", slug: "skeleton", breakpoints: { lg: 3, md: 2, sm: 1, xs: 1 }, }, { title: "Timeline", slug: "timeline", breakpoints: { xl: 2, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Tree View", slug: "tree-view", breakpoints: { xl: 2, lg: 1, md: 1, sm: 1, xs: 1 }, }, ], }, { title: "Feedback", items: [ { title: "Alert", slug: "alert", breakpoints: { xl: 2, lg: 2, md: 1, sm: 1, xs: 1 }, }, { title: "Alert Dialog", slug: "alert-dialog", breakpoints: { xl: 3, lg: 3, md: 2, sm: 1, xs: 1 }, }, { title: "Dialog", slug: "dialog", breakpoints: { xl: 3, lg: 3, md: 2, sm: 1, xs: 1 }, }, { title: "Drawer", slug: "drawer", breakpoints: { xl: 3, lg: 2, md: 2, sm: 1, xs: 1 }, }, { title: "Progress", slug: "progress", breakpoints: { xl: 3, lg: 2, md: 2, sm: 1, xs: 1 }, }, { title: "Sheet", slug: "sheet", breakpoints: { md: 2, xs: 1 } }, { title: "Sonner", slug: "sonner", breakpoints: { md: 2, sm: 1, xs: 1 } }, { title: "Spinner", slug: "spinner", breakpoints: { lg: 3, sm: 2, xs: 1 }, }, ], }, { title: "Navigation", items: [ { title: "Breadcrumb", slug: "breadcrumb", breakpoints: { xl: 2, lg: 2, md: 1, sm: 1, xs: 1 }, }, { title: "Dropdown Menu", slug: "dropdown-menu", breakpoints: { lg: 3, md: 2, sm: 1, xs: 1 }, }, { title: "Menubar", slug: "menubar", breakpoints: { lg: 2, md: 2, sm: 1, xs: 1 }, }, { title: "Navigation Menu", slug: "navigation-menu", breakpoints: { xs: 1 }, }, { title: "Pagination", slug: "pagination", breakpoints: { xl: 2, lg: 2, md: 1, sm: 1, xs: 1 }, }, { title: "Tabs", slug: "tabs", breakpoints: { lg: 2, md: 1, sm: 1, xs: 1 }, }, { title: "Sidebar", slug: "sidebar", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, ], }, { title: "Surfaces", items: [ { title: "Accordion", slug: "accordion", breakpoints: { xl: 2, lg: 2, md: 1, sm: 1, xs: 1 }, }, { title: "Collapsible", slug: "collapsible", breakpoints: { lg: 2, md: 1, sm: 1, xs: 1 }, }, ], }, { title: "Utils", items: [ { title: "Context Menu", slug: "context-menu", breakpoints: { md: 2, sm: 1, xs: 1 }, }, { title: "Cursor", slug: "cursor", breakpoints: { xl: 2, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Popover", slug: "popover", breakpoints: { lg: 3, md: 2, sm: 1 }, }, { title: "Resizable", slug: "resizable", breakpoints: { xl: 2, lg: 1, md: 1, sm: 1, xs: 1 }, }, ], }, ] export const NAV_BLOCKS: NavSection[] = [ { title: "UI", items: [ { title: "Bento", slug: "bento", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Call To Action", slug: "cta", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Contact", slug: "contact", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Content", slug: "content", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "E-commerce", slug: "e-commerce", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "FAQ", slug: "faq", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Feature", slug: "feature", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Footer", slug: "footer", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Gallery", slug: "gallery", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Hero", slug: "hero", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Small Hero", slug: "small-hero", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Portfolio", slug: "portfolio", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Pricing", slug: "pricing", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Process", slug: "process", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Statistics", slug: "statistics", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Team", slug: "team", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Testimonial", slug: "testimonial", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Login", slug: "login", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Sign Up", slug: "sign-up", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Forgot Password", slug: "forgot-password", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Reset Password", slug: "reset-password", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Check Mail", slug: "check-mail", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Code Verification", slug: "code-verification", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Error 404", slug: "error-404", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Error 500", slug: "error-500", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Coming Soon", slug: "coming-soon", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Under Construction", slug: "under-construction", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Join Waitlist", slug: "join-waitlist", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Widgets", slug: "widgets", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Charts", slug: "charts", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Tables", slug: "tables", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Navbar", slug: "navbar", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, ], }, { title: "Layout", items: [ { title: "Dashboard Layout", slug: "dashboard-layout", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Component Layout", slug: "component-layout", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, { title: "Doc Layout", slug: "doc-layout", breakpoints: { xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }, }, ], }, ] export const NAV_TEMPLATES: NavSection[] = [ { title: "LMS", items: [ { title: "LearnAble", slug: "lms-1" }, { title: "Learnly", slug: "lms-2" }, ], }, { title: "Finance", items: [{ title: "Housiq", slug: "finance-1" }], }, { title: "AI", items: [{ title: "Cortex AI", slug: "ai-1" }], }, { title: "Portfolio", items: [{ title: "Portfolio", slug: "portfolio-1" }], }, { title: "SaaS", items: [{ title: "Nexus", slug: "saas-1" }], }, { title: "SEO", items: [{ title: "wope", slug: "seo-1" }], }, ] export const NAV_DASHBOARD: NavSection[] = [ { title: "DASHBOARD", items: [ { title: "OrbitCN Default Dashboard", slug: "default-dashboard" }, { title: "OrbitCN LMS Dashboard", slug: "lms-dashboard" }, { title: "OrbitCN Finance Dashboard", slug: "finance-dashboard" }, ], }, ] export const categories = [ ...NAV_COMPONENTS, ...NAV_BLOCKS, ...NAV_TEMPLATES, ...NAV_DASHBOARD, ].flatMap((section) => section.items) 50:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[null,["$","$L51",null,{"namespace":"@uiable","registryDependencies":["@uiable/badge"]}]]}],null]}],["$","$L52",null,{"files":[{"path":"src/components/uiable/layout/component-list.tsx","content":"$53","type":"registry:component","target":"@components/uiable/layout/component-list.tsx"},{"path":"src/category-counts.json","content":"$54","type":"registry:file","target":"src/category-counts.json"},{"path":"src/components-grid.ts","content":"$55","type":"registry:component","target":"src/components-grid.ts"}],"className":"h-[70svh] min-h-80"}]]}]