svelteuidev / svelteui

SvelteUI Monorepo
https://svelteui.dev
MIT License
1.31k stars 62 forks source link

[Feature Request] Documentation `NativeSelect` #490

Open doishub opened 9 months ago

doishub commented 9 months ago

Usage example, including component, action, motion, or utility API

I am currently struggling to customize the styles of a select. If I use the multiple attribute, I would like to be able to define the minimum height.

When passing overwrite only the InputWrapper can be customized. By looking further into the code I found the attribute inputStyle and tried to define further styles like this:

<NativeSelect
             data={items}
             label="Select"
+            override={{ minHeight: 80 }}  // Overwrites the styles of the InputWrapper
+            inputStyle={{'& .input':{ height: 200, minHeight: 200, resize: 'vertical' }}} // Try 1
+            inputStyle={{'& .select':{ height: 200, minHeight: 200, resize: 'vertical' }}} // Try 2
+            inputStyle={{ height: 200, minHeight: 200, resize: 'vertical' }} // Try 3
             multiple />

Unfortunately, none of this works as desired. Can you please adapt the documentation?

Possible implementation - describe how the feature can be implemented

No response

Do you want to contribute this feature and create a pull request

No

doishub commented 9 months ago

Basically, multiple does not seem to work. The setting does work, but only one value is returned.

BeeMargarida commented 9 months ago

Hey, I'll take a look at this this week, see what's happening. Sorry for the delay in giving you an answer

BeeMargarida commented 8 months ago

So, this is becoming more complex due to the way we setup the component. This is gonna take a while, perhaps I'll park it since we are working on migrating the style API

doishub commented 8 months ago

Okay, good to know, I can get by with my own component in the meantime. Thanks for the feedback and this library!