mirror of
https://github.com/kuhyx/utils.git
synced 2026-11-10 20:07:18 +01:00
Krzysztof kuhy Rudnicki
2574b21acc
awesome-mcp-explorer needs six mutually distinguishable colours for its A-F
grades, and the design system had no answer -- one accent, and semantic roles
that deliberately cluster in one hue wedge. Raised as its own decision (per
PHASE3-PROMPT) and resolved by designing the ramp rather than mapping grades
onto success/warning/danger, which would have collapsed six steps into three.
Chosen by search, not by eye, under four hard constraints:
- pairwise CIE dE >= 20 under normal vision AND deuteranopia, protanopia and
tritanopia (worst observed 26.0)
- >= 3:1 against BOTH backgrounds, since the ramp does not re-theme. This is
the binding constraint: such colours only exist in L* 44-59.
- monotonic lightness 58 -> 44, so hue and lightness encode redundantly and
the ramp survives greyscale as an ordinal scale
- muted saturation, to sit with the rest of the palette
scripts/ramp_check.py re-runs the whole proof and exits non-zero on a
regression, so this is a gate rather than a paragraph. A seventh hue is not
available (best candidate reaches dE 17.9); group the tail into "other".
This ramp is the only token group that leaves the warm wedge, deliberately:
hue separation is the entire point of a categorical scale.
Also: tokens.test.ts guards every frozen value against drift, and
tokens.md was split (screen-size.md) to hold the 250-line cap.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01U4Rj3s7K2qzrLNgJqqPhno
52 lines
1.4 KiB
JSON
52 lines
1.4 KiB
JSON
{
|
|
"name": "@kuhyx/web-ui",
|
|
"version": "0.2.0",
|
|
"private": false,
|
|
"type": "module",
|
|
"description": "The shared token + component layer for kuhy's web apps: the frozen palette, spacing/radius/type scales as CSS custom properties, and the components that were each reimplemented in two or more repos.",
|
|
"license": "MIT",
|
|
"engines": {
|
|
"node": ">=24",
|
|
"pnpm": ">=10"
|
|
},
|
|
"packageManager": "pnpm@10.13.1",
|
|
"files": [
|
|
"dist"
|
|
],
|
|
"main": "./dist/index.js",
|
|
"types": "./dist/index.d.ts",
|
|
"exports": {
|
|
".": {
|
|
"types": "./dist/index.d.ts",
|
|
"default": "./dist/index.js"
|
|
},
|
|
"./tokens.css": "./dist/tokens.css",
|
|
"./range-slider.css": "./dist/range-slider.css"
|
|
},
|
|
"scripts": {
|
|
"build": "tsc -b && cp src/tokens.css src/range-slider.css dist/",
|
|
"lint": "tsc --noEmit && eslint src",
|
|
"test": "vitest run",
|
|
"coverage": "vitest run --coverage"
|
|
},
|
|
"peerDependencies": {
|
|
"react": ">=19"
|
|
},
|
|
"devDependencies": {
|
|
"@eslint/js": "^10.0.1",
|
|
"@testing-library/jest-dom": "^6.9.1",
|
|
"@testing-library/react": "^16.3.2",
|
|
"@testing-library/user-event": "^14.6.1",
|
|
"@types/react": "^19.2.17",
|
|
"@types/react-dom": "^19.2.3",
|
|
"@vitest/coverage-v8": "^4.1.10",
|
|
"eslint": "^10.7.0",
|
|
"jsdom": "^29.1.1",
|
|
"react": "^19.2.7",
|
|
"react-dom": "^19.2.7",
|
|
"typescript": "^6.0.3",
|
|
"typescript-eslint": "^8.64.0",
|
|
"vitest": "^4.1.10"
|
|
}
|
|
}
|