@machtwatch/react-script 1.2.11-alpha.31 → 1.2.11-alpha.33

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@machtwatch/react-script",
-  "version": "1.2.11-alpha.31",
+  "version": "1.2.11-alpha.33",
   "description": "Machtwatch React script",
   "author": "Danny Reza Miloen <danny@machtwatch.co.id>",
   "contributors": [],
@@ -15,7 +15,6 @@
   },
   "files": [
     "bin",
-    "config",
     "scripts"
   ],
   "main": "./bin/react-script.js",
@@ -88,6 +87,7 @@
     "postcss-flexbugs-fixes": "^5.0.2",
     "postcss-import": "^14.1.0",
     "postcss-loader": "^8.1.1",
+    "postcss-nested": "^6.0.1",
     "postcss-preset-env": "^7.7.1",
     "process": "0.11.10",
     "promise": "^8.0.2",

package/scripts/webpack.config.js

@@ -313,6 +313,9 @@ const webpackConfig = ({ isClient }) => ({
                 root: `${paths.appSrc}/styles/`
               }
             ],
+            require('tailwindcss/nesting')(require('postcss-nested')),
+            'tailwindcss',
+            'postcss-flexbugs-fixes',
             [
               'postcss-preset-env',
               {
@@ -320,12 +323,13 @@ const webpackConfig = ({ isClient }) => ({
                   flexbox: 'no-2009',
                 },
                 stage: 3,
+                features: {
+                  'nesting-rules': false,
+                },
                 browsers: pkg.browserslist
               }
             ],
-            'tailwindcss',
             'postcss-modules-values',
-            'postcss-flexbugs-fixes'
           ],
         },
       },
@@ -508,17 +512,21 @@ const clientConfig = {
                       root: `${paths.appSrc}/styles/`
                     }
                   ],
+                  require('tailwindcss/nesting')(require('postcss-nested')),
+                  'tailwindcss',
+                  'postcss-flexbugs-fixes',
                   [
                     'postcss-preset-env',
                     {
                       autoprefixer: { flexbox: 'no-2009' },
                       stage: 3,
+                      features: {
+                        'nesting-rules': false,
+                      },
                       browsers: pkg.browserslist,
                     }
                   ],
-                  'tailwindcss',
                   'postcss-modules-values',
-                  'postcss-flexbugs-fixes',
                 ],
               },
             },

package/config/babel/babel-custom-loader.js

@@ -1,70 +0,0 @@
-module.exports = () => ({
-  customOptions({ transform_runtime, isClient, ...loader }) {
-    return {
-      loader,
-      custom: { ...transform_runtime, isClient }
-    };
-  },
-  config(cfg) {
-    return {
-      ...cfg.options,
-      presets: [
-        [
-          require('@babel/preset-env'),
-          {
-            modules: false,
-            useBuiltIns: 'usage',
-            corejs: '3.22'
-          }
-        ],
-        require('@babel/preset-react'),
-
-      ],
-      plugins: [
-        require('@babel/plugin-transform-runtime'),
-        require('@babel/plugin-proposal-function-bind'),
-        require('@babel/plugin-proposal-export-default-from'),
-        require('@babel/plugin-proposal-export-namespace-from'),
-        require('@babel/plugin-proposal-throw-expressions'),
-        require('@babel/plugin-syntax-dynamic-import'),
-        require('@babel/plugin-proposal-json-strings'),
-        require('@loadable/babel-plugin'),
-        [require('babel-plugin-transform-imports'), {
-          '@machtwatch/react-ui': {
-            transform: '@machtwatch/react-ui/lib/${member}',
-            preventFullImport: true
-          }
-        }],
-        [require('@babel/plugin-proposal-decorators'), {
-          legacy: true
-        }],
-        [require('@babel/plugin-proposal-optional-chaining'), {
-          loose: true
-        }],
-        [require('@babel/plugin-proposal-class-properties'), {
-          loose: true
-        }],
-        [require('@babel/plugin-proposal-private-methods'), { loose: true }],
-        [require('@babel/plugin-proposal-private-property-in-object'), { loose: true }],
-        [require('babel-plugin-add-module-exports'), {
-          addDefaultProperty: true
-        }],
-        ...(cfg.options.isClient && !cfg.options.compact ? [
-          require.resolve('react-refresh/babel')
-        ] : [
-          ...(cfg.options.compact ? [
-            require('@babel/plugin-transform-react-inline-elements'),
-            require('@babel/plugin-transform-react-constant-elements')
-          ] : [])
-        ]),
-        ...(cfg.options.plugins || [])
-      ],
-    };
-  },
-  result(result) {
-    return {
-      ...result,
-      code: `${result.code} \n// Generated by babel-custom-loader`
-    };
-  },
-});

