design-system-silkhaus 3.14.0 → 3.15.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.
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
export default {
|
|
2
|
+
meta: {
|
|
3
|
+
type: 'problem',
|
|
4
|
+
docs: {
|
|
5
|
+
description: 'Restrict listed names in tailwind tokens',
|
|
6
|
+
recommended: false,
|
|
7
|
+
},
|
|
8
|
+
messages: {
|
|
9
|
+
disallowedToken:
|
|
10
|
+
"Do not use '{{ token }}' in token names. Use a semantic design token name instead.",
|
|
11
|
+
},
|
|
12
|
+
schema: [],
|
|
13
|
+
},
|
|
14
|
+
|
|
15
|
+
create(context) {
|
|
16
|
+
const RESTRICTED_TOKENS = [
|
|
17
|
+
'white',
|
|
18
|
+
'black',
|
|
19
|
+
'red',
|
|
20
|
+
'green',
|
|
21
|
+
'grey',
|
|
22
|
+
'gray',
|
|
23
|
+
'eggplant',
|
|
24
|
+
'carrot',
|
|
25
|
+
'teal',
|
|
26
|
+
'mustard',
|
|
27
|
+
];
|
|
28
|
+
|
|
29
|
+
const regex = new RegExp(`\\b(${RESTRICTED_TOKENS.join('|')})\\b`, 'i');
|
|
30
|
+
|
|
31
|
+
function reportIfTokenUsed(node, value) {
|
|
32
|
+
const match = regex.exec(value);
|
|
33
|
+
if (match) {
|
|
34
|
+
context.report({
|
|
35
|
+
node,
|
|
36
|
+
messageId: 'disallowedToken',
|
|
37
|
+
data: {
|
|
38
|
+
token: match[1],
|
|
39
|
+
},
|
|
40
|
+
});
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
return {
|
|
45
|
+
Literal(node) {
|
|
46
|
+
if (typeof node.value === 'string') {
|
|
47
|
+
reportIfTokenUsed(node, node.value);
|
|
48
|
+
}
|
|
49
|
+
},
|
|
50
|
+
JSXAttribute(node) {
|
|
51
|
+
if (
|
|
52
|
+
node.name &&
|
|
53
|
+
['class', 'className', 'style'].includes(node.name.name) &&
|
|
54
|
+
node.value &&
|
|
55
|
+
node.value.type === 'Literal' &&
|
|
56
|
+
typeof node.value.value === 'string'
|
|
57
|
+
) {
|
|
58
|
+
reportIfTokenUsed(node.value, node.value.value);
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
// Also handle JSXExpressionContainer e.g. className={"my-class red-text"}
|
|
62
|
+
if (
|
|
63
|
+
node.value &&
|
|
64
|
+
node.value.type === 'JSXExpressionContainer' &&
|
|
65
|
+
node.value.expression &&
|
|
66
|
+
node.value.expression.type === 'Literal' &&
|
|
67
|
+
typeof node.value.expression.value === 'string'
|
|
68
|
+
) {
|
|
69
|
+
reportIfTokenUsed(node.value.expression, node.value.expression.value);
|
|
70
|
+
}
|
|
71
|
+
},
|
|
72
|
+
TemplateLiteral(node) {
|
|
73
|
+
node.quasis.forEach((quasi) => {
|
|
74
|
+
reportIfTokenUsed(quasi, quasi.value.cooked || '');
|
|
75
|
+
});
|
|
76
|
+
},
|
|
77
|
+
};
|
|
78
|
+
},
|
|
79
|
+
};
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "design-system-silkhaus",
|
|
3
3
|
"private": false,
|
|
4
|
-
"version": "3.
|
|
4
|
+
"version": "3.15.0",
|
|
5
5
|
"description": "Design system for Silkhaus built with Typescript, React and Tailwind",
|
|
6
6
|
"author": "silkhaus",
|
|
7
7
|
"license": "MIT",
|
|
@@ -43,6 +43,10 @@
|
|
|
43
43
|
"./tailwind-config": {
|
|
44
44
|
"import": "./dist/tailwind.config.js",
|
|
45
45
|
"require": "./dist/tailwind.config.js"
|
|
46
|
+
},
|
|
47
|
+
"./eslint-rules": {
|
|
48
|
+
"import": "./dist/eslint-rules",
|
|
49
|
+
"require": "./dist/eslint-rules"
|
|
46
50
|
}
|
|
47
51
|
},
|
|
48
52
|
"scripts": {
|
|
@@ -52,7 +56,7 @@
|
|
|
52
56
|
"test:ui": "vitest --ui",
|
|
53
57
|
"test:coverage": "vitest run --coverage",
|
|
54
58
|
"build-storybook": "storybook build",
|
|
55
|
-
"build:lib": "tsc && vite build && tsc tailwind.config.ts --outDir dist --module commonjs && mv dist/app.d.ts dist/app/index.d.ts",
|
|
59
|
+
"build:lib": "tsc && vite build && tsc tailwind.config.ts --outDir dist --module commonjs && mv dist/app.d.ts dist/app/index.d.ts && cp -r ./lib/eslint-rules dist",
|
|
56
60
|
"lint": "eslint .",
|
|
57
61
|
"format:fix": "prettier . --write --ignore-unknown",
|
|
58
62
|
"format:check": "prettier . --check --ignore-unknown",
|