fix

.github/workflows/validate-registries.yml

@@ -4,13 +4,11 @@ on:
   pull_request:
     paths:
       - "apps/v4/public/r/registries.json"
-      - "apps/v4/registry/directory.json"
   push:
     branches:
       - main
     paths:
       - "apps/v4/public/r/registries.json"
-      - "apps/v4/registry/directory.json"
 
 jobs:
   validate:
@@ -49,5 +47,8 @@ jobs:
       - name: Install dependencies
         run: pnpm install
 
+      - name: Build packages
+        run: pnpm build --filter=shadcn
+
       - name: Validate registries
         run: pnpm --filter=v4 validate:registries

.gitignore

@@ -41,4 +41,3 @@ tsconfig.tsbuildinfo
 .vscode
 
 .notes
-.playwright-mcp

apps/v4/components/block-viewer.tsx

@@ -154,12 +154,12 @@ function BlockViewerToolbar({ styleName }: { styleName: Style["name"] }) {
         value={view}
         onValueChange={(value) => setView(value as "preview" | "code")}
       >
-        <TabsList className="grid h-8! grid-cols-2 items-center rounded-lg p-1 *:data-[slot=tabs-trigger]:h-6 *:data-[slot=tabs-trigger]:rounded-sm *:data-[slot=tabs-trigger]:px-2 *:data-[slot=tabs-trigger]:text-xs">
+        <TabsList className="grid h-8 grid-cols-2 items-center rounded-md p-1 *:data-[slot=tabs-trigger]:h-6 *:data-[slot=tabs-trigger]:rounded-sm *:data-[slot=tabs-trigger]:px-2 *:data-[slot=tabs-trigger]:text-xs">
           <TabsTrigger value="preview">Preview</TabsTrigger>
           <TabsTrigger value="code">Code</TabsTrigger>
         </TabsList>
       </Tabs>
-      <Separator orientation="vertical" className="mx-2 h-4!" />
+      <Separator orientation="vertical" className="mx-2 !h-4" />
       <a
         href={`#${item.name}`}
         className="flex-1 text-center text-sm font-medium underline-offset-2 hover:underline md:flex-auto md:text-left"
@@ -167,7 +167,7 @@ function BlockViewerToolbar({ styleName }: { styleName: Style["name"] }) {
         {item.description?.replace(/\.$/, "")}
       </a>
       <div className="ml-auto flex items-center gap-2">
-        <div className="h-8 items-center gap-1.5 rounded-md border p-[3px] shadow-none">
+        <div className="h-8 items-center gap-1.5 rounded-md border p-1 shadow-none">
           <ToggleGroup
             type="single"
             defaultValue="100"
@@ -177,7 +177,7 @@ function BlockViewerToolbar({ styleName }: { styleName: Style["name"] }) {
                 resizablePanelRef.current.resize(parseInt(value))
               }
             }}
-            className="gap-1 *:data-[slot=toggle-group-item]:size-6! *:data-[slot=toggle-group-item]:rounded-sm!"
+            className="gap-1 *:data-[slot=toggle-group-item]:!size-6 *:data-[slot=toggle-group-item]:!rounded-sm"
           >
             <ToggleGroupItem value="100" title="Desktop">
               <Monitor />
