shadcn

apps/www/src/components/_block-display.tsx

@@ -1,5 +1,5 @@
 import { getBlock } from '@/lib/_blocks';
-import { styles } from '@/registry/styles';
+import { styles } from '@/registry/registry-styles';
 
 import { BlockPreview } from './block-preview';
 

apps/www/src/components/component-preview.tsx

@@ -6,7 +6,7 @@ import { cn } from '@udecode/cn';
 
 import { Index } from '@/__registry__';
 import { useConfig } from '@/hooks/use-config';
-import { styles } from '@/registry/styles';
+import { styles } from '@/registry/registry-styles';
 
 import { CopyButton } from './copy-button';
 import { Icons } from './icons';

apps/www/src/components/copy-code-button.tsx

@@ -14,7 +14,7 @@ import {
   DialogTitle,
   DialogTrigger,
 } from '@/registry/default/plate-ui/dialog';
-import { type Theme, themes } from '@/registry/themes';
+import { type BaseColor, baseColors } from '@/registry/registry-base-colors';
 
 import { copyToClipboardWithMeta } from './copy-button';
 
@@ -23,7 +23,7 @@ export function CopyCodeButton({
   ...props
 }: React.ComponentProps<typeof Button>) {
   const [config] = useConfig();
-  const activeTheme = themes.find((theme) => theme.name === config.theme);
+  const activeTheme = baseColors.find((theme) => theme.name === config.theme);
   const [hasCopied, setHasCopied] = React.useState(false);
 
   React.useEffect(() => {
@@ -107,7 +107,7 @@ export function CopyCodeButton({
 
 function CustomizerCode() {
   const [config] = useConfig();
-  const activeTheme = themes.find((theme) => theme.name === config.theme);
+  const activeTheme = baseColors.find((theme) => theme.name === config.theme);
 
   return (
     <div className="relative space-y-4">
@@ -230,7 +230,7 @@ function CustomizerCode() {
   );
 }
 
-function getThemeCode(theme: Theme, radius: number) {
+function getThemeCode(theme: BaseColor, radius: number) {
   if (!theme) {
     return '';
   }

apps/www/src/components/style-switcher.tsx

@@ -7,7 +7,7 @@ import type { SelectTriggerProps } from '@radix-ui/react-select';
 import { cn } from '@udecode/cn';
 
 import { useConfig } from '@/hooks/use-config';
-import { type Style, styles } from '@/registry/styles';
+import { type Style, styles } from '@/registry/registry-styles';
 
 import {
   Select,

apps/www/src/components/style-wrapper.tsx

@@ -2,7 +2,7 @@
 
 import * as React from 'react';
 
-import type { Style } from '@/registry/styles';
+import type { Style } from '@/registry/registry-styles';
 
 import { useConfig } from '@/hooks/use-config';
 

apps/www/src/components/theme-customizer.tsx

@@ -34,6 +34,7 @@ import {
   TooltipContent,
   TooltipTrigger,
 } from '@/registry/default/plate-ui/tooltip';
+import { type BaseColor, baseColors } from '@/registry/registry-base-colors';
 
 import { copyToClipboardWithMeta } from './copy-button';
 import { ThemeWrapper } from './theme-wrapper';

apps/www/src/components/themes-button.tsx

@@ -14,7 +14,7 @@ import {
   TooltipContent,
   TooltipTrigger,
 } from '@/registry/default/plate-ui/tooltip';
-import { themes } from '@/registry/themes';
+import { baseColors } from '@/registry/registry-base-colors';
 
 import { settingsStore } from './context/settings-store';
 import { Skeleton } from './ui/skeleton';
@@ -34,7 +34,7 @@ export function ThemesButton() {
         {mounted ? (
           <>
             {['slate', 'rose', 'blue', 'green', 'orange'].map((color) => {
-              const theme = themes.find((th) => th.name === color);
+              const theme = baseColors.find((th) => th.name === color);
               const isActive = config.theme === color;
 
               if (!theme) {

apps/www/src/components/themes-styles.tsx

@@ -1,5 +1,7 @@
 'use client';
 
+import { useThemesConfig } from '@/hooks/use-themes-config';
+
 export function ThemesStyle() {
   const { themesConfig } = useThemesConfig();
 

apps/www/src/components/themes-tab-content.tsx

@@ -19,7 +19,7 @@ import {
   PopoverContent,
   PopoverTrigger,
 } from '@/registry/default/plate-ui/popover';
-import { themes } from '@/registry/themes';
+import { baseColors } from '@/registry/registry-base-colors';
 
 import { CopyCodeButton } from './copy-code-button';
 import { Label } from './ui/label';
@@ -109,7 +109,7 @@ export function ThemesTabContent() {
         <div className="space-y-1.5">
           <Label className="text-xs">Color</Label>
           <div className="grid grid-cols-3 gap-2">
-            {themes.map((theme) => {
+            {baseColors.map((theme) => {
               const isActive = config.theme === theme.name;
 
               return mounted ? (

apps/www/src/components/typography.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 
 import type { Event } from '@/lib/events';
-import type { Style } from '@/registry/styles';
+import type { Style } from '@/registry/registry-styles';
 import type { NpmCommands } from '@/types/unist';
 
 import { cn } from '@udecode/cn';

apps/www/src/hooks/use-config.ts

@@ -1,4 +1,5 @@
-import type { Style } from '@/registry/styles';
+import type { BaseColor } from '@/registry/registry-base-colors';
+import type { Style } from '@/registry/registry-styles';
 
 import { useAtom } from 'jotai';
 import { atomWithStorage } from 'jotai/utils';

apps/www/src/lib/_blocks.ts

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/require-await */
 'use server';
 
-import type { Style } from '@/registry/styles';
+import type { Style } from '@/registry/registry-styles';
 
 import { promises as fs } from 'node:fs';
 import { tmpdir } from 'node:os';

apps/www/src/registry/registry-base-colors.ts

@@ -633,4 +633,4 @@ export const baseColors = [
   },
 ] as const;
 
-export type BaseTheme = (typeof baseColors)[number];
+export type BaseColor = (typeof baseColors)[number];

apps/www/src/registry/registry-examples.ts

@@ -154,12 +154,12 @@ export const examples: Registry = [
     external: true,
     files: ['styles/globals.css'],
     name: 'globals',
-    type: 'components:component',
+    type: 'registry:style',
   },
   {
     external: true,
     files: ['types/plate-types.ts'],
     name: 'plate-types',
-    type: 'components:component',
+    type: 'registry:lib',
   },
 ];