28 lines
730 B
Svelte
28 lines
730 B
Svelte
<script lang="ts">
|
|
import type {Component} from "svelte"
|
|
import {fade, translate} from "@lib/transition"
|
|
|
|
type Props = {
|
|
onClose?: any
|
|
children: {
|
|
component: Component
|
|
props: Record<string, any>
|
|
}
|
|
}
|
|
|
|
const {onClose, children}: Props = $props()
|
|
</script>
|
|
|
|
<div class="drawer fixed inset-0 z-modal">
|
|
<button
|
|
aria-label="Close drawer"
|
|
class="absolute inset-0 cursor-pointer bg-black opacity-50"
|
|
transition:fade
|
|
onclick={onClose}>
|
|
</button>
|
|
<div
|
|
class="bg-surface scroll-container py-sai pr-sair absolute bottom-0 right-0 top-0 w-72 overflow-auto lg:w-96"
|
|
transition:translate={{axis: "x", duration: 300}}>
|
|
<children.component {...children.props} />
|
|
</div>
|
|
</div>
|