From 80fc6737d5445b3756f8677b81e3b5679e713fd6 Mon Sep 17 00:00:00 2001 From: Remus Mate Date: Thu, 12 Oct 2023 11:10:45 +1100 Subject: [PATCH 1/4] source.macro: preserve new lines --- .changeset/red-melons-compete.md | 5 +++++ packages/source.macro/source.macro.cjs | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) create mode 100644 .changeset/red-melons-compete.md diff --git a/.changeset/red-melons-compete.md b/.changeset/red-melons-compete.md new file mode 100644 index 00000000000..0b4d57eb5c1 --- /dev/null +++ b/.changeset/red-melons-compete.md @@ -0,0 +1,5 @@ +--- +'@braid-design-system/source.macro': patch +--- + +Preserve newlines in the output code diff --git a/packages/source.macro/source.macro.cjs b/packages/source.macro/source.macro.cjs index 48a7ed022b3..4959ea974f4 100644 --- a/packages/source.macro/source.macro.cjs +++ b/packages/source.macro/source.macro.cjs @@ -9,7 +9,7 @@ module.exports = createMacro( references.default.forEach(({ parentPath }) => { const value = parentPath.node.arguments[0] || t.identifier('undefined'); - const code = t.stringLiteral(generate(value).code); + const code = t.stringLiteral(generate(value, { retainLines: true }).code); return parentPath.replaceWith( codeOnly From 98d7c6c3a819cf66c6117bbc05a1f9c20e968217 Mon Sep 17 00:00:00 2001 From: Remus Mate Date: Thu, 12 Oct 2023 11:33:54 +1100 Subject: [PATCH 2/4] remove leading newlines --- packages/source.macro/source.macro.cjs | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/source.macro/source.macro.cjs b/packages/source.macro/source.macro.cjs index 4959ea974f4..f0f6d581e1b 100644 --- a/packages/source.macro/source.macro.cjs +++ b/packages/source.macro/source.macro.cjs @@ -9,7 +9,9 @@ module.exports = createMacro( references.default.forEach(({ parentPath }) => { const value = parentPath.node.arguments[0] || t.identifier('undefined'); - const code = t.stringLiteral(generate(value, { retainLines: true }).code); + const code = t.stringLiteral( + generate(value, { retainLines: true }).code.replace(/^\n+/, ''), + ); return parentPath.replaceWith( codeOnly From c38f1deda3302acd91487091414062624ceef3a9 Mon Sep 17 00:00:00 2001 From: Remus Mate <3297808+mrm007@users.noreply.github.com> Date: Thu, 12 Oct 2023 12:13:57 +1100 Subject: [PATCH 3/4] Update red-melons-compete.md Co-authored-by: Michael Taranto --- .changeset/red-melons-compete.md | 30 +++++++++++++++++++++++++++++- 1 file changed, 29 insertions(+), 1 deletion(-) diff --git a/.changeset/red-melons-compete.md b/.changeset/red-melons-compete.md index 0b4d57eb5c1..df05301463f 100644 --- a/.changeset/red-melons-compete.md +++ b/.changeset/red-melons-compete.md @@ -2,4 +2,32 @@ '@braid-design-system/source.macro': patch --- -Preserve newlines in the output code +Preserve new lines in the output code + +Before: +```ts +const responsiveValue = useResponsiveValue() +const isMobile = responsiveValue({ + mobile: true, + tablet: false, +}) +const isDesktopOrAbove = responsiveValue({ + mobile: false, + desktop: true, +}) +``` + +After: +```ts +const responsiveValue = useResponsiveValue() + +const isMobile = responsiveValue({ + mobile: true, + tablet: false, +}) + +const isDesktopOrAbove = responsiveValue({ + mobile: false, + desktop: true, +}) +``` From 1d3f33af1badd948aa45400d603744ceed89aaf2 Mon Sep 17 00:00:00 2001 From: Remus Mate Date: Thu, 12 Oct 2023 14:18:59 +1100 Subject: [PATCH 4/4] add test case with new lines --- .../__snapshots__/source.macro.test.ts.snap | 43 ++++++++++++++++++- packages/source.macro/source.macro.test.ts | 15 +++++++ 2 files changed, 57 insertions(+), 1 deletion(-) diff --git a/packages/source.macro/__snapshots__/source.macro.test.ts.snap b/packages/source.macro/__snapshots__/source.macro.test.ts.snap index ed798f3947b..9f411e8f69c 100644 --- a/packages/source.macro/__snapshots__/source.macro.test.ts.snap +++ b/packages/source.macro/__snapshots__/source.macro.test.ts.snap @@ -56,7 +56,48 @@ const foo = 'bar'; `; -exports[`source.macro 4. code only: 4. code only 1`] = ` +exports[`source.macro 4. with new lines: 4. with new lines 1`] = ` + + +import source from './source.macro'; + +const options = source(() => { + sideEffect(); + + return [ + { value: "1", label: "Option 1" }, + { value: "2", label: "Option 2" }, + { value: "3", label: "Option 3" }, + ]; +}); + + + ↓ ↓ ↓ ↓ ↓ ↓ + +const options = { + code: '() => {\\n sideEffect();\\n\\n return [\\n { value: "1", label: "Option 1" },\\n { value: "2", label: "Option 2" },\\n { value: "3", label: "Option 3" }];\\n\\n}', + value: () => { + sideEffect(); + return [ + { + value: '1', + label: 'Option 1', + }, + { + value: '2', + label: 'Option 2', + }, + { + value: '3', + label: 'Option 3', + }, + ]; + }, +}; + +`; + +exports[`source.macro 5. code only: 5. code only 1`] = ` import source from './source.macro'; diff --git a/packages/source.macro/source.macro.test.ts b/packages/source.macro/source.macro.test.ts index 7302f02ef55..f14efd60223 100644 --- a/packages/source.macro/source.macro.test.ts +++ b/packages/source.macro/source.macro.test.ts @@ -39,6 +39,21 @@ pluginTester({ const foo = 'bar'; `, }, + 'with new lines': { + code: /* ts */ ` + import source from './source.macro'; + + const options = source(() => { + sideEffect(); + + return [ + { value: "1", label: "Option 1" }, + { value: "2", label: "Option 2" }, + { value: "3", label: "Option 3" }, + ]; + }); + `, + }, 'code only': { pluginOptions: { source: { codeOnly: true } }, code: /* ts */ `