Ku6epXBOCTuK/easy-png-tools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: update css vars lint rules and fix them

Browse Source
This commit is contained in:
Ku6epXBOCTuK
2026-09-08 07:18:57 +05:00
parent 2d24f51fd5
commit e3d50f2128
25 changed files with 69 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/eslint-plugins/design-tokens/lists.js
+2 -2
View File
@@ -6,14 +6,14 @@
// Properties that accept a COLOR.
// =====================================================================
export const COLOR_PROPS =
/^(color|background|background-color|border|border-color|border-top|border-right|border-bottom|border-left|outline|outline-color|box-shadow|text-shadow|fill|stroke|fill-color|stroke-color|stop-color|flood-color|lighting-color|column-rule|column-rule-color|text-decoration|text-decoration-color|caret-color|accent-color|border-top-color|border-right-color|border-bottom-color|border-left-color)$/;
/^(color|background|background-color|background-image|border|border-color|border-top|border-right|border-bottom|border-left|outline|outline-color|box-shadow|text-shadow|fill|stroke|fill-color|stroke-color|stop-color|flood-color|lighting-color|column-rule|column-rule-color|text-decoration|text-decoration-color|caret-color|accent-color|border-top-color|border-right-color|border-bottom-color|border-left-color)$/;
// =====================================================================
// Properties that accept a SIZE (px/rem/em).
// z-index is handled separately (it's an integer, not a length).
// =====================================================================
export const SIZE_PROPS =
/^(width|height|min-width|max-width|min-height|max-height|padding|padding-top|padding-right|padding-bottom|padding-left|margin|margin-top|margin-right|margin-bottom|margin-left|gap|column-gap|row-gap|top|right|bottom|left|inset|font-size|letter-spacing|word-spacing|line-height|border-radius|border-top-left-radius|border-top-right-radius|border-bottom-left-radius|border-bottom-right-radius|border-width|border-top-width|border-right-width|border-bottom-width|border-left-width|flex-basis|background-size|border-spacing)$/;
/^(width|height|min-width|max-width|min-height|max-height|padding|padding-top|padding-right|padding-bottom|padding-left|margin|margin-top|margin-right|margin-bottom|margin-left|gap|column-gap|row-gap|top|right|bottom|left|inset|font|font-size|letter-spacing|word-spacing|line-height|border-radius|border-top-left-radius|border-top-right-radius|border-bottom-left-radius|border-bottom-right-radius|border-width|border-top-width|border-right-width|border-bottom-width|border-left-width|flex-basis|background-size|background-position|border-spacing|grid-template-columns|grid-template-rows)$/;
// =====================================================================
// SHORTHAND properties that accept BOTH a color and a size. The browser
web/eslint-plugins/design-tokens/no-hardcoded-in-svelte.js
+16 -11
View File
@@ -9,6 +9,7 @@ import {
DURATION_PROPS,
FORBIDDEN_DURATION_TOKEN,
FORBIDDEN_SIZE_TOKEN,
MIXED_PROPS,
SIZE_PROPS,
} from "./lists.js";
import { getStyleNodeLoc, getStyleRoot } from "./style-context.js";
@@ -125,13 +126,16 @@ export default {
// Sub-rule 2: sizes.
// Fire only on a real remaining px/rem/em token — percentages
// (width: 80%) and unitless values (line-height: 1.5) stay legal.
// Only legal absolute length is a single 1px border line.
if (SIZE_PROPS.test(prop)) {
// The only legal absolute length is a 0px reset line.
// MIXED_PROPS (border/outline shorthands) are checked for their
// SIZE half too — a border width must come from var(--size-*).
if (SIZE_PROPS.test(prop) || MIXED_PROPS.test(prop)) {
const withoutVars = stripVars(value);
const match = withoutVars.match(FORBIDDEN_SIZE_TOKEN);
if (match) {
const reported = new Set();
for (const match of withoutVars.matchAll(FORBIDDEN_SIZE_TOKEN)) {
const shown = match[0];
if (shown !== "1px" && shown !== "0px") {
if (shown !== "0px" && !reported.has(shown)) {
reported.add(shown);
report(decl, "hardcodedSize", { prop, value: shown });
}
}
@@ -150,12 +154,13 @@ export default {
)
.trim();
if (withoutKeywords !== "" && withoutKeywords !== "0") {
const match = value.match(COLOR_LITERAL);
if (match) {
report(decl, "hardcodedColor", {
prop,
value: match[0].trim(),
});
const reported = new Set();
for (const match of value.matchAll(COLOR_LITERAL)) {
const shown = match[0].trim();
if (!reported.has(shown)) {
reported.add(shown);
report(decl, "hardcodedColor", { prop, value: shown });
}
}
}
}