style-dictionary 4.2.0 → 4.3.1

package/lib/common/transforms.js

@@ -16,6 +16,7 @@ import { join } from 'path-unified';
 import { snakeCase, kebabCase, camelCase } from 'change-case';
 import convertToBase64 from '../utils/convertToBase64.js';
 import GroupMessages from '../utils/groupMessages.js';
+import { transforms, transformTypes } from '../enums/index.js';
 
 /**
  * @typedef {import('../../types/Transform.d.ts').Transform} Transform
@@ -25,6 +26,7 @@ import GroupMessages from '../utils/groupMessages.js';
  */
 
 const UNKNOWN_CSS_FONT_PROPS_WARNINGS = GroupMessages.GROUP.UnknownCSSFontProperties;
+const { value, name, attribute } = transformTypes;
 
 /**
  * @param {string} str
@@ -222,8 +224,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'attribute/cti': {
-    type: 'attribute',
+  [transforms.attributeCti]: {
+    type: attribute,
     transform: function (token) {
       const attrNames = ['category', 'type', 'item', 'subitem', 'state'];
       const originalAttrs = token.attributes || {};
@@ -254,8 +256,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'attribute/color': {
-    type: 'attribute',
+  [transforms.attributeColor]: {
+    type: attribute,
     filter: isColor,
     transform: function (token, _, options) {
       const color = Color(options.usesDtcg ? token.$value : token.value);
@@ -279,8 +281,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'name/human': {
-    type: 'name',
+  [transforms.nameHuman]: {
+    type: name,
     transform: function (token) {
       return [token.attributes?.item, token.attributes?.subitem].join(' ');
     },
@@ -298,8 +300,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'name/camel': {
-    type: 'name',
+  [transforms.nameCamel]: {
+    type: name,
     transform: function (token, config) {
       return camelCase([config.prefix].concat(token.path).join(' '), camelOpts);
     },
@@ -317,8 +319,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'name/kebab': {
-    type: 'name',
+  [transforms.nameKebab]: {
+    type: name,
     transform: function (token, config) {
       return kebabCase([config.prefix].concat(token.path).join(' '));
     },
@@ -336,8 +338,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'name/snake': {
-    type: 'name',
+  [transforms.nameSnake]: {
+    type: name,
     transform: function (token, config) {
       return snakeCase([config.prefix].concat(token.path).join(' '));
     },
@@ -355,8 +357,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'name/constant': {
-    type: 'name',
+  [transforms.nameConstant]: {
+    type: name,
     transform: function (token, config) {
       return snakeCase([config.prefix].concat(token.path).join(' ')).toUpperCase();
     },
@@ -374,8 +376,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'name/pascal': {
-    type: 'name',
+  [transforms.namePascal]: {
+    type: name,
     transform: function (token, config) {
       /** @param {string} str */
       const upperFirst = function (str) {
@@ -396,8 +398,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'color/rgb': {
-    type: 'value',
+  [transforms.colorRgb]: {
+    type: value,
     filter: isColor,
     transform: function (token, _, options) {
       return Color(options.usesDtcg ? token.$value : token.value).toRgbString();
@@ -416,8 +418,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'color/hsl': {
-    type: 'value',
+  [transforms.colorHsl]: {
+    type: value,
     filter: isColor,
     transform: function (token, _, options) {
       return Color(options.usesDtcg ? token.$value : token.value).toHslString();
@@ -436,8 +438,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'color/hsl-4': {
-    type: 'value',
+  [transforms.colorHsl4]: {
+    type: value,
     filter: isColor,
     transform: function (token, _, options) {
       const color = Color(options.usesDtcg ? token.$value : token.value);
@@ -462,8 +464,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'color/hex': {
-    type: 'value',
+  [transforms.colorHex]: {
+    type: value,
     filter: isColor,
     transform: function (token, _, options) {
       return Color(options.usesDtcg ? token.$value : token.value).toHexString();
@@ -481,8 +483,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'color/hex8': {
-    type: 'value',
+  [transforms.colorHex8]: {
+    type: value,
     filter: isColor,
     transform: function (token, _, options) {
       return Color(options.usesDtcg ? token.$value : token.value).toHex8String();
@@ -500,8 +502,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'color/hex8android': {
-    type: 'value',
+  [transforms.colorHex8android]: {
+    type: value,
     filter: isColor,
     transform: function (token, _, options) {
       const str = Color(options.usesDtcg ? token.$value : token.value).toHex8();
@@ -520,8 +522,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'color/composeColor': {
-    type: 'value',
+  [transforms.colorComposeColor]: {
+    type: value,
     filter: isColor,
     transform: function (token, _, options) {
       const str = Color(options.usesDtcg ? token.$value : token.value).toHex8();
@@ -540,8 +542,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'color/UIColor': {
-    type: 'value',
+  [transforms.colorUIColor]: {
+    type: value,
     filter: isColor,
     transform: function (token, _, options) {
       const rgb = Color(options.usesDtcg ? token.$value : token.value).toRgb();
@@ -573,8 +575,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'color/UIColorSwift': {
-    type: 'value',
+  [transforms.colorUIColorSwift]: {
+    type: value,
     filter: isColor,
     transform: function (token, _, options) {
       const { r, g, b, a } = Color(options.usesDtcg ? token.$value : token.value).toRgb();
@@ -596,8 +598,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'color/ColorSwiftUI': {
-    type: 'value',
+  [transforms.colorColorSwiftUI]: {
+    type: value,
     filter: isColor,
     transform: function (token, _, options) {
       const { r, g, b, a } = Color(options.usesDtcg ? token.$value : token.value).toRgb();
@@ -620,8 +622,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'color/css': {
-    type: 'value',
+  [transforms.colorCss]: {
+    type: value,
     filter: isColor,
     transform: function (token, _, options) {
       const color = Color(options.usesDtcg ? token.$value : token.value);
@@ -651,8 +653,8 @@ export default {
    * ```
    * @memberof Transforms
    */
-  'color/sketch': {
-    type: 'value',
+  [transforms.colorSketch]: {
+    type: value,
     filter: isColor,
     transform: function (token, _, options) {
       let color = Color(options.usesDtcg ? token.$value : token.value).toRgb();
@@ -676,8 +678,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'size/sp': {
-    type: 'value',
+  [transforms.sizeSp]: {
+    type: value,
     filter: isFontSize,
     transform: function (token, _, options) {
       const nonParsedVal = options.usesDtcg ? token.$value : token.value;
@@ -698,8 +700,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'size/dp': {
-    type: 'value',
+  [transforms.sizeDp]: {
+    type: value,
     filter: isDimension,
     transform: function (token, _, options) {
       const nonParsedVal = options.usesDtcg ? token.$value : token.value;
@@ -725,8 +727,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'size/object': {
-    type: 'value',
+  [transforms.sizeObject]: {
+    type: value,
     filter: (token, options) => isDimension(token, options) || isFontSize(token, options),
     transform: function (token, config, options) {
       const value = options.usesDtcg ? token.$value : token.value;
@@ -753,8 +755,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'size/remToSp': {
-    type: 'value',
+  [transforms.sizeRemToSp]: {
+    type: value,
     filter: isFontSize,
     transform: function (token, config, options) {
       const value = options.usesDtcg ? token.$value : token.value;
@@ -776,8 +778,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'size/remToDp': {
-    type: 'value',
+  [transforms.sizeRemToDp]: {
+    type: value,
     filter: isDimension,
     transform: function (token, config, options) {
       const value = options.usesDtcg ? token.$value : token.value;
@@ -799,8 +801,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'size/px': {
-    type: 'value',
+  [transforms.sizePx]: {
+    type: value,
     filter: (token, options) => isDimension(token, options) || isFontSize(token, options),
     transform: function (token, _, options) {
       const value = options.usesDtcg ? token.$value : token.value;
@@ -821,13 +823,13 @@ export default {
    *
    * @memberof Transforms
    */
-  'size/rem': {
-    type: 'value',
+  [transforms.sizeRem]: {
+    type: value,
     filter: (token, options) => isDimension(token, options) || isFontSize(token, options),
     transform: function (token, _, options) {
       const nonParsed = options.usesDtcg ? token.$value : token.value;
       // if the dimension already has a unit (non-digit / . period character)
-      if (`${nonParsed}`.match(/[^0-9.]/g)) {
+      if (`${nonParsed}`.match(/^[^0-9.-]+$/)) {
         return nonParsed;
       }
       const parsedVal = parseFloat(nonParsed);
@@ -848,8 +850,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'size/remToPt': {
-    type: 'value',
+  [transforms.sizeRemToPt]: {
+    type: value,
     filter: (token, options) => isDimension(token, options) || isFontSize(token, options),
     transform: function (token, config, options) {
       const value = options.usesDtcg ? token.$value : token.value;
@@ -871,8 +873,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'size/compose/remToSp': {
-    type: 'value',
+  [transforms.sizeComposeRemToSp]: {
+    type: value,
     filter: isFontSize,
     transform: function (token, config, options) {
       const value = options.usesDtcg ? token.$value : token.value;
@@ -894,8 +896,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'size/compose/remToDp': {
-    type: 'value',
+  [transforms.sizeComposeRemToDp]: {
+    type: value,
     filter: isDimension,
     transform: function (token, config, options) {
       const value = options.usesDtcg ? token.$value : token.value;
@@ -917,8 +919,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'size/compose/em': {
-    type: 'value',
+  [transforms.sizeComposeEm]: {
+    type: value,
     filter: isFontSize,
     transform: function (token, _, options) {
       const value = options.usesDtcg ? token.$value : token.value;
@@ -938,8 +940,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'size/swift/remToCGFloat': {
-    type: 'value',
+  [transforms.sizeSwiftRemToCGFloat]: {
+    type: value,
     filter: (token, options) => isDimension(token, options) || isFontSize(token, options),
     transform: function (token, config, options) {
       const value = options.usesDtcg ? token.$value : token.value;
@@ -961,8 +963,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'size/remToPx': {
-    type: 'value',
+  [transforms.sizeRemToPx]: {
+    type: value,
     filter: (token, options) => isDimension(token, options) || isFontSize(token, options),
     transform: function (token, config, options) {
       const value = options.usesDtcg ? token.$value : token.value;
@@ -985,8 +987,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'size/pxToRem': {
-    type: 'value',
+  [transforms.sizePxToRem]: {
+    type: value,
     filter: (token, options) => isDimension(token, options) || isFontSize(token, options),
     transform: (token, config, options) => {
       const value = options.usesDtcg ? token.$value : token.value;
@@ -1016,8 +1018,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'html/icon': {
-    type: 'value',
+  [transforms.htmlIcon]: {
+    type: value,
     filter: function (token, options) {
       return (options.usesDtcg ? token.$type : token.type) === 'html';
     },
@@ -1045,8 +1047,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'content/quote': {
-    type: 'value',
+  [transforms.contentQuote]: {
+    type: value,
     filter: isContent,
     transform: function (token, _, options) {
       return wrapValueWith("'", token, options);
@@ -1064,8 +1066,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'content/objC/literal': {
-    type: 'value',
+  [transforms.contentObjCLiteral]: {
+    type: value,
     filter: isContent,
     transform: function (token, _, options) {
       return '@' + wrapValueWithDoubleQuote(token, options);
@@ -1083,8 +1085,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'content/swift/literal': {
-    type: 'value',
+  [transforms.contentSwiftLiteral]: {
+    type: value,
     filter: isContent,
     transform: (token, _, options) => wrapValueWithDoubleQuote(token, options),
   },
@@ -1100,8 +1102,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'time/seconds': {
-    type: 'value',
+  [transforms.timeSeconds]: {
+    type: value,
     filter: function (token, options) {
       return (options.usesDtcg ? token.$type : token.type) === 'time';
     },
@@ -1123,8 +1125,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'fontFamily/css': {
-    type: 'value',
+  [transforms.fontFamilyCss]: {
+    type: value,
     // typography properties can be references, while fontFamily prop might not
     transitive: true,
     filter: (token, options) => {
@@ -1149,8 +1151,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'cubicBezier/css': {
-    type: 'value',
+  [transforms.cubicBezierCss]: {
+    type: value,
     // transition properties can be references, while timingFunction might not be
     transitive: true,
     filter: (token, options) => {
@@ -1175,8 +1177,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'strokeStyle/css/shorthand': {
-    type: 'value',
+  [transforms.strokeStyleCssShorthand]: {
+    type: value,
     // border properties can be references, while style property might not be
     transitive: true,
     filter: (token, options) => (options.usesDtcg ? token.$type : token.type) === 'strokeStyle',
@@ -1202,8 +1204,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'border/css/shorthand': {
-    type: 'value',
+  [transforms.borderCssShorthand]: {
+    type: value,
     // border properties can be references
     transitive: true,
     filter: (token, options) => (options.usesDtcg ? token.$type : token.type) === 'border',
@@ -1242,8 +1244,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'typography/css/shorthand': {
-    type: 'value',
+  [transforms.typographyCssShorthand]: {
+    type: value,
     // typography properties can be references
     transitive: true,
     filter: (token, options) => (options.usesDtcg ? token.$type : token.type) === 'typography',
@@ -1298,8 +1300,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'transition/css/shorthand': {
-    type: 'value',
+  [transforms.transitionCssShorthand]: {
+    type: value,
     // transition properties can be references
     transitive: true,
     filter: (token, options) => (options.usesDtcg ? token.$type : token.type) === 'transition',
@@ -1327,8 +1329,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'shadow/css/shorthand': {
-    type: 'value',
+  [transforms.shadowCssShorthand]: {
+    type: value,
     // shadow properties can be references
     transitive: true,
     filter: (token, options) => (options.usesDtcg ? token.$type : token.type) === 'shadow',
@@ -1369,8 +1371,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'asset/url': {
-    type: 'value',
+  [transforms.assetUrl]: {
+    type: value,
     filter: isAsset,
     transform: function (token, _, options) {
       return `url("${(options.usesDtcg ? token.$value : token.value).replace(/"/g, `\\"`)}")`;
@@ -1388,8 +1390,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'asset/base64': {
-    type: 'value',
+  [transforms.assetBase64]: {
+    type: value,
     filter: isAsset,
     transform: function (token, _, options, vol) {
       return convertToBase64(options.usesDtcg ? token.$value : token.value, vol);
@@ -1407,8 +1409,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'asset/path': {
-    type: 'value',
+  [transforms.assetPath]: {
+    type: value,
     filter: isAsset,
     transform: function (token, _, options) {
       return join(process?.cwd() ?? '/', options.usesDtcg ? token.$value : token.value);
@@ -1425,8 +1427,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'asset/objC/literal': {
-    type: 'value',
+  [transforms.assetObjCLiteral]: {
+    type: value,
     filter: isAsset,
     transform: function (token, _, options) {
       return '@' + wrapValueWithDoubleQuote(token, options);
@@ -1443,8 +1445,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'asset/swift/literal': {
-    type: 'value',
+  [transforms.assetSwiftLiteral]: {
+    type: value,
     filter: isAsset,
     transform: (token, _, options) => wrapValueWithDoubleQuote(token, options),
   },
@@ -1459,8 +1461,8 @@ export default {
    *  @memberof Transforms
    *
    */
-  'color/hex8flutter': {
-    type: 'value',
+  [transforms.colorHex8flutter]: {
+    type: value,
     filter: isColor,
     transform: function (token, _, options) {
       const str = Color(options.usesDtcg ? token.$value : token.value)
@@ -1480,8 +1482,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'content/flutter/literal': {
-    type: 'value',
+  [transforms.contentFlutterLiteral]: {
+    type: value,
     filter: isContent,
     transform: (token, _, options) => wrapValueWithDoubleQuote(token, options),
   },
@@ -1496,8 +1498,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'asset/flutter/literal': {
-    type: 'value',
+  [transforms.assetFlutterLiteral]: {
+    type: value,
     filter: isAsset,
     transform: (token, _, options) => wrapValueWithDoubleQuote(token, options),
   },
@@ -1512,8 +1514,8 @@ export default {
    *
    * @memberof Transforms
    */
-  'size/flutter/remToDouble': {
-    type: 'value',
+  [transforms.sizeFlutterRemToDouble]: {
+    type: value,
     filter: (token, options) => isDimension(token, options) || isFontSize(token, options),
     transform: function (token, config, options) {
       const baseFont = getBasePxFontSize(config);

package/lib/enums/actions.d.ts

@@ -0,0 +1,4 @@
+export namespace actions {
+    let androidCopyImages: "android/copyImages";
+    let copyAssets: "copy_assets";
+}

package/lib/enums/actions.js

@@ -0,0 +1,4 @@
+export const actions = {
+  androidCopyImages: /** @type {'android/copyImages'} */ ('android/copyImages'),
+  copyAssets: /** @type {'copy_assets'} */ ('copy_assets'),
+};

package/lib/enums/commentPositions.d.ts

@@ -0,0 +1,4 @@
+export namespace commentPositions {
+    let above: "above";
+    let inline: "inline";
+}

package/lib/enums/commentPositions.js

@@ -0,0 +1,4 @@
+export const commentPositions = {
+  above: /** @type {'above'} */ ('above'),
+  inline: /** @type {'inline'} */ ('inline'),
+};

package/lib/enums/commentStyles.d.ts

@@ -0,0 +1,5 @@
+export namespace commentStyles {
+    let short: "short";
+    let long: "long";
+    let none: "none";
+}

package/lib/enums/commentStyles.js

@@ -0,0 +1,5 @@
+export const commentStyles = {
+  short: /** @type {'short'} */ ('short'),
+  long: /** @type {'long'} */ ('long'),
+  none: /** @type {'none'} */ ('none'),
+};

package/lib/enums/fileHeaderCommentStyles.d.ts

@@ -0,0 +1,5 @@
+export namespace fileHeaderCommentStyles {
+    let short: "short";
+    let long: "long";
+    let xml: "xml";
+}

package/lib/enums/fileHeaderCommentStyles.js

@@ -0,0 +1,5 @@
+export const fileHeaderCommentStyles = {
+  short: /** @type {'short'} */ ('short'),
+  long: /** @type {'long'} */ ('long'),
+  xml: /** @type {'xml'} */ ('xml'),
+};