diff --git a/packages/next-codemod/transforms/__testfixtures__/new-link/styled-jsx.input.js b/packages/next-codemod/transforms/__testfixtures__/new-link/styled-jsx.input.js
new file mode 100644
index 000000000000000..a3360c1c1b113e7
--- /dev/null
+++ b/packages/next-codemod/transforms/__testfixtures__/new-link/styled-jsx.input.js
@@ -0,0 +1,26 @@
+import Link from 'next/link';
+
+const CustomLink = ({
+ href,
+ title,
+ children,
+}) => {
+ return (
+
+
+
+ {children}
+
+
+
+
+ );
+};
+
+export default CustomLink;
\ No newline at end of file
diff --git a/packages/next-codemod/transforms/__testfixtures__/new-link/styled-jsx.output.js b/packages/next-codemod/transforms/__testfixtures__/new-link/styled-jsx.output.js
new file mode 100644
index 000000000000000..80f6859410b863c
--- /dev/null
+++ b/packages/next-codemod/transforms/__testfixtures__/new-link/styled-jsx.output.js
@@ -0,0 +1,26 @@
+import Link from 'next/link';
+
+const CustomLink = ({
+ href,
+ title,
+ children,
+}) => {
+ return (
+
+
+
+ {children}
+
+
+
+
+ );
+};
+
+export default CustomLink;
\ No newline at end of file
diff --git a/packages/next-codemod/transforms/__tests__/new-link.test.js b/packages/next-codemod/transforms/__tests__/new-link.test.js
index 36724ec0e7df080..a9fac98fe3db7a2 100644
--- a/packages/next-codemod/transforms/__tests__/new-link.test.js
+++ b/packages/next-codemod/transforms/__tests__/new-link.test.js
@@ -9,7 +9,8 @@ const fixtures = [
'excludes-links-with-legacybehavior-prop',
'children-interpolation',
'spread-props',
- 'link-string'
+ 'link-string',
+ 'styled-jsx',
]
for (const fixture of fixtures) {
diff --git a/packages/next-codemod/transforms/new-link.ts b/packages/next-codemod/transforms/new-link.ts
index 95f5c7dee5880f8..ab84eaf918e9f5f 100644
--- a/packages/next-codemod/transforms/new-link.ts
+++ b/packages/next-codemod/transforms/new-link.ts
@@ -22,6 +22,13 @@ export default function transformer(file: FileInfo, api: API) {
}
const linkElements = $j.findJSXElements(variableName)
+ const hasStylesJSX = $j.findJSXElements('style').some((stylePath) => {
+ const $style = j(stylePath)
+ const hasJSXProp =
+ $style.find(j.JSXAttribute, { name: { name: 'jsx' } }).size() !== 0
+
+ return hasJSXProp
+ })
linkElements.forEach((linkPath) => {
const $link = j(linkPath).filter((childPath) => {
@@ -37,6 +44,15 @@ export default function transformer(file: FileInfo, api: API) {
return
}
+ // If file has