plankui 0.1.2 → 0.1.4

package/README.md

@@ -37,7 +37,7 @@ npx plankui@latest init
 npx plankui@latest add button select dialog
 ```
 
-That's it. `init` sets up the design tokens once, and `add` drops each component into `components/ui`, together with every PlankUI file it builds on and the npm packages it needs.
+That's it. `init` asks whether to build on **Radix UI or Base UI** and sets up the design tokens once, and `add` drops each component into `components/ui`, together with every PlankUI file it builds on and the npm packages it needs.
 
 ```tsx
 import { Button } from "@/components/ui/button";
@@ -51,6 +51,7 @@ export function Save() {
 
 - **You own the code.** Components land in your repo as plain TypeScript. Read them, change any line, never wait on a package upgrade.
 - **Beautiful by default.** Six themes and five component styles (Soft, Flat, Liquid glass, Keycap, Brutal), in light and dark, from one tokens file.
+- **Radix UI or Base UI.** Every component built on primitives comes in both, with the same props. Choose once at `init`.
 - **Accessible.** Keyboard support, focus rings, ARIA roles and reduced motion handled for you.
 - **Agent ready.** The [PlankUI MCP server](https://www.npmjs.com/package/@plankui/mcp) gives Cursor, Claude Code, VS Code and other agents the real source of every component.
 
@@ -58,7 +59,7 @@ export function Save() {
 
 | Command | What it does |
 | --- | --- |
-| `plankui init` | Writes `tokens.css`, `styles.css` and the `cn` helper, and installs `clsx` and `tailwind-merge` |
+| `plankui init` | Asks Radix UI or Base UI (saved in `plankui.json`), writes `tokens.css`, `styles.css` and the `cn` helper, and installs `clsx` and `tailwind-merge` |
 | `plankui add <names…>` | Copies components and the PlankUI files they build on, then installs their npm packages |
 | `plankui list` | Lists every component you can add |
 
@@ -69,6 +70,7 @@ export function Save() {
 | `--yes`, `-y` | Answer every prompt with its default and keep files that already exist. Use it in CI and for coding agents |
 | `--overwrite` | Replace files that already exist |
 | `--no-install` | Write the files but skip installing npm packages |
+| `--base`, `--radix` | Use Base UI or Radix UI primitives for this run, whatever `plankui.json` says |
 | `--cwd <dir>` | Run in another folder |
 | `--registry <url>` | Read components from another registry |
 
@@ -76,16 +78,18 @@ The CLI picks your package manager (npm, pnpm, yarn or bun) from your lockfile,
 
 ## Components
 
-35 components today, with more every week.
+72 components today, with more every week.
 
 | | |
 | --- | --- |
-| **Actions** | [Button](https://plankui.com/docs/components/button), [Segmented control](https://plankui.com/docs/components/segmented), [Dropdown menu](https://plankui.com/docs/components/dropdown-menu), [Button group](https://plankui.com/docs/components/button-group), [Copy button](https://plankui.com/docs/components/copy-button) |
-| **Forms** | [Input](https://plankui.com/docs/components/input), [Textarea](https://plankui.com/docs/components/textarea), [Select](https://plankui.com/docs/components/select), [Checkbox](https://plankui.com/docs/components/checkbox), [Radio group](https://plankui.com/docs/components/radio-group), [Switch](https://plankui.com/docs/components/switch), [Slider](https://plankui.com/docs/components/slider), [Combobox](https://plankui.com/docs/components/combobox), [Input OTP](https://plankui.com/docs/components/input-otp), [Password input](https://plankui.com/docs/components/password-input) |
-| **Overlays** | [Dialog](https://plankui.com/docs/components/dialog), [Popover](https://plankui.com/docs/components/popover), [Tooltip](https://plankui.com/docs/components/tooltip), [Sheet](https://plankui.com/docs/components/sheet), [Alert dialog](https://plankui.com/docs/components/alert-dialog) |
-| **Feedback** | [Toast](https://plankui.com/docs/components/toast), [Alert](https://plankui.com/docs/components/alert), [Progress](https://plankui.com/docs/components/progress), [Skeleton](https://plankui.com/docs/components/skeleton), [Spinner](https://plankui.com/docs/components/spinner) |
-| **Display** | [Card](https://plankui.com/docs/components/card), [Avatar](https://plankui.com/docs/components/avatar), [Badge](https://plankui.com/docs/components/badge), [Kbd](https://plankui.com/docs/components/kbd), [Separator](https://plankui.com/docs/components/separator), [Table](https://plankui.com/docs/components/table) |
-| **Navigation** | [Tabs](https://plankui.com/docs/components/tabs), [Accordion](https://plankui.com/docs/components/accordion), [Breadcrumb](https://plankui.com/docs/components/breadcrumb), [Pagination](https://plankui.com/docs/components/pagination) |
+| **Actions** | [Button](https://plankui.com/docs/components/button), [Segmented control](https://plankui.com/docs/components/segmented), [Dropdown menu](https://plankui.com/docs/components/dropdown-menu), [Toggle](https://plankui.com/docs/components/toggle), [Command](https://plankui.com/docs/components/command), [Button group](https://plankui.com/docs/components/button-group), [Copy button](https://plankui.com/docs/components/copy-button), [Theme toggle](https://plankui.com/docs/components/theme-toggle) |
+| **Forms** | [Textarea counter](https://plankui.com/docs/components/textarea-counter), [Native select](https://plankui.com/docs/components/native-select), [Input](https://plankui.com/docs/components/input), [Textarea](https://plankui.com/docs/components/textarea), [Select](https://plankui.com/docs/components/select), [Checkbox](https://plankui.com/docs/components/checkbox), [Radio group](https://plankui.com/docs/components/radio-group), [Switch](https://plankui.com/docs/components/switch), [Slider](https://plankui.com/docs/components/slider), [Combobox](https://plankui.com/docs/components/combobox), [Number input](https://plankui.com/docs/components/number-input), [Input OTP](https://plankui.com/docs/components/input-otp), [Calendar](https://plankui.com/docs/components/calendar), [Password input](https://plankui.com/docs/components/password-input), [Tag input](https://plankui.com/docs/components/tag-input), [Rating](https://plankui.com/docs/components/rating), [Search field](https://plankui.com/docs/components/search-field), [Time field](https://plankui.com/docs/components/time-field) |
+| **Overlays** | [Dialog](https://plankui.com/docs/components/dialog), [Popover](https://plankui.com/docs/components/popover), [Tooltip](https://plankui.com/docs/components/tooltip), [Sheet](https://plankui.com/docs/components/sheet), [Alert dialog](https://plankui.com/docs/components/alert-dialog), [Hover card](https://plankui.com/docs/components/hover-card), [Context menu](https://plankui.com/docs/components/context-menu) |
+| **Feedback** | [Status indicator](https://plankui.com/docs/components/status-indicator), [Toast](https://plankui.com/docs/components/toast), [Alert](https://plankui.com/docs/components/alert), [Progress](https://plankui.com/docs/components/progress), [Skeleton](https://plankui.com/docs/components/skeleton), [Spinner](https://plankui.com/docs/components/spinner), [Empty state](https://plankui.com/docs/components/empty-state), [Announcement](https://plankui.com/docs/components/announcement), [Progress circle](https://plankui.com/docs/components/progress-circle) |
+| **Display** | [Scroll area](https://plankui.com/docs/components/scroll-area), [Disclosure](https://plankui.com/docs/components/disclosure), [Description list](https://plankui.com/docs/components/description-list), [Card](https://plankui.com/docs/components/card), [Avatar](https://plankui.com/docs/components/avatar), [Badge](https://plankui.com/docs/components/badge), [Kbd](https://plankui.com/docs/components/kbd), [Separator](https://plankui.com/docs/components/separator), [Table](https://plankui.com/docs/components/table), [Stat](https://plankui.com/docs/components/stat), [Chip](https://plankui.com/docs/components/chip), [Count up](https://plankui.com/docs/components/count-up), [Timeline](https://plankui.com/docs/components/timeline), [Divider](https://plankui.com/docs/components/divider) |
+| **Navigation** | [Tabs](https://plankui.com/docs/components/tabs), [Accordion](https://plankui.com/docs/components/accordion), [Breadcrumb](https://plankui.com/docs/components/breadcrumb), [Pagination](https://plankui.com/docs/components/pagination), [Stepper](https://plankui.com/docs/components/stepper) |
+| **Charts** | [Bar chart](https://plankui.com/docs/components/bar-chart), [Sparkline](https://plankui.com/docs/components/sparkline), [Line chart](https://plankui.com/docs/components/line-chart), [Bar list](https://plankui.com/docs/components/bar-list), [Stage bars](https://plankui.com/docs/components/stage-bars), [Chart card](https://plankui.com/docs/components/chart-card), [Steps card](https://plankui.com/docs/components/steps-card), [Most active days](https://plankui.com/docs/components/active-days-card) |
+| **Blocks** | [Task list](https://plankui.com/docs/components/task-list), [Stat cards](https://plankui.com/docs/components/stat-cards), [Agent limits](https://plankui.com/docs/components/agent-limits) |
 
 ## Themes and styles
 

package/index.mjs

@@ -4,6 +4,7 @@
 //
 //   npx plankui@latest init
 //   npx plankui@latest add button select dialog
+//   npx plankui@latest add select --base       (the Base UI version)
 //   npx plankui@latest list
 //   npx plankui@latest login YOUR_LICENSE_KEY
 import { existsSync, lstatSync, mkdirSync, readFileSync, realpathSync, rmSync, writeFileSync } from "node:fs";
@@ -12,7 +13,7 @@ import { dirname, isAbsolute, join, relative, resolve, sep } from "node:path";
 import { spawnSync } from "node:child_process";
 import { createInterface } from "node:readline/promises";
 
-const VERSION = "0.1.2";
+const VERSION = "0.1.4";
 const DEFAULT_REGISTRY = "https://plankui.com/r";
 
 /* ── Arguments ── */
@@ -31,6 +32,8 @@ const yes = flags.has("--yes") || flags.has("-y");
 const overwrite = flags.has("--overwrite");
 const skipInstall = flags.has("--no-install");
 const cwd = opt("cwd", process.cwd());
+/** Primitives asked for on this run: --base or --radix. Otherwise plankui.json decides. */
+const libFlag = flags.has("--base") ? "base" : flags.has("--radix") ? "radix" : null;
 const registry = (opt("registry", process.env.PLANKUI_REGISTRY) ?? DEFAULT_REGISTRY).replace(/\/$/, "");
 
 /* ── Output ── */
@@ -53,6 +56,29 @@ async function confirm(question, fallback) {
   return answer ? answer.startsWith("y") : fallback;
 }
 
+/** Pick one of two answers. With --yes or no terminal, takes the first. */
+async function choose(question, options) {
+  if (yes || !process.stdin.isTTY) return options[0].value;
+  const rl = createInterface({ input: process.stdin, output: process.stdout });
+  say(question);
+  options.forEach((o, i) => say(`  ${i + 1}. ${o.label}${i === 0 ? dim(" (default)") : ""}`));
+  const answer = (await rl.question(dim("Choose 1 or 2: "))).trim();
+  rl.close();
+  return options[Number(answer) - 1]?.value ?? options[0].value;
+}
+
+/* ── Project settings: plankui.json ── */
+const settingsFile = () => join(cwd, "plankui.json");
+function settings() {
+  try {
+    return JSON.parse(readFileSync(settingsFile(), "utf8"));
+  } catch {
+    return {};
+  }
+}
+/** "radix" or "base": the flag, then plankui.json, then Radix. */
+const primitives = () => libFlag ?? (settings().primitives === "base" ? "base" : "radix");
+
 /* ── Project ── */
 function project() {
   const pkgPath = join(cwd, "package.json");
@@ -207,6 +233,12 @@ async function init() {
   say(bold("PlankUI") + dim(` init, into ${relative(cwd, base) || "."}`));
   if (!deps.tailwindcss) say(`${yellow("note")} Tailwind CSS v4 is not in package.json. PlankUI needs it: see the framework guides.`);
   if (!deps.react) fail("React is not in package.json. PlankUI is for React 19 projects.");
+  const lib = libFlag ?? (await choose("Which primitives should the components use?", [
+    { value: "radix", label: "Radix UI" },
+    { value: "base", label: "Base UI" },
+  ]));
+  writeFileSync(settingsFile(), JSON.stringify({ ...settings(), primitives: lib }, null, 2) + "\n");
+  say(`${green("saved")} plankui.json ${dim(`(components use ${lib === "base" ? "Base UI" : "Radix UI"})`)}`);
   const spec = await fetchJson("init");
   if (!spec) fail("The registry has no init file.");
   for (const [state, file] of await writeFiles(base, spec.files)) say(`${state} ${file}`);
@@ -228,12 +260,14 @@ async function add() {
     if (!(await confirm("Add components anyway?", true))) process.exit(1);
   }
   // Resolve every PlankUI file the requested components build on.
+  // With Base UI, each component comes from base/ when it has a Base UI version, otherwise the shared file.
+  const lib = primitives();
   const queue = [...names.map((n) => n.toLowerCase())];
   const seen = new Map();
   while (queue.length) {
     const name = queue.shift();
     if (seen.has(name)) continue;
-    let item = await fetchJson(name);
+    let item = (lib === "base" ? await fetchJson(`base/${name}`) : null) ?? (await fetchJson(name));
     if (!item) fail(`No component called "${name}". Run ${green("npx plankui@latest list")} to see them all.`);
     const key = item.pro ? licenceKey() : null;
     if (key) item = (await fetchPro(name, key)) ?? item;
@@ -250,7 +284,7 @@ async function add() {
   }
   if (!free.length) process.exit(locked.length ? 1 : 0);
   const extra = free.filter((i) => !names.includes(i.name)).map((i) => i.name);
-  say(bold("PlankUI") + dim(` add ${free.map((i) => i.name).join(", ")}`) + (extra.length ? dim(` (needed by your picks: ${extra.join(", ")})`) : ""));
+  say(bold("PlankUI") + dim(` add ${free.map((i) => i.name).join(", ")}`) + (extra.length ? dim(` (needed by your picks: ${extra.join(", ")})`) : "") + (lib === "base" ? dim(", Base UI") : ""));
   for (const [state, file] of await writeFiles(base, free.flatMap((i) => i.files))) say(`${state} ${file}`);
   install(pm, free.flatMap((i) => i.dependencies), deps);
   say();
@@ -280,7 +314,7 @@ const help = () => {
   say(`${bold("plankui")} ${VERSION}: add PlankUI components to your React project.
 
 ${bold("Commands")}
-  init                 Write tokens.css, styles.css and the cn helper, install shared packages
+  init                 Choose Radix UI or Base UI, write tokens.css, styles.css and the cn helper
   add <names...>       Copy components and every PlankUI file they build on, install their packages
   list                 Show every component
   login <key>          Save your PlankUI Pro licence key (once per machine)
@@ -290,6 +324,7 @@ ${bold("Options")}
   --yes, -y            Answer every prompt with its default (keeps files that already exist)
   --overwrite          Replace files that already exist
   --no-install         Write files but skip installing npm packages
+  --base, --radix      Use Base UI or Radix UI primitives (init saves the choice in plankui.json)
   --cwd <dir>          Run in another folder
   --registry <url>     Read components from another registry`);
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "plankui",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "description": "Add accessible React components for Tailwind CSS v4 to your project. Six themes, five styles, and you own the code.",
   "type": "module",
   "bin": {
@@ -28,7 +28,8 @@
     "dark-mode",
     "themes",
     "copy-paste",
-    "plankui"
+    "plankui",
+    "base-ui"
   ],
   "homepage": "https://plankui.com/docs/installation",
   "license": "MIT",