mirror of
https://github.com/Manavarya09/design-extract.git
synced 2026-09-19 02:41:14 +08:00
Manavarya09
48b92c794b
Reliability fixes that restore trust on real sites: - colors.js: brand-color detection rewritten — ranks chromatic clusters by interactiveBg x100 + saturation x2 + log(usage), requires HSL sat >25 or an interactive-bg hit. Linear primary: #d0d6e0 (gray) -> #e4f222 (lime). Stripe: #533afd. Verified on 5 ground-truth sites. - accessibility.js + crawler.js: crawler now emits hasText per element (direct text-node child with visible chars); WCAG extractor filters decorative glyph spans, transparent overlays, non-text containers. Linear: 25% (171 failing pairs) -> 83% (1 failing pair). - scoring.js: rubric recalibrated against Stripe/Linear/Vercel/GitHub/Apple. Loosened color/shadow/radii/type-scale thresholds; softened spacing no-base penalty when tokenization is present; cssHealth now weighted in the overall. Linear 47->76, Stripe 81->88, Apple 83->86. New CLI flags: - --selector <css>: scope extraction to a DOM subtree. Stripe: 2409 -> 112 elements when scoped to footer. Falls back to full doc if invalid. - --system-chrome: channel: 'chrome' in Playwright launch; skips the bundled Chromium download. - --json: full extraction to stdout (already partial in v7, now first-class and documented). New distribution surfaces (each publishes to its own registry): - vscode-extension/: Extract-from-URL + inject-into-workspace commands. - raycast-extension/: Extract, Score, Copy-CLI commands. - figma-plugin/: URL or paste-JSON -> Figma Variables with multi-mode. - github-action/: "Design regression guard" runs designlang on PRs, diffs tokens vs baseline, comments the delta, optional fail-on-change. - smithery.yaml + smithery.dockerfile + docs/MCP-REGISTRY.md: MCP registry submission checklist. - chrome-extension/PRIVACY.md + STORE_LISTING.md: Chrome/Firefox/Edge store listing prep (extension code already existed in v7.1). - docs/LAUNCH.md: PH + Show HN + Twitter copy + day-of checklist. - docs/demo.tape: VHS tape for the animated README hero. README updated: hero references demo.gif with PNG fallback, adds "Install everywhere" table for the new surfaces, documents the three new flags. .npmignore excludes every companion-surface directory so the npm tarball stays 109KB / 73 files. All 275 tests pass.
93 lines
3.1 KiB
YAML
93 lines
3.1 KiB
YAML
name: "designlang — Design Regression Guard"
|
|
description: "Diff a site's design tokens against a baseline and comment the delta on the pull request."
|
|
author: "masyv"
|
|
branding:
|
|
icon: "layers"
|
|
color: "orange"
|
|
|
|
inputs:
|
|
url:
|
|
description: "URL to extract design from (required)."
|
|
required: true
|
|
baseline:
|
|
description: "Path to the baseline *-design-tokens.json file in your repo."
|
|
required: true
|
|
comment:
|
|
description: "Whether to post a PR comment with the diff (true/false)."
|
|
default: "true"
|
|
fail-on-change:
|
|
description: "Fail the job if any token changed."
|
|
default: "false"
|
|
full:
|
|
description: "Pass --full to designlang (screenshots, responsive, interactions)."
|
|
default: "false"
|
|
extra-args:
|
|
description: "Additional CLI args passed to `designlang`."
|
|
default: ""
|
|
github-token:
|
|
description: "Token used to comment on the PR. Defaults to github.token."
|
|
default: ${{ github.token }}
|
|
|
|
outputs:
|
|
changed:
|
|
description: "true/false — whether any tokens changed since the baseline."
|
|
changed-count:
|
|
description: "Number of changed tokens."
|
|
diff-path:
|
|
description: "Path to the generated diff markdown."
|
|
|
|
runs:
|
|
using: "composite"
|
|
steps:
|
|
- name: Install designlang
|
|
shell: bash
|
|
run: npm install -g designlang
|
|
|
|
- name: Extract tokens
|
|
shell: bash
|
|
env:
|
|
URL: ${{ inputs.url }}
|
|
FULL: ${{ inputs.full }}
|
|
EXTRA: ${{ inputs.extra-args }}
|
|
run: |
|
|
mkdir -p .designlang-run
|
|
ARGS="--out .designlang-run"
|
|
if [ "$FULL" = "true" ]; then ARGS="$ARGS --full"; fi
|
|
if [ -n "$EXTRA" ]; then ARGS="$ARGS $EXTRA"; fi
|
|
designlang "$URL" $ARGS
|
|
|
|
- name: Diff tokens against baseline
|
|
id: diff
|
|
shell: bash
|
|
env:
|
|
BASELINE: ${{ inputs.baseline }}
|
|
run: |
|
|
NEW=$(ls .designlang-run/*-design-tokens.json | head -n 1)
|
|
node "${{ github.action_path }}/diff-tokens.cjs" "$BASELINE" "$NEW" > .designlang-run/diff.md || true
|
|
CHANGED=$(grep -c '^- ' .designlang-run/diff.md || echo 0)
|
|
echo "changed=$([ "$CHANGED" -gt 0 ] && echo true || echo false)" >> "$GITHUB_OUTPUT"
|
|
echo "changed-count=$CHANGED" >> "$GITHUB_OUTPUT"
|
|
echo "diff-path=.designlang-run/diff.md" >> "$GITHUB_OUTPUT"
|
|
|
|
- name: Comment on PR
|
|
if: ${{ inputs.comment == 'true' && github.event_name == 'pull_request' }}
|
|
uses: actions/github-script@v7
|
|
with:
|
|
github-token: ${{ inputs.github-token }}
|
|
script: |
|
|
const fs = require('fs');
|
|
const body = fs.readFileSync('.designlang-run/diff.md', 'utf8');
|
|
await github.rest.issues.createComment({
|
|
issue_number: context.issue.number,
|
|
owner: context.repo.owner,
|
|
repo: context.repo.repo,
|
|
body: `### designlang — design regression guard\n\n${body}`,
|
|
});
|
|
|
|
- name: Fail on change
|
|
if: ${{ inputs.fail-on-change == 'true' && steps.diff.outputs.changed == 'true' }}
|
|
shell: bash
|
|
run: |
|
|
echo "::error::Design tokens changed vs baseline."
|
|
exit 1
|