style-dictionary 4.1.2 → 4.1.3

package/examples/advanced/assets-base64-embed/package.json

@@ -12,6 +12,6 @@
   "author": "",
   "license": "Apache-2.0",
   "devDependencies": {
-    "style-dictionary": "^4.1.2"
+    "style-dictionary": "^4.1.3"
   }
 }

package/examples/advanced/create-react-app/package.json

@@ -12,7 +12,7 @@
   },
   "devDependencies": {
     "eslint-config-react-app": "^7.0.1",
-    "style-dictionary": "^4.1.2"
+    "style-dictionary": "^4.1.3"
   },
   "resolutions": {
     "immer": "8.0.1",

package/examples/advanced/create-react-native-app/package.json

@@ -29,7 +29,7 @@
     "eslint-config-react-app": "^7.0.1",
     "jest": "~25.2.6",
     "react-test-renderer": "~16.13.1",
-    "style-dictionary": "^4.1.2"
+    "style-dictionary": "^4.1.3"
   },
   "jest": {
     "preset": "react-native"

package/examples/advanced/custom-parser/package.json

@@ -10,6 +10,6 @@
   "author": "",
   "license": "Apache-2.0",
   "devDependencies": {
-    "style-dictionary": "^4.1.2"
+    "style-dictionary": "^4.1.3"
   }
 }

package/examples/advanced/custom-transforms/package.json

@@ -16,6 +16,6 @@
   "author": "",
   "license": "Apache-2.0",
   "devDependencies": {
-    "style-dictionary": "^4.1.2"
+    "style-dictionary": "^4.1.3"
   }
 }

package/examples/advanced/font-face-rules/package.json

@@ -9,6 +9,6 @@
   },
   "license": "Apache-2.0",
   "devDependencies": {
-    "style-dictionary": "^4.1.2"
+    "style-dictionary": "^4.1.3"
   }
 }

package/examples/advanced/format-helpers/package.json

@@ -10,6 +10,6 @@
   "author": "",
   "license": "Apache-2.0",
   "devDependencies": {
-    "style-dictionary": "^4.1.2"
+    "style-dictionary": "^4.1.3"
   }
 }

package/examples/advanced/matching-build-files/package.json

@@ -17,6 +17,6 @@
   "author": "Kelly Harrop <kn.harrop@gmail.com>",
   "license": "Apache-2.0",
   "devDependencies": {
-    "style-dictionary": "^4.1.2"
+    "style-dictionary": "^4.1.3"
   }
 }

package/examples/advanced/multi-brand-multi-platform/package.json

@@ -16,6 +16,6 @@
   "author": "",
   "license": "Apache-2.0",
   "devDependencies": {
-    "style-dictionary": "^4.1.2"
+    "style-dictionary": "^4.1.3"
   }
 }

package/examples/advanced/node-modules-as-config-and-properties/package.json

@@ -20,7 +20,7 @@
   },
   "homepage": "https://github.com/dbanksdesign/style-dictionary-node#readme",
   "devDependencies": {
-    "style-dictionary": "^4.1.2",
+    "style-dictionary": "^4.1.3",
     "tinycolor2": "^1.4.1"
   }
 }

package/examples/advanced/npm-module/package.json

@@ -17,6 +17,6 @@
   "author": "",
   "license": "Apache-2.0",
   "devDependencies": {
-    "style-dictionary": "^4.1.2"
+    "style-dictionary": "^4.1.3"
   }
 }

package/examples/advanced/referencing_aliasing/package.json

@@ -16,6 +16,6 @@
   "author": "",
   "license": "Apache-2.0",
   "devDependencies": {
-    "style-dictionary": "^4.1.2"
+    "style-dictionary": "^4.1.3"
   }
 }

package/examples/advanced/s3/package.json

@@ -16,6 +16,6 @@
   "devDependencies": {
     "aws-sdk": "^2.7.21",
     "fs-extra": "^1.0.0",
-    "style-dictionary": "^4.1.2"
+    "style-dictionary": "^4.1.3"
   }
 }

package/examples/advanced/tokens-deprecation/package.json

@@ -16,6 +16,6 @@
   "author": "",
   "license": "Apache-2.0",
   "devDependencies": {
-    "style-dictionary": "^4.1.2"
+    "style-dictionary": "^4.1.3"
   }
 }

package/examples/advanced/transitive-transforms/package.json

@@ -12,6 +12,6 @@
   "license": "ISC",
   "devDependencies": {
     "colorjs.io": "^0.5.2",
-    "style-dictionary": "^4.1.2"
+    "style-dictionary": "^4.1.3"
   }
 }

package/examples/advanced/variables-in-outputs/package.json

@@ -11,6 +11,6 @@
   "author": "",
   "license": "MIT",
   "devDependencies": {
-    "style-dictionary": "^4.1.2"
+    "style-dictionary": "^4.1.3"
   }
 }

package/examples/advanced/yaml-tokens/package.json

@@ -10,7 +10,7 @@
   "author": "",
   "license": "Apache-2.0",
   "devDependencies": {
-    "style-dictionary": "^4.1.2",
+    "style-dictionary": "^4.1.3",
     "yaml": "^1.10.0"
   }
 }

package/lib/StyleDictionary.js

@@ -78,7 +78,7 @@ export default class StyleDictionary extends Register {
   // Placeholder is transformed on prepublish -> see scripts/inject-version.js
   // Another option might be import pkg from './package.json' with { "type": "json" } which would work in both browser and node, but support is not there yet.
   // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import#browser_compatibility
-  static VERSION = '4.1.2';
+  static VERSION = '4.1.3';
 
   /** @returns {Config} */
   get options() {

package/lib/common/formatHelpers/fileHeader.js

@@ -67,7 +67,7 @@ export default async function fileHeader({ file, commentStyle, formatting = {},
   /**
    * @type {FileHeader}
    */
-  let fn = (arr) => arr;
+  let fn = (arr) => arr ?? [];
   if (file?.options?.fileHeader && typeof file?.options?.fileHeader !== 'string') {
     fn = file.options.fileHeader;
   }

package/lib/common/formatHelpers/formattedVariables.js

@@ -80,7 +80,7 @@ export default function formattedVariables({
     // note: using the spread operator here so we get a new array rather than
     // mutating the original
     allTokens = [...allTokens].sort(
-      sortByReference(tokens, { unfilteredTokens: dictionary.unfilteredTokens }),
+      sortByReference(tokens, { unfilteredTokens: dictionary.unfilteredTokens, usesDtcg }),
     );
   }
 

package/lib/common/formatHelpers/sortByReference.d.ts

@@ -1,7 +1,3 @@
-/**
- * @typedef {import('../../../types/DesignToken.ts').TransformedTokens} Tokens
- * @typedef {import('../../../types/DesignToken.ts').TransformedToken} Token
- */
 /**
  * A function that returns a sorting function to be used with Array.sort that
  * will sort the allTokens array based on references. This is to make sure
@@ -14,11 +10,12 @@
  * dictionary.allTokens.sort(sortByReference(dictionary))
  * ```
  * @param {Tokens} tokens
- * @param {{unfilteredTokens?: Tokens}} [opts]
+ * @param {{unfilteredTokens?: Tokens, usesDtcg?: boolean}} [opts]
  * @returns {(a: Token, b: Token) => number}
  */
-export default function sortByReference(tokens: Tokens, opts?: {
+export default function sortByReference(tokens: Tokens, { unfilteredTokens, usesDtcg }?: {
     unfilteredTokens?: Tokens;
+    usesDtcg?: boolean;
 } | undefined): (a: Token, b: Token) => number;
 export type Tokens = import("../../../types/DesignToken.ts").TransformedTokens;
 export type Token = import("../../../types/DesignToken.ts").TransformedToken;

package/lib/common/formatHelpers/sortByReference.js

@@ -19,6 +19,9 @@ import { getReferences } from '../../utils/references/getReferences.js';
  * @typedef {import('../../../types/DesignToken.ts').TransformedToken} Token
  */
 
+const A_COMES_FIRST = -1;
+const B_COMES_FIRST = 1;
+
 /**
  * A function that returns a sorting function to be used with Array.sort that
  * will sort the allTokens array based on references. This is to make sure
@@ -31,66 +34,62 @@ import { getReferences } from '../../utils/references/getReferences.js';
  * dictionary.allTokens.sort(sortByReference(dictionary))
  * ```
  * @param {Tokens} tokens
- * @param {{unfilteredTokens?: Tokens}} [opts]
+ * @param {{unfilteredTokens?: Tokens, usesDtcg?: boolean}} [opts]
  * @returns {(a: Token, b: Token) => number}
  */
-export default function sortByReference(tokens, opts) {
+export default function sortByReference(tokens, { unfilteredTokens, usesDtcg } = {}) {
+  const valueKey = usesDtcg ? '$value' : 'value';
+
   /**
    * The sorter function is recursive to account for multiple levels of nesting
    * @param {Token} a
    * @param {Token} b
-   * @returns
+   * @returns {number}
    */
   function sorter(a, b) {
-    const aComesFirst = -1;
-    const bComesFirst = 1;
-
-    // return early if a or b ar undefined
     if (typeof a === 'undefined') {
-      return aComesFirst;
-    } else if (typeof b === 'undefined') {
-      return bComesFirst;
+      return A_COMES_FIRST;
+    }
+    if (typeof b === 'undefined') {
+      return B_COMES_FIRST;
     }
 
-    // If token a uses a reference and token b doesn't, b might come before a
-    // read on..
-    if (a.original && usesReferences(a.original.value)) {
-      // Both a and b have references, we need to see if they reference each other
-      if (b.original && usesReferences(b.original.value)) {
-        const aRefs = getReferences(a.original.value, tokens, {
-          unfilteredTokens: opts?.unfilteredTokens,
-          warnImmediately: false,
-        });
-        const bRefs = getReferences(b.original.value, tokens, {
-          unfilteredTokens: opts?.unfilteredTokens,
-          warnImmediately: false,
-        });
-
-        aRefs.forEach((aRef) => {
-          // a references b, we want b to come first
-          if (aRef.name === b.name) {
-            return bComesFirst;
-          }
-        });
+    const aUsesRefs = a.original && usesReferences(a.original[valueKey]);
+    const bUsesRefs = b.original && usesReferences(b.original[valueKey]);
 
-        bRefs.forEach((bRef) => {
-          // ditto but opposite
-          if (bRef.name === a.name) {
-            return aComesFirst;
-          }
-        });
+    // -----BOTH REFERENCE-----
+    if (aUsesRefs && bUsesRefs) {
+      // Collect references for 'a' and 'b'
+      const aRefs = getReferences(a.original[valueKey], tokens, {
+        unfilteredTokens,
+        warnImmediately: false,
+      });
+      const bRefs = getReferences(b.original[valueKey], tokens, {
+        unfilteredTokens,
+        warnImmediately: false,
+      });
 
-        // both a and b have references and don't reference each other
-        // we go further down the rabbit hole (reference chain)
-        return sorter(aRefs[0], bRefs[0]);
-      } else {
-        // a has a reference and b does not:
-        return bComesFirst;
+      // 'a' references 'b' -> 'b' should come first
+      if (aRefs.some((aRef) => aRef.name === b.name)) {
+        return B_COMES_FIRST;
       }
-      // a does not have a reference it should come first regardless if b has one
-    } else {
-      return aComesFirst;
+      // 'b' references 'a' -> 'a' should come first
+      if (bRefs.some((bRef) => bRef.name === a.name)) {
+        return A_COMES_FIRST;
+      }
+
+      // 'a' and 'b' reference, but not each other. Recurse to next level
+      return sorter(aRefs[0], bRefs[0]);
     }
+
+    // ----- ONLY ONE REFERENCES -----
+    // 'a' references, 'b' doesn't -> 'b' should come first
+    if (aUsesRefs) {
+      return B_COMES_FIRST;
+    }
+
+    // 'a' doesn't reference. It should come first regardless of 'b'
+    return A_COMES_FIRST;
   }
 
   return sorter;

package/lib/common/formats.js

@@ -1190,7 +1190,7 @@ declare const ${moduleName}: ${JSON.stringify(treeWalker(dictionary.tokens), nul
 
     let sortedTokens;
     if (outputReferences) {
-      sortedTokens = [...allTokens].sort(sortByReference(tokens, { unfilteredTokens }));
+      sortedTokens = [...allTokens].sort(sortByReference(tokens, { unfilteredTokens, usesDtcg }));
     } else {
       sortedTokens = [...allTokens].sort(sortByName);
     }
@@ -1238,7 +1238,7 @@ declare const ${moduleName}: ${JSON.stringify(treeWalker(dictionary.tokens), nul
 
     let sortedTokens;
     if (outputReferences) {
-      sortedTokens = [...allTokens].sort(sortByReference(tokens, { unfilteredTokens }));
+      sortedTokens = [...allTokens].sort(sortByReference(tokens, { unfilteredTokens, usesDtcg }));
     } else {
       sortedTokens = [...allTokens].sort(sortByName);
     }
@@ -1297,7 +1297,7 @@ declare const ${moduleName}: ${JSON.stringify(treeWalker(dictionary.tokens), nul
 
     let sortedTokens;
     if (outputReferences) {
-      sortedTokens = [...allTokens].sort(sortByReference(tokens, { unfilteredTokens }));
+      sortedTokens = [...allTokens].sort(sortByReference(tokens, { unfilteredTokens, usesDtcg }));
     } else {
       sortedTokens = [...allTokens].sort(sortByName);
     }
@@ -1520,7 +1520,7 @@ declare const ${moduleName}: ${JSON.stringify(treeWalker(dictionary.tokens), nul
 
     let sortedTokens;
     if (outputReferences) {
-      sortedTokens = [...allTokens].sort(sortByReference(tokens, { unfilteredTokens }));
+      sortedTokens = [...allTokens].sort(sortByReference(tokens, { unfilteredTokens, usesDtcg }));
     } else {
       sortedTokens = [...allTokens].sort(sortByName);
     }

package/lib/filterTokens.js

@@ -48,25 +48,27 @@ async function filterTokenObject(tokens, filter, options) {
   // out
   const result = await Object.entries(tokens ?? []).reduce(async (_acc, [key, token]) => {
     const acc = await _acc;
-    const tokenValue = options.usesDtcg ? token.$value : token.value;
     // If the token is not an object, we don't know what it is. We return it as-is.
     if (!isPlainObject(token)) {
       return acc;
-      // If the token has a `value` member we know it's a property, pass it to
-      // the filter function and either include it in the final `acc` object or
-      // exclude it (by returning the `acc` object without it added).
-    } else if (typeof tokenValue !== 'undefined') {
-      const filtered = await asyncFilter(/** @type {Token[]} */ ([token]), filter, options);
-      return filtered.length === 0 ? acc : { ...acc, [key]: token };
-      // If we got here we have an object that is not a property. We'll assume
-      // it's an object containing multiple tokens and recursively filter it
-      // using the `filterTokenObject` function.
     } else {
-      const filtered = await filterTokenObject(token, filter, options);
-      // If the filtered object is not empty then add it to the final `acc`
-      // object. If it is empty then every property inside of it was filtered
-      // out, then exclude it entirely from the final `acc` object.
-      return Object.entries(filtered || {}).length < 1 ? acc : { ...acc, [key]: filtered };
+      const tokenValue = options.usesDtcg ? token.$value : token.value;
+      if (typeof tokenValue === 'undefined') {
+        // If we got here we have an object that is not a token. We'll assume
+        // it's token group containing multiple tokens and recursively filter it
+        // using the `filterTokenObject` function.
+        const filtered = await filterTokenObject(token, filter, options);
+        // If the filtered object is not empty then add it to the final `acc`
+        // object. If it is empty then every token inside of it was filtered
+        // out, then exclude it entirely from the final `acc` object.
+        return Object.entries(filtered || {}).length < 1 ? acc : { ...acc, [key]: filtered };
+      } else {
+        // If the token has a `value` member we know it's a token, pass it to
+        // the filter function and either include it in the final `acc` object or
+        // exclude it (by returning the `acc` object without it added).
+        const filtered = await asyncFilter(/** @type {Token[]} */ ([token]), filter, options);
+        return filtered.length === 0 ? acc : { ...acc, [key]: token };
+      }
     }
   }, {});
   return result;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "style-dictionary",
-  "version": "4.1.2",
+  "version": "4.1.3",
   "description": "Style once, use everywhere. A build system for creating cross-platform styles.",
   "keywords": [
     "style dictionary",

package/types/File.d.ts

@@ -16,7 +16,7 @@ export interface FormattingOverrides {
     footer?: string;
     fileHeaderTimestamp?: boolean;
 }
-export type FileHeader = (defaultMessage: string[], options?: Config) => Promise<string[]> | string[];
+export type FileHeader = (defaultMessage?: string[], options?: Config) => Promise<string[]> | string[];
 export interface File {
     destination?: string;
     format?: string | FormatFn;