mirror of
https://github.com/hanzoai/shadcn.git
synced 2026-10-30 18:22:59 +00:00
zeekay
05fc512820
Upstream sync from shadcn-ui/ui (1686 commits since last merge base). Key changes: - packages/shadcn upgraded to 4.1.0 (CLI font transformers, scaffold from github, chart colors) - apps/v4 replaces apps/www as the primary docs/registry app - Font system: 25+ heading font registries, font markers utility, @supports override - Chart improvements: recharts v3 compat, radial chart fixes - templates/ updated with monorepo variants (astro, vite, react-router, start) - skills/shadcn AI skill definitions added - deprecated/ removed (auth, auth-firebase, cli, www) Preserved Hanzo-only paths: app/, pkg/, demo/, docs/, template/next/
57 lines
1.3 KiB
TypeScript
57 lines
1.3 KiB
TypeScript
import { cn } from "@/registry/bases/base/lib/utils"
|
|
|
|
function ExampleWrapper({ className, ...props }: React.ComponentProps<"div">) {
|
|
return (
|
|
<div className="w-full bg-muted dark:bg-background">
|
|
<div
|
|
data-slot="example-wrapper"
|
|
className={cn(
|
|
"mx-auto grid min-h-screen w-full max-w-5xl min-w-0 content-center items-start gap-8 p-4 pt-2 sm:gap-12 sm:p-6 md:grid-cols-2 md:gap-8 lg:p-12 2xl:max-w-6xl",
|
|
|
|
className
|
|
)}
|
|
{...props}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
function Example({
|
|
title,
|
|
children,
|
|
className,
|
|
containerClassName,
|
|
...props
|
|
}: React.ComponentProps<"div"> & {
|
|
title?: string
|
|
containerClassName?: string
|
|
}) {
|
|
return (
|
|
<div
|
|
data-slot="example"
|
|
className={cn(
|
|
"mx-auto flex w-full max-w-lg min-w-0 flex-col gap-1 self-stretch lg:max-w-none",
|
|
containerClassName
|
|
)}
|
|
{...props}
|
|
>
|
|
{title && (
|
|
<div className="px-1.5 py-2 text-xs font-medium text-muted-foreground">
|
|
{title}
|
|
</div>
|
|
)}
|
|
<div
|
|
data-slot="example-content"
|
|
className={cn(
|
|
"flex min-w-0 flex-1 flex-col items-start gap-6 rounded-xl bg-card p-12 text-foreground *:[div:not([class*='w-'])]:w-full",
|
|
className
|
|
)}
|
|
>
|
|
{children}
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export { ExampleWrapper, Example }
|