@papillonarts/setup 0.9.0 → 0.11.0

package/storybook/mainSetup.ts

@@ -1,278 +0,0 @@
-/* https://storybook.js.org/docs/configure/integration/typescript */
-/* eslint-disable no-unused-vars */
-/* eslint-disable no-param-reassign */
-/* eslint-disable global-require */
-import webpack from 'webpack'
-import type { StorybookConfig } from '@storybook/react-webpack5'
-import { isEmptyObject } from '@papillonarts/library/object'
-// import { getBabelLoaderAdvancedSetup } from '@papillonarts/setup/webpack'
-import { getBabelLoaderAdvancedSetup } from '../webpack'
-
-export function getStorybookMainSetup({ storiesBasePath, includeBasePath, modulesBasePath, rootAttributesDefaults }): StorybookConfig {
-  // https://storybook.js.org/docs/react/api/main-config
-  return {
-    // https://storybook.js.org/docs/api/main-config/main-config-preview-body
-    previewBody: (body) => {
-      if (rootAttributesDefaults) {
-        // https://github.com/storybookjs/storybook/issues/24429
-        return `
-          ${body}
-          <script type="text/javascript">
-          (() => {
-            document.addEventListener('DOMContentLoaded', function() {
-              const storybookRootElement = document.getElementById("storybook-root")
-
-              // https://primer.style/foundations/primitives/getting-started
-              storybookRootElement.setAttribute("data-color-mode", "light")
-              storybookRootElement.setAttribute("data-light-theme", "light")
-              storybookRootElement.setAttribute("data-dark-theme", "dark")
-            });
-          })()
-          </script>
-        `
-      }
-      return `${body}`
-    },
-    // https://storybook.js.org/docs/react/configure/frameworks
-    framework: {
-      name: '@storybook/react-webpack5',
-      options: {
-        fastRefresh: false,
-        strictMode: false,
-        legacyRootApi: false,
-      },
-    },
-
-    // https://storybook.js.org/docs/react/api/main-config-stories
-    stories: [storiesBasePath],
-
-    // https://storybook.js.org/docs/react/api/main-config-addons
-    // https://storybook.js.org/docs/react/addons/introduction
-    // https://storybook.js.org/integrations
-    addons: [
-      // https://storybook.js.org/addons/@storybook/addon-a11y
-      '@storybook/addon-a11y',
-
-      // included by default in @storybook/addon-essentials
-      // https://storybook.js.org/docs/react/essentials/actions
-      // https://storybook.js.org/addons/@storybook/addon-actions
-      // '@storybook/addon-actions',
-
-      // included by default in @storybook/addon-essentials
-      // https://storybook.js.org/docs/react/essentials/backgrounds
-      // https://storybook.js.org/addons/@storybook/addon-backgrounds
-      // '@storybook/addon-backgrounds',
-
-      // https://storybook.js.org/addons/chromatic
-      // chromatic
-
-      // included by default in @storybook/addon-essentials
-      // https://storybook.js.org/docs/react/essentials/controls
-      // https://storybook.js.org/addons/@storybook/addon-controls
-      // '@storybook/addon-controls',
-
-      // https://storybook.js.org/addons/storybook-addon-designs
-      // storybook-addon-designs
-
-      // included by default in @storybook/addon-essentials
-      // https://storybook.js.org/docs/react/essentials/docs (404)
-      // https://storybook.js.org/addons/@storybook/addon-docs
-      // {
-      //   name: '@storybook/addon-docs',
-      //   options: {
-      //     jsxOptions: {},
-      //     csfPluginOptions: null,
-      //     mdxPluginOptions: {},
-      //     transcludeMarkdown: true,
-      //   },
-      // },
-
-      // https://storybook.js.org/docs/react/essentials/introduction
-      // https://storybook.js.org/integrations/tag/essentials
-      // '@storybook/addon-essentials',
-
-      // included by default in @storybook/addon-essentials
-      // https://storybook.js.org/docs/react/essentials/highlight (404)
-      // https://storybook.js.org/addons/@storybook/addon-highlight
-      // '@storybook/addon-highlight',
-
-      // https://storybook.js.org/addons/@storybook/addon-interactions
-      // '@storybook/addon-interactions',
-
-      // https://storybook.js.org/addons/@storybook/addon-jest
-      '@storybook/addon-jest',
-
-      // https://storybook.js.org/addons/@storybook/addon-links
-      '@storybook/addon-links',
-
-      // https://storybook.js.org/addons/msw-storybook-addon
-      // msw-storybook-addon
-
-      // included by default in @storybook/addon-essentials
-      // https://storybook.js.org/docs/react/essentials/measure-and-outline
-      // https://storybook.js.org/addons/@storybook/addon-measure
-      // https://storybook.js.org/addons/@storybook/addon-outline
-      // '@storybook/addon-measure',
-      // '@storybook/addon-outline',
-
-      // included by default in @storybook/addon-essentials
-      // https://storybook.js.org/docs/react/essentials/toolbars-and-globals
-      // https://storybook.js.org/addons/@storybook/addon-toolbars
-      // '@storybook/addon-toolbars',
-
-      // included by default in @storybook/addon-essentials
-      // https://storybook.js.org/docs/react/essentials/viewport
-      // https://storybook.js.org/addons/@storybook/addon-viewport
-      // '@storybook/addon-viewport',
-
-      '@chromatic-com/storybook',
-
-      // https://storybook.js.org/addons/@storybook/addon-styling-webpack
-      '@storybook/addon-styling-webpack',
-
-      // https://storybook.js.org/addons/@storybook/addon-themes
-      '@storybook/addon-themes',
-
-      '@storybook/addon-webpack5-compiler-babel',
-    ],
-
-    // https://storybook.js.org/docs/react/api/main-config-babel
-    // ...
-
-    // https://storybook.js.org/docs/react/api/main-config-babel-default
-    // ...
-
-    // https://storybook.js.org/docs/react/api/main-config-core
-    // https://storybook.js.org/docs/api/main-config/main-config-core#builder
-    core: { builder: { name: '@storybook/builder-webpack5', options: null } },
-
-    // https://storybook.js.org/docs/react/api/main-config-docs
-    // https://storybook.js.org/docs/react/writing-docs/autodocs
-    // https://storybook.js.org/docs/react/writing-docs/mdx
-    // https://storybook.js.org/docs/writing-docs/autodocs
-    docs: { defaultName: 'Documentation', docsMode: false },
-
-    // https://storybook.js.org/docs/react/api/main-config-env
-    // ...
-
-    // https://storybook.js.org/docs/react/api/main-config-features
-    // ...
-
-    // https://storybook.js.org/docs/react/api/main-config-log-level
-    logLevel: 'debug',
-
-    // https://storybook.js.org/docs/react/api/main-config-manager-head
-    // ...
-
-    // https://storybook.js.org/docs/react/api/main-config-preview-annotations
-    // ...
-
-    // https://storybook.js.org/docs/react/api/main-config-preview-body
-    // ...
-
-    // https://storybook.js.org/docs/react/api/main-config-preview-head
-    // ...
-
-    // https://storybook.js.org/docs/react/api/main-config-refs
-    // ...
-
-    // https://storybook.js.org/docs/react/api/main-config-static-dirs
-    // ...
-
-    // https://storybook.js.org/docs/react/api/main-config-typescript
-    // ...
-
-    // https://storybook.js.org/docs/react/api/main-config-webpack-final
-    webpackFinal: async (config, { configType }) => {
-      // @ts-ignore
-      const fileLoaderRuleSVG = config.module.rules.find((rule) => !isEmptyObject(rule) && rule.test.test?.('.svg'))
-      // @ts-ignore
-      fileLoaderRuleSVG.exclude = /\.svg$/
-
-      config.module.rules = config.module.rules.concat([
-        {
-          test: /\.(css|scss)$/,
-          use: [
-            {
-              loader: 'style-loader',
-            },
-            {
-              loader: 'css-loader',
-              options: {
-                importLoaders: 2,
-                sourceMap: true,
-                modules: {
-                  localIdentName: '[name]__[local]___[hash:base64:5]',
-                  /* https://webpack.js.org/loaders/css-loader/#exportlocalsconvention */
-                  exportLocalsConvention: 'as-is',
-                },
-                /* https://stackoverflow.com/questions/78589664/style-loader-does-not-recoginize-default-imports-of-css-modules-in-storybooks */
-                esModule: false,
-              },
-            },
-            {
-              loader: 'postcss-loader',
-              options: {
-                postcssOptions: {
-                  sourceMap: true,
-                  plugins: () => [require('postcss-preset-env')()],
-                  parser: 'postcss-scss',
-                },
-              },
-            },
-            {
-              loader: 'sass-loader',
-              options: {
-                sassOptions: {
-                  includePaths: [modulesBasePath],
-                  // https://sass-lang.com/documentation/js-api/interfaces/options/#quietDeps
-                  // https://sass-lang.com/documentation/js-api/interfaces/options/#silenceDeprecations
-                  // https://sass-lang.com/documentation/js-api/interfaces/deprecations/
-                  quietDeps: true,
-                  silenceDeprecations: ['import', 'global-builtin'],
-                },
-              },
-            },
-          ],
-        },
-        {
-          test: /\.svg$/i,
-          issuer: /\.[jt]sx?$/,
-          use: ['@svgr/webpack'],
-        },
-        {
-          test: /\.int.story\.mdx$/,
-          use: [
-            {
-              loader: 'babel-loader',
-              options: {
-                plugins: ['@babel/plugin-transform-react-jsx'],
-              },
-            },
-            {
-              loader: '@mdx-js/loader',
-              options: {},
-            },
-          ],
-        },
-        getBabelLoaderAdvancedSetup(),
-      ])
-      config.plugins.push(
-        new webpack.ProvidePlugin({
-          process: 'process/browser',
-        }),
-      )
-
-      config.resolve.fallback = {
-        ...config.resolve.fallback,
-        tty: require.resolve('tty-browserify'),
-      }
-
-      return config
-    },
-    typescript: {
-      reactDocgen: 'react-docgen-typescript',
-      check: true,
-    },
-  }
-}

