CalvinBackup/gstack
1
0 Fork 0
mirror of https://github.com/garrytan/gstack.git synced 2026-11-01 22:45:02 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix(design-lint): the Tailwind gradient half of 2a/2b lives in the component family only

Browse Source 
Co-authored-by: capy-ai[bot] <230910855+capy-ai[bot]@users.noreply.github.com>
This commit is contained in:
garrytanandcapy-ai[bot] committed 2026-10-26 05:51:29 +00:00
1 parent dfd6693d51
commit aed2b149e6
2 files changed
+1 -34
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

lib/design-lint/rules/color.ts
-10
View File
@@ -12,7 +12,6 @@ import { mergedRules } from '../context';
import { firstFamily, GENERIC_FAMILIES, isTokenRule, pxOf, resolveVars, splitTop, type CssDecl, type MergedRule, type Tokens } from '../css';
import type { Reporter } from '../report';
import { trunc } from '../report';
import { twGroup } from '../tailwind';
const COLOR_FN = /#[0-9a-fA-F]{3,8}\b|oklch\([^)]*\)|rgba?\([^)]*\)|hsla?\([^)]*\)/g;
@@ -94,15 +93,6 @@ function check2(ctx: LintContext, r: Reporter): void {
if (banned) r.report('purple-blue-gradient', rule.file, d.line, `${banned} gradient on ${rule.selector}`, { fix: 'one anchor hue; drop the gradient' });
}
}
for (const it of twGroup(ctx).items) {
const { stops, gradientText } = it.info;
if (!stops.length || (!gradientText && stops.length < 2)) continue;
const hues = stops.map((s) => s.hue).filter((h): h is number => h != null);
const banned = bannedGradient(hues, ctx.twTokens ?? ctx.tokens);
const list = stops.map((s) => s.value).join(' ');
if (banned) r.report('purple-blue-gradient', it.file, it.line, `${banned} gradient${gradientText ? ' text' : ''} (${list}) on <${it.tag}>`);
else if (gradientText) r.report('gradient-text', it.file, it.line, `gradient text (${list}) on <${it.tag}>`);
}
}
// sloplint check7 (gates 7a, 7b)
test/design-lint-color.test.ts
+1 -24
View File
@@ -168,30 +168,7 @@ describe('design-lint colour: literal-outside-tokens (48, blocks)', () => {
});
});
describe('design-lint colour: Tailwind gradients through the parsed class strings', () => {
test('a purple-to-blue stop pair blocks, a one-hue gradient text asks, and no items means no findings', () => {
const dir = fs.mkdtempSync(path.join(os.tmpdir(), 'design-lint-color-tw-'));
fs.writeFileSync(path.join(dir, 'tokens.css'), TOKENS);
const ctx = buildContext(dir, [path.join(dir, 'tokens.css')], [], { cwd: dir });
const info = { classes: [], bg: null, text: null, sizePx: null, trackingEm: null, upper: false, smallCaps: false, mono: false, variants: new Set<string>() };
const items: TwItem[] = [
{ file: path.join(dir, 'Hero.tsx'), line: 4, idx: 2, tag: 'div', info: { ...info, gradientText: false, stops: [{ kind: 'palette', hue: 293, value: 'from-purple-500' }, { kind: 'palette', hue: 260, value: 'to-blue-500' }] } },
{ file: path.join(dir, 'Hero.tsx'), line: 9, idx: 5, tag: 'span', info: { ...info, gradientText: true, stops: [{ kind: 'palette', hue: 70, value: 'from-amber-400' }, { kind: 'palette', hue: 50, value: 'to-orange-600' }] } },
{ file: path.join(dir, 'Hero.tsx'), line: 12, idx: 7, tag: 'p', info: { ...info, gradientText: false, stops: [{ kind: 'palette', hue: 293, value: 'bg-purple-500' }] } },
];
ctx.cache.tw = { items, variants: new Set<string>() };
const r = new Reporter('component', dir);
runColor(ctx, r);
expect(r.findings.filter((f) => f.rule === 'purple-blue-gradient' || f.rule === 'gradient-text').map((f) => [f.rule, f.grade, f.line, f.evidence])).toEqual([
['purple-blue-gradient', 'blocks', 4, 'purple-to-blue gradient (from-purple-500 to-blue-500) on <div>'],
['gradient-text', 'ask', 9, 'gradient text (from-amber-400 to-orange-600) on <span>'],
]);
const empty = buildContext(dir, [path.join(dir, 'tokens.css')], [], { cwd: dir });
const r2 = new Reporter('component', dir);
runColor(empty, r2);
expect(r2.findings).toEqual([]);
});
});
// The Tailwind forms of 2a/2b are the component family's (rules/component.ts, test/design-lint-tailwind.test.ts).
describe('design-lint colour: fixtures', () => {
const MINE = new Set(['purple-blue-gradient', 'gradient-text', 'pure-black-white', 'absolute-surface-token', 'zero-chroma-neutrals', 'accent-footprint', 'glow-wash', 'cream-palette', 'framework-palette', 'literal-outside-tokens']);