The latest updates on your projects. Learn more about Vercel for Git ↗︎

@zaaakher is attempting to deploy a commit to the TypeCell Team on Vercel.

A member of the Team first needs to authorize it.

Thanks for your PR @zaaakher.

I'm curious about the root cause of this. If you set dir="rtl" on the html or container, I would expet Floating UI to automatically flip directions.

According to the docs: (https://floating-ui.com/docs/usefloating#placement)

The -start and -end alignments are
logical
and will adapt to the writing direction (e.g. RTL) as expected.

Could it be the root cause of this issue is somewhere else?

@YousefED you're right, it should ideally adapt to RTL without explicit dir prop or any prop-drilling.

After a little digging, it seems that the floatingStyles coming from the useFloating hook is the one preventing -start from being dynamic with the layout direction.

When I comment out this line

The -start positioning works fine (but the fixed/absolute positioning breaks)

Digging into the source-code of floating-ui, I think this is the root cause of the issue:
https://github.com/floating-ui/floating-ui/blob/cea9065811ff347cfe388720b3cc91165c8cebe7/packages/react-dom/src/useFloating.ts#L159

I think it should be inset-inline-start

It seems that floatingStyles.transform is the one positioning it and not left/insetInlineStart as I thought.

Based on the response from floating-ui here floating-ui/floating-ui#2982 (comment) it seems the expected automatic direction flip based on dir layout isn't yet supported natively in floating-ui.

Other than the minor prop-drilling suggested in this PR, I can't honestly think of an alternative way to do it. 😅