Repo tools 1.2.0

Das VelinStyle-GitHub-Repository liefert zwei statische HTML-Tools zum Experimentieren mit Tokens und Komponenten. Sie werden nicht als npm-Pakete veröffentlicht - klone das Repo und öffne die Dateien im Browser (oder über einen statischen Server). English: Repo-Tools

Reifegrad: Theme Builder and Playground are exploration tools in the GitHub repo — not Studio and not a finished AI design system. Release sync / e2e helpers are stable maintainer tooling.

Wann verwenden

Experimentiere mit Tokens oder HTML-Snippets aus einem Framework-Clone.
Führe Release-Sync- und E2E-Prüfungen vor dem Veröffentlichen aus.

Wann nicht

Verwechsele Theme Builder / Playground nicht mit einem geplanten Studio-Produkt.
Do not publish these tools as npm packages — use the CLI for production workflows.

Theme Builder

OKLCH-based token editing and CSS export, located at tools/theme-builder/ in the repository.

Local: from a clone, open tools/theme-builder/index.html (double-click or npx serve at repo root).
Source on GitHub: github.com/SkyliteDesign/velinstyle/tree/main/tools/theme-builder

Playground

Split-view HTML/CSS playground with theme switch and snippet picker — tools/playground/.

Local: open tools/playground/index.html after cloning.
Source on GitHub: github.com/SkyliteDesign/velinstyle/tree/main/tools/playground

End-to-End-Tests (Playwright)

Befehl	Beschreibung
`npm run test:e2e`	Cross-browser WC smoke (Chromium, Firefox, WebKit)
`npm run test:e2e:chromium`	Chromium only (faster local check)
`npm run test:a11y:coverage`	Komponente contract coverage (40/40)

Requires npm run build first. Framework path: tests/e2e/.

Release-Sync-Guard

Version numbers live in several machine-readable places across the framework and this site: the CLI manifest, the a11y contracts, velin-agent.json, doc header badges, the landing-page version badges, page-level velin-meta blocks, JSON-LD softwareVersion, and every pinned npm/CDN install snippet. The guard compares them all against package.json in the framework, which is the single source of truth.

It also checks the component counts quoted in prose — “40 canonical Web Components”, “40 lazy-loader entries”, “38/38 contracts” and their German equivalents — against components.count and components.loaderCount in velin-agent.json. Adding a Web Component therefore cannot leave the docs claiming the previous number.

Befehl	Beschreibung
`npm run release:check`	Report drift (framework repo); exits non-zero on mismatch
`npm run release:sync`	Rewrite the mechanical surfaces to the current version
`npm run sync:check`	Same report from the site repo (runs at the end of `npm run build`)

The guard only matches structured patterns, so prose that names an older release — changelog entries, migration notes, “new in 0.9.0” hints — is left alone. Checks that need a human or a build step (a missing changelog section, a hardcoded CLI banner, stale docs/generated/, an unbuilt agent bundle) are reported but never auto-fixed. Site checks are skipped automatically when the sibling velinstyle-site checkout is absent, which is why framework CI can run the same command.

Flags: --json for machine output, --warn-only to report without failing, --skip-site for framework-only runs, --fix to write.

Bezug zur CLI

For production workflows (custom bundles, icons, blueprints, scan, tokens build), use the VelinStyle CLI from npm. The repo tools above are for design exploration only.

In the framework repo, run npm run test:a11y and npm run test:contrast before releases (0.7.0+).