rnwind 0.0.9 → 0.0.10

package/src/runtime/hooks/use-scheme.ts

@@ -1,5 +1,6 @@
 import type { ThemeTable } from '../../core/types'
 import { useRnwind } from '../components/rnwind-provider'
+import { getThemeTokens } from '../lookup-css'
 
 /**
  * Synthetic scheme name applied when tokens aren't declared under any
@@ -20,10 +21,13 @@ const BASE_SCHEME = 'base'
  */
 export function useTheme(): ThemeTable {
   const { scheme, tables } = useRnwind()
-  const base = tables[BASE_SCHEME] ?? {}
-  const schemeTable = tables[scheme]
-  if (!schemeTable) return base
-  // Fast path: nothing to merge when the scheme table is empty.
+  // The build registers token tables on the manifest so `useColor` works out
+  // of the box; an explicit `tables` prop layers on top (the prop wins).
+  const registered = getThemeTokens()
+  const base = { ...registered[BASE_SCHEME], ...tables[BASE_SCHEME] }
+  const schemeTable = { ...registered[scheme], ...tables[scheme] }
+  // Base tokens apply everywhere (CSS `:root` cascade); the active scheme's
+  // own entries override on overlap.
   if (Object.keys(schemeTable).length === 0) return base
   return { ...base, ...schemeTable }
 }

package/src/runtime/index.ts

@@ -2,6 +2,7 @@ export {
   lookupCss,
   registerAtoms,
   registerBreakpoints,
+  registerThemeTokens,
   registerSchemeLoader,
   setWindowHeightProvider,
   getBreakpoints,

package/src/runtime/lookup-css.ts

@@ -16,6 +16,7 @@
  */
 
 import type { RnwindState } from './components/rnwind-provider'
+import type { ThemeTables } from '../core/types'
 
 /** Empty sentinel returned when the input is null / undefined / empty. */
 const EMPTY_STYLES: readonly unknown[] = []
@@ -62,6 +63,8 @@ const cache = {
   atoms: Object.create(null) as Partial<Record<string, SchemeAtomsRecord>>,
   breakpoints: Object.create(null) as Partial<Record<string, number>>,
   breakpointList: [] as readonly BreakpointEntry[],
+  /** Per-scheme theme token tables (`--color-*`, `--spacing-*`, …) the manifest registers for `useColor` / `useToken` / `useSize`. */
+  themeTokens: {} as ThemeTables,
 }
 
 /**
@@ -553,6 +556,30 @@ export function getBreakpoints(): readonly BreakpointEntry[] {
   return cache.breakpointList
 }
 
+/**
+ * Register the per-scheme theme token tables the manifest module emits at
+ * load time — the data source for `useColor` / `useToken` / `useSize`. The
+ * build lowers `--color-*` tokens to sRGB before registering them, so these
+ * are RN-safe. Replaces the prior tables; bumps `atomVersion` so a theme HMR
+ * cycle re-resolves. The build registers tokens here so the hooks work out of
+ * the box, without the user manually threading a `tables` prop on the provider.
+ * @param tables Scheme name → (token name → value) map.
+ */
+export function registerThemeTokens(tables: ThemeTables): void {
+  cache.themeTokens = tables
+  atomVersion += 1
+}
+
+/**
+ * The manifest-registered theme token tables. The provider merges these under
+ * any explicit `tables` prop (the prop wins), so `useColor` resolves from the
+ * build by default.
+ * @returns Registered per-scheme token tables.
+ */
+export function getThemeTokens(): ThemeTables {
+  return cache.themeTokens
+}
+
 /**
  * Sentinel name returned by {@link activeBreakpointFor} ONLY when no
  * breakpoints are registered at all (bundle without rnwind-transformed
@@ -635,6 +662,7 @@ export function __resetLookupCssState(): void {
   for (const key of Object.keys(cache.atoms)) delete cache.atoms[key]
   for (const key of Object.keys(cache.breakpoints)) delete cache.breakpoints[key]
   cache.breakpointList = []
+  cache.themeTokens = {}
   windowHeightProvider = null
   schemeLoader = null
   WARNED_MISSING_INSETS = false

package/src/testing/index.ts

@@ -17,6 +17,7 @@ import {
   __resetLookupCssState,
   registerAtoms,
   registerBreakpoints,
+  registerThemeTokens,
   registerSchemeLoader,
 } from '../runtime/lookup-css'
 import { __resetResolveState, registerGradients, registerHaptics, registerMolecules } from '../runtime/resolve'
@@ -159,6 +160,7 @@ function evaluateGeneratedFile(filePath: string): void {
     'registerBreakpoints',
     'registerGradients',
     'registerHaptics',
+    'registerThemeTokens',
     'registerSchemeLoader',
     'require',
     body,
@@ -169,6 +171,7 @@ function evaluateGeneratedFile(filePath: string): void {
     registerBreakpoints,
     registerGradients,
     registerHaptics,
+    registerThemeTokens,
     registerSchemeLoader,
     () => {},
   )