@kong/design-tokens 1.18.3-pr.613.51bd0cb.0 → 1.18.3-pr.613.5525a1e.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.
- package/dist/stylelint-plugin/rules/use-css-token/index.mjs +45 -14
- package/dist/tokens/css/custom-properties.css +1 -1
- package/dist/tokens/js/cjs/index.d.ts +1 -1
- package/dist/tokens/js/cjs/index.js +1 -1
- package/dist/tokens/js/index.d.ts +1 -1
- package/dist/tokens/js/index.mjs +1 -1
- package/dist/tokens/less/variables.less +1 -1
- package/dist/tokens/scss/_map.scss +1 -1
- package/dist/tokens/scss/_variables.scss +1 -1
- package/package.json +4 -4
|
@@ -17,11 +17,6 @@ const getCssToken = (scssToken) => {
|
|
|
17
17
|
return `--${tokenName}`
|
|
18
18
|
}
|
|
19
19
|
|
|
20
|
-
// Create regex pattern to match var(--token, $token) format
|
|
21
|
-
const createProperUsagePattern = (cssToken, scssToken) => {
|
|
22
|
-
return new RegExp(`var\\(\\s*${cssToken}\\s*,\\s*${scssToken}\\s*\\)`)
|
|
23
|
-
}
|
|
24
|
-
|
|
25
20
|
// Find all occurrences of a token in a value
|
|
26
21
|
const findAllTokenOccurrences = (value, token) => {
|
|
27
22
|
const occurrences = []
|
|
@@ -38,11 +33,49 @@ const findAllTokenOccurrences = (value, token) => {
|
|
|
38
33
|
}
|
|
39
34
|
|
|
40
35
|
// Check if token at given position is properly wrapped in var()
|
|
41
|
-
const isTokenProperlyWrapped = (value, tokenIndex, token,
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
const
|
|
45
|
-
|
|
36
|
+
const isTokenProperlyWrapped = (value, tokenIndex, token, cssToken) => {
|
|
37
|
+
// Find the var() expression that contains this token
|
|
38
|
+
// Look backwards to find the nearest var( before the token
|
|
39
|
+
const beforeToken = value.substring(0, tokenIndex)
|
|
40
|
+
const varStartIndex = beforeToken.lastIndexOf('var(')
|
|
41
|
+
|
|
42
|
+
if (varStartIndex === -1) {
|
|
43
|
+
return false
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
// Find the matching closing parenthesis starting from var(
|
|
47
|
+
let parenCount = 0
|
|
48
|
+
let searchIndex = varStartIndex
|
|
49
|
+
let varEndIndex = -1
|
|
50
|
+
|
|
51
|
+
while (searchIndex < value.length) {
|
|
52
|
+
const char = value[searchIndex]
|
|
53
|
+
if (char === '(') {
|
|
54
|
+
parenCount++
|
|
55
|
+
} else if (char === ')') {
|
|
56
|
+
parenCount--
|
|
57
|
+
if (parenCount === 0) {
|
|
58
|
+
varEndIndex = searchIndex
|
|
59
|
+
break
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
searchIndex++
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
if (varEndIndex === -1) {
|
|
66
|
+
return false
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
// Verify the token is actually inside this var() expression
|
|
70
|
+
const tokenEndIndex = tokenIndex + token.length
|
|
71
|
+
if (tokenIndex < varStartIndex || tokenEndIndex > varEndIndex) {
|
|
72
|
+
return false
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
// Extract the full var() expression and check if it matches the pattern
|
|
76
|
+
const varExpression = value.substring(varStartIndex, varEndIndex + 1)
|
|
77
|
+
const expectedPattern = new RegExp(`^var\\(\\s*${cssToken}\\s*,\\s*${token}\\s*\\)$`)
|
|
78
|
+
return expectedPattern.test(varExpression)
|
|
46
79
|
}
|
|
47
80
|
|
|
48
81
|
const ruleFunction = () => {
|
|
@@ -74,12 +107,11 @@ const ruleFunction = () => {
|
|
|
74
107
|
|
|
75
108
|
uniqueScssTokens.forEach((scssToken) => {
|
|
76
109
|
const cssToken = getCssToken(scssToken)
|
|
77
|
-
const properUsagePattern = createProperUsagePattern(cssToken, scssToken)
|
|
78
110
|
const tokenOccurrences = findAllTokenOccurrences(declValue, scssToken)
|
|
79
111
|
|
|
80
112
|
// Check each occurrence to see if it's properly wrapped
|
|
81
113
|
const hasImproperUsage = tokenOccurrences.some((tokenIndex) => {
|
|
82
|
-
return !isTokenProperlyWrapped(declValue, tokenIndex, scssToken,
|
|
114
|
+
return !isTokenProperlyWrapped(declValue, tokenIndex, scssToken, cssToken)
|
|
83
115
|
})
|
|
84
116
|
|
|
85
117
|
if (hasImproperUsage) {
|
|
@@ -96,13 +128,12 @@ const ruleFunction = () => {
|
|
|
96
128
|
// First, identify all positions that need to be replaced
|
|
97
129
|
improperlyUsedTokens.forEach((scssToken) => {
|
|
98
130
|
const cssToken = getCssToken(scssToken)
|
|
99
|
-
const properUsagePattern = createProperUsagePattern(cssToken, scssToken)
|
|
100
131
|
const tokenOccurrences = findAllTokenOccurrences(fixedValue, scssToken)
|
|
101
132
|
const properFormat = `var(${cssToken}, ${scssToken})`
|
|
102
133
|
|
|
103
134
|
tokenOccurrences.forEach((index) => {
|
|
104
135
|
// Check if this occurrence is in proper format
|
|
105
|
-
if (!isTokenProperlyWrapped(fixedValue, index, scssToken,
|
|
136
|
+
if (!isTokenProperlyWrapped(fixedValue, index, scssToken, cssToken)) {
|
|
106
137
|
// This occurrence needs to be replaced
|
|
107
138
|
replacements.push({
|
|
108
139
|
start: index,
|
package/dist/tokens/js/index.mjs
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kong/design-tokens",
|
|
3
|
-
"version": "1.18.3-pr.613.
|
|
3
|
+
"version": "1.18.3-pr.613.5525a1e.0",
|
|
4
4
|
"description": "Kong UI Design Tokens and style dictionary",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"scripts": {
|
|
@@ -53,8 +53,8 @@
|
|
|
53
53
|
"url": "https://github.com/Kong/design-tokens/issues"
|
|
54
54
|
},
|
|
55
55
|
"devDependencies": {
|
|
56
|
-
"@commitlint/cli": "^20.
|
|
57
|
-
"@commitlint/config-conventional": "^20.
|
|
56
|
+
"@commitlint/cli": "^20.3.0",
|
|
57
|
+
"@commitlint/config-conventional": "^20.3.0",
|
|
58
58
|
"@digitalroute/cz-conventional-changelog-for-jira": "^8.0.1",
|
|
59
59
|
"@evilmartians/lefthook": "^2.0.13",
|
|
60
60
|
"@kong/eslint-config-kong-ui": "^1.6.0",
|
|
@@ -126,7 +126,7 @@
|
|
|
126
126
|
"jiraAppend": "]"
|
|
127
127
|
}
|
|
128
128
|
},
|
|
129
|
-
"packageManager": "pnpm@10.
|
|
129
|
+
"packageManager": "pnpm@10.27.0",
|
|
130
130
|
"engines": {
|
|
131
131
|
"node": ">=20.19.5",
|
|
132
132
|
"pnpm": ">=9.14.4 || >=10.1.0"
|