fix(emotion): handle trailing comma in styled(Component,)(styles)

packages/emotion/src/index.ts

@@ -543,7 +543,14 @@ export default function emotionPlugin(options: EmotionPluginOptions = {}): Plugi
                           // Add { target, label } as second arg to inner call
                           if (callee.arguments.length === 1) {
                             // Insert before inner call's closing )
-                            s.appendLeft(callee.end - 1, `, {\n\t${labelObj}\n}`)
+                            const hasTrailingComma = checkTrailingCommaExistence(
+                              s.original,
+                              callee.end - 1,
+                            )
+                            s.appendLeft(
+                              callee.end - 1,
+                              `${maybeComma(!hasTrailingComma)}{\n\t${labelObj}\n}`,
+                            )
                           } else if (callee.arguments.length >= 2) {
                             const secondArg = callee.arguments[1]
                             if (secondArg.type === 'ObjectExpression') {

packages/emotion/tests/fixtures/styled-call-component-trailing-comma/input.tsx

@@ -0,0 +1,14 @@
+import React from 'react';
+import styled from '@emotion/styled';
+
+const styleProps = () => ({ display: 'inline-block' });
+
+// Trailing comma after the component argument in styled(Component,)(styles)
+// This pattern is common in .tsx files where a generic follows:
+//   styled(Component,)<Props>(styles)
+// The trailing comma disambiguates the generic from JSX.
+export const Icon = styled(
+  React.forwardRef<SVGSVGElement, { className?: string }>(({ className }, ref) => (
+    <svg ref={ref} className={className} />
+  )),
+)(styleProps);

packages/emotion/tests/fixtures/styled-call-component-trailing-comma/output.js

@@ -0,0 +1,14 @@
+import React from "react";
+import styled from "@emotion/styled";
+import { jsx } from "react/jsx-runtime";
+//#region virtual:entry.tsx
+const styleProps = () => ({ display: "inline-block" });
+const Icon = /* @__PURE__ */ styled(React.forwardRef(({ className }, ref) => /* @__PURE__ */ jsx("svg", {
+	ref,
+	className
+})), {
+	target: "e1i63ugi0",
+	label: "Icon"
+})(styleProps, "/*# sourceMappingURL=[sourcemap] */");
+//#endregion
+export { Icon };