diff --git a/.github/workflows/build_test_deploy.yml b/.github/workflows/build_test_deploy.yml index ff748b463394..bf9b28cf3a04 100644 --- a/.github/workflows/build_test_deploy.yml +++ b/.github/workflows/build_test_deploy.yml @@ -97,7 +97,7 @@ jobs: if: ${{needs.build.outputs.docsChange != 'docs only change'}} with: profile: minimal - toolchain: nightly-2021-11-15 + toolchain: nightly-2022-02-23 components: rustfmt, clippy - name: Cache cargo registry @@ -732,7 +732,7 @@ jobs: if: ${{ steps.docs-change.outputs.DOCS_CHANGE != 'docs only change' }} with: profile: minimal - toolchain: nightly-2021-11-15 + toolchain: nightly-2022-02-23 - name: Cache cargo registry uses: actions/cache@v2 @@ -811,7 +811,7 @@ jobs: if: ${{ steps.docs-change.outputs.DOCS_CHANGE != 'docs only change' }} uses: actions-rs/toolchain@v1 with: - toolchain: nightly-2021-11-15 + toolchain: nightly-2022-02-23 profile: minimal - run: cd packages/next-swc && cargo test if: ${{ steps.docs-change.outputs.DOCS_CHANGE != 'docs only change' }} @@ -889,8 +889,8 @@ jobs: # Node.js in Baidu need to compatible with `GLIBC_2.12` build: >- set -e && - rustup toolchain install nightly-2021-11-15 && - rustup default nightly-2021-11-15 && + rustup toolchain install nightly-2022-02-23 && + rustup default nightly-2022-02-23 && rustup target add x86_64-unknown-linux-gnu && npm i -g @napi-rs/cli@2.4.4 turbo@1.0.28 && turbo run build-native --cache-dir=".turbo" -- --release --target x86_64-unknown-linux-gnu --zig --zig-abi-suffix 2.12 && @@ -900,8 +900,8 @@ jobs: docker: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-alpine build: >- set -e && - rustup toolchain install nightly-2021-11-15 && - rustup default nightly-2021-11-15 && + rustup toolchain install nightly-2022-02-23 && + rustup default nightly-2022-02-23 && rustup target add x86_64-unknown-linux-musl && npm i -g @napi-rs/cli@2.4.4 turbo@1.0.28 && turbo run build-native --cache-dir=".turbo" -- --release --target x86_64-unknown-linux-musl && @@ -922,8 +922,8 @@ jobs: docker: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-alpine-zig build: >- set -e && - rustup toolchain install nightly-2021-11-15 && - rustup default nightly-2021-11-15 && + rustup toolchain install nightly-2022-02-23 && + rustup default nightly-2022-02-23 && rustup target add aarch64-unknown-linux-gnu && npm i -g @napi-rs/cli@2.4.4 turbo@1.0.28 && turbo run build-native --cache-dir=".turbo" -- --release --target aarch64-unknown-linux-gnu --zig --zig-abi-suffix 2.12 && @@ -963,8 +963,8 @@ jobs: build: >- set -e && npm i -g @napi-rs/cli@2.4.4 turbo@1.0.28 && - rustup toolchain install nightly-2021-11-15 && - rustup default nightly-2021-11-15 && + rustup toolchain install nightly-2022-02-23 && + rustup default nightly-2022-02-23 && rustup target add aarch64-unknown-linux-musl && turbo run build-native --cache-dir=".turbo" -- --release --target aarch64-unknown-linux-musl && llvm-strip -x packages/next-swc/native/next-swc.*.node @@ -1030,7 +1030,7 @@ jobs: with: profile: minimal override: true - toolchain: nightly-2021-11-15 + toolchain: nightly-2022-02-23 target: ${{ matrix.settings.target }} - name: Cache cargo registry @@ -1092,7 +1092,7 @@ jobs: uses: actions-rs/toolchain@v1 with: profile: minimal - toolchain: nightly-2021-11-15 + toolchain: nightly-2022-02-23 override: true target: wasm32-unknown-unknown @@ -1148,7 +1148,7 @@ jobs: uses: actions-rs/toolchain@v1 with: profile: minimal - toolchain: nightly-2021-11-15 + toolchain: nightly-2022-02-23 override: true target: wasm32-unknown-unknown diff --git a/docs/advanced-features/compiler.md b/docs/advanced-features/compiler.md index 439474fa11f3..16d415a0a11d 100644 --- a/docs/advanced-features/compiler.md +++ b/docs/advanced-features/compiler.md @@ -189,6 +189,36 @@ First, update to the latest version of Next.js: `npm install next@latest`. Then, ## Experimental Features +### Emotion + +We're working to port `@emotion/babel-plugin` to the Next.js Compiler. + +First, update to the latest version of Next.js: `npm install next@latest`. Then, update your `next.config.js` file: + +```js +// next.config.js + +module.exports = { + experimental: { + emotion: boolean | { + // default is true. It will be disabled when build type is production. + sourceMap?: boolean, + // default is 'dev-only'. + autoLabel?: 'never' | 'dev-only' | 'always', + // default is '[local]'. + // Allowed values: `[local]` `[filename]` and `[dirname]` + // This option only works when autoLabel is set to 'dev-only' or 'always'. + // It allows you to define the format of the resulting label. + // The format is defined via string where variable parts are enclosed in square brackets []. + // For example labelFormat: "my-classname--[local]", where [local] will be replaced with the name of the variable the result is assigned to. + labelFormat?: string, + }, + }, +} +``` + +Only `importMap` in `@emotion/babel-plugin` is not supported for now. + ### Minification You can opt-in to using the Next.js compiler for minification. This is 7x faster than Terser. diff --git a/examples/with-emotion-swc/.gitignore b/examples/with-emotion-swc/.gitignore new file mode 100644 index 000000000000..1437c53f70bc --- /dev/null +++ b/examples/with-emotion-swc/.gitignore @@ -0,0 +1,34 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.js + +# testing +/coverage + +# next.js +/.next/ +/out/ + +# production +/build + +# misc +.DS_Store +*.pem + +# debug +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# local env files +.env.local +.env.development.local +.env.test.local +.env.production.local + +# vercel +.vercel diff --git a/examples/with-emotion-swc/README.md b/examples/with-emotion-swc/README.md new file mode 100644 index 000000000000..12b4f677a8d0 --- /dev/null +++ b/examples/with-emotion-swc/README.md @@ -0,0 +1,31 @@ +# Emotion Example + +Extract and inline critical css with +[@emotion/css](https://github.com/emotion-js/emotion/tree/master/packages/css), +[@emotion/server](https://github.com/emotion-js/emotion/tree/master/packages/server), +[@emotion/react](https://github.com/emotion-js/emotion/tree/master/packages/react), +and [@emotion/styled](https://github.com/emotion-js/emotion/tree/master/packages/styled). + +## Preview + +Preview the example live on [StackBlitz](http://stackblitz.com/): + +[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/vercel/next.js/tree/canary/examples/with-emotion) + +## Deploy your own + +Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_medium=readme&utm_campaign=next-example): + +[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/git/external?repository-url=https://github.com/vercel/next.js/tree/canary/examples/with-emotion&project-name=with-emotion&repository-name=with-emotion) + +## How to use + +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example: + +```bash +npx create-next-app --example with-emotion with-emotion-app +# or +yarn create next-app --example with-emotion with-emotion-app +``` + +Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)). diff --git a/examples/with-emotion-swc/next.config.js b/examples/with-emotion-swc/next.config.js new file mode 100644 index 000000000000..0928286e81ee --- /dev/null +++ b/examples/with-emotion-swc/next.config.js @@ -0,0 +1,10 @@ +/** @type {import('next').NextConfig} */ + +const nextConfig = { + reactStrictMode: true, + experimental: { + emotion: true, + }, +} + +module.exports = nextConfig diff --git a/examples/with-emotion-swc/package.json b/examples/with-emotion-swc/package.json new file mode 100644 index 000000000000..411e3fcb8efb --- /dev/null +++ b/examples/with-emotion-swc/package.json @@ -0,0 +1,15 @@ +{ + "private": true, + "scripts": { + "dev": "next", + "build": "next build", + "start": "next start" + }, + "dependencies": { + "@emotion/react": "11.8.1", + "@emotion/styled": "11.8.1", + "next": "latest", + "react": "17.0.2", + "react-dom": "17.0.2" + } +} diff --git a/examples/with-emotion-swc/pages/_app.js b/examples/with-emotion-swc/pages/_app.js new file mode 100644 index 000000000000..0fe238a5d232 --- /dev/null +++ b/examples/with-emotion-swc/pages/_app.js @@ -0,0 +1,15 @@ +import createCache from '@emotion/cache' +import { CacheProvider } from '@emotion/react' + +import { globalStyles } from '../shared/styles' + +const cache = createCache({ key: 'next' }) + +const App = ({ Component, pageProps }) => ( + + {globalStyles} + + +) + +export default App diff --git a/examples/with-emotion-swc/pages/index.js b/examples/with-emotion-swc/pages/index.js new file mode 100644 index 000000000000..481abe91b200 --- /dev/null +++ b/examples/with-emotion-swc/pages/index.js @@ -0,0 +1,20 @@ +import { css } from '@emotion/react' +import { Animated, Basic, bounce, Combined, Pink } from '../shared/styles' + +const Home = () => ( +
+ Cool Styles + Pink text + + With :hover. + + Let's bounce. +
+) + +export default Home diff --git a/examples/with-emotion-swc/shared/styles.js b/examples/with-emotion-swc/shared/styles.js new file mode 100644 index 000000000000..cb9720bbfeba --- /dev/null +++ b/examples/with-emotion-swc/shared/styles.js @@ -0,0 +1,72 @@ +import { css, Global, keyframes } from '@emotion/react' +import styled from '@emotion/styled' + +export const globalStyles = ( + +) + +export const basicStyles = css({ + backgroundColor: 'white', + color: 'cornflowerblue', + border: '1px solid lightgreen', + borderRight: 'none', + borderBottom: 'none', + boxShadow: '5px 5px 0 0 lightgreen, 10px 10px 0 0 lightyellow', + transition: 'all 0.1s linear', + margin: '3rem 0', + padding: '1rem 0.5rem', +}) + +export const hoverStyles = css` + &:hover { + color: white; + background-color: lightgray; + border-color: aqua; + box-shadow: -15px -15px 0 0 aqua, -30px -30px 0 0 cornflowerblue; + } +` +export const bounce = keyframes` + from { + transform: scale(1.01); + } + to { + transform: scale(0.99); + } +` + +export const Basic = styled.div` + ${basicStyles}; +` + +export const Combined = styled.div` + ${basicStyles}; + ${hoverStyles}; + & code { + background-color: linen; + } +` + +export const Pink = styled.div(basicStyles, { + color: 'hotpink', +}) + +export const Animated = styled.div` + ${basicStyles}; + ${hoverStyles}; + & code { + background-color: linen; + } + animation: ${({ animation }) => animation} 0.2s infinite ease-in-out alternate; +` diff --git a/packages/next-swc/Cargo.lock b/packages/next-swc/Cargo.lock index 9a9f4e4904ed..e42eee1bc7c0 100644 --- a/packages/next-swc/Cargo.lock +++ b/packages/next-swc/Cargo.lock @@ -33,7 +33,7 @@ version = "0.7.6" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "fcb51a0695d8f838b1ee009b3fbf66bda078cd64590202a864a8f3e8c4315c47" dependencies = [ - "getrandom 0.2.3", + "getrandom 0.2.5", "once_cell", "serde", "version_check", @@ -114,15 +114,15 @@ dependencies = [ [[package]] name = "autocfg" -version = "1.0.1" +version = "1.1.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "cdb031dd78e28731d87d56cc8ffef4a8f36ca26c38fe2de700543e627f8a464a" +checksum = "d468802bab17cbc0cc575e9b053f41e72aa36bfa6b7f55e3529ffa43161b97fa" [[package]] name = "backtrace" -version = "0.3.63" +version = "0.3.64" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "321629d8ba6513061f26707241fa9bc89524ff1cd7a915a97ef0c62c666ce1b6" +checksum = "5e121dee8023ce33ab248d9ce1493df03c3b38a659b240096fcbd7048ff9c31f" dependencies = [ "addr2line", "cc", @@ -162,18 +162,18 @@ checksum = "bef38d45163c2f1dde094a7dfd33ccf595c92905c8f8f4fdc18d06fb1037718a" [[package]] name = "block-buffer" -version = "0.9.0" +version = "0.10.2" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "4152116fd6e9dadb291ae18fc1ec3575ed6d84c29642d97890f4b4a3417297e4" +checksum = "0bf7fe51849ea569fd452f37822f606a5cabb684dc918707a0193fd4664ff324" dependencies = [ "generic-array", ] [[package]] name = "browserslist-rs" -version = "0.8.0" +version = "0.9.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "67bf6eb040d26861376afa30a5b172f066bfda9cef992af7a55ac5395ef91437" +checksum = "a0f43be8e0fc9203f6ed7731d2a9a6bf5924cb78907e67e1fe9133617be402be" dependencies = [ "ahash", "anyhow", @@ -193,17 +193,11 @@ dependencies = [ "wasm-bindgen", ] -[[package]] -name = "build_const" -version = "0.2.2" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "b4ae4235e6dac0694637c763029ecea1a2ec9e4e06ec2729bd21ba4d9c863eb7" - [[package]] name = "bumpalo" -version = "3.8.0" +version = "3.9.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "8f1e260c3a9040a7c19a12468758f4c16f31a81a1fe087482be9570ec864bb6c" +checksum = "a4a45a46ab1f2412e53d3a0ade76ffad2025804294569aae387231a0cd6e0899" [[package]] name = "byteorder" @@ -213,9 +207,9 @@ checksum = "14c189c53d098945499cdfa7ecc63567cf3886b3332b312a5b4585d8d3a6a610" [[package]] name = "cc" -version = "1.0.72" +version = "1.0.73" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "22a9137b95ea06864e018375b72adfb7db6e6f68cfc8df5a04d00288050485ee" +checksum = "2fff2a6927b3bb87f9595d67196a70493f627687a71d87a0d692242c33f58c11" [[package]] name = "cfg-if" @@ -274,18 +268,24 @@ dependencies = [ [[package]] name = "crc" -version = "1.8.1" +version = "2.1.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "d663548de7f5cca343f1e0a48d14dcfb0e9eb4e079ec58883b7251539fa10aeb" +checksum = "49fc9a695bca7f35f5f4c15cddc84415f66a74ea78eef08e90c5024f2b540e23" dependencies = [ - "build_const", + "crc-catalog", ] +[[package]] +name = "crc-catalog" +version = "1.1.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "ccaeedb56da03b09f598226e25e80088cb4cd25f316e6e4df7d695f0feeb1403" + [[package]] name = "crossbeam-channel" -version = "0.5.1" +version = "0.5.2" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "06ed27e177f16d65f0f0c22a213e17c696ace5dd64b14258b52f9417ccb52db4" +checksum = "e54ea8bc3fb1ee042f5aace6e3c6e025d3874866da222930f70ce62aceba0bfa" dependencies = [ "cfg-if 1.0.0", "crossbeam-utils", @@ -304,9 +304,9 @@ dependencies = [ [[package]] name = "crossbeam-epoch" -version = "0.9.5" +version = "0.9.7" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "4ec02e091aa634e2c3ada4a392989e7c3116673ef0ac5b72232439094d73b7fd" +checksum = "c00d6d2ea26e8b151d99093005cb442fb9a37aeaca582a03ec70946f49ab5ed9" dependencies = [ "cfg-if 1.0.0", "crossbeam-utils", @@ -317,14 +317,24 @@ dependencies = [ [[package]] name = "crossbeam-utils" -version = "0.8.5" +version = "0.8.7" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "d82cfc11ce7f2c3faef78d8a684447b40d503d9681acebed6cb728d45940c4db" +checksum = "b5e5bed1f1c269533fa816a0a5492b3545209a205ca1a54842be180eb63a16a6" dependencies = [ "cfg-if 1.0.0", "lazy_static", ] +[[package]] +name = "crypto-common" +version = "0.1.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "57952ca27b5e3606ff4dd79b0020231aaf9d6aa76dc05fd30137538c50bd3ce8" +dependencies = [ + "generic-array", + "typenum", +] + [[package]] name = "ctor" version = "0.1.20" @@ -420,11 +430,12 @@ checksum = "524cbf6897b527295dff137cec09ecf3a05f4fddffd7dfcd1585403449e74198" [[package]] name = "digest" -version = "0.9.0" +version = "0.10.3" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "d3dd60d1080a57a05ab032377049e0591415d2b31afd7028356dbf3cc6dcb066" +checksum = "f2fb860ca6fafa5552fb6d0e816a69c8e49f0908bf524e30a90d97c85892d506" dependencies = [ - "generic-array", + "block-buffer", + "crypto-common", ] [[package]] @@ -451,11 +462,20 @@ dependencies = [ "syn", ] +[[package]] +name = "fastrand" +version = "1.7.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "c3fcf0cee53519c866c09b5de1f6c56ff9d647101f81c1964fa632e148896cdf" +dependencies = [ + "instant", +] + [[package]] name = "fixedbitset" -version = "0.2.0" +version = "0.4.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "37ab347416e802de484e4d03c7316c48f1ecb56574dfd4a46a80f173ce1de04d" +checksum = "279fb028e20b3c4c320317955b77c5e0c9701f05a1d309905d6fc702cdc5053e" [[package]] name = "fnv" @@ -496,9 +516,9 @@ dependencies = [ [[package]] name = "generic-array" -version = "0.14.4" +version = "0.14.5" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "501466ecc8a30d1d3b7fc9229b122b2ce8ed6e9d9223f1138d4babb253e51817" +checksum = "fd48d33ec7f05fbfa152300fdad764757cbded343c1aa1cff2fbaf4134851803" dependencies = [ "typenum", "version_check", @@ -517,9 +537,9 @@ dependencies = [ [[package]] name = "getrandom" -version = "0.2.3" +version = "0.2.5" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "7fcd999463524c52659517fe2cea98493cfe485d10565e7b0fb07dbba7ad2753" +checksum = "d39cd93900197114fa1fcb7ae84ca742095eed9442088988ae74fa744e930e77" dependencies = [ "cfg-if 1.0.0", "libc", @@ -621,18 +641,18 @@ dependencies = [ [[package]] name = "itertools" -version = "0.10.1" +version = "0.10.3" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "69ddb889f9d0d08a67338271fa9b62996bc788c7796a5c18cf057420aaed5eaf" +checksum = "a9a9d19fa1e79b6215ff29b9d6880b706147f16e9b1dbb1e4e5947b5b02bc5e3" dependencies = [ "either", ] [[package]] name = "itoa" -version = "0.4.8" +version = "1.0.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "b71991ff56294aa922b450139ee08b3bfc70982c6b2c7562771375cf73542dd4" +checksum = "1aab8fc367588b89dcee83ab0fd66b72b50b72fa1904d7095045ace2b0c81c35" [[package]] name = "js-sys" @@ -651,32 +671,82 @@ checksum = "e2abad23fbc42b3700f2f279844dc832adb2b2eb069b2df918f455c4e18cc646" [[package]] name = "lexical" -version = "5.2.2" +version = "6.1.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "f404a90a744e32e8be729034fc33b90cf2a56418fbf594d69aa3c0214ad414e5" +checksum = "ccd3e434c16f0164124ade12dcdee324fcc3dafb1cad0c7f1d8c2451a1aa6886" dependencies = [ - "cfg-if 1.0.0", "lexical-core", ] [[package]] name = "lexical-core" -version = "0.7.6" +version = "0.8.3" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "6607c62aa161d23d17a9072cc5da0be67cdfc89d3afb1e8d9c842bebc2525ffe" +checksum = "92912c4af2e7d9075be3e5e3122c4d7263855fa6cce34fbece4dd08e5884624d" dependencies = [ - "arrayvec 0.5.2", - "bitflags", - "cfg-if 1.0.0", - "ryu", + "lexical-parse-float", + "lexical-parse-integer", + "lexical-util", + "lexical-write-float", + "lexical-write-integer", +] + +[[package]] +name = "lexical-parse-float" +version = "0.8.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "f518eed87c3be6debe6d26b855c97358d8a11bf05acec137e5f53080f5ad2dd8" +dependencies = [ + "lexical-parse-integer", + "lexical-util", + "static_assertions", +] + +[[package]] +name = "lexical-parse-integer" +version = "0.8.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "afc852ec67c6538bbb2b9911116a385b24510e879a69ab516e6a151b15a79168" +dependencies = [ + "lexical-util", + "static_assertions", +] + +[[package]] +name = "lexical-util" +version = "0.8.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "c72a9d52c5c4e62fa2cdc2cb6c694a39ae1382d9c2a17a466f18e272a0930eb1" +dependencies = [ + "static_assertions", +] + +[[package]] +name = "lexical-write-float" +version = "0.8.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "26f6202bff3d35ede41a6200227837468bb92e4ecdd437328b1055ed218fb855" +dependencies = [ + "lexical-util", + "lexical-write-integer", + "static_assertions", +] + +[[package]] +name = "lexical-write-integer" +version = "0.8.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "094060bd2a7c2ff3a16d5304a6ae82727cb3cc9d1c70f813cc73f744c319337e" +dependencies = [ + "lexical-util", "static_assertions", ] [[package]] name = "libc" -version = "0.2.108" +version = "0.2.119" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "8521a1b57e76b1ec69af7599e75e38e7b7fad6610f037db8c79b127201b5d119" +checksum = "1bf2e165bb3457c8e098ea76f3e3bc9db55f87aa90d52d0e6be741470916aaa4" [[package]] name = "lock_api" @@ -698,9 +768,9 @@ dependencies = [ [[package]] name = "lru" -version = "0.7.2" +version = "0.7.3" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "274353858935c992b13c0ca408752e2121da852d07dec7ce5f108c77dfa14d1f" +checksum = "fcb87f3080f6d1d69e8c564c0fcfde1d7aa8cc451ce40cae89479111f03bc0eb" dependencies = [ "hashbrown", ] @@ -728,9 +798,9 @@ checksum = "308cc39be01b73d0d18f82a0e7b2a3df85245f84af96fdddc5d202d27e47b86a" [[package]] name = "memoffset" -version = "0.6.4" +version = "0.6.5" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "59accc507f1338036a0477ef61afdae33cde60840f4dfe481319ce3ad116ddf9" +checksum = "5aa361d4faea93603064a027415f07bd8e1d5c88c9fbf68bf56a285428fd79ce" dependencies = [ "autocfg", ] @@ -785,9 +855,9 @@ dependencies = [ [[package]] name = "napi-build" -version = "1.1.2" +version = "1.2.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "d46af3cd13ef452354c8704da88bfc4bfa38724ddb38963a5113099749710788" +checksum = "ebd4419172727423cf30351406c54f6cc1b354a2cfb4f1dba3e6cd07f6d5522b" [[package]] name = "napi-derive" @@ -816,12 +886,15 @@ checksum = "e4a24736216ec316047a1fc4252e27dabb04218aa4a3f37c6e7ddbf1f9782b54" name = "next-swc" version = "0.0.0" dependencies = [ + "base64 0.13.0", + "byteorder", "chrono", "easy-error", "either", "fxhash", "once_cell", "pathdiff", + "radix_fmt", "regex", "serde", "serde_json", @@ -832,7 +905,7 @@ dependencies = [ "swc_css", "swc_ecma_loader", "swc_ecma_transforms_testing", - "swc_ecmascript 0.130.0", + "swc_ecmascript", "swc_node_base", "swc_stylis", "testing", @@ -859,7 +932,7 @@ dependencies = [ "swc_bundler", "swc_common", "swc_ecma_loader", - "swc_ecmascript 0.130.0", + "swc_ecmascript", "swc_node_base", ] @@ -885,9 +958,9 @@ dependencies = [ [[package]] name = "num-bigint" -version = "0.2.6" +version = "0.4.3" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "090c7f9998ee0ff65aa5b723e4009f7b217707f1fb5ea551329cc4d6231fb304" +checksum = "f93ab6289c7b344a8a9f60f88d80aa20032336fe78da341afc91c8a2341fc75f" dependencies = [ "autocfg", "num-integer", @@ -935,30 +1008,24 @@ dependencies = [ [[package]] name = "once_cell" -version = "1.9.0" +version = "1.10.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "da32515d9f6e6e489d7bc9d84c71b060db7247dc035bbe44eac88cf87486d8d5" - -[[package]] -name = "opaque-debug" -version = "0.3.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "624a8340c38c1b80fd549087862da4ba43e08858af025b236e509b6649fc13d5" +checksum = "87f3e037eac156d1775da914196f0f37741a274155e34a0b7e427c35d2a2ecb9" [[package]] name = "ordered-float" -version = "2.8.0" +version = "2.10.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "97c9d06878b3a851e8026ef94bf7fef9ba93062cd412601da4d9cf369b1cc62d" +checksum = "7940cf2ca942593318d07fcf2596cdca60a85c9e7fab408a5e21a4f9dcd40d87" dependencies = [ "num-traits", ] [[package]] name = "output_vt100" -version = "0.1.2" +version = "0.1.3" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "53cdc5b785b7a58c5aad8216b3dfa114df64b0b06ae6e1501cef91df2fbdf8f9" +checksum = "628223faebab4e3e40667ee0b2336d34a5b960ff60ea743ddfdbcf7770bcfb66" dependencies = [ "winapi", ] @@ -1007,7 +1074,7 @@ checksum = "28141e0cc4143da2443301914478dc976a61ffdb3f043058310c70df2fed8954" dependencies = [ "cfg-if 1.0.0", "libc", - "redox_syscall 0.2.10", + "redox_syscall 0.2.11", "smallvec", "windows-sys", ] @@ -1032,9 +1099,9 @@ checksum = "d4fd5641d01c8f18a23da7b6fe29298ff4b55afcccdf78973b24cf3175fee32e" [[package]] name = "petgraph" -version = "0.5.1" +version = "0.6.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "467d164a6de56270bd7c4d070df81d07beace25012d5103ced4e9ff08d6afdb7" +checksum = "4a13a2fa9d0b63e5f22328828741e523766fff0ee9e779316902290dff3f824f" dependencies = [ "fixedbitset", "indexmap", @@ -1042,12 +1109,12 @@ dependencies = [ [[package]] name = "phf" -version = "0.8.0" +version = "0.10.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "3dfb61232e34fcb633f43d12c58f83c1df82962dcdfa565a4e866ffc17dafe12" +checksum = "fabbf1ead8a5bcbc20f5f8b939ee3f5b0f6f281b6ad3468b84656b658b455259" dependencies = [ "phf_macros", - "phf_shared 0.8.0", + "phf_shared 0.10.0", "proc-macro-hack", ] @@ -1061,14 +1128,24 @@ dependencies = [ "rand 0.7.3", ] +[[package]] +name = "phf_generator" +version = "0.10.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "5d5285893bb5eb82e6aaf5d59ee909a06a16737a8970984dd7746ba9283498d6" +dependencies = [ + "phf_shared 0.10.0", + "rand 0.8.5", +] + [[package]] name = "phf_macros" -version = "0.8.0" +version = "0.10.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "7f6fde18ff429ffc8fe78e2bf7f8b7a5a5a6e2a8b58bc5a9ac69198bbda9189c" +checksum = "58fdf3184dd560f160dd73922bea2d5cd6e8f064bf4b13110abd81b03697b4e0" dependencies = [ - "phf_generator", - "phf_shared 0.8.0", + "phf_generator 0.10.0", + "phf_shared 0.10.0", "proc-macro-hack", "proc-macro2", "quote", @@ -1095,9 +1172,9 @@ dependencies = [ [[package]] name = "pin-project-lite" -version = "0.2.7" +version = "0.2.8" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "8d31d11c69a6b52a174b42bdc0c30e5e11670f90788b2c471c31c1d17d449443" +checksum = "e280fbe77cc62c91527259e9442153f4688736748d24660126286329742b4c6c" [[package]] name = "pmutil" @@ -1112,9 +1189,9 @@ dependencies = [ [[package]] name = "ppv-lite86" -version = "0.2.15" +version = "0.2.16" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "ed0cfbc8191465bed66e1718596ee0b0b35d5ee1f41c5df2189d0fe8bde535ba" +checksum = "eb9f9e6e233e5c4a35559a617bf40a4ec447db2e84c20b55a6f83167b7e57872" [[package]] name = "precomputed-hash" @@ -1124,9 +1201,9 @@ checksum = "925383efa346730478fb4838dbe9137d2a47675ad789c546d150a6e1dd4ab31c" [[package]] name = "preset_env_base" -version = "0.1.0" +version = "0.2.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "1e072088b8b97a4ed729b40444fbb5cc6a7c1bc9b9c455a601d4de7f981a4987" +checksum = "e44b8d534a4ecea4519138ff80780a499691c4e948bc063651487e069966a703" dependencies = [ "ahash", "anyhow", @@ -1134,7 +1211,7 @@ dependencies = [ "dashmap 4.0.2", "from_variant", "once_cell", - "semver 1.0.4", + "semver 1.0.6", "serde", "st-map", ] @@ -1183,18 +1260,18 @@ checksum = "dbf0c48bc1d91375ae5c3cd81e3722dff1abcf81a30960240640d223f59fe0e5" [[package]] name = "proc-macro2" -version = "1.0.32" +version = "1.0.36" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "ba508cc11742c0dc5c1659771673afbab7a0efab23aa17e854cbab0837ed0b43" +checksum = "c7342d5883fbccae1cc37a2353b09c87c9b0f3afd73f5fb9bba687a1f733b029" dependencies = [ "unicode-xid", ] [[package]] name = "quote" -version = "1.0.10" +version = "1.0.15" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "38bc8cc6a5f2e3655e0899c1b848643b2562f853f114bfec7be120678e3ace05" +checksum = "864d3e96a899863136fc6e99f3d7cae289dafe43bf2c5ac19b70df7210c0a145" dependencies = [ "proc-macro2", ] @@ -1215,20 +1292,19 @@ dependencies = [ "libc", "rand_chacha 0.2.2", "rand_core 0.5.1", - "rand_hc 0.2.0", + "rand_hc", "rand_pcg", ] [[package]] name = "rand" -version = "0.8.4" +version = "0.8.5" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "2e7573632e6454cf6b99d7aac4ccca54be06da05aca2ef7423d22d27d4d4bcd8" +checksum = "34af8d1a0e25924bc5b7c43c079c942339d8f0a8b57c39049bef581b46327404" dependencies = [ "libc", "rand_chacha 0.3.1", "rand_core 0.6.3", - "rand_hc 0.3.1", ] [[package]] @@ -1266,7 +1342,7 @@ version = "0.6.3" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "d34f1408f55294453790c48b2f1ebbb1c5b4b7563eb1f418bcfcfdbb06ebb4e7" dependencies = [ - "getrandom 0.2.3", + "getrandom 0.2.5", ] [[package]] @@ -1278,15 +1354,6 @@ dependencies = [ "rand_core 0.5.1", ] -[[package]] -name = "rand_hc" -version = "0.3.1" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "d51e9f596de227fda2ea6c84607f5558e196eeaf43c986b724ba4fb8fdf497e7" -dependencies = [ - "rand_core 0.6.3", -] - [[package]] name = "rand_pcg" version = "0.2.1" @@ -1329,18 +1396,18 @@ checksum = "41cc0f7e4d5d4544e8861606a285bb08d3e70712ccc7d2b84d7c0ccfaf4b05ce" [[package]] name = "redox_syscall" -version = "0.2.10" +version = "0.2.11" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "8383f39639269cde97d255a32bdb68c047337295414940c68bdd30c2e13203ff" +checksum = "8380fe0152551244f0747b1bf41737e0f8a74f97a14ccefd1148187271634f3c" dependencies = [ "bitflags", ] [[package]] name = "regex" -version = "1.5.4" +version = "1.5.5" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "d07a8629359eb56f1e2fb1652bb04212c072a87ba68546a04065d525673ac461" +checksum = "1a11647b6b25ff05a515cb92c365cec08801e83423a235b51e231e1808747286" dependencies = [ "aho-corasick", "memchr", @@ -1364,9 +1431,9 @@ checksum = "f497285884f3fcff424ffc933e56d7cbca511def0c9831a7f9b5f6153e3cc89b" [[package]] name = "relative-path" -version = "1.5.0" +version = "1.6.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "f9629de8974fd69c97684736786b807edd3da456d3e3f95341dd9d4cbd8f5ad6" +checksum = "a49a831dc1e13c9392b660b162333d4cb0033bbbdfe6a1687177e59e89037c86" [[package]] name = "remove_dir_all" @@ -1379,9 +1446,9 @@ dependencies = [ [[package]] name = "retain_mut" -version = "0.1.4" +version = "0.1.7" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "448296241d034b96c11173591deaa1302f2c17b56092106c1f92c1bc0183a8c9" +checksum = "8c31b5c4033f8fdde8700e4657be2c497e7288f01515be52168c631e2e4d4086" [[package]] name = "rustc-demangle" @@ -1406,9 +1473,9 @@ dependencies = [ [[package]] name = "ryu" -version = "1.0.6" +version = "1.0.9" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "3c9613b5a66ab9ba26415184cfc41156594925a9cf3a2057e57f31ff145f6568" +checksum = "73b4b750c782965c211b42f022f59af1fbceabdd026623714f104152f1ec149f" [[package]] name = "same-file" @@ -1442,9 +1509,9 @@ dependencies = [ [[package]] name = "semver" -version = "1.0.4" +version = "1.0.6" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "568a8e6258aa33c13358f81fd834adb854c6f7c9468520910a9b1e8fac068012" +checksum = "a4a3381e03edd24287172047536f20cabde766e2cd3e65e6b00fb3af51c4f38d" dependencies = [ "serde", ] @@ -1489,9 +1556,9 @@ dependencies = [ [[package]] name = "serde_json" -version = "1.0.72" +version = "1.0.79" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "d0ffa0837f2dfa6fb90868c2b5468cad482e175f7dad97e7421951e663f2b527" +checksum = "8e8d9fa5c3b304765ce1fd9c4c8a3de2c8db365a5b91be52f186efc675681d95" dependencies = [ "itoa", "ryu", @@ -1500,15 +1567,13 @@ dependencies = [ [[package]] name = "sha-1" -version = "0.9.8" +version = "0.10.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "99cd6713db3cf16b6c84e06321e049a9b9f699826e16096d23bbcc44d15d51a6" +checksum = "028f48d513f9678cda28f6e4064755b3fbb2af6acd672f2c209b62323f7aea0f" dependencies = [ - "block-buffer", "cfg-if 1.0.0", "cpufeatures", "digest", - "opaque-debug", ] [[package]] @@ -1522,15 +1587,15 @@ dependencies = [ [[package]] name = "siphasher" -version = "0.3.9" +version = "0.3.10" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "a86232ab60fa71287d7f2ddae4a7073f6b7aac33631c3015abb556f08c6d0a3e" +checksum = "7bd3e3206899af3f8b12af284fafc038cc1dc2b41d1b89dd17297221c5d225de" [[package]] name = "smallvec" -version = "1.7.0" +version = "1.8.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "1ecab6c735a6bb4139c0caafd0cc3635748bbb3acf4550e8138122099251f309" +checksum = "f2dd574626839106c320a323308629dcb1acfc96e32a8cba364ddc61ac23ee83" [[package]] name = "sourcemap" @@ -1596,7 +1661,7 @@ version = "0.5.1" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "f24c8e5e19d22a726626f1a5e16fe15b132dcf21d10177fa5a45ce7962996b97" dependencies = [ - "phf_generator", + "phf_generator 0.8.0", "phf_shared 0.8.0", "proc-macro2", "quote", @@ -1623,9 +1688,9 @@ checksum = "6446ced80d6c486436db5c078dde11a9f73d42b57fb273121e160b84f63d894c" [[package]] name = "styled_components" -version = "0.18.0" +version = "0.19.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "a044adff2fd2ddb9832589b87a934beefa68644511ca4d3629d334c2890fa413" +checksum = "f3d0b885062c11468ffdb110b837f0cab89d34e3cbb5dade150ad1f4ce1ba04d" dependencies = [ "Inflector", "once_cell", @@ -1633,20 +1698,20 @@ dependencies = [ "serde", "swc_atoms", "swc_common", - "swc_ecmascript 0.129.0", + "swc_ecmascript", "tracing", ] [[package]] name = "swc" -version = "0.146.0" +version = "0.150.2" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "72cd61a211feaace10912e2cab2e41a4c3037944cf09fc5fc4484476cfb8a38d" +checksum = "4797acf688dd8a83ed4dc2d2d1bd19bf0009aa5a365e23fe2be5092b4e4c954f" dependencies = [ "ahash", "anyhow", "base64 0.13.0", - "dashmap 4.0.2", + "dashmap 5.1.0", "either", "indexmap", "lru", @@ -1674,7 +1739,7 @@ dependencies = [ "swc_ecma_transforms_optimization", "swc_ecma_utils", "swc_ecma_visit", - "swc_ecmascript 0.130.0", + "swc_ecmascript", "swc_node_comments", "swc_visit", "tracing", @@ -1692,14 +1757,14 @@ dependencies = [ [[package]] name = "swc_bundler" -version = "0.120.0" +version = "0.122.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "b34f7fb2af1d7ea4a5711f080de1f89b3e7cc60878129ca05a87dcb03806252d" +checksum = "f20988c95a6e660f28c741b81688ffabd012709ef8e663dad37bcffaa23dc2d6" dependencies = [ "ahash", "anyhow", "crc", - "dashmap 4.0.2", + "dashmap 5.1.0", "indexmap", "is-macro", "once_cell", @@ -1741,15 +1806,15 @@ dependencies = [ [[package]] name = "swc_common" -version = "0.17.13" +version = "0.17.15" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "a36a065c7083df5ffd6fce81183cce8eb3dd60e04bf43a02b13fd2ca82735194" +checksum = "af06472bfc423fb7b75c483eccfb9b6790db9de0fb2d6ff1ef8369a2551a3707" dependencies = [ "ahash", "ast_node", "atty", "better_scoped_tls", - "cfg-if 0.1.10", + "cfg-if 1.0.0", "debug_unreachable", "either", "from_variant", @@ -1771,9 +1836,9 @@ dependencies = [ [[package]] name = "swc_css" -version = "0.98.0" +version = "0.100.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "8a981201fee6030b632b61e232344e57b88646487e890fe40c2f52df6e61dad8" +checksum = "fd76b4fffe5f5615e167985283e5581d3bf87ab41e388d0c486719d52ce0f1b3" dependencies = [ "swc_css_ast", "swc_css_codegen", @@ -1784,9 +1849,9 @@ dependencies = [ [[package]] name = "swc_css_ast" -version = "0.89.0" +version = "0.90.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "60b8d5dd8d45e8d26e1c0f15d04d830bf9489205dd39f6a2867bf2f1e521ebb5" +checksum = "89ae602751d820bba386fb525d38f4bfdc5e5a5db8b02318c4742ab931d894f3" dependencies = [ "is-macro", "serde", @@ -1797,9 +1862,9 @@ dependencies = [ [[package]] name = "swc_css_codegen" -version = "0.95.0" +version = "0.97.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "55ca0ec88711d6af0cfa4465ac117ad808c64b978de406c6d7049c9f837876cc" +checksum = "63b975558fe80ad6246930d3bf027c58df9fdab5e112461805c03a2ea8db8279" dependencies = [ "auto_impl", "bitflags", @@ -1824,9 +1889,9 @@ dependencies = [ [[package]] name = "swc_css_parser" -version = "0.96.2" +version = "0.97.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "2dc44fabca5685b2af81cd401cb03ef69633d8e8b718283237e3bf9331755e55" +checksum = "c44d90bcf8a6d8668c2d1e691a5101fa599a6fff0a82088e0b3f56214e1d9bae" dependencies = [ "bitflags", "lexical", @@ -1837,9 +1902,9 @@ dependencies = [ [[package]] name = "swc_css_utils" -version = "0.86.1" +version = "0.87.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "56fb5413c7525a34b20bc4d8adc388f6b62ed7013d77aa997ab9607fb02183f3" +checksum = "f039d24094d6d8a65347ef5004aa2adb7b11dffd463af5d5c8b87481ee94ee4d" dependencies = [ "swc_atoms", "swc_common", @@ -1849,9 +1914,9 @@ dependencies = [ [[package]] name = "swc_css_visit" -version = "0.88.0" +version = "0.89.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "93e147d6cac704199e68d008e5db562741c74e3d57aac859d0a015a25a90a036" +checksum = "5557d81524c4ff0ca3be95ba699802105d016b7f72f35b746c231acfb95cda72" dependencies = [ "swc_atoms", "swc_common", @@ -1861,9 +1926,9 @@ dependencies = [ [[package]] name = "swc_ecma_ast" -version = "0.69.1" +version = "0.70.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "d4b2e9a1a9e3f71557971dd096aa3fff7487f2c419d2f93c0d71445352a36dc8" +checksum = "e35d736b61d3dceb5a4e18a86d69bfc352aa7136fd3c5a6c2f3353231cd9d839" dependencies = [ "is-macro", "num-bigint", @@ -1876,9 +1941,9 @@ dependencies = [ [[package]] name = "swc_ecma_codegen" -version = "0.94.0" +version = "0.95.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "c7cc54ecbaa80a5900189cf37825b221670b249ed192ac978095ec2a742cc503" +checksum = "8fa4a2b82e2bab5bea6472e23b14bd96c462ae9e1e29d9af2ea8ea6d58dcc406" dependencies = [ "bitflags", "memchr", @@ -1907,9 +1972,9 @@ dependencies = [ [[package]] name = "swc_ecma_ext_transforms" -version = "0.57.0" +version = "0.58.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "29ee604a45d78d367cddc3b7cb3eca11142a48c2eff99c8703606ba40598a29f" +checksum = "e9abffab30a8d23ebbead8d5c119e8ef10ab0bd9006eb6ff695d0a092583511b" dependencies = [ "phf", "swc_atoms", @@ -1921,13 +1986,13 @@ dependencies = [ [[package]] name = "swc_ecma_lints" -version = "0.22.2" +version = "0.23.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "fba8df0f6b301d77497cabb32245497e779501fcc51a74b9cd262a639881434f" +checksum = "aedc1fdd035c4eeecb33af1f3e9d398e09dc181e97a8e86f1f55acc557918bc8" dependencies = [ "ahash", "auto_impl", - "dashmap 4.0.2", + "dashmap 5.1.0", "parking_lot 0.12.0", "rayon", "regex", @@ -1962,9 +2027,9 @@ dependencies = [ [[package]] name = "swc_ecma_minifier" -version = "0.88.1" +version = "0.89.2" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "795c58670d843f62f1e349fe537a8ec65dac21c78fd527db5b83ae0952cf78bd" +checksum = "ce6d504a13e728ba34cda8046620e004aa279af8b6ce1701d434840b6d396f1e" dependencies = [ "ahash", "indexmap", @@ -1973,6 +2038,7 @@ dependencies = [ "rayon", "regex", "retain_mut", + "rustc-hash", "serde", "serde_json", "swc_atoms", @@ -1992,9 +2058,9 @@ dependencies = [ [[package]] name = "swc_ecma_parser" -version = "0.92.5" +version = "0.93.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "1251aed8d38997c1ce928019fa64708c284cf19377f2e9eca6f43cb2f4202186" +checksum = "6bcc4ebfd0c5f7c9e5fd03b3dff680d61e997e51147e6f4738ee3274be5ad382" dependencies = [ "either", "enum_kind", @@ -2012,17 +2078,17 @@ dependencies = [ [[package]] name = "swc_ecma_preset_env" -version = "0.104.0" +version = "0.106.2" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "65ed547302d317c6e629b80747f5a75d06d6887ba2e4434f2e81411f33e05f00" +checksum = "4c76924d65625afb0536c433d59a6f63fee0388e0ab7f121bda9ec92a84b4678" dependencies = [ "ahash", "anyhow", - "dashmap 4.0.2", + "dashmap 5.1.0", "indexmap", "once_cell", "preset_env_base", - "semver 1.0.4", + "semver 1.0.6", "serde", "serde_json", "st-map", @@ -2037,9 +2103,9 @@ dependencies = [ [[package]] name = "swc_ecma_transforms" -version = "0.130.0" +version = "0.131.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "1a9333d80deef03e37cfbf0a396d1604fbec8a6d72ad6cb27138367c1d19fc94" +checksum = "484ab8024a62c8f35a408898d0b8aa664e03a992c2f262cda6173274f48d955e" dependencies = [ "swc_atoms", "swc_common", @@ -2057,9 +2123,9 @@ dependencies = [ [[package]] name = "swc_ecma_transforms_base" -version = "0.66.0" +version = "0.67.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "306d0e08bcbfc887744e7affbe00c2b5b753cfe7d7fc2a8ffc77b05ca46cb1bf" +checksum = "6786157670709b3c9e2a81aee7aef8042b582b4b599f233025b28ca5353a29d9" dependencies = [ "better_scoped_tls", "once_cell", @@ -2078,9 +2144,9 @@ dependencies = [ [[package]] name = "swc_ecma_transforms_classes" -version = "0.54.0" +version = "0.55.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "d4314241d66c22a6015e87c563ab7e0ac2519712822dc81c91c56575fe1de613" +checksum = "6dd06b4fa72cd85640fcab59c210c34c8e63f6ea5e547c856febcf18000c0bda" dependencies = [ "swc_atoms", "swc_common", @@ -2092,9 +2158,9 @@ dependencies = [ [[package]] name = "swc_ecma_transforms_compat" -version = "0.79.1" +version = "0.80.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "b2d07603599624024734fe85961cd48a3eace1a72f316d3d0232187a594f29f5" +checksum = "f622788e39755b4a0b9902e37314fbc59f163d5e9e24c121a95c8352fb00e1e0" dependencies = [ "ahash", "arrayvec 0.7.2", @@ -2131,9 +2197,9 @@ dependencies = [ [[package]] name = "swc_ecma_transforms_module" -version = "0.90.0" +version = "0.91.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "60762763c4c5ec8f9f8a86408fd0cfa01802d5a274f8ecdb4327ba6292fff52a" +checksum = "3b050435473be3392bdc665682cf3637c006ea5fe57f6f58cf3be08ae597fab9" dependencies = [ "Inflector", "ahash", @@ -2155,12 +2221,12 @@ dependencies = [ [[package]] name = "swc_ecma_transforms_optimization" -version = "0.100.0" +version = "0.101.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "98ce53a1efa05e9bbeb2f8a16a1e153801708d7bea692776442bf43576f1921b" +checksum = "a0638979a3445e49125ab28a30dc734c272e66406db5583d9095f459543056ac" dependencies = [ "ahash", - "dashmap 4.0.2", + "dashmap 5.1.0", "indexmap", "once_cell", "rayon", @@ -2178,9 +2244,9 @@ dependencies = [ [[package]] name = "swc_ecma_transforms_proposal" -version = "0.87.0" +version = "0.88.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "3cb5290bb79e3112c2124167c3b4a6e1225afcd576fd769912ed691f5bf46029" +checksum = "7bf987316b088789266b108b9ad87f8479402a76233565ef31807103766bc079" dependencies = [ "either", "serde", @@ -2197,13 +2263,13 @@ dependencies = [ [[package]] name = "swc_ecma_transforms_react" -version = "0.92.0" +version = "0.93.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "6b618bfc4d3a99df1081bfe0b833d14572ab36dd2c245d1ab51c581b2d74b843" +checksum = "dd2d009bb8be4149a1b3bb8ea2e4c59c5a26ed5b5ae797563026887480ed9141" dependencies = [ "ahash", "base64 0.13.0", - "dashmap 4.0.2", + "dashmap 5.1.0", "indexmap", "once_cell", "regex", @@ -2222,9 +2288,9 @@ dependencies = [ [[package]] name = "swc_ecma_transforms_testing" -version = "0.68.1" +version = "0.69.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "9c1f27182dcd914db8705424b0c6d32bc1198a49f4a551c13fdf7c9025769286" +checksum = "46059181bdb2006c3f5ff67d8e19a6a0f9a6f226edb0fbafdfbd314fabaebe92" dependencies = [ "ansi_term", "anyhow", @@ -2245,9 +2311,9 @@ dependencies = [ [[package]] name = "swc_ecma_transforms_typescript" -version = "0.95.0" +version = "0.96.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "6b126d9e2545e975d2ae09277c2f16bb682b0111f03e643e3b59e56831a7f6b4" +checksum = "ed2e388f0b424de694aac45aaad513e7ccb03aeb87ed42781ce353e1346b3d86" dependencies = [ "serde", "swc_atoms", @@ -2261,9 +2327,9 @@ dependencies = [ [[package]] name = "swc_ecma_utils" -version = "0.71.0" +version = "0.72.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "ee41829a14f59d6f93a5f5721f08797b214caa4d037913b51ab61a9d31e10576" +checksum = "43689c9f051b48c4ea9eb86b236b27277594a9c4311d3ee88d7007f5d65b1ff5" dependencies = [ "indexmap", "once_cell", @@ -2277,9 +2343,9 @@ dependencies = [ [[package]] name = "swc_ecma_visit" -version = "0.55.0" +version = "0.56.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "b359c0ddd3f474dcc379d3c011670be3b855229bcb523e6571897c5beae42957" +checksum = "9b70316301b54ead435ae2660824ba3049de1854710b73395e1b8e615dc0bca6" dependencies = [ "num-bigint", "swc_atoms", @@ -2291,21 +2357,9 @@ dependencies = [ [[package]] name = "swc_ecmascript" -version = "0.129.0" +version = "0.132.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "471e05cfdcafc429376d7d2fd8b8e043e4a007945b87d445fbdb2d6f742df194" -dependencies = [ - "swc_ecma_ast", - "swc_ecma_parser", - "swc_ecma_utils", - "swc_ecma_visit", -] - -[[package]] -name = "swc_ecmascript" -version = "0.130.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "cde3469465d772bf49b29b735e2f1cd0f1124064b15fd8ccfa0ab4ab75fab997" +checksum = "7fa1f0e2b8bcb94f30b276c633743e6d2cf06e5ceb0561fe1bb55d47d020921e" dependencies = [ "swc_ecma_ast", "swc_ecma_codegen", @@ -2330,9 +2384,9 @@ dependencies = [ [[package]] name = "swc_fast_graph" -version = "0.4.0" +version = "0.5.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "1d53bbcbb4b055c547f283af1f84211f425b95ac59e02d8b70c94b8a63a4704f" +checksum = "9860ef8ffc31eedf45bc39a60a2500838a331e3e687bc005fe69088f6a966460" dependencies = [ "ahash", "indexmap", @@ -2342,9 +2396,9 @@ dependencies = [ [[package]] name = "swc_graph_analyzer" -version = "0.4.0" +version = "0.5.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "83b42a8b13068dd90dec954ec44576d5922914687bc34277f3b0f8d0bbeb4e83" +checksum = "cdf3d51c57b19a2c1eb0519f8ef789eb386fe98700e7fa73fb78d27ef99bd00d" dependencies = [ "ahash", "auto_impl", @@ -2387,9 +2441,9 @@ dependencies = [ [[package]] name = "swc_stylis" -version = "0.94.3" +version = "0.96.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "1986382e96dc65958c447e795657d0d87594d93085505ff80943d53e7cfb5369" +checksum = "e2d340493d65755389290f669345d044eebfff59f3009b14e8d09e54806d7126" dependencies = [ "swc_atoms", "swc_common", @@ -2409,9 +2463,9 @@ dependencies = [ [[package]] name = "swc_trace_macro" -version = "0.1.0" +version = "0.1.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "85341fb96c46bd873272553b8b1d4330f886fe5231969cc1564e1c659fee8334" +checksum = "8d1a05fdb40442d687cb2eff4e5c374886a66ced1436ad87515de7d72b3ec10b" dependencies = [ "proc-macro2", "quote", @@ -2430,9 +2484,9 @@ dependencies = [ [[package]] name = "swc_visit_macros" -version = "0.3.0" +version = "0.3.1" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "e505bbf8e11898fa05a65aa5e773c827ec743fc15aa3c064c9e06164ed0b6630" +checksum = "c3b9b72892df873972549838bf84d6c56234c7502148a7e23b5a3da6e0fedfb8" dependencies = [ "Inflector", "pmutil", @@ -2455,23 +2509,23 @@ dependencies = [ [[package]] name = "tempfile" -version = "3.2.0" +version = "3.3.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "dac1c663cfc93810f88aed9b8941d48cabf856a1b111c29a40439018d870eb22" +checksum = "5cdb1ef4eaeeaddc8fbd371e5017057064af0911902ef36b39801f67cc6d79e4" dependencies = [ "cfg-if 1.0.0", + "fastrand", "libc", - "rand 0.8.4", - "redox_syscall 0.2.10", + "redox_syscall 0.2.11", "remove_dir_all", "winapi", ] [[package]] name = "termcolor" -version = "1.1.2" +version = "1.1.3" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "2dfed899f0eb03f32ee8c6a0aabdb8a7949659e3466561fc0adf54e26d88c5f4" +checksum = "bab24d30b911b2376f3a13cc2cd443142f0c81dda04c118693e35b3835757755" dependencies = [ "winapi-util", ] @@ -2496,9 +2550,9 @@ dependencies = [ [[package]] name = "testing_macros" -version = "0.2.4" +version = "0.2.5" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "dc6976b6f5ffd18755bef29dce0e9e882382d53bc1ed9d414ccd5c0ee7346bc2" +checksum = "adfb26385ca4db3f8aa680824013819e3b9f8d9a1b64b4f83a411e09a61f11c3" dependencies = [ "anyhow", "glob", @@ -2532,9 +2586,9 @@ dependencies = [ [[package]] name = "thread_local" -version = "1.1.3" +version = "1.1.4" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "8018d24e04c95ac8790716a5987d0fec4f8b27249ffa0f7d33f1369bdfb88cbd" +checksum = "5516c27b78311c50bf42c071425c560ac799b11c30b31f87e3081965fe5e0180" dependencies = [ "once_cell", ] @@ -2589,9 +2643,9 @@ dependencies = [ [[package]] name = "tracing-core" -version = "0.1.22" +version = "0.1.23" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "03cfcb51380632a72d3111cb8d3447a8d908e577d31beeac006f836383d29a23" +checksum = "aa31669fa42c09c34d94d8165dd2012e8ff3c66aca50f3bb226b68f216f2706c" dependencies = [ "lazy_static", "valuable", @@ -2610,9 +2664,9 @@ dependencies = [ [[package]] name = "tracing-subscriber" -version = "0.3.5" +version = "0.3.9" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "5d81bfa81424cc98cb034b837c985b7a290f592e5b4322f353f94a0ab0f9f594" +checksum = "9e0ab7bdc962035a87fba73f3acca9b8a8d0034c2e6f60b84aeaaddddc155dce" dependencies = [ "ansi_term", "lazy_static", @@ -2634,9 +2688,9 @@ checksum = "0685c84d5d54d1c26f7d3eb96cd41550adb97baed141a761cf335d3d33bcd0ae" [[package]] name = "typenum" -version = "1.14.0" +version = "1.15.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "b63708a265f51345575b27fe43f9500ad611579e764c79edbc2037b1121959ec" +checksum = "dcf81ac59edc17cc8697ff311e8f5ef2d99fcbd9817b34cec66f90b6c3dfd987" [[package]] name = "unicode-bidi" @@ -2700,9 +2754,9 @@ checksum = "830b7e5d4d90034032940e4ace0d9a9a057e7a45cd94e6c007832e39edb82f6d" [[package]] name = "version_check" -version = "0.9.3" +version = "0.9.4" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "5fecdca9a5291cc2b8dcf7dc02453fee791a280f3743cb0905f8822ae463b3fe" +checksum = "49874b5167b65d7193b8aba1567f5c7d93d001cafc34600cee003eda787e483f" [[package]] name = "void" @@ -2747,7 +2801,7 @@ dependencies = [ "serde_json", "swc", "swc_common", - "swc_ecmascript 0.130.0", + "swc_ecmascript", "tracing", "wasm-bindgen", "wasm-bindgen-futures", diff --git a/packages/next-swc/crates/core/Cargo.toml b/packages/next-swc/crates/core/Cargo.toml index 6902edcc710c..09d272b19582 100644 --- a/packages/next-swc/crates/core/Cargo.toml +++ b/packages/next-swc/crates/core/Cargo.toml @@ -7,27 +7,30 @@ version = "0.0.0" crate-type = ["cdylib", "rlib"] [dependencies] +base64 = "0.13" +byteorder = "1" chrono = "0.4" -once_cell = "1.8.0" easy-error = "1.0.0" either = "1" fxhash = "0.2.1" +once_cell = "1.8.0" pathdiff = "0.2.0" +radix_fmt = "1" +regex = "1.5" serde = "1" serde_json = "1" -styled_components = "0.18.0" -swc = "0.146.0" -swc_atoms = "0.2.7" -swc_common = { version = "0.17.11", features = ["concurrent", "sourcemap"] } -swc_css = "0.98.0" -swc_ecma_loader = { version = "0.29.0", features = ["node", "lru"] } -swc_ecmascript = { version = "0.130.0", features = ["codegen", "minifier", "optimization", "parser", "react", "transforms", "typescript", "utils", "visit"] } +styled_components = "0.19.0" +swc = "0.150.1" +swc_atoms = "0.2.9" +swc_common = {version = "0.17.15", features = ["concurrent", "sourcemap"]} +swc_css = "0.100.0" +swc_ecma_loader = {version = "0.29.0", features = ["node", "lru"]} +swc_ecmascript = {version = "0.132.0", features = ["codegen", "minifier", "optimization", "parser", "react", "transforms", "typescript", "utils", "visit"]} swc_node_base = "0.5.1" -swc_stylis = "0.94.3" +swc_stylis = "0.96.1" tracing = {version = "0.1.28", features = ["release_max_level_off"]} -regex = "1.5" [dev-dependencies] -swc_ecma_transforms_testing = "0.68.0" +swc_ecma_transforms_testing = "0.69.0" testing = "0.18.1" walkdir = "2.3.2" diff --git a/packages/next-swc/crates/core/src/emotion/hash.rs b/packages/next-swc/crates/core/src/emotion/hash.rs new file mode 100644 index 000000000000..87c0621e75d8 --- /dev/null +++ b/packages/next-swc/crates/core/src/emotion/hash.rs @@ -0,0 +1,62 @@ +// Ported from https://github.com/aappleby/smhasher/blob/61a0530f28277f2e850bfc39600ce61d02b518de/src/MurmurHash2.cpp#L37-L86 + +use byteorder::{ByteOrder, LittleEndian}; + +const M: u32 = 0x5bd1_e995; + +pub(crate) fn murmurhash2(key: &[u8], initial_state: u32) -> u32 { + let mut h: u32 = initial_state; + + let mut four_bytes_chunks = key.chunks_exact(4); + for chunk in four_bytes_chunks.by_ref() { + let mut k: u32 = LittleEndian::read_u32(chunk); + k = k.wrapping_mul(M); + k ^= k >> 24; + h = k.wrapping_mul(M) ^ h.wrapping_mul(M); + } + let remainder = four_bytes_chunks.remainder(); + + // Handle the last few bytes of the input array + match remainder.len() { + 3 => { + h ^= u32::from(remainder[2]) << 16; + } + 2 => { + h ^= u32::from(remainder[1]) << 8; + } + 1 => { + h ^= u32::from(remainder[0]); + h = h.wrapping_mul(M); + } + _ => {} + } + h ^= h >> 13; + h = h.wrapping_mul(M); + h ^ (h >> 15) +} + +#[cfg(test)] +mod test { + + use super::murmurhash2; + + #[test] + fn test_murmur2() { + let s1 = "abcdef"; + let s2 = "abcdeg"; + for i in 0..5 { + assert_eq!( + murmurhash2(&s1[i..5].as_bytes(), 0), + murmurhash2(&s2[i..5].as_bytes(), 0) + ); + } + } + + #[test] + fn verify_hash() { + assert_eq!( + murmurhash2("something".as_bytes(), 0), + u32::from_str_radix("crsxd7", 36).unwrap() + ); + } +} diff --git a/packages/next-swc/crates/core/src/emotion/mod.rs b/packages/next-swc/crates/core/src/emotion/mod.rs new file mode 100644 index 000000000000..e0ccb879c2a3 --- /dev/null +++ b/packages/next-swc/crates/core/src/emotion/mod.rs @@ -0,0 +1,757 @@ +use std::borrow::Cow; +use std::path::{Path, PathBuf}; +use std::sync::Arc; + +use fxhash::FxHashMap; +use once_cell::sync::Lazy; +use regex::Regex; +use serde::{Deserialize, Serialize}; +use swc::sourcemap::{RawToken, SourceMap as RawSourcemap}; +use swc_atoms::JsWord; +use swc_common::comments::Comments; +use swc_common::util::take::Take; +use swc_common::{BytePos, SourceMap, DUMMY_SP}; +use swc_ecmascript::ast::{ + ArrayLit, JSXAttr, JSXAttrName, JSXAttrOrSpread, JSXAttrValue, JSXElementName, JSXExpr, + JSXExprContainer, JSXObject, +}; +use swc_ecmascript::utils::ident::IdentLike; +use swc_ecmascript::utils::{ExprFactory, Id}; +use swc_ecmascript::{ + ast::{ + Callee, Expr, ExprOrSpread, Ident, ImportDecl, ImportSpecifier, JSXElement, KeyValueProp, + MemberProp, ObjectLit, Pat, Prop, PropName, PropOrSpread, Tpl, VarDeclarator, + }, + codegen::util::SourceMapperExt, + visit::{swc_ecma_ast::CallExpr, Fold, FoldWith}, +}; + +mod hash; + +static EMOTION_OFFICIAL_LIBRARIES: Lazy> = Lazy::new(|| { + vec![ + EmotionModuleConfig { + module_name: "@emotion/styled".into(), + exported_names: vec![], + default_export: Some(ExprKind::Styled), + }, + EmotionModuleConfig { + module_name: "@emotion/react".into(), + exported_names: vec![ + ExportItem { + name: "css".to_owned(), + kind: ExprKind::Css, + }, + ExportItem { + name: "keyframes".to_owned(), + kind: ExprKind::Css, + }, + ExportItem { + name: "Global".to_owned(), + kind: ExprKind::GlobalJSX, + }, + ], + ..Default::default() + }, + EmotionModuleConfig { + module_name: "@emotion/primitives".into(), + exported_names: vec![ExportItem { + name: "css".to_owned(), + kind: ExprKind::Css, + }], + default_export: Some(ExprKind::Styled), + }, + EmotionModuleConfig { + module_name: "@emotion/native".into(), + exported_names: vec![ExportItem { + name: "css".to_owned(), + kind: ExprKind::Css, + }], + default_export: Some(ExprKind::Styled), + }, + ] +}); + +static SPACE_AROUND_COLON: Lazy = + Lazy::new(|| Regex::new(r"\s*(?P[:|;|,|\{,\}])\s*").unwrap()); + +#[derive(Debug, Clone, Serialize, Deserialize)] +#[serde(rename_all = "camelCase")] +pub struct EmotionOptions { + pub enabled: Option, + pub sourcemap: Option, + pub auto_label: Option, + pub label_format: Option, +} + +impl Default for EmotionOptions { + fn default() -> Self { + EmotionOptions { + enabled: Some(false), + sourcemap: Some(true), + auto_label: Some(true), + label_format: Some("[local]".to_owned()), + } + } +} + +#[derive(Debug, Clone, Default, Serialize, Deserialize)] +pub struct EmotionModuleConfig { + module_name: JsWord, + exported_names: Vec, + default_export: Option, +} + +#[derive(Debug, Clone, Default, Serialize, Deserialize)] +struct ExportItem { + name: String, + kind: ExprKind, +} + +#[derive(Debug, Clone, Serialize, Deserialize)] +enum ImportType { + Named, + Namespace, + Default, +} + +impl Default for ImportType { + fn default() -> Self { + ImportType::Named + } +} + +#[derive(Debug, Clone, Copy, Serialize, Deserialize)] +enum ExprKind { + Css, + Styled, + GlobalJSX, +} + +impl Default for ExprKind { + fn default() -> Self { + ExprKind::Css + } +} + +#[derive(Debug)] +enum PackageMeta { + Named(ExprKind), + Namespace(EmotionModuleConfig), +} + +pub fn emotion( + emotion_options: EmotionOptions, + path: &Path, + cm: Arc, + comments: C, +) -> impl Fold { + EmotionTransformer::new(emotion_options, path, cm, comments) +} + +pub struct EmotionTransformer { + pub options: EmotionOptions, + filepath_hash: Option, + filepath: PathBuf, + dir: Option, + filename: Option, + cm: Arc, + comments: C, + import_packages: FxHashMap, + emotion_target_class_name_count: usize, + current_context: Option, + // skip `css` transformation if it in JSX Element/Attribute + in_jsx_element: bool, +} + +impl EmotionTransformer { + pub fn new(options: EmotionOptions, path: &Path, cm: Arc, comments: C) -> Self { + EmotionTransformer { + options, + filepath_hash: None, + filepath: path.to_owned(), + dir: path.parent().and_then(|p| p.to_str()).map(|s| s.to_owned()), + filename: path + .file_name() + .and_then(|filename| filename.to_str()) + .map(|s| s.to_owned()), + cm, + comments, + import_packages: FxHashMap::default(), + emotion_target_class_name_count: 0, + current_context: None, + in_jsx_element: false, + } + } + + #[inline] + // Compute file hash on demand + // Memorize the hash of the file name + fn get_filename_hash(&mut self) -> u32 { + if self.filepath_hash.is_none() { + self.filepath_hash = Some(hash::murmurhash2( + self.filepath.to_string_lossy().as_bytes(), + 0, + )); + } + self.filepath_hash.unwrap() + } + + fn create_label(&self, with_prefix: bool) -> String { + let prefix = if with_prefix { "label:" } else { "" }; + let mut label = format!( + "{}{}", + prefix, + self.options + .label_format + .clone() + .unwrap_or_else(|| "[local]".to_owned()) + ); + if let Some(current_context) = &self.current_context { + label = label.replace("[local]", current_context); + if let Some(filename) = self.filename.as_ref() { + label = label.replace("[filename]", filename); + } + if let Some(dir) = self.dir.as_ref() { + label = label.replace("[dir]", dir); + }; + } + label + } + + fn create_sourcemap(&mut self, pos: BytePos) -> Option { + if self.options.sourcemap.unwrap_or(false) { + let loc = self.cm.get_code_map().lookup_char_pos(pos); + let filename = self.filepath.to_str().map(|s| s.to_owned()); + let cm = RawSourcemap::new( + filename.clone(), + vec![RawToken { + dst_line: 0, + dst_col: 0, + src_line: loc.line as u32 - 1, + src_col: loc.col_display as u32, + src_id: 0, + name_id: 0, + }], + Vec::new(), + vec![filename.unwrap_or_default()], + Some(vec![Some(loc.file.src.to_string())]), + ); + let mut writer = Vec::new(); + if cm.to_writer(&mut writer).is_ok() { + return Some(format!( + "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,{} */", + base64::encode(writer) + )); + } + } + None + } + + // Find the imported name from modules + // These import statements are supported: + // import styled from '@emotion/styled' + // import { default as whateverStyled } from '@emotion/styled' + // import { css } from '@emotion/react' + // import * as emotionCss from '@emotion/react' + fn generate_import_info(&mut self, expr: &ImportDecl) { + for c in EMOTION_OFFICIAL_LIBRARIES.iter() { + if expr.src.value == c.module_name { + for specifier in expr.specifiers.iter() { + match specifier { + ImportSpecifier::Named(named) => { + for exported in c.exported_names.iter() { + if named.local.as_ref() == exported.name { + self.import_packages.insert( + named.local.to_id(), + PackageMeta::Named(exported.kind), + ); + } + } + } + ImportSpecifier::Default(default) => { + if let Some(kind) = c.default_export { + self.import_packages + .insert(default.local.to_id(), PackageMeta::Named(kind)); + } + } + ImportSpecifier::Namespace(namespace) => { + self.import_packages + .insert(namespace.local.to_id(), PackageMeta::Namespace(c.clone())); + } + } + } + } + } + } + + fn create_label_prop_node(&mut self, key: &str) -> PropOrSpread { + let stable_class_name = format!( + "e{}{}", + radix_fmt::radix_36(self.get_filename_hash()), + self.emotion_target_class_name_count + ); + self.emotion_target_class_name_count += 1; + PropOrSpread::Prop(Box::new(Prop::KeyValue(KeyValueProp { + key: PropName::Ident(Ident::new(key.into(), DUMMY_SP)), + value: stable_class_name.into(), + }))) + } + + fn create_args_from_tagged_tpl(&self, tagged_tpl: &mut Tpl) -> Vec { + let args_len = tagged_tpl.exprs.len() + tagged_tpl.quasis.len(); + // 2 more capacity is for `label` and `sourceMap` + let mut args = Vec::with_capacity(args_len + 2); + for index in 0..args_len { + let i = index / 2; + if index % 2 == 0 { + if let Some(q) = tagged_tpl.quasis.get_mut(i) { + let q = q.take(); + let minified = + minify_css_string(&q.raw.value, index == 0, index == args_len - 1); + if !minified.replace(' ', "").is_empty() { + args.push(minified.as_arg()); + } + } + } else if let Some(e) = tagged_tpl.exprs.get_mut(i) { + args.push(e.take().as_arg()); + } + } + args + } + + fn rewrite_styles_attr(&mut self, attrs: &mut [JSXAttrOrSpread], pos: BytePos) { + if let Some(attr_value) = attrs.iter_mut().find_map(|attr| { + if let JSXAttrOrSpread::JSXAttr(JSXAttr { + name: JSXAttrName::Ident(i), + value, + .. + }) = attr + { + if i.as_ref() == "styles" { + return value.as_mut(); + } + } + None + }) { + if let Some(raw_attr) = match attr_value { + JSXAttrValue::Lit(lit) => Some(Box::new(Expr::Lit(lit.clone()))), + JSXAttrValue::JSXExprContainer(JSXExprContainer { + expr: JSXExpr::Expr(expr), + .. + }) => Some(expr.take()), + _ => None, + } { + *attr_value = self.create_styles_attr(raw_attr, pos); + self.in_jsx_element = true; + } + } + } + + fn create_styles_attr(&mut self, mut raw_attr: Box, pos: BytePos) -> JSXAttrValue { + if let Expr::Array(array_lit) = raw_attr.as_mut() { + if let Some(cm) = self.create_sourcemap(pos) { + array_lit.elems.push(Some(cm.as_arg())); + } + JSXAttrValue::JSXExprContainer(JSXExprContainer { + span: DUMMY_SP, + expr: JSXExpr::Expr(raw_attr), + }) + } else { + JSXAttrValue::JSXExprContainer(JSXExprContainer { + span: DUMMY_SP, + expr: JSXExpr::Expr(Box::new(Expr::Array(ArrayLit { + span: DUMMY_SP, + elems: { + let mut elements = Vec::with_capacity(2); + elements.push(Some(raw_attr.as_arg())); + if let Some(cm) = self.create_sourcemap(pos) { + elements.push(Some(cm.as_arg())); + } + elements + }, + }))), + }) + } + } +} + +impl Fold for EmotionTransformer { + // Collect import modules that indicator if this file need to be transformed + fn fold_import_decl(&mut self, expr: ImportDecl) -> ImportDecl { + if expr.type_only { + return expr; + } + self.generate_import_info(&expr); + expr + } + + fn fold_var_declarator(&mut self, dec: VarDeclarator) -> VarDeclarator { + if let Pat::Ident(i) = &dec.name { + self.current_context = Some(i.id.as_ref().to_owned()); + } + dec.fold_children_with(self) + } + + fn fold_call_expr(&mut self, mut expr: CallExpr) -> CallExpr { + // If no package that we care about is imported, skip the following + // transformation logic. + if self.import_packages.is_empty() { + return expr; + } + if let Callee::Expr(e) = &mut expr.callee { + match e.as_mut() { + // css({}) + Expr::Ident(i) => { + if let Some(package) = self.import_packages.get(&i.to_id()) { + if !expr.args.is_empty() { + if let PackageMeta::Named(kind) = package { + if matches!(kind, ExprKind::Css) && !self.in_jsx_element { + self.comments.add_pure_comment(expr.span.lo()); + if self.options.auto_label.unwrap_or(false) { + expr.args.push(self.create_label(true).as_arg()); + } + if let Some(cm) = self.create_sourcemap(expr.span.lo) { + expr.args.push(cm.as_arg()); + } + } + } + } + } + } + // styled('div')({}) + Expr::Call(c) => { + if let Callee::Expr(callee_exp) = &c.callee { + if let Expr::Ident(i) = callee_exp.as_ref() { + if let Some(PackageMeta::Named(ExprKind::Styled)) = + self.import_packages.get(&i.to_id()) + { + if !c.args.is_empty() { + let mut args_props = Vec::with_capacity(2); + args_props.push(self.create_label_prop_node("target")); + self.comments.add_pure_comment(expr.span.lo()); + if self.options.auto_label.unwrap_or(false) { + args_props.push(PropOrSpread::Prop(Box::new( + Prop::KeyValue(KeyValueProp { + key: PropName::Ident(Ident::new( + "label".into(), + DUMMY_SP, + )), + value: self.create_label(false).into(), + }), + ))); + } + if let Some(cm) = self.create_sourcemap(expr.span.lo()) { + c.args.push(cm.as_arg()); + } + c.args.push( + Expr::Object(ObjectLit { + span: DUMMY_SP, + props: args_props, + }) + .as_arg(), + ); + } + } + } + } + } + // styled.div({}) + // customEmotionReact.css({}) + Expr::Member(m) => { + if let Expr::Ident(i) = m.obj.as_ref() { + if let Some(package) = self.import_packages.get(&i.to_id()) { + if let PackageMeta::Named(kind) = package { + if matches!(kind, ExprKind::Styled) { + if let MemberProp::Ident(prop) = &m.prop { + let mut args_props = Vec::with_capacity(2); + args_props.push(self.create_label_prop_node("target")); + let mut args = vec![prop.sym.as_ref().as_arg()]; + if !self.in_jsx_element { + self.comments.add_pure_comment(expr.span.lo()); + if self.options.auto_label.unwrap_or(false) { + args_props.push(PropOrSpread::Prop(Box::new( + Prop::KeyValue(KeyValueProp { + key: PropName::Ident(Ident::new( + "label".into(), + DUMMY_SP, + )), + value: self.create_label(false).into(), + }), + ))); + } + args.push( + Expr::Object(ObjectLit { + span: DUMMY_SP, + props: args_props, + }) + .as_arg(), + ); + if let Some(cm) = self.create_sourcemap(expr.span.lo()) + { + args.push(cm.as_arg()); + } + } + return CallExpr { + span: expr.span, + type_args: expr.type_args, + args: expr.args, + callee: CallExpr { + span: DUMMY_SP, + type_args: None, + callee: Ident::new(i.sym.clone(), i.span) + .as_callee(), + args, + } + .as_callee(), + }; + } + } + } + if let PackageMeta::Namespace(c) = package { + if c.exported_names + .iter() + .any(|n| match_css_export(n, &m.prop)) + { + self.comments.add_pure_comment(expr.span.lo()); + if self.options.auto_label.unwrap_or(false) { + expr.args.push(self.create_label(true).as_arg()); + } + if let Some(cm) = self.create_sourcemap(expr.span.lo()) { + expr.args.push(cm.as_arg()); + } + } + } + } + } + } + _ => {} + } + } + expr + } + + fn fold_expr(&mut self, mut expr: Expr) -> Expr { + if let Expr::TaggedTpl(tagged_tpl) = &mut expr { + // styled('div')`` + match tagged_tpl.tag.as_mut() { + Expr::Call(call) => { + if let Callee::Expr(callee) = &call.callee { + if let Expr::Ident(i) = callee.as_ref() { + if let Some(PackageMeta::Named(ExprKind::Styled)) = + self.import_packages.get(&i.to_id()) + { + let mut callee = call.take(); + let mut object_props = Vec::with_capacity(2); + object_props.push(self.create_label_prop_node("target")); + self.comments.add_pure_comment(callee.span.lo()); + if self.options.auto_label.unwrap_or(false) { + object_props.push(PropOrSpread::Prop(Box::new( + Prop::KeyValue(KeyValueProp { + key: PropName::Ident(Ident::new( + "label".into(), + DUMMY_SP, + )), + value: self.create_label(false).into(), + }), + ))); + } + if let Some(cm) = self.create_sourcemap(call.span.lo()) { + callee.args.push(cm.as_arg()); + } + callee.args.push( + Expr::Object(ObjectLit { + span: DUMMY_SP, + props: object_props, + }) + .as_arg(), + ); + return Expr::Call(CallExpr { + span: DUMMY_SP, + callee: callee.as_callee(), + args: self + .create_args_from_tagged_tpl(&mut tagged_tpl.tpl) + .into_iter() + .map(|exp| exp.fold_children_with(self)) + .collect(), + type_args: None, + }); + } + } + } + } + // css`` + Expr::Ident(i) => { + if let Some(PackageMeta::Named(ExprKind::Css)) = + self.import_packages.get(&i.to_id()) + { + let mut args = self.create_args_from_tagged_tpl(&mut tagged_tpl.tpl); + if !self.in_jsx_element { + self.comments.add_pure_comment(i.span.lo()); + if self.options.auto_label.unwrap_or(false) { + args.push(self.create_label(false).as_arg()); + } + if let Some(cm) = self.create_sourcemap(tagged_tpl.span.lo()) { + args.push(cm.as_arg()); + } + } + return Expr::Call(CallExpr { + span: DUMMY_SP, + callee: i.take().as_callee(), + args, + type_args: None, + }); + } + } + // styled.div`` + // customEmotionReact.css`` + Expr::Member(member_expr) => { + if let Expr::Ident(i) = member_expr.obj.as_mut() { + if let Some(p) = self.import_packages.get(&i.to_id()) { + match p { + PackageMeta::Named(ExprKind::Styled) => { + if let MemberProp::Ident(prop) = &mut member_expr.prop { + let mut object_props = Vec::with_capacity(2); + object_props.push(self.create_label_prop_node("target")); + if self.options.auto_label.unwrap_or(false) { + object_props.push(PropOrSpread::Prop(Box::new( + Prop::KeyValue(KeyValueProp { + key: PropName::Ident(Ident::new( + "label".into(), + DUMMY_SP, + )), + value: self.create_label(false).into(), + }), + ))); + } + let mut args = + self.create_args_from_tagged_tpl(&mut tagged_tpl.tpl); + if let Some(cm) = + self.create_sourcemap(member_expr.span.lo()) + { + args.push(cm.as_arg()); + } + self.comments.add_pure_comment(member_expr.span.lo()); + return Expr::Call(CallExpr { + span: DUMMY_SP, + type_args: None, + callee: CallExpr { + type_args: None, + span: DUMMY_SP, + callee: i.take().as_callee(), + args: vec![ + prop.take().sym.as_arg(), + Expr::Object(ObjectLit { + span: DUMMY_SP, + props: object_props, + }) + .as_arg(), + ], + } + .as_callee(), + args, + }); + } + } + PackageMeta::Namespace(c) => { + if c.exported_names + .iter() + .any(|item| match_css_export(item, &member_expr.prop)) + { + self.comments.add_pure_comment(member_expr.span.lo()); + return Expr::Call(CallExpr { + span: DUMMY_SP, + callee: member_expr.take().as_callee(), + args: { + let mut args = self.create_args_from_tagged_tpl( + &mut tagged_tpl.tpl, + ); + if self.options.auto_label.unwrap_or(false) { + args.push(self.create_label(true).as_arg()); + } + if let Some(cm) = + self.create_sourcemap(tagged_tpl.span.lo()) + { + args.push(cm.as_arg()); + } + args + }, + type_args: None, + }); + } + } + _ => {} + } + } + } + } + _ => {} + } + } + + expr.fold_children_with(self) + } + + fn fold_jsx_element(&mut self, mut expr: JSXElement) -> JSXElement { + match &mut expr.opening.name { + JSXElementName::Ident(i) => { + if let Some(PackageMeta::Named(ExprKind::GlobalJSX)) = + self.import_packages.get(&i.to_id()) + { + self.rewrite_styles_attr(&mut expr.opening.attrs, i.span.lo()); + } + } + JSXElementName::JSXMemberExpr(member_exp) => { + if let JSXObject::Ident(i) = &member_exp.obj { + if let Some(PackageMeta::Namespace(EmotionModuleConfig { + exported_names, + .. + })) = self.import_packages.get(&i.to_id()) + { + if exported_names.iter().any(|item| { + matches!(item.kind, ExprKind::GlobalJSX) + && item.name == member_exp.prop.as_ref() + }) { + self.rewrite_styles_attr(&mut expr.opening.attrs, i.span.lo()); + } + } + } + } + _ => {} + }; + let dest_expr = expr.fold_children_with(self); + self.in_jsx_element = false; + dest_expr + } +} + +fn match_css_export(item: &ExportItem, prop: &MemberProp) -> bool { + if matches!(item.kind, ExprKind::Css) { + if let MemberProp::Ident(prop) = prop { + if item.name.as_str() == prop.sym.as_ref() { + return true; + } + } + } + false +} + +#[inline] +fn minify_css_string(input: &str, is_first_item: bool, is_last_item: bool) -> Cow { + let pattern = |c| c == '\n'; + let pattern_trim_spaces = |c| c == ' ' || c == '\n'; + SPACE_AROUND_COLON.replace_all( + input + .trim_matches(if is_first_item { + pattern_trim_spaces + } else { + pattern + }) + .trim_end_matches(if is_last_item { + pattern_trim_spaces + } else { + pattern + }), + "$s", + ) +} diff --git a/packages/next-swc/crates/core/src/lib.rs b/packages/next-swc/crates/core/src/lib.rs index 6e6c03a62787..dd13ea2af816 100644 --- a/packages/next-swc/crates/core/src/lib.rs +++ b/packages/next-swc/crates/core/src/lib.rs @@ -36,8 +36,9 @@ use std::cell::RefCell; use std::rc::Rc; use std::{path::PathBuf, sync::Arc}; use swc::config::ModuleConfig; +use swc_common::comments::Comments; use swc_common::{self, chain, pass::Optional}; -use swc_common::{SourceFile, SourceMap}; +use swc_common::{FileName, SourceFile, SourceMap}; use swc_ecmascript::ast::EsVersion; use swc_ecmascript::parser::parse_file_as_module; use swc_ecmascript::transforms::pass::noop; @@ -46,6 +47,7 @@ use swc_ecmascript::visit::Fold; pub mod amp_attributes; mod auto_cjs; pub mod disallow_re_export_all_in_page; +pub mod emotion; pub mod hook_optimizer; pub mod next_dynamic; pub mod next_ssg; @@ -97,13 +99,17 @@ pub struct TransformOptions { #[serde(default)] pub shake_exports: Option, + + #[serde(default)] + pub emotion: Option, } -pub fn custom_before_pass( +pub fn custom_before_pass<'a, C: Comments + 'a>( cm: Arc, file: Arc, - opts: &TransformOptions, -) -> impl Fold + '_ { + opts: &'a TransformOptions, + comments: C, +) -> impl Fold + 'a { #[cfg(target_arch = "wasm32")] let relay_plugin = noop(); @@ -122,7 +128,7 @@ pub fn custom_before_pass( chain!( disallow_re_export_all_in_page::disallow_re_export_all_in_page(opts.is_page_file), - styled_jsx::styled_jsx(cm, file.name.clone()), + styled_jsx::styled_jsx(cm.clone(), file.name.clone()), hook_optimizer::hook_optimizer(), match &opts.styled_components { Some(config) => { @@ -164,7 +170,27 @@ pub fn custom_before_pass( match &opts.shake_exports { Some(config) => Either::Left(shake_exports::shake_exports(config.clone())), None => Either::Right(noop()), - } + }, + opts.emotion + .as_ref() + .and_then(|config| { + if !config.enabled.unwrap_or(false) { + return None; + } + if let FileName::Real(path) = &file.name { + path.to_str().map(|_| { + Either::Left(emotion::EmotionTransformer::new( + config.clone(), + path, + cm, + comments, + )) + }) + } else { + None + } + }) + .unwrap_or_else(|| Either::Right(noop())), ) } diff --git a/packages/next-swc/crates/core/src/next_ssg.rs b/packages/next-swc/crates/core/src/next_ssg.rs index a4f389ce967a..a25e885abf65 100644 --- a/packages/next-swc/crates/core/src/next_ssg.rs +++ b/packages/next-swc/crates/core/src/next_ssg.rs @@ -44,6 +44,7 @@ struct State { } impl State { + #[allow(clippy::wrong_self_convention)] fn is_data_identifier(&mut self, i: &Ident) -> Result { let ssg_exports = &["getStaticProps", "getStaticPaths", "getServerSideProps"]; diff --git a/packages/next-swc/crates/core/src/styled_jsx/transform_css.rs b/packages/next-swc/crates/core/src/styled_jsx/transform_css.rs index 0d79a1187bc2..78d18085bc64 100644 --- a/packages/next-swc/crates/core/src/styled_jsx/transform_css.rs +++ b/packages/next-swc/crates/core/src/styled_jsx/transform_css.rs @@ -72,7 +72,7 @@ pub fn transform_css( let mut s = String::new(); { - let mut wr = BasicCssWriter::new(&mut s, BasicCssWriterConfig { indent: " " }); + let mut wr = BasicCssWriter::new(&mut s, None, BasicCssWriterConfig::default()); let mut gen = CodeGenerator::new(&mut wr, CodegenConfig { minify: true }); gen.emit(&ss).unwrap(); @@ -144,7 +144,7 @@ impl VisitMut for Namespacer { let mut code = String::new(); { - let mut wr = BasicCssWriter::new(&mut code, BasicCssWriterConfig { indent: " " }); + let mut wr = BasicCssWriter::new(&mut code, None, BasicCssWriterConfig::default()); let mut gen = CodeGenerator::new(&mut wr, CodegenConfig { minify: true }); gen.emit(&*node).unwrap(); @@ -500,7 +500,7 @@ where { let mut s = String::new(); { - let mut wr = BasicCssWriter::new(&mut s, BasicCssWriterConfig { indent: " " }); + let mut wr = BasicCssWriter::new(&mut s, None, BasicCssWriterConfig::default()); let mut gen = CodeGenerator::new(&mut wr, CodegenConfig { minify: true }); gen.emit(node).unwrap(); diff --git a/packages/next-swc/crates/core/tests/fixture.rs b/packages/next-swc/crates/core/tests/fixture.rs index 8b97b05ffdbb..ed9cf5b247b7 100644 --- a/packages/next-swc/crates/core/tests/fixture.rs +++ b/packages/next-swc/crates/core/tests/fixture.rs @@ -1,5 +1,6 @@ use next_swc::{ amp_attributes::amp_attributes, + emotion::{self, EmotionOptions}, next_dynamic::next_dynamic, next_ssg::next_ssg, page_config::page_config_test, @@ -13,8 +14,11 @@ use std::path::PathBuf; use swc_common::{chain, comments::SingleThreadedComments, FileName, Mark, Span, DUMMY_SP}; use swc_ecma_transforms_testing::{test, test_fixture}; use swc_ecmascript::{ - parser::{EsConfig, Syntax}, - transforms::{react::jsx, resolver}, + parser::{EsConfig, Syntax, TsConfig}, + transforms::{ + react::{jsx, Runtime}, + resolver, + }, }; use testing::fixture; @@ -25,6 +29,13 @@ fn syntax() -> Syntax { }) } +fn ts_syntax() -> Syntax { + Syntax::Typescript(TsConfig { + tsx: true, + ..Default::default() + }) +} + #[fixture("tests/fixture/amp/**/input.js")] fn amp_attributes_fixture(input: PathBuf) { let output = input.parent().unwrap().join("output.js"); @@ -260,3 +271,44 @@ fn shake_exports_fixture_default(input: PathBuf) { &output, ); } + +#[fixture("tests/fixture/emotion/*/input.tsx")] +fn next_emotion_fixture(input: PathBuf) { + let output = input.parent().unwrap().join("output.ts"); + test_fixture( + ts_syntax(), + &|tr| { + let top_level_mark = Mark::fresh(Mark::root()); + let jsx = jsx::( + tr.cm.clone(), + Some(tr.comments.as_ref().clone()), + swc_ecmascript::transforms::react::Options { + next: false, + runtime: Some(Runtime::Automatic), + throw_if_namespace: false, + development: false, + use_builtins: true, + use_spread: true, + ..Default::default() + }, + top_level_mark, + ); + chain!( + emotion::emotion( + EmotionOptions { + enabled: Some(true), + sourcemap: Some(true), + auto_label: Some(true), + ..Default::default() + }, + &PathBuf::from("input.ts"), + tr.cm.clone(), + tr.comments.as_ref().clone(), + ), + jsx + ) + }, + &input, + &output, + ); +} diff --git a/packages/next-swc/crates/core/tests/fixture/emotion/css-in-callback/input.tsx b/packages/next-swc/crates/core/tests/fixture/emotion/css-in-callback/input.tsx new file mode 100644 index 000000000000..f9e905cef18e --- /dev/null +++ b/packages/next-swc/crates/core/tests/fixture/emotion/css-in-callback/input.tsx @@ -0,0 +1,77 @@ +import { css, Global } from '@emotion/react' +import styled from '@emotion/styled' +import { PureComponent } from 'react' +import ReactDOM from 'react-dom' + +const stylesInCallback = (props: any) => + css({ + color: 'red', + background: 'yellow', + width: `${props.scale * 100}px`, + }) + +const styles = css({ + color: 'red', + width: '20px', +}) + +const styles2 = css` + color: red; + width: 20px; +` + +const DivContainer = styled.div({ + background: 'red', +}) + +const DivContainer2 = styled.div` + background: red; +` + +const SpanContainer = styled('span')({ + background: 'yellow', +}) + +const Container = styled('button')` + background: red; + ${stylesInCallback} + ${() => + css({ + background: 'red', + })} + color: yellow; + font-size: 12px; +` + +const Container2 = styled.div` + background: red; +` + +export class SimpleComponent extends PureComponent { + render() { + return ( + + + hello + + ) + } +} + +ReactDOM.render(, document.querySelector('#app')) diff --git a/packages/next-swc/crates/core/tests/fixture/emotion/css-in-callback/output.ts b/packages/next-swc/crates/core/tests/fixture/emotion/css-in-callback/output.ts new file mode 100644 index 000000000000..b0b8b7d33e49 --- /dev/null +++ b/packages/next-swc/crates/core/tests/fixture/emotion/css-in-callback/output.ts @@ -0,0 +1,62 @@ +import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime"; +import { css, Global } from "@emotion/react"; +import styled from "@emotion/styled"; +import { PureComponent } from "react"; +import ReactDOM from "react-dom"; +const stylesInCallback = (props: any)=>/*#__PURE__*/ css({ + color: "red", + background: "yellow", + width: `${props.scale * 100}px` + }, "label:stylesInCallback", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQudHMiLCJzb3VyY2VzIjpbImlucHV0LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgR2xvYmFsIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB7IFB1cmVDb21wb25lbnQgfSBmcm9tICdyZWFjdCdcbmltcG9ydCBSZWFjdERPTSBmcm9tICdyZWFjdC1kb20nXG5cbmNvbnN0IHN0eWxlc0luQ2FsbGJhY2sgPSAocHJvcHM6IGFueSkgPT5cbiAgY3NzKHtcbiAgICBjb2xvcjogJ3JlZCcsXG4gICAgYmFja2dyb3VuZDogJ3llbGxvdycsXG4gICAgd2lkdGg6IGAke3Byb3BzLnNjYWxlICogMTAwfXB4YCxcbiAgfSlcblxuY29uc3Qgc3R5bGVzID0gY3NzKHtcbiAgY29sb3I6ICdyZWQnLFxuICB3aWR0aDogJzIwcHgnLFxufSlcblxuY29uc3Qgc3R5bGVzMiA9IGNzc2BcbiAgY29sb3I6IHJlZDtcbiAgd2lkdGg6IDIwcHg7XG5gXG5cbmNvbnN0IERpdkNvbnRhaW5lciA9IHN0eWxlZC5kaXYoe1xuICBiYWNrZ3JvdW5kOiAncmVkJyxcbn0pXG5cbmNvbnN0IERpdkNvbnRhaW5lcjIgPSBzdHlsZWQuZGl2YFxuICBiYWNrZ3JvdW5kOiByZWQ7XG5gXG5cbmNvbnN0IFNwYW5Db250YWluZXIgPSBzdHlsZWQoJ3NwYW4nKSh7XG4gIGJhY2tncm91bmQ6ICd5ZWxsb3cnLFxufSlcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKCdidXR0b24nKWBcbiAgYmFja2dyb3VuZDogcmVkO1xuICAke3N0eWxlc0luQ2FsbGJhY2t9XG4gICR7KCkgPT5cbiAgICBjc3Moe1xuICAgICAgYmFja2dyb3VuZDogJ3JlZCcsXG4gICAgfSl9XG4gIGNvbG9yOiB5ZWxsb3c7XG4gIGZvbnQtc2l6ZTogMTJweDtcbmBcblxuY29uc3QgQ29udGFpbmVyMiA9IHN0eWxlZC5kaXZgXG4gIGJhY2tncm91bmQ6IHJlZDtcbmBcblxuZXhwb3J0IGNsYXNzIFNpbXBsZUNvbXBvbmVudCBleHRlbmRzIFB1cmVDb21wb25lbnQge1xuICByZW5kZXIoKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxDb250YWluZXJcbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgY29sb3I6IGhvdHBpbms7XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIDxHbG9iYWxcbiAgICAgICAgICBzdHlsZXM9e2Nzc2BcbiAgICAgICAgICAgIGh0bWwsXG4gICAgICAgICAgICBib2R5IHtcbiAgICAgICAgICAgICAgcGFkZGluZzogM3JlbSAxcmVtO1xuICAgICAgICAgICAgICBtYXJnaW46IDA7XG4gICAgICAgICAgICAgIGJhY2tncm91bmQ6IHBhcGF5YXdoaXA7XG4gICAgICAgICAgICAgIG1pbi1oZWlnaHQ6IDEwMCU7XG4gICAgICAgICAgICAgIGZvbnQtZmFtaWx5OiBIZWx2ZXRpY2EsIEFyaWFsLCBzYW5zLXNlcmlmO1xuICAgICAgICAgICAgICBmb250LXNpemU6IDI0cHg7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgYH1cbiAgICAgICAgLz5cbiAgICAgICAgPHNwYW4+aGVsbG88L3NwYW4+XG4gICAgICA8L0NvbnRhaW5lcj5cbiAgICApXG4gIH1cbn1cblxuUmVhY3RET00ucmVuZGVyKDxTaW1wbGVDb21wb25lbnQgLz4sIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoJyNhcHAnKSlcbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNRSJ9 */") +; +const styles = /*#__PURE__*/ css({ + color: "red", + width: "20px" +}, "label:styles", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQudHMiLCJzb3VyY2VzIjpbImlucHV0LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgR2xvYmFsIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB7IFB1cmVDb21wb25lbnQgfSBmcm9tICdyZWFjdCdcbmltcG9ydCBSZWFjdERPTSBmcm9tICdyZWFjdC1kb20nXG5cbmNvbnN0IHN0eWxlc0luQ2FsbGJhY2sgPSAocHJvcHM6IGFueSkgPT5cbiAgY3NzKHtcbiAgICBjb2xvcjogJ3JlZCcsXG4gICAgYmFja2dyb3VuZDogJ3llbGxvdycsXG4gICAgd2lkdGg6IGAke3Byb3BzLnNjYWxlICogMTAwfXB4YCxcbiAgfSlcblxuY29uc3Qgc3R5bGVzID0gY3NzKHtcbiAgY29sb3I6ICdyZWQnLFxuICB3aWR0aDogJzIwcHgnLFxufSlcblxuY29uc3Qgc3R5bGVzMiA9IGNzc2BcbiAgY29sb3I6IHJlZDtcbiAgd2lkdGg6IDIwcHg7XG5gXG5cbmNvbnN0IERpdkNvbnRhaW5lciA9IHN0eWxlZC5kaXYoe1xuICBiYWNrZ3JvdW5kOiAncmVkJyxcbn0pXG5cbmNvbnN0IERpdkNvbnRhaW5lcjIgPSBzdHlsZWQuZGl2YFxuICBiYWNrZ3JvdW5kOiByZWQ7XG5gXG5cbmNvbnN0IFNwYW5Db250YWluZXIgPSBzdHlsZWQoJ3NwYW4nKSh7XG4gIGJhY2tncm91bmQ6ICd5ZWxsb3cnLFxufSlcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKCdidXR0b24nKWBcbiAgYmFja2dyb3VuZDogcmVkO1xuICAke3N0eWxlc0luQ2FsbGJhY2t9XG4gICR7KCkgPT5cbiAgICBjc3Moe1xuICAgICAgYmFja2dyb3VuZDogJ3JlZCcsXG4gICAgfSl9XG4gIGNvbG9yOiB5ZWxsb3c7XG4gIGZvbnQtc2l6ZTogMTJweDtcbmBcblxuY29uc3QgQ29udGFpbmVyMiA9IHN0eWxlZC5kaXZgXG4gIGJhY2tncm91bmQ6IHJlZDtcbmBcblxuZXhwb3J0IGNsYXNzIFNpbXBsZUNvbXBvbmVudCBleHRlbmRzIFB1cmVDb21wb25lbnQge1xuICByZW5kZXIoKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxDb250YWluZXJcbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgY29sb3I6IGhvdHBpbms7XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIDxHbG9iYWxcbiAgICAgICAgICBzdHlsZXM9e2Nzc2BcbiAgICAgICAgICAgIGh0bWwsXG4gICAgICAgICAgICBib2R5IHtcbiAgICAgICAgICAgICAgcGFkZGluZzogM3JlbSAxcmVtO1xuICAgICAgICAgICAgICBtYXJnaW46IDA7XG4gICAgICAgICAgICAgIGJhY2tncm91bmQ6IHBhcGF5YXdoaXA7XG4gICAgICAgICAgICAgIG1pbi1oZWlnaHQ6IDEwMCU7XG4gICAgICAgICAgICAgIGZvbnQtZmFtaWx5OiBIZWx2ZXRpY2EsIEFyaWFsLCBzYW5zLXNlcmlmO1xuICAgICAgICAgICAgICBmb250LXNpemU6IDI0cHg7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgYH1cbiAgICAgICAgLz5cbiAgICAgICAgPHNwYW4+aGVsbG88L3NwYW4+XG4gICAgICA8L0NvbnRhaW5lcj5cbiAgICApXG4gIH1cbn1cblxuUmVhY3RET00ucmVuZGVyKDxTaW1wbGVDb21wb25lbnQgLz4sIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoJyNhcHAnKSlcbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFZZSJ9 */"); +const styles2 = /*#__PURE__*/ css("color:red;width:20px;", "styles2", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQudHMiLCJzb3VyY2VzIjpbImlucHV0LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgR2xvYmFsIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB7IFB1cmVDb21wb25lbnQgfSBmcm9tICdyZWFjdCdcbmltcG9ydCBSZWFjdERPTSBmcm9tICdyZWFjdC1kb20nXG5cbmNvbnN0IHN0eWxlc0luQ2FsbGJhY2sgPSAocHJvcHM6IGFueSkgPT5cbiAgY3NzKHtcbiAgICBjb2xvcjogJ3JlZCcsXG4gICAgYmFja2dyb3VuZDogJ3llbGxvdycsXG4gICAgd2lkdGg6IGAke3Byb3BzLnNjYWxlICogMTAwfXB4YCxcbiAgfSlcblxuY29uc3Qgc3R5bGVzID0gY3NzKHtcbiAgY29sb3I6ICdyZWQnLFxuICB3aWR0aDogJzIwcHgnLFxufSlcblxuY29uc3Qgc3R5bGVzMiA9IGNzc2BcbiAgY29sb3I6IHJlZDtcbiAgd2lkdGg6IDIwcHg7XG5gXG5cbmNvbnN0IERpdkNvbnRhaW5lciA9IHN0eWxlZC5kaXYoe1xuICBiYWNrZ3JvdW5kOiAncmVkJyxcbn0pXG5cbmNvbnN0IERpdkNvbnRhaW5lcjIgPSBzdHlsZWQuZGl2YFxuICBiYWNrZ3JvdW5kOiByZWQ7XG5gXG5cbmNvbnN0IFNwYW5Db250YWluZXIgPSBzdHlsZWQoJ3NwYW4nKSh7XG4gIGJhY2tncm91bmQ6ICd5ZWxsb3cnLFxufSlcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKCdidXR0b24nKWBcbiAgYmFja2dyb3VuZDogcmVkO1xuICAke3N0eWxlc0luQ2FsbGJhY2t9XG4gICR7KCkgPT5cbiAgICBjc3Moe1xuICAgICAgYmFja2dyb3VuZDogJ3JlZCcsXG4gICAgfSl9XG4gIGNvbG9yOiB5ZWxsb3c7XG4gIGZvbnQtc2l6ZTogMTJweDtcbmBcblxuY29uc3QgQ29udGFpbmVyMiA9IHN0eWxlZC5kaXZgXG4gIGJhY2tncm91bmQ6IHJlZDtcbmBcblxuZXhwb3J0IGNsYXNzIFNpbXBsZUNvbXBvbmVudCBleHRlbmRzIFB1cmVDb21wb25lbnQge1xuICByZW5kZXIoKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxDb250YWluZXJcbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgY29sb3I6IGhvdHBpbms7XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIDxHbG9iYWxcbiAgICAgICAgICBzdHlsZXM9e2Nzc2BcbiAgICAgICAgICAgIGh0bWwsXG4gICAgICAgICAgICBib2R5IHtcbiAgICAgICAgICAgICAgcGFkZGluZzogM3JlbSAxcmVtO1xuICAgICAgICAgICAgICBtYXJnaW46IDA7XG4gICAgICAgICAgICAgIGJhY2tncm91bmQ6IHBhcGF5YXdoaXA7XG4gICAgICAgICAgICAgIG1pbi1oZWlnaHQ6IDEwMCU7XG4gICAgICAgICAgICAgIGZvbnQtZmFtaWx5OiBIZWx2ZXRpY2EsIEFyaWFsLCBzYW5zLXNlcmlmO1xuICAgICAgICAgICAgICBmb250LXNpemU6IDI0cHg7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgYH1cbiAgICAgICAgLz5cbiAgICAgICAgPHNwYW4+aGVsbG88L3NwYW4+XG4gICAgICA8L0NvbnRhaW5lcj5cbiAgICApXG4gIH1cbn1cblxuUmVhY3RET00ucmVuZGVyKDxTaW1wbGVDb21wb25lbnQgLz4sIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoJyNhcHAnKSlcbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQmdCIn0= */"); +const DivContainer = /*#__PURE__*/ styled("div", { + target: "ekie5mj0", + label: "DivContainer" +}, "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQudHMiLCJzb3VyY2VzIjpbImlucHV0LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgR2xvYmFsIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB7IFB1cmVDb21wb25lbnQgfSBmcm9tICdyZWFjdCdcbmltcG9ydCBSZWFjdERPTSBmcm9tICdyZWFjdC1kb20nXG5cbmNvbnN0IHN0eWxlc0luQ2FsbGJhY2sgPSAocHJvcHM6IGFueSkgPT5cbiAgY3NzKHtcbiAgICBjb2xvcjogJ3JlZCcsXG4gICAgYmFja2dyb3VuZDogJ3llbGxvdycsXG4gICAgd2lkdGg6IGAke3Byb3BzLnNjYWxlICogMTAwfXB4YCxcbiAgfSlcblxuY29uc3Qgc3R5bGVzID0gY3NzKHtcbiAgY29sb3I6ICdyZWQnLFxuICB3aWR0aDogJzIwcHgnLFxufSlcblxuY29uc3Qgc3R5bGVzMiA9IGNzc2BcbiAgY29sb3I6IHJlZDtcbiAgd2lkdGg6IDIwcHg7XG5gXG5cbmNvbnN0IERpdkNvbnRhaW5lciA9IHN0eWxlZC5kaXYoe1xuICBiYWNrZ3JvdW5kOiAncmVkJyxcbn0pXG5cbmNvbnN0IERpdkNvbnRhaW5lcjIgPSBzdHlsZWQuZGl2YFxuICBiYWNrZ3JvdW5kOiByZWQ7XG5gXG5cbmNvbnN0IFNwYW5Db250YWluZXIgPSBzdHlsZWQoJ3NwYW4nKSh7XG4gIGJhY2tncm91bmQ6ICd5ZWxsb3cnLFxufSlcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKCdidXR0b24nKWBcbiAgYmFja2dyb3VuZDogcmVkO1xuICAke3N0eWxlc0luQ2FsbGJhY2t9XG4gICR7KCkgPT5cbiAgICBjc3Moe1xuICAgICAgYmFja2dyb3VuZDogJ3JlZCcsXG4gICAgfSl9XG4gIGNvbG9yOiB5ZWxsb3c7XG4gIGZvbnQtc2l6ZTogMTJweDtcbmBcblxuY29uc3QgQ29udGFpbmVyMiA9IHN0eWxlZC5kaXZgXG4gIGJhY2tncm91bmQ6IHJlZDtcbmBcblxuZXhwb3J0IGNsYXNzIFNpbXBsZUNvbXBvbmVudCBleHRlbmRzIFB1cmVDb21wb25lbnQge1xuICByZW5kZXIoKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxDb250YWluZXJcbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgY29sb3I6IGhvdHBpbms7XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIDxHbG9iYWxcbiAgICAgICAgICBzdHlsZXM9e2Nzc2BcbiAgICAgICAgICAgIGh0bWwsXG4gICAgICAgICAgICBib2R5IHtcbiAgICAgICAgICAgICAgcGFkZGluZzogM3JlbSAxcmVtO1xuICAgICAgICAgICAgICBtYXJnaW46IDA7XG4gICAgICAgICAgICAgIGJhY2tncm91bmQ6IHBhcGF5YXdoaXA7XG4gICAgICAgICAgICAgIG1pbi1oZWlnaHQ6IDEwMCU7XG4gICAgICAgICAgICAgIGZvbnQtZmFtaWx5OiBIZWx2ZXRpY2EsIEFyaWFsLCBzYW5zLXNlcmlmO1xuICAgICAgICAgICAgICBmb250LXNpemU6IDI0cHg7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgYH1cbiAgICAgICAgLz5cbiAgICAgICAgPHNwYW4+aGVsbG88L3NwYW4+XG4gICAgICA8L0NvbnRhaW5lcj5cbiAgICApXG4gIH1cbn1cblxuUmVhY3RET00ucmVuZGVyKDxTaW1wbGVDb21wb25lbnQgLz4sIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoJyNhcHAnKSlcbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzQnFCIn0= */")({ + background: "red" +}); +const DivContainer2 = /*#__PURE__*/ styled("div", { + target: "ekie5mj1", + label: "DivContainer2" +})("background:red;", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQudHMiLCJzb3VyY2VzIjpbImlucHV0LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgR2xvYmFsIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB7IFB1cmVDb21wb25lbnQgfSBmcm9tICdyZWFjdCdcbmltcG9ydCBSZWFjdERPTSBmcm9tICdyZWFjdC1kb20nXG5cbmNvbnN0IHN0eWxlc0luQ2FsbGJhY2sgPSAocHJvcHM6IGFueSkgPT5cbiAgY3NzKHtcbiAgICBjb2xvcjogJ3JlZCcsXG4gICAgYmFja2dyb3VuZDogJ3llbGxvdycsXG4gICAgd2lkdGg6IGAke3Byb3BzLnNjYWxlICogMTAwfXB4YCxcbiAgfSlcblxuY29uc3Qgc3R5bGVzID0gY3NzKHtcbiAgY29sb3I6ICdyZWQnLFxuICB3aWR0aDogJzIwcHgnLFxufSlcblxuY29uc3Qgc3R5bGVzMiA9IGNzc2BcbiAgY29sb3I6IHJlZDtcbiAgd2lkdGg6IDIwcHg7XG5gXG5cbmNvbnN0IERpdkNvbnRhaW5lciA9IHN0eWxlZC5kaXYoe1xuICBiYWNrZ3JvdW5kOiAncmVkJyxcbn0pXG5cbmNvbnN0IERpdkNvbnRhaW5lcjIgPSBzdHlsZWQuZGl2YFxuICBiYWNrZ3JvdW5kOiByZWQ7XG5gXG5cbmNvbnN0IFNwYW5Db250YWluZXIgPSBzdHlsZWQoJ3NwYW4nKSh7XG4gIGJhY2tncm91bmQ6ICd5ZWxsb3cnLFxufSlcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKCdidXR0b24nKWBcbiAgYmFja2dyb3VuZDogcmVkO1xuICAke3N0eWxlc0luQ2FsbGJhY2t9XG4gICR7KCkgPT5cbiAgICBjc3Moe1xuICAgICAgYmFja2dyb3VuZDogJ3JlZCcsXG4gICAgfSl9XG4gIGNvbG9yOiB5ZWxsb3c7XG4gIGZvbnQtc2l6ZTogMTJweDtcbmBcblxuY29uc3QgQ29udGFpbmVyMiA9IHN0eWxlZC5kaXZgXG4gIGJhY2tncm91bmQ6IHJlZDtcbmBcblxuZXhwb3J0IGNsYXNzIFNpbXBsZUNvbXBvbmVudCBleHRlbmRzIFB1cmVDb21wb25lbnQge1xuICByZW5kZXIoKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxDb250YWluZXJcbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgY29sb3I6IGhvdHBpbms7XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIDxHbG9iYWxcbiAgICAgICAgICBzdHlsZXM9e2Nzc2BcbiAgICAgICAgICAgIGh0bWwsXG4gICAgICAgICAgICBib2R5IHtcbiAgICAgICAgICAgICAgcGFkZGluZzogM3JlbSAxcmVtO1xuICAgICAgICAgICAgICBtYXJnaW46IDA7XG4gICAgICAgICAgICAgIGJhY2tncm91bmQ6IHBhcGF5YXdoaXA7XG4gICAgICAgICAgICAgIG1pbi1oZWlnaHQ6IDEwMCU7XG4gICAgICAgICAgICAgIGZvbnQtZmFtaWx5OiBIZWx2ZXRpY2EsIEFyaWFsLCBzYW5zLXNlcmlmO1xuICAgICAgICAgICAgICBmb250LXNpemU6IDI0cHg7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgYH1cbiAgICAgICAgLz5cbiAgICAgICAgPHNwYW4+aGVsbG88L3NwYW4+XG4gICAgICA8L0NvbnRhaW5lcj5cbiAgICApXG4gIH1cbn1cblxuUmVhY3RET00ucmVuZGVyKDxTaW1wbGVDb21wb25lbnQgLz4sIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoJyNhcHAnKSlcbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEwQnNCIn0= */"); +const SpanContainer = /*#__PURE__*/ styled("span", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQudHMiLCJzb3VyY2VzIjpbImlucHV0LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgR2xvYmFsIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB7IFB1cmVDb21wb25lbnQgfSBmcm9tICdyZWFjdCdcbmltcG9ydCBSZWFjdERPTSBmcm9tICdyZWFjdC1kb20nXG5cbmNvbnN0IHN0eWxlc0luQ2FsbGJhY2sgPSAocHJvcHM6IGFueSkgPT5cbiAgY3NzKHtcbiAgICBjb2xvcjogJ3JlZCcsXG4gICAgYmFja2dyb3VuZDogJ3llbGxvdycsXG4gICAgd2lkdGg6IGAke3Byb3BzLnNjYWxlICogMTAwfXB4YCxcbiAgfSlcblxuY29uc3Qgc3R5bGVzID0gY3NzKHtcbiAgY29sb3I6ICdyZWQnLFxuICB3aWR0aDogJzIwcHgnLFxufSlcblxuY29uc3Qgc3R5bGVzMiA9IGNzc2BcbiAgY29sb3I6IHJlZDtcbiAgd2lkdGg6IDIwcHg7XG5gXG5cbmNvbnN0IERpdkNvbnRhaW5lciA9IHN0eWxlZC5kaXYoe1xuICBiYWNrZ3JvdW5kOiAncmVkJyxcbn0pXG5cbmNvbnN0IERpdkNvbnRhaW5lcjIgPSBzdHlsZWQuZGl2YFxuICBiYWNrZ3JvdW5kOiByZWQ7XG5gXG5cbmNvbnN0IFNwYW5Db250YWluZXIgPSBzdHlsZWQoJ3NwYW4nKSh7XG4gIGJhY2tncm91bmQ6ICd5ZWxsb3cnLFxufSlcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKCdidXR0b24nKWBcbiAgYmFja2dyb3VuZDogcmVkO1xuICAke3N0eWxlc0luQ2FsbGJhY2t9XG4gICR7KCkgPT5cbiAgICBjc3Moe1xuICAgICAgYmFja2dyb3VuZDogJ3JlZCcsXG4gICAgfSl9XG4gIGNvbG9yOiB5ZWxsb3c7XG4gIGZvbnQtc2l6ZTogMTJweDtcbmBcblxuY29uc3QgQ29udGFpbmVyMiA9IHN0eWxlZC5kaXZgXG4gIGJhY2tncm91bmQ6IHJlZDtcbmBcblxuZXhwb3J0IGNsYXNzIFNpbXBsZUNvbXBvbmVudCBleHRlbmRzIFB1cmVDb21wb25lbnQge1xuICByZW5kZXIoKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxDb250YWluZXJcbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgY29sb3I6IGhvdHBpbms7XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIDxHbG9iYWxcbiAgICAgICAgICBzdHlsZXM9e2Nzc2BcbiAgICAgICAgICAgIGh0bWwsXG4gICAgICAgICAgICBib2R5IHtcbiAgICAgICAgICAgICAgcGFkZGluZzogM3JlbSAxcmVtO1xuICAgICAgICAgICAgICBtYXJnaW46IDA7XG4gICAgICAgICAgICAgIGJhY2tncm91bmQ6IHBhcGF5YXdoaXA7XG4gICAgICAgICAgICAgIG1pbi1oZWlnaHQ6IDEwMCU7XG4gICAgICAgICAgICAgIGZvbnQtZmFtaWx5OiBIZWx2ZXRpY2EsIEFyaWFsLCBzYW5zLXNlcmlmO1xuICAgICAgICAgICAgICBmb250LXNpemU6IDI0cHg7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgYH1cbiAgICAgICAgLz5cbiAgICAgICAgPHNwYW4+aGVsbG88L3NwYW4+XG4gICAgICA8L0NvbnRhaW5lcj5cbiAgICApXG4gIH1cbn1cblxuUmVhY3RET00ucmVuZGVyKDxTaW1wbGVDb21wb25lbnQgLz4sIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoJyNhcHAnKSlcbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE4QnNCIn0= */", { + target: "ekie5mj2", + label: "SpanContainer" +})({ + background: "yellow" +}); +const Container = /*#__PURE__*/ styled("button", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQudHMiLCJzb3VyY2VzIjpbImlucHV0LnRzIl0sInNvdXJjZXNDb250ZW50IjpbIlJlYWN0LmNyZWF0ZUVsZW1lbnQiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEifQ== */", { + target: "ekie5mj3", + label: "Container" +})("background:red;", stylesInCallback, ()=>/*#__PURE__*/ css({ + background: "red" + }, "label:Container", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQudHMiLCJzb3VyY2VzIjpbImlucHV0LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgR2xvYmFsIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB7IFB1cmVDb21wb25lbnQgfSBmcm9tICdyZWFjdCdcbmltcG9ydCBSZWFjdERPTSBmcm9tICdyZWFjdC1kb20nXG5cbmNvbnN0IHN0eWxlc0luQ2FsbGJhY2sgPSAocHJvcHM6IGFueSkgPT5cbiAgY3NzKHtcbiAgICBjb2xvcjogJ3JlZCcsXG4gICAgYmFja2dyb3VuZDogJ3llbGxvdycsXG4gICAgd2lkdGg6IGAke3Byb3BzLnNjYWxlICogMTAwfXB4YCxcbiAgfSlcblxuY29uc3Qgc3R5bGVzID0gY3NzKHtcbiAgY29sb3I6ICdyZWQnLFxuICB3aWR0aDogJzIwcHgnLFxufSlcblxuY29uc3Qgc3R5bGVzMiA9IGNzc2BcbiAgY29sb3I6IHJlZDtcbiAgd2lkdGg6IDIwcHg7XG5gXG5cbmNvbnN0IERpdkNvbnRhaW5lciA9IHN0eWxlZC5kaXYoe1xuICBiYWNrZ3JvdW5kOiAncmVkJyxcbn0pXG5cbmNvbnN0IERpdkNvbnRhaW5lcjIgPSBzdHlsZWQuZGl2YFxuICBiYWNrZ3JvdW5kOiByZWQ7XG5gXG5cbmNvbnN0IFNwYW5Db250YWluZXIgPSBzdHlsZWQoJ3NwYW4nKSh7XG4gIGJhY2tncm91bmQ6ICd5ZWxsb3cnLFxufSlcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKCdidXR0b24nKWBcbiAgYmFja2dyb3VuZDogcmVkO1xuICAke3N0eWxlc0luQ2FsbGJhY2t9XG4gICR7KCkgPT5cbiAgICBjc3Moe1xuICAgICAgYmFja2dyb3VuZDogJ3JlZCcsXG4gICAgfSl9XG4gIGNvbG9yOiB5ZWxsb3c7XG4gIGZvbnQtc2l6ZTogMTJweDtcbmBcblxuY29uc3QgQ29udGFpbmVyMiA9IHN0eWxlZC5kaXZgXG4gIGJhY2tncm91bmQ6IHJlZDtcbmBcblxuZXhwb3J0IGNsYXNzIFNpbXBsZUNvbXBvbmVudCBleHRlbmRzIFB1cmVDb21wb25lbnQge1xuICByZW5kZXIoKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxDb250YWluZXJcbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgY29sb3I6IGhvdHBpbms7XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIDxHbG9iYWxcbiAgICAgICAgICBzdHlsZXM9e2Nzc2BcbiAgICAgICAgICAgIGh0bWwsXG4gICAgICAgICAgICBib2R5IHtcbiAgICAgICAgICAgICAgcGFkZGluZzogM3JlbSAxcmVtO1xuICAgICAgICAgICAgICBtYXJnaW46IDA7XG4gICAgICAgICAgICAgIGJhY2tncm91bmQ6IHBhcGF5YXdoaXA7XG4gICAgICAgICAgICAgIG1pbi1oZWlnaHQ6IDEwMCU7XG4gICAgICAgICAgICAgIGZvbnQtZmFtaWx5OiBIZWx2ZXRpY2EsIEFyaWFsLCBzYW5zLXNlcmlmO1xuICAgICAgICAgICAgICBmb250LXNpemU6IDI0cHg7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgYH1cbiAgICAgICAgLz5cbiAgICAgICAgPHNwYW4+aGVsbG88L3NwYW4+XG4gICAgICA8L0NvbnRhaW5lcj5cbiAgICApXG4gIH1cbn1cblxuUmVhY3RET00ucmVuZGVyKDxTaW1wbGVDb21wb25lbnQgLz4sIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoJyNhcHAnKSlcbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzQ0kifQ== */") +, " color:yellow;font-size:12px;"); +const Container2 = /*#__PURE__*/ styled("div", { + target: "ekie5mj4", + label: "Container2" +})("background:red;", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQudHMiLCJzb3VyY2VzIjpbImlucHV0LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgR2xvYmFsIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB7IFB1cmVDb21wb25lbnQgfSBmcm9tICdyZWFjdCdcbmltcG9ydCBSZWFjdERPTSBmcm9tICdyZWFjdC1kb20nXG5cbmNvbnN0IHN0eWxlc0luQ2FsbGJhY2sgPSAocHJvcHM6IGFueSkgPT5cbiAgY3NzKHtcbiAgICBjb2xvcjogJ3JlZCcsXG4gICAgYmFja2dyb3VuZDogJ3llbGxvdycsXG4gICAgd2lkdGg6IGAke3Byb3BzLnNjYWxlICogMTAwfXB4YCxcbiAgfSlcblxuY29uc3Qgc3R5bGVzID0gY3NzKHtcbiAgY29sb3I6ICdyZWQnLFxuICB3aWR0aDogJzIwcHgnLFxufSlcblxuY29uc3Qgc3R5bGVzMiA9IGNzc2BcbiAgY29sb3I6IHJlZDtcbiAgd2lkdGg6IDIwcHg7XG5gXG5cbmNvbnN0IERpdkNvbnRhaW5lciA9IHN0eWxlZC5kaXYoe1xuICBiYWNrZ3JvdW5kOiAncmVkJyxcbn0pXG5cbmNvbnN0IERpdkNvbnRhaW5lcjIgPSBzdHlsZWQuZGl2YFxuICBiYWNrZ3JvdW5kOiByZWQ7XG5gXG5cbmNvbnN0IFNwYW5Db250YWluZXIgPSBzdHlsZWQoJ3NwYW4nKSh7XG4gIGJhY2tncm91bmQ6ICd5ZWxsb3cnLFxufSlcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKCdidXR0b24nKWBcbiAgYmFja2dyb3VuZDogcmVkO1xuICAke3N0eWxlc0luQ2FsbGJhY2t9XG4gICR7KCkgPT5cbiAgICBjc3Moe1xuICAgICAgYmFja2dyb3VuZDogJ3JlZCcsXG4gICAgfSl9XG4gIGNvbG9yOiB5ZWxsb3c7XG4gIGZvbnQtc2l6ZTogMTJweDtcbmBcblxuY29uc3QgQ29udGFpbmVyMiA9IHN0eWxlZC5kaXZgXG4gIGJhY2tncm91bmQ6IHJlZDtcbmBcblxuZXhwb3J0IGNsYXNzIFNpbXBsZUNvbXBvbmVudCBleHRlbmRzIFB1cmVDb21wb25lbnQge1xuICByZW5kZXIoKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxDb250YWluZXJcbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgY29sb3I6IGhvdHBpbms7XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIDxHbG9iYWxcbiAgICAgICAgICBzdHlsZXM9e2Nzc2BcbiAgICAgICAgICAgIGh0bWwsXG4gICAgICAgICAgICBib2R5IHtcbiAgICAgICAgICAgICAgcGFkZGluZzogM3JlbSAxcmVtO1xuICAgICAgICAgICAgICBtYXJnaW46IDA7XG4gICAgICAgICAgICAgIGJhY2tncm91bmQ6IHBhcGF5YXdoaXA7XG4gICAgICAgICAgICAgIG1pbi1oZWlnaHQ6IDEwMCU7XG4gICAgICAgICAgICAgIGZvbnQtZmFtaWx5OiBIZWx2ZXRpY2EsIEFyaWFsLCBzYW5zLXNlcmlmO1xuICAgICAgICAgICAgICBmb250LXNpemU6IDI0cHg7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgYH1cbiAgICAgICAgLz5cbiAgICAgICAgPHNwYW4+aGVsbG88L3NwYW4+XG4gICAgICA8L0NvbnRhaW5lcj5cbiAgICApXG4gIH1cbn1cblxuUmVhY3RET00ucmVuZGVyKDxTaW1wbGVDb21wb25lbnQgLz4sIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoJyNhcHAnKSlcbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE2Q21CIn0= */"); +export class SimpleComponent extends PureComponent { + render() { + return /*#__PURE__*/ _jsxs(Container, { + css: /*#__PURE__*/ css("color:hotpink;", "Container2", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQudHMiLCJzb3VyY2VzIjpbImlucHV0LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgR2xvYmFsIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB7IFB1cmVDb21wb25lbnQgfSBmcm9tICdyZWFjdCdcbmltcG9ydCBSZWFjdERPTSBmcm9tICdyZWFjdC1kb20nXG5cbmNvbnN0IHN0eWxlc0luQ2FsbGJhY2sgPSAocHJvcHM6IGFueSkgPT5cbiAgY3NzKHtcbiAgICBjb2xvcjogJ3JlZCcsXG4gICAgYmFja2dyb3VuZDogJ3llbGxvdycsXG4gICAgd2lkdGg6IGAke3Byb3BzLnNjYWxlICogMTAwfXB4YCxcbiAgfSlcblxuY29uc3Qgc3R5bGVzID0gY3NzKHtcbiAgY29sb3I6ICdyZWQnLFxuICB3aWR0aDogJzIwcHgnLFxufSlcblxuY29uc3Qgc3R5bGVzMiA9IGNzc2BcbiAgY29sb3I6IHJlZDtcbiAgd2lkdGg6IDIwcHg7XG5gXG5cbmNvbnN0IERpdkNvbnRhaW5lciA9IHN0eWxlZC5kaXYoe1xuICBiYWNrZ3JvdW5kOiAncmVkJyxcbn0pXG5cbmNvbnN0IERpdkNvbnRhaW5lcjIgPSBzdHlsZWQuZGl2YFxuICBiYWNrZ3JvdW5kOiByZWQ7XG5gXG5cbmNvbnN0IFNwYW5Db250YWluZXIgPSBzdHlsZWQoJ3NwYW4nKSh7XG4gIGJhY2tncm91bmQ6ICd5ZWxsb3cnLFxufSlcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKCdidXR0b24nKWBcbiAgYmFja2dyb3VuZDogcmVkO1xuICAke3N0eWxlc0luQ2FsbGJhY2t9XG4gICR7KCkgPT5cbiAgICBjc3Moe1xuICAgICAgYmFja2dyb3VuZDogJ3JlZCcsXG4gICAgfSl9XG4gIGNvbG9yOiB5ZWxsb3c7XG4gIGZvbnQtc2l6ZTogMTJweDtcbmBcblxuY29uc3QgQ29udGFpbmVyMiA9IHN0eWxlZC5kaXZgXG4gIGJhY2tncm91bmQ6IHJlZDtcbmBcblxuZXhwb3J0IGNsYXNzIFNpbXBsZUNvbXBvbmVudCBleHRlbmRzIFB1cmVDb21wb25lbnQge1xuICByZW5kZXIoKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxDb250YWluZXJcbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgY29sb3I6IGhvdHBpbms7XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIDxHbG9iYWxcbiAgICAgICAgICBzdHlsZXM9e2Nzc2BcbiAgICAgICAgICAgIGh0bWwsXG4gICAgICAgICAgICBib2R5IHtcbiAgICAgICAgICAgICAgcGFkZGluZzogM3JlbSAxcmVtO1xuICAgICAgICAgICAgICBtYXJnaW46IDA7XG4gICAgICAgICAgICAgIGJhY2tncm91bmQ6IHBhcGF5YXdoaXA7XG4gICAgICAgICAgICAgIG1pbi1oZWlnaHQ6IDEwMCU7XG4gICAgICAgICAgICAgIGZvbnQtZmFtaWx5OiBIZWx2ZXRpY2EsIEFyaWFsLCBzYW5zLXNlcmlmO1xuICAgICAgICAgICAgICBmb250LXNpemU6IDI0cHg7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgYH1cbiAgICAgICAgLz5cbiAgICAgICAgPHNwYW4+aGVsbG88L3NwYW4+XG4gICAgICA8L0NvbnRhaW5lcj5cbiAgICApXG4gIH1cbn1cblxuUmVhY3RET00ucmVuZGVyKDxTaW1wbGVDb21wb25lbnQgLz4sIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoJyNhcHAnKSlcbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFxRGEifQ== */"), + children: [ + /*#__PURE__*/ _jsx(Global, { + styles: [ + css("html,body{padding:3rem 1rem;margin:0;background:papayawhip;min-height:100%;font-family:Helvetica,Arial,sans-serif;font-size:24px;}"), + "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQudHMiLCJzb3VyY2VzIjpbImlucHV0LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgR2xvYmFsIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB7IFB1cmVDb21wb25lbnQgfSBmcm9tICdyZWFjdCdcbmltcG9ydCBSZWFjdERPTSBmcm9tICdyZWFjdC1kb20nXG5cbmNvbnN0IHN0eWxlc0luQ2FsbGJhY2sgPSAocHJvcHM6IGFueSkgPT5cbiAgY3NzKHtcbiAgICBjb2xvcjogJ3JlZCcsXG4gICAgYmFja2dyb3VuZDogJ3llbGxvdycsXG4gICAgd2lkdGg6IGAke3Byb3BzLnNjYWxlICogMTAwfXB4YCxcbiAgfSlcblxuY29uc3Qgc3R5bGVzID0gY3NzKHtcbiAgY29sb3I6ICdyZWQnLFxuICB3aWR0aDogJzIwcHgnLFxufSlcblxuY29uc3Qgc3R5bGVzMiA9IGNzc2BcbiAgY29sb3I6IHJlZDtcbiAgd2lkdGg6IDIwcHg7XG5gXG5cbmNvbnN0IERpdkNvbnRhaW5lciA9IHN0eWxlZC5kaXYoe1xuICBiYWNrZ3JvdW5kOiAncmVkJyxcbn0pXG5cbmNvbnN0IERpdkNvbnRhaW5lcjIgPSBzdHlsZWQuZGl2YFxuICBiYWNrZ3JvdW5kOiByZWQ7XG5gXG5cbmNvbnN0IFNwYW5Db250YWluZXIgPSBzdHlsZWQoJ3NwYW4nKSh7XG4gIGJhY2tncm91bmQ6ICd5ZWxsb3cnLFxufSlcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKCdidXR0b24nKWBcbiAgYmFja2dyb3VuZDogcmVkO1xuICAke3N0eWxlc0luQ2FsbGJhY2t9XG4gICR7KCkgPT5cbiAgICBjc3Moe1xuICAgICAgYmFja2dyb3VuZDogJ3JlZCcsXG4gICAgfSl9XG4gIGNvbG9yOiB5ZWxsb3c7XG4gIGZvbnQtc2l6ZTogMTJweDtcbmBcblxuY29uc3QgQ29udGFpbmVyMiA9IHN0eWxlZC5kaXZgXG4gIGJhY2tncm91bmQ6IHJlZDtcbmBcblxuZXhwb3J0IGNsYXNzIFNpbXBsZUNvbXBvbmVudCBleHRlbmRzIFB1cmVDb21wb25lbnQge1xuICByZW5kZXIoKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxDb250YWluZXJcbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgY29sb3I6IGhvdHBpbms7XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIDxHbG9iYWxcbiAgICAgICAgICBzdHlsZXM9e2Nzc2BcbiAgICAgICAgICAgIGh0bWwsXG4gICAgICAgICAgICBib2R5IHtcbiAgICAgICAgICAgICAgcGFkZGluZzogM3JlbSAxcmVtO1xuICAgICAgICAgICAgICBtYXJnaW46IDA7XG4gICAgICAgICAgICAgIGJhY2tncm91bmQ6IHBhcGF5YXdoaXA7XG4gICAgICAgICAgICAgIG1pbi1oZWlnaHQ6IDEwMCU7XG4gICAgICAgICAgICAgIGZvbnQtZmFtaWx5OiBIZWx2ZXRpY2EsIEFyaWFsLCBzYW5zLXNlcmlmO1xuICAgICAgICAgICAgICBmb250LXNpemU6IDI0cHg7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgYH1cbiAgICAgICAgLz5cbiAgICAgICAgPHNwYW4+aGVsbG88L3NwYW4+XG4gICAgICA8L0NvbnRhaW5lcj5cbiAgICApXG4gIH1cbn1cblxuUmVhY3RET00ucmVuZGVyKDxTaW1wbGVDb21wb25lbnQgLz4sIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoJyNhcHAnKSlcbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF5RFMifQ== */" + ] + }), + /*#__PURE__*/ _jsx("span", { + children: "hello" + }) + ] + }); + } +} +ReactDOM.render(/*#__PURE__*/ _jsx(SimpleComponent, {}), document.querySelector("#app")); diff --git a/packages/next-swc/crates/core/tests/fixture/emotion/namespace-import/input.tsx b/packages/next-swc/crates/core/tests/fixture/emotion/namespace-import/input.tsx new file mode 100644 index 000000000000..843b2d1d1c6d --- /dev/null +++ b/packages/next-swc/crates/core/tests/fixture/emotion/namespace-import/input.tsx @@ -0,0 +1,32 @@ +import * as emotionReact from '@emotion/react' +import { PureComponent } from 'react' +import ReactDOM from 'react-dom' + +const stylesInCallback = (props: any) => + emotionReact.css({ + color: 'red', + background: 'yellow', + width: `${props.scale * 100}px`, + }) + +const styles = emotionReact.css({ + color: 'red', + width: '20px', +}) + +const styles2 = emotionReact.css` + color: red; + width: 20px; +` + +export class SimpleComponent extends PureComponent { + render() { + return ( +
+ hello +
+ ) + } +} + +ReactDOM.render(, document.querySelector('#app')) diff --git a/packages/next-swc/crates/core/tests/fixture/emotion/namespace-import/output.ts b/packages/next-swc/crates/core/tests/fixture/emotion/namespace-import/output.ts new file mode 100644 index 000000000000..d73062e85ee6 --- /dev/null +++ b/packages/next-swc/crates/core/tests/fixture/emotion/namespace-import/output.ts @@ -0,0 +1,26 @@ +import { jsx as _jsx } from "react/jsx-runtime"; +import * as emotionReact from "@emotion/react"; +import { PureComponent } from "react"; +import ReactDOM from "react-dom"; +const stylesInCallback = (props: any)=>/*#__PURE__*/ emotionReact.css({ + color: "red", + background: "yellow", + width: `${props.scale * 100}px` + }, "label:stylesInCallback", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQudHMiLCJzb3VyY2VzIjpbImlucHV0LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCAqIGFzIGVtb3Rpb25SZWFjdCBmcm9tICdAZW1vdGlvbi9yZWFjdCdcbmltcG9ydCB7IFB1cmVDb21wb25lbnQgfSBmcm9tICdyZWFjdCdcbmltcG9ydCBSZWFjdERPTSBmcm9tICdyZWFjdC1kb20nXG5cbmNvbnN0IHN0eWxlc0luQ2FsbGJhY2sgPSAocHJvcHM6IGFueSkgPT5cbiAgZW1vdGlvblJlYWN0LmNzcyh7XG4gICAgY29sb3I6ICdyZWQnLFxuICAgIGJhY2tncm91bmQ6ICd5ZWxsb3cnLFxuICAgIHdpZHRoOiBgJHtwcm9wcy5zY2FsZSAqIDEwMH1weGAsXG4gIH0pXG5cbmNvbnN0IHN0eWxlcyA9IGVtb3Rpb25SZWFjdC5jc3Moe1xuICBjb2xvcjogJ3JlZCcsXG4gIHdpZHRoOiAnMjBweCcsXG59KVxuXG5jb25zdCBzdHlsZXMyID0gZW1vdGlvblJlYWN0LmNzc2BcbiAgY29sb3I6IHJlZDtcbiAgd2lkdGg6IDIwcHg7XG5gXG5cbmV4cG9ydCBjbGFzcyBTaW1wbGVDb21wb25lbnQgZXh0ZW5kcyBQdXJlQ29tcG9uZW50IHtcbiAgcmVuZGVyKCkge1xuICAgIHJldHVybiAoXG4gICAgICA8ZGl2IGNsYXNzTmFtZT17c3R5bGVzfT5cbiAgICAgICAgPHNwYW4+aGVsbG88L3NwYW4+XG4gICAgICA8L2Rpdj5cbiAgICApXG4gIH1cbn1cblxuUmVhY3RET00ucmVuZGVyKDxTaW1wbGVDb21wb25lbnQgLz4sIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoJyNhcHAnKSlcbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLRSJ9 */") +; +const styles = /*#__PURE__*/ emotionReact.css({ + color: "red", + width: "20px" +}, "label:styles", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQudHMiLCJzb3VyY2VzIjpbImlucHV0LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCAqIGFzIGVtb3Rpb25SZWFjdCBmcm9tICdAZW1vdGlvbi9yZWFjdCdcbmltcG9ydCB7IFB1cmVDb21wb25lbnQgfSBmcm9tICdyZWFjdCdcbmltcG9ydCBSZWFjdERPTSBmcm9tICdyZWFjdC1kb20nXG5cbmNvbnN0IHN0eWxlc0luQ2FsbGJhY2sgPSAocHJvcHM6IGFueSkgPT5cbiAgZW1vdGlvblJlYWN0LmNzcyh7XG4gICAgY29sb3I6ICdyZWQnLFxuICAgIGJhY2tncm91bmQ6ICd5ZWxsb3cnLFxuICAgIHdpZHRoOiBgJHtwcm9wcy5zY2FsZSAqIDEwMH1weGAsXG4gIH0pXG5cbmNvbnN0IHN0eWxlcyA9IGVtb3Rpb25SZWFjdC5jc3Moe1xuICBjb2xvcjogJ3JlZCcsXG4gIHdpZHRoOiAnMjBweCcsXG59KVxuXG5jb25zdCBzdHlsZXMyID0gZW1vdGlvblJlYWN0LmNzc2BcbiAgY29sb3I6IHJlZDtcbiAgd2lkdGg6IDIwcHg7XG5gXG5cbmV4cG9ydCBjbGFzcyBTaW1wbGVDb21wb25lbnQgZXh0ZW5kcyBQdXJlQ29tcG9uZW50IHtcbiAgcmVuZGVyKCkge1xuICAgIHJldHVybiAoXG4gICAgICA8ZGl2IGNsYXNzTmFtZT17c3R5bGVzfT5cbiAgICAgICAgPHNwYW4+aGVsbG88L3NwYW4+XG4gICAgICA8L2Rpdj5cbiAgICApXG4gIH1cbn1cblxuUmVhY3RET00ucmVuZGVyKDxTaW1wbGVDb21wb25lbnQgLz4sIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoJyNhcHAnKSlcbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFXZSJ9 */"); +const styles2 = /*#__PURE__*/ emotionReact.css("color:red;width:20px;", "label:styles2", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQudHMiLCJzb3VyY2VzIjpbImlucHV0LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCAqIGFzIGVtb3Rpb25SZWFjdCBmcm9tICdAZW1vdGlvbi9yZWFjdCdcbmltcG9ydCB7IFB1cmVDb21wb25lbnQgfSBmcm9tICdyZWFjdCdcbmltcG9ydCBSZWFjdERPTSBmcm9tICdyZWFjdC1kb20nXG5cbmNvbnN0IHN0eWxlc0luQ2FsbGJhY2sgPSAocHJvcHM6IGFueSkgPT5cbiAgZW1vdGlvblJlYWN0LmNzcyh7XG4gICAgY29sb3I6ICdyZWQnLFxuICAgIGJhY2tncm91bmQ6ICd5ZWxsb3cnLFxuICAgIHdpZHRoOiBgJHtwcm9wcy5zY2FsZSAqIDEwMH1weGAsXG4gIH0pXG5cbmNvbnN0IHN0eWxlcyA9IGVtb3Rpb25SZWFjdC5jc3Moe1xuICBjb2xvcjogJ3JlZCcsXG4gIHdpZHRoOiAnMjBweCcsXG59KVxuXG5jb25zdCBzdHlsZXMyID0gZW1vdGlvblJlYWN0LmNzc2BcbiAgY29sb3I6IHJlZDtcbiAgd2lkdGg6IDIwcHg7XG5gXG5cbmV4cG9ydCBjbGFzcyBTaW1wbGVDb21wb25lbnQgZXh0ZW5kcyBQdXJlQ29tcG9uZW50IHtcbiAgcmVuZGVyKCkge1xuICAgIHJldHVybiAoXG4gICAgICA8ZGl2IGNsYXNzTmFtZT17c3R5bGVzfT5cbiAgICAgICAgPHNwYW4+aGVsbG88L3NwYW4+XG4gICAgICA8L2Rpdj5cbiAgICApXG4gIH1cbn1cblxuUmVhY3RET00ucmVuZGVyKDxTaW1wbGVDb21wb25lbnQgLz4sIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoJyNhcHAnKSlcbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQmdCIn0= */"); +export class SimpleComponent extends PureComponent { + render() { + return /*#__PURE__*/ _jsx("div", { + className: styles, + children: /*#__PURE__*/ _jsx("span", { + children: "hello" + }) + }); + } +} +ReactDOM.render(/*#__PURE__*/ _jsx(SimpleComponent, {}), document.querySelector("#app")); diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-complex-selector/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-complex-selector/output.js index 8aab1885bbae..f024b9bc4429 100644 --- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-complex-selector/output.js +++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-complex-selector/output.js @@ -3,7 +3,7 @@ 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}@keyframes hahaha{from{top:0}to{top: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{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}"} + <_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}@keyframes hahaha{from{top:0}to{top: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/next-swc/crates/core/tests/fixture/styled-jsx/transform-css/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css/output.js index 9ec30b7c59a7..125cdf0c7953 100644 --- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css/output.js +++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css/output.js @@ -3,7 +3,7 @@ export default (()=>

test

- <_JSXStyle id={"768337a97aceabd1"}>{"html.jsx-768337a97aceabd1{background-image:linear-gradient(0deg,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg)}p{color:blue}p{color:blue}p,a.jsx-768337a97aceabd1{color:blue}.foo+a{color:red}body{font-family:-apple-system,BlinkMacSystemFont,\"Segoe UI\",Helvetica,Arial,sans-serif}p.jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1{color:red}*.jsx-768337a97aceabd1{color:blue}[href=\"woot\"].jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1 a.jsx-768337a97aceabd1 span.jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1 span{background:blue}p.jsx-768337a97aceabd1 a[title=\"'w ' ' t'\"].jsx-768337a97aceabd1{margin:auto}p.jsx-768337a97aceabd1 span:not(.test){color:green}p.jsx-768337a97aceabd1,h1.jsx-768337a97aceabd1{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-768337a97aceabd1{-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-768337a97aceabd1:hover{color:red}p.jsx-768337a97aceabd1::before{color:red}.jsx-768337a97aceabd1:hover{color:red}.jsx-768337a97aceabd1::before{color:red}.jsx-768337a97aceabd1:hover p.jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1+a.jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1~a.jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1>a.jsx-768337a97aceabd1{color:red}@keyframes hahaha{from{top:0}to{top:100}}@keyframes hehehe{from{left:0}to{left:100}}@media(min-width:500px){.test.jsx-768337a97aceabd1{color:red}}.test.jsx-768337a97aceabd1{display:block}.inline-flex.jsx-768337a97aceabd1{display:-webkit-inline-box;display:-webkit-inline-flex;display:-moz-inline-box;display:-ms-inline-flexbox;display:inline-flex}.flex.jsx-768337a97aceabd1{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex}.test.jsx-768337a97aceabd1{box-shadow:0 0 10px black,inset 0 0 5px black}.test[title=\",\"].jsx-768337a97aceabd1{display:inline-block}.test.is-status.jsx-768337a97aceabd1 .test.jsx-768337a97aceabd1{color:red}.a-selector.jsx-768337a97aceabd1:hover,.a-selector.jsx-768337a97aceabd1:focus{outline:none}@media(min-width:1px)and (max-width:768px){[class*=\"grid__col--\"].jsx-768337a97aceabd1{margin-top:12px;margin-bottom:12px}}@media(max-width:64em){.test.jsx-768337a97aceabd1{margin-bottom:1em}@supports(-moz-appearance:none)and (display:contents){.test.jsx-768337a97aceabd1{margin-bottom:2rem}}}"} + <_JSXStyle id={"768337a97aceabd1"}>{"html.jsx-768337a97aceabd1{background-image:linear-gradient(0deg,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg)}p{color:blue}p{color:blue}p,a.jsx-768337a97aceabd1{color:blue}.foo+a{color:red}body{font-family:-apple-system,BlinkMacSystemFont,\"Segoe UI\",Helvetica,Arial,sans-serif}p.jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1{color:red}*.jsx-768337a97aceabd1{color:blue}[href=\"woot\"].jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1 a.jsx-768337a97aceabd1 span.jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1 span{background:blue}p.jsx-768337a97aceabd1 a[title=\"'w ' ' t'\"].jsx-768337a97aceabd1{margin:auto}p.jsx-768337a97aceabd1 span:not(.test){color:green}p.jsx-768337a97aceabd1,h1.jsx-768337a97aceabd1{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-768337a97aceabd1{-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-768337a97aceabd1:hover{color:red}p.jsx-768337a97aceabd1::before{color:red}.jsx-768337a97aceabd1:hover{color:red}.jsx-768337a97aceabd1::before{color:red}.jsx-768337a97aceabd1:hover p.jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1+a.jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1~a.jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1>a.jsx-768337a97aceabd1{color:red}@keyframes hahaha{from{top:0}to{top:100}}@keyframes hehehe{from{left:0}to{left:100}}@media(min-width:500px){.test.jsx-768337a97aceabd1{color:red}}.test.jsx-768337a97aceabd1{display:block}.inline-flex.jsx-768337a97aceabd1{display:-webkit-inline-box;display:-webkit-inline-flex;display:-moz-inline-box;display:-ms-inline-flexbox;display:inline-flex}.flex.jsx-768337a97aceabd1{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex}.test.jsx-768337a97aceabd1{-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-768337a97aceabd1{display:inline-block}.test.is-status.jsx-768337a97aceabd1 .test.jsx-768337a97aceabd1{color:red}.a-selector.jsx-768337a97aceabd1:hover,.a-selector.jsx-768337a97aceabd1:focus{outline:none}@media(min-width:1px)and (max-width:768px){[class*=\"grid__col--\"].jsx-768337a97aceabd1{margin-top:12px;margin-bottom:12px}}@media(max-width:64em){.test.jsx-768337a97aceabd1{margin-bottom:1em}@supports(-moz-appearance:none)and (display:contents){.test.jsx-768337a97aceabd1{margin-bottom:2rem}}}"}
); diff --git a/packages/next-swc/crates/core/tests/full.rs b/packages/next-swc/crates/core/tests/full.rs index f915188aace8..bd7c4a6f65d7 100644 --- a/packages/next-swc/crates/core/tests/full.rs +++ b/packages/next-swc/crates/core/tests/full.rs @@ -61,6 +61,7 @@ fn test(input: &Path, minify: bool) { react_remove_properties: None, relay: None, shake_exports: None, + emotion: Some(assert_json("{}")), }; let options = options.patch(&fm); @@ -70,8 +71,10 @@ fn test(input: &Path, minify: bool) { None, &handler, &options.swc, - |_| custom_before_pass(cm.clone(), fm.clone(), &options), - |_| noop(), + |_, comments| { + custom_before_pass(cm.clone(), fm.clone(), &options, comments.clone()) + }, + |_, _| noop(), ) { Ok(v) => { NormalizedOutput::from(v.code) diff --git a/packages/next-swc/crates/core/tests/full/example/output.js b/packages/next-swc/crates/core/tests/full/example/output.js index 3311dd93d841..2d6d173a8478 100644 --- a/packages/next-swc/crates/core/tests/full/example/output.js +++ b/packages/next-swc/crates/core/tests/full/example/output.js @@ -5,9 +5,9 @@ function b(c, a) { } import a from "other"; (function(c, b) { - return (function(c) { + return function(c) { if (Array.isArray(c)) return c; - })(c) || (function(c, b) { + }(c) || function(c, b) { var g, h, a = null == c ? null : "undefined" != typeof Symbol && c[Symbol.iterator] || c["@@iterator"]; if (null != a) { var d = [], e = !0, i = !1; @@ -24,16 +24,16 @@ import a from "other"; } return d; } - })(c, b) || (function(a, d) { + }(c, b) || function(a, d) { if (a) { if ("string" == typeof a) return b(a, d); var c = Object.prototype.toString.call(a).slice(8, -1); if ("Object" === c && a.constructor && (c = a.constructor.name), "Map" === c || "Set" === c) return Array.from(c); if ("Arguments" === c || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(c)) return b(a, d); } - })(c, b) || (function() { + }(c, b) || function() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); - })(); + }(); })(a, 1)[0]; var c = function() { "use strict"; diff --git a/packages/next-swc/crates/core/tests/loader/example/output.js b/packages/next-swc/crates/core/tests/loader/example/output.js index 1bb38a8e44b6..23c806556546 100644 --- a/packages/next-swc/crates/core/tests/loader/example/output.js +++ b/packages/next-swc/crates/core/tests/loader/example/output.js @@ -57,5 +57,5 @@ var Foo = function Foo() { }; export var __N_SSG = true; export default function Home() { - return(/*#__PURE__*/ React.createElement("div", null)); + return /*#__PURE__*/ React.createElement("div", null); }; diff --git a/packages/next-swc/crates/core/tests/loader/front/attr-1/output.js b/packages/next-swc/crates/core/tests/loader/front/attr-1/output.js index 19c18ced298d..ed60ad648aa2 100644 --- a/packages/next-swc/crates/core/tests/loader/front/attr-1/output.js +++ b/packages/next-swc/crates/core/tests/loader/front/attr-1/output.js @@ -1,13 +1,13 @@ import _JSXStyle from "styled-jsx/style"; export default function Foo() { - return(/*#__PURE__*/ React.createElement("div", { + return /*#__PURE__*/ React.createElement("div", { render: function(v) { - return(/*#__PURE__*/ React.createElement("form", { + return /*#__PURE__*/ React.createElement("form", { className: "jsx-eb368961fd3b0a99" - })); + }); }, className: "jsx-eb368961fd3b0a99" }, React.createElement(_JSXStyle, { id: "eb368961fd3b0a99" - }, "span.jsx-eb368961fd3b0a99{color:red}"))); + }, "span.jsx-eb368961fd3b0a99{color:red}")); }; diff --git a/packages/next-swc/crates/core/tests/loader/issue-31627/output.js b/packages/next-swc/crates/core/tests/loader/issue-31627/output.js index 1bd450ee9faf..7cfb5d2942f4 100644 --- a/packages/next-swc/crates/core/tests/loader/issue-31627/output.js +++ b/packages/next-swc/crates/core/tests/loader/issue-31627/output.js @@ -9,11 +9,11 @@ export default function Home() { useEffect(function() { new MyClass(); }, []); - return(/*#__PURE__*/ React.createElement("svg", null, /*#__PURE__*/ React.createElement("g", { + return /*#__PURE__*/ React.createElement("svg", null, /*#__PURE__*/ React.createElement("g", { className: "group" }, /*#__PURE__*/ React.createElement("path", null), /*#__PURE__*/ React.createElement("path", null)), /*#__PURE__*/ React.createElement("g", { className: "group" - }, /*#__PURE__*/ React.createElement("path", null), /*#__PURE__*/ React.createElement("path", null)))); + }, /*#__PURE__*/ React.createElement("path", null), /*#__PURE__*/ React.createElement("path", null))); }; var MyClass = function MyClass() { "use strict"; diff --git a/packages/next-swc/crates/napi/Cargo.toml b/packages/next-swc/crates/napi/Cargo.toml index e6ca0be59faf..49df284fbfab 100644 --- a/packages/next-swc/crates/napi/Cargo.toml +++ b/packages/next-swc/crates/napi/Cargo.toml @@ -12,16 +12,16 @@ backtrace = "0.3" fxhash = "0.2.1" napi = {version = "1", features = ["serde-json"]} napi-derive = "1" +next-swc = {version = "0.0.0", path = "../core"} once_cell = "1.8.0" serde = "1" serde_json = "1" -next-swc = { version = "0.0.0", path = "../core" } -swc = "0.146.0" -swc_atoms = "0.2.7" -swc_bundler = { version = "0.120.0", features = ["concurrent"] } -swc_common = { version = "0.17.11", features = ["concurrent", "sourcemap"] } -swc_ecma_loader = { version = "0.29.0", features = ["node", "lru"] } -swc_ecmascript = { version = "0.130.0", features = ["codegen", "minifier", "optimization", "parser", "react", "transforms", "typescript", "utils", "visit"] } +swc = "0.150.1" +swc_atoms = "0.2.9" +swc_bundler = {version = "0.122.0", features = ["concurrent"]} +swc_common = {version = "0.17.15", features = ["concurrent", "sourcemap"]} +swc_ecma_loader = {version = "0.29.0", features = ["node", "lru"]} +swc_ecmascript = {version = "0.132.0", features = ["codegen", "minifier", "optimization", "parser", "react", "transforms", "typescript", "utils", "visit"]} swc_node_base = "0.5.1" [build-dependencies] diff --git a/packages/next-swc/crates/napi/src/bundle/mod.rs b/packages/next-swc/crates/napi/src/bundle/mod.rs index 55819c796711..9599693d94a1 100644 --- a/packages/next-swc/crates/napi/src/bundle/mod.rs +++ b/packages/next-swc/crates/napi/src/bundle/mod.rs @@ -54,8 +54,8 @@ impl Task for BundleTask { try_with_handler(self.c.cm.clone(), true, |handler| { let builtins = NODE_BUILTINS - .to_vec() - .into_iter() + .iter() + .copied() .map(JsWord::from) .collect::>(); diff --git a/packages/next-swc/crates/napi/src/transform.rs b/packages/next-swc/crates/napi/src/transform.rs index adc32cc25feb..835392ae91d9 100644 --- a/packages/next-swc/crates/napi/src/transform.rs +++ b/packages/next-swc/crates/napi/src/transform.rs @@ -94,14 +94,16 @@ impl Task for TransformTask { }; let options = options.patch(&fm); - let before_pass = custom_before_pass(self.c.cm.clone(), fm.clone(), &options); + let cm = self.c.cm.clone(); + let file = fm.clone(); + self.c.process_js_with_custom_pass( fm, None, handler, &options.swc, - |_| before_pass, - |_| noop(), + |_, comments| custom_before_pass(cm, file, &options, comments.clone()), + |_, _| noop(), ) }) }) diff --git a/packages/next-swc/crates/wasm/Cargo.toml b/packages/next-swc/crates/wasm/Cargo.toml index 41ed805ce84d..2cbe0ad7f150 100644 --- a/packages/next-swc/crates/wasm/Cargo.toml +++ b/packages/next-swc/crates/wasm/Cargo.toml @@ -10,15 +10,15 @@ crate-type = ["cdylib"] [dependencies] anyhow = "1.0.42" console_error_panic_hook = "0.1.6" +next-swc = {version = "0.0.0", path = "../core"} once_cell = "1.3.1" parking_lot_core = "=0.8.0" path-clean = "0.1" serde = {version = "1", features = ["derive"]} serde_json = "1" -next-swc = { version = "0.0.0", path = "../core" } -swc = "0.146.0" -swc_common = { version = "0.17.11", features = ["concurrent", "sourcemap"] } -swc_ecmascript = { version = "0.130.0", features = ["codegen", "minifier", "optimization", "parser", "react", "transforms", "typescript", "utils", "visit"] } +swc = "0.150.1" +swc_common = {version = "0.17.14", features = ["concurrent", "sourcemap"]} +swc_ecmascript = {version = "0.132.0", features = ["codegen", "minifier", "optimization", "parser", "react", "transforms", "typescript", "utils", "visit"]} tracing = {version = "0.1.28", features = ["release_max_level_off"]} wasm-bindgen = {version = "0.2", features = ["serde-serialize"]} wasm-bindgen-futures = "0.4.8" diff --git a/packages/next-swc/crates/wasm/src/lib.rs b/packages/next-swc/crates/wasm/src/lib.rs index 9816f32fa9c0..0383106c82ee 100644 --- a/packages/next-swc/crates/wasm/src/lib.rs +++ b/packages/next-swc/crates/wasm/src/lib.rs @@ -47,9 +47,17 @@ pub fn transform_sync(s: &str, opts: JsValue) -> Result { }, s.into(), ); - let before_pass = custom_before_pass(c.cm.clone(), fm.clone(), &opts); + let cm = c.cm.clone(); + let file = fm.clone(); let out = c - .process_js_with_custom_pass(fm, None, handler, &opts.swc, |_| before_pass, |_| noop()) + .process_js_with_custom_pass( + fm, + None, + handler, + &opts.swc, + |_, comments| custom_before_pass(cm, file, &opts, comments.clone()), + |_, _| noop(), + ) .context("failed to process js file")?; JsValue::from_serde(&out).context("failed to serialize json") diff --git a/packages/next-swc/rust-toolchain b/packages/next-swc/rust-toolchain index 1307a1c398e3..4e7e21b01962 100644 --- a/packages/next-swc/rust-toolchain +++ b/packages/next-swc/rust-toolchain @@ -1 +1 @@ -nightly-2021-11-15 \ No newline at end of file +nightly-2022-02-23 \ No newline at end of file diff --git a/packages/next/build/swc/options.js b/packages/next/build/swc/options.js index d9e14534f1df..00af330c102f 100644 --- a/packages/next/build/swc/options.js +++ b/packages/next/build/swc/options.js @@ -64,7 +64,9 @@ function getBaseSWCOptions({ legacyDecorator: enableDecorators, decoratorMetadata: emitDecoratorMetadata, react: { - importSource: jsConfig?.compilerOptions?.jsxImportSource || 'react', + importSource: nextConfig?.experimental?.emotion + ? '@emotion/react' + : jsConfig?.compilerOptions?.jsxImportSource || 'react', runtime: 'automatic', pragma: 'React.createElement', pragmaFrag: 'React.Fragment', @@ -101,6 +103,34 @@ function getBaseSWCOptions({ removeConsole: nextConfig?.compiler?.removeConsole, reactRemoveProperties: nextConfig?.compiler?.reactRemoveProperties, relay: nextConfig?.compiler?.relay, + emotion: getEmotionOptions(nextConfig, development), + } +} + +function getEmotionOptions(nextConfig, development) { + if (!nextConfig?.experimental?.emotion) { + return null + } + let autoLabel = false + switch (nextConfig?.experimental?.emotion?.autoLabel) { + case 'never': + autoLabel = false + break + case 'always': + autoLabel = true + break + case 'dev-only': + default: + autoLabel = !!development + break + } + return { + enabled: true, + autoLabel, + labelFormat: nextConfig?.experimental?.emotion?.labelFormat, + sourcemap: development + ? nextConfig?.experimental?.emotion?.sourceMap ?? true + : false, } } diff --git a/packages/next/build/webpack-config.ts b/packages/next/build/webpack-config.ts index 3e1baa95b172..0c3e64cbe121 100644 --- a/packages/next/build/webpack-config.ts +++ b/packages/next/build/webpack-config.ts @@ -1505,6 +1505,7 @@ export default async function getBaseWebpackConfig( ], ['swcRemoveConsole', !!config.compiler?.removeConsole], ['swcImportSource', !!jsConfig?.compilerOptions?.jsxImportSource], + ['swcEmotion', !!config.experimental.emotion], ]) ), ].filter(Boolean as any as ExcludesFalse), @@ -1633,6 +1634,7 @@ export default async function getBaseWebpackConfig( reactRemoveProperties: config.compiler?.reactRemoveProperties, styledComponents: config.compiler?.styledComponents, relay: config.compiler?.relay, + emotion: config.experimental?.emotion, }) const cache: any = { diff --git a/packages/next/build/webpack/plugins/telemetry-plugin.ts b/packages/next/build/webpack/plugins/telemetry-plugin.ts index fe1f370a283b..aeb73cad89db 100644 --- a/packages/next/build/webpack/plugins/telemetry-plugin.ts +++ b/packages/next/build/webpack/plugins/telemetry-plugin.ts @@ -12,6 +12,7 @@ type Feature = | 'swcExperimentalDecorators' | 'swcRemoveConsole' | 'swcImportSource' + | 'swcEmotion' interface FeatureUsage { featureName: Feature @@ -50,6 +51,7 @@ const BUILD_FEATURES: Array = [ 'swcExperimentalDecorators', 'swcRemoveConsole', 'swcImportSource', + 'swcEmotion', ] /** diff --git a/packages/next/server/config-shared.ts b/packages/next/server/config-shared.ts index baa1e4d71b89..0e8c6d5a53cb 100644 --- a/packages/next/server/config-shared.ts +++ b/packages/next/server/config-shared.ts @@ -111,6 +111,13 @@ export interface ExperimentalConfig { layoutRaw: boolean } middlewareSourceMaps?: boolean + emotion?: + | boolean + | { + sourceMap?: boolean + autoLabel?: 'dev-only' | 'always' | 'never' + labelFormat?: string + } } /** diff --git a/packages/next/telemetry/events/build.ts b/packages/next/telemetry/events/build.ts index f7cb5f3e1ac7..9b64803af6ac 100644 --- a/packages/next/telemetry/events/build.ts +++ b/packages/next/telemetry/events/build.ts @@ -143,6 +143,7 @@ export type EventBuildFeatureUsage = { | 'swcExperimentalDecorators' | 'swcRemoveConsole' | 'swcImportSource' + | 'swcEmotion' | 'build-lint' invocationCount: number } diff --git a/test/development/acceptance/__snapshots__/ReactRefreshLogBox-app-doc.test.ts.snap b/test/development/acceptance/__snapshots__/ReactRefreshLogBox-app-doc.test.ts.snap index bc21d6b0f93a..e0801a44a541 100644 --- a/test/development/acceptance/__snapshots__/ReactRefreshLogBox-app-doc.test.ts.snap +++ b/test/development/acceptance/__snapshots__/ReactRefreshLogBox-app-doc.test.ts.snap @@ -15,7 +15,7 @@ error: Unexpected token \`jsx name (Component)\`. Expected this, import, async, | ^^^^^^^^^ Caused by: - 0: failed to process js file + 0: failed to process input file 1: Syntax Error" `; @@ -28,6 +28,6 @@ Error: error: Unexpected token \`{\`. Expected identifier, string literal, numer | ^ Caused by: - 0: failed to process js file + 0: failed to process input file 1: Syntax Error" `; diff --git a/test/development/acceptance/__snapshots__/ReactRefreshLogBox.test.ts.snap b/test/development/acceptance/__snapshots__/ReactRefreshLogBox.test.ts.snap index 9490683c29ee..2e00658c9624 100644 --- a/test/development/acceptance/__snapshots__/ReactRefreshLogBox.test.ts.snap +++ b/test/development/acceptance/__snapshots__/ReactRefreshLogBox.test.ts.snap @@ -75,7 +75,7 @@ Error: error: Unexpected eof | ^ Caused by: - 0: failed to process js file + 0: failed to process input file 1: Syntax Error" `; @@ -135,7 +135,7 @@ Error: error: Unexpected eof | ^ Caused by: - 0: failed to process js file + 0: failed to process input file 1: Syntax Error" `; @@ -148,7 +148,7 @@ Error: error: Unexpected eof | ^ Caused by: - 0: failed to process js file + 0: failed to process input file 1: Syntax Error" `; @@ -161,6 +161,6 @@ Error: error: Unexpected eof | ^ Caused by: - 0: failed to process js file + 0: failed to process input file 1: Syntax Error" `; diff --git a/test/integration/telemetry/test/index.test.js b/test/integration/telemetry/test/index.test.js index 1a76922190af..d88c59b37ef3 100644 --- a/test/integration/telemetry/test/index.test.js +++ b/test/integration/telemetry/test/index.test.js @@ -631,6 +631,7 @@ describe('Telemetry CLI', () => { regex.exec(stderr).pop() // swcReactRemoveProperties regex.exec(stderr).pop() // swcRemoveConsole regex.exec(stderr).pop() // swcImportSource + regex.exec(stderr).pop() // swcEmotion const image = regex.exec(stderr).pop() expect(image).toContain(`"featureName": "next/image"`) expect(image).toContain(`"invocationCount": 1`)