feat: add color recipes to web component packages (#16755)

* feat: move color recipes into fluent web component package

* Change files

* udpate recipe paths

* ensure tests and syntax are correct

* add more typedoc comments

* update FAST deps

* add generated file to prettier ignore

* Change files

.prettierignore

@@ -25,3 +25,4 @@ change
 
 # package specific files
 packages/web-components/**/*.spec.ts
+packages/web-components/src/default-palette.ts

change/@fluentui-web-components-2021-02-02-11-55-41-users-chhol-add-color-recipes-to-wc-package.json

@@ -0,0 +1,8 @@
+{
+  "type": "minor",
+  "comment": "feat: move color recipes into fluent web component package",
+  "packageName": "@fluentui/web-components",
+  "email": "chhol@microsoft.com",
+  "dependentChangeType": "patch",
+  "date": "2021-02-02T19:55:41.615Z"
+}

packages/web-components/.eslintrc.js

@@ -5,6 +5,7 @@ module.exports = {
     '@typescript-eslint/no-use-before-define': 'off',
     '@typescript-eslint/typedef': 'off',
     '@typescript-eslint/explicit-function-return-type': 'off',
+    '@typescript-eslint/explicit-module-boundary-types': 'off',
     '@typescript-eslint/no-non-null-assertion': 'off',
     '@typescript-eslint/interface-name-prefix': 'off',
   },

packages/web-components/build/generate-default-palettes.js

@@ -0,0 +1,29 @@
+import fs from 'fs';
+import path from 'path';
+import { parseColorHexRGB } from '@microsoft/fast-colors';
+import { createColorPalette } from '../src/color/create-color-palette';
+import { accentBaseColor, neutralBaseColor } from '../src/color/color-constants';
+
+const outpath = path.resolve(__dirname, '../src/default-palette.ts');
+
+/**
+ * Define palettes from base colors
+ */
+const neutralPalette = createColorPalette(parseColorHexRGB(neutralBaseColor));
+const accentPalette = createColorPalette(parseColorHexRGB(accentBaseColor));
+
+const file = `/**
+ * DO NOT EDIT THIS FILE DIRECTLY
+ * This file generated by web-components/build/${path.parse(__filename).name}${path.parse(__filename).ext}
+ */
+export const neutralPalette: string[] = ${JSON.stringify(neutralPalette, null, 4)};
+export const accentPalette: string[] = ${JSON.stringify(accentPalette, null, 4)};
+`;
+
+fs.writeFile(outpath, file, error => {
+  if (error) {
+    throw error;
+  } else {
+    console.log('\nPalette data written to', outpath, '\n');
+  }
+});