Skip to content

Error when passing props to the css attribute in solid/stitches #829

@benash

Description

@benash

When using the SolidJS integration, the following results in Uncaught ReferenceError: props is not defined in the browser:

const BrokenInput = (props: InputProps) => (
  <input
    css={{
      ...tw`border`,
      ...(props.hasHover && tw`hover:border-red-600`),
    }}
  />
)

On the other hand, this works fine:

const WorkingInput = styled.input((props: InputProps) => ({
  ...tw`border`,
  ...(props.hasHover && tw`hover:border-red-600`),
}))

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions