npm - @swc/plugin-styled-jsx - Versions diffs - 1.5.83 → 1.5.86 - Mend

@swc/plugin-styled-jsx 1.5.83 → 1.5.86

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (217) hide show

package/transform/tests/errors/nested-style-tags/input.js DELETED Viewed

@@ -1,31 +0,0 @@
-const Component = () => (
-  <>
-    <header>
-      <Comp>
-        <style jsx>{styles}</style>
-        <style jsx global>{``}</style>
-      </Comp>
-      <p><style jsx>{``}</style></p>
-    </header>
-    <div>
-      <h1>
-        Welcome!
-        <style jsx>{``}</style>
-      </h1>
-      <style jsx>{``}</style>
-    </div>
-    <div>
-      <style jsx>{``}</style>
-      <h1>
-        Hello world!
-        <style jsx global>{``}</style>
-      </h1>
-    </div>
-    <div>
-      <>
-        <style jsx>{styles}</style>
-      </>
-      <style jsx>{``}</style>
-    </div>
-  </>
-)

package/transform/tests/errors/nested-style-tags/output-lightningcss.js DELETED Viewed

@@ -1,58 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-const Component = ()=><>
-    <header>
-      <Comp>
-        <_JSXStyle id={styles.__hash}>{styles}</_JSXStyle>
-        <_JSXStyle id={"b3e1b6a7c9b96113"}>{""}</_JSXStyle>
-      </Comp>
-      <p className={"jsx-b3e1b6a7c9b96113"}><_JSXStyle id={"b3e1b6a7c9b96113"}>{""}</_JSXStyle></p>
-    </header>
-    <div className={"jsx-b3e1b6a7c9b96113"}>
-      <h1 className={"jsx-b3e1b6a7c9b96113"}>
-        Welcome!
-        <style jsx>{``}</style>
-      </h1>
-      <_JSXStyle id={"b3e1b6a7c9b96113"}>{""}</_JSXStyle>
-    </div>
-    <div className={"jsx-b3e1b6a7c9b96113"}>
-      <_JSXStyle id={"b3e1b6a7c9b96113"}>{""}</_JSXStyle>
-      <h1 className={"jsx-b3e1b6a7c9b96113"}>
-        Hello world!
-        <style jsx global>{``}</style>
-      </h1>
-    </div>
-    <div className={"jsx-b3e1b6a7c9b96113"}>
-      <>
-        <style jsx>{styles}</style>
-      </>
-      <_JSXStyle id={"b3e1b6a7c9b96113"}>{""}</_JSXStyle>
-    </div>
-  </>;

package/transform/tests/errors/nested-style-tags/output-lightningcss.stderr DELETED Viewed

@@ -1,27 +0,0 @@
-  x Detected nested styled-jsx tag.
-  | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags
-    ,-[input.js:12:1]
- 12 |         Welcome!
- 13 |         <style jsx>{``}</style>
-    :         ^^^^^^^^^^^^^^^^^^^^^^^
- 14 |       </h1>
-    `----
-  x Detected nested styled-jsx tag.
-  | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags
-    ,-[input.js:20:1]
- 20 |         Hello world!
- 21 |         <style jsx global>{``}</style>
-    :         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
- 22 |       </h1>
-    `----
-  x Detected nested styled-jsx tag.
-  | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags
-    ,-[input.js:25:1]
- 25 |       <>
- 26 |         <style jsx>{styles}</style>
-    :         ^^^^^^^^^^^^^^^^^^^^^^^^^^^
- 27 |       </>
-    `----

package/transform/tests/errors/nested-style-tags/output-swc.js DELETED Viewed

@@ -1,58 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-const Component = ()=><>
-    <header>
-      <Comp>
-        <_JSXStyle id={styles.__hash}>{styles}</_JSXStyle>
-        <_JSXStyle id={"b3e1b6a7c9b96113"}>{""}</_JSXStyle>
-      </Comp>
-      <p className={"jsx-b3e1b6a7c9b96113"}><_JSXStyle id={"b3e1b6a7c9b96113"}>{""}</_JSXStyle></p>
-    </header>
-    <div className={"jsx-b3e1b6a7c9b96113"}>
-      <h1 className={"jsx-b3e1b6a7c9b96113"}>
-        Welcome!
-        <style jsx>{``}</style>
-      </h1>
-      <_JSXStyle id={"b3e1b6a7c9b96113"}>{""}</_JSXStyle>
-    </div>
-    <div className={"jsx-b3e1b6a7c9b96113"}>
-      <_JSXStyle id={"b3e1b6a7c9b96113"}>{""}</_JSXStyle>
-      <h1 className={"jsx-b3e1b6a7c9b96113"}>
-        Hello world!
-        <style jsx global>{``}</style>
-      </h1>
-    </div>
-    <div className={"jsx-b3e1b6a7c9b96113"}>
-      <>
-        <style jsx>{styles}</style>
-      </>
-      <_JSXStyle id={"b3e1b6a7c9b96113"}>{""}</_JSXStyle>
-    </div>
-  </>;

package/transform/tests/errors/nested-style-tags/output-swc.stderr DELETED Viewed

@@ -1,27 +0,0 @@
-  x Detected nested styled-jsx tag.
-  | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags
-    ,-[input.js:12:1]
- 12 |         Welcome!
- 13 |         <style jsx>{``}</style>
-    :         ^^^^^^^^^^^^^^^^^^^^^^^
- 14 |       </h1>
-    `----
-  x Detected nested styled-jsx tag.
-  | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags
-    ,-[input.js:20:1]
- 20 |         Hello world!
- 21 |         <style jsx global>{``}</style>
-    :         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
- 22 |       </h1>
-    `----
-  x Detected nested styled-jsx tag.
-  | Read more: https://nextjs.org/docs/messages/nested-styled-jsx-tags
-    ,-[input.js:25:1]
- 25 |       <>
- 26 |         <style jsx>{styles}</style>
-    :         ^^^^^^^^^^^^^^^^^^^^^^^^^^^
- 27 |       </>
-    `----

package/transform/tests/errors/nested-style-tags/output.js DELETED Viewed

@@ -1,58 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-const Component = ()=><>
-    <header>
-      <Comp>
-        <_JSXStyle id={styles.__hash}>{styles}</_JSXStyle>
-        <_JSXStyle id={"b3e1b6a7c9b96113"}>{""}</_JSXStyle>
-      </Comp>
-      <p className={"jsx-b3e1b6a7c9b96113"}><_JSXStyle id={"b3e1b6a7c9b96113"}>{""}</_JSXStyle></p>
-    </header>
-    <div className={"jsx-b3e1b6a7c9b96113"}>
-      <h1 className={"jsx-b3e1b6a7c9b96113"}>
-        Welcome!
-        <style jsx>{``}</style>
-      </h1>
-      <_JSXStyle id={"b3e1b6a7c9b96113"}>{""}</_JSXStyle>
-    </div>
-    <div className={"jsx-b3e1b6a7c9b96113"}>
-      <_JSXStyle id={"b3e1b6a7c9b96113"}>{""}</_JSXStyle>
-      <h1 className={"jsx-b3e1b6a7c9b96113"}>
-        Hello world!
-        <style jsx global>{``}</style>
-      </h1>
-    </div>
-    <div className={"jsx-b3e1b6a7c9b96113"}>
-      <>
-        <style jsx>{styles}</style>
-      </>
-      <_JSXStyle id={"b3e1b6a7c9b96113"}>{""}</_JSXStyle>
-    </div>
-  </>;

package/transform/tests/errors/no-child/input.js DELETED Viewed

@@ -1,6 +0,0 @@
-export default () => (
-  <div>
-    <style jsx>
-    </style>
-  </div>
-)

package/transform/tests/errors/no-child/output-lightningcss.js DELETED Viewed

@@ -1,8 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-export default (()=><div>
-    <style jsx>
-    </style>
-  </div>);

package/transform/tests/errors/no-child/output-lightningcss.stderr DELETED Viewed

@@ -1,9 +0,0 @@
-  x Expected one child under JSX style tag, but got 0.
-  | Read more: https://nextjs.org/docs/messages/invalid-styled-jsx-children
-   ,-[input.js:2:1]
- 2 |       <div>
- 3 | ,->     <style jsx>
- 4 | `->     </style>
- 5 |       </div>
-   `----

package/transform/tests/errors/no-child/output-swc.js DELETED Viewed

@@ -1,8 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-export default (()=><div>
-    <style jsx>
-    </style>
-  </div>);

package/transform/tests/errors/no-child/output-swc.stderr DELETED Viewed

@@ -1,9 +0,0 @@
-  x Expected one child under JSX style tag, but got 0.
-  | Read more: https://nextjs.org/docs/messages/invalid-styled-jsx-children
-   ,-[input.js:2:1]
- 2 |       <div>
- 3 | ,->     <style jsx>
- 4 | `->     </style>
- 5 |       </div>
-   `----

package/transform/tests/errors/no-child/output.js DELETED Viewed

@@ -1,8 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-export default (()=><div>
-    <style jsx>
-    </style>
-  </div>);

package/transform/tests/errors/ts-with-css-resolve/input.js DELETED Viewed

@@ -1,10 +0,0 @@
-import css from 'styled-jsx/css'
-export default css.resolve`
-  .container {
-    background: #000;
-    color: white;
-    font-weight: 700;
-    height: 100px;
-  }
-`

package/transform/tests/errors/ts-with-css-resolve/output-lightningcss.js DELETED Viewed

@@ -1,5 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-export default {
-    styles: <_JSXStyle id={"71f03d42ea0ec6"}>{".container.jsx-71f03d42ea0ec6{color:#fff;background:#000;height:100px;font-weight:700}"}</_JSXStyle>,
-    className: "jsx-71f03d42ea0ec6"
-};

package/transform/tests/errors/ts-with-css-resolve/output-lightningcss.stderr DELETED Viewed

	@@ -1,2 +0,0 @@
1	-
2	- x /some-project/src/some-file.ts uses `css.resolve`, but ends with `.ts`. The file extension needs to be `.tsx` so that the jsx injected by `css.resolve` will be transformed.

package/transform/tests/errors/ts-with-css-resolve/output-swc.js DELETED Viewed

@@ -1,5 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-export default {
-    styles: <_JSXStyle id={"71f03d42ea0ec6"}>{".container.jsx-71f03d42ea0ec6{background:#000;color:white;font-weight:700;height:100px}"}</_JSXStyle>,
-    className: "jsx-71f03d42ea0ec6"
-};

package/transform/tests/errors/ts-with-css-resolve/output-swc.stderr DELETED Viewed

	@@ -1,2 +0,0 @@
1	-
2	- x /some-project/src/some-file.ts uses `css.resolve`, but ends with `.ts`. The file extension needs to be `.tsx` so that the jsx injected by `css.resolve` will be transformed.

package/transform/tests/errors/ts-with-css-resolve/output.js DELETED Viewed

@@ -1,5 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-export default {
-    styles: <_JSXStyle id={"71f03d42ea0ec6"}>{".container.jsx-71f03d42ea0ec6{background:#000;color:white;font-weight:700;height:100px}"}</_JSXStyle>,
-    className: "jsx-71f03d42ea0ec6"
-};

package/transform/tests/errors/two-children/input.js DELETED Viewed

@@ -1,8 +0,0 @@
-export default () => (
-  <div>
-    <style jsx>
-      {`.p {}`}
-      {`.p {}`}
-    </style>
-  </div>
-)

package/transform/tests/errors/two-children/output-lightningcss.js DELETED Viewed

@@ -1,12 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-export default (()=><div>
-    <style jsx>
-      {`.p {}`}
-      {`.p {}`}
-    </style>
-  </div>);

package/transform/tests/errors/two-children/output-lightningcss.stderr DELETED Viewed

@@ -1,11 +0,0 @@
-  x Expected one child under JSX style tag, but got 2.
-  | Read more: https://nextjs.org/docs/messages/invalid-styled-jsx-children
-   ,-[input.js:2:1]
- 2 |       <div>
- 3 | ,->     <style jsx>
- 4 | |         {`.p {}`}
- 5 | |         {`.p {}`}
- 6 | `->     </style>
- 7 |       </div>
-   `----

package/transform/tests/errors/two-children/output-swc.js DELETED Viewed

@@ -1,12 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-export default (()=><div>
-    <style jsx>
-      {`.p {}`}
-      {`.p {}`}
-    </style>
-  </div>);

package/transform/tests/errors/two-children/output-swc.stderr DELETED Viewed

@@ -1,11 +0,0 @@
-  x Expected one child under JSX style tag, but got 2.
-  | Read more: https://nextjs.org/docs/messages/invalid-styled-jsx-children
-   ,-[input.js:2:1]
- 2 |       <div>
- 3 | ,->     <style jsx>
- 4 | |         {`.p {}`}
- 5 | |         {`.p {}`}
- 6 | `->     </style>
- 7 |       </div>
-   `----

package/transform/tests/errors/two-children/output.js DELETED Viewed

@@ -1,12 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-export default (()=><div>
-    <style jsx>
-      {`.p {}`}
-      {`.p {}`}
-    </style>
-  </div>);

package/transform/tests/errors/wrong-child-type/input.js DELETED Viewed

@@ -1,7 +0,0 @@
-export default () => (
-  <div>
-    <style jsx>
-      10
-    </style>
-  </div>
-)

package/transform/tests/errors/wrong-child-type/output-lightningcss.js DELETED Viewed

@@ -1,10 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-export default (()=><div>
-    <style jsx>
-      10
-    </style>
-  </div>);

package/transform/tests/errors/wrong-child-type/output-lightningcss.stderr DELETED Viewed

@@ -1,10 +0,0 @@
-  x Expected a single child of type JSXExpressionContainer under JSX Style tag.
-  | Read more: https://nextjs.org/docs/messages/invalid-styled-jsx-children
-   ,-[input.js:2:1]
- 2 |       <div>
- 3 | ,->     <style jsx>
- 4 | |         10
- 5 | `->     </style>
- 6 |       </div>
-   `----

package/transform/tests/errors/wrong-child-type/output-swc.js DELETED Viewed

@@ -1,10 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-export default (()=><div>
-    <style jsx>
-      10
-    </style>
-  </div>);

package/transform/tests/errors/wrong-child-type/output-swc.stderr DELETED Viewed

@@ -1,10 +0,0 @@
-  x Expected a single child of type JSXExpressionContainer under JSX Style tag.
-  | Read more: https://nextjs.org/docs/messages/invalid-styled-jsx-children
-   ,-[input.js:2:1]
- 2 |       <div>
- 3 | ,->     <style jsx>
- 4 | |         10
- 5 | `->     </style>
- 6 |       </div>
-   `----

package/transform/tests/errors/wrong-child-type/output.js DELETED Viewed

@@ -1,10 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-export default (()=><div>
-    <style jsx>
-      10
-    </style>
-  </div>);

package/transform/tests/errors/wrong-jsx-expression-type/input.js DELETED Viewed

@@ -1,7 +0,0 @@
-export default () => (
-  <div>
-    <style jsx>
-      {[]}
-    </style>
-  </div>
-)

package/transform/tests/errors/wrong-jsx-expression-type/output-lightningcss.js DELETED Viewed

@@ -1,10 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-export default (()=><div>
-    <style jsx>
-      {[]}
-    </style>
-  </div>);

package/transform/tests/errors/wrong-jsx-expression-type/output-lightningcss.stderr DELETED Viewed

@@ -1,10 +0,0 @@
-  x Expected a template literal, string or identifier inside the JSXExpressionContainer.
-  | Read more: https://nextjs.org/docs/messages/invalid-styled-jsx-children
-   ,-[input.js:2:1]
- 2 |       <div>
- 3 | ,->     <style jsx>
- 4 | |         {[]}
- 5 | `->     </style>
- 6 |       </div>
-   `----

package/transform/tests/errors/wrong-jsx-expression-type/output-swc.js DELETED Viewed

@@ -1,10 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-export default (()=><div>
-    <style jsx>
-      {[]}
-    </style>
-  </div>);

package/transform/tests/errors/wrong-jsx-expression-type/output-swc.stderr DELETED Viewed

@@ -1,10 +0,0 @@
-  x Expected a template literal, string or identifier inside the JSXExpressionContainer.
-  | Read more: https://nextjs.org/docs/messages/invalid-styled-jsx-children
-   ,-[input.js:2:1]
- 2 |       <div>
- 3 | ,->     <style jsx>
- 4 | |         {[]}
- 5 | `->     </style>
- 6 |       </div>
-   `----

package/transform/tests/errors/wrong-jsx-expression-type/output.js DELETED Viewed

@@ -1,10 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-export default (()=><div>
-    <style jsx>
-      {[]}
-    </style>
-  </div>);

package/transform/tests/fixture/.expressions/input.js DELETED Viewed

@@ -1,90 +0,0 @@
-const darken = c => c
-const color = 'red'
-const otherColor = 'green'
-const mediumScreen = '680px'
-const animationDuration = '200ms'
-const animationName = 'my-cool-animation'
-const obj = { display: 'block' }
-export default ({ display }) => (
-  <div>
-    <p>test</p>
-    <style jsx>{`
-      p.${color} {
-        color: ${otherColor};
-        display: ${obj.display};
-      }
-    `}</style>
-    <style jsx>{'p { color: red }'}</style>
-    <style jsx global>{`
-      body {
-        background: ${color};
-      }
-    `}</style>
-    <style jsx global>{`
-      body {
-        background: ${color};
-      }
-    `}</style>
-    // TODO: the next two should have the same hash
-    <style jsx>{`
-      p {
-        color: ${color};
-      }
-    `}</style>
-    <style jsx>{`
-      p {
-        color: ${color};
-      }
-    `}</style>
-    <style jsx>{`
-      p {
-        color: ${darken(color)};
-      }
-    `}</style>
-    <style jsx>{`
-      p {
-        color: ${darken(color) + 2};
-      }
-    `}</style>
-    <style jsx>{`
-      @media (min-width: ${mediumScreen}) {
-        p {
-          color: green;
-        }
-        p {
-          color: ${`red`};
-        }
-      }
-      p {
-        color: red;
-      }
-    `}</style>
-    <style jsx>{`
-      p {
-        animation-duration: ${animationDuration};
-      }
-    `}</style>
-    <style jsx>{`
-      p {
-        animation: ${animationDuration} forwards ${animationName};
-      }
-      div {
-        background: ${color};
-      }
-    `}</style>
-    <style jsx>{`
-      span {
-        display: ${display ? 'block' : 'none'};
-      }
-    `}</style>
-    // TODO: causes bad syntax
-    {/* <style jsx>{`
-      span:before {
-        display: ${display ? 'block' : 'none'};
-        content: '\`';
-      }
-    `}</style> */}
-  </div>
-)

package/transform/tests/fixture/absent/input.js DELETED Viewed

@@ -1,6 +0,0 @@
-const a = () => (
-  <div>
-    <p>hi</p>
-    <style>{'woot'}</style>
-  </div>
-)