diff --git a/packages/lucide-preact/tests/__snapshots__/lucide-preact.spec.tsx.snap b/packages/lucide-preact/tests/__snapshots__/lucide-preact.spec.tsx.snap index e831f78e8e3..0647c415004 100644 --- a/packages/lucide-preact/tests/__snapshots__/lucide-preact.spec.tsx.snap +++ b/packages/lucide-preact/tests/__snapshots__/lucide-preact.spec.tsx.snap @@ -12,14 +12,7 @@ exports[`Using lucide icon components > should adjust the size, stroke color and stroke-linejoin="round" class="lucide lucide-grid3x3" > - - - + `; @@ -36,14 +29,7 @@ exports[`Using lucide icon components > should not scale the strokeWidth when ab stroke-linejoin="round" class="lucide lucide-grid3x3" > - - - + `; @@ -60,14 +46,7 @@ exports[`Using lucide icon components > should render an component 1`] = ` stroke-linejoin="round" class="lucide lucide-grid3x3" > - - - + `; diff --git a/packages/lucide-react-native/tests/__snapshots__/lucide-react-native.spec.tsx.snap b/packages/lucide-react-native/tests/__snapshots__/lucide-react-native.spec.tsx.snap index 34fc8fbafe5..62a28db7a7e 100644 --- a/packages/lucide-react-native/tests/__snapshots__/lucide-react-native.spec.tsx.snap +++ b/packages/lucide-react-native/tests/__snapshots__/lucide-react-native.spec.tsx.snap @@ -11,24 +11,12 @@ exports[`Using lucide icon components > should adjust the size, stroke color and stroke-linecap="round" stroke-linejoin="round" > - - @@ -46,24 +34,12 @@ exports[`Using lucide icon components > should duplicate properties to children stroke-linejoin="round" data-testid="multiple-children" > - - @@ -80,24 +56,12 @@ exports[`Using lucide icon components > should not scale the strokeWidth when ab stroke-linecap="round" stroke-linejoin="round" > - - @@ -114,24 +78,12 @@ exports[`Using lucide icon components > should render an component 1`] = ` stroke-linecap="round" stroke-linejoin="round" > - - @@ -149,24 +101,12 @@ exports[`Using lucide icon components > should work with a single child componen stroke-linejoin="round" data-testid="single-child" > - - should work with a single child componen stroke-linejoin="round" data-testid="child" > - - @@ -216,24 +144,12 @@ exports[`Using lucide icon components > should work with several children compon stroke-linejoin="round" data-testid="multiple-children" > - - should work with several children compon stroke-linejoin="round" data-testid="child1" > - - @@ -279,24 +183,12 @@ exports[`Using lucide icon components > should work with several children compon stroke-linejoin="round" data-testid="child2" > - - diff --git a/packages/lucide-react/tests/__snapshots__/lucide-react.spec.tsx.snap b/packages/lucide-react/tests/__snapshots__/lucide-react.spec.tsx.snap index e831f78e8e3..0647c415004 100644 --- a/packages/lucide-react/tests/__snapshots__/lucide-react.spec.tsx.snap +++ b/packages/lucide-react/tests/__snapshots__/lucide-react.spec.tsx.snap @@ -12,14 +12,7 @@ exports[`Using lucide icon components > should adjust the size, stroke color and stroke-linejoin="round" class="lucide lucide-grid3x3" > - - - + `; @@ -36,14 +29,7 @@ exports[`Using lucide icon components > should not scale the strokeWidth when ab stroke-linejoin="round" class="lucide lucide-grid3x3" > - - - + `; @@ -60,14 +46,7 @@ exports[`Using lucide icon components > should render an component 1`] = ` stroke-linejoin="round" class="lucide lucide-grid3x3" > - - - + `; diff --git a/packages/lucide-solid/tests/__snapshots__/lucide-solid.spec.tsx.snap b/packages/lucide-solid/tests/__snapshots__/lucide-solid.spec.tsx.snap index 2c3771c2ff5..d340eb7f6d4 100644 --- a/packages/lucide-solid/tests/__snapshots__/lucide-solid.spec.tsx.snap +++ b/packages/lucide-solid/tests/__snapshots__/lucide-solid.spec.tsx.snap @@ -13,16 +13,8 @@ exports[`Using lucide icon components > should adjust the size, stroke color and class="lucide lucide-icon lucide-grid3x3" data-testid="grid-icon" > - - - @@ -41,16 +33,8 @@ exports[`Using lucide icon components > should not scale the strokeWidth when ab class="lucide lucide-icon lucide-grid3x3" data-testid="grid-icon" > - - - @@ -68,16 +52,8 @@ exports[`Using lucide icon components > should render a component 1`] = ` stroke-width="2" class="lucide lucide-icon lucide-grid3x3" > - - - diff --git a/packages/lucide/tests/__snapshots__/lucide.spec.js.snap b/packages/lucide/tests/__snapshots__/lucide.spec.js.snap index 2ad7fa641b7..f29eb2ae1ca 100644 --- a/packages/lucide/tests/__snapshots__/lucide.spec.js.snap +++ b/packages/lucide/tests/__snapshots__/lucide.spec.js.snap @@ -31,14 +31,7 @@ exports[`createIcons > should read elements from DOM and replace icon with alias data-lucide="grid" class="lucide lucide-grid" > - - - + `; diff --git a/scripts/render/processSvg.mjs b/scripts/render/processSvg.mjs index 1ada63bd1a6..dd288406800 100644 --- a/scripts/render/processSvg.mjs +++ b/scripts/render/processSvg.mjs @@ -24,7 +24,7 @@ function svgoPlugins(flatten) { const convertShapeToPath = flatten && { convertArcs: true }; const mergePaths = flatten && { force: true }; - return [ + const plugins = [ { name: 'removeAttrs', params: { attrs: '(fill|stroke.*)' }, @@ -39,6 +39,62 @@ function svgoPlugins(flatten) { }, }, ]; + + if (flatten) { + plugins.splice(1, 0, { + name: 'convertRectToPath', + fn: () => { + return { + element: { + enter: convertRectToPath, + }, + }; + }, + }); + } + + return plugins; +} + +function convertRectToPath(node, parentNode) { + if (node.name != 'rect' || node.attributes.width == null || node.attributes.height == null) { + return; + } + + // convert rect to path + const x = Number(node.attributes.x || '0'); + const y = Number(node.attributes.y || '0'); + const width = Number(node.attributes.width); + const height = Number(node.attributes.height); + const rx = Math.min(Number(node.attributes.rx || node.attributes.ry || '0'), width / 2); + const ry = Math.min(Number(node.attributes.ry || node.attributes.rx || '0'), height / 2); + if (Number.isNaN(x - y + width - height + rx - ry)) return; + + let pathData = ''; + if (rx == 0 || ry == 0) { + pathData += `M${x} ${y}H${x + width}V${y + height}H${x}z`; + } else if (rx > 0 && ry > 0) { + pathData += `M${x + rx} ${y}`; + pathData += `H${x + width - rx}`; + pathData += `a${rx} ${ry} 0 0 1 ${rx} ${ry}`; + pathData += `V${y + height - ry}`; + pathData += `a${rx} ${ry} 0 0 1 ${-rx} ${ry}`; + pathData += `H${x + rx}`; + pathData += `a${rx} ${ry} 0 0 1 ${-rx} ${-ry}`; + pathData += `V${y + ry}`; + pathData += `a${rx} ${ry} 0 0 1 ${rx} ${-ry}`; + pathData += 'z'; + } else { + return; + } + node.name = 'path'; + node.attributes.d = pathData; + delete node.attributes.x; + delete node.attributes.y; + delete node.attributes.width; + delete node.attributes.height; + delete node.attributes.rx; + delete node.attributes.ry; } /**