chore(registry): cleanup styles

components.json

@@ -1,6 +1,6 @@
 {
   "$schema": "https://ui.shadcn.com/schema.json",
-  "style": "radix-nova",
+  "style": "new-york",
   "rsc": true,
   "tsx": true,
   "tailwind": {

next.config.ts

@@ -6,22 +6,27 @@ import type { NextConfig } from "next";
  */
 // Import environment validation synchronously
 import "./src/env.js";
-import { DEFAULT_STYLE_ID, getStyleIds } from "./src/registry/styles";
 
 const nextConfig: NextConfig = {
   cacheComponents: true,
+  async redirects() {
+    return [
+      {
+        source: "/docs/components/:name((?!radix|base)[^/]+)",
+        destination: "/docs/components/base/:name",
+        permanent: false,
+      },
+    ];
+  },
   async rewrites() {
     return [
-      // Published style ids resolve to their static directory.
       {
-        source: `/r/:style(${getStyleIds().join("|")})/:name.json`,
+        source: "/r/:style/:name.json",
         destination: "/r/styles/:style/:name.json",
       },
-      // Bases we don't author (`aria-*`) and legacy v3 ids fall back to the
-      // default rather than 404ing on an otherwise valid install.
       {
-        source: "/r/:style/:name.json",
-        destination: `/r/styles/${DEFAULT_STYLE_ID}/:name.json`,
+        source: "/r/:name.json",
+        destination: "/r/styles/base-nova/:name.json",
       },
     ];
   },

package.json

@@ -20,8 +20,8 @@
     "typecheck": "tsc --noEmit",
     "check": "oxlint . && oxfmt --check && tsc --noEmit",
     "shadcn": "pnpm dlx shadcn@latest",
-    "build:registry": "tsx scripts/build-registry.ts",
-    "clean:registry": "tsx scripts/clean-registry.ts",
+    "build:registry": "tsx --tsconfig ./tsconfig.scripts.json scripts/build-registry.ts",
+    "clean:registry": "tsx --tsconfig ./tsconfig.scripts.json scripts/clean-registry.ts",
     "db:start": "docker compose up -d",
     "db:stop": "docker compose down",
     "db:generate": "dotenv drizzle-kit generate",

public/r/styles/index.json

@@ -1,50 +1,50 @@
 [
   {
-    "name": "radix-nova"
+    "name": "base-vega"
   },
   {
-    "name": "radix-vega"
+    "name": "base-nova"
   },
   {
-    "name": "radix-maia"
+    "name": "base-maia"
   },
   {
-    "name": "radix-lyra"
+    "name": "base-lyra"
   },
   {
-    "name": "radix-mira"
+    "name": "base-mira"
   },
   {
-    "name": "radix-luma"
+    "name": "base-luma"
   },
   {
-    "name": "radix-sera"
+    "name": "base-sera"
   },
   {
-    "name": "radix-rhea"
+    "name": "base-rhea"
   },
   {
-    "name": "base-nova"
+    "name": "radix-vega"
   },
   {
-    "name": "base-vega"
+    "name": "radix-nova"
   },
   {
-    "name": "base-maia"
+    "name": "radix-maia"
   },
   {
-    "name": "base-lyra"
+    "name": "radix-lyra"
   },
   {
-    "name": "base-mira"
+    "name": "radix-mira"
   },
   {
-    "name": "base-luma"
+    "name": "radix-luma"
   },
   {
-    "name": "base-sera"
+    "name": "radix-sera"
   },
   {
-    "name": "base-rhea"
+    "name": "radix-rhea"
   }
 ]

registry/bases.ts

@@ -0,0 +1,32 @@
+/**
+ * @see https://github.com/shadcn-ui/ui/blob/main/apps/v4/registry/bases.ts
+ */
+
+import type { RegistryItem } from "shadcn/schema";
+
+export const BASES: RegistryItem[] = [
+  {
+    name: "base",
+    type: "registry:style",
+    title: "Base UI",
+    description:
+      "Components for building accessible web apps and design systems.",
+    dependencies: ["@base-ui/react"],
+    meta: {
+      logo: "<svg width='17' height='24' viewBox='0 0 17 24'><path fill='currentColor' d='M9.5001 7.01537C9.2245 6.99837 9 7.22385 9 7.49999V23C13.4183 23 17 19.4183 17 15C17 10.7497 13.6854 7.27351 9.5001 7.01537Z'></path><path fill='currentColor' d='M8 9.8V12V23C3.58172 23 0 19.0601 0 14.2V12V1C4.41828 1 8 4.93989 8 9.8Z'></path></svg>",
+    },
+  },
+  {
+    name: "radix",
+    type: "registry:style",
+    title: "Radix UI",
+    description:
+      "Optimized for fast development, easy maintenance, and accessibility.",
+    dependencies: ["radix-ui"],
+    meta: {
+      logo: "<svg role='img' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><title>Radix UI</title><path fill='currentColor' d='M11.52 24a7.68 7.68 0 0 1-7.68-7.68 7.68 7.68 0 0 1 7.68-7.68V24Zm0-24v7.68H3.84V0h7.68Zm4.8 7.68a3.84 3.84 0 1 1 0-7.68 3.84 3.84 0 0 1 0 7.68Z'/></svg>",
+    },
+  },
+] as const;
+
+export type Base = (typeof BASES)[number];

registry/styles.tsx

@@ -0,0 +1,194 @@
+/**
+ * @see https://github.com/shadcn-ui/ui/blob/main/apps/v4/registry/styles.tsx
+ */
+
+export const STYLES = [
+  {
+    name: "vega",
+    title: "Vega",
+    description: "Clean, neutral, and familiar",
+    icon: (
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        width="128"
+        height="128"
+        viewBox="0 0 24 24"
+        fill="none"
+        role="img"
+        color="currentColor"
+      >
+        <path
+          d="M2.5 12C2.5 7.52166 2.5 5.28249 3.89124 3.89124C5.28249 2.5 7.52166 2.5 12 2.5C16.4783 2.5 18.7175 2.5 20.1088 3.89124C21.5 5.28249 21.5 7.52166 21.5 12C21.5 16.4783 21.5 18.7175 20.1088 20.1088C18.7175 21.5 16.4783 21.5 12 21.5C7.52166 21.5 5.28249 21.5 3.89124 20.1088C2.5 18.7175 2.5 16.4783 2.5 12Z"
+          stroke="currentColor"
+          strokeWidth="2"
+        ></path>
+      </svg>
+    ),
+  },
+  {
+    name: "nova",
+    title: "Nova",
+    description: "Reduced padding and margins",
+    icon: (
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        width="128"
+        height="128"
+        viewBox="0 0 24 24"
+        fill="none"
+        role="img"
+        color="currentColor"
+      >
+        <path
+          d="M2 12C2 9.19974 2 7.79961 2.54497 6.73005C3.02433 5.78924 3.78924 5.02433 4.73005 4.54497C5.79961 4 7.19974 4 10 4H14C16.8003 4 18.2004 4 19.27 4.54497C20.2108 5.02433 20.9757 5.78924 21.455 6.73005C22 7.79961 22 9.19974 22 12C22 14.8003 22 16.2004 21.455 17.27C20.9757 18.2108 20.2108 18.9757 19.27 19.455C18.2004 20 16.8003 20 14 20H10C7.19974 20 5.79961 20 4.73005 19.455C3.78924 18.9757 3.02433 18.2108 2.54497 17.27C2 16.2004 2 14.8003 2 12Z"
+          stroke="currentColor"
+          strokeWidth="2"
+          strokeLinejoin="round"
+        ></path>
+      </svg>
+    ),
+  },
+  {
+    name: "maia",
+    title: "Maia",
+    description: "Rounded, with generous spacing.",
+    icon: (
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        width="128"
+        height="128"
+        viewBox="0 0 24 24"
+        fill="none"
+        role="img"
+        color="currentColor"
+      >
+        <circle
+          cx="12"
+          cy="12"
+          r="10"
+          stroke="currentColor"
+          strokeWidth="2"
+          strokeLinejoin="round"
+        ></circle>
+      </svg>
+    ),
+  },
+  {
+    name: "lyra",
+    title: "Lyra",
+    description: "Boxy and sharp. For mono fonts.",
+    icon: (
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        width="128"
+        height="128"
+        viewBox="0 0 24 24"
+        fill="none"
+        role="img"
+        color="currentColor"
+      >
+        <path
+          d="M7.84308 3.80211C9.8718 2.6007 10.8862 2 12 2C13.1138 2 14.1282 2.6007 16.1569 3.80211L16.8431 4.20846C18.8718 5.40987 19.8862 6.01057 20.4431 7C21 7.98943 21 9.19084 21 11.5937V12.4063C21 14.8092 21 16.0106 20.4431 17C19.8862 17.9894 18.8718 18.5901 16.8431 19.7915L16.1569 20.1979C14.1282 21.3993 13.1138 22 12 22C10.8862 22 9.8718 21.3993 7.84308 20.1979L7.15692 19.7915C5.1282 18.5901 4.11384 17.9894 3.55692 17C3 16.0106 3 14.8092 3 12.4063V11.5937C3 9.19084 3 7.98943 3.55692 7C4.11384 6.01057 5.1282 5.40987 7.15692 4.20846L7.84308 3.80211Z"
+          stroke="currentColor"
+          strokeWidth="2"
+        ></path>
+      </svg>
+    ),
+  },
+  {
+    name: "mira",
+    title: "Mira",
+    description: "Made for compact interfaces.",
+    icon: (
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        width="128"
+        height="128"
+        viewBox="0 0 24 24"
+        fill="none"
+        role="img"
+        color="currentColor"
+      >
+        <path
+          d="M5.92089 5.92089C8.15836 3.68342 9.2771 2.56468 10.5857 2.19562C11.5105 1.93479 12.4895 1.93479 13.4143 2.19562C14.7229 2.56468 15.8416 3.68342 18.0791 5.92089C20.3166 8.15836 21.4353 9.2771 21.8044 10.5857C22.0652 11.5105 22.0652 12.4895 21.8044 13.4143C21.4353 14.7229 20.3166 15.8416 18.0791 18.0791C15.8416 20.3166 14.7229 21.4353 13.4143 21.8044C12.4895 22.0652 11.5105 22.0652 10.5857 21.8044C9.2771 21.4353 8.15836 20.3166 5.92089 18.0791C3.68342 15.8416 2.56468 14.7229 2.19562 13.4143C1.93479 12.4895 1.93479 11.5105 2.19562 10.5857C2.56468 9.2771 3.68342 8.15836 5.92089 5.92089Z"
+          stroke="currentColor"
+          strokeWidth="2"
+          strokeLinejoin="round"
+        ></path>
+      </svg>
+    ),
+  },
+  {
+    name: "luma",
+    title: "Luma",
+    description: "Fluid, luminous, and soft.",
+    icon: (
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        width="128"
+        height="128"
+        viewBox="0 0 24 24"
+        fill="none"
+        role="img"
+        color="currentColor"
+      >
+        <path
+          d="M2 12C2 8.134 5.134 5 9 5H15C18.866 5 22 8.134 22 12C22 15.866 18.866 19 15 19H9C5.134 19 2 15.866 2 12Z"
+          stroke="currentColor"
+          strokeWidth="2"
+          strokeLinejoin="round"
+        ></path>
+      </svg>
+    ),
+  },
+  {
+    name: "sera",
+    title: "Sera",
+    description: "Editorial and typographic.",
+    icon: (
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        width="128"
+        height="128"
+        viewBox="0 0 24 24"
+        fill="none"
+        role="img"
+        color="currentColor"
+      >
+        <rect
+          x="3"
+          y="3"
+          width="18"
+          height="18"
+          stroke="currentColor"
+          strokeWidth="2"
+        ></rect>
+      </svg>
+    ),
+  },
+  {
+    name: "rhea",
+    title: "Rhea",
+    description: "Like Luma but compact.",
+    icon: (
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        width="128"
+        height="128"
+        viewBox="0 0 24 24"
+        fill="none"
+        role="img"
+        color="currentColor"
+      >
+        <path
+          d="M3 12C3 9.79086 4.79086 8 7 8H17C19.2091 8 21 9.79086 21 12C21 14.2091 19.2091 16 17 16H7C4.79086 16 3 14.2091 3 12Z"
+          stroke="currentColor"
+          strokeWidth="2"
+          strokeLinejoin="round"
+        ></path>
+      </svg>
+    ),
+  },
+] as const;
+
+export type Style = (typeof STYLES)[number];