[BUG] - Textarea Focus Color Not Applying as Expected in HeroUI

[doyeolKR]

HeroUI Version

@heroui/react^2.7.2

Describe the bug

The issue is that the color does not change on focus state while typing.

In the following code, the data-[hover=true]:bg-red-200 works as expected inside the inputWrapper of the Textarea component, but the data-[focus=true]:bg-blue-200 does not. The color does not change when the Textarea is focused for text input.

<Textarea
  value={question}
  onChange={(e) => setQuestion(e.target.value)}
  onKeyDown={handleKeyDown}
  placeholder="question"
  fullWidth
  className="mb-2"
  classNames={{
    inputWrapper: [
      "data-[focus=true]:bg-blue-200",
      "bg-default-200",
      "data-[hover=true]:bg-red-200",
    ],
  }}
/>

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

1. Click on the Textarea.
2. Check for errors.

Expected behavior

I want the inside of the Textarea to change to bg-blue-200 when I click and focus on it, but it changes to the default gray color that HeroUI has set instead.

Screenshots or Videos

No response

Operating System Version

Window

Browser

Chrome

[linear]

ENG-2175 [BUG] - YOUR_ISSUE_TITLE_HERE_REPLACE_ME