svgo-v2 2.8.0

package/plugins/preset-default.js

@@ -0,0 +1,80 @@
+'use strict';
+
+const { createPreset } = require('../lib/svgo/plugins.js');
+
+const removeDoctype = require('./removeDoctype.js');
+const removeXMLProcInst = require('./removeXMLProcInst.js');
+const removeComments = require('./removeComments.js');
+const removeMetadata = require('./removeMetadata.js');
+const removeEditorsNSData = require('./removeEditorsNSData.js');
+const cleanupAttrs = require('./cleanupAttrs.js');
+const mergeStyles = require('./mergeStyles.js');
+const inlineStyles = require('./inlineStyles.js');
+const minifyStyles = require('./minifyStyles.js');
+const cleanupIDs = require('./cleanupIDs.js');
+const removeUselessDefs = require('./removeUselessDefs.js');
+const cleanupNumericValues = require('./cleanupNumericValues.js');
+const convertColors = require('./convertColors.js');
+const removeUnknownsAndDefaults = require('./removeUnknownsAndDefaults.js');
+const removeNonInheritableGroupAttrs = require('./removeNonInheritableGroupAttrs.js');
+const removeUselessStrokeAndFill = require('./removeUselessStrokeAndFill.js');
+const removeViewBox = require('./removeViewBox.js');
+const cleanupEnableBackground = require('./cleanupEnableBackground.js');
+const removeHiddenElems = require('./removeHiddenElems.js');
+const removeEmptyText = require('./removeEmptyText.js');
+const convertShapeToPath = require('./convertShapeToPath.js');
+const convertEllipseToCircle = require('./convertEllipseToCircle.js');
+const moveElemsAttrsToGroup = require('./moveElemsAttrsToGroup.js');
+const moveGroupAttrsToElems = require('./moveGroupAttrsToElems.js');
+const collapseGroups = require('./collapseGroups.js');
+const convertPathData = require('./convertPathData.js');
+const convertTransform = require('./convertTransform.js');
+const removeEmptyAttrs = require('./removeEmptyAttrs.js');
+const removeEmptyContainers = require('./removeEmptyContainers.js');
+const mergePaths = require('./mergePaths.js');
+const removeUnusedNS = require('./removeUnusedNS.js');
+const sortDefsChildren = require('./sortDefsChildren.js');
+const removeTitle = require('./removeTitle.js');
+const removeDesc = require('./removeDesc.js');
+
+const presetDefault = createPreset({
+  name: 'presetDefault',
+  plugins: [
+    removeDoctype,
+    removeXMLProcInst,
+    removeComments,
+    removeMetadata,
+    removeEditorsNSData,
+    cleanupAttrs,
+    mergeStyles,
+    inlineStyles,
+    minifyStyles,
+    cleanupIDs,
+    removeUselessDefs,
+    cleanupNumericValues,
+    convertColors,
+    removeUnknownsAndDefaults,
+    removeNonInheritableGroupAttrs,
+    removeUselessStrokeAndFill,
+    removeViewBox,
+    cleanupEnableBackground,
+    removeHiddenElems,
+    removeEmptyText,
+    convertShapeToPath,
+    convertEllipseToCircle,
+    moveElemsAttrsToGroup,
+    moveGroupAttrsToElems,
+    collapseGroups,
+    convertPathData,
+    convertTransform,
+    removeEmptyAttrs,
+    removeEmptyContainers,
+    mergePaths,
+    removeUnusedNS,
+    sortDefsChildren,
+    removeTitle,
+    removeDesc,
+  ],
+});
+
+module.exports = presetDefault;

package/plugins/removeAttributesBySelector.js

@@ -0,0 +1,99 @@
+'use strict';
+
+const { querySelectorAll } = require('../lib/xast.js');
+
+exports.name = 'removeAttributesBySelector';
+exports.type = 'visitor';
+exports.active = false;
+exports.description =
+  'removes attributes of elements that match a css selector';
+
+/**
+ * Removes attributes of elements that match a css selector.
+ *
+ * @example
+ * <caption>A selector removing a single attribute</caption>
+ * plugins: [
+ *   {
+ *     name: "removeAttributesBySelector",
+ *     params: {
+ *       selector: "[fill='#00ff00']"
+ *       attributes: "fill"
+ *     }
+ *   }
+ * ]
+ *
+ * <rect x="0" y="0" width="100" height="100" fill="#00ff00" stroke="#00ff00"/>
+ *   ↓
+ * <rect x="0" y="0" width="100" height="100" stroke="#00ff00"/>
+ *
+ * <caption>A selector removing multiple attributes</caption>
+ * plugins: [
+ *   {
+ *     name: "removeAttributesBySelector",
+ *     params: {
+ *       selector: "[fill='#00ff00']",
+ *       attributes: [
+ *         "fill",
+ *         "stroke"
+ *       ]
+ *     }
+ *   }
+ * ]
+ *
+ * <rect x="0" y="0" width="100" height="100" fill="#00ff00" stroke="#00ff00"/>
+ *   ↓
+ * <rect x="0" y="0" width="100" height="100"/>
+ *
+ * <caption>Multiple selectors removing attributes</caption>
+ * plugins: [
+ *   {
+ *     name: "removeAttributesBySelector",
+ *     params: {
+ *       selectors: [
+ *         {
+ *           selector: "[fill='#00ff00']",
+ *           attributes: "fill"
+ *         },
+ *         {
+ *           selector: "#remove",
+ *           attributes: [
+ *             "stroke",
+ *             "id"
+ *           ]
+ *         }
+ *       ]
+ *     }
+ *   }
+ * ]
+ *
+ * <rect x="0" y="0" width="100" height="100" fill="#00ff00" stroke="#00ff00"/>
+ *   ↓
+ * <rect x="0" y="0" width="100" height="100"/>
+ *
+ * @link https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors|MDN CSS Selectors
+ *
+ * @author Bradley Mease
+ *
+ * @type {import('../lib/types').Plugin<any>}
+ */
+exports.fn = (root, params) => {
+  const selectors = Array.isArray(params.selectors)
+    ? params.selectors
+    : [params];
+  for (const { selector, attributes } of selectors) {
+    const nodes = querySelectorAll(root, selector);
+    for (const node of nodes) {
+      if (node.type === 'element') {
+        if (Array.isArray(attributes)) {
+          for (const name of attributes) {
+            delete node.attributes[name];
+          }
+        } else {
+          delete node.attributes[attributes];
+        }
+      }
+    }
+  }
+  return {};
+};

package/plugins/removeAttrs.js

@@ -0,0 +1,159 @@
+'use strict';
+
+exports.name = 'removeAttrs';
+exports.type = 'visitor';
+exports.active = false;
+exports.description = 'removes specified attributes';
+
+const DEFAULT_SEPARATOR = ':';
+const ENOATTRS = `Warning: The plugin "removeAttrs" requires the "attrs" parameter.
+It should have a pattern to remove, otherwise the plugin is a noop.
+Config example:
+
+plugins: [
+  {
+    name: "removeAttrs",
+    params: {
+      attrs: "(fill|stroke)"
+    }
+  }
+]
+`;
+
+/**
+ * Remove attributes
+ *
+ * @example elemSeparator
+ *   format: string
+ *
+ * @example preserveCurrentColor
+ *   format: boolean
+ *
+ * @example attrs:
+ *
+ *   format: [ element* : attribute* : value* ]
+ *
+ *   element   : regexp (wrapped into ^...$), single * or omitted > all elements (must be present when value is used)
+ *   attribute : regexp (wrapped into ^...$)
+ *   value     : regexp (wrapped into ^...$), single * or omitted > all values
+ *
+ *   examples:
+ *
+ *     > basic: remove fill attribute
+ *     ---
+ *     removeAttrs:
+ *       attrs: 'fill'
+ *
+ *     > remove fill attribute on path element
+ *     ---
+ *       attrs: 'path:fill'
+ *
+ *     > remove fill attribute on path element where value is none
+ *     ---
+ *       attrs: 'path:fill:none'
+ *
+ *
+ *     > remove all fill and stroke attribute
+ *     ---
+ *       attrs:
+ *         - 'fill'
+ *         - 'stroke'
+ *
+ *     [is same as]
+ *
+ *       attrs: '(fill|stroke)'
+ *
+ *     [is same as]
+ *
+ *       attrs: '*:(fill|stroke)'
+ *
+ *     [is same as]
+ *
+ *       attrs: '.*:(fill|stroke)'
+ *
+ *     [is same as]
+ *
+ *       attrs: '.*:(fill|stroke):.*'
+ *
+ *
+ *     > remove all stroke related attributes
+ *     ----
+ *     attrs: 'stroke.*'
+ *
+ *
+ * @author Benny Schudel
+ *
+ * @type {import('../lib/types').Plugin<{
+ *   elemSeparator?: string,
+ *   preserveCurrentColor?: boolean,
+ *   attrs: string | Array<string>
+ * }>}
+ */
+exports.fn = (root, params) => {
+  if (typeof params.attrs == 'undefined') {
+    console.warn(ENOATTRS);
+    return null;
+  }
+
+  const elemSeparator =
+    typeof params.elemSeparator == 'string'
+      ? params.elemSeparator
+      : DEFAULT_SEPARATOR;
+  const preserveCurrentColor =
+    typeof params.preserveCurrentColor == 'boolean'
+      ? params.preserveCurrentColor
+      : false;
+  const attrs = Array.isArray(params.attrs) ? params.attrs : [params.attrs];
+
+  return {
+    element: {
+      enter: (node) => {
+        for (let pattern of attrs) {
+          // if no element separators (:), assume it's attribute name, and apply to all elements *regardless of value*
+          if (pattern.includes(elemSeparator) === false) {
+            pattern = ['.*', elemSeparator, pattern, elemSeparator, '.*'].join(
+              ''
+            );
+            // if only 1 separator, assume it's element and attribute name, and apply regardless of attribute value
+          } else if (pattern.split(elemSeparator).length < 3) {
+            pattern = [pattern, elemSeparator, '.*'].join('');
+          }
+
+          // create regexps for element, attribute name, and attribute value
+          const list = pattern.split(elemSeparator).map((value) => {
+            // adjust single * to match anything
+            if (value === '*') {
+              value = '.*';
+            }
+            return new RegExp(['^', value, '$'].join(''), 'i');
+          });
+
+          // matches element
+          if (list[0].test(node.name)) {
+            // loop attributes
+            for (const [name, value] of Object.entries(node.attributes)) {
+              const isFillCurrentColor =
+                preserveCurrentColor &&
+                name == 'fill' &&
+                value == 'currentColor';
+              const isStrokeCurrentColor =
+                preserveCurrentColor &&
+                name == 'stroke' &&
+                value == 'currentColor';
+              if (
+                !isFillCurrentColor &&
+                !isStrokeCurrentColor &&
+                // matches attribute name
+                list[1].test(name) &&
+                // matches attribute value
+                list[2].test(value)
+              ) {
+                delete node.attributes[name];
+              }
+            }
+          }
+        }
+      },
+    },
+  };
+};

package/plugins/removeComments.js

@@ -0,0 +1,31 @@
+'use strict';
+
+const { detachNodeFromParent } = require('../lib/xast.js');
+
+exports.name = 'removeComments';
+exports.type = 'visitor';
+exports.active = true;
+exports.description = 'removes comments';
+
+/**
+ * Remove comments.
+ *
+ * @example
+ * <!-- Generator: Adobe Illustrator 15.0.0, SVG Export
+ * Plug-In . SVG Version: 6.00 Build 0)  -->
+ *
+ * @author Kir Belevich
+ *
+ * @type {import('../lib/types').Plugin<void>}
+ */
+exports.fn = () => {
+  return {
+    comment: {
+      enter: (node, parentNode) => {
+        if (node.value.charAt(0) !== '!') {
+          detachNodeFromParent(node, parentNode);
+        }
+      },
+    },
+  };
+};

package/plugins/removeDesc.js

@@ -0,0 +1,41 @@
+'use strict';
+
+const { detachNodeFromParent } = require('../lib/xast.js');
+
+exports.name = 'removeDesc';
+exports.type = 'visitor';
+exports.active = true;
+exports.description = 'removes <desc>';
+
+const standardDescs = /^(Created with|Created using)/;
+
+/**
+ * Removes <desc>.
+ * Removes only standard editors content or empty elements 'cause it can be used for accessibility.
+ * Enable parameter 'removeAny' to remove any description.
+ *
+ * https://developer.mozilla.org/en-US/docs/Web/SVG/Element/desc
+ *
+ * @author Daniel Wabyick
+ *
+ * @type {import('../lib/types').Plugin<{ removeAny?: boolean }>}
+ */
+exports.fn = (root, params) => {
+  const { removeAny = true } = params;
+  return {
+    element: {
+      enter: (node, parentNode) => {
+        if (node.name === 'desc') {
+          if (
+            removeAny ||
+            node.children.length === 0 ||
+            (node.children[0].type === 'text' &&
+              standardDescs.test(node.children[0].value))
+          ) {
+            detachNodeFromParent(node, parentNode);
+          }
+        }
+      },
+    },
+  };
+};

package/plugins/removeDimensions.js

@@ -0,0 +1,43 @@
+'use strict';
+
+exports.name = 'removeDimensions';
+
+exports.type = 'perItem';
+
+exports.active = false;
+
+exports.description =
+  'removes width and height in presence of viewBox (opposite to removeViewBox, disable it first)';
+
+/**
+ * Remove width/height attributes and add the viewBox attribute if it's missing
+ *
+ * @example
+ * <svg width="100" height="50" />
+ *   ↓
+ * <svg viewBox="0 0 100 50" />
+ *
+ * @param {Object} item current iteration item
+ * @return {Boolean} if true, with and height will be filtered out
+ *
+ * @author Benny Schudel
+ */
+exports.fn = function (item) {
+  if (item.type === 'element' && item.name === 'svg') {
+    if (item.attributes.viewBox != null) {
+      delete item.attributes.width;
+      delete item.attributes.height;
+    } else if (
+      item.attributes.width != null &&
+      item.attributes.height != null &&
+      Number.isNaN(Number(item.attributes.width)) === false &&
+      Number.isNaN(Number(item.attributes.height)) === false
+    ) {
+      const width = Number(item.attributes.width);
+      const height = Number(item.attributes.height);
+      item.attributes.viewBox = `0 0 ${width} ${height}`;
+      delete item.attributes.width;
+      delete item.attributes.height;
+    }
+  }
+};

package/plugins/removeDoctype.js

@@ -0,0 +1,42 @@
+'use strict';
+
+const { detachNodeFromParent } = require('../lib/xast.js');
+
+exports.name = 'removeDoctype';
+exports.type = 'visitor';
+exports.active = true;
+exports.description = 'removes doctype declaration';
+
+/**
+ * Remove DOCTYPE declaration.
+ *
+ * "Unfortunately the SVG DTDs are a source of so many
+ * issues that the SVG WG has decided not to write one
+ * for the upcoming SVG 1.2 standard. In fact SVG WG
+ * members are even telling people not to use a DOCTYPE
+ * declaration in SVG 1.0 and 1.1 documents"
+ * https://jwatt.org/svg/authoring/#doctype-declaration
+ *
+ * @example
+ * <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
+ * q"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+ *
+ * @example
+ * <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+ * "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" [
+ *     <!-- an internal subset can be embedded here -->
+ * ]>
+ *
+ * @author Kir Belevich
+ *
+ * @type {import('../lib/types').Plugin<void>}
+ */
+exports.fn = () => {
+  return {
+    doctype: {
+      enter: (node, parentNode) => {
+        detachNodeFromParent(node, parentNode);
+      },
+    },
+  };
+};

package/plugins/removeEditorsNSData.js

@@ -0,0 +1,68 @@
+'use strict';
+
+const { detachNodeFromParent } = require('../lib/xast.js');
+const { editorNamespaces } = require('./_collections.js');
+
+exports.type = 'visitor';
+exports.name = 'removeEditorsNSData';
+exports.active = true;
+exports.description = 'removes editors namespaces, elements and attributes';
+
+/**
+ * Remove editors namespaces, elements and attributes.
+ *
+ * @example
+ * <svg xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd">
+ * <sodipodi:namedview/>
+ * <path sodipodi:nodetypes="cccc"/>
+ *
+ * @author Kir Belevich
+ *
+ * @type {import('../lib/types').Plugin<{
+ *   additionalNamespaces?: Array<string>
+ * }>}
+ */
+exports.fn = (_root, params) => {
+  let namespaces = editorNamespaces;
+  if (Array.isArray(params.additionalNamespaces)) {
+    namespaces = [...editorNamespaces, ...params.additionalNamespaces];
+  }
+  /**
+   * @type {Array<string>}
+   */
+  const prefixes = [];
+  return {
+    element: {
+      enter: (node, parentNode) => {
+        // collect namespace aliases from svg element
+        if (node.name === 'svg') {
+          for (const [name, value] of Object.entries(node.attributes)) {
+            if (name.startsWith('xmlns:') && namespaces.includes(value)) {
+              prefixes.push(name.slice('xmlns:'.length));
+              // <svg xmlns:sodipodi="">
+              delete node.attributes[name];
+            }
+          }
+        }
+        // remove editor attributes, for example
+        // <* sodipodi:*="">
+        for (const name of Object.keys(node.attributes)) {
+          if (name.includes(':')) {
+            const [prefix] = name.split(':');
+            if (prefixes.includes(prefix)) {
+              delete node.attributes[name];
+            }
+          }
+        }
+        // remove editor elements, for example
+        // <sodipodi:*>
+        if (node.name.includes(':')) {
+          const [prefix] = node.name.split(':');
+          if (prefixes.includes(prefix)) {
+            detachNodeFromParent(node, parentNode);
+          }
+        }
+      },
+    },
+  };
+};

package/plugins/removeElementsByAttr.js

@@ -0,0 +1,78 @@
+'use strict';
+
+const { detachNodeFromParent } = require('../lib/xast.js');
+
+exports.name = 'removeElementsByAttr';
+exports.type = 'visitor';
+exports.active = false;
+exports.description =
+  'removes arbitrary elements by ID or className (disabled by default)';
+
+/**
+ * Remove arbitrary SVG elements by ID or className.
+ *
+ * @example id
+ *     > single: remove element with ID of `elementID`
+ *     ---
+ *     removeElementsByAttr:
+ *       id: 'elementID'
+ *
+ *     > list: remove multiple elements by ID
+ *     ---
+ *     removeElementsByAttr:
+ *       id:
+ *         - 'elementID'
+ *         - 'anotherID'
+ *
+ * @example class
+ *     > single: remove all elements with class of `elementClass`
+ *     ---
+ *     removeElementsByAttr:
+ *       class: 'elementClass'
+ *
+ *     > list: remove all elements with class of `elementClass` or `anotherClass`
+ *     ---
+ *     removeElementsByAttr:
+ *       class:
+ *         - 'elementClass'
+ *         - 'anotherClass'
+ *
+ * @author Eli Dupuis (@elidupuis)
+ *
+ * @type {import('../lib/types').Plugin<{
+ *   id?: string | Array<string>,
+ *   class?: string | Array<string>
+ * }>}
+ */
+exports.fn = (root, params) => {
+  const ids =
+    params.id == null ? [] : Array.isArray(params.id) ? params.id : [params.id];
+  const classes =
+    params.class == null
+      ? []
+      : Array.isArray(params.class)
+      ? params.class
+      : [params.class];
+  return {
+    element: {
+      enter: (node, parentNode) => {
+        // remove element if it's `id` matches configured `id` params
+        if (node.attributes.id != null && ids.length !== 0) {
+          if (ids.includes(node.attributes.id)) {
+            detachNodeFromParent(node, parentNode);
+          }
+        }
+        // remove element if it's `class` contains any of the configured `class` params
+        if (node.attributes.class && classes.length !== 0) {
+          const classList = node.attributes.class.split(' ');
+          for (const item of classes) {
+            if (classList.includes(item)) {
+              detachNodeFromParent(node, parentNode);
+              break;
+            }
+          }
+        }
+      },
+    },
+  };
+};

package/plugins/removeEmptyAttrs.js

@@ -0,0 +1,33 @@
+'use strict';
+
+const { attrsGroups } = require('./_collections.js');
+
+exports.type = 'visitor';
+exports.name = 'removeEmptyAttrs';
+exports.active = true;
+exports.description = 'removes empty attributes';
+
+/**
+ * Remove attributes with empty values.
+ *
+ * @author Kir Belevich
+ *
+ * @type {import('../lib/types').Plugin<void>}
+ */
+exports.fn = () => {
+  return {
+    element: {
+      enter: (node) => {
+        for (const [name, value] of Object.entries(node.attributes)) {
+          if (
+            value === '' &&
+            // empty conditional processing attributes prevents elements from rendering
+            attrsGroups.conditionalProcessing.includes(name) === false
+          ) {
+            delete node.attributes[name];
+          }
+        }
+      },
+    },
+  };
+};