forked from MapComplete/MapComplete
30 lines
610 B
Svelte
30 lines
610 B
Svelte
<script lang="ts">
|
|
import { Drawer } from "flowbite-svelte"
|
|
import { sineIn } from "svelte/easing"
|
|
import { UIEventSource } from "../../Logic/UIEventSource.js"
|
|
|
|
export let shown: UIEventSource<boolean>;
|
|
let transitionParams = {
|
|
x: -320,
|
|
duration: 200,
|
|
easing: sineIn
|
|
};
|
|
let hidden = !shown.data
|
|
$: {
|
|
shown.setData(!hidden)
|
|
}
|
|
shown.addCallback(sh => {
|
|
hidden = !sh
|
|
})
|
|
</script>
|
|
|
|
|
|
<Drawer placement="left"
|
|
transitionType="fly" {transitionParams}
|
|
divClass = "overflow-y-auto z-50 "
|
|
bind:hidden={hidden}>
|
|
<slot>
|
|
CONTENTS
|
|
</slot>
|
|
</Drawer>
|
|
|