Dropdown
Shows an element after click or hover (depends on given props).
Hello, world! 👋🏼
Example
Example.svelte
<script>
import { Dropdown, IconButton } from "saraui"
</script>
<Dropdown>
<IconButton tooltip="?">
<span class="i-mdi-help"></span>
</IconButton>
<div slot="content" class="card p-2 shadow-md">
Hello, world! 👋🏼
</div>
</Dropdown>Props
position?:
DropdownBreakpointPosition | "top" | "bottom" | "right" | "left" | "top-end" | "bottom-end" | "right-end" | "left-end"
isClosable?:
boolean
openOnHover?:
boolean
Types
DropdownBreakpointPosition
{
sm?: "top" | "bottom" | "right" | "left" | "top-end" | "bottom-end" | "right-end" | "left-end"
md?: "top" | "bottom" | "right" | "left" | "top-end" | "bottom-end" | "right-end" | "left-end"
lg?: "top" | "bottom" | "right" | "left" | "top-end" | "bottom-end" | "right-end" | "left-end"
xl?: "top" | "bottom" | "right" | "left" | "top-end" | "bottom-end" | "right-end" | "left-end"
}