wjec-one 5.0.0-alpha.0 → 5.0.0-alpha.1

package/config/webpack.common.config.js

@@ -25,8 +25,19 @@ module.exports = (_env, { mode }) => ({
         }
       }]
     },
+    {
+      test: /(.*)\.favicon\.(ico|svg)$/,
+      use: {
+        loader: 'file-loader',
+        options: {
+          name: './[name].[ext]',
+          publicPath: '../'
+        }
+      }
+    },
     {
       test: /\.svg$/,
+      exclude: /(.*)\.favicon\.svg$/,
       use: [{
         loader: '@svgr/webpack',
         options: {
@@ -38,14 +49,17 @@ module.exports = (_env, { mode }) => ({
             '#2E3638': 'currentColor'
           },
           svgoConfig: {
-            plugins: [{
-              name: 'preset-default',
-              params: {
-                overrides: {
-                  removeViewBox: false
-                }
+            plugins: [
+              {
+                name: 'preset-default',
+                params: {
+                  overrides: {
+                    removeViewBox: false,
+                    cleanupIds: false
+                  }
+                },
               }
-            }]
+            ]
           },
           svgProps: {
             xmlns: 'http://www.w3.org/2000/svg'
@@ -53,19 +67,6 @@ module.exports = (_env, { mode }) => ({
         }
       }]
     },
-    {
-      type: 'javascript/auto',
-      test: /\.json$/,
-      include: /config/,
-      exclude: /node_modules/,
-      use: {
-        loader: 'file-loader',
-        options: {
-          name: './config/[name].json',
-          publicPath: '../'
-        }
-      }
-    },
     {
       test: /\.(ttf|eot|woff|woff2)$/,
       use: {

package/config/webpack.config.js

@@ -1,6 +1,8 @@
+const babelConfig = require('./babel.config');
 const CopyWebpackPlugin = require('copy-webpack-plugin');
 const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
 const fs = require('fs');
+const glob = require('glob');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const path = require('path');
 const webpack = require('webpack');
@@ -14,79 +16,136 @@ const { overrides = {} } = require(path.join(appPath, 'package.json'));
 const devServerHost = overrides.devServerHost || 'localhost';
 const devServerPort = overrides.devServerPort === undefined ? 9001 : overrides.devServerPort;
 
-module.exports = () => ({
-  // Common config
-  extends: path.resolve(__dirname, './webpack.common.config.js'),
+const workerPathGlob = './!(node_modules|dist)/**/*.worker.@(js|ts)'.replaceAll(path.sep, path.posix.sep);
+const workerPaths = glob.sync(workerPathGlob).reduce((workers, filePath) => {
+  const fileName = filePath.substring(filePath.lastIndexOf(path.sep) + 1, filePath.lastIndexOf('.'));
 
-  // Overrides
-  context: appPath,
-  devServer: {
-    host: devServerHost === 'localIp' ? '0.0.0.0' : devServerHost,
-    port: devServerPort,
-    historyApiFallback: true,
-    server: 'http',
-    static: {
-      directory: path.resolve(appPath, './'),
-      staticOptions: { redirect: false }
-    }
-  },
-  entry: { index: `${appPath}/index.tsx` },
+  return {
+    ...workers,
+    [fileName]: `./${filePath}`
+  };
+}, {});
+
+const workerConfig = () => ({
+  extends: path.resolve(__dirname, './webpack.common.config.js'),
+  entry: workerPaths,
   module: {
-    rules: [{
-      type: 'javascript/auto',
-      test: /\.json$/,
-      include: /config/,
-      exclude: /node_modules/,
-      use: {
-        loader: 'file-loader',
-        options: {
-          name: `./config/${generateFilename('[name]', '.json')}`,
-          publicPath: '../'
-        }
+    rules: [
+      {
+        loader: 'babel-loader',
+        options: babelConfig,
+        test: /\.(js|jsx|mjs|ts|tsx)$/,
+        exclude: /core-js/
       }
-    }]
+    ]
   },
-  output: {
-    chunkFilename: generateFilename(),
-    filename: generateFilename(),
-    path: path.join(appPath, 'dist'),
-    publicPath: '/'
-  },
-  plugins: [
-    new CopyWebpackPlugin({
-      patterns: [
-        ...fs.readdirSync(path.join(appPath, 'config')).map((fileName) => ({
-          from: path.join(appPath, 'config', fileName),
-          to: `config/${generateFilename('[name]', '.json')}`
-        }))
-      ].filter(Boolean)
-    }),
-    new webpack.DefinePlugin({
-      'process.env.FILENAME_SUFFIX': JSON.stringify(getFilenameSuffix()),
-      'process.env.NODE_DEBUG': JSON.stringify(process.env.NODE_DEBUG),
-      'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV)
-    }),
-    new ForkTsCheckerWebpackPlugin({
-      typescript: {
-        configFile: path.join(configPath, './tsconfig.json')
-      }
-    }),
-    new HtmlWebpackPlugin({
-      template: path.join(appPath, 'index.html'),
-      filename: './index.html',
-      tsconfig: path.join(configPath, './tsconfig.json')
-    })
-  ],
   resolve: {
-    fallback: {
-      stream: require.resolve('stream-browserify'),
-      process: require.resolve('process')
-    },
     extensions: ['.js', '.jsx', '.ts', '.tsx', '.d.ts', '.json'],
     alias: {
       config: path.join(appPath, 'config'),
       src: path.join(appPath, 'src'),
       test: path.join(appPath, 'test')
     }
+  },
+  output: {
+    chunkFilename: generateFilename(),
+    filename: generateFilename(),
+    path: path.join(appPath, 'dist'),
+    publicPath: '/'
   }
 });
+
+module.exports = () => ([
+  {
+    // Common config
+    extends: path.resolve(__dirname, './webpack.common.config.js'),
+
+    // Overrides
+    context: appPath,
+    devServer: {
+      host: devServerHost === 'localIp' ? '0.0.0.0' : devServerHost,
+      port: devServerPort,
+      historyApiFallback: true,
+      server: 'http',
+      static: {
+        directory: path.resolve(appPath, './'),
+        staticOptions: { redirect: false }
+      }
+    },
+    entry: { index: `${appPath}/index.tsx` },
+    module: {
+      rules: [
+        {
+          type: 'javascript/auto',
+          test: /\.json$/,
+          include: /config/,
+          exclude: /node_modules/,
+          use: {
+            loader: 'file-loader',
+            options: {
+              name: `./config/${generateFilename('[name]', '.json')}`,
+              publicPath: '../'
+            }
+          }
+        },
+        {
+          type: 'javascript/auto',
+          test: /\.worker\.(js|ts)$/,
+          exclude: /node_modules/,
+          use: {
+            loader: 'file-loader',
+            options: {
+              name: `./${generateFilename()}`,
+              publicPath: '',
+              emitFile: false
+            }
+          }
+        },
+      ],
+    },
+    output: {
+      chunkFilename: generateFilename(),
+      filename: generateFilename(),
+      path: path.join(appPath, 'dist'),
+      publicPath: '/'
+    },
+    plugins: [
+      new CopyWebpackPlugin({
+        patterns: [
+          ...fs.readdirSync(path.join(appPath, 'config')).map((fileName) => ({
+            from: path.join(appPath, 'config', fileName),
+            to: `config/${generateFilename('[name]', '.json')}`
+          }))
+        ].filter(Boolean)
+      }),
+      new webpack.DefinePlugin({
+        'process.env.FILENAME_SUFFIX': JSON.stringify(getFilenameSuffix()),
+        'process.env.NODE_DEBUG': JSON.stringify(process.env.NODE_DEBUG),
+        'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV)
+      }),
+      new ForkTsCheckerWebpackPlugin({
+        typescript: {
+          configFile: path.join(configPath, './tsconfig.json')
+        }
+      }),
+      new HtmlWebpackPlugin({
+        template: path.join(appPath, 'index.html'),
+        filename: './index.html',
+        tsconfig: path.join(configPath, './tsconfig.json')
+      })
+    ],
+    resolve: {
+      fallback: {
+        stream: require.resolve('stream-browserify'),
+        process: require.resolve('process')
+      },
+      extensions: ['.js', '.jsx', '.ts', '.tsx', '.d.ts', '.json'],
+      alias: {
+        config: path.join(appPath, 'config'),
+        src: path.join(appPath, 'src'),
+        test: path.join(appPath, 'test')
+      }
+    }
+  },
+  (workerPaths && Object.keys(workerPaths).length > 0) && workerConfig()
+].filter(Boolean));

package/index.d.ts

@@ -1460,7 +1460,7 @@ type Options = KeyframeAnimationOptions & {
 declare const useAnimation: <T extends KeyframeParams>(elementRef: MutableRefObject<HTMLElement | SVGElement>, keyframes: KeyframesArray<T> | KeyframesObject<T>, { onCancelled, onFinished, onStarted, playImmediately, ...options }?: Options) => {
     cancel: () => void;
     pause: () => void;
-    play: (values?: KeyframeValues<T>, optionOverrides?: Partial<Options>) => Animation;
+    play: (values?: KeyframeValues<T>, optionOverrides?: KeyframeAnimationOptions) => Animation;
     readonly playState: AnimationPlayState;
 };
 
@@ -1477,6 +1477,7 @@ declare const useEventListener: EventListenerHook;
 type FocusTrapOptions = {
     dependencies?: unknown[];
     focusElement?: false | HTMLElement | number | string;
+    returnFocusTo?: HTMLElement;
     shouldTrapFocus?: boolean | (() => boolean);
 };
 declare const useFocusTrap: (eventTarget: HTMLElement | MutableRefObject<HTMLElement>, options?: FocusTrapOptions) => void;