docs: use plugin names and refactor (#2007)

docs/02-preset-default.mdx

@@ -14,41 +14,41 @@ If you aren't using SVGO directly, like through [SVGR](https://github.com/gregbe
 
 The following plugins are included in `preset-default`, in the order that they're executed:
 
-- [Remove Doctype](/docs/plugins/remove-doctype/)
-- [Remove XML Declaration](/docs/plugins/remove-xml-proc-inst/)
-- [Remove Comments](/docs/plugins/remove-comments/)
-- [Remove Metadata](/docs/plugins/remove-metadata/)
-- [Remove Editor Namespace Data](/docs/plugins/remove-editors-ns-data/)
-- [Cleanup Attributes](/docs/plugins/cleanup-attrs/)
-- [Merge Styles](/docs/plugins/merge-styles/)
-- [Inline Styles](/docs/plugins/inline-styles/)
-- [Minify Styles](/docs/plugins/minify-styles/)
-- [Cleanup IDs](/docs/plugins/cleanup-ids/)
-- [Remove Useless Defs](/docs/plugins/remove-useless-defs/)
-- [Cleanup Numeric Values](/docs/plugins/cleanup-numeric-values/)
-- [Convert Colors](/docs/plugins/convert-colors/)
-- [Remove Unknowns and Defaults](/docs/plugins/remove-unknowns-and-defaults/)
-- [Remove Non-inheritable Group Attributes](/docs/plugins/remove-non-inheritable-group-attrs/)
-- [Remove Useless Stroke and Fill](/docs/plugins/remove-useless-stroke-and-fill/)
-- [Remove ViewBox](/docs/plugins/remove-viewbox/)
-- [Cleanup Enable Background](/docs/plugins/cleanup-enable-background/)
-- [Remove Hidden Elements](/docs/plugins/remove-hidden-elems/)
-- [Remove Empty Text](/docs/plugins/remove-empty-text/)
-- [Convert Shape to Path](/docs/plugins/convert-shape-to-path/)
-- [Convert Ellipse to Circle](/docs/plugins/convert-ellipse-to-circle/)
-- [Move Element Attributes to Group](/docs/plugins/move-elems-attrs-to-group/)
-- [Move Group Attributes to Element](/docs/plugins/move-group-attrs-to-elem/)
-- [Collapse Groups](/docs/plugins/collapse-groups/)
-- [Convert Path Data](/docs/plugins/convert-path-data/)
-- [Convert Transform](/docs/plugins/convert-transform/)
-- [Remove Empty Attributes](/docs/plugins/remove-empty-attrs/)
-- [Remove Empty Containers](/docs/plugins/remove-empty-containers/)
-- [Remove Unused Namespaces](/docs/plugins/remove-unused-namespaces/)
-- [Merge Paths](/docs/plugins/merge-paths/)
-- [Sort Attributes](/docs/plugins/sort-attrs/)
-- [Sort Defs Children](/docs/plugins/sort-defs-children/)
-- [Remove Title](/docs/plugins/remove-title/)
-- [Remove Description](/docs/plugins/remove-desc/)
+- [removeDoctype](/docs/plugins/removeDoctype/)
+- [removeXMLProcInst](/docs/plugins/removeXMLProcInst/)
+- [removeComments](/docs/plugins/removeComments/)
+- [removeMetadata](/docs/plugins/removeMetadata/)
+- [removeEditorsNSData](/docs/plugins/removeEditorsNSData/)
+- [cleanupAttrs](/docs/plugins/cleanupAttrs/)
+- [mergeStyles](/docs/plugins/mergeStyles/)
+- [inlineStyles](/docs/plugins/inlineStyles/)
+- [minifyStyles](/docs/plugins/minifyStyles/)
+- [cleanupIds](/docs/plugins/cleanupIds/)
+- [removeUselessDefs](/docs/plugins/removeUselessDefs/)
+- [cleanupNumericValues](/docs/plugins/cleanupNumericValues/)
+- [convertColors](/docs/plugins/convertColors/)
+- [removeUnknownsAndDefaults](/docs/plugins/removeUnknownsAndDefaults/)
+- [removeNonInheritableGroupAttrs](/docs/plugins/removeNonInheritableGroupAttrs/)
+- [removeUselessStrokeAndFill](/docs/plugins/removeUselessStrokeAndFill/)
+- [removeViewBox](/docs/plugins/removeViewBox/)
+- [cleanupEnableBackground](/docs/plugins/cleanupEnableBackground/)
+- [removeHiddenElems](/docs/plugins/removeHiddenElems/)
+- [removeEmptyText](/docs/plugins/removeEmptyText/)
+- [convertShapeToPath](/docs/plugins/convertShapeToPath/)
+- [convertEllipseToCircle](/docs/plugins/convertEllipseToCircle/)
+- [moveElemsAttrsToGroup](/docs/plugins/moveElemsAttrsToGroup/)
+- [moveGroupAttrsToElems](/docs/plugins/moveGroupAttrsToElems/)
+- [collapseGroups](/docs/plugins/collapseGroups/)
+- [convertPathData](/docs/plugins/convertPathData/)
+- [convertTransform](/docs/plugins/convertTransform/)
+- [removeEmptyAttrs](/docs/plugins/removeEmptyAttrs/)
+- [removeEmptyContainers](/docs/plugins/removeEmptyContainers/)
+- [removeUnusedNS](/docs/plugins/removeUnusedNS/)
+- [mergePaths](/docs/plugins/mergePaths/)
+- [sortAttrs](/docs/plugins/sortAttrs/)
+- [sortDefsChildren](/docs/plugins/sortDefsChildren/)
+- [removeTitle](/docs/plugins/removeTitle/)
+- [removeDesc](/docs/plugins/removeDesc/)
 
 ## Disable a Plugin
 

docs/03-plugins/add-attributes-to-svg-elements.mdx → docs/03-plugins/addAttributesToSVGElement.mdx

@@ -1,5 +1,5 @@
 ---
-title: Add Attributes to Elements
+title: addAttributesToSVGElement
 svgo:
   pluginId: addAttributesToSVGElement
   parameters:
@@ -16,19 +16,3 @@ Adds attributes to the outer most [`<svg>`](https://developer.mozilla.org/docs/W
 This plugin is only safe to use when a map of key/value pairs is passed. If you pass an array of keys to declare empty attributes, this will produce an malformed SVG that's only usable inline an HTML document.
 
 :::
-
-## Usage
-
-<PluginUsage />
-
-### Parameters
-
-<PluginParams />
-
-## Demo
-
-<PluginDemo />
-
-## Implementation
-
-- https://github.com/svg/svgo/blob/main/plugins/addAttributesToSVGElement.js

docs/03-plugins/add-classes-to-svg-element.mdx → docs/03-plugins/addClassesToSVGElement.mdx

@@ -1,5 +1,5 @@
 ---
-title: Add Classes to SVG
+title: addClassesToSVGElement
 svgo:
   pluginId: addClassesToSVGElement
   parameters:
@@ -21,19 +21,3 @@ If there is no `class` attribute to begin with, it will be added. However, if th
 If you have a standalone SVG, this is not an optimization and will increase the size of the SVG document. This plugin is only relevant when considering multiple SVGs that may be inlined a parent document.
 
 By adding classes, if the parent document is aware, you can share styles across all inlined SVG elements.
-
-## Usage
-
-<PluginUsage />
-
-### Parameters
-
-<PluginParams />
-
-## Demo
-
-<PluginDemo />
-
-## Implementation
-
-- https://github.com/svg/svgo/blob/main/plugins/addClassesToSVGElement.js

docs/03-plugins/cleanup-attrs.mdx → docs/03-plugins/cleanupAttrs.mdx

@@ -1,5 +1,5 @@
 ---
-title: Cleanup Attributes
+title: cleanupAttrs
 svgo:
   pluginId: cleanupAttrs
   defaultPlugin: true
@@ -21,19 +21,3 @@ svgo:
 Removes redundant whitespaces from attribute values.
 
 This will not modify the attribute keys, nor remove them if the value becomes empty after optimization.
-
-## Usage
-
-<PluginUsage />
-
-### Parameters
-
-<PluginParams />
-
-## Demo
-
-<PluginDemo />
-
-## Implementation
-
-- https://github.com/svg/svgo/blob/main/plugins/cleanupAttrs.js

docs/03-plugins/cleanup-enable-background.mdx → docs/03-plugins/cleanupEnableBackground.mdx

@@ -1,5 +1,5 @@
 ---
-title: Cleanup Enable Background
+title: cleanupEnableBackground
 svgo:
   pluginId: cleanupEnableBackground
   defaultPlugin: true
@@ -19,15 +19,3 @@ This plugin will:
 Some browsers don't support `enable-background`, so it's best to avoid the attribute regardless.
 
 :::
-
-## Usage
-
-<PluginUsage />
-
-## Demo
-
-<PluginDemo />
-
-## Implementation
-
-- https://github.com/svg/svgo/blob/main/plugins/cleanupEnableBackground.js

docs/03-plugins/cleanup-ids.mdx → docs/03-plugins/cleanupIds.mdx

@@ -1,5 +1,5 @@
 ---
-title: Cleanup IDs
+title: cleanupIds
 svgo:
   pluginId: cleanupIds
   parameters:
@@ -35,24 +35,8 @@ Between v2 and v3, the plugin ID was renamed from `cleanupIDs` to `cleanupIds`,
 
 This plugin has been known to cause problems when inlining multiple SVGs in the same parent document. Due to the predictable algorithm used to minify IDs, separate documents that are run though SVGO may end up with clashing IDs.
 
-You can work around this by enabling the [**Prefix IDs**](/docs/plugins/prefix-ids/) plugin. Alternatively, you can set the `minify` parameter to `false`, however this will not resolve the issue if your SVGs already had clashing IDs to start with.
+You can work around this by enabling the [prefixIds](/docs/plugins/prefixIds/) plugin. Alternatively, you can set the `minify` parameter to `false`, however this will not resolve the issue if your SVGs already had clashing IDs to start with.
 
 See [facebook/docusaurus#8297](https://github.com/facebook/docusaurus/issues/8297) for more context.
 
 :::
-
-## Usage
-
-<PluginUsage />
-
-### Parameters
-
-<PluginParams />
-
-## Demo
-
-<PluginDemo />
-
-## Implementation
-
-- https://github.com/svg/svgo/blob/main/plugins/cleanupIds.js

docs/03-plugins/cleanup-list-of-values.mdx → docs/03-plugins/cleanupListOfValues.mdx

@@ -1,5 +1,5 @@
 ---
-title: Cleanup List of Values
+title: cleanupListOfValues
 svgo:
   pluginId: cleanupListOfValues
   parameters:
@@ -20,19 +20,3 @@ svgo:
 # Cleanup List of Values
 
 Rounds numeric values in attributes, such as those found in [`viewBox`](https://developer.mozilla.org/docs/Web/SVG/Attribute/viewBox), [`enable-background`](https://developer.mozilla.org/docs/Web/SVG/Attribute/enable-background), and [`points`](https://developer.mozilla.org/docs/Web/SVG/Attribute/points).
-
-## Usage
-
-<PluginUsage />
-
-### Parameters
-
-<PluginParams />
-
-## Demo
-
-<PluginDemo />
-
-## Implementation
-
-- https://github.com/svg/svgo/blob/main/plugins/cleanupListOfValues.js

docs/03-plugins/cleanup-numeric-values.mdx → docs/03-plugins/cleanupNumericValues.mdx

@@ -1,5 +1,5 @@
 ---
-title: Cleanup Numeric Values
+title: cleanupNumericValues
 svgo:
   pluginId: cleanupNumericValues
   defaultPlugin: true
@@ -19,19 +19,3 @@ svgo:
 ---
 
 Rounds numeric values, and removes the unit when it's `px` as this is the default.
-
-## Usage
-
-<PluginUsage />
-
-### Parameters
-
-<PluginParams />
-
-## Demo
-
-<PluginDemo />
-
-## Implementation
-
-- https://github.com/svg/svgo/blob/main/plugins/cleanupNumericValues.js

docs/03-plugins/collapse-groups.mdx → docs/03-plugins/collapseGroups.mdx

@@ -1,5 +1,5 @@
 ---
-title: Collapse Groups
+title: collapseGroups
 svgo:
   pluginId: collapseGroups
   defaultPlugin: true
@@ -11,18 +11,6 @@ Groups can be formed using the [`<g>`](https://developer.mozilla.org/docs/Web/SV
 
 :::info
 
-This plugin doesn't remove empty groups. That's handled by the [**Remove Empty Containers**](/docs/plugins/remove-empty-containers/) plugin which is enabled by default.
+This plugin doesn't remove empty groups. That's handled by the [removeEmptyContainers](/docs/plugins/removeEmptyContainers/) plugin which is enabled by default.
 
 :::
-
-## Usage
-
-<PluginUsage />
-
-## Demo
-
-<PluginDemo />
-
-## Implementation
-
-- https://github.com/svg/svgo/blob/main/plugins/collapseGroups.js

docs/03-plugins/convert-colors.mdx → docs/03-plugins/convertColors.mdx

@@ -1,5 +1,5 @@
 ---
-title: Convert Colors
+title: convertColors
 svgo:
   pluginId: convertColors
   defaultPlugin: true
@@ -38,19 +38,3 @@ Colors can be represented in various notations, the following table showcases so
 | `purple` | `rgb(128, 0, 128)` | `#800080` |        |
 
 It makes no difference which format is received by a client, and each one has wide support across browsers and image viewing software.
-
-## Usage
-
-<PluginUsage />
-
-### Parameters
-
-<PluginParams />
-
-## Demo
-
-<PluginDemo />
-
-## Implementation
-
-- https://github.com/svg/svgo/blob/main/plugins/convertColors.js

docs/03-plugins/convert-ellipse-to-circle.mdx → docs/03-plugins/convertEllipseToCircle.mdx

@@ -1,20 +1,8 @@
 ---
-title: Convert Ellipse to Circle
+title: convertEllipseToCircle
 svgo:
   pluginId: convertEllipseToCircle
   defaultPlugin: true
 ---
 
 Convert non-eccentric [`<ellipse>`](https://developer.mozilla.org/docs/Web/SVG/Element/ellipse) elements to [`<circle>`](https://developer.mozilla.org/docs/Web/SVG/Element/circle) elements.
-
-## Usage
-
-<PluginUsage />
-
-## Demo
-
-<PluginDemo />
-
-## Implementation
-
-- https://github.com/svg/svgo/blob/main/plugins/convertEllipseToCircle.js

docs/03-plugins/convert-one-stop-gradients.mdx → docs/03-plugins/convertOneStopGradients.mdx

@@ -1,5 +1,5 @@
 ---
-title: Convert One-Stop Gradients
+title: convertOneStopGradients
 svgo:
   pluginId: convertOneStopGradients
 ---
@@ -9,15 +9,3 @@ Converts the [`<linearGradient>`](https://developer.mozilla.org/docs/Web/SVG/Ele
 These nodes contain [`<stop>`](https://developer.mozilla.org/docs/Web/SVG/Element/stop) elements, which represent various colors to transition between. However, if a gradient only contains a single `<stop>`, then it's effecitively a solid fill.
 
 Definitions of the gradients are removed, and the parent [`<defs>`](https://developer.mozilla.org/docs/Web/SVG/Element/defs) node is removed if it has no children after optimization. The `xlink:href` namespace is also removed if there are no remaining elements using this attribute.
-
-## Usage
-
-<PluginUsage />
-
-## Demo
-
-<PluginDemo />
-
-## Implementation
-
-- https://github.com/svg/svgo/blob/main/plugins/convertOneStopGradients.js

docs/03-plugins/convert-path-data.mdx → docs/03-plugins/convertPathData.mdx

@@ -1,5 +1,5 @@
 ---
-title: Convert Path Commands
+title: convertPathData
 svgo:
   pluginId: convertPathData
   defaultPlugin: true
@@ -69,19 +69,3 @@ This plugin uses multiple techniques to either reduce the number of instructions
 - Round numeric values using conventional rounding rules.
 
 You can read more about the plugins capabilities by going through the individual parameters.
-
-## Usage
-
-<PluginUsage />
-
-### Parameters
-
-<PluginParams />
-
-## Demo
-
-<PluginDemo />
-
-## Implementation
-
-- https://github.com/svg/svgo/blob/main/plugins/convertPathData.js