Skip to content

Commit

Permalink
fix: line wrapping in Select component (#691)
Browse files Browse the repository at this point in the history
  • Loading branch information
Scooter1337 authored Jan 24, 2024
1 parent 0642be4 commit 811a062
Show file tree
Hide file tree
Showing 2 changed files with 2 additions and 2 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@

<SelectPrimitive.Trigger
class={cn(
"flex h-10 w-full items-center justify-between rounded-md border border-input bg-transparent px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
"flex h-10 w-full items-center justify-between rounded-md border border-input bg-transparent px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1 line-clamp-1 truncate",
className
)}
{...$$restProps}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@

<SelectPrimitive.Trigger
class={cn(
"flex h-9 w-full items-center justify-between rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
"flex h-9 w-full items-center justify-between rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1 line-clamp-1 truncate",
className
)}
{...$$restProps}
Expand Down

7 comments on commit 811a062

@vercel
Copy link

@vercel vercel bot commented on 811a062 Jan 24, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@phenomen
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Scooter1337 This change broke all my select components. Trigger is now displayed in the bottom-left corner instead of center-right side. I do not have any custom styles for selects.

@Scooter1337
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you provide a repro? I can’t reproduce this issue in Safari (Mobile and Desktop) nor in Chrome, and Edge.

The styles I added are copied directly from the original shadcn/ui library.

@phenomen
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Scooter1337 I don't have an open-source repo since I use it in an internal proprietary tool.

Here is how it looks after the update:
image

Here is how it looks when I revert changes:
image

Google Chrome 120, Windows 11.

@Scooter1337
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I’ll try to repro asap. Very weird behavior. I’ll keep you posted

@Scooter1337
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Found the issue, will open a PR.

@Scooter1337
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you test if the css from PR #705 solves your problem, and leave a comment on the PR? :)

Please sign in to comment.