Using size in middlewares for MultiSelect

[mkf62]

I've looked at the Mantine source code and the Floating UI docs, but I'm still unclear on how to use the size property in middlewares. It seems like I'd need to give it an apply function with the middleware state, max height, and max width, but I'm not sure how to get the state of the middleware. I mostly just want to control the height to a certain level before the dropdown flips to a top position.

<MultiSelect
    name={selectName}
    value={value}
    label={label}
    description={description}
    data={data}
    onChange={handleChange}
    disabled={disabled}
    error={error}
    comboboxProps={{ offset: 2, position: 'bottom', middlewares: { size: { apply(???) }  }  }}
    clearable
/>

I see Mantine accepts a boolean value for size also, but I can't imagine that does any good if it doesn't know what the max-height of the dropdown should be. It doesn't make a difference when I use it.

comboboxProps={{ offset: 2, position: 'bottom', middlewares: {size: true} }}

[rtivital]

You can learn how this middleware works in Floating UI documentation – https://floating-ui.com/docs/size

[mkf62]

Thanks, but I mentioned in my post already that I looked at those docs and I still don’t really get how to obtain the “middleware state” info so I was hoping someone might have an example.

[rtivital]

You do not get any state from it. You provide a function that determines the size.