@rsbuild/plugin-svgr 1.0.2 → 1.0.4

package/dist/index.cjs

@@ -1,175 +1,216 @@
 "use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/index.ts
-var src_exports = {};
-__export(src_exports, {
-  PLUGIN_SVGR_NAME: () => PLUGIN_SVGR_NAME,
-  pluginSvgr: () => pluginSvgr
+// The require scope
+var __webpack_require__ = {};
+/************************************************************************/ // webpack/runtime/compat_get_default_export
+(()=>{
+    // getDefaultExport function for compatibility with non-harmony modules
+    __webpack_require__.n = function(module) {
+        var getter = module && module.__esModule ? function() {
+            return module['default'];
+        } : function() {
+            return module;
+        };
+        __webpack_require__.d(getter, {
+            a: getter
+        });
+        return getter;
+    };
+})();
+// webpack/runtime/define_property_getters
+(()=>{
+    __webpack_require__.d = function(exports1, definition) {
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+// webpack/runtime/has_own_property
+(()=>{
+    __webpack_require__.o = function(obj, prop) {
+        return Object.prototype.hasOwnProperty.call(obj, prop);
+    };
+})();
+// webpack/runtime/make_namespace_object
+(()=>{
+    // define __esModule on exports
+    __webpack_require__.r = function(exports1) {
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+/************************************************************************/ var __webpack_exports__ = {};
+// ESM COMPAT FLAG
+__webpack_require__.r(__webpack_exports__);
+// EXPORTS
+__webpack_require__.d(__webpack_exports__, {
+    PLUGIN_SVGR_NAME: ()=>/* binding */ PLUGIN_SVGR_NAME,
+    pluginSvgr: ()=>/* binding */ pluginSvgr
 });
-module.exports = __toCommonJS(src_exports);
-var import_node_path = __toESM(require("path"));
-var import_plugin_react = require("@rsbuild/plugin-react");
-var import_deepmerge = __toESM(require("deepmerge"));
-var SVG_REGEX = /\.svg$/;
-var getSvgoDefaultConfig = () => ({
-  plugins: [
-    {
-      name: "preset-default",
-      params: {
-        overrides: {
-          // viewBox is required to resize SVGs with CSS.
-          // @see https://github.com/svg/svgo/issues/1128
-          removeViewBox: false
-        }
-      }
-    },
-    "prefixIds"
-  ]
-});
-var dedupeSvgoPlugins = (config) => {
-  if (!config.plugins) {
-    return config;
-  }
-  let mergedPlugins = [];
-  for (const plugin of config.plugins) {
-    if (typeof plugin === "string") {
-      const exist = mergedPlugins.find(
-        (item) => item === plugin || typeof item === "object" && item.name === plugin
-      );
-      if (!exist) {
-        mergedPlugins.push(plugin);
-      }
-      continue;
-    }
-    const strIndex = mergedPlugins.findIndex(
-      (item) => typeof item === "string" && item === plugin.name
-    );
-    if (strIndex !== -1) {
-      mergedPlugins[strIndex] = plugin;
-      continue;
-    }
-    let isMerged = false;
-    mergedPlugins = mergedPlugins.map((item) => {
-      if (typeof item === "object" && item.name === plugin.name) {
-        isMerged = true;
-        return (0, import_deepmerge.default)(item, plugin);
-      }
-      return item;
+const external_node_path_namespaceObject = require("node:path");
+var external_node_path_default = /*#__PURE__*/ __webpack_require__.n(external_node_path_namespaceObject);
+const plugin_react_namespaceObject = require("@rsbuild/plugin-react");
+const external_deepmerge_namespaceObject = require("deepmerge");
+var external_deepmerge_default = /*#__PURE__*/ __webpack_require__.n(external_deepmerge_namespaceObject);
+const SVG_REGEX = /\.svg$/;
+const getSvgoDefaultConfig = ()=>({
+        plugins: [
+            {
+                name: 'preset-default',
+                params: {
+                    overrides: {
+                        // viewBox is required to resize SVGs with CSS.
+                        // @see https://github.com/svg/svgo/issues/1128
+                        removeViewBox: false
+                    }
+                }
+            },
+            'prefixIds'
+        ]
     });
-    if (!isMerged) {
-      mergedPlugins.push(plugin);
-    }
-  }
-  config.plugins = mergedPlugins;
-  return config;
-};
-var PLUGIN_SVGR_NAME = "rsbuild:svgr";
-var pluginSvgr = (options = {}) => ({
-  name: PLUGIN_SVGR_NAME,
-  pre: [import_plugin_react.PLUGIN_REACT_NAME],
-  setup(api) {
-    api.modifyBundlerChain(async (chain, { CHAIN_ID, environment }) => {
-      const { config } = environment;
-      const { dataUriLimit } = config.output;
-      const maxSize = typeof dataUriLimit === "number" ? dataUriLimit : dataUriLimit.svg;
-      let generatorOptions = {};
-      if (chain.module.rules.has(CHAIN_ID.RULE.SVG)) {
-        generatorOptions = chain.module.rules.get(CHAIN_ID.RULE.SVG).oneOfs.get(CHAIN_ID.ONE_OF.SVG_URL).get("generator");
-        chain.module.rules.delete(CHAIN_ID.RULE.SVG);
-      }
-      const rule = chain.module.rule(CHAIN_ID.RULE.SVG).test(SVG_REGEX);
-      const svgrOptions = (0, import_deepmerge.default)(
-        {
-          svgo: true,
-          svgoConfig: getSvgoDefaultConfig()
-        },
-        options.svgrOptions || {}
-      );
-      svgrOptions.svgoConfig = dedupeSvgoPlugins(svgrOptions.svgoConfig);
-      rule.oneOf(CHAIN_ID.ONE_OF.SVG_URL).type("asset/resource").resourceQuery(/(__inline=false|url)/).set("generator", generatorOptions);
-      rule.oneOf(CHAIN_ID.ONE_OF.SVG_INLINE).type("asset/inline").resourceQuery(/inline/);
-      rule.oneOf(CHAIN_ID.ONE_OF.SVG_REACT).type("javascript/auto").resourceQuery(options.query || /react/).use(CHAIN_ID.USE.SVGR).loader(import_node_path.default.resolve(__dirname, "./loader.cjs")).options({
-        ...svgrOptions,
-        exportType: "default"
-      }).end();
-      const { mixedImport = false } = options;
-      if (mixedImport || svgrOptions.exportType) {
-        const { exportType = mixedImport ? "named" : void 0 } = svgrOptions;
-        const issuerInclude = [
-          /\.(?:js|jsx|mjs|cjs|ts|tsx|mts|cts)$/,
-          /\.mdx$/
-        ];
-        const issuer = options.excludeImporter ? { and: [issuerInclude, { not: options.excludeImporter }] } : issuerInclude;
-        const svgRule = rule.oneOf(CHAIN_ID.ONE_OF.SVG);
-        if (options.exclude) {
-          svgRule.exclude.add(options.exclude);
-        }
-        svgRule.type("javascript/auto").set("issuer", issuer).use(CHAIN_ID.USE.SVGR).loader(import_node_path.default.resolve(__dirname, "./loader.cjs")).options({
-          ...svgrOptions,
-          exportType
-        }).end();
-        if (mixedImport && exportType === "named") {
-          svgRule.use(CHAIN_ID.USE.URL).loader(import_node_path.default.join(__dirname, "../compiled", "url-loader/index.js")).options({
-            limit: maxSize,
-            name: generatorOptions?.filename
-          });
-        }
-      }
-      rule.oneOf(CHAIN_ID.ONE_OF.SVG_ASSET).type("asset").parser({
-        // Inline SVG if size < maxSize
-        dataUrlCondition: {
-          maxSize
-        }
-      }).set("generator", generatorOptions);
-      const jsRule = chain.module.rules.get(CHAIN_ID.RULE.JS);
-      [CHAIN_ID.USE.SWC, CHAIN_ID.USE.BABEL].some((jsUseId) => {
-        const use = jsRule.uses.get(jsUseId);
-        if (!use) {
-          return false;
+/**
+ * Dedupe SVGO plugins config.
+ *
+ * @example
+ * Input:
+ *   {
+ *     plugins: [
+ *       { name: 'preset-default', params: { foo: true }],
+ *       { name: 'preset-default', params: { bar: true }],
+ *     ]
+ *   }
+ * Output:
+ *   {
+ *     plugins: [
+ *       { name: 'preset-default', params: { foo: true, bar: true }],
+ *     ]
+ *   }
+ */ const dedupeSvgoPlugins = (config)=>{
+    if (!config.plugins) return config;
+    let mergedPlugins = [];
+    for (const plugin of config.plugins){
+        if ('string' == typeof plugin) {
+            const exist = mergedPlugins.find((item)=>item === plugin || 'object' == typeof item && item.name === plugin);
+            if (!exist) mergedPlugins.push(plugin);
+            continue;
         }
-        for (const oneOfId of [
-          CHAIN_ID.ONE_OF.SVG,
-          CHAIN_ID.ONE_OF.SVG_REACT
-        ]) {
-          if (!rule.oneOfs.has(oneOfId)) {
+        const strIndex = mergedPlugins.findIndex((item)=>'string' == typeof item && item === plugin.name);
+        if (-1 !== strIndex) {
+            mergedPlugins[strIndex] = plugin;
             continue;
-          }
-          rule.oneOf(oneOfId).use(jsUseId).before(CHAIN_ID.USE.SVGR).loader(use.get("loader")).options(use.get("options"));
         }
-        return true;
-      });
-    });
-  }
-});
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  PLUGIN_SVGR_NAME,
-  pluginSvgr
+        let isMerged = false;
+        mergedPlugins = mergedPlugins.map((item)=>{
+            if ('object' == typeof item && item.name === plugin.name) {
+                isMerged = true;
+                return external_deepmerge_default()(item, plugin);
+            }
+            return item;
+        });
+        if (!isMerged) mergedPlugins.push(plugin);
+    }
+    config.plugins = mergedPlugins;
+    return config;
+};
+const PLUGIN_SVGR_NAME = 'rsbuild:svgr';
+const pluginSvgr = function() {
+    let options = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {};
+    return {
+        name: PLUGIN_SVGR_NAME,
+        pre: [
+            plugin_react_namespaceObject.PLUGIN_REACT_NAME
+        ],
+        setup (api) {
+            api.modifyBundlerChain(async (chain, param)=>{
+                let { CHAIN_ID, environment } = param;
+                const { config } = environment;
+                const { dataUriLimit } = config.output;
+                const maxSize = 'number' == typeof dataUriLimit ? dataUriLimit : dataUriLimit.svg;
+                let generatorOptions = {};
+                if (chain.module.rules.has(CHAIN_ID.RULE.SVG)) {
+                    generatorOptions = chain.module.rules.get(CHAIN_ID.RULE.SVG).oneOfs.get(CHAIN_ID.ONE_OF.SVG_URL).get('generator');
+                    // delete Rsbuild builtin SVG rules
+                    chain.module.rules.delete(CHAIN_ID.RULE.SVG);
+                }
+                const rule = chain.module.rule(CHAIN_ID.RULE.SVG).test(SVG_REGEX);
+                const svgrOptions = external_deepmerge_default()({
+                    svgo: true,
+                    svgoConfig: getSvgoDefaultConfig()
+                }, options.svgrOptions || {});
+                svgrOptions.svgoConfig = dedupeSvgoPlugins(svgrOptions.svgoConfig);
+                // force to url: "foo.svg?url",
+                rule.oneOf(CHAIN_ID.ONE_OF.SVG_URL).type('asset/resource').resourceQuery(/(__inline=false|url)/).set('generator', generatorOptions);
+                // force to inline: "foo.svg?inline"
+                rule.oneOf(CHAIN_ID.ONE_OF.SVG_INLINE).type('asset/inline').resourceQuery(/inline/);
+                // force to react component: "foo.svg?react"
+                rule.oneOf(CHAIN_ID.ONE_OF.SVG_REACT).type('javascript/auto').resourceQuery(options.query || /react/).use(CHAIN_ID.USE.SVGR).loader(external_node_path_default().resolve(__dirname, './loader.cjs')).options({
+                    ...svgrOptions,
+                    exportType: 'default'
+                }).end();
+                // SVG in JS files
+                const { mixedImport = false } = options;
+                if (mixedImport || svgrOptions.exportType) {
+                    const { exportType = mixedImport ? 'named' : void 0 } = svgrOptions;
+                    const issuerInclude = [
+                        /\.(?:js|jsx|mjs|cjs|ts|tsx|mts|cts)$/,
+                        /\.mdx$/
+                    ];
+                    const issuer = options.excludeImporter ? {
+                        and: [
+                            issuerInclude,
+                            {
+                                not: options.excludeImporter
+                            }
+                        ]
+                    } : issuerInclude;
+                    const svgRule = rule.oneOf(CHAIN_ID.ONE_OF.SVG);
+                    if (options.exclude) svgRule.exclude.add(options.exclude);
+                    svgRule.type('javascript/auto') // The issuer option ensures that SVGR will only apply if the SVG is imported from a JS file.
+                    .set('issuer', issuer).use(CHAIN_ID.USE.SVGR).loader(external_node_path_default().resolve(__dirname, './loader.cjs')).options({
+                        ...svgrOptions,
+                        exportType
+                    }).end();
+                    /**
+         * For mixed import.
+         * @example import logoUrl, { ReactComponent } from './logo.svg';`
+         */ if (mixedImport && 'named' === exportType) svgRule.use(CHAIN_ID.USE.URL).loader(external_node_path_default().join(__dirname, '../compiled', 'url-loader/index.js')).options({
+                        limit: maxSize,
+                        name: null == generatorOptions ? void 0 : generatorOptions.filename
+                    });
+                }
+                // SVG as assets
+                rule.oneOf(CHAIN_ID.ONE_OF.SVG_ASSET).type('asset').parser({
+                    // Inline SVG if size < maxSize
+                    dataUrlCondition: {
+                        maxSize
+                    }
+                }).set('generator', generatorOptions);
+                // apply current JS transform rule to SVGR rules
+                const jsRule = chain.module.rules.get(CHAIN_ID.RULE.JS);
+                [
+                    CHAIN_ID.USE.SWC,
+                    CHAIN_ID.USE.BABEL
+                ].some((jsUseId)=>{
+                    const use = jsRule.uses.get(jsUseId);
+                    if (!use) return false;
+                    for (const oneOfId of [
+                        CHAIN_ID.ONE_OF.SVG,
+                        CHAIN_ID.ONE_OF.SVG_REACT
+                    ]){
+                        if (!!rule.oneOfs.has(oneOfId)) rule.oneOf(oneOfId).use(jsUseId).before(CHAIN_ID.USE.SVGR).loader(use.get('loader')).options(use.get('options'));
+                    }
+                    return true;
+                });
+            });
+        }
+    };
+};
+var __webpack_export_target__ = exports;
+for(var i in __webpack_exports__)__webpack_export_target__[i] = __webpack_exports__[i];
+if (__webpack_exports__.__esModule) Object.defineProperty(__webpack_export_target__, '__esModule', {
+    value: true
 });