@@ -188,7 +188,7 @@ function BlockViewerToolbar({ styleName }: { styleName: Style["name"] }) {
             <ToggleGroupItem value="30" title="Mobile">
               <Smartphone />
             </ToggleGroupItem>
-            <Separator orientation="vertical" className="h-4!" />
+            <Separator orientation="vertical" className="!h-4" />
             <Button
               size="icon"
               variant="ghost"
@@ -201,7 +201,7 @@ function BlockViewerToolbar({ styleName }: { styleName: Style["name"] }) {
                 <Fullscreen />
               </Link>
             </Button>
-            <Separator orientation="vertical" className="h-4!" />
+            <Separator orientation="vertical" className="!h-4" />
             <Button
               size="icon"
               variant="ghost"
@@ -218,7 +218,7 @@ function BlockViewerToolbar({ styleName }: { styleName: Style["name"] }) {
             </Button>
           </ToggleGroup>
         </div>
-        <Separator orientation="vertical" className="mx-1 h-4!" />
+        <Separator orientation="vertical" className="mx-1 !h-4" />
         <Button
           variant="outline"
           className="w-fit gap-1 px-2 shadow-none"
@@ -230,7 +230,7 @@ function BlockViewerToolbar({ styleName }: { styleName: Style["name"] }) {
           {isCopied ? <Check /> : <Terminal />}
           <span>npx shadcn add {item.name}</span>
         </Button>
-        <Separator orientation="vertical" className="mx-1 h-4!" />
+        <Separator orientation="vertical" className="mx-1 !h-4" />
         <OpenInV0Button name={item.name} />
       </div>
     </div>

apps/v4/components/command-menu.tsx

@@ -592,7 +592,7 @@ function DialogContent({
       <DialogPrimitive.Content
         data-slot="dialog-content"
         className={cn(
-          "bg-background fixed top-[15%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 outline-none sm:max-w-lg",
+          "bg-background fixed top-1/3 left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 outline-none sm:max-w-lg",
           className
         )}
         {...props}

apps/v4/content/docs/changelog/2023-12-new-components.mdx

@@ -47,7 +47,7 @@ Build resizable panel groups and layouts with this `<Resizable />` component.
 
 ### Sonner
 
-Another one by [emilkowalski](https://twitter.com/emilkowalski). The last toast component you'll ever need. Sonner is now available in shadcn/ui.
+Another one by [emilkowalski](https://twitter.com/emilkowalski). The last toast component you'll ever need. Sonner is now availabe in shadcn/ui.
 
 <ComponentPreview name="sonner-demo" />
 

apps/v4/content/docs/components/base/toggle-group.mdx

@@ -96,16 +96,6 @@ Use `orientation="vertical"` for vertical toggle groups.
 
 <ComponentPreview styleName="base-nova" name="toggle-group-disabled" />
 
-### Custom
-
-A custom toggle group example.
-
-<ComponentPreview
-  styleName="base-nova"
-  name="toggle-group-font-weight-selector"
-  previewClassName="*:data-[slot=field]:max-w-xs"
-/>
-
 ## RTL
 
 To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl).

apps/v4/content/docs/components/radix/sonner.mdx

@@ -123,4 +123,4 @@ Use the `position` prop to change the position of the toast.
 
 ## API Reference
 
-See the [Sonner API Reference](https://sonner.emilkowal.ski/getting-started) for more information.
+See the [Sonner API Reference](https://sonner.emilkowal.ski/api) for more information.

apps/v4/content/docs/components/radix/toggle-group.mdx

@@ -96,16 +96,6 @@ Use `orientation="vertical"` for vertical toggle groups.
 
 <ComponentPreview styleName="radix-nova" name="toggle-group-disabled" />
 
-### Custom
-
-A custom toggle group example.
-
-<ComponentPreview
-  styleName="radix-nova"
-  name="toggle-group-font-weight-selector"
-  previewClassName="*:data-[slot=field]:max-w-xs"
-/>
-
 ## RTL
 
 To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl).

apps/v4/content/docs/forms/react-hook-form.mdx

@@ -22,7 +22,7 @@ We are going to build the following form. It has a simple text input and a texta
 
 <ComponentPreview
   name="form-rhf-demo"
-  className="sm:[&_.preview]:h-[700px]"
+  className="sm:[&_.preview]:h-[700px] sm:[&_pre]:!h-[700px]"
   chromeLessOnMobile
 />
 
@@ -229,7 +229,7 @@ Display errors next to the field using `<FieldError />`. For styling and accessi
 
 <ComponentPreview
   name="form-rhf-input"
-  className="sm:[&_.preview]:h-[700px]"
+  className="sm:[&_.preview]:h-[700px] sm:[&_pre]:!h-[700px]"
   chromeLessOnMobile
 />
 
@@ -256,7 +256,7 @@ For simple text inputs, spread the `field` object onto the input.
 
 <ComponentPreview
   name="form-rhf-textarea"
-  className="sm:[&_.preview]:h-[700px]"
+  className="sm:[&_.preview]:h-[700px] sm:[&_pre]:!h-[700px]"
   chromeLessOnMobile
 />
 
@@ -293,7 +293,7 @@ For textarea fields, spread the `field` object onto the textarea.
 
 <ComponentPreview
   name="form-rhf-select"
-  className="sm:[&_.preview]:h-[500px]"
+  className="sm:[&_.preview]:h-[500px] sm:[&_pre]:!h-[500px]"
   chromeLessOnMobile
 />
 
@@ -342,7 +342,7 @@ For textarea fields, spread the `field` object onto the textarea.
 
 <ComponentPreview
   name="form-rhf-checkbox"
-  className="sm:[&_.preview]:h-[700px]"
+  className="sm:[&_.preview]:h-[700px] sm:[&_pre]:!h-[700px]"
   chromeLessOnMobile
 />
 
@@ -397,7 +397,7 @@ For textarea fields, spread the `field` object onto the textarea.
 
 <ComponentPreview
   name="form-rhf-radiogroup"
-  className="sm:[&_.preview]:h-[700px]"
+  className="sm:[&_.preview]:h-[700px] sm:[&_pre]:!h-[700px]"
   chromeLessOnMobile
 />
 
@@ -445,7 +445,7 @@ For textarea fields, spread the `field` object onto the textarea.
 
 <ComponentPreview
   name="form-rhf-switch"
-  className="sm:[&_.preview]:h-[500px]"
+  className="sm:[&_.preview]:h-[500px] sm:[&_pre]:!h-[500px]"
   chromeLessOnMobile
 />
 
@@ -482,7 +482,7 @@ Here is an example of a more complex form with multiple fields and validation.
 
 <ComponentPreview
   name="form-rhf-complex"
-  className="sm:[&_.preview]:h-[1300px]"
+  className="sm:[&_.preview]:h-[1300px] sm:[&_pre]:!h-[1300px]"
   chromeLessOnMobile
 />
 
@@ -502,7 +502,7 @@ React Hook Form provides a `useFieldArray` hook for managing dynamic array field
 
 <ComponentPreview
   name="form-rhf-array"
-  className="sm:[&_.preview]:h-[700px]"
+  className="sm:[&_.preview]:h-[700px] sm:[&_pre]:!h-[700px]"
   chromeLessOnMobile
 />
 

apps/v4/content/docs/forms/tanstack-form.mdx

@@ -22,7 +22,7 @@ We'll start by building the following form. It has a simple text input and a tex
 
 <ComponentPreview
   name="form-tanstack-demo"
-  className="sm:[&_.preview]:h-[700px]"
+  className="sm:[&_.preview]:h-[700px] sm:[&_pre]:!h-[700px]"
   chromeLessOnMobile
 />
 
@@ -259,7 +259,7 @@ Display errors next to the field using `<FieldError />`. For styling and accessi
 
 <ComponentPreview
   name="form-tanstack-input"
-  className="sm:[&_.preview]:h-[700px]"
+  className="sm:[&_.preview]:h-[700px] sm:[&_pre]:!h-[700px]"
   chromeLessOnMobile
 />
 
@@ -299,7 +299,7 @@ Display errors next to the field using `<FieldError />`. For styling and accessi
 
 <ComponentPreview
   name="form-tanstack-textarea"
-  className="sm:[&_.preview]:h-[700px]"
+  className="sm:[&_.preview]:h-[700px] sm:[&_pre]:!h-[700px]"
   chromeLessOnMobile
 />
 
@@ -341,7 +341,7 @@ Display errors next to the field using `<FieldError />`. For styling and accessi
 
 <ComponentPreview
   name="form-tanstack-select"
-  className="sm:[&_.preview]:h-[700px]"
+  className="sm:[&_.preview]:h-[700px] sm:[&_pre]:!h-[700px]"
   chromeLessOnMobile
 />
 
@@ -393,7 +393,7 @@ Display errors next to the field using `<FieldError />`. For styling and accessi
 
 <ComponentPreview
   name="form-tanstack-checkbox"
-  className="sm:[&_.preview]:h-[700px]"
+  className="sm:[&_.preview]:h-[700px] sm:[&_pre]:!h-[700px]"
   chromeLessOnMobile
 />
 
@@ -455,7 +455,7 @@ Display errors next to the field using `<FieldError />`. For styling and accessi
 
 <ComponentPreview
   name="form-tanstack-radiogroup"
-  className="sm:[&_.preview]:h-[700px]"
+  className="sm:[&_.preview]:h-[700px] sm:[&_pre]:!h-[700px]"
   chromeLessOnMobile
 />
 
@@ -508,7 +508,7 @@ Display errors next to the field using `<FieldError />`. For styling and accessi
 
 <ComponentPreview
   name="form-tanstack-switch"
-  className="sm:[&_.preview]:h-[500px]"
+  className="sm:[&_.preview]:h-[500px] sm:[&_pre]:!h-[500px]"
   chromeLessOnMobile
 />
 
@@ -547,7 +547,7 @@ Here is an example of a more complex form with multiple fields and validation.
 
 <ComponentPreview
   name="form-tanstack-complex"
-  className="sm:[&_.preview]:h-[1100px]"
+  className="sm:[&_.preview]:h-[1100px] sm:[&_pre]:!h-[1100px]"
   chromeLessOnMobile
 />
 
@@ -567,7 +567,7 @@ TanStack Form provides powerful array field management with `mode="array"`. This
 
 <ComponentPreview
   name="form-tanstack-array"
-  className="sm:[&_.preview]:h-[700px]"
+  className="sm:[&_.preview]:h-[700px] sm:[&_pre]:!h-[700px]"
   chromeLessOnMobile
 />
 

apps/v4/examples/__index__.tsx

@@ -5244,19 +5244,6 @@ export const ExamplesIndex: Record<string, Record<string, any>> = {
         return { default: mod.default || mod[exportName] }
       }),
     },
-    "toggle-group-font-weight-selector": {
-      name: "toggle-group-font-weight-selector",
-      filePath: "examples/radix/toggle-group-font-weight-selector.tsx",
-      component: React.lazy(async () => {
-        const mod = await import("./radix/toggle-group-font-weight-selector")
-        const exportName =
-          Object.keys(mod).find(
-            (key) =>
-              typeof mod[key] === "function" || typeof mod[key] === "object"
-          ) || "toggle-group-font-weight-selector"
-        return { default: mod.default || mod[exportName] }
-      }),
-    },
     "toggle-group-outline": {
       name: "toggle-group-outline",
       filePath: "examples/radix/toggle-group-outline.tsx",
@@ -10875,19 +10862,6 @@ export const ExamplesIndex: Record<string, Record<string, any>> = {
         return { default: mod.default || mod[exportName] }
       }),
     },
-    "toggle-group-font-weight-selector": {
-      name: "toggle-group-font-weight-selector",
-      filePath: "examples/base/toggle-group-font-weight-selector.tsx",
-      component: React.lazy(async () => {
-        const mod = await import("./base/toggle-group-font-weight-selector")
-        const exportName =
-          Object.keys(mod).find(
-            (key) =>
-              typeof mod[key] === "function" || typeof mod[key] === "object"
-          ) || "toggle-group-font-weight-selector"
-        return { default: mod.default || mod[exportName] }
-      }),
-    },
     "toggle-group-outline": {
       name: "toggle-group-outline",
       filePath: "examples/base/toggle-group-outline.tsx",

apps/v4/examples/base/calendar-hijri.tsx

@@ -1,7 +1,6 @@
 "use client"
 
 import * as React from "react"
-import { Vazirmatn } from "next/font/google"
 import { Button, buttonVariants } from "@/examples/base/ui/button"
 import {
   ChevronDownIcon,
@@ -13,23 +12,19 @@ import { DayPicker } from "react-day-picker/persian"
 
 import { cn } from "@/lib/utils"
 
-const vazirmatn = Vazirmatn({ subsets: ["arabic"] })
-
 export default function CalendarHijri() {
   const [date, setDate] = React.useState<Date | undefined>(
     new Date(2025, 5, 12)
   )
 
   return (
-    <div className={vazirmatn.className}>
-      <Calendar
-        mode="single"
-        defaultMonth={date}
-        selected={date}
-        onSelect={setDate}
-        className="rounded-lg border"
-      />
-    </div>
+    <Calendar
+      mode="single"
+      defaultMonth={date}
+      selected={date}
+      onSelect={setDate}
+      className="rounded-lg border"
+    />
   )
 }
 

apps/v4/examples/base/toggle-group-font-weight-selector.tsx

@@ -1,61 +0,0 @@
-"use client"
-
-import * as React from "react"
-import { Field, FieldDescription, FieldLabel } from "@/examples/base/ui/field"
-import { ToggleGroup, ToggleGroupItem } from "@/examples/base/ui/toggle-group"
-
-export function ToggleGroupFontWeightSelector() {
-  const [fontWeight, setFontWeight] = React.useState("normal")
-  return (
-    <Field>
-      <FieldLabel>Font Weight</FieldLabel>
-      <ToggleGroup
-        value={[fontWeight]}
-        onValueChange={(value) => setFontWeight(value[0])}
-        variant="outline"
-        spacing={2}
-        size="lg"
-      >
-        <ToggleGroupItem
-          value="light"
-          aria-label="Light"
-          className="flex size-16 flex-col items-center justify-center rounded-xl"
-        >
-          <span className="text-2xl leading-none font-light">Aa</span>
-          <span className="text-muted-foreground text-xs">Light</span>
-        </ToggleGroupItem>
-        <ToggleGroupItem
-          value="normal"
-          aria-label="Normal"
-          className="flex size-16 flex-col items-center justify-center rounded-xl"
-        >
-          <span className="text-2xl leading-none font-normal">Aa</span>
-          <span className="text-muted-foreground text-xs">Normal</span>
-        </ToggleGroupItem>
-        <ToggleGroupItem
-          value="medium"
-          aria-label="Medium"
-          className="flex size-16 flex-col items-center justify-center rounded-xl"
-        >
-          <span className="text-2xl leading-none font-medium">Aa</span>
-          <span className="text-muted-foreground text-xs">Medium</span>
-        </ToggleGroupItem>
-        <ToggleGroupItem
-          value="bold"
-          aria-label="Bold"
-          className="flex size-16 flex-col items-center justify-center rounded-xl"
-        >
-          <span className="text-2xl leading-none font-bold">Aa</span>
-          <span className="text-muted-foreground text-xs">Bold</span>
-        </ToggleGroupItem>
-      </ToggleGroup>
-      <FieldDescription>
-        Use{" "}
-        <code className="bg-muted rounded-md px-1 py-0.5 font-mono">
-          font-{fontWeight}
-        </code>{" "}
-        to set the font weight.
-      </FieldDescription>
-    </Field>
-  )
-}

apps/v4/examples/radix/calendar-hijri.tsx

@@ -1,7 +1,6 @@
 "use client"
 
 import * as React from "react"
-import { Vazirmatn } from "next/font/google"
 import { Button, buttonVariants } from "@/examples/radix/ui/button"
 import {
   ChevronDownIcon,
@@ -13,23 +12,19 @@ import { DayPicker } from "react-day-picker/persian"
 
 import { cn } from "@/lib/utils"
 
-const vazirmatn = Vazirmatn({ subsets: ["arabic"] })
-
 export default function CalendarHijri() {
   const [date, setDate] = React.useState<Date | undefined>(
     new Date(2025, 5, 12)
   )
 
   return (
-    <div className={vazirmatn.className}>
-      <Calendar
-        mode="single"
-        defaultMonth={date}
-        selected={date}
-        onSelect={setDate}
-        className="rounded-lg border"
-      />
-    </div>
+    <Calendar
+      mode="single"
+      defaultMonth={date}
+      selected={date}
+      onSelect={setDate}
+      className="rounded-lg border"
+    />
   )
 }
 

apps/v4/examples/radix/sidebar-rtl.tsx

@@ -314,11 +314,7 @@ function SidebarContentInner({
 
   return (
     <>
-      <Sidebar
-        collapsible="icon"
-        dir={dir}
-        side={dir === "ltr" ? "left" : "right"}
-      >
+      <Sidebar collapsible="icon" dir={dir}>
         <SidebarHeader>
           <SidebarMenu>
             <SidebarMenuItem>

apps/v4/examples/radix/toggle-group-font-weight-selector.tsx

@@ -1,62 +0,0 @@
-"use client"
-
-import * as React from "react"
-import { Field, FieldDescription, FieldLabel } from "@/examples/radix/ui/field"
-import { ToggleGroup, ToggleGroupItem } from "@/examples/radix/ui/toggle-group"
-
-export function ToggleGroupFontWeightSelector() {
-  const [fontWeight, setFontWeight] = React.useState("normal")
-  return (
-    <Field>
-      <FieldLabel>Font Weight</FieldLabel>
-      <ToggleGroup
-        type="single"
-        value={fontWeight}
-        onValueChange={(value) => setFontWeight(value)}
-        variant="outline"
-        spacing={2}
-        size="lg"
-      >
-        <ToggleGroupItem
-          value="light"
-          aria-label="Light"
-          className="flex size-16 flex-col items-center justify-center rounded-xl"
-        >
-          <span className="text-2xl leading-none font-light">Aa</span>
-          <span className="text-muted-foreground text-xs">Light</span>
-        </ToggleGroupItem>
-        <ToggleGroupItem
-          value="normal"
-          aria-label="Normal"
-          className="flex size-16 flex-col items-center justify-center rounded-xl"
-        >
-          <span className="text-2xl leading-none font-normal">Aa</span>
-          <span className="text-muted-foreground text-xs">Normal</span>
-        </ToggleGroupItem>
-        <ToggleGroupItem
-          value="medium"
-          aria-label="Medium"
-          className="flex size-16 flex-col items-center justify-center rounded-xl"
-        >
-          <span className="text-2xl leading-none font-medium">Aa</span>
-          <span className="text-muted-foreground text-xs">Medium</span>
-        </ToggleGroupItem>
-        <ToggleGroupItem
-          value="bold"
-          aria-label="Bold"
-          className="flex size-16 flex-col items-center justify-center rounded-xl"
-        >
-          <span className="text-2xl leading-none font-bold">Aa</span>
-          <span className="text-muted-foreground text-xs">Bold</span>
-        </ToggleGroupItem>
-      </ToggleGroup>
-      <FieldDescription>
-        Use{" "}
-        <code className="bg-muted rounded-md px-1 py-0.5 font-mono">
-          font-{fontWeight}
-        </code>{" "}
-        to set the font weight.
-      </FieldDescription>
-    </Field>
-  )
-}

apps/v4/package.json

@@ -75,7 +75,7 @@
     "rehype-pretty-code": "^0.14.1",
     "rimraf": "^6.0.1",
     "server-only": "^0.0.1",
-    "shadcn": "3.8.5",
+    "shadcn": "3.8.4",
     "shiki": "^1.10.1",
     "sonner": "^2.0.0",
     "swr": "^2.3.6",

apps/v4/public/r/config.json

@@ -159,6 +159,38 @@
       "menuAccent": "subtle",
       "menuColor": "default",
       "radius": "default"
+    },
+    {
+      "name": "radix-rhea",
+      "title": "Rhea (Radix)",
+      "description": "Rhea / Hugeicons / Inter",
+      "base": "radix",
+      "style": "rhea",
+      "baseColor": "neutral",
+      "theme": "neutral",
+      "iconLibrary": "hugeicons",
+      "font": "inter",
+      "item": "Item",
+      "rtl": false,
+      "menuAccent": "subtle",
+      "menuColor": "default",
+      "radius": "default"
+    },
+    {
+      "name": "base-rhea",
+      "title": "Rhea (Base)",
+      "description": "Rhea / Hugeicons / Inter",
+      "base": "base",
+      "style": "rhea",
+      "baseColor": "neutral",
+      "theme": "neutral",
+      "iconLibrary": "hugeicons",
+      "font": "inter",
+      "item": "Item",
+      "rtl": false,
+      "menuAccent": "subtle",
+      "menuColor": "default",
+      "radius": "default"
     }
   ]
 }

apps/v4/public/r/registries.json

@@ -77,12 +77,6 @@
     "url": "https://r.assistant-ui.com/{name}.json",
     "description": "Radix-style React primitives for AI chat with adapters for AI SDK, LangGraph, Mastra, and custom backends."
   },
-  {
-    "name": "@tool-ui",
-    "homepage": "https://www.tool-ui.com",
-    "url": "https://www.tool-ui.com/r/{name}.json",
-    "description": "Open source React components for rendering AI tool call widgets and rich assistant outputs."
-  },
   {
     "name": "@better-upload",
     "homepage": "https://better-upload.com",
@@ -107,12 +101,6 @@
     "url": "https://blocks.so/r/{name}.json",
     "description": "A set of clean, modern application building blocks for you in your applications. Free and Open Source"
   },
-  {
-    "name": "@boldkit",
-    "homepage": "https://boldkit.dev",
-    "url": "https://boldkit.dev/r/{name}.json",
-    "description": "Neubrutalism component library with 43 components, 42 SVG shapes, thick borders, and hard shadows. Supports React, Vue, and Nuxt. Built on shadcn/ui."
-  },
   {
     "name": "@bundui",
     "homepage": "https://bundui.io",
@@ -239,12 +227,6 @@
     "url": "https://shadcn-hooks.vercel.app/r/{name}.json",
     "description": "A comprehensive React Hooks Collection built with Shadcn."
   },
-  {
-    "name": "@inferencesh",
-    "homepage": "https://ui.inference.sh",
-    "url": "https://ui.inference.sh/r/{name}.json",
-    "description": "batteries-included agent components by inference.sh. chat interfaces with streaming, tool invocation rendering, syntax-highlighted code blocks, markdown renderer, and more."
-  },
   {
     "name": "@intentui",
     "homepage": "https://intentui.com",
@@ -305,12 +287,6 @@
     "url": "https://ui.manifest.build/r/{name}.json",
     "description": "Agentic UI toolkit for building MCP Apps. Open-source components and blocks ready to use within your chat app."
   },
-  {
-    "name": "@mapcn",
-    "homepage": "https://mapcn.dev",
-    "url": "https://mapcn.dev/r/{name}.json",
-    "description": "Beautiful maps, made simple. Ready to use, customizable map components for React. Built on MapLibre. Styled with Tailwind CSS."
-  },
   {
     "name": "@mui-treasury",
     "homepage": "https://www.mui-treasury.com",
@@ -359,12 +335,6 @@
     "url": "https://elements.nexus.availproject.org/r/{name}.json",
     "description": "Ready-made React components for almost any use case. Use as is or customise and go to market fast"
   },
-  {
-    "name": "@openstatus",
-    "homepage": "https://openstatus.dev/registry",
-    "url": "https://openstatus.dev/r/{name}.json",
-    "description": "Hand-crafted, accessible components for building beautiful status pages."
-  },
   {
     "name": "@optics",
     "homepage": "https://optics.agusmayol.com.ar",
@@ -440,8 +410,8 @@
   {
     "name": "@reui",
     "homepage": "https://reui.io",
-    "url": "https://reui.io/r/{style}/{name}.json",
-    "description": "Free & open-source library of 1,000+ components and patterns to 10x your productivity in shadcn projects."
+    "url": "https://reui.io/r/{name}.json",
+    "description": "Open-source collection of UI components and animated effects built with React, Typescript, Tailwind CSS, and Motion. Pairs beautifully with shadcn/ui."
   },
   {
     "name": "@scrollxui",
@@ -467,12 +437,6 @@
     "url": "https://roiui.com/r/{name}.json",
     "description": "Roi UI is a library that offers UI components and blocks built with Base UI primitives. Some blocks and components use motion (framer). Everything is open-source and will be forever."
   },
-  {
-    "name": "@slide-cn",
-    "homepage": "https://slide-cn.com",
-    "url": "https://slide-cn.com/r/{name}.json",
-    "description": "A component library to build slide decks using code."
-  },
   {
     "name": "@satoriui",
     "homepage": "https://satoriui.site",
@@ -563,12 +527,6 @@
     "url": "https://taki-ui.com/r/{name}.json",
     "description": "Beautifully designed, accessible components that you can copy and paste into your apps. Made with React Aria Components and Shadcn tokens."
   },
-  {
-    "name": "@thegridcn",
-    "homepage": "https://thegridcn.com",
-    "url": "https://thegridcn.com/r/{name}.json",
-    "description": "A Tron-inspired shadcn/ui theme system with Greek god color schemes, glow intensity levels, and sci-fi components like DataCard, HUD, Radar, and more."
-  },
   {
     "name": "@tour",
     "homepage": "https://onboarding-tour.vercel.app",
@@ -766,11 +724,5 @@
     "homepage": "https://sona-ui.vercel.app",
     "url": "https://sona-ui.vercel.app/r/{name}.json",
     "description": "A modern UI component library built with React and TailwindCSS to help you build beautiful and accessible web applications faster."
-  },
-  {
-    "name": "@soundcn",
-    "homepage": "https://soundcn.xyz",
-    "url": "https://soundcn.xyz/r/{name}.json",
-    "description": "Large collection of game, interface, retro, and voice sound effects for web applications"
   }
 ]

apps/v4/public/r/styles/base-lyra/registry.json

@@ -612,7 +612,6 @@
           "type": "registry:ui"
         }
       ],
-      "docs": "The `tooltip` component has been added. Remember to wrap your app with the `TooltipProvider` component.\n\n```tsx title=\"app/layout.tsx\"\nimport { TooltipProvider } from \"@/components/ui/tooltip\"\n\nexport default function RootLayout({ children }: { children: React.ReactNode }) {\n  return (\n    <html lang=\"en\">\n      <body>\n        <TooltipProvider>{children}</TooltipProvider>\n      </body>\n    </html>\n  )\n}\n```\n",
       "type": "registry:ui"
     },
     {

apps/v4/public/r/styles/base-lyra/tooltip.json

@@ -8,6 +8,5 @@
       "type": "registry:ui"
     }
   ],
-  "docs": "The `tooltip` component has been added. Remember to wrap your app with the `TooltipProvider` component.\n\n```tsx title=\"app/layout.tsx\"\nimport { TooltipProvider } from \"@/components/ui/tooltip\"\n\nexport default function RootLayout({ children }: { children: React.ReactNode }) {\n  return (\n    <html lang=\"en\">\n      <body>\n        <TooltipProvider>{children}</TooltipProvider>\n      </body>\n    </html>\n  )\n}\n```\n",
   "type": "registry:ui"
 }

apps/v4/public/r/styles/base-maia/registry.json

@@ -612,7 +612,6 @@
           "type": "registry:ui"
         }
       ],
-      "docs": "The `tooltip` component has been added. Remember to wrap your app with the `TooltipProvider` component.\n\n```tsx title=\"app/layout.tsx\"\nimport { TooltipProvider } from \"@/components/ui/tooltip\"\n\nexport default function RootLayout({ children }: { children: React.ReactNode }) {\n  return (\n    <html lang=\"en\">\n      <body>\n        <TooltipProvider>{children}</TooltipProvider>\n      </body>\n    </html>\n  )\n}\n```\n",
       "type": "registry:ui"
     },
     {

apps/v4/public/r/styles/base-maia/tooltip.json

@@ -8,6 +8,5 @@
       "type": "registry:ui"
     }
   ],
-  "docs": "The `tooltip` component has been added. Remember to wrap your app with the `TooltipProvider` component.\n\n```tsx title=\"app/layout.tsx\"\nimport { TooltipProvider } from \"@/components/ui/tooltip\"\n\nexport default function RootLayout({ children }: { children: React.ReactNode }) {\n  return (\n    <html lang=\"en\">\n      <body>\n        <TooltipProvider>{children}</TooltipProvider>\n      </body>\n    </html>\n  )\n}\n```\n",
   "type": "registry:ui"
 }

apps/v4/public/r/styles/base-mira/registry.json

@@ -612,7 +612,6 @@
           "type": "registry:ui"
         }
       ],
-      "docs": "The `tooltip` component has been added. Remember to wrap your app with the `TooltipProvider` component.\n\n```tsx title=\"app/layout.tsx\"\nimport { TooltipProvider } from \"@/components/ui/tooltip\"\n\nexport default function RootLayout({ children }: { children: React.ReactNode }) {\n  return (\n    <html lang=\"en\">\n      <body>\n        <TooltipProvider>{children}</TooltipProvider>\n      </body>\n    </html>\n  )\n}\n```\n",
       "type": "registry:ui"
     },
     {

apps/v4/public/r/styles/base-mira/tooltip.json

@@ -8,6 +8,5 @@
       "type": "registry:ui"
     }
   ],
-  "docs": "The `tooltip` component has been added. Remember to wrap your app with the `TooltipProvider` component.\n\n```tsx title=\"app/layout.tsx\"\nimport { TooltipProvider } from \"@/components/ui/tooltip\"\n\nexport default function RootLayout({ children }: { children: React.ReactNode }) {\n  return (\n    <html lang=\"en\">\n      <body>\n        <TooltipProvider>{children}</TooltipProvider>\n      </body>\n    </html>\n  )\n}\n```\n",
   "type": "registry:ui"
 }

apps/v4/public/r/styles/base-nova/registry.json

@@ -612,7 +612,6 @@
           "type": "registry:ui"
         }
       ],
-      "docs": "The `tooltip` component has been added. Remember to wrap your app with the `TooltipProvider` component.\n\n```tsx title=\"app/layout.tsx\"\nimport { TooltipProvider } from \"@/components/ui/tooltip\"\n\nexport default function RootLayout({ children }: { children: React.ReactNode }) {\n  return (\n    <html lang=\"en\">\n      <body>\n        <TooltipProvider>{children}</TooltipProvider>\n      </body>\n    </html>\n  )\n}\n```\n",
       "type": "registry:ui"
     },
     {

apps/v4/public/r/styles/base-nova/tooltip.json

@@ -8,6 +8,5 @@
       "type": "registry:ui"
     }
   ],
-  "docs": "The `tooltip` component has been added. Remember to wrap your app with the `TooltipProvider` component.\n\n```tsx title=\"app/layout.tsx\"\nimport { TooltipProvider } from \"@/components/ui/tooltip\"\n\nexport default function RootLayout({ children }: { children: React.ReactNode }) {\n  return (\n    <html lang=\"en\">\n      <body>\n        <TooltipProvider>{children}</TooltipProvider>\n      </body>\n    </html>\n  )\n}\n```\n",
   "type": "registry:ui"
 }

