I’ve got a simple button component but the .tsx generated includes this import that doesn’t exist:
import type {Jsx_element as PervasivesU_Jsx_element} from './PervasivesU.gen';
I’m seeing this a lot on each @react.component that I’m using @genType on. I’m assuming that there’s something obvious that I’m doing wrong here.
Here’s this specific component’s src
type variant = [#Button(ReactEvent.Mouse.t => unit) | #A(string)]
type size = [#sm | #md | #lg]
type shape = [#oval | #circle]
type color = [#smoke | #lime]
@genType @react.component
let make = (
~variant: variant,
~isActive=false,
~icon: option<React.element>=?,
~size=#sm,
~className="",
~children: React.element,
~shape=#oval,
~color=#smoke,
~ref_: option<ReactDOM.domRef>=?,
): React.element => {
let shapeBaseClass = "rounded-[90px] px-4"
let shapeClass = switch shape {
| #oval => shapeBaseClass
| #circle => `${shapeBaseClass} rounded-full px-2.5`
}
let colorBaseClass = `border-phantom bg-black hover:bg-phantom active:bg-phantom ${isActive
? "text-smoke"
: "text-graphite hover:text-space"}`
let colorClass = switch color {
| #smoke => colorBaseClass
| #lime =>
`border-transparent text-brand-green hover:bg-lime-20 hover:border-lime-20 active:bg-lime-20 ${isActive
? "bg-lime-20"
: "bg-lime-10"}`
}
let labelBaseClass = icon->Option.map(_ => "")->Option.getOr("w-full")
let labelClass = switch size {
| #sm => `${labelBaseClass} text-body-sm leading-body-sm`
| #md => `${labelBaseClass} text-body-md leading-body-md`
| #lg => `${labelBaseClass} text-body-lg leading-body-lg`
}
let sizeClass = switch size {
| #sm => "gap-1"
| #md
| #lg => "gap-2"
}
let combinedClass = `g-focus flex flex-nowrap items-center py-1.5 border transition-all ${shapeClass} ${colorClass} ${sizeClass} ${className}`
switch variant {
| #Button(onClick) =>
<button ref=?{ref_} className=combinedClass onClick={onClick}>
<span className={labelClass}> {children} </span>
{icon->Option.getOr(React.null)}
</button>
| #A(href) =>
<a ref=?{ref_} className=combinedClass href>
<span className={labelClass}> {children} </span>
{icon->Option.getOr(React.null)}
</a>
}
}