Skip to content

nativewind not working with jsx-runtime transformed components #263

@Alvi24

Description

@Alvi24

Describe the bug

export const Icon = (props: IconProps) => {
  return jsxs(Svg, {
    height: "18",
    width: "18",
    viewBox: "0 0 18 18",
    strokeWidth: "1.5",
    ...props,
    children: [
      /* @__PURE__ */ jsx(G, {
        fill: "currentColor",
        children: /* @__PURE__ */ jsx(Path, {
          d: "M2.75 9.25L6.75 14.25L15.25 3.75",
          stroke: "currentColor",
          strokeWidth: "1.5",
          strokeLinecap: "round",
          strokeLinejoin: "round",
          fill: "none",
        }),
      }),
    ],
  });
};

i have this icon component and when trying to style it with className , the styles are not applying

Reproduction
Here is the reproduction: https://stackblitz.com/edit/nativewind-test-4whoakvo?file=nativewind.test.tsx

Expected behavior
tailwind styles in className should be applied

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions