From 75bc5a7c034105a31e984b8f45e889f14bd13e4b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:25:11 -0700 Subject: [PATCH 01/47] Copy --- packages/swc-magic/.npmignore | 2 + packages/swc-magic/Cargo.toml | 33 + packages/swc-magic/package.json | 21 + packages/swc-magic/src/lib.rs | 24 + packages/swc-magic/transform/Cargo.toml | 39 + packages/swc-magic/transform/src/lib.rs | 7 + packages/swc-magic/transform/src/lifetime.rs | 409 ++++++++ packages/swc-magic/transform/src/style.rs | 25 + .../src/transform_css_lightningcss.rs | 589 +++++++++++ .../transform/src/transform_css_swc.rs | 393 +++++++ packages/swc-magic/transform/src/utils.rs | 371 +++++++ packages/swc-magic/transform/src/visitor.rs | 963 ++++++++++++++++++ .../tests/errors/nested-style-tags/input.js | 31 + .../nested-style-tags/output-lightningcss.js | 58 ++ .../output-lightningcss.stderr | 27 + .../errors/nested-style-tags/output-swc.js | 58 ++ .../nested-style-tags/output-swc.stderr | 27 + .../tests/errors/nested-style-tags/output.js | 58 ++ .../transform/tests/errors/no-child/input.js | 6 + .../errors/no-child/output-lightningcss.js | 8 + .../no-child/output-lightningcss.stderr | 9 + .../tests/errors/no-child/output-swc.js | 8 + .../tests/errors/no-child/output-swc.stderr | 9 + .../transform/tests/errors/no-child/output.js | 8 + .../tests/errors/ts-with-css-resolve/input.js | 10 + .../output-lightningcss.js | 5 + .../output-lightningcss.stderr | 2 + .../errors/ts-with-css-resolve/output-swc.js | 5 + .../ts-with-css-resolve/output-swc.stderr | 2 + .../errors/ts-with-css-resolve/output.js | 5 + .../tests/errors/two-children/input.js | 8 + .../two-children/output-lightningcss.js | 12 + .../two-children/output-lightningcss.stderr | 11 + .../tests/errors/two-children/output-swc.js | 12 + .../errors/two-children/output-swc.stderr | 11 + .../tests/errors/two-children/output.js | 12 + .../tests/errors/wrong-child-type/input.js | 7 + .../wrong-child-type/output-lightningcss.js | 10 + .../output-lightningcss.stderr | 10 + .../errors/wrong-child-type/output-swc.js | 10 + .../errors/wrong-child-type/output-swc.stderr | 10 + .../tests/errors/wrong-child-type/output.js | 10 + .../errors/wrong-jsx-expression-type/input.js | 7 + .../output-lightningcss.js | 10 + .../output-lightningcss.stderr | 10 + .../wrong-jsx-expression-type/output-swc.js | 10 + .../output-swc.stderr | 10 + .../wrong-jsx-expression-type/output.js | 10 + .../fixture-swc-only/next-55679/input.js | 17 + .../fixture-swc-only/next-55679/output.swc.js | 12 + packages/swc-magic/transform/tests/fixture.rs | 137 +++ .../tests/fixture/.expressions/input.js | 90 ++ .../transform/tests/fixture/absent/input.js | 6 + .../fixture/absent/output.lightningcss.js | 7 + .../tests/fixture/absent/output.swc.js | 7 + .../input.js | 55 + .../output.lightningcss.js | 112 ++ .../output.swc.js | 112 ++ .../attribute-generation-modes/input.js | 166 +++ .../output.lightningcss.js | 228 +++++ .../attribute-generation-modes/output.swc.js | 228 +++++ .../transform/tests/fixture/class/input.js | 14 + .../fixture/class/output.lightningcss.js | 12 + .../tests/fixture/class/output.swc.js | 12 + .../transform/tests/fixture/comments/input.js | 18 + .../fixture/comments/output.lightningcss.js | 12 + .../tests/fixture/comments/output.swc.js | 12 + .../fixture/component-attribute/input.js | 11 + .../output.lightningcss.js | 10 + .../fixture/component-attribute/output.swc.js | 10 + .../tests/fixture/conflicts/input.js | 16 + .../fixture/conflicts/output.lightningcss.js | 14 + .../tests/fixture/conflicts/output.swc.js | 14 + .../css-selector-after-pseudo/input.js | 18 + .../output.lightningcss.js | 11 + .../css-selector-after-pseudo/output.swc.js | 11 + .../tests/fixture/css-tag-same-file/input.js | 25 + .../css-tag-same-file/output.lightningcss.js | 21 + .../fixture/css-tag-same-file/output.swc.js | 21 + .../tests/fixture/different-jsx-ids/input.js | 23 + .../different-jsx-ids/output.lightningcss.js | 24 + .../fixture/different-jsx-ids/output.swc.js | 24 + .../fixture/dynamic-element-class/input.js | 32 + .../output.lightningcss.js | 25 + .../dynamic-element-class/output.swc.js | 25 + .../fixture/dynamic-element-external/input.js | 12 + .../output.lightningcss.js | 12 + .../dynamic-element-external/output.swc.js | 12 + .../tests/fixture/dynamic-element/input.js | 56 + .../dynamic-element/output.lightningcss.js | 40 + .../fixture/dynamic-element/output.swc.js | 40 + .../fixture/dynamic-this-in-arrow/input.js | 41 + .../output.lightningcss.js | 39 + .../dynamic-this-in-arrow/output.swc.js | 39 + .../tests/fixture/exported-jsx-style/input.js | 1 + .../exported-jsx-style/output.lightningcss.js | 1 + .../fixture/exported-jsx-style/output.swc.js | 1 + .../fixture/exported-non-jsx-style/input.js | 1 + .../output.lightningcss.js | 1 + .../exported-non-jsx-style/output.swc.js | 1 + .../fixture/external-nested-scope/input.js | 5 + .../output.lightningcss.js | 7 + .../external-nested-scope/output.swc.js | 7 + .../external-stylesheet-global/input.js | 19 + .../output.lightningcss.js | 18 + .../external-stylesheet-global/output.swc.js | 18 + .../external-stylesheet-multi-line/input.js | 9 + .../output.lightningcss.js | 9 + .../output.swc.js | 9 + .../fixture/external-stylesheet/input.js | 41 + .../output.lightningcss.js | 34 + .../fixture/external-stylesheet/output.swc.js | 34 + .../transform/tests/fixture/fragment/input.js | 51 + .../fixture/fragment/output.lightningcss.js | 47 + .../tests/fixture/fragment/output.swc.js | 47 + .../fixture/global-child-selector/input.js | 10 + .../output.lightningcss.js | 8 + .../global-child-selector/output.swc.js | 8 + .../tests/fixture/global-redundant/input.js | 12 + .../global-redundant/output.lightningcss.js | 10 + .../fixture/global-redundant/output.swc.js | 10 + .../transform/tests/fixture/global/input.js | 22 + .../fixture/global/output.lightningcss.js | 7 + .../tests/fixture/global/output.swc.js | 7 + .../tests/fixture/issue-30480/input.js | 11 + .../issue-30480/output.lightningcss.js | 15 + .../tests/fixture/issue-30480/output.swc.js | 15 + .../tests/fixture/issue-30570/input.js | 15 + .../issue-30570/output.lightningcss.js | 12 + .../tests/fixture/issue-30570/output.swc.js | 12 + .../input.js | 30 + .../output.lightningcss.js | 43 + .../output.swc.js | 43 + .../fixture/mixed-global-scoped/input.js | 9 + .../output.lightningcss.js | 11 + .../fixture/mixed-global-scoped/output.swc.js | 11 + .../tests/fixture/multiple-jsx/input.js | 43 + .../multiple-jsx/output.lightningcss.js | 32 + .../tests/fixture/multiple-jsx/output.swc.js | 32 + .../tests/fixture/nested-style-tags/index.js | 0 .../tests/fixture/next-54653/input.js | 10 + .../fixture/next-54653/output.lightningcss.js | 3 + .../tests/fixture/next-54653/output.swc.js | 3 + .../fixture/non-styled-jsx-style/input.js | 7 + .../output.lightningcss.js | 12 + .../non-styled-jsx-style/output.swc.js | 12 + .../not-styled-jsx-tagged-templates/input.js | 30 + .../output.lightningcss.js | 23 + .../output.swc.js | 23 + .../fixture/number-after-placeholder/input.js | 17 + .../output.lightningcss.js | 17 + .../number-after-placeholder/output.swc.js | 17 + .../fixture/one-off-global-selectors/input.js | 10 + .../output.lightningcss.js | 8 + .../one-off-global-selectors/output.swc.js | 8 + .../tests/fixture/source-maps/input.js | 8 + .../source-maps/output.lightningcss.js | 8 + .../tests/fixture/source-maps/output.swc.js | 8 + .../tests/fixture/stateless/input.js | 8 + .../fixture/stateless/output.lightningcss.js | 12 + .../tests/fixture/stateless/output.swc.js | 12 + .../fixture/styles-external-invalid/input.js | 13 + .../output.lightningcss.js | 9 + .../styles-external-invalid/output.swc.js | 9 + .../fixture/styles-external-invalid2/input.js | 11 + .../output.lightningcss.js | 8 + .../styles-external-invalid2/output.swc.js | 8 + .../transform/tests/fixture/styles/input.js | 57 ++ .../fixture/styles/output.lightningcss.js | 39 + .../tests/fixture/styles/output.swc.js | 39 + .../transform/tests/fixture/styles2/input.js | 6 + .../fixture/styles2/output.lightningcss.js | 5 + .../tests/fixture/styles2/output.swc.js | 5 + .../transform/tests/fixture/too-many/input.js | 35 + .../fixture/too-many/output.lightningcss.js | 49 + .../tests/fixture/too-many/output.swc.js | 49 + .../tests/fixture/tpl-escape-1/input.js | 14 + .../tpl-escape-1/output.lightningcss.js | 12 + .../tests/fixture/tpl-escape-1/output.swc.js | 12 + .../tests/fixture/tpl-escape-2/input.js | 17 + .../tpl-escape-2/output.lightningcss.js | 17 + .../tests/fixture/tpl-escape-2/output.swc.js | 17 + .../tpl-placeholder-1-as-property/input.js | 17 + .../output.lightningcss.js | 28 + .../output.swc.js | 29 + .../input.js | 21 + .../output.lightningcss.js | 34 + .../output.swc.js | 34 + .../tpl-placeholder-3-as-value/input.js | 17 + .../output.lightningcss.js | 28 + .../tpl-placeholder-3-as-value/output.swc.js | 28 + .../input.js | 17 + .../output.lightningcss.js | 31 + .../output.swc.js | 31 + .../input.js | 16 + .../output.lightningcss.js | 31 + .../output.swc.js | 31 + .../transform-css-complex-selector-2/input.js | 12 + .../output.lightningcss.js | 8 + .../output.swc.js | 8 + .../transform-css-complex-selector/input.js | 116 +++ .../output.lightningcss.js | 8 + .../output.swc.js | 8 + .../fixture/transform-css-global/input.js | 32 + .../output.lightningcss.js | 8 + .../transform-css-global/output.swc.js | 8 + .../transform-css-media-query/input.js | 24 + .../output.lightningcss.js | 8 + .../transform-css-media-query/output.swc.js | 8 + .../fixture/transform-css-normal/input.js | 22 + .../output.lightningcss.js | 8 + .../transform-css-normal/output.swc.js | 8 + .../fixture/transform-css-nth-1/input.js | 10 + .../output.lightningcss.js | 8 + .../fixture/transform-css-nth-1/output.swc.js | 8 + .../tests/fixture/transform-css/input.js | 176 ++++ .../transform-css/output.lightningcss.js | 8 + .../tests/fixture/transform-css/output.swc.js | 8 + .../tests/fixture/whitespace/input.js | 12 + .../fixture/whitespace/output.lightningcss.js | 12 + .../tests/fixture/whitespace/output.swc.js | 12 + 221 files changed, 7684 insertions(+) create mode 100644 packages/swc-magic/.npmignore create mode 100644 packages/swc-magic/Cargo.toml create mode 100644 packages/swc-magic/package.json create mode 100644 packages/swc-magic/src/lib.rs create mode 100644 packages/swc-magic/transform/Cargo.toml create mode 100644 packages/swc-magic/transform/src/lib.rs create mode 100644 packages/swc-magic/transform/src/lifetime.rs create mode 100644 packages/swc-magic/transform/src/style.rs create mode 100644 packages/swc-magic/transform/src/transform_css_lightningcss.rs create mode 100644 packages/swc-magic/transform/src/transform_css_swc.rs create mode 100644 packages/swc-magic/transform/src/utils.rs create mode 100644 packages/swc-magic/transform/src/visitor.rs create mode 100644 packages/swc-magic/transform/tests/errors/nested-style-tags/input.js create mode 100644 packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.js create mode 100644 packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.stderr create mode 100644 packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.js create mode 100644 packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.stderr create mode 100644 packages/swc-magic/transform/tests/errors/nested-style-tags/output.js create mode 100644 packages/swc-magic/transform/tests/errors/no-child/input.js create mode 100644 packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.js create mode 100644 packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.stderr create mode 100644 packages/swc-magic/transform/tests/errors/no-child/output-swc.js create mode 100644 packages/swc-magic/transform/tests/errors/no-child/output-swc.stderr create mode 100644 packages/swc-magic/transform/tests/errors/no-child/output.js create mode 100644 packages/swc-magic/transform/tests/errors/ts-with-css-resolve/input.js create mode 100644 packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-lightningcss.js create mode 100644 packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-lightningcss.stderr create mode 100644 packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-swc.js create mode 100644 packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-swc.stderr create mode 100644 packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output.js create mode 100644 packages/swc-magic/transform/tests/errors/two-children/input.js create mode 100644 packages/swc-magic/transform/tests/errors/two-children/output-lightningcss.js create mode 100644 packages/swc-magic/transform/tests/errors/two-children/output-lightningcss.stderr create mode 100644 packages/swc-magic/transform/tests/errors/two-children/output-swc.js create mode 100644 packages/swc-magic/transform/tests/errors/two-children/output-swc.stderr create mode 100644 packages/swc-magic/transform/tests/errors/two-children/output.js create mode 100644 packages/swc-magic/transform/tests/errors/wrong-child-type/input.js create mode 100644 packages/swc-magic/transform/tests/errors/wrong-child-type/output-lightningcss.js create mode 100644 packages/swc-magic/transform/tests/errors/wrong-child-type/output-lightningcss.stderr create mode 100644 packages/swc-magic/transform/tests/errors/wrong-child-type/output-swc.js create mode 100644 packages/swc-magic/transform/tests/errors/wrong-child-type/output-swc.stderr create mode 100644 packages/swc-magic/transform/tests/errors/wrong-child-type/output.js create mode 100644 packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/input.js create mode 100644 packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-lightningcss.js create mode 100644 packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-lightningcss.stderr create mode 100644 packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-swc.js create mode 100644 packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-swc.stderr create mode 100644 packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output.js create mode 100644 packages/swc-magic/transform/tests/fixture-swc-only/next-55679/input.js create mode 100644 packages/swc-magic/transform/tests/fixture-swc-only/next-55679/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture.rs create mode 100644 packages/swc-magic/transform/tests/fixture/.expressions/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/absent/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/absent/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/absent/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/attribute-generation-modes/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/attribute-generation-modes/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/attribute-generation-modes/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/class/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/class/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/class/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/comments/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/comments/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/comments/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/component-attribute/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/component-attribute/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/component-attribute/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/conflicts/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/conflicts/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/conflicts/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/css-tag-same-file/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/css-tag-same-file/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/css-tag-same-file/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/different-jsx-ids/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/different-jsx-ids/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/different-jsx-ids/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/dynamic-element-class/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/dynamic-element-class/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/dynamic-element-class/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/dynamic-element-external/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/dynamic-element-external/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/dynamic-element-external/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/dynamic-element/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/dynamic-element/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/dynamic-element/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/exported-jsx-style/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/exported-jsx-style/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/exported-jsx-style/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/external-nested-scope/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/external-nested-scope/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/external-nested-scope/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/external-stylesheet-global/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/external-stylesheet-global/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/external-stylesheet-global/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/external-stylesheet/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/external-stylesheet/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/external-stylesheet/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/fragment/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/fragment/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/fragment/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/global-child-selector/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/global-child-selector/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/global-child-selector/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/global-redundant/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/global-redundant/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/global-redundant/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/global/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/global/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/global/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/issue-30480/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/issue-30480/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/issue-30480/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/issue-30570/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/issue-30570/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/issue-30570/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/mixed-global-scoped/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/mixed-global-scoped/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/mixed-global-scoped/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/multiple-jsx/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/multiple-jsx/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/multiple-jsx/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/nested-style-tags/index.js create mode 100644 packages/swc-magic/transform/tests/fixture/next-54653/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/next-54653/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/next-54653/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/number-after-placeholder/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/number-after-placeholder/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/number-after-placeholder/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/one-off-global-selectors/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/one-off-global-selectors/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/one-off-global-selectors/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/source-maps/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/source-maps/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/source-maps/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/stateless/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/stateless/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/stateless/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/styles-external-invalid/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/styles-external-invalid/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/styles-external-invalid/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/styles-external-invalid2/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/styles-external-invalid2/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/styles-external-invalid2/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/styles/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/styles/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/styles/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/styles2/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/styles2/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/styles2/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/too-many/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/too-many/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/too-many/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-escape-1/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-escape-1/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-escape-1/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-escape-2/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-escape-2/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-escape-2/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-global/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-global/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-global/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-media-query/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-media-query/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-media-query/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-normal/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-normal/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-normal/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-nth-1/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-nth-1/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css-nth-1/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/transform-css/output.swc.js create mode 100644 packages/swc-magic/transform/tests/fixture/whitespace/input.js create mode 100644 packages/swc-magic/transform/tests/fixture/whitespace/output.lightningcss.js create mode 100644 packages/swc-magic/transform/tests/fixture/whitespace/output.swc.js diff --git a/packages/swc-magic/.npmignore b/packages/swc-magic/.npmignore new file mode 100644 index 000000000..1ed674f50 --- /dev/null +++ b/packages/swc-magic/.npmignore @@ -0,0 +1,2 @@ +transform/ +tests/ \ No newline at end of file diff --git a/packages/swc-magic/Cargo.toml b/packages/swc-magic/Cargo.toml new file mode 100644 index 000000000..19ed42d78 --- /dev/null +++ b/packages/swc-magic/Cargo.toml @@ -0,0 +1,33 @@ +[package] +authors = ["강동윤 "] +description = "SWC Plugin for styled-jsx" +edition = "2021" +license = "Apache-2.0" +name = "swc_plugin_styled_jsx" +publish = false +version = "0.14.3" + +[lib] +crate-type = ["cdylib", "rlib"] + +[features] +custom_transform = ["swc_common/concurrent"] + +[dependencies] +easy-error = "1.0.0" +styled_jsx = { path = "./transform" } +tracing = { version = "0.1.37", features = ["release_max_level_off"] } +serde_json = "1" +swc_common = "0.33.0" +swc_ecma_ast = "0.110.0" +swc_ecma_parser = "0.141.1" +swc_ecma_minifier = "0.189.1" +swc_ecma_utils = "0.124.4" +swc_ecma_visit = "0.96.0" +swc_plugin_macro = "0.9.15" +swc_atoms = "0.6.0" +swc_core = { version = "0.86.1", features = ["ecma_plugin_transform"] } + +[dev-dependencies] +swc_ecma_transforms_testing = "0.137.4" +testing = "0.35.0" diff --git a/packages/swc-magic/package.json b/packages/swc-magic/package.json new file mode 100644 index 000000000..1a83d6ae4 --- /dev/null +++ b/packages/swc-magic/package.json @@ -0,0 +1,21 @@ +{ + "name": "@swc/plugin-styled-jsx", + "version": "1.5.92", + "description": "SWC plugin for styled-jsx", + "main": "swc_plugin_styled_jsx.wasm", + "scripts": { + "prepack": "cp ../../target/wasm32-wasi/release/swc_plugin_styled_jsx.wasm ." + }, + "homepage": "https://swc.rs", + "repository": { + "type": "git", + "url": "+https://github.com/swc-project/plugins.git" + }, + "bugs": { + "url": "https://github.com/swc-project/plugins/issues" + }, + "author": "강동윤 ", + "keywords": [], + "license": "Apache-2.0", + "preferUnplugged": true +} diff --git a/packages/swc-magic/src/lib.rs b/packages/swc-magic/src/lib.rs new file mode 100644 index 000000000..3fa0bdc8e --- /dev/null +++ b/packages/swc-magic/src/lib.rs @@ -0,0 +1,24 @@ +#![allow(clippy::not_unsafe_ptr_arg_deref)] +#![feature(box_patterns)] + +use styled_jsx::{visitor, visitor::Config}; +use swc_core::{ + common::{sync::Lrc, FileName, SourceMap}, + ecma::{ast::Program, visit::FoldWith}, + plugin::{plugin_transform, proxies::TransformPluginProgramMetadata}, +}; + +#[plugin_transform] +fn styled_jsx_plugin(program: Program, data: TransformPluginProgramMetadata) -> Program { + let config = serde_json::from_str::( + &data + .get_transform_plugin_config() + .expect("failed to get plugin config for styled-jsx"), + ) + .expect("invalid config for styled-jsx"); + + // TODO(kdy1): This is wrong, but it does not use cm + let cm = Lrc::new(SourceMap::default()); + + program.fold_with(&mut visitor::styled_jsx(cm, FileName::Anon, config)) +} diff --git a/packages/swc-magic/transform/Cargo.toml b/packages/swc-magic/transform/Cargo.toml new file mode 100644 index 000000000..9c753f4f8 --- /dev/null +++ b/packages/swc-magic/transform/Cargo.toml @@ -0,0 +1,39 @@ +[package] +authors = ["강동윤 "] +description = "AST transforms visitor for styled-jsx" +edition = "2021" +license = "Apache-2.0" +name = "styled_jsx" +version = "0.54.0" + +[features] +custom_transform = ["swc_common/concurrent"] + +[dependencies] +easy-error = "1.0.0" +tracing = "0.1.37" +lightningcss = { version = "1.0.0-alpha.49", features = [ + "visitor", + "into_owned", +] } +parcel_selectors = "0.26.3" +serde = { version = "1", features = ["derive"] } + +swc_common = "0.33.0" +swc_ecma_ast = "0.110.0" +swc_ecma_utils = "0.124.4" +swc_ecma_visit = "0.96.0" +swc_plugin_macro = "0.9.15" +swc_ecma_parser = "0.141.1" +swc_ecma_minifier = "0.189.1" +swc_css_ast = "0.140.0" +swc_css_codegen = "0.151.0" +swc_css_parser = "0.150.0" +swc_css_prefixer = "0.153.0" +swc_css_minifier = "0.116.0" +swc_css_visit = "0.139.0" + +[dev-dependencies] +testing = "0.35.0" +swc_ecma_transforms_testing = "0.137.4" +swc_ecma_transforms = "0.226.1" diff --git a/packages/swc-magic/transform/src/lib.rs b/packages/swc-magic/transform/src/lib.rs new file mode 100644 index 000000000..59290e450 --- /dev/null +++ b/packages/swc-magic/transform/src/lib.rs @@ -0,0 +1,7 @@ +#![feature(box_patterns)] +mod lifetime; +pub mod style; +mod transform_css_lightningcss; +mod transform_css_swc; +mod utils; +pub mod visitor; diff --git a/packages/swc-magic/transform/src/lifetime.rs b/packages/swc-magic/transform/src/lifetime.rs new file mode 100644 index 000000000..630fab20e --- /dev/null +++ b/packages/swc-magic/transform/src/lifetime.rs @@ -0,0 +1,409 @@ +#![deny(unused)] + +use lightningcss::{ + properties::custom::TokenList, + selector::{Component, Selector, ViewTransitionPartName}, + traits::IntoOwned, +}; +use parcel_selectors::{ + attr::{AttrSelectorWithOptionalNamespace, NamespaceConstraint, ParsedAttrSelectorOperation}, + parser::{LocalName, NthOfSelectorData}, +}; + +pub fn owned_selector<'i>(sel: &Selector) -> Selector<'i> { + let mut buf: Vec> = vec![]; + + for component in sel.iter_raw_parse_order_from(0) { + buf.push(owned_component(component)); + } + + Selector::from(buf) +} + +pub fn owned_component<'i>(c: &Component) -> Component<'i> { + match c { + parcel_selectors::parser::Component::Combinator(v) => { + parcel_selectors::parser::Component::Combinator(*v) + } + parcel_selectors::parser::Component::ExplicitAnyNamespace => { + parcel_selectors::parser::Component::ExplicitAnyNamespace + } + parcel_selectors::parser::Component::ExplicitNoNamespace => { + parcel_selectors::parser::Component::ExplicitNoNamespace + } + parcel_selectors::parser::Component::DefaultNamespace(v) => { + parcel_selectors::parser::Component::DefaultNamespace(v.clone().into_owned()) + } + parcel_selectors::parser::Component::Namespace(v1, v2) => { + parcel_selectors::parser::Component::Namespace( + v1.clone().into_owned(), + v2.clone().into_owned(), + ) + } + parcel_selectors::parser::Component::ExplicitUniversalType => { + parcel_selectors::parser::Component::ExplicitUniversalType + } + parcel_selectors::parser::Component::ID(v) => { + parcel_selectors::parser::Component::ID(v.clone().into_owned()) + } + parcel_selectors::parser::Component::Class(v) => { + parcel_selectors::parser::Component::Class(v.clone().into_owned()) + } + parcel_selectors::parser::Component::Root => parcel_selectors::parser::Component::Root, + parcel_selectors::parser::Component::Empty => parcel_selectors::parser::Component::Empty, + parcel_selectors::parser::Component::Scope => parcel_selectors::parser::Component::Scope, + parcel_selectors::parser::Component::PseudoElement(v) => { + parcel_selectors::parser::Component::PseudoElement(owned_psuedo_element(v)) + } + parcel_selectors::parser::Component::Nesting => { + parcel_selectors::parser::Component::Nesting + } + + parcel_selectors::parser::Component::AttributeInNoNamespaceExists { + local_name, + local_name_lower, + } => parcel_selectors::parser::Component::AttributeInNoNamespaceExists { + local_name: local_name.clone().into_owned(), + local_name_lower: local_name_lower.clone().into_owned(), + }, + parcel_selectors::parser::Component::AttributeInNoNamespace { + local_name, + operator, + value, + case_sensitivity, + never_matches, + } => parcel_selectors::parser::Component::AttributeInNoNamespace { + local_name: local_name.clone().into_owned(), + operator: *operator, + value: value.clone().into_owned(), + case_sensitivity: *case_sensitivity, + never_matches: *never_matches, + }, + parcel_selectors::parser::Component::AttributeOther(v) => { + parcel_selectors::parser::Component::AttributeOther(Box::new( + AttrSelectorWithOptionalNamespace { + namespace: v.namespace.as_ref().map(|v| match v { + NamespaceConstraint::Any => NamespaceConstraint::Any, + NamespaceConstraint::Specific((v1, v2)) => NamespaceConstraint::Specific(( + v1.clone().into_owned(), + v2.clone().into_owned(), + )), + }), + local_name: v.local_name.clone().into_owned(), + local_name_lower: v.local_name_lower.clone().into_owned(), + operation: match &v.operation { + ParsedAttrSelectorOperation::Exists => ParsedAttrSelectorOperation::Exists, + ParsedAttrSelectorOperation::WithValue { + operator, + case_sensitivity, + expected_value, + } => ParsedAttrSelectorOperation::WithValue { + operator: *operator, + case_sensitivity: *case_sensitivity, + expected_value: expected_value.clone().into_owned(), + }, + }, + never_matches: v.never_matches, + }, + )) + } + parcel_selectors::parser::Component::Negation(v) => { + parcel_selectors::parser::Component::Negation(owned_selectors(v)) + } + parcel_selectors::parser::Component::LocalName(v1) => { + parcel_selectors::parser::Component::LocalName(LocalName { + name: v1.name.clone().into_owned(), + lower_name: v1.lower_name.clone().into_owned(), + }) + } + parcel_selectors::parser::Component::Nth(v) => parcel_selectors::parser::Component::Nth(*v), + parcel_selectors::parser::Component::NthOf(v) => { + parcel_selectors::parser::Component::NthOf(NthOfSelectorData::new( + *v.nth_data(), + owned_selectors(v.selectors()), + )) + } + parcel_selectors::parser::Component::NonTSPseudoClass(v) => { + parcel_selectors::parser::Component::NonTSPseudoClass(owned_psuedo_class(v)) + } + parcel_selectors::parser::Component::Slotted(v) => { + parcel_selectors::parser::Component::Slotted(owned_selector(v)) + } + parcel_selectors::parser::Component::Part(v) => parcel_selectors::parser::Component::Part( + v.iter().map(|v| v.clone().into_owned()).collect(), + ), + parcel_selectors::parser::Component::Host(v) => { + parcel_selectors::parser::Component::Host(v.as_ref().map(owned_selector)) + } + parcel_selectors::parser::Component::Where(v) => { + parcel_selectors::parser::Component::Where(owned_selectors(v)) + } + parcel_selectors::parser::Component::Is(v) => { + parcel_selectors::parser::Component::Is(owned_selectors(v)) + } + parcel_selectors::parser::Component::Any(v1, v2) => { + parcel_selectors::parser::Component::Any(*v1, owned_selectors(v2)) + } + parcel_selectors::parser::Component::Has(v) => { + parcel_selectors::parser::Component::Has(owned_selectors(v)) + } + } +} + +fn owned_psuedo_element<'i>( + v: &lightningcss::selector::PseudoElement, +) -> lightningcss::selector::PseudoElement<'i> { + match v { + lightningcss::selector::PseudoElement::After => { + lightningcss::selector::PseudoElement::After + } + lightningcss::selector::PseudoElement::Before => { + lightningcss::selector::PseudoElement::Before + } + lightningcss::selector::PseudoElement::FirstLine => { + lightningcss::selector::PseudoElement::FirstLine + } + lightningcss::selector::PseudoElement::FirstLetter => { + lightningcss::selector::PseudoElement::FirstLetter + } + lightningcss::selector::PseudoElement::Selection(v) => { + lightningcss::selector::PseudoElement::Selection(*v) + } + lightningcss::selector::PseudoElement::Placeholder(v) => { + lightningcss::selector::PseudoElement::Placeholder(*v) + } + lightningcss::selector::PseudoElement::Marker => { + lightningcss::selector::PseudoElement::Marker + } + lightningcss::selector::PseudoElement::Backdrop(v) => { + lightningcss::selector::PseudoElement::Backdrop(*v) + } + + lightningcss::selector::PseudoElement::FileSelectorButton(v) => { + lightningcss::selector::PseudoElement::FileSelectorButton(*v) + } + lightningcss::selector::PseudoElement::WebKitScrollbar(v) => { + lightningcss::selector::PseudoElement::WebKitScrollbar(v.clone()) + } + lightningcss::selector::PseudoElement::Cue => lightningcss::selector::PseudoElement::Cue, + lightningcss::selector::PseudoElement::CueRegion => { + lightningcss::selector::PseudoElement::CueRegion + } + lightningcss::selector::PseudoElement::CueFunction { selector } => { + lightningcss::selector::PseudoElement::CueFunction { + selector: Box::new(owned_selector(selector)), + } + } + lightningcss::selector::PseudoElement::CueRegionFunction { selector } => { + lightningcss::selector::PseudoElement::CueRegionFunction { + selector: Box::new(owned_selector(selector)), + } + } + lightningcss::selector::PseudoElement::ViewTransition => { + lightningcss::selector::PseudoElement::ViewTransition + } + lightningcss::selector::PseudoElement::ViewTransitionGroup { part_name } => { + lightningcss::selector::PseudoElement::ViewTransitionGroup { + part_name: owned_view_transition_part_name(part_name), + } + } + lightningcss::selector::PseudoElement::ViewTransitionImagePair { part_name } => { + lightningcss::selector::PseudoElement::ViewTransitionImagePair { + part_name: owned_view_transition_part_name(part_name), + } + } + lightningcss::selector::PseudoElement::ViewTransitionOld { part_name } => { + lightningcss::selector::PseudoElement::ViewTransitionOld { + part_name: owned_view_transition_part_name(part_name), + } + } + lightningcss::selector::PseudoElement::ViewTransitionNew { part_name } => { + lightningcss::selector::PseudoElement::ViewTransitionNew { + part_name: owned_view_transition_part_name(part_name), + } + } + lightningcss::selector::PseudoElement::Custom { name } => { + lightningcss::selector::PseudoElement::Custom { + name: name.clone().into_owned(), + } + } + lightningcss::selector::PseudoElement::CustomFunction { name, arguments } => { + lightningcss::selector::PseudoElement::CustomFunction { + name: name.clone().into_owned(), + arguments: owned_token_list(arguments), + } + } + } +} + +fn owned_view_transition_part_name<'i>(n: &ViewTransitionPartName) -> ViewTransitionPartName<'i> { + match n { + ViewTransitionPartName::All => ViewTransitionPartName::All, + ViewTransitionPartName::Name(v) => ViewTransitionPartName::Name(v.clone().into_owned()), + } +} + +fn owned_psuedo_class<'i>( + v: &lightningcss::selector::PseudoClass, +) -> lightningcss::selector::PseudoClass<'i> { + match v { + lightningcss::selector::PseudoClass::Lang { languages } => { + lightningcss::selector::PseudoClass::Lang { + languages: languages.iter().map(|v| v.clone().into_owned()).collect(), + } + } + lightningcss::selector::PseudoClass::Dir { direction } => { + lightningcss::selector::PseudoClass::Dir { + direction: *direction, + } + } + lightningcss::selector::PseudoClass::Hover => lightningcss::selector::PseudoClass::Hover, + lightningcss::selector::PseudoClass::Active => lightningcss::selector::PseudoClass::Active, + lightningcss::selector::PseudoClass::Focus => lightningcss::selector::PseudoClass::Focus, + lightningcss::selector::PseudoClass::FocusVisible => { + lightningcss::selector::PseudoClass::FocusVisible + } + lightningcss::selector::PseudoClass::FocusWithin => { + lightningcss::selector::PseudoClass::FocusWithin + } + lightningcss::selector::PseudoClass::Current => { + lightningcss::selector::PseudoClass::Current + } + lightningcss::selector::PseudoClass::Past => lightningcss::selector::PseudoClass::Past, + lightningcss::selector::PseudoClass::Future => lightningcss::selector::PseudoClass::Future, + lightningcss::selector::PseudoClass::Playing => { + lightningcss::selector::PseudoClass::Playing + } + lightningcss::selector::PseudoClass::Paused => lightningcss::selector::PseudoClass::Paused, + lightningcss::selector::PseudoClass::Seeking => { + lightningcss::selector::PseudoClass::Seeking + } + lightningcss::selector::PseudoClass::Buffering => { + lightningcss::selector::PseudoClass::Buffering + } + lightningcss::selector::PseudoClass::Stalled => { + lightningcss::selector::PseudoClass::Stalled + } + lightningcss::selector::PseudoClass::Muted => lightningcss::selector::PseudoClass::Muted, + lightningcss::selector::PseudoClass::VolumeLocked => { + lightningcss::selector::PseudoClass::VolumeLocked + } + lightningcss::selector::PseudoClass::Fullscreen(v) => { + lightningcss::selector::PseudoClass::Fullscreen(*v) + } + lightningcss::selector::PseudoClass::Open => lightningcss::selector::PseudoClass::Open, + lightningcss::selector::PseudoClass::Closed => lightningcss::selector::PseudoClass::Closed, + lightningcss::selector::PseudoClass::Modal => lightningcss::selector::PseudoClass::Modal, + lightningcss::selector::PseudoClass::PictureInPicture => { + lightningcss::selector::PseudoClass::PictureInPicture + } + lightningcss::selector::PseudoClass::PopoverOpen => { + lightningcss::selector::PseudoClass::PopoverOpen + } + lightningcss::selector::PseudoClass::Defined => { + lightningcss::selector::PseudoClass::Defined + } + lightningcss::selector::PseudoClass::AnyLink(v) => { + lightningcss::selector::PseudoClass::AnyLink(*v) + } + lightningcss::selector::PseudoClass::Link => lightningcss::selector::PseudoClass::Link, + lightningcss::selector::PseudoClass::LocalLink => { + lightningcss::selector::PseudoClass::LocalLink + } + lightningcss::selector::PseudoClass::Target => lightningcss::selector::PseudoClass::Target, + lightningcss::selector::PseudoClass::TargetWithin => { + lightningcss::selector::PseudoClass::TargetWithin + } + lightningcss::selector::PseudoClass::Visited => { + lightningcss::selector::PseudoClass::Visited + } + lightningcss::selector::PseudoClass::Enabled => { + lightningcss::selector::PseudoClass::Enabled + } + lightningcss::selector::PseudoClass::Disabled => { + lightningcss::selector::PseudoClass::Disabled + } + lightningcss::selector::PseudoClass::ReadOnly(v) => { + lightningcss::selector::PseudoClass::ReadOnly(*v) + } + lightningcss::selector::PseudoClass::ReadWrite(v) => { + lightningcss::selector::PseudoClass::ReadWrite(*v) + } + lightningcss::selector::PseudoClass::PlaceholderShown(v) => { + lightningcss::selector::PseudoClass::PlaceholderShown(*v) + } + lightningcss::selector::PseudoClass::Default => { + lightningcss::selector::PseudoClass::Default + } + lightningcss::selector::PseudoClass::Checked => { + lightningcss::selector::PseudoClass::Checked + } + lightningcss::selector::PseudoClass::Indeterminate => { + lightningcss::selector::PseudoClass::Indeterminate + } + lightningcss::selector::PseudoClass::Blank => lightningcss::selector::PseudoClass::Blank, + lightningcss::selector::PseudoClass::Valid => lightningcss::selector::PseudoClass::Valid, + lightningcss::selector::PseudoClass::Invalid => { + lightningcss::selector::PseudoClass::Invalid + } + lightningcss::selector::PseudoClass::InRange => { + lightningcss::selector::PseudoClass::InRange + } + lightningcss::selector::PseudoClass::OutOfRange => { + lightningcss::selector::PseudoClass::OutOfRange + } + lightningcss::selector::PseudoClass::Required => { + lightningcss::selector::PseudoClass::Required + } + lightningcss::selector::PseudoClass::Optional => { + lightningcss::selector::PseudoClass::Optional + } + lightningcss::selector::PseudoClass::UserValid => { + lightningcss::selector::PseudoClass::UserValid + } + lightningcss::selector::PseudoClass::UserInvalid => { + lightningcss::selector::PseudoClass::UserInvalid + } + lightningcss::selector::PseudoClass::Autofill(v) => { + lightningcss::selector::PseudoClass::Autofill(*v) + } + lightningcss::selector::PseudoClass::Local { selector } => { + lightningcss::selector::PseudoClass::Local { + selector: Box::new(owned_selector(selector)), + } + } + lightningcss::selector::PseudoClass::Global { selector } => { + lightningcss::selector::PseudoClass::Global { + selector: Box::new(owned_selector(selector)), + } + } + lightningcss::selector::PseudoClass::WebKitScrollbar(v) => { + lightningcss::selector::PseudoClass::WebKitScrollbar(v.clone()) + } + lightningcss::selector::PseudoClass::Custom { name } => { + lightningcss::selector::PseudoClass::Custom { + name: name.clone().into_owned(), + } + } + lightningcss::selector::PseudoClass::CustomFunction { name, arguments } => { + lightningcss::selector::PseudoClass::CustomFunction { + name: name.clone().into_owned(), + arguments: owned_token_list(arguments), + } + } + } +} + +fn owned_selectors<'i>(ss: &[Selector]) -> Box<[Selector<'i>]> { + let mut buf: Vec> = vec![]; + + for selector in ss.iter() { + buf.push(owned_selector(selector)); + } + + buf.into_boxed_slice() +} + +fn owned_token_list<'i>(t: &TokenList) -> TokenList<'i> { + TokenList(t.0.iter().map(|v| v.clone().into_owned()).collect()) +} diff --git a/packages/swc-magic/transform/src/style.rs b/packages/swc-magic/transform/src/style.rs new file mode 100644 index 000000000..b3854fc53 --- /dev/null +++ b/packages/swc-magic/transform/src/style.rs @@ -0,0 +1,25 @@ +use swc_common::Span; +use swc_ecma_ast::*; + +pub struct ExternalStyle { + pub expr: Expr, + pub identifier: Ident, + pub is_global: bool, +} + +pub struct LocalStyle { + pub hash: String, + pub css: String, + pub css_span: Span, + pub is_dynamic: bool, + #[allow(clippy::vec_box)] + pub expressions: Vec>, + + /// If true, `format!("__styled-jsx-placeholder-{}__: 0", i)` is used. + pub is_expr_property: Vec, +} + +pub enum JSXStyle { + Local(LocalStyle), + External(ExternalStyle), +} diff --git a/packages/swc-magic/transform/src/transform_css_lightningcss.rs b/packages/swc-magic/transform/src/transform_css_lightningcss.rs new file mode 100644 index 000000000..eac1322a4 --- /dev/null +++ b/packages/swc-magic/transform/src/transform_css_lightningcss.rs @@ -0,0 +1,589 @@ +use std::{ + borrow::Cow, + convert::Infallible, + fmt::Debug, + mem::transmute, + panic::{catch_unwind, AssertUnwindSafe}, + sync::{Arc, RwLock}, +}; + +use easy_error::{bail, Error, ResultExt}; +use lightningcss::{ + error::ParserError, + properties::custom::{TokenList, TokenOrValue}, + selector::{Combinator, Component, PseudoClass, Selector}, + stylesheet::{MinifyOptions, ParserFlags, ParserOptions, PrinterOptions, StyleSheet}, + traits::{ParseWithOptions, ToCss}, + values::ident::Ident, + visit_types, + visitor::{Visit, VisitTypes, Visitor}, +}; +use parcel_selectors::{parser::SelectorIter, SelectorImpl}; +use swc_common::{ + errors::{DiagnosticBuilder, Level, HANDLER}, + BytePos, Loc, SourceMap, Span, DUMMY_SP, +}; +use swc_ecma_ast::*; +use tracing::{debug, error, trace}; + +use crate::{ + lifetime::owned_selector, + style::LocalStyle, + utils::{hash_string, string_literal_expr}, +}; + +fn report( + cm: &SourceMap, + css_span: Span, + file_lines_cache: &mut Option, + err: &lightningcss::error::Error, + level: Level, +) { + // We need :global(selector) to be parsed as a selector. + if let ParserError::SelectorError( + lightningcss::error::SelectorError::UnsupportedPseudoClassOrElement(..), + ) = &err.kind + { + return; + } + + let file = file_lines_cache.get_or_insert_with(|| cm.lookup_char_pos(css_span.lo)); + + let lo = if let Some(loc) = &err.loc { + Some(file.file.lines[(loc.line + 1) as usize] + BytePos(loc.column)) + } else { + None + }; + + HANDLER.with(|handler| { + // + + let mut db = DiagnosticBuilder::new(handler, level, &err.kind.to_string()); + if let Some(lo) = lo { + db.set_span(Span::new(lo, lo, Default::default())); + } + + db.emit(); + }); +} + +#[cfg_attr( + debug_assertions, + tracing::instrument(skip(cm, style_info, class_name)) +)] +pub fn transform_css( + cm: Arc, + style_info: &LocalStyle, + is_global: bool, + class_name: &Option, +) -> Result { + let mut file_lines_cache = None; + + debug!("CSS: \n{}", style_info.css); + let css_str = strip_comments(&style_info.css); + + let warnings: Arc>>> = Arc::default(); + + let result: Result = StyleSheet::parse( + &css_str, + ParserOptions { + // We cannot use css_modules for `:global` because lightningcss does not support + // parsing-only mode. + css_modules: None, + error_recovery: true, + warnings: Some(warnings.clone()), + flags: ParserFlags::all(), + ..Default::default() + }, + ); + + let mut ss = match result { + Ok(ss) => ss, + Err(err) => { + HANDLER.with(|handler| { + report( + &cm, + style_info.css_span, + &mut file_lines_cache, + &err, + Level::Error, + ); + + handler + .struct_span_err( + style_info.css_span, + "Failed to parse css in styled jsx component", + ) + .note(&format!("Input to the css parser is {}", style_info.css)) + .emit() + }); + bail!("Failed to parse css"); + } + }; + + if let Ok(warnings) = warnings.read() { + for warning in warnings.iter() { + report( + &cm, + style_info.css_span, + &mut file_lines_cache, + warning, + Level::Warning, + ); + } + } + + ss.visit(&mut CssNamespace { + class_name: match class_name { + Some(s) => s.clone(), + None => format!("jsx-{}", &hash_string(&style_info.hash)), + }, + is_global, + is_dynamic: style_info.is_dynamic, + }) + .expect("failed to transform css"); + + // Apply auto prefixer + ss.minify(MinifyOptions { + ..Default::default() + }) + .expect("failed to minify/auto-prefix css"); + + let res = ss + .to_css(PrinterOptions { + minify: true, + // TODO + // targets: (), + ..Default::default() + }) + .context("failed to print css")?; + + debug!("Transformed CSS: \n{}", res.code); + + if style_info.expressions.is_empty() { + return Ok(string_literal_expr(&res.code)); + } + + let mut parts: Vec<&str> = res.code.split("__styled-jsx-placeholder-").collect(); + let mut final_expressions = vec![]; + for i in parts.iter_mut().skip(1) { + let (num_len, expression_index) = read_number(i, &style_info.is_expr_property); + final_expressions.push(style_info.expressions[expression_index].clone()); + let substring = &i[(num_len + 2)..]; + *i = substring; + } + + Ok(Expr::Tpl(Tpl { + quasis: parts + .iter() + .map(|quasi| { + TplElement { + cooked: None, // ? Do we need cooked as well + raw: quasi.replace('`', "\\`").into(), + span: DUMMY_SP, + tail: false, + } + }) + .collect(), + exprs: final_expressions, + span: DUMMY_SP, + })) +} + +fn strip_comments(s: &str) -> Cow { + if !s.contains("//") { + return Cow::Borrowed(s); + } + + let mut buf = String::with_capacity(s.len()); + + for line in s.lines() { + let line = line.trim(); + + if let Some(index) = line.find("//") { + buf.push_str(&line[..index]); + } else { + buf.push_str(line); + } + buf.push('\n'); + } + + Cow::Owned(buf) +} + +/// Returns `(length, expression_index)` +fn read_number(s: &str, is_expr_property: &[bool]) -> (usize, usize) { + for (idx, c) in s.char_indices() { + if c.is_ascii_digit() { + continue; + } + + // For 10, we reach here after `0`. + let expression_index = s[0..idx].parse().expect("failed to parse"); + + if is_expr_property[expression_index] { + return (idx + 3, expression_index); + } + + return (idx, expression_index); + } + + unreachable!("read_number(`{}`) is invalid because it is empty", s) +} + +struct CssNamespace { + class_name: String, + is_global: bool, + is_dynamic: bool, +} + +impl<'i> Visitor<'i> for CssNamespace { + type Error = Infallible; + + fn visit_types(&self) -> VisitTypes { + visit_types!(SELECTORS) + } + + fn visit_selector(&mut self, selector: &mut Selector<'i>) -> Result<(), Self::Error> { + let mut new_selectors = vec![]; + let mut combinator = None; + + #[cfg(debug_assertions)] + let _tracing = tracing::span!( + tracing::Level::ERROR, + "visit_selector", + len = selector.len() + ) + .entered(); + + let mut iter = selector.iter(); + loop { + #[cfg(debug_assertions)] + let _tracing = tracing::span!( + tracing::Level::ERROR, + "visit_selector/loop", + len = iter.selector_length() + ) + .entered(); + + if combinator.is_none() { + combinator = iter.next_sequence(); + } + + match self.get_transformed_selectors(combinator, &mut iter) { + Ok(transformed_selectors) => { + if transformed_selectors.is_empty() { + break; + } + + if cfg!(debug_assertions) { + debug!("Transformed as: {:?}", SafeDebug(&transformed_selectors)) + } + + new_selectors.push(transformed_selectors); + } + Err(_) => { + error!("Failed to transform one off global selector"); + // TODO: + + // HANDLER.with(|handler| { + // handler + // .struct_span_err( + // selector.span, + // "Failed to transform one off global selector", + // ) + // .emit() + // }); + + new_selectors.push(iter.clone().cloned().collect()); + } + } + + trace!( + "Selector length after transform: {}", + iter.selector_length() + ); + + if combinator.is_none() { + combinator = iter.next_sequence(); + if combinator.is_none() { + break; + } + } else { + combinator = None; + } + } + + let new: Vec<_> = RemoveWhitespace { + iter: new_selectors.into_iter().rev().flatten(), + prev: None, + } + .collect(); + debug!("Selector vector: {:?}", SafeDebug(&new)); + + *selector = Selector::from(new); + + Ok(()) + } +} + +struct RemoveWhitespace<'i, I> { + iter: I, + prev: Option>, +} + +impl<'i, I> Iterator for RemoveWhitespace<'i, I> +where + I: Iterator>, +{ + type Item = Component<'i>; + + fn next(&mut self) -> Option { + match self.prev.take() { + Some(Component::Combinator(Combinator::Descendant)) => { + self.prev = self.iter.next(); + + match self.prev { + Some(Component::Combinator(..)) => self.next(), + _ => Some(Component::Combinator(Combinator::Descendant)), + } + } + Some(v) => Some(v), + _ => { + self.prev = self.iter.next(); + + if self.prev.is_some() { + self.next() + } else { + None + } + } + } + } +} + +impl CssNamespace { + #[cfg_attr(debug_assertions, tracing::instrument(skip(self, node)))] + fn get_transformed_selectors<'a, 'i, Impl>( + &mut self, + combinator: Option, + node: &mut SelectorIter<'a, 'i, Impl>, + ) -> Result>, Error> + where + Impl: SelectorImpl<'i>, + SelectorIter<'a, 'i, Impl>: Iterator>, + { + let mut result: Vec> = vec![]; + + let mut pseudo_index = None; + + let node: Vec> = node.fuse().cloned().collect::>(); + + if node.is_empty() { + return Ok(result); + } + + #[cfg(debug_assertions)] + { + let prev_sel = Selector::from(node.clone()); + debug!("Input selector: {:?}", SafeDebug(&prev_sel)) + } + + for (i, component) in node.iter().enumerate() { + trace!("Selector at {}", i); + + #[cfg(debug_assertions)] + { + debug!("Component: {:?}", SafeDebug(&component)) + } + + // Look for :global + let children: Selector<'i> = match &component { + Component::NonTSPseudoClass(PseudoClass::CustomFunction { name, arguments }) => { + if &**name != "global" { + if pseudo_index.is_none() { + pseudo_index = Some(i); + } + + continue; + } + + parse_token_list(arguments) + } + Component::PseudoElement(_) + | Component::NonTSPseudoClass(..) + | Component::Negation(..) + | Component::Root + | Component::Empty + | Component::Scope + | Component::Nth(..) + | Component::NthOf(..) + | Component::Slotted(..) + | Component::Part(..) + | Component::Host(..) + | Component::Where(..) + | Component::Is(..) + | Component::Any(..) + | Component::Has(..) => { + if pseudo_index.is_none() { + pseudo_index = Some(i); + } + + continue; + } + _ => { + continue; + } + }; + + let mut complex_selectors = + children.iter_raw_match_order().cloned().collect::>(); + + // Remove `a` + complex_selectors.pop(); + + if let Some(Component::Combinator(Combinator::Descendant)) = complex_selectors.last() { + complex_selectors.pop(); + } + + if let Component::Combinator(Combinator::Descendant) = complex_selectors[0] { + complex_selectors.remove(0); + } + + if complex_selectors.is_empty() { + bail!("Failed to transform one off global selector"); + } + + trace!("Combinator: {:?}", combinator); + // trace!("node: {:?}", node); + // trace!("complex_selectors: {:?}", complex_selectors); + + // result.push(Component::Combinator(Combinator::Descendant)); + + complex_selectors.reverse(); + + result.extend(complex_selectors); + result.extend(node.into_iter().skip(i + 1)); + + if let Some(combinator) = combinator { + result.push(Component::Combinator(combinator)); + } + + return Ok(result); + } + + // Pseudo element + if result.is_empty() && node.len() == 1 && pseudo_index.is_some() { + return Ok(node); + } + + let mut node: Vec> = node.clone(); + + let subclass_selector = match self.is_dynamic { + true => Cow::Borrowed("__jsx-style-dynamic-selector"), + false => Cow::Owned(self.class_name.clone()), + }; + match pseudo_index { + None => { + if !self.is_global { + node.push(Component::Class(Ident::from(subclass_selector))); + } + + result.extend(node); + } + + Some(insert_index) => { + result.extend(node); + + if !self.is_global { + result.insert( + insert_index, + Component::Class(Ident::from(subclass_selector)), + ); + } + } + } + + if let Some(combinator) = combinator { + result.push(Component::Combinator(combinator)); + } + + Ok(result) + } +} + +/// Because it is allowed to write `.bar :global(> .foo) {}` or .bar +/// :global(.foo) {}`, so selector can be complex or relative (it violates the +/// specification), but it is popular usage, so we just add `a ` at top and +/// then remove it +fn parse_token_list<'i>(tokens: &TokenList<'i>) -> Selector<'i> { + let mut buf = "a ".to_string(); + + for t in tokens.0.iter() { + match t { + TokenOrValue::Token(t) => { + buf.push_str(&t.to_css_string(Default::default()).unwrap()); + } + TokenOrValue::Color(t) => { + buf.push_str(&t.to_css_string(Default::default()).unwrap()); + } + TokenOrValue::Url(t) => { + buf.push_str(&t.to_css_string(Default::default()).unwrap()); + } + TokenOrValue::Var(..) => { + unimplemented!("parse_token_list: var") + } + TokenOrValue::Env(..) => { + unimplemented!("parse_token_list: env var") + } + TokenOrValue::Function(..) => { + unimplemented!("parse_token_list: function") + } + TokenOrValue::Length(t) => { + buf.push_str(&t.to_css_string(Default::default()).unwrap()); + } + TokenOrValue::Angle(t) => { + buf.push_str(&t.to_css_string(Default::default()).unwrap()); + } + TokenOrValue::Time(t) => { + buf.push_str(&t.to_css_string(Default::default()).unwrap()); + } + TokenOrValue::Resolution(t) => { + buf.push_str(&t.to_css_string(Default::default()).unwrap()); + } + TokenOrValue::DashedIdent(t) => { + buf.push_str(&t.to_css_string(Default::default()).unwrap()); + } + TokenOrValue::UnresolvedColor(..) => { + unimplemented!("parse_token_list: unresolved color") + } + } + } + + if cfg!(debug_assertions) { + debug!("Parsing: {:?}", buf) + } + + let selector = Selector::parse_string_with_options(&buf, Default::default()) + .expect("failed to parse selector list"); + + unsafe { + // Safety: Selector is variant over 'i + transmute::(owned_selector(&selector)) + } +} + +struct SafeDebug<'a>(&'a dyn Debug); + +impl Debug for SafeDebug<'_> { + fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result { + let s = catch_unwind(AssertUnwindSafe(|| format!("{:?}", self.0))); + + match s { + Ok(s) => { + write!(f, "{}", s) + } + Err(_) => write!(f, ""), + } + } +} diff --git a/packages/swc-magic/transform/src/transform_css_swc.rs b/packages/swc-magic/transform/src/transform_css_swc.rs new file mode 100644 index 000000000..de9ea6638 --- /dev/null +++ b/packages/swc-magic/transform/src/transform_css_swc.rs @@ -0,0 +1,393 @@ +use std::{panic, sync::Arc}; + +use easy_error::{bail, Error}; +use swc_common::{ + errors::HANDLER, source_map::Pos, util::take::Take, BytePos, SourceMap, Span, Spanned, + SyntaxContext, DUMMY_SP, +}; +use swc_css_ast::{ + ClassSelector, Combinator, CombinatorValue, ComplexSelector, ComplexSelectorChildren, + CompoundSelector, Ident, PseudoClassSelector, PseudoClassSelectorChildren, Stylesheet, + SubclassSelector, Token, TokenAndSpan, +}; +use swc_css_codegen::{ + writer::basic::{BasicCssWriter, BasicCssWriterConfig}, + CodeGenerator, CodegenConfig, Emit, +}; +use swc_css_parser::{ + lexer::Lexer, + parse_input, + parser::{ + input::{InputType, Tokens}, + Parser, ParserConfig, + }, +}; +use swc_css_prefixer::prefixer; +use swc_css_visit::{VisitMut, VisitMutWith}; +use swc_ecma_ast::*; +use swc_ecma_parser::StringInput; +use tracing::{debug, trace}; + +use crate::{ + style::LocalStyle, + utils::{hash_string, string_literal_expr}, +}; + +pub fn transform_css( + _cm: Arc, + style_info: &LocalStyle, + is_global: bool, + class_name: &Option, +) -> Result { + debug!("CSS: \n{}", style_info.css); + + // TODO use `parse_string_input` in future + let config = ParserConfig { + allow_wrong_line_comments: true, + css_modules: false, + ..Default::default() + }; + let lexer = Lexer::new( + StringInput::new( + &style_info.css, + style_info.css_span.lo, + style_info.css_span.hi, + ), + None, + config, + ); + let mut parser = Parser::new(lexer, config); + + let result: Result = parser.parse_all(); + let mut ss = match result { + Ok(ss) => ss, + Err(err) => { + HANDLER.with(|handler| { + // Print css parsing errors + err.to_diagnostics(handler).emit(); + + // TODO(kdy1): We may print css so the user can see the error, and report it. + + handler + .struct_span_err( + style_info.css_span, + "Failed to parse css in styled jsx component", + ) + .note(&format!("Input to the css parser is {}", style_info.css)) + .emit() + }); + bail!("Failed to parse css"); + } + }; + // ? Do we need to support optionally prefixing? + ss.visit_mut_with(&mut prefixer(Default::default())); + ss.visit_mut_with(&mut Namespacer { + class_name: match class_name { + Some(s) => s.clone(), + None => format!("jsx-{}", &hash_string(&style_info.hash)), + }, + is_global, + is_dynamic: style_info.is_dynamic, + }); + + let mut s = String::new(); + { + let mut wr = BasicCssWriter::new(&mut s, None, BasicCssWriterConfig::default()); + let mut gen = CodeGenerator::new(&mut wr, CodegenConfig { minify: true }); + + gen.emit(&ss).unwrap(); + } + + if style_info.expressions.is_empty() { + return Ok(string_literal_expr(&s)); + } + + let mut parts: Vec<&str> = s.split("__styled-jsx-placeholder-").collect(); + let mut final_expressions = vec![]; + for i in parts.iter_mut().skip(1) { + let (num_len, expression_index) = read_number(i); + final_expressions.push(style_info.expressions[expression_index].clone()); + let substr = &i[(num_len + 2)..]; + *i = substr; + } + + Ok(Expr::Tpl(Tpl { + quasis: parts + .iter() + .map(|quasi| { + TplElement { + cooked: None, // ? Do we need cooked as well + raw: quasi.replace('`', "\\`").into(), + span: DUMMY_SP, + tail: false, + } + }) + .collect(), + exprs: final_expressions, + span: DUMMY_SP, + })) +} + +/// Returns `(length, value)` +fn read_number(s: &str) -> (usize, usize) { + for (idx, c) in s.char_indices() { + if c.is_ascii_digit() { + continue; + } + + // For 10, we reach here after `0`. + let value = s[0..idx].parse().expect("failed to parse"); + + return (idx, value); + } + + unreachable!("read_number(`{}`) is invalid because it is empty", s) +} + +struct Namespacer { + class_name: String, + is_global: bool, + is_dynamic: bool, +} + +impl VisitMut for Namespacer { + fn visit_mut_complex_selector(&mut self, node: &mut ComplexSelector) { + #[cfg(debug_assertions)] + let _tracing = { + // This will add information to the log messages, only for debug build. + // Note that we use cargo feature to remove all logging on production builds. + + let mut code = String::new(); + { + let mut wr = BasicCssWriter::new(&mut code, None, BasicCssWriterConfig::default()); + let mut gen = CodeGenerator::new(&mut wr, CodegenConfig { minify: true }); + + gen.emit(&*node).unwrap(); + } + + tracing::span!( + tracing::Level::TRACE, + "Namespacer::visit_mut_complex_selector", + class_name = &*self.class_name, + is_global = self.is_global, + is_dynamic = self.is_dynamic, + input = &*code + ) + .entered() + }; + + let mut new_selectors = vec![]; + let mut combinator = None; + + for sel in node.children.take() { + match &sel { + ComplexSelectorChildren::CompoundSelector(selector) => { + match self.get_transformed_selectors(combinator, selector.clone()) { + Ok(transformed_selectors) => new_selectors.extend(transformed_selectors), + Err(_) => { + HANDLER.with(|handler| { + handler + .struct_span_err( + selector.span, + "Failed to transform one off global selector", + ) + .emit() + }); + new_selectors.push(sel); + } + } + + combinator = None; + } + ComplexSelectorChildren::Combinator(v) => { + combinator = Some(v.clone()); + } + }; + } + + node.children = new_selectors; + } +} + +impl Namespacer { + fn get_transformed_selectors( + &mut self, + combinator: Option, + mut node: CompoundSelector, + ) -> Result, Error> { + let mut pseudo_index = None; + + for (i, selector) in node.subclass_selectors.iter().enumerate() { + let (name, children) = match &selector { + SubclassSelector::PseudoClass(PseudoClassSelector { + name, + children: Some(children), + .. + }) if &name.value == "global" => (name, children), + SubclassSelector::PseudoClass(_) | SubclassSelector::PseudoElement(_) => { + if pseudo_index.is_none() { + pseudo_index = Some(i); + } + + continue; + } + _ => continue, + }; + + // One off global selector + if &name.value == "global" { + // TODO(alexander-akait): in future we should use list of component values + let tokens = children + .iter() + .map(|v| match v { + PseudoClassSelectorChildren::PreservedToken(v) => v.clone(), + _ => { + unreachable!(); + } + }) + .collect::>(); + let mut tokens = { + let lo = tokens.first().map(|v| v.span_lo()).unwrap_or(BytePos(0)); + let hi = tokens.last().map(|v| v.span_hi()).unwrap_or(BytePos(0)); + + Tokens { + span: Span::new(lo, hi, Default::default()), + tokens, + } + }; + + // Because it is allowed to write `.bar :global(> .foo) {}` or .bar + // :global(.foo) {}`, so selector can be complex or relative (it violates the + // specification), but it is popular usage, so we just add `a >` at top and then + // remove it + let mut front_tokens = get_front_selector_tokens(&tokens); + + front_tokens.extend(tokens.tokens); + + tokens.tokens = front_tokens; + + let complex_selectors = panic::catch_unwind(|| { + let x: ComplexSelector = parse_input( + InputType::Tokens(&tokens), + ParserConfig { + allow_wrong_line_comments: true, + css_modules: true, + ..Default::default() + }, + // TODO(kdy1): We might be able to report syntax errors. + &mut vec![], + ) + .unwrap(); + x + }); + + return match complex_selectors { + Ok(complex_selectors) => { + let mut v = complex_selectors.children[1..].to_vec(); + + if let ComplexSelectorChildren::Combinator(Combinator { + value: CombinatorValue::Descendant, + .. + }) = v[0] + { + v.remove(0); + } + + if v.is_empty() { + bail!("Failed to transform one off global selector"); + } + + trace!("Combinator: {:?}", combinator); + trace!("v[0]: {:?}", v[0]); + + let mut result = vec![]; + + if let Some(combinator) = combinator { + match v.get(0) { + // `Descendant` combinator can't be the first because we removed it + // above + Some(ComplexSelectorChildren::Combinator(..)) + if combinator.value == CombinatorValue::Descendant => {} + _ => { + result.push(ComplexSelectorChildren::Combinator(combinator)); + } + } + } + + v.iter_mut().for_each(|sel| { + if i < node.subclass_selectors.len() { + if let ComplexSelectorChildren::CompoundSelector(sel) = sel { + sel.subclass_selectors + .extend(node.subclass_selectors[i + 1..].iter().cloned()); + } + } + }); + + result.extend(v); + + Ok(result) + } + Err(_) => bail!("Failed to transform one off global selector"), + }; + } + } + + let subclass_selector = match self.is_dynamic { + true => "__jsx-style-dynamic-selector", + false => &self.class_name, + }; + let insert_index = match pseudo_index { + None => node.subclass_selectors.len(), + Some(i) => i, + }; + + if !self.is_global { + node.subclass_selectors.insert( + insert_index, + SubclassSelector::Class(ClassSelector { + span: DUMMY_SP, + text: Ident { + raw: Some(subclass_selector.into()), + value: subclass_selector.into(), + span: DUMMY_SP, + }, + }), + ); + } + + let mut result = vec![]; + + if let Some(combinator) = combinator { + result.push(ComplexSelectorChildren::Combinator(combinator)); + } + + result.push(ComplexSelectorChildren::CompoundSelector(node)); + + Ok(result) + } +} + +fn get_front_selector_tokens(selector_tokens: &Tokens) -> Vec { + let start_pos = selector_tokens.span.lo.to_u32() - 2; + vec![ + TokenAndSpan { + span: Span { + lo: BytePos(start_pos), + hi: BytePos(start_pos + 1), + ctxt: SyntaxContext::empty(), + }, + token: Token::Ident { + raw: "a".into(), + value: "a".into(), + }, + }, + TokenAndSpan { + span: Span { + lo: BytePos(start_pos + 1), + hi: BytePos(start_pos + 2), + ctxt: SyntaxContext::empty(), + }, + token: Token::WhiteSpace { value: " ".into() }, + }, + ] +} diff --git a/packages/swc-magic/transform/src/utils.rs b/packages/swc-magic/transform/src/utils.rs new file mode 100644 index 000000000..4b26a97eb --- /dev/null +++ b/packages/swc-magic/transform/src/utils.rs @@ -0,0 +1,371 @@ +use std::{collections::hash_map::DefaultHasher, hash::Hasher}; + +use swc_common::DUMMY_SP; +use swc_ecma_ast::*; + +use crate::style::{ExternalStyle, JSXStyle, LocalStyle}; + +fn tpl_element(value: &str) -> TplElement { + TplElement { + raw: value.into(), + cooked: None, + span: DUMMY_SP, + tail: false, + } +} + +pub fn compute_class_names( + styles: &[JSXStyle], + style_import_name: &str, +) -> (Option, Option) { + let mut static_class_name = None; + let mut external_jsx_id = None; + let mut static_hashes = vec![]; + let mut dynamic_styles = vec![]; + let mut external_styles = vec![]; + for style_info in styles { + match style_info { + JSXStyle::Local(style_info) => { + if !style_info.is_dynamic { + static_hashes.push(style_info.hash.clone()); + } else { + dynamic_styles.push(style_info); + } + } + JSXStyle::External(external) => { + if !external.is_global { + external_styles.push(external.expr.clone()); + } + } + } + } + + if !external_styles.is_empty() { + let mut quasis = vec![tpl_element("jsx-")]; + for _i in 1..external_styles.len() { + quasis.push(tpl_element(" jsx-")) + } + quasis.push(tpl_element("")); + external_jsx_id = Some(Expr::Tpl(Tpl { + quasis, + exprs: external_styles + .iter() + .map(|external| Box::new(external.clone())) + .collect(), + span: DUMMY_SP, + })); + } + + if !static_hashes.is_empty() { + static_class_name = Some(format!("jsx-{}", hash_string(&static_hashes.join(",")))); + } + + let dynamic_class_name = match dynamic_styles.len() { + 0 => None, + _ => Some(Expr::Call(CallExpr { + callee: Callee::Expr(Box::new(Expr::Member(MemberExpr { + obj: Box::new(Expr::Ident(Ident { + sym: style_import_name.into(), + span: DUMMY_SP, + optional: false, + })), + prop: MemberProp::Ident(Ident { + sym: "dynamic".into(), + span: DUMMY_SP, + optional: false, + }), + span: DUMMY_SP, + }))), + args: vec![ExprOrSpread { + expr: Box::new(Expr::Array(ArrayLit { + elems: dynamic_styles + .iter() + .map(|style_info| { + let hash_input = match &static_class_name { + Some(class_name) => format!("{}{}", style_info.hash, class_name), + None => style_info.hash.clone(), + }; + Some(ExprOrSpread { + expr: Box::new(Expr::Array(ArrayLit { + elems: vec![ + Some(ExprOrSpread { + expr: Box::new(string_literal_expr(&hash_string( + &hash_input, + ))), + spread: None, + }), + Some(ExprOrSpread { + expr: Box::new(Expr::Array(ArrayLit { + elems: style_info + .expressions + .iter() + .map(|expression| { + Some(ExprOrSpread { + expr: expression.clone(), + spread: None, + }) + }) + .collect(), + span: DUMMY_SP, + })), + spread: None, + }), + ], + span: DUMMY_SP, + })), + spread: None, + }) + }) + .collect(), + span: DUMMY_SP, + })), + spread: None, + }], + span: DUMMY_SP, + type_args: None, + })), + }; + + let class_name_expr = match ( + static_class_name.clone(), + dynamic_class_name, + external_jsx_id, + ) { + (Some(static_class_name), Some(dynamic_class_name), Some(external_jsx_id)) => Some(add( + add( + external_jsx_id, + string_literal_expr(&format!(" {} ", static_class_name)), + ), + dynamic_class_name, + )), + (Some(static_class_name), Some(dynamic_class_name), None) => Some(add( + string_literal_expr(&format!("{} ", static_class_name)), + dynamic_class_name, + )), + (Some(static_class_name), None, Some(external_jsx_id)) => Some(add( + string_literal_expr(&format!("{} ", static_class_name)), + external_jsx_id, + )), + (None, Some(dynamic_class_name), Some(external_jsx_id)) => Some(add( + add(external_jsx_id, string_literal_expr(" ")), + dynamic_class_name, + )), + (Some(static_class_name), None, None) => Some(string_literal_expr(&static_class_name)), + (None, Some(dynamic_class_name), None) => Some(dynamic_class_name), + (None, None, Some(external_jsx_id)) => Some(external_jsx_id), + _ => None, + }; + + (static_class_name, class_name_expr) +} + +pub fn make_external_styled_jsx_el(style: &ExternalStyle, style_import_name: &str) -> JSXElement { + let attrs = vec![JSXAttrOrSpread::JSXAttr(JSXAttr { + name: JSXAttrName::Ident(Ident { + sym: "id".into(), + span: DUMMY_SP, + optional: false, + }), + value: Some(JSXAttrValue::JSXExprContainer(JSXExprContainer { + expr: JSXExpr::Expr(Box::new(style.expr.clone())), + span: DUMMY_SP, + })), + span: DUMMY_SP, + })]; + let opening = JSXOpeningElement { + name: JSXElementName::Ident(Ident { + sym: style_import_name.into(), + span: DUMMY_SP, + optional: false, + }), + attrs, + span: DUMMY_SP, + self_closing: false, + type_args: None, + }; + + let closing = Some(JSXClosingElement { + name: JSXElementName::Ident(Ident { + sym: style_import_name.into(), + span: DUMMY_SP, + optional: false, + }), + span: DUMMY_SP, + }); + + let children = vec![JSXElementChild::JSXExprContainer(JSXExprContainer { + expr: JSXExpr::Expr(Box::new(Expr::Ident(style.identifier.clone()))), + span: DUMMY_SP, + })]; + JSXElement { + opening, + closing, + children, + span: DUMMY_SP, + } +} + +pub fn make_local_styled_jsx_el( + style_info: &LocalStyle, + css_expr: Expr, + style_import_name: &str, + static_class_name: Option<&String>, +) -> JSXElement { + let hash_input = match (&style_info.is_dynamic, &static_class_name) { + (true, Some(class_name)) => format!("{}{}", style_info.hash, class_name), + _ => style_info.hash.clone(), + }; + let mut attrs = vec![JSXAttrOrSpread::JSXAttr(JSXAttr { + name: JSXAttrName::Ident(Ident { + sym: "id".into(), + span: DUMMY_SP, + optional: false, + }), + value: Some(JSXAttrValue::JSXExprContainer(JSXExprContainer { + expr: JSXExpr::Expr(Box::new(string_literal_expr( + hash_string(&hash_input).as_str(), + ))), + span: DUMMY_SP, + })), + span: DUMMY_SP, + })]; + + if style_info.is_dynamic { + attrs.push(JSXAttrOrSpread::JSXAttr(JSXAttr { + name: JSXAttrName::Ident(Ident { + sym: "dynamic".into(), + span: DUMMY_SP, + optional: false, + }), + value: Some(JSXAttrValue::JSXExprContainer(JSXExprContainer { + expr: JSXExpr::Expr(Box::new(Expr::Array(ArrayLit { + elems: style_info + .expressions + .iter() + .map(|expression| { + Some(ExprOrSpread { + expr: expression.clone(), + spread: None, + }) + }) + .collect(), + span: DUMMY_SP, + }))), + span: DUMMY_SP, + })), + span: DUMMY_SP, + })); + } + + let opening = JSXOpeningElement { + name: JSXElementName::Ident(Ident { + sym: style_import_name.into(), + span: DUMMY_SP, + optional: false, + }), + attrs, + span: DUMMY_SP, + self_closing: false, + type_args: None, + }; + + let closing = Some(JSXClosingElement { + name: JSXElementName::Ident(Ident { + sym: style_import_name.into(), + span: DUMMY_SP, + optional: false, + }), + span: DUMMY_SP, + }); + + let children = vec![JSXElementChild::JSXExprContainer(JSXExprContainer { + expr: JSXExpr::Expr(Box::new(css_expr)), + span: DUMMY_SP, + })]; + JSXElement { + opening, + closing, + children, + span: DUMMY_SP, + } +} + +pub fn get_usable_import_specifier(_items: &[ModuleItem]) -> String { + // TODO + String::from("_JSXStyle") +} + +pub fn styled_jsx_import_decl(style_import_name: &str) -> ModuleItem { + ModuleItem::ModuleDecl(ModuleDecl::Import(ImportDecl { + with: None, + span: DUMMY_SP, + type_only: false, + specifiers: vec![ImportSpecifier::Default(ImportDefaultSpecifier { + local: Ident { + sym: style_import_name.into(), + span: DUMMY_SP, + optional: false, + }, + span: DUMMY_SP, + })], + src: Box::new(Str { + span: DUMMY_SP, + value: "styled-jsx/style".into(), + raw: None, + }), + })) +} + +// TODO: maybe use DJBHasher (need to implement) +pub fn hash_string(str: &str) -> String { + let mut hasher = DefaultHasher::new(); + hasher.write(str.as_bytes()); + let hash_result = hasher.finish(); + format!("{:x}", hash_result) +} + +pub fn string_literal_expr(str: &str) -> Expr { + let str = str.replace("\\`", "`"); + Expr::Lit(Lit::Str(Str { + value: str.into(), + span: DUMMY_SP, + raw: None, + })) +} + +pub fn ident(str: &str) -> Ident { + Ident { + sym: str.into(), + span: DUMMY_SP, + optional: false, + } +} + +pub fn is_capitalized(word: &str) -> bool { + word.chars().next().unwrap().is_uppercase() +} + +pub fn add(left: Expr, right: Expr) -> Expr { + binary_expr(BinaryOp::Add, left, right) +} + +pub fn and(left: Expr, right: Expr) -> Expr { + binary_expr(BinaryOp::LogicalAnd, left, right) +} + +pub fn or(left: Expr, right: Expr) -> Expr { + binary_expr(BinaryOp::LogicalOr, left, right) +} + +pub fn not_eq(left: Expr, right: Expr) -> Expr { + binary_expr(BinaryOp::NotEq, left, right) +} + +pub fn binary_expr(op: BinaryOp, left: Expr, right: Expr) -> Expr { + Expr::Bin(BinExpr { + op, + left: Box::new(left), + right: Box::new(right), + span: DUMMY_SP, + }) +} diff --git a/packages/swc-magic/transform/src/visitor.rs b/packages/swc-magic/transform/src/visitor.rs new file mode 100644 index 000000000..2196a35a9 --- /dev/null +++ b/packages/swc-magic/transform/src/visitor.rs @@ -0,0 +1,963 @@ +use std::{ + collections::hash_map::DefaultHasher, + hash::{Hash, Hasher}, + mem::take, + sync::Arc, +}; + +use easy_error::{bail, Error}; +use serde::Deserialize; +use swc_common::{collections::AHashSet, errors::HANDLER, FileName, SourceMap, Span, DUMMY_SP}; +use swc_ecma_ast::*; +use swc_ecma_minifier::{ + eval::{EvalResult, Evaluator}, + marks::Marks, +}; +use swc_ecma_utils::{collect_decls, drop_span, prepend_stmt, private_ident}; +use swc_ecma_visit::{Fold, FoldWith}; + +use crate::{ + style::{ExternalStyle, JSXStyle, LocalStyle}, + utils::{ + add, and, compute_class_names, get_usable_import_specifier, hash_string, ident, + is_capitalized, make_external_styled_jsx_el, make_local_styled_jsx_el, not_eq, or, + string_literal_expr, styled_jsx_import_decl, + }, +}; + +#[derive(Debug, Clone, Copy, Deserialize)] +#[serde(rename_all = "camelCase")] +pub struct Config { + #[serde(default)] + pub use_lightningcss: bool, +} + +pub fn styled_jsx(cm: Arc, file_name: FileName, config: Config) -> impl Fold { + let file_name = match file_name { + FileName::Real(real_file_name) => real_file_name + .to_str() + .map(|real_file_name| real_file_name.to_string()), + _ => None, + }; + + StyledJSXTransformer { + cm, + config, + file_name, + styles: Default::default(), + static_class_name: Default::default(), + class_name: Default::default(), + file_has_styled_jsx: Default::default(), + has_styled_jsx: Default::default(), + bindings: Default::default(), + nearest_scope_bindings: Default::default(), + func_scope_level: Default::default(), + style_import_name: Default::default(), + external_bindings: Default::default(), + file_has_css_resolve: Default::default(), + external_hash: Default::default(), + add_hash: Default::default(), + add_default_decl: Default::default(), + in_function_params: Default::default(), + evaluator: Default::default(), + visiting_styled_jsx_descendants: Default::default(), + } +} + +struct StyledJSXTransformer { + cm: Arc, + config: Config, + + file_name: Option, + styles: Vec, + static_class_name: Option, + class_name: Option, + file_has_styled_jsx: bool, + has_styled_jsx: bool, + bindings: AHashSet, + nearest_scope_bindings: AHashSet, + func_scope_level: u8, + style_import_name: Option, + external_bindings: Vec, + file_has_css_resolve: bool, + external_hash: Option, + add_hash: Option<(Id, String)>, + add_default_decl: Option<(Id, Expr)>, + in_function_params: bool, + evaluator: Option, + visiting_styled_jsx_descendants: bool, +} + +enum StyleExpr<'a> { + Str(&'a Str), + Tpl(&'a Tpl, &'a Expr), + Ident(&'a Ident), +} + +impl Fold for StyledJSXTransformer { + fn fold_jsx_element(&mut self, el: JSXElement) -> JSXElement { + if is_styled_jsx(&el) { + if self.visiting_styled_jsx_descendants { + HANDLER.with(|handler| { + handler + .struct_span_err( + el.span, + "Detected nested styled-jsx tag.\nRead more: https://nextjs.org/docs/messages/nested-styled-jsx-tags", + ) + .emit() + }); + return el; + } + + let parent_has_styled_jsx = self.has_styled_jsx; + if !parent_has_styled_jsx && self.check_for_jsx_styles(Some(&el), &el.children).is_err() + { + return el; + } + let el = match self.replace_jsx_style(&el) { + Ok(el) => el, + Err(_) => el, + }; + if !parent_has_styled_jsx { + self.reset_styles_state(); + } + return el; + } + + if self.has_styled_jsx { + self.visiting_styled_jsx_descendants = true; + let el = el.fold_children_with(self); + self.visiting_styled_jsx_descendants = false; + return el; + } + + if self.check_for_jsx_styles(None, &el.children).is_err() { + return el; + } + let el = el.fold_children_with(self); + self.reset_styles_state(); + + el + } + + fn fold_jsx_fragment(&mut self, fragment: JSXFragment) -> JSXFragment { + if self.has_styled_jsx { + self.visiting_styled_jsx_descendants = true; + let fragment = fragment.fold_children_with(self); + self.visiting_styled_jsx_descendants = false; + return fragment; + } + + if self.check_for_jsx_styles(None, &fragment.children).is_err() { + return fragment; + }; + let fragment = fragment.fold_children_with(self); + self.reset_styles_state(); + + fragment + } + + fn fold_jsx_opening_element(&mut self, mut el: JSXOpeningElement) -> JSXOpeningElement { + if !self.has_styled_jsx { + return el; + } + + el.attrs = el.attrs.fold_with(self); + + if let JSXElementName::Ident(Ident { sym, span, .. }) = &el.name { + if sym != "style" + && sym != self.style_import_name.as_ref().unwrap() + && (!is_capitalized(sym) + || self + .nearest_scope_bindings + .contains(&(sym.clone(), span.ctxt))) + { + let (existing_class_name, existing_index, existing_spread_index) = + get_existing_class_name(&el); + + let new_class_name = match (existing_class_name, &self.class_name) { + (Some(existing_class_name), Some(class_name)) => Some(add( + add(class_name.clone(), string_literal_expr(" ")), + existing_class_name, + )), + (Some(existing_class_name), None) => Some(existing_class_name), + (None, Some(class_name)) => Some(class_name.clone()), + _ => None, + }; + + if let Some(new_class_name) = new_class_name { + let class_name_attr = JSXAttrOrSpread::JSXAttr(JSXAttr { + span: DUMMY_SP, + name: JSXAttrName::Ident(ident("className")), + value: Some(JSXAttrValue::JSXExprContainer(JSXExprContainer { + expr: JSXExpr::Expr(Box::new(new_class_name)), + span: DUMMY_SP, + })), + }); + el.attrs.push(class_name_attr); + } + if let Some(existing_spread_index) = existing_spread_index { + el.attrs.remove(existing_spread_index); + } + if let Some(existing_index) = existing_index { + el.attrs.remove(existing_index); + } + } + } + + el + } + + fn fold_import_decl(&mut self, decl: ImportDecl) -> ImportDecl { + let ImportDecl { + ref src, + ref specifiers, + .. + } = decl; + if &src.value == "styled-jsx/css" { + for specifier in specifiers { + match specifier { + ImportSpecifier::Default(default_specifier) => { + self.external_bindings.push(default_specifier.local.to_id()) + } + ImportSpecifier::Named(named_specifier) => { + self.external_bindings.push(named_specifier.local.to_id()) + } + _ => {} + } + } + } + + decl + } + + fn fold_expr(&mut self, expr: Expr) -> Expr { + let expr = expr.fold_children_with(self); + match expr { + Expr::TaggedTpl(tagged_tpl) => match &*tagged_tpl.tag { + Expr::Ident(identifier) => { + if self.external_bindings.contains(&identifier.to_id()) { + match self.process_tagged_template_expr(&tagged_tpl, &identifier.sym) { + Ok(expr) => expr, + Err(_) => Expr::TaggedTpl(tagged_tpl), + } + } else { + Expr::TaggedTpl(tagged_tpl) + } + } + Expr::Member(MemberExpr { + obj: boxed_ident, .. + }) => { + if let Expr::Ident(identifier) = &**boxed_ident { + if self.external_bindings.contains(&identifier.to_id()) { + match self.process_tagged_template_expr(&tagged_tpl, &identifier.sym) { + Ok(expr) => expr, + Err(_) => Expr::TaggedTpl(tagged_tpl), + } + } else { + Expr::TaggedTpl(tagged_tpl) + } + } else { + Expr::TaggedTpl(tagged_tpl) + } + } + _ => Expr::TaggedTpl(tagged_tpl), + }, + expr => expr, + } + } + + fn fold_var_declarator(&mut self, declarator: VarDeclarator) -> VarDeclarator { + let declarator = declarator.fold_children_with(self); + if let Some(external_hash) = &self.external_hash.take() { + if let Pat::Ident(BindingIdent { + id: Ident { span, sym, .. }, + .. + }) = &declarator.name + { + self.add_hash = Some(((sym.clone(), span.ctxt), external_hash.clone())); + } + } + declarator + } + + fn fold_export_default_expr(&mut self, default_expr: ExportDefaultExpr) -> ExportDefaultExpr { + let default_expr = default_expr.fold_children_with(self); + if let Some(external_hash) = &self.external_hash.take() { + let default_ident = private_ident!("_defaultExport"); + self.add_hash = Some((default_ident.to_id(), external_hash.clone())); + self.add_default_decl = Some((default_ident.to_id(), *default_expr.expr)); + return ExportDefaultExpr { + expr: Box::new(Expr::Ident(default_ident)), + span: DUMMY_SP, + }; + } + default_expr + } + + fn fold_block_stmt(&mut self, mut block: BlockStmt) -> BlockStmt { + let mut new_stmts = vec![]; + for stmt in block.stmts { + new_stmts.push(stmt.fold_children_with(self)); + if let Some(add_hash) = self.add_hash.take() { + new_stmts.push(add_hash_statement(add_hash)); + } + } + + block.stmts = new_stmts; + block + } + + fn fold_module_items(&mut self, items: Vec) -> Vec { + let mut new_items = vec![]; + for item in items { + let new_item = item.fold_children_with(self); + if let Some((default_ident, default_expr)) = &self.add_default_decl { + new_items.push(ModuleItem::Stmt(Stmt::Decl(Decl::Var(Box::new(VarDecl { + kind: VarDeclKind::Const, + declare: false, + decls: vec![VarDeclarator { + name: Pat::Ident(BindingIdent { + id: Ident { + sym: default_ident.0.clone(), + span: DUMMY_SP.with_ctxt(default_ident.1), + optional: false, + }, + type_ann: None, + }), + init: Some(Box::new(default_expr.clone())), + definite: false, + span: DUMMY_SP, + }], + span: DUMMY_SP, + }))))); + self.add_default_decl = None; + if let Some(add_hash) = self.add_hash.take() { + new_items.push(ModuleItem::Stmt(add_hash_statement(add_hash))); + } + } + if !is_styled_css_import(&new_item) { + new_items.push(new_item); + } + if let Some(add_hash) = self.add_hash.take() { + new_items.push(ModuleItem::Stmt(add_hash_statement(add_hash))); + } + } + + if self.file_has_styled_jsx || self.file_has_css_resolve { + prepend_stmt( + &mut new_items, + styled_jsx_import_decl(self.style_import_name.as_ref().unwrap()), + ); + } + + new_items + } + + fn fold_binding_ident(&mut self, node: BindingIdent) -> BindingIdent { + if self.in_function_params { + self.nearest_scope_bindings.insert(node.id.to_id()); + } + node + } + + fn fold_assign_pat_prop(&mut self, node: AssignPatProp) -> AssignPatProp { + if self.in_function_params { + self.nearest_scope_bindings.insert(node.key.to_id()); + } + node + } + + fn fold_function(&mut self, mut func: Function) -> Function { + self.func_scope_level += 1; + let surrounding_scope_bindings = take(&mut self.nearest_scope_bindings); + self.in_function_params = true; + let mut new_params = vec![]; + for param in func.params { + new_params.push(param.fold_with(self)); + } + func.params = new_params; + self.in_function_params = false; + self.nearest_scope_bindings.extend(collect_decls(&func)); + func.body = func.body.fold_with(self); + self.nearest_scope_bindings = surrounding_scope_bindings; + self.func_scope_level -= 1; + func + } + + fn fold_arrow_expr(&mut self, mut func: ArrowExpr) -> ArrowExpr { + self.func_scope_level += 1; + let surrounding_scope_bindings = take(&mut self.nearest_scope_bindings); + self.in_function_params = true; + let mut new_params = vec![]; + for param in func.params { + new_params.push(param.fold_with(self)); + } + func.params = new_params; + self.in_function_params = false; + self.nearest_scope_bindings.extend(collect_decls(&func)); + func.body = func.body.fold_with(self); + self.nearest_scope_bindings = surrounding_scope_bindings; + self.func_scope_level -= 1; + func + } + + fn fold_module(&mut self, module: Module) -> Module { + self.bindings = collect_decls(&module); + self.evaluator = Some(Evaluator::new(module.clone(), Marks::new())); + self.style_import_name = Some(get_usable_import_specifier(&module.body)); + let module = module.fold_children_with(self); + if self.file_has_css_resolve + && self.file_name.is_some() + && self.file_name.as_ref().unwrap().ends_with(".ts") + { + let file_name: &str = self.file_name.as_ref().unwrap(); + HANDLER.with(|handler| { + handler.err(&format!( + "{} uses `css.resolve`, but ends with `.ts`. The file extension needs to be \ + `.tsx` so that the jsx injected by `css.resolve` will be transformed.", + file_name + )); + }); + } + module + } +} + +impl StyledJSXTransformer { + fn check_for_jsx_styles( + &mut self, + el: Option<&JSXElement>, + children: &[JSXElementChild], + ) -> Result<(), Error> { + let mut styles = vec![]; + let mut process_style = |el: &JSXElement| { + self.file_has_styled_jsx = true; + self.has_styled_jsx = true; + let expr = get_style_expr(el)?; + let style_info = self.get_jsx_style(expr, is_global(el)); + styles.insert(0, style_info); + + Ok(()) + }; + + if el.is_some() && is_styled_jsx(el.unwrap()) { + process_style(el.unwrap())?; + } else { + for i in children { + if let JSXElementChild::JSXElement(child_el) = &i { + if is_styled_jsx(child_el) { + process_style(child_el)?; + } + } + } + }; + + if self.has_styled_jsx { + let (static_class_name, class_name) = + compute_class_names(&styles, self.style_import_name.as_ref().unwrap()); + self.styles = styles; + self.static_class_name = static_class_name; + self.class_name = class_name; + } + + Ok(()) + } + + fn get_jsx_style(&mut self, style_expr: StyleExpr, is_global_jsx_element: bool) -> JSXStyle { + let mut hasher = DefaultHasher::new(); + let css: String; + let css_span: Span; + let is_dynamic; + let mut expressions = vec![]; + let mut is_expr_property = vec![]; + match style_expr { + StyleExpr::Str(Str { value, span, .. }) => { + hasher.write(value.as_ref().as_bytes()); + css = value.to_string(); + css_span = *span; + is_dynamic = false; + } + StyleExpr::Tpl( + Tpl { + exprs, + quasis, + span, + }, + expr, + ) => { + if exprs.is_empty() { + hasher.write(quasis[0].raw.as_bytes()); + css = quasis[0].raw.to_string(); + css_span = *span; + is_dynamic = false; + } else { + drop_span(expr.clone()).hash(&mut hasher); + let mut s = String::new(); + for i in 0..quasis.len() { + // TODO: Handle comments + + let before = &*quasis[i].raw; + let before = before.trim(); + + let placeholder = if i == quasis.len() - 1 { + is_expr_property.push(false); + String::new() + } else if self.config.use_lightningcss && before.ends_with([';', '{']) { + is_expr_property.push(true); + format!("__styled-jsx-placeholder-{}__: 0", i) + } else { + is_expr_property.push(false); + format!("__styled-jsx-placeholder-{}__", i) + }; + s.push_str(&quasis[i].raw); + s.push_str(&placeholder); + } + css = s; + css_span = *span; + is_dynamic = if self.func_scope_level > 0 { + let res = self.evaluator.as_mut().unwrap().eval(expr); + !matches!(res, Some(EvalResult::Lit(_))) + } else { + false + }; + expressions = exprs.clone(); + } + } + StyleExpr::Ident(ident) => { + return JSXStyle::External(ExternalStyle { + expr: Expr::Member(MemberExpr { + obj: Box::new(Expr::Ident(ident.clone())), + prop: MemberProp::Ident(Ident { + sym: "__hash".into(), + span: DUMMY_SP, + optional: false, + }), + span: DUMMY_SP, + }), + identifier: ident.clone(), + is_global: is_global_jsx_element, + }); + } + } + + JSXStyle::Local(LocalStyle { + hash: format!("{:x}", hasher.finish()), + css, + css_span, + is_dynamic, + expressions, + is_expr_property, + }) + } + + fn replace_jsx_style(&mut self, el: &JSXElement) -> Result { + let style_info = self.styles.pop().unwrap(); + + let is_global = el.opening.attrs.iter().any(|attr| { + if let JSXAttrOrSpread::JSXAttr(JSXAttr { + name: JSXAttrName::Ident(Ident { sym, .. }), + .. + }) = &attr + { + if sym == "global" { + return true; + } + } + false + }); + + match &style_info { + JSXStyle::Local(style_info) => { + let css = if self.config.use_lightningcss { + crate::transform_css_lightningcss::transform_css( + self.cm.clone(), + style_info, + is_global, + &self.static_class_name, + )? + } else { + crate::transform_css_swc::transform_css( + self.cm.clone(), + style_info, + is_global, + &self.static_class_name, + )? + }; + + Ok(make_local_styled_jsx_el( + style_info, + css, + self.style_import_name.as_ref().unwrap(), + self.static_class_name.as_ref(), + )) + } + JSXStyle::External(style) => Ok(make_external_styled_jsx_el( + style, + self.style_import_name.as_ref().unwrap(), + )), + } + } + + fn process_tagged_template_expr( + &mut self, + tagged_tpl: &TaggedTpl, + tag: &str, + ) -> Result { + if tag != "resolve" { + // Check whether there are undefined references or + // references to this.something (e.g. props or state). + // We allow dynamic styles only when resolving styles. + } + + let style = self.get_jsx_style( + StyleExpr::Tpl(&tagged_tpl.tpl, &Expr::Tpl(*tagged_tpl.tpl.clone())), + false, + ); + let styles = vec![style]; + let (static_class_name, class_name) = + compute_class_names(&styles, self.style_import_name.as_ref().unwrap()); + let tag = match &*tagged_tpl.tag { + Expr::Ident(Ident { sym, .. }) => sym.to_string(), + Expr::Member(MemberExpr { + prop: MemberProp::Ident(Ident { sym, .. }), + .. + }) => sym.to_string(), + _ => String::from("not_styled_jsx_tag"), + }; + let style = if let JSXStyle::Local(style) = &styles[0] { + if tag != "resolve" { + self.external_hash = Some(hash_string(&style.hash.clone())); + } + style + } else { + bail!("This shouldn't happen, we already know that this is a template literal"); + }; + let css = if self.config.use_lightningcss { + crate::transform_css_lightningcss::transform_css( + self.cm.clone(), + style, + tag == "global", + &static_class_name, + )? + } else { + crate::transform_css_swc::transform_css( + self.cm.clone(), + style, + tag == "global", + &static_class_name, + )? + }; + if tag == "resolve" { + self.file_has_css_resolve = true; + return Ok(Expr::Object(ObjectLit { + props: vec![ + PropOrSpread::Prop(Box::new(Prop::KeyValue(KeyValueProp { + key: PropName::Ident(Ident { + sym: "styles".into(), + span: DUMMY_SP, + optional: false, + }), + value: Box::new(Expr::JSXElement(Box::new(make_local_styled_jsx_el( + style, + css, + self.style_import_name.as_ref().unwrap(), + self.static_class_name.as_ref(), + )))), + }))), + PropOrSpread::Prop(Box::new(Prop::KeyValue(KeyValueProp { + key: PropName::Ident(Ident { + sym: "className".into(), + span: DUMMY_SP, + optional: false, + }), + value: Box::new(class_name.unwrap()), + }))), + ], + span: DUMMY_SP, + })); + } + Ok(Expr::New(NewExpr { + callee: Box::new(Expr::Ident(Ident { + sym: "String".into(), + span: DUMMY_SP, + optional: false, + })), + args: Some(vec![ExprOrSpread { + expr: Box::new(css), + spread: None, + }]), + span: DUMMY_SP, + type_args: None, + })) + } + + fn reset_styles_state(&mut self) { + self.has_styled_jsx = false; + self.static_class_name = None; + self.class_name = None; + self.styles = vec![]; + } +} + +fn is_styled_jsx(el: &JSXElement) -> bool { + if let JSXElementName::Ident(Ident { sym, .. }) = &el.opening.name { + if sym != "style" { + return false; + } + } + + el.opening.attrs.iter().any(|attr| { + if let JSXAttrOrSpread::JSXAttr(JSXAttr { + name: JSXAttrName::Ident(Ident { sym, .. }), + .. + }) = &attr + { + if sym == "jsx" { + return true; + } + } + false + }) +} + +fn is_global(el: &JSXElement) -> bool { + if let JSXElementName::Ident(Ident { sym, .. }) = &el.opening.name { + if sym != "style" { + return false; + } + } + + el.opening.attrs.iter().any(|attr| { + if let JSXAttrOrSpread::JSXAttr(JSXAttr { + name: JSXAttrName::Ident(Ident { sym, .. }), + .. + }) = &attr + { + if sym == "global" { + return true; + } + } + false + }) +} + +fn get_style_expr(el: &JSXElement) -> Result { + let non_whitespace_children: &Vec<&JSXElementChild> = &el + .children + .iter() + .filter(|child| { + if let JSXElementChild::JSXText(txt) = child { + if txt.value.chars().all(char::is_whitespace) { + return false; + } + } + true + }) + .collect(); + + if non_whitespace_children.len() != 1 { + HANDLER.with(|handler| { + handler + .struct_span_err( + el.span, + &format!( + "Expected one child under JSX style tag, but got {}.\nRead more: https://nextjs.org/docs/messages/invalid-styled-jsx-children", + non_whitespace_children.len() + ), + ) + .emit() + }); + bail!("styled-jsx style error"); + } + + if let JSXElementChild::JSXExprContainer(JSXExprContainer { + expr: JSXExpr::Expr(expr), + .. + }) = non_whitespace_children[0] + { + return Ok(match &**expr { + Expr::Lit(Lit::Str(str)) => StyleExpr::Str(str), + Expr::Tpl(tpl) => StyleExpr::Tpl(tpl, expr), + Expr::Ident(ident) => StyleExpr::Ident(ident), + _ => { + HANDLER.with(|handler| { + handler + .struct_span_err( + el.span, + "Expected a template literal, string or identifier inside the JSXExpressionContainer.\nRead more: https://nextjs.org/docs/messages/invalid-styled-jsx-children", + ) + .emit() + }); + bail!("wrong jsx expression container type"); + } + }); + } + + HANDLER.with(|handler| { + handler + .struct_span_err( + el.span, + "Expected a single child of type JSXExpressionContainer under JSX Style tag.\nRead more: https://nextjs.org/docs/messages/invalid-styled-jsx-children", + ) + .emit() + }); + bail!("next-swc compilation error"); +} + +fn get_existing_class_name(el: &JSXOpeningElement) -> (Option, Option, Option) { + let mut spreads = vec![]; + let mut class_name_expr = None; + let mut existing_index = None; + let mut existing_spread_index = None; + for i in (0..el.attrs.len()).rev() { + match &el.attrs[i] { + JSXAttrOrSpread::JSXAttr(JSXAttr { + name: JSXAttrName::Ident(Ident { sym, .. }), + value, + .. + }) => { + if sym == "className" { + existing_index = Some(i); + class_name_expr = match value { + Some(JSXAttrValue::Lit(str_lit)) => Some(Expr::Lit(str_lit.clone())), + Some(JSXAttrValue::JSXExprContainer(JSXExprContainer { + expr: JSXExpr::Expr(expr), + .. + })) => Some(*expr.clone()), + None => None, + _ => None, + }; + break; + } + } + JSXAttrOrSpread::SpreadElement(SpreadElement { expr, .. }) => { + if let Expr::Object(ObjectLit { props, .. }) = &**expr { + let mut has_spread = false; + let mut has_class_name = false; + for j in 0..props.len() { + if let PropOrSpread::Prop(prop) = &props[j] { + if let Prop::KeyValue(KeyValueProp { + key: PropName::Ident(Ident { sym, .. }), + value, + }) = &**prop + { + if sym == "className" { + has_class_name = true; + class_name_expr = Some(*value.clone()); + if props.len() == 1 { + existing_spread_index = Some(i); + } + } + } + } else { + has_spread = true; + } + } + if has_class_name { + break; + } + if !has_spread { + continue; + } + } + + let valid_spread = matches!(&**expr, Expr::Member(_) | Expr::Ident(_)); + + if valid_spread { + let member_dot_name = Expr::Member(MemberExpr { + obj: Box::new(*expr.clone()), + prop: MemberProp::Ident(ident("className")), + span: DUMMY_SP, + }); + // `${name} && ${name}.className != null && ${name}.className` + spreads.push(and( + and( + *expr.clone(), + not_eq( + member_dot_name.clone(), + Expr::Lit(Lit::Null(Null { span: DUMMY_SP })), + ), + ), + member_dot_name.clone(), + )); + } + } + _ => {} + }; + } + + let spread_expr = match spreads.len() { + 0 => None, + _ => Some(join_spreads(spreads)), + }; + + let class_name_expr = match class_name_expr { + Some(e @ Expr::Tpl(_) | e @ Expr::Lit(Lit::Str(_))) => Some(e), + None => None, + _ => Some(or(class_name_expr.unwrap(), string_literal_expr(""))), + }; + + let existing_class_name_expr = match (spread_expr, class_name_expr) { + (Some(spread_expr), Some(class_name_expr)) => Some(or(spread_expr, class_name_expr)), + (Some(spread_expr), None) => Some(or(spread_expr, string_literal_expr(""))), + (None, Some(class_name_expr)) => Some(class_name_expr), + _ => None, + }; + + ( + existing_class_name_expr, + existing_index, + existing_spread_index, + ) +} + +fn join_spreads(spreads: Vec) -> Expr { + let mut new_expr = spreads[0].clone(); + for i in spreads.iter().skip(1) { + new_expr = Expr::Bin(BinExpr { + op: op!("||"), + left: Box::new(new_expr.clone()), + right: Box::new(i.clone()), + span: DUMMY_SP, + }) + } + new_expr +} + +fn add_hash_statement((id, hash): (Id, String)) -> Stmt { + Stmt::Expr(ExprStmt { + expr: Box::new(Expr::Assign(AssignExpr { + left: PatOrExpr::Expr(Box::new(Expr::Member(MemberExpr { + obj: Box::new(Expr::Ident(Ident { + sym: id.0, + span: DUMMY_SP.with_ctxt(id.1), + optional: false, + })), + prop: MemberProp::Ident(Ident { + sym: "__hash".into(), + span: DUMMY_SP, + optional: false, + }), + span: DUMMY_SP, + }))), + right: Box::new(string_literal_expr(&hash)), + op: op!("="), + span: DUMMY_SP, + })), + span: DUMMY_SP, + }) +} + +fn is_styled_css_import(item: &ModuleItem) -> bool { + if let ModuleItem::ModuleDecl(ModuleDecl::Import(ImportDecl { + src: box Str { value, .. }, + .. + })) = item + { + if value == "styled-jsx/css" { + return true; + } + } + false +} diff --git a/packages/swc-magic/transform/tests/errors/nested-style-tags/input.js b/packages/swc-magic/transform/tests/errors/nested-style-tags/input.js new file mode 100644 index 000000000..56f9802d7 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/nested-style-tags/input.js @@ -0,0 +1,31 @@ +const Component = () => ( + <> +
+ + + + +

+
+
+

+ Welcome! + +

+ +
+
+ +

+ Hello world! + +

+
+
+ <> + + + +
+ +) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.js b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.js new file mode 100644 index 000000000..c23b0c2a4 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.js @@ -0,0 +1,58 @@ +import _JSXStyle from "styled-jsx/style"; +const Component = ()=><> + +
+ + + + <_JSXStyle id={styles.__hash}>{styles} + + <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} + + + +

<_JSXStyle id={"b3e1b6a7c9b96113"}>{""}

+ +
+ +
+ +

+ + Welcome! + + + +

+ + <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} + +
+ +
+ + <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} + +

+ + Hello world! + + + +

+ +
+ +
+ + <> + + + + + + <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} + +
+ + ; diff --git a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.stderr b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.stderr new file mode 100644 index 000000000..54a26813b --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.stderr @@ -0,0 +1,27 @@ + + x Detected nested styled-jsx tag. + | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags + ,-[input.js:12:1] + 12 | Welcome! + 13 | + : ^^^^^^^^^^^^^^^^^^^^^^^ + 14 | + `---- + + x Detected nested styled-jsx tag. + | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags + ,-[input.js:20:1] + 20 | Hello world! + 21 | + : ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + 22 | + `---- + + x Detected nested styled-jsx tag. + | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags + ,-[input.js:25:1] + 25 | <> + 26 | + : ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + 27 | + `---- diff --git a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.js b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.js new file mode 100644 index 000000000..c23b0c2a4 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.js @@ -0,0 +1,58 @@ +import _JSXStyle from "styled-jsx/style"; +const Component = ()=><> + +
+ + + + <_JSXStyle id={styles.__hash}>{styles} + + <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} + + + +

<_JSXStyle id={"b3e1b6a7c9b96113"}>{""}

+ +
+ +
+ +

+ + Welcome! + + + +

+ + <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} + +
+ +
+ + <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} + +

+ + Hello world! + + + +

+ +
+ +
+ + <> + + + + + + <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} + +
+ + ; diff --git a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.stderr b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.stderr new file mode 100644 index 000000000..54a26813b --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.stderr @@ -0,0 +1,27 @@ + + x Detected nested styled-jsx tag. + | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags + ,-[input.js:12:1] + 12 | Welcome! + 13 | + : ^^^^^^^^^^^^^^^^^^^^^^^ + 14 | + `---- + + x Detected nested styled-jsx tag. + | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags + ,-[input.js:20:1] + 20 | Hello world! + 21 | + : ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + 22 | + `---- + + x Detected nested styled-jsx tag. + | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags + ,-[input.js:25:1] + 25 | <> + 26 | + : ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + 27 | + `---- diff --git a/packages/swc-magic/transform/tests/errors/nested-style-tags/output.js b/packages/swc-magic/transform/tests/errors/nested-style-tags/output.js new file mode 100644 index 000000000..c23b0c2a4 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/nested-style-tags/output.js @@ -0,0 +1,58 @@ +import _JSXStyle from "styled-jsx/style"; +const Component = ()=><> + +
+ + + + <_JSXStyle id={styles.__hash}>{styles} + + <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} + + + +

<_JSXStyle id={"b3e1b6a7c9b96113"}>{""}

+ +
+ +
+ +

+ + Welcome! + + + +

+ + <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} + +
+ +
+ + <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} + +

+ + Hello world! + + + +

+ +
+ +
+ + <> + + + + + + <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} + +
+ + ; diff --git a/packages/swc-magic/transform/tests/errors/no-child/input.js b/packages/swc-magic/transform/tests/errors/no-child/input.js new file mode 100644 index 000000000..9567d0ce5 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/no-child/input.js @@ -0,0 +1,6 @@ +export default () => ( +
+ +
+) diff --git a/packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.js b/packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.js new file mode 100644 index 000000000..7a44789ae --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
+ + + +
); diff --git a/packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.stderr b/packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.stderr new file mode 100644 index 000000000..979705668 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.stderr @@ -0,0 +1,9 @@ + + x Expected one child under JSX style tag, but got 0. + | Read more: https://nextjs.org/docs/messages/invalid-styled-jsx-children + ,-[input.js:2:1] + 2 |
+ 3 | ,-> + 5 |
+ `---- diff --git a/packages/swc-magic/transform/tests/errors/no-child/output-swc.js b/packages/swc-magic/transform/tests/errors/no-child/output-swc.js new file mode 100644 index 000000000..7a44789ae --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/no-child/output-swc.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
+ + + +
); diff --git a/packages/swc-magic/transform/tests/errors/no-child/output-swc.stderr b/packages/swc-magic/transform/tests/errors/no-child/output-swc.stderr new file mode 100644 index 000000000..979705668 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/no-child/output-swc.stderr @@ -0,0 +1,9 @@ + + x Expected one child under JSX style tag, but got 0. + | Read more: https://nextjs.org/docs/messages/invalid-styled-jsx-children + ,-[input.js:2:1] + 2 |
+ 3 | ,-> + 5 |
+ `---- diff --git a/packages/swc-magic/transform/tests/errors/no-child/output.js b/packages/swc-magic/transform/tests/errors/no-child/output.js new file mode 100644 index 000000000..7a44789ae --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/no-child/output.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
+ + + +
); diff --git a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/input.js b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/input.js new file mode 100644 index 000000000..87474a371 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/input.js @@ -0,0 +1,10 @@ +import css from 'styled-jsx/css' + +export default css.resolve` + .container { + background: #000; + color: white; + font-weight: 700; + height: 100px; + } +` \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-lightningcss.js b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-lightningcss.js new file mode 100644 index 000000000..f7b857a45 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-lightningcss.js @@ -0,0 +1,5 @@ +import _JSXStyle from "styled-jsx/style"; +export default { + styles: <_JSXStyle id={"71f03d42ea0ec6"}>{".container.jsx-71f03d42ea0ec6{color:#fff;background:#000;height:100px;font-weight:700}"}, + className: "jsx-71f03d42ea0ec6" +}; diff --git a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-lightningcss.stderr b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-lightningcss.stderr new file mode 100644 index 000000000..ad7185a0b --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-lightningcss.stderr @@ -0,0 +1,2 @@ + + x /some-project/src/some-file.ts uses `css.resolve`, but ends with `.ts`. The file extension needs to be `.tsx` so that the jsx injected by `css.resolve` will be transformed. diff --git a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-swc.js b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-swc.js new file mode 100644 index 000000000..6fbd823e7 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-swc.js @@ -0,0 +1,5 @@ +import _JSXStyle from "styled-jsx/style"; +export default { + styles: <_JSXStyle id={"71f03d42ea0ec6"}>{".container.jsx-71f03d42ea0ec6{background:#000;color:white;font-weight:700;height:100px}"}, + className: "jsx-71f03d42ea0ec6" +}; diff --git a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-swc.stderr b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-swc.stderr new file mode 100644 index 000000000..ad7185a0b --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-swc.stderr @@ -0,0 +1,2 @@ + + x /some-project/src/some-file.ts uses `css.resolve`, but ends with `.ts`. The file extension needs to be `.tsx` so that the jsx injected by `css.resolve` will be transformed. diff --git a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output.js b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output.js new file mode 100644 index 000000000..6fbd823e7 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output.js @@ -0,0 +1,5 @@ +import _JSXStyle from "styled-jsx/style"; +export default { + styles: <_JSXStyle id={"71f03d42ea0ec6"}>{".container.jsx-71f03d42ea0ec6{background:#000;color:white;font-weight:700;height:100px}"}, + className: "jsx-71f03d42ea0ec6" +}; diff --git a/packages/swc-magic/transform/tests/errors/two-children/input.js b/packages/swc-magic/transform/tests/errors/two-children/input.js new file mode 100644 index 000000000..a8edd5afd --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/two-children/input.js @@ -0,0 +1,8 @@ +export default () => ( +
+ +
+) diff --git a/packages/swc-magic/transform/tests/errors/two-children/output-lightningcss.js b/packages/swc-magic/transform/tests/errors/two-children/output-lightningcss.js new file mode 100644 index 000000000..b85c91048 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/two-children/output-lightningcss.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
+ + + +
); diff --git a/packages/swc-magic/transform/tests/errors/two-children/output-lightningcss.stderr b/packages/swc-magic/transform/tests/errors/two-children/output-lightningcss.stderr new file mode 100644 index 000000000..34cbb8c0c --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/two-children/output-lightningcss.stderr @@ -0,0 +1,11 @@ + + x Expected one child under JSX style tag, but got 2. + | Read more: https://nextjs.org/docs/messages/invalid-styled-jsx-children + ,-[input.js:2:1] + 2 |
+ 3 | ,-> + 7 |
+ `---- diff --git a/packages/swc-magic/transform/tests/errors/two-children/output-swc.js b/packages/swc-magic/transform/tests/errors/two-children/output-swc.js new file mode 100644 index 000000000..b85c91048 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/two-children/output-swc.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
+ + + +
); diff --git a/packages/swc-magic/transform/tests/errors/two-children/output-swc.stderr b/packages/swc-magic/transform/tests/errors/two-children/output-swc.stderr new file mode 100644 index 000000000..34cbb8c0c --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/two-children/output-swc.stderr @@ -0,0 +1,11 @@ + + x Expected one child under JSX style tag, but got 2. + | Read more: https://nextjs.org/docs/messages/invalid-styled-jsx-children + ,-[input.js:2:1] + 2 |
+ 3 | ,-> + 7 |
+ `---- diff --git a/packages/swc-magic/transform/tests/errors/two-children/output.js b/packages/swc-magic/transform/tests/errors/two-children/output.js new file mode 100644 index 000000000..b85c91048 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/two-children/output.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
+ + + +
); diff --git a/packages/swc-magic/transform/tests/errors/wrong-child-type/input.js b/packages/swc-magic/transform/tests/errors/wrong-child-type/input.js new file mode 100644 index 000000000..9e1613eb4 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/wrong-child-type/input.js @@ -0,0 +1,7 @@ +export default () => ( +
+ +
+) diff --git a/packages/swc-magic/transform/tests/errors/wrong-child-type/output-lightningcss.js b/packages/swc-magic/transform/tests/errors/wrong-child-type/output-lightningcss.js new file mode 100644 index 000000000..c5f8b2751 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/wrong-child-type/output-lightningcss.js @@ -0,0 +1,10 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
+ + + +
); diff --git a/packages/swc-magic/transform/tests/errors/wrong-child-type/output-lightningcss.stderr b/packages/swc-magic/transform/tests/errors/wrong-child-type/output-lightningcss.stderr new file mode 100644 index 000000000..d20dd2f4a --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/wrong-child-type/output-lightningcss.stderr @@ -0,0 +1,10 @@ + + x Expected a single child of type JSXExpressionContainer under JSX Style tag. + | Read more: https://nextjs.org/docs/messages/invalid-styled-jsx-children + ,-[input.js:2:1] + 2 |
+ 3 | ,-> + 6 |
+ `---- diff --git a/packages/swc-magic/transform/tests/errors/wrong-child-type/output-swc.js b/packages/swc-magic/transform/tests/errors/wrong-child-type/output-swc.js new file mode 100644 index 000000000..c5f8b2751 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/wrong-child-type/output-swc.js @@ -0,0 +1,10 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
+ + + +
); diff --git a/packages/swc-magic/transform/tests/errors/wrong-child-type/output-swc.stderr b/packages/swc-magic/transform/tests/errors/wrong-child-type/output-swc.stderr new file mode 100644 index 000000000..d20dd2f4a --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/wrong-child-type/output-swc.stderr @@ -0,0 +1,10 @@ + + x Expected a single child of type JSXExpressionContainer under JSX Style tag. + | Read more: https://nextjs.org/docs/messages/invalid-styled-jsx-children + ,-[input.js:2:1] + 2 |
+ 3 | ,-> + 6 |
+ `---- diff --git a/packages/swc-magic/transform/tests/errors/wrong-child-type/output.js b/packages/swc-magic/transform/tests/errors/wrong-child-type/output.js new file mode 100644 index 000000000..c5f8b2751 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/wrong-child-type/output.js @@ -0,0 +1,10 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
+ + + +
); diff --git a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/input.js b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/input.js new file mode 100644 index 000000000..332f22bf5 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/input.js @@ -0,0 +1,7 @@ +export default () => ( +
+ +
+) diff --git a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-lightningcss.js b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-lightningcss.js new file mode 100644 index 000000000..136ceac9c --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-lightningcss.js @@ -0,0 +1,10 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
+ + + +
); diff --git a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-lightningcss.stderr b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-lightningcss.stderr new file mode 100644 index 000000000..c89dc3c33 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-lightningcss.stderr @@ -0,0 +1,10 @@ + + x Expected a template literal, string or identifier inside the JSXExpressionContainer. + | Read more: https://nextjs.org/docs/messages/invalid-styled-jsx-children + ,-[input.js:2:1] + 2 |
+ 3 | ,-> + 6 |
+ `---- diff --git a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-swc.js b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-swc.js new file mode 100644 index 000000000..136ceac9c --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-swc.js @@ -0,0 +1,10 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
+ + + +
); diff --git a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-swc.stderr b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-swc.stderr new file mode 100644 index 000000000..c89dc3c33 --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-swc.stderr @@ -0,0 +1,10 @@ + + x Expected a template literal, string or identifier inside the JSXExpressionContainer. + | Read more: https://nextjs.org/docs/messages/invalid-styled-jsx-children + ,-[input.js:2:1] + 2 |
+ 3 | ,-> + 6 |
+ `---- diff --git a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output.js b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output.js new file mode 100644 index 000000000..136ceac9c --- /dev/null +++ b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output.js @@ -0,0 +1,10 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
+ + + +
); diff --git a/packages/swc-magic/transform/tests/fixture-swc-only/next-55679/input.js b/packages/swc-magic/transform/tests/fixture-swc-only/next-55679/input.js new file mode 100644 index 000000000..9506357f0 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture-swc-only/next-55679/input.js @@ -0,0 +1,17 @@ +import { AppProps } from "next/app"; + +const someVar = "--var-1"; + +export default function App({ Component, pageProps }) { + return ( + <> + + + + ); +} \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture-swc-only/next-55679/output.swc.js b/packages/swc-magic/transform/tests/fixture-swc-only/next-55679/output.swc.js new file mode 100644 index 000000000..9fd9e39c9 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture-swc-only/next-55679/output.swc.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +import { AppProps } from "next/app"; +const someVar = "--var-1"; +export default function App({ Component, pageProps }) { + return <> + + <_JSXStyle id={"e26e4619775cb212"}>{`:root{${someVar}:red;background-color:var(${someVar})}`} + + + + ; +} diff --git a/packages/swc-magic/transform/tests/fixture.rs b/packages/swc-magic/transform/tests/fixture.rs new file mode 100644 index 000000000..0c2b9d13c --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture.rs @@ -0,0 +1,137 @@ +use std::path::PathBuf; + +use styled_jsx::visitor::styled_jsx; +use swc_common::{chain, FileName, Mark, Span, DUMMY_SP}; +use swc_ecma_parser::{EsConfig, Syntax}; +use swc_ecma_transforms::resolver; +use swc_ecma_transforms_testing::{test_fixture, FixtureTestConfig}; +use testing::fixture; + +fn syntax() -> Syntax { + Syntax::Es(EsConfig { + jsx: true, + ..Default::default() + }) +} + +fn run(input: PathBuf, use_lightningcss: bool) { + let output = input.parent().unwrap().join(if use_lightningcss { + "output.lightningcss.js" + } else { + "output.swc.js" + }); + + test_fixture( + syntax(), + &|t| { + chain!( + resolver(Mark::new(), Mark::new(), false), + styled_jsx( + t.cm.clone(), + FileName::Real(PathBuf::from("/some-project/src/some-file.js")), + styled_jsx::visitor::Config { use_lightningcss } + ) + ) + }, + &input, + &output, + Default::default(), + ); + + test_fixture( + syntax(), + &|t| { + // `resolver` uses `Mark` which is stored in a thread-local storage (namely + // swc_common::GLOBALS), and this loop will make `Mark` to be different from the + // invocation above. + // + // 1000 is used because in future I (kdy1) may optimize logic of resolver. + for _ in 0..1000 { + let _mark = Mark::fresh(Mark::root()); + } + + chain!( + resolver(Mark::new(), Mark::new(), false), + styled_jsx( + t.cm.clone(), + FileName::Real(PathBuf::from("/some-project/src/some-file.js")), + styled_jsx::visitor::Config { use_lightningcss } + ) + ) + }, + &input, + &output, + Default::default(), + ); +} + +#[fixture("tests/fixture/**/input.js")] +fn styled_jsx_fixture_lightningcs(input: PathBuf) { + run(input, true); +} + +#[fixture("tests/fixture-swc-only/**/input.js")] +#[fixture("tests/fixture/**/input.js")] +fn styled_jsx_fixture_swc(input: PathBuf) { + run(input, false); +} + +pub struct DropSpan; +impl swc_ecma_visit::VisitMut for DropSpan { + fn visit_mut_span(&mut self, span: &mut Span) { + *span = DUMMY_SP + } +} + +#[fixture("tests/errors/**/input.js")] +fn styled_jsx_errors(input: PathBuf) { + let file_name = match input.to_str().unwrap().contains("ts-with-css-resolve") { + true => FileName::Real(PathBuf::from("/some-project/src/some-file.ts")), + false => FileName::Real(PathBuf::from("/some-project/src/some-file.js")), + }; + { + let output = input.parent().unwrap().join("output-swc.js"); + + test_fixture( + syntax(), + &|t| { + styled_jsx( + t.cm.clone(), + file_name.clone(), + styled_jsx::visitor::Config { + use_lightningcss: false, + }, + ) + }, + &input, + &output, + FixtureTestConfig { + allow_error: true, + ..Default::default() + }, + ); + } + + { + let output = input.parent().unwrap().join("output-lightningcss.js"); + + test_fixture( + syntax(), + &|t| { + styled_jsx( + t.cm.clone(), + file_name.clone(), + styled_jsx::visitor::Config { + use_lightningcss: true, + }, + ) + }, + &input, + &output, + FixtureTestConfig { + allow_error: true, + ..Default::default() + }, + ); + } +} diff --git a/packages/swc-magic/transform/tests/fixture/.expressions/input.js b/packages/swc-magic/transform/tests/fixture/.expressions/input.js new file mode 100644 index 000000000..d7c579f19 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/.expressions/input.js @@ -0,0 +1,90 @@ +const darken = c => c +const color = 'red' +const otherColor = 'green' +const mediumScreen = '680px' +const animationDuration = '200ms' +const animationName = 'my-cool-animation' +const obj = { display: 'block' } + +export default ({ display }) => ( +
+

test

+ + + + + // TODO: the next two should have the same hash + + + + + + + + + + // TODO: causes bad syntax + {/* */} +
+) diff --git a/packages/swc-magic/transform/tests/fixture/absent/input.js b/packages/swc-magic/transform/tests/fixture/absent/input.js new file mode 100644 index 000000000..bb4af7a54 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/absent/input.js @@ -0,0 +1,6 @@ +const a = () => ( +
+

hi

+ +
+) diff --git a/packages/swc-magic/transform/tests/fixture/absent/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/absent/output.lightningcss.js new file mode 100644 index 000000000..8509dbdde --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/absent/output.lightningcss.js @@ -0,0 +1,7 @@ +const a = ()=>
+ +

hi

+ + + +
; diff --git a/packages/swc-magic/transform/tests/fixture/absent/output.swc.js b/packages/swc-magic/transform/tests/fixture/absent/output.swc.js new file mode 100644 index 000000000..8509dbdde --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/absent/output.swc.js @@ -0,0 +1,7 @@ +const a = ()=>
+ +

hi

+ + + +
; diff --git a/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/input.js b/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/input.js new file mode 100644 index 000000000..47691510e --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/input.js @@ -0,0 +1,55 @@ +export default () => { + const Element = 'div' + return ( +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + +
+ ) +} diff --git a/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/output.lightningcss.js new file mode 100644 index 000000000..939e06090 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/output.lightningcss.js @@ -0,0 +1,112 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>{ + const Element = 'div'; + return
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ + + + + + + + <_JSXStyle id={"abb4c2202db1a207"}>{"div.jsx-abb4c2202db1a207{color:red}"} + +
; +}); diff --git a/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/output.swc.js b/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/output.swc.js new file mode 100644 index 000000000..939e06090 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/output.swc.js @@ -0,0 +1,112 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>{ + const Element = 'div'; + return
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ + + + + + + + <_JSXStyle id={"abb4c2202db1a207"}>{"div.jsx-abb4c2202db1a207{color:red}"} + +
; +}); diff --git a/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/input.js b/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/input.js new file mode 100644 index 000000000..1454a4c30 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/input.js @@ -0,0 +1,166 @@ +import styles from './styles' + +const styles2 = require('./styles2') + +// external only +export const Test1 = () => ( +
+

external only

+ + +
+) + +// external and static +export const Test2 = () => ( +
+

external and static

+ + +
+) + +// external and dynamic +export const Test3 = ({ color }) => ( +
+

external and dynamic

+ + +
+) + +// external, static and dynamic +export const Test4 = ({ color }) => ( +
+

external, static and dynamic

+ + + +
+) + +// static only +export const Test5 = () => ( +
+

static only

+ + +
+) + +// static and dynamic +export const Test6 = ({ color }) => ( +
+

static and dynamic

+ + +
+) + +// dynamic only +export const Test7 = ({ color }) => ( +
+

dynamic only

+ +
+) + +// dynamic with scoped compound variable +export const Test8 = ({ color }) => { + if (color) { + const innerProps = { color } + + return ( +
+

dynamic with scoped compound variable

+ +
+ ) + } +} + +// dynamic with compound variable +export const Test9 = ({ color }) => { + const innerProps = { color } + + return ( +
+

dynamic with compound variable

+ +
+ ) +} + +const foo = 'red' + +// dynamic with constant variable +export const Test10 = () => ( +
+

dynamic with constant variable

+ +
+) + +// dynamic with complex scope +export const Test11 = ({ color }) => { + const items = Array.from({ length: 5 }).map((item, i) => ( +
  • + + Item #{i + 1} +
    • + )) + + return
      {items}
    +} diff --git a/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/output.lightningcss.js new file mode 100644 index 000000000..65eaff32e --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/output.lightningcss.js @@ -0,0 +1,228 @@ +import _JSXStyle from "styled-jsx/style"; +import styles from './styles'; +const styles2 = require('./styles2'); +// external only +export const Test1 = ()=>
    + +

    external only

    + + <_JSXStyle id={styles.__hash}>{styles} + + <_JSXStyle id={styles2.__hash}>{styles2} + +
    ; +// external and static +export const Test2 = ()=>
    + +

    external and static

    + + <_JSXStyle id={"81a68341e430a972"}>{"p.jsx-81a68341e430a972{color:red}"} + + <_JSXStyle id={styles.__hash}>{styles} + +
    ; +// external and dynamic +export const Test3 = ({ color })=>
    + +

    external and dynamic

    + + <_JSXStyle id={"9c31b4e09db208f"} dynamic={[ + color + ]}>{`p.__jsx-style-dynamic-selector{color:${color}}`} + + <_JSXStyle id={styles.__hash}>{styles} + +
    ; +// external, static and dynamic +export const Test4 = ({ color })=>
    + +

    external, static and dynamic

    + + <_JSXStyle id={"ceba8c9ce34e3d0c"}>{"p.jsx-ceba8c9ce34e3d0c{display:inline-block}"} + + <_JSXStyle id={"1539cc167dc1aeca"} dynamic={[ + color + ]}>{`p.__jsx-style-dynamic-selector{color:${color}}`} + + <_JSXStyle id={styles.__hash}>{styles} + +
    ; +// static only +export const Test5 = ()=>
    + +

    static only

    + + <_JSXStyle id={"ceba8c9ce34e3d0c"}>{"p.jsx-df0159ebd3f9fb6f{display:inline-block}"} + + <_JSXStyle id={"81a68341e430a972"}>{"p.jsx-df0159ebd3f9fb6f{color:red}"} + +
    ; +// static and dynamic +export const Test6 = ({ color })=>
    + +

    static and dynamic

    + + <_JSXStyle id={"ceba8c9ce34e3d0c"}>{"p.jsx-ceba8c9ce34e3d0c{display:inline-block}"} + + <_JSXStyle id={"1539cc167dc1aeca"} dynamic={[ + color + ]}>{`p.__jsx-style-dynamic-selector{color:${color}}`} + +
    ; +// dynamic only +export const Test7 = ({ color })=>
    + +

    dynamic only

    + + <_JSXStyle id={"9c31b4e09db208f"} dynamic={[ + color + ]}>{`p.__jsx-style-dynamic-selector{color:${color}}`} + +
    ; +// dynamic with scoped compound variable +export const Test8 = ({ color })=>{ + if (color) { + const innerProps = { + color + }; + return
    + +

    dynamic with scoped compound variable

    + + <_JSXStyle id={"ce96f6fd3314e56c"} dynamic={[ + innerProps.color + ]}>{`p.__jsx-style-dynamic-selector{color:${innerProps.color}}`} + +
    ; + } +}; +// dynamic with compound variable +export const Test9 = ({ color })=>{ + const innerProps = { + color + }; + return
    + +

    dynamic with compound variable

    + + <_JSXStyle id={"af2545654d3cb2ee"} dynamic={[ + innerProps.color + ]}>{`p.__jsx-style-dynamic-selector{color:${innerProps.color}}`} + +
    ; +}; +const foo = 'red'; +// dynamic with constant variable +export const Test10 = ()=>
    + +

    dynamic with constant variable

    + + <_JSXStyle id={"cbdf2f44af4108bd"}>{`p.jsx-cbdf2f44af4108bd{color:${foo}}`} + +
    ; +// dynamic with complex scope +export const Test11 = ({ color })=>{ + const items = Array.from({ + length: 5 + }).map((item, i)=>
  • + + <_JSXStyle id={"4c662a3c1ebc397e"} dynamic={[ + color + ]}>{`.item.__jsx-style-dynamic-selector{color:${color}}`} + + Item #{i + 1} + +
    • ); + return
      {items}
    ; +}; diff --git a/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/output.swc.js b/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/output.swc.js new file mode 100644 index 000000000..65eaff32e --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/output.swc.js @@ -0,0 +1,228 @@ +import _JSXStyle from "styled-jsx/style"; +import styles from './styles'; +const styles2 = require('./styles2'); +// external only +export const Test1 = ()=>
    + +

    external only

    + + <_JSXStyle id={styles.__hash}>{styles} + + <_JSXStyle id={styles2.__hash}>{styles2} + +
    ; +// external and static +export const Test2 = ()=>
    + +

    external and static

    + + <_JSXStyle id={"81a68341e430a972"}>{"p.jsx-81a68341e430a972{color:red}"} + + <_JSXStyle id={styles.__hash}>{styles} + +
    ; +// external and dynamic +export const Test3 = ({ color })=>
    + +

    external and dynamic

    + + <_JSXStyle id={"9c31b4e09db208f"} dynamic={[ + color + ]}>{`p.__jsx-style-dynamic-selector{color:${color}}`} + + <_JSXStyle id={styles.__hash}>{styles} + +
    ; +// external, static and dynamic +export const Test4 = ({ color })=>
    + +

    external, static and dynamic

    + + <_JSXStyle id={"ceba8c9ce34e3d0c"}>{"p.jsx-ceba8c9ce34e3d0c{display:inline-block}"} + + <_JSXStyle id={"1539cc167dc1aeca"} dynamic={[ + color + ]}>{`p.__jsx-style-dynamic-selector{color:${color}}`} + + <_JSXStyle id={styles.__hash}>{styles} + +
    ; +// static only +export const Test5 = ()=>
    + +

    static only

    + + <_JSXStyle id={"ceba8c9ce34e3d0c"}>{"p.jsx-df0159ebd3f9fb6f{display:inline-block}"} + + <_JSXStyle id={"81a68341e430a972"}>{"p.jsx-df0159ebd3f9fb6f{color:red}"} + +
    ; +// static and dynamic +export const Test6 = ({ color })=>
    + +

    static and dynamic

    + + <_JSXStyle id={"ceba8c9ce34e3d0c"}>{"p.jsx-ceba8c9ce34e3d0c{display:inline-block}"} + + <_JSXStyle id={"1539cc167dc1aeca"} dynamic={[ + color + ]}>{`p.__jsx-style-dynamic-selector{color:${color}}`} + +
    ; +// dynamic only +export const Test7 = ({ color })=>
    + +

    dynamic only

    + + <_JSXStyle id={"9c31b4e09db208f"} dynamic={[ + color + ]}>{`p.__jsx-style-dynamic-selector{color:${color}}`} + +
    ; +// dynamic with scoped compound variable +export const Test8 = ({ color })=>{ + if (color) { + const innerProps = { + color + }; + return
    + +

    dynamic with scoped compound variable

    + + <_JSXStyle id={"ce96f6fd3314e56c"} dynamic={[ + innerProps.color + ]}>{`p.__jsx-style-dynamic-selector{color:${innerProps.color}}`} + +
    ; + } +}; +// dynamic with compound variable +export const Test9 = ({ color })=>{ + const innerProps = { + color + }; + return
    + +

    dynamic with compound variable

    + + <_JSXStyle id={"af2545654d3cb2ee"} dynamic={[ + innerProps.color + ]}>{`p.__jsx-style-dynamic-selector{color:${innerProps.color}}`} + +
    ; +}; +const foo = 'red'; +// dynamic with constant variable +export const Test10 = ()=>
    + +

    dynamic with constant variable

    + + <_JSXStyle id={"cbdf2f44af4108bd"}>{`p.jsx-cbdf2f44af4108bd{color:${foo}}`} + +
    ; +// dynamic with complex scope +export const Test11 = ({ color })=>{ + const items = Array.from({ + length: 5 + }).map((item, i)=>
  • + + <_JSXStyle id={"4c662a3c1ebc397e"} dynamic={[ + color + ]}>{`.item.__jsx-style-dynamic-selector{color:${color}}`} + + Item #{i + 1} + +
    • ); + return
      {items}
    ; +}; diff --git a/packages/swc-magic/transform/tests/fixture/class/input.js b/packages/swc-magic/transform/tests/fixture/class/input.js new file mode 100644 index 000000000..7488d661b --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/class/input.js @@ -0,0 +1,14 @@ +export default class { + render() { + return ( +
    +

    test

    + +
    + ) + } +} diff --git a/packages/swc-magic/transform/tests/fixture/class/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/class/output.lightningcss.js new file mode 100644 index 000000000..cc8252d40 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/class/output.lightningcss.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"b2b86d63f35d25ee"}>{"p.jsx-b2b86d63f35d25ee{color:red}"} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/class/output.swc.js b/packages/swc-magic/transform/tests/fixture/class/output.swc.js new file mode 100644 index 000000000..cc8252d40 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/class/output.swc.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"b2b86d63f35d25ee"}>{"p.jsx-b2b86d63f35d25ee{color:red}"} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/comments/input.js b/packages/swc-magic/transform/tests/fixture/comments/input.js new file mode 100644 index 000000000..0ba7a1877 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/comments/input.js @@ -0,0 +1,18 @@ +export default class { + render() { + return ( +
    +

    test

    + +
    + ) + } +} diff --git a/packages/swc-magic/transform/tests/fixture/comments/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/comments/output.lightningcss.js new file mode 100644 index 000000000..7e87f083a --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/comments/output.lightningcss.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"1952086b0a5ae64c"}>{"p.jsx-1952086b0a5ae64c{color:red}"} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/comments/output.swc.js b/packages/swc-magic/transform/tests/fixture/comments/output.swc.js new file mode 100644 index 000000000..7e87f083a --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/comments/output.swc.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"1952086b0a5ae64c"}>{"p.jsx-1952086b0a5ae64c{color:red}"} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/component-attribute/input.js b/packages/swc-magic/transform/tests/fixture/component-attribute/input.js new file mode 100644 index 000000000..7531db885 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/component-attribute/input.js @@ -0,0 +1,11 @@ +const Test = () => ( +
    + test + + +
    +) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/component-attribute/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/component-attribute/output.lightningcss.js new file mode 100644 index 000000000..70415dd66 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/component-attribute/output.lightningcss.js @@ -0,0 +1,10 @@ +import _JSXStyle from "styled-jsx/style"; +const Test = ()=>
    + + test + + + + <_JSXStyle id={"a9535d7d5f32c3c4"}>{"span.jsx-a9535d7d5f32c3c4{color:red}"} + +
    ; diff --git a/packages/swc-magic/transform/tests/fixture/component-attribute/output.swc.js b/packages/swc-magic/transform/tests/fixture/component-attribute/output.swc.js new file mode 100644 index 000000000..70415dd66 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/component-attribute/output.swc.js @@ -0,0 +1,10 @@ +import _JSXStyle from "styled-jsx/style"; +const Test = ()=>
    + + test + + + + <_JSXStyle id={"a9535d7d5f32c3c4"}>{"span.jsx-a9535d7d5f32c3c4{color:red}"} + +
    ; diff --git a/packages/swc-magic/transform/tests/fixture/conflicts/input.js b/packages/swc-magic/transform/tests/fixture/conflicts/input.js new file mode 100644 index 000000000..ba7ab50bf --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/conflicts/input.js @@ -0,0 +1,16 @@ + +// TODO + +// export const _JSXStyle = '_JSXStyle-literal' +// export default function() { +// return ( +//
    +//

    test

    +// +//
    +// ) +// } diff --git a/packages/swc-magic/transform/tests/fixture/conflicts/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/conflicts/output.lightningcss.js new file mode 100644 index 000000000..874cf34f5 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/conflicts/output.lightningcss.js @@ -0,0 +1,14 @@ +// TODO +// export const _JSXStyle = '_JSXStyle-literal' +// export default function() { +// return ( +//
    +//

    test

    +// +//
    +// ) +// } diff --git a/packages/swc-magic/transform/tests/fixture/conflicts/output.swc.js b/packages/swc-magic/transform/tests/fixture/conflicts/output.swc.js new file mode 100644 index 000000000..874cf34f5 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/conflicts/output.swc.js @@ -0,0 +1,14 @@ +// TODO +// export const _JSXStyle = '_JSXStyle-literal' +// export default function() { +// return ( +//
    +//

    test

    +// +//
    +// ) +// } diff --git a/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/input.js b/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/input.js new file mode 100644 index 000000000..a2e54d09b --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/input.js @@ -0,0 +1,18 @@ +function NavigationItem({ + active, + className, +}) { + return ( + + + + ); +} + +export default NavigationItem; \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/output.lightningcss.js new file mode 100644 index 000000000..f4a8ab98a --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/output.lightningcss.js @@ -0,0 +1,11 @@ +import _JSXStyle from "styled-jsx/style"; +function NavigationItem({ active, className }) { + return + + <_JSXStyle id={"2342aae4628612c6"}>{'.navigation-item.jsx-2342aae4628612c6 a:after{content:attr(data-text);content:attr(data-text)/""}'} + + ; +} +export default NavigationItem; diff --git a/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/output.swc.js b/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/output.swc.js new file mode 100644 index 000000000..89eb97f7b --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/output.swc.js @@ -0,0 +1,11 @@ +import _JSXStyle from "styled-jsx/style"; +function NavigationItem({ active, className }) { + return + + <_JSXStyle id={"2342aae4628612c6"}>{'.navigation-item.jsx-2342aae4628612c6 a::after{content:attr(data-text);content:attr(data-text)/""}'} + + ; +} +export default NavigationItem; diff --git a/packages/swc-magic/transform/tests/fixture/css-tag-same-file/input.js b/packages/swc-magic/transform/tests/fixture/css-tag-same-file/input.js new file mode 100644 index 000000000..a455a9124 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/css-tag-same-file/input.js @@ -0,0 +1,25 @@ +import css from 'styled-jsx/css' + +export default ({ children }) => ( +
    +

    {children}

    + +
    +) + +const styles = css` + p { + color: red; + } +` + +class Test extends React.Component { + render() { + return ( +
    +

    {this.props.children}

    + +
    + ) + } +} diff --git a/packages/swc-magic/transform/tests/fixture/css-tag-same-file/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/css-tag-same-file/output.lightningcss.js new file mode 100644 index 000000000..f97269274 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/css-tag-same-file/output.lightningcss.js @@ -0,0 +1,21 @@ +import _JSXStyle from "styled-jsx/style"; +export default (({ children })=>
    + +

    {children}

    + + <_JSXStyle id={styles.__hash}>{styles} + +
    ); +const styles = new String("p.jsx-556239d258b6d66a{color:red}"); +styles.__hash = "556239d258b6d66a"; +class Test extends React.Component { + render() { + return
    + +

    {this.props.children}

    + + <_JSXStyle id={styles.__hash}>{styles} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/css-tag-same-file/output.swc.js b/packages/swc-magic/transform/tests/fixture/css-tag-same-file/output.swc.js new file mode 100644 index 000000000..f97269274 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/css-tag-same-file/output.swc.js @@ -0,0 +1,21 @@ +import _JSXStyle from "styled-jsx/style"; +export default (({ children })=>
    + +

    {children}

    + + <_JSXStyle id={styles.__hash}>{styles} + +
    ); +const styles = new String("p.jsx-556239d258b6d66a{color:red}"); +styles.__hash = "556239d258b6d66a"; +class Test extends React.Component { + render() { + return
    + +

    {this.props.children}

    + + <_JSXStyle id={styles.__hash}>{styles} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/different-jsx-ids/input.js b/packages/swc-magic/transform/tests/fixture/different-jsx-ids/input.js new file mode 100644 index 000000000..d5769d3e9 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/different-jsx-ids/input.js @@ -0,0 +1,23 @@ +const color = 'red' +const otherColor = 'green' + +const A = () => ( +
    +

    test

    + +
    +) + +const B = () => ( +
    +

    test

    + +
    +) + +export default () => ( + +) diff --git a/packages/swc-magic/transform/tests/fixture/different-jsx-ids/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/different-jsx-ids/output.lightningcss.js new file mode 100644 index 000000000..21baa2130 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/different-jsx-ids/output.lightningcss.js @@ -0,0 +1,24 @@ +import _JSXStyle from "styled-jsx/style"; +const color = 'red'; +const otherColor = 'green'; +const A = ()=>
    + +

    test

    + + <_JSXStyle id={"3f087c835a50190d"}>{`p.jsx-3f087c835a50190d{color:${color}}`} + +
    ; +const B = ()=>
    + +

    test

    + + <_JSXStyle id={"d051a1c8140076ed"}>{`p.jsx-d051a1c8140076ed{color:${otherColor}}`} + +
    ; +export default (()=>    ); diff --git a/packages/swc-magic/transform/tests/fixture/different-jsx-ids/output.swc.js b/packages/swc-magic/transform/tests/fixture/different-jsx-ids/output.swc.js new file mode 100644 index 000000000..21baa2130 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/different-jsx-ids/output.swc.js @@ -0,0 +1,24 @@ +import _JSXStyle from "styled-jsx/style"; +const color = 'red'; +const otherColor = 'green'; +const A = ()=>
    + +

    test

    + + <_JSXStyle id={"3f087c835a50190d"}>{`p.jsx-3f087c835a50190d{color:${color}}`} + +
    ; +const B = ()=>
    + +

    test

    + + <_JSXStyle id={"d051a1c8140076ed"}>{`p.jsx-d051a1c8140076ed{color:${otherColor}}`} + +
    ; +export default (()=>    ); diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element-class/input.js b/packages/swc-magic/transform/tests/fixture/dynamic-element-class/input.js new file mode 100644 index 000000000..5b8abce8c --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/dynamic-element-class/input.js @@ -0,0 +1,32 @@ +export default class { + render() { + const Element = 'div' + + return ( + +

    dynamic element

    + +     + ) + } +} + +const Element2 = 'div' +export const Test2 = class { + render() { + return ( + +

    dynamic element

    + +     + ) + } +} diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element-class/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/dynamic-element-class/output.lightningcss.js new file mode 100644 index 000000000..310fcb426 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/dynamic-element-class/output.lightningcss.js @@ -0,0 +1,25 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + const Element = 'div'; + return + +

    dynamic element

    + + <_JSXStyle id={"f825b24bbab5b83b"}>{".root.jsx-f825b24bbab5b83b{background:red}"} + +     ; + } +} +const Element2 = 'div'; +export const Test2 = class { + render() { + return + +

    dynamic element

    + + <_JSXStyle id={"f825b24bbab5b83b"}>{".root.jsx-f825b24bbab5b83b{background:red}"} + +     ; + } +}; diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element-class/output.swc.js b/packages/swc-magic/transform/tests/fixture/dynamic-element-class/output.swc.js new file mode 100644 index 000000000..310fcb426 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/dynamic-element-class/output.swc.js @@ -0,0 +1,25 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + const Element = 'div'; + return + +

    dynamic element

    + + <_JSXStyle id={"f825b24bbab5b83b"}>{".root.jsx-f825b24bbab5b83b{background:red}"} + +     ; + } +} +const Element2 = 'div'; +export const Test2 = class { + render() { + return + +

    dynamic element

    + + <_JSXStyle id={"f825b24bbab5b83b"}>{".root.jsx-f825b24bbab5b83b{background:red}"} + +     ; + } +}; diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element-external/input.js b/packages/swc-magic/transform/tests/fixture/dynamic-element-external/input.js new file mode 100644 index 000000000..128078563 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/dynamic-element-external/input.js @@ -0,0 +1,12 @@ +import styles from './styles2' + +export default ({ level = 1 }) => { + const Element = `h${level}` + + return ( + +

    dynamic element

    + +     + ) +} diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element-external/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/dynamic-element-external/output.lightningcss.js new file mode 100644 index 000000000..a08ed7ac0 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/dynamic-element-external/output.lightningcss.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +import styles from './styles2'; +export default (({ level = 1 })=>{ + const Element = `h${level}`; + return + +

    dynamic element

    + + <_JSXStyle id={styles.__hash}>{styles} + +     ; +}); diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element-external/output.swc.js b/packages/swc-magic/transform/tests/fixture/dynamic-element-external/output.swc.js new file mode 100644 index 000000000..a08ed7ac0 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/dynamic-element-external/output.swc.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +import styles from './styles2'; +export default (({ level = 1 })=>{ + const Element = `h${level}`; + return + +

    dynamic element

    + + <_JSXStyle id={styles.__hash}>{styles} + +     ; +}); diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element/input.js b/packages/swc-magic/transform/tests/fixture/dynamic-element/input.js new file mode 100644 index 000000000..17854bdd2 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/dynamic-element/input.js @@ -0,0 +1,56 @@ +export default ({ level = 1 }) => { + const Element = `h${level}` + + return ( + +

    dynamic element

    + +     + ) +} + +export const TestLowerCase = ({ level = 1 }) => { + const element = `h${level}` + + return ( + +

    dynamic element

    + +     + ) +} + +const Element2 = 'div' +export const Test2 = () => { + return ( + +

    dynamic element

    + +     + ) +} + +export const Test3 = ({Component = 'div'}) => { + return ( + +

    dynamic element

    + +     + ); +} diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/dynamic-element/output.lightningcss.js new file mode 100644 index 000000000..8f7cd93dc --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/dynamic-element/output.lightningcss.js @@ -0,0 +1,40 @@ +import _JSXStyle from "styled-jsx/style"; +export default (({ level = 1 })=>{ + const Element = `h${level}`; + return + +

    dynamic element

    + + <_JSXStyle id={"fca64cc3f069b519"}>{".root.jsx-fca64cc3f069b519{background:red}"} + +     ; +}); +export const TestLowerCase = ({ level = 1 })=>{ + const element = `h${level}`; + return + +

    dynamic element

    + + <_JSXStyle id={"fca64cc3f069b519"}>{".root.jsx-fca64cc3f069b519{background:red}"} + +     ; +}; +const Element2 = 'div'; +export const Test2 = ()=>{ + return + +

    dynamic element

    + + <_JSXStyle id={"fca64cc3f069b519"}>{".root.jsx-fca64cc3f069b519{background:red}"} + +     ; +}; +export const Test3 = ({ Component = 'div' })=>{ + return + +

    dynamic element

    + + <_JSXStyle id={"f825b24bbab5b83b"}>{".root.jsx-f825b24bbab5b83b{background:red}"} + +     ; +}; diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element/output.swc.js b/packages/swc-magic/transform/tests/fixture/dynamic-element/output.swc.js new file mode 100644 index 000000000..8f7cd93dc --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/dynamic-element/output.swc.js @@ -0,0 +1,40 @@ +import _JSXStyle from "styled-jsx/style"; +export default (({ level = 1 })=>{ + const Element = `h${level}`; + return + +

    dynamic element

    + + <_JSXStyle id={"fca64cc3f069b519"}>{".root.jsx-fca64cc3f069b519{background:red}"} + +     ; +}); +export const TestLowerCase = ({ level = 1 })=>{ + const element = `h${level}`; + return + +

    dynamic element

    + + <_JSXStyle id={"fca64cc3f069b519"}>{".root.jsx-fca64cc3f069b519{background:red}"} + +     ; +}; +const Element2 = 'div'; +export const Test2 = ()=>{ + return + +

    dynamic element

    + + <_JSXStyle id={"fca64cc3f069b519"}>{".root.jsx-fca64cc3f069b519{background:red}"} + +     ; +}; +export const Test3 = ({ Component = 'div' })=>{ + return + +

    dynamic element

    + + <_JSXStyle id={"f825b24bbab5b83b"}>{".root.jsx-f825b24bbab5b83b{background:red}"} + +     ; +}; diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/input.js b/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/input.js new file mode 100644 index 000000000..1a3c67dc6 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/input.js @@ -0,0 +1,41 @@ +// TODO +// import React, { Component } from 'react' + +// export default class Index extends Component { +// static getInitialProps() { +// return { color: 'aquamarine' } +// } + +// render() { +// return ( +//
    +// {[1, 2].map(idx => ( +//
    +// {[3, 4].map(idx2 => ( +//
    {this.props.color}
    +// ))} +//
    +// ))} +// {[1, 2].map(idx => ( +//
    +//
    +// {this.props.color} +//
    +// +//
    +//
    {this.props.color} hello there
    +//
    +//     +//
    +//
    +//
    +// ))} +// +//
    +// ) +// } +// } diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/output.lightningcss.js new file mode 100644 index 000000000..11fc44ff6 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/output.lightningcss.js @@ -0,0 +1,39 @@ +// TODO +// import React, { Component } from 'react' +// export default class Index extends Component { +// static getInitialProps() { +// return { color: 'aquamarine' } +// } +// render() { +// return ( +//
    +// {[1, 2].map(idx => ( +//
    +// {[3, 4].map(idx2 => ( +//
    {this.props.color}
    +// ))} +//
    +// ))} +// {[1, 2].map(idx => ( +//
    +//
    +// {this.props.color} +//
    +// +//
    +//
    {this.props.color} hello there
    +//
    +//     +//
    +//
    +//
    +// ))} +// +//
    +// ) +// } +// } diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/output.swc.js b/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/output.swc.js new file mode 100644 index 000000000..11fc44ff6 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/output.swc.js @@ -0,0 +1,39 @@ +// TODO +// import React, { Component } from 'react' +// export default class Index extends Component { +// static getInitialProps() { +// return { color: 'aquamarine' } +// } +// render() { +// return ( +//
    +// {[1, 2].map(idx => ( +//
    +// {[3, 4].map(idx2 => ( +//
    {this.props.color}
    +// ))} +//
    +// ))} +// {[1, 2].map(idx => ( +//
    +//
    +// {this.props.color} +//
    +// +//
    +//
    {this.props.color} hello there
    +//
    +//     +//
    +//
    +//
    +// ))} +// +//
    +// ) +// } +// } diff --git a/packages/swc-magic/transform/tests/fixture/exported-jsx-style/input.js b/packages/swc-magic/transform/tests/fixture/exported-jsx-style/input.js new file mode 100644 index 000000000..119d097f6 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/exported-jsx-style/input.js @@ -0,0 +1 @@ +// module.exports = () =>

    \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/exported-jsx-style/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/exported-jsx-style/output.lightningcss.js new file mode 100644 index 000000000..79908ec11 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/exported-jsx-style/output.lightningcss.js @@ -0,0 +1 @@ +// module.exports = () =>

    diff --git a/packages/swc-magic/transform/tests/fixture/exported-jsx-style/output.swc.js b/packages/swc-magic/transform/tests/fixture/exported-jsx-style/output.swc.js new file mode 100644 index 000000000..79908ec11 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/exported-jsx-style/output.swc.js @@ -0,0 +1 @@ +// module.exports = () =>

    diff --git a/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/input.js b/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/input.js new file mode 100644 index 000000000..5539580cf --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/input.js @@ -0,0 +1 @@ +// module.exports = () =>

    \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/output.lightningcss.js new file mode 100644 index 000000000..42b1f9876 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/output.lightningcss.js @@ -0,0 +1 @@ +// module.exports = () =>

    diff --git a/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/output.swc.js b/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/output.swc.js new file mode 100644 index 000000000..42b1f9876 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/output.swc.js @@ -0,0 +1 @@ +// module.exports = () =>

    diff --git a/packages/swc-magic/transform/tests/fixture/external-nested-scope/input.js b/packages/swc-magic/transform/tests/fixture/external-nested-scope/input.js new file mode 100644 index 000000000..a6f92b0c0 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/external-nested-scope/input.js @@ -0,0 +1,5 @@ +import css from 'styled-jsx/css' + +function test() { + css.resolve`div { color: red }` +} \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/external-nested-scope/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/external-nested-scope/output.lightningcss.js new file mode 100644 index 000000000..ec8881570 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/external-nested-scope/output.lightningcss.js @@ -0,0 +1,7 @@ +import _JSXStyle from "styled-jsx/style"; +function test() { + ({ + styles: <_JSXStyle id={"abb4c2202db1a207"}>{"div.jsx-abb4c2202db1a207{color:red}"}, + className: "jsx-abb4c2202db1a207" + }); +} diff --git a/packages/swc-magic/transform/tests/fixture/external-nested-scope/output.swc.js b/packages/swc-magic/transform/tests/fixture/external-nested-scope/output.swc.js new file mode 100644 index 000000000..ec8881570 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/external-nested-scope/output.swc.js @@ -0,0 +1,7 @@ +import _JSXStyle from "styled-jsx/style"; +function test() { + ({ + styles: <_JSXStyle id={"abb4c2202db1a207"}>{"div.jsx-abb4c2202db1a207{color:red}"}, + className: "jsx-abb4c2202db1a207" + }); +} diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/input.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/input.js new file mode 100644 index 000000000..67fdae9bb --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/input.js @@ -0,0 +1,19 @@ +import styles, { foo as styles3 } from './styles' + +const styles2 = require('./styles2') + +export default () => +
    +

    test

    +
    woot
    +

    woot

    + + + +
    diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/output.lightningcss.js new file mode 100644 index 000000000..23efb993d --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/output.lightningcss.js @@ -0,0 +1,18 @@ +import _JSXStyle from "styled-jsx/style"; +import styles, { foo as styles3 } from './styles'; +const styles2 = require('./styles2'); +export default (()=>
    + +

    test

    + +
    woot
    + +

    woot

    + + <_JSXStyle id={styles2.__hash}>{styles2} + + <_JSXStyle id={styles3.__hash}>{styles3} + + <_JSXStyle id={styles.__hash}>{styles} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/output.swc.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/output.swc.js new file mode 100644 index 000000000..23efb993d --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/output.swc.js @@ -0,0 +1,18 @@ +import _JSXStyle from "styled-jsx/style"; +import styles, { foo as styles3 } from './styles'; +const styles2 = require('./styles2'); +export default (()=>
    + +

    test

    + +
    woot
    + +

    woot

    + + <_JSXStyle id={styles2.__hash}>{styles2} + + <_JSXStyle id={styles3.__hash}>{styles3} + + <_JSXStyle id={styles.__hash}>{styles} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/input.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/input.js new file mode 100644 index 000000000..89c6b449a --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/input.js @@ -0,0 +1,9 @@ +import styles from './styles' + +export default () => +
    +

    test

    + +
    diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/output.lightningcss.js new file mode 100644 index 000000000..f8b2e5133 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/output.lightningcss.js @@ -0,0 +1,9 @@ +import _JSXStyle from "styled-jsx/style"; +import styles from './styles'; +export default (()=>
    + +

    test

    + + <_JSXStyle id={styles.__hash}>{styles} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/output.swc.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/output.swc.js new file mode 100644 index 000000000..f8b2e5133 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/output.swc.js @@ -0,0 +1,9 @@ +import _JSXStyle from "styled-jsx/style"; +import styles from './styles'; +export default (()=>
    + +

    test

    + + <_JSXStyle id={styles.__hash}>{styles} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet/input.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet/input.js new file mode 100644 index 000000000..4b820d12c --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/external-stylesheet/input.js @@ -0,0 +1,41 @@ +import styles from './styles' +const styles2 = require('./styles2') +import { foo as styles3 } from './styles' + +export default () => ( +
    +

    test

    +

    woot

    + + +
    woot
    + + +
    +) + +export const Test = () => ( +
    +

    test

    +

    woot

    + +
    woot
    + +
    +) diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet/output.lightningcss.js new file mode 100644 index 000000000..c22231857 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/external-stylesheet/output.lightningcss.js @@ -0,0 +1,34 @@ +import _JSXStyle from "styled-jsx/style"; +import styles from './styles'; +const styles2 = require('./styles2'); +import { foo as styles3 } from './styles'; +export default (()=>
    + +

    test

    + +

    woot

    + + <_JSXStyle id={styles2.__hash}>{styles2} + + <_JSXStyle id={styles3.__hash}>{styles3} + +
    woot
    + + <_JSXStyle id={"bee92b62eadf8a14"}>{"p.jsx-bee92b62eadf8a14{color:red}div.jsx-bee92b62eadf8a14{color:green}"} + + <_JSXStyle id={styles.__hash}>{styles} + +
    ); +export const Test = ()=>
    + +

    test

    + +

    woot

    + + <_JSXStyle id={styles3.__hash}>{styles3} + +
    woot
    + + <_JSXStyle id={"bee92b62eadf8a14"}>{"p.jsx-bee92b62eadf8a14{color:red}div.jsx-bee92b62eadf8a14{color:green}"} + +
    ; diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet/output.swc.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet/output.swc.js new file mode 100644 index 000000000..c22231857 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/external-stylesheet/output.swc.js @@ -0,0 +1,34 @@ +import _JSXStyle from "styled-jsx/style"; +import styles from './styles'; +const styles2 = require('./styles2'); +import { foo as styles3 } from './styles'; +export default (()=>
    + +

    test

    + +

    woot

    + + <_JSXStyle id={styles2.__hash}>{styles2} + + <_JSXStyle id={styles3.__hash}>{styles3} + +
    woot
    + + <_JSXStyle id={"bee92b62eadf8a14"}>{"p.jsx-bee92b62eadf8a14{color:red}div.jsx-bee92b62eadf8a14{color:green}"} + + <_JSXStyle id={styles.__hash}>{styles} + +
    ); +export const Test = ()=>
    + +

    test

    + +

    woot

    + + <_JSXStyle id={styles3.__hash}>{styles3} + +
    woot
    + + <_JSXStyle id={"bee92b62eadf8a14"}>{"p.jsx-bee92b62eadf8a14{color:red}div.jsx-bee92b62eadf8a14{color:green}"} + +
    ; diff --git a/packages/swc-magic/transform/tests/fixture/fragment/input.js b/packages/swc-magic/transform/tests/fixture/fragment/input.js new file mode 100644 index 000000000..fc5a60bf5 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/fragment/input.js @@ -0,0 +1,51 @@ +import React from 'react' + +export default () => ( + <> +

    Testing!!!

    +

    Bar

    + <> + + +

    hello

    + <> +

    foo

    +

    bar

    + +

    world

    +     + + + +) + +function Component1() { + return ( + <> +
    test
    + + ) +} + +function Component2() { + return ( +
    + +
    + ) +} diff --git a/packages/swc-magic/transform/tests/fixture/fragment/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/fragment/output.lightningcss.js new file mode 100644 index 000000000..26acf4bfa --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/fragment/output.lightningcss.js @@ -0,0 +1,47 @@ +import _JSXStyle from "styled-jsx/style"; +import React from 'react'; +export default (()=><> + +

    Testing!!!

    + +

    Bar

    + + <> + + + + + +

    hello

    + + <> + +

    foo

    + +

    bar

    + + + +

    world

    + +     + + + + <_JSXStyle id={"6dd5f97e085c0297"}>{"p.jsx-6dd5f97e085c0297{color:#0ff}.foo.jsx-6dd5f97e085c0297{color:#ff69b4;font-size:18px}#head.jsx-6dd5f97e085c0297{text-decoration:underline}"} + + ); +function Component1() { + return <> + +
    test
    + + ; +} +function Component2() { + return
    + + <_JSXStyle id={"678f41ca6d3b294b"}>{"div.jsx-678f41ca6d3b294b{color:red}"} + +
    ; +} diff --git a/packages/swc-magic/transform/tests/fixture/fragment/output.swc.js b/packages/swc-magic/transform/tests/fixture/fragment/output.swc.js new file mode 100644 index 000000000..b71a78ed7 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/fragment/output.swc.js @@ -0,0 +1,47 @@ +import _JSXStyle from "styled-jsx/style"; +import React from 'react'; +export default (()=><> + +

    Testing!!!

    + +

    Bar

    + + <> + + + + + +

    hello

    + + <> + +

    foo

    + +

    bar

    + + + +

    world

    + +     + + + + <_JSXStyle id={"6dd5f97e085c0297"}>{"p.jsx-6dd5f97e085c0297{color:cyan}.foo.jsx-6dd5f97e085c0297{font-size:18px;color:hotpink}#head.jsx-6dd5f97e085c0297{text-decoration:underline}"} + + ); +function Component1() { + return <> + +
    test
    + + ; +} +function Component2() { + return
    + + <_JSXStyle id={"678f41ca6d3b294b"}>{"div.jsx-678f41ca6d3b294b{color:red}"} + +
    ; +} diff --git a/packages/swc-magic/transform/tests/fixture/global-child-selector/input.js b/packages/swc-magic/transform/tests/fixture/global-child-selector/input.js new file mode 100644 index 000000000..e3cdeef05 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/global-child-selector/input.js @@ -0,0 +1,10 @@ +const Test = () => ( +
    + test + +
    +) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/global-child-selector/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/global-child-selector/output.lightningcss.js new file mode 100644 index 000000000..521e38dde --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/global-child-selector/output.lightningcss.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +const Test = ()=>
    + + test + + <_JSXStyle id={"5a206f122d1cb32e"}>{"div.jsx-5a206f122d1cb32e>span{color:red}"} + +
    ; diff --git a/packages/swc-magic/transform/tests/fixture/global-child-selector/output.swc.js b/packages/swc-magic/transform/tests/fixture/global-child-selector/output.swc.js new file mode 100644 index 000000000..521e38dde --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/global-child-selector/output.swc.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +const Test = ()=>
    + + test + + <_JSXStyle id={"5a206f122d1cb32e"}>{"div.jsx-5a206f122d1cb32e>span{color:red}"} + +
    ; diff --git a/packages/swc-magic/transform/tests/fixture/global-redundant/input.js b/packages/swc-magic/transform/tests/fixture/global-redundant/input.js new file mode 100644 index 000000000..645ca01c3 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/global-redundant/input.js @@ -0,0 +1,12 @@ +export default function IndexPage() { + return ( +
    + should be blue. + +
    + ); +} diff --git a/packages/swc-magic/transform/tests/fixture/global-redundant/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/global-redundant/output.lightningcss.js new file mode 100644 index 000000000..5bd951fca --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/global-redundant/output.lightningcss.js @@ -0,0 +1,10 @@ +import _JSXStyle from "styled-jsx/style"; +export default function IndexPage() { + return
    + + should be blue. + + <_JSXStyle id={"b6abd0684ba81871"}>{"div{color:#00f}"} + +
    ; +} diff --git a/packages/swc-magic/transform/tests/fixture/global-redundant/output.swc.js b/packages/swc-magic/transform/tests/fixture/global-redundant/output.swc.js new file mode 100644 index 000000000..82762e584 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/global-redundant/output.swc.js @@ -0,0 +1,10 @@ +import _JSXStyle from "styled-jsx/style"; +export default function IndexPage() { + return
    + + should be blue. + + <_JSXStyle id={"b6abd0684ba81871"}>{"div{color:blue}"} + +
    ; +} diff --git a/packages/swc-magic/transform/tests/fixture/global/input.js b/packages/swc-magic/transform/tests/fixture/global/input.js new file mode 100644 index 000000000..75178bdb7 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/global/input.js @@ -0,0 +1,22 @@ +const Test = () => ( +
    + +
    +) + +const Test2 = () => diff --git a/packages/swc-magic/transform/tests/fixture/global/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/global/output.lightningcss.js new file mode 100644 index 000000000..9950de54d --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/global/output.lightningcss.js @@ -0,0 +1,7 @@ +import _JSXStyle from "styled-jsx/style"; +const Test = ()=>
    + + <_JSXStyle id={"d47d6adadf14e957"}>{"body{color:red}:hover{color:red;animation:1s ease-out foo;display:flex}div a{display:none}[data-test]>div{color:red}"} + +
    ; +const Test2 = ()=><_JSXStyle id={"94239b6d6b42c9b5"}>{"p{color:red}"}; diff --git a/packages/swc-magic/transform/tests/fixture/global/output.swc.js b/packages/swc-magic/transform/tests/fixture/global/output.swc.js new file mode 100644 index 000000000..0e54f9efe --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/global/output.swc.js @@ -0,0 +1,7 @@ +import _JSXStyle from "styled-jsx/style"; +const Test = ()=>
    + + <_JSXStyle id={"d47d6adadf14e957"}>{"body{color:red}:hover{color:red;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-animation:foo 1s ease-out;-moz-animation:foo 1s ease-out;-o-animation:foo 1s ease-out;animation:foo 1s ease-out}div a{display:none}[data-test]>div{color:red}"} + +
    ; +const Test2 = ()=><_JSXStyle id={"94239b6d6b42c9b5"}>{"p{color:red}"}; diff --git a/packages/swc-magic/transform/tests/fixture/issue-30480/input.js b/packages/swc-magic/transform/tests/fixture/issue-30480/input.js new file mode 100644 index 000000000..bad0d6567 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/issue-30480/input.js @@ -0,0 +1,11 @@ + + +export default ({ breakPoint }) => ( +
    + +
    +) diff --git a/packages/swc-magic/transform/tests/fixture/issue-30480/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/issue-30480/output.lightningcss.js new file mode 100644 index 000000000..a99b5f258 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/issue-30480/output.lightningcss.js @@ -0,0 +1,15 @@ +import _JSXStyle from "styled-jsx/style"; +export default (({ breakPoint })=>
    + + <_JSXStyle id={"8ab1d380e1497d05"} dynamic={[ + breakPoint + ]}>{`@media (${breakPoint}){.test.__jsx-style-dynamic-selector{margin-bottom:1em}}`} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/issue-30480/output.swc.js b/packages/swc-magic/transform/tests/fixture/issue-30480/output.swc.js new file mode 100644 index 000000000..5d9da2f1b --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/issue-30480/output.swc.js @@ -0,0 +1,15 @@ +import _JSXStyle from "styled-jsx/style"; +export default (({ breakPoint })=>
    + + <_JSXStyle id={"8ab1d380e1497d05"} dynamic={[ + breakPoint + ]}>{`@media(${breakPoint}){.test.__jsx-style-dynamic-selector{margin-bottom:1em}}`} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/issue-30570/input.js b/packages/swc-magic/transform/tests/fixture/issue-30570/input.js new file mode 100644 index 000000000..30339e799 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/issue-30570/input.js @@ -0,0 +1,15 @@ +export default function IndexPage() { + return ( +
    +

    Hello World.

    + + +
    + ); + } \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/issue-30570/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/issue-30570/output.lightningcss.js new file mode 100644 index 000000000..8705f4ae9 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/issue-30570/output.lightningcss.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default function IndexPage() { + return
    + +

    Hello World.

    + + + + <_JSXStyle id={"bbdada4ef17d18ef"}>{"@supports (display:flex){h1{color:#ff69b4}}"} + +
    ; +} diff --git a/packages/swc-magic/transform/tests/fixture/issue-30570/output.swc.js b/packages/swc-magic/transform/tests/fixture/issue-30570/output.swc.js new file mode 100644 index 000000000..8a59df276 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/issue-30570/output.swc.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default function IndexPage() { + return
    + +

    Hello World.

    + + + + <_JSXStyle id={"bbdada4ef17d18ef"}>{"@supports((display:flex)or (display:-webkit-box)or (display:-webkit-flex)or (display:-moz-box)or (display:-ms-flexbox)){h1{color:hotpink}}"} + +
    ; +} diff --git a/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/input.js b/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/input.js new file mode 100644 index 000000000..39b930b9c --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/input.js @@ -0,0 +1,30 @@ + + + +export default class { + render() { + return ( +
    +

    test

    + +
    + ) + } + } + \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/output.lightningcss.js new file mode 100644 index 000000000..d7317357e --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/output.lightningcss.js @@ -0,0 +1,43 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"2660fd68f1ede1d4"} dynamic={[ + Typography.base.size.default, + Typography.base.lineHeight, + Target.mediumPlus, + Typography.base.size.mediumPlus, + Target.largePlus, + Typography.base.size.largePlus + ]}>{`html{font-size:${Typography.base.size.default};line-height:${Typography.base.lineHeight}}@media ${Target.mediumPlus}{html{font-size:${Typography.base.size.mediumPlus}}}@media ${Target.largePlus}{html{font-size:${Typography.base.size.largePlus}}}`} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/output.swc.js b/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/output.swc.js new file mode 100644 index 000000000..d7317357e --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/output.swc.js @@ -0,0 +1,43 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"2660fd68f1ede1d4"} dynamic={[ + Typography.base.size.default, + Typography.base.lineHeight, + Target.mediumPlus, + Typography.base.size.mediumPlus, + Target.largePlus, + Typography.base.size.largePlus + ]}>{`html{font-size:${Typography.base.size.default};line-height:${Typography.base.lineHeight}}@media ${Target.mediumPlus}{html{font-size:${Typography.base.size.mediumPlus}}}@media ${Target.largePlus}{html{font-size:${Typography.base.size.largePlus}}}`} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/input.js b/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/input.js new file mode 100644 index 000000000..403ed46ac --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/input.js @@ -0,0 +1,9 @@ +const Test = () => + +export default () => ( +
    +

    test

    + + +
    +) diff --git a/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/output.lightningcss.js new file mode 100644 index 000000000..bb98a20af --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/output.lightningcss.js @@ -0,0 +1,11 @@ +import _JSXStyle from "styled-jsx/style"; +const Test = ()=><_JSXStyle id={"94239b6d6b42c9b5"}>{"p{color:red}"}; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"b7efb453c85593c1"}>{"body{background:red}"} + + <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-3822e6e1fb9fa41a{color:red}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/output.swc.js b/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/output.swc.js new file mode 100644 index 000000000..bb98a20af --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/output.swc.js @@ -0,0 +1,11 @@ +import _JSXStyle from "styled-jsx/style"; +const Test = ()=><_JSXStyle id={"94239b6d6b42c9b5"}>{"p{color:red}"}; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"b7efb453c85593c1"}>{"body{background:red}"} + + <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-3822e6e1fb9fa41a{color:red}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/multiple-jsx/input.js b/packages/swc-magic/transform/tests/fixture/multiple-jsx/input.js new file mode 100644 index 000000000..0b1de3378 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/multiple-jsx/input.js @@ -0,0 +1,43 @@ +const attrs = { + id: 'test' +} + +const Test1 = () => ( +
    + test + + +
    +) + +const Test2 = () => test + +const Test3 = () => ( +
    + test + +
    +) + +export default class { + render () { + return ( +
    +

    test

    + +
    + ) + } +} diff --git a/packages/swc-magic/transform/tests/fixture/multiple-jsx/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/multiple-jsx/output.lightningcss.js new file mode 100644 index 000000000..27ccd2ee8 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/multiple-jsx/output.lightningcss.js @@ -0,0 +1,32 @@ +import _JSXStyle from "styled-jsx/style"; +const attrs = { + id: 'test' +}; +const Test1 = ()=>
    + + test + + + + <_JSXStyle id={"a9535d7d5f32c3c4"}>{"span.jsx-a9535d7d5f32c3c4{color:red}"} + +
    ; +const Test2 = ()=>test; +const Test3 = ()=>
    + + test + + <_JSXStyle id={"a9535d7d5f32c3c4"}>{"span.jsx-a9535d7d5f32c3c4{color:red}"} + +
    ; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"b2b86d63f35d25ee"}>{"p.jsx-b2b86d63f35d25ee{color:red}"} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/multiple-jsx/output.swc.js b/packages/swc-magic/transform/tests/fixture/multiple-jsx/output.swc.js new file mode 100644 index 000000000..27ccd2ee8 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/multiple-jsx/output.swc.js @@ -0,0 +1,32 @@ +import _JSXStyle from "styled-jsx/style"; +const attrs = { + id: 'test' +}; +const Test1 = ()=>
    + + test + + + + <_JSXStyle id={"a9535d7d5f32c3c4"}>{"span.jsx-a9535d7d5f32c3c4{color:red}"} + +
    ; +const Test2 = ()=>test; +const Test3 = ()=>
    + + test + + <_JSXStyle id={"a9535d7d5f32c3c4"}>{"span.jsx-a9535d7d5f32c3c4{color:red}"} + +
    ; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"b2b86d63f35d25ee"}>{"p.jsx-b2b86d63f35d25ee{color:red}"} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/nested-style-tags/index.js b/packages/swc-magic/transform/tests/fixture/nested-style-tags/index.js new file mode 100644 index 000000000..e69de29bb diff --git a/packages/swc-magic/transform/tests/fixture/next-54653/input.js b/packages/swc-magic/transform/tests/fixture/next-54653/input.js new file mode 100644 index 000000000..a053813c6 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/next-54653/input.js @@ -0,0 +1,10 @@ +import css from 'styled-jsx/css' + +export default css` + @media (max-width: 870px) { + :global(th.expiration-date-cell), + :global(td.expiration-date-cell) { + display: none; + } + } +` \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/next-54653/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/next-54653/output.lightningcss.js new file mode 100644 index 000000000..4a05021b0 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/next-54653/output.lightningcss.js @@ -0,0 +1,3 @@ +const _defaultExport = new String("@media (width<=870px){th.expiration-date-cell,td.expiration-date-cell{display:none}}"); +_defaultExport.__hash = "fd71bf06ba8860bb"; +export default _defaultExport; diff --git a/packages/swc-magic/transform/tests/fixture/next-54653/output.swc.js b/packages/swc-magic/transform/tests/fixture/next-54653/output.swc.js new file mode 100644 index 000000000..d080a6d83 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/next-54653/output.swc.js @@ -0,0 +1,3 @@ +const _defaultExport = new String("@media(max-width:870px){th.expiration-date-cell,td.expiration-date-cell{display:none}}"); +_defaultExport.__hash = "fd71bf06ba8860bb"; +export default _defaultExport; diff --git a/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/input.js b/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/input.js new file mode 100644 index 000000000..d4a7da9ee --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/input.js @@ -0,0 +1,7 @@ +export default () => ( +
    +

    woot

    + + +
    +) diff --git a/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/output.lightningcss.js new file mode 100644 index 000000000..5977ac8dd --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/output.lightningcss.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    woot

    + + + + <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-94239b6d6b42c9b5{color:red}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/output.swc.js b/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/output.swc.js new file mode 100644 index 000000000..5977ac8dd --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/output.swc.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    woot

    + + + + <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-94239b6d6b42c9b5{color:red}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/input.js b/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/input.js new file mode 100644 index 000000000..212202d49 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/input.js @@ -0,0 +1,30 @@ +import css from 'hell' + +const color = 'red' + +const bar = css` + div { + font-size: 3em; + } +` +export const uh = bar + +export const foo = css`div { color: ${color}}` + +export default css` + div { + font-size: 3em; + } + p { + color: ${color}; + } +` + +const Title = styled.h1` + color: red; + font-size: 50px; +` + +const AnotherTitle = Title.extend`color: blue;` + +export const Component = () => My page diff --git a/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/output.lightningcss.js new file mode 100644 index 000000000..a915f996e --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/output.lightningcss.js @@ -0,0 +1,23 @@ +import css from 'hell'; +const color = 'red'; +const bar = css` + div { + font-size: 3em; + } +`; +export const uh = bar; +export const foo = css`div { color: ${color}}`; +export default css` + div { + font-size: 3em; + } + p { + color: ${color}; + } +`; +const Title = styled.h1` + color: red; + font-size: 50px; +`; +const AnotherTitle = Title.extend`color: blue;`; +export const Component = ()=>My page; diff --git a/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/output.swc.js b/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/output.swc.js new file mode 100644 index 000000000..a915f996e --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/output.swc.js @@ -0,0 +1,23 @@ +import css from 'hell'; +const color = 'red'; +const bar = css` + div { + font-size: 3em; + } +`; +export const uh = bar; +export const foo = css`div { color: ${color}}`; +export default css` + div { + font-size: 3em; + } + p { + color: ${color}; + } +`; +const Title = styled.h1` + color: red; + font-size: 50px; +`; +const AnotherTitle = Title.extend`color: blue;`; +export const Component = ()=>My page; diff --git a/packages/swc-magic/transform/tests/fixture/number-after-placeholder/input.js b/packages/swc-magic/transform/tests/fixture/number-after-placeholder/input.js new file mode 100644 index 000000000..99aecf43d --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/number-after-placeholder/input.js @@ -0,0 +1,17 @@ +import Link from "next/link"; + +export default function IndexPage() { + return ( +
    + Hello World.{" "} + + Abound + + +
    + ); +} \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/number-after-placeholder/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/number-after-placeholder/output.lightningcss.js new file mode 100644 index 000000000..3142a2720 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/number-after-placeholder/output.lightningcss.js @@ -0,0 +1,17 @@ +import _JSXStyle from "styled-jsx/style"; +import Link from "next/link"; +export default function IndexPage() { + return
    + + Hello World.{" "} + + + + Abound + + + + <_JSXStyle id={"2339e3d61ab4470c"}>{`a.jsx-2339e3d61ab4470c{color:${"#abcdef"}12}`} + +
    ; +} diff --git a/packages/swc-magic/transform/tests/fixture/number-after-placeholder/output.swc.js b/packages/swc-magic/transform/tests/fixture/number-after-placeholder/output.swc.js new file mode 100644 index 000000000..3142a2720 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/number-after-placeholder/output.swc.js @@ -0,0 +1,17 @@ +import _JSXStyle from "styled-jsx/style"; +import Link from "next/link"; +export default function IndexPage() { + return
    + + Hello World.{" "} + + + + Abound + + + + <_JSXStyle id={"2339e3d61ab4470c"}>{`a.jsx-2339e3d61ab4470c{color:${"#abcdef"}12}`} + +
    ; +} diff --git a/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/input.js b/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/input.js new file mode 100644 index 000000000..96aca2778 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/input.js @@ -0,0 +1,10 @@ +export default () => ( +
    +

    test

    + +
    +) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/output.lightningcss.js new file mode 100644 index 000000000..479aff6f6 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/output.lightningcss.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"c7c3a8e231c9215a"}>{".container.jsx-c7c3a8e231c9215a>*{color:red}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/output.swc.js b/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/output.swc.js new file mode 100644 index 000000000..479aff6f6 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/output.swc.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"c7c3a8e231c9215a"}>{".container.jsx-c7c3a8e231c9215a>*{color:red}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/source-maps/input.js b/packages/swc-magic/transform/tests/fixture/source-maps/input.js new file mode 100644 index 000000000..e14ced8ae --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/source-maps/input.js @@ -0,0 +1,8 @@ +// TODO: needs sourcemaps +// export default () => ( +//
    +//

    test

    +//

    woot

    +// +//
    +// ) diff --git a/packages/swc-magic/transform/tests/fixture/source-maps/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/source-maps/output.lightningcss.js new file mode 100644 index 000000000..e14ced8ae --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/source-maps/output.lightningcss.js @@ -0,0 +1,8 @@ +// TODO: needs sourcemaps +// export default () => ( +//
    +//

    test

    +//

    woot

    +// +//
    +// ) diff --git a/packages/swc-magic/transform/tests/fixture/source-maps/output.swc.js b/packages/swc-magic/transform/tests/fixture/source-maps/output.swc.js new file mode 100644 index 000000000..e14ced8ae --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/source-maps/output.swc.js @@ -0,0 +1,8 @@ +// TODO: needs sourcemaps +// export default () => ( +//
    +//

    test

    +//

    woot

    +// +//
    +// ) diff --git a/packages/swc-magic/transform/tests/fixture/stateless/input.js b/packages/swc-magic/transform/tests/fixture/stateless/input.js new file mode 100644 index 000000000..e00df987c --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/stateless/input.js @@ -0,0 +1,8 @@ +export default () => ( +
    +

    test

    +

    woot

    +

    woot

    + +
    +) diff --git a/packages/swc-magic/transform/tests/fixture/stateless/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/stateless/output.lightningcss.js new file mode 100644 index 000000000..53d2bfccf --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/stateless/output.lightningcss.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + +

    woot

    + +

    woot

    + + <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-94239b6d6b42c9b5{color:red}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/stateless/output.swc.js b/packages/swc-magic/transform/tests/fixture/stateless/output.swc.js new file mode 100644 index 000000000..53d2bfccf --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/stateless/output.swc.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + +

    woot

    + +

    woot

    + + <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-94239b6d6b42c9b5{color:red}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/styles-external-invalid/input.js b/packages/swc-magic/transform/tests/fixture/styles-external-invalid/input.js new file mode 100644 index 000000000..5842604db --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/styles-external-invalid/input.js @@ -0,0 +1,13 @@ +// TODO +// import css from 'styled-jsx/css' + +// const color = 'red' + +// export const foo = css`div { color: ${color}}` + +// const props = { color: 'red ' } + +// export default css` +// div { font-size: 3em; color: ${props.color} } +// p { color: ${this.props.color};} +// ` diff --git a/packages/swc-magic/transform/tests/fixture/styles-external-invalid/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/styles-external-invalid/output.lightningcss.js new file mode 100644 index 000000000..587369e43 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/styles-external-invalid/output.lightningcss.js @@ -0,0 +1,9 @@ +// TODO +// import css from 'styled-jsx/css' +// const color = 'red' +// export const foo = css`div { color: ${color}}` +// const props = { color: 'red ' } +// export default css` +// div { font-size: 3em; color: ${props.color} } +// p { color: ${this.props.color};} +// ` diff --git a/packages/swc-magic/transform/tests/fixture/styles-external-invalid/output.swc.js b/packages/swc-magic/transform/tests/fixture/styles-external-invalid/output.swc.js new file mode 100644 index 000000000..587369e43 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/styles-external-invalid/output.swc.js @@ -0,0 +1,9 @@ +// TODO +// import css from 'styled-jsx/css' +// const color = 'red' +// export const foo = css`div { color: ${color}}` +// const props = { color: 'red ' } +// export default css` +// div { font-size: 3em; color: ${props.color} } +// p { color: ${this.props.color};} +// ` diff --git a/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/input.js b/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/input.js new file mode 100644 index 000000000..82b0f957c --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/input.js @@ -0,0 +1,11 @@ +// TODO +// import css from 'styled-jsx/css' + +// const color = 'red' + +// export const foo = css`div { color: ${color}}` + +// export default css` +// div { font-size: 3em } +// p { color: ${props.color};} +// ` diff --git a/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/output.lightningcss.js new file mode 100644 index 000000000..8f616ffc6 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/output.lightningcss.js @@ -0,0 +1,8 @@ +// TODO +// import css from 'styled-jsx/css' +// const color = 'red' +// export const foo = css`div { color: ${color}}` +// export default css` +// div { font-size: 3em } +// p { color: ${props.color};} +// ` diff --git a/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/output.swc.js b/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/output.swc.js new file mode 100644 index 000000000..8f616ffc6 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/output.swc.js @@ -0,0 +1,8 @@ +// TODO +// import css from 'styled-jsx/css' +// const color = 'red' +// export const foo = css`div { color: ${color}}` +// export default css` +// div { font-size: 3em } +// p { color: ${props.color};} +// ` diff --git a/packages/swc-magic/transform/tests/fixture/styles/input.js b/packages/swc-magic/transform/tests/fixture/styles/input.js new file mode 100644 index 000000000..7cbd27576 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/styles/input.js @@ -0,0 +1,57 @@ +import css, { resolve, global } from 'styled-jsx/css' +import colors, { size } from './constants' +const color = 'red' + +const bar = css` + div { + font-size: 3em; + } +` + +const baz = css.global` + div { + font-size: 3em; + } +` + +const a = global` + div { + font-size: ${size}em; + } +` + +export const uh = bar + +export const foo = css`div { color: ${color}}` + +css.resolve` + div { + color: ${colors.green.light}; + } + a { color: red } +` + +const b = resolve` + div { + color: ${colors.green.light}; + } + a { color: red } +` + +const dynamic = colors => { + const b = resolve` + div { + color: ${colors.green.light}; + } + a { color: red } + ` +} + +export default css.resolve` + div { + font-size: 3em; + } + p { + color: ${color}; + } +` diff --git a/packages/swc-magic/transform/tests/fixture/styles/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/styles/output.lightningcss.js new file mode 100644 index 000000000..b4961faf5 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/styles/output.lightningcss.js @@ -0,0 +1,39 @@ +import _JSXStyle from "styled-jsx/style"; +import colors, { size } from './constants'; +const color = 'red'; +const bar = new String("div.jsx-aaed0341accea8f{font-size:3em}"); +bar.__hash = "aaed0341accea8f"; +const baz = new String("div{font-size:3em}"); +baz.__hash = "aaed0341accea8f"; +const a = new String(`div{font-size:${size}em}`); +a.__hash = "c82345d11d3b02f5"; +export const uh = bar; +export const foo = new String(`div.jsx-611c1f2c95744b70{color:${color}}`); +foo.__hash = "611c1f2c95744b70"; +({ + styles: <_JSXStyle id={"141b18386ca7cbc5"}>{`div.jsx-141b18386ca7cbc5{color:${colors.green.light}}a.jsx-141b18386ca7cbc5{color:red}`}, + className: "jsx-141b18386ca7cbc5" +}); +const b = { + styles: <_JSXStyle id={"141b18386ca7cbc5"}>{`div.jsx-141b18386ca7cbc5{color:${colors.green.light}}a.jsx-141b18386ca7cbc5{color:red}`}, + className: "jsx-141b18386ca7cbc5" +}; +const dynamic = (colors)=>{ + const b = { + styles: <_JSXStyle id={"a6aaef75eecc989e"} dynamic={[ + colors.green.light + ]}>{`div.__jsx-style-dynamic-selector{color:${colors.green.light}}a.__jsx-style-dynamic-selector{color:red}`}, + className: _JSXStyle.dynamic([ + [ + "a6aaef75eecc989e", + [ + colors.green.light + ] + ] + ]) + }; +}; +export default { + styles: <_JSXStyle id={"c1431f6a913dbbc9"}>{`div.jsx-c1431f6a913dbbc9{font-size:3em}p.jsx-c1431f6a913dbbc9{color:${color}}`}, + className: "jsx-c1431f6a913dbbc9" +}; diff --git a/packages/swc-magic/transform/tests/fixture/styles/output.swc.js b/packages/swc-magic/transform/tests/fixture/styles/output.swc.js new file mode 100644 index 000000000..b4961faf5 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/styles/output.swc.js @@ -0,0 +1,39 @@ +import _JSXStyle from "styled-jsx/style"; +import colors, { size } from './constants'; +const color = 'red'; +const bar = new String("div.jsx-aaed0341accea8f{font-size:3em}"); +bar.__hash = "aaed0341accea8f"; +const baz = new String("div{font-size:3em}"); +baz.__hash = "aaed0341accea8f"; +const a = new String(`div{font-size:${size}em}`); +a.__hash = "c82345d11d3b02f5"; +export const uh = bar; +export const foo = new String(`div.jsx-611c1f2c95744b70{color:${color}}`); +foo.__hash = "611c1f2c95744b70"; +({ + styles: <_JSXStyle id={"141b18386ca7cbc5"}>{`div.jsx-141b18386ca7cbc5{color:${colors.green.light}}a.jsx-141b18386ca7cbc5{color:red}`}, + className: "jsx-141b18386ca7cbc5" +}); +const b = { + styles: <_JSXStyle id={"141b18386ca7cbc5"}>{`div.jsx-141b18386ca7cbc5{color:${colors.green.light}}a.jsx-141b18386ca7cbc5{color:red}`}, + className: "jsx-141b18386ca7cbc5" +}; +const dynamic = (colors)=>{ + const b = { + styles: <_JSXStyle id={"a6aaef75eecc989e"} dynamic={[ + colors.green.light + ]}>{`div.__jsx-style-dynamic-selector{color:${colors.green.light}}a.__jsx-style-dynamic-selector{color:red}`}, + className: _JSXStyle.dynamic([ + [ + "a6aaef75eecc989e", + [ + colors.green.light + ] + ] + ]) + }; +}; +export default { + styles: <_JSXStyle id={"c1431f6a913dbbc9"}>{`div.jsx-c1431f6a913dbbc9{font-size:3em}p.jsx-c1431f6a913dbbc9{color:${color}}`}, + className: "jsx-c1431f6a913dbbc9" +}; diff --git a/packages/swc-magic/transform/tests/fixture/styles2/input.js b/packages/swc-magic/transform/tests/fixture/styles2/input.js new file mode 100644 index 000000000..6e82bca12 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/styles2/input.js @@ -0,0 +1,6 @@ +// TODO: support common js +// import css from 'styled-jsx/css' + +// module.exports = css` +// div { font-size: 3em } +// ` \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/styles2/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/styles2/output.lightningcss.js new file mode 100644 index 000000000..cd7ba2952 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/styles2/output.lightningcss.js @@ -0,0 +1,5 @@ +// TODO: support common js +// import css from 'styled-jsx/css' +// module.exports = css` +// div { font-size: 3em } +// ` diff --git a/packages/swc-magic/transform/tests/fixture/styles2/output.swc.js b/packages/swc-magic/transform/tests/fixture/styles2/output.swc.js new file mode 100644 index 000000000..cd7ba2952 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/styles2/output.swc.js @@ -0,0 +1,5 @@ +// TODO: support common js +// import css from 'styled-jsx/css' +// module.exports = css` +// div { font-size: 3em } +// ` diff --git a/packages/swc-magic/transform/tests/fixture/too-many/input.js b/packages/swc-magic/transform/tests/fixture/too-many/input.js new file mode 100644 index 000000000..86905e5ff --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/too-many/input.js @@ -0,0 +1,35 @@ + + +export const Red = ({ + Component = 'button', +}) => { + + return ( + + + {/* Dynamic Styles */} + + + ); +}; + diff --git a/packages/swc-magic/transform/tests/fixture/too-many/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/too-many/output.lightningcss.js new file mode 100644 index 000000000..55eaf26a9 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/too-many/output.lightningcss.js @@ -0,0 +1,49 @@ +import _JSXStyle from "styled-jsx/style"; +export const Red = ({ Component = 'button' })=>{ + return + + + + {} + + <_JSXStyle id={"6c7c8cee856673a7"} dynamic={[ + e1, + e2, + e3, + e4, + e5, + e6, + e7, + e8, + e9, + e10, + e11, + e12, + e13, + e14, + e15 + ]}>{`.button.__jsx-style-dynamic-selector{--button-1:${e1};--button-2:${e2};--button-3:${e3};--button-4:${e4};--button-5:${e5};--button-6:${e6};--button-7:${e7};--button-8:${e8};--button-9:${e9};--button-10:${e10};--button-11:${e11};--button-12:${e12};--button-13:${e13};--button-14:${e14};--button-15:${e15}}`} + + ; +}; diff --git a/packages/swc-magic/transform/tests/fixture/too-many/output.swc.js b/packages/swc-magic/transform/tests/fixture/too-many/output.swc.js new file mode 100644 index 000000000..55eaf26a9 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/too-many/output.swc.js @@ -0,0 +1,49 @@ +import _JSXStyle from "styled-jsx/style"; +export const Red = ({ Component = 'button' })=>{ + return + + + + {} + + <_JSXStyle id={"6c7c8cee856673a7"} dynamic={[ + e1, + e2, + e3, + e4, + e5, + e6, + e7, + e8, + e9, + e10, + e11, + e12, + e13, + e14, + e15 + ]}>{`.button.__jsx-style-dynamic-selector{--button-1:${e1};--button-2:${e2};--button-3:${e3};--button-4:${e4};--button-5:${e5};--button-6:${e6};--button-7:${e7};--button-8:${e8};--button-9:${e9};--button-10:${e10};--button-11:${e11};--button-12:${e12};--button-13:${e13};--button-14:${e14};--button-15:${e15}}`} + + ; +}; diff --git a/packages/swc-magic/transform/tests/fixture/tpl-escape-1/input.js b/packages/swc-magic/transform/tests/fixture/tpl-escape-1/input.js new file mode 100644 index 000000000..f01a4f412 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-escape-1/input.js @@ -0,0 +1,14 @@ +export default class { + render() { + return ( +
    +

    test

    + +
    + ) + } +} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-escape-1/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/tpl-escape-1/output.lightningcss.js new file mode 100644 index 000000000..47b810056 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-escape-1/output.lightningcss.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"1f6cef12199c3a8f"}>{'p.jsx-1f6cef12199c3a8f{content:"`"}'} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-escape-1/output.swc.js b/packages/swc-magic/transform/tests/fixture/tpl-escape-1/output.swc.js new file mode 100644 index 000000000..47b810056 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-escape-1/output.swc.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"1f6cef12199c3a8f"}>{'p.jsx-1f6cef12199c3a8f{content:"`"}'} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-escape-2/input.js b/packages/swc-magic/transform/tests/fixture/tpl-escape-2/input.js new file mode 100644 index 000000000..d6ddd4447 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-escape-2/input.js @@ -0,0 +1,17 @@ +export default function Home({ fontFamily }) { + return ( +
    + +
    + ) +} \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/tpl-escape-2/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/tpl-escape-2/output.lightningcss.js new file mode 100644 index 000000000..0ec990032 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-escape-2/output.lightningcss.js @@ -0,0 +1,17 @@ +import _JSXStyle from "styled-jsx/style"; +export default function Home({ fontFamily }) { + return
    + + <_JSXStyle id={"ae6b96ca586fe51a"} dynamic={[ + fontFamily + ]}>{`body{font-family:${fontFamily}}code:before,code:after{content:"\`"}`} + +
    ; +} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-escape-2/output.swc.js b/packages/swc-magic/transform/tests/fixture/tpl-escape-2/output.swc.js new file mode 100644 index 000000000..0ec990032 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-escape-2/output.swc.js @@ -0,0 +1,17 @@ +import _JSXStyle from "styled-jsx/style"; +export default function Home({ fontFamily }) { + return
    + + <_JSXStyle id={"ae6b96ca586fe51a"} dynamic={[ + fontFamily + ]}>{`body{font-family:${fontFamily}}code:before,code:after{content:"\`"}`} + +
    ; +} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/input.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/input.js new file mode 100644 index 000000000..578f25c55 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/input.js @@ -0,0 +1,17 @@ +export default class { + render() { + return ( +
    +

    test

    + +
    + ) + } + } + \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/output.lightningcss.js new file mode 100644 index 000000000..ba51a1173 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/output.lightningcss.js @@ -0,0 +1,28 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"e1b0d3df4c8dcbf0"} dynamic={[ + inputSize ? 'height: calc(2 * var(--a)) !important;' : '' + ]}>{`@media only screen{a.__jsx-style-dynamic-selector{${inputSize ? 'height: calc(2 * var(--a)) !important;' : ''}}`} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/output.swc.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/output.swc.js new file mode 100644 index 000000000..a5d5f8093 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/output.swc.js @@ -0,0 +1,29 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"e1b0d3df4c8dcbf0"} dynamic={[ + inputSize ? 'height: calc(2 * var(--a)) !important;' : '' + ]}>{`@media only screen{a.__jsx-style-dynamic-selector{${inputSize ? 'height: calc(2 * var(--a)) !important;' : ''} + }}`} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/input.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/input.js new file mode 100644 index 000000000..3524c05ce --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/input.js @@ -0,0 +1,21 @@ +export default class { + render() { + return ( +
    +

    test

    + +
    + ) + } + } + \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/output.lightningcss.js new file mode 100644 index 000000000..5456f7793 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/output.lightningcss.js @@ -0,0 +1,34 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"ad088d55a749d737"} dynamic={[ + a[b], + -1 * (c || 0), + d + ]}>{`.a:hover .b.__jsx-style-dynamic-selector{a:${a[b]}px!important;b:translate3d(0,${-1 * (c || 0)}px,-${d}px)scale(1)!important}`} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/output.swc.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/output.swc.js new file mode 100644 index 000000000..5456f7793 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/output.swc.js @@ -0,0 +1,34 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"ad088d55a749d737"} dynamic={[ + a[b], + -1 * (c || 0), + d + ]}>{`.a:hover .b.__jsx-style-dynamic-selector{a:${a[b]}px!important;b:translate3d(0,${-1 * (c || 0)}px,-${d}px)scale(1)!important}`} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/input.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/input.js new file mode 100644 index 000000000..4528b59e6 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/input.js @@ -0,0 +1,17 @@ +export default class { + render() { + return ( +
    +

    test

    + +
    + ) + } + } + \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/output.lightningcss.js new file mode 100644 index 000000000..270224f53 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/output.lightningcss.js @@ -0,0 +1,28 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"1b41b940177cfe8f"} dynamic={[ + a + ]}>{`@media only screen{a.__jsx-style-dynamic-selector{color:${a}}}`} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/output.swc.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/output.swc.js new file mode 100644 index 000000000..270224f53 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/output.swc.js @@ -0,0 +1,28 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"1b41b940177cfe8f"} dynamic={[ + a + ]}>{`@media only screen{a.__jsx-style-dynamic-selector{color:${a}}}`} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/input.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/input.js new file mode 100644 index 000000000..492bf86a3 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/input.js @@ -0,0 +1,17 @@ +export default class { + render() { + return ( +
    +

    test

    + +
    + ) + } + } + \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/output.lightningcss.js new file mode 100644 index 000000000..0d9962df6 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/output.lightningcss.js @@ -0,0 +1,31 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"293094c41b76e3ed"} dynamic={[ + a || 'var(--c)', + b || 'inherit' + ]}>{`.a:hover .b.__jsx-style-dynamic-selector{padding:0 ${a || 'var(--c)'};color:${b || 'inherit'};display:inline-block}`} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/output.swc.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/output.swc.js new file mode 100644 index 000000000..a1786d8b2 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/output.swc.js @@ -0,0 +1,31 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"293094c41b76e3ed"} dynamic={[ + a || 'var(--c)', + b || 'inherit' + ]}>{`.a:hover .b.__jsx-style-dynamic-selector{display:inline-block;padding:0 ${a || 'var(--c)'};color:${b || 'inherit'}}`} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/input.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/input.js new file mode 100644 index 000000000..bd1739e0b --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/input.js @@ -0,0 +1,16 @@ +export default class { + render() { + return ( +
    +

    test

    + +
    + ) + } + } + \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/output.lightningcss.js new file mode 100644 index 000000000..e2d82056d --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/output.lightningcss.js @@ -0,0 +1,31 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"d1d694613dfced19"} dynamic={[ + a ? '100%' : '200px', + b ? '0' : '8px 20px' + ]}>{`.item.__jsx-style-dynamic-selector{max-width:${a ? '100%' : '200px'};padding:${b ? '0' : '8px 20px'}}`} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/output.swc.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/output.swc.js new file mode 100644 index 000000000..e2d82056d --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/output.swc.js @@ -0,0 +1,31 @@ +import _JSXStyle from "styled-jsx/style"; +export default class { + render() { + return
    + +

    test

    + + <_JSXStyle id={"d1d694613dfced19"} dynamic={[ + a ? '100%' : '200px', + b ? '0' : '8px 20px' + ]}>{`.item.__jsx-style-dynamic-selector{max-width:${a ? '100%' : '200px'};padding:${b ? '0' : '8px 20px'}}`} + +
    ; + } +} diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/input.js b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/input.js new file mode 100644 index 000000000..a1c49f29d --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/input.js @@ -0,0 +1,12 @@ +export default () => ( +
    +

    test

    + +
    +) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/output.lightningcss.js new file mode 100644 index 000000000..2a0876bd8 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/output.lightningcss.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"efc590d693035654"}>{".a-selector.jsx-efc590d693035654:hover,.a-selector.jsx-efc590d693035654:focus{outline:none}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/output.swc.js b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/output.swc.js new file mode 100644 index 000000000..2a0876bd8 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/output.swc.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"efc590d693035654"}>{".a-selector.jsx-efc590d693035654:hover,.a-selector.jsx-efc590d693035654:focus{outline:none}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/input.js b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/input.js new file mode 100644 index 000000000..5f3e7a94d --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/input.js @@ -0,0 +1,116 @@ +export default () => ( +
    +

    test

    + +
    +) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/output.lightningcss.js new file mode 100644 index 000000000..6ef78e3be --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/output.lightningcss.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"713499aa363d6373"}>{"p.jsx-713499aa363d6373 a.jsx-713499aa363d6373 span.jsx-713499aa363d6373{color:red}p.jsx-713499aa363d6373 span{background:#00f}p.jsx-713499aa363d6373 a[title=\"'w ' ' t'\"].jsx-713499aa363d6373{margin:auto}p.jsx-713499aa363d6373 span:not(.test){color:green}p.jsx-713499aa363d6373,h1.jsx-713499aa363d6373{color:#00f;animation:3s .1s infinite forwards hahaha}p.jsx-713499aa363d6373{animation:1s hahaha,2s hehehe}p.jsx-713499aa363d6373:hover,p.jsx-713499aa363d6373:before,:hover,:before,:hoverp.jsx-713499aa363d6373,p.jsx-713499aa363d6373+a.jsx-713499aa363d6373,p.jsx-713499aa363d6373~a.jsx-713499aa363d6373,p.jsx-713499aa363d6373>a.jsx-713499aa363d6373{color:red}@keyframes hahaha{0%{top:0}to{top:100px}}@keyframes hehehe{0%{left:0}to{left:100px}}@media (width>=500px){.test.jsx-713499aa363d6373{color:red}}.test.jsx-713499aa363d6373{display:block}.inline-flex.jsx-713499aa363d6373{display:inline-flex}.flex.jsx-713499aa363d6373{display:flex}.test.jsx-713499aa363d6373{box-shadow:0 0 10px #000,inset 0 0 5px #000}.test[title=\\,].jsx-713499aa363d6373{display:inline-block}.test.is-status.jsx-713499aa363d6373 .test.jsx-713499aa363d6373{color:red}.a-selector.jsx-713499aa363d6373:hover,.a-selector.jsx-713499aa363d6373:focus{outline:none}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/output.swc.js b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/output.swc.js new file mode 100644 index 000000000..37a9d1b48 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/output.swc.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"713499aa363d6373"}>{"p.jsx-713499aa363d6373 a.jsx-713499aa363d6373 span.jsx-713499aa363d6373{color:red}p.jsx-713499aa363d6373 span{background:blue}p.jsx-713499aa363d6373 a[title=\"'w ' ' t'\"].jsx-713499aa363d6373{margin:auto}p.jsx-713499aa363d6373 span:not(.test){color:green}p.jsx-713499aa363d6373,h1.jsx-713499aa363d6373{color:blue;-webkit-animation:hahaha 3s ease forwards infinite;-moz-animation:hahaha 3s ease forwards infinite;-o-animation:hahaha 3s ease forwards infinite;animation:hahaha 3s ease forwards infinite;-webkit-animation-name:hahaha;-moz-animation-name:hahaha;-o-animation-name:hahaha;animation-name:hahaha;-webkit-animation-delay:100ms;-moz-animation-delay:100ms;-o-animation-delay:100ms;animation-delay:100ms}p.jsx-713499aa363d6373{-webkit-animation:hahaha 1s,hehehe 2s;-moz-animation:hahaha 1s,hehehe 2s;-o-animation:hahaha 1s,hehehe 2s;animation:hahaha 1s,hehehe 2s}p.jsx-713499aa363d6373:hover{color:red}p.jsx-713499aa363d6373::before{color:red}.jsx-713499aa363d6373:hover{color:red}.jsx-713499aa363d6373::before{color:red}.jsx-713499aa363d6373:hover p.jsx-713499aa363d6373{color:red}p.jsx-713499aa363d6373+a.jsx-713499aa363d6373{color:red}p.jsx-713499aa363d6373~a.jsx-713499aa363d6373{color:red}p.jsx-713499aa363d6373>a.jsx-713499aa363d6373{color:red}@-webkit-keyframes hahaha{from{top:0}to{top:100}}@-moz-keyframes hahaha{from{top:0}to{top:100}}@-o-keyframes hahaha{from{top:0}to{top:100}}@keyframes hahaha{from{top:0}to{top:100}}@-webkit-keyframes hehehe{from{left:0}to{left:100}}@-moz-keyframes hehehe{from{left:0}to{left:100}}@-o-keyframes hehehe{from{left:0}to{left:100}}@keyframes hehehe{from{left:0}to{left:100}}@media(min-width:500px){.test.jsx-713499aa363d6373{color:red}}.test.jsx-713499aa363d6373{display:block}.inline-flex.jsx-713499aa363d6373{display:-webkit-inline-box;display:-webkit-inline-flex;display:-moz-inline-box;display:-ms-inline-flexbox;display:inline-flex}.flex.jsx-713499aa363d6373{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex}.test.jsx-713499aa363d6373{-webkit-box-shadow:0 0 10px black,inset 0 0 5px black;-moz-box-shadow:0 0 10px black,inset 0 0 5px black;box-shadow:0 0 10px black,inset 0 0 5px black}.test[title=\",\"].jsx-713499aa363d6373{display:inline-block}.test.is-status.jsx-713499aa363d6373 .test.jsx-713499aa363d6373{color:red}.a-selector.jsx-713499aa363d6373:hover,.a-selector.jsx-713499aa363d6373:focus{outline:none}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-global/input.js b/packages/swc-magic/transform/tests/fixture/transform-css-global/input.js new file mode 100644 index 000000000..e97b1f933 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-global/input.js @@ -0,0 +1,32 @@ +export default () => ( +
    +

    test

    + +
    +) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-global/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/transform-css-global/output.lightningcss.js new file mode 100644 index 000000000..e8f1accae --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-global/output.lightningcss.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"6881055ff9b1aeb6"}>{"html.jsx-6881055ff9b1aeb6{background-image:linear-gradient(#fffc,#fffc),url(/static/background.svg)}p{color:#001}h1{color:#002}h2,a.jsx-6881055ff9b1aeb6{color:#003}.foo+a{color:#004}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-global/output.swc.js b/packages/swc-magic/transform/tests/fixture/transform-css-global/output.swc.js new file mode 100644 index 000000000..58e649b3e --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-global/output.swc.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"6881055ff9b1aeb6"}>{'html.jsx-6881055ff9b1aeb6{background-image:-webkit-linear-gradient(bottom,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg);background-image:-moz-linear-gradient(bottom,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg);background-image:-o-linear-gradient(bottom,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg);background-image:linear-gradient(0deg,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg)}p{color:#001}h1{color:#002}h2,a.jsx-6881055ff9b1aeb6{color:#003}.foo+a{color:#004}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif}'} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-media-query/input.js b/packages/swc-magic/transform/tests/fixture/transform-css-media-query/input.js new file mode 100644 index 000000000..978d21aac --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-media-query/input.js @@ -0,0 +1,24 @@ +export default () => ( +
    +

    test

    + +
    +) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-media-query/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/transform-css-media-query/output.lightningcss.js new file mode 100644 index 000000000..a0a135a29 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-media-query/output.lightningcss.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"1f7963ae04c6466a"}>{"@media (width>=1px) and (width<=768px){[class*=grid__col--].jsx-1f7963ae04c6466a{margin-top:12px;margin-bottom:12px}}@media (width<=64em){.test.jsx-1f7963ae04c6466a{margin-bottom:1em}@supports ((-moz-appearance:none)) and (display:contents){.test.jsx-1f7963ae04c6466a{margin-bottom:2rem}}}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-media-query/output.swc.js b/packages/swc-magic/transform/tests/fixture/transform-css-media-query/output.swc.js new file mode 100644 index 000000000..555929a70 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-media-query/output.swc.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"1f7963ae04c6466a"}>{'@media(min-width:1px)and (max-width:768px){[class*="grid__col--"].jsx-1f7963ae04c6466a{margin-top:12px;margin-bottom:12px}}@media(max-width:64em){.test.jsx-1f7963ae04c6466a{margin-bottom:1em}@supports(-moz-appearance:none)and (display:contents){.test.jsx-1f7963ae04c6466a{margin-bottom:2rem}}}'} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-normal/input.js b/packages/swc-magic/transform/tests/fixture/transform-css-normal/input.js new file mode 100644 index 000000000..c1964abbf --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-normal/input.js @@ -0,0 +1,22 @@ +export default () => ( +
    +

    test

    + +
    +) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-normal/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/transform-css-normal/output.lightningcss.js new file mode 100644 index 000000000..1a795e472 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-normal/output.lightningcss.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"1a19bb4817c105dd"}>{"p.jsx-1a19bb4817c105dd{color:red}.jsx-1a19bb4817c105dd{color:#00f}[href=woot].jsx-1a19bb4817c105dd{color:red}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-normal/output.swc.js b/packages/swc-magic/transform/tests/fixture/transform-css-normal/output.swc.js new file mode 100644 index 000000000..6efb20ada --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-normal/output.swc.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"1a19bb4817c105dd"}>{'p.jsx-1a19bb4817c105dd{color:red}p.jsx-1a19bb4817c105dd{color:red}*.jsx-1a19bb4817c105dd{color:blue}[href="woot"].jsx-1a19bb4817c105dd{color:red}'} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/input.js b/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/input.js new file mode 100644 index 000000000..1a119aab5 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/input.js @@ -0,0 +1,10 @@ +export default () => ( +
    +

    test

    + +
    + ) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/output.lightningcss.js new file mode 100644 index 000000000..4160b0cea --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/output.lightningcss.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"938ca197692ef624"}>{"li.jsx-938ca197692ef624:nth-child(2){color:#0f0}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/output.swc.js b/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/output.swc.js new file mode 100644 index 000000000..5351dd098 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/output.swc.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"938ca197692ef624"}>{"li.jsx-938ca197692ef624:nth-child(2){color:lime}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css/input.js b/packages/swc-magic/transform/tests/fixture/transform-css/input.js new file mode 100644 index 000000000..5d851d68c --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css/input.js @@ -0,0 +1,176 @@ +export default () => ( +
    +

    test

    + +
    +) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/transform-css/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/transform-css/output.lightningcss.js new file mode 100644 index 000000000..acd9b979d --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css/output.lightningcss.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"4a27e5cf1c34b3df"}>{"html.jsx-4a27e5cf1c34b3df{background-image:linear-gradient(#fffc,#fffc),url(/static/background.svg)}p{color:#002}p,a.jsx-4a27e5cf1c34b3df{color:#003}.foo+a{color:#004}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif}p.jsx-4a27e5cf1c34b3df{color:#006}.jsx-4a27e5cf1c34b3df{color:#007}[href=woot].jsx-4a27e5cf1c34b3df{color:#008}p.jsx-4a27e5cf1c34b3df a.jsx-4a27e5cf1c34b3df span.jsx-4a27e5cf1c34b3df{color:#009}p.jsx-4a27e5cf1c34b3df span{background:#00a}p.jsx-4a27e5cf1c34b3df a[title=\"'w ' ' t'\"].jsx-4a27e5cf1c34b3df{margin:auto}p.jsx-4a27e5cf1c34b3df span:not(.test){color:#00b}p.jsx-4a27e5cf1c34b3df,h1.jsx-4a27e5cf1c34b3df{color:#00c;animation:3s .1s infinite forwards hahaha}p.jsx-4a27e5cf1c34b3df{animation:1s hahaha,2s hehehe}p.jsx-4a27e5cf1c34b3df:hover{color:#00d}p.jsx-4a27e5cf1c34b3df:before{color:#00e}:hover{color:#00f}:before{color:#010}:hoverp.jsx-4a27e5cf1c34b3df{color:#011}p.jsx-4a27e5cf1c34b3df+a.jsx-4a27e5cf1c34b3df{color:#012}p.jsx-4a27e5cf1c34b3df~a.jsx-4a27e5cf1c34b3df{color:#013}p.jsx-4a27e5cf1c34b3df>a.jsx-4a27e5cf1c34b3df{color:#014}@keyframes hahaha{0%{top:0}to{top:100px}}@keyframes hehehe{0%{left:0}to{left:100px}}@media (width>=500px){.test.jsx-4a27e5cf1c34b3df{color:#015}}.test.jsx-4a27e5cf1c34b3df{display:block}.inline-flex.jsx-4a27e5cf1c34b3df{display:inline-flex}.flex.jsx-4a27e5cf1c34b3df{display:flex}.test.jsx-4a27e5cf1c34b3df{box-shadow:0 0 10px #000,inset 0 0 5px #000}.test[title=\\,].jsx-4a27e5cf1c34b3df{display:inline-block}.test.is-status.jsx-4a27e5cf1c34b3df .test.jsx-4a27e5cf1c34b3df{color:#016}.a-selector.jsx-4a27e5cf1c34b3df:hover,.a-selector.jsx-4a27e5cf1c34b3df:focus{outline:none}@media (width>=1px) and (width<=768px){[class*=grid__col--].jsx-4a27e5cf1c34b3df{margin-top:12px;margin-bottom:12px}}@media (width<=64em){.test.jsx-4a27e5cf1c34b3df{margin-bottom:1em}@supports ((-moz-appearance:none)) and (display:contents){.test.jsx-4a27e5cf1c34b3df{margin-bottom:2rem}}}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css/output.swc.js b/packages/swc-magic/transform/tests/fixture/transform-css/output.swc.js new file mode 100644 index 000000000..0c47d9cc0 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/transform-css/output.swc.js @@ -0,0 +1,8 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + + <_JSXStyle id={"4a27e5cf1c34b3df"}>{'html.jsx-4a27e5cf1c34b3df{background-image:-webkit-linear-gradient(bottom,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg);background-image:-moz-linear-gradient(bottom,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg);background-image:-o-linear-gradient(bottom,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg);background-image:linear-gradient(0deg,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg)}p{color:#001}p{color:#002}p,a.jsx-4a27e5cf1c34b3df{color:#003}.foo+a{color:#004}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif}p.jsx-4a27e5cf1c34b3df{color:#005}p.jsx-4a27e5cf1c34b3df{color:#006}*.jsx-4a27e5cf1c34b3df{color:#007}[href="woot"].jsx-4a27e5cf1c34b3df{color:#008}p.jsx-4a27e5cf1c34b3df a.jsx-4a27e5cf1c34b3df span.jsx-4a27e5cf1c34b3df{color:#009}p.jsx-4a27e5cf1c34b3df span{background:#00a}p.jsx-4a27e5cf1c34b3df a[title="\'w \' \' t\'"].jsx-4a27e5cf1c34b3df{margin:auto}p.jsx-4a27e5cf1c34b3df span:not(.test){color:#00b}p.jsx-4a27e5cf1c34b3df,h1.jsx-4a27e5cf1c34b3df{color:#00c;-webkit-animation:hahaha 3s ease forwards infinite;-moz-animation:hahaha 3s ease forwards infinite;-o-animation:hahaha 3s ease forwards infinite;animation:hahaha 3s ease forwards infinite;-webkit-animation-name:hahaha;-moz-animation-name:hahaha;-o-animation-name:hahaha;animation-name:hahaha;-webkit-animation-delay:100ms;-moz-animation-delay:100ms;-o-animation-delay:100ms;animation-delay:100ms}p.jsx-4a27e5cf1c34b3df{-webkit-animation:hahaha 1s,hehehe 2s;-moz-animation:hahaha 1s,hehehe 2s;-o-animation:hahaha 1s,hehehe 2s;animation:hahaha 1s,hehehe 2s}p.jsx-4a27e5cf1c34b3df:hover{color:#00d}p.jsx-4a27e5cf1c34b3df::before{color:#00e}.jsx-4a27e5cf1c34b3df:hover{color:#00f}.jsx-4a27e5cf1c34b3df::before{color:#010}.jsx-4a27e5cf1c34b3df:hover p.jsx-4a27e5cf1c34b3df{color:#011}p.jsx-4a27e5cf1c34b3df+a.jsx-4a27e5cf1c34b3df{color:#012}p.jsx-4a27e5cf1c34b3df~a.jsx-4a27e5cf1c34b3df{color:#013}p.jsx-4a27e5cf1c34b3df>a.jsx-4a27e5cf1c34b3df{color:#014}@-webkit-keyframes hahaha{from{top:0}to{top:100}}@-moz-keyframes hahaha{from{top:0}to{top:100}}@-o-keyframes hahaha{from{top:0}to{top:100}}@keyframes hahaha{from{top:0}to{top:100}}@-webkit-keyframes hehehe{from{left:0}to{left:100}}@-moz-keyframes hehehe{from{left:0}to{left:100}}@-o-keyframes hehehe{from{left:0}to{left:100}}@keyframes hehehe{from{left:0}to{left:100}}@media(min-width:500px){.test.jsx-4a27e5cf1c34b3df{color:#015}}.test.jsx-4a27e5cf1c34b3df{display:block}.inline-flex.jsx-4a27e5cf1c34b3df{display:-webkit-inline-box;display:-webkit-inline-flex;display:-moz-inline-box;display:-ms-inline-flexbox;display:inline-flex}.flex.jsx-4a27e5cf1c34b3df{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex}.test.jsx-4a27e5cf1c34b3df{-webkit-box-shadow:0 0 10px black,inset 0 0 5px black;-moz-box-shadow:0 0 10px black,inset 0 0 5px black;box-shadow:0 0 10px black,inset 0 0 5px black}.test[title=","].jsx-4a27e5cf1c34b3df{display:inline-block}.test.is-status.jsx-4a27e5cf1c34b3df .test.jsx-4a27e5cf1c34b3df{color:#016}.a-selector.jsx-4a27e5cf1c34b3df:hover,.a-selector.jsx-4a27e5cf1c34b3df:focus{outline:none}@media(min-width:1px)and (max-width:768px){[class*="grid__col--"].jsx-4a27e5cf1c34b3df{margin-top:12px;margin-bottom:12px}}@media(max-width:64em){.test.jsx-4a27e5cf1c34b3df{margin-bottom:1em}@supports(-moz-appearance:none)and (display:contents){.test.jsx-4a27e5cf1c34b3df{margin-bottom:2rem}}}'} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/whitespace/input.js b/packages/swc-magic/transform/tests/fixture/whitespace/input.js new file mode 100644 index 000000000..8a6d77828 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/whitespace/input.js @@ -0,0 +1,12 @@ +export default () => ( +
    +

    test

    +

    woot

    +

    woot

    + +
    +) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/whitespace/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/whitespace/output.lightningcss.js new file mode 100644 index 000000000..53d2bfccf --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/whitespace/output.lightningcss.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + +

    woot

    + +

    woot

    + + <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-94239b6d6b42c9b5{color:red}"} + +
    ); diff --git a/packages/swc-magic/transform/tests/fixture/whitespace/output.swc.js b/packages/swc-magic/transform/tests/fixture/whitespace/output.swc.js new file mode 100644 index 000000000..53d2bfccf --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/whitespace/output.swc.js @@ -0,0 +1,12 @@ +import _JSXStyle from "styled-jsx/style"; +export default (()=>
    + +

    test

    + +

    woot

    + +

    woot

    + + <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-94239b6d6b42c9b5{color:red}"} + +
    ); From d9d07b5be7ab65c5918b8d4a32d3598bf4cc5d7b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:25:50 -0700 Subject: [PATCH 02/47] magic --- packages/swc-magic/Cargo.toml | 6 +- packages/swc-magic/package.json | 8 +- packages/swc-magic/src/lib.rs | 10 +-- packages/swc-magic/transform/Cargo.toml | 4 +- packages/swc-magic/transform/src/style.rs | 2 +- .../src/transform_css_lightningcss.rs | 2 +- .../transform/src/transform_css_swc.rs | 2 +- packages/swc-magic/transform/src/utils.rs | 8 +- packages/swc-magic/transform/src/visitor.rs | 86 +++++++++---------- .../nested-style-tags/output-lightningcss.js | 2 +- .../output-lightningcss.stderr | 12 +-- .../errors/nested-style-tags/output-swc.js | 2 +- .../nested-style-tags/output-swc.stderr | 12 +-- .../tests/errors/nested-style-tags/output.js | 2 +- .../errors/no-child/output-lightningcss.js | 2 +- .../no-child/output-lightningcss.stderr | 2 +- .../tests/errors/no-child/output-swc.js | 2 +- .../tests/errors/no-child/output-swc.stderr | 2 +- .../transform/tests/errors/no-child/output.js | 2 +- .../tests/errors/ts-with-css-resolve/input.js | 2 +- .../output-lightningcss.js | 2 +- .../errors/ts-with-css-resolve/output-swc.js | 2 +- .../errors/ts-with-css-resolve/output.js | 2 +- .../two-children/output-lightningcss.js | 2 +- .../two-children/output-lightningcss.stderr | 2 +- .../tests/errors/two-children/output-swc.js | 2 +- .../errors/two-children/output-swc.stderr | 2 +- .../tests/errors/two-children/output.js | 2 +- .../wrong-child-type/output-lightningcss.js | 2 +- .../output-lightningcss.stderr | 2 +- .../errors/wrong-child-type/output-swc.js | 2 +- .../errors/wrong-child-type/output-swc.stderr | 2 +- .../tests/errors/wrong-child-type/output.js | 2 +- .../output-lightningcss.js | 2 +- .../output-lightningcss.stderr | 2 +- .../wrong-jsx-expression-type/output-swc.js | 2 +- .../output-swc.stderr | 2 +- .../wrong-jsx-expression-type/output.js | 2 +- .../fixture-swc-only/next-55679/output.swc.js | 2 +- packages/swc-magic/transform/tests/fixture.rs | 24 +++--- .../output.lightningcss.js | 2 +- .../output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../attribute-generation-modes/output.swc.js | 2 +- .../fixture/class/output.lightningcss.js | 2 +- .../tests/fixture/class/output.swc.js | 2 +- .../fixture/comments/output.lightningcss.js | 2 +- .../tests/fixture/comments/output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../fixture/component-attribute/output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../css-selector-after-pseudo/output.swc.js | 2 +- .../tests/fixture/css-tag-same-file/input.js | 2 +- .../css-tag-same-file/output.lightningcss.js | 2 +- .../fixture/css-tag-same-file/output.swc.js | 2 +- .../different-jsx-ids/output.lightningcss.js | 2 +- .../fixture/different-jsx-ids/output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../dynamic-element-class/output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../dynamic-element-external/output.swc.js | 2 +- .../dynamic-element/output.lightningcss.js | 2 +- .../fixture/dynamic-element/output.swc.js | 2 +- .../fixture/external-nested-scope/input.js | 2 +- .../output.lightningcss.js | 2 +- .../external-nested-scope/output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../external-stylesheet-global/output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../fixture/external-stylesheet/output.swc.js | 2 +- .../fixture/fragment/output.lightningcss.js | 2 +- .../tests/fixture/fragment/output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../global-child-selector/output.swc.js | 2 +- .../global-redundant/output.lightningcss.js | 2 +- .../fixture/global-redundant/output.swc.js | 2 +- .../fixture/global/output.lightningcss.js | 2 +- .../tests/fixture/global/output.swc.js | 2 +- .../issue-30480/output.lightningcss.js | 2 +- .../tests/fixture/issue-30480/output.swc.js | 2 +- .../issue-30570/output.lightningcss.js | 2 +- .../tests/fixture/issue-30570/output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../fixture/mixed-global-scoped/output.swc.js | 2 +- .../multiple-jsx/output.lightningcss.js | 2 +- .../tests/fixture/multiple-jsx/output.swc.js | 2 +- .../tests/fixture/next-54653/input.js | 2 +- .../output.lightningcss.js | 2 +- .../non-styled-jsx-style/output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../number-after-placeholder/output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../one-off-global-selectors/output.swc.js | 2 +- .../fixture/stateless/output.lightningcss.js | 2 +- .../tests/fixture/stateless/output.swc.js | 2 +- .../fixture/styles-external-invalid/input.js | 2 +- .../output.lightningcss.js | 2 +- .../styles-external-invalid/output.swc.js | 2 +- .../fixture/styles-external-invalid2/input.js | 2 +- .../output.lightningcss.js | 2 +- .../styles-external-invalid2/output.swc.js | 2 +- .../transform/tests/fixture/styles/input.js | 2 +- .../fixture/styles/output.lightningcss.js | 2 +- .../tests/fixture/styles/output.swc.js | 2 +- .../transform/tests/fixture/styles2/input.js | 2 +- .../fixture/styles2/output.lightningcss.js | 2 +- .../tests/fixture/styles2/output.swc.js | 2 +- .../fixture/too-many/output.lightningcss.js | 2 +- .../tests/fixture/too-many/output.swc.js | 2 +- .../tpl-escape-1/output.lightningcss.js | 2 +- .../tests/fixture/tpl-escape-1/output.swc.js | 2 +- .../tpl-escape-2/output.lightningcss.js | 2 +- .../tests/fixture/tpl-escape-2/output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../tpl-placeholder-3-as-value/output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../transform-css-global/output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../transform-css-media-query/output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../transform-css-normal/output.swc.js | 2 +- .../output.lightningcss.js | 2 +- .../fixture/transform-css-nth-1/output.swc.js | 2 +- .../transform-css/output.lightningcss.js | 2 +- .../tests/fixture/transform-css/output.swc.js | 2 +- .../fixture/whitespace/output.lightningcss.js | 2 +- .../tests/fixture/whitespace/output.swc.js | 2 +- 143 files changed, 219 insertions(+), 219 deletions(-) diff --git a/packages/swc-magic/Cargo.toml b/packages/swc-magic/Cargo.toml index 19ed42d78..6a4f0b571 100644 --- a/packages/swc-magic/Cargo.toml +++ b/packages/swc-magic/Cargo.toml @@ -1,9 +1,9 @@ [package] authors = ["강동윤 "] -description = "SWC Plugin for styled-jsx" +description = "SWC Plugin for swc-magic" edition = "2021" license = "Apache-2.0" -name = "swc_plugin_styled_jsx" +name = "swc_plugin_swc_magic" publish = false version = "0.14.3" @@ -15,7 +15,7 @@ custom_transform = ["swc_common/concurrent"] [dependencies] easy-error = "1.0.0" -styled_jsx = { path = "./transform" } +swc_magic = { path = "./transform" } tracing = { version = "0.1.37", features = ["release_max_level_off"] } serde_json = "1" swc_common = "0.33.0" diff --git a/packages/swc-magic/package.json b/packages/swc-magic/package.json index 1a83d6ae4..0174aef72 100644 --- a/packages/swc-magic/package.json +++ b/packages/swc-magic/package.json @@ -1,10 +1,10 @@ { - "name": "@swc/plugin-styled-jsx", + "name": "@swc/plugin-swc-magic", "version": "1.5.92", - "description": "SWC plugin for styled-jsx", - "main": "swc_plugin_styled_jsx.wasm", + "description": "SWC plugin for swc-magic", + "main": "swc_plugin_swc_magic.wasm", "scripts": { - "prepack": "cp ../../target/wasm32-wasi/release/swc_plugin_styled_jsx.wasm ." + "prepack": "cp ../../target/wasm32-wasi/release/swc_plugin_swc_magic.wasm ." }, "homepage": "https://swc.rs", "repository": { diff --git a/packages/swc-magic/src/lib.rs b/packages/swc-magic/src/lib.rs index 3fa0bdc8e..ec504acee 100644 --- a/packages/swc-magic/src/lib.rs +++ b/packages/swc-magic/src/lib.rs @@ -1,24 +1,24 @@ #![allow(clippy::not_unsafe_ptr_arg_deref)] #![feature(box_patterns)] -use styled_jsx::{visitor, visitor::Config}; use swc_core::{ common::{sync::Lrc, FileName, SourceMap}, ecma::{ast::Program, visit::FoldWith}, plugin::{plugin_transform, proxies::TransformPluginProgramMetadata}, }; +use swc_magic::{visitor, visitor::Config}; #[plugin_transform] -fn styled_jsx_plugin(program: Program, data: TransformPluginProgramMetadata) -> Program { +fn swc_magic_plugin(program: Program, data: TransformPluginProgramMetadata) -> Program { let config = serde_json::from_str::( &data .get_transform_plugin_config() - .expect("failed to get plugin config for styled-jsx"), + .expect("failed to get plugin config for swc-magic"), ) - .expect("invalid config for styled-jsx"); + .expect("invalid config for swc-magic"); // TODO(kdy1): This is wrong, but it does not use cm let cm = Lrc::new(SourceMap::default()); - program.fold_with(&mut visitor::styled_jsx(cm, FileName::Anon, config)) + program.fold_with(&mut visitor::swc_magic(cm, FileName::Anon, config)) } diff --git a/packages/swc-magic/transform/Cargo.toml b/packages/swc-magic/transform/Cargo.toml index 9c753f4f8..fc6004fad 100644 --- a/packages/swc-magic/transform/Cargo.toml +++ b/packages/swc-magic/transform/Cargo.toml @@ -1,9 +1,9 @@ [package] authors = ["강동윤 "] -description = "AST transforms visitor for styled-jsx" +description = "AST transforms visitor for swc-magic" edition = "2021" license = "Apache-2.0" -name = "styled_jsx" +name = "swc_magic" version = "0.54.0" [features] diff --git a/packages/swc-magic/transform/src/style.rs b/packages/swc-magic/transform/src/style.rs index b3854fc53..f22fd8c24 100644 --- a/packages/swc-magic/transform/src/style.rs +++ b/packages/swc-magic/transform/src/style.rs @@ -15,7 +15,7 @@ pub struct LocalStyle { #[allow(clippy::vec_box)] pub expressions: Vec>, - /// If true, `format!("__styled-jsx-placeholder-{}__: 0", i)` is used. + /// If true, `format!("__swc-magic-placeholder-{}__: 0", i)` is used. pub is_expr_property: Vec, } diff --git a/packages/swc-magic/transform/src/transform_css_lightningcss.rs b/packages/swc-magic/transform/src/transform_css_lightningcss.rs index eac1322a4..0fc176e2a 100644 --- a/packages/swc-magic/transform/src/transform_css_lightningcss.rs +++ b/packages/swc-magic/transform/src/transform_css_lightningcss.rs @@ -164,7 +164,7 @@ pub fn transform_css( return Ok(string_literal_expr(&res.code)); } - let mut parts: Vec<&str> = res.code.split("__styled-jsx-placeholder-").collect(); + let mut parts: Vec<&str> = res.code.split("__swc-magic-placeholder-").collect(); let mut final_expressions = vec![]; for i in parts.iter_mut().skip(1) { let (num_len, expression_index) = read_number(i, &style_info.is_expr_property); diff --git a/packages/swc-magic/transform/src/transform_css_swc.rs b/packages/swc-magic/transform/src/transform_css_swc.rs index de9ea6638..bd0bf4e66 100644 --- a/packages/swc-magic/transform/src/transform_css_swc.rs +++ b/packages/swc-magic/transform/src/transform_css_swc.rs @@ -102,7 +102,7 @@ pub fn transform_css( return Ok(string_literal_expr(&s)); } - let mut parts: Vec<&str> = s.split("__styled-jsx-placeholder-").collect(); + let mut parts: Vec<&str> = s.split("__swc-magic-placeholder-").collect(); let mut final_expressions = vec![]; for i in parts.iter_mut().skip(1) { let (num_len, expression_index) = read_number(i); diff --git a/packages/swc-magic/transform/src/utils.rs b/packages/swc-magic/transform/src/utils.rs index 4b26a97eb..9ee0744f5 100644 --- a/packages/swc-magic/transform/src/utils.rs +++ b/packages/swc-magic/transform/src/utils.rs @@ -159,7 +159,7 @@ pub fn compute_class_names( (static_class_name, class_name_expr) } -pub fn make_external_styled_jsx_el(style: &ExternalStyle, style_import_name: &str) -> JSXElement { +pub fn make_external_swc_magic_el(style: &ExternalStyle, style_import_name: &str) -> JSXElement { let attrs = vec![JSXAttrOrSpread::JSXAttr(JSXAttr { name: JSXAttrName::Ident(Ident { sym: "id".into(), @@ -205,7 +205,7 @@ pub fn make_external_styled_jsx_el(style: &ExternalStyle, style_import_name: &st } } -pub fn make_local_styled_jsx_el( +pub fn make_local_swc_magic_el( style_info: &LocalStyle, css_expr: Expr, style_import_name: &str, @@ -295,7 +295,7 @@ pub fn get_usable_import_specifier(_items: &[ModuleItem]) -> String { String::from("_JSXStyle") } -pub fn styled_jsx_import_decl(style_import_name: &str) -> ModuleItem { +pub fn swc_magic_import_decl(style_import_name: &str) -> ModuleItem { ModuleItem::ModuleDecl(ModuleDecl::Import(ImportDecl { with: None, span: DUMMY_SP, @@ -310,7 +310,7 @@ pub fn styled_jsx_import_decl(style_import_name: &str) -> ModuleItem { })], src: Box::new(Str { span: DUMMY_SP, - value: "styled-jsx/style".into(), + value: "swc-magic/style".into(), raw: None, }), })) diff --git a/packages/swc-magic/transform/src/visitor.rs b/packages/swc-magic/transform/src/visitor.rs index 2196a35a9..d8058c427 100644 --- a/packages/swc-magic/transform/src/visitor.rs +++ b/packages/swc-magic/transform/src/visitor.rs @@ -20,8 +20,8 @@ use crate::{ style::{ExternalStyle, JSXStyle, LocalStyle}, utils::{ add, and, compute_class_names, get_usable_import_specifier, hash_string, ident, - is_capitalized, make_external_styled_jsx_el, make_local_styled_jsx_el, not_eq, or, - string_literal_expr, styled_jsx_import_decl, + is_capitalized, make_external_swc_magic_el, make_local_swc_magic_el, not_eq, or, + string_literal_expr, swc_magic_import_decl, }, }; @@ -32,7 +32,7 @@ pub struct Config { pub use_lightningcss: bool, } -pub fn styled_jsx(cm: Arc, file_name: FileName, config: Config) -> impl Fold { +pub fn swc_magic(cm: Arc, file_name: FileName, config: Config) -> impl Fold { let file_name = match file_name { FileName::Real(real_file_name) => real_file_name .to_str() @@ -47,8 +47,8 @@ pub fn styled_jsx(cm: Arc, file_name: FileName, config: Config) -> im styles: Default::default(), static_class_name: Default::default(), class_name: Default::default(), - file_has_styled_jsx: Default::default(), - has_styled_jsx: Default::default(), + file_has_swc_magic: Default::default(), + has_swc_magic: Default::default(), bindings: Default::default(), nearest_scope_bindings: Default::default(), func_scope_level: Default::default(), @@ -60,7 +60,7 @@ pub fn styled_jsx(cm: Arc, file_name: FileName, config: Config) -> im add_default_decl: Default::default(), in_function_params: Default::default(), evaluator: Default::default(), - visiting_styled_jsx_descendants: Default::default(), + visiting_swc_magic_descendants: Default::default(), } } @@ -72,8 +72,8 @@ struct StyledJSXTransformer { styles: Vec, static_class_name: Option, class_name: Option, - file_has_styled_jsx: bool, - has_styled_jsx: bool, + file_has_swc_magic: bool, + has_swc_magic: bool, bindings: AHashSet, nearest_scope_bindings: AHashSet, func_scope_level: u8, @@ -85,7 +85,7 @@ struct StyledJSXTransformer { add_default_decl: Option<(Id, Expr)>, in_function_params: bool, evaluator: Option, - visiting_styled_jsx_descendants: bool, + visiting_swc_magic_descendants: bool, } enum StyleExpr<'a> { @@ -96,21 +96,21 @@ enum StyleExpr<'a> { impl Fold for StyledJSXTransformer { fn fold_jsx_element(&mut self, el: JSXElement) -> JSXElement { - if is_styled_jsx(&el) { - if self.visiting_styled_jsx_descendants { + if is_swc_magic(&el) { + if self.visiting_swc_magic_descendants { HANDLER.with(|handler| { handler .struct_span_err( el.span, - "Detected nested styled-jsx tag.\nRead more: https://nextjs.org/docs/messages/nested-styled-jsx-tags", + "Detected nested swc-magic tag.\nRead more: https://nextjs.org/docs/messages/nested-swc-magic-tags", ) .emit() }); return el; } - let parent_has_styled_jsx = self.has_styled_jsx; - if !parent_has_styled_jsx && self.check_for_jsx_styles(Some(&el), &el.children).is_err() + let parent_has_swc_magic = self.has_swc_magic; + if !parent_has_swc_magic && self.check_for_jsx_styles(Some(&el), &el.children).is_err() { return el; } @@ -118,16 +118,16 @@ impl Fold for StyledJSXTransformer { Ok(el) => el, Err(_) => el, }; - if !parent_has_styled_jsx { + if !parent_has_swc_magic { self.reset_styles_state(); } return el; } - if self.has_styled_jsx { - self.visiting_styled_jsx_descendants = true; + if self.has_swc_magic { + self.visiting_swc_magic_descendants = true; let el = el.fold_children_with(self); - self.visiting_styled_jsx_descendants = false; + self.visiting_swc_magic_descendants = false; return el; } @@ -141,10 +141,10 @@ impl Fold for StyledJSXTransformer { } fn fold_jsx_fragment(&mut self, fragment: JSXFragment) -> JSXFragment { - if self.has_styled_jsx { - self.visiting_styled_jsx_descendants = true; + if self.has_swc_magic { + self.visiting_swc_magic_descendants = true; let fragment = fragment.fold_children_with(self); - self.visiting_styled_jsx_descendants = false; + self.visiting_swc_magic_descendants = false; return fragment; } @@ -158,7 +158,7 @@ impl Fold for StyledJSXTransformer { } fn fold_jsx_opening_element(&mut self, mut el: JSXOpeningElement) -> JSXOpeningElement { - if !self.has_styled_jsx { + if !self.has_swc_magic { return el; } @@ -214,7 +214,7 @@ impl Fold for StyledJSXTransformer { ref specifiers, .. } = decl; - if &src.value == "styled-jsx/css" { + if &src.value == "swc-magic/css" { for specifier in specifiers { match specifier { ImportSpecifier::Default(default_specifier) => { @@ -344,10 +344,10 @@ impl Fold for StyledJSXTransformer { } } - if self.file_has_styled_jsx || self.file_has_css_resolve { + if self.file_has_swc_magic || self.file_has_css_resolve { prepend_stmt( &mut new_items, - styled_jsx_import_decl(self.style_import_name.as_ref().unwrap()), + swc_magic_import_decl(self.style_import_name.as_ref().unwrap()), ); } @@ -432,8 +432,8 @@ impl StyledJSXTransformer { ) -> Result<(), Error> { let mut styles = vec![]; let mut process_style = |el: &JSXElement| { - self.file_has_styled_jsx = true; - self.has_styled_jsx = true; + self.file_has_swc_magic = true; + self.has_swc_magic = true; let expr = get_style_expr(el)?; let style_info = self.get_jsx_style(expr, is_global(el)); styles.insert(0, style_info); @@ -441,19 +441,19 @@ impl StyledJSXTransformer { Ok(()) }; - if el.is_some() && is_styled_jsx(el.unwrap()) { + if el.is_some() && is_swc_magic(el.unwrap()) { process_style(el.unwrap())?; } else { for i in children { if let JSXElementChild::JSXElement(child_el) = &i { - if is_styled_jsx(child_el) { + if is_swc_magic(child_el) { process_style(child_el)?; } } } }; - if self.has_styled_jsx { + if self.has_swc_magic { let (static_class_name, class_name) = compute_class_names(&styles, self.style_import_name.as_ref().unwrap()); self.styles = styles; @@ -505,10 +505,10 @@ impl StyledJSXTransformer { String::new() } else if self.config.use_lightningcss && before.ends_with([';', '{']) { is_expr_property.push(true); - format!("__styled-jsx-placeholder-{}__: 0", i) + format!("__swc-magic-placeholder-{}__: 0", i) } else { is_expr_property.push(false); - format!("__styled-jsx-placeholder-{}__", i) + format!("__swc-magic-placeholder-{}__", i) }; s.push_str(&quasis[i].raw); s.push_str(&placeholder); @@ -585,14 +585,14 @@ impl StyledJSXTransformer { )? }; - Ok(make_local_styled_jsx_el( + Ok(make_local_swc_magic_el( style_info, css, self.style_import_name.as_ref().unwrap(), self.static_class_name.as_ref(), )) } - JSXStyle::External(style) => Ok(make_external_styled_jsx_el( + JSXStyle::External(style) => Ok(make_external_swc_magic_el( style, self.style_import_name.as_ref().unwrap(), )), @@ -623,7 +623,7 @@ impl StyledJSXTransformer { prop: MemberProp::Ident(Ident { sym, .. }), .. }) => sym.to_string(), - _ => String::from("not_styled_jsx_tag"), + _ => String::from("not_swc_magic_tag"), }; let style = if let JSXStyle::Local(style) = &styles[0] { if tag != "resolve" { @@ -658,7 +658,7 @@ impl StyledJSXTransformer { span: DUMMY_SP, optional: false, }), - value: Box::new(Expr::JSXElement(Box::new(make_local_styled_jsx_el( + value: Box::new(Expr::JSXElement(Box::new(make_local_swc_magic_el( style, css, self.style_import_name.as_ref().unwrap(), @@ -693,14 +693,14 @@ impl StyledJSXTransformer { } fn reset_styles_state(&mut self) { - self.has_styled_jsx = false; + self.has_swc_magic = false; self.static_class_name = None; self.class_name = None; self.styles = vec![]; } } -fn is_styled_jsx(el: &JSXElement) -> bool { +fn is_swc_magic(el: &JSXElement) -> bool { if let JSXElementName::Ident(Ident { sym, .. }) = &el.opening.name { if sym != "style" { return false; @@ -762,13 +762,13 @@ fn get_style_expr(el: &JSXElement) -> Result { .struct_span_err( el.span, &format!( - "Expected one child under JSX style tag, but got {}.\nRead more: https://nextjs.org/docs/messages/invalid-styled-jsx-children", + "Expected one child under JSX style tag, but got {}.\nRead more: https://nextjs.org/docs/messages/invalid-swc-magic-children", non_whitespace_children.len() ), ) .emit() }); - bail!("styled-jsx style error"); + bail!("swc-magic style error"); } if let JSXElementChild::JSXExprContainer(JSXExprContainer { @@ -785,7 +785,7 @@ fn get_style_expr(el: &JSXElement) -> Result { handler .struct_span_err( el.span, - "Expected a template literal, string or identifier inside the JSXExpressionContainer.\nRead more: https://nextjs.org/docs/messages/invalid-styled-jsx-children", + "Expected a template literal, string or identifier inside the JSXExpressionContainer.\nRead more: https://nextjs.org/docs/messages/invalid-swc-magic-children", ) .emit() }); @@ -798,7 +798,7 @@ fn get_style_expr(el: &JSXElement) -> Result { handler .struct_span_err( el.span, - "Expected a single child of type JSXExpressionContainer under JSX Style tag.\nRead more: https://nextjs.org/docs/messages/invalid-styled-jsx-children", + "Expected a single child of type JSXExpressionContainer under JSX Style tag.\nRead more: https://nextjs.org/docs/messages/invalid-swc-magic-children", ) .emit() }); @@ -955,7 +955,7 @@ fn is_styled_css_import(item: &ModuleItem) -> bool { .. })) = item { - if value == "styled-jsx/css" { + if value == "swc-magic/css" { return true; } } diff --git a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.js b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.js index c23b0c2a4..b8e3f5f35 100644 --- a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.js +++ b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.js @@ -1,4 +1,4 @@ -import _JSXStyle from "styled-jsx/style"; +import _JSXStyle from "swc-magic/style"; const Component = ()=><>
    diff --git a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.stderr b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.stderr index 54a26813b..b68074784 100644 --- a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.stderr +++ b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.stderr @@ -1,6 +1,6 @@ - x Detected nested styled-jsx tag. - | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags + x Detected nested swc-magic tag. + | Read more: https://nextjs.org/docs/messages/nested-swc-magic-tags ,-[input.js:12:1] 12 | Welcome! 13 | @@ -8,8 +8,8 @@ 14 | `---- - x Detected nested styled-jsx tag. - | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags + x Detected nested swc-magic tag. + | Read more: https://nextjs.org/docs/messages/nested-swc-magic-tags ,-[input.js:20:1] 20 | Hello world! 21 | @@ -17,8 +17,8 @@ 22 | `---- - x Detected nested styled-jsx tag. - | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags + x Detected nested swc-magic tag. + | Read more: https://nextjs.org/docs/messages/nested-swc-magic-tags ,-[input.js:25:1] 25 | <> 26 | diff --git a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.js b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.js index c23b0c2a4..b8e3f5f35 100644 --- a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.js +++ b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.js @@ -1,4 +1,4 @@ -import _JSXStyle from "styled-jsx/style"; +import _JSXStyle from "swc-magic/style"; const Component = ()=><>
    diff --git a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.stderr b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.stderr index 54a26813b..b68074784 100644 --- a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.stderr +++ b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.stderr @@ -1,6 +1,6 @@ - x Detected nested styled-jsx tag. - | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags + x Detected nested swc-magic tag. + | Read more: https://nextjs.org/docs/messages/nested-swc-magic-tags ,-[input.js:12:1] 12 | Welcome! 13 | @@ -8,8 +8,8 @@ 14 | `---- - x Detected nested styled-jsx tag. - | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags + x Detected nested swc-magic tag. + | Read more: https://nextjs.org/docs/messages/nested-swc-magic-tags ,-[input.js:20:1] 20 | Hello world! 21 | @@ -17,8 +17,8 @@ 22 | `---- - x Detected nested styled-jsx tag. - | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags + x Detected nested swc-magic tag. + | Read more: https://nextjs.org/docs/messages/nested-swc-magic-tags ,-[input.js:25:1] 25 | <> 26 | diff --git a/packages/swc-magic/transform/tests/errors/nested-style-tags/output.js b/packages/swc-magic/transform/tests/errors/nested-style-tags/output.js index c23b0c2a4..b8e3f5f35 100644 --- a/packages/swc-magic/transform/tests/errors/nested-style-tags/output.js +++ b/packages/swc-magic/transform/tests/errors/nested-style-tags/output.js @@ -1,4 +1,4 @@ -import _JSXStyle from "styled-jsx/style"; +import _JSXStyle from "swc-magic/style"; const Component = ()=><>
    diff --git a/packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.js b/packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.js index 7a44789ae..b14b693b9 100644 --- a/packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.js +++ b/packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.js @@ -1,4 +1,4 @@ -import _JSXStyle from "styled-jsx/style"; +import _JSXStyle from "swc-magic/style"; export default (()=>
    - - -

    -
    -
    -

    - Welcome! - -

    - -
    -
    - -

    - Hello world! - -

    -
    -
    - <> - - - -
    - -) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.js b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.js deleted file mode 100644 index b8e3f5f35..000000000 --- a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.js +++ /dev/null @@ -1,58 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -const Component = ()=><> - -
    - - - - <_JSXStyle id={styles.__hash}>{styles} - - <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} - - - -

    <_JSXStyle id={"b3e1b6a7c9b96113"}>{""}

    - -
    - -
    - -

    - - Welcome! - - - -

    - - <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} - -
    - -
    - - <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} - -

    - - Hello world! - - - -

    - -
    - -
    - - <> - - - - - - <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} - -
    - - ; diff --git a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.stderr b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.stderr deleted file mode 100644 index b68074784..000000000 --- a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-lightningcss.stderr +++ /dev/null @@ -1,27 +0,0 @@ - - x Detected nested swc-magic tag. - | Read more: https://nextjs.org/docs/messages/nested-swc-magic-tags - ,-[input.js:12:1] - 12 | Welcome! - 13 | - : ^^^^^^^^^^^^^^^^^^^^^^^ - 14 | - `---- - - x Detected nested swc-magic tag. - | Read more: https://nextjs.org/docs/messages/nested-swc-magic-tags - ,-[input.js:20:1] - 20 | Hello world! - 21 | - : ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - 22 | - `---- - - x Detected nested swc-magic tag. - | Read more: https://nextjs.org/docs/messages/nested-swc-magic-tags - ,-[input.js:25:1] - 25 | <> - 26 | - : ^^^^^^^^^^^^^^^^^^^^^^^^^^^ - 27 | - `---- diff --git a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.js b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.js deleted file mode 100644 index b8e3f5f35..000000000 --- a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.js +++ /dev/null @@ -1,58 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -const Component = ()=><> - -
    - - - - <_JSXStyle id={styles.__hash}>{styles} - - <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} - - - -

    <_JSXStyle id={"b3e1b6a7c9b96113"}>{""}

    - -
    - -
    - -

    - - Welcome! - - - -

    - - <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} - -
    - -
    - - <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} - -

    - - Hello world! - - - -

    - -
    - -
    - - <> - - - - - - <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} - -
    - - ; diff --git a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.stderr b/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.stderr deleted file mode 100644 index b68074784..000000000 --- a/packages/swc-magic/transform/tests/errors/nested-style-tags/output-swc.stderr +++ /dev/null @@ -1,27 +0,0 @@ - - x Detected nested swc-magic tag. - | Read more: https://nextjs.org/docs/messages/nested-swc-magic-tags - ,-[input.js:12:1] - 12 | Welcome! - 13 | - : ^^^^^^^^^^^^^^^^^^^^^^^ - 14 | - `---- - - x Detected nested swc-magic tag. - | Read more: https://nextjs.org/docs/messages/nested-swc-magic-tags - ,-[input.js:20:1] - 20 | Hello world! - 21 | - : ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - 22 | - `---- - - x Detected nested swc-magic tag. - | Read more: https://nextjs.org/docs/messages/nested-swc-magic-tags - ,-[input.js:25:1] - 25 | <> - 26 | - : ^^^^^^^^^^^^^^^^^^^^^^^^^^^ - 27 | - `---- diff --git a/packages/swc-magic/transform/tests/errors/nested-style-tags/output.js b/packages/swc-magic/transform/tests/errors/nested-style-tags/output.js deleted file mode 100644 index b8e3f5f35..000000000 --- a/packages/swc-magic/transform/tests/errors/nested-style-tags/output.js +++ /dev/null @@ -1,58 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -const Component = ()=><> - -
    - - - - <_JSXStyle id={styles.__hash}>{styles} - - <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} - - - -

    <_JSXStyle id={"b3e1b6a7c9b96113"}>{""}

    - -
    - -
    - -

    - - Welcome! - - - -

    - - <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} - -
    - -
    - - <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} - -

    - - Hello world! - - - -

    - -
    - -
    - - <> - - - - - - <_JSXStyle id={"b3e1b6a7c9b96113"}>{""} - -
    - - ; diff --git a/packages/swc-magic/transform/tests/errors/no-child/input.js b/packages/swc-magic/transform/tests/errors/no-child/input.js deleted file mode 100644 index 9567d0ce5..000000000 --- a/packages/swc-magic/transform/tests/errors/no-child/input.js +++ /dev/null @@ -1,6 +0,0 @@ -export default () => ( -
    - -
    -) diff --git a/packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.js b/packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.js deleted file mode 100644 index b14b693b9..000000000 --- a/packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - - - -
    ); diff --git a/packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.stderr b/packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.stderr deleted file mode 100644 index 9e7cf6c6f..000000000 --- a/packages/swc-magic/transform/tests/errors/no-child/output-lightningcss.stderr +++ /dev/null @@ -1,9 +0,0 @@ - - x Expected one child under JSX style tag, but got 0. - | Read more: https://nextjs.org/docs/messages/invalid-swc-magic-children - ,-[input.js:2:1] - 2 |
    - 3 | ,-> - 5 |
    - `---- diff --git a/packages/swc-magic/transform/tests/errors/no-child/output-swc.js b/packages/swc-magic/transform/tests/errors/no-child/output-swc.js deleted file mode 100644 index b14b693b9..000000000 --- a/packages/swc-magic/transform/tests/errors/no-child/output-swc.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - - - -
    ); diff --git a/packages/swc-magic/transform/tests/errors/no-child/output-swc.stderr b/packages/swc-magic/transform/tests/errors/no-child/output-swc.stderr deleted file mode 100644 index 9e7cf6c6f..000000000 --- a/packages/swc-magic/transform/tests/errors/no-child/output-swc.stderr +++ /dev/null @@ -1,9 +0,0 @@ - - x Expected one child under JSX style tag, but got 0. - | Read more: https://nextjs.org/docs/messages/invalid-swc-magic-children - ,-[input.js:2:1] - 2 |
    - 3 | ,-> - 5 |
    - `---- diff --git a/packages/swc-magic/transform/tests/errors/no-child/output.js b/packages/swc-magic/transform/tests/errors/no-child/output.js deleted file mode 100644 index b14b693b9..000000000 --- a/packages/swc-magic/transform/tests/errors/no-child/output.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - - - -
    ); diff --git a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/input.js b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/input.js deleted file mode 100644 index 5486b86c0..000000000 --- a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/input.js +++ /dev/null @@ -1,10 +0,0 @@ -import css from 'swc-magic/css' - -export default css.resolve` - .container { - background: #000; - color: white; - font-weight: 700; - height: 100px; - } -` \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-lightningcss.js b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-lightningcss.js deleted file mode 100644 index 178b4967d..000000000 --- a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-lightningcss.js +++ /dev/null @@ -1,5 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default { - styles: <_JSXStyle id={"71f03d42ea0ec6"}>{".container.jsx-71f03d42ea0ec6{color:#fff;background:#000;height:100px;font-weight:700}"}, - className: "jsx-71f03d42ea0ec6" -}; diff --git a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-lightningcss.stderr b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-lightningcss.stderr deleted file mode 100644 index ad7185a0b..000000000 --- a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-lightningcss.stderr +++ /dev/null @@ -1,2 +0,0 @@ - - x /some-project/src/some-file.ts uses `css.resolve`, but ends with `.ts`. The file extension needs to be `.tsx` so that the jsx injected by `css.resolve` will be transformed. diff --git a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-swc.js b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-swc.js deleted file mode 100644 index ae169db09..000000000 --- a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-swc.js +++ /dev/null @@ -1,5 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default { - styles: <_JSXStyle id={"71f03d42ea0ec6"}>{".container.jsx-71f03d42ea0ec6{background:#000;color:white;font-weight:700;height:100px}"}, - className: "jsx-71f03d42ea0ec6" -}; diff --git a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-swc.stderr b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-swc.stderr deleted file mode 100644 index ad7185a0b..000000000 --- a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output-swc.stderr +++ /dev/null @@ -1,2 +0,0 @@ - - x /some-project/src/some-file.ts uses `css.resolve`, but ends with `.ts`. The file extension needs to be `.tsx` so that the jsx injected by `css.resolve` will be transformed. diff --git a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output.js b/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output.js deleted file mode 100644 index ae169db09..000000000 --- a/packages/swc-magic/transform/tests/errors/ts-with-css-resolve/output.js +++ /dev/null @@ -1,5 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default { - styles: <_JSXStyle id={"71f03d42ea0ec6"}>{".container.jsx-71f03d42ea0ec6{background:#000;color:white;font-weight:700;height:100px}"}, - className: "jsx-71f03d42ea0ec6" -}; diff --git a/packages/swc-magic/transform/tests/errors/two-children/input.js b/packages/swc-magic/transform/tests/errors/two-children/input.js deleted file mode 100644 index a8edd5afd..000000000 --- a/packages/swc-magic/transform/tests/errors/two-children/input.js +++ /dev/null @@ -1,8 +0,0 @@ -export default () => ( -
    - -
    -) diff --git a/packages/swc-magic/transform/tests/errors/two-children/output-lightningcss.js b/packages/swc-magic/transform/tests/errors/two-children/output-lightningcss.js deleted file mode 100644 index 3dd7eb8db..000000000 --- a/packages/swc-magic/transform/tests/errors/two-children/output-lightningcss.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - - - -
    ); diff --git a/packages/swc-magic/transform/tests/errors/two-children/output-lightningcss.stderr b/packages/swc-magic/transform/tests/errors/two-children/output-lightningcss.stderr deleted file mode 100644 index 6d5b66452..000000000 --- a/packages/swc-magic/transform/tests/errors/two-children/output-lightningcss.stderr +++ /dev/null @@ -1,11 +0,0 @@ - - x Expected one child under JSX style tag, but got 2. - | Read more: https://nextjs.org/docs/messages/invalid-swc-magic-children - ,-[input.js:2:1] - 2 |
    - 3 | ,-> - 7 |
    - `---- diff --git a/packages/swc-magic/transform/tests/errors/two-children/output-swc.js b/packages/swc-magic/transform/tests/errors/two-children/output-swc.js deleted file mode 100644 index 3dd7eb8db..000000000 --- a/packages/swc-magic/transform/tests/errors/two-children/output-swc.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - - - -
    ); diff --git a/packages/swc-magic/transform/tests/errors/two-children/output-swc.stderr b/packages/swc-magic/transform/tests/errors/two-children/output-swc.stderr deleted file mode 100644 index 6d5b66452..000000000 --- a/packages/swc-magic/transform/tests/errors/two-children/output-swc.stderr +++ /dev/null @@ -1,11 +0,0 @@ - - x Expected one child under JSX style tag, but got 2. - | Read more: https://nextjs.org/docs/messages/invalid-swc-magic-children - ,-[input.js:2:1] - 2 |
    - 3 | ,-> - 7 |
    - `---- diff --git a/packages/swc-magic/transform/tests/errors/two-children/output.js b/packages/swc-magic/transform/tests/errors/two-children/output.js deleted file mode 100644 index 3dd7eb8db..000000000 --- a/packages/swc-magic/transform/tests/errors/two-children/output.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - - - -
    ); diff --git a/packages/swc-magic/transform/tests/errors/wrong-child-type/input.js b/packages/swc-magic/transform/tests/errors/wrong-child-type/input.js deleted file mode 100644 index 9e1613eb4..000000000 --- a/packages/swc-magic/transform/tests/errors/wrong-child-type/input.js +++ /dev/null @@ -1,7 +0,0 @@ -export default () => ( -
    - -
    -) diff --git a/packages/swc-magic/transform/tests/errors/wrong-child-type/output-lightningcss.js b/packages/swc-magic/transform/tests/errors/wrong-child-type/output-lightningcss.js deleted file mode 100644 index 2d2c28bfa..000000000 --- a/packages/swc-magic/transform/tests/errors/wrong-child-type/output-lightningcss.js +++ /dev/null @@ -1,10 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - - - -
    ); diff --git a/packages/swc-magic/transform/tests/errors/wrong-child-type/output-lightningcss.stderr b/packages/swc-magic/transform/tests/errors/wrong-child-type/output-lightningcss.stderr deleted file mode 100644 index 4731f1762..000000000 --- a/packages/swc-magic/transform/tests/errors/wrong-child-type/output-lightningcss.stderr +++ /dev/null @@ -1,10 +0,0 @@ - - x Expected a single child of type JSXExpressionContainer under JSX Style tag. - | Read more: https://nextjs.org/docs/messages/invalid-swc-magic-children - ,-[input.js:2:1] - 2 |
    - 3 | ,-> - 6 |
    - `---- diff --git a/packages/swc-magic/transform/tests/errors/wrong-child-type/output-swc.js b/packages/swc-magic/transform/tests/errors/wrong-child-type/output-swc.js deleted file mode 100644 index 2d2c28bfa..000000000 --- a/packages/swc-magic/transform/tests/errors/wrong-child-type/output-swc.js +++ /dev/null @@ -1,10 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - - - -
    ); diff --git a/packages/swc-magic/transform/tests/errors/wrong-child-type/output-swc.stderr b/packages/swc-magic/transform/tests/errors/wrong-child-type/output-swc.stderr deleted file mode 100644 index 4731f1762..000000000 --- a/packages/swc-magic/transform/tests/errors/wrong-child-type/output-swc.stderr +++ /dev/null @@ -1,10 +0,0 @@ - - x Expected a single child of type JSXExpressionContainer under JSX Style tag. - | Read more: https://nextjs.org/docs/messages/invalid-swc-magic-children - ,-[input.js:2:1] - 2 |
    - 3 | ,-> - 6 |
    - `---- diff --git a/packages/swc-magic/transform/tests/errors/wrong-child-type/output.js b/packages/swc-magic/transform/tests/errors/wrong-child-type/output.js deleted file mode 100644 index 2d2c28bfa..000000000 --- a/packages/swc-magic/transform/tests/errors/wrong-child-type/output.js +++ /dev/null @@ -1,10 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - - - -
    ); diff --git a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/input.js b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/input.js deleted file mode 100644 index 332f22bf5..000000000 --- a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/input.js +++ /dev/null @@ -1,7 +0,0 @@ -export default () => ( -
    - -
    -) diff --git a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-lightningcss.js b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-lightningcss.js deleted file mode 100644 index 24f77e761..000000000 --- a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-lightningcss.js +++ /dev/null @@ -1,10 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - - - -
    ); diff --git a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-lightningcss.stderr b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-lightningcss.stderr deleted file mode 100644 index efe095192..000000000 --- a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-lightningcss.stderr +++ /dev/null @@ -1,10 +0,0 @@ - - x Expected a template literal, string or identifier inside the JSXExpressionContainer. - | Read more: https://nextjs.org/docs/messages/invalid-swc-magic-children - ,-[input.js:2:1] - 2 |
    - 3 | ,-> - 6 |
    - `---- diff --git a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-swc.js b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-swc.js deleted file mode 100644 index 24f77e761..000000000 --- a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-swc.js +++ /dev/null @@ -1,10 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - - - -
    ); diff --git a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-swc.stderr b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-swc.stderr deleted file mode 100644 index efe095192..000000000 --- a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output-swc.stderr +++ /dev/null @@ -1,10 +0,0 @@ - - x Expected a template literal, string or identifier inside the JSXExpressionContainer. - | Read more: https://nextjs.org/docs/messages/invalid-swc-magic-children - ,-[input.js:2:1] - 2 |
    - 3 | ,-> - 6 |
    - `---- diff --git a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output.js b/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output.js deleted file mode 100644 index 24f77e761..000000000 --- a/packages/swc-magic/transform/tests/errors/wrong-jsx-expression-type/output.js +++ /dev/null @@ -1,10 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - - - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture-swc-only/next-55679/input.js b/packages/swc-magic/transform/tests/fixture-swc-only/next-55679/input.js deleted file mode 100644 index 9506357f0..000000000 --- a/packages/swc-magic/transform/tests/fixture-swc-only/next-55679/input.js +++ /dev/null @@ -1,17 +0,0 @@ -import { AppProps } from "next/app"; - -const someVar = "--var-1"; - -export default function App({ Component, pageProps }) { - return ( - <> - - - - ); -} \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture-swc-only/next-55679/output.swc.js b/packages/swc-magic/transform/tests/fixture-swc-only/next-55679/output.swc.js deleted file mode 100644 index 732bc3457..000000000 --- a/packages/swc-magic/transform/tests/fixture-swc-only/next-55679/output.swc.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import { AppProps } from "next/app"; -const someVar = "--var-1"; -export default function App({ Component, pageProps }) { - return <> - - <_JSXStyle id={"e26e4619775cb212"}>{`:root{${someVar}:red;background-color:var(${someVar})}`} - - - - ; -} diff --git a/packages/swc-magic/transform/tests/fixture.rs b/packages/swc-magic/transform/tests/fixture.rs deleted file mode 100644 index 5ddac6ba1..000000000 --- a/packages/swc-magic/transform/tests/fixture.rs +++ /dev/null @@ -1,137 +0,0 @@ -use std::path::PathBuf; - -use swc_common::{chain, FileName, Mark, Span, DUMMY_SP}; -use swc_ecma_parser::{EsConfig, Syntax}; -use swc_ecma_transforms::resolver; -use swc_ecma_transforms_testing::{test_fixture, FixtureTestConfig}; -use swc_magic::visitor::swc_magic; -use testing::fixture; - -fn syntax() -> Syntax { - Syntax::Es(EsConfig { - jsx: true, - ..Default::default() - }) -} - -fn run(input: PathBuf, use_lightningcss: bool) { - let output = input.parent().unwrap().join(if use_lightningcss { - "output.lightningcss.js" - } else { - "output.swc.js" - }); - - test_fixture( - syntax(), - &|t| { - chain!( - resolver(Mark::new(), Mark::new(), false), - swc_magic( - t.cm.clone(), - FileName::Real(PathBuf::from("/some-project/src/some-file.js")), - swc_magic::visitor::Config { use_lightningcss } - ) - ) - }, - &input, - &output, - Default::default(), - ); - - test_fixture( - syntax(), - &|t| { - // `resolver` uses `Mark` which is stored in a thread-local storage (namely - // swc_common::GLOBALS), and this loop will make `Mark` to be different from the - // invocation above. - // - // 1000 is used because in future I (kdy1) may optimize logic of resolver. - for _ in 0..1000 { - let _mark = Mark::fresh(Mark::root()); - } - - chain!( - resolver(Mark::new(), Mark::new(), false), - swc_magic( - t.cm.clone(), - FileName::Real(PathBuf::from("/some-project/src/some-file.js")), - swc_magic::visitor::Config { use_lightningcss } - ) - ) - }, - &input, - &output, - Default::default(), - ); -} - -#[fixture("tests/fixture/**/input.js")] -fn swc_magic_fixture_lightningcs(input: PathBuf) { - run(input, true); -} - -#[fixture("tests/fixture-swc-only/**/input.js")] -#[fixture("tests/fixture/**/input.js")] -fn swc_magic_fixture_swc(input: PathBuf) { - run(input, false); -} - -pub struct DropSpan; -impl swc_ecma_visit::VisitMut for DropSpan { - fn visit_mut_span(&mut self, span: &mut Span) { - *span = DUMMY_SP - } -} - -#[fixture("tests/errors/**/input.js")] -fn swc_magic_errors(input: PathBuf) { - let file_name = match input.to_str().unwrap().contains("ts-with-css-resolve") { - true => FileName::Real(PathBuf::from("/some-project/src/some-file.ts")), - false => FileName::Real(PathBuf::from("/some-project/src/some-file.js")), - }; - { - let output = input.parent().unwrap().join("output-swc.js"); - - test_fixture( - syntax(), - &|t| { - swc_magic( - t.cm.clone(), - file_name.clone(), - swc_magic::visitor::Config { - use_lightningcss: false, - }, - ) - }, - &input, - &output, - FixtureTestConfig { - allow_error: true, - ..Default::default() - }, - ); - } - - { - let output = input.parent().unwrap().join("output-lightningcss.js"); - - test_fixture( - syntax(), - &|t| { - swc_magic( - t.cm.clone(), - file_name.clone(), - swc_magic::visitor::Config { - use_lightningcss: true, - }, - ) - }, - &input, - &output, - FixtureTestConfig { - allow_error: true, - ..Default::default() - }, - ); - } -} diff --git a/packages/swc-magic/transform/tests/fixture/.expressions/input.js b/packages/swc-magic/transform/tests/fixture/.expressions/input.js deleted file mode 100644 index d7c579f19..000000000 --- a/packages/swc-magic/transform/tests/fixture/.expressions/input.js +++ /dev/null @@ -1,90 +0,0 @@ -const darken = c => c -const color = 'red' -const otherColor = 'green' -const mediumScreen = '680px' -const animationDuration = '200ms' -const animationName = 'my-cool-animation' -const obj = { display: 'block' } - -export default ({ display }) => ( -
    -

    test

    - - - - - // TODO: the next two should have the same hash - - - - - - - - - - // TODO: causes bad syntax - {/* */} -
    -) diff --git a/packages/swc-magic/transform/tests/fixture/absent/input.js b/packages/swc-magic/transform/tests/fixture/absent/input.js deleted file mode 100644 index bb4af7a54..000000000 --- a/packages/swc-magic/transform/tests/fixture/absent/input.js +++ /dev/null @@ -1,6 +0,0 @@ -const a = () => ( -
    -

    hi

    - -
    -) diff --git a/packages/swc-magic/transform/tests/fixture/absent/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/absent/output.lightningcss.js deleted file mode 100644 index 8509dbdde..000000000 --- a/packages/swc-magic/transform/tests/fixture/absent/output.lightningcss.js +++ /dev/null @@ -1,7 +0,0 @@ -const a = ()=>
    - -

    hi

    - - - -
    ; diff --git a/packages/swc-magic/transform/tests/fixture/absent/output.swc.js b/packages/swc-magic/transform/tests/fixture/absent/output.swc.js deleted file mode 100644 index 8509dbdde..000000000 --- a/packages/swc-magic/transform/tests/fixture/absent/output.swc.js +++ /dev/null @@ -1,7 +0,0 @@ -const a = ()=>
    - -

    hi

    - - - -
    ; diff --git a/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/input.js b/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/input.js deleted file mode 100644 index 47691510e..000000000 --- a/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/input.js +++ /dev/null @@ -1,55 +0,0 @@ -export default () => { - const Element = 'div' - return ( -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    - - - - -
    - ) -} diff --git a/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/output.lightningcss.js deleted file mode 100644 index c96ca30e6..000000000 --- a/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/output.lightningcss.js +++ /dev/null @@ -1,112 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>{ - const Element = 'div'; - return
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - - - - - - - - <_JSXStyle id={"abb4c2202db1a207"}>{"div.jsx-abb4c2202db1a207{color:red}"} - -
    ; -}); diff --git a/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/output.swc.js b/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/output.swc.js deleted file mode 100644 index c96ca30e6..000000000 --- a/packages/swc-magic/transform/tests/fixture/attribute-generation-classname-rewriting/output.swc.js +++ /dev/null @@ -1,112 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>{ - const Element = 'div'; - return
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - -
    - - - - - - - - <_JSXStyle id={"abb4c2202db1a207"}>{"div.jsx-abb4c2202db1a207{color:red}"} - -
    ; -}); diff --git a/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/input.js b/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/input.js deleted file mode 100644 index 1454a4c30..000000000 --- a/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/input.js +++ /dev/null @@ -1,166 +0,0 @@ -import styles from './styles' - -const styles2 = require('./styles2') - -// external only -export const Test1 = () => ( -
    -

    external only

    - - -
    -) - -// external and static -export const Test2 = () => ( -
    -

    external and static

    - - -
    -) - -// external and dynamic -export const Test3 = ({ color }) => ( -
    -

    external and dynamic

    - - -
    -) - -// external, static and dynamic -export const Test4 = ({ color }) => ( -
    -

    external, static and dynamic

    - - - -
    -) - -// static only -export const Test5 = () => ( -
    -

    static only

    - - -
    -) - -// static and dynamic -export const Test6 = ({ color }) => ( -
    -

    static and dynamic

    - - -
    -) - -// dynamic only -export const Test7 = ({ color }) => ( -
    -

    dynamic only

    - -
    -) - -// dynamic with scoped compound variable -export const Test8 = ({ color }) => { - if (color) { - const innerProps = { color } - - return ( -
    -

    dynamic with scoped compound variable

    - -
    - ) - } -} - -// dynamic with compound variable -export const Test9 = ({ color }) => { - const innerProps = { color } - - return ( -
    -

    dynamic with compound variable

    - -
    - ) -} - -const foo = 'red' - -// dynamic with constant variable -export const Test10 = () => ( -
    -

    dynamic with constant variable

    - -
    -) - -// dynamic with complex scope -export const Test11 = ({ color }) => { - const items = Array.from({ length: 5 }).map((item, i) => ( -
  • - - Item #{i + 1} -
    • - )) - - return
      {items}
    -} diff --git a/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/output.lightningcss.js deleted file mode 100644 index b6b390fdd..000000000 --- a/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/output.lightningcss.js +++ /dev/null @@ -1,228 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import styles from './styles'; -const styles2 = require('./styles2'); -// external only -export const Test1 = ()=>
    - -

    external only

    - - <_JSXStyle id={styles.__hash}>{styles} - - <_JSXStyle id={styles2.__hash}>{styles2} - -
    ; -// external and static -export const Test2 = ()=>
    - -

    external and static

    - - <_JSXStyle id={"81a68341e430a972"}>{"p.jsx-81a68341e430a972{color:red}"} - - <_JSXStyle id={styles.__hash}>{styles} - -
    ; -// external and dynamic -export const Test3 = ({ color })=>
    - -

    external and dynamic

    - - <_JSXStyle id={"9c31b4e09db208f"} dynamic={[ - color - ]}>{`p.__jsx-style-dynamic-selector{color:${color}}`} - - <_JSXStyle id={styles.__hash}>{styles} - -
    ; -// external, static and dynamic -export const Test4 = ({ color })=>
    - -

    external, static and dynamic

    - - <_JSXStyle id={"ceba8c9ce34e3d0c"}>{"p.jsx-ceba8c9ce34e3d0c{display:inline-block}"} - - <_JSXStyle id={"1539cc167dc1aeca"} dynamic={[ - color - ]}>{`p.__jsx-style-dynamic-selector{color:${color}}`} - - <_JSXStyle id={styles.__hash}>{styles} - -
    ; -// static only -export const Test5 = ()=>
    - -

    static only

    - - <_JSXStyle id={"ceba8c9ce34e3d0c"}>{"p.jsx-df0159ebd3f9fb6f{display:inline-block}"} - - <_JSXStyle id={"81a68341e430a972"}>{"p.jsx-df0159ebd3f9fb6f{color:red}"} - -
    ; -// static and dynamic -export const Test6 = ({ color })=>
    - -

    static and dynamic

    - - <_JSXStyle id={"ceba8c9ce34e3d0c"}>{"p.jsx-ceba8c9ce34e3d0c{display:inline-block}"} - - <_JSXStyle id={"1539cc167dc1aeca"} dynamic={[ - color - ]}>{`p.__jsx-style-dynamic-selector{color:${color}}`} - -
    ; -// dynamic only -export const Test7 = ({ color })=>
    - -

    dynamic only

    - - <_JSXStyle id={"9c31b4e09db208f"} dynamic={[ - color - ]}>{`p.__jsx-style-dynamic-selector{color:${color}}`} - -
    ; -// dynamic with scoped compound variable -export const Test8 = ({ color })=>{ - if (color) { - const innerProps = { - color - }; - return
    - -

    dynamic with scoped compound variable

    - - <_JSXStyle id={"ce96f6fd3314e56c"} dynamic={[ - innerProps.color - ]}>{`p.__jsx-style-dynamic-selector{color:${innerProps.color}}`} - -
    ; - } -}; -// dynamic with compound variable -export const Test9 = ({ color })=>{ - const innerProps = { - color - }; - return
    - -

    dynamic with compound variable

    - - <_JSXStyle id={"af2545654d3cb2ee"} dynamic={[ - innerProps.color - ]}>{`p.__jsx-style-dynamic-selector{color:${innerProps.color}}`} - -
    ; -}; -const foo = 'red'; -// dynamic with constant variable -export const Test10 = ()=>
    - -

    dynamic with constant variable

    - - <_JSXStyle id={"cbdf2f44af4108bd"}>{`p.jsx-cbdf2f44af4108bd{color:${foo}}`} - -
    ; -// dynamic with complex scope -export const Test11 = ({ color })=>{ - const items = Array.from({ - length: 5 - }).map((item, i)=>
  • - - <_JSXStyle id={"4c662a3c1ebc397e"} dynamic={[ - color - ]}>{`.item.__jsx-style-dynamic-selector{color:${color}}`} - - Item #{i + 1} - -
    • ); - return
      {items}
    ; -}; diff --git a/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/output.swc.js b/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/output.swc.js deleted file mode 100644 index b6b390fdd..000000000 --- a/packages/swc-magic/transform/tests/fixture/attribute-generation-modes/output.swc.js +++ /dev/null @@ -1,228 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import styles from './styles'; -const styles2 = require('./styles2'); -// external only -export const Test1 = ()=>
    - -

    external only

    - - <_JSXStyle id={styles.__hash}>{styles} - - <_JSXStyle id={styles2.__hash}>{styles2} - -
    ; -// external and static -export const Test2 = ()=>
    - -

    external and static

    - - <_JSXStyle id={"81a68341e430a972"}>{"p.jsx-81a68341e430a972{color:red}"} - - <_JSXStyle id={styles.__hash}>{styles} - -
    ; -// external and dynamic -export const Test3 = ({ color })=>
    - -

    external and dynamic

    - - <_JSXStyle id={"9c31b4e09db208f"} dynamic={[ - color - ]}>{`p.__jsx-style-dynamic-selector{color:${color}}`} - - <_JSXStyle id={styles.__hash}>{styles} - -
    ; -// external, static and dynamic -export const Test4 = ({ color })=>
    - -

    external, static and dynamic

    - - <_JSXStyle id={"ceba8c9ce34e3d0c"}>{"p.jsx-ceba8c9ce34e3d0c{display:inline-block}"} - - <_JSXStyle id={"1539cc167dc1aeca"} dynamic={[ - color - ]}>{`p.__jsx-style-dynamic-selector{color:${color}}`} - - <_JSXStyle id={styles.__hash}>{styles} - -
    ; -// static only -export const Test5 = ()=>
    - -

    static only

    - - <_JSXStyle id={"ceba8c9ce34e3d0c"}>{"p.jsx-df0159ebd3f9fb6f{display:inline-block}"} - - <_JSXStyle id={"81a68341e430a972"}>{"p.jsx-df0159ebd3f9fb6f{color:red}"} - -
    ; -// static and dynamic -export const Test6 = ({ color })=>
    - -

    static and dynamic

    - - <_JSXStyle id={"ceba8c9ce34e3d0c"}>{"p.jsx-ceba8c9ce34e3d0c{display:inline-block}"} - - <_JSXStyle id={"1539cc167dc1aeca"} dynamic={[ - color - ]}>{`p.__jsx-style-dynamic-selector{color:${color}}`} - -
    ; -// dynamic only -export const Test7 = ({ color })=>
    - -

    dynamic only

    - - <_JSXStyle id={"9c31b4e09db208f"} dynamic={[ - color - ]}>{`p.__jsx-style-dynamic-selector{color:${color}}`} - -
    ; -// dynamic with scoped compound variable -export const Test8 = ({ color })=>{ - if (color) { - const innerProps = { - color - }; - return
    - -

    dynamic with scoped compound variable

    - - <_JSXStyle id={"ce96f6fd3314e56c"} dynamic={[ - innerProps.color - ]}>{`p.__jsx-style-dynamic-selector{color:${innerProps.color}}`} - -
    ; - } -}; -// dynamic with compound variable -export const Test9 = ({ color })=>{ - const innerProps = { - color - }; - return
    - -

    dynamic with compound variable

    - - <_JSXStyle id={"af2545654d3cb2ee"} dynamic={[ - innerProps.color - ]}>{`p.__jsx-style-dynamic-selector{color:${innerProps.color}}`} - -
    ; -}; -const foo = 'red'; -// dynamic with constant variable -export const Test10 = ()=>
    - -

    dynamic with constant variable

    - - <_JSXStyle id={"cbdf2f44af4108bd"}>{`p.jsx-cbdf2f44af4108bd{color:${foo}}`} - -
    ; -// dynamic with complex scope -export const Test11 = ({ color })=>{ - const items = Array.from({ - length: 5 - }).map((item, i)=>
  • - - <_JSXStyle id={"4c662a3c1ebc397e"} dynamic={[ - color - ]}>{`.item.__jsx-style-dynamic-selector{color:${color}}`} - - Item #{i + 1} - -
    • ); - return
      {items}
    ; -}; diff --git a/packages/swc-magic/transform/tests/fixture/class/input.js b/packages/swc-magic/transform/tests/fixture/class/input.js deleted file mode 100644 index 7488d661b..000000000 --- a/packages/swc-magic/transform/tests/fixture/class/input.js +++ /dev/null @@ -1,14 +0,0 @@ -export default class { - render() { - return ( -
    -

    test

    - -
    - ) - } -} diff --git a/packages/swc-magic/transform/tests/fixture/class/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/class/output.lightningcss.js deleted file mode 100644 index 81649ca49..000000000 --- a/packages/swc-magic/transform/tests/fixture/class/output.lightningcss.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"b2b86d63f35d25ee"}>{"p.jsx-b2b86d63f35d25ee{color:red}"} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/class/output.swc.js b/packages/swc-magic/transform/tests/fixture/class/output.swc.js deleted file mode 100644 index 81649ca49..000000000 --- a/packages/swc-magic/transform/tests/fixture/class/output.swc.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"b2b86d63f35d25ee"}>{"p.jsx-b2b86d63f35d25ee{color:red}"} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/comments/input.js b/packages/swc-magic/transform/tests/fixture/comments/input.js deleted file mode 100644 index 0ba7a1877..000000000 --- a/packages/swc-magic/transform/tests/fixture/comments/input.js +++ /dev/null @@ -1,18 +0,0 @@ -export default class { - render() { - return ( -
    -

    test

    - -
    - ) - } -} diff --git a/packages/swc-magic/transform/tests/fixture/comments/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/comments/output.lightningcss.js deleted file mode 100644 index ad10bdde1..000000000 --- a/packages/swc-magic/transform/tests/fixture/comments/output.lightningcss.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"1952086b0a5ae64c"}>{"p.jsx-1952086b0a5ae64c{color:red}"} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/comments/output.swc.js b/packages/swc-magic/transform/tests/fixture/comments/output.swc.js deleted file mode 100644 index ad10bdde1..000000000 --- a/packages/swc-magic/transform/tests/fixture/comments/output.swc.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"1952086b0a5ae64c"}>{"p.jsx-1952086b0a5ae64c{color:red}"} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/component-attribute/input.js b/packages/swc-magic/transform/tests/fixture/component-attribute/input.js deleted file mode 100644 index 7531db885..000000000 --- a/packages/swc-magic/transform/tests/fixture/component-attribute/input.js +++ /dev/null @@ -1,11 +0,0 @@ -const Test = () => ( -
    - test - - -
    -) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/component-attribute/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/component-attribute/output.lightningcss.js deleted file mode 100644 index 3d872db8f..000000000 --- a/packages/swc-magic/transform/tests/fixture/component-attribute/output.lightningcss.js +++ /dev/null @@ -1,10 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -const Test = ()=>
    - - test - - - - <_JSXStyle id={"a9535d7d5f32c3c4"}>{"span.jsx-a9535d7d5f32c3c4{color:red}"} - -
    ; diff --git a/packages/swc-magic/transform/tests/fixture/component-attribute/output.swc.js b/packages/swc-magic/transform/tests/fixture/component-attribute/output.swc.js deleted file mode 100644 index 3d872db8f..000000000 --- a/packages/swc-magic/transform/tests/fixture/component-attribute/output.swc.js +++ /dev/null @@ -1,10 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -const Test = ()=>
    - - test - - - - <_JSXStyle id={"a9535d7d5f32c3c4"}>{"span.jsx-a9535d7d5f32c3c4{color:red}"} - -
    ; diff --git a/packages/swc-magic/transform/tests/fixture/conflicts/input.js b/packages/swc-magic/transform/tests/fixture/conflicts/input.js deleted file mode 100644 index ba7ab50bf..000000000 --- a/packages/swc-magic/transform/tests/fixture/conflicts/input.js +++ /dev/null @@ -1,16 +0,0 @@ - -// TODO - -// export const _JSXStyle = '_JSXStyle-literal' -// export default function() { -// return ( -//
    -//

    test

    -// -//
    -// ) -// } diff --git a/packages/swc-magic/transform/tests/fixture/conflicts/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/conflicts/output.lightningcss.js deleted file mode 100644 index 874cf34f5..000000000 --- a/packages/swc-magic/transform/tests/fixture/conflicts/output.lightningcss.js +++ /dev/null @@ -1,14 +0,0 @@ -// TODO -// export const _JSXStyle = '_JSXStyle-literal' -// export default function() { -// return ( -//
    -//

    test

    -// -//
    -// ) -// } diff --git a/packages/swc-magic/transform/tests/fixture/conflicts/output.swc.js b/packages/swc-magic/transform/tests/fixture/conflicts/output.swc.js deleted file mode 100644 index 874cf34f5..000000000 --- a/packages/swc-magic/transform/tests/fixture/conflicts/output.swc.js +++ /dev/null @@ -1,14 +0,0 @@ -// TODO -// export const _JSXStyle = '_JSXStyle-literal' -// export default function() { -// return ( -//
    -//

    test

    -// -//
    -// ) -// } diff --git a/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/input.js b/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/input.js deleted file mode 100644 index a2e54d09b..000000000 --- a/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/input.js +++ /dev/null @@ -1,18 +0,0 @@ -function NavigationItem({ - active, - className, -}) { - return ( - - - - ); -} - -export default NavigationItem; \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/output.lightningcss.js deleted file mode 100644 index 373108f7c..000000000 --- a/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/output.lightningcss.js +++ /dev/null @@ -1,11 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -function NavigationItem({ active, className }) { - return - - <_JSXStyle id={"2342aae4628612c6"}>{'.navigation-item.jsx-2342aae4628612c6 a:after{content:attr(data-text);content:attr(data-text)/""}'} - - ; -} -export default NavigationItem; diff --git a/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/output.swc.js b/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/output.swc.js deleted file mode 100644 index 064785b4e..000000000 --- a/packages/swc-magic/transform/tests/fixture/css-selector-after-pseudo/output.swc.js +++ /dev/null @@ -1,11 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -function NavigationItem({ active, className }) { - return - - <_JSXStyle id={"2342aae4628612c6"}>{'.navigation-item.jsx-2342aae4628612c6 a::after{content:attr(data-text);content:attr(data-text)/""}'} - - ; -} -export default NavigationItem; diff --git a/packages/swc-magic/transform/tests/fixture/css-tag-same-file/input.js b/packages/swc-magic/transform/tests/fixture/css-tag-same-file/input.js deleted file mode 100644 index 07c0a8338..000000000 --- a/packages/swc-magic/transform/tests/fixture/css-tag-same-file/input.js +++ /dev/null @@ -1,25 +0,0 @@ -import css from 'swc-magic/css' - -export default ({ children }) => ( -
    -

    {children}

    - -
    -) - -const styles = css` - p { - color: red; - } -` - -class Test extends React.Component { - render() { - return ( -
    -

    {this.props.children}

    - -
    - ) - } -} diff --git a/packages/swc-magic/transform/tests/fixture/css-tag-same-file/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/css-tag-same-file/output.lightningcss.js deleted file mode 100644 index a18ec569d..000000000 --- a/packages/swc-magic/transform/tests/fixture/css-tag-same-file/output.lightningcss.js +++ /dev/null @@ -1,21 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (({ children })=>
    - -

    {children}

    - - <_JSXStyle id={styles.__hash}>{styles} - -
    ); -const styles = new String("p.jsx-556239d258b6d66a{color:red}"); -styles.__hash = "556239d258b6d66a"; -class Test extends React.Component { - render() { - return
    - -

    {this.props.children}

    - - <_JSXStyle id={styles.__hash}>{styles} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/css-tag-same-file/output.swc.js b/packages/swc-magic/transform/tests/fixture/css-tag-same-file/output.swc.js deleted file mode 100644 index a18ec569d..000000000 --- a/packages/swc-magic/transform/tests/fixture/css-tag-same-file/output.swc.js +++ /dev/null @@ -1,21 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (({ children })=>
    - -

    {children}

    - - <_JSXStyle id={styles.__hash}>{styles} - -
    ); -const styles = new String("p.jsx-556239d258b6d66a{color:red}"); -styles.__hash = "556239d258b6d66a"; -class Test extends React.Component { - render() { - return
    - -

    {this.props.children}

    - - <_JSXStyle id={styles.__hash}>{styles} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/different-jsx-ids/input.js b/packages/swc-magic/transform/tests/fixture/different-jsx-ids/input.js deleted file mode 100644 index d5769d3e9..000000000 --- a/packages/swc-magic/transform/tests/fixture/different-jsx-ids/input.js +++ /dev/null @@ -1,23 +0,0 @@ -const color = 'red' -const otherColor = 'green' - -const A = () => ( -
    -

    test

    - -
    -) - -const B = () => ( -
    -

    test

    - -
    -) - -export default () => ( - -) diff --git a/packages/swc-magic/transform/tests/fixture/different-jsx-ids/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/different-jsx-ids/output.lightningcss.js deleted file mode 100644 index 67b3fc420..000000000 --- a/packages/swc-magic/transform/tests/fixture/different-jsx-ids/output.lightningcss.js +++ /dev/null @@ -1,24 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -const color = 'red'; -const otherColor = 'green'; -const A = ()=>
    - -

    test

    - - <_JSXStyle id={"3f087c835a50190d"}>{`p.jsx-3f087c835a50190d{color:${color}}`} - -
    ; -const B = ()=>
    - -

    test

    - - <_JSXStyle id={"d051a1c8140076ed"}>{`p.jsx-d051a1c8140076ed{color:${otherColor}}`} - -
    ; -export default (()=>    ); diff --git a/packages/swc-magic/transform/tests/fixture/different-jsx-ids/output.swc.js b/packages/swc-magic/transform/tests/fixture/different-jsx-ids/output.swc.js deleted file mode 100644 index 67b3fc420..000000000 --- a/packages/swc-magic/transform/tests/fixture/different-jsx-ids/output.swc.js +++ /dev/null @@ -1,24 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -const color = 'red'; -const otherColor = 'green'; -const A = ()=>
    - -

    test

    - - <_JSXStyle id={"3f087c835a50190d"}>{`p.jsx-3f087c835a50190d{color:${color}}`} - -
    ; -const B = ()=>
    - -

    test

    - - <_JSXStyle id={"d051a1c8140076ed"}>{`p.jsx-d051a1c8140076ed{color:${otherColor}}`} - -
    ; -export default (()=>    ); diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element-class/input.js b/packages/swc-magic/transform/tests/fixture/dynamic-element-class/input.js deleted file mode 100644 index 5b8abce8c..000000000 --- a/packages/swc-magic/transform/tests/fixture/dynamic-element-class/input.js +++ /dev/null @@ -1,32 +0,0 @@ -export default class { - render() { - const Element = 'div' - - return ( - -

    dynamic element

    - -     - ) - } -} - -const Element2 = 'div' -export const Test2 = class { - render() { - return ( - -

    dynamic element

    - -     - ) - } -} diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element-class/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/dynamic-element-class/output.lightningcss.js deleted file mode 100644 index 17b340103..000000000 --- a/packages/swc-magic/transform/tests/fixture/dynamic-element-class/output.lightningcss.js +++ /dev/null @@ -1,25 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - const Element = 'div'; - return - -

    dynamic element

    - - <_JSXStyle id={"f825b24bbab5b83b"}>{".root.jsx-f825b24bbab5b83b{background:red}"} - -     ; - } -} -const Element2 = 'div'; -export const Test2 = class { - render() { - return - -

    dynamic element

    - - <_JSXStyle id={"f825b24bbab5b83b"}>{".root.jsx-f825b24bbab5b83b{background:red}"} - -     ; - } -}; diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element-class/output.swc.js b/packages/swc-magic/transform/tests/fixture/dynamic-element-class/output.swc.js deleted file mode 100644 index 17b340103..000000000 --- a/packages/swc-magic/transform/tests/fixture/dynamic-element-class/output.swc.js +++ /dev/null @@ -1,25 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - const Element = 'div'; - return - -

    dynamic element

    - - <_JSXStyle id={"f825b24bbab5b83b"}>{".root.jsx-f825b24bbab5b83b{background:red}"} - -     ; - } -} -const Element2 = 'div'; -export const Test2 = class { - render() { - return - -

    dynamic element

    - - <_JSXStyle id={"f825b24bbab5b83b"}>{".root.jsx-f825b24bbab5b83b{background:red}"} - -     ; - } -}; diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element-external/input.js b/packages/swc-magic/transform/tests/fixture/dynamic-element-external/input.js deleted file mode 100644 index 128078563..000000000 --- a/packages/swc-magic/transform/tests/fixture/dynamic-element-external/input.js +++ /dev/null @@ -1,12 +0,0 @@ -import styles from './styles2' - -export default ({ level = 1 }) => { - const Element = `h${level}` - - return ( - -

    dynamic element

    - -     - ) -} diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element-external/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/dynamic-element-external/output.lightningcss.js deleted file mode 100644 index 4cfd09897..000000000 --- a/packages/swc-magic/transform/tests/fixture/dynamic-element-external/output.lightningcss.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import styles from './styles2'; -export default (({ level = 1 })=>{ - const Element = `h${level}`; - return - -

    dynamic element

    - - <_JSXStyle id={styles.__hash}>{styles} - -     ; -}); diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element-external/output.swc.js b/packages/swc-magic/transform/tests/fixture/dynamic-element-external/output.swc.js deleted file mode 100644 index 4cfd09897..000000000 --- a/packages/swc-magic/transform/tests/fixture/dynamic-element-external/output.swc.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import styles from './styles2'; -export default (({ level = 1 })=>{ - const Element = `h${level}`; - return - -

    dynamic element

    - - <_JSXStyle id={styles.__hash}>{styles} - -     ; -}); diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element/input.js b/packages/swc-magic/transform/tests/fixture/dynamic-element/input.js deleted file mode 100644 index 17854bdd2..000000000 --- a/packages/swc-magic/transform/tests/fixture/dynamic-element/input.js +++ /dev/null @@ -1,56 +0,0 @@ -export default ({ level = 1 }) => { - const Element = `h${level}` - - return ( - -

    dynamic element

    - -     - ) -} - -export const TestLowerCase = ({ level = 1 }) => { - const element = `h${level}` - - return ( - -

    dynamic element

    - -     - ) -} - -const Element2 = 'div' -export const Test2 = () => { - return ( - -

    dynamic element

    - -     - ) -} - -export const Test3 = ({Component = 'div'}) => { - return ( - -

    dynamic element

    - -     - ); -} diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/dynamic-element/output.lightningcss.js deleted file mode 100644 index d0011fc1f..000000000 --- a/packages/swc-magic/transform/tests/fixture/dynamic-element/output.lightningcss.js +++ /dev/null @@ -1,40 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (({ level = 1 })=>{ - const Element = `h${level}`; - return - -

    dynamic element

    - - <_JSXStyle id={"fca64cc3f069b519"}>{".root.jsx-fca64cc3f069b519{background:red}"} - -     ; -}); -export const TestLowerCase = ({ level = 1 })=>{ - const element = `h${level}`; - return - -

    dynamic element

    - - <_JSXStyle id={"fca64cc3f069b519"}>{".root.jsx-fca64cc3f069b519{background:red}"} - -     ; -}; -const Element2 = 'div'; -export const Test2 = ()=>{ - return - -

    dynamic element

    - - <_JSXStyle id={"fca64cc3f069b519"}>{".root.jsx-fca64cc3f069b519{background:red}"} - -     ; -}; -export const Test3 = ({ Component = 'div' })=>{ - return - -

    dynamic element

    - - <_JSXStyle id={"f825b24bbab5b83b"}>{".root.jsx-f825b24bbab5b83b{background:red}"} - -     ; -}; diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-element/output.swc.js b/packages/swc-magic/transform/tests/fixture/dynamic-element/output.swc.js deleted file mode 100644 index d0011fc1f..000000000 --- a/packages/swc-magic/transform/tests/fixture/dynamic-element/output.swc.js +++ /dev/null @@ -1,40 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (({ level = 1 })=>{ - const Element = `h${level}`; - return - -

    dynamic element

    - - <_JSXStyle id={"fca64cc3f069b519"}>{".root.jsx-fca64cc3f069b519{background:red}"} - -     ; -}); -export const TestLowerCase = ({ level = 1 })=>{ - const element = `h${level}`; - return - -

    dynamic element

    - - <_JSXStyle id={"fca64cc3f069b519"}>{".root.jsx-fca64cc3f069b519{background:red}"} - -     ; -}; -const Element2 = 'div'; -export const Test2 = ()=>{ - return - -

    dynamic element

    - - <_JSXStyle id={"fca64cc3f069b519"}>{".root.jsx-fca64cc3f069b519{background:red}"} - -     ; -}; -export const Test3 = ({ Component = 'div' })=>{ - return - -

    dynamic element

    - - <_JSXStyle id={"f825b24bbab5b83b"}>{".root.jsx-f825b24bbab5b83b{background:red}"} - -     ; -}; diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/input.js b/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/input.js deleted file mode 100644 index 1a3c67dc6..000000000 --- a/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/input.js +++ /dev/null @@ -1,41 +0,0 @@ -// TODO -// import React, { Component } from 'react' - -// export default class Index extends Component { -// static getInitialProps() { -// return { color: 'aquamarine' } -// } - -// render() { -// return ( -//
    -// {[1, 2].map(idx => ( -//
    -// {[3, 4].map(idx2 => ( -//
    {this.props.color}
    -// ))} -//
    -// ))} -// {[1, 2].map(idx => ( -//
    -//
    -// {this.props.color} -//
    -// -//
    -//
    {this.props.color} hello there
    -//
    -//     -//
    -//
    -//
    -// ))} -// -//
    -// ) -// } -// } diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/output.lightningcss.js deleted file mode 100644 index 11fc44ff6..000000000 --- a/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/output.lightningcss.js +++ /dev/null @@ -1,39 +0,0 @@ -// TODO -// import React, { Component } from 'react' -// export default class Index extends Component { -// static getInitialProps() { -// return { color: 'aquamarine' } -// } -// render() { -// return ( -//
    -// {[1, 2].map(idx => ( -//
    -// {[3, 4].map(idx2 => ( -//
    {this.props.color}
    -// ))} -//
    -// ))} -// {[1, 2].map(idx => ( -//
    -//
    -// {this.props.color} -//
    -// -//
    -//
    {this.props.color} hello there
    -//
    -//     -//
    -//
    -//
    -// ))} -// -//
    -// ) -// } -// } diff --git a/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/output.swc.js b/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/output.swc.js deleted file mode 100644 index 11fc44ff6..000000000 --- a/packages/swc-magic/transform/tests/fixture/dynamic-this-in-arrow/output.swc.js +++ /dev/null @@ -1,39 +0,0 @@ -// TODO -// import React, { Component } from 'react' -// export default class Index extends Component { -// static getInitialProps() { -// return { color: 'aquamarine' } -// } -// render() { -// return ( -//
    -// {[1, 2].map(idx => ( -//
    -// {[3, 4].map(idx2 => ( -//
    {this.props.color}
    -// ))} -//
    -// ))} -// {[1, 2].map(idx => ( -//
    -//
    -// {this.props.color} -//
    -// -//
    -//
    {this.props.color} hello there
    -//
    -//     -//
    -//
    -//
    -// ))} -// -//
    -// ) -// } -// } diff --git a/packages/swc-magic/transform/tests/fixture/exported-jsx-style/input.js b/packages/swc-magic/transform/tests/fixture/exported-jsx-style/input.js deleted file mode 100644 index 119d097f6..000000000 --- a/packages/swc-magic/transform/tests/fixture/exported-jsx-style/input.js +++ /dev/null @@ -1 +0,0 @@ -// module.exports = () =>

    \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/exported-jsx-style/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/exported-jsx-style/output.lightningcss.js deleted file mode 100644 index 79908ec11..000000000 --- a/packages/swc-magic/transform/tests/fixture/exported-jsx-style/output.lightningcss.js +++ /dev/null @@ -1 +0,0 @@ -// module.exports = () =>

    diff --git a/packages/swc-magic/transform/tests/fixture/exported-jsx-style/output.swc.js b/packages/swc-magic/transform/tests/fixture/exported-jsx-style/output.swc.js deleted file mode 100644 index 79908ec11..000000000 --- a/packages/swc-magic/transform/tests/fixture/exported-jsx-style/output.swc.js +++ /dev/null @@ -1 +0,0 @@ -// module.exports = () =>

    diff --git a/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/input.js b/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/input.js deleted file mode 100644 index 5539580cf..000000000 --- a/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/input.js +++ /dev/null @@ -1 +0,0 @@ -// module.exports = () =>

    \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/output.lightningcss.js deleted file mode 100644 index 42b1f9876..000000000 --- a/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/output.lightningcss.js +++ /dev/null @@ -1 +0,0 @@ -// module.exports = () =>

    diff --git a/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/output.swc.js b/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/output.swc.js deleted file mode 100644 index 42b1f9876..000000000 --- a/packages/swc-magic/transform/tests/fixture/exported-non-jsx-style/output.swc.js +++ /dev/null @@ -1 +0,0 @@ -// module.exports = () =>

    diff --git a/packages/swc-magic/transform/tests/fixture/external-nested-scope/input.js b/packages/swc-magic/transform/tests/fixture/external-nested-scope/input.js deleted file mode 100644 index 6ba982a20..000000000 --- a/packages/swc-magic/transform/tests/fixture/external-nested-scope/input.js +++ /dev/null @@ -1,5 +0,0 @@ -import css from 'swc-magic/css' - -function test() { - css.resolve`div { color: red }` -} \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/external-nested-scope/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/external-nested-scope/output.lightningcss.js deleted file mode 100644 index 6b89f870a..000000000 --- a/packages/swc-magic/transform/tests/fixture/external-nested-scope/output.lightningcss.js +++ /dev/null @@ -1,7 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -function test() { - ({ - styles: <_JSXStyle id={"abb4c2202db1a207"}>{"div.jsx-abb4c2202db1a207{color:red}"}, - className: "jsx-abb4c2202db1a207" - }); -} diff --git a/packages/swc-magic/transform/tests/fixture/external-nested-scope/output.swc.js b/packages/swc-magic/transform/tests/fixture/external-nested-scope/output.swc.js deleted file mode 100644 index 6b89f870a..000000000 --- a/packages/swc-magic/transform/tests/fixture/external-nested-scope/output.swc.js +++ /dev/null @@ -1,7 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -function test() { - ({ - styles: <_JSXStyle id={"abb4c2202db1a207"}>{"div.jsx-abb4c2202db1a207{color:red}"}, - className: "jsx-abb4c2202db1a207" - }); -} diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/input.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/input.js deleted file mode 100644 index 67fdae9bb..000000000 --- a/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/input.js +++ /dev/null @@ -1,19 +0,0 @@ -import styles, { foo as styles3 } from './styles' - -const styles2 = require('./styles2') - -export default () => -
    -

    test

    -
    woot
    -

    woot

    - - - -
    diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/output.lightningcss.js deleted file mode 100644 index 221d1d166..000000000 --- a/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/output.lightningcss.js +++ /dev/null @@ -1,18 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import styles, { foo as styles3 } from './styles'; -const styles2 = require('./styles2'); -export default (()=>
    - -

    test

    - -
    woot
    - -

    woot

    - - <_JSXStyle id={styles2.__hash}>{styles2} - - <_JSXStyle id={styles3.__hash}>{styles3} - - <_JSXStyle id={styles.__hash}>{styles} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/output.swc.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/output.swc.js deleted file mode 100644 index 221d1d166..000000000 --- a/packages/swc-magic/transform/tests/fixture/external-stylesheet-global/output.swc.js +++ /dev/null @@ -1,18 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import styles, { foo as styles3 } from './styles'; -const styles2 = require('./styles2'); -export default (()=>
    - -

    test

    - -
    woot
    - -

    woot

    - - <_JSXStyle id={styles2.__hash}>{styles2} - - <_JSXStyle id={styles3.__hash}>{styles3} - - <_JSXStyle id={styles.__hash}>{styles} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/input.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/input.js deleted file mode 100644 index 89c6b449a..000000000 --- a/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/input.js +++ /dev/null @@ -1,9 +0,0 @@ -import styles from './styles' - -export default () => -
    -

    test

    - -
    diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/output.lightningcss.js deleted file mode 100644 index 47a06f52c..000000000 --- a/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/output.lightningcss.js +++ /dev/null @@ -1,9 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import styles from './styles'; -export default (()=>
    - -

    test

    - - <_JSXStyle id={styles.__hash}>{styles} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/output.swc.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/output.swc.js deleted file mode 100644 index 47a06f52c..000000000 --- a/packages/swc-magic/transform/tests/fixture/external-stylesheet-multi-line/output.swc.js +++ /dev/null @@ -1,9 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import styles from './styles'; -export default (()=>
    - -

    test

    - - <_JSXStyle id={styles.__hash}>{styles} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet/input.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet/input.js deleted file mode 100644 index 4b820d12c..000000000 --- a/packages/swc-magic/transform/tests/fixture/external-stylesheet/input.js +++ /dev/null @@ -1,41 +0,0 @@ -import styles from './styles' -const styles2 = require('./styles2') -import { foo as styles3 } from './styles' - -export default () => ( -
    -

    test

    -

    woot

    - - -
    woot
    - - -
    -) - -export const Test = () => ( -
    -

    test

    -

    woot

    - -
    woot
    - -
    -) diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet/output.lightningcss.js deleted file mode 100644 index f95eed999..000000000 --- a/packages/swc-magic/transform/tests/fixture/external-stylesheet/output.lightningcss.js +++ /dev/null @@ -1,34 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import styles from './styles'; -const styles2 = require('./styles2'); -import { foo as styles3 } from './styles'; -export default (()=>
    - -

    test

    - -

    woot

    - - <_JSXStyle id={styles2.__hash}>{styles2} - - <_JSXStyle id={styles3.__hash}>{styles3} - -
    woot
    - - <_JSXStyle id={"bee92b62eadf8a14"}>{"p.jsx-bee92b62eadf8a14{color:red}div.jsx-bee92b62eadf8a14{color:green}"} - - <_JSXStyle id={styles.__hash}>{styles} - -
    ); -export const Test = ()=>
    - -

    test

    - -

    woot

    - - <_JSXStyle id={styles3.__hash}>{styles3} - -
    woot
    - - <_JSXStyle id={"bee92b62eadf8a14"}>{"p.jsx-bee92b62eadf8a14{color:red}div.jsx-bee92b62eadf8a14{color:green}"} - -
    ; diff --git a/packages/swc-magic/transform/tests/fixture/external-stylesheet/output.swc.js b/packages/swc-magic/transform/tests/fixture/external-stylesheet/output.swc.js deleted file mode 100644 index f95eed999..000000000 --- a/packages/swc-magic/transform/tests/fixture/external-stylesheet/output.swc.js +++ /dev/null @@ -1,34 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import styles from './styles'; -const styles2 = require('./styles2'); -import { foo as styles3 } from './styles'; -export default (()=>
    - -

    test

    - -

    woot

    - - <_JSXStyle id={styles2.__hash}>{styles2} - - <_JSXStyle id={styles3.__hash}>{styles3} - -
    woot
    - - <_JSXStyle id={"bee92b62eadf8a14"}>{"p.jsx-bee92b62eadf8a14{color:red}div.jsx-bee92b62eadf8a14{color:green}"} - - <_JSXStyle id={styles.__hash}>{styles} - -
    ); -export const Test = ()=>
    - -

    test

    - -

    woot

    - - <_JSXStyle id={styles3.__hash}>{styles3} - -
    woot
    - - <_JSXStyle id={"bee92b62eadf8a14"}>{"p.jsx-bee92b62eadf8a14{color:red}div.jsx-bee92b62eadf8a14{color:green}"} - -
    ; diff --git a/packages/swc-magic/transform/tests/fixture/fragment/input.js b/packages/swc-magic/transform/tests/fixture/fragment/input.js deleted file mode 100644 index fc5a60bf5..000000000 --- a/packages/swc-magic/transform/tests/fixture/fragment/input.js +++ /dev/null @@ -1,51 +0,0 @@ -import React from 'react' - -export default () => ( - <> -

    Testing!!!

    -

    Bar

    - <> - - -

    hello

    - <> -

    foo

    -

    bar

    - -

    world

    -     - - - -) - -function Component1() { - return ( - <> -
    test
    - - ) -} - -function Component2() { - return ( -
    - -
    - ) -} diff --git a/packages/swc-magic/transform/tests/fixture/fragment/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/fragment/output.lightningcss.js deleted file mode 100644 index 3476d33e8..000000000 --- a/packages/swc-magic/transform/tests/fixture/fragment/output.lightningcss.js +++ /dev/null @@ -1,47 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import React from 'react'; -export default (()=><> - -

    Testing!!!

    - -

    Bar

    - - <> - - - - - -

    hello

    - - <> - -

    foo

    - -

    bar

    - - - -

    world

    - -     - - - - <_JSXStyle id={"6dd5f97e085c0297"}>{"p.jsx-6dd5f97e085c0297{color:#0ff}.foo.jsx-6dd5f97e085c0297{color:#ff69b4;font-size:18px}#head.jsx-6dd5f97e085c0297{text-decoration:underline}"} - - ); -function Component1() { - return <> - -
    test
    - - ; -} -function Component2() { - return
    - - <_JSXStyle id={"678f41ca6d3b294b"}>{"div.jsx-678f41ca6d3b294b{color:red}"} - -
    ; -} diff --git a/packages/swc-magic/transform/tests/fixture/fragment/output.swc.js b/packages/swc-magic/transform/tests/fixture/fragment/output.swc.js deleted file mode 100644 index 79c375550..000000000 --- a/packages/swc-magic/transform/tests/fixture/fragment/output.swc.js +++ /dev/null @@ -1,47 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import React from 'react'; -export default (()=><> - -

    Testing!!!

    - -

    Bar

    - - <> - - - - - -

    hello

    - - <> - -

    foo

    - -

    bar

    - - - -

    world

    - -     - - - - <_JSXStyle id={"6dd5f97e085c0297"}>{"p.jsx-6dd5f97e085c0297{color:cyan}.foo.jsx-6dd5f97e085c0297{font-size:18px;color:hotpink}#head.jsx-6dd5f97e085c0297{text-decoration:underline}"} - - ); -function Component1() { - return <> - -
    test
    - - ; -} -function Component2() { - return
    - - <_JSXStyle id={"678f41ca6d3b294b"}>{"div.jsx-678f41ca6d3b294b{color:red}"} - -
    ; -} diff --git a/packages/swc-magic/transform/tests/fixture/global-child-selector/input.js b/packages/swc-magic/transform/tests/fixture/global-child-selector/input.js deleted file mode 100644 index e3cdeef05..000000000 --- a/packages/swc-magic/transform/tests/fixture/global-child-selector/input.js +++ /dev/null @@ -1,10 +0,0 @@ -const Test = () => ( -
    - test - -
    -) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/global-child-selector/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/global-child-selector/output.lightningcss.js deleted file mode 100644 index ef65c21e9..000000000 --- a/packages/swc-magic/transform/tests/fixture/global-child-selector/output.lightningcss.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -const Test = ()=>
    - - test - - <_JSXStyle id={"5a206f122d1cb32e"}>{"div.jsx-5a206f122d1cb32e>span{color:red}"} - -
    ; diff --git a/packages/swc-magic/transform/tests/fixture/global-child-selector/output.swc.js b/packages/swc-magic/transform/tests/fixture/global-child-selector/output.swc.js deleted file mode 100644 index ef65c21e9..000000000 --- a/packages/swc-magic/transform/tests/fixture/global-child-selector/output.swc.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -const Test = ()=>
    - - test - - <_JSXStyle id={"5a206f122d1cb32e"}>{"div.jsx-5a206f122d1cb32e>span{color:red}"} - -
    ; diff --git a/packages/swc-magic/transform/tests/fixture/global-redundant/input.js b/packages/swc-magic/transform/tests/fixture/global-redundant/input.js deleted file mode 100644 index 645ca01c3..000000000 --- a/packages/swc-magic/transform/tests/fixture/global-redundant/input.js +++ /dev/null @@ -1,12 +0,0 @@ -export default function IndexPage() { - return ( -
    - should be blue. - -
    - ); -} diff --git a/packages/swc-magic/transform/tests/fixture/global-redundant/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/global-redundant/output.lightningcss.js deleted file mode 100644 index d26b20c60..000000000 --- a/packages/swc-magic/transform/tests/fixture/global-redundant/output.lightningcss.js +++ /dev/null @@ -1,10 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default function IndexPage() { - return
    - - should be blue. - - <_JSXStyle id={"b6abd0684ba81871"}>{"div{color:#00f}"} - -
    ; -} diff --git a/packages/swc-magic/transform/tests/fixture/global-redundant/output.swc.js b/packages/swc-magic/transform/tests/fixture/global-redundant/output.swc.js deleted file mode 100644 index ee3ada689..000000000 --- a/packages/swc-magic/transform/tests/fixture/global-redundant/output.swc.js +++ /dev/null @@ -1,10 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default function IndexPage() { - return
    - - should be blue. - - <_JSXStyle id={"b6abd0684ba81871"}>{"div{color:blue}"} - -
    ; -} diff --git a/packages/swc-magic/transform/tests/fixture/global/input.js b/packages/swc-magic/transform/tests/fixture/global/input.js deleted file mode 100644 index 75178bdb7..000000000 --- a/packages/swc-magic/transform/tests/fixture/global/input.js +++ /dev/null @@ -1,22 +0,0 @@ -const Test = () => ( -
    - -
    -) - -const Test2 = () => diff --git a/packages/swc-magic/transform/tests/fixture/global/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/global/output.lightningcss.js deleted file mode 100644 index 7554e6ab1..000000000 --- a/packages/swc-magic/transform/tests/fixture/global/output.lightningcss.js +++ /dev/null @@ -1,7 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -const Test = ()=>
    - - <_JSXStyle id={"d47d6adadf14e957"}>{"body{color:red}:hover{color:red;animation:1s ease-out foo;display:flex}div a{display:none}[data-test]>div{color:red}"} - -
    ; -const Test2 = ()=><_JSXStyle id={"94239b6d6b42c9b5"}>{"p{color:red}"}; diff --git a/packages/swc-magic/transform/tests/fixture/global/output.swc.js b/packages/swc-magic/transform/tests/fixture/global/output.swc.js deleted file mode 100644 index cc7f51b8a..000000000 --- a/packages/swc-magic/transform/tests/fixture/global/output.swc.js +++ /dev/null @@ -1,7 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -const Test = ()=>
    - - <_JSXStyle id={"d47d6adadf14e957"}>{"body{color:red}:hover{color:red;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-animation:foo 1s ease-out;-moz-animation:foo 1s ease-out;-o-animation:foo 1s ease-out;animation:foo 1s ease-out}div a{display:none}[data-test]>div{color:red}"} - -
    ; -const Test2 = ()=><_JSXStyle id={"94239b6d6b42c9b5"}>{"p{color:red}"}; diff --git a/packages/swc-magic/transform/tests/fixture/issue-30480/input.js b/packages/swc-magic/transform/tests/fixture/issue-30480/input.js deleted file mode 100644 index bad0d6567..000000000 --- a/packages/swc-magic/transform/tests/fixture/issue-30480/input.js +++ /dev/null @@ -1,11 +0,0 @@ - - -export default ({ breakPoint }) => ( -
    - -
    -) diff --git a/packages/swc-magic/transform/tests/fixture/issue-30480/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/issue-30480/output.lightningcss.js deleted file mode 100644 index ab18f5a88..000000000 --- a/packages/swc-magic/transform/tests/fixture/issue-30480/output.lightningcss.js +++ /dev/null @@ -1,15 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (({ breakPoint })=>
    - - <_JSXStyle id={"8ab1d380e1497d05"} dynamic={[ - breakPoint - ]}>{`@media (${breakPoint}){.test.__jsx-style-dynamic-selector{margin-bottom:1em}}`} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/issue-30480/output.swc.js b/packages/swc-magic/transform/tests/fixture/issue-30480/output.swc.js deleted file mode 100644 index 6875e48d1..000000000 --- a/packages/swc-magic/transform/tests/fixture/issue-30480/output.swc.js +++ /dev/null @@ -1,15 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (({ breakPoint })=>
    - - <_JSXStyle id={"8ab1d380e1497d05"} dynamic={[ - breakPoint - ]}>{`@media(${breakPoint}){.test.__jsx-style-dynamic-selector{margin-bottom:1em}}`} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/issue-30570/input.js b/packages/swc-magic/transform/tests/fixture/issue-30570/input.js deleted file mode 100644 index 30339e799..000000000 --- a/packages/swc-magic/transform/tests/fixture/issue-30570/input.js +++ /dev/null @@ -1,15 +0,0 @@ -export default function IndexPage() { - return ( -
    -

    Hello World.

    - - -
    - ); - } \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/issue-30570/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/issue-30570/output.lightningcss.js deleted file mode 100644 index a76d04b79..000000000 --- a/packages/swc-magic/transform/tests/fixture/issue-30570/output.lightningcss.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default function IndexPage() { - return
    - -

    Hello World.

    - - - - <_JSXStyle id={"bbdada4ef17d18ef"}>{"@supports (display:flex){h1{color:#ff69b4}}"} - -
    ; -} diff --git a/packages/swc-magic/transform/tests/fixture/issue-30570/output.swc.js b/packages/swc-magic/transform/tests/fixture/issue-30570/output.swc.js deleted file mode 100644 index a7ef10c78..000000000 --- a/packages/swc-magic/transform/tests/fixture/issue-30570/output.swc.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default function IndexPage() { - return
    - -

    Hello World.

    - - - - <_JSXStyle id={"bbdada4ef17d18ef"}>{"@supports((display:flex)or (display:-webkit-box)or (display:-webkit-flex)or (display:-moz-box)or (display:-ms-flexbox)){h1{color:hotpink}}"} - -
    ; -} diff --git a/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/input.js b/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/input.js deleted file mode 100644 index 39b930b9c..000000000 --- a/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/input.js +++ /dev/null @@ -1,30 +0,0 @@ - - - -export default class { - render() { - return ( -
    -

    test

    - -
    - ) - } - } - \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/output.lightningcss.js deleted file mode 100644 index c4659d10b..000000000 --- a/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/output.lightningcss.js +++ /dev/null @@ -1,43 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"2660fd68f1ede1d4"} dynamic={[ - Typography.base.size.default, - Typography.base.lineHeight, - Target.mediumPlus, - Typography.base.size.mediumPlus, - Target.largePlus, - Typography.base.size.largePlus - ]}>{`html{font-size:${Typography.base.size.default};line-height:${Typography.base.lineHeight}}@media ${Target.mediumPlus}{html{font-size:${Typography.base.size.mediumPlus}}}@media ${Target.largePlus}{html{font-size:${Typography.base.size.largePlus}}}`} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/output.swc.js b/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/output.swc.js deleted file mode 100644 index c4659d10b..000000000 --- a/packages/swc-magic/transform/tests/fixture/issue-31562-interpolation-in-mdea/output.swc.js +++ /dev/null @@ -1,43 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"2660fd68f1ede1d4"} dynamic={[ - Typography.base.size.default, - Typography.base.lineHeight, - Target.mediumPlus, - Typography.base.size.mediumPlus, - Target.largePlus, - Typography.base.size.largePlus - ]}>{`html{font-size:${Typography.base.size.default};line-height:${Typography.base.lineHeight}}@media ${Target.mediumPlus}{html{font-size:${Typography.base.size.mediumPlus}}}@media ${Target.largePlus}{html{font-size:${Typography.base.size.largePlus}}}`} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/input.js b/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/input.js deleted file mode 100644 index 403ed46ac..000000000 --- a/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/input.js +++ /dev/null @@ -1,9 +0,0 @@ -const Test = () => - -export default () => ( -
    -

    test

    - - -
    -) diff --git a/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/output.lightningcss.js deleted file mode 100644 index 8e3531051..000000000 --- a/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/output.lightningcss.js +++ /dev/null @@ -1,11 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -const Test = ()=><_JSXStyle id={"94239b6d6b42c9b5"}>{"p{color:red}"}; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"b7efb453c85593c1"}>{"body{background:red}"} - - <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-3822e6e1fb9fa41a{color:red}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/output.swc.js b/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/output.swc.js deleted file mode 100644 index 8e3531051..000000000 --- a/packages/swc-magic/transform/tests/fixture/mixed-global-scoped/output.swc.js +++ /dev/null @@ -1,11 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -const Test = ()=><_JSXStyle id={"94239b6d6b42c9b5"}>{"p{color:red}"}; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"b7efb453c85593c1"}>{"body{background:red}"} - - <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-3822e6e1fb9fa41a{color:red}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/multiple-jsx/input.js b/packages/swc-magic/transform/tests/fixture/multiple-jsx/input.js deleted file mode 100644 index 0b1de3378..000000000 --- a/packages/swc-magic/transform/tests/fixture/multiple-jsx/input.js +++ /dev/null @@ -1,43 +0,0 @@ -const attrs = { - id: 'test' -} - -const Test1 = () => ( -
    - test - - -
    -) - -const Test2 = () => test - -const Test3 = () => ( -
    - test - -
    -) - -export default class { - render () { - return ( -
    -

    test

    - -
    - ) - } -} diff --git a/packages/swc-magic/transform/tests/fixture/multiple-jsx/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/multiple-jsx/output.lightningcss.js deleted file mode 100644 index 00356c87e..000000000 --- a/packages/swc-magic/transform/tests/fixture/multiple-jsx/output.lightningcss.js +++ /dev/null @@ -1,32 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -const attrs = { - id: 'test' -}; -const Test1 = ()=>
    - - test - - - - <_JSXStyle id={"a9535d7d5f32c3c4"}>{"span.jsx-a9535d7d5f32c3c4{color:red}"} - -
    ; -const Test2 = ()=>test; -const Test3 = ()=>
    - - test - - <_JSXStyle id={"a9535d7d5f32c3c4"}>{"span.jsx-a9535d7d5f32c3c4{color:red}"} - -
    ; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"b2b86d63f35d25ee"}>{"p.jsx-b2b86d63f35d25ee{color:red}"} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/multiple-jsx/output.swc.js b/packages/swc-magic/transform/tests/fixture/multiple-jsx/output.swc.js deleted file mode 100644 index 00356c87e..000000000 --- a/packages/swc-magic/transform/tests/fixture/multiple-jsx/output.swc.js +++ /dev/null @@ -1,32 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -const attrs = { - id: 'test' -}; -const Test1 = ()=>
    - - test - - - - <_JSXStyle id={"a9535d7d5f32c3c4"}>{"span.jsx-a9535d7d5f32c3c4{color:red}"} - -
    ; -const Test2 = ()=>test; -const Test3 = ()=>
    - - test - - <_JSXStyle id={"a9535d7d5f32c3c4"}>{"span.jsx-a9535d7d5f32c3c4{color:red}"} - -
    ; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"b2b86d63f35d25ee"}>{"p.jsx-b2b86d63f35d25ee{color:red}"} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/nested-style-tags/index.js b/packages/swc-magic/transform/tests/fixture/nested-style-tags/index.js deleted file mode 100644 index e69de29bb..000000000 diff --git a/packages/swc-magic/transform/tests/fixture/next-54653/input.js b/packages/swc-magic/transform/tests/fixture/next-54653/input.js deleted file mode 100644 index 1a577d5ec..000000000 --- a/packages/swc-magic/transform/tests/fixture/next-54653/input.js +++ /dev/null @@ -1,10 +0,0 @@ -import css from 'swc-magic/css' - -export default css` - @media (max-width: 870px) { - :global(th.expiration-date-cell), - :global(td.expiration-date-cell) { - display: none; - } - } -` \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/next-54653/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/next-54653/output.lightningcss.js deleted file mode 100644 index 4a05021b0..000000000 --- a/packages/swc-magic/transform/tests/fixture/next-54653/output.lightningcss.js +++ /dev/null @@ -1,3 +0,0 @@ -const _defaultExport = new String("@media (width<=870px){th.expiration-date-cell,td.expiration-date-cell{display:none}}"); -_defaultExport.__hash = "fd71bf06ba8860bb"; -export default _defaultExport; diff --git a/packages/swc-magic/transform/tests/fixture/next-54653/output.swc.js b/packages/swc-magic/transform/tests/fixture/next-54653/output.swc.js deleted file mode 100644 index d080a6d83..000000000 --- a/packages/swc-magic/transform/tests/fixture/next-54653/output.swc.js +++ /dev/null @@ -1,3 +0,0 @@ -const _defaultExport = new String("@media(max-width:870px){th.expiration-date-cell,td.expiration-date-cell{display:none}}"); -_defaultExport.__hash = "fd71bf06ba8860bb"; -export default _defaultExport; diff --git a/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/input.js b/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/input.js deleted file mode 100644 index d4a7da9ee..000000000 --- a/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/input.js +++ /dev/null @@ -1,7 +0,0 @@ -export default () => ( -
    -

    woot

    - - -
    -) diff --git a/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/output.lightningcss.js deleted file mode 100644 index 33e3ecb72..000000000 --- a/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/output.lightningcss.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    woot

    - - - - <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-94239b6d6b42c9b5{color:red}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/output.swc.js b/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/output.swc.js deleted file mode 100644 index 33e3ecb72..000000000 --- a/packages/swc-magic/transform/tests/fixture/non-styled-jsx-style/output.swc.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    woot

    - - - - <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-94239b6d6b42c9b5{color:red}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/input.js b/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/input.js deleted file mode 100644 index 212202d49..000000000 --- a/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/input.js +++ /dev/null @@ -1,30 +0,0 @@ -import css from 'hell' - -const color = 'red' - -const bar = css` - div { - font-size: 3em; - } -` -export const uh = bar - -export const foo = css`div { color: ${color}}` - -export default css` - div { - font-size: 3em; - } - p { - color: ${color}; - } -` - -const Title = styled.h1` - color: red; - font-size: 50px; -` - -const AnotherTitle = Title.extend`color: blue;` - -export const Component = () => My page diff --git a/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/output.lightningcss.js deleted file mode 100644 index a915f996e..000000000 --- a/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/output.lightningcss.js +++ /dev/null @@ -1,23 +0,0 @@ -import css from 'hell'; -const color = 'red'; -const bar = css` - div { - font-size: 3em; - } -`; -export const uh = bar; -export const foo = css`div { color: ${color}}`; -export default css` - div { - font-size: 3em; - } - p { - color: ${color}; - } -`; -const Title = styled.h1` - color: red; - font-size: 50px; -`; -const AnotherTitle = Title.extend`color: blue;`; -export const Component = ()=>My page; diff --git a/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/output.swc.js b/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/output.swc.js deleted file mode 100644 index a915f996e..000000000 --- a/packages/swc-magic/transform/tests/fixture/not-styled-jsx-tagged-templates/output.swc.js +++ /dev/null @@ -1,23 +0,0 @@ -import css from 'hell'; -const color = 'red'; -const bar = css` - div { - font-size: 3em; - } -`; -export const uh = bar; -export const foo = css`div { color: ${color}}`; -export default css` - div { - font-size: 3em; - } - p { - color: ${color}; - } -`; -const Title = styled.h1` - color: red; - font-size: 50px; -`; -const AnotherTitle = Title.extend`color: blue;`; -export const Component = ()=>My page; diff --git a/packages/swc-magic/transform/tests/fixture/number-after-placeholder/input.js b/packages/swc-magic/transform/tests/fixture/number-after-placeholder/input.js deleted file mode 100644 index 99aecf43d..000000000 --- a/packages/swc-magic/transform/tests/fixture/number-after-placeholder/input.js +++ /dev/null @@ -1,17 +0,0 @@ -import Link from "next/link"; - -export default function IndexPage() { - return ( -
    - Hello World.{" "} - - Abound - - -
    - ); -} \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/number-after-placeholder/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/number-after-placeholder/output.lightningcss.js deleted file mode 100644 index be62bc9a3..000000000 --- a/packages/swc-magic/transform/tests/fixture/number-after-placeholder/output.lightningcss.js +++ /dev/null @@ -1,17 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import Link from "next/link"; -export default function IndexPage() { - return
    - - Hello World.{" "} - - - - Abound - - - - <_JSXStyle id={"2339e3d61ab4470c"}>{`a.jsx-2339e3d61ab4470c{color:${"#abcdef"}12}`} - -
    ; -} diff --git a/packages/swc-magic/transform/tests/fixture/number-after-placeholder/output.swc.js b/packages/swc-magic/transform/tests/fixture/number-after-placeholder/output.swc.js deleted file mode 100644 index be62bc9a3..000000000 --- a/packages/swc-magic/transform/tests/fixture/number-after-placeholder/output.swc.js +++ /dev/null @@ -1,17 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import Link from "next/link"; -export default function IndexPage() { - return
    - - Hello World.{" "} - - - - Abound - - - - <_JSXStyle id={"2339e3d61ab4470c"}>{`a.jsx-2339e3d61ab4470c{color:${"#abcdef"}12}`} - -
    ; -} diff --git a/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/input.js b/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/input.js deleted file mode 100644 index 96aca2778..000000000 --- a/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/input.js +++ /dev/null @@ -1,10 +0,0 @@ -export default () => ( -
    -

    test

    - -
    -) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/output.lightningcss.js deleted file mode 100644 index faab4273e..000000000 --- a/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/output.lightningcss.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"c7c3a8e231c9215a"}>{".container.jsx-c7c3a8e231c9215a>*{color:red}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/output.swc.js b/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/output.swc.js deleted file mode 100644 index faab4273e..000000000 --- a/packages/swc-magic/transform/tests/fixture/one-off-global-selectors/output.swc.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"c7c3a8e231c9215a"}>{".container.jsx-c7c3a8e231c9215a>*{color:red}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/source-maps/input.js b/packages/swc-magic/transform/tests/fixture/source-maps/input.js deleted file mode 100644 index e14ced8ae..000000000 --- a/packages/swc-magic/transform/tests/fixture/source-maps/input.js +++ /dev/null @@ -1,8 +0,0 @@ -// TODO: needs sourcemaps -// export default () => ( -//
    -//

    test

    -//

    woot

    -// -//
    -// ) diff --git a/packages/swc-magic/transform/tests/fixture/source-maps/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/source-maps/output.lightningcss.js deleted file mode 100644 index e14ced8ae..000000000 --- a/packages/swc-magic/transform/tests/fixture/source-maps/output.lightningcss.js +++ /dev/null @@ -1,8 +0,0 @@ -// TODO: needs sourcemaps -// export default () => ( -//
    -//

    test

    -//

    woot

    -// -//
    -// ) diff --git a/packages/swc-magic/transform/tests/fixture/source-maps/output.swc.js b/packages/swc-magic/transform/tests/fixture/source-maps/output.swc.js deleted file mode 100644 index e14ced8ae..000000000 --- a/packages/swc-magic/transform/tests/fixture/source-maps/output.swc.js +++ /dev/null @@ -1,8 +0,0 @@ -// TODO: needs sourcemaps -// export default () => ( -//
    -//

    test

    -//

    woot

    -// -//
    -// ) diff --git a/packages/swc-magic/transform/tests/fixture/stateless/input.js b/packages/swc-magic/transform/tests/fixture/stateless/input.js deleted file mode 100644 index e00df987c..000000000 --- a/packages/swc-magic/transform/tests/fixture/stateless/input.js +++ /dev/null @@ -1,8 +0,0 @@ -export default () => ( -
    -

    test

    -

    woot

    -

    woot

    - -
    -) diff --git a/packages/swc-magic/transform/tests/fixture/stateless/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/stateless/output.lightningcss.js deleted file mode 100644 index a34f8a402..000000000 --- a/packages/swc-magic/transform/tests/fixture/stateless/output.lightningcss.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - -

    woot

    - -

    woot

    - - <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-94239b6d6b42c9b5{color:red}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/stateless/output.swc.js b/packages/swc-magic/transform/tests/fixture/stateless/output.swc.js deleted file mode 100644 index a34f8a402..000000000 --- a/packages/swc-magic/transform/tests/fixture/stateless/output.swc.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - -

    woot

    - -

    woot

    - - <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-94239b6d6b42c9b5{color:red}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/styles-external-invalid/input.js b/packages/swc-magic/transform/tests/fixture/styles-external-invalid/input.js deleted file mode 100644 index 1be8ad915..000000000 --- a/packages/swc-magic/transform/tests/fixture/styles-external-invalid/input.js +++ /dev/null @@ -1,13 +0,0 @@ -// TODO -// import css from 'swc-magic/css' - -// const color = 'red' - -// export const foo = css`div { color: ${color}}` - -// const props = { color: 'red ' } - -// export default css` -// div { font-size: 3em; color: ${props.color} } -// p { color: ${this.props.color};} -// ` diff --git a/packages/swc-magic/transform/tests/fixture/styles-external-invalid/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/styles-external-invalid/output.lightningcss.js deleted file mode 100644 index 835225c79..000000000 --- a/packages/swc-magic/transform/tests/fixture/styles-external-invalid/output.lightningcss.js +++ /dev/null @@ -1,9 +0,0 @@ -// TODO -// import css from 'swc-magic/css' -// const color = 'red' -// export const foo = css`div { color: ${color}}` -// const props = { color: 'red ' } -// export default css` -// div { font-size: 3em; color: ${props.color} } -// p { color: ${this.props.color};} -// ` diff --git a/packages/swc-magic/transform/tests/fixture/styles-external-invalid/output.swc.js b/packages/swc-magic/transform/tests/fixture/styles-external-invalid/output.swc.js deleted file mode 100644 index 835225c79..000000000 --- a/packages/swc-magic/transform/tests/fixture/styles-external-invalid/output.swc.js +++ /dev/null @@ -1,9 +0,0 @@ -// TODO -// import css from 'swc-magic/css' -// const color = 'red' -// export const foo = css`div { color: ${color}}` -// const props = { color: 'red ' } -// export default css` -// div { font-size: 3em; color: ${props.color} } -// p { color: ${this.props.color};} -// ` diff --git a/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/input.js b/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/input.js deleted file mode 100644 index fee85420b..000000000 --- a/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/input.js +++ /dev/null @@ -1,11 +0,0 @@ -// TODO -// import css from 'swc-magic/css' - -// const color = 'red' - -// export const foo = css`div { color: ${color}}` - -// export default css` -// div { font-size: 3em } -// p { color: ${props.color};} -// ` diff --git a/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/output.lightningcss.js deleted file mode 100644 index 24f32414e..000000000 --- a/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/output.lightningcss.js +++ /dev/null @@ -1,8 +0,0 @@ -// TODO -// import css from 'swc-magic/css' -// const color = 'red' -// export const foo = css`div { color: ${color}}` -// export default css` -// div { font-size: 3em } -// p { color: ${props.color};} -// ` diff --git a/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/output.swc.js b/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/output.swc.js deleted file mode 100644 index 24f32414e..000000000 --- a/packages/swc-magic/transform/tests/fixture/styles-external-invalid2/output.swc.js +++ /dev/null @@ -1,8 +0,0 @@ -// TODO -// import css from 'swc-magic/css' -// const color = 'red' -// export const foo = css`div { color: ${color}}` -// export default css` -// div { font-size: 3em } -// p { color: ${props.color};} -// ` diff --git a/packages/swc-magic/transform/tests/fixture/styles/input.js b/packages/swc-magic/transform/tests/fixture/styles/input.js deleted file mode 100644 index 6f47cf3f0..000000000 --- a/packages/swc-magic/transform/tests/fixture/styles/input.js +++ /dev/null @@ -1,57 +0,0 @@ -import css, { resolve, global } from 'swc-magic/css' -import colors, { size } from './constants' -const color = 'red' - -const bar = css` - div { - font-size: 3em; - } -` - -const baz = css.global` - div { - font-size: 3em; - } -` - -const a = global` - div { - font-size: ${size}em; - } -` - -export const uh = bar - -export const foo = css`div { color: ${color}}` - -css.resolve` - div { - color: ${colors.green.light}; - } - a { color: red } -` - -const b = resolve` - div { - color: ${colors.green.light}; - } - a { color: red } -` - -const dynamic = colors => { - const b = resolve` - div { - color: ${colors.green.light}; - } - a { color: red } - ` -} - -export default css.resolve` - div { - font-size: 3em; - } - p { - color: ${color}; - } -` diff --git a/packages/swc-magic/transform/tests/fixture/styles/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/styles/output.lightningcss.js deleted file mode 100644 index 505d80248..000000000 --- a/packages/swc-magic/transform/tests/fixture/styles/output.lightningcss.js +++ /dev/null @@ -1,39 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import colors, { size } from './constants'; -const color = 'red'; -const bar = new String("div.jsx-aaed0341accea8f{font-size:3em}"); -bar.__hash = "aaed0341accea8f"; -const baz = new String("div{font-size:3em}"); -baz.__hash = "aaed0341accea8f"; -const a = new String(`div{font-size:${size}em}`); -a.__hash = "c82345d11d3b02f5"; -export const uh = bar; -export const foo = new String(`div.jsx-611c1f2c95744b70{color:${color}}`); -foo.__hash = "611c1f2c95744b70"; -({ - styles: <_JSXStyle id={"141b18386ca7cbc5"}>{`div.jsx-141b18386ca7cbc5{color:${colors.green.light}}a.jsx-141b18386ca7cbc5{color:red}`}, - className: "jsx-141b18386ca7cbc5" -}); -const b = { - styles: <_JSXStyle id={"141b18386ca7cbc5"}>{`div.jsx-141b18386ca7cbc5{color:${colors.green.light}}a.jsx-141b18386ca7cbc5{color:red}`}, - className: "jsx-141b18386ca7cbc5" -}; -const dynamic = (colors)=>{ - const b = { - styles: <_JSXStyle id={"a6aaef75eecc989e"} dynamic={[ - colors.green.light - ]}>{`div.__jsx-style-dynamic-selector{color:${colors.green.light}}a.__jsx-style-dynamic-selector{color:red}`}, - className: _JSXStyle.dynamic([ - [ - "a6aaef75eecc989e", - [ - colors.green.light - ] - ] - ]) - }; -}; -export default { - styles: <_JSXStyle id={"c1431f6a913dbbc9"}>{`div.jsx-c1431f6a913dbbc9{font-size:3em}p.jsx-c1431f6a913dbbc9{color:${color}}`}, - className: "jsx-c1431f6a913dbbc9" -}; diff --git a/packages/swc-magic/transform/tests/fixture/styles/output.swc.js b/packages/swc-magic/transform/tests/fixture/styles/output.swc.js deleted file mode 100644 index 505d80248..000000000 --- a/packages/swc-magic/transform/tests/fixture/styles/output.swc.js +++ /dev/null @@ -1,39 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -import colors, { size } from './constants'; -const color = 'red'; -const bar = new String("div.jsx-aaed0341accea8f{font-size:3em}"); -bar.__hash = "aaed0341accea8f"; -const baz = new String("div{font-size:3em}"); -baz.__hash = "aaed0341accea8f"; -const a = new String(`div{font-size:${size}em}`); -a.__hash = "c82345d11d3b02f5"; -export const uh = bar; -export const foo = new String(`div.jsx-611c1f2c95744b70{color:${color}}`); -foo.__hash = "611c1f2c95744b70"; -({ - styles: <_JSXStyle id={"141b18386ca7cbc5"}>{`div.jsx-141b18386ca7cbc5{color:${colors.green.light}}a.jsx-141b18386ca7cbc5{color:red}`}, - className: "jsx-141b18386ca7cbc5" -}); -const b = { - styles: <_JSXStyle id={"141b18386ca7cbc5"}>{`div.jsx-141b18386ca7cbc5{color:${colors.green.light}}a.jsx-141b18386ca7cbc5{color:red}`}, - className: "jsx-141b18386ca7cbc5" -}; -const dynamic = (colors)=>{ - const b = { - styles: <_JSXStyle id={"a6aaef75eecc989e"} dynamic={[ - colors.green.light - ]}>{`div.__jsx-style-dynamic-selector{color:${colors.green.light}}a.__jsx-style-dynamic-selector{color:red}`}, - className: _JSXStyle.dynamic([ - [ - "a6aaef75eecc989e", - [ - colors.green.light - ] - ] - ]) - }; -}; -export default { - styles: <_JSXStyle id={"c1431f6a913dbbc9"}>{`div.jsx-c1431f6a913dbbc9{font-size:3em}p.jsx-c1431f6a913dbbc9{color:${color}}`}, - className: "jsx-c1431f6a913dbbc9" -}; diff --git a/packages/swc-magic/transform/tests/fixture/styles2/input.js b/packages/swc-magic/transform/tests/fixture/styles2/input.js deleted file mode 100644 index b2d078fe1..000000000 --- a/packages/swc-magic/transform/tests/fixture/styles2/input.js +++ /dev/null @@ -1,6 +0,0 @@ -// TODO: support common js -// import css from 'swc-magic/css' - -// module.exports = css` -// div { font-size: 3em } -// ` \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/styles2/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/styles2/output.lightningcss.js deleted file mode 100644 index e43253348..000000000 --- a/packages/swc-magic/transform/tests/fixture/styles2/output.lightningcss.js +++ /dev/null @@ -1,5 +0,0 @@ -// TODO: support common js -// import css from 'swc-magic/css' -// module.exports = css` -// div { font-size: 3em } -// ` diff --git a/packages/swc-magic/transform/tests/fixture/styles2/output.swc.js b/packages/swc-magic/transform/tests/fixture/styles2/output.swc.js deleted file mode 100644 index e43253348..000000000 --- a/packages/swc-magic/transform/tests/fixture/styles2/output.swc.js +++ /dev/null @@ -1,5 +0,0 @@ -// TODO: support common js -// import css from 'swc-magic/css' -// module.exports = css` -// div { font-size: 3em } -// ` diff --git a/packages/swc-magic/transform/tests/fixture/too-many/input.js b/packages/swc-magic/transform/tests/fixture/too-many/input.js deleted file mode 100644 index 86905e5ff..000000000 --- a/packages/swc-magic/transform/tests/fixture/too-many/input.js +++ /dev/null @@ -1,35 +0,0 @@ - - -export const Red = ({ - Component = 'button', -}) => { - - return ( - - - {/* Dynamic Styles */} - - - ); -}; - diff --git a/packages/swc-magic/transform/tests/fixture/too-many/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/too-many/output.lightningcss.js deleted file mode 100644 index c83217706..000000000 --- a/packages/swc-magic/transform/tests/fixture/too-many/output.lightningcss.js +++ /dev/null @@ -1,49 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export const Red = ({ Component = 'button' })=>{ - return - - - - {} - - <_JSXStyle id={"6c7c8cee856673a7"} dynamic={[ - e1, - e2, - e3, - e4, - e5, - e6, - e7, - e8, - e9, - e10, - e11, - e12, - e13, - e14, - e15 - ]}>{`.button.__jsx-style-dynamic-selector{--button-1:${e1};--button-2:${e2};--button-3:${e3};--button-4:${e4};--button-5:${e5};--button-6:${e6};--button-7:${e7};--button-8:${e8};--button-9:${e9};--button-10:${e10};--button-11:${e11};--button-12:${e12};--button-13:${e13};--button-14:${e14};--button-15:${e15}}`} - - ; -}; diff --git a/packages/swc-magic/transform/tests/fixture/too-many/output.swc.js b/packages/swc-magic/transform/tests/fixture/too-many/output.swc.js deleted file mode 100644 index c83217706..000000000 --- a/packages/swc-magic/transform/tests/fixture/too-many/output.swc.js +++ /dev/null @@ -1,49 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export const Red = ({ Component = 'button' })=>{ - return - - - - {} - - <_JSXStyle id={"6c7c8cee856673a7"} dynamic={[ - e1, - e2, - e3, - e4, - e5, - e6, - e7, - e8, - e9, - e10, - e11, - e12, - e13, - e14, - e15 - ]}>{`.button.__jsx-style-dynamic-selector{--button-1:${e1};--button-2:${e2};--button-3:${e3};--button-4:${e4};--button-5:${e5};--button-6:${e6};--button-7:${e7};--button-8:${e8};--button-9:${e9};--button-10:${e10};--button-11:${e11};--button-12:${e12};--button-13:${e13};--button-14:${e14};--button-15:${e15}}`} - - ; -}; diff --git a/packages/swc-magic/transform/tests/fixture/tpl-escape-1/input.js b/packages/swc-magic/transform/tests/fixture/tpl-escape-1/input.js deleted file mode 100644 index f01a4f412..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-escape-1/input.js +++ /dev/null @@ -1,14 +0,0 @@ -export default class { - render() { - return ( -
    -

    test

    - -
    - ) - } -} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-escape-1/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/tpl-escape-1/output.lightningcss.js deleted file mode 100644 index 96756deee..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-escape-1/output.lightningcss.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"1f6cef12199c3a8f"}>{'p.jsx-1f6cef12199c3a8f{content:"`"}'} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-escape-1/output.swc.js b/packages/swc-magic/transform/tests/fixture/tpl-escape-1/output.swc.js deleted file mode 100644 index 96756deee..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-escape-1/output.swc.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"1f6cef12199c3a8f"}>{'p.jsx-1f6cef12199c3a8f{content:"`"}'} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-escape-2/input.js b/packages/swc-magic/transform/tests/fixture/tpl-escape-2/input.js deleted file mode 100644 index d6ddd4447..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-escape-2/input.js +++ /dev/null @@ -1,17 +0,0 @@ -export default function Home({ fontFamily }) { - return ( -
    - -
    - ) -} \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/tpl-escape-2/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/tpl-escape-2/output.lightningcss.js deleted file mode 100644 index 860d64298..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-escape-2/output.lightningcss.js +++ /dev/null @@ -1,17 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default function Home({ fontFamily }) { - return
    - - <_JSXStyle id={"ae6b96ca586fe51a"} dynamic={[ - fontFamily - ]}>{`body{font-family:${fontFamily}}code:before,code:after{content:"\`"}`} - -
    ; -} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-escape-2/output.swc.js b/packages/swc-magic/transform/tests/fixture/tpl-escape-2/output.swc.js deleted file mode 100644 index 860d64298..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-escape-2/output.swc.js +++ /dev/null @@ -1,17 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default function Home({ fontFamily }) { - return
    - - <_JSXStyle id={"ae6b96ca586fe51a"} dynamic={[ - fontFamily - ]}>{`body{font-family:${fontFamily}}code:before,code:after{content:"\`"}`} - -
    ; -} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/input.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/input.js deleted file mode 100644 index 578f25c55..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/input.js +++ /dev/null @@ -1,17 +0,0 @@ -export default class { - render() { - return ( -
    -

    test

    - -
    - ) - } - } - \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/output.lightningcss.js deleted file mode 100644 index 885e71447..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/output.lightningcss.js +++ /dev/null @@ -1,28 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"e1b0d3df4c8dcbf0"} dynamic={[ - inputSize ? 'height: calc(2 * var(--a)) !important;' : '' - ]}>{`@media only screen{a.__jsx-style-dynamic-selector{${inputSize ? 'height: calc(2 * var(--a)) !important;' : ''}}`} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/output.swc.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/output.swc.js deleted file mode 100644 index 1e4198662..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-1-as-property/output.swc.js +++ /dev/null @@ -1,29 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"e1b0d3df4c8dcbf0"} dynamic={[ - inputSize ? 'height: calc(2 * var(--a)) !important;' : '' - ]}>{`@media only screen{a.__jsx-style-dynamic-selector{${inputSize ? 'height: calc(2 * var(--a)) !important;' : ''} - }}`} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/input.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/input.js deleted file mode 100644 index 3524c05ce..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/input.js +++ /dev/null @@ -1,21 +0,0 @@ -export default class { - render() { - return ( -
    -

    test

    - -
    - ) - } - } - \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/output.lightningcss.js deleted file mode 100644 index 0e5352590..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/output.lightningcss.js +++ /dev/null @@ -1,34 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"ad088d55a749d737"} dynamic={[ - a[b], - -1 * (c || 0), - d - ]}>{`.a:hover .b.__jsx-style-dynamic-selector{a:${a[b]}px!important;b:translate3d(0,${-1 * (c || 0)}px,-${d}px)scale(1)!important}`} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/output.swc.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/output.swc.js deleted file mode 100644 index 0e5352590..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-2-as-part-of-value/output.swc.js +++ /dev/null @@ -1,34 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"ad088d55a749d737"} dynamic={[ - a[b], - -1 * (c || 0), - d - ]}>{`.a:hover .b.__jsx-style-dynamic-selector{a:${a[b]}px!important;b:translate3d(0,${-1 * (c || 0)}px,-${d}px)scale(1)!important}`} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/input.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/input.js deleted file mode 100644 index 4528b59e6..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/input.js +++ /dev/null @@ -1,17 +0,0 @@ -export default class { - render() { - return ( -
    -

    test

    - -
    - ) - } - } - \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/output.lightningcss.js deleted file mode 100644 index fb33eaa69..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/output.lightningcss.js +++ /dev/null @@ -1,28 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"1b41b940177cfe8f"} dynamic={[ - a - ]}>{`@media only screen{a.__jsx-style-dynamic-selector{color:${a}}}`} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/output.swc.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/output.swc.js deleted file mode 100644 index fb33eaa69..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-3-as-value/output.swc.js +++ /dev/null @@ -1,28 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"1b41b940177cfe8f"} dynamic={[ - a - ]}>{`@media only screen{a.__jsx-style-dynamic-selector{color:${a}}}`} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/input.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/input.js deleted file mode 100644 index 492bf86a3..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/input.js +++ /dev/null @@ -1,17 +0,0 @@ -export default class { - render() { - return ( -
    -

    test

    - -
    - ) - } - } - \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/output.lightningcss.js deleted file mode 100644 index 7244fa1df..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/output.lightningcss.js +++ /dev/null @@ -1,31 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"293094c41b76e3ed"} dynamic={[ - a || 'var(--c)', - b || 'inherit' - ]}>{`.a:hover .b.__jsx-style-dynamic-selector{padding:0 ${a || 'var(--c)'};color:${b || 'inherit'};display:inline-block}`} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/output.swc.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/output.swc.js deleted file mode 100644 index e4a47af25..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-4-as-part-of-value-in-multiple/output.swc.js +++ /dev/null @@ -1,31 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"293094c41b76e3ed"} dynamic={[ - a || 'var(--c)', - b || 'inherit' - ]}>{`.a:hover .b.__jsx-style-dynamic-selector{display:inline-block;padding:0 ${a || 'var(--c)'};color:${b || 'inherit'}}`} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/input.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/input.js deleted file mode 100644 index bd1739e0b..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/input.js +++ /dev/null @@ -1,16 +0,0 @@ -export default class { - render() { - return ( -
    -

    test

    - -
    - ) - } - } - \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/output.lightningcss.js deleted file mode 100644 index 401e774cb..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/output.lightningcss.js +++ /dev/null @@ -1,31 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"d1d694613dfced19"} dynamic={[ - a ? '100%' : '200px', - b ? '0' : '8px 20px' - ]}>{`.item.__jsx-style-dynamic-selector{max-width:${a ? '100%' : '200px'};padding:${b ? '0' : '8px 20px'}}`} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/output.swc.js b/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/output.swc.js deleted file mode 100644 index 401e774cb..000000000 --- a/packages/swc-magic/transform/tests/fixture/tpl-placeholder-5-values-of-multiple-properties/output.swc.js +++ /dev/null @@ -1,31 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default class { - render() { - return
    - -

    test

    - - <_JSXStyle id={"d1d694613dfced19"} dynamic={[ - a ? '100%' : '200px', - b ? '0' : '8px 20px' - ]}>{`.item.__jsx-style-dynamic-selector{max-width:${a ? '100%' : '200px'};padding:${b ? '0' : '8px 20px'}}`} - -
    ; - } -} diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/input.js b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/input.js deleted file mode 100644 index a1c49f29d..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/input.js +++ /dev/null @@ -1,12 +0,0 @@ -export default () => ( -
    -

    test

    - -
    -) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/output.lightningcss.js deleted file mode 100644 index 17c499371..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/output.lightningcss.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"efc590d693035654"}>{".a-selector.jsx-efc590d693035654:hover,.a-selector.jsx-efc590d693035654:focus{outline:none}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/output.swc.js b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/output.swc.js deleted file mode 100644 index 17c499371..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector-2/output.swc.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"efc590d693035654"}>{".a-selector.jsx-efc590d693035654:hover,.a-selector.jsx-efc590d693035654:focus{outline:none}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/input.js b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/input.js deleted file mode 100644 index 5f3e7a94d..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/input.js +++ /dev/null @@ -1,116 +0,0 @@ -export default () => ( -
    -

    test

    - -
    -) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/output.lightningcss.js deleted file mode 100644 index 72256b74a..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/output.lightningcss.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"713499aa363d6373"}>{"p.jsx-713499aa363d6373 a.jsx-713499aa363d6373 span.jsx-713499aa363d6373{color:red}p.jsx-713499aa363d6373 span{background:#00f}p.jsx-713499aa363d6373 a[title=\"'w ' ' t'\"].jsx-713499aa363d6373{margin:auto}p.jsx-713499aa363d6373 span:not(.test){color:green}p.jsx-713499aa363d6373,h1.jsx-713499aa363d6373{color:#00f;animation:3s .1s infinite forwards hahaha}p.jsx-713499aa363d6373{animation:1s hahaha,2s hehehe}p.jsx-713499aa363d6373:hover,p.jsx-713499aa363d6373:before,:hover,:before,:hoverp.jsx-713499aa363d6373,p.jsx-713499aa363d6373+a.jsx-713499aa363d6373,p.jsx-713499aa363d6373~a.jsx-713499aa363d6373,p.jsx-713499aa363d6373>a.jsx-713499aa363d6373{color:red}@keyframes hahaha{0%{top:0}to{top:100px}}@keyframes hehehe{0%{left:0}to{left:100px}}@media (width>=500px){.test.jsx-713499aa363d6373{color:red}}.test.jsx-713499aa363d6373{display:block}.inline-flex.jsx-713499aa363d6373{display:inline-flex}.flex.jsx-713499aa363d6373{display:flex}.test.jsx-713499aa363d6373{box-shadow:0 0 10px #000,inset 0 0 5px #000}.test[title=\\,].jsx-713499aa363d6373{display:inline-block}.test.is-status.jsx-713499aa363d6373 .test.jsx-713499aa363d6373{color:red}.a-selector.jsx-713499aa363d6373:hover,.a-selector.jsx-713499aa363d6373:focus{outline:none}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/output.swc.js b/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/output.swc.js deleted file mode 100644 index a3b54aae6..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-complex-selector/output.swc.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"713499aa363d6373"}>{"p.jsx-713499aa363d6373 a.jsx-713499aa363d6373 span.jsx-713499aa363d6373{color:red}p.jsx-713499aa363d6373 span{background:blue}p.jsx-713499aa363d6373 a[title=\"'w ' ' t'\"].jsx-713499aa363d6373{margin:auto}p.jsx-713499aa363d6373 span:not(.test){color:green}p.jsx-713499aa363d6373,h1.jsx-713499aa363d6373{color:blue;-webkit-animation:hahaha 3s ease forwards infinite;-moz-animation:hahaha 3s ease forwards infinite;-o-animation:hahaha 3s ease forwards infinite;animation:hahaha 3s ease forwards infinite;-webkit-animation-name:hahaha;-moz-animation-name:hahaha;-o-animation-name:hahaha;animation-name:hahaha;-webkit-animation-delay:100ms;-moz-animation-delay:100ms;-o-animation-delay:100ms;animation-delay:100ms}p.jsx-713499aa363d6373{-webkit-animation:hahaha 1s,hehehe 2s;-moz-animation:hahaha 1s,hehehe 2s;-o-animation:hahaha 1s,hehehe 2s;animation:hahaha 1s,hehehe 2s}p.jsx-713499aa363d6373:hover{color:red}p.jsx-713499aa363d6373::before{color:red}.jsx-713499aa363d6373:hover{color:red}.jsx-713499aa363d6373::before{color:red}.jsx-713499aa363d6373:hover p.jsx-713499aa363d6373{color:red}p.jsx-713499aa363d6373+a.jsx-713499aa363d6373{color:red}p.jsx-713499aa363d6373~a.jsx-713499aa363d6373{color:red}p.jsx-713499aa363d6373>a.jsx-713499aa363d6373{color:red}@-webkit-keyframes hahaha{from{top:0}to{top:100}}@-moz-keyframes hahaha{from{top:0}to{top:100}}@-o-keyframes hahaha{from{top:0}to{top:100}}@keyframes hahaha{from{top:0}to{top:100}}@-webkit-keyframes hehehe{from{left:0}to{left:100}}@-moz-keyframes hehehe{from{left:0}to{left:100}}@-o-keyframes hehehe{from{left:0}to{left:100}}@keyframes hehehe{from{left:0}to{left:100}}@media(min-width:500px){.test.jsx-713499aa363d6373{color:red}}.test.jsx-713499aa363d6373{display:block}.inline-flex.jsx-713499aa363d6373{display:-webkit-inline-box;display:-webkit-inline-flex;display:-moz-inline-box;display:-ms-inline-flexbox;display:inline-flex}.flex.jsx-713499aa363d6373{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex}.test.jsx-713499aa363d6373{-webkit-box-shadow:0 0 10px black,inset 0 0 5px black;-moz-box-shadow:0 0 10px black,inset 0 0 5px black;box-shadow:0 0 10px black,inset 0 0 5px black}.test[title=\",\"].jsx-713499aa363d6373{display:inline-block}.test.is-status.jsx-713499aa363d6373 .test.jsx-713499aa363d6373{color:red}.a-selector.jsx-713499aa363d6373:hover,.a-selector.jsx-713499aa363d6373:focus{outline:none}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-global/input.js b/packages/swc-magic/transform/tests/fixture/transform-css-global/input.js deleted file mode 100644 index e97b1f933..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-global/input.js +++ /dev/null @@ -1,32 +0,0 @@ -export default () => ( -
    -

    test

    - -
    -) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-global/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/transform-css-global/output.lightningcss.js deleted file mode 100644 index 09a28ed9e..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-global/output.lightningcss.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"6881055ff9b1aeb6"}>{"html.jsx-6881055ff9b1aeb6{background-image:linear-gradient(#fffc,#fffc),url(/static/background.svg)}p{color:#001}h1{color:#002}h2,a.jsx-6881055ff9b1aeb6{color:#003}.foo+a{color:#004}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-global/output.swc.js b/packages/swc-magic/transform/tests/fixture/transform-css-global/output.swc.js deleted file mode 100644 index f9ba1afe9..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-global/output.swc.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"6881055ff9b1aeb6"}>{'html.jsx-6881055ff9b1aeb6{background-image:-webkit-linear-gradient(bottom,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg);background-image:-moz-linear-gradient(bottom,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg);background-image:-o-linear-gradient(bottom,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg);background-image:linear-gradient(0deg,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg)}p{color:#001}h1{color:#002}h2,a.jsx-6881055ff9b1aeb6{color:#003}.foo+a{color:#004}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif}'} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-media-query/input.js b/packages/swc-magic/transform/tests/fixture/transform-css-media-query/input.js deleted file mode 100644 index 978d21aac..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-media-query/input.js +++ /dev/null @@ -1,24 +0,0 @@ -export default () => ( -
    -

    test

    - -
    -) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-media-query/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/transform-css-media-query/output.lightningcss.js deleted file mode 100644 index eec52a001..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-media-query/output.lightningcss.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"1f7963ae04c6466a"}>{"@media (width>=1px) and (width<=768px){[class*=grid__col--].jsx-1f7963ae04c6466a{margin-top:12px;margin-bottom:12px}}@media (width<=64em){.test.jsx-1f7963ae04c6466a{margin-bottom:1em}@supports ((-moz-appearance:none)) and (display:contents){.test.jsx-1f7963ae04c6466a{margin-bottom:2rem}}}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-media-query/output.swc.js b/packages/swc-magic/transform/tests/fixture/transform-css-media-query/output.swc.js deleted file mode 100644 index bff727a8c..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-media-query/output.swc.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"1f7963ae04c6466a"}>{'@media(min-width:1px)and (max-width:768px){[class*="grid__col--"].jsx-1f7963ae04c6466a{margin-top:12px;margin-bottom:12px}}@media(max-width:64em){.test.jsx-1f7963ae04c6466a{margin-bottom:1em}@supports(-moz-appearance:none)and (display:contents){.test.jsx-1f7963ae04c6466a{margin-bottom:2rem}}}'} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-normal/input.js b/packages/swc-magic/transform/tests/fixture/transform-css-normal/input.js deleted file mode 100644 index c1964abbf..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-normal/input.js +++ /dev/null @@ -1,22 +0,0 @@ -export default () => ( -
    -

    test

    - -
    -) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-normal/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/transform-css-normal/output.lightningcss.js deleted file mode 100644 index 0d939bcea..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-normal/output.lightningcss.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"1a19bb4817c105dd"}>{"p.jsx-1a19bb4817c105dd{color:red}.jsx-1a19bb4817c105dd{color:#00f}[href=woot].jsx-1a19bb4817c105dd{color:red}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-normal/output.swc.js b/packages/swc-magic/transform/tests/fixture/transform-css-normal/output.swc.js deleted file mode 100644 index 24638cb19..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-normal/output.swc.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"1a19bb4817c105dd"}>{'p.jsx-1a19bb4817c105dd{color:red}p.jsx-1a19bb4817c105dd{color:red}*.jsx-1a19bb4817c105dd{color:blue}[href="woot"].jsx-1a19bb4817c105dd{color:red}'} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/input.js b/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/input.js deleted file mode 100644 index 1a119aab5..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/input.js +++ /dev/null @@ -1,10 +0,0 @@ -export default () => ( -
    -

    test

    - -
    - ) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/output.lightningcss.js deleted file mode 100644 index 38daeadc9..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/output.lightningcss.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"938ca197692ef624"}>{"li.jsx-938ca197692ef624:nth-child(2){color:#0f0}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/output.swc.js b/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/output.swc.js deleted file mode 100644 index 68e6510a9..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css-nth-1/output.swc.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"938ca197692ef624"}>{"li.jsx-938ca197692ef624:nth-child(2){color:lime}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css/input.js b/packages/swc-magic/transform/tests/fixture/transform-css/input.js deleted file mode 100644 index 5d851d68c..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css/input.js +++ /dev/null @@ -1,176 +0,0 @@ -export default () => ( -
    -

    test

    - -
    -) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/transform-css/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/transform-css/output.lightningcss.js deleted file mode 100644 index c87bfe113..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css/output.lightningcss.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"4a27e5cf1c34b3df"}>{"html.jsx-4a27e5cf1c34b3df{background-image:linear-gradient(#fffc,#fffc),url(/static/background.svg)}p{color:#002}p,a.jsx-4a27e5cf1c34b3df{color:#003}.foo+a{color:#004}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif}p.jsx-4a27e5cf1c34b3df{color:#006}.jsx-4a27e5cf1c34b3df{color:#007}[href=woot].jsx-4a27e5cf1c34b3df{color:#008}p.jsx-4a27e5cf1c34b3df a.jsx-4a27e5cf1c34b3df span.jsx-4a27e5cf1c34b3df{color:#009}p.jsx-4a27e5cf1c34b3df span{background:#00a}p.jsx-4a27e5cf1c34b3df a[title=\"'w ' ' t'\"].jsx-4a27e5cf1c34b3df{margin:auto}p.jsx-4a27e5cf1c34b3df span:not(.test){color:#00b}p.jsx-4a27e5cf1c34b3df,h1.jsx-4a27e5cf1c34b3df{color:#00c;animation:3s .1s infinite forwards hahaha}p.jsx-4a27e5cf1c34b3df{animation:1s hahaha,2s hehehe}p.jsx-4a27e5cf1c34b3df:hover{color:#00d}p.jsx-4a27e5cf1c34b3df:before{color:#00e}:hover{color:#00f}:before{color:#010}:hoverp.jsx-4a27e5cf1c34b3df{color:#011}p.jsx-4a27e5cf1c34b3df+a.jsx-4a27e5cf1c34b3df{color:#012}p.jsx-4a27e5cf1c34b3df~a.jsx-4a27e5cf1c34b3df{color:#013}p.jsx-4a27e5cf1c34b3df>a.jsx-4a27e5cf1c34b3df{color:#014}@keyframes hahaha{0%{top:0}to{top:100px}}@keyframes hehehe{0%{left:0}to{left:100px}}@media (width>=500px){.test.jsx-4a27e5cf1c34b3df{color:#015}}.test.jsx-4a27e5cf1c34b3df{display:block}.inline-flex.jsx-4a27e5cf1c34b3df{display:inline-flex}.flex.jsx-4a27e5cf1c34b3df{display:flex}.test.jsx-4a27e5cf1c34b3df{box-shadow:0 0 10px #000,inset 0 0 5px #000}.test[title=\\,].jsx-4a27e5cf1c34b3df{display:inline-block}.test.is-status.jsx-4a27e5cf1c34b3df .test.jsx-4a27e5cf1c34b3df{color:#016}.a-selector.jsx-4a27e5cf1c34b3df:hover,.a-selector.jsx-4a27e5cf1c34b3df:focus{outline:none}@media (width>=1px) and (width<=768px){[class*=grid__col--].jsx-4a27e5cf1c34b3df{margin-top:12px;margin-bottom:12px}}@media (width<=64em){.test.jsx-4a27e5cf1c34b3df{margin-bottom:1em}@supports ((-moz-appearance:none)) and (display:contents){.test.jsx-4a27e5cf1c34b3df{margin-bottom:2rem}}}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/transform-css/output.swc.js b/packages/swc-magic/transform/tests/fixture/transform-css/output.swc.js deleted file mode 100644 index 29739dc6d..000000000 --- a/packages/swc-magic/transform/tests/fixture/transform-css/output.swc.js +++ /dev/null @@ -1,8 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - - <_JSXStyle id={"4a27e5cf1c34b3df"}>{'html.jsx-4a27e5cf1c34b3df{background-image:-webkit-linear-gradient(bottom,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg);background-image:-moz-linear-gradient(bottom,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg);background-image:-o-linear-gradient(bottom,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg);background-image:linear-gradient(0deg,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg)}p{color:#001}p{color:#002}p,a.jsx-4a27e5cf1c34b3df{color:#003}.foo+a{color:#004}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif}p.jsx-4a27e5cf1c34b3df{color:#005}p.jsx-4a27e5cf1c34b3df{color:#006}*.jsx-4a27e5cf1c34b3df{color:#007}[href="woot"].jsx-4a27e5cf1c34b3df{color:#008}p.jsx-4a27e5cf1c34b3df a.jsx-4a27e5cf1c34b3df span.jsx-4a27e5cf1c34b3df{color:#009}p.jsx-4a27e5cf1c34b3df span{background:#00a}p.jsx-4a27e5cf1c34b3df a[title="\'w \' \' t\'"].jsx-4a27e5cf1c34b3df{margin:auto}p.jsx-4a27e5cf1c34b3df span:not(.test){color:#00b}p.jsx-4a27e5cf1c34b3df,h1.jsx-4a27e5cf1c34b3df{color:#00c;-webkit-animation:hahaha 3s ease forwards infinite;-moz-animation:hahaha 3s ease forwards infinite;-o-animation:hahaha 3s ease forwards infinite;animation:hahaha 3s ease forwards infinite;-webkit-animation-name:hahaha;-moz-animation-name:hahaha;-o-animation-name:hahaha;animation-name:hahaha;-webkit-animation-delay:100ms;-moz-animation-delay:100ms;-o-animation-delay:100ms;animation-delay:100ms}p.jsx-4a27e5cf1c34b3df{-webkit-animation:hahaha 1s,hehehe 2s;-moz-animation:hahaha 1s,hehehe 2s;-o-animation:hahaha 1s,hehehe 2s;animation:hahaha 1s,hehehe 2s}p.jsx-4a27e5cf1c34b3df:hover{color:#00d}p.jsx-4a27e5cf1c34b3df::before{color:#00e}.jsx-4a27e5cf1c34b3df:hover{color:#00f}.jsx-4a27e5cf1c34b3df::before{color:#010}.jsx-4a27e5cf1c34b3df:hover p.jsx-4a27e5cf1c34b3df{color:#011}p.jsx-4a27e5cf1c34b3df+a.jsx-4a27e5cf1c34b3df{color:#012}p.jsx-4a27e5cf1c34b3df~a.jsx-4a27e5cf1c34b3df{color:#013}p.jsx-4a27e5cf1c34b3df>a.jsx-4a27e5cf1c34b3df{color:#014}@-webkit-keyframes hahaha{from{top:0}to{top:100}}@-moz-keyframes hahaha{from{top:0}to{top:100}}@-o-keyframes hahaha{from{top:0}to{top:100}}@keyframes hahaha{from{top:0}to{top:100}}@-webkit-keyframes hehehe{from{left:0}to{left:100}}@-moz-keyframes hehehe{from{left:0}to{left:100}}@-o-keyframes hehehe{from{left:0}to{left:100}}@keyframes hehehe{from{left:0}to{left:100}}@media(min-width:500px){.test.jsx-4a27e5cf1c34b3df{color:#015}}.test.jsx-4a27e5cf1c34b3df{display:block}.inline-flex.jsx-4a27e5cf1c34b3df{display:-webkit-inline-box;display:-webkit-inline-flex;display:-moz-inline-box;display:-ms-inline-flexbox;display:inline-flex}.flex.jsx-4a27e5cf1c34b3df{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex}.test.jsx-4a27e5cf1c34b3df{-webkit-box-shadow:0 0 10px black,inset 0 0 5px black;-moz-box-shadow:0 0 10px black,inset 0 0 5px black;box-shadow:0 0 10px black,inset 0 0 5px black}.test[title=","].jsx-4a27e5cf1c34b3df{display:inline-block}.test.is-status.jsx-4a27e5cf1c34b3df .test.jsx-4a27e5cf1c34b3df{color:#016}.a-selector.jsx-4a27e5cf1c34b3df:hover,.a-selector.jsx-4a27e5cf1c34b3df:focus{outline:none}@media(min-width:1px)and (max-width:768px){[class*="grid__col--"].jsx-4a27e5cf1c34b3df{margin-top:12px;margin-bottom:12px}}@media(max-width:64em){.test.jsx-4a27e5cf1c34b3df{margin-bottom:1em}@supports(-moz-appearance:none)and (display:contents){.test.jsx-4a27e5cf1c34b3df{margin-bottom:2rem}}}'} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/whitespace/input.js b/packages/swc-magic/transform/tests/fixture/whitespace/input.js deleted file mode 100644 index 8a6d77828..000000000 --- a/packages/swc-magic/transform/tests/fixture/whitespace/input.js +++ /dev/null @@ -1,12 +0,0 @@ -export default () => ( -
    -

    test

    -

    woot

    -

    woot

    - -
    -) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/whitespace/output.lightningcss.js b/packages/swc-magic/transform/tests/fixture/whitespace/output.lightningcss.js deleted file mode 100644 index a34f8a402..000000000 --- a/packages/swc-magic/transform/tests/fixture/whitespace/output.lightningcss.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - -

    woot

    - -

    woot

    - - <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-94239b6d6b42c9b5{color:red}"} - -
    ); diff --git a/packages/swc-magic/transform/tests/fixture/whitespace/output.swc.js b/packages/swc-magic/transform/tests/fixture/whitespace/output.swc.js deleted file mode 100644 index a34f8a402..000000000 --- a/packages/swc-magic/transform/tests/fixture/whitespace/output.swc.js +++ /dev/null @@ -1,12 +0,0 @@ -import _JSXStyle from "swc-magic/style"; -export default (()=>
    - -

    test

    - -

    woot

    - -

    woot

    - - <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-94239b6d6b42c9b5{color:red}"} - -
    ); From 7eb49120a7cb51937d494308d2cb1184d0d4d2b9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:27:58 -0700 Subject: [PATCH 04/47] swc-magic --- Cargo.toml | 1 + 1 file changed, 1 insertion(+) diff --git a/Cargo.toml b/Cargo.toml index 0be9ed180..7d98dcc32 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -11,6 +11,7 @@ members = [ "packages/remove-console", "packages/styled-components", "packages/styled-jsx", + "packages/swc-magic", "packages/transform-imports", ] From 9b8033e9d1187a112fcdbed701429cebe0ac8a4a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:28:01 -0700 Subject: [PATCH 05/47] cargo lockfile --- Cargo.lock | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/Cargo.lock b/Cargo.lock index 2e6f00e38..76bac1fa0 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -3024,6 +3024,10 @@ dependencies = [ "tracing", ] +[[package]] +name = "swc_plugin_swc_magic" +version = "0.1.0" + [[package]] name = "swc_plugin_transform_imports" version = "0.13.3" From 37f149fbf3bdbc837fc1f922cdd7ae98a4e53620 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:29:53 -0700 Subject: [PATCH 06/47] Include --- packages/swc-magic/Cargo.toml | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/swc-magic/Cargo.toml b/packages/swc-magic/Cargo.toml index 36afc9f63..68dda2d4c 100644 --- a/packages/swc-magic/Cargo.toml +++ b/packages/swc-magic/Cargo.toml @@ -11,3 +11,6 @@ version = "0.1.0" crate-type = ["cdylib", "rlib"] [dependencies] + + +swc_magic = { path = "./transform" } From 3d4cfc25e483eb78ec16ef460f01cfc33b4e84a8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:29:55 -0700 Subject: [PATCH 07/47] cargo lockfile --- Cargo.lock | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/Cargo.lock b/Cargo.lock index 76bac1fa0..7f7bb70bb 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -2827,6 +2827,10 @@ dependencies = [ "syn 2.0.32", ] +[[package]] +name = "swc_magic" +version = "0.1.0" + [[package]] name = "swc_plugin" version = "0.90.0" @@ -3027,6 +3031,9 @@ dependencies = [ [[package]] name = "swc_plugin_swc_magic" version = "0.1.0" +dependencies = [ + "swc_magic", +] [[package]] name = "swc_plugin_transform_imports" From 1ad1ad902b1753b1860ee270ad59c838474a40ca Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:30:06 -0700 Subject: [PATCH 08/47] Dep --- packages/swc-magic/transform/Cargo.toml | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/packages/swc-magic/transform/Cargo.toml b/packages/swc-magic/transform/Cargo.toml index 28ab19f70..cd4c2935e 100644 --- a/packages/swc-magic/transform/Cargo.toml +++ b/packages/swc-magic/transform/Cargo.toml @@ -7,3 +7,8 @@ name = "swc_magic" version = "0.1.0" [dependencies] +swc_atoms = "0.6.0" +swc_common = "0.33.1" +swc_ecma_ast = "0.110.1" +swc_ecma_utils = "0.124.8" +swc_ecma_visit = "0.96.1" From 383f80e7577de6748b6c24cc0c34e81d009726d6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:30:09 -0700 Subject: [PATCH 09/47] cargo lockfile --- Cargo.lock | 23 +++++++++++++++-------- 1 file changed, 15 insertions(+), 8 deletions(-) diff --git a/Cargo.lock b/Cargo.lock index 7f7bb70bb..e83bf20a7 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -2233,9 +2233,9 @@ dependencies = [ [[package]] name = "swc_common" -version = "0.33.0" +version = "0.33.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "490e199e25d2aa3fbef675524fa81408651f4e7178b51110470ddd1b3e3bbe75" +checksum = "a7c5aff4c50b1cb313487bb3dff99082779e1509a9d7e3b993790cb9ff72d14b" dependencies = [ "anyhow", "ast_node", @@ -2444,9 +2444,9 @@ dependencies = [ [[package]] name = "swc_ecma_ast" -version = "0.110.0" +version = "0.110.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "5cbbf9918976a7e7fbdb4f76fe659d08e291a8b56b524b424183fc67d1189679" +checksum = "ad53346adc2eb4f2accc5ff612ef6c5e0e4a687ce45c354816e628e5f7c8d876" dependencies = [ "bitflags 2.4.0", "bytecheck", @@ -2721,9 +2721,9 @@ dependencies = [ [[package]] name = "swc_ecma_utils" -version = "0.124.4" +version = "0.124.8" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "4d5dd053e9a21c433504664d7083869c9d02394eb5141b101c81067067536471" +checksum = "b85d6043cc8f771d2b8dae78062931ce65ad4552198c6a4fdcc5c4888facf01a" dependencies = [ "indexmap", "num_cpus", @@ -2739,9 +2739,9 @@ dependencies = [ [[package]] name = "swc_ecma_visit" -version = "0.96.0" +version = "0.96.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "47081acd84cdb2d49d6340ed3204e17738b444da10a3e1dd1eb3d7c8e4d47091" +checksum = "582559a61496786b159640b50e99320ca5cd7f3f4ea09afd5f48c02253ba579b" dependencies = [ "num-bigint", "swc_atoms", @@ -2830,6 +2830,13 @@ dependencies = [ [[package]] name = "swc_magic" version = "0.1.0" +dependencies = [ + "swc_atoms", + "swc_common", + "swc_ecma_ast", + "swc_ecma_utils", + "swc_ecma_visit", +] [[package]] name = "swc_plugin" From 229e7d0a6d2ad7cc233d1d005ff58aa3d0474204 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:32:10 -0700 Subject: [PATCH 10/47] Import map --- .../transform/src/import_analyzer.rs | 96 ++ packages/swc-magic/transform/src/lib.rs | 8 +- packages/swc-magic/transform/src/lifetime.rs | 409 -------- packages/swc-magic/transform/src/style.rs | 25 - .../src/transform_css_lightningcss.rs | 589 ----------- .../transform/src/transform_css_swc.rs | 393 ------- packages/swc-magic/transform/src/utils.rs | 371 ------- packages/swc-magic/transform/src/visitor.rs | 963 ------------------ 8 files changed, 98 insertions(+), 2756 deletions(-) create mode 100644 packages/swc-magic/transform/src/import_analyzer.rs delete mode 100644 packages/swc-magic/transform/src/lifetime.rs delete mode 100644 packages/swc-magic/transform/src/style.rs delete mode 100644 packages/swc-magic/transform/src/transform_css_lightningcss.rs delete mode 100644 packages/swc-magic/transform/src/transform_css_swc.rs delete mode 100644 packages/swc-magic/transform/src/utils.rs delete mode 100644 packages/swc-magic/transform/src/visitor.rs diff --git a/packages/swc-magic/transform/src/import_analyzer.rs b/packages/swc-magic/transform/src/import_analyzer.rs new file mode 100644 index 000000000..4c4902ea3 --- /dev/null +++ b/packages/swc-magic/transform/src/import_analyzer.rs @@ -0,0 +1,96 @@ +use swc_atoms::JsWord; +use swc_common::collections::{AHashMap, AHashSet}; +use swc_ecma_ast::*; +use swc_ecma_visit::{noop_visit_type, Visit, VisitWith}; + +#[derive(Debug, Default)] +pub(crate) struct ImportMap { + /// Map from module name to (module path, exported symbol) + imports: AHashMap, + + namespace_imports: AHashMap, + + imported_modules: AHashSet, +} + +impl ImportMap { + pub fn is_module_imported(&mut self, module: &JsWord) -> bool { + self.imported_modules.contains(module) + } + + /// Returns true if `e` is an import of `orig_name` from `module`. + pub fn is_import(&self, e: &Expr, module: &str, orig_name: &str) -> bool { + match e { + Expr::Ident(i) => { + if let Some((i_src, i_sym)) = self.imports.get(&i.to_id()) { + i_src == module && i_sym == orig_name + } else { + false + } + } + + Expr::Member(MemberExpr { + obj: box Expr::Ident(obj), + prop: MemberProp::Ident(prop), + .. + }) => { + if let Some(obj_src) = self.namespace_imports.get(&obj.to_id()) { + obj_src == module && prop.sym == *orig_name + } else { + false + } + } + + _ => false, + } + } + + pub fn analyze(m: &Module) -> Self { + let mut data = ImportMap::default(); + + m.visit_with(&mut Analyzer { data: &mut data }); + + data + } +} + +struct Analyzer<'a> { + data: &'a mut ImportMap, +} + +impl Visit for Analyzer<'_> { + noop_visit_type!(); + + fn visit_import_decl(&mut self, import: &ImportDecl) { + self.data.imported_modules.insert(import.src.value.clone()); + + for s in &import.specifiers { + let (local, orig_sym) = match s { + ImportSpecifier::Named(ImportNamedSpecifier { + local, imported, .. + }) => match imported { + Some(imported) => (local.to_id(), orig_name(imported)), + _ => (local.to_id(), local.sym.clone()), + }, + ImportSpecifier::Default(s) => (s.local.to_id(), "default".into()), + ImportSpecifier::Namespace(s) => { + self.data + .namespace_imports + .insert(s.local.to_id(), import.src.value.clone()); + continue; + } + }; + + self.data + .imports + .insert(local, (import.src.value.clone(), orig_sym)); + } + } +} + +fn orig_name(n: &ModuleExportName) -> JsWord { + match n { + ModuleExportName::Ident(v) => v.sym.clone(), + ModuleExportName::Str(v) => v.value.clone(), + } +} diff --git a/packages/swc-magic/transform/src/lib.rs b/packages/swc-magic/transform/src/lib.rs index 59290e450..8d7197393 100644 --- a/packages/swc-magic/transform/src/lib.rs +++ b/packages/swc-magic/transform/src/lib.rs @@ -1,7 +1,3 @@ #![feature(box_patterns)] -mod lifetime; -pub mod style; -mod transform_css_lightningcss; -mod transform_css_swc; -mod utils; -pub mod visitor; + +mod import_analyzer; diff --git a/packages/swc-magic/transform/src/lifetime.rs b/packages/swc-magic/transform/src/lifetime.rs deleted file mode 100644 index 630fab20e..000000000 --- a/packages/swc-magic/transform/src/lifetime.rs +++ /dev/null @@ -1,409 +0,0 @@ -#![deny(unused)] - -use lightningcss::{ - properties::custom::TokenList, - selector::{Component, Selector, ViewTransitionPartName}, - traits::IntoOwned, -}; -use parcel_selectors::{ - attr::{AttrSelectorWithOptionalNamespace, NamespaceConstraint, ParsedAttrSelectorOperation}, - parser::{LocalName, NthOfSelectorData}, -}; - -pub fn owned_selector<'i>(sel: &Selector) -> Selector<'i> { - let mut buf: Vec> = vec![]; - - for component in sel.iter_raw_parse_order_from(0) { - buf.push(owned_component(component)); - } - - Selector::from(buf) -} - -pub fn owned_component<'i>(c: &Component) -> Component<'i> { - match c { - parcel_selectors::parser::Component::Combinator(v) => { - parcel_selectors::parser::Component::Combinator(*v) - } - parcel_selectors::parser::Component::ExplicitAnyNamespace => { - parcel_selectors::parser::Component::ExplicitAnyNamespace - } - parcel_selectors::parser::Component::ExplicitNoNamespace => { - parcel_selectors::parser::Component::ExplicitNoNamespace - } - parcel_selectors::parser::Component::DefaultNamespace(v) => { - parcel_selectors::parser::Component::DefaultNamespace(v.clone().into_owned()) - } - parcel_selectors::parser::Component::Namespace(v1, v2) => { - parcel_selectors::parser::Component::Namespace( - v1.clone().into_owned(), - v2.clone().into_owned(), - ) - } - parcel_selectors::parser::Component::ExplicitUniversalType => { - parcel_selectors::parser::Component::ExplicitUniversalType - } - parcel_selectors::parser::Component::ID(v) => { - parcel_selectors::parser::Component::ID(v.clone().into_owned()) - } - parcel_selectors::parser::Component::Class(v) => { - parcel_selectors::parser::Component::Class(v.clone().into_owned()) - } - parcel_selectors::parser::Component::Root => parcel_selectors::parser::Component::Root, - parcel_selectors::parser::Component::Empty => parcel_selectors::parser::Component::Empty, - parcel_selectors::parser::Component::Scope => parcel_selectors::parser::Component::Scope, - parcel_selectors::parser::Component::PseudoElement(v) => { - parcel_selectors::parser::Component::PseudoElement(owned_psuedo_element(v)) - } - parcel_selectors::parser::Component::Nesting => { - parcel_selectors::parser::Component::Nesting - } - - parcel_selectors::parser::Component::AttributeInNoNamespaceExists { - local_name, - local_name_lower, - } => parcel_selectors::parser::Component::AttributeInNoNamespaceExists { - local_name: local_name.clone().into_owned(), - local_name_lower: local_name_lower.clone().into_owned(), - }, - parcel_selectors::parser::Component::AttributeInNoNamespace { - local_name, - operator, - value, - case_sensitivity, - never_matches, - } => parcel_selectors::parser::Component::AttributeInNoNamespace { - local_name: local_name.clone().into_owned(), - operator: *operator, - value: value.clone().into_owned(), - case_sensitivity: *case_sensitivity, - never_matches: *never_matches, - }, - parcel_selectors::parser::Component::AttributeOther(v) => { - parcel_selectors::parser::Component::AttributeOther(Box::new( - AttrSelectorWithOptionalNamespace { - namespace: v.namespace.as_ref().map(|v| match v { - NamespaceConstraint::Any => NamespaceConstraint::Any, - NamespaceConstraint::Specific((v1, v2)) => NamespaceConstraint::Specific(( - v1.clone().into_owned(), - v2.clone().into_owned(), - )), - }), - local_name: v.local_name.clone().into_owned(), - local_name_lower: v.local_name_lower.clone().into_owned(), - operation: match &v.operation { - ParsedAttrSelectorOperation::Exists => ParsedAttrSelectorOperation::Exists, - ParsedAttrSelectorOperation::WithValue { - operator, - case_sensitivity, - expected_value, - } => ParsedAttrSelectorOperation::WithValue { - operator: *operator, - case_sensitivity: *case_sensitivity, - expected_value: expected_value.clone().into_owned(), - }, - }, - never_matches: v.never_matches, - }, - )) - } - parcel_selectors::parser::Component::Negation(v) => { - parcel_selectors::parser::Component::Negation(owned_selectors(v)) - } - parcel_selectors::parser::Component::LocalName(v1) => { - parcel_selectors::parser::Component::LocalName(LocalName { - name: v1.name.clone().into_owned(), - lower_name: v1.lower_name.clone().into_owned(), - }) - } - parcel_selectors::parser::Component::Nth(v) => parcel_selectors::parser::Component::Nth(*v), - parcel_selectors::parser::Component::NthOf(v) => { - parcel_selectors::parser::Component::NthOf(NthOfSelectorData::new( - *v.nth_data(), - owned_selectors(v.selectors()), - )) - } - parcel_selectors::parser::Component::NonTSPseudoClass(v) => { - parcel_selectors::parser::Component::NonTSPseudoClass(owned_psuedo_class(v)) - } - parcel_selectors::parser::Component::Slotted(v) => { - parcel_selectors::parser::Component::Slotted(owned_selector(v)) - } - parcel_selectors::parser::Component::Part(v) => parcel_selectors::parser::Component::Part( - v.iter().map(|v| v.clone().into_owned()).collect(), - ), - parcel_selectors::parser::Component::Host(v) => { - parcel_selectors::parser::Component::Host(v.as_ref().map(owned_selector)) - } - parcel_selectors::parser::Component::Where(v) => { - parcel_selectors::parser::Component::Where(owned_selectors(v)) - } - parcel_selectors::parser::Component::Is(v) => { - parcel_selectors::parser::Component::Is(owned_selectors(v)) - } - parcel_selectors::parser::Component::Any(v1, v2) => { - parcel_selectors::parser::Component::Any(*v1, owned_selectors(v2)) - } - parcel_selectors::parser::Component::Has(v) => { - parcel_selectors::parser::Component::Has(owned_selectors(v)) - } - } -} - -fn owned_psuedo_element<'i>( - v: &lightningcss::selector::PseudoElement, -) -> lightningcss::selector::PseudoElement<'i> { - match v { - lightningcss::selector::PseudoElement::After => { - lightningcss::selector::PseudoElement::After - } - lightningcss::selector::PseudoElement::Before => { - lightningcss::selector::PseudoElement::Before - } - lightningcss::selector::PseudoElement::FirstLine => { - lightningcss::selector::PseudoElement::FirstLine - } - lightningcss::selector::PseudoElement::FirstLetter => { - lightningcss::selector::PseudoElement::FirstLetter - } - lightningcss::selector::PseudoElement::Selection(v) => { - lightningcss::selector::PseudoElement::Selection(*v) - } - lightningcss::selector::PseudoElement::Placeholder(v) => { - lightningcss::selector::PseudoElement::Placeholder(*v) - } - lightningcss::selector::PseudoElement::Marker => { - lightningcss::selector::PseudoElement::Marker - } - lightningcss::selector::PseudoElement::Backdrop(v) => { - lightningcss::selector::PseudoElement::Backdrop(*v) - } - - lightningcss::selector::PseudoElement::FileSelectorButton(v) => { - lightningcss::selector::PseudoElement::FileSelectorButton(*v) - } - lightningcss::selector::PseudoElement::WebKitScrollbar(v) => { - lightningcss::selector::PseudoElement::WebKitScrollbar(v.clone()) - } - lightningcss::selector::PseudoElement::Cue => lightningcss::selector::PseudoElement::Cue, - lightningcss::selector::PseudoElement::CueRegion => { - lightningcss::selector::PseudoElement::CueRegion - } - lightningcss::selector::PseudoElement::CueFunction { selector } => { - lightningcss::selector::PseudoElement::CueFunction { - selector: Box::new(owned_selector(selector)), - } - } - lightningcss::selector::PseudoElement::CueRegionFunction { selector } => { - lightningcss::selector::PseudoElement::CueRegionFunction { - selector: Box::new(owned_selector(selector)), - } - } - lightningcss::selector::PseudoElement::ViewTransition => { - lightningcss::selector::PseudoElement::ViewTransition - } - lightningcss::selector::PseudoElement::ViewTransitionGroup { part_name } => { - lightningcss::selector::PseudoElement::ViewTransitionGroup { - part_name: owned_view_transition_part_name(part_name), - } - } - lightningcss::selector::PseudoElement::ViewTransitionImagePair { part_name } => { - lightningcss::selector::PseudoElement::ViewTransitionImagePair { - part_name: owned_view_transition_part_name(part_name), - } - } - lightningcss::selector::PseudoElement::ViewTransitionOld { part_name } => { - lightningcss::selector::PseudoElement::ViewTransitionOld { - part_name: owned_view_transition_part_name(part_name), - } - } - lightningcss::selector::PseudoElement::ViewTransitionNew { part_name } => { - lightningcss::selector::PseudoElement::ViewTransitionNew { - part_name: owned_view_transition_part_name(part_name), - } - } - lightningcss::selector::PseudoElement::Custom { name } => { - lightningcss::selector::PseudoElement::Custom { - name: name.clone().into_owned(), - } - } - lightningcss::selector::PseudoElement::CustomFunction { name, arguments } => { - lightningcss::selector::PseudoElement::CustomFunction { - name: name.clone().into_owned(), - arguments: owned_token_list(arguments), - } - } - } -} - -fn owned_view_transition_part_name<'i>(n: &ViewTransitionPartName) -> ViewTransitionPartName<'i> { - match n { - ViewTransitionPartName::All => ViewTransitionPartName::All, - ViewTransitionPartName::Name(v) => ViewTransitionPartName::Name(v.clone().into_owned()), - } -} - -fn owned_psuedo_class<'i>( - v: &lightningcss::selector::PseudoClass, -) -> lightningcss::selector::PseudoClass<'i> { - match v { - lightningcss::selector::PseudoClass::Lang { languages } => { - lightningcss::selector::PseudoClass::Lang { - languages: languages.iter().map(|v| v.clone().into_owned()).collect(), - } - } - lightningcss::selector::PseudoClass::Dir { direction } => { - lightningcss::selector::PseudoClass::Dir { - direction: *direction, - } - } - lightningcss::selector::PseudoClass::Hover => lightningcss::selector::PseudoClass::Hover, - lightningcss::selector::PseudoClass::Active => lightningcss::selector::PseudoClass::Active, - lightningcss::selector::PseudoClass::Focus => lightningcss::selector::PseudoClass::Focus, - lightningcss::selector::PseudoClass::FocusVisible => { - lightningcss::selector::PseudoClass::FocusVisible - } - lightningcss::selector::PseudoClass::FocusWithin => { - lightningcss::selector::PseudoClass::FocusWithin - } - lightningcss::selector::PseudoClass::Current => { - lightningcss::selector::PseudoClass::Current - } - lightningcss::selector::PseudoClass::Past => lightningcss::selector::PseudoClass::Past, - lightningcss::selector::PseudoClass::Future => lightningcss::selector::PseudoClass::Future, - lightningcss::selector::PseudoClass::Playing => { - lightningcss::selector::PseudoClass::Playing - } - lightningcss::selector::PseudoClass::Paused => lightningcss::selector::PseudoClass::Paused, - lightningcss::selector::PseudoClass::Seeking => { - lightningcss::selector::PseudoClass::Seeking - } - lightningcss::selector::PseudoClass::Buffering => { - lightningcss::selector::PseudoClass::Buffering - } - lightningcss::selector::PseudoClass::Stalled => { - lightningcss::selector::PseudoClass::Stalled - } - lightningcss::selector::PseudoClass::Muted => lightningcss::selector::PseudoClass::Muted, - lightningcss::selector::PseudoClass::VolumeLocked => { - lightningcss::selector::PseudoClass::VolumeLocked - } - lightningcss::selector::PseudoClass::Fullscreen(v) => { - lightningcss::selector::PseudoClass::Fullscreen(*v) - } - lightningcss::selector::PseudoClass::Open => lightningcss::selector::PseudoClass::Open, - lightningcss::selector::PseudoClass::Closed => lightningcss::selector::PseudoClass::Closed, - lightningcss::selector::PseudoClass::Modal => lightningcss::selector::PseudoClass::Modal, - lightningcss::selector::PseudoClass::PictureInPicture => { - lightningcss::selector::PseudoClass::PictureInPicture - } - lightningcss::selector::PseudoClass::PopoverOpen => { - lightningcss::selector::PseudoClass::PopoverOpen - } - lightningcss::selector::PseudoClass::Defined => { - lightningcss::selector::PseudoClass::Defined - } - lightningcss::selector::PseudoClass::AnyLink(v) => { - lightningcss::selector::PseudoClass::AnyLink(*v) - } - lightningcss::selector::PseudoClass::Link => lightningcss::selector::PseudoClass::Link, - lightningcss::selector::PseudoClass::LocalLink => { - lightningcss::selector::PseudoClass::LocalLink - } - lightningcss::selector::PseudoClass::Target => lightningcss::selector::PseudoClass::Target, - lightningcss::selector::PseudoClass::TargetWithin => { - lightningcss::selector::PseudoClass::TargetWithin - } - lightningcss::selector::PseudoClass::Visited => { - lightningcss::selector::PseudoClass::Visited - } - lightningcss::selector::PseudoClass::Enabled => { - lightningcss::selector::PseudoClass::Enabled - } - lightningcss::selector::PseudoClass::Disabled => { - lightningcss::selector::PseudoClass::Disabled - } - lightningcss::selector::PseudoClass::ReadOnly(v) => { - lightningcss::selector::PseudoClass::ReadOnly(*v) - } - lightningcss::selector::PseudoClass::ReadWrite(v) => { - lightningcss::selector::PseudoClass::ReadWrite(*v) - } - lightningcss::selector::PseudoClass::PlaceholderShown(v) => { - lightningcss::selector::PseudoClass::PlaceholderShown(*v) - } - lightningcss::selector::PseudoClass::Default => { - lightningcss::selector::PseudoClass::Default - } - lightningcss::selector::PseudoClass::Checked => { - lightningcss::selector::PseudoClass::Checked - } - lightningcss::selector::PseudoClass::Indeterminate => { - lightningcss::selector::PseudoClass::Indeterminate - } - lightningcss::selector::PseudoClass::Blank => lightningcss::selector::PseudoClass::Blank, - lightningcss::selector::PseudoClass::Valid => lightningcss::selector::PseudoClass::Valid, - lightningcss::selector::PseudoClass::Invalid => { - lightningcss::selector::PseudoClass::Invalid - } - lightningcss::selector::PseudoClass::InRange => { - lightningcss::selector::PseudoClass::InRange - } - lightningcss::selector::PseudoClass::OutOfRange => { - lightningcss::selector::PseudoClass::OutOfRange - } - lightningcss::selector::PseudoClass::Required => { - lightningcss::selector::PseudoClass::Required - } - lightningcss::selector::PseudoClass::Optional => { - lightningcss::selector::PseudoClass::Optional - } - lightningcss::selector::PseudoClass::UserValid => { - lightningcss::selector::PseudoClass::UserValid - } - lightningcss::selector::PseudoClass::UserInvalid => { - lightningcss::selector::PseudoClass::UserInvalid - } - lightningcss::selector::PseudoClass::Autofill(v) => { - lightningcss::selector::PseudoClass::Autofill(*v) - } - lightningcss::selector::PseudoClass::Local { selector } => { - lightningcss::selector::PseudoClass::Local { - selector: Box::new(owned_selector(selector)), - } - } - lightningcss::selector::PseudoClass::Global { selector } => { - lightningcss::selector::PseudoClass::Global { - selector: Box::new(owned_selector(selector)), - } - } - lightningcss::selector::PseudoClass::WebKitScrollbar(v) => { - lightningcss::selector::PseudoClass::WebKitScrollbar(v.clone()) - } - lightningcss::selector::PseudoClass::Custom { name } => { - lightningcss::selector::PseudoClass::Custom { - name: name.clone().into_owned(), - } - } - lightningcss::selector::PseudoClass::CustomFunction { name, arguments } => { - lightningcss::selector::PseudoClass::CustomFunction { - name: name.clone().into_owned(), - arguments: owned_token_list(arguments), - } - } - } -} - -fn owned_selectors<'i>(ss: &[Selector]) -> Box<[Selector<'i>]> { - let mut buf: Vec> = vec![]; - - for selector in ss.iter() { - buf.push(owned_selector(selector)); - } - - buf.into_boxed_slice() -} - -fn owned_token_list<'i>(t: &TokenList) -> TokenList<'i> { - TokenList(t.0.iter().map(|v| v.clone().into_owned()).collect()) -} diff --git a/packages/swc-magic/transform/src/style.rs b/packages/swc-magic/transform/src/style.rs deleted file mode 100644 index f22fd8c24..000000000 --- a/packages/swc-magic/transform/src/style.rs +++ /dev/null @@ -1,25 +0,0 @@ -use swc_common::Span; -use swc_ecma_ast::*; - -pub struct ExternalStyle { - pub expr: Expr, - pub identifier: Ident, - pub is_global: bool, -} - -pub struct LocalStyle { - pub hash: String, - pub css: String, - pub css_span: Span, - pub is_dynamic: bool, - #[allow(clippy::vec_box)] - pub expressions: Vec>, - - /// If true, `format!("__swc-magic-placeholder-{}__: 0", i)` is used. - pub is_expr_property: Vec, -} - -pub enum JSXStyle { - Local(LocalStyle), - External(ExternalStyle), -} diff --git a/packages/swc-magic/transform/src/transform_css_lightningcss.rs b/packages/swc-magic/transform/src/transform_css_lightningcss.rs deleted file mode 100644 index 0fc176e2a..000000000 --- a/packages/swc-magic/transform/src/transform_css_lightningcss.rs +++ /dev/null @@ -1,589 +0,0 @@ -use std::{ - borrow::Cow, - convert::Infallible, - fmt::Debug, - mem::transmute, - panic::{catch_unwind, AssertUnwindSafe}, - sync::{Arc, RwLock}, -}; - -use easy_error::{bail, Error, ResultExt}; -use lightningcss::{ - error::ParserError, - properties::custom::{TokenList, TokenOrValue}, - selector::{Combinator, Component, PseudoClass, Selector}, - stylesheet::{MinifyOptions, ParserFlags, ParserOptions, PrinterOptions, StyleSheet}, - traits::{ParseWithOptions, ToCss}, - values::ident::Ident, - visit_types, - visitor::{Visit, VisitTypes, Visitor}, -}; -use parcel_selectors::{parser::SelectorIter, SelectorImpl}; -use swc_common::{ - errors::{DiagnosticBuilder, Level, HANDLER}, - BytePos, Loc, SourceMap, Span, DUMMY_SP, -}; -use swc_ecma_ast::*; -use tracing::{debug, error, trace}; - -use crate::{ - lifetime::owned_selector, - style::LocalStyle, - utils::{hash_string, string_literal_expr}, -}; - -fn report( - cm: &SourceMap, - css_span: Span, - file_lines_cache: &mut Option, - err: &lightningcss::error::Error, - level: Level, -) { - // We need :global(selector) to be parsed as a selector. - if let ParserError::SelectorError( - lightningcss::error::SelectorError::UnsupportedPseudoClassOrElement(..), - ) = &err.kind - { - return; - } - - let file = file_lines_cache.get_or_insert_with(|| cm.lookup_char_pos(css_span.lo)); - - let lo = if let Some(loc) = &err.loc { - Some(file.file.lines[(loc.line + 1) as usize] + BytePos(loc.column)) - } else { - None - }; - - HANDLER.with(|handler| { - // - - let mut db = DiagnosticBuilder::new(handler, level, &err.kind.to_string()); - if let Some(lo) = lo { - db.set_span(Span::new(lo, lo, Default::default())); - } - - db.emit(); - }); -} - -#[cfg_attr( - debug_assertions, - tracing::instrument(skip(cm, style_info, class_name)) -)] -pub fn transform_css( - cm: Arc, - style_info: &LocalStyle, - is_global: bool, - class_name: &Option, -) -> Result { - let mut file_lines_cache = None; - - debug!("CSS: \n{}", style_info.css); - let css_str = strip_comments(&style_info.css); - - let warnings: Arc>>> = Arc::default(); - - let result: Result = StyleSheet::parse( - &css_str, - ParserOptions { - // We cannot use css_modules for `:global` because lightningcss does not support - // parsing-only mode. - css_modules: None, - error_recovery: true, - warnings: Some(warnings.clone()), - flags: ParserFlags::all(), - ..Default::default() - }, - ); - - let mut ss = match result { - Ok(ss) => ss, - Err(err) => { - HANDLER.with(|handler| { - report( - &cm, - style_info.css_span, - &mut file_lines_cache, - &err, - Level::Error, - ); - - handler - .struct_span_err( - style_info.css_span, - "Failed to parse css in styled jsx component", - ) - .note(&format!("Input to the css parser is {}", style_info.css)) - .emit() - }); - bail!("Failed to parse css"); - } - }; - - if let Ok(warnings) = warnings.read() { - for warning in warnings.iter() { - report( - &cm, - style_info.css_span, - &mut file_lines_cache, - warning, - Level::Warning, - ); - } - } - - ss.visit(&mut CssNamespace { - class_name: match class_name { - Some(s) => s.clone(), - None => format!("jsx-{}", &hash_string(&style_info.hash)), - }, - is_global, - is_dynamic: style_info.is_dynamic, - }) - .expect("failed to transform css"); - - // Apply auto prefixer - ss.minify(MinifyOptions { - ..Default::default() - }) - .expect("failed to minify/auto-prefix css"); - - let res = ss - .to_css(PrinterOptions { - minify: true, - // TODO - // targets: (), - ..Default::default() - }) - .context("failed to print css")?; - - debug!("Transformed CSS: \n{}", res.code); - - if style_info.expressions.is_empty() { - return Ok(string_literal_expr(&res.code)); - } - - let mut parts: Vec<&str> = res.code.split("__swc-magic-placeholder-").collect(); - let mut final_expressions = vec![]; - for i in parts.iter_mut().skip(1) { - let (num_len, expression_index) = read_number(i, &style_info.is_expr_property); - final_expressions.push(style_info.expressions[expression_index].clone()); - let substring = &i[(num_len + 2)..]; - *i = substring; - } - - Ok(Expr::Tpl(Tpl { - quasis: parts - .iter() - .map(|quasi| { - TplElement { - cooked: None, // ? Do we need cooked as well - raw: quasi.replace('`', "\\`").into(), - span: DUMMY_SP, - tail: false, - } - }) - .collect(), - exprs: final_expressions, - span: DUMMY_SP, - })) -} - -fn strip_comments(s: &str) -> Cow { - if !s.contains("//") { - return Cow::Borrowed(s); - } - - let mut buf = String::with_capacity(s.len()); - - for line in s.lines() { - let line = line.trim(); - - if let Some(index) = line.find("//") { - buf.push_str(&line[..index]); - } else { - buf.push_str(line); - } - buf.push('\n'); - } - - Cow::Owned(buf) -} - -/// Returns `(length, expression_index)` -fn read_number(s: &str, is_expr_property: &[bool]) -> (usize, usize) { - for (idx, c) in s.char_indices() { - if c.is_ascii_digit() { - continue; - } - - // For 10, we reach here after `0`. - let expression_index = s[0..idx].parse().expect("failed to parse"); - - if is_expr_property[expression_index] { - return (idx + 3, expression_index); - } - - return (idx, expression_index); - } - - unreachable!("read_number(`{}`) is invalid because it is empty", s) -} - -struct CssNamespace { - class_name: String, - is_global: bool, - is_dynamic: bool, -} - -impl<'i> Visitor<'i> for CssNamespace { - type Error = Infallible; - - fn visit_types(&self) -> VisitTypes { - visit_types!(SELECTORS) - } - - fn visit_selector(&mut self, selector: &mut Selector<'i>) -> Result<(), Self::Error> { - let mut new_selectors = vec![]; - let mut combinator = None; - - #[cfg(debug_assertions)] - let _tracing = tracing::span!( - tracing::Level::ERROR, - "visit_selector", - len = selector.len() - ) - .entered(); - - let mut iter = selector.iter(); - loop { - #[cfg(debug_assertions)] - let _tracing = tracing::span!( - tracing::Level::ERROR, - "visit_selector/loop", - len = iter.selector_length() - ) - .entered(); - - if combinator.is_none() { - combinator = iter.next_sequence(); - } - - match self.get_transformed_selectors(combinator, &mut iter) { - Ok(transformed_selectors) => { - if transformed_selectors.is_empty() { - break; - } - - if cfg!(debug_assertions) { - debug!("Transformed as: {:?}", SafeDebug(&transformed_selectors)) - } - - new_selectors.push(transformed_selectors); - } - Err(_) => { - error!("Failed to transform one off global selector"); - // TODO: - - // HANDLER.with(|handler| { - // handler - // .struct_span_err( - // selector.span, - // "Failed to transform one off global selector", - // ) - // .emit() - // }); - - new_selectors.push(iter.clone().cloned().collect()); - } - } - - trace!( - "Selector length after transform: {}", - iter.selector_length() - ); - - if combinator.is_none() { - combinator = iter.next_sequence(); - if combinator.is_none() { - break; - } - } else { - combinator = None; - } - } - - let new: Vec<_> = RemoveWhitespace { - iter: new_selectors.into_iter().rev().flatten(), - prev: None, - } - .collect(); - debug!("Selector vector: {:?}", SafeDebug(&new)); - - *selector = Selector::from(new); - - Ok(()) - } -} - -struct RemoveWhitespace<'i, I> { - iter: I, - prev: Option>, -} - -impl<'i, I> Iterator for RemoveWhitespace<'i, I> -where - I: Iterator>, -{ - type Item = Component<'i>; - - fn next(&mut self) -> Option { - match self.prev.take() { - Some(Component::Combinator(Combinator::Descendant)) => { - self.prev = self.iter.next(); - - match self.prev { - Some(Component::Combinator(..)) => self.next(), - _ => Some(Component::Combinator(Combinator::Descendant)), - } - } - Some(v) => Some(v), - _ => { - self.prev = self.iter.next(); - - if self.prev.is_some() { - self.next() - } else { - None - } - } - } - } -} - -impl CssNamespace { - #[cfg_attr(debug_assertions, tracing::instrument(skip(self, node)))] - fn get_transformed_selectors<'a, 'i, Impl>( - &mut self, - combinator: Option, - node: &mut SelectorIter<'a, 'i, Impl>, - ) -> Result>, Error> - where - Impl: SelectorImpl<'i>, - SelectorIter<'a, 'i, Impl>: Iterator>, - { - let mut result: Vec> = vec![]; - - let mut pseudo_index = None; - - let node: Vec> = node.fuse().cloned().collect::>(); - - if node.is_empty() { - return Ok(result); - } - - #[cfg(debug_assertions)] - { - let prev_sel = Selector::from(node.clone()); - debug!("Input selector: {:?}", SafeDebug(&prev_sel)) - } - - for (i, component) in node.iter().enumerate() { - trace!("Selector at {}", i); - - #[cfg(debug_assertions)] - { - debug!("Component: {:?}", SafeDebug(&component)) - } - - // Look for :global - let children: Selector<'i> = match &component { - Component::NonTSPseudoClass(PseudoClass::CustomFunction { name, arguments }) => { - if &**name != "global" { - if pseudo_index.is_none() { - pseudo_index = Some(i); - } - - continue; - } - - parse_token_list(arguments) - } - Component::PseudoElement(_) - | Component::NonTSPseudoClass(..) - | Component::Negation(..) - | Component::Root - | Component::Empty - | Component::Scope - | Component::Nth(..) - | Component::NthOf(..) - | Component::Slotted(..) - | Component::Part(..) - | Component::Host(..) - | Component::Where(..) - | Component::Is(..) - | Component::Any(..) - | Component::Has(..) => { - if pseudo_index.is_none() { - pseudo_index = Some(i); - } - - continue; - } - _ => { - continue; - } - }; - - let mut complex_selectors = - children.iter_raw_match_order().cloned().collect::>(); - - // Remove `a` - complex_selectors.pop(); - - if let Some(Component::Combinator(Combinator::Descendant)) = complex_selectors.last() { - complex_selectors.pop(); - } - - if let Component::Combinator(Combinator::Descendant) = complex_selectors[0] { - complex_selectors.remove(0); - } - - if complex_selectors.is_empty() { - bail!("Failed to transform one off global selector"); - } - - trace!("Combinator: {:?}", combinator); - // trace!("node: {:?}", node); - // trace!("complex_selectors: {:?}", complex_selectors); - - // result.push(Component::Combinator(Combinator::Descendant)); - - complex_selectors.reverse(); - - result.extend(complex_selectors); - result.extend(node.into_iter().skip(i + 1)); - - if let Some(combinator) = combinator { - result.push(Component::Combinator(combinator)); - } - - return Ok(result); - } - - // Pseudo element - if result.is_empty() && node.len() == 1 && pseudo_index.is_some() { - return Ok(node); - } - - let mut node: Vec> = node.clone(); - - let subclass_selector = match self.is_dynamic { - true => Cow::Borrowed("__jsx-style-dynamic-selector"), - false => Cow::Owned(self.class_name.clone()), - }; - match pseudo_index { - None => { - if !self.is_global { - node.push(Component::Class(Ident::from(subclass_selector))); - } - - result.extend(node); - } - - Some(insert_index) => { - result.extend(node); - - if !self.is_global { - result.insert( - insert_index, - Component::Class(Ident::from(subclass_selector)), - ); - } - } - } - - if let Some(combinator) = combinator { - result.push(Component::Combinator(combinator)); - } - - Ok(result) - } -} - -/// Because it is allowed to write `.bar :global(> .foo) {}` or .bar -/// :global(.foo) {}`, so selector can be complex or relative (it violates the -/// specification), but it is popular usage, so we just add `a ` at top and -/// then remove it -fn parse_token_list<'i>(tokens: &TokenList<'i>) -> Selector<'i> { - let mut buf = "a ".to_string(); - - for t in tokens.0.iter() { - match t { - TokenOrValue::Token(t) => { - buf.push_str(&t.to_css_string(Default::default()).unwrap()); - } - TokenOrValue::Color(t) => { - buf.push_str(&t.to_css_string(Default::default()).unwrap()); - } - TokenOrValue::Url(t) => { - buf.push_str(&t.to_css_string(Default::default()).unwrap()); - } - TokenOrValue::Var(..) => { - unimplemented!("parse_token_list: var") - } - TokenOrValue::Env(..) => { - unimplemented!("parse_token_list: env var") - } - TokenOrValue::Function(..) => { - unimplemented!("parse_token_list: function") - } - TokenOrValue::Length(t) => { - buf.push_str(&t.to_css_string(Default::default()).unwrap()); - } - TokenOrValue::Angle(t) => { - buf.push_str(&t.to_css_string(Default::default()).unwrap()); - } - TokenOrValue::Time(t) => { - buf.push_str(&t.to_css_string(Default::default()).unwrap()); - } - TokenOrValue::Resolution(t) => { - buf.push_str(&t.to_css_string(Default::default()).unwrap()); - } - TokenOrValue::DashedIdent(t) => { - buf.push_str(&t.to_css_string(Default::default()).unwrap()); - } - TokenOrValue::UnresolvedColor(..) => { - unimplemented!("parse_token_list: unresolved color") - } - } - } - - if cfg!(debug_assertions) { - debug!("Parsing: {:?}", buf) - } - - let selector = Selector::parse_string_with_options(&buf, Default::default()) - .expect("failed to parse selector list"); - - unsafe { - // Safety: Selector is variant over 'i - transmute::(owned_selector(&selector)) - } -} - -struct SafeDebug<'a>(&'a dyn Debug); - -impl Debug for SafeDebug<'_> { - fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result { - let s = catch_unwind(AssertUnwindSafe(|| format!("{:?}", self.0))); - - match s { - Ok(s) => { - write!(f, "{}", s) - } - Err(_) => write!(f, ""), - } - } -} diff --git a/packages/swc-magic/transform/src/transform_css_swc.rs b/packages/swc-magic/transform/src/transform_css_swc.rs deleted file mode 100644 index bd0bf4e66..000000000 --- a/packages/swc-magic/transform/src/transform_css_swc.rs +++ /dev/null @@ -1,393 +0,0 @@ -use std::{panic, sync::Arc}; - -use easy_error::{bail, Error}; -use swc_common::{ - errors::HANDLER, source_map::Pos, util::take::Take, BytePos, SourceMap, Span, Spanned, - SyntaxContext, DUMMY_SP, -}; -use swc_css_ast::{ - ClassSelector, Combinator, CombinatorValue, ComplexSelector, ComplexSelectorChildren, - CompoundSelector, Ident, PseudoClassSelector, PseudoClassSelectorChildren, Stylesheet, - SubclassSelector, Token, TokenAndSpan, -}; -use swc_css_codegen::{ - writer::basic::{BasicCssWriter, BasicCssWriterConfig}, - CodeGenerator, CodegenConfig, Emit, -}; -use swc_css_parser::{ - lexer::Lexer, - parse_input, - parser::{ - input::{InputType, Tokens}, - Parser, ParserConfig, - }, -}; -use swc_css_prefixer::prefixer; -use swc_css_visit::{VisitMut, VisitMutWith}; -use swc_ecma_ast::*; -use swc_ecma_parser::StringInput; -use tracing::{debug, trace}; - -use crate::{ - style::LocalStyle, - utils::{hash_string, string_literal_expr}, -}; - -pub fn transform_css( - _cm: Arc, - style_info: &LocalStyle, - is_global: bool, - class_name: &Option, -) -> Result { - debug!("CSS: \n{}", style_info.css); - - // TODO use `parse_string_input` in future - let config = ParserConfig { - allow_wrong_line_comments: true, - css_modules: false, - ..Default::default() - }; - let lexer = Lexer::new( - StringInput::new( - &style_info.css, - style_info.css_span.lo, - style_info.css_span.hi, - ), - None, - config, - ); - let mut parser = Parser::new(lexer, config); - - let result: Result = parser.parse_all(); - let mut ss = match result { - Ok(ss) => ss, - Err(err) => { - HANDLER.with(|handler| { - // Print css parsing errors - err.to_diagnostics(handler).emit(); - - // TODO(kdy1): We may print css so the user can see the error, and report it. - - handler - .struct_span_err( - style_info.css_span, - "Failed to parse css in styled jsx component", - ) - .note(&format!("Input to the css parser is {}", style_info.css)) - .emit() - }); - bail!("Failed to parse css"); - } - }; - // ? Do we need to support optionally prefixing? - ss.visit_mut_with(&mut prefixer(Default::default())); - ss.visit_mut_with(&mut Namespacer { - class_name: match class_name { - Some(s) => s.clone(), - None => format!("jsx-{}", &hash_string(&style_info.hash)), - }, - is_global, - is_dynamic: style_info.is_dynamic, - }); - - let mut s = String::new(); - { - let mut wr = BasicCssWriter::new(&mut s, None, BasicCssWriterConfig::default()); - let mut gen = CodeGenerator::new(&mut wr, CodegenConfig { minify: true }); - - gen.emit(&ss).unwrap(); - } - - if style_info.expressions.is_empty() { - return Ok(string_literal_expr(&s)); - } - - let mut parts: Vec<&str> = s.split("__swc-magic-placeholder-").collect(); - let mut final_expressions = vec![]; - for i in parts.iter_mut().skip(1) { - let (num_len, expression_index) = read_number(i); - final_expressions.push(style_info.expressions[expression_index].clone()); - let substr = &i[(num_len + 2)..]; - *i = substr; - } - - Ok(Expr::Tpl(Tpl { - quasis: parts - .iter() - .map(|quasi| { - TplElement { - cooked: None, // ? Do we need cooked as well - raw: quasi.replace('`', "\\`").into(), - span: DUMMY_SP, - tail: false, - } - }) - .collect(), - exprs: final_expressions, - span: DUMMY_SP, - })) -} - -/// Returns `(length, value)` -fn read_number(s: &str) -> (usize, usize) { - for (idx, c) in s.char_indices() { - if c.is_ascii_digit() { - continue; - } - - // For 10, we reach here after `0`. - let value = s[0..idx].parse().expect("failed to parse"); - - return (idx, value); - } - - unreachable!("read_number(`{}`) is invalid because it is empty", s) -} - -struct Namespacer { - class_name: String, - is_global: bool, - is_dynamic: bool, -} - -impl VisitMut for Namespacer { - fn visit_mut_complex_selector(&mut self, node: &mut ComplexSelector) { - #[cfg(debug_assertions)] - let _tracing = { - // This will add information to the log messages, only for debug build. - // Note that we use cargo feature to remove all logging on production builds. - - let mut code = String::new(); - { - let mut wr = BasicCssWriter::new(&mut code, None, BasicCssWriterConfig::default()); - let mut gen = CodeGenerator::new(&mut wr, CodegenConfig { minify: true }); - - gen.emit(&*node).unwrap(); - } - - tracing::span!( - tracing::Level::TRACE, - "Namespacer::visit_mut_complex_selector", - class_name = &*self.class_name, - is_global = self.is_global, - is_dynamic = self.is_dynamic, - input = &*code - ) - .entered() - }; - - let mut new_selectors = vec![]; - let mut combinator = None; - - for sel in node.children.take() { - match &sel { - ComplexSelectorChildren::CompoundSelector(selector) => { - match self.get_transformed_selectors(combinator, selector.clone()) { - Ok(transformed_selectors) => new_selectors.extend(transformed_selectors), - Err(_) => { - HANDLER.with(|handler| { - handler - .struct_span_err( - selector.span, - "Failed to transform one off global selector", - ) - .emit() - }); - new_selectors.push(sel); - } - } - - combinator = None; - } - ComplexSelectorChildren::Combinator(v) => { - combinator = Some(v.clone()); - } - }; - } - - node.children = new_selectors; - } -} - -impl Namespacer { - fn get_transformed_selectors( - &mut self, - combinator: Option, - mut node: CompoundSelector, - ) -> Result, Error> { - let mut pseudo_index = None; - - for (i, selector) in node.subclass_selectors.iter().enumerate() { - let (name, children) = match &selector { - SubclassSelector::PseudoClass(PseudoClassSelector { - name, - children: Some(children), - .. - }) if &name.value == "global" => (name, children), - SubclassSelector::PseudoClass(_) | SubclassSelector::PseudoElement(_) => { - if pseudo_index.is_none() { - pseudo_index = Some(i); - } - - continue; - } - _ => continue, - }; - - // One off global selector - if &name.value == "global" { - // TODO(alexander-akait): in future we should use list of component values - let tokens = children - .iter() - .map(|v| match v { - PseudoClassSelectorChildren::PreservedToken(v) => v.clone(), - _ => { - unreachable!(); - } - }) - .collect::>(); - let mut tokens = { - let lo = tokens.first().map(|v| v.span_lo()).unwrap_or(BytePos(0)); - let hi = tokens.last().map(|v| v.span_hi()).unwrap_or(BytePos(0)); - - Tokens { - span: Span::new(lo, hi, Default::default()), - tokens, - } - }; - - // Because it is allowed to write `.bar :global(> .foo) {}` or .bar - // :global(.foo) {}`, so selector can be complex or relative (it violates the - // specification), but it is popular usage, so we just add `a >` at top and then - // remove it - let mut front_tokens = get_front_selector_tokens(&tokens); - - front_tokens.extend(tokens.tokens); - - tokens.tokens = front_tokens; - - let complex_selectors = panic::catch_unwind(|| { - let x: ComplexSelector = parse_input( - InputType::Tokens(&tokens), - ParserConfig { - allow_wrong_line_comments: true, - css_modules: true, - ..Default::default() - }, - // TODO(kdy1): We might be able to report syntax errors. - &mut vec![], - ) - .unwrap(); - x - }); - - return match complex_selectors { - Ok(complex_selectors) => { - let mut v = complex_selectors.children[1..].to_vec(); - - if let ComplexSelectorChildren::Combinator(Combinator { - value: CombinatorValue::Descendant, - .. - }) = v[0] - { - v.remove(0); - } - - if v.is_empty() { - bail!("Failed to transform one off global selector"); - } - - trace!("Combinator: {:?}", combinator); - trace!("v[0]: {:?}", v[0]); - - let mut result = vec![]; - - if let Some(combinator) = combinator { - match v.get(0) { - // `Descendant` combinator can't be the first because we removed it - // above - Some(ComplexSelectorChildren::Combinator(..)) - if combinator.value == CombinatorValue::Descendant => {} - _ => { - result.push(ComplexSelectorChildren::Combinator(combinator)); - } - } - } - - v.iter_mut().for_each(|sel| { - if i < node.subclass_selectors.len() { - if let ComplexSelectorChildren::CompoundSelector(sel) = sel { - sel.subclass_selectors - .extend(node.subclass_selectors[i + 1..].iter().cloned()); - } - } - }); - - result.extend(v); - - Ok(result) - } - Err(_) => bail!("Failed to transform one off global selector"), - }; - } - } - - let subclass_selector = match self.is_dynamic { - true => "__jsx-style-dynamic-selector", - false => &self.class_name, - }; - let insert_index = match pseudo_index { - None => node.subclass_selectors.len(), - Some(i) => i, - }; - - if !self.is_global { - node.subclass_selectors.insert( - insert_index, - SubclassSelector::Class(ClassSelector { - span: DUMMY_SP, - text: Ident { - raw: Some(subclass_selector.into()), - value: subclass_selector.into(), - span: DUMMY_SP, - }, - }), - ); - } - - let mut result = vec![]; - - if let Some(combinator) = combinator { - result.push(ComplexSelectorChildren::Combinator(combinator)); - } - - result.push(ComplexSelectorChildren::CompoundSelector(node)); - - Ok(result) - } -} - -fn get_front_selector_tokens(selector_tokens: &Tokens) -> Vec { - let start_pos = selector_tokens.span.lo.to_u32() - 2; - vec![ - TokenAndSpan { - span: Span { - lo: BytePos(start_pos), - hi: BytePos(start_pos + 1), - ctxt: SyntaxContext::empty(), - }, - token: Token::Ident { - raw: "a".into(), - value: "a".into(), - }, - }, - TokenAndSpan { - span: Span { - lo: BytePos(start_pos + 1), - hi: BytePos(start_pos + 2), - ctxt: SyntaxContext::empty(), - }, - token: Token::WhiteSpace { value: " ".into() }, - }, - ] -} diff --git a/packages/swc-magic/transform/src/utils.rs b/packages/swc-magic/transform/src/utils.rs deleted file mode 100644 index 9ee0744f5..000000000 --- a/packages/swc-magic/transform/src/utils.rs +++ /dev/null @@ -1,371 +0,0 @@ -use std::{collections::hash_map::DefaultHasher, hash::Hasher}; - -use swc_common::DUMMY_SP; -use swc_ecma_ast::*; - -use crate::style::{ExternalStyle, JSXStyle, LocalStyle}; - -fn tpl_element(value: &str) -> TplElement { - TplElement { - raw: value.into(), - cooked: None, - span: DUMMY_SP, - tail: false, - } -} - -pub fn compute_class_names( - styles: &[JSXStyle], - style_import_name: &str, -) -> (Option, Option) { - let mut static_class_name = None; - let mut external_jsx_id = None; - let mut static_hashes = vec![]; - let mut dynamic_styles = vec![]; - let mut external_styles = vec![]; - for style_info in styles { - match style_info { - JSXStyle::Local(style_info) => { - if !style_info.is_dynamic { - static_hashes.push(style_info.hash.clone()); - } else { - dynamic_styles.push(style_info); - } - } - JSXStyle::External(external) => { - if !external.is_global { - external_styles.push(external.expr.clone()); - } - } - } - } - - if !external_styles.is_empty() { - let mut quasis = vec![tpl_element("jsx-")]; - for _i in 1..external_styles.len() { - quasis.push(tpl_element(" jsx-")) - } - quasis.push(tpl_element("")); - external_jsx_id = Some(Expr::Tpl(Tpl { - quasis, - exprs: external_styles - .iter() - .map(|external| Box::new(external.clone())) - .collect(), - span: DUMMY_SP, - })); - } - - if !static_hashes.is_empty() { - static_class_name = Some(format!("jsx-{}", hash_string(&static_hashes.join(",")))); - } - - let dynamic_class_name = match dynamic_styles.len() { - 0 => None, - _ => Some(Expr::Call(CallExpr { - callee: Callee::Expr(Box::new(Expr::Member(MemberExpr { - obj: Box::new(Expr::Ident(Ident { - sym: style_import_name.into(), - span: DUMMY_SP, - optional: false, - })), - prop: MemberProp::Ident(Ident { - sym: "dynamic".into(), - span: DUMMY_SP, - optional: false, - }), - span: DUMMY_SP, - }))), - args: vec![ExprOrSpread { - expr: Box::new(Expr::Array(ArrayLit { - elems: dynamic_styles - .iter() - .map(|style_info| { - let hash_input = match &static_class_name { - Some(class_name) => format!("{}{}", style_info.hash, class_name), - None => style_info.hash.clone(), - }; - Some(ExprOrSpread { - expr: Box::new(Expr::Array(ArrayLit { - elems: vec![ - Some(ExprOrSpread { - expr: Box::new(string_literal_expr(&hash_string( - &hash_input, - ))), - spread: None, - }), - Some(ExprOrSpread { - expr: Box::new(Expr::Array(ArrayLit { - elems: style_info - .expressions - .iter() - .map(|expression| { - Some(ExprOrSpread { - expr: expression.clone(), - spread: None, - }) - }) - .collect(), - span: DUMMY_SP, - })), - spread: None, - }), - ], - span: DUMMY_SP, - })), - spread: None, - }) - }) - .collect(), - span: DUMMY_SP, - })), - spread: None, - }], - span: DUMMY_SP, - type_args: None, - })), - }; - - let class_name_expr = match ( - static_class_name.clone(), - dynamic_class_name, - external_jsx_id, - ) { - (Some(static_class_name), Some(dynamic_class_name), Some(external_jsx_id)) => Some(add( - add( - external_jsx_id, - string_literal_expr(&format!(" {} ", static_class_name)), - ), - dynamic_class_name, - )), - (Some(static_class_name), Some(dynamic_class_name), None) => Some(add( - string_literal_expr(&format!("{} ", static_class_name)), - dynamic_class_name, - )), - (Some(static_class_name), None, Some(external_jsx_id)) => Some(add( - string_literal_expr(&format!("{} ", static_class_name)), - external_jsx_id, - )), - (None, Some(dynamic_class_name), Some(external_jsx_id)) => Some(add( - add(external_jsx_id, string_literal_expr(" ")), - dynamic_class_name, - )), - (Some(static_class_name), None, None) => Some(string_literal_expr(&static_class_name)), - (None, Some(dynamic_class_name), None) => Some(dynamic_class_name), - (None, None, Some(external_jsx_id)) => Some(external_jsx_id), - _ => None, - }; - - (static_class_name, class_name_expr) -} - -pub fn make_external_swc_magic_el(style: &ExternalStyle, style_import_name: &str) -> JSXElement { - let attrs = vec![JSXAttrOrSpread::JSXAttr(JSXAttr { - name: JSXAttrName::Ident(Ident { - sym: "id".into(), - span: DUMMY_SP, - optional: false, - }), - value: Some(JSXAttrValue::JSXExprContainer(JSXExprContainer { - expr: JSXExpr::Expr(Box::new(style.expr.clone())), - span: DUMMY_SP, - })), - span: DUMMY_SP, - })]; - let opening = JSXOpeningElement { - name: JSXElementName::Ident(Ident { - sym: style_import_name.into(), - span: DUMMY_SP, - optional: false, - }), - attrs, - span: DUMMY_SP, - self_closing: false, - type_args: None, - }; - - let closing = Some(JSXClosingElement { - name: JSXElementName::Ident(Ident { - sym: style_import_name.into(), - span: DUMMY_SP, - optional: false, - }), - span: DUMMY_SP, - }); - - let children = vec![JSXElementChild::JSXExprContainer(JSXExprContainer { - expr: JSXExpr::Expr(Box::new(Expr::Ident(style.identifier.clone()))), - span: DUMMY_SP, - })]; - JSXElement { - opening, - closing, - children, - span: DUMMY_SP, - } -} - -pub fn make_local_swc_magic_el( - style_info: &LocalStyle, - css_expr: Expr, - style_import_name: &str, - static_class_name: Option<&String>, -) -> JSXElement { - let hash_input = match (&style_info.is_dynamic, &static_class_name) { - (true, Some(class_name)) => format!("{}{}", style_info.hash, class_name), - _ => style_info.hash.clone(), - }; - let mut attrs = vec![JSXAttrOrSpread::JSXAttr(JSXAttr { - name: JSXAttrName::Ident(Ident { - sym: "id".into(), - span: DUMMY_SP, - optional: false, - }), - value: Some(JSXAttrValue::JSXExprContainer(JSXExprContainer { - expr: JSXExpr::Expr(Box::new(string_literal_expr( - hash_string(&hash_input).as_str(), - ))), - span: DUMMY_SP, - })), - span: DUMMY_SP, - })]; - - if style_info.is_dynamic { - attrs.push(JSXAttrOrSpread::JSXAttr(JSXAttr { - name: JSXAttrName::Ident(Ident { - sym: "dynamic".into(), - span: DUMMY_SP, - optional: false, - }), - value: Some(JSXAttrValue::JSXExprContainer(JSXExprContainer { - expr: JSXExpr::Expr(Box::new(Expr::Array(ArrayLit { - elems: style_info - .expressions - .iter() - .map(|expression| { - Some(ExprOrSpread { - expr: expression.clone(), - spread: None, - }) - }) - .collect(), - span: DUMMY_SP, - }))), - span: DUMMY_SP, - })), - span: DUMMY_SP, - })); - } - - let opening = JSXOpeningElement { - name: JSXElementName::Ident(Ident { - sym: style_import_name.into(), - span: DUMMY_SP, - optional: false, - }), - attrs, - span: DUMMY_SP, - self_closing: false, - type_args: None, - }; - - let closing = Some(JSXClosingElement { - name: JSXElementName::Ident(Ident { - sym: style_import_name.into(), - span: DUMMY_SP, - optional: false, - }), - span: DUMMY_SP, - }); - - let children = vec![JSXElementChild::JSXExprContainer(JSXExprContainer { - expr: JSXExpr::Expr(Box::new(css_expr)), - span: DUMMY_SP, - })]; - JSXElement { - opening, - closing, - children, - span: DUMMY_SP, - } -} - -pub fn get_usable_import_specifier(_items: &[ModuleItem]) -> String { - // TODO - String::from("_JSXStyle") -} - -pub fn swc_magic_import_decl(style_import_name: &str) -> ModuleItem { - ModuleItem::ModuleDecl(ModuleDecl::Import(ImportDecl { - with: None, - span: DUMMY_SP, - type_only: false, - specifiers: vec![ImportSpecifier::Default(ImportDefaultSpecifier { - local: Ident { - sym: style_import_name.into(), - span: DUMMY_SP, - optional: false, - }, - span: DUMMY_SP, - })], - src: Box::new(Str { - span: DUMMY_SP, - value: "swc-magic/style".into(), - raw: None, - }), - })) -} - -// TODO: maybe use DJBHasher (need to implement) -pub fn hash_string(str: &str) -> String { - let mut hasher = DefaultHasher::new(); - hasher.write(str.as_bytes()); - let hash_result = hasher.finish(); - format!("{:x}", hash_result) -} - -pub fn string_literal_expr(str: &str) -> Expr { - let str = str.replace("\\`", "`"); - Expr::Lit(Lit::Str(Str { - value: str.into(), - span: DUMMY_SP, - raw: None, - })) -} - -pub fn ident(str: &str) -> Ident { - Ident { - sym: str.into(), - span: DUMMY_SP, - optional: false, - } -} - -pub fn is_capitalized(word: &str) -> bool { - word.chars().next().unwrap().is_uppercase() -} - -pub fn add(left: Expr, right: Expr) -> Expr { - binary_expr(BinaryOp::Add, left, right) -} - -pub fn and(left: Expr, right: Expr) -> Expr { - binary_expr(BinaryOp::LogicalAnd, left, right) -} - -pub fn or(left: Expr, right: Expr) -> Expr { - binary_expr(BinaryOp::LogicalOr, left, right) -} - -pub fn not_eq(left: Expr, right: Expr) -> Expr { - binary_expr(BinaryOp::NotEq, left, right) -} - -pub fn binary_expr(op: BinaryOp, left: Expr, right: Expr) -> Expr { - Expr::Bin(BinExpr { - op, - left: Box::new(left), - right: Box::new(right), - span: DUMMY_SP, - }) -} diff --git a/packages/swc-magic/transform/src/visitor.rs b/packages/swc-magic/transform/src/visitor.rs deleted file mode 100644 index d8058c427..000000000 --- a/packages/swc-magic/transform/src/visitor.rs +++ /dev/null @@ -1,963 +0,0 @@ -use std::{ - collections::hash_map::DefaultHasher, - hash::{Hash, Hasher}, - mem::take, - sync::Arc, -}; - -use easy_error::{bail, Error}; -use serde::Deserialize; -use swc_common::{collections::AHashSet, errors::HANDLER, FileName, SourceMap, Span, DUMMY_SP}; -use swc_ecma_ast::*; -use swc_ecma_minifier::{ - eval::{EvalResult, Evaluator}, - marks::Marks, -}; -use swc_ecma_utils::{collect_decls, drop_span, prepend_stmt, private_ident}; -use swc_ecma_visit::{Fold, FoldWith}; - -use crate::{ - style::{ExternalStyle, JSXStyle, LocalStyle}, - utils::{ - add, and, compute_class_names, get_usable_import_specifier, hash_string, ident, - is_capitalized, make_external_swc_magic_el, make_local_swc_magic_el, not_eq, or, - string_literal_expr, swc_magic_import_decl, - }, -}; - -#[derive(Debug, Clone, Copy, Deserialize)] -#[serde(rename_all = "camelCase")] -pub struct Config { - #[serde(default)] - pub use_lightningcss: bool, -} - -pub fn swc_magic(cm: Arc, file_name: FileName, config: Config) -> impl Fold { - let file_name = match file_name { - FileName::Real(real_file_name) => real_file_name - .to_str() - .map(|real_file_name| real_file_name.to_string()), - _ => None, - }; - - StyledJSXTransformer { - cm, - config, - file_name, - styles: Default::default(), - static_class_name: Default::default(), - class_name: Default::default(), - file_has_swc_magic: Default::default(), - has_swc_magic: Default::default(), - bindings: Default::default(), - nearest_scope_bindings: Default::default(), - func_scope_level: Default::default(), - style_import_name: Default::default(), - external_bindings: Default::default(), - file_has_css_resolve: Default::default(), - external_hash: Default::default(), - add_hash: Default::default(), - add_default_decl: Default::default(), - in_function_params: Default::default(), - evaluator: Default::default(), - visiting_swc_magic_descendants: Default::default(), - } -} - -struct StyledJSXTransformer { - cm: Arc, - config: Config, - - file_name: Option, - styles: Vec, - static_class_name: Option, - class_name: Option, - file_has_swc_magic: bool, - has_swc_magic: bool, - bindings: AHashSet, - nearest_scope_bindings: AHashSet, - func_scope_level: u8, - style_import_name: Option, - external_bindings: Vec, - file_has_css_resolve: bool, - external_hash: Option, - add_hash: Option<(Id, String)>, - add_default_decl: Option<(Id, Expr)>, - in_function_params: bool, - evaluator: Option, - visiting_swc_magic_descendants: bool, -} - -enum StyleExpr<'a> { - Str(&'a Str), - Tpl(&'a Tpl, &'a Expr), - Ident(&'a Ident), -} - -impl Fold for StyledJSXTransformer { - fn fold_jsx_element(&mut self, el: JSXElement) -> JSXElement { - if is_swc_magic(&el) { - if self.visiting_swc_magic_descendants { - HANDLER.with(|handler| { - handler - .struct_span_err( - el.span, - "Detected nested swc-magic tag.\nRead more: https://nextjs.org/docs/messages/nested-swc-magic-tags", - ) - .emit() - }); - return el; - } - - let parent_has_swc_magic = self.has_swc_magic; - if !parent_has_swc_magic && self.check_for_jsx_styles(Some(&el), &el.children).is_err() - { - return el; - } - let el = match self.replace_jsx_style(&el) { - Ok(el) => el, - Err(_) => el, - }; - if !parent_has_swc_magic { - self.reset_styles_state(); - } - return el; - } - - if self.has_swc_magic { - self.visiting_swc_magic_descendants = true; - let el = el.fold_children_with(self); - self.visiting_swc_magic_descendants = false; - return el; - } - - if self.check_for_jsx_styles(None, &el.children).is_err() { - return el; - } - let el = el.fold_children_with(self); - self.reset_styles_state(); - - el - } - - fn fold_jsx_fragment(&mut self, fragment: JSXFragment) -> JSXFragment { - if self.has_swc_magic { - self.visiting_swc_magic_descendants = true; - let fragment = fragment.fold_children_with(self); - self.visiting_swc_magic_descendants = false; - return fragment; - } - - if self.check_for_jsx_styles(None, &fragment.children).is_err() { - return fragment; - }; - let fragment = fragment.fold_children_with(self); - self.reset_styles_state(); - - fragment - } - - fn fold_jsx_opening_element(&mut self, mut el: JSXOpeningElement) -> JSXOpeningElement { - if !self.has_swc_magic { - return el; - } - - el.attrs = el.attrs.fold_with(self); - - if let JSXElementName::Ident(Ident { sym, span, .. }) = &el.name { - if sym != "style" - && sym != self.style_import_name.as_ref().unwrap() - && (!is_capitalized(sym) - || self - .nearest_scope_bindings - .contains(&(sym.clone(), span.ctxt))) - { - let (existing_class_name, existing_index, existing_spread_index) = - get_existing_class_name(&el); - - let new_class_name = match (existing_class_name, &self.class_name) { - (Some(existing_class_name), Some(class_name)) => Some(add( - add(class_name.clone(), string_literal_expr(" ")), - existing_class_name, - )), - (Some(existing_class_name), None) => Some(existing_class_name), - (None, Some(class_name)) => Some(class_name.clone()), - _ => None, - }; - - if let Some(new_class_name) = new_class_name { - let class_name_attr = JSXAttrOrSpread::JSXAttr(JSXAttr { - span: DUMMY_SP, - name: JSXAttrName::Ident(ident("className")), - value: Some(JSXAttrValue::JSXExprContainer(JSXExprContainer { - expr: JSXExpr::Expr(Box::new(new_class_name)), - span: DUMMY_SP, - })), - }); - el.attrs.push(class_name_attr); - } - if let Some(existing_spread_index) = existing_spread_index { - el.attrs.remove(existing_spread_index); - } - if let Some(existing_index) = existing_index { - el.attrs.remove(existing_index); - } - } - } - - el - } - - fn fold_import_decl(&mut self, decl: ImportDecl) -> ImportDecl { - let ImportDecl { - ref src, - ref specifiers, - .. - } = decl; - if &src.value == "swc-magic/css" { - for specifier in specifiers { - match specifier { - ImportSpecifier::Default(default_specifier) => { - self.external_bindings.push(default_specifier.local.to_id()) - } - ImportSpecifier::Named(named_specifier) => { - self.external_bindings.push(named_specifier.local.to_id()) - } - _ => {} - } - } - } - - decl - } - - fn fold_expr(&mut self, expr: Expr) -> Expr { - let expr = expr.fold_children_with(self); - match expr { - Expr::TaggedTpl(tagged_tpl) => match &*tagged_tpl.tag { - Expr::Ident(identifier) => { - if self.external_bindings.contains(&identifier.to_id()) { - match self.process_tagged_template_expr(&tagged_tpl, &identifier.sym) { - Ok(expr) => expr, - Err(_) => Expr::TaggedTpl(tagged_tpl), - } - } else { - Expr::TaggedTpl(tagged_tpl) - } - } - Expr::Member(MemberExpr { - obj: boxed_ident, .. - }) => { - if let Expr::Ident(identifier) = &**boxed_ident { - if self.external_bindings.contains(&identifier.to_id()) { - match self.process_tagged_template_expr(&tagged_tpl, &identifier.sym) { - Ok(expr) => expr, - Err(_) => Expr::TaggedTpl(tagged_tpl), - } - } else { - Expr::TaggedTpl(tagged_tpl) - } - } else { - Expr::TaggedTpl(tagged_tpl) - } - } - _ => Expr::TaggedTpl(tagged_tpl), - }, - expr => expr, - } - } - - fn fold_var_declarator(&mut self, declarator: VarDeclarator) -> VarDeclarator { - let declarator = declarator.fold_children_with(self); - if let Some(external_hash) = &self.external_hash.take() { - if let Pat::Ident(BindingIdent { - id: Ident { span, sym, .. }, - .. - }) = &declarator.name - { - self.add_hash = Some(((sym.clone(), span.ctxt), external_hash.clone())); - } - } - declarator - } - - fn fold_export_default_expr(&mut self, default_expr: ExportDefaultExpr) -> ExportDefaultExpr { - let default_expr = default_expr.fold_children_with(self); - if let Some(external_hash) = &self.external_hash.take() { - let default_ident = private_ident!("_defaultExport"); - self.add_hash = Some((default_ident.to_id(), external_hash.clone())); - self.add_default_decl = Some((default_ident.to_id(), *default_expr.expr)); - return ExportDefaultExpr { - expr: Box::new(Expr::Ident(default_ident)), - span: DUMMY_SP, - }; - } - default_expr - } - - fn fold_block_stmt(&mut self, mut block: BlockStmt) -> BlockStmt { - let mut new_stmts = vec![]; - for stmt in block.stmts { - new_stmts.push(stmt.fold_children_with(self)); - if let Some(add_hash) = self.add_hash.take() { - new_stmts.push(add_hash_statement(add_hash)); - } - } - - block.stmts = new_stmts; - block - } - - fn fold_module_items(&mut self, items: Vec) -> Vec { - let mut new_items = vec![]; - for item in items { - let new_item = item.fold_children_with(self); - if let Some((default_ident, default_expr)) = &self.add_default_decl { - new_items.push(ModuleItem::Stmt(Stmt::Decl(Decl::Var(Box::new(VarDecl { - kind: VarDeclKind::Const, - declare: false, - decls: vec![VarDeclarator { - name: Pat::Ident(BindingIdent { - id: Ident { - sym: default_ident.0.clone(), - span: DUMMY_SP.with_ctxt(default_ident.1), - optional: false, - }, - type_ann: None, - }), - init: Some(Box::new(default_expr.clone())), - definite: false, - span: DUMMY_SP, - }], - span: DUMMY_SP, - }))))); - self.add_default_decl = None; - if let Some(add_hash) = self.add_hash.take() { - new_items.push(ModuleItem::Stmt(add_hash_statement(add_hash))); - } - } - if !is_styled_css_import(&new_item) { - new_items.push(new_item); - } - if let Some(add_hash) = self.add_hash.take() { - new_items.push(ModuleItem::Stmt(add_hash_statement(add_hash))); - } - } - - if self.file_has_swc_magic || self.file_has_css_resolve { - prepend_stmt( - &mut new_items, - swc_magic_import_decl(self.style_import_name.as_ref().unwrap()), - ); - } - - new_items - } - - fn fold_binding_ident(&mut self, node: BindingIdent) -> BindingIdent { - if self.in_function_params { - self.nearest_scope_bindings.insert(node.id.to_id()); - } - node - } - - fn fold_assign_pat_prop(&mut self, node: AssignPatProp) -> AssignPatProp { - if self.in_function_params { - self.nearest_scope_bindings.insert(node.key.to_id()); - } - node - } - - fn fold_function(&mut self, mut func: Function) -> Function { - self.func_scope_level += 1; - let surrounding_scope_bindings = take(&mut self.nearest_scope_bindings); - self.in_function_params = true; - let mut new_params = vec![]; - for param in func.params { - new_params.push(param.fold_with(self)); - } - func.params = new_params; - self.in_function_params = false; - self.nearest_scope_bindings.extend(collect_decls(&func)); - func.body = func.body.fold_with(self); - self.nearest_scope_bindings = surrounding_scope_bindings; - self.func_scope_level -= 1; - func - } - - fn fold_arrow_expr(&mut self, mut func: ArrowExpr) -> ArrowExpr { - self.func_scope_level += 1; - let surrounding_scope_bindings = take(&mut self.nearest_scope_bindings); - self.in_function_params = true; - let mut new_params = vec![]; - for param in func.params { - new_params.push(param.fold_with(self)); - } - func.params = new_params; - self.in_function_params = false; - self.nearest_scope_bindings.extend(collect_decls(&func)); - func.body = func.body.fold_with(self); - self.nearest_scope_bindings = surrounding_scope_bindings; - self.func_scope_level -= 1; - func - } - - fn fold_module(&mut self, module: Module) -> Module { - self.bindings = collect_decls(&module); - self.evaluator = Some(Evaluator::new(module.clone(), Marks::new())); - self.style_import_name = Some(get_usable_import_specifier(&module.body)); - let module = module.fold_children_with(self); - if self.file_has_css_resolve - && self.file_name.is_some() - && self.file_name.as_ref().unwrap().ends_with(".ts") - { - let file_name: &str = self.file_name.as_ref().unwrap(); - HANDLER.with(|handler| { - handler.err(&format!( - "{} uses `css.resolve`, but ends with `.ts`. The file extension needs to be \ - `.tsx` so that the jsx injected by `css.resolve` will be transformed.", - file_name - )); - }); - } - module - } -} - -impl StyledJSXTransformer { - fn check_for_jsx_styles( - &mut self, - el: Option<&JSXElement>, - children: &[JSXElementChild], - ) -> Result<(), Error> { - let mut styles = vec![]; - let mut process_style = |el: &JSXElement| { - self.file_has_swc_magic = true; - self.has_swc_magic = true; - let expr = get_style_expr(el)?; - let style_info = self.get_jsx_style(expr, is_global(el)); - styles.insert(0, style_info); - - Ok(()) - }; - - if el.is_some() && is_swc_magic(el.unwrap()) { - process_style(el.unwrap())?; - } else { - for i in children { - if let JSXElementChild::JSXElement(child_el) = &i { - if is_swc_magic(child_el) { - process_style(child_el)?; - } - } - } - }; - - if self.has_swc_magic { - let (static_class_name, class_name) = - compute_class_names(&styles, self.style_import_name.as_ref().unwrap()); - self.styles = styles; - self.static_class_name = static_class_name; - self.class_name = class_name; - } - - Ok(()) - } - - fn get_jsx_style(&mut self, style_expr: StyleExpr, is_global_jsx_element: bool) -> JSXStyle { - let mut hasher = DefaultHasher::new(); - let css: String; - let css_span: Span; - let is_dynamic; - let mut expressions = vec![]; - let mut is_expr_property = vec![]; - match style_expr { - StyleExpr::Str(Str { value, span, .. }) => { - hasher.write(value.as_ref().as_bytes()); - css = value.to_string(); - css_span = *span; - is_dynamic = false; - } - StyleExpr::Tpl( - Tpl { - exprs, - quasis, - span, - }, - expr, - ) => { - if exprs.is_empty() { - hasher.write(quasis[0].raw.as_bytes()); - css = quasis[0].raw.to_string(); - css_span = *span; - is_dynamic = false; - } else { - drop_span(expr.clone()).hash(&mut hasher); - let mut s = String::new(); - for i in 0..quasis.len() { - // TODO: Handle comments - - let before = &*quasis[i].raw; - let before = before.trim(); - - let placeholder = if i == quasis.len() - 1 { - is_expr_property.push(false); - String::new() - } else if self.config.use_lightningcss && before.ends_with([';', '{']) { - is_expr_property.push(true); - format!("__swc-magic-placeholder-{}__: 0", i) - } else { - is_expr_property.push(false); - format!("__swc-magic-placeholder-{}__", i) - }; - s.push_str(&quasis[i].raw); - s.push_str(&placeholder); - } - css = s; - css_span = *span; - is_dynamic = if self.func_scope_level > 0 { - let res = self.evaluator.as_mut().unwrap().eval(expr); - !matches!(res, Some(EvalResult::Lit(_))) - } else { - false - }; - expressions = exprs.clone(); - } - } - StyleExpr::Ident(ident) => { - return JSXStyle::External(ExternalStyle { - expr: Expr::Member(MemberExpr { - obj: Box::new(Expr::Ident(ident.clone())), - prop: MemberProp::Ident(Ident { - sym: "__hash".into(), - span: DUMMY_SP, - optional: false, - }), - span: DUMMY_SP, - }), - identifier: ident.clone(), - is_global: is_global_jsx_element, - }); - } - } - - JSXStyle::Local(LocalStyle { - hash: format!("{:x}", hasher.finish()), - css, - css_span, - is_dynamic, - expressions, - is_expr_property, - }) - } - - fn replace_jsx_style(&mut self, el: &JSXElement) -> Result { - let style_info = self.styles.pop().unwrap(); - - let is_global = el.opening.attrs.iter().any(|attr| { - if let JSXAttrOrSpread::JSXAttr(JSXAttr { - name: JSXAttrName::Ident(Ident { sym, .. }), - .. - }) = &attr - { - if sym == "global" { - return true; - } - } - false - }); - - match &style_info { - JSXStyle::Local(style_info) => { - let css = if self.config.use_lightningcss { - crate::transform_css_lightningcss::transform_css( - self.cm.clone(), - style_info, - is_global, - &self.static_class_name, - )? - } else { - crate::transform_css_swc::transform_css( - self.cm.clone(), - style_info, - is_global, - &self.static_class_name, - )? - }; - - Ok(make_local_swc_magic_el( - style_info, - css, - self.style_import_name.as_ref().unwrap(), - self.static_class_name.as_ref(), - )) - } - JSXStyle::External(style) => Ok(make_external_swc_magic_el( - style, - self.style_import_name.as_ref().unwrap(), - )), - } - } - - fn process_tagged_template_expr( - &mut self, - tagged_tpl: &TaggedTpl, - tag: &str, - ) -> Result { - if tag != "resolve" { - // Check whether there are undefined references or - // references to this.something (e.g. props or state). - // We allow dynamic styles only when resolving styles. - } - - let style = self.get_jsx_style( - StyleExpr::Tpl(&tagged_tpl.tpl, &Expr::Tpl(*tagged_tpl.tpl.clone())), - false, - ); - let styles = vec![style]; - let (static_class_name, class_name) = - compute_class_names(&styles, self.style_import_name.as_ref().unwrap()); - let tag = match &*tagged_tpl.tag { - Expr::Ident(Ident { sym, .. }) => sym.to_string(), - Expr::Member(MemberExpr { - prop: MemberProp::Ident(Ident { sym, .. }), - .. - }) => sym.to_string(), - _ => String::from("not_swc_magic_tag"), - }; - let style = if let JSXStyle::Local(style) = &styles[0] { - if tag != "resolve" { - self.external_hash = Some(hash_string(&style.hash.clone())); - } - style - } else { - bail!("This shouldn't happen, we already know that this is a template literal"); - }; - let css = if self.config.use_lightningcss { - crate::transform_css_lightningcss::transform_css( - self.cm.clone(), - style, - tag == "global", - &static_class_name, - )? - } else { - crate::transform_css_swc::transform_css( - self.cm.clone(), - style, - tag == "global", - &static_class_name, - )? - }; - if tag == "resolve" { - self.file_has_css_resolve = true; - return Ok(Expr::Object(ObjectLit { - props: vec![ - PropOrSpread::Prop(Box::new(Prop::KeyValue(KeyValueProp { - key: PropName::Ident(Ident { - sym: "styles".into(), - span: DUMMY_SP, - optional: false, - }), - value: Box::new(Expr::JSXElement(Box::new(make_local_swc_magic_el( - style, - css, - self.style_import_name.as_ref().unwrap(), - self.static_class_name.as_ref(), - )))), - }))), - PropOrSpread::Prop(Box::new(Prop::KeyValue(KeyValueProp { - key: PropName::Ident(Ident { - sym: "className".into(), - span: DUMMY_SP, - optional: false, - }), - value: Box::new(class_name.unwrap()), - }))), - ], - span: DUMMY_SP, - })); - } - Ok(Expr::New(NewExpr { - callee: Box::new(Expr::Ident(Ident { - sym: "String".into(), - span: DUMMY_SP, - optional: false, - })), - args: Some(vec![ExprOrSpread { - expr: Box::new(css), - spread: None, - }]), - span: DUMMY_SP, - type_args: None, - })) - } - - fn reset_styles_state(&mut self) { - self.has_swc_magic = false; - self.static_class_name = None; - self.class_name = None; - self.styles = vec![]; - } -} - -fn is_swc_magic(el: &JSXElement) -> bool { - if let JSXElementName::Ident(Ident { sym, .. }) = &el.opening.name { - if sym != "style" { - return false; - } - } - - el.opening.attrs.iter().any(|attr| { - if let JSXAttrOrSpread::JSXAttr(JSXAttr { - name: JSXAttrName::Ident(Ident { sym, .. }), - .. - }) = &attr - { - if sym == "jsx" { - return true; - } - } - false - }) -} - -fn is_global(el: &JSXElement) -> bool { - if let JSXElementName::Ident(Ident { sym, .. }) = &el.opening.name { - if sym != "style" { - return false; - } - } - - el.opening.attrs.iter().any(|attr| { - if let JSXAttrOrSpread::JSXAttr(JSXAttr { - name: JSXAttrName::Ident(Ident { sym, .. }), - .. - }) = &attr - { - if sym == "global" { - return true; - } - } - false - }) -} - -fn get_style_expr(el: &JSXElement) -> Result { - let non_whitespace_children: &Vec<&JSXElementChild> = &el - .children - .iter() - .filter(|child| { - if let JSXElementChild::JSXText(txt) = child { - if txt.value.chars().all(char::is_whitespace) { - return false; - } - } - true - }) - .collect(); - - if non_whitespace_children.len() != 1 { - HANDLER.with(|handler| { - handler - .struct_span_err( - el.span, - &format!( - "Expected one child under JSX style tag, but got {}.\nRead more: https://nextjs.org/docs/messages/invalid-swc-magic-children", - non_whitespace_children.len() - ), - ) - .emit() - }); - bail!("swc-magic style error"); - } - - if let JSXElementChild::JSXExprContainer(JSXExprContainer { - expr: JSXExpr::Expr(expr), - .. - }) = non_whitespace_children[0] - { - return Ok(match &**expr { - Expr::Lit(Lit::Str(str)) => StyleExpr::Str(str), - Expr::Tpl(tpl) => StyleExpr::Tpl(tpl, expr), - Expr::Ident(ident) => StyleExpr::Ident(ident), - _ => { - HANDLER.with(|handler| { - handler - .struct_span_err( - el.span, - "Expected a template literal, string or identifier inside the JSXExpressionContainer.\nRead more: https://nextjs.org/docs/messages/invalid-swc-magic-children", - ) - .emit() - }); - bail!("wrong jsx expression container type"); - } - }); - } - - HANDLER.with(|handler| { - handler - .struct_span_err( - el.span, - "Expected a single child of type JSXExpressionContainer under JSX Style tag.\nRead more: https://nextjs.org/docs/messages/invalid-swc-magic-children", - ) - .emit() - }); - bail!("next-swc compilation error"); -} - -fn get_existing_class_name(el: &JSXOpeningElement) -> (Option, Option, Option) { - let mut spreads = vec![]; - let mut class_name_expr = None; - let mut existing_index = None; - let mut existing_spread_index = None; - for i in (0..el.attrs.len()).rev() { - match &el.attrs[i] { - JSXAttrOrSpread::JSXAttr(JSXAttr { - name: JSXAttrName::Ident(Ident { sym, .. }), - value, - .. - }) => { - if sym == "className" { - existing_index = Some(i); - class_name_expr = match value { - Some(JSXAttrValue::Lit(str_lit)) => Some(Expr::Lit(str_lit.clone())), - Some(JSXAttrValue::JSXExprContainer(JSXExprContainer { - expr: JSXExpr::Expr(expr), - .. - })) => Some(*expr.clone()), - None => None, - _ => None, - }; - break; - } - } - JSXAttrOrSpread::SpreadElement(SpreadElement { expr, .. }) => { - if let Expr::Object(ObjectLit { props, .. }) = &**expr { - let mut has_spread = false; - let mut has_class_name = false; - for j in 0..props.len() { - if let PropOrSpread::Prop(prop) = &props[j] { - if let Prop::KeyValue(KeyValueProp { - key: PropName::Ident(Ident { sym, .. }), - value, - }) = &**prop - { - if sym == "className" { - has_class_name = true; - class_name_expr = Some(*value.clone()); - if props.len() == 1 { - existing_spread_index = Some(i); - } - } - } - } else { - has_spread = true; - } - } - if has_class_name { - break; - } - if !has_spread { - continue; - } - } - - let valid_spread = matches!(&**expr, Expr::Member(_) | Expr::Ident(_)); - - if valid_spread { - let member_dot_name = Expr::Member(MemberExpr { - obj: Box::new(*expr.clone()), - prop: MemberProp::Ident(ident("className")), - span: DUMMY_SP, - }); - // `${name} && ${name}.className != null && ${name}.className` - spreads.push(and( - and( - *expr.clone(), - not_eq( - member_dot_name.clone(), - Expr::Lit(Lit::Null(Null { span: DUMMY_SP })), - ), - ), - member_dot_name.clone(), - )); - } - } - _ => {} - }; - } - - let spread_expr = match spreads.len() { - 0 => None, - _ => Some(join_spreads(spreads)), - }; - - let class_name_expr = match class_name_expr { - Some(e @ Expr::Tpl(_) | e @ Expr::Lit(Lit::Str(_))) => Some(e), - None => None, - _ => Some(or(class_name_expr.unwrap(), string_literal_expr(""))), - }; - - let existing_class_name_expr = match (spread_expr, class_name_expr) { - (Some(spread_expr), Some(class_name_expr)) => Some(or(spread_expr, class_name_expr)), - (Some(spread_expr), None) => Some(or(spread_expr, string_literal_expr(""))), - (None, Some(class_name_expr)) => Some(class_name_expr), - _ => None, - }; - - ( - existing_class_name_expr, - existing_index, - existing_spread_index, - ) -} - -fn join_spreads(spreads: Vec) -> Expr { - let mut new_expr = spreads[0].clone(); - for i in spreads.iter().skip(1) { - new_expr = Expr::Bin(BinExpr { - op: op!("||"), - left: Box::new(new_expr.clone()), - right: Box::new(i.clone()), - span: DUMMY_SP, - }) - } - new_expr -} - -fn add_hash_statement((id, hash): (Id, String)) -> Stmt { - Stmt::Expr(ExprStmt { - expr: Box::new(Expr::Assign(AssignExpr { - left: PatOrExpr::Expr(Box::new(Expr::Member(MemberExpr { - obj: Box::new(Expr::Ident(Ident { - sym: id.0, - span: DUMMY_SP.with_ctxt(id.1), - optional: false, - })), - prop: MemberProp::Ident(Ident { - sym: "__hash".into(), - span: DUMMY_SP, - optional: false, - }), - span: DUMMY_SP, - }))), - right: Box::new(string_literal_expr(&hash)), - op: op!("="), - span: DUMMY_SP, - })), - span: DUMMY_SP, - }) -} - -fn is_styled_css_import(item: &ModuleItem) -> bool { - if let ModuleItem::ModuleDecl(ModuleDecl::Import(ImportDecl { - src: box Str { value, .. }, - .. - })) = item - { - if value == "swc-magic/css" { - return true; - } - } - false -} From 61e0e284408d7138d32cbfc7fb0884bf3c8c484f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:37:41 -0700 Subject: [PATCH 11/47] work --- packages/swc-magic/transform/src/lib.rs | 88 +++++++++++++++++++++++++ 1 file changed, 88 insertions(+) diff --git a/packages/swc-magic/transform/src/lib.rs b/packages/swc-magic/transform/src/lib.rs index 8d7197393..1b1e65371 100644 --- a/packages/swc-magic/transform/src/lib.rs +++ b/packages/swc-magic/transform/src/lib.rs @@ -1,3 +1,91 @@ #![feature(box_patterns)] +use import_analyzer::ImportMap; +use swc_atoms::Atom; +use swc_common::{comments::Comments, errors::HANDLER}; +use swc_ecma_ast::{CallExpr, Callee, EmptyStmt, Expr, Module, ModuleDecl, ModuleItem, Stmt}; +use swc_ecma_visit::{VisitMut, VisitMutWith}; + mod import_analyzer; + +pub fn magic(import_path: Atom, comments: C) -> impl VisitMut +where + C: Comments, +{ + Magic { + import_path, + comments, + imports: Default::default(), + } +} + +const MARK_AS_PURE_FN_NAME: &str = "markAsPure"; + +/// Handles functions from `@swc/magic`. +struct Magic +where + C: Comments, +{ + imports: ImportMap, + comments: C, + import_path: Atom, +} + +impl VisitMut for Magic +where + C: Comments, +{ + fn visit_mut_expr(&mut self, e: &mut Expr) { + e.visit_mut_children_with(self); + + if let Expr::Call(CallExpr { + span, + callee: Callee::Expr(callee), + args, + .. + }) = e + { + if !self + .imports + .is_import(callee, &self.import_path, MARK_AS_PURE_FN_NAME) + { + return; + } + + if args.len() != 1 { + HANDLER.with(|handler| { + handler + .struct_span_err(*span, "markAsPure() does not support multiple arguments") + .emit(); + }); + return; + } + + *e = *args[0].expr.take(); + + let mut lo = e.span().lo; + if lo.is_dummy() { + lo = Span::dummy_with_cmt().lo; + } + + self.comments.add_pure_comment(lo); + } + } + + fn visit_mut_module(&mut self, m: &mut Module) { + self.imports = ImportMap::analyze(&m); + + m.visit_mut_children_with(self); + } + + fn visit_mut_module_item(&mut self, m: &mut ModuleItem) { + if let ModuleItem::ModuleDecl(ModuleDecl::Import(import)) = m { + if import.src.value == self.import_path { + *m = ModuleItem::Stmt(Stmt::Empty(EmptyStmt { span: DUMMY_SP })); + return; + } + } + + m.visit_mut_children_with(self); + } +} From f33ad19dfed492b4457c9c49763a755e510157ff Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:40:17 -0700 Subject: [PATCH 12/47] work --- packages/swc-magic/transform/src/lib.rs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/swc-magic/transform/src/lib.rs b/packages/swc-magic/transform/src/lib.rs index 1b1e65371..8c0781c6f 100644 --- a/packages/swc-magic/transform/src/lib.rs +++ b/packages/swc-magic/transform/src/lib.rs @@ -2,7 +2,7 @@ use import_analyzer::ImportMap; use swc_atoms::Atom; -use swc_common::{comments::Comments, errors::HANDLER}; +use swc_common::{comments::Comments, errors::HANDLER, util::take::Take, Span, Spanned, DUMMY_SP}; use swc_ecma_ast::{CallExpr, Callee, EmptyStmt, Expr, Module, ModuleDecl, ModuleItem, Stmt}; use swc_ecma_visit::{VisitMut, VisitMutWith}; From a23f6455ebb4d77dd9966961c05172e6aec4850c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:44:26 -0700 Subject: [PATCH 13/47] I'm fucked up --- packages/swc-magic/src/lib.rs | 1 - packages/swc-magic/transform/src/lib.rs | 19 +++++++++++++------ 2 files changed, 13 insertions(+), 7 deletions(-) diff --git a/packages/swc-magic/src/lib.rs b/packages/swc-magic/src/lib.rs index ec504acee..b15b78a71 100644 --- a/packages/swc-magic/src/lib.rs +++ b/packages/swc-magic/src/lib.rs @@ -6,7 +6,6 @@ use swc_core::{ ecma::{ast::Program, visit::FoldWith}, plugin::{plugin_transform, proxies::TransformPluginProgramMetadata}, }; -use swc_magic::{visitor, visitor::Config}; #[plugin_transform] fn swc_magic_plugin(program: Program, data: TransformPluginProgramMetadata) -> Program { diff --git a/packages/swc-magic/transform/src/lib.rs b/packages/swc-magic/transform/src/lib.rs index 8c0781c6f..b9d0725e7 100644 --- a/packages/swc-magic/transform/src/lib.rs +++ b/packages/swc-magic/transform/src/lib.rs @@ -8,12 +8,19 @@ use swc_ecma_visit::{VisitMut, VisitMutWith}; mod import_analyzer; -pub fn magic(import_path: Atom, comments: C) -> impl VisitMut +#[derive(Debug, Clone)] +pub struct Config { + import_path: Atom, +} + +impl Config {} + +pub fn magic(config: Config, comments: C) -> impl VisitMut where C: Comments, { Magic { - import_path, + config, comments, imports: Default::default(), } @@ -26,9 +33,9 @@ struct Magic where C: Comments, { - imports: ImportMap, + config: Config, comments: C, - import_path: Atom, + imports: ImportMap, } impl VisitMut for Magic @@ -47,7 +54,7 @@ where { if !self .imports - .is_import(callee, &self.import_path, MARK_AS_PURE_FN_NAME) + .is_import(callee, &self.config.import_path, MARK_AS_PURE_FN_NAME) { return; } @@ -80,7 +87,7 @@ where fn visit_mut_module_item(&mut self, m: &mut ModuleItem) { if let ModuleItem::ModuleDecl(ModuleDecl::Import(import)) = m { - if import.src.value == self.import_path { + if import.src.value == self.config.import_path { *m = ModuleItem::Stmt(Stmt::Empty(EmptyStmt { span: DUMMY_SP })); return; } From ce98ab7236b3e3546952c889be54275c44efc680 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:46:09 -0700 Subject: [PATCH 14/47] Deps --- packages/swc-magic/Cargo.toml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/swc-magic/Cargo.toml b/packages/swc-magic/Cargo.toml index 68dda2d4c..ffd44fec6 100644 --- a/packages/swc-magic/Cargo.toml +++ b/packages/swc-magic/Cargo.toml @@ -11,6 +11,8 @@ version = "0.1.0" crate-type = ["cdylib", "rlib"] [dependencies] +serde_json = "1.0.107" +swc_core = { version = "0.86.16", features = ["ecma_plugin_transform"] } swc_magic = { path = "./transform" } From 95608bfab4e5fda178b02bd279890b98eb774fde Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:46:22 -0700 Subject: [PATCH 15/47] cargo lockfile --- Cargo.lock | 46 ++++++++++++++++++++++++---------------------- 1 file changed, 24 insertions(+), 22 deletions(-) diff --git a/Cargo.lock b/Cargo.lock index e83bf20a7..b8176223f 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -1912,9 +1912,9 @@ dependencies = [ [[package]] name = "serde_json" -version = "1.0.106" +version = "1.0.107" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "2cc66a619ed80bf7a0f6b17dd063a84b88f6dea1813737cf469aef1d081142c2" +checksum = "6b420ce6e3d8bd882e9b243c6eed35dbc9a6110c9769e74b584e0d68d1f20c65" dependencies = [ "itoa", "ryu", @@ -2310,9 +2310,9 @@ dependencies = [ [[package]] name = "swc_core" -version = "0.86.1" +version = "0.86.16" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "d40c049be93138bf3f521dd42500301762fdd5f5d326e11de012588dcd8135ca" +checksum = "7fc150980a536967131caf89ccedfbf425ba83fc08be3c8809dd310c73712853" dependencies = [ "once_cell", "swc_atoms", @@ -2463,9 +2463,9 @@ dependencies = [ [[package]] name = "swc_ecma_codegen" -version = "0.146.1" +version = "0.146.4" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "1fba119c76654599b71099a0150094f5790f00db63aab6cda1790e731f42c98f" +checksum = "25072d4697d22370f48f9807a57cf81cabb257793834c839b229242d720191fa" dependencies = [ "memchr", "num-bigint", @@ -2529,9 +2529,9 @@ dependencies = [ [[package]] name = "swc_ecma_parser" -version = "0.141.1" +version = "0.141.4" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "a26e535c623db7beb04ba8ebfa821c287b72a23f9fb523990b54db6c1355c990" +checksum = "cfdb522b9e8e2bdea5d4f0a7bf311acf38ba44d48e52b4cb9ab8dcb8814cb7ed" dependencies = [ "either", "num-bigint", @@ -2549,9 +2549,9 @@ dependencies = [ [[package]] name = "swc_ecma_quote_macros" -version = "0.52.1" +version = "0.52.4" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "687e5944bd1ccf5729104c2ed11c182b1f679d18d620980da442bfe326391ddf" +checksum = "f7a3fa8831a60e0791c0c858273907c822c99ade76987fb276d6883adf27c557" dependencies = [ "anyhow", "pmutil", @@ -2567,9 +2567,9 @@ dependencies = [ [[package]] name = "swc_ecma_testing" -version = "0.22.0" +version = "0.22.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "57c456e2c330c0049f77780cd412e61d9c9d0ae7ff9b6c0e4f8262270b7c718e" +checksum = "cc49bcb4c6db93972e12f965892dcfd9e1f06c3fc3a1d195972e4c9ade9e0b12" dependencies = [ "anyhow", "hex", @@ -2594,9 +2594,9 @@ dependencies = [ [[package]] name = "swc_ecma_transforms_base" -version = "0.134.4" +version = "0.134.9" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "37d30c5aa540b6516875d507d3dc2ca7edf77a30fe9e070868ccd2d90b85a3a3" +checksum = "5c7692452ac60c89b570c1592e4a0723a201d8e3933c3838f44846f9d7aaa2b5" dependencies = [ "better_scoped_tls", "bitflags 2.4.0", @@ -2678,9 +2678,9 @@ dependencies = [ [[package]] name = "swc_ecma_transforms_testing" -version = "0.137.4" +version = "0.137.9" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "06b02eb5f5972cc9000aedf436aefdd1723d6f7235fc829eb1a2f29fcff38f86" +checksum = "30b410ed8b663592843306d9b7c92492aa3a77446b7fb54431a5b3d5b4f1176f" dependencies = [ "ansi_term", "anyhow", @@ -2792,9 +2792,9 @@ dependencies = [ [[package]] name = "swc_error_reporters" -version = "0.17.0" +version = "0.17.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "015cbdf2b13ccc76eb12d1702a90fb9aae7b3cddacaf2c56a1b1a4a02f9fcd81" +checksum = "c1318961e85f58032030e137e5e42b4a90b3a166e05acf340d0195ad5652b764" dependencies = [ "anyhow", "miette", @@ -2936,9 +2936,9 @@ dependencies = [ [[package]] name = "swc_plugin_proxy" -version = "0.39.0" +version = "0.39.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "55e32ea3aeb4930d0b6fcf1f052d33a4bb115a9d58e32bf3baade3316ef6bdd3" +checksum = "f6934fd5732f841f6aef392e492ee6936c8797cdfbc4baafe57b1c9ef1c6c944" dependencies = [ "better_scoped_tls", "rkyv", @@ -3039,6 +3039,8 @@ dependencies = [ name = "swc_plugin_swc_magic" version = "0.1.0" dependencies = [ + "serde_json", + "swc_core", "swc_magic", ] @@ -3181,9 +3183,9 @@ dependencies = [ [[package]] name = "testing" -version = "0.35.0" +version = "0.35.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "e149694212e0152671c616dc21e4029a0f39710085f32705b2fb07fda89e437f" +checksum = "76f3d926524064129f7725899543b1724519dfc753df27236b30c21669e4b2a8" dependencies = [ "ansi_term", "cargo_metadata 0.15.4", From c03f7a53494336519372211387c93c3c2eba3f98 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:50:55 -0700 Subject: [PATCH 16/47] Dep --- packages/swc-magic/transform/Cargo.toml | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/swc-magic/transform/Cargo.toml b/packages/swc-magic/transform/Cargo.toml index cd4c2935e..43c9b646e 100644 --- a/packages/swc-magic/transform/Cargo.toml +++ b/packages/swc-magic/transform/Cargo.toml @@ -7,6 +7,7 @@ name = "swc_magic" version = "0.1.0" [dependencies] +serde = { version = "1.0.189", features = ["derive"] } swc_atoms = "0.6.0" swc_common = "0.33.1" swc_ecma_ast = "0.110.1" From 03d4cb700c5f3b355f166cd78a366ec6ef77600d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:51:43 -0700 Subject: [PATCH 17/47] More work --- packages/swc-magic/src/lib.rs | 25 ++++++++++++++++++++----- packages/swc-magic/transform/src/lib.rs | 9 ++++++--- 2 files changed, 26 insertions(+), 8 deletions(-) diff --git a/packages/swc-magic/src/lib.rs b/packages/swc-magic/src/lib.rs index b15b78a71..bad1427ab 100644 --- a/packages/swc-magic/src/lib.rs +++ b/packages/swc-magic/src/lib.rs @@ -3,21 +3,36 @@ use swc_core::{ common::{sync::Lrc, FileName, SourceMap}, - ecma::{ast::Program, visit::FoldWith}, - plugin::{plugin_transform, proxies::TransformPluginProgramMetadata}, + ecma::{ + ast::Program, + transforms::base::hygiene::Config, + visit::{FoldWith, VisitMutWith}, + }, + plugin::{ + plugin_transform, + proxies::{PluginCommentsProxy, TransformPluginProgramMetadata}, + }, }; #[plugin_transform] -fn swc_magic_plugin(program: Program, data: TransformPluginProgramMetadata) -> Program { - let config = serde_json::from_str::( +fn swc_magic_plugin(mut program: Program, data: TransformPluginProgramMetadata) -> Program { + let config = serde_json::from_str::( &data .get_transform_plugin_config() .expect("failed to get plugin config for swc-magic"), ) .expect("invalid config for swc-magic"); + let unresolved_mark = data.unresolved_mark; + // TODO(kdy1): This is wrong, but it does not use cm let cm = Lrc::new(SourceMap::default()); - program.fold_with(&mut visitor::swc_magic(cm, FileName::Anon, config)) + program.visit_mut_with(&mut swc_magic::swc_magic( + unresolved_mark, + config, + PluginCommentsProxy, + )); + + program } diff --git a/packages/swc-magic/transform/src/lib.rs b/packages/swc-magic/transform/src/lib.rs index b9d0725e7..c91a5e34e 100644 --- a/packages/swc-magic/transform/src/lib.rs +++ b/packages/swc-magic/transform/src/lib.rs @@ -1,21 +1,24 @@ #![feature(box_patterns)] use import_analyzer::ImportMap; +use serde::Deserialize; use swc_atoms::Atom; -use swc_common::{comments::Comments, errors::HANDLER, util::take::Take, Span, Spanned, DUMMY_SP}; +use swc_common::{ + comments::Comments, errors::HANDLER, util::take::Take, Mark, Span, Spanned, DUMMY_SP, +}; use swc_ecma_ast::{CallExpr, Callee, EmptyStmt, Expr, Module, ModuleDecl, ModuleItem, Stmt}; use swc_ecma_visit::{VisitMut, VisitMutWith}; mod import_analyzer; -#[derive(Debug, Clone)] +#[derive(Debug, Clone, Deserialize)] pub struct Config { import_path: Atom, } impl Config {} -pub fn magic(config: Config, comments: C) -> impl VisitMut +pub fn swc_magic(_unreolved_mark: Mark, config: Config, comments: C) -> impl VisitMut where C: Comments, { From 984e51baf8ec80f17b80fd0e3310a165167c7a14 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:55:15 -0700 Subject: [PATCH 18/47] swc-magic --- packages/swc-magic/src/lib.rs | 1 - packages/swc-magic/transform/src/lib.rs | 12 +++++++++++- 2 files changed, 11 insertions(+), 2 deletions(-) diff --git a/packages/swc-magic/src/lib.rs b/packages/swc-magic/src/lib.rs index bad1427ab..e93439e2b 100644 --- a/packages/swc-magic/src/lib.rs +++ b/packages/swc-magic/src/lib.rs @@ -5,7 +5,6 @@ use swc_core::{ common::{sync::Lrc, FileName, SourceMap}, ecma::{ ast::Program, - transforms::base::hygiene::Config, visit::{FoldWith, VisitMutWith}, }, plugin::{ diff --git a/packages/swc-magic/transform/src/lib.rs b/packages/swc-magic/transform/src/lib.rs index c91a5e34e..e61059fd0 100644 --- a/packages/swc-magic/transform/src/lib.rs +++ b/packages/swc-magic/transform/src/lib.rs @@ -4,7 +4,8 @@ use import_analyzer::ImportMap; use serde::Deserialize; use swc_atoms::Atom; use swc_common::{ - comments::Comments, errors::HANDLER, util::take::Take, Mark, Span, Spanned, DUMMY_SP, + comments::Comments, errors::HANDLER, util::take::Take, DeserializeEnum, Mark, Span, Spanned, + DUMMY_SP, }; use swc_ecma_ast::{CallExpr, Callee, EmptyStmt, Expr, Module, ModuleDecl, ModuleItem, Stmt}; use swc_ecma_visit::{VisitMut, VisitMutWith}; @@ -86,6 +87,15 @@ where self.imports = ImportMap::analyze(&m); m.visit_mut_children_with(self); + + // Remove Stmt::Empty + m.body.retain(|item| { + if let ModuleItem::Stmt(Stmt::Empty(..)) = item { + false + } else { + true + } + }); } fn visit_mut_module_item(&mut self, m: &mut ModuleItem) { From cf70816bfa5b78544d478b919d8474c404e7a5d2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:55:28 -0700 Subject: [PATCH 19/47] cargo lockfile --- Cargo.lock | 35 +++++++++++++++++++++++------------ 1 file changed, 23 insertions(+), 12 deletions(-) diff --git a/Cargo.lock b/Cargo.lock index b8176223f..91ef0afdb 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -604,9 +604,12 @@ dependencies = [ [[package]] name = "deranged" -version = "0.3.8" +version = "0.3.9" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "f2696e8a945f658fd14dc3b87242e6b80cd0f36ff04ea560fa39082368847946" +checksum = "0f32d04922c60427da6f9fef14d042d9edddef64cb9d4ce0d64d0685fbeb1fd3" +dependencies = [ + "powerfmt", +] [[package]] name = "diff" @@ -1476,6 +1479,12 @@ dependencies = [ "syn 2.0.32", ] +[[package]] +name = "powerfmt" +version = "0.2.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "439ee305def115ba05938db6eb1644ff94165c5ab5e9420d1c1bcedbba909391" + [[package]] name = "ppv-lite86" version = "0.2.17" @@ -1881,9 +1890,9 @@ checksum = "388a1df253eca08550bef6c72392cfe7c30914bf41df5269b68cbd6ff8f570a3" [[package]] name = "serde" -version = "1.0.171" +version = "1.0.189" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "30e27d1e4fd7659406c492fd6cfaf2066ba8773de45ca75e855590f856dc34a9" +checksum = "8e422a44e74ad4001bdc8eede9a4570ab52f71190e9c076d14369f38b9200537" dependencies = [ "serde_derive", ] @@ -1901,9 +1910,9 @@ dependencies = [ [[package]] name = "serde_derive" -version = "1.0.171" +version = "1.0.189" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "389894603bd18c46fa56231694f8d827779c0951a667087194cf9de94ed24682" +checksum = "1e48d1f918009ce3145511378cf68d613e3b3d9137d67272562080d68a2b32d5" dependencies = [ "proc-macro2", "quote", @@ -2831,6 +2840,7 @@ dependencies = [ name = "swc_magic" version = "0.1.0" dependencies = [ + "serde", "swc_atoms", "swc_common", "swc_ecma_ast", @@ -3261,12 +3271,13 @@ dependencies = [ [[package]] name = "time" -version = "0.3.26" +version = "0.3.30" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "a79d09ac6b08c1ab3906a2f7cc2e81a0e27c7ae89c63812df75e52bef0751e07" +checksum = "c4a34ab300f2dee6e562c10a046fc05e358b29f9bf92277f30c3c8d82275f6f5" dependencies = [ "deranged", "itoa", + "powerfmt", "serde", "time-core", "time-macros", @@ -3274,15 +3285,15 @@ dependencies = [ [[package]] name = "time-core" -version = "0.1.1" +version = "0.1.2" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "7300fbefb4dadc1af235a9cef3737cea692a9d97e1b9cbcd4ebdae6f8868e6fb" +checksum = "ef927ca75afb808a4d64dd374f00a2adf8d0fcff8e7b184af886c3c87ec4a3f3" [[package]] name = "time-macros" -version = "0.2.12" +version = "0.2.15" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "75c65469ed6b3a4809d987a41eb1dc918e9bc1d92211cbad7ae82931846f7451" +checksum = "4ad70d68dba9e1f8aceda7aa6711965dfec1cac869f311a51bd08b3a2ccbce20" dependencies = [ "time-core", ] From be7088abdfb028711055d5d640d4b536fbec15cb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 08:58:19 -0700 Subject: [PATCH 20/47] Add testss --- packages/swc-magic/transform/fixture/no-name-clash/input.js | 3 +++ packages/swc-magic/transform/fixture/simple/input.js | 3 +++ 2 files changed, 6 insertions(+) create mode 100644 packages/swc-magic/transform/fixture/no-name-clash/input.js create mode 100644 packages/swc-magic/transform/fixture/simple/input.js diff --git a/packages/swc-magic/transform/fixture/no-name-clash/input.js b/packages/swc-magic/transform/fixture/no-name-clash/input.js new file mode 100644 index 000000000..3bd24f1f7 --- /dev/null +++ b/packages/swc-magic/transform/fixture/no-name-clash/input.js @@ -0,0 +1,3 @@ +import { __nextjs_pure } from 'not-next-magic' + +__nextjs_pure(console.log('test!')) \ No newline at end of file diff --git a/packages/swc-magic/transform/fixture/simple/input.js b/packages/swc-magic/transform/fixture/simple/input.js new file mode 100644 index 000000000..991cf42b9 --- /dev/null +++ b/packages/swc-magic/transform/fixture/simple/input.js @@ -0,0 +1,3 @@ +import { __nextjs_pure } from 'next/dist/build/swc/helpers' + +__nextjs_pure(console.log('test!')) \ No newline at end of file From dded8df81ae08ff081789f0af61ff7da9e92d8b5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:03:56 -0700 Subject: [PATCH 21/47] Add testss --- Cargo.lock | 3 +++ packages/swc-magic/src/lib.rs | 3 --- packages/swc-magic/transform/Cargo.toml | 5 ++++ packages/swc-magic/transform/src/lib.rs | 3 +-- packages/swc-magic/transform/tests/fixture.rs | 23 +++++++++++++++++++ .../fixture/no-name-clash/input.js | 0 .../{ => tests}/fixture/simple/input.js | 0 7 files changed, 32 insertions(+), 5 deletions(-) create mode 100644 packages/swc-magic/transform/tests/fixture.rs rename packages/swc-magic/transform/{ => tests}/fixture/no-name-clash/input.js (100%) rename packages/swc-magic/transform/{ => tests}/fixture/simple/input.js (100%) diff --git a/Cargo.lock b/Cargo.lock index 91ef0afdb..a7c913a95 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -2844,8 +2844,11 @@ dependencies = [ "swc_atoms", "swc_common", "swc_ecma_ast", + "swc_ecma_parser", + "swc_ecma_transforms_testing", "swc_ecma_utils", "swc_ecma_visit", + "testing", ] [[package]] diff --git a/packages/swc-magic/src/lib.rs b/packages/swc-magic/src/lib.rs index e93439e2b..e651f3940 100644 --- a/packages/swc-magic/src/lib.rs +++ b/packages/swc-magic/src/lib.rs @@ -24,9 +24,6 @@ fn swc_magic_plugin(mut program: Program, data: TransformPluginProgramMetadata) let unresolved_mark = data.unresolved_mark; - // TODO(kdy1): This is wrong, but it does not use cm - let cm = Lrc::new(SourceMap::default()); - program.visit_mut_with(&mut swc_magic::swc_magic( unresolved_mark, config, diff --git a/packages/swc-magic/transform/Cargo.toml b/packages/swc-magic/transform/Cargo.toml index 43c9b646e..1687d3e35 100644 --- a/packages/swc-magic/transform/Cargo.toml +++ b/packages/swc-magic/transform/Cargo.toml @@ -13,3 +13,8 @@ swc_common = "0.33.1" swc_ecma_ast = "0.110.1" swc_ecma_utils = "0.124.8" swc_ecma_visit = "0.96.1" + +[dev-dependencies] +swc_ecma_parser = "0.141.4" +swc_ecma_transforms_testing = "0.137.9" +testing = "0.35.1" diff --git a/packages/swc-magic/transform/src/lib.rs b/packages/swc-magic/transform/src/lib.rs index e61059fd0..d8499107a 100644 --- a/packages/swc-magic/transform/src/lib.rs +++ b/packages/swc-magic/transform/src/lib.rs @@ -4,8 +4,7 @@ use import_analyzer::ImportMap; use serde::Deserialize; use swc_atoms::Atom; use swc_common::{ - comments::Comments, errors::HANDLER, util::take::Take, DeserializeEnum, Mark, Span, Spanned, - DUMMY_SP, + comments::Comments, errors::HANDLER, util::take::Take, Mark, Span, Spanned, DUMMY_SP, }; use swc_ecma_ast::{CallExpr, Callee, EmptyStmt, Expr, Module, ModuleDecl, ModuleItem, Stmt}; use swc_ecma_visit::{VisitMut, VisitMutWith}; diff --git a/packages/swc-magic/transform/tests/fixture.rs b/packages/swc-magic/transform/tests/fixture.rs new file mode 100644 index 000000000..ba188fb18 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture.rs @@ -0,0 +1,23 @@ +use std::path::PathBuf; + +use swc_common::Mark; + +#[testing::fixture("tests/fixture/**/input.js")] +fn pure(input: PathBuf) { + let output = input.parent().unwrap().join("output.js"); + test_fixture( + syntax(), + &|tr| { + let unresolved_mark = Mark::new(); + let top_level_mark = Mark::new(); + + chain!( + resolver(unresolved_mark, top_level_mark, false), + swc_magic(unresolved_mark, tr.comments.clone(tr.comments.cloen())) + ) + }, + &input, + &output, + Default::default(), + ); +} diff --git a/packages/swc-magic/transform/fixture/no-name-clash/input.js b/packages/swc-magic/transform/tests/fixture/no-name-clash/input.js similarity index 100% rename from packages/swc-magic/transform/fixture/no-name-clash/input.js rename to packages/swc-magic/transform/tests/fixture/no-name-clash/input.js diff --git a/packages/swc-magic/transform/fixture/simple/input.js b/packages/swc-magic/transform/tests/fixture/simple/input.js similarity index 100% rename from packages/swc-magic/transform/fixture/simple/input.js rename to packages/swc-magic/transform/tests/fixture/simple/input.js From 451bf5ed7c2f13a0af515e5fbd0f9d1a1ba8884a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:11:25 -0700 Subject: [PATCH 22/47] test --- packages/swc-magic/transform/Cargo.toml | 1 + packages/swc-magic/transform/src/lib.rs | 2 +- packages/swc-magic/transform/tests/fixture.rs | 16 +++++++++++++--- 3 files changed, 15 insertions(+), 4 deletions(-) diff --git a/packages/swc-magic/transform/Cargo.toml b/packages/swc-magic/transform/Cargo.toml index 1687d3e35..4020efd51 100644 --- a/packages/swc-magic/transform/Cargo.toml +++ b/packages/swc-magic/transform/Cargo.toml @@ -16,5 +16,6 @@ swc_ecma_visit = "0.96.1" [dev-dependencies] swc_ecma_parser = "0.141.4" +swc_ecma_transforms_base = "0.134.9" swc_ecma_transforms_testing = "0.137.9" testing = "0.35.1" diff --git a/packages/swc-magic/transform/src/lib.rs b/packages/swc-magic/transform/src/lib.rs index d8499107a..2f0f8d5f1 100644 --- a/packages/swc-magic/transform/src/lib.rs +++ b/packages/swc-magic/transform/src/lib.rs @@ -13,7 +13,7 @@ mod import_analyzer; #[derive(Debug, Clone, Deserialize)] pub struct Config { - import_path: Atom, + pub import_path: Atom, } impl Config {} diff --git a/packages/swc-magic/transform/tests/fixture.rs b/packages/swc-magic/transform/tests/fixture.rs index ba188fb18..0bb37107f 100644 --- a/packages/swc-magic/transform/tests/fixture.rs +++ b/packages/swc-magic/transform/tests/fixture.rs @@ -1,19 +1,29 @@ use std::path::PathBuf; -use swc_common::Mark; +use swc_common::{chain, Mark}; +use swc_ecma_parser::Syntax; +use swc_ecma_transforms_base::resolver; +use swc_ecma_transforms_testing::test_fixture; +use swc_ecma_visit::as_folder; #[testing::fixture("tests/fixture/**/input.js")] fn pure(input: PathBuf) { let output = input.parent().unwrap().join("output.js"); test_fixture( - syntax(), + Syntax::default(), &|tr| { let unresolved_mark = Mark::new(); let top_level_mark = Mark::new(); chain!( resolver(unresolved_mark, top_level_mark, false), - swc_magic(unresolved_mark, tr.comments.clone(tr.comments.cloen())) + as_folder(swc_magic::swc_magic( + unresolved_mark, + swc_magic::Config { + import_path: "@swc/magic".into() + }, + tr.comments.clone() + )) ) }, &input, From fc83a715f94f4de3549de10acce9f612330162cd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:11:29 -0700 Subject: [PATCH 23/47] cargo lockfile --- Cargo.lock | 1 + 1 file changed, 1 insertion(+) diff --git a/Cargo.lock b/Cargo.lock index a7c913a95..421653779 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -2845,6 +2845,7 @@ dependencies = [ "swc_common", "swc_ecma_ast", "swc_ecma_parser", + "swc_ecma_transforms_base", "swc_ecma_transforms_testing", "swc_ecma_utils", "swc_ecma_visit", From c1548003c059a09181b09a977c4dafc9ea1d2c5b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:11:58 -0700 Subject: [PATCH 24/47] Fix input --- .../swc-magic/transform/tests/fixture/no-name-clash/input.js | 4 ++-- packages/swc-magic/transform/tests/fixture/simple/input.js | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/swc-magic/transform/tests/fixture/no-name-clash/input.js b/packages/swc-magic/transform/tests/fixture/no-name-clash/input.js index 3bd24f1f7..1d971f4f1 100644 --- a/packages/swc-magic/transform/tests/fixture/no-name-clash/input.js +++ b/packages/swc-magic/transform/tests/fixture/no-name-clash/input.js @@ -1,3 +1,3 @@ -import { __nextjs_pure } from 'not-next-magic' +import { markAsPure } from 'not-swc-magic' -__nextjs_pure(console.log('test!')) \ No newline at end of file +markAsPure(console.log('test!')) \ No newline at end of file diff --git a/packages/swc-magic/transform/tests/fixture/simple/input.js b/packages/swc-magic/transform/tests/fixture/simple/input.js index 991cf42b9..5001f9827 100644 --- a/packages/swc-magic/transform/tests/fixture/simple/input.js +++ b/packages/swc-magic/transform/tests/fixture/simple/input.js @@ -1,3 +1,3 @@ -import { __nextjs_pure } from 'next/dist/build/swc/helpers' +import { markAsPure } from '@swc/magic' -__nextjs_pure(console.log('test!')) \ No newline at end of file +markAsPure(console.log('test!')) \ No newline at end of file From 6bb9ba4e5f4009e03957963dd35ce0bfda5b97c9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:12:05 -0700 Subject: [PATCH 25/47] Update test refs --- .../swc-magic/transform/tests/fixture/no-name-clash/output.js | 2 ++ packages/swc-magic/transform/tests/fixture/simple/output.js | 1 + 2 files changed, 3 insertions(+) create mode 100644 packages/swc-magic/transform/tests/fixture/no-name-clash/output.js create mode 100644 packages/swc-magic/transform/tests/fixture/simple/output.js diff --git a/packages/swc-magic/transform/tests/fixture/no-name-clash/output.js b/packages/swc-magic/transform/tests/fixture/no-name-clash/output.js new file mode 100644 index 000000000..cbd17ad00 --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/no-name-clash/output.js @@ -0,0 +1,2 @@ +import { markAsPure } from 'not-swc-magic'; +markAsPure(console.log('test!')); diff --git a/packages/swc-magic/transform/tests/fixture/simple/output.js b/packages/swc-magic/transform/tests/fixture/simple/output.js new file mode 100644 index 000000000..764370a2b --- /dev/null +++ b/packages/swc-magic/transform/tests/fixture/simple/output.js @@ -0,0 +1 @@ +/*#__PURE__*/ console.log('test!'); From 8b9938f545b4406ade3c17e300e28cec580da53e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:15:40 -0700 Subject: [PATCH 26/47] lint --- packages/swc-magic/src/lib.rs | 6 +----- packages/swc-magic/transform/src/import_analyzer.rs | 4 ---- 2 files changed, 1 insertion(+), 9 deletions(-) diff --git a/packages/swc-magic/src/lib.rs b/packages/swc-magic/src/lib.rs index e651f3940..6d2ac561c 100644 --- a/packages/swc-magic/src/lib.rs +++ b/packages/swc-magic/src/lib.rs @@ -2,11 +2,7 @@ #![feature(box_patterns)] use swc_core::{ - common::{sync::Lrc, FileName, SourceMap}, - ecma::{ - ast::Program, - visit::{FoldWith, VisitMutWith}, - }, + ecma::{ast::Program, visit::VisitMutWith}, plugin::{ plugin_transform, proxies::{PluginCommentsProxy, TransformPluginProgramMetadata}, diff --git a/packages/swc-magic/transform/src/import_analyzer.rs b/packages/swc-magic/transform/src/import_analyzer.rs index 4c4902ea3..be4667100 100644 --- a/packages/swc-magic/transform/src/import_analyzer.rs +++ b/packages/swc-magic/transform/src/import_analyzer.rs @@ -14,10 +14,6 @@ pub(crate) struct ImportMap { } impl ImportMap { - pub fn is_module_imported(&mut self, module: &JsWord) -> bool { - self.imported_modules.contains(module) - } - /// Returns true if `e` is an import of `orig_name` from `module`. pub fn is_import(&self, e: &Expr, module: &str, orig_name: &str) -> bool { match e { From f0f909d53291307238d0cb1408243428dd217adf Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:13 -0700 Subject: [PATCH 27/47] Bump npm package: ./packages/constify --- packages/constify/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/constify/package.json b/packages/constify/package.json index 1e0b8f012..6bc56e251 100644 --- a/packages/constify/package.json +++ b/packages/constify/package.json @@ -1,6 +1,6 @@ { "name": "@swc/plugin-constify", - "version": "0.1.22", + "version": "0.1.23", "description": "SWC plugin for optimization", "main": "swc_plugin_constify.wasm", "scripts": { From 575d76966304c6a968523674fc78d0ed0a38b9d4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:13 -0700 Subject: [PATCH 28/47] Bump npm package: ./packages/emotion --- packages/emotion/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/emotion/package.json b/packages/emotion/package.json index 943a7bd9a..1463ad15b 100644 --- a/packages/emotion/package.json +++ b/packages/emotion/package.json @@ -1,6 +1,6 @@ { "name": "@swc/plugin-emotion", - "version": "2.5.92", + "version": "2.5.93", "description": "SWC plugin for emotion css-in-js library", "main": "swc_plugin_emotion.wasm", "scripts": { From 19c802097498024a54334b41ffcf07019482492a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:13 -0700 Subject: [PATCH 29/47] Bump npm package: ./packages/jest --- packages/jest/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/jest/package.json b/packages/jest/package.json index b76ad3f86..f126d3ae4 100644 --- a/packages/jest/package.json +++ b/packages/jest/package.json @@ -1,6 +1,6 @@ { "name": "@swc/plugin-jest", - "version": "1.5.92", + "version": "1.5.93", "description": "SWC plugin for jest", "main": "swc_plugin_jest.wasm", "scripts": { From 1a397fde1b42eb4bd4e83a4557c59a87bb6965a3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:13 -0700 Subject: [PATCH 30/47] Bump npm package: ./packages/loadable-components --- packages/loadable-components/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/loadable-components/package.json b/packages/loadable-components/package.json index 871c95ef9..ea6bfa09e 100644 --- a/packages/loadable-components/package.json +++ b/packages/loadable-components/package.json @@ -1,6 +1,6 @@ { "name": "@swc/plugin-loadable-components", - "version": "0.3.92", + "version": "0.3.93", "description": "SWC plugin for `@loadable/components`", "main": "swc_plugin_loadable_components.wasm", "scripts": { From 0463ea0ed3aee5a8d70b2e69213457e2f3941133 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:14 -0700 Subject: [PATCH 31/47] Bump npm package: ./packages/noop --- packages/noop/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/noop/package.json b/packages/noop/package.json index fc792bf0b..b4c881cd8 100644 --- a/packages/noop/package.json +++ b/packages/noop/package.json @@ -1,6 +1,6 @@ { "name": "@swc/plugin-noop", - "version": "1.5.90", + "version": "1.5.91", "description": "Noop SWC plugin, for debugging", "main": "swc_plugin_noop.wasm", "scripts": { From 52803d601d366740e9161dcf645aff37b93a8af2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:14 -0700 Subject: [PATCH 32/47] Bump npm package: ./packages/react-remove-properties --- packages/react-remove-properties/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-remove-properties/package.json b/packages/react-remove-properties/package.json index 6246f8476..14907ac21 100644 --- a/packages/react-remove-properties/package.json +++ b/packages/react-remove-properties/package.json @@ -1,6 +1,6 @@ { "name": "@swc/plugin-react-remove-properties", - "version": "1.5.92", + "version": "1.5.93", "description": "SWC plugin for https://www.npmjs.com/package/babel-plugin-react-remove-properties", "main": "swc_plugin_react_remove_properties.wasm", "scripts": { From e3cc02d11c603f66072f8042d949b2740e0bee9e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:14 -0700 Subject: [PATCH 33/47] Bump npm package: ./packages/relay --- packages/relay/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/relay/package.json b/packages/relay/package.json index 78f034149..20f7c7fde 100644 --- a/packages/relay/package.json +++ b/packages/relay/package.json @@ -1,6 +1,6 @@ { "name": "@swc/plugin-relay", - "version": "1.5.92", + "version": "1.5.93", "description": "SWC plugin for relay", "main": "swc_plugin_relay.wasm", "types": "./types.d.ts", From b1eabd94c222a7161fa25584e19c949617d3ab37 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:14 -0700 Subject: [PATCH 34/47] Bump npm package: ./packages/remove-console --- packages/remove-console/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/remove-console/package.json b/packages/remove-console/package.json index dab8c2050..ce166400f 100644 --- a/packages/remove-console/package.json +++ b/packages/remove-console/package.json @@ -1,6 +1,6 @@ { "name": "@swc/plugin-remove-console", - "version": "1.5.92", + "version": "1.5.93", "description": "SWC plugin for https://www.npmjs.com/package/babel-plugin-remove-console", "main": "swc_plugin_remove_console.wasm", "scripts": { From b8ed3cb770b3735f777d62e9e6def6a1437a3d73 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:14 -0700 Subject: [PATCH 35/47] Bump npm package: ./packages/styled-components --- packages/styled-components/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/styled-components/package.json b/packages/styled-components/package.json index 04fd6ac02..c4307bf8e 100644 --- a/packages/styled-components/package.json +++ b/packages/styled-components/package.json @@ -1,6 +1,6 @@ { "name": "@swc/plugin-styled-components", - "version": "1.5.92", + "version": "1.5.93", "description": "SWC plugin for styled-components", "main": "swc_plugin_styled_components.wasm", "scripts": { From 922ce67ed0a2c8d637bec1e86ecb72943d7cabc3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:15 -0700 Subject: [PATCH 36/47] Bump npm package: ./packages/styled-jsx --- packages/styled-jsx/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/styled-jsx/package.json b/packages/styled-jsx/package.json index 1a83d6ae4..47950b389 100644 --- a/packages/styled-jsx/package.json +++ b/packages/styled-jsx/package.json @@ -1,6 +1,6 @@ { "name": "@swc/plugin-styled-jsx", - "version": "1.5.92", + "version": "1.5.93", "description": "SWC plugin for styled-jsx", "main": "swc_plugin_styled_jsx.wasm", "scripts": { From 33b39f099dc0fa919bd5ad7694835b33234ad6a8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:15 -0700 Subject: [PATCH 37/47] Bump npm package: ./packages/swc-magic --- packages/swc-magic/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/swc-magic/package.json b/packages/swc-magic/package.json index 0174aef72..5d3de3942 100644 --- a/packages/swc-magic/package.json +++ b/packages/swc-magic/package.json @@ -1,6 +1,6 @@ { "name": "@swc/plugin-swc-magic", - "version": "1.5.92", + "version": "1.5.93", "description": "SWC plugin for swc-magic", "main": "swc_plugin_swc_magic.wasm", "scripts": { From e0918883d8c55eb9de8c9b8e6ca32270464a281a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:15 -0700 Subject: [PATCH 38/47] Bump npm package: ./packages/transform-imports --- packages/transform-imports/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/transform-imports/package.json b/packages/transform-imports/package.json index 47e1f39cb..ba4a7c701 100644 --- a/packages/transform-imports/package.json +++ b/packages/transform-imports/package.json @@ -1,6 +1,6 @@ { "name": "@swc/plugin-transform-imports", - "version": "1.5.92", + "version": "1.5.93", "description": "SWC plugin for https://www.npmjs.com/package/babel-plugin-transform-imports", "main": "swc_plugin_transform_imports.wasm", "scripts": { From 31302e1ffbc6f5abc79858161ac402fca08ebc24 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:16 -0700 Subject: [PATCH 39/47] Bump cargo crate: modularize_imports --- Cargo.lock | 2 +- packages/transform-imports/transform/Cargo.toml | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/Cargo.lock b/Cargo.lock index 421653779..c1a636081 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -1166,7 +1166,7 @@ dependencies = [ [[package]] name = "modularize_imports" -version = "0.50.0" +version = "0.51.0" dependencies = [ "convert_case", "handlebars", diff --git a/packages/transform-imports/transform/Cargo.toml b/packages/transform-imports/transform/Cargo.toml index 8947ae7eb..15d92698e 100644 --- a/packages/transform-imports/transform/Cargo.toml +++ b/packages/transform-imports/transform/Cargo.toml @@ -5,7 +5,7 @@ edition = "2021" license = "Apache-2.0" name = "modularize_imports" repository = "https://github.com/swc-project/plugins.git" -version = "0.50.0" +version = "0.51.0" # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html From 6b183799c8c352c2da65b3f2c6c4c67833491189 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:17 -0700 Subject: [PATCH 40/47] Bump cargo crate: react_remove_properties --- Cargo.lock | 2 +- packages/react-remove-properties/transform/Cargo.toml | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/Cargo.lock b/Cargo.lock index c1a636081..da5f8649b 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -1668,7 +1668,7 @@ dependencies = [ [[package]] name = "react_remove_properties" -version = "0.5.0" +version = "0.6.0" dependencies = [ "serde", "swc_atoms", diff --git a/packages/react-remove-properties/transform/Cargo.toml b/packages/react-remove-properties/transform/Cargo.toml index 7421a5372..6764088b0 100644 --- a/packages/react-remove-properties/transform/Cargo.toml +++ b/packages/react-remove-properties/transform/Cargo.toml @@ -5,7 +5,7 @@ edition = "2021" license = "Apache-2.0" name = "react_remove_properties" repository = "https://github.com/swc-project/plugins.git" -version = "0.5.0" +version = "0.6.0" # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html From 9c64fe36b85b0f3f788137d4bfbacd284ce3ee38 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:18 -0700 Subject: [PATCH 41/47] Bump cargo crate: remove_console --- Cargo.lock | 2 +- packages/remove-console/transform/Cargo.toml | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/Cargo.lock b/Cargo.lock index da5f8649b..ae8da38de 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -1743,7 +1743,7 @@ checksum = "c707298afce11da2efef2f600116fa93ffa7a032b5d7b628aa17711ec81383ca" [[package]] name = "remove_console" -version = "0.6.0" +version = "0.7.0" dependencies = [ "serde", "swc_atoms", diff --git a/packages/remove-console/transform/Cargo.toml b/packages/remove-console/transform/Cargo.toml index 0a6a9112d..d19901a85 100644 --- a/packages/remove-console/transform/Cargo.toml +++ b/packages/remove-console/transform/Cargo.toml @@ -5,7 +5,7 @@ edition = "2021" license = "Apache-2.0" name = "remove_console" repository = "https://github.com/swc-project/plugins.git" -version = "0.6.0" +version = "0.7.0" # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html From 8972e22d990e6dee4b5ea64f11495739562baa80 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:19 -0700 Subject: [PATCH 42/47] Bump cargo crate: styled_components --- Cargo.lock | 2 +- packages/styled-components/transform/Cargo.toml | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/Cargo.lock b/Cargo.lock index ae8da38de..229f24ab9 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -2136,7 +2136,7 @@ checksum = "73473c0e59e6d5812c5dfe2a064a6444949f089e20eec9a2e5506596494e4623" [[package]] name = "styled_components" -version = "0.77.0" +version = "0.78.0" dependencies = [ "Inflector", "once_cell", diff --git a/packages/styled-components/transform/Cargo.toml b/packages/styled-components/transform/Cargo.toml index 48c0aae30..fedef5eec 100644 --- a/packages/styled-components/transform/Cargo.toml +++ b/packages/styled-components/transform/Cargo.toml @@ -6,7 +6,7 @@ include = ["Cargo.toml", "src/**/*.rs"] license = "Apache-2.0" name = "styled_components" repository = "https://github.com/swc-project/plugins.git" -version = "0.77.0" +version = "0.78.0" # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html From a76c0db1a28806ee024379a0a44f90591e352860 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:19 -0700 Subject: [PATCH 43/47] Bump cargo crate: styled_jsx --- Cargo.lock | 2 +- packages/styled-jsx/transform/Cargo.toml | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/Cargo.lock b/Cargo.lock index 229f24ab9..0c5ba37e6 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -2157,7 +2157,7 @@ dependencies = [ [[package]] name = "styled_jsx" -version = "0.54.0" +version = "0.55.0" dependencies = [ "easy-error", "lightningcss", diff --git a/packages/styled-jsx/transform/Cargo.toml b/packages/styled-jsx/transform/Cargo.toml index 9c753f4f8..9da1c914d 100644 --- a/packages/styled-jsx/transform/Cargo.toml +++ b/packages/styled-jsx/transform/Cargo.toml @@ -4,7 +4,7 @@ description = "AST transforms visitor for styled-jsx" edition = "2021" license = "Apache-2.0" name = "styled_jsx" -version = "0.54.0" +version = "0.55.0" [features] custom_transform = ["swc_common/concurrent"] From 070937c5fd774d7b403456a08165e0fe78005d20 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:20 -0700 Subject: [PATCH 44/47] Bump cargo crate: swc_constify --- Cargo.lock | 2 +- packages/constify/transform/Cargo.toml | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/Cargo.lock b/Cargo.lock index 0c5ba37e6..5609c4dfe 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -2300,7 +2300,7 @@ dependencies = [ [[package]] name = "swc_constify" -version = "0.17.0" +version = "0.18.0" dependencies = [ "once_cell", "rustc-hash", diff --git a/packages/constify/transform/Cargo.toml b/packages/constify/transform/Cargo.toml index 95365b188..dd9532a79 100644 --- a/packages/constify/transform/Cargo.toml +++ b/packages/constify/transform/Cargo.toml @@ -5,7 +5,7 @@ edition = "2021" license = "Apache-2.0" name = "swc_constify" repository = "https://github.com/swc-project/plugins.git" -version = "0.17.0" +version = "0.18.0" # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html From c975e85a170d71728b49a7ffd758fde7b50ca264 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:21 -0700 Subject: [PATCH 45/47] Bump cargo crate: swc_emotion --- Cargo.lock | 2 +- packages/emotion/transform/Cargo.toml | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/Cargo.lock b/Cargo.lock index 5609c4dfe..763de8547 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -2762,7 +2762,7 @@ dependencies = [ [[package]] name = "swc_emotion" -version = "0.53.0" +version = "0.54.0" dependencies = [ "base64", "byteorder", diff --git a/packages/emotion/transform/Cargo.toml b/packages/emotion/transform/Cargo.toml index ad0d558f4..70da1bfdd 100644 --- a/packages/emotion/transform/Cargo.toml +++ b/packages/emotion/transform/Cargo.toml @@ -5,7 +5,7 @@ edition = "2021" license = "Apache-2.0" name = "swc_emotion" repository = "https://github.com/swc-project/plugins.git" -version = "0.53.0" +version = "0.54.0" # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html From 6404a5ec953da05df99e26811b4a717c4f7f0fb3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:16:31 -0700 Subject: [PATCH 46/47] Bump cargo crate: swc_relay --- Cargo.lock | 2 +- packages/relay/transform/Cargo.toml | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/Cargo.lock b/Cargo.lock index 763de8547..ba5d1c620 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -3075,7 +3075,7 @@ dependencies = [ [[package]] name = "swc_relay" -version = "0.25.0" +version = "0.26.0" dependencies = [ "once_cell", "regex", diff --git a/packages/relay/transform/Cargo.toml b/packages/relay/transform/Cargo.toml index 8cf4132d4..f5c470844 100644 --- a/packages/relay/transform/Cargo.toml +++ b/packages/relay/transform/Cargo.toml @@ -5,7 +5,7 @@ edition = "2021" license = "Apache-2.0" name = "swc_relay" repository = "https://github.com/swc-project/plugins.git" -version = "0.25.0" +version = "0.26.0" # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html From 1c5569dce62a1ee346c25435774aa1472f3f9c67 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EB=8F=99=EC=9C=A4=20=28Donny=29?= Date: Tue, 24 Oct 2023 09:18:35 -0700 Subject: [PATCH 47/47] doc --- packages/swc-magic/README.md | 21 +++++++++++++++++++++ packages/swc-magic/transform/src/lib.rs | 5 +++++ 2 files changed, 26 insertions(+) create mode 100644 packages/swc-magic/README.md diff --git a/packages/swc-magic/README.md b/packages/swc-magic/README.md new file mode 100644 index 000000000..6954bb4ab --- /dev/null +++ b/packages/swc-magic/README.md @@ -0,0 +1,21 @@ +# @swc/plugin-swc-magic + +## Usage + +.swcrc: + +```json +{ + "jsc": { + "experimental": { + "plugins": ["@swc/plugin-swc-magic"] + } + } +} +``` + +```js +import { markAsPure } from "@swc/magic"; + +markAsPure(() => console.log("This will be removed by the SWC minifier")); +``` diff --git a/packages/swc-magic/transform/src/lib.rs b/packages/swc-magic/transform/src/lib.rs index 2f0f8d5f1..e28bd4d05 100644 --- a/packages/swc-magic/transform/src/lib.rs +++ b/packages/swc-magic/transform/src/lib.rs @@ -13,9 +13,14 @@ mod import_analyzer; #[derive(Debug, Clone, Deserialize)] pub struct Config { + #[serde(default = "default_import_path")] pub import_path: Atom, } +fn default_import_path() -> Atom { + Atom::from("@swc/magic") +} + impl Config {} pub fn swc_magic(_unreolved_mark: Mark, config: Config, comments: C) -> impl VisitMut