Add options.outputStringLiterals to typescript/es6-declarations

__tests__/common/formatHelpers/getTypeScriptType.test.js

@@ -36,15 +36,21 @@ describe('common', () => {
         expect(getTypeScriptType([[100, 200], [300, 400]])).toEqual('number[][]');
       });
 
-      it ('should handle simple object types', () => {
+      it('should handle simple object types', () => {
         expect(getTypeScriptType({})).toEqual('{  }');
         expect(getTypeScriptType({ property1: '', property2: false })).toEqual('{ property1: string, property2: boolean }');
       });
 
-      it ('should handle complex object types', () => {
+      it('should handle complex object types', () => {
         const complexObject = { property1: 'foo', property2: ['foo', 'bar'], property3: { subProperty1: 'foo', subProperty2: ['foo', 'bar', 1], } }
         expect(getTypeScriptType(complexObject)).toEqual('{ property1: string, property2: string[], property3: { subProperty1: string, subProperty2: (string | number)[] } }');
       });
+
+      it('should handle outputStringLiterals', () => {
+        const stringValue = 'I am a string';
+        const options = { outputStringLiterals: true};
+        expect(getTypeScriptType(stringValue, options)).toEqual(`"${stringValue}"`);
+      });
     });
   });
 });

__tests__/formats/__snapshots__/typeScriptEs6Declarations.test.js.snap

@@ -0,0 +1,10 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`formats typescript/es6-declarations with outputStringLiterals should match snapshot 1`] = `
+"/**
+ * Do not edit directly
+ * Generated on Sat, 01 Jan 2000 00:00:00 GMT
+ */
+
+export const colorRed : \\"#FF0000\\";"
+`;

__tests__/formats/typeScriptEs6Declarations.test.js

@@ -16,17 +16,15 @@ const createFormatArgs = require('../../lib/utils/createFormatArgs');
 
 const file = {
   "destination": "__output/",
-  "format": "typescript/es6-declarations",
-  "filter": {
-    "attributes": {
-      "category": "color"
-    }
-  }
+  "format": "typescript/es6-declarations"
 };
 
 const properties = {
   "color": {
-    "red": {"value": "#FF0000"}
+    "red": {
+      "name": "colorRed",
+      "value": "#FF0000"
+    }
   }
 };
 
@@ -40,7 +38,7 @@ describe('formats', () => {
         dictionary,
         file,
         platform: {},
-      }), {}, file);
+      }));
 
       // get all lines that begin with export
       const lines = output
@@ -52,6 +50,22 @@ describe('formats', () => {
         expect(l.match(/^export.* : string;$/g).length).toEqual(1);
       });
     });
-  });
 
+    it('with outputStringLiterals should match snapshot', () => {
+      const customFile = Object.assign({}, file, {
+        options: {
+          outputStringLiterals: true
+        }
+      });
+
+      const dictionary = createDictionary({ properties });
+      const output = formatter(createFormatArgs({
+        dictionary,
+        file: customFile,
+        platform: {},
+      }));
+
+      expect(output).toMatchSnapshot();
+    });
+  });
 });

docs/formats.md

@@ -498,7 +498,7 @@ StyleDictionary.registerFormat({
 * * *
 
 ### getTypeScriptType 
-> formatHelpers.getTypeScriptType(value) ⇒ <code>String</code>
+> formatHelpers.getTypeScriptType(value, options) ⇒ <code>String</code>
 
 Given some value, returns a basic valid TypeScript type for that value.
 Supports numbers, strings, booleans, arrays and objects of any of those types.
@@ -513,6 +513,11 @@ Supports numbers, strings, booleans, arrays and objects of any of those types.
   <tbody>
 <tr>
     <td>value</td><td><code>*</code></td><td><p>A value to check the type of.</p>
+</td>
+    </tr><tr>
+    <td>options</td><td><code>Object</code></td><td></td>
+    </tr><tr>
+    <td>options.outputStringLiterals</td><td><code>Boolean</code></td><td><p>Whether or not to output literal types for string values</p>
 </td>
     </tr>  </tbody>
 </table>
@@ -1096,6 +1101,21 @@ Creates TypeScript declarations for ES6 modules
 }
 ```
 
+<table>
+  <thead>
+    <tr>
+      <th>Param</th><th>Type</th><th>Default</th><th>Description</th>
+    </tr>
+  </thead>
+  <tbody>
+<tr>
+    <td>options</td><td><code>Object</code></td><td></td><td></td>
+    </tr><tr>
+    <td>[options.outputStringLiterals]</td><td><code>Boolean</code></td><td><code>false</code></td><td><p>Whether or not to output literal types for string values</p>
+</td>
+    </tr>  </tbody>
+</table>
+
 **Example**  
 ```typescript
 export const ColorBackgroundBase : string;

lib/common/formatHelpers/getTypeScriptType.js

@@ -32,12 +32,17 @@ const { unique } = require('../../utils/es6_');
  * });
  *``` 
  * @param {*} value A value to check the type of.
+ * @param {Object} options
+ * @param {Boolean} options.outputStringLiterals - Whether or not to output literal types for string values
  * @return {String} A valid name for a TypeScript type.
  *
  */
- function getTypeScriptType(value)  {
+ function getTypeScriptType(value, options = {})  {
+  const { outputStringLiterals = false } = options;
+
   if (Array.isArray(value)) return getArrayType(value)
   if (typeof value === 'object') return getObjectType(value)
+  if (outputStringLiterals && typeof value === 'string') return `"${value}"`
   if (['string', 'number', 'boolean'].includes(typeof value)) return typeof value
 
   return 'any'

lib/common/formats.js

@@ -396,16 +396,18 @@ module.exports = {
    *
    * @memberof Formats
    * @kind member
+   * @param {Object} options
+   * @param {Boolean} [options.outputStringLiterals=false] - Whether or not to output literal types for string values
    * @example
    * ```typescript
    * export const ColorBackgroundBase : string;
    * export const ColorBackgroundAlt : string;
    * ```
    */
-  'typescript/es6-declarations': function({dictionary, file}) {
+  'typescript/es6-declarations': function({dictionary, file, options}) {
     return fileHeader({file}) +
       dictionary.allProperties.map(function(prop) {
-        var to_ret_prop = 'export const ' + prop.name + ' : ' + getTypeScriptType(prop.value) + ';';
+        var to_ret_prop = 'export const ' + prop.name + ' : ' + getTypeScriptType(prop.value, options) + ';';
         if (prop.comment)
           to_ret_prop = to_ret_prop.concat(' // ' + prop.comment);
         return to_ret_prop;