[BUG] - Placeholder Misalignment in Multi-Select Dropdown with Chips

[berikidis]

NextUI Version

2.6.7

Describe the bug

In a multi-select dropdown component with chips and labelPlacement="inside", when isMultiline={true}, the placeholder text overlaps with the input area. This misalignment causes the placeholder to appear partially hidden, as shown in the attached screenshot.

here is my code

<Select
        name={fields.paymentMethods.name}
        label="Payment Methods"
        placeholder="Select payment methods"
        selectionMode="multiple"
        isMultiline={true}
        size="lg"
        defaultSelectedKeys={selectedPaymentMethods}
        classNames={{
           trigger: 'py-2',
        }}
        renderValue={(items) => (
           <div className="flex flex-wrap gap-2">
              {items.map((item) => (
                 <Chip key={item.key}>{item.textValue}</Chip>
              ))}
           </div>
        )}
     >
        {paymentMethods.map((method) => (
           <SelectItem key={method.value} value={method.value}>
              {method.label}
           </SelectItem>
        ))}
</Select>

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

1. Implement a multi-select dropdown with chips in your project.
2. Configure the dropdown with the properties:

isMultiline={true}
labelPlacement="inside"

Expected behavior

The placeholder text should remain fully visible and aligned properly when the isMultiline is true and labelPlacement is inside

Screenshots or Videos

Operating System Version

macOS

Browser

Chrome

[linear]

ENG-1705 [BUG] - Placeholder Misalignment in Multi-Select Dropdown with Chips