Max Richter
d06b33f508
All checks were successful
Deploy to GitHub Pages / build_site (push) Successful in 1m55s
49 lines
997 B
Svelte
49 lines
997 B
Svelte
<script lang="ts">
|
|
import { getContext } from "svelte";
|
|
import type { Readable } from "svelte/store";
|
|
|
|
export let id: string;
|
|
export let icon: string = "";
|
|
export let title = "";
|
|
export let classes = "";
|
|
export let hidden: boolean | undefined = undefined;
|
|
|
|
const setVisibility =
|
|
getContext<(id: string, visible: boolean) => void>("setVisibility");
|
|
|
|
$: if (typeof hidden === "boolean") {
|
|
setVisibility(id, !hidden);
|
|
}
|
|
|
|
const registerPanel =
|
|
getContext<
|
|
(id: string, icon: string, classes: string) => Readable<boolean>
|
|
>("registerPanel");
|
|
|
|
let visible = registerPanel(id, icon, classes);
|
|
</script>
|
|
|
|
{#if $visible}
|
|
<div class="wrapper" class:hidden>
|
|
{#if title}
|
|
<header>
|
|
<h3>{title}</h3>
|
|
</header>
|
|
{/if}
|
|
<slot />
|
|
</div>
|
|
{/if}
|
|
|
|
<style>
|
|
header {
|
|
border-bottom: solid thin var(--outline);
|
|
height: 69px;
|
|
display: flex;
|
|
align-items: center;
|
|
padding-left: 1em;
|
|
}
|
|
h3 {
|
|
margin: 0px;
|
|
}
|
|
</style>
|