39 lines
1.2 KiB
Svelte
39 lines
1.2 KiB
Svelte
<script>
|
|
import {createEventDispatcher, getContext, onMount} from "svelte";
|
|
import Icon from "../common/Icon.svelte";
|
|
import Folder from "./Folder.svelte";
|
|
|
|
const channel = getContext("channel");
|
|
export let folder;
|
|
export let schema;
|
|
export let expanded = folder.shoudlExpand;
|
|
|
|
function toggleExpand() {
|
|
expanded = !expanded;
|
|
}
|
|
</script>
|
|
<div class="sidebar-folder">
|
|
{#if folder.name !== ""}
|
|
<button class="sidebar-header" tabindex="0" on:click={toggleExpand}>
|
|
{folder.name.replaceAll("_"," ") ?? "Main"}
|
|
{#if expanded}
|
|
<Icon icon="circle-chevron-up"></Icon>
|
|
{:else}
|
|
<Icon icon="circle-chevron-down"></Icon>
|
|
{/if}
|
|
</button>
|
|
{/if}
|
|
{#if expanded}
|
|
{#each folder.folders as aFolder}
|
|
<Folder folder={aFolder} schema={schema} ></Folder>
|
|
{/each}
|
|
|
|
{#each folder.files as aSchema}
|
|
<a class="sidebar-item" class:active={aSchema.name === schema?.name}
|
|
aria-current="page"
|
|
href="{channel.lucentUrl}/content/{aSchema.name}">{aSchema.label}</a>
|
|
{/each}
|
|
|
|
|
|
{/if}
|
|
</div> |