@kong/design-tokens - npm Package Compare versions

Comparing version 1.12.11 to 1.12.12-pr.213.068849b.0

dist/stylelint-plugin/README.md

@@ -6,4 +6,6 @@ # @kong/design-tokens/stylelint-plugin
 - [Usage](#usage)
+- [Testing](#testing)
 - [Rules](#rules)
   - [`use-proper-token`](#use-proper-token)
+- [Creating a rule](#creating-a-rule)
 
@@ -32,2 +34,6 @@ ## Usage
 
+## Testing
+
+Run `yarn test:unit` or `test:unit:open`
+
 ## Rules
@@ -58,1 +64,9 @@
 ```
+
+## Creating a rule
+
+1. Create a directory with same name as your rule (use kebab case) in `stylelint-plugin/rules/`
+2. Organize the directory in such way so that rule logic lives in a separate file that exports the function(s) with rule logic
+3. Create a `*.spec.ts` - this is where unit tests for your rule will live
+4. Check out helpful utilities in `stylelint-plugin/utilities/`
+   * If you need to create any helper/utility functions that might be helpful in other rules, you can place it there

dist/stylelint-plugin/rules/use-proper-token/index.js

 const stylelint = require('stylelint')
 const { ruleMessages, validateOptions, report } = stylelint.utils
-const PROPERTY_TOKEN_MAP = require('./token-map')
-const { KONG_TOKEN_PREFIX, extractTokensFromValue, RULE_NAME_PREFIX } = require('../../utilities')
+const { RULE_NAME_PREFIX } = require('../../utilities')
+const getInappropriateTokens = require('./get-inappropriate-tokens')
 
 const ruleName = `${RULE_NAME_PREFIX}/use-proper-token`
 const messages = ruleMessages(ruleName, {
-  unexpected: (token, property) => `Unexpected usage of '${token}' token in '${property}' property.`,
+  unexpected: (token, property) => `Unexpected usage of "${token}" token in "${property}" property`,
 })
@@ -24,32 +24,4 @@ const meta = {
     postcssRoot.walkDecls((decl) => {
-      /**
-       * PostCSS AST declaration node
-       * Docs: https://postcss.org/api/#declaration
-       */
+      const inappropriateTokens = getInappropriateTokens(decl)
 
-      const declProp = decl.prop
-      const declValue = decl.value
-      // check if the value contains a token as CSS or SCSS variable
-      const hasToken = [`--${KONG_TOKEN_PREFIX}`, `$${KONG_TOKEN_PREFIX}`].some(pattern => declValue.includes(pattern))
-      if (!hasToken) {
-        // skip validating if the value does not contain a token
-        return
-      }
-
-      const tokenProperty = Object.keys(PROPERTY_TOKEN_MAP).find(key => key.split(',').some(prop => prop === declProp))
-
-      // check if the property is in the property map
-      const isEnforcedProp = !!tokenProperty
-      if (!isEnforcedProp) {
-        return
-      }
-
-      const valueTokens = extractTokensFromValue(declValue)
-      // get the appropriate tokens for the property and create regex for each
-      // regex pattern: /kui-(?:[a-z0-9-]+-)?token(?:-[a-z0-9-]+)?$/
-      // this allows to match both regular and component tokens
-      const appropriateTokens = PROPERTY_TOKEN_MAP[tokenProperty].map(token => new RegExp(KONG_TOKEN_PREFIX + '(?:[a-z0-9-]+-)?' + token + '(?:-[a-z0-9-]+)?$'))
-      // filter out tokens that are not appropriate for the property
-      const inappropriateTokens = valueTokens.filter(vToken => !appropriateTokens.some(aTokenRegex => aTokenRegex.test(vToken)))
-
       if (inappropriateTokens.length) {
@@ -59,3 +31,3 @@ // report the error for each inappropriate token
           report({
-            message: messages.unexpected(token, declProp),
+            message: messages.unexpected(token, decl.prop),
             node: decl,
@@ -62,0 +34,0 @@ result: postcssResult,

dist/tokens/js/cjs/index.d.ts

 /**
  * Do not edit directly
- * Generated on Thu, 04 Apr 2024 15:06:18 GMT
+ * Generated on Sat, 06 Apr 2024 17:32:12 GMT
  * 
@@ -5,0 +5,0 @@ * Kong Design Tokens

dist/tokens/js/cjs/index.js

 /**
  * Do not edit directly
- * Generated on Thu, 04 Apr 2024 15:06:18 GMT
+ * Generated on Sat, 06 Apr 2024 17:32:12 GMT
  * 
@@ -5,0 +5,0 @@ * Kong Design Tokens

dist/tokens/js/index.d.ts

 /**
  * Do not edit directly
- * Generated on Thu, 04 Apr 2024 15:06:18 GMT
+ * Generated on Sat, 06 Apr 2024 17:32:12 GMT
  * 
@@ -5,0 +5,0 @@ * Kong Design Tokens

package.json

 {
   "name": "@kong/design-tokens",
-  "version": "1.12.11",
+  "version": "1.12.12-pr.213.068849b.0",
   "description": "Kong UI Design Tokens and style dictionary",
@@ -17,3 +17,6 @@ "scripts": {
     "prepublishOnly": "npm run build",
-    "commit": "cz"
+    "commit": "cz",
+    "test:unit": "vitest",
+    "test:unit:open": "vitest --ui",
+    "test:unit:coverage": "vitest run --coverage"
   },
@@ -65,2 +68,4 @@ "publishConfig": {
     "@vitejs/plugin-vue": "^5.0.4",
+    "@vitest/coverage-v8": "^1.4.0",
+    "@vitest/ui": "^1.4.0",
     "chokidar-cli": "^3.0.0",
@@ -86,3 +91,4 @@ "commitizen": "^4.3.0",
     "vite-plugin-restart": "^0.4.0",
-    "vite-plugin-vue-devtools": "^7.0.20",
+    "vite-plugin-vue-devtools": "^7.0.21",
+    "vitest": "^1.4.0",
     "vue": "^3.4.21",
@@ -89,0 +95,0 @@ "vue-router": "^4.3.0"

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

422398

increased by1.09%

Number of package files

25

increased by8.7%

Lines of code

2285

increased by4.62%

Worsened metrics

Dev dependency count

35

increased by9.38%

Number of low quality alerts

1

increased byInfinity%

No dependency changes