package/storybook/managerSetup.ts

@@ -1,9 +0,0 @@
-import { addons } from 'storybook/manager-api'
-import { create } from 'storybook/theming'
-
-export function setStorybookManagerSetup({ panelPosition, theme }) {
-  addons.setConfig({
-    panelPosition,
-    theme: create(theme),
-  })
-}

package/storybook/previewSetup.tsx

@@ -1,50 +0,0 @@
-import { MemoryRouter } from 'react-router-dom'
-import { DocsPage, DocsContainer } from '@storybook/addon-docs/blocks'
-
-export function getStorybookPreviewSetup({ parameters: { a11y, decorators, docs } }) {
-  let parameters = {}
-
-  if (a11y) {
-    parameters = {
-      ...parameters,
-      a11y: {
-        ...{
-          // optional selector which element to inspect
-          // element: '#root',
-          // axe-core configurationOptions (https://github.com/dequelabs/axe-core/blob/develop/doc/API.md#parameters-1)
-          config: {},
-          // axe-core optionsParameter (https://github.com/dequelabs/axe-core/blob/develop/doc/API.md#options-parameter)
-          options: {},
-          // optional flag to prevent the automatic check
-          // manual: true,
-        },
-      },
-    }
-  }
-
-  if (decorators) {
-    parameters = {
-      ...parameters,
-      decorators: [
-        ...[
-          (Story) => (
-            <MemoryRouter>
-              <Story />
-            </MemoryRouter>
-          ),
-        ],
-      ],
-    }
-  }
-
-  if (docs) {
-    parameters = {
-      ...parameters,
-      docs: {
-        ...{ container: DocsContainer, page: DocsPage },
-      },
-    }
-  }
-
-  return { parameters }
-}

package/webpack/constant/index.ts

@@ -1,24 +0,0 @@
-export const coreJSVersion = '3.46.0'
-
-export const targetBrowsers = {
-  production: ['> 1%', 'last 2 versions', 'Firefox ESR'],
-  legacyBrowsers: ['> 1%', 'last 2 versions', 'Firefox ESR'],
-  modernBrowsers: [
-    'last 2 Chrome versions',
-    'not Chrome < 60',
-    'last 2 Safari versions',
-    'not Safari < 10.1',
-    'last 2 iOS versions',
-    'not iOS < 10.3',
-    'last 2 Firefox versions',
-    'not Firefox < 54',
-    'last 2 Edge versions',
-    'not Edge < 15',
-  ],
-}
-
-export const manifestFileName = 'manifest.json'
-
-export const indexHTMLName = 'index.html'
-
-export const extensions = ['.js', '.jsx', '.json', '.scss']

package/webpack/index.ts

@@ -1,27 +0,0 @@
-export { getBabelLoaderAdvancedSetup } from './loader/babelLoader'
-export { getCSSLoaderStandardSetup } from './loader/cssLoader'
-export { getFontLoaderStandardSetup } from './loader/fontLoader'
-export { getImageLoaderStandardSetup } from './loader/imageLoader'
-export { getMarkdownLoaderStandardSetup } from './loader/markdownLoader'
-export { getPostCSSLoaderStandardSetup } from './loader/postCSSLoader'
-export { getSassLoaderStandardSetup } from './loader/sassLoader'
-export { getSVGRLoaderStandardSetup, getSVGRLoaderAdvancedSetup } from './loader/svgrLoader'
-export { getBannerPluginStandardSetup } from './plugin/bannerPlugin'
-export { getCleanWebpackPluginStandardSetup, getCleanWebpackPluginAdvancedSetup } from './plugin/cleanWebpackPlugin'
-export { getCopyWebpackPluginStandardSetup } from './plugin/copyWebpackPlugin'
-export { getCSSMinimizerWebpackPluginStandardSetup } from './plugin/cssMinimizerWebpackPlugin'
-export { getDotenvWebpackStandardSetup, getDotenvWebpackAdvancedSetup } from './plugin/dotenvWebpack'
-export { getHotModuleReplacementPluginStandardSetup } from './plugin/hotModuleReplacementPlugin'
-export { getHtmlWebpackPluginStandardSetup, getHtmlWebpackPluginAdvancedSetup } from './plugin/htmlWebpackPlugin'
-export {
-  MiniCSSExtractPluginLoader,
-  getMiniCSSExtractPluginStandardSetup,
-  getMiniCSSExtractPluginAdvancedSetup,
-} from './plugin/miniCSSExtractPlugin'
-export { getModuleConcatenationPluginStandardSetup } from './plugin/moduleConcatenationPlugin'
-export { getWebpackBundleAnalyzerStandardSetup } from './plugin/webpackBundleAnalyzer'
-export { getWebpackManifestPluginStandardSetup } from './plugin/webpackManifestPlugin'
-export { getDevServerStandardSetup } from './server/devServer'
-export { getWebpackCommonSetup } from './setup/commonSetup'
-export { getWebpackDevelopmentSetup } from './setup/developmentSetup'
-export { getWebpackProductionSetup } from './setup/productionSetup'

