tevra-design-kit 1.0.0 → 1.1.0
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 +19 -3
- package/THIRD_PARTY_NOTICES.md +1 -1
- package/dist/packages/performance-qa/src/index.d.ts +1 -0
- package/dist/packages/performance-qa/src/index.js +14 -3
- package/dist/packages/performance-qa/src/index.js.map +1 -1
- package/docs/security.md +7 -0
- package/docs/usage.md +1 -1
- package/package.json +13 -5
- package/registry/skills.json +12 -12
- package/skills/browser-testing/SKILL.md +1 -1
- package/skills/frontend-review/SKILL.md +1 -1
- package/skills/performance-qa/SKILL.md +1 -1
package/README.md
CHANGED
|
@@ -6,7 +6,7 @@ Tevra gives your coding agent twelve focused skills for researching, building, r
|
|
|
6
6
|
|
|
7
7
|
Works with **Claude Code, Codex, Cursor, Kiro, Gemini CLI, GitHub Copilot, OpenCode and Windsurf**.
|
|
8
8
|
|
|
9
|
-
[](https://github.com/tevra-si/design-kit/actions/workflows/ci.yml) ](https://github.com/tevra-si/design-kit/actions/workflows/ci.yml)   
|
|
10
10
|
|
|
11
11
|
|
|
12
12
|
|
|
@@ -73,7 +73,8 @@ Agents pick skills automatically from your request. Bigger requests chain severa
|
|
|
73
73
|
| Needed for | Requirement |
|
|
74
74
|
| --- | --- |
|
|
75
75
|
| CLI | Node `^22.22.2`, `^24.15.0` or `>=26`, and pnpm 11 |
|
|
76
|
-
| Screenshots, axe
|
|
76
|
+
| Screenshots, axe | A Chromium-based browser Playwright can launch |
|
|
77
|
+
| Lighthouse metrics (optional) | `lighthouse` installed next to Tevra, see [step 1](#b-cli-and-skills-for-any-agent) |
|
|
77
78
|
| Claude Code plugin | Claude Code with plugin support (`claude plugin --help` lists the commands) |
|
|
78
79
|
|
|
79
80
|
## Installation
|
|
@@ -95,6 +96,19 @@ Open a **new** session (skills load at startup) and type `/tevra` to see them. S
|
|
|
95
96
|
|
|
96
97
|
**1. Install the CLI**
|
|
97
98
|
|
|
99
|
+
From npm:
|
|
100
|
+
|
|
101
|
+
```sh
|
|
102
|
+
npx tevra-design-kit help # run without installing
|
|
103
|
+
npm install --global tevra-design-kit # or install the `tevra-design` command
|
|
104
|
+
npx playwright install chromium # browser for screenshots and axe
|
|
105
|
+
npm install --global lighthouse # optional, only for `test performance`
|
|
106
|
+
```
|
|
107
|
+
|
|
108
|
+
Lighthouse is optional so a default install stays small (about 12 packages). Install it next to Tevra, locally with `npm install --save-dev lighthouse` or globally as above.
|
|
109
|
+
|
|
110
|
+
Or from source (Lighthouse is included):
|
|
111
|
+
|
|
98
112
|
```sh
|
|
99
113
|
git clone https://github.com/tevra-si/design-kit.git
|
|
100
114
|
cd design-kit
|
|
@@ -210,7 +224,8 @@ Exit codes: `0` passed, `1` a check failed, `2` input or environment error. See
|
|
|
210
224
|
| | Update | Uninstall |
|
|
211
225
|
| --- | --- | --- |
|
|
212
226
|
| Plugin | `claude plugin marketplace update tevra` then `claude plugin update tevra@tevra` | `claude plugin uninstall tevra@tevra` and `claude plugin marketplace remove tevra` |
|
|
213
|
-
| CLI | `
|
|
227
|
+
| CLI from npm | `npm install --global tevra-design-kit@latest` | `npm uninstall --global tevra-design-kit` |
|
|
228
|
+
| CLI from source | `git pull && pnpm install && pnpm build` in your clone | `npm unlink -g tevra-design-kit` |
|
|
214
229
|
| Project skills | Move the old Tevra skill folders aside, then `tevra-design skills install --agents <agent>` | Delete the Tevra skill folders and, if unwanted, `.tevra/` |
|
|
215
230
|
|
|
216
231
|
## Troubleshooting
|
|
@@ -223,6 +238,7 @@ Exit codes: `0` passed, `1` a check failed, `2` input or environment error. See
|
|
|
223
238
|
| `Unknown agent` | Use one of `codex, claude, cursor, kiro, gemini, copilot, opencode, windsurf` |
|
|
224
239
|
| `doctor` fails or the browser cannot launch | Run `pnpm exec playwright install chromium` in the design-kit clone. Some sandboxes block browsers or local servers; Tevra reports the error instead of faking results |
|
|
225
240
|
| Screenshots show the sign-in page | The route needs a login; see [Configure a project](#configure-a-project) |
|
|
241
|
+
| `Lighthouse is not installed` | `test performance` needs the optional `lighthouse` package: `npm install --save-dev lighthouse` next to Tevra, or `npm install --global lighthouse` |
|
|
226
242
|
| Capture refuses a URL | Add its origin to `permittedOrigins` |
|
|
227
243
|
| `Mask matches no elements` | Every mask selector must exist on the page; fix or remove it |
|
|
228
244
|
| `Write lock unavailable` | Another Tevra command is running, or one crashed. Remove the stale `.tevra/*.lock` file |
|
package/THIRD_PARTY_NOTICES.md
CHANGED
|
@@ -14,7 +14,7 @@ Taste Skill (MIT, Copyright (c) 2026 Leonxlnx) and Web Quality Skills (MIT, Copy
|
|
|
14
14
|
| YAML | ISC |
|
|
15
15
|
| Playwright | Apache-2.0 (its NOTICE credits Microsoft Corporation and Puppeteer-derived code) |
|
|
16
16
|
| axe-core | MPL-2.0 |
|
|
17
|
-
| Lighthouse | Apache-2.0 |
|
|
17
|
+
| Lighthouse (optional peer dependency) | Apache-2.0 |
|
|
18
18
|
| pngjs | MIT |
|
|
19
19
|
| pixelmatch | ISC |
|
|
20
20
|
|
|
@@ -10,6 +10,7 @@ export interface PerformanceMetrics {
|
|
|
10
10
|
tbtMs: number;
|
|
11
11
|
}
|
|
12
12
|
export declare const defaultBudgets: PerformanceBudgets;
|
|
13
|
+
export declare function resolveLighthouseCli(from?: string): string;
|
|
13
14
|
export declare function extractMetrics(input: unknown): PerformanceMetrics;
|
|
14
15
|
export declare function performanceChecks(metrics: PerformanceMetrics, budgets: PerformanceBudgets, evidence: string): Check[];
|
|
15
16
|
export declare function auditPerformance(root: string, config: Config, revision: number, options: {
|
|
@@ -1,12 +1,23 @@
|
|
|
1
1
|
import { execFile } from 'node:child_process';
|
|
2
2
|
import { promisify } from 'node:util';
|
|
3
|
-
import {
|
|
4
|
-
import { dirname, resolve } from 'node:path';
|
|
3
|
+
import { createRequire } from 'node:module';
|
|
5
4
|
import { access, mkdir, readFile } from 'node:fs/promises';
|
|
6
5
|
import { randomUUID } from 'node:crypto';
|
|
7
6
|
import { chromium } from 'playwright';
|
|
8
7
|
import { redact, safePath, withLock, writeAtomic, writeJSON } from '../../filesystem/src/index.js';
|
|
9
8
|
export const defaultBudgets = { lcpMs: 2500, cls: 0.1, tbtMs: 200 };
|
|
9
|
+
const lighthouseMissing = 'Lighthouse is not installed. It is an optional dependency: run `npm install --save-dev lighthouse` next to tevra-design-kit (or `npm install --global lighthouse` for a global install) and retry';
|
|
10
|
+
// Resolved only from where Tevra is installed, never from the audited project's node_modules.
|
|
11
|
+
export function resolveLighthouseCli(from = import.meta.url) {
|
|
12
|
+
try {
|
|
13
|
+
return createRequire(from).resolve('lighthouse/cli/index.js');
|
|
14
|
+
}
|
|
15
|
+
catch (error) {
|
|
16
|
+
if (error instanceof Error && 'code' in error && error.code === 'MODULE_NOT_FOUND')
|
|
17
|
+
throw new Error(lighthouseMissing, { cause: error });
|
|
18
|
+
throw error;
|
|
19
|
+
}
|
|
20
|
+
}
|
|
10
21
|
function record(value) { return typeof value === 'object' && value !== null && !Array.isArray(value); }
|
|
11
22
|
export function extractMetrics(input) {
|
|
12
23
|
if (!record(input) || !record(input.audits))
|
|
@@ -36,6 +47,7 @@ export async function auditPerformance(root, config, revision, options) {
|
|
|
36
47
|
throw new Error('Lighthouse loads the target and its resources; review the application and pass --allow-network explicitly');
|
|
37
48
|
if (config.browser.executablePath && !options.allowCustomBrowser)
|
|
38
49
|
throw new Error('Custom browser requires --allow-custom-browser');
|
|
50
|
+
const cli = resolveLighthouseCli();
|
|
39
51
|
const budgets = options.budgets ?? defaultBudgets;
|
|
40
52
|
for (const value of Object.values(budgets))
|
|
41
53
|
if (!Number.isFinite(value) || value < 0)
|
|
@@ -54,7 +66,6 @@ export async function auditPerformance(root, config, revision, options) {
|
|
|
54
66
|
const html = `${directory}/lighthouse.report.html`;
|
|
55
67
|
await writeJSON(root, '.tevra/artifacts/performance/attempt.json', { status: 'running', id, contextRevision: revision });
|
|
56
68
|
try {
|
|
57
|
-
const cli = resolve(dirname(fileURLToPath(import.meta.resolve('lighthouse'))), '../cli/index.js');
|
|
58
69
|
await promisify(execFile)(process.execPath, [cli, target.href, '--only-categories=performance', '--output=json', '--output=html', `--output-path=${output}`, '--chrome-flags=--headless', '--quiet', '--enable-error-reporting=false'], {
|
|
59
70
|
cwd: root, env: { ...process.env, CHROME_PATH: executable }, timeout: 120000, maxBuffer: 1024 * 1024, windowsHide: true
|
|
60
71
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../packages/performance-qa/src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../packages/performance-qa/src/index.ts"],"names":[],"mappings":"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"}
|
package/docs/security.md
CHANGED
|
@@ -27,6 +27,13 @@ Tevra treats everything it reads as data, never as instructions: external refere
|
|
|
27
27
|
- Lighthouse may load every resource origin a page requests once `--allow-network` is given. Only audit apps whose third-party requests you have reviewed.
|
|
28
28
|
- Automated browser checks do not certify screen-reader behavior, native apps or full WCAG conformance.
|
|
29
29
|
|
|
30
|
+
## Dependencies
|
|
31
|
+
|
|
32
|
+
- The published package has six runtime dependencies (Ajv, axe-core, pixelmatch, Playwright, pngjs, YAML) plus Lighthouse as an optional peer dependency, which keeps a default install small and free of Lighthouse's large transitive tree.
|
|
33
|
+
- Versions are pinned exactly and `pnpm-lock.yaml` is committed, so builds are reproducible.
|
|
34
|
+
- CI runs `pnpm audit --prod` on every change (informational) and Dependabot opens weekly update pull requests.
|
|
35
|
+
- Lighthouse is only ever resolved from where Tevra itself is installed. Tevra never executes code from the `node_modules` of the project being audited.
|
|
36
|
+
|
|
30
37
|
## Before a release
|
|
31
38
|
|
|
32
39
|
```sh
|
package/docs/usage.md
CHANGED
|
@@ -82,7 +82,7 @@ Comparison fails when the configuration, screenshot set, browser version or cont
|
|
|
82
82
|
|
|
83
83
|
**Baselines are protected.** They are created only with `--approve-baseline` and never overwritten by `compare`. To replace one, archive the baseline folder yourself after review, then capture again.
|
|
84
84
|
|
|
85
|
-
**Performance** runs Lighthouse in a separate browser. `--allow-network` is required because the page may load third-party resources; review those origins first. Results are lab metrics (LCP, CLS, TBT) and do not represent real-user data such as INP.
|
|
85
|
+
**Performance** runs Lighthouse in a separate browser. Lighthouse is an optional dependency: install it next to Tevra first (`npm install --save-dev lighthouse`, or `npm install --global lighthouse`). It is already present in a source clone. `--allow-network` is required because the page may load third-party resources; review those origins first. Results are lab metrics (LCP, CLS, TBT) and do not represent real-user data such as INP.
|
|
86
86
|
|
|
87
87
|
## Adding your own evidence
|
|
88
88
|
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "tevra-design-kit",
|
|
3
|
-
"version": "1.
|
|
4
|
-
"description": "
|
|
3
|
+
"version": "1.1.0",
|
|
4
|
+
"description": "Design and frontend QA skills for coding agents, with a CLI for screenshots, pixel diffs, axe and Lighthouse evidence",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"author": "Tevra",
|
|
@@ -70,8 +70,7 @@
|
|
|
70
70
|
"pixelmatch": "8.0.0",
|
|
71
71
|
"playwright": "1.63.0",
|
|
72
72
|
"pngjs": "7.0.0",
|
|
73
|
-
"yaml": "2.
|
|
74
|
-
"lighthouse": "13.0.3"
|
|
73
|
+
"yaml": "2.9.1"
|
|
75
74
|
},
|
|
76
75
|
"devDependencies": {
|
|
77
76
|
"@types/node": "22.20.5",
|
|
@@ -79,7 +78,16 @@
|
|
|
79
78
|
"@types/jsdom": "^27.0.0",
|
|
80
79
|
"jsdom": "30.1.2",
|
|
81
80
|
"tsx": "4.23.15",
|
|
82
|
-
"typescript": "6.0.3"
|
|
81
|
+
"typescript": "6.0.3",
|
|
82
|
+
"lighthouse": "13.0.3"
|
|
83
|
+
},
|
|
84
|
+
"peerDependencies": {
|
|
85
|
+
"lighthouse": ">=13.0.0 <14"
|
|
86
|
+
},
|
|
87
|
+
"peerDependenciesMeta": {
|
|
88
|
+
"lighthouse": {
|
|
89
|
+
"optional": true
|
|
90
|
+
}
|
|
83
91
|
},
|
|
84
92
|
"publishConfig": {
|
|
85
93
|
"access": "public"
|
package/registry/skills.json
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
"id": "tevra.design-research",
|
|
6
6
|
"name": "design-research",
|
|
7
7
|
"description": "Research product intent, UX patterns, information architecture, typography and color candidates using project evidence and local searchable guidance before designing or redesigning an interface. Use when a UI brief, user need, product category or current-screen problem is unclear and needs evidence before design or redesign.",
|
|
8
|
-
"version": "1.
|
|
8
|
+
"version": "1.1.0",
|
|
9
9
|
"capabilities": [
|
|
10
10
|
"ux.research"
|
|
11
11
|
],
|
|
@@ -67,7 +67,7 @@
|
|
|
67
67
|
"id": "tevra.design-direction",
|
|
68
68
|
"name": "design-direction",
|
|
69
69
|
"description": "Choose and document a distinctive, implementable visual direction from a brief, research or screenshot while preserving the active project design system. Use before substantial new UI or a redesign, or when turning a screenshot or brief into a visual direction.",
|
|
70
|
-
"version": "1.
|
|
70
|
+
"version": "1.1.0",
|
|
71
71
|
"capabilities": [
|
|
72
72
|
"visual.direction"
|
|
73
73
|
],
|
|
@@ -129,7 +129,7 @@
|
|
|
129
129
|
"id": "tevra.design-system",
|
|
130
130
|
"name": "design-system",
|
|
131
131
|
"description": "Generate, extract or extend layered design tokens and documented component variants, reusing existing project systems and exporting portable CSS variables or Tailwind CSS adapters. Use when creating, extracting or extending tokens, themes, dark mode or component variants, or exporting them to CSS or Tailwind.",
|
|
132
|
-
"version": "1.
|
|
132
|
+
"version": "1.1.0",
|
|
133
133
|
"capabilities": [
|
|
134
134
|
"design.tokens"
|
|
135
135
|
],
|
|
@@ -191,7 +191,7 @@
|
|
|
191
191
|
"id": "tevra.ui-builder",
|
|
192
192
|
"name": "ui-builder",
|
|
193
193
|
"description": "Implement functional React, Next.js, SvelteKit, Vue or React Native/Expo interfaces using approved project components and tokens, including real state handling and accessible interactions. Use when building or changing a real screen, component, route or form against an approved direction or existing conventions.",
|
|
194
|
-
"version": "1.
|
|
194
|
+
"version": "1.1.0",
|
|
195
195
|
"capabilities": [
|
|
196
196
|
"frontend.implementation"
|
|
197
197
|
],
|
|
@@ -256,7 +256,7 @@
|
|
|
256
256
|
"id": "tevra.ui-redesign",
|
|
257
257
|
"name": "ui-redesign",
|
|
258
258
|
"description": "Audit and improve an existing component or screen while preserving behavior, product identity and scoped public contracts, with conservative, balanced or transformative modes. Use when asked to improve, restyle, polish or fix the look of an existing screen or component without breaking its behavior.",
|
|
259
|
-
"version": "1.
|
|
259
|
+
"version": "1.1.0",
|
|
260
260
|
"capabilities": [
|
|
261
261
|
"ui.redesign"
|
|
262
262
|
],
|
|
@@ -318,7 +318,7 @@
|
|
|
318
318
|
"id": "tevra.responsive-design",
|
|
319
319
|
"name": "responsive-design",
|
|
320
320
|
"description": "Fix and verify layouts across phone, tablet and desktop widths, including horizontal scrolling, overflow, breakpoints, container queries, wide tables, navigation on small screens and safe areas. Use whenever a page scrolls sideways, breaks or looks wrong on mobile or at a specific width, or when making a layout responsive.",
|
|
321
|
-
"version": "1.
|
|
321
|
+
"version": "1.1.0",
|
|
322
322
|
"capabilities": [
|
|
323
323
|
"responsive.design"
|
|
324
324
|
],
|
|
@@ -380,7 +380,7 @@
|
|
|
380
380
|
"id": "tevra.interaction-motion",
|
|
381
381
|
"name": "interaction-motion",
|
|
382
382
|
"description": "Design and implement purposeful hover, press, loading, transition, gesture and spring feedback with accessible reduced-motion alternatives and minimal dependencies. Use when adding or fixing hover/press feedback, loading or success transitions, animations, gestures or reduced-motion behavior.",
|
|
383
|
-
"version": "1.
|
|
383
|
+
"version": "1.1.0",
|
|
384
384
|
"capabilities": [
|
|
385
385
|
"interaction.motion"
|
|
386
386
|
],
|
|
@@ -442,7 +442,7 @@
|
|
|
442
442
|
"id": "tevra.visual-review",
|
|
443
443
|
"name": "visual-review",
|
|
444
444
|
"description": "Review real rendered web interfaces using Playwright screenshots, baseline/diff evidence, overflow checks and an evidence-based rubric, with bounded targeted refinement. Use after a rendered UI change, or when asked to compare screenshots, approve baselines or score visual quality.",
|
|
445
|
-
"version": "1.
|
|
445
|
+
"version": "1.1.0",
|
|
446
446
|
"capabilities": [
|
|
447
447
|
"visual.regression"
|
|
448
448
|
],
|
|
@@ -507,7 +507,7 @@
|
|
|
507
507
|
"id": "tevra.accessibility-qa",
|
|
508
508
|
"name": "accessibility-qa",
|
|
509
509
|
"description": "Review and test web UI accessibility against WCAG 2.2 AA, covering code or rendered pages, forms, dialogs, keyboard and focus, labels, error messages, contrast and reduced motion, with axe where a browser is available. Use whenever someone asks whether a component, form or page is accessible or ready to ship, mentions a11y, WCAG, screen readers, keyboard navigation, focus, labels or color contrast, including when reviewing a code snippet.",
|
|
510
|
-
"version": "1.
|
|
510
|
+
"version": "1.1.0",
|
|
511
511
|
"capabilities": [
|
|
512
512
|
"accessibility"
|
|
513
513
|
],
|
|
@@ -569,7 +569,7 @@
|
|
|
569
569
|
"id": "tevra.performance-qa",
|
|
570
570
|
"name": "performance-qa",
|
|
571
571
|
"description": "Measure loading and rendering performance when asked to audit speed, Core Web Vitals, or a performance regression. Use when a page feels slow or when asked about Lighthouse, LCP, CLS, TBT or a performance regression.",
|
|
572
|
-
"version": "1.
|
|
572
|
+
"version": "1.1.0",
|
|
573
573
|
"capabilities": [
|
|
574
574
|
"performance"
|
|
575
575
|
],
|
|
@@ -634,7 +634,7 @@
|
|
|
634
634
|
"id": "tevra.browser-testing",
|
|
635
635
|
"name": "browser-testing",
|
|
636
636
|
"description": "Test real frontend user interactions, keyboard flows, forms, dialogs or regressions with Playwright. Use when asked for e2e or browser tests, or to verify a UI flow actually works in a real browser.",
|
|
637
|
-
"version": "1.
|
|
637
|
+
"version": "1.1.0",
|
|
638
638
|
"capabilities": [
|
|
639
639
|
"browser.testing"
|
|
640
640
|
],
|
|
@@ -699,7 +699,7 @@
|
|
|
699
699
|
"id": "tevra.frontend-review",
|
|
700
700
|
"name": "frontend-review",
|
|
701
701
|
"description": "Review frontend source for framework correctness, component composition, state ownership, type safety, security or maintainability. Use when asked to review frontend code or a frontend diff before merge.",
|
|
702
|
-
"version": "1.
|
|
702
|
+
"version": "1.1.0",
|
|
703
703
|
"capabilities": [
|
|
704
704
|
"frontend.review",
|
|
705
705
|
"component.architecture"
|
|
@@ -3,7 +3,7 @@ name: browser-testing
|
|
|
3
3
|
description: Test real frontend user interactions, keyboard flows, forms, dialogs or regressions with Playwright. Use when asked for e2e or browser tests, or to verify a UI flow actually works in a real browser.
|
|
4
4
|
license: MIT
|
|
5
5
|
metadata:
|
|
6
|
-
version: "1.
|
|
6
|
+
version: "1.1.0"
|
|
7
7
|
---
|
|
8
8
|
# Browser Testing
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@ name: frontend-review
|
|
|
3
3
|
description: Review frontend source for framework correctness, component composition, state ownership, type safety, security or maintainability. Use when asked to review frontend code or a frontend diff before merge.
|
|
4
4
|
license: MIT
|
|
5
5
|
metadata:
|
|
6
|
-
version: "1.
|
|
6
|
+
version: "1.1.0"
|
|
7
7
|
---
|
|
8
8
|
# Frontend Review
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@ name: performance-qa
|
|
|
3
3
|
description: Measure loading and rendering performance when asked to audit speed, Core Web Vitals, or a performance regression. Use when a page feels slow or when asked about Lighthouse, LCP, CLS, TBT or a performance regression.
|
|
4
4
|
license: MIT
|
|
5
5
|
metadata:
|
|
6
|
-
version: "1.
|
|
6
|
+
version: "1.1.0"
|
|
7
7
|
---
|
|
8
8
|
# Performance QA
|
|
9
9
|
|