extendThemes()

bun.lock

@@ -1,5 +1,6 @@
 {
   "lockfileVersion": 1,
+  "configVersion": 0,
   "workspaces": {
     "": {
       "name": "forge",

src/index.tsx

@@ -4,26 +4,13 @@ import { type TagDef, UnitlessProps, NonStyleKeys } from './types'
 export const styles: Record<string, Record<string, string>> = {}
 const themes: Record<string, Record<string, any>> = {}
 
-// Type registry for theme variables (will be auto-populated)
-let registeredThemeKeys: Set<string> = new Set()
-
-// Clear all registered styles
 export function clearStyles() {
   for (const key in styles) delete styles[key]
   for (const key in themes) delete themes[key]
-  registeredThemeKeys.clear()
 }
 
-// Register a theme with CSS custom properties
-export function createTheme<const T extends Record<string, string | number>>(
-  name: string,
-  values: T
-): T {
-  themes[name] = values as Record<string, string>
-
-  // track for runtime validation
-  Object.keys(values).forEach(key => registeredThemeKeys.add(key))
-
+export function createTheme<const T extends Record<string, string | number>>(name: string, values: T): T {
+  themes[name] = values as Record<string, string | number>
   return values
 }
 
@@ -52,16 +39,20 @@ export function createThemedVar<T extends Record<string, any>>(_themes: T) {
   }
 }
 
-// Simplified API: register multiple themes and get typed themeVar in one call
 type Theme = Record<string, string | number>
-export function createThemes<T extends Record<string, Theme>>(themes: T) {
-  const registeredThemes = {} as T
 
-  for (const [name, values] of Object.entries(themes)) {
-    (registeredThemes as any)[name] = createTheme(name, values)
-  }
+export function createThemes<T extends Record<string, Theme>>(themeDefs: T) {
+  for (const [name, values] of Object.entries(themeDefs))
+    createTheme(name, values)
 
-  return createThemedVar(registeredThemes)
+  return (name: keyof T[keyof T]) => `var(--theme-${name as string})`
+}
+
+export function extendThemes(overrides: Record<string, Theme>) {
+  for (const [name, values] of Object.entries(overrides))
+    themes[name] = { ...themes[name], ...values }
+
+  return (name: string) => `var(--theme-${name})`
 }
 
 // Generic themeVar (untyped fallback)