package/webpack/loader/babelLoader.ts

@@ -1,38 +0,0 @@
-// https://github.com/babel/babel-loader
-
-import { coreJSVersion, targetBrowsers } from '../constant'
-
-export function getBabelLoaderAdvancedSetup() {
-  return {
-    test: /\.(js|jsx)$/,
-    exclude: /node_modules/,
-    use: {
-      loader: 'babel-loader',
-      options: {
-        presets: [
-          [
-            '@babel/preset-env',
-            {
-              modules: false,
-              useBuiltIns: 'entry',
-              corejs: coreJSVersion,
-              targets: { browsers: Object.values(targetBrowsers.modernBrowsers) },
-            },
-          ],
-          '@babel/preset-react',
-          '@babel/preset-typescript',
-        ],
-        plugins: [
-          [
-            '@babel/plugin-transform-react-jsx',
-            {
-              runtime: 'automatic',
-            },
-          ],
-          '@babel/plugin-transform-runtime',
-          'syntax-async-functions',
-        ],
-      },
-    },
-  }
-}

package/webpack/loader/cssLoader.ts

@@ -1,13 +0,0 @@
-// https://github.com/webpack-contrib/css-loader
-
-export function getCSSLoaderStandardSetup({ sourceMap, modules, esModule }) {
-  return {
-    loader: 'css-loader',
-    options: {
-      importLoaders: 2,
-      sourceMap,
-      modules,
-      esModule,
-    },
-  }
-}

package/webpack/loader/fontLoader.ts

@@ -1,8 +0,0 @@
-// https://webpack.js.org/guides/asset-management/#loading-fonts
-
-export function getFontLoaderStandardSetup() {
-  return {
-    test: /\.(woff|woff2|eot|ttf|otf)$/i,
-    type: 'asset/resource',
-  }
-}

package/webpack/loader/imageLoader.ts

@@ -1,8 +0,0 @@
-// https://webpack.js.org/guides/asset-management/#loading-images
-
-export function getImageLoaderStandardSetup() {
-  return {
-    test: /\.(png|jpg|jpeg|gif)$/i,
-    type: 'asset/resource',
-  }
-}

package/webpack/loader/markdownLoader.ts

@@ -1,17 +0,0 @@
-// https://github.com/webpack-contrib/html-loader
-// https://github.com/peerigon/markdown-loader
-
-export function getMarkdownLoaderStandardSetup() {
-  return {
-    test: /\.md$/,
-    use: [
-      {
-        loader: 'html-loader',
-      },
-      {
-        loader: 'markdown-loader',
-        options: {},
-      },
-    ],
-  }
-}

package/webpack/loader/postCSSLoader.ts

@@ -1,14 +0,0 @@
-// https://github.com/webpack-contrib/postcss-loader
-
-export function getPostCSSLoaderStandardSetup() {
-  return {
-    loader: 'postcss-loader',
-    options: {
-      postcssOptions: {
-        sourceMap: true,
-        plugins: () => ['postcss-preset-env'],
-        parser: 'postcss-scss',
-      },
-    },
-  }
-}

package/webpack/loader/svgrLoader.ts

@@ -1,17 +0,0 @@
-// https://github.com/gregberge/svgr/tree/main/packages/webpack
-
-export function getSVGRLoaderStandardSetup() {
-  return {
-    test: /\.svg$/,
-    use: ['@svgr/webpack'],
-  }
-}
-
-export function getSVGRLoaderAdvancedSetup() {
-  return {
-    test: /\.svg$/i,
-    issuer: /\.[jt]sx?$/,
-    resourceQuery: { not: [/url/] },
-    use: ['@svgr/webpack'],
-  }
-}

package/webpack/plugin/bannerPlugin.ts

@@ -1,18 +0,0 @@
-// https://webpack.js.org/plugins/banner-plugin/
-
-import webpack from 'webpack'
-
-export function getBannerPluginStandardSetup(packageJSON) {
-  return new webpack.BannerPlugin({
-    banner: [
-      '/*!',
-      ` * @project        ${packageJSON.name}`,
-      ' * @name           [filebase]',
-      ` * @author         ${packageJSON.author.name}`,
-      ` * @copyright      Copyright (c) ${new Date().getFullYear()} ${packageJSON.author.name}`,
-      ' */',
-      '',
-    ].join('\n'),
-    raw: true,
-  })
-}

package/webpack/plugin/cleanWebpackPlugin.ts

@@ -1,27 +0,0 @@
-// https://github.com/johnagan/clean-webpack-plugin
-
-import { CleanWebpackPlugin } from 'clean-webpack-plugin'
-
-export function getCleanWebpackPluginStandardSetup() {
-  return new CleanWebpackPlugin()
-}
-
-export function getCleanWebpackPluginAdvancedSetup({
-  dry,
-  verbose,
-  cleanStaleWebpackAssets,
-  protectWebpackAssets,
-  cleanOnceBeforeBuildPatterns,
-  cleanAfterEveryBuildPatterns,
-  dangerouslyAllowCleanPatternsOutsideProject,
-}) {
-  return new CleanWebpackPlugin({
-    dry,
-    verbose,
-    cleanStaleWebpackAssets,
-    protectWebpackAssets,
-    cleanOnceBeforeBuildPatterns,
-    cleanAfterEveryBuildPatterns,
-    dangerouslyAllowCleanPatternsOutsideProject,
-  })
-}

package/webpack/plugin/copyWebpackPlugin.ts

@@ -1,18 +0,0 @@
-// https://github.com/webpack-contrib/copy-webpack-plugin
-
-import CopyWebpackPlugin from 'copy-webpack-plugin'
-
-export function getCopyWebpackPluginStandardSetup({ from, to }) {
-  return new CopyWebpackPlugin({
-    patterns: [
-      {
-        from,
-        to,
-        globOptions: {
-          ignore: ['*.DS_Store'],
-        },
-        noErrorOnMissing: true,
-      },
-    ],
-  })
-}

package/webpack/plugin/cssMinimizerWebpackPlugin.ts

@@ -1,7 +0,0 @@
-// https://github.com/webpack-contrib/css-minimizer-webpack-plugin
-
-import CSSMinimizerWebpackPlugin from 'css-minimizer-webpack-plugin'
-
-export function getCSSMinimizerWebpackPluginStandardSetup() {
-  return new CSSMinimizerWebpackPlugin()
-}

package/webpack/plugin/dotenvWebpack.ts

@@ -1,19 +0,0 @@
-// https://github.com/mrsteele/dotenv-webpack
-
-import DotenvWebpack from 'dotenv-webpack'
-
-export function getDotenvWebpackStandardSetup({ path }) {
-  return new DotenvWebpack({ path })
-}
-
-export function getDotenvWebpackAdvancedSetup({ path, safe, allowEmptyValues, systemvars, silent, defaults, prefix }) {
-  return new DotenvWebpack({
-    path,
-    safe,
-    allowEmptyValues,
-    systemvars,
-    silent,
-    defaults,
-    prefix,
-  })
-}

package/webpack/plugin/hotModuleReplacementPlugin.ts

@@ -1,7 +0,0 @@
-// https://webpack.js.org/plugins/hot-module-replacement-plugin/
-
-import webpack from 'webpack'
-
-export function getHotModuleReplacementPluginStandardSetup() {
-  return new webpack.HotModuleReplacementPlugin()
-}

package/webpack/plugin/htmlWebpackPlugin.ts

@@ -1,25 +0,0 @@
-// https://github.com/jantimon/html-webpack-plugin
-
-import HtmlWebpackPlugin from 'html-webpack-plugin'
-import { indexHTMLName } from '../constant'
-
-export function getHtmlWebpackPluginStandardSetup({ title, micrositeWebpackFolderPath }) {
-  return new HtmlWebpackPlugin({
-    title,
-    meta: { viewport: 'width=device-width, initial-scale=1, shrink-to-fit=no' },
-    template: `${micrositeWebpackFolderPath}/${indexHTMLName}`,
-    filename: indexHTMLName,
-    inject: 'body',
-    scriptLoading: 'defer',
-  })
-}
-export function getHtmlWebpackPluginAdvancedSetup({ title, meta, template, filename, inject, scriptLoading }) {
-  return new HtmlWebpackPlugin({
-    title,
-    meta,
-    template,
-    filename,
-    inject,
-    scriptLoading,
-  })
-}

package/webpack/plugin/miniCSSExtractPlugin.ts

@@ -1,16 +0,0 @@
-// https://github.com/webpack-contrib/mini-css-extract-plugin
-
-import MiniCssExtractPlugin from 'mini-css-extract-plugin'
-
-export const MiniCSSExtractPluginLoader = MiniCssExtractPlugin.loader
-
-export function getMiniCSSExtractPluginStandardSetup() {
-  return new MiniCssExtractPlugin()
-}
-
-export function getMiniCSSExtractPluginAdvancedSetup() {
-  return new MiniCssExtractPlugin({
-    filename: 'styles/[name].[contenthash].css',
-    chunkFilename: '[id].css',
-  })
-}

package/webpack/plugin/moduleConcatenationPlugin.ts

@@ -1,7 +0,0 @@
-// https://webpack.js.org/plugins/module-concatenation-plugin/
-
-import webpack from 'webpack'
-
-export function getModuleConcatenationPluginStandardSetup() {
-  return new webpack.optimize.ModuleConcatenationPlugin()
-}