vaul
vaul copied to clipboard
Should vaul use standard data attribute?
Should vaul
convert non-standard to standard attribute?
From
<div role="dialog" data-state="open" vaul-drawer="" vaul-drawer-direction="right" vaul-drawer-visible="true">
To
<div role="dialog" data-state="open" data-vaul-drawer="" data-vaul-drawer-direction="right" data-vaul-drawer-visible="true">
The benefit here aside from being standard is able to select data attribute using tailwind.
Use case I can use data-vaul-drawer-direction
to set css value like.
<DrawerPrimitive.Content
className={cn(
`fixed z-50 bg-panel`,
`data-[vaul-drawer-direction=right]:inset-y-0
data-[vaul-drawer-direction=right]:right-0`,
className,
)}
>
Right now I have to pass direction to content component, ideally it should be getting direction from root component.