najm-kit 0.0.18 → 0.0.20

package/README.md

@@ -67,8 +67,63 @@ import { NajmThemeProvider } from 'najm-kit';
 
 // or mode + accent:
 <NajmThemeProvider mode="dark" accent="emerald">{children}</NajmThemeProvider>
+
+// shadcn-style global radius scale:
+<NajmThemeProvider radius="0.75rem">{children}</NajmThemeProvider>
+
+// exact same radius for cards, tables, buttons, inputs, dialogs, etc.:
+<NajmThemeProvider radius="0.75rem" radiusScale="uniform">
+  {children}
+</NajmThemeProvider>
+```
+
+`rounded-full` and `rounded-none` remain explicit, so avatars, pills, switches,
+and square variants keep their intended shape.
+
+### JSON theme settings
+
+Store one theme object in a JSON file, local storage, or your settings API:
+
+```json
+{
+  "mode": "dark",
+  "accent": "violet",
+  "radius": "0.75rem",
+  "radiusScale": "uniform",
+  "appearance": { "borderWidth": "1px" },
+  "tokens": {
+    "primary": "oklch(0.62 0.2 290)",
+    "primary-foreground": "oklch(1 0 0)",
+    "sidebar": "oklch(0.18 0.02 290)",
+    "chart-1": "oklch(0.70 0.20 40)"
+  }
+}
+```
+
+Load and apply it from the same settings state used by your theme editor:
+
+```tsx
+import rawTheme from './theme.json';
+import { NajmThemeProvider, parseNajmThemeConfig } from 'najm-kit';
+
+const initialTheme = parseNajmThemeConfig(rawTheme);
+
+function App() {
+  const [theme, setTheme] = useState(initialTheme);
+
+  return (
+    <NajmThemeProvider config={theme}>
+      <SettingsPage value={theme} onChange={setTheme} />
+      {children}
+    </NajmThemeProvider>
+  );
+}
 ```
 
+Changing the state updates the complete theme immediately. Use
+`stringifyNajmThemeConfig(theme)` when persisting it, and parse settings loaded
+from an API or local storage with `parseNajmThemeConfig` before applying them.
+
 ## Components
 
 Import from `najm-kit`:
@@ -110,4 +165,4 @@ import { useSelection } from 'najm-kit';
 - Uses Radix UI primitives under the hood — accessible by default
 - All components are unstyled by default — apply `buttonVariants()`, `badgeVariants()`, etc. with Tailwind
 - Requires Tailwind CSS **v4** in the host application (see Styling above)
-- CodeMirror components are optional peer deps — import from `najm-kit/json` only if needed
+- CodeMirror components are optional peer deps — import from `najm-kit/json` only if needed