1"use strict";(globalThis.webpackChunksvgo_dev=globalThis.webpackChunksvgo_dev||[]).push([[3792],{506:(e,s,t)=>{t.d(s,{R:()=>a,x:()=>d});var n=t(2888);const i={},o=n.createContext(i);function a(e){const s=n.useContext(o);return n.useMemo((function(){return"function"==typeof e?e(s):{...s,...e}}),[s,e])}function d(e){let s;return s=e.disableParentContext?"function"==typeof e.components?e.components(i):e.components||i:a(e.components),n.createElement(o.Provider,{value:s},e.children)}},2204:(e,s,t)=>{t.r(s),t.d(s,{assets:()=>l,contentTitle:()=>d,default:()=>u,frontMatter:()=>a,metadata:()=>n,toc:()=>c});const n=JSON.parse('{"id":"plugins/addClassesToSVGElement","title":"addClassesToSVGElement","description":"Overrides the class attribute in the outer most <svg> element, omitting duplicates or null classes if found in your configuration.","source":"@site/svgo/docs/04-plugins/addClassesToSVGElement.mdx","sourceDirName":"04-plugins","slug":"/plugins/addClassesToSVGElement","permalink":"/docs/plugins/addClassesToSVGElement","draft":false,"unlisted":false,"editUrl":"https://github.com/svg/svgo/tree/main/docs/04-plugins/addClassesToSVGElement.mdx","tags":[],"version":"current","frontMatter":{"title":"addClassesToSVGElement","svgo":{"pluginId":"addClassesToSVGElement","parameters":{"classNames":{"description":"<p>Adds the specified class names to the outer most <code><svg></code> element.</p>","default":null},"className":{"description":"<p>Adds the specified class name to the outer most <code><svg></code> element. If <code>classNames</code> is specified, this is ignored.</p>"}}}},"sidebar":"docsSidebar","previous":{"title":"addAttributesToSVGElement","permalink":"/docs/plugins/addAttributesToSVGElement"},"next":{"title":"cleanupAttrs","permalink":"/docs/plugins/cleanupAttrs"}}');var i=t(1684),o=t(506);const a={title:"addClassesToSVGElement",svgo:{pluginId:"addClassesToSVGElement",parameters:{classNames:{description:"<p>Adds the specified class names to the outer most <code><svg></code> element.</p>",default:null},className:{description:"<p>Adds the specified class name to the outer most <code><svg></code> element. If <code>classNames</code> is specified, this is ignored.</p>"}}}},d=void 0,l={},c=[];function r(e){const s={admonition:"admonition",code:"code",p:"p",...(0,o.R)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsxs)(s.p,{children:["Overrides the ",(0,i.jsx)(s.code,{children:"class"})," attribute in the outer most ",(0,i.jsx)(s.code,{children:"<svg>"})," element, omitting duplicates or null classes if found in your configuration."]}),"\n",(0,i.jsx)(s.admonition,{type:"caution",children:(0,i.jsxs)(s.p,{children:["If there is no ",(0,i.jsx)(s.code,{children:"class"})," attribute to begin with, it will be added. However, if the there were already classes assigned, these are removed and replaced with the classes configured in this plugin."]})}),"\n",(0,i.jsx)(s.p,{children:"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."}),"\n",(0,i.jsx)(s.p,{children:"By adding classes, if the parent document is aware, you can share styles across all inlined SVG elements."})]})}function u(e={}){const{wrapper:s}={...(0,o.R)(),...e.components};return s?(0,i.jsx)(s,{...e,children:(0,i.jsx)(r,{...e})}):r(e)}}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.