@warp-ds/tokenizer - npm Package Compare versions

Comparing version 0.0.2 to 0.0.3

package.json

 {
   "name": "@warp-ds/tokenizer",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "exports": {
@@ -8,6 +8,2 @@ ".": "./index.js"
   "type": "module",
-  "scripts": {
-    "dev": "node dev.js ./example/itsy-org",
-    "test": "node test"
-  },
   "keywords": [],
@@ -21,5 +17,9 @@ "author": "Dave Honneffer",
   "dependencies": {
-    "glob": "^9.2.1",
-    "yaml": "^2.2.1"
+    "glob": "^10.3.10",
+    "yaml": "^2.3.4"
+  },
+  "scripts": {
+    "dev": "node dev.js ./example/itsy-org",
+    "test": "node test"
   }
-}
+}

src/process.js

@@ -1,7 +0,7 @@
-import { mergeTree, readYaml, toCSSDef, toCSSMap } from './util.js'
+import { mergeTree, readYaml, toCSSDef, toCSSMap } from './util.js';
 
 export const processFile = (filePath) => {
-  const doc = readYaml(filePath)
-  return processTokens(doc)
-}
+  const doc = readYaml(filePath);
+  return processTokens(doc);
+};
 
@@ -14,2 +14,3 @@ /**
  * @property {boolean} isMap
+ * @property {boolean} duplicate_as_rgb
  * @property {string} css
@@ -24,16 +25,20 @@ * @property {[string, string]} token
 export const processTokens = (tokenTree) => {
-  if (!tokenTree.token) throw "'token' is required for each document and can be set to either 'defs' or 'maps'"
-  const isDark = !!tokenTree.dark
-  delete tokenTree.dark
-  const tokenType = tokenTree.token
-  const isDef = tokenType === 'defs'
-  const isMap = !isDef
-  delete tokenTree.token
-  const merged = mergeTree(tokenTree)
+  if (!tokenTree.token) throw "'token' is required for each document and can be set to either 'defs' or 'maps'";
+  const isDark = !!tokenTree.dark;
+  delete tokenTree.dark;
+  const tokenType = tokenTree.token;
+  const isDef = tokenType === 'defs';
+  const isMap = !isDef;
+  delete tokenTree.token;
+  const duplicateAsRgb = !!tokenTree.duplicate_as_rgb;
+  delete tokenTree.duplicate_as_rgb;
+  const merged = mergeTree(tokenTree);
   const tokens = Object.entries(merged).map(token => ({
     token: { name: token[0], value: token[1] },
-    isDark, isDef, isMap,
-    css: isDef ? toCSSDef(token) : toCSSMap(token)
-  }))
-  return tokens
-}
+    isDark,
+    isDef,
+    isMap,
+    css: isDef ? toCSSDef(token, duplicateAsRgb) : toCSSMap(token, duplicateAsRgb)
+  }));
+  return tokens;
+};

src/util.js

@@ -1,4 +0,4 @@
-import fs from 'node:fs'
-import yaml from 'yaml'
-import slugify from './slugify.js'
+import fs from 'node:fs';
+import yaml from 'yaml';
+import slugify from './slugify.js';
 
@@ -12,6 +12,6 @@ /**
     for (const r of requirements) {
-      if (!tokens.some(t => t.token.name === r)) throw `Missing required token: '${r}'`
+      if (!tokens.some(t => t.token.name === r)) throw `Missing required token: '${r}'`;
     }
   }
-}
+};
 
@@ -22,3 +22,3 @@ /**
  */
-export const readYaml = filePath => yaml.parse(fs.readFileSync(filePath, 'utf-8'))
+export const readYaml = filePath => yaml.parse(fs.readFileSync(filePath, 'utf-8'));
 
