@umijs/plugins 4.0.87 → 4.0.89

package/dist/access.js

@@ -193,5 +193,3 @@ export type AccessInstance = ReturnType<typeof accessFactory>;
     (0, import_path.join)(api.paths.absSrcPath, "access.js")
   ]);
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {});

package/dist/analytics.js

@@ -116,5 +116,3 @@ var analytics_default = (api) => {
     return scripts.filter(Boolean);
   });
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {});

package/dist/antd.js

@@ -158,6 +158,9 @@ var antd_default = (api) => {
         );
       }
     }
+    if (antd.dark || antd.compact) {
+      antd.configProvider ?? (antd.configProvider = {});
+    }
     return memo;
   });
   api.chainWebpack((memo) => {
@@ -189,6 +192,10 @@ var antd_default = (api) => {
     }
     return [];
   });
+  const lodashPkg = (0, import_path.dirname)(require.resolve("lodash/package.json"));
+  const lodashPath = {
+    merge: (0, import_plugin_utils.winPath)((0, import_path.join)(lodashPkg, "merge"))
+  };
   api.onGenerateFiles(() => {
     var _a;
     const withConfigProvider = !!api.config.antd.configProvider;
@@ -218,44 +225,38 @@ var antd_default = (api) => {
         };
       }
     }
+    const configProvider = withConfigProvider && JSON.stringify(api.config.antd.configProvider);
+    const appConfig = appComponentAvailable && JSON.stringify(api.config.antd.appConfig);
+    const enableV5ThemeAlgorithm = isV5 && (userInputCompact || userInputDark) ? { compact: userInputCompact, dark: userInputDark } : false;
+    const hasConfigProvider = configProvider || enableV5ThemeAlgorithm;
+    const antdConfigSetter = isV5 && hasConfigProvider;
     api.writeTmpFile({
       path: `runtime.tsx`,
       context: {
-        configProvider: withConfigProvider && JSON.stringify(api.config.antd.configProvider),
-        appConfig: appComponentAvailable && JSON.stringify(api.config.antd.appConfig),
+        configProvider,
+        appConfig,
         styleProvider: styleProviderConfig,
         // 是否启用了 v5 的 theme algorithm
-        enableV5ThemeAlgorithm: isV5 && (userInputCompact || userInputDark) ? { compact: userInputCompact, dark: userInputDark } : false
+        enableV5ThemeAlgorithm,
+        antdConfigSetter,
+        lodashPath,
+        /**
+         * 是否重构了全局静态配置。 重构后需要在运行时将全局静态配置传入到 ConfigProvider 中。
+         * 实际上 4.13.0 重构后有一个 bug，真正的 warn 出现在 4.13.1，并且 4.13.1 修复了这个 bug。
+         * Resolve issue: https://github.com/umijs/umi/issues/10231
+         * `InternalStatic` 指 `Modal.config` 等静态方法，详见：https://github.com/ant-design/ant-design/pull/29285
+         */
+        disableInternalStatic: import_plugin_utils.semver.gt(antdVersion, "4.13.0")
       },
       tplPath: (0, import_plugin_utils.winPath)((0, import_path.join)(ANTD_TEMPLATES_DIR, "runtime.ts.tpl"))
     });
     api.writeTmpFile({
       path: "types.d.ts",
-      content: import_plugin_utils.Mustache.render(
-        `
-{{#withConfigProvider}}
-import type { ConfigProviderProps } from 'antd/es/config-provider';
-{{/withConfigProvider}}
-{{#withAppConfig}}
-import type { AppConfig } from 'antd/es/app/context';
-{{/withAppConfig}}
-
-type Prettify<T> = {
-  [K in keyof T]: T[K];
-} & {};
-
-type AntdConfig = Prettify<{}
-{{#withConfigProvider}}  & ConfigProviderProps{{/withConfigProvider}}
-{{#withAppConfig}}  & { appConfig: AppConfig }{{/withAppConfig}}
->;
-
-export type RuntimeAntdConfig = (memo: AntdConfig) => AntdConfig;
-`.trim(),
-        {
-          withConfigProvider,
-          withAppConfig
-        }
-      )
+      context: {
+        withConfigProvider,
+        withAppConfig
+      },
+      tplPath: (0, import_plugin_utils.winPath)((0, import_path.join)(ANTD_TEMPLATES_DIR, "types.d.ts.tpl"))
     });
     api.writeTmpFile({
       path: import_umi.RUNTIME_TYPE_FILE_NAME,
@@ -266,6 +267,34 @@ export type IRuntimeConfig = {
 };
       `
     });
+    if (antdConfigSetter) {
+      api.writeTmpFile({
+        path: "index.tsx",
+        content: `import React from 'react';
+import { AntdConfigContext, AntdConfigContextSetter } from './context';
+
+export function useAntdConfig() {
+  return React.useContext(AntdConfigContext);
+}
+
+export function useAntdConfigSetter() {
+  return React.useContext(AntdConfigContextSetter);
+}`
+      });
+      api.writeTmpFile({
+        path: "context.tsx",
+        content: `import React from 'react';
+import type { ConfigProviderProps } from 'antd/es/config-provider';
+
+export const AntdConfigContext = React.createContext<ConfigProviderProps>(null!);
+export const AntdConfigContextSetter = React.createContext<React.Dispatch<React.SetStateAction<ConfigProviderProps>>>(
+  () => {
+    console.error(\`The 'useAntdConfigSetter()' method depends on the antd 'ConfigProvider', requires one of 'antd.configProvider' / 'antd.dark' / 'antd.compact' to be enabled.\`);
+  }
+);
+`
+      });
+    }
   });
   api.addRuntimePlugin(() => {
     if (api.config.antd.styleProvider || api.config.antd.configProvider || appComponentAvailable && api.config.antd.appConfig) {

package/dist/confetti.js

@@ -62,5 +62,3 @@ var confetti_default = (api) => {
     }
   });
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {});

package/dist/dva.js

@@ -101,7 +101,7 @@ export interface IRuntimeConfig {
       tpl: `
 // It's faked dva
 // aliased to @umijs/plugins/templates/dva
-import { create, Provider } from 'dva';
+import { create, Provider } from '${(0, import_utils.winPath)(pkgPath)}';
 import createLoading from '${(0, import_utils.winPath)(require.resolve("dva-loading"))}';
 ${((_a = api.config.dva) == null ? void 0 : _a.immer) ? `
 import dvaImmer, { enableES5, enableAllPlugins } from '${(0, import_utils.winPath)(
@@ -177,7 +177,9 @@ export function dataflowProvider(container, opts) {
     api.writeTmpFile({
       path: "index.ts",
       content: `
-export { connect, useDispatch, useStore, useSelector } from 'dva';
+export { connect, useDispatch, useStore, useSelector } from '${(0, import_utils.winPath)(
+        pkgPath
+      )}';
 export { getDvaApp } from './dva';
 `
     });

package/dist/initial-state.js

@@ -146,5 +146,3 @@ export interface IRuntimeConfig {
     });
   });
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {});

package/dist/model.js

@@ -108,5 +108,3 @@ async function getAllModels(api) {
     extraModels: [...extraModels, ...api.config.model.extraModels || []]
   });
 }
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {});

package/dist/moment2dayjs.js

@@ -123,5 +123,3 @@ dayjs.extend(antdPlugin);
   });
   api.addEntryCodeAhead(() => [`import './plugin-moment2dayjs/runtime.tsx'`]);
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {});

package/dist/qiankun/slave.js

@@ -173,7 +173,9 @@ export interface IRuntimeConfig {
   });
   api.chainWebpack((config) => {
     (0, import_assert.default)(api.pkg.name, "You should have name in package.json.");
-    const { shouldNotAddLibraryChunkName = api.env === "production" || !Boolean(api.config.mfsu) } = (api.config.qiankun || {}).slave;
+    const {
+      shouldNotAddLibraryChunkName = api.env === "production" || !Boolean(api.config.mfsu)
+    } = (api.config.qiankun || {}).slave;
     config.output.libraryTarget("umd").library(
       shouldNotAddLibraryChunkName ? api.pkg.name : `${api.pkg.name}-[name]`
     );

package/dist/qiankun.js

@@ -50,5 +50,3 @@ var qiankun_default = (api) => {
     require.resolve("./qiankun/slave")
   ]);
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {});

package/dist/react-query.js

@@ -155,5 +155,3 @@ export type {
     });
   });
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {});

package/dist/request.js

@@ -374,5 +374,3 @@ export type IRuntimeConfig = {
     });
   });
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {});

package/dist/styled-components.js

@@ -34,6 +34,7 @@ __export(styled_components_exports, {
 module.exports = __toCommonJS(styled_components_exports);
 var import_utils = require("@umijs/utils");
 var import_path = require("path");
+var import_resolveProjectDep = require("./utils/resolveProjectDep");
 var import_withTmpPath = require("./utils/withTmpPath");
 var styled_components_default = (api) => {
   api.describe({
@@ -47,12 +48,31 @@ var styled_components_default = (api) => {
     },
     enableBy: api.EnableBy.config
   });
-  api.modifyBabelPresetOpts((memo) => {
-    if (api.env === "development") {
-      memo.pluginStyledComponents = {
-        ...api.config.styledComponents.babelPlugin
-      };
+  api.modifyConfig((memo) => {
+    var _a, _b;
+    if (api.userConfig.mako || process.env.OKAM) {
+      return memo;
     }
+    const isProd = api.env === "production";
+    const pluginConfig = {
+      // https://github.com/styled-components/babel-plugin-styled-components/blob/f8e9fb480d1645be8be797d73e49686bdf98975b/src/utils/options.js#L11
+      topLevelImportPaths: [
+        "@umijs/max",
+        "@alipay/bigfish",
+        "umi",
+        "alita",
+        "@kmi/kmi"
+      ],
+      ...isProd ? {
+        displayName: false
+      } : {},
+      ...((_a = api.config.styledComponents) == null ? void 0 : _a.babelPlugin) || {},
+      ...((_b = api.userConfig.styledComponents) == null ? void 0 : _b.babelPlugin) || {}
+    };
+    memo.extraBabelPlugins = [
+      ...memo.extraBabelPlugins || [],
+      [require.resolve("babel-plugin-styled-components"), pluginConfig]
+    ];
     return memo;
   });
   api.addRuntimePlugin(() => {
@@ -61,9 +81,22 @@ var styled_components_default = (api) => {
   api.addRuntimePluginKey(() => {
     return ["styledComponents"];
   });
-  const libPath = (0, import_path.dirname)(require.resolve("styled-components/package"));
+  const SC_NAME = `styled-components`;
+  let libPath;
+  try {
+    libPath = (0, import_resolveProjectDep.resolveProjectDep)({
+      pkg: api.pkg,
+      cwd: api.cwd,
+      dep: SC_NAME
+    }) || (0, import_path.dirname)(require.resolve(`${SC_NAME}/package.json`));
+  } catch (e) {
+  }
+  api.modifyConfig((memo) => {
+    memo.alias[SC_NAME] = libPath;
+    return memo;
+  });
   api.onGenerateFiles(() => {
-    var _a;
+    var _a, _b, _c;
     api.writeTmpFile({
       path: "index.tsx",
       content: `
@@ -76,22 +109,41 @@ export { styled, ThemeProvider, createGlobalStyle, css, keyframes, StyleSheetMan
     const styledComponentsRuntimeCode = ((_a = api.appData.appJS) == null ? void 0 : _a.exports.includes(
       "styledComponents"
     )) ? `import { styledComponents as styledComponentsConfig } from '@/app';` : `const styledComponentsConfig = {};`;
+    const isLegacy = !import_utils.lodash.isEmpty((_b = api.config.targets) == null ? void 0 : _b.ie) || api.config.legacy;
+    const disableCSSOM = !!((_c = api.config.qiankun) == null ? void 0 : _c.slave);
+    const providerOptions = {
+      // https://styled-components.com/docs/faqs#vendor-prefixes-are-omitted-by-default
+      ...isLegacy ? { enableVendorPrefixes: true } : {},
+      ...disableCSSOM ? { disableCSSOMInjection: true } : {}
+    };
+    const hasProvider = !import_utils.lodash.isEmpty(providerOptions);
     api.writeTmpFile({
       path: "runtime.tsx",
       content: `
+${hasProvider ? `import { StyleSheetManager } from '${(0, import_utils.winPath)(libPath)}';` : ``}
+
 ${styledComponentsRuntimeCode}
 export function rootContainer(container) {
-  const globalStyle = styledComponentsConfig.GlobalStyle ? <styledComponentsConfig.GlobalStyle /> : null;
-  return (
+  const scConfig =
+    typeof styledComponentsConfig === 'function'
+      ? styledComponentsConfig()
+      : styledComponentsConfig;
+  const globalStyle = scConfig.GlobalStyle ? <scConfig.GlobalStyle /> : null;
+  const inner = (
     <>
       {globalStyle}
       {container}
     </>
   );
+  ${hasProvider ? `
+  return (
+    <StyleSheetManager {...${JSON.stringify(providerOptions)}}>
+      {inner}
+    </StyleSheetManager>
+  );
+  ` : "return inner;"}
 }
       `
     });
   });
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {});

package/dist/tailwindcss.js

@@ -104,5 +104,3 @@ function getTailwindBinPath(opts) {
   const tailwindPath = require(pkgPath).bin["tailwind"];
   return (0, import_path.join)((0, import_path.dirname)(pkgPath), tailwindPath);
 }
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {});

package/dist/unocss.js

@@ -69,5 +69,3 @@ var unocss_default = (api) => {
     return [{ source: generatedPath }];
   });
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umijs/plugins",
-  "version": "4.0.87",
+  "version": "4.0.89",
   "description": "@umijs/plugins",
   "homepage": "https://github.com/umijs/umi/tree/master/packages/plugins#readme",
   "bugs": "https://github.com/umijs/umi/issues",
@@ -28,6 +28,7 @@
     "antd-dayjs-webpack-plugin": "^1.0.6",
     "axios": "^0.27.2",
     "babel-plugin-import": "^1.13.6",
+    "babel-plugin-styled-components": "2.1.4",
     "dayjs": "^1.11.7",
     "dva-core": "^2.0.4",
     "dva-immer": "^1.0.0",
@@ -41,15 +42,15 @@
     "react-intl": "3.12.1",
     "react-redux": "^8.0.5",
     "redux": "^4.2.1",
-    "styled-components": "6.0.0-rc.0",
+    "styled-components": "6.1.1",
     "tslib": "^2",
     "warning": "^4.0.3",
-    "@umijs/valtio": "1.0.4",
-    "@umijs/bundler-utils": "4.0.87"
+    "@umijs/bundler-utils": "4.0.89",
+    "@umijs/valtio": "1.0.4"
   },
   "devDependencies": {
     "antd": "^4.24.1",
-    "umi": "4.0.87"
+    "umi": "4.0.89"
   },
   "publishConfig": {
     "access": "public"

package/templates/antd/runtime.ts.tpl

@@ -1,12 +1,14 @@
 import React from 'react';
 import {
-  Modal,
   ConfigProvider,
 {{#appConfig}}
   App,
 {{/appConfig}}
+{{^disableInternalStatic}}
+  Modal,
   message,
   notification,
+{{/disableInternalStatic}}
 {{#enableV5ThemeAlgorithm}}
   theme,
 {{/enableV5ThemeAlgorithm}}
@@ -21,6 +23,10 @@ import {
 } from '{{{styleProvider.cssinjs}}}';
 {{/styleProvider}}
 import { getPluginManager } from '../core/plugin';
+{{#antdConfigSetter}}
+import { AntdConfigContext, AntdConfigContextSetter } from './context';
+import merge from '{{{lodashPath.merge}}}'
+{{/antdConfigSetter}}
 
 let cacheAntdConfig = null;
 
@@ -42,63 +48,80 @@ const getAntdConfig = () => {
   return cacheAntdConfig;
 }
 
-export function rootContainer(rawContainer) {
-  const {
-    appConfig,
-    ...finalConfigProvider
-  } = getAntdConfig();
-  let container = rawContainer;
+function AntdProvider({ children }) {
+  let container = children;
+
+  const [antdConfig, _setAntdConfig] = React.useState(() => {
+    const {
+      appConfig: _,
+      ...finalConfigProvider
+    } = getAntdConfig();
+    {{#enableV5ThemeAlgorithm}}
+      finalConfigProvider.theme ??= {};
+      finalConfigProvider.theme.algorithm ??= [];
+      if (!Array.isArray(finalConfigProvider.theme.algorithm)) {
+        finalConfigProvider.theme.algorithm = [finalConfigProvider.theme.algorithm];
+      }
+      const algorithm = finalConfigProvider.theme.algorithm;
+      {{#enableV5ThemeAlgorithm.compact}}
+      if (!algorithm.includes(theme.compactAlgorithm)) {
+        algorithm.push(theme.compactAlgorithm);
+      }
+      {{/enableV5ThemeAlgorithm.compact}}
+      {{#enableV5ThemeAlgorithm.dark}}
+      if (!algorithm.includes(theme.darkAlgorithm)) {
+        algorithm.push(theme.darkAlgorithm);
+      }
+      {{/enableV5ThemeAlgorithm.dark}}
+    {{/enableV5ThemeAlgorithm}}
+    return finalConfigProvider
+  });
+  const setAntdConfig: typeof _setAntdConfig = (newConfig) => {
+    _setAntdConfig(prev => {
+      return merge({}, prev, typeof newConfig === 'function' ? newConfig(prev) : newConfig)
+    })
+  }
 
 {{#configProvider}}
-  if (finalConfigProvider.prefixCls) {
+  {{^disableInternalStatic}}
+  if (antdConfig.prefixCls) {
     Modal.config({
-      rootPrefixCls: finalConfigProvider.prefixCls
+      rootPrefixCls: antdConfig.prefixCls
     });
     message.config({
-      prefixCls: `${finalConfigProvider.prefixCls}-message`
+      prefixCls: `${antdConfig.prefixCls}-message`
     });
     notification.config({
-      prefixCls: `${finalConfigProvider.prefixCls}-notification`
+      prefixCls: `${antdConfig.prefixCls}-notification`
     });
   }
+  {{/disableInternalStatic}}
 
-  if (finalConfigProvider.iconPrefixCls) {
+  {{#disableInternalStatic}}
+  if (antdConfig.prefixCls) {
+    ConfigProvider.config({
+      prefixCls: antdConfig.prefixCls,
+    });
+  };
+  {{/disableInternalStatic}}
+
+  if (antdConfig.iconPrefixCls) {
     // Icons in message need to set iconPrefixCls via ConfigProvider.config()
     ConfigProvider.config({
-      iconPrefixCls: finalConfigProvider.iconPrefixCls,
+      iconPrefixCls: antdConfig.iconPrefixCls,
     });
   };
 
-  if (finalConfigProvider.theme) {
+  if (antdConfig.theme) {
     // Pass config theme to static method
     ConfigProvider.config({
-      theme: finalConfigProvider.theme,
+      theme: antdConfig.theme,
     });
   }
 
-  container = <ConfigProvider {...finalConfigProvider}>{container}</ConfigProvider>;
+  container = <ConfigProvider {...antdConfig}>{container}</ConfigProvider>;
 {{/configProvider}}
 
-{{#enableV5ThemeAlgorithm}}
-  // Add token algorithm for antd5 only
-  container = (
-    <ConfigProvider
-      theme={({
-        algorithm: [
-          {{#enableV5ThemeAlgorithm.compact}}
-          theme.compactAlgorithm,
-          {{/enableV5ThemeAlgorithm.compact}}
-          {{#enableV5ThemeAlgorithm.dark}}
-          theme.darkAlgorithm,
-          {{/enableV5ThemeAlgorithm.dark}}
-        ],
-      })}
-    >
-      {container}
-    </ConfigProvider>
-  );
-{{/enableV5ThemeAlgorithm}}
-
 {{#styleProvider}}
   container = (
     <StyleProvider
@@ -114,9 +137,27 @@ export function rootContainer(rawContainer) {
   );
 {{/styleProvider}}
 
+{{#antdConfigSetter}}
+  container = (
+    <AntdConfigContextSetter.Provider value={setAntdConfig}>
+      <AntdConfigContext.Provider value={antdConfig}>
+        {container}
+      </AntdConfigContext.Provider>
+    </AntdConfigContextSetter.Provider>
+  )
+{{/antdConfigSetter}}
+
   return container;
 }
 
+export function rootContainer(children) {
+  return (
+    <AntdProvider>
+      {children}
+    </AntdProvider>
+  );
+}
+
 {{#appConfig}}
 // The App component should be under ConfigProvider
 // plugin-locale has other ConfigProvider

package/templates/antd/types.d.ts.tpl

@@ -0,0 +1,17 @@
+{{#withConfigProvider}}
+import type { ConfigProviderProps } from 'antd/es/config-provider';
+{{/withConfigProvider}}
+{{#withAppConfig}}
+import type { AppConfig } from 'antd/es/app/context';
+{{/withAppConfig}}
+
+type Prettify<T> = {
+  [K in keyof T]: T[K];
+} & {};
+
+type AntdConfig = Prettify<{}
+{{#withConfigProvider}}  & ConfigProviderProps{{/withConfigProvider}}
+{{#withAppConfig}}  & { appConfig: AppConfig }{{/withAppConfig}}
+>;
+
+export type RuntimeAntdConfig = (memo: AntdConfig) => AntdConfig;

package/templates/locale/SelectLang.tpl

@@ -284,7 +284,7 @@ const defaultLangUConfigMap = {
   },
   'nl-NL': {
     lang: 'nl-NL',
-    label: 'Vlaams',
+    label: 'Nederlands',
     icon: '🇳🇱',
     title: 'Taal'
   },

package/templates/locale/localeExports.tpl

@@ -51,11 +51,30 @@ import lang_{{lang}}{{country}}{{index}} from "{{{path}}}";
 {{/paths}}
 {{/LocaleList}}
 
+const flattenMessages=(
+  nestedMessages: Record<string, any>,
+  prefix = '',
+) => {
+  return Object.keys(nestedMessages).reduce(
+    (messages: Record<string, any>, key) => {
+      const value = nestedMessages[key];
+      const prefixedKey = prefix ? `${prefix}.${key}` : key;
+      if (typeof value === 'string') {
+        messages[prefixedKey] = value;
+      } else {
+        Object.assign(messages, flattenMessages(value, prefixedKey));
+      }
+      return messages;
+    },
+    {},
+  );
+}
+
 export const localeInfo: {[key: string]: any} = {
   {{#LocaleList}}
   '{{name}}': {
     messages: {
-      {{#paths}}...lang_{{lang}}{{country}}{{index}},{{/paths}}
+      {{#paths}}...flattenMessages(lang_{{lang}}{{country}}{{index}}),{{/paths}}
     },
     locale: '{{locale}}',
     {{#Antd}}antd: {