@azerion/bunosaurus-plugin-svgr 0.0.0-stage → 4.0.0

package/README.md

@@ -1,3 +1,7 @@
-# Temporary Holding Version
+# `@docusaurus/plugin-svgr`
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+[SVGR](https://react-svgr.com/) plugin for Docusaurus.
+
+## Usage
+
+See [plugin-svgr documentation](https://docusaurus.io/docs/api/plugins/@docusaurus/plugin-svgr).

package/lib/index.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import type { LoadContext, Plugin } from '@docusaurus/types';
+import type { PluginOptions, Options } from './options';
+export default function pluginSVGR(_context: LoadContext, options: PluginOptions): Plugin;
+export { validateOptions } from './options';
+export type { PluginOptions, Options };

package/lib/index.js

@@ -0,0 +1,21 @@
+"use strict";
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.validateOptions = void 0;
+exports.default = pluginSVGR;
+const svgrLoader_1 = require("./svgrLoader");
+function pluginSVGR(_context, options) {
+    return {
+        name: 'docusaurus-plugin-svgr',
+        configureWebpack: (config, isServer) => {
+            (0, svgrLoader_1.enhanceConfig)(config, { isServer, svgrConfig: options.svgrConfig });
+        },
+    };
+}
+var options_1 = require("./options");
+Object.defineProperty(exports, "validateOptions", { enumerable: true, get: function () { return options_1.validateOptions; } });

package/lib/options.d.ts

@@ -0,0 +1,11 @@
+import type { OptionValidationContext } from '@docusaurus/types';
+export type SVGRConfig = any;
+export type SVGOConfig = NonNullable<SVGRConfig['svgoConfig']>;
+export type PluginOptions = {
+    svgrConfig: SVGRConfig;
+};
+export type Options = {
+    svgrConfig?: Partial<SVGRConfig>;
+};
+export declare const DEFAULT_OPTIONS: Partial<PluginOptions>;
+export declare function validateOptions({ validate, options, }: OptionValidationContext<Options | undefined, PluginOptions>): PluginOptions;

package/lib/options.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DEFAULT_OPTIONS = void 0;
+exports.validateOptions = validateOptions;
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+const utils_validation_1 = require("@docusaurus/utils-validation");
+exports.DEFAULT_OPTIONS = {
+    svgrConfig: {},
+};
+const pluginOptionsSchema = utils_validation_1.Joi.object({
+    svgrConfig: utils_validation_1.Joi.object()
+        .pattern(utils_validation_1.Joi.string(), utils_validation_1.Joi.any())
+        .optional()
+        .default(exports.DEFAULT_OPTIONS.svgrConfig),
+}).default(exports.DEFAULT_OPTIONS);
+function validateOptions({ validate, options, }) {
+    return validate(pluginOptionsSchema, options);
+}

package/lib/svgrLoader.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import type { SVGRConfig } from './options';
+import type { Configuration } from 'webpack';
+type Params = {
+    isServer: boolean;
+    svgrConfig: SVGRConfig;
+};
+export declare function enhanceConfig(config: Configuration, params: Params): void;
+export {};

package/lib/svgrLoader.js

@@ -0,0 +1,75 @@
+"use strict";
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.enhanceConfig = enhanceConfig;
+const utils_1 = require("@docusaurus/utils");
+// TODO Docusaurus v4: change these defaults?
+//  see https://github.com/facebook/docusaurus/issues/8297
+//  see https://github.com/facebook/docusaurus/pull/10205
+//  see https://github.com/facebook/docusaurus/pull/10211
+const DefaultSVGOConfig = {
+    plugins: [
+        {
+            name: 'preset-default',
+            params: {
+                overrides: {
+                    removeTitle: false,
+                    removeViewBox: false,
+                },
+            },
+        },
+    ],
+};
+const DefaultSVGRConfig = {
+    prettier: false,
+    svgo: true,
+    svgoConfig: DefaultSVGOConfig,
+    titleProp: true,
+};
+function createSVGRRule(params) {
+    const options = {
+        ...DefaultSVGRConfig,
+        ...params.svgrConfig,
+    };
+    return {
+        loader: require.resolve('@svgr/webpack'),
+        options,
+    };
+}
+function enhanceConfig(config, params) {
+    const utils = (0, utils_1.getFileLoaderUtils)(params.isServer);
+    const rules = config?.module?.rules;
+    const existingSvgRule = (() => {
+        const rule = rules.find((r) => String(r.test) === String(utils.rules.svgs().test));
+        if (!rule) {
+            throw new Error("Docusaurus built-in SVG rule couldn't be found. The SVGR plugin can't enhance it.");
+        }
+        return rule;
+    })();
+    const newSvgRule = {
+        test: /\.svg$/i,
+        with: { type: { not: 'text' } },
+        oneOf: [
+            {
+                use: [createSVGRRule(params)],
+                // We don't want to use SVGR loader for non-React source code
+                // ie we don't want to use SVGR for CSS files...
+                issuer: {
+                    and: [/\.(?:tsx?|jsx?|mdx?)$/i],
+                },
+            },
+            existingSvgRule,
+        ],
+    };
+    // This is annoying, but we have to "wrap" the existing SVG rule
+    // Adding another extra SVG rule (first or last) will not "override"
+    // the default: both rules will be applied (from last to bottom) leading to
+    // conflicting behavior.
+    const index = rules.indexOf(existingSvgRule);
+    rules[index] = newSvgRule;
+}

package/package.json

@@ -1,6 +1,40 @@
 {
   "name": "@azerion/bunosaurus-plugin-svgr",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "4.0.0",
+  "description": "SVGR plugin for Docusaurus.",
+  "main": "lib/index.js",
+  "types": "lib/index.d.ts",
+  "scripts": {
+    "build": "tsc --build",
+    "watch": "tsc --build --watch"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/azerion/bunosaurus.git",
+    "directory": "packages/docusaurus-plugin-svgr"
+  },
+  "license": "MIT",
+  "dependencies": {
+    "@docusaurus/core": "npm:@azerion/bunosaurus-core@4.0.0",
+    "@docusaurus/types": "npm:@azerion/bunosaurus-types@4.0.0",
+    "@docusaurus/utils": "npm:@azerion/bunosaurus-utils@4.0.0",
+    "@docusaurus/utils-validation": "npm:@azerion/bunosaurus-utils-validation@4.0.0",
+    "@svgr/core": "^8.1.0",
+    "@svgr/webpack": "^8.1.0",
+    "tslib": "^2.8.1"
+  },
+  "devDependencies": {
+    "@docusaurus/module-type-aliases": "npm:@azerion/bunosaurus-module-type-aliases@4.0.0",
+    "webpack": "^5.111.0"
+  },
+  "peerDependencies": {
+    "react": "^19.3.0",
+    "react-dom": "^19.3.0"
+  },
+  "engines": {
+    "bun": ">=1.4.1"
+  }
+}

package/src/index.ts

@@ -0,0 +1,26 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import {enhanceConfig} from './svgrLoader';
+import type {LoadContext, Plugin} from '@docusaurus/types';
+import type {PluginOptions, Options} from './options';
+
+export default function pluginSVGR(
+  _context: LoadContext,
+  options: PluginOptions,
+): Plugin {
+  return {
+    name: 'docusaurus-plugin-svgr',
+    configureWebpack: (config, isServer) => {
+      enhanceConfig(config, {isServer, svgrConfig: options.svgrConfig});
+    },
+  };
+}
+
+export {validateOptions} from './options';
+
+export type {PluginOptions, Options};

package/src/options.ts

@@ -0,0 +1,41 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import {Joi} from '@docusaurus/utils-validation';
+import type {OptionValidationContext} from '@docusaurus/types';
+
+// TODO unfortunately there's a SVGR TS error when skipLibCheck=false
+//  related to prettier, see https://github.com/gregberge/svgr/issues/904
+// import type {Config as SVGRConfig} from '@svgr/core';
+// export type {SVGRConfig};
+export type SVGRConfig = any;
+export type SVGOConfig = NonNullable<SVGRConfig['svgoConfig']>;
+
+export type PluginOptions = {
+  svgrConfig: SVGRConfig;
+};
+
+export type Options = {
+  svgrConfig?: Partial<SVGRConfig>;
+};
+
+export const DEFAULT_OPTIONS: Partial<PluginOptions> = {
+  svgrConfig: {},
+};
+
+const pluginOptionsSchema = Joi.object<PluginOptions>({
+  svgrConfig: Joi.object()
+    .pattern(Joi.string(), Joi.any())
+    .optional()
+    .default(DEFAULT_OPTIONS.svgrConfig),
+}).default(DEFAULT_OPTIONS);
+
+export function validateOptions({
+  validate,
+  options,
+}: OptionValidationContext<Options | undefined, PluginOptions>): PluginOptions {
+  return validate(pluginOptionsSchema, options);
+}

package/src/svgrLoader.ts

@@ -0,0 +1,90 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import {getFileLoaderUtils} from '@docusaurus/utils';
+
+import type {SVGRConfig, SVGOConfig} from './options';
+import type {Configuration, RuleSetRule} from 'webpack';
+
+// TODO Docusaurus v4: change these defaults?
+//  see https://github.com/facebook/docusaurus/issues/8297
+//  see https://github.com/facebook/docusaurus/pull/10205
+//  see https://github.com/facebook/docusaurus/pull/10211
+const DefaultSVGOConfig: SVGOConfig = {
+  plugins: [
+    {
+      name: 'preset-default',
+      params: {
+        overrides: {
+          removeTitle: false,
+          removeViewBox: false,
+        },
+      },
+    },
+  ],
+};
+
+const DefaultSVGRConfig: SVGRConfig = {
+  prettier: false,
+  svgo: true,
+  svgoConfig: DefaultSVGOConfig,
+  titleProp: true,
+};
+
+type Params = {isServer: boolean; svgrConfig: SVGRConfig};
+
+function createSVGRRule(params: Params): RuleSetRule {
+  const options: SVGRConfig = {
+    ...DefaultSVGRConfig,
+    ...params.svgrConfig,
+  };
+  return {
+    loader: require.resolve('@svgr/webpack'),
+    options,
+  };
+}
+
+export function enhanceConfig(config: Configuration, params: Params): void {
+  const utils = getFileLoaderUtils(params.isServer);
+
+  const rules = config?.module?.rules as RuleSetRule[];
+
+  const existingSvgRule: RuleSetRule = (() => {
+    const rule = rules.find(
+      (r) => String(r.test) === String(utils.rules.svgs().test),
+    );
+    if (!rule) {
+      throw new Error(
+        "Docusaurus built-in SVG rule couldn't be found. The SVGR plugin can't enhance it.",
+      );
+    }
+    return rule;
+  })();
+
+  const newSvgRule: RuleSetRule = {
+    test: /\.svg$/i,
+    with: {type: {not: 'text'}},
+    oneOf: [
+      {
+        use: [createSVGRRule(params)],
+        // We don't want to use SVGR loader for non-React source code
+        // ie we don't want to use SVGR for CSS files...
+        issuer: {
+          and: [/\.(?:tsx?|jsx?|mdx?)$/i],
+        },
+      },
+      existingSvgRule,
+    ],
+  };
+
+  // This is annoying, but we have to "wrap" the existing SVG rule
+  // Adding another extra SVG rule (first or last) will not "override"
+  // the default: both rules will be applied (from last to bottom) leading to
+  // conflicting behavior.
+  const index = rules.indexOf(existingSvgRule);
+  rules[index] = newSvgRule;
+}

package/src/types.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/// <reference types="@docusaurus/module-type-aliases" />