package/config/env.js

@@ -1,67 +0,0 @@
-// @remove-on-eject-begin
-/**
- * Copyright (c) 2015-present, Facebook, Inc.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-// @remove-on-eject-end
-'use strict';
-
-const fs = require('fs');
-const path = require('path');
-
-const paths = require('./paths');
-
-// Make sure that including paths.js after env.js will read .env variables.
-delete require.cache[require.resolve('./paths')];
-
-// https://github.com/bkeepers/dotenv#what-other-env-files-can-i-use
-const dotenvFiles = [paths.dotenv].filter(Boolean);
-const appDirectory = fs.realpathSync(process.cwd());
-
-// Load environment variables from .env* files. Suppress warnings using silent
-// if this file is missing. dotenv will never modify any environment variables
-// that have already been set.  Variable expansion is supported in .env files.
-// https://github.com/motdotla/dotenv
-// https://github.com/motdotla/dotenv-expand
-dotenvFiles.forEach(dotenvFile => {
-  if (fs.existsSync(dotenvFile)) {
-    require('dotenv-expand')(
-      require('dotenv').config({ path: dotenvFile })
-    );
-  };
-});
-
-process.env.NODE_PATH = (process.env.NODE_PATH || '')
-  .split(path.delimiter)
-  .filter(folder => folder && !path.isAbsolute(folder))
-  .map(folder => path.resolve(appDirectory, folder))
-  .join(path.delimiter);
-
-function getClientEnvironment(publicUrl) {
-  const raw = Object.keys(process.env)
-    .reduce(
-      (env, key) => {
-        env[key] = process.env[key];
-        return env;
-      },
-      {
-        // Useful for determining whether we’re running in production mode.
-        // Most importantly, it switches React into the correct mode.
-        NODE_ENV: process.env.NODE_ENV || 'development',
-      }
-    );
-
-  // Stringify all values so we can feed into Webpack DefinePlugin
-  const stringified = {
-    'process.env': Object.keys(raw).reduce((env, key) => {
-      env[key] = JSON.stringify(raw[key]);
-      return env;
-    }, {}),
-  };
-
-  return { raw, stringified };
-};
-
-module.exports = getClientEnvironment;

package/config/jest/babelTransform.js

@@ -1,27 +0,0 @@
-'use strict';
-
-const babelJest = require('babel-jest');
-
-module.exports = babelJest.createTransformer({
-  babelrc: false,
-  presets: [
-    ['@babel/preset-react'],
-    ['@babel/preset-env', {
-      modules: 'auto',
-      useBuiltIns: 'entry',
-      corejs: 3,
-    }]
-  ],
-  plugins: [
-    require('@babel/plugin-transform-runtime'),
-    require('@babel/plugin-syntax-dynamic-import'),
-    require('@babel/plugin-proposal-export-default-from'),
-    require('babel-plugin-dynamic-import-node'),
-    [require('babel-plugin-transform-imports'), {
-      '@machtwatch/react-ui': {
-        transform: '@machtwatch/react-ui/lib/${member}',
-        preventFullImport: true
-      }
-    }]
-  ]
-});

package/config/jest/createJestConfig.js

@@ -1,91 +0,0 @@
-'use strict';
-
-const path = require('path');
-const fs = require('fs');
-const merge = require('deepmerge');
-
-module.exports = (resolve, rootDir, srcRoots, appConfig) => {
-  const toRelRootDir = f => '<rootDir>/' + path.relative(rootDir || '', f);
-  const extendedPath = path.join(process.cwd(), 'extended-jest.config.js');
-
-  let isExtendedConfigExisted = false;
-  let extendedConfig = {};
-
-  try {
-    isExtendedConfigExisted = fs.existsSync(extendedPath);
-  } catch (err) {
-    console.error(err.message);
-  }
-
-  if (isExtendedConfigExisted) {
-    try {
-      extendedConfig = require(extendedPath);
-    } catch (err) {
-      console.error(err.message);
-    }
-  }
-
-  const config = {
-    globals: {
-      CONFIG: appConfig && (appConfig.globals || appConfig),
-    },
-    setupFiles: [resolve('scripts/utils/polyfills.js')],
-    testMatch: [
-      "<rootDir>/src/shared/**/*.(spec|test).{js,jsx,mjs}"
-    ],
-    collectCoverageFrom: [
-      "src/shared/**/*.{js,jsx,mjs}"
-    ],
-    coverageThreshold: {
-      global: {
-        branches: 80,
-        functions: 80,
-        lines: 80,
-        statements: 80
-      }
-    },
-    coverageReporters: [
-      "lcov",
-      "html"
-    ],
-    roots: srcRoots.map(toRelRootDir),
-    testEnvironment: 'node',
-    testEnvironmentOptions: {
-      url: 'http://localhost'
-    },
-    transform: {
-      '^.+\\.(js|jsx|mjs|cjs)$': resolve('config/jest/babelTransform.js'),
-      '^.+\\.css$': resolve('config/jest/cssTransform.js'),
-      '^.+\\.(graphql)$': resolve('config/jest/graphqlTransform.js'),
-      '^(?!.*\\.(js|jsx|mjs|css|json|graphql)$)': resolve('config/jest/fileTransform.js'),
-    },
-    transformIgnorePatterns: [
-      '^.+\\.module\\.css$',
-    ],
-    moduleFileExtensions: [
-      'web.js',
-      'mjs',
-      'js',
-      'json',
-      'web.jsx',
-      'jsx',
-      'node',
-    ],
-    testPathIgnorePatterns: [
-      "/node_modules/",
-      "<rootDir>/tests/",
-      "<rootDir>/src/*.js",
-      "<rootDir>/graphql/"
-    ],
-    setupFilesAfterEnv: [resolve('config/jest/jest-setup.js'), '<rootDir>/jest-setup.js'],
-    verbose: true,
-  };
-
-  const combinedConfig = merge(config, extendedConfig);
-
-  if (rootDir) {
-    config.rootDir = rootDir;
-  }
-
-  return combinedConfig;
-};

package/config/jest/cssTransform.js

@@ -1,13 +0,0 @@
-'use strict';
-
-module.exports = {
-  process() {
-    return {
-      code: 'module.exports = {};'
-    };
-  },
-  getCacheKey() {
-    // The output is always the same.
-    return 'cssTransform';
-  },
-};

package/config/jest/fileTransform.js

@@ -1,23 +0,0 @@
-'use strict';
-
-const path = require('path');
-
-module.exports = {
-  process(src, filename) {
-    const assetFilename = JSON.stringify(path.basename(filename));
-
-    if (filename.match(/\.svg$/)) {
-      return {
-        code: `module.exports = {
-          __esModule: true,
-          default: ${assetFilename},
-          ReactComponent: () => ${assetFilename},
-        };`
-      };
-    }
-
-    return {
-      code: `module.exports = ${assetFilename};`
-    };
-  },
-};

package/config/jest/graphqlTransform.js

@@ -1,11 +0,0 @@
-'use strict';
-
-const loader = require('graphql-tag/loader');
-
-module.exports = {
-  process(src) {
-    return {
-      code: loader.call({ cacheable() {} }, src)
-    };
-  },
-};

package/config/jest/jest-setup.js

@@ -1 +0,0 @@
-import "@testing-library/jest-dom";

package/config/paths.js

@@ -1,48 +0,0 @@
-// @remove-on-eject-begin
-/**
- * Copyright (c) 2015-present, Facebook, Inc.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-// @remove-on-eject-end
-'use strict';
-
-const path = require('path');
-const fs = require('fs');
-
-// Make sure any symlinks in the project folder are resolved:
-const appDirectory = fs.realpathSync(process.cwd());
-
-const resolveApp = relativePath => path.resolve(appDirectory, relativePath);
-const resolveOwn = relativePath => path.resolve(__dirname, '..', relativePath);
-
-const useTemplate = appDirectory === fs.realpathSync(path.join(__dirname, '..'));
-
-if (useTemplate) {
-  module.exports = {
-    dotenv: resolveOwn('template/.env'),
-    appPath: resolveOwn('template/'),
-    appBuild: resolveOwn('template/build'),
-    appPublic: resolveOwn('template/public'),
-    appIndexJs: resolveOwn('template/src/index.js'),
-    appPackageJson: resolveOwn('template/package.json'),
-    appSrc: resolveOwn('template/src'),
-    appConfig: resolveOwn('template/config/default'),
-    appNodeModules: resolveOwn('template/node_modules'),
-  };
-} else {
-  module.exports = {
-    dotenv: resolveApp('.env'),
-    appPath: resolveApp('.'),
-    appBuild: resolveApp('build'),
-    appPublic: resolveApp('public'),
-    appPackageJson: resolveApp('package.json'),
-    appSrc: resolveApp('src'),
-    appConfig: resolveApp('config/default'),
-    appNodeModules: resolveApp('node_modules'),
-  };
-}
-
-module.exports.srcPaths = [module.exports.appSrc];
-module.exports.useYarn = fs.existsSync(path.join(module.exports.appPath, 'yarn.lock'));