@nesso-how/theme 0.1.0-alpha.33 → 0.1.0-alpha.34
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.
- package/README.md +2 -2
- package/dist/css.d.ts +1 -1
- package/dist/css.js +1 -1
- package/dist/types.d.ts +2 -2
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -6,7 +6,7 @@ Tokens are plain TypeScript objects. Each consumer turns them into CSS variables
|
|
|
6
6
|
|
|
7
7
|
## What lives here, and what doesn't
|
|
8
8
|
|
|
9
|
-
Category colours (the `--cat-*` variables for edge types) belong to the
|
|
9
|
+
Category colours (the `--cat-*` variables for edge types) belong to the graph vocabulary, so they stay in `@nesso-how/vocab-learning`, not here. A theme pack only names the palette it pairs with (`categoryPalette`); the palette switch and the theme switch stay independent.
|
|
10
10
|
|
|
11
11
|
A token belongs in this package when it both varies by theme or mode and is shared across the app, the graph and the docs. That covers surface and ink colours, accent, shadows, fonts, and the type, spacing and radii scales. It leaves out anything structural rather than visual: z-index, breakpoints and app layout sizes (status bar height, sidebar width) live in the app, and motion is a foundation constant unless a pack needs to tune it.
|
|
12
12
|
|
|
@@ -33,7 +33,7 @@ baseVars(defaultTheme) // { '--font-sans': "...", '--space-6': '12px', ... }
|
|
|
33
33
|
modeVars(defaultTheme, 'dark') // { '--paper': '#1a1714', '--accent': '#c47a82', ... }
|
|
34
34
|
```
|
|
35
35
|
|
|
36
|
-
The app injects `themeCss(defaultTheme)` into the page head at build time, through the `nessoTheme()` Vite plugin in `vite.config.ts`, so the variables exist before the first paint. Category colours are applied separately, from the
|
|
36
|
+
The app injects `themeCss(defaultTheme)` into the page head at build time, through the `nessoTheme()` Vite plugin in `vite.config.ts`, so the variables exist before the first paint. Category colours are applied separately, from the `@nesso-how/vocab-learning` palette. The docs site does the same through `docs/scripts/gen-theme-css.mjs`, which also produces a Starlight version with `starlightCss`.
|
|
37
37
|
|
|
38
38
|
## Changing the default theme
|
|
39
39
|
|
package/dist/css.d.ts
CHANGED
|
@@ -9,7 +9,7 @@ export declare function declarations(vars: Record<string, string>, indent?: stri
|
|
|
9
9
|
/**
|
|
10
10
|
* Full stylesheet for a pack: mode-invariant tokens + light tokens under
|
|
11
11
|
* `:root`, dark tokens under `[data-theme='dark']`. Category colours are NOT
|
|
12
|
-
* emitted here — they come from `@nesso-how/
|
|
12
|
+
* emitted here — they come from `@nesso-how/vocab-learning` `PALETTES`, applied
|
|
13
13
|
* separately so the palette switch stays orthogonal.
|
|
14
14
|
*/
|
|
15
15
|
export declare function themeCss(pack: ThemePack): string;
|
package/dist/css.js
CHANGED
|
@@ -80,7 +80,7 @@ export function declarations(vars, indent = ' ') {
|
|
|
80
80
|
/**
|
|
81
81
|
* Full stylesheet for a pack: mode-invariant tokens + light tokens under
|
|
82
82
|
* `:root`, dark tokens under `[data-theme='dark']`. Category colours are NOT
|
|
83
|
-
* emitted here — they come from `@nesso-how/
|
|
83
|
+
* emitted here — they come from `@nesso-how/vocab-learning` `PALETTES`, applied
|
|
84
84
|
* separately so the palette switch stays orthogonal.
|
|
85
85
|
*/
|
|
86
86
|
export function themeCss(pack) {
|
package/dist/types.d.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import type { CategoryPalette } from '@nesso-how/
|
|
1
|
+
import type { CategoryPalette } from '@nesso-how/vocab-learning';
|
|
2
2
|
/**
|
|
3
3
|
* Tokens that change between light and dark mode. A theme pack ships a full
|
|
4
4
|
* `light` set and a `dark` *diff* (see {@link ThemePack.dark}). Category colours
|
|
5
5
|
* are intentionally absent: they belong to the relation-type vocabulary
|
|
6
|
-
* (`@nesso-how/
|
|
6
|
+
* (`@nesso-how/vocab-learning` `PALETTES`) and are referenced by name via
|
|
7
7
|
* {@link ThemePack.categoryPalette}, never duplicated here.
|
|
8
8
|
*/
|
|
9
9
|
export interface ColorTokens {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nesso-how/theme",
|
|
3
|
-
"version": "0.1.0-alpha.
|
|
3
|
+
"version": "0.1.0-alpha.34",
|
|
4
4
|
"description": "Nesso design tokens — the single source of truth for theme packs (colour, typography, spacing, radii) shared across app, graph and docs",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
}
|
|
23
23
|
},
|
|
24
24
|
"dependencies": {
|
|
25
|
-
"@nesso-how/
|
|
25
|
+
"@nesso-how/vocab-learning": "0.1.0-alpha.34"
|
|
26
26
|
},
|
|
27
27
|
"devDependencies": {
|
|
28
28
|
"typescript": "~5.8.3"
|