apps/v4/public/r/styles/base-rhea/accordion.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "accordion",
+  "files": [
+    {
+      "path": "registry/base-rhea/ui/accordion.tsx",
+      "content": "\"use client\"\n\nimport { Accordion as AccordionPrimitive } from \"@base-ui/react/accordion\"\n\nimport { cn } from \"@/registry/base-rhea/lib/utils\"\nimport { IconPlaceholder } from \"@/app/(create)/components/icon-placeholder\"\n\nfunction Accordion({ className, ...props }: AccordionPrimitive.Root.Props) {\n  return (\n    <AccordionPrimitive.Root\n      data-slot=\"accordion\"\n      className={cn(\"flex w-full flex-col\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction AccordionItem({ className, ...props }: AccordionPrimitive.Item.Props) {\n  return (\n    <AccordionPrimitive.Item\n      data-slot=\"accordion-item\"\n      className={cn(\"not-last:border-b\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction AccordionTrigger({\n  className,\n  children,\n  ...props\n}: AccordionPrimitive.Trigger.Props) {\n  return (\n    <AccordionPrimitive.Header className=\"flex\">\n      <AccordionPrimitive.Trigger\n        data-slot=\"accordion-trigger\"\n        className={cn(\n          \"focus-visible:ring-ring/50 focus-visible:border-ring focus-visible:after:border-ring **:data-[slot=accordion-trigger-icon]:text-muted-foreground rounded-lg py-2.5 text-left text-sm font-medium hover:underline focus-visible:ring-3 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 group/accordion-trigger relative flex flex-1 items-start justify-between border border-transparent transition-all outline-none disabled:pointer-events-none disabled:opacity-50\",\n          className\n        )}\n        {...props}\n      >\n        {children}\n        <IconPlaceholder\n          lucide=\"ChevronDownIcon\"\n          tabler=\"IconChevronDown\"\n          data-slot=\"accordion-trigger-icon\"\n          hugeicons=\"ArrowDown01Icon\"\n          phosphor=\"CaretDownIcon\"\n          remixicon=\"RiArrowDownSLine\"\n          className=\"pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden\"\n        />\n        <IconPlaceholder\n          lucide=\"ChevronUpIcon\"\n          tabler=\"IconChevronUp\"\n          data-slot=\"accordion-trigger-icon\"\n          hugeicons=\"ArrowUp01Icon\"\n          phosphor=\"CaretUpIcon\"\n          remixicon=\"RiArrowUpSLine\"\n          className=\"pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline\"\n        />\n      </AccordionPrimitive.Trigger>\n    </AccordionPrimitive.Header>\n  )\n}\n\nfunction AccordionContent({\n  className,\n  children,\n  ...props\n}: AccordionPrimitive.Panel.Props) {\n  return (\n    <AccordionPrimitive.Panel\n      data-slot=\"accordion-content\"\n      className=\"data-open:animate-accordion-down data-closed:animate-accordion-up text-sm overflow-hidden\"\n      {...props}\n    >\n      <div\n        className={cn(\n          \"pt-0 pb-2.5 [&_a]:hover:text-foreground h-(--accordion-panel-height) data-ending-style:h-0 data-starting-style:h-0 [&_a]:underline [&_a]:underline-offset-3 [&_p:not(:last-child)]:mb-4\",\n          className\n        )}\n      >\n        {children}\n      </div>\n    </AccordionPrimitive.Panel>\n  )\n}\n\nexport { Accordion, AccordionItem, AccordionTrigger, AccordionContent }\n",
+      "type": "registry:ui"
+    }
+  ],
+  "type": "registry:ui"
+}

apps/v4/public/r/styles/base-rhea/alert.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "alert",
+  "files": [
+    {
+      "path": "registry/base-rhea/ui/alert.tsx",
+      "content": "import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/registry/base-rhea/lib/utils\"\n\nconst alertVariants = cva(\"grid gap-0.5 rounded-lg border px-2.5 py-2 text-left text-sm has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pr-18 has-[>svg]:grid-cols-[auto_1fr] has-[>svg]:gap-x-2 *:[svg]:row-span-2 *:[svg]:translate-y-0.5 *:[svg]:text-current *:[svg:not([class*='size-'])]:size-4 w-full relative group/alert\", {\n  variants: {\n    variant: {\n      default: \"bg-card text-card-foreground\",\n      destructive: \"text-destructive bg-card *:data-[slot=alert-description]:text-destructive/90 *:[svg]:text-current\",\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n  },\n})\n\nfunction Alert({\n  className,\n  variant,\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof alertVariants>) {\n  return (\n    <div\n      data-slot=\"alert\"\n      role=\"alert\"\n      className={cn(alertVariants({ variant }), className)}\n      {...props}\n    />\n  )\n}\n\nfunction AlertTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-title\"\n      className={cn(\n        \"font-medium group-has-[>svg]/alert:col-start-2 [&_a]:hover:text-foreground [&_a]:underline [&_a]:underline-offset-3\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDescription({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-description\"\n      className={cn(\n        \"text-muted-foreground text-sm text-balance md:text-pretty [&_p:not(:last-child)]:mb-4 [&_a]:hover:text-foreground [&_a]:underline [&_a]:underline-offset-3\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertAction({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-action\"\n      className={cn(\"absolute top-2 right-2\", className)}\n      {...props}\n    />\n  )\n}\n\nexport { Alert, AlertTitle, AlertDescription, AlertAction }\n",
+      "type": "registry:ui"
+    }
+  ],
+  "type": "registry:ui"
+}

apps/v4/public/r/styles/base-rhea/aspect-ratio-example.json

@@ -0,0 +1,17 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "aspect-ratio-example",
+  "title": "Aspect Ratio",
+  "registryDependencies": [
+    "aspect-ratio",
+    "example"
+  ],
+  "files": [
+    {
+      "path": "registry/base-rhea/examples/aspect-ratio-example.tsx",
+      "content": "import Image from \"next/image\"\n\nimport {\n  Example,\n  ExampleWrapper,\n} from \"@/registry/base-rhea/components/example\"\nimport { AspectRatio } from \"@/registry/base-rhea/ui/aspect-ratio\"\n\nexport default function AspectRatioExample() {\n  return (\n    <ExampleWrapper className=\"max-w-4xl 2xl:max-w-4xl\">\n      <AspectRatio16x9 />\n      <AspectRatio21x9 />\n      <AspectRatio1x1 />\n      <AspectRatio9x16 />\n    </ExampleWrapper>\n  )\n}\n\nfunction AspectRatio16x9() {\n  return (\n    <Example title=\"16:9\" className=\"items-center justify-center\">\n      <AspectRatio ratio={16 / 9} className=\"bg-muted rounded-lg\">\n        <Image\n          src=\"https://avatar.vercel.sh/shadcn1\"\n          alt=\"Photo\"\n          fill\n          className=\"h-full w-full rounded-lg object-cover grayscale dark:brightness-20\"\n        />\n      </AspectRatio>\n    </Example>\n  )\n}\n\nfunction AspectRatio1x1() {\n  return (\n    <Example title=\"1:1\" className=\"items-start\">\n      <AspectRatio ratio={1 / 1} className=\"bg-muted rounded-lg\">\n        <Image\n          src=\"https://avatar.vercel.sh/shadcn1\"\n          alt=\"Photo\"\n          fill\n          className=\"h-full w-full rounded-lg object-cover grayscale dark:brightness-20\"\n        />\n      </AspectRatio>\n    </Example>\n  )\n}\n\nfunction AspectRatio9x16() {\n  return (\n    <Example title=\"9:16\" className=\"items-center justify-center\">\n      <AspectRatio ratio={9 / 16} className=\"bg-muted rounded-lg\">\n        <Image\n          src=\"https://avatar.vercel.sh/shadcn1\"\n          alt=\"Photo\"\n          fill\n          className=\"h-full w-full rounded-lg object-cover grayscale dark:brightness-20\"\n        />\n      </AspectRatio>\n    </Example>\n  )\n}\n\nfunction AspectRatio21x9() {\n  return (\n    <Example title=\"21:9\" className=\"items-center justify-center\">\n      <AspectRatio ratio={21 / 9} className=\"bg-muted rounded-lg\">\n        <Image\n          src=\"https://avatar.vercel.sh/shadcn1\"\n          alt=\"Photo\"\n          fill\n          className=\"h-full w-full rounded-lg object-cover grayscale dark:brightness-20\"\n        />\n      </AspectRatio>\n    </Example>\n  )\n}\n",
+      "type": "registry:example"
+    }
+  ],
+  "type": "registry:example"
+}

apps/v4/public/r/styles/base-rhea/aspect-ratio.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "aspect-ratio",
+  "files": [
+    {
+      "path": "registry/base-rhea/ui/aspect-ratio.tsx",
+      "content": "import { cn } from \"@/registry/base-rhea/lib/utils\"\n\nfunction AspectRatio({\n  ratio,\n  className,\n  ...props\n}: React.ComponentProps<\"div\"> & { ratio: number }) {\n  return (\n    <div\n      data-slot=\"aspect-ratio\"\n      style={\n        {\n          \"--ratio\": ratio,\n        } as React.CSSProperties\n      }\n      className={cn(\"relative aspect-(--ratio)\", className)}\n      {...props}\n    />\n  )\n}\n\nexport { AspectRatio }\n",
+      "type": "registry:ui"
+    }
+  ],
+  "type": "registry:ui"
+}

apps/v4/public/r/styles/base-rhea/avatar.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "avatar",
+  "files": [
+    {
+      "path": "registry/base-rhea/ui/avatar.tsx",
+      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { Avatar as AvatarPrimitive } from \"@base-ui/react/avatar\"\n\nimport { cn } from \"@/registry/base-rhea/lib/utils\"\n\nfunction Avatar({\n  className,\n  size = \"default\",\n  ...props\n}: AvatarPrimitive.Root.Props & {\n  size?: \"default\" | \"sm\" | \"lg\"\n}) {\n  return (\n    <AvatarPrimitive.Root\n      data-slot=\"avatar\"\n      data-size={size}\n      className={cn(\n        \"size-8 rounded-full after:rounded-full data-[size=lg]:size-10 data-[size=sm]:size-6 after:border-border group/avatar relative flex shrink-0 select-none after:absolute after:inset-0 after:border after:mix-blend-darken dark:after:mix-blend-lighten\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AvatarImage({ className, ...props }: AvatarPrimitive.Image.Props) {\n  return (\n    <AvatarPrimitive.Image\n      data-slot=\"avatar-image\"\n      className={cn(\n        \"rounded-full aspect-square size-full object-cover\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AvatarFallback({\n  className,\n  ...props\n}: AvatarPrimitive.Fallback.Props) {\n  return (\n    <AvatarPrimitive.Fallback\n      data-slot=\"avatar-fallback\"\n      className={cn(\n        \"bg-muted text-muted-foreground rounded-full flex size-full items-center justify-center text-sm group-data-[size=sm]/avatar:text-xs\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AvatarBadge({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"avatar-badge\"\n      className={cn(\n        \"bg-primary text-primary-foreground ring-background absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-blend-color ring-2 select-none\",\n        \"group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden\",\n        \"group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2\",\n        \"group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AvatarGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"avatar-group\"\n      className={cn(\n        \"*:data-[slot=avatar]:ring-background group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AvatarGroupCount({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"avatar-group-count\"\n      className={cn(\"bg-muted text-muted-foreground size-8 rounded-full text-sm group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3 ring-background relative flex shrink-0 items-center justify-center ring-2\", className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Avatar,\n  AvatarImage,\n  AvatarFallback,\n  AvatarGroup,\n  AvatarGroupCount,\n  AvatarBadge,\n}\n",
+      "type": "registry:ui"
+    }
+  ],
+  "type": "registry:ui"
+}

