awcodes / alpine-floating-ui

Add Floating UI functionality to Alpine 3.x components.
MIT License
79 stars 3 forks source link

Add support for size middleware #4

Closed aaronhuisinga closed 1 year ago

aaronhuisinga commented 1 year ago

This simple PR adds support for the Floating UI Size Middleware. I've tested this and am able to use it as expected with this addition.

<div
    x-ref="dropdown"
    x-float.placement.bottom-end.flip.offset.size.teleport="{
        size: {
            apply({availableWidth, availableHeight, elements}) {
                // Do things with the data, e.g.
                Object.assign(elements.floating.style, {
                    maxWidth: `${availableWidth}px`,
                    maxHeight: `${availableHeight}px`,
                });
            },
        }
  }"
>
Some test content
</div>

This grabs the correct values and runs the apply function as expected.

awcodes commented 1 year ago

Thanks for the PR. I'll review tomorrow. Cheers.

awcodes commented 1 year ago

Thanks.