chore: Release v4.0.0

.eslintrc-prettier.js

@@ -0,0 +1,9 @@
+const prettierConfig = require('./.prettierrc.js');
+const baseConfig = require('./.eslintrc.js');
+
+module.exports = {
+  extends: './.eslintrc.js',
+  rules: {
+    'prettier/prettier': ['warn', prettierConfig]
+  }
+}

.eslintrc.js

@@ -1,5 +1,3 @@
-const prettierConfig = require('./.prettierrc.js');
-
 module.exports = {
   env: {
     browser: true,
@@ -23,7 +21,7 @@ module.exports = {
     ecmaFeatures: {
       jsx: true,
     },
-    project: ['./tsconfig.json', './cypress/tsconfig.json'],
+    project: ['./tsconfig.eslint.json', './cypress/tsconfig.json'],
     sourceType: 'module',
   },
   settings: {
@@ -37,12 +35,12 @@ module.exports = {
   plugins: [
     'workday-custom-rules',
     '@typescript-eslint',
-    '@typescript-eslint/tslint',
     'jest',
     'react',
     'prettier',
     'react-hooks',
     'emotion',
+    'jsdoc',
   ],
   rules: {
     'workday-custom-rules/restricted-imports': 'error',
@@ -60,11 +58,13 @@ module.exports = {
     'default-case': 'error',
     'dot-notation': 'error',
     'eol-last': 'off',
+    eqeqeq: 'error',
     'guard-for-in': 'error',
     'linebreak-style': 'off',
     'new-parens': 'off',
     'newline-per-chained-call': 'off',
     'no-caller': 'error',
+    'no-duplicate-imports': 'error',
     'no-debugger': 'error',
     'no-empty': 'error',
     'no-empty-function': 'error',
@@ -75,44 +75,17 @@ module.exports = {
     'no-multiple-empty-lines': 'off',
     'no-new-wrappers': 'error',
     'no-param-reassign': 'error',
+    'no-redeclare': 'error',
     'no-undef-init': 'error',
+    'no-unused-expressions': 'off',
+    '@typescript-eslint/no-unused-expressions': 'error',
     'no-unused-labels': 'error',
-    'no-use-before-define': 'warn', // Decide on this
+    'no-use-before-define': 'off', // TS takes care of this one...
     'no-var': 'error',
     'prefer-const': 'error',
-    'quote-props': 'off',
     'space-before-function-paren': 'off',
     'react/jsx-no-bind': 'off', // Keep perf implications in mind, but was giving too many warnings and hurting readability
     curly: 'error',
     radix: 'error',
-    'prettier/prettier': ['error', prettierConfig],
-    // NOTE: Commented out everything below that caused problems. A lot of this is likely included in the stuff above.
-    '@typescript-eslint/tslint/config': [
-      'error',
-      {
-        rules: {
-          // align: [true, 'parameters', 'arguments', 'statements'],
-          'comment-format': [true, 'check-space'],
-          // deprecation: true, // turned off for button deprecation
-          'jsdoc-format': true, // eslint-plugin-jsdoc
-          // 'jsx-no-string-ref': true,
-          // 'jsx-self-close': true,
-          'no-duplicate-imports': true,
-          'no-duplicate-variable': true,
-          // 'no-shadowed-variable': true,
-          'no-unused-expression': true,
-          'one-line': [true, 'check-catch', 'check-open-brace', 'check-whitespace'],
-          'triple-equals': [true, 'allow-null-check'],
-          typedef: [true, 'parameter', 'property-declaration'],
-          'variable-name': [
-            true,
-            'ban-keywords',
-            'check-format',
-            'allow-leading-underscore',
-            'allow-pascal-case',
-          ],
-        },
-      },
-    ],
   },
 };

.github/tsc.json

@@ -0,0 +1,18 @@
+{
+  "problemMatcher": [
+      {
+          "owner": "tsc",
+          "pattern": [
+              {
+                  "regexp": "^(?:\\s+\\d+\\>)?([^\\s].*)\\((\\d+),(\\d+)\\)\\s*:\\s+(error|warning|info)\\s+(\\w{1,2}\\d+)\\s*:\\s*(.*)$",
+                  "file": 1,
+                  "line": 2,
+                  "column": 3,
+                  "severity": 4,
+                  "code": 5,
+                  "message": 6
+              }
+          ]
+      }
+  ]
+}

.github/workflows/ci.yml

@@ -7,7 +7,9 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-      - uses: actions/checkout@v1
+      - uses: actions/checkout@v2
+        with:
+          fetch-depth: 0 # Required to retrieve git history
       - uses: actions/setup-node@v1
         with:
           node-version: 10.x
@@ -38,21 +40,27 @@ jobs:
         env:
           CYPRESS_CACHE_FOLDER: .cache/cypress
 
+      - name: Setup TSC matcher
+        run: node ./utils/add-matchers.js
+
         # Keep steps separate for Github Actions annotation matching: https://github.com/actions/setup-node/blob/83c9f7a7df54d6b57455f7c57ac414f2ae5fb8de/src/setup-node.ts#L26-L33
       - name: Lint
         run: yarn lint
 
       - name: Dependency Check
         run: yarn depcheck
 
+      - name: Type Check
+        run: yarn typecheck
+
       - name: Unit tests
         run: yarn test
 
       - name: Build Storybook
         run: yarn build-storybook --quiet
 
       - name: Start Server
-        run: yarn http-server docs -p 9001 & npx wait-on http://localhost:9001
+        run: npx http-server docs -p 9001 & npx wait-on http://localhost:9001
 
       - uses: chromaui/action@v1
         with:

.gitignore

@@ -14,6 +14,7 @@ lerna-debug.log*
 # build
 modules/**/dist
 modules/**/ts-tmp
+modules/**/ts3.5
 build/*
 *.tsbuildinfo
 

.postcssrc.js

@@ -0,0 +1,14 @@
+const date = new Date();
+
+module.exports = {
+  map: true,
+  plugins: {
+    'postcss-discard-duplicates': {},
+    autoprefixer: {},
+    'css-mqpacker': {},
+    'postcss-banner': {
+      banner: `Copyright 2019-${date.getFullYear()} Workday, Inc.`,
+    },
+    'postcss-inline-svg': {},
+  },
+};

.storybook/config.js

@@ -17,8 +17,8 @@ function loadStories() {
   const allExports = [];
 
   allReqs.forEach(req => {
-    req.keys().forEach(fname => {
-      const story = req(fname);
+    req.keys().forEach(filename => {
+      const story = req(filename);
 
       if (story.default) allExports.push(story);
     });

.storybook/manager-head.html

@@ -1,3 +1,9 @@
 <script>
   document.title = 'Canvas Kit Storybook';
 </script>
+
+<style>
+  [title^='_hidden_'] {
+    display: none !important;
+  }
+</style>

.storybook/webpack.config.js

@@ -5,7 +5,6 @@ const createCompiler = require('@storybook/addon-docs/mdx-compiler-plugin');
 const modulesPath = path.resolve(__dirname, '../modules');
 const welcomeSectionPath = path.resolve(__dirname, './');
 const utilsPath = path.resolve(__dirname, '../utils');
-const postcssConfigPath = path.resolve(__dirname, './postcss.config');
 
 module.exports = ({config, mode}) => {
   // This is so we get consistent results when loading .ts/tsx and .mdx files
@@ -20,26 +19,18 @@ module.exports = ({config, mode}) => {
     },
   ];
 
-  // Exclude all node_modules from babel-loader
-  config.module.rules
-    .find(rule => /mjs\|jsx/.test(rule.test.toString()))
-    .exclude.push(/node_modules/);
-
-  // Filter out extraneous rules added by CRA (react-scripts)
-  // react-scripts automatically adds js/ts matchers for a `src` folder which we don't use so these rules are moot
-  config.module.rules = config.module.rules.filter(
-    rule => !/js\|mjs\|jsx\|ts\|tsx/.test(rule.test.toString())
-  );
-
-  // Override CRA postcss presets
-  config.module.rules.forEach(rule => {
-    if (rule.test.toString().includes('scss|sass')) {
-      delete rule.use[2].options.plugins;
-
-      rule.use[2].options.config = {
-        path: postcssConfigPath,
-      };
-    }
+  config.module.rules.push({
+    test: /\.(scss|css)$/,
+    use: [
+      'style-loader',
+      {
+        loader: 'css-loader',
+        options: {importLoaders: 2},
+      },
+      'postcss-loader',
+      'sass-loader',
+    ],
+    include: modulesPath,
   });
 
   // Add `.ts` and `.tsx` as a resolvable extension.

.travis.yml

@@ -11,8 +11,8 @@ git:
 
 stages:
 
-- name: master
-  if: branch = master AND type != pull_request
+- name: trunk
+  if: (branch = master OR branch =~ /^prerelease\//) AND type != pull_request
 
 - name: tag
   if: branch =~ /^v\d+\.\d+(\.\d+)?(-\S*)?$/ AND tag IS present
@@ -26,7 +26,6 @@ install:
 
 jobs:
   include:
-
   - stage: tag
     script:
       - yarn build
@@ -37,20 +36,22 @@ jobs:
       on:
         tags: true
 
-  - stage: master
+  - stage: trunk
     script:
       - >- # Chromatic relies on a built Storybook, so exit early if build-storybook fails
         yarn build-storybook --quiet &&
         yarn chromatic --quiet --auto-accept-changes --exit-once-uploaded --storybook-build-dir docs
       - yarn build
+    after_failure:
+      - node utils/report-failure.js
     env:
       - CHROMATIC_APP_CODE="dlpro96xybh"
     deploy:
       - provider: script
-        script: npm config set //registry.npmjs.org/:_authToken=$NPM_PUBLISH_TOKEN && node utils/publish-canary.js $SLACK_WEBHOOK $TRAVIS_BUILD_WEB_URL
+        script: npm config set //registry.npmjs.org/:_authToken=$NPM_PUBLISH_TOKEN && node utils/publish-canary.js
         skip_cleanup: true
         on:
-          branch: master
+          all_branches: true
       - provider: pages
         skip_cleanup: true
         local_dir: docs