apps/v4/public/r/styles/base-rhea/badge.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "badge",
+  "files": [
+    {
+      "path": "registry/base-rhea/ui/badge.tsx",
+      "content": "import { mergeProps } from \"@base-ui/react/merge-props\"\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/registry/base-rhea/lib/utils\"\n\nconst badgeVariants = cva(\n  \"h-5 gap-1 rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium transition-all has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&>svg]:size-3! inline-flex items-center justify-center w-fit whitespace-nowrap shrink-0 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive overflow-hidden group/badge\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground [a]:hover:bg-primary/80\",\n        secondary: \"bg-secondary text-secondary-foreground [a]:hover:bg-secondary/80\",\n        destructive: \"bg-destructive/10 [a]:hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 text-destructive dark:bg-destructive/20\",\n        outline: \"border-border text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground\",\n        ghost: \"hover:bg-muted hover:text-muted-foreground dark:hover:bg-muted/50\",\n        link: \"text-primary underline-offset-4 hover:underline\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n\nfunction Badge({\n  className,\n  variant = \"default\",\n  render,\n  ...props\n}: useRender.ComponentProps<\"span\"> & VariantProps<typeof badgeVariants>) {\n  return useRender({\n    defaultTagName: \"span\",\n    props: mergeProps<\"span\">(\n      {\n        className: cn(badgeVariants({ className, variant })),\n      },\n      props\n    ),\n    render,\n    state: {\n      slot: \"badge\",\n      variant,\n    },\n  })\n}\n\nexport { Badge, badgeVariants }\n",
+      "type": "registry:ui"
+    }
+  ],
+  "type": "registry:ui"
+}

apps/v4/public/r/styles/base-rhea/breadcrumb-example.json

@@ -0,0 +1,18 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "breadcrumb-example",
+  "title": "Breadcrumb",
+  "registryDependencies": [
+    "breadcrumb",
+    "dropdown-menu",
+    "example"
+  ],
+  "files": [
+    {
+      "path": "registry/base-rhea/examples/breadcrumb-example.tsx",
+      "content": "import Link from \"next/link\"\n\nimport {\n  Example,\n  ExampleWrapper,\n} from \"@/registry/base-rhea/components/example\"\nimport {\n  Breadcrumb,\n  BreadcrumbEllipsis,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbList,\n  BreadcrumbPage,\n  BreadcrumbSeparator,\n} from \"@/registry/base-rhea/ui/breadcrumb\"\nimport { Button } from \"@/registry/base-rhea/ui/button\"\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuTrigger,\n} from \"@/registry/base-rhea/ui/dropdown-menu\"\n\nexport default function BreadcrumbExample() {\n  return (\n    <ExampleWrapper>\n      <BreadcrumbBasic />\n      <BreadcrumbWithDropdown />\n      <BreadcrumbWithLink />\n    </ExampleWrapper>\n  )\n}\n\nfunction BreadcrumbBasic() {\n  return (\n    <Example title=\"Basic\" className=\"items-center justify-center\">\n      <Breadcrumb>\n        <BreadcrumbList>\n          <BreadcrumbItem>\n            <BreadcrumbLink href=\"#\">Home</BreadcrumbLink>\n          </BreadcrumbItem>\n          <BreadcrumbSeparator />\n          <BreadcrumbItem>\n            <BreadcrumbLink href=\"#\">Components</BreadcrumbLink>\n          </BreadcrumbItem>\n          <BreadcrumbSeparator />\n          <BreadcrumbItem>\n            <BreadcrumbPage>Breadcrumb</BreadcrumbPage>\n          </BreadcrumbItem>\n        </BreadcrumbList>\n      </Breadcrumb>\n    </Example>\n  )\n}\n\nfunction BreadcrumbWithDropdown() {\n  return (\n    <Example title=\"With Dropdown\" className=\"items-center justify-center\">\n      <Breadcrumb>\n        <BreadcrumbList>\n          <BreadcrumbItem>\n            <BreadcrumbLink href=\"#\">Home</BreadcrumbLink>\n          </BreadcrumbItem>\n          <BreadcrumbSeparator />\n          <BreadcrumbItem>\n            <DropdownMenu>\n              <DropdownMenuTrigger\n                render={<Button size=\"icon-sm\" variant=\"ghost\" />}\n              >\n                <BreadcrumbEllipsis />\n                <span className=\"sr-only\">Toggle menu</span>\n              </DropdownMenuTrigger>\n              <DropdownMenuContent align=\"start\">\n                <DropdownMenuItem>Documentation</DropdownMenuItem>\n                <DropdownMenuItem>Themes</DropdownMenuItem>\n                <DropdownMenuItem>GitHub</DropdownMenuItem>\n              </DropdownMenuContent>\n            </DropdownMenu>\n          </BreadcrumbItem>\n          <BreadcrumbSeparator />\n          <BreadcrumbItem>\n            <BreadcrumbLink href=\"#\">Components</BreadcrumbLink>\n          </BreadcrumbItem>\n          <BreadcrumbSeparator />\n          <BreadcrumbItem>\n            <BreadcrumbPage>Breadcrumb</BreadcrumbPage>\n          </BreadcrumbItem>\n        </BreadcrumbList>\n      </Breadcrumb>\n    </Example>\n  )\n}\n\nfunction BreadcrumbWithLink() {\n  return (\n    <Example title=\"With Link\" className=\"items-center justify-center\">\n      <Breadcrumb>\n        <BreadcrumbList>\n          <BreadcrumbItem>\n            <BreadcrumbLink render={<Link href=\"#\">Home</Link>} />\n          </BreadcrumbItem>\n          <BreadcrumbSeparator />\n          <BreadcrumbItem>\n            <BreadcrumbEllipsis />\n          </BreadcrumbItem>\n          <BreadcrumbSeparator />\n          <BreadcrumbItem>\n            <BreadcrumbLink render={<Link href=\"#\">Components</Link>} />\n          </BreadcrumbItem>\n          <BreadcrumbSeparator />\n          <BreadcrumbItem>\n            <BreadcrumbPage>Breadcrumb</BreadcrumbPage>\n          </BreadcrumbItem>\n        </BreadcrumbList>\n      </Breadcrumb>\n    </Example>\n  )\n}\n",
+      "type": "registry:example"
+    }
+  ],
+  "type": "registry:example"
+}

apps/v4/public/r/styles/base-rhea/breadcrumb.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "breadcrumb",
+  "files": [
+    {
+      "path": "registry/base-rhea/ui/breadcrumb.tsx",
+      "content": "import * as React from \"react\"\nimport { mergeProps } from \"@base-ui/react/merge-props\"\nimport { useRender } from \"@base-ui/react/use-render\"\n\nimport { cn } from \"@/registry/base-rhea/lib/utils\"\nimport { IconPlaceholder } from \"@/app/(create)/components/icon-placeholder\"\n\nfunction Breadcrumb({ className, ...props }: React.ComponentProps<\"nav\">) {\n  return (\n    <nav\n      aria-label=\"breadcrumb\"\n      data-slot=\"breadcrumb\"\n      className={cn(className)}\n      {...props}\n    />\n  )\n}\n\nfunction BreadcrumbList({ className, ...props }: React.ComponentProps<\"ol\">) {\n  return (\n    <ol\n      data-slot=\"breadcrumb-list\"\n      className={cn(\n        \"text-muted-foreground gap-1.5 text-sm flex flex-wrap items-center wrap-break-word\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction BreadcrumbItem({ className, ...props }: React.ComponentProps<\"li\">) {\n  return (\n    <li\n      data-slot=\"breadcrumb-item\"\n      className={cn(\"gap-1 inline-flex items-center\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction BreadcrumbLink({\n  className,\n  render,\n  ...props\n}: useRender.ComponentProps<\"a\">) {\n  return useRender({\n    defaultTagName: \"a\",\n    props: mergeProps<\"a\">(\n      {\n        className: cn(\"hover:text-foreground transition-colors\", className),\n      },\n      props\n    ),\n    render,\n    state: {\n      slot: \"breadcrumb-link\",\n    },\n  })\n}\n\nfunction BreadcrumbPage({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"breadcrumb-page\"\n      role=\"link\"\n      aria-disabled=\"true\"\n      aria-current=\"page\"\n      className={cn(\"text-foreground font-normal\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction BreadcrumbSeparator({\n  children,\n  className,\n  ...props\n}: React.ComponentProps<\"li\">) {\n  return (\n    <li\n      data-slot=\"breadcrumb-separator\"\n      role=\"presentation\"\n      aria-hidden=\"true\"\n      className={cn(\"[&>svg]:size-3.5\", className)}\n      {...props}\n    >\n      {children ?? (\n        <IconPlaceholder\n          lucide=\"ChevronRightIcon\"\n          tabler=\"IconChevronRight\"\n          hugeicons=\"ArrowRight01Icon\"\n          phosphor=\"CaretRightIcon\"\n          remixicon=\"RiArrowRightSLine\"\n          className=\"cn-rtl-flip\"\n        />\n      )}\n    </li>\n  )\n}\n\nfunction BreadcrumbEllipsis({\n  className,\n  ...props\n}: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"breadcrumb-ellipsis\"\n      role=\"presentation\"\n      aria-hidden=\"true\"\n      className={cn(\n        \"size-5 [&>svg]:size-4 flex items-center justify-center\",\n        className\n      )}\n      {...props}\n    >\n      <IconPlaceholder\n        lucide=\"MoreHorizontalIcon\"\n        tabler=\"IconDots\"\n        hugeicons=\"MoreHorizontalCircle01Icon\"\n        phosphor=\"DotsThreeIcon\"\n        remixicon=\"RiMoreLine\"\n      />\n      <span className=\"sr-only\">More</span>\n    </span>\n  )\n}\n\nexport {\n  Breadcrumb,\n  BreadcrumbList,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbPage,\n  BreadcrumbSeparator,\n  BreadcrumbEllipsis,\n}\n",
+      "type": "registry:ui"
+    }
+  ],
+  "type": "registry:ui"
+}

apps/v4/public/r/styles/base-rhea/button-group.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "button-group",
+  "registryDependencies": [
+    "separator"
+  ],
+  "files": [
+    {
+      "path": "registry/base-rhea/ui/button-group.tsx",
+      "content": "import { mergeProps } from \"@base-ui/react/merge-props\"\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/registry/base-rhea/lib/utils\"\nimport { Separator } from \"@/registry/base-rhea/ui/separator\"\n\nconst buttonGroupVariants = cva(\n  \"has-[>[data-slot=button-group]]:gap-2 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-lg flex w-fit items-stretch *:focus-visible:z-10 *:focus-visible:relative [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1\",\n  {\n    variants: {\n      orientation: {\n        horizontal:\n          \"[&>[data-slot]:not(:has(~[data-slot]))]:rounded-r-lg! [&>[data-slot]~[data-slot]]:rounded-l-none [&>[data-slot]~[data-slot]]:border-l-0 *:data-slot:rounded-r-none\",\n        vertical:\n          \"[&>[data-slot]:not(:has(~[data-slot]))]:rounded-b-lg! flex-col [&>[data-slot]~[data-slot]]:rounded-t-none [&>[data-slot]~[data-slot]]:border-t-0 *:data-slot:rounded-b-none\",\n      },\n    },\n    defaultVariants: {\n      orientation: \"horizontal\",\n    },\n  }\n)\n\nfunction ButtonGroup({\n  className,\n  orientation,\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof buttonGroupVariants>) {\n  return (\n    <div\n      role=\"group\"\n      data-slot=\"button-group\"\n      data-orientation={orientation}\n      className={cn(buttonGroupVariants({ orientation }), className)}\n      {...props}\n    />\n  )\n}\n\nfunction ButtonGroupText({\n  className,\n  render,\n  ...props\n}: useRender.ComponentProps<\"div\">) {\n  return useRender({\n    defaultTagName: \"div\",\n    props: mergeProps<\"div\">(\n      {\n        className: cn(\n          \"bg-muted gap-2 rounded-lg border px-2.5 text-sm font-medium [&_svg:not([class*='size-'])]:size-4 flex items-center [&_svg]:pointer-events-none\",\n          className\n        ),\n      },\n      props\n    ),\n    render,\n    state: {\n      slot: \"button-group-text\",\n    },\n  })\n}\n\nfunction ButtonGroupSeparator({\n  className,\n  orientation = \"vertical\",\n  ...props\n}: React.ComponentProps<typeof Separator>) {\n  return (\n    <Separator\n      data-slot=\"button-group-separator\"\n      orientation={orientation}\n      className={cn(\n        \"bg-input relative self-stretch data-horizontal:mx-px data-horizontal:w-auto data-vertical:my-px data-vertical:h-auto\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {\n  ButtonGroup,\n  ButtonGroupSeparator,\n  ButtonGroupText,\n  buttonGroupVariants,\n}\n",
+      "type": "registry:ui"
+    }
+  ],
+  "type": "registry:ui"
+}

apps/v4/public/r/styles/base-rhea/button.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "button",
+  "files": [
+    {
+      "path": "registry/base-rhea/ui/button.tsx",
+      "content": "\"use client\"\n\nimport { Button as ButtonPrimitive } from \"@base-ui/react/button\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/registry/base-rhea/lib/utils\"\n\nconst buttonVariants = cva(\n  \"focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 rounded-lg border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-3 aria-invalid:ring-3 [&_svg:not([class*='size-'])]:size-4 inline-flex items-center justify-center whitespace-nowrap transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 outline-none group/button select-none\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground [a]:hover:bg-primary/80\",\n        outline: \"border-border bg-background hover:bg-muted hover:text-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 aria-expanded:bg-muted aria-expanded:text-foreground\",\n        secondary: \"bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground\",\n        ghost: \"hover:bg-muted hover:text-foreground dark:hover:bg-muted/50 aria-expanded:bg-muted aria-expanded:text-foreground\",\n        destructive: \"bg-destructive/10 hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/20 text-destructive focus-visible:border-destructive/40 dark:hover:bg-destructive/30\",\n        link: \"text-primary underline-offset-4 hover:underline\",\n      },\n      size: {\n        default: \"h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2\",\n        xs: \"h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3\",\n        sm: \"h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5\",\n        lg: \"h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3\",\n        icon: \"size-8\",\n        \"icon-xs\": \"size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3\",\n        \"icon-sm\": \"size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg\",\n        \"icon-lg\": \"size-9\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n)\n\nfunction Button({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  ...props\n}: ButtonPrimitive.Props & VariantProps<typeof buttonVariants>) {\n  return (\n    <ButtonPrimitive\n      data-slot=\"button\"\n      className={cn(buttonVariants({ variant, size, className }))}\n      {...props}\n    />\n  )\n}\n\nexport { Button, buttonVariants }\n",
+      "type": "registry:ui"
+    }
+  ],
+  "type": "registry:ui"
+}

apps/v4/public/r/styles/base-rhea/card.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "card",
+  "files": [
+    {
+      "path": "registry/base-rhea/ui/card.tsx",
+      "content": "import * as React from \"react\"\n\nimport { cn } from \"@/registry/base-rhea/lib/utils\"\n\nfunction Card({\n  className,\n  size = \"default\",\n  ...props\n}: React.ComponentProps<\"div\"> & { size?: \"default\" | \"sm\" }) {\n  return (\n    <div\n      data-slot=\"card\"\n      data-size={size}\n      className={cn(\"ring-foreground/10 bg-card text-card-foreground gap-4 overflow-hidden rounded-xl py-4 text-sm ring-1 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl group/card flex flex-col\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction CardHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-header\"\n      className={cn(\n        \"gap-1 rounded-t-xl px-4 group-data-[size=sm]/card:px-3 [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3 group/card-header @container/card-header grid auto-rows-min items-start has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto]\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CardTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-title\"\n      className={cn(\"text-base leading-snug font-medium group-data-[size=sm]/card:text-sm\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction CardDescription({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-description\"\n      className={cn(\"text-muted-foreground text-sm\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction CardAction({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-action\"\n      className={cn(\n        \"col-start-2 row-span-2 row-start-1 self-start justify-self-end\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CardContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-content\"\n      className={cn(\"px-4 group-data-[size=sm]/card:px-3\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction CardFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-footer\"\n      className={cn(\"bg-muted/50 rounded-b-xl border-t p-4 group-data-[size=sm]/card:p-3 flex items-center\", className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Card,\n  CardHeader,\n  CardFooter,\n  CardTitle,\n  CardAction,\n  CardDescription,\n  CardContent,\n}\n",
+      "type": "registry:ui"
+    }
+  ],
+  "type": "registry:ui"
+}

apps/v4/public/r/styles/base-rhea/carousel-example.json

@@ -0,0 +1,18 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "carousel-example",
+  "title": "Carousel",
+  "registryDependencies": [
+    "card",
+    "carousel",
+    "example"
+  ],
+  "files": [
+    {
+      "path": "registry/base-rhea/examples/carousel-example.tsx",
+      "content": "import {\n  Example,\n  ExampleWrapper,\n} from \"@/registry/base-rhea/components/example\"\nimport { Card, CardContent } from \"@/registry/base-rhea/ui/card\"\nimport {\n  Carousel,\n  CarouselContent,\n  CarouselItem,\n  CarouselNext,\n  CarouselPrevious,\n} from \"@/registry/base-rhea/ui/carousel\"\n\nexport default function CarouselExample() {\n  return (\n    <ExampleWrapper className=\"lg:grid-cols-1\">\n      <CarouselBasic />\n      <CarouselMultiple />\n      <CarouselWithGap />\n    </ExampleWrapper>\n  )\n}\n\nfunction CarouselBasic() {\n  return (\n    <Example title=\"Basic\">\n      <Carousel className=\"mx-auto max-w-xs sm:max-w-sm\">\n        <CarouselContent>\n          {Array.from({ length: 5 }).map((_, index) => (\n            <CarouselItem key={index}>\n              <div className=\"p-1\">\n                <Card>\n                  <CardContent className=\"flex aspect-square items-center justify-center p-6\">\n                    <span className=\"text-4xl font-semibold\">{index + 1}</span>\n                  </CardContent>\n                </Card>\n              </div>\n            </CarouselItem>\n          ))}\n        </CarouselContent>\n        <CarouselPrevious className=\"hidden sm:inline-flex\" />\n        <CarouselNext className=\"hidden sm:inline-flex\" />\n      </Carousel>\n    </Example>\n  )\n}\n\nfunction CarouselMultiple() {\n  return (\n    <Example title=\"Multiple\">\n      <Carousel\n        className=\"mx-auto max-w-xs sm:max-w-sm\"\n        opts={{\n          align: \"start\",\n        }}\n      >\n        <CarouselContent>\n          {Array.from({ length: 5 }).map((_, index) => (\n            <CarouselItem key={index} className=\"sm:basis-1/2 lg:basis-1/3\">\n              <div className=\"p-1\">\n                <Card>\n                  <CardContent className=\"flex aspect-square items-center justify-center p-6\">\n                    <span className=\"text-3xl font-semibold\">{index + 1}</span>\n                  </CardContent>\n                </Card>\n              </div>\n            </CarouselItem>\n          ))}\n        </CarouselContent>\n        <CarouselPrevious className=\"hidden sm:inline-flex\" />\n        <CarouselNext className=\"hidden sm:inline-flex\" />\n      </Carousel>\n    </Example>\n  )\n}\n\nfunction CarouselWithGap() {\n  return (\n    <Example title=\"With Gap\">\n      <Carousel className=\"mx-auto max-w-xs sm:max-w-sm\">\n        <CarouselContent className=\"-ml-1\">\n          {Array.from({ length: 5 }).map((_, index) => (\n            <CarouselItem key={index} className=\"pl-1 md:basis-1/2\">\n              <div className=\"p-1\">\n                <Card>\n                  <CardContent className=\"flex aspect-square items-center justify-center p-6\">\n                    <span className=\"text-2xl font-semibold\">{index + 1}</span>\n                  </CardContent>\n                </Card>\n              </div>\n            </CarouselItem>\n          ))}\n        </CarouselContent>\n        <CarouselPrevious className=\"hidden sm:inline-flex\" />\n        <CarouselNext className=\"hidden sm:inline-flex\" />\n      </Carousel>\n    </Example>\n  )\n}\n",
+      "type": "registry:example"
+    }
+  ],
+  "type": "registry:example"
+}

apps/v4/public/r/styles/base-rhea/checkbox.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "checkbox",
+  "files": [
+    {
+      "path": "registry/base-rhea/ui/checkbox.tsx",
+      "content": "\"use client\"\n\nimport { Checkbox as CheckboxPrimitive } from \"@base-ui/react/checkbox\"\n\nimport { cn } from \"@/registry/base-rhea/lib/utils\"\nimport { IconPlaceholder } from \"@/app/(create)/components/icon-placeholder\"\n\nfunction Checkbox({ className, ...props }: CheckboxPrimitive.Root.Props) {\n  return (\n    <CheckboxPrimitive.Root\n      data-slot=\"checkbox\"\n      className={cn(\n        \"border-input dark:bg-input/30 data-checked:bg-primary data-checked:text-primary-foreground dark:data-checked:bg-primary data-checked:border-primary aria-invalid:aria-checked:border-primary aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 flex size-4 items-center justify-center rounded-[4px] border transition-colors group-has-disabled/field:opacity-50 focus-visible:ring-3 aria-invalid:ring-3 peer relative shrink-0 outline-none after:absolute after:-inset-x-3 after:-inset-y-2 disabled:cursor-not-allowed disabled:opacity-50\",\n        className\n      )}\n      {...props}\n    >\n      <CheckboxPrimitive.Indicator\n        data-slot=\"checkbox-indicator\"\n        className=\"[&>svg]:size-3.5 grid place-content-center text-current transition-none\"\n      >\n        <IconPlaceholder\n          lucide=\"CheckIcon\"\n          tabler=\"IconCheck\"\n          hugeicons=\"Tick02Icon\"\n          phosphor=\"CheckIcon\"\n          remixicon=\"RiCheckLine\"\n        />\n      </CheckboxPrimitive.Indicator>\n    </CheckboxPrimitive.Root>\n  )\n}\n\nexport { Checkbox }\n",
+      "type": "registry:ui"
+    }
+  ],
+  "type": "registry:ui"
+}

apps/v4/public/r/styles/base-rhea/collapsible.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "collapsible",
+  "files": [
+    {
+      "path": "registry/base-rhea/ui/collapsible.tsx",
+      "content": "\"use client\"\n\nimport { Collapsible as CollapsiblePrimitive } from \"@base-ui/react/collapsible\"\n\nfunction Collapsible({ ...props }: CollapsiblePrimitive.Root.Props) {\n  return <CollapsiblePrimitive.Root data-slot=\"collapsible\" {...props} />\n}\n\nfunction CollapsibleTrigger({ ...props }: CollapsiblePrimitive.Trigger.Props) {\n  return (\n    <CollapsiblePrimitive.Trigger data-slot=\"collapsible-trigger\" {...props} />\n  )\n}\n\nfunction CollapsibleContent({ ...props }: CollapsiblePrimitive.Panel.Props) {\n  return (\n    <CollapsiblePrimitive.Panel data-slot=\"collapsible-content\" {...props} />\n  )\n}\n\nexport { Collapsible, CollapsibleTrigger, CollapsibleContent }\n",
+      "type": "registry:ui"
+    }
+  ],
+  "type": "registry:ui"
+}

apps/v4/public/r/styles/base-rhea/dialog.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "dialog",
+  "registryDependencies": [
+    "button"
+  ],
+  "files": [
+    {
+      "path": "registry/base-rhea/ui/dialog.tsx",
+      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { Dialog as DialogPrimitive } from \"@base-ui/react/dialog\"\n\nimport { cn } from \"@/registry/base-rhea/lib/utils\"\nimport { Button } from \"@/registry/base-rhea/ui/button\"\nimport { IconPlaceholder } from \"@/app/(create)/components/icon-placeholder\"\n\nfunction Dialog({ ...props }: DialogPrimitive.Root.Props) {\n  return <DialogPrimitive.Root data-slot=\"dialog\" {...props} />\n}\n\nfunction DialogTrigger({ ...props }: DialogPrimitive.Trigger.Props) {\n  return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} />\n}\n\nfunction DialogPortal({ ...props }: DialogPrimitive.Portal.Props) {\n  return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />\n}\n\nfunction DialogClose({ ...props }: DialogPrimitive.Close.Props) {\n  return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} />\n}\n\nfunction DialogOverlay({\n  className,\n  ...props\n}: DialogPrimitive.Backdrop.Props) {\n  return (\n    <DialogPrimitive.Backdrop\n      data-slot=\"dialog-overlay\"\n      className={cn(\"data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 isolate z-50\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction DialogContent({\n  className,\n  children,\n  showCloseButton = true,\n  ...props\n}: DialogPrimitive.Popup.Props & {\n  showCloseButton?: boolean\n}) {\n  return (\n    <DialogPortal>\n      <DialogOverlay />\n      <DialogPrimitive.Popup\n        data-slot=\"dialog-content\"\n        className={cn(\n          \"bg-background data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 ring-foreground/10 grid max-w-[calc(100%-2rem)] gap-4 rounded-xl p-4 text-sm ring-1 duration-100 sm:max-w-sm fixed top-1/2 left-1/2 z-50 w-full -translate-x-1/2 -translate-y-1/2 outline-none\",\n          className\n        )}\n        {...props}\n      >\n        {children}\n        {showCloseButton && (\n          <DialogPrimitive.Close\n            data-slot=\"dialog-close\"\n            render={\n              <Button\n                variant=\"ghost\"\n                className=\"absolute top-2 right-2\"\n                size=\"icon-sm\"\n              />\n            }\n          >\n            <IconPlaceholder\n              lucide=\"XIcon\"\n              tabler=\"IconX\"\n              hugeicons=\"Cancel01Icon\"\n              phosphor=\"XIcon\"\n              remixicon=\"RiCloseLine\"\n            />\n            <span className=\"sr-only\">Close</span>\n          </DialogPrimitive.Close>\n        )}\n      </DialogPrimitive.Popup>\n    </DialogPortal>\n  )\n}\n\nfunction DialogHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"dialog-header\"\n      className={cn(\"gap-2 flex flex-col\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction DialogFooter({\n  className,\n  showCloseButton = false,\n  children,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  showCloseButton?: boolean\n}) {\n  return (\n    <div\n      data-slot=\"dialog-footer\"\n      className={cn(\n        \"bg-muted/50 -mx-4 -mb-4 rounded-b-xl border-t p-4 flex flex-col-reverse gap-2 sm:flex-row sm:justify-end\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n      {showCloseButton && (\n        <DialogPrimitive.Close render={<Button variant=\"outline\" />}>\n          Close\n        </DialogPrimitive.Close>\n      )}\n    </div>\n  )\n}\n\nfunction DialogTitle({ className, ...props }: DialogPrimitive.Title.Props) {\n  return (\n    <DialogPrimitive.Title\n      data-slot=\"dialog-title\"\n      className={cn(\"text-base leading-none font-medium\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction DialogDescription({\n  className,\n  ...props\n}: DialogPrimitive.Description.Props) {\n  return (\n    <DialogPrimitive.Description\n      data-slot=\"dialog-description\"\n      className={cn(\"text-muted-foreground *:[a]:hover:text-foreground text-sm *:[a]:underline *:[a]:underline-offset-3\", className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Dialog,\n  DialogClose,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogOverlay,\n  DialogPortal,\n  DialogTitle,\n  DialogTrigger,\n}\n",
+      "type": "registry:ui"
+    }
+  ],
+  "type": "registry:ui"
+}

apps/v4/public/r/styles/base-rhea/direction.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "direction",
+  "dependencies": [
+    "@base-ui/react"
+  ],
+  "files": [
+    {
+      "path": "registry/base-rhea/ui/direction.tsx",
+      "content": "\"use client\"\n\nexport {\n  DirectionProvider,\n  useDirection,\n} from \"@base-ui/react/direction-provider\"\n",
+      "type": "registry:ui"
+    }
+  ],
+  "type": "registry:ui"
+}

apps/v4/public/r/styles/base-rhea/drawer-example.json

@@ -0,0 +1,17 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "drawer-example",
+  "title": "Drawer",
+  "registryDependencies": [
+    "drawer",
+    "example"
+  ],
+  "files": [
+    {
+      "path": "registry/base-rhea/examples/drawer-example.tsx",
+      "content": "\"use client\"\n\nimport {\n  Example,\n  ExampleWrapper,\n} from \"@/registry/base-rhea/components/example\"\nimport { Button } from \"@/registry/base-rhea/ui/button\"\nimport {\n  Drawer,\n  DrawerClose,\n  DrawerContent,\n  DrawerDescription,\n  DrawerFooter,\n  DrawerHeader,\n  DrawerTitle,\n  DrawerTrigger,\n} from \"@/registry/base-rhea/ui/drawer\"\n\nexport default function DrawerExample() {\n  return (\n    <ExampleWrapper>\n      <DrawerScrollableContent />\n      <DrawerWithSides />\n    </ExampleWrapper>\n  )\n}\n\nconst DRAWER_SIDES = [\"top\", \"right\", \"bottom\", \"left\"] as const\n\nfunction DrawerWithSides() {\n  return (\n    <Example title=\"Sides\">\n      <div className=\"flex flex-wrap gap-2\">\n        {DRAWER_SIDES.map((side) => (\n          <Drawer\n            key={side}\n            direction={\n              side === \"bottom\" ? undefined : (side as \"top\" | \"right\" | \"left\")\n            }\n          >\n            <DrawerTrigger asChild>\n              <Button variant=\"outline\" className=\"capitalize\">\n                {side}\n              </Button>\n            </DrawerTrigger>\n            <DrawerContent className=\"data-[vaul-drawer-direction=bottom]:max-h-[50vh] data-[vaul-drawer-direction=top]:max-h-[50vh]\">\n              <DrawerHeader>\n                <DrawerTitle>Move Goal</DrawerTitle>\n                <DrawerDescription>\n                  Set your daily activity goal.\n                </DrawerDescription>\n              </DrawerHeader>\n              <div className=\"no-scrollbar overflow-y-auto px-4\">\n                {Array.from({ length: 10 }).map((_, index) => (\n                  <p\n                    key={index}\n                    className=\"style-lyra:mb-2 style-lyra:leading-relaxed mb-4 leading-normal\"\n                  >\n                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed\n                    do eiusmod tempor incididunt ut labore et dolore magna\n                    aliqua. Ut enim ad minim veniam, quis nostrud exercitation\n                    ullamco laboris nisi ut aliquip ex ea commodo consequat.\n                    Duis aute irure dolor in reprehenderit in voluptate velit\n                    esse cillum dolore eu fugiat nulla pariatur. Excepteur sint\n                    occaecat cupidatat non proident, sunt in culpa qui officia\n                    deserunt mollit anim id est laborum.\n                  </p>\n                ))}\n              </div>\n              <DrawerFooter>\n                <Button>Submit</Button>\n                <DrawerClose asChild>\n                  <Button variant=\"outline\">Cancel</Button>\n                </DrawerClose>\n              </DrawerFooter>\n            </DrawerContent>\n          </Drawer>\n        ))}\n      </div>\n    </Example>\n  )\n}\n\nfunction DrawerScrollableContent() {\n  return (\n    <Example title=\"Scrollable Content\">\n      <Drawer direction=\"right\">\n        <DrawerTrigger asChild>\n          <Button variant=\"outline\">Scrollable Content</Button>\n        </DrawerTrigger>\n        <DrawerContent>\n          <DrawerHeader>\n            <DrawerTitle>Move Goal</DrawerTitle>\n            <DrawerDescription>Set your daily activity goal.</DrawerDescription>\n          </DrawerHeader>\n          <div className=\"no-scrollbar overflow-y-auto px-4\">\n            {Array.from({ length: 10 }).map((_, index) => (\n              <p\n                key={index}\n                className=\"style-lyra:mb-2 style-lyra:leading-relaxed mb-4 leading-normal\"\n              >\n                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do\n                eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut\n                enim ad minim veniam, quis nostrud exercitation ullamco laboris\n                nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor\n                in reprehenderit in voluptate velit esse cillum dolore eu fugiat\n                nulla pariatur. Excepteur sint occaecat cupidatat non proident,\n                sunt in culpa qui officia deserunt mollit anim id est laborum.\n              </p>\n            ))}\n          </div>\n          <DrawerFooter>\n            <Button>Submit</Button>\n            <DrawerClose asChild>\n              <Button variant=\"outline\">Cancel</Button>\n            </DrawerClose>\n          </DrawerFooter>\n        </DrawerContent>\n      </Drawer>\n    </Example>\n  )\n}\n",
+      "type": "registry:example"
+    }
+  ],
+  "type": "registry:example"
+}

apps/v4/public/r/styles/base-rhea/drawer.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "drawer",
+  "dependencies": [
+    "vaul"
+  ],
+  "files": [
+    {
+      "path": "registry/base-rhea/ui/drawer.tsx",
+      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { Drawer as DrawerPrimitive } from \"vaul\"\n\nimport { cn } from \"@/registry/base-rhea/lib/utils\"\n\nfunction Drawer({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Root>) {\n  return <DrawerPrimitive.Root data-slot=\"drawer\" {...props} />\n}\n\nfunction DrawerTrigger({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Trigger>) {\n  return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} />\n}\n\nfunction DrawerPortal({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Portal>) {\n  return <DrawerPrimitive.Portal data-slot=\"drawer-portal\" {...props} />\n}\n\nfunction DrawerClose({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Close>) {\n  return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} />\n}\n\nfunction DrawerOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Overlay>) {\n  return (\n    <DrawerPrimitive.Overlay\n      data-slot=\"drawer-overlay\"\n      className={cn(\"data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/10 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 z-50\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction DrawerContent({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Content>) {\n  return (\n    <DrawerPortal data-slot=\"drawer-portal\">\n      <DrawerOverlay />\n      <DrawerPrimitive.Content\n        data-slot=\"drawer-content\"\n        className={cn(\n          \"bg-background flex h-auto flex-col text-sm data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-xl data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:rounded-r-xl data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:rounded-l-xl data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-xl data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm group/drawer-content fixed z-50\",\n          className\n        )}\n        {...props}\n      >\n        <div className=\"bg-muted mt-4 h-1 w-[100px] rounded-full mx-auto hidden shrink-0 group-data-[vaul-drawer-direction=bottom]/drawer-content:block\" />\n        {children}\n      </DrawerPrimitive.Content>\n    </DrawerPortal>\n  )\n}\n\nfunction DrawerHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"drawer-header\"\n      className={cn(\"gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-0.5 md:text-left flex flex-col\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction DrawerFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"drawer-footer\"\n      className={cn(\"gap-2 p-4 mt-auto flex flex-col\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction DrawerTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Title>) {\n  return (\n    <DrawerPrimitive.Title\n      data-slot=\"drawer-title\"\n      className={cn(\"text-foreground text-base font-medium\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction DrawerDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Description>) {\n  return (\n    <DrawerPrimitive.Description\n      data-slot=\"drawer-description\"\n      className={cn(\"text-muted-foreground text-sm\", className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Drawer,\n  DrawerPortal,\n  DrawerOverlay,\n  DrawerTrigger,\n  DrawerClose,\n  DrawerContent,\n  DrawerHeader,\n  DrawerFooter,\n  DrawerTitle,\n  DrawerDescription,\n}\n",
+      "type": "registry:ui"
+    }
+  ],
+  "type": "registry:ui"
+}

apps/v4/public/r/styles/base-rhea/empty.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "empty",
+  "files": [
+    {
+      "path": "registry/base-rhea/ui/empty.tsx",
+      "content": "import { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/registry/base-rhea/lib/utils\"\n\nfunction Empty({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"empty\"\n      className={cn(\n        \"gap-4 rounded-xl border-dashed p-6 flex w-full min-w-0 flex-1 flex-col items-center justify-center text-center text-balance\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction EmptyHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"empty-header\"\n      className={cn(\n        \"gap-2 flex max-w-sm flex-col items-center\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nconst emptyMediaVariants = cva(\n  \"mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-transparent\",\n        icon: \"bg-muted text-foreground flex size-8 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-4\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n\nfunction EmptyMedia({\n  className,\n  variant = \"default\",\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof emptyMediaVariants>) {\n  return (\n    <div\n      data-slot=\"empty-icon\"\n      data-variant={variant}\n      className={cn(emptyMediaVariants({ variant, className }))}\n      {...props}\n    />\n  )\n}\n\nfunction EmptyTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"empty-title\"\n      className={cn(\"text-sm font-medium tracking-tight\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction EmptyDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n  return (\n    <div\n      data-slot=\"empty-description\"\n      className={cn(\n        \"text-sm/relaxed text-muted-foreground [&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction EmptyContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"empty-content\"\n      className={cn(\n        \"gap-2.5 text-sm flex w-full max-w-sm min-w-0 flex-col items-center text-balance\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Empty,\n  EmptyHeader,\n  EmptyTitle,\n  EmptyDescription,\n  EmptyContent,\n  EmptyMedia,\n}\n",
+      "type": "registry:ui"
+    }
+  ],
+  "type": "registry:ui"
+}

apps/v4/public/r/styles/base-rhea/example.json

@@ -0,0 +1,13 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "example",
+  "title": "Example",
+  "files": [
+    {
+      "path": "registry/base-rhea/components/example.tsx",
+      "content": "import { cn } from \"@/registry/base-rhea/lib/utils\"\n\nfunction ExampleWrapper({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div className=\"bg-background w-full\">\n      <div\n        data-slot=\"example-wrapper\"\n        className={cn(\n          \"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\",\n\n          className\n        )}\n        {...props}\n      />\n    </div>\n  )\n}\n\nfunction Example({\n  title,\n  children,\n  className,\n  containerClassName,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  title?: string\n  containerClassName?: string\n}) {\n  return (\n    <div\n      data-slot=\"example\"\n      className={cn(\n        \"mx-auto flex w-full max-w-lg min-w-0 flex-col gap-1 self-stretch lg:max-w-none\",\n        containerClassName\n      )}\n      {...props}\n    >\n      {title && (\n        <div className=\"text-muted-foreground px-1.5 py-2 text-xs font-medium\">\n          {title}\n        </div>\n      )}\n      <div\n        data-slot=\"example-content\"\n        className={cn(\n          \"bg-background text-foreground flex min-w-0 flex-1 flex-col items-start gap-6 border border-dashed p-4 sm:p-6 *:[div:not([class*='w-'])]:w-full\",\n          className\n        )}\n      >\n        {children}\n      </div>\n    </div>\n  )\n}\n\nexport { ExampleWrapper, Example }\n",
+      "type": "registry:component"
+    }
+  ],
+  "type": "registry:component"
+}

apps/v4/public/r/styles/base-rhea/font-dm-sans.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "font-dm-sans",
+  "title": "DM Sans",
+  "type": "registry:font",
+  "font": {
+    "family": "'DM Sans', sans-serif",
+    "provider": "google",
+    "import": "DM_Sans",
+    "variable": "--font-sans",
+    "subsets": [
+      "latin"
+    ]
+  }
+}

apps/v4/public/r/styles/base-rhea/font-figtree.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "font-figtree",
+  "title": "Figtree",
+  "type": "registry:font",
+  "font": {
+    "family": "'Figtree Variable', sans-serif",
+    "provider": "google",
+    "import": "Figtree",
+    "variable": "--font-sans",
+    "subsets": [
+      "latin"
+    ]
+  }
+}

apps/v4/public/r/styles/base-rhea/font-geist-mono.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "font-geist-mono",
+  "title": "Geist Mono",
+  "type": "registry:font",
+  "font": {
+    "family": "'Geist Mono Variable', monospace",
+    "provider": "google",
+    "import": "Geist_Mono",
+    "variable": "--font-mono",
+    "subsets": [
+      "latin"
+    ]
+  }
+}

apps/v4/public/r/styles/base-rhea/font-geist.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "font-geist",
+  "title": "Geist",
+  "type": "registry:font",
+  "font": {
+    "family": "'Geist Variable', sans-serif",
+    "provider": "google",
+    "import": "Geist",
+    "variable": "--font-sans",
+    "subsets": [
+      "latin"
+    ]
+  }
+}

apps/v4/public/r/styles/base-rhea/font-inter.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "font-inter",
+  "title": "Inter",
+  "type": "registry:font",
+  "font": {
+    "family": "'Inter Variable', sans-serif",
+    "provider": "google",
+    "import": "Inter",
+    "variable": "--font-sans",
+    "subsets": [
+      "latin"
+    ]
+  }
+}

apps/v4/public/r/styles/base-rhea/font-jetbrains-mono.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "font-jetbrains-mono",
+  "title": "JetBrains Mono",
+  "type": "registry:font",
+  "font": {
+    "family": "'JetBrains Mono Variable', monospace",
+    "provider": "google",
+    "import": "JetBrains_Mono",
+    "variable": "--font-sans",
+    "subsets": [
+      "latin"
+    ]
+  }
+}

apps/v4/public/r/styles/base-rhea/font-noto-sans.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "font-noto-sans",
+  "title": "Noto Sans",
+  "type": "registry:font",
+  "font": {
+    "family": "'Noto Sans Variable', sans-serif",
+    "provider": "google",
+    "import": "Noto_Sans",
+    "variable": "--font-sans"
+  }
+}

apps/v4/public/r/styles/base-rhea/font-nunito-sans.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "font-nunito-sans",
+  "title": "Nunito Sans",
+  "type": "registry:font",
+  "font": {
+    "family": "'Nunito Sans Variable', sans-serif",
+    "provider": "google",
+    "import": "Nunito_Sans",
+    "variable": "--font-sans"
+  }
+}

apps/v4/public/r/styles/base-rhea/font-outfit.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "font-outfit",
+  "title": "Outfit",
+  "type": "registry:font",
+  "font": {
+    "family": "'Outfit', sans-serif",
+    "provider": "google",
+    "import": "Outfit",
+    "variable": "--font-sans",
+    "subsets": [
+      "latin"
+    ]
+  }
+}

apps/v4/public/r/styles/base-rhea/font-public-sans.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "font-public-sans",
+  "title": "Public Sans",
+  "type": "registry:font",
+  "font": {
+    "family": "'Public Sans', sans-serif",
+    "provider": "google",
+    "import": "Public_Sans",
+    "variable": "--font-sans",
+    "subsets": [
+      "latin"
+    ]
+  }
+}

apps/v4/public/r/styles/base-rhea/font-raleway.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "font-raleway",
+  "title": "Raleway",
+  "type": "registry:font",
+  "font": {
+    "family": "'Raleway', sans-serif",
+    "provider": "google",
+    "import": "Raleway",
+    "variable": "--font-sans",
+    "subsets": [
+      "latin"
+    ]
+  }
+}

apps/v4/public/r/styles/base-rhea/font-roboto.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "font-roboto",
+  "title": "Roboto",
+  "type": "registry:font",
+  "font": {
+    "family": "'Roboto', sans-serif",
+    "provider": "google",
+    "import": "Roboto",
+    "variable": "--font-sans",
+    "subsets": [
+      "latin"
+    ]
+  }
+}

apps/v4/public/r/styles/base-rhea/form.json

@@ -0,0 +1,5 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "form",
+  "type": "registry:ui"
+}

apps/v4/public/r/styles/base-rhea/hover-card-example.json

@@ -0,0 +1,19 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "hover-card-example",
+  "title": "Hover Card",
+  "registryDependencies": [
+    "button",
+    "dialog",
+    "hover-card",
+    "example"
+  ],
+  "files": [
+    {
+      "path": "registry/base-rhea/examples/hover-card-example.tsx",
+      "content": "import {\n  Example,\n  ExampleWrapper,\n} from \"@/registry/base-rhea/components/example\"\nimport { Button } from \"@/registry/base-rhea/ui/button\"\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogHeader,\n  DialogTitle,\n  DialogTrigger,\n} from \"@/registry/base-rhea/ui/dialog\"\nimport {\n  HoverCard,\n  HoverCardContent,\n  HoverCardTrigger,\n} from \"@/registry/base-rhea/ui/hover-card\"\n\nexport default function HoverCardExample() {\n  return (\n    <ExampleWrapper>\n      <HoverCardSides />\n      <HoverCardInDialog />\n    </ExampleWrapper>\n  )\n}\n\nconst HOVER_CARD_SIDES = [\n  \"inline-start\",\n  \"left\",\n  \"top\",\n  \"bottom\",\n  \"right\",\n  \"inline-end\",\n] as const\n\nfunction HoverCardSides() {\n  return (\n    <Example title=\"Sides\" containerClassName=\"col-span-2\">\n      <div className=\"flex flex-wrap items-center justify-center gap-2\">\n        {HOVER_CARD_SIDES.map((side) => (\n          <HoverCard key={side}>\n            <HoverCardTrigger\n              delay={100}\n              closeDelay={100}\n              render={<Button variant=\"outline\" className=\"capitalize\" />}\n            >\n              {side.replace(\"-\", \" \")}\n            </HoverCardTrigger>\n            <HoverCardContent side={side}>\n              <div className=\"style-lyra:gap-1 style-nova:gap-1.5 style-vega:gap-2 style-maia:gap-2 style-mira:gap-1 flex flex-col\">\n                <h4 className=\"font-medium\">Hover Card</h4>\n                <p>\n                  This hover card appears on the {side.replace(\"-\", \" \")} side\n                  of the trigger.\n                </p>\n              </div>\n            </HoverCardContent>\n          </HoverCard>\n        ))}\n      </div>\n    </Example>\n  )\n}\n\nfunction HoverCardInDialog() {\n  return (\n    <Example title=\"In Dialog\">\n      <Dialog>\n        <DialogTrigger render={<Button variant=\"outline\" />}>\n          Open Dialog\n        </DialogTrigger>\n        <DialogContent>\n          <DialogHeader>\n            <DialogTitle>Hover Card Example</DialogTitle>\n            <DialogDescription>\n              Hover over the button below to see the hover card.\n            </DialogDescription>\n          </DialogHeader>\n          <HoverCard>\n            <HoverCardTrigger\n              delay={100}\n              closeDelay={100}\n              render={<Button variant=\"outline\" className=\"w-fit\" />}\n            >\n              Hover me\n            </HoverCardTrigger>\n            <HoverCardContent>\n              <div className=\"style-lyra:gap-1 style-nova:gap-1.5 style-vega:gap-2 style-maia:gap-2 style-mira:gap-1 flex flex-col\">\n                <h4 className=\"font-medium\">Hover Card</h4>\n                <p>\n                  This hover card appears inside a dialog. Hover over the button\n                  to see it.\n                </p>\n              </div>\n            </HoverCardContent>\n          </HoverCard>\n        </DialogContent>\n      </Dialog>\n    </Example>\n  )\n}\n",
+      "type": "registry:example"
+    }
+  ],
+  "type": "registry:example"
+}