<% dictionary.allTokens.forEach(function(token) {
- %>#define <%= token.name %> <%= options.usesW3C ? token.$value : token.value %>
+ %>#define <%= token.name %> <%= options.usesDtcg ? token.$value : token.value %>
<% }); %>`;
diff --git a/lib/common/templates/ios/plist.template.js b/lib/common/templates/ios/plist.template.js
index e36f50eb2..81bcc7462 100644
--- a/lib/common/templates/ios/plist.template.js
+++ b/lib/common/templates/ios/plist.template.js
@@ -28,18 +28,18 @@ const tokens = dictionary.allTokens.filter(function(token) {
%><%= token.name %>
<% if (token.attributes.category === 'color') { %>
r
- <%= (options.usesW3C ? token.$value : token.value)[0]/255 %>
+ <%= (options.usesDtcg ? token.$value : token.value)[0]/255 %>
g
- <%= (options.usesW3C ? token.$value : token.value)[1]/255 %>
+ <%= (options.usesDtcg ? token.$value : token.value)[1]/255 %>
b
- <%= (options.usesW3C ? token.$value : token.value)[2]/255 %>
+ <%= (options.usesDtcg ? token.$value : token.value)[2]/255 %>
a
1
<% } else if (token.attributes.category === 'size') { %>
- <%= options.usesW3C ? token.$value : token.value %>
+ <%= options.usesDtcg ? token.$value : token.value %>
<% } else { %>
- <%= options.usesW3C ? token.$value : token.value %>
+ <%= options.usesDtcg ? token.$value : token.value %>
<% } %><% if (token.comment) { %><% } %><% }); %>
`;
diff --git a/lib/common/templates/ios/singleton.m.template.js b/lib/common/templates/ios/singleton.m.template.js
index 6cfb9e4f9..310e979c4 100644
--- a/lib/common/templates/ios/singleton.m.template.js
+++ b/lib/common/templates/ios/singleton.m.template.js
@@ -45,8 +45,8 @@ export default `<%
<% function buildDictionary(token, indent) {
indent = indent || ' ';
var to_ret = '@{\\n';
- if (Object.hasOwn(token, \`\${options.usesW3C ? '$' : ''}value\`)) {
- let value = options.usesW3C ? token.$value : token.value;
+ if (Object.hasOwn(token, \`\${options.usesDtcg ? '$' : ''}value\`)) {
+ let value = options.usesDtcg ? token.$value : token.value;
if (token.attributes.category === 'size' || token.attributes.category === 'time') {
value = '@' + value;
}
diff --git a/lib/common/templates/ios/static.m.template.js b/lib/common/templates/ios/static.m.template.js
index 64d2d1162..6df61b0f4 100644
--- a/lib/common/templates/ios/static.m.template.js
+++ b/lib/common/templates/ios/static.m.template.js
@@ -20,4 +20,4 @@ export default `<%
#import "<%= file.className %>.h"
<% dictionary.allTokens.forEach(function(token) { %>
-<%= file.type %> const <%= token.name %> = <%= options.usesW3C ? token.$value : token.value %>;<% }); %>`;
+<%= file.type %> const <%= token.name %> = <%= options.usesDtcg ? token.$value : token.value %>;<% }); %>`;
diff --git a/lib/common/templates/ios/strings.m.template.js b/lib/common/templates/ios/strings.m.template.js
index 33a3e025c..4eda91277 100644
--- a/lib/common/templates/ios/strings.m.template.js
+++ b/lib/common/templates/ios/strings.m.template.js
@@ -20,7 +20,7 @@ export default `<%
#import "<%= file.className %>.h"
<% dictionary.allTokens.forEach(function(token) { %>
-NSString * const <%= token.name %> = <%= options.usesW3C ? token.$value : token.value %>;<% }); %>
+NSString * const <%= token.name %> = <%= options.usesDtcg ? token.$value : token.value %>;<% }); %>
@implementation <%= file.className %>
@@ -41,7 +41,7 @@ NSString * const <%= token.name %> = <%= options.usesW3C ? token.$value : token.
<% function buildProperty(token) {
let to_ret = '@{\\n';
- to_ret += ' ' + '@"value": ' + (options.usesW3C ? token.$value : token.value) + ',\\n';
+ to_ret += ' ' + '@"value": ' + (options.usesDtcg ? token.$value : token.value) + ',\\n';
to_ret += ' ' + '@"name": @"' + token.name + '",\\n';
for(const name in token.attributes) {
diff --git a/lib/common/templates/scss/map-deep.template.js b/lib/common/templates/scss/map-deep.template.js
index cb1a9cd41..a2210a4db 100644
--- a/lib/common/templates/scss/map-deep.template.js
+++ b/lib/common/templates/scss/map-deep.template.js
@@ -27,7 +27,7 @@ export default `<%
output += \`''\`
} else if (typeof obj === "string") {
output += \`'\${obj}'\`
- } else if (Object.hasOwn(obj, \`\${options.usesW3C ? '$' : ''}value\`)) {
+ } else if (Object.hasOwn(obj, \`\${options.usesDtcg ? '$' : ''}value\`)) {
// if we have found a leaf (a property with a value) append the value
output += \`$\${obj.name}\`;
} else {
diff --git a/lib/common/templates/scss/map-flat.template.js b/lib/common/templates/scss/map-flat.template.js
index f33eddd9c..2822e6988 100644
--- a/lib/common/templates/scss/map-flat.template.js
+++ b/lib/common/templates/scss/map-flat.template.js
@@ -22,7 +22,7 @@ export default `<%
if(token.comment) {
line += ' // ' + token.comment + '\\n';
}
- const value = options.usesW3C ? token.$value : token.value;
+ const value = options.usesDtcg ? token.$value : token.value;
line += ' \\'' + token.name + '\\': ' + (token.attributes.category==='asset' ? '"' + value + '"' : value)
return line;
}).join(',\\n');
diff --git a/lib/common/templates/static-style-guide/index.html.template.js b/lib/common/templates/static-style-guide/index.html.template.js
index 107168a7a..e2600c08b 100644
--- a/lib/common/templates/static-style-guide/index.html.template.js
+++ b/lib/common/templates/static-style-guide/index.html.template.js
@@ -17,7 +17,7 @@ export default `<%
const checkForStyle = function(token) {
let toStyle = "";
- const value = options.usesW3C ? token.$value : token.value;
+ const value = options.usesDtcg ? token.$value : token.value;
if(value.match(colorRegex)) {
if(token.path.indexOf('font')>-1) {
toStyle += "color:" + value + ";";
@@ -66,7 +66,7 @@ export default `<%
<% if(token.attributes && JSON.stringify(token.attributes)!=="{}") { %>
<% } %>
- <%= options.usesW3C ? token.$value : token.value %><% if(token.attributes.category === 'content' && token.attributes.type === 'icon') { %><%= options.usesW3C ? token.$value : token.value %><% } %>
+ <%= options.usesDtcg ? token.$value : token.value %><% if(token.attributes.category === 'content' && token.attributes.type === 'icon') { %><%= options.usesDtcg ? token.$value : token.value %><% } %>
<% if(token.attributes && JSON.stringify(token.attributes)!=="{}") { %>
<%= JSON.stringify(token.attributes) %>
<% } %>
diff --git a/lib/common/transforms.js b/lib/common/transforms.js
index f6e2e65af..e879a3841 100644
--- a/lib/common/transforms.js
+++ b/lib/common/transforms.js
@@ -95,7 +95,7 @@ function isContent(token) {
* @returns {string}
*/
function wrapValueWith(character, token, options) {
- return `${character}${options.usesW3C ? token.$value : token.value}${character}`;
+ return `${character}${options.usesDtcg ? token.$value : token.value}${character}`;
}
/**
@@ -183,7 +183,7 @@ export default {
type: 'attribute',
matcher: isColor,
transformer: function (token, _, options) {
- const color = Color(options.usesW3C ? token.$value : token.value);
+ const color = Color(options.usesDtcg ? token.$value : token.value);
return {
hex: color.toHex(),
rgb: color.toRgb(),
@@ -369,7 +369,7 @@ export default {
type: 'value',
matcher: isColor,
transformer: function (token, _, options) {
- return Color(options.usesW3C ? token.$value : token.value).toRgbString();
+ return Color(options.usesDtcg ? token.$value : token.value).toRgbString();
},
},
@@ -389,7 +389,7 @@ export default {
type: 'value',
matcher: isColor,
transformer: function (token, _, options) {
- return Color(options.usesW3C ? token.$value : token.value).toHslString();
+ return Color(options.usesDtcg ? token.$value : token.value).toHslString();
},
},
@@ -409,7 +409,7 @@ export default {
type: 'value',
matcher: isColor,
transformer: function (token, _, options) {
- const color = Color(options.usesW3C ? token.$value : token.value);
+ const color = Color(options.usesDtcg ? token.$value : token.value);
const o = color.toHsl();
const vals = `${Math.round(o.h)} ${Math.round(o.s * 100)}% ${Math.round(o.l * 100)}%`;
if (color.getAlpha() === 1) {
@@ -435,7 +435,7 @@ export default {
type: 'value',
matcher: isColor,
transformer: function (token, _, options) {
- return Color(options.usesW3C ? token.$value : token.value).toHexString();
+ return Color(options.usesDtcg ? token.$value : token.value).toHexString();
},
},
@@ -454,7 +454,7 @@ export default {
type: 'value',
matcher: isColor,
transformer: function (token, _, options) {
- return Color(options.usesW3C ? token.$value : token.value).toHex8String();
+ return Color(options.usesDtcg ? token.$value : token.value).toHex8String();
},
},
@@ -473,7 +473,7 @@ export default {
type: 'value',
matcher: isColor,
transformer: function (token, _, options) {
- const str = Color(options.usesW3C ? token.$value : token.value).toHex8();
+ const str = Color(options.usesDtcg ? token.$value : token.value).toHex8();
return '#' + str.slice(6) + str.slice(0, 6);
},
},
@@ -493,7 +493,7 @@ export default {
type: 'value',
matcher: isColor,
transformer: function (token, _, options) {
- const str = Color(options.usesW3C ? token.$value : token.value).toHex8();
+ const str = Color(options.usesDtcg ? token.$value : token.value).toHex8();
return 'Color(0x' + str.slice(6) + str.slice(0, 6) + ')';
},
},
@@ -513,7 +513,7 @@ export default {
type: 'value',
matcher: isColor,
transformer: function (token, _, options) {
- const rgb = Color(options.usesW3C ? token.$value : token.value).toRgb();
+ const rgb = Color(options.usesDtcg ? token.$value : token.value).toRgb();
return (
'[UIColor colorWithRed:' +
(rgb.r / 255).toFixed(3) +
@@ -546,7 +546,7 @@ export default {
type: 'value',
matcher: isColor,
transformer: function (token, _, options) {
- const { r, g, b, a } = Color(options.usesW3C ? token.$value : token.value).toRgb();
+ const { r, g, b, a } = Color(options.usesDtcg ? token.$value : token.value).toRgb();
const rFixed = (r / 255.0).toFixed(3);
const gFixed = (g / 255.0).toFixed(3);
const bFixed = (b / 255.0).toFixed(3);
@@ -569,7 +569,7 @@ export default {
type: 'value',
matcher: isColor,
transformer: function (token, _, options) {
- const { r, g, b, a } = Color(options.usesW3C ? token.$value : token.value).toRgb();
+ const { r, g, b, a } = Color(options.usesDtcg ? token.$value : token.value).toRgb();
const rFixed = (r / 255.0).toFixed(3);
const gFixed = (g / 255.0).toFixed(3);
const bFixed = (b / 255.0).toFixed(3);
@@ -593,7 +593,7 @@ export default {
type: 'value',
matcher: isColor,
transformer: function (token, _, options) {
- const color = Color(options.usesW3C ? token.$value : token.value);
+ const color = Color(options.usesDtcg ? token.$value : token.value);
if (color.getAlpha() === 1) {
return color.toHexString();
} else {
@@ -624,7 +624,7 @@ export default {
type: 'value',
matcher: /** @param {Token} token */ (token) => token.attributes?.category === 'color',
transformer: function (token, _, options) {
- let color = Color(options.usesW3C ? token.$value : token.value).toRgb();
+ let color = Color(options.usesDtcg ? token.$value : token.value).toRgb();
return {
red: (color.r / 255).toFixed(5),
green: (color.g / 255).toFixed(5),
@@ -649,7 +649,7 @@ export default {
type: 'value',
matcher: isFontSize,
transformer: function (token, _, options) {
- const nonParsedVal = options.usesW3C ? token.$value : token.value;
+ const nonParsedVal = options.usesDtcg ? token.$value : token.value;
const val = parseFloat(nonParsedVal);
if (isNaN(val)) throwSizeError(token.name, nonParsedVal, 'sp');
return val.toFixed(2) + 'sp';
@@ -671,7 +671,7 @@ export default {
type: 'value',
matcher: isNotFontSize,
transformer: function (token, _, options) {
- const nonParsedVal = options.usesW3C ? token.$value : token.value;
+ const nonParsedVal = options.usesDtcg ? token.$value : token.value;
const val = parseFloat(nonParsedVal);
if (isNaN(val)) throwSizeError(token.name, nonParsedVal, 'dp');
return val.toFixed(2) + 'dp';
@@ -698,7 +698,7 @@ export default {
type: 'value',
matcher: isSize,
transformer: function (token, config, options) {
- const value = options.usesW3C ? token.$value : token.value;
+ const value = options.usesDtcg ? token.$value : token.value;
const parsedVal = parseFloat(value);
if (isNaN(parsedVal)) throwSizeError(token.name, value, 'object');
@@ -726,7 +726,7 @@ export default {
type: 'value',
matcher: isFontSize,
transformer: function (token, config, options) {
- const value = options.usesW3C ? token.$value : token.value;
+ const value = options.usesDtcg ? token.$value : token.value;
const parsedVal = parseFloat(value);
const baseFont = getBasePxFontSize(config);
if (isNaN(parsedVal)) throwSizeError(token.name, value, 'sp');
@@ -749,7 +749,7 @@ export default {
type: 'value',
matcher: isNotFontSize,
transformer: function (token, config, options) {
- const value = options.usesW3C ? token.$value : token.value;
+ const value = options.usesDtcg ? token.$value : token.value;
const parsedVal = parseFloat(value);
const baseFont = getBasePxFontSize(config);
if (isNaN(parsedVal)) throwSizeError(token.name, value, 'dp');
@@ -772,7 +772,7 @@ export default {
type: 'value',
matcher: isSize,
transformer: function (token, _, options) {
- const value = options.usesW3C ? token.$value : token.value;
+ const value = options.usesDtcg ? token.$value : token.value;
const parsedVal = parseFloat(value);
if (isNaN(parsedVal)) throwSizeError(token.name, value, 'px');
return parsedVal + 'px';
@@ -794,7 +794,7 @@ export default {
type: 'value',
matcher: isSize,
transformer: function (token, _, options) {
- const nonParsed = options.usesW3C ? token.$value : token.value;
+ const nonParsed = options.usesDtcg ? token.$value : token.value;
const parsedVal = parseFloat(nonParsed);
if (isNaN(parsedVal)) throwSizeError(token.name, nonParsed, 'rem');
return parsedVal + 'rem';
@@ -816,7 +816,7 @@ export default {
type: 'value',
matcher: isSize,
transformer: function (token, config, options) {
- const value = options.usesW3C ? token.$value : token.value;
+ const value = options.usesDtcg ? token.$value : token.value;
const parsedVal = parseFloat(value);
const baseFont = getBasePxFontSize(config);
if (isNaN(parsedVal)) throwSizeError(token.name, value, 'pt');
@@ -839,7 +839,7 @@ export default {
type: 'value',
matcher: isFontSize,
transformer: function (token, config, options) {
- const value = options.usesW3C ? token.$value : token.value;
+ const value = options.usesDtcg ? token.$value : token.value;
const parsedVal = parseFloat(value);
const baseFont = getBasePxFontSize(config);
if (isNaN(parsedVal)) throwSizeError(token.name, value, 'sp');
@@ -862,7 +862,7 @@ export default {
type: 'value',
matcher: isNotFontSize,
transformer: function (token, config, options) {
- const value = options.usesW3C ? token.$value : token.value;
+ const value = options.usesDtcg ? token.$value : token.value;
const parsedVal = parseFloat(value);
const baseFont = getBasePxFontSize(config);
if (isNaN(parsedVal)) throwSizeError(token.name, value, 'dp');
@@ -885,7 +885,7 @@ export default {
type: 'value',
matcher: isFontSize,
transformer: function (token, _, options) {
- const value = options.usesW3C ? token.$value : token.value;
+ const value = options.usesDtcg ? token.$value : token.value;
const parsedVal = parseFloat(value);
if (isNaN(parsedVal)) throwSizeError(token.name, value, 'em');
return parsedVal + '.em';
@@ -906,7 +906,7 @@ export default {
type: 'value',
matcher: isSize,
transformer: function (token, config, options) {
- const value = options.usesW3C ? token.$value : token.value;
+ const value = options.usesDtcg ? token.$value : token.value;
const parsedVal = parseFloat(value);
const baseFont = getBasePxFontSize(config);
if (isNaN(parsedVal)) throwSizeError(token.name, value, 'CGFloat');
@@ -929,7 +929,7 @@ export default {
type: 'value',
matcher: isSize,
transformer: function (token, config, options) {
- const value = options.usesW3C ? token.$value : token.value;
+ const value = options.usesDtcg ? token.$value : token.value;
const parsedVal = parseFloat(value);
const baseFont = getBasePxFontSize(config);
if (isNaN(parsedVal)) throwSizeError(token.name, value, 'px');
@@ -953,7 +953,7 @@ export default {
type: 'value',
matcher: isSize,
transformer: (token, config, options) => {
- const value = options.usesW3C ? token.$value : token.value;
+ const value = options.usesDtcg ? token.$value : token.value;
const parsedVal = parseFloat(value);
const baseFont = getBasePxFontSize(config);
@@ -986,7 +986,7 @@ export default {
return token.attributes?.category === 'content' && token.attributes.type === 'icon';
},
transformer: function (token, _, options) {
- return (options.usesW3C ? token.$value : token.value).replace(
+ return (options.usesDtcg ? token.$value : token.value).replace(
UNICODE_PATTERN,
/**
* @param {string} match
@@ -1108,7 +1108,7 @@ export default {
return token.attributes?.category === 'time';
},
transformer: function (token, _, options) {
- return (parseFloat(options.usesW3C ? token.$value : token.value) / 1000).toFixed(2) + 's';
+ return (parseFloat(options.usesDtcg ? token.$value : token.value) / 1000).toFixed(2) + 's';
},
},
@@ -1127,7 +1127,7 @@ export default {
type: 'value',
matcher: isAsset,
transformer: function (token, _, options) {
- return convertToBase64(options.usesW3C ? token.$value : token.value);
+ return convertToBase64(options.usesDtcg ? token.$value : token.value);
},
},
@@ -1146,7 +1146,7 @@ export default {
type: 'value',
matcher: isAsset,
transformer: function (token, _, options) {
- return join(process?.cwd() ?? '/', options.usesW3C ? token.$value : token.value);
+ return join(process?.cwd() ?? '/', options.usesDtcg ? token.$value : token.value);
},
},
@@ -1198,7 +1198,7 @@ export default {
type: 'value',
matcher: isColor,
transformer: function (token, _, options) {
- const str = Color(options.usesW3C ? token.$value : token.value)
+ const str = Color(options.usesDtcg ? token.$value : token.value)
.toHex8()
.toUpperCase();
return `Color(0x${str.slice(6)}${str.slice(0, 6)})`;
@@ -1270,7 +1270,7 @@ export default {
matcher: isSize,
transformer: function (token, config, options) {
const baseFont = getBasePxFontSize(config);
- return (parseFloat(options.usesW3C ? token.$value : token.value) * baseFont).toFixed(2);
+ return (parseFloat(options.usesDtcg ? token.$value : token.value) * baseFont).toFixed(2);
},
},
};
diff --git a/lib/filterTokens.js b/lib/filterTokens.js
index 38203d8d0..ba166cd6e 100644
--- a/lib/filterTokens.js
+++ b/lib/filterTokens.js
@@ -36,7 +36,7 @@ function filterTokenObject(tokens, filter, options) {
// Use reduce to generate a new object with the unwanted tokens filtered
// out
return Object.entries(tokens ?? []).reduce((acc, [key, token]) => {
- const tokenValue = options.usesW3C ? token.$value : token.value;
+ 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;
diff --git a/lib/transform/object.js b/lib/transform/object.js
index 7b74fe96a..ad098b7e3 100644
--- a/lib/transform/object.js
+++ b/lib/transform/object.js
@@ -63,7 +63,7 @@ export default function transformObject(
// value: "#ababab"
// ...
// }
- if (isObj && Object.hasOwn(objProp, `${options.usesW3C ? '$' : ''}value`)) {
+ if (isObj && Object.hasOwn(objProp, `${options.usesDtcg ? '$' : ''}value`)) {
const pathName = getName(path);
const alreadyTransformed = transformedPropRefs.indexOf(pathName) !== -1;
@@ -89,7 +89,7 @@ export default function transformObject(
};
// If property has a reference, defer its transformations until later
- if (usesReferences(options.usesW3C ? token.$value : token.value, config)) {
+ if (usesReferences(options.usesDtcg ? token.$value : token.value, config)) {
deferProp();
continue;
}
diff --git a/lib/transform/token.js b/lib/transform/token.js
index 315b278d1..aedefa201 100644
--- a/lib/transform/token.js
+++ b/lib/transform/token.js
@@ -50,7 +50,7 @@ export default function transformProperty(token, config, options) {
// Only try to transform if the value is not a string or if it has '{}'
if (
transform.type === 'value' &&
- !usesReferences(options.usesW3C ? token.$value : token.value, config)
+ !usesReferences(options.usesDtcg ? token.$value : token.value, config)
) {
// Only transform non-referenced values (from original)
// and transitive transforms if the value has been resolved
@@ -59,7 +59,7 @@ export default function transformProperty(token, config, options) {
if (transformedValue === undefined) {
return undefined;
}
- to_ret[options.usesW3C ? '$value' : 'value'] = transformedValue;
+ to_ret[options.usesDtcg ? '$value' : 'value'] = transformedValue;
}
}
diff --git a/lib/utils/combineJSON.js b/lib/utils/combineJSON.js
index f7c2ee625..0c267b883 100644
--- a/lib/utils/combineJSON.js
+++ b/lib/utils/combineJSON.js
@@ -17,7 +17,7 @@ import { extname } from 'path-unified';
import { fs } from 'style-dictionary/fs';
import { resolve } from '../resolve.js';
import deepExtend from './deepExtend.js';
-import { detectW3CSyntax } from './detectW3CSyntax.js';
+import { detectDtcgSyntax } from './detectDtcgSyntax.js';
/**
* @typedef {import('../../types/DesignToken.d.ts').DesignTokens} Tokens
@@ -47,8 +47,8 @@ function traverseObj(obj, fn) {
* @param {Function} [collision] - A function to be called when a name collision happens that isn't a normal deep merge of objects
* @param {boolean} [source] - If json files are "sources", tag tokens
* @param {Parser[]} [parsers] - Custom file parsers
- * @param {boolean} [usesW3C] - Whether or not tokens are using W3C syntax.
- * @returns {Promise<{tokens: Tokens, usesW3C: boolean|undefined }>}
+ * @param {boolean} [usesDtcg] - Whether or not tokens are using DTCG syntax.
+ * @returns {Promise<{tokens: Tokens, usesDtcg: boolean|undefined }>}
*/
export default async function combineJSON(
arr,
@@ -56,7 +56,7 @@ export default async function combineJSON(
collision,
source = true,
parsers = [],
- usesW3C,
+ usesDtcg,
) {
/** @type {Tokens} */
const to_ret = {};
@@ -109,12 +109,12 @@ export default async function combineJSON(
}
if (file_content) {
- if (usesW3C === undefined) {
- usesW3C = detectW3CSyntax(file_content);
+ if (usesDtcg === undefined) {
+ usesDtcg = detectDtcgSyntax(file_content);
}
// Add some side data on each property to make filtering easier
traverseObj(file_content, (obj) => {
- if (Object.hasOwn(obj, `${usesW3C ? '$' : ''}value`) && !obj.filePath) {
+ if (Object.hasOwn(obj, `${usesDtcg ? '$' : ''}value`) && !obj.filePath) {
obj.filePath = filePath;
obj.isSource = source;
@@ -129,5 +129,5 @@ export default async function combineJSON(
}
}
- return { tokens: to_ret, usesW3C };
+ return { tokens: to_ret, usesDtcg };
}
diff --git a/lib/utils/createFormatArgs.js b/lib/utils/createFormatArgs.js
index 853bda972..7b7c60d99 100644
--- a/lib/utils/createFormatArgs.js
+++ b/lib/utils/createFormatArgs.js
@@ -12,7 +12,6 @@
*/
import deepExtend from './deepExtend.js';
-import { deepmerge } from './deepmerge.js';
/**
* @typedef {import('../../types/DesignToken.js').Dictionary} Dictionary
@@ -50,7 +49,7 @@ export default function createFormatArgs({ dictionary, platform, options, file }
file,
options: {
...(file.options || {}),
- usesW3C: options?.usesW3C ?? false,
+ usesDtcg: options?.usesDtcg ?? false,
},
};
}
diff --git a/lib/utils/detectW3CSyntax.js b/lib/utils/detectDtcgSyntax.js
similarity index 84%
rename from lib/utils/detectW3CSyntax.js
rename to lib/utils/detectDtcgSyntax.js
index 3672c4bb3..a3f824986 100644
--- a/lib/utils/detectW3CSyntax.js
+++ b/lib/utils/detectDtcgSyntax.js
@@ -6,14 +6,14 @@ import isPlainObject from 'is-plain-obj';
* @param {Tokens} tokens
* @returns
*/
-export function detectW3CSyntax(tokens) {
- let usesW3C = false;
+export function detectDtcgSyntax(tokens) {
+ let usesDtcg = false;
// depth-first because more likely to be faster than breadth-first
// due to amount of tokens usually being much larger than depth of token groups
const recurse = /** @param {Tokens} slice */ (slice) => {
Object.keys(slice).forEach((key) => {
if (['$value', '$type'].includes(key)) {
- usesW3C = true;
+ usesDtcg = true;
return;
}
if (isPlainObject(slice[key])) {
@@ -22,5 +22,5 @@ export function detectW3CSyntax(tokens) {
});
};
recurse(tokens);
- return usesW3C;
+ return usesDtcg;
}
diff --git a/lib/utils/flattenTokens.js b/lib/utils/flattenTokens.js
index 5dd57b6ed..83972707d 100644
--- a/lib/utils/flattenTokens.js
+++ b/lib/utils/flattenTokens.js
@@ -21,18 +21,18 @@ import isPlainObject from 'is-plain-obj';
/**
* @private
* @param {Tokens} slice - The plain object you want flattened into an array.
- * @param {boolean} [usesW3C] - Whether or not tokens are using W3C syntax.
+ * @param {boolean} [usesDtcg] - Whether or not tokens are using DTCG syntax.
* @param {Token[]} [to_ret] - Tokens array. This function is recursive therefore this is what gets passed along.
* @return {Token[]}
*/
-function _flattenTokens(slice, usesW3C, to_ret = []) {
+function _flattenTokens(slice, usesDtcg, to_ret = []) {
for (let name in slice) {
if (Object.hasOwn(slice, name)) {
// TODO: this is a bit fragile and arbitrary to stop when we get to a 'value' property.
- if (isPlainObject(slice[name]) && Object.hasOwn(slice[name], `${usesW3C ? '$' : ''}value`)) {
+ if (isPlainObject(slice[name]) && Object.hasOwn(slice[name], `${usesDtcg ? '$' : ''}value`)) {
to_ret.push(/** @type {Token} */ (slice[name]));
} else if (isPlainObject(slice[name])) {
- _flattenTokens(slice[name], usesW3C, to_ret);
+ _flattenTokens(slice[name], usesDtcg, to_ret);
}
}
}
@@ -44,9 +44,9 @@ function _flattenTokens(slice, usesW3C, to_ret = []) {
* A leaf node in this context has a 'value' property. Potentially refactor this to
* be more generic.
* @param {Tokens} tokens - The plain object you want flattened into an array.
- * @param {boolean} [usesW3C] - Whether or not tokens are using W3C syntax.
+ * @param {boolean} [usesDtcg] - Whether or not tokens are using DTCG syntax.
* @return {Token[]}
*/
-export default function flattenTokens(tokens, usesW3C = false) {
- return _flattenTokens(tokens, usesW3C);
+export default function flattenTokens(tokens, usesDtcg = false) {
+ return _flattenTokens(tokens, usesDtcg);
}
diff --git a/lib/utils/index.js b/lib/utils/index.js
index 70607e143..6132365be 100644
--- a/lib/utils/index.js
+++ b/lib/utils/index.js
@@ -15,7 +15,7 @@ import usesReferences from './references/usesReferences.js';
import { getReferences } from './references/getReferences.js';
import { resolveReferences } from './references/resolveReferences.js';
import flattenTokens from './flattenTokens.js';
-import { typeW3CDelegate } from './preprocess.js';
+import { typeDtcgDelegate } from './preprocess.js';
// Public style-dictionary/utils API
-export { usesReferences, getReferences, resolveReferences, flattenTokens, typeW3CDelegate };
+export { usesReferences, getReferences, resolveReferences, flattenTokens, typeDtcgDelegate };
diff --git a/lib/utils/preprocess.js b/lib/utils/preprocess.js
index fbd95303b..1525a7907 100644
--- a/lib/utils/preprocess.js
+++ b/lib/utils/preprocess.js
@@ -24,7 +24,7 @@ import isPlainObject from 'is-plain-obj';
* @param {DesignTokens} tokens
* @returns
*/
-export function typeW3CDelegate(tokens) {
+export function typeDtcgDelegate(tokens) {
const clone = structuredClone(tokens);
/**
@@ -62,7 +62,7 @@ export function typeW3CDelegate(tokens) {
* @returns {Promise}
*/
export async function preprocess(tokens, preprocessorObj = {}) {
- let processedTokens = typeW3CDelegate(tokens);
+ let processedTokens = typeDtcgDelegate(tokens);
const preprocessors = Object.values(preprocessorObj);
if (preprocessors.length > 0) {
diff --git a/lib/utils/references/getReferences.js b/lib/utils/references/getReferences.js
index 8694ee85a..80b632a9c 100644
--- a/lib/utils/references/getReferences.js
+++ b/lib/utils/references/getReferences.js
@@ -61,7 +61,7 @@ export function _getReferences(
references = [],
throwImmediately = false,
) {
- const { usesW3C } = opts;
+ const { usesDtcg } = opts;
const regex = createReferenceRegex(opts);
/**
@@ -71,7 +71,7 @@ export function _getReferences(
*/
function findReference(match, variable) {
// remove 'value' to access the whole token object
- variable = variable.trim().replace(`.${usesW3C ? '$' : ''}value`, '');
+ variable = variable.trim().replace(`.${usesDtcg ? '$' : ''}value`, '');
// Find what the value is referencing
const pathName = getPathFromName(variable, opts.separator ?? defaults.separator);
diff --git a/lib/utils/references/resolveReferences.js b/lib/utils/references/resolveReferences.js
index 69b9d9707..9b67d98a0 100644
--- a/lib/utils/references/resolveReferences.js
+++ b/lib/utils/references/resolveReferences.js
@@ -55,7 +55,7 @@ export function _resolveReferences(
opening_character = defaults.opening_character,
closing_character = defaults.closing_character,
ignorePaths = [],
- usesW3C = false,
+ usesDtcg = false,
// for internal usage
current_context = [],
stack = [],
@@ -69,7 +69,7 @@ export function _resolveReferences(
let to_ret = value;
/** @type {DesignToken|string|number|undefined} */
let ref;
- const valProp = usesW3C ? '$value' : 'value';
+ const valProp = usesDtcg ? '$value' : 'value';
// When we know the current context:
// the key associated with the value that we are resolving the reference for
@@ -105,7 +105,7 @@ export function _resolveReferences(
// and
// the reference points to someplace that has a `value` attribute
// we should take the '.value' of the reference
- // per the W3C draft spec where references do not have .value
+ // per the DTCG draft spec where references do not have .value
// https://design-tokens.github.io/community-group/format/#aliases-references
if (!refHasValue && ref && Object.hasOwn(ref, valProp)) {
ref = ref[valProp];
@@ -154,7 +154,7 @@ export function _resolveReferences(
to_ret = _resolveReferences(to_ret, tokens, {
regex: reg,
ignorePaths,
- usesW3C,
+ usesDtcg,
current_context,
separator,
stack,
diff --git a/types/Config.d.ts b/types/Config.d.ts
index 2d7eb1b66..8e56fdfaa 100644
--- a/types/Config.d.ts
+++ b/types/Config.d.ts
@@ -35,13 +35,13 @@ export interface RegexOptions {
}
export interface GetReferencesOptions extends RegexOptions {
- usesW3C?: boolean;
+ usesDtcg?: boolean;
unfilteredTokens?: DesignTokens;
}
export interface ResolveReferencesOptions extends RegexOptions {
ignorePaths?: string[];
- usesW3C?: boolean;
+ usesDtcg?: boolean;
}
export interface ResolveReferencesOptionsInternal extends ResolveReferencesOptions {
@@ -78,5 +78,5 @@ export interface Config {
filter?: Record;
fileHeader?: Record;
action?: Record;
- usesW3C?: boolean;
+ usesDtcg?: boolean;
}