@wheelhouse/tokens 0.1.0 → 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/README.md +29 -0
  2. package/llms.txt +32 -0
  3. package/package.json +6 -2
  4. package/src/tokens.css +4 -4
package/README.md ADDED
@@ -0,0 +1,29 @@
1
+ # @wheelhouse/tokens
2
+
3
+ CSS custom properties for light and dark themes (`:root`, `.dark`), shared across Wheelhouse UI and apps.
4
+
5
+ ## Install
6
+
7
+ ```bash
8
+ npm install @wheelhouse/tokens
9
+ ```
10
+
11
+ ## Use
12
+
13
+ Import the stylesheet from your CSS entry (for example `globals.css`):
14
+
15
+ ```css
16
+ @import '@wheelhouse/tokens';
17
+ ```
18
+
19
+ This loads the token definitions only. Wire that entry into Tailwind or your bundler so the variables apply where you need them.
20
+
21
+ The package exposes a single CSS entry (`package.json` → `exports["."]`); there is no JavaScript API.
22
+
23
+ ## Relationship to `@wheelhouse/ui`
24
+
25
+ `@wheelhouse/ui` depends on this package and pulls in tokens when you install UI. Add `@wheelhouse/tokens` yourself only when you want tokens without the component library.
26
+
27
+ ## Monorepo
28
+
29
+ Storybook, the shadcn CLI, workspace commands, and publishing are documented in the [repository's root README](https://github.com/pricemethod/builder_platform/blob/main/README.md).
package/llms.txt ADDED
@@ -0,0 +1,32 @@
1
+ # @wheelhouse/tokens — context for AI agents
2
+
3
+ ## Purpose
4
+ This package is the single source of design tokens for the Wheelhouse monorepo: CSS custom properties for semantic colors, radius, and related UI primitives. It has **no JavaScript/TypeScript API** — only a CSS entry point.
5
+
6
+ ## Entry point
7
+ - `package.json` exports `"."` → `./src/tokens.css`
8
+ - Consumers import the stylesheet: `@import '@wheelhouse/tokens';` (or equivalent in their CSS pipeline)
9
+
10
+ ## Source layout
11
+ - `src/tokens.css` — all token definitions. Edit this file to change tokens.
12
+
13
+ ## Theme model
14
+ - **Light (default):** variables on `:root`
15
+ - **Dark:** `.dark` selector overrides the same variable names
16
+ - **Optional accent:** `.accent-fuchsia` on `<html>` (or a parent) overrides primary/ring/sidebar-primary tokens for a fuchsia accent; `.dark.accent-fuchsia` supplies dark-mode values for that accent
17
+
18
+ ## Naming
19
+ - Semantic names: `--background`, `--foreground`, `--primary`, `--primary-foreground`, `--muted`, `--border`, `--ring`, `--radius`, `--destructive`, `--sidebar-*`, `--chart-*`, etc.
20
+ - Some tokens reference Tailwind palette aliases (e.g. `--color-rose-700`) — those must exist when the stylesheet is applied (typically from Tailwind/theme setup in the app).
21
+
22
+ ## Relationship to `@wheelhouse/ui`
23
+ - UI components expect these tokens to be present (e.g. `bg-background`, `text-foreground`, `ring-ring` map to these variables via Tailwind).
24
+ - Installing `@wheelhouse/ui` pulls tokens transitively; install `@wheelhouse/tokens` directly only for apps that need tokens without the component library.
25
+
26
+ ## Agent guidance
27
+ - **Do:** add or adjust tokens in `src/tokens.css`; keep light/dark pairs in sync; document new semantic names in README if they are part of the public contract.
28
+ - **Do not:** add a JS/TS entry or `exports` for a non-CSS module unless the package scope explicitly changes — this package is CSS-only by design.
29
+ - **Build:** `npm run build` in this package is a no-op placeholder; publishing is `files: ["src", "llms.txt"]` per `package.json`.
30
+
31
+ ## Monorepo
32
+ - Repo root: `README.md` for workspace scripts, Storybook, CI, and publishing.
package/package.json CHANGED
@@ -1,15 +1,19 @@
1
1
  {
2
2
  "name": "@wheelhouse/tokens",
3
- "version": "0.1.0",
3
+ "version": "0.1.2",
4
4
  "private": false,
5
5
  "license": "MIT",
6
6
  "exports": {
7
7
  ".": "./src/tokens.css"
8
8
  },
9
9
  "files": [
10
- "src"
10
+ "src",
11
+ "llms.txt"
11
12
  ],
12
13
  "publishConfig": {
13
14
  "access": "public"
15
+ },
16
+ "scripts": {
17
+ "build": "node -e \"process.exit(0)\""
14
18
  }
15
19
  }
package/src/tokens.css CHANGED
@@ -13,7 +13,7 @@
13
13
  --muted-foreground: oklch(0.556 0 0);
14
14
  --accent: oklch(0.97 0 0);
15
15
  --accent-foreground: oklch(0.205 0 0);
16
- --destructive: oklch(0.577 0.245 27.325);
16
+ --destructive: oklch(0.941 0.03 17.5);
17
17
  --border: oklch(0.922 0 0);
18
18
  --input: oklch(0.922 0 0);
19
19
  --ring: oklch(0.708 0 0);
@@ -31,7 +31,7 @@
31
31
  --sidebar-accent-foreground: oklch(0.205 0 0);
32
32
  --sidebar-border: oklch(0.922 0 0);
33
33
  --sidebar-ring: oklch(0.708 0 0);
34
- --destructive-foreground: var(--color-red-600);
34
+ --destructive-foreground: var(--color-rose-700);
35
35
  --success: var(--color-emerald-500);
36
36
  --success-foreground: var(--color-emerald-700);
37
37
  --info: var(--color-sky-500);
@@ -76,7 +76,7 @@
76
76
  --muted-foreground: oklch(0.708 0 0);
77
77
  --accent: oklch(0.269 0 0);
78
78
  --accent-foreground: oklch(0.985 0 0);
79
- --destructive: oklch(0.704 0.191 22.216);
79
+ --destructive: oklch(0.271 0.105 6.1);
80
80
  --border: oklch(1 0 0 / 10%);
81
81
  --input: oklch(1 0 0 / 15%);
82
82
  --ring: oklch(0.556 0 0);
@@ -93,7 +93,7 @@
93
93
  --sidebar-accent-foreground: oklch(0.985 0 0);
94
94
  --sidebar-border: oklch(1 0 0 / 10%);
95
95
  --sidebar-ring: oklch(0.556 0 0);
96
- --destructive-foreground: var(--color-red-400);
96
+ --destructive-foreground: var(--color-rose-300);
97
97
  --success: var(--color-emerald-500);
98
98
  --success-foreground: var(--color-emerald-600);
99
99
  --info: var(--color-sky-500);