Cursor Display

Built-in components with Cursor highlighting

CursorButton

<div className="flex flex-col gap-2">
  <div className="space-x-2">
    <CursorButton>CursorButton</CursorButton>
    <CursorButton variant="secondary">CursorButton</CursorButton>
    <CursorButton variant="destructive">CursorButton</CursorButton>
    <CursorButton variant="ghost">CursorButton</CursorButton>
  </div>
  <div className="space-x-2">
    <Button>Button</Button>
    <Button variant="secondary">Button</Button>
    <Button variant="destructive">Button</Button>
    <Button variant="ghost">Button</Button>
  </div>
</div>

CursorInputRoot

<CursorInputRoot size="sm" placeholder="CursorInputRoot" / >
<CursorInputRoot size="sm" placeholder="CursorInputRoot" state="error"/ >
<CursorInputRoot size="sm" placeholder="CursorInputRoot" disabled/>

CursorSelectTrigger

<CursorSelectTrigger size="sm" className="w-[120px]">
  <SelectValue placeholder="CursorSelectTrigger"/>
</CursorSelectTrigger>
<CursorSelectTrigger disabled size="sm" className="w-[120px]">
  <SelectValue placeholder="CursorSelectTrigger"/>
</CursorSelectTrigger>
<CursorSelectTrigger state="error" size="sm" className="w-[120px]">
  <SelectValue placeholder="CursorSelectTrigger"/>
</CursorSelectTrigger>

CursorTextarea

<CursorTextarea size="base" placeholder="Type your message here." />

<CursorTextarea disabled placeholder="Type your message here." />

<CursorTextarea state="error" placeholder="Type your message here." />