@setoelkahfi / svara / commits / df871f9

Some setting stuff

mellobacon committed Nov 27, 2022 at 19:15 UTC df871f96c686e2add8575562484acca2b256008e
4 files changed +32 -5
src/components/FileTree/TreeViewNode.svelte
+2 -1
@@ -32,6 +32,7 @@
32 export let disabled = false;
33 export let dblclick = false;
34 export let path = "";
35 + export let parentnode = null;
36
37 /**
38 * Specify the icon to render
@@ -59,7 +60,7 @@
60 prevActiveId = $activeNodeId;
61 });
62
62 - $: node = { id, name: name, expanded: false, leaf, path };
63 + $: node = { id, parent: parentnode, name: name, expanded: false, leaf, path };
64 $: if (refLabel) {
65 refLabel.style.marginLeft = `-${offset()}rem`;
66 refLabel.style.paddingLeft = `${offset()}rem`;
src/components/FileTree/TreeViewNodeList.svelte
+2 -2
@@ -75,7 +75,7 @@
75 {#if Array.isArray(child.children)}
76 <svelte:self {dblclick} isroot={root} {...child} />
77 {:else}
78 - <TreeViewNode leaf {dblclick} {...child} />
78 + <TreeViewNode parentnode={node} leaf {dblclick} {...child} />
79 {/if}
80 {/each}
81 {:else}
@@ -155,7 +155,7 @@
155 {#if Array.isArray(child.children)}
156 <svelte:self {dblclick} {...child} />
157 {:else}
158 - <TreeViewNode leaf {dblclick} {...child} />
158 + <TreeViewNode parentnode={node} leaf {dblclick} {...child} />
159 {/if}
160 {/each}
161 </ul>
src/components/Settings/Settings.svelte
+3 -2
@@ -1,14 +1,15 @@
1 <script lang="ts">
2 - //import SettingsList, {setting} from "../Tree/SettingsList.svelte";
2 + import SettingsTree, {setting} from "./SettingsTree.svelte";
3 import AppearanceSettings from "./settings/general/AppearanceSettings.svelte";
4 export let hidden = false;
5
6 </script>
7 <div id="settings" class:hidden>
8 <div id="settings-list">
9 + <SettingsTree></SettingsTree>
10 </div>
11 <div id="settings-view">
11 - <div id="title">Settings View</div>
12 + <div id="title">{$setting}</div>
13 <div id="setting">
14 <AppearanceSettings></AppearanceSettings>
15 </div>
src/components/Settings/SettingsTree.svelte new
+25
@@ -0,0 +1,25 @@
1 +<script lang="ts">
2 + import TreeView from "../FileTree/TreeView.svelte";
3 + let tree = [
4 + {id: 0, path: "general", name: "General", children: [
5 + {id: 1, path: "file1", name: "Appearance"},
6 + {id: 2, path: "file1", name: "Shortcuts"},
7 + ]},
8 + {id: 3, path: "file1", name: "Editor", children: [
9 + {id: 4, path: "file1", name: "Appearance"},
10 + {id: 5, path: "file1", name: "Files"},
11 + {id: 6, path: "file1", name: "Code"},
12 + ]},
13 + ];
14 +</script>
15 +<script lang="ts" context="module">
16 + import { writable } from "svelte/store";
17 +
18 + export let setting = writable("");
19 + function openSetting(event) {
20 + let node = event.detail;
21 + setting.set(`${node.parent.name}/${node.name}`);
22 + }
23 +</script>
24 +
25 +<TreeView children={tree} size="compact" on:select={openSetting}></TreeView>
\ No newline at end of file