From 43b37c4a80ad0d461e6728c1f685c8ad98a23c89 Mon Sep 17 00:00:00 2001 From: ShadiestGoat <48590492+ShadiestGoat@users.noreply.github.com> Date: Wed, 16 Apr 2025 17:37:22 +0100 Subject: [PATCH] Format --- .editorconfig | 20 +- .prettierrc | 2 +- package.json | 1 + src/components/PlatformDropdown.svelte | 12 +- src/components/interaction.ts | 24 +- src/components/modals/Confirmation.svelte | 12 +- src/components/modals/NewLayout.svelte | 42 +-- src/components/modals/OverrideLayout.svelte | 21 +- src/components/settings/SettingItem.svelte | 2 +- src/components/settings/SettingLayout.svelte | 257 ++++++++------- src/components/settings/Settings.svelte | 54 ++-- src/main.ts | 316 ++++++++++--------- src/modals.ts | 82 ++--- src/obsidianLayout.ts | 138 ++++---- src/settings.ts | 37 +-- 15 files changed, 517 insertions(+), 503 deletions(-) diff --git a/.editorconfig b/.editorconfig index 84b8a66..81f3ec3 100644 --- a/.editorconfig +++ b/.editorconfig @@ -1,10 +1,10 @@ -# top-most EditorConfig file -root = true - -[*] -charset = utf-8 -end_of_line = lf -insert_final_newline = true -indent_style = tab -indent_size = 4 -tab_width = 4 +# top-most EditorConfig file +root = true + +[*] +charset = utf-8 +end_of_line = lf +insert_final_newline = true +indent_style = tab +indent_size = 4 +tab_width = 4 diff --git a/.prettierrc b/.prettierrc index e5b10e0..e9b145f 100644 --- a/.prettierrc +++ b/.prettierrc @@ -1,5 +1,5 @@ { - "useTabs": false, + "useTabs": true, "tabWidth": 4, "singleQuote": true, "trailingComma": "none", diff --git a/package.json b/package.json index 2c3f9d0..901b194 100644 --- a/package.json +++ b/package.json @@ -34,6 +34,7 @@ "globals": "^16.0.0", "obsidian": "latest", "prettier": "^3.5.3", + "prettier-plugin-svelte": "^3.3.3", "svelte": "^5.26.2", "svelte-check": "^4.1.6", "svelte-preprocess": "^6.0.3", diff --git a/src/components/PlatformDropdown.svelte b/src/components/PlatformDropdown.svelte index dfd085c..b0833e3 100644 --- a/src/components/PlatformDropdown.svelte +++ b/src/components/PlatformDropdown.svelte @@ -1,11 +1,11 @@ - + + + diff --git a/src/components/interaction.ts b/src/components/interaction.ts index 3c12b04..c7f969e 100644 --- a/src/components/interaction.ts +++ b/src/components/interaction.ts @@ -1,19 +1,19 @@ import type { KeyboardEventHandler, MouseEventHandler } from 'svelte/elements' export function buttonInteraction(cb: () => void): { - onkeypress: KeyboardEventHandler - onclick: MouseEventHandler + onkeypress: KeyboardEventHandler + onclick: MouseEventHandler } { - return { - onclick: (e) => { + return { + onclick: (e) => { if (e.currentTarget.hasAttribute('disabled')) return - cb() - }, - onkeypress: (e) => { + cb() + }, + onkeypress: (e) => { if (e.currentTarget.hasAttribute('disabled')) return - if (e.key == 'Enter' || e.key == ' ') { - cb() - } - } - } + if (e.key == 'Enter' || e.key == ' ') { + cb() + } + } + } } diff --git a/src/components/modals/Confirmation.svelte b/src/components/modals/Confirmation.svelte index 49880f9..98a37b7 100644 --- a/src/components/modals/Confirmation.svelte +++ b/src/components/modals/Confirmation.svelte @@ -1,12 +1,12 @@
-

{desc}

- - +

{desc}

+ +
diff --git a/src/components/modals/NewLayout.svelte b/src/components/modals/NewLayout.svelte index f61ccb6..dd27e25 100644 --- a/src/components/modals/NewLayout.svelte +++ b/src/components/modals/NewLayout.svelte @@ -1,31 +1,31 @@
{ - e.preventDefault() - e.stopPropagation() + class="lm-new-layout-container" + onsubmit={(e) => { + e.preventDefault() + e.stopPropagation() - onSubmit(name.trim(), paths.trim(), platMode) - }} + onSubmit(name.trim(), paths.trim(), platMode) + }} > - - - - - + + + + + - + diff --git a/src/components/modals/OverrideLayout.svelte b/src/components/modals/OverrideLayout.svelte index a04e460..6d0b4ae 100644 --- a/src/components/modals/OverrideLayout.svelte +++ b/src/components/modals/OverrideLayout.svelte @@ -1,20 +1,23 @@ -
{ - e.preventDefault() - e.stopPropagation() + { + e.preventDefault() + e.stopPropagation() - onSubmit(name) -}}> + onSubmit(name) + }} +> - +
diff --git a/src/components/settings/SettingItem.svelte b/src/components/settings/SettingItem.svelte index 947c343..351f0f3 100644 --- a/src/components/settings/SettingItem.svelte +++ b/src/components/settings/SettingItem.svelte @@ -1,5 +1,5 @@
{ - if (!e.currentTarget.open) { - editingTitle = false - tmpValue = option.name - } - }} + ontoggle={(e) => { + if (!e.currentTarget.open) { + editingTitle = false + tmpValue = option.name + } + }} > - { - if (e.key == ' ') { - e.stopPropagation() - e.preventDefault() - } - }} - > - {#if editingTitle} - - {:else} -

{option.name}

- {/if} -
+ { + if (e.key == ' ') { + e.stopPropagation() + e.preventDefault() + } + }} + > + {#if editingTitle} + + {:else} +

{option.name}

+ {/if} +
-
-
-

Manage

-
+
+
+

Manage

+
- {#if size > 1} - {#if size > 2} - - {/if} - - - {#if size > 2} - - {/if} - {/if} + {#if size > 1} + {#if size > 2} + + {/if} + + + {#if size > 2} + + {/if} + {/if} - {#if editingTitle} - - - {:else} - - {/if} + {#if editingTitle} + + + {:else} + + {/if} -
+
- -
+ +
- - - + + + - - - -
+ + + +
diff --git a/src/components/settings/Settings.svelte b/src/components/settings/Settings.svelte index c45bdf4..ae91d15 100644 --- a/src/components/settings/Settings.svelte +++ b/src/components/settings/Settings.svelte @@ -1,33 +1,37 @@ {#each $settings as l, i (l.name)} - { - $settings.splice(i, 1) - $settings.splice(targetI, 0, l) - $settings = $settings - }} - deleteSelf={() => { - new ConfirmModal(app, (success) => { - if (!success) return - $settings.splice(i, 1) + { + $settings.splice(i, 1) + $settings.splice(targetI, 0, l) + $settings = $settings + }} + deleteSelf={() => { + new ConfirmModal( + app, + (success) => { + if (!success) return + $settings.splice(i, 1) - $settings = $settings - }, { desc: `This will delete the layout '${l.name}'` }).open() - }} - /> + $settings = $settings + }, + { desc: `This will delete the layout '${l.name}'` } + ).open() + }} + /> {/each} diff --git a/src/main.ts b/src/main.ts index 2a59613..23f0759 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1,84 +1,92 @@ -import { FileView, Notice, Platform, Plugin, setIcon, WorkspaceLeaf } from 'obsidian' +import type { WorkspaceLeaf } from 'obsidian' +import { FileView, Notice, Platform, Plugin, setIcon } from 'obsidian' import { savableLayout, targetedLayout, type AnyContainer, type LayoutData } from './obsidianLayout' import { LayoutMgrSettings, PlatformMode, type SavedLayout, type SettingData } from './settings' import { NewLayoutModal, OverrideLayoutModal } from './modals' import { minimatch } from 'minimatch' export default class LayoutManager extends Plugin { - settings: SettingData - switching = false + settings: SettingData + switching = false - /** leaf id -> file path */ - lastState = new Map() - /** - * The original leaves created by this plugin - * If empty, treat all leaves as original - */ - originalLeafs: string[] = [] + /** leaf id -> file path */ + lastState = new Map() + /** + * The original leaves created by this plugin + * If empty, treat all leaves as original + */ + originalLeafs: string[] = [] - async onload(): Promise { - await this.loadSettings() + async onload(): Promise { + await this.loadSettings() - this.addCommand({ - id: 'save-layout', - name: 'Save Layout', - callback: () => { - const cont = this.getCurrentLayout() - if (!cont) { - return - } + this.addCommand({ + id: 'save-layout', + name: 'Save Layout', + callback: () => { + const cont = this.getCurrentLayout() + if (!cont) { + return + } - new NewLayoutModal(this.app, (name, paths, platMode) => { - this.settings.push({ - container: cont, - name, - patterns: paths.split('\n').filter((v) => !!v).join("\n"), - platformMode: platMode - }) - this.saveSettings() - }, { otherNames: this.settings.map(s => s.name) }).open() - } - }) + new NewLayoutModal( + this.app, + (name, paths, platMode) => { + this.settings.push({ + container: cont, + name, + patterns: paths + .split('\n') + .filter((v) => !!v) + .join('\n'), + platformMode: platMode + }) + this.saveSettings() + }, + { otherNames: this.settings.map((s) => s.name) } + ).open() + } + }) - this.addCommand({ - id: 'override-layuout', - name: 'Override Layout', - callback: () => { - const cont = this.getCurrentLayout() - if (!cont) { - return - } + this.addCommand({ + id: 'override-layuout', + name: 'Override Layout', + callback: () => { + const cont = this.getCurrentLayout() + if (!cont) { + return + } - new OverrideLayoutModal( - this.app, - (name) => { - const i = this.settings.findIndex((s) => s.name == name) - if (i == -1) { - new Notice("Can't find this Layout") - return - } - this.settings[i].container = cont + new OverrideLayoutModal( + this.app, + (name) => { + const i = this.settings.findIndex((s) => s.name == name) + if (i == -1) { + new Notice("Can't find this Layout") + return + } + this.settings[i].container = cont - this.saveSettings() - }, - { options: this.settings.map((s) => s.name) } - ).open() - } - }) + this.saveSettings() + }, + { options: this.settings.map((s) => s.name) } + ).open() + } + }) - this.register(() => this.setOriginals([])) + this.register(() => this.setOriginals([])) - this.app.workspace.onLayoutReady(() => { - this.updateState() + this.app.workspace.onLayoutReady(() => { + this.updateState() - this.registerEvent( + this.registerEvent( // Method got too big, lives in a seperate file now - this.app.workspace.on('active-leaf-change', (l) => this.onActiveLeafChange(l)) - ) - }) + this.app.workspace.on('active-leaf-change', (l) => this.onActiveLeafChange(l)) + ) + }) this.addSettingTab(new LayoutMgrSettings(this.app, this)) - } + } onActiveLeafChange(l: WorkspaceLeaf | null) { const diffs = this.updateState() @@ -130,71 +138,69 @@ export default class LayoutManager extends Plugin { this.loadLayout(matched.container, path) } - manageOriginalIcon(id: string, add: boolean) { - // Its there... trust me... - const l = this.app.workspace.getLeafById(id) as { tabHeaderInnerIconEl: HTMLElement } | null - if (!l) return + manageOriginalIcon(id: string, add: boolean) { + // Its there... trust me... + const l = this.app.workspace.getLeafById(id) as { tabHeaderInnerIconEl: HTMLElement } | null + if (!l) return - l.tabHeaderInnerIconEl.toggleClass('lm-original', add) - setIcon(l.tabHeaderInnerIconEl, add ? 'layout-dashboard' : 'file') - } + l.tabHeaderInnerIconEl.toggleClass('lm-original', add) + setIcon(l.tabHeaderInnerIconEl, add ? 'layout-dashboard' : 'file') + } - setOriginals(newOnes: string[]) { - console.log('Unloading', this.originalLeafs, newOnes) + setOriginals(newOnes: string[]) { + // Cleanup or removed ones + this.originalLeafs.forEach((id) => { + if (!newOnes.contains(id)) this.manageOriginalIcon(id, false) + }) - // Cleanup or removed ones - this.originalLeafs.forEach((id) => { - if (!newOnes.contains(id)) this.manageOriginalIcon(id, false) - }) + // Always refresh the new ones, even if they are present as part of old + // This is to ensure icon is always right + newOnes.forEach((id) => { + this.manageOriginalIcon(id, true) + }) - // Always refresh the new ones, even if they are present as part of old - // This is to ensure icon is always right - newOnes.forEach((id) => { - this.manageOriginalIcon(id, true) - }) + this.originalLeafs = newOnes + } - this.originalLeafs = newOnes - } + /** + * @returns diffs + */ + updateState(): Record { + const curState = new Map() - /** - * @returns diffs - */ - updateState(): Record { - const curState = new Map() + this.app.workspace.iterateRootLeaves((l) => { + if (!l || !(l.view instanceof FileView) || !l.view.file) { + return + } - this.app.workspace.iterateRootLeaves((l) => { - if (!l || !(l.view instanceof FileView) || !l.view.file) { - return - } + curState.set(l.id, l.view.file?.path) + }) - curState.set(l.id, l.view.file?.path) - }) + const diffs: Record = {} - const diffs: Record = {} + curState.forEach((v, k) => { + const old = this.lastState.get(k) + if (old != v) { + diffs[k] = [old, v] + } + }) - curState.forEach((v, k) => { - const old = this.lastState.get(k) - if (old != v) { - diffs[k] = [old, v] - } - }) + this.lastState.forEach((v, k) => { + if (diffs[k]) { + return + } + if (!curState.has(k)) { + diffs[k] = [v, undefined] + } + }) - this.lastState.forEach((v, k) => { - if (diffs[k]) { - return - } - if (!curState.has(k)) { - diffs[k] = [v, undefined] - } - }) + this.lastState = curState - this.lastState = curState + return diffs + } - return diffs - } - - findLayoutForPath(p: string): SavedLayout | null { - for (const opt of this.settings) { + findLayoutForPath(p: string): SavedLayout | null { + for (const opt of this.settings) { if (opt.platformMode == PlatformMode.COMPUTER && !Platform.isDesktop) { continue } @@ -202,58 +208,58 @@ export default class LayoutManager extends Plugin { continue } - for (const pattern of opt.patterns.split("\n")) { - if (pattern && minimatch(p, pattern)) { - return opt - } - } - } + for (const pattern of opt.patterns.split('\n')) { + if (pattern && minimatch(p, pattern)) { + return opt + } + } + } - return null - } + return null + } - async saveSettings() { - return this.saveData(this.settings) - } + async saveSettings() { + return this.saveData(this.settings) + } - async loadSettings() { - const d = (await this.loadData()) ?? [] + async loadSettings() { + const d = (await this.loadData()) ?? [] - this.settings = Array.isArray(d) ? d : [] - } + this.settings = Array.isArray(d) ? d : [] + } - getCurrentLayout(): AnyContainer | null { - const fileSet = new Set() - const layoutData = this.app.workspace.getLayout() as LayoutData + getCurrentLayout(): AnyContainer | null { + const fileSet = new Set() + const layoutData = this.app.workspace.getLayout() as LayoutData - const layout = savableLayout(layoutData.main, fileSet, layoutData.active) - if (fileSet.size > 1) { - new Notice("Can't save: multiple files found in layout") - return null - } + const layout = savableLayout(layoutData.main, fileSet, layoutData.active) + if (fileSet.size > 1) { + new Notice("Can't save: multiple files found in layout") + return null + } - return layout - } + return layout + } - async loadLayout(layout: AnyContainer, path: string) { - this.switching = true + async loadLayout(layout: AnyContainer, path: string) { + this.switching = true - const curLayout = this.app.workspace.getLayout() as LayoutData + const curLayout = this.app.workspace.getLayout() as LayoutData - let activeId = curLayout.active - const ogSet = new Set() - const main = targetedLayout(layout, path, (id) => (activeId = id), ogSet) + let activeId = curLayout.active + const ogSet = new Set() + const main = targetedLayout(layout, path, (id) => (activeId = id), ogSet) - await this.app.workspace.changeLayout({ - ...curLayout, - main: main, - active: activeId - }) + await this.app.workspace.changeLayout({ + ...curLayout, + main: main, + active: activeId + }) - window.setTimeout(() => { - this.switching = false + window.setTimeout(() => { + this.switching = false - this.setOriginals(Array.from(ogSet)) - }, 300) - } + this.setOriginals(Array.from(ogSet)) + }, 300) + } } diff --git a/src/modals.ts b/src/modals.ts index b49d191..b3e82f8 100644 --- a/src/modals.ts +++ b/src/modals.ts @@ -7,71 +7,71 @@ import OverrideLayout from './components/modals/OverrideLayout.svelte' import Confirmation from './components/modals/Confirmation.svelte' abstract class genericSvelteModal< - // eslint-disable-next-line @typescript-eslint/no-unsafe-function-type - F extends Function, - C extends Component, - P extends Record = C extends Component ? Props : never + // eslint-disable-next-line @typescript-eslint/no-unsafe-function-type + F extends Function, + C extends Component, + P extends Record = C extends Component ? Props : never > extends Modal { - svelteContent: Record - callback: F + svelteContent: Record + callback: F - cbFuncName = 'onSubmit' - props: Partial

= {} + cbFuncName = 'onSubmit' + props: Partial

= {} - abstract title: string - abstract component: C + abstract title: string + abstract component: C - constructor(app: App, cb: F, props: Partial

= {}) { - super(app) + constructor(app: App, cb: F, props: Partial

= {}) { + super(app) - this.callback = cb - this.props = { ...this.props, ...props } - } + this.callback = cb + this.props = { ...this.props, ...props } + } - onOpen(): void { - this.setTitle(this.title) - this.shouldRestoreSelection = true + onOpen(): void { + this.setTitle(this.title) + this.shouldRestoreSelection = true - this.svelteContent = mount(this.component, { - target: this.contentEl, - props: { - ...this.props, - [this.cbFuncName]: (...args: unknown[]) => { - this.callback(...args) - this.close() - } - } - }) - } + this.svelteContent = mount(this.component, { + target: this.contentEl, + props: { + ...this.props, + [this.cbFuncName]: (...args: unknown[]) => { + this.callback(...args) + this.close() + } + } + }) + } - async onClose() { - unmount(this.svelteContent, { outro: true }) - } + async onClose() { + unmount(this.svelteContent, { outro: true }) + } } export type NewLayoutCallback = (name: string, paths: string, platformMode: PlatformMode) => void export class NewLayoutModal extends genericSvelteModal { - title = 'New Layout...' - component = NewLayout + title = 'New Layout...' + component = NewLayout } export type OverrideLayoutCallback = (name: string) => void export class OverrideLayoutModal extends genericSvelteModal< - OverrideLayoutCallback, - typeof OverrideLayout + OverrideLayoutCallback, + typeof OverrideLayout > { - title = 'Override Layout...' - component = OverrideLayout + title = 'Override Layout...' + component = OverrideLayout } export type ConfirmationModalCallback = (confirmed: boolean) => void export class ConfirmModal extends genericSvelteModal< ConfirmationModalCallback, - typeof Confirmation + typeof Confirmation > { - title = 'Are you sure?' - component = Confirmation + title = 'Are you sure?' + component = Confirmation } diff --git a/src/obsidianLayout.ts b/src/obsidianLayout.ts index d20275a..2476e77 100644 --- a/src/obsidianLayout.ts +++ b/src/obsidianLayout.ts @@ -3,38 +3,38 @@ import { type ViewState } from 'obsidian' export type KnownContainers = { - split: { direction: string } - tabs: Record - leaf: { state: ViewState & ViewStateFile; group?: string } + split: { direction: string } + tabs: Record + leaf: { state: ViewState & ViewStateFile; group?: string } } // I hate typescript export type AnyContainer = - | GenericContainer<'leaf'> - | GenericContainer<'split'> - | GenericContainer<'tabs'> + | GenericContainer<'leaf'> + | GenericContainer<'split'> + | GenericContainer<'tabs'> export type GenericContainer = { - id?: string - active?: boolean - type: N - children?: AnyContainer[] + id?: string + active?: boolean + type: N + children?: AnyContainer[] } & KnownContainers[N] export interface ViewStateFile { - type: 'markdown' - state: { - file: string - mode: 'preview' | 'source' - source: boolean - } + type: 'markdown' + state: { + file: string + mode: 'preview' | 'source' + source: boolean + } } export type LayoutData = { - // We don't care about layout data for anything other than the user content - // Though... future release maybe? If someone asks ig - main: AnyContainer - active: string + // We don't care about layout data for anything other than the user content + // Though... future release maybe? If someone asks ig + main: AnyContainer + active: string } /** @@ -42,33 +42,33 @@ export type LayoutData = { * @param setActive When an active leaf is found, it will call this cb */ export function targetedLayout( - l: AnyContainer, - f: string, - setActive: (id: string) => void, - ogSet: Set + l: AnyContainer, + f: string, + setActive: (id: string) => void, + ogSet: Set ): AnyContainer { - if (l.active) { - delete l.active - l.id = randomId(16) - setActive(l.id) - } + if (l.active) { + delete l.active + l.id = randomId(16) + setActive(l.id) + } - if (l.type != 'leaf') { - l.children?.forEach((c) => targetedLayout(c, f, setActive, ogSet)) - return l - } + if (l.type != 'leaf') { + l.children?.forEach((c) => targetedLayout(c, f, setActive, ogSet)) + return l + } - if (!l.active) { - l.id = randomId(16) - } + if (!l.active) { + l.id = randomId(16) + } - ogSet.add(l.id as string) + ogSet.add(l.id as string) - if (l.state.type == 'markdown') { - l.state.state.file = f - } + if (l.state.type == 'markdown') { + l.state.state.file = f + } - return l + return l } /** @@ -76,43 +76,43 @@ export function targetedLayout( * l becomes dirty after this, do not use it again. */ export function savableLayout( - l: AnyContainer, - fileSet: Set, - activeID: string + l: AnyContainer, + fileSet: Set, + activeID: string ): AnyContainer { - // This is basically js referance abuse, which is always fun & reliable & easy to debug :3 + // This is basically js referance abuse, which is always fun & reliable & easy to debug :3 - if (l.id == activeID) { - l.active = true - } + if (l.id == activeID) { + l.active = true + } - delete l.id + delete l.id - if (l.type == 'leaf') { - if (l.state.type == 'markdown') { - fileSet.add(l.state.state.file) + if (l.type == 'leaf') { + if (l.state.type == 'markdown') { + fileSet.add(l.state.state.file) - // @ts-expect-error Title causes issues - delete l.state.title + // @ts-expect-error Title causes issues + delete l.state.title - // Avoid saving extra metadata, set bare minimums - l.state.state = { - file: '', - mode: l.state.state.mode, - source: l.state.state.source - } - } - } else { - l.children?.forEach((c) => savableLayout(c, fileSet, activeID)) - } + // Avoid saving extra metadata, set bare minimums + l.state.state = { + file: '', + mode: l.state.state.mode, + source: l.state.state.source + } + } + } else { + l.children?.forEach((c) => savableLayout(c, fileSet, activeID)) + } - return l + return l } const possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789' function randomId(l: number) { - return Array.from( - { length: l }, - () => possible[Math.floor(Math.random() * possible.length)] - ).join('') + return Array.from( + { length: l }, + () => possible[Math.floor(Math.random() * possible.length)] + ).join('') } diff --git a/src/settings.ts b/src/settings.ts index 5c8a941..0f35bda 100644 --- a/src/settings.ts +++ b/src/settings.ts @@ -1,4 +1,5 @@ -import { App, PluginSettingTab } from 'obsidian' +import type { App } from 'obsidian' +import { PluginSettingTab } from 'obsidian' import type { AnyContainer } from './obsidianLayout' import { mount, unmount } from 'svelte' import Settings from './components/settings/Settings.svelte' @@ -6,22 +7,22 @@ import { writable } from 'svelte/store' import type LayoutManager from './main' export enum PlatformMode { - BOTH = 'both', - COMPUTER = 'computer', - MOBILE = 'mobile' + BOTH = 'both', + COMPUTER = 'computer', + MOBILE = 'mobile' } export interface SavedLayout { - platformMode: PlatformMode - container: AnyContainer - name: string - patterns: string + platformMode: PlatformMode + container: AnyContainer + name: string + patterns: string } export type SettingData = SavedLayout[] export class LayoutMgrSettings extends PluginSettingTab { - svelteContent: Settings + svelteContent: Settings plugin: LayoutManager constructor(app: App, plugin: LayoutManager) { @@ -30,8 +31,8 @@ export class LayoutMgrSettings extends PluginSettingTab { this.plugin = plugin } - display(): void { - this.containerEl.addClass("lm-settings") + display(): void { + this.containerEl.addClass('lm-settings') const settingProxy = writable(this.plugin.settings) settingProxy.subscribe((v) => { @@ -39,14 +40,14 @@ export class LayoutMgrSettings extends PluginSettingTab { this.plugin.saveSettings() }) - this.svelteContent = mount(Settings, { - target: this.containerEl, - props: { + this.svelteContent = mount(Settings, { + target: this.containerEl, + props: { settings: settingProxy, - app: this.app, - } - }) - } + app: this.app + } + }) + } hide() { unmount(this.svelteContent, { outro: true })