32 lines
920 B
Svelte
32 lines
920 B
Svelte
|
|
<script>
|
||
|
|
|
||
|
|
import {onMount} from "svelte";
|
||
|
|
import offcanvas from "bootstrap/js/src/offcanvas.js";
|
||
|
|
export let title = "";
|
||
|
|
let isHidden = true;
|
||
|
|
let offcanvasEl;
|
||
|
|
let offcanvasInstance;
|
||
|
|
|
||
|
|
export function show() {
|
||
|
|
offcanvasInstance.show();
|
||
|
|
}
|
||
|
|
onMount(()=>{
|
||
|
|
offcanvasInstance = new offcanvas(offcanvasEl);
|
||
|
|
});
|
||
|
|
|
||
|
|
export function hide(e) {
|
||
|
|
e.preventDefault();
|
||
|
|
offcanvasInstance.hide();
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<div bind:this={offcanvasEl} class="offcanvas offcanvas-end" data-bs-backdrop="static" tabindex="-1"
|
||
|
|
aria-labelledby="offcanvasEditContent">
|
||
|
|
<div class="offcanvas-header">
|
||
|
|
<h5 class="offcanvas-title">{title}</h5>
|
||
|
|
<button type="button" on:click={hide} class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
|
||
|
|
</div>
|
||
|
|
<div class="offcanvas-body" style="overflow: auto">
|
||
|
|
<slot/>
|
||
|
|
</div>
|
||
|
|
</div>
|