@@ -32,6 +32,6 @@ /**
 const buildToken = (prefix, name, result = []) => {
-  if (prefix) result.push(prefix)
-  if (name !== '_') result.push(name)
-  return slugify(result.join(' '))
-}
+  if (prefix) result.push(prefix);
+  if (name !== '_') result.push(name);
+  return slugify(result.join(' '));
+};
 
@@ -47,13 +47,50 @@ /**
   for (const [_name, entry] of Object.entries(obj)) {
-    const token = buildToken(_prefix, _name)
-    if (typeof entry === 'object') mergeTree(entry, token, result)
-    else result[token] = entry
+    const token = buildToken(_prefix, _name);
+    if (typeof entry === 'object') mergeTree(entry, token, result);
+    else result[token] = entry;
   }
-  return result
+  return result;
+};
+
+const tokenKey = (k) => `--w-${k}:`;
+
+const hexToRGB = (str) => {
+  switch (str) {
+    case 'white':
+      return '255,255,255';
+    case 'black':
+      return '0,0,0';
+  }
+  const [, hex] = str.match(/^#([\da-f]+)$/i) || [];
+  switch (hex?.length) {
+    case 3:
+      const digits = Array.from(hex, (s) => Number.parseInt(s, 16)).map((n) => (n << 4) | n);
+      return digits.slice(0, 3).join();
+    case 6:
+      const value = Number.parseInt(hex, 16);
+      return `${(value >> 16) & 0xff},${(value >> 8) & 0xff},${value & 0xff}`;
+  }
+  return str;
 }
 
-const tokenKey = k => `--w-${k}:`
-export const toCSSMap = ([k, v]) => `${tokenKey(k)} var(--w-${v});`
-export const toCSSDef = ([k, v]) => `${tokenKey(k)} ${v};`
-export const wrapDarkMedia = v => `@media (prefers-color-scheme:dark) { ${v} }`
-export const rootWrap = v => `:root, :host { ${v} }`
+export const toCSSMap = ([k, v], duplicateAsRgb) => {
+  let css = `${tokenKey(k)} var(--w-${v});`;
+  if (duplicateAsRgb) {
+    const rgbTokenKey = tokenKey(k.replace(/^(s-)?(color-)?(.*)/, '$1rgb-$3'));
+    const rgbTokenValue = `var(--w-${v.replace(/^(s-)?(color-)?(.*)/, '$1rgb-$3')});`;
+    css = css.concat(rgbTokenKey, rgbTokenValue);
+  }
+  return css;
+}
+
+export const toCSSDef = ([k, v], duplicateAsRgb) => {
+  let css = `${tokenKey(k)} ${v};`;
+  if (duplicateAsRgb) {
+    css += `${tokenKey(k.replace(/^(s-)?(color-)?(.*)/, '$1rgb-$3'))}${hexToRGB(v)};`;
+  }
+  return css;
+}
+
+export const wrapDarkMedia = v => `@media (prefers-color-scheme:dark) { ${v} }`;
+
+export const rootWrap = v => `:root, :host { ${v} }`;

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

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

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

13413

increased by9.67%

Lines of code

296

increased by14.29%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@isaacs/cliui@8.0.2(transitive)

• + Added@pkgjs/parseargs@0.11.0(transitive)

• + Addedansi-regex@5.0.16.1.0(transitive)

• + Addedansi-styles@4.3.06.2.1(transitive)

• + Addedcolor-convert@2.0.1(transitive)

• + Addedcolor-name@1.1.4(transitive)

• + Addedcross-spawn@7.0.6(transitive)

• + Addedeastasianwidth@0.2.0(transitive)

• + Addedemoji-regex@8.0.09.2.2(transitive)

• + Addedforeground-child@3.3.0(transitive)

• + Addedglob@10.4.5(transitive)

• + Addedis-fullwidth-code-point@3.0.0(transitive)

• + Addedisexe@2.0.0(transitive)

• + Addedjackspeak@3.4.3(transitive)

• + Addedminimatch@9.0.5(transitive)

• + Addedpackage-json-from-dist@1.0.1(transitive)

• + Addedpath-key@3.1.1(transitive)

• + Addedshebang-command@2.0.0(transitive)

• + Addedshebang-regex@3.0.0(transitive)

• + Addedsignal-exit@4.1.0(transitive)

• + Addedstring-width@4.2.35.1.2(transitive)

• + Addedstrip-ansi@6.0.17.1.0(transitive)

• + Addedwhich@2.0.2(transitive)

• + Addedwrap-ansi@7.0.08.1.0(transitive)

• - Removedfs.realpath@1.0.0(transitive)

• - Removedglob@9.3.5(transitive)

• - Removedminimatch@8.0.4(transitive)

• - Removedminipass@4.2.8(transitive)

• Updatedglob@^10.3.10

• Updatedyaml@^2.3.4