ryuji-1to
commented
2 months ago have the same problem
Open t3rminus opened 2 months ago
ryuji-1to
commented
2 months ago have the same problem
ErtyumPX
commented
1 month ago Assuming that minimum width was hard-coded for styling purposes, I appreciate the tremorlabs' open source components, however:
Having the same issue, it's not ideal to have the minimum width hard coded in every input component, not only in Select, it is also the same in the BaseInput component which other inputs inherit. Would very much appreciate if there was an easy work-around at least.
It killed my day while working on a registration window, and wanted to have a Single Selection for country code for phone number, it does not really have to take 10rem of width when the maximum length is 3
Tremor Version
3.13.4
Link to minimal reproduction
N/A
Steps to reproduce
Create a Select component, and place in a container with the width narrower than 10rem
What is expected?
The Select component shrinks to fit the container
What is actually happening?
The Select component overflows the container, due to min-w-[10rem] on the container elements.
What browsers are you seeing the problem on?
No response
Any additional comments?
This worked as expected in 3.11.1, but broke when I updated my project to 3.13.4.
Tremor is so full of hard-coded styles, and assumptions on how components will be used. It's ultimately still faster to build our project using it, but it's incredibly frustrating to run into these situations where a container has hard-coded styles, and there's no way to override them.
Do not assume to know how a component is being used. In absence of a date/time picker component (or documentation on it), I ended up writing my own wrapper, which uses Selects for the hour & minute. They do not need to be 10rem wide, since they're picking from (at most) two characters.