Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

When Combobox.Search is used with ScrollArea, it will exceed the boundary. #6562

Closed
1 of 2 tasks
minosss opened this issue Jul 21, 2024 · 1 comment
Closed
1 of 2 tasks
Labels
Fixed patch Completed issues that will be published with next patch (1.0.X)

Comments

@minosss
Copy link

minosss commented Jul 21, 2024

Dependencies check up

  • I have verified that I use latest version of all @mantine/* packages

What version of @mantine/* packages do you have in package.json?

7.11.2

What package has an issue?

@mantine/core

What framework do you use?

Next.js

In which browsers you can reproduce the issue?

Chrome

Describe the bug

When Combobox.Search is used with ScrollArea, it will exceed the boundary. Because the search input set width style calc(100% + var(--combobox-padding) * 2). However, there is no processing done when there are ScrollArea.

If possible, include a link to a codesandbox with a minimal reproduction

https://codesandbox.io/p/sandbox/icy-snow-5g2f6m

Possible fix

Reset width when there are has ScrollArea

.mantine-Combobox-dropdown:has([data-mantine-scrollbar]) .mantine-Combobox-search {
  width: calc(100% + var(--combobox-padding));
}

Self-service

  • I would be willing to implement a fix for this issue
rtivital added a commit that referenced this issue Aug 7, 2024
@rtivital rtivital added the Fixed patch Completed issues that will be published with next patch (1.0.X) label Aug 7, 2024
@rtivital
Copy link
Member

Fixed in 7.12.1

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Fixed patch Completed issues that will be published with next patch (1.0.X)
Projects
None yet
Development

No branches or pull requests

2 participants