snapshot of https://github.com/shadcn-ui/ui.git (main, 2026-09-15; blobs > 131072B omitted)

apps/v4/registry/bases/aria/components/example.tsx

@@ -0,0 +1,56 @@
+import { cn } from "cn"
+
+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 style-lyra:rounded-none style-sera:rounded-none *:[div:not([class*='w-'])]:w-full",
+          className
+        )}
+      >
+        {children}
+      </div>
+    </div>
+  )
+}
+
+export { ExampleWrapper, Example }