diff --git a/.changeset/red-days-scream.md b/.changeset/red-days-scream.md new file mode 100644 index 0000000..18af596 --- /dev/null +++ b/.changeset/red-days-scream.md @@ -0,0 +1,5 @@ +--- +'@tabula/forge': major +--- + +enable `memo` by default for SVGR transformations diff --git a/.changeset/wet-students-sing.md b/.changeset/wet-students-sing.md new file mode 100644 index 0000000..c38eb9d --- /dev/null +++ b/.changeset/wet-students-sing.md @@ -0,0 +1,4 @@ +--- +--- + +update development dependencies diff --git a/package.json b/package.json index 67fbf05..119fbdd 100644 --- a/package.json +++ b/package.json @@ -52,7 +52,7 @@ "@commitlint/config-conventional": "^18.4.3", "@tabula/eslint-config": "^0.1.1", "@tabula/prettier-config": "^0.1.4", - "@tabula/typescript-config": "^0.2.0", + "@tabula/typescript-config": "^0.2.1", "@tabula/vitest-config": "^0.2.0", "@types/convert-source-map": "^2.0.3", "@types/node": "^20.10.5", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 9e31a92..54ad601 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -98,8 +98,8 @@ devDependencies: specifier: ^0.1.4 version: 0.1.4(prettier@3.1.1) '@tabula/typescript-config': - specifier: ^0.2.0 - version: 0.2.0(typescript@5.3.3) + specifier: ^0.2.1 + version: 0.2.1(typescript@5.3.3) '@tabula/vitest-config': specifier: ^0.2.0 version: 0.2.0(react-dom@18.2.0)(react@18.2.0)(vitest@1.1.0) @@ -1739,10 +1739,10 @@ packages: - supports-color dev: true - /@tabula/typescript-config@0.2.0(typescript@5.3.3): - resolution: {integrity: sha512-cZXCvI0Mwch71TAyJDvQsaWB2Vp/Z6vKaPsy8Gj0hvYEUhqh9BgRWnZ7X0Cq1u+DavHmON9Ins3iub9a6BABuA==} + /@tabula/typescript-config@0.2.1(typescript@5.3.3): + resolution: {integrity: sha512-PQL9B+BtGPb6kf/zrqvH6NBt/k+I/oM723u57qqL0SjtCyQCMI5ximwvW15j06hlJKFNxYVN4ytqKt97lhqSEg==} peerDependencies: - typescript: ^5.3.2 + typescript: ^5.3.3 dependencies: typescript: 5.3.3 optionalDependencies: diff --git a/src/plugins/svgPlugin/svgPlugin.ts b/src/plugins/svgPlugin/svgPlugin.ts index 5b4d7b8..61db5a4 100644 --- a/src/plugins/svgPlugin/svgPlugin.ts +++ b/src/plugins/svgPlugin/svgPlugin.ts @@ -23,10 +23,10 @@ export function svgPlugin(): Plugin { const minify = Boolean(initialOptions.minify); // NOTE: The `svgr` uses runtime config over CLI config. We avoid this behaviour. - const userConfig = await cosmiconfig('svgr').search(); + const userConfig: { config: Config } | null = await cosmiconfig('svgr').search(); const config: Config = { - ...(userConfig?.config as Config | null), + ...userConfig?.config, exportType: 'named', namedExport: 'ReactComponent', @@ -35,6 +35,8 @@ export function svgPlugin(): Plugin { svgo: minify, }; + config.memo = userConfig?.config.memo ?? true; + onResolve( { filter: /^ni:svgr;/, diff --git a/tests/__snapshots__/browser.test.ts.snap b/tests/__snapshots__/browser.test.ts.snap index bc6d769..9fcdd10 100644 --- a/tests/__snapshots__/browser.test.ts.snap +++ b/tests/__snapshots__/browser.test.ts.snap @@ -270,28 +270,32 @@ var js_default = "./assets/js.svg"; // src/assets/js.svg?svgr import * as React from "react"; +import { memo } from "react"; import { jsx, jsxs } from "react/jsx-runtime"; var js_default2 = js_default; var SvgJs = (props) => /* @__PURE__ */ jsxs("svg", { id: "Layer_1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", x: "0px", y: "0px", width: "120px", height: "120px", viewBox: "0 0 120 120", enableBackground: "new 0 0 120 120", xmlSpace: "preserve", ...props, children: [ /* @__PURE__ */ jsx("circle", { cx: 60, cy: 60.583, r: 14.409 }), /* @__PURE__ */ jsx("text", { children: "\\n JS\\n " }) ] }); +var Memo = memo(SvgJs); // src/assets/shared.svg?svgr import * as React2 from "react"; +import { memo as memo2 } from "react"; import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime"; var SvgShared = (props) => /* @__PURE__ */ jsxs2("svg", { id: "Layer_1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", x: "0px", y: "0px", width: "120px", height: "120px", viewBox: "0 0 120 120", enableBackground: "new 0 0 120 120", xmlSpace: "preserve", ...props, children: [ /* @__PURE__ */ jsx2("circle", { cx: 60, cy: 60.583, r: 14.409 }), /* @__PURE__ */ jsx2("text", { children: "\\n Shared\\n " }) ] }); +var Memo2 = memo2(SvgShared); // src/Button.tsx import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime"; var Button = ({ children, onClick }) => /* @__PURE__ */ jsxs3("button", { className: Button_default.root, onClick, type: "button", children: [ /* @__PURE__ */ jsx3("img", { src: js_default2 }), - /* @__PURE__ */ jsx3(SvgJs, {}), + /* @__PURE__ */ jsx3(Memo, {}), /* @__PURE__ */ jsxs3("span", { className: Button_default.label, children: [ - /* @__PURE__ */ jsx3(SvgShared, {}), + /* @__PURE__ */ jsx3(Memo2, {}), children ] }) ] }); @@ -490,6 +494,96 @@ export { " `; +exports[`browser > SVG support > .svgrrc > use \`memo\` option from config if provided 1`] = ` +"import "./index.css"; + +// src/Button.module.css +var Button_default = { + "root": "browser_svgr_config_memo__src-Button-module__root", + "label": "browser_svgr_config_memo__src-Button-module__label" +}; + +// src/assets/js.svg +var js_default = "./assets/js.svg"; + +// src/assets/js.svg?svgr +import * as React from "react"; +import { jsxDEV } from "react/jsx-dev-runtime"; +var js_default2 = js_default; +var SvgJs = (props) => /* @__PURE__ */ jsxDEV("svg", { id: "Layer_1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", x: "0px", y: "0px", width: "120px", height: "120px", viewBox: "0 0 120 120", enableBackground: "new 0 0 120 120", xmlSpace: "preserve", ...props, children: [ + /* @__PURE__ */ jsxDEV("circle", { cx: 60, cy: 60.583, r: 14.409 }, void 0, false, { + fileName: "src/assets/js.svg?svgr", + lineNumber: 4, + columnNumber: 252 + }), + /* @__PURE__ */ jsxDEV("text", { children: "\\n JS\\n " }, void 0, false, { + fileName: "src/assets/js.svg?svgr", + lineNumber: 4, + columnNumber: 293 + }) +] }, void 0, true, { + fileName: "src/assets/js.svg?svgr", + lineNumber: 4, + columnNumber: 24 +}); + +// src/assets/shared.svg?svgr +import * as React2 from "react"; +import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime"; +var SvgShared = (props) => /* @__PURE__ */ jsxDEV2("svg", { id: "Layer_1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", x: "0px", y: "0px", width: "120px", height: "120px", viewBox: "0 0 120 120", enableBackground: "new 0 0 120 120", xmlSpace: "preserve", ...props, children: [ + /* @__PURE__ */ jsxDEV2("circle", { cx: 60, cy: 60.583, r: 14.409 }, void 0, false, { + fileName: "src/assets/shared.svg?svgr", + lineNumber: 4, + columnNumber: 256 + }), + /* @__PURE__ */ jsxDEV2("text", { children: "\\n Shared\\n " }, void 0, false, { + fileName: "src/assets/shared.svg?svgr", + lineNumber: 4, + columnNumber: 297 + }) +] }, void 0, true, { + fileName: "src/assets/shared.svg?svgr", + lineNumber: 4, + columnNumber: 28 +}); + +// src/Button.tsx +import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime"; +var Button = ({ children, onClick }) => /* @__PURE__ */ jsxDEV3("button", { className: Button_default.root, onClick, type: "button", children: [ + /* @__PURE__ */ jsxDEV3("img", { src: js_default2 }, void 0, false, { + fileName: "src/Button.tsx", + lineNumber: 14, + columnNumber: 5 + }), + /* @__PURE__ */ jsxDEV3(SvgJs, {}, void 0, false, { + fileName: "src/Button.tsx", + lineNumber: 15, + columnNumber: 5 + }), + /* @__PURE__ */ jsxDEV3("span", { className: Button_default.label, children: [ + /* @__PURE__ */ jsxDEV3(SvgShared, {}, void 0, false, { + fileName: "src/Button.tsx", + lineNumber: 17, + columnNumber: 7 + }), + children + ] }, void 0, true, { + fileName: "src/Button.tsx", + lineNumber: 16, + columnNumber: 5 + }) +] }, void 0, true, { + fileName: "src/Button.tsx", + lineNumber: 13, + columnNumber: 3 +}); +export { + Button +}; +//# sourceMappingURL=index.js.map +" +`; + exports[`browser > SVG support > minify SVG when production mode is on 1`] = ` " @@ -543,28 +637,32 @@ var js_default = "./assets/js.svg"; // src/assets/js.svg?svgr import * as React from "react"; +import { memo } from "react"; import { jsx, jsxs } from "react/jsx-runtime"; var js_default2 = js_default; var SvgJs = (props) => /* @__PURE__ */ jsxs("svg", { id: "Layer_1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", x: "0px", y: "0px", width: "120px", height: "120px", viewBox: "0 0 120 120", enableBackground: "new 0 0 120 120", xmlSpace: "preserve", ...props, children: [ /* @__PURE__ */ jsx("circle", { cx: 60, cy: 60.583, r: 14.409 }), /* @__PURE__ */ jsx("text", { children: "\\n JS\\n " }) ] }); +var Memo = memo(SvgJs); // src/assets/shared.svg?svgr import * as React2 from "react"; +import { memo as memo2 } from "react"; import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime"; var SvgShared = (props) => /* @__PURE__ */ jsxs2("svg", { id: "Layer_1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", x: "0px", y: "0px", width: "120px", height: "120px", viewBox: "0 0 120 120", enableBackground: "new 0 0 120 120", xmlSpace: "preserve", ...props, children: [ /* @__PURE__ */ jsx2("circle", { cx: 60, cy: 60.583, r: 14.409 }), /* @__PURE__ */ jsx2("text", { children: "\\n Shared\\n " }) ] }); +var Memo2 = memo2(SvgShared); // src/Button.tsx import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime"; var Button = ({ children, onClick }) => /* @__PURE__ */ jsxs3("button", { className: Button_default.root, onClick, type: "button", children: [ /* @__PURE__ */ jsx3("img", { src: js_default2 }), - /* @__PURE__ */ jsx3(SvgJs, {}), + /* @__PURE__ */ jsx3(Memo, {}), /* @__PURE__ */ jsxs3("span", { className: Button_default.label, children: [ - /* @__PURE__ */ jsx3(SvgShared, {}), + /* @__PURE__ */ jsx3(Memo2, {}), children ] }) ] }); @@ -639,44 +737,48 @@ var js_default = "./assets/js.svg"; // src/assets/js.svg?svgr import * as React from "react"; +import { memo } from "react"; import { jsxDEV } from "react/jsx-dev-runtime"; var js_default2 = js_default; var SvgJs = (props) => /* @__PURE__ */ jsxDEV("svg", { id: "Layer_1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", x: "0px", y: "0px", width: "120px", height: "120px", viewBox: "0 0 120 120", enableBackground: "new 0 0 120 120", xmlSpace: "preserve", ...props, children: [ /* @__PURE__ */ jsxDEV("circle", { cx: 60, cy: 60.583, r: 14.409 }, void 0, false, { fileName: "src/assets/js.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 252 }), /* @__PURE__ */ jsxDEV("text", { children: "\\n JS\\n " }, void 0, false, { fileName: "src/assets/js.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 293 }) ] }, void 0, true, { fileName: "src/assets/js.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 24 }); +var Memo = memo(SvgJs); // src/assets/shared.svg?svgr import * as React2 from "react"; +import { memo as memo2 } from "react"; import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime"; var SvgShared = (props) => /* @__PURE__ */ jsxDEV2("svg", { id: "Layer_1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", x: "0px", y: "0px", width: "120px", height: "120px", viewBox: "0 0 120 120", enableBackground: "new 0 0 120 120", xmlSpace: "preserve", ...props, children: [ /* @__PURE__ */ jsxDEV2("circle", { cx: 60, cy: 60.583, r: 14.409 }, void 0, false, { fileName: "src/assets/shared.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 256 }), /* @__PURE__ */ jsxDEV2("text", { children: "\\n Shared\\n " }, void 0, false, { fileName: "src/assets/shared.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 297 }) ] }, void 0, true, { fileName: "src/assets/shared.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 28 }); +var Memo2 = memo2(SvgShared); // src/Button.tsx import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime"; @@ -686,13 +788,13 @@ var Button = ({ children, onClick }) => /* @__PURE__ */ jsxDEV3("button", { clas lineNumber: 14, columnNumber: 5 }), - /* @__PURE__ */ jsxDEV3(SvgJs, {}, void 0, false, { + /* @__PURE__ */ jsxDEV3(Memo, {}, void 0, false, { fileName: "src/Button.tsx", lineNumber: 15, columnNumber: 5 }), /* @__PURE__ */ jsxDEV3("span", { className: Button_default.label, children: [ - /* @__PURE__ */ jsxDEV3(SvgShared, {}, void 0, false, { + /* @__PURE__ */ jsxDEV3(Memo2, {}, void 0, false, { fileName: "src/Button.tsx", lineNumber: 17, columnNumber: 7 @@ -742,44 +844,48 @@ var js_default = "./assets/js.svg"; // src/assets/js.svg?svgr import * as React from "react"; +import { memo } from "react"; import { jsxDEV } from "react/jsx-dev-runtime"; var js_default2 = js_default; var SvgJs = (props) => /* @__PURE__ */ jsxDEV("svg", { id: "Layer_1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", x: "0px", y: "0px", width: "120px", height: "120px", viewBox: "0 0 120 120", enableBackground: "new 0 0 120 120", xmlSpace: "preserve", ...props, children: [ /* @__PURE__ */ jsxDEV("circle", { cx: 60, cy: 60.583, r: 14.409 }, void 0, false, { fileName: "src/assets/js.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 252 }), /* @__PURE__ */ jsxDEV("text", { children: "\\n JS\\n " }, void 0, false, { fileName: "src/assets/js.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 293 }) ] }, void 0, true, { fileName: "src/assets/js.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 24 }); +var Memo = memo(SvgJs); // src/assets/shared.svg?svgr import * as React2 from "react"; +import { memo as memo2 } from "react"; import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime"; var SvgShared = (props) => /* @__PURE__ */ jsxDEV2("svg", { id: "Layer_1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", x: "0px", y: "0px", width: "120px", height: "120px", viewBox: "0 0 120 120", enableBackground: "new 0 0 120 120", xmlSpace: "preserve", ...props, children: [ /* @__PURE__ */ jsxDEV2("circle", { cx: 60, cy: 60.583, r: 14.409 }, void 0, false, { fileName: "src/assets/shared.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 256 }), /* @__PURE__ */ jsxDEV2("text", { children: "\\n Shared\\n " }, void 0, false, { fileName: "src/assets/shared.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 297 }) ] }, void 0, true, { fileName: "src/assets/shared.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 28 }); +var Memo2 = memo2(SvgShared); // src/Button.tsx import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime"; @@ -789,13 +895,13 @@ var Button = ({ children, onClick }) => /* @__PURE__ */ jsxDEV3("button", { clas lineNumber: 14, columnNumber: 5 }), - /* @__PURE__ */ jsxDEV3(SvgJs, {}, void 0, false, { + /* @__PURE__ */ jsxDEV3(Memo, {}, void 0, false, { fileName: "src/Button.tsx", lineNumber: 15, columnNumber: 5 }), /* @__PURE__ */ jsxDEV3("span", { className: Button_default.label, children: [ - /* @__PURE__ */ jsxDEV3(SvgShared, {}, void 0, false, { + /* @__PURE__ */ jsxDEV3(Memo2, {}, void 0, false, { fileName: "src/Button.tsx", lineNumber: 17, columnNumber: 7 @@ -845,44 +951,48 @@ var js_default = "./assets/js.svg"; // src/assets/js.svg?svgr import * as React from "react"; +import { memo } from "react"; import { jsxDEV } from "react/jsx-dev-runtime"; var js_default2 = js_default; var SvgJs = (props) => /* @__PURE__ */ jsxDEV("svg", { id: "Layer_1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", x: "0px", y: "0px", width: "120px", height: "120px", viewBox: "0 0 120 120", enableBackground: "new 0 0 120 120", xmlSpace: "preserve", ...props, children: [ /* @__PURE__ */ jsxDEV("circle", { cx: 60, cy: 60.583, r: 14.409 }, void 0, false, { fileName: "src/assets/js.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 252 }), /* @__PURE__ */ jsxDEV("text", { children: "\\n JS\\n " }, void 0, false, { fileName: "src/assets/js.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 293 }) ] }, void 0, true, { fileName: "src/assets/js.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 24 }); +var Memo = memo(SvgJs); // src/assets/shared.svg?svgr import * as React2 from "react"; +import { memo as memo2 } from "react"; import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime"; var SvgShared = (props) => /* @__PURE__ */ jsxDEV2("svg", { id: "Layer_1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", x: "0px", y: "0px", width: "120px", height: "120px", viewBox: "0 0 120 120", enableBackground: "new 0 0 120 120", xmlSpace: "preserve", ...props, children: [ /* @__PURE__ */ jsxDEV2("circle", { cx: 60, cy: 60.583, r: 14.409 }, void 0, false, { fileName: "src/assets/shared.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 256 }), /* @__PURE__ */ jsxDEV2("text", { children: "\\n Shared\\n " }, void 0, false, { fileName: "src/assets/shared.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 297 }) ] }, void 0, true, { fileName: "src/assets/shared.svg?svgr", - lineNumber: 4, + lineNumber: 5, columnNumber: 28 }); +var Memo2 = memo2(SvgShared); // src/Button.tsx import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime"; @@ -892,13 +1002,13 @@ var Button = ({ children, onClick }) => /* @__PURE__ */ jsxDEV3("button", { clas lineNumber: 14, columnNumber: 5 }), - /* @__PURE__ */ jsxDEV3(SvgJs, {}, void 0, false, { + /* @__PURE__ */ jsxDEV3(Memo, {}, void 0, false, { fileName: "src/Button.tsx", lineNumber: 15, columnNumber: 5 }), /* @__PURE__ */ jsxDEV3("span", { className: Button_default.label, children: [ - /* @__PURE__ */ jsxDEV3(SvgShared, {}, void 0, false, { + /* @__PURE__ */ jsxDEV3(Memo2, {}, void 0, false, { fileName: "src/Button.tsx", lineNumber: 17, columnNumber: 7 diff --git a/tests/browser.test.ts b/tests/browser.test.ts index 9aab389..84b4c52 100644 --- a/tests/browser.test.ts +++ b/tests/browser.test.ts @@ -760,6 +760,20 @@ describe('browser', () => { expect(await c.read('lib/index.js')).toMatchSnapshot(); }, ); + + it( + 'use `memo` option from config if provided', + { + command: 'build', + dependencies: ['@types/react'], + name: 'browser-svgr-config-memo', + target: 'browser', + production: false, + }, + async (c) => { + expect(await c.read('lib/index.js')).toMatchSnapshot(); + }, + ); }); }); diff --git a/tests/fixtures/browser-svgr-config-memo/.svgrrc b/tests/fixtures/browser-svgr-config-memo/.svgrrc new file mode 100644 index 0000000..53eaaba --- /dev/null +++ b/tests/fixtures/browser-svgr-config-memo/.svgrrc @@ -0,0 +1,3 @@ +{ + "memo": false +} diff --git a/tests/fixtures/browser-svgr-config-memo/package.json b/tests/fixtures/browser-svgr-config-memo/package.json new file mode 100644 index 0000000..0aee7c6 --- /dev/null +++ b/tests/fixtures/browser-svgr-config-memo/package.json @@ -0,0 +1,17 @@ +{ + "name": "browser-svgr-config-memo", + "version": "1.0.0", + "type": "module", + "module": "lib/index.js", + "exports": { + ".": { + "import": "./lib/index.js" + } + }, + "files": [ + "lib" + ], + "peerDependencies": { + "react": "^18.2.0" + } +} diff --git a/tests/fixtures/browser-svgr-config-memo/src/Button.module.css b/tests/fixtures/browser-svgr-config-memo/src/Button.module.css new file mode 100644 index 0000000..809f488 --- /dev/null +++ b/tests/fixtures/browser-svgr-config-memo/src/Button.module.css @@ -0,0 +1,7 @@ +.root { + background-image: url(./assets/css.svg); +} + +.label { + background-image: url(./assets/shared.svg); +} diff --git a/tests/fixtures/browser-svgr-config-memo/src/Button.tsx b/tests/fixtures/browser-svgr-config-memo/src/Button.tsx new file mode 100644 index 0000000..af738dd --- /dev/null +++ b/tests/fixtures/browser-svgr-config-memo/src/Button.tsx @@ -0,0 +1,21 @@ +import { FC, MouseEventHandler, PropsWithChildren } from 'react'; + +import styles from './Button.module.css'; + +import imageUrl, { ReactComponent as Image } from './assets/js.svg'; +import { ReactComponent as Shared } from './assets/shared.svg'; + +type Props = PropsWithChildren<{ + onClick: MouseEventHandler; +}>; + +export const Button: FC = ({ children, onClick }: Props) => ( + +); diff --git a/tests/fixtures/browser-svgr-config-memo/src/assets/css.svg b/tests/fixtures/browser-svgr-config-memo/src/assets/css.svg new file mode 100644 index 0000000..9e09913 --- /dev/null +++ b/tests/fixtures/browser-svgr-config-memo/src/assets/css.svg @@ -0,0 +1,9 @@ + + + + + + + CSS + + diff --git a/tests/fixtures/browser-svgr-config-memo/src/assets/js.svg b/tests/fixtures/browser-svgr-config-memo/src/assets/js.svg new file mode 100644 index 0000000..e0c8939 --- /dev/null +++ b/tests/fixtures/browser-svgr-config-memo/src/assets/js.svg @@ -0,0 +1,9 @@ + + + + + + + JS + + diff --git a/tests/fixtures/browser-svgr-config-memo/src/assets/shared.svg b/tests/fixtures/browser-svgr-config-memo/src/assets/shared.svg new file mode 100644 index 0000000..7177954 --- /dev/null +++ b/tests/fixtures/browser-svgr-config-memo/src/assets/shared.svg @@ -0,0 +1,9 @@ + + + + + + + Shared + + diff --git a/tests/fixtures/browser-svgr-config-memo/src/index.ts b/tests/fixtures/browser-svgr-config-memo/src/index.ts new file mode 100644 index 0000000..fe9c53c --- /dev/null +++ b/tests/fixtures/browser-svgr-config-memo/src/index.ts @@ -0,0 +1 @@ +export { Button } from './Button'; diff --git a/tests/fixtures/browser-svgr-config-memo/tsconfig.forge.json b/tests/fixtures/browser-svgr-config-memo/tsconfig.forge.json new file mode 100644 index 0000000..820c793 --- /dev/null +++ b/tests/fixtures/browser-svgr-config-memo/tsconfig.forge.json @@ -0,0 +1,5 @@ +{ + "extends": "@tabula/typescript-config/tsconfig.browser.json", + + "include": ["src"] +} diff --git a/tests/fixtures/browser-svgr-config/.svgrrc b/tests/fixtures/browser-svgr-config/.svgrrc index 7321ff2..eebae67 100644 --- a/tests/fixtures/browser-svgr-config/.svgrrc +++ b/tests/fixtures/browser-svgr-config/.svgrrc @@ -1,6 +1,5 @@ { "exportType": "default", - "memo": true, "namedExport": "SVGComponent", "svgo": true }