diff --git a/manifest.json b/manifest.json index 07afd78..dd1628b 100644 --- a/manifest.json +++ b/manifest.json @@ -1,7 +1,7 @@ { "id": "cmdr", "name": "Commander", - "version": "0.4.4", + "version": "0.4.5", "minAppVersion": "1.1.0", "description": "Customize your workspace by adding commands everywhere, create Macros and supercharge your mobile toolbar.", "author": "jsmorabito & phibr0", diff --git a/package.json b/package.json index 30b8c69..6db7aaa 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "cmdr", - "version": "0.4.2", + "version": "0.4.5", "description": "Customize your workspace by adding commands /everywhere/.", "main": "main.js", "scripts": { @@ -44,7 +44,6 @@ "typescript": "^4.9.3" }, "dependencies": { - "@codemirror/lang-javascript": "^6.1.1", "array-move": "^4.0.0", "canvas-confetti": "^1.6.0", "preact": "^10.11.3" diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 2f64432..68b6688 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -5,7 +5,6 @@ specifiers: '@codemirror/commands': ^6.1.2 '@codemirror/lang-css': ^6.0.1 '@codemirror/lang-html': ^6.3.1 - '@codemirror/lang-javascript': ^6.1.1 '@codemirror/language': github:lishid/cm-language '@codemirror/lint': ^6.1.0 '@codemirror/search': ^6.2.3 @@ -33,7 +32,6 @@ specifiers: typescript: ^4.9.3 dependencies: - '@codemirror/lang-javascript': 6.1.1 array-move: 4.0.0 canvas-confetti: 1.6.0 preact: 10.11.3 @@ -79,6 +77,7 @@ packages: '@codemirror/state': 6.1.4 '@codemirror/view': 6.6.0 '@lezer/common': 1.0.2 + dev: true /@codemirror/commands/6.1.2: resolution: {integrity: sha512-sO3jdX1s0pam6lIdeSJLMN3DQ6mPEbM4yLvyKkdqtmd/UDwhXA5+AwFJ89rRXm6vTeOXBsE5cAmlos/t7MJdgg==} @@ -135,6 +134,7 @@ packages: '@codemirror/view': 6.6.0 '@lezer/common': 1.0.2 '@lezer/javascript': 1.3.1 + dev: true /@codemirror/language/0.19.10: resolution: {integrity: sha512-yA0DZ3RYn2CqAAGW62VrU8c4YxscMQn45y/I9sjBlqB1e2OTQLg4CCkMBuMSLXk4xaqjlsgazeOQWaJQOKfV8Q==} @@ -155,6 +155,7 @@ packages: '@lezer/highlight': 1.1.3 '@lezer/lr': 1.2.5 style-mod: 4.0.0 + dev: true /@codemirror/lint/6.1.0: resolution: {integrity: sha512-mdvDQrjRmYPvQ3WrzF6Ewaao+NWERYtpthJvoQ3tK3t/44Ynhk8ZGjTSL9jMEv8CgSMogmt75X8ceOZRDSXHtQ==} @@ -162,6 +163,7 @@ packages: '@codemirror/state': 6.1.4 '@codemirror/view': 6.6.0 crelt: 1.0.5 + dev: true /@codemirror/rangeset/0.19.9: resolution: {integrity: sha512-V8YUuOvK+ew87Xem+71nKcqu1SXd5QROMRLMS/ljT5/3MCxtgrRie1Cvild0G/Z2f1fpWxzX78V0U4jjXBorBQ==} @@ -186,6 +188,7 @@ packages: /@codemirror/state/6.1.4: resolution: {integrity: sha512-g+3OJuRylV5qsXuuhrc6Cvs1NQluNioepYMM2fhnpYkNk7NgX+j0AFuevKSVKzTDmDyt9+Puju+zPdHNECzCNQ==} + dev: true /@codemirror/text/0.19.6: resolution: {integrity: sha512-T9jnREMIygx+TPC1bOuepz18maGq/92q2a+n4qTqObKwvNMg+8cMTslb8yxeEDEq7S3kpgGWxgO1UWbQRij0dA==} @@ -208,6 +211,7 @@ packages: '@codemirror/state': 6.1.4 style-mod: 4.0.0 w3c-keyname: 2.2.6 + dev: true /@esbuild/android-arm/0.15.16: resolution: {integrity: sha512-nyB6CH++2mSgx3GbnrJsZSxzne5K0HMyNIWafDHqYy7IwxFc4fd/CgHVZXr8Eh+Q3KbIAcAe3vGyqIPhGblvMQ==} @@ -233,6 +237,7 @@ packages: /@lezer/common/1.0.2: resolution: {integrity: sha512-SVgiGtMnMnW3ActR8SXgsDhw7a0w0ChHSYAyAUxxrOiJ1OqYWEKk/xJd84tTSPo1mo6DXLObAJALNnd0Hrv7Ng==} + dev: true /@lezer/css/1.1.0: resolution: {integrity: sha512-3dc6l8ZQOOAZUhNk6ekrkaZ6iJScn0QKxsmKgmn0BsaIXePqgPPk3d1iqo/d7laICE6eYrLpxm5HrGyNyR0hfQ==} @@ -245,6 +250,7 @@ packages: resolution: {integrity: sha512-3vLKLPThO4td43lYRBygmMY18JN3CPh9w+XS2j8WC30vR4yZeFG4z1iFe4jXE43NtGqe//zHW5q8ENLlHvz9gw==} dependencies: '@lezer/common': 1.0.2 + dev: true /@lezer/html/1.2.0: resolution: {integrity: sha512-T6sseEJQPTFayX3h9DINh7KyFBwCjEtrqQRD+7USmtkJh1xHDutsB6KYHKveSd+TbsedIPAcZwar+gkHl1rVSw==} @@ -259,6 +265,7 @@ packages: dependencies: '@lezer/highlight': 1.1.3 '@lezer/lr': 1.2.5 + dev: true /@lezer/lr/0.15.8: resolution: {integrity: sha512-bM6oE6VQZ6hIFxDNKk8bKPa14hqFrV07J/vHGOeiAbJReIaQXmkVb6xQu4MR+JBTLa5arGRyAAjJe1qaQt3Uvg==} @@ -270,6 +277,7 @@ packages: resolution: {integrity: sha512-f9319YG1A/3ysgUE3bqCHEd7g+3ZZ71MWlwEc42mpnLVYXgfJJgtu1XAyBB4Kz8FmqmnFe9caopDqKeMMMAU6g==} dependencies: '@lezer/common': 1.0.2 + dev: true /@nodelib/fs.scandir/2.1.5: resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==} @@ -621,6 +629,7 @@ packages: /crelt/1.0.5: resolution: {integrity: sha512-+BO9wPPi+DWTDcNYhr/W90myha8ptzftZT+LwcmUbbok0rcP/fequmFYCw8NMoH7pkAZQzU78b3kYrlua5a9eA==} + dev: true /cross-spawn/6.0.5: resolution: {integrity: sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==} @@ -1758,6 +1767,7 @@ packages: /style-mod/4.0.0: resolution: {integrity: sha512-OPhtyEjyyN9x3nhPsu76f52yUGXiZcgvsrFVtvTkyGRQJ0XK+GPc6ov1z+lRpbeabka+MYEQxOYRnt5nF30aMw==} + dev: true /supports-color/5.5.0: resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==} @@ -1856,6 +1866,7 @@ packages: /w3c-keyname/2.2.6: resolution: {integrity: sha512-f+fciywl1SJEniZHD6H+kUO8gOnwIr7f4ijKA6+ZvJFjeGi1r4PDLl53Ayud9O/rk64RqgoQine0feoeOU0kXg==} + dev: true /web-streams-polyfill/3.2.1: resolution: {integrity: sha512-e0MO3wdXWKrLbL0DgGnUV7WHVuw9OUvL4hjgnPkIeEvESk74gAITi5G606JtZPp39cd8HA9VQzCIvA49LpPN5Q==} @@ -1906,3 +1917,4 @@ packages: '@lezer/highlight': 1.1.3 '@lezer/lr': 1.2.5 style-mod: 4.0.0 + dev: true diff --git a/src/assets/commander-logo-christmas.svg b/src/assets/commander-logo-christmas.svg new file mode 100644 index 0000000..6e033f9 --- /dev/null +++ b/src/assets/commander-logo-christmas.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/commander-logo-halloween.svg b/src/assets/commander-logo-halloween.svg new file mode 100644 index 0000000..12f67eb --- /dev/null +++ b/src/assets/commander-logo-halloween.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/main.ts b/src/main.ts index d5e63b8..843c8d4 100644 --- a/src/main.ts +++ b/src/main.ts @@ -11,21 +11,22 @@ import { RibbonManager, StatusBarManager, } from "./manager/commands"; -import { Action, CommanderSettings, Macro } from "./types"; +import { Action, CommanderSettings } from "./types"; import CommanderSettingTab from "./ui/settingTab"; import SettingTabModal from "./ui/settingTabModal"; -import './styles/styles.scss'; -import './styles/advanced-toolbar.scss'; +import "./styles/styles.scss"; +import "./styles/advanced-toolbar.scss"; import { updateHiderStylesheet } from "./util"; import registerCustomIcons from "./ui/icons"; +import LeftRibbonManager from "./manager/commands/leftRibbonManager"; export default class CommanderPlugin extends Plugin { public settings: CommanderSettings; public manager: { editorMenu: EditorMenuCommandManager; fileMenu: FileMenuCommandManager; - leftRibbon: RibbonManager; + leftRibbon: LeftRibbonManager; //rightRibbon: RibbonManager, //titleBar: TitleBarManager, statusBar: StatusBarManager; @@ -33,18 +34,18 @@ export default class CommanderPlugin extends Plugin { explorerManager: ExplorerManager; }; - async executeStartupMacros() { + public async executeStartupMacros(): Promise { const ref = setTimeout(() => { - this.settings.macros.forEach((macro, idx) => { + this.settings.macros.forEach(async (macro, idx) => { if (macro.startup) { - this.executeMacro(idx); + await this.executeMacro(idx); } }); }, 1000); this.register(() => clearTimeout(ref)); } - async executeMacro(id: number) { + public async executeMacro(id: number): Promise { const macro = this.settings.macros[id]; if (!macro) throw new Error("Macro not found"); @@ -77,6 +78,7 @@ export default class CommanderPlugin extends Plugin { public async onload(): Promise { await this.loadSettings(); + delete this.settings.hide.leftRibbon; registerCustomIcons(); @@ -86,7 +88,7 @@ export default class CommanderPlugin extends Plugin { this.settings.editorMenu ), fileMenu: new FileMenuCommandManager(this, this.settings.fileMenu), - leftRibbon: new RibbonManager("left", this), + leftRibbon: new LeftRibbonManager(this), //rightRibbon: new RibbonManager("right", this), //titleBar: new TitleBarManager(this, this.settings.titleBar), statusBar: new StatusBarManager(this, this.settings.statusBar), @@ -141,7 +143,7 @@ export default class CommanderPlugin extends Plugin { await this.saveData(this.settings); } - public listActiveToolbarCommands(): String[] { + public listActiveToolbarCommands(): string[] { //@ts-ignore const activeCommands = this.app.vault.getConfig( "mobileToolbarCommands" diff --git a/src/manager/commands/explorerManager.ts b/src/manager/commands/explorerManager.ts index f71ad92..ff53587 100644 --- a/src/manager/commands/explorerManager.ts +++ b/src/manager/commands/explorerManager.ts @@ -99,13 +99,11 @@ export default class ExplorerManager extends CommandManagerBase { const setNormal = (): void => { btn.empty(); - btn.style.setProperty("--icon-size", `12px`); setIcon(btn, pair.icon); btn.onclick = (): void => app.commands.executeCommandById(pair.id); }; const setRemovable = (): void => { btn.empty(); - btn.style.setProperty("--icon-size", `12px`); setIcon(btn, "trash"); btn.onclick = async (): Promise => { if ( diff --git a/src/manager/commands/leftRibbonManager.ts b/src/manager/commands/leftRibbonManager.ts new file mode 100644 index 0000000..6c2ff7f --- /dev/null +++ b/src/manager/commands/leftRibbonManager.ts @@ -0,0 +1,61 @@ +import CommanderPlugin from "src/main"; +import { CommandIconPair } from "src/types"; +import CommandManagerBase from "./commandManager"; + +export default class LeftRibbonManager extends CommandManagerBase { + public plugin: CommanderPlugin; + //private addBtn: HTMLDivElement; + + public constructor(plugin: CommanderPlugin) { + super(plugin, plugin.settings.leftRibbon); + this.plugin = plugin; + + app.workspace.onLayoutReady(() => { + this.plugin.settings.leftRibbon.forEach((pair) => + this.addCommand(pair, false) + ); + // if (this.plugin.settings.showAddCommand) { + // this.plugin.addRibbonIcon("plus", t("Add new"), async () => + // this.addCommand(await chooseNewCommand(plugin)) + // ); + // } + }); + } + + public async addCommand( + pair: CommandIconPair, + newlyAdded = true + ): Promise { + if (newlyAdded) { + this.plugin.settings.leftRibbon.push(pair); + await this.plugin.saveSettings(); + } + this.plugin.addRibbonIcon(pair.icon, pair.name, () => + app.commands.executeCommandById(pair.id) + ); + this.plugin.register(() => this.removeCommand(pair, false)); + } + + public async removeCommand( + pair: CommandIconPair, + remove = true + ): Promise { + if (remove) { + this.plugin.settings.leftRibbon.remove(pair); + await this.plugin.saveSettings(); + } + // @ts-expect-error + const nativeAction = app.workspace.leftRibbon.items.find( + // @ts-expect-error + (i) => i.icon === pair.icon && i.name === i.name + ); + if (nativeAction) { + nativeAction.buttonEl.remove(); + } + // @ts-expect-error + app.workspace.leftRibbon.items.remove(nativeAction); + } + + // eslint-disable-next-line @typescript-eslint/no-empty-function + public reorder(): void {} +} diff --git a/src/manager/commands/menuManager.ts b/src/manager/commands/menuManager.ts index f28df61..880ced7 100644 --- a/src/manager/commands/menuManager.ts +++ b/src/manager/commands/menuManager.ts @@ -43,37 +43,44 @@ abstract class Base extends CommandManagerBase { event.stopImmediatePropagation(); if (!optionMenu) { optionMenu = new Menu() - .addItem(item => { - item - .setTitle(t("Change Icon")) + .addItem((item) => { + item.setTitle(t("Change Icon")) .setIcon("box") .onClick(async () => { - const newIcon = await (new ChooseIconModal(plugin)).awaitSelection(); + const newIcon = await new ChooseIconModal( + plugin + ).awaitSelection(); if (newIcon && newIcon !== cmdPair.icon) { cmdPair.icon = newIcon; await plugin.saveSettings(); } }); }) - .addItem(item => { - item - .setTitle(t("Rename")) + .addItem((item) => { + item.setTitle(t("Rename")) .setIcon("text-cursor-input") .onClick(async () => { - const newName = await (new ChooseCustomNameModal(cmdPair.name)).awaitSelection(); + const newName = + await new ChooseCustomNameModal( + cmdPair.name + ).awaitSelection(); if (newName && newName !== cmdPair.name) { cmdPair.name = newName; await plugin.saveSettings(); } }); }) - .addItem(item => { + .addItem((item) => { item.dom.addClass("is-warning"); - item - .setTitle(t("Delete")) + item.setTitle(t("Delete")) .setIcon("lucide-trash") .onClick(async () => { - if (!plugin.settings.confirmDeletion || (await new ConfirmDeleteModal(plugin).didChooseRemove())) { + if ( + !plugin.settings.confirmDeletion || + (await new ConfirmDeleteModal( + plugin + ).didChooseRemove()) + ) { removeMenu(); } }); @@ -83,9 +90,7 @@ abstract class Base extends CommandManagerBase { optionMenu.hide(); optionMenu = null; } - }); - optionEl.style.setProperty("--icon-size", `16px`); setIcon(optionEl, "more-vertical"); item.dom.append(optionEl); diff --git a/src/manager/commands/statusBarManager.ts b/src/manager/commands/statusBarManager.ts index 749a90d..7e59186 100644 --- a/src/manager/commands/statusBarManager.ts +++ b/src/manager/commands/statusBarManager.ts @@ -54,7 +54,6 @@ export default class StatusBarManager extends CommandManagerBase { }); this.plugin.register(() => this.addBtn.remove()); - this.addBtn.style.setProperty("--icon-size", `12px`); setIcon(this.addBtn, "plus"); this.addBtn.onclick = async (): Promise => { const pair = await chooseNewCommand(this.plugin); @@ -95,13 +94,11 @@ export default class StatusBarManager extends CommandManagerBase { const setNormal = (): void => { btn.empty(); - btn.style.setProperty("--icon-size", `12px`); setIcon(btn, pair.icon); btn.onclick = (): void => app.commands.executeCommandById(pair.id); }; const setRemovable = (): void => { btn.empty(); - btn.style.setProperty("--icon-size", `12px`); setIcon(btn, "trash"); btn.onclick = async (): Promise => { if (!this.plugin.settings.confirmDeletion || (await new ConfirmDeleteModal(this.plugin).didChooseRemove())) { diff --git a/src/styles/styles.scss b/src/styles/styles.scss index 6855d64..9b28290 100644 --- a/src/styles/styles.scss +++ b/src/styles/styles.scss @@ -395,8 +395,8 @@ display: flex; > svg { - width: 70px; - height: 70px; + width: 90px; + height: 90px; } } diff --git a/src/types.ts b/src/types.ts index f9529c3..2e8bade 100644 --- a/src/types.ts +++ b/src/types.ts @@ -34,7 +34,7 @@ export interface CommanderSettings { macros: Macro[]; hide: { statusbar: string[]; - leftRibbon: string[]; + leftRibbon?: string[]; }; spacing: number; advancedToolbar: AdvancedToolbarSettings; @@ -108,7 +108,7 @@ declare module "obsidian" { callback: () => void; }[]; collapseButtonEl: HTMLElement; - ribbonItemsEl?: HTMLElement; + ribbonItemsEl: HTMLElement; addRibbonItemButton: ( icon: string, name: string, diff --git a/src/ui/components/AdvancedToolbarSettings.tsx b/src/ui/components/AdvancedToolbarSettings.tsx index 95d51fe..3e90027 100644 --- a/src/ui/components/AdvancedToolbarSettings.tsx +++ b/src/ui/components/AdvancedToolbarSettings.tsx @@ -166,28 +166,40 @@ export default function AdvancedToolbarSettings({ plugin }: { plugin: CommanderP const ref = useRef(null); useEffect(() => { - render(ref.current!, plugin); + if (ref.current) { + render(ref.current, plugin); + } + return () => ref.current && ref.current.empty(); }, []); return (
- {"Info"} + + {"Info"} +

{"The Toolbar is only available in Obsidian Mobile. "} - {Platform.isMobile && <> - {"To configure which Commands show up in the Toolbar, open the Mobile Settings."} - - } + {Platform.isMobile && ( + <> + { + "To configure which Commands show up in the Toolbar, open the Mobile Settings." + } + + )}

- {Platform.isMobile && - } + {Platform.isMobile && ( + + )}
-
+
); } diff --git a/src/ui/components/Logo.tsx b/src/ui/components/Logo.tsx index 8a1e6b5..38e3fbe 100644 --- a/src/ui/components/Logo.tsx +++ b/src/ui/components/Logo.tsx @@ -1,6 +1,24 @@ import { h } from "preact"; +import { memo } from "preact/compat"; import logo from "src/assets/commander-logo.svg"; +import christmasLogo from "src/assets/commander-logo-christmas.svg"; +import halloweenLogo from "src/assets/commander-logo-halloween.svg"; +import { moment } from "obsidian"; -export default function Logo(): h.JSX.Element { - return
; +const specialLogos: { [month: number]: string } = { + 9: halloweenLogo, + 11: christmasLogo, +}; + +function Logo(): h.JSX.Element { + return ( +
+ ); } + +export default memo(Logo); diff --git a/src/ui/components/MacroBuilder.tsx b/src/ui/components/MacroBuilder.tsx index 52d5d63..1b7a2a5 100644 --- a/src/ui/components/MacroBuilder.tsx +++ b/src/ui/components/MacroBuilder.tsx @@ -5,8 +5,6 @@ import { Macro, Action, MacroItem } from "src/types"; import { getCommandFromId, ObsidianIcon } from "src/util"; import AddCommandModal from "../addCommandModal"; import ChooseIconModal from "../chooseIconModal"; -import ChangeableText from "./ChangeableText"; -import CustomJSModal from "./customJSModal"; import { SliderComponent } from "./settingComponent"; interface MacroBuilderProps { @@ -15,7 +13,12 @@ interface MacroBuilderProps { onSave: (macro: Macro) => void; onCancel: () => void; } -export default function ({ plugin, macro, onSave, onCancel }: MacroBuilderProps): h.JSX.Element { +export default function ({ + plugin, + macro, + onSave, + onCancel, +}: MacroBuilderProps): h.JSX.Element { const [name, setName] = useState(macro.name || "Macro Name"); const [icon, setIcon] = useState(macro.icon || "star"); const [startup, setStartup] = useState(macro.startup || false); @@ -42,11 +45,6 @@ export default function ({ plugin, macro, onSave, onCancel }: MacroBuilderProps) ]); }; - const handleAddCustomJS = async () => { - //new CustomJSModal(plugin).open(); - //setMacroCommands([...macroCommands, { action: Action.CUSTOM_JS, code: "" }]); - }; - return (
diff --git a/src/ui/components/customJSModal.ts b/src/ui/components/customJSModal.ts deleted file mode 100644 index 87f83ad..0000000 --- a/src/ui/components/customJSModal.ts +++ /dev/null @@ -1,89 +0,0 @@ -import { Modal, TextAreaComponent } from "obsidian"; -import CommanderPlugin from "src/main"; -import { defaultKeymap, history, historyKeymap, indentWithTab } from "@codemirror/commands"; -import { javascript } from "@codemirror/lang-javascript"; -import { - bracketMatching, - defaultHighlightStyle, - foldGutter, - foldKeymap, - indentOnInput, - syntaxHighlighting, -} from "@codemirror/language"; -import { EditorState, Extension } from "@codemirror/state"; -import { - drawSelection, - dropCursor, - EditorView, - highlightSpecialChars, - keymap, - lineNumbers, - rectangularSelection, -} from "@codemirror/view"; -import { autocompletion, closeBrackets, closeBracketsKeymap, completionKeymap } from "@codemirror/autocomplete"; -import { highlightSelectionMatches, searchKeymap } from "@codemirror/search"; - -export const basicSetup: Extension[] = [ - lineNumbers(), - // highlightActiveLineGutter(), - highlightSpecialChars(), - history(), - javascript(), - foldGutter(), - drawSelection(), - dropCursor(), - EditorState.allowMultipleSelections.of(true), - indentOnInput(), - syntaxHighlighting(defaultHighlightStyle, { fallback: true }), - EditorView.lineWrapping, - bracketMatching(), - closeBrackets(), - autocompletion(), - rectangularSelection(), - highlightSelectionMatches(), - keymap.of([ - ...closeBracketsKeymap, - ...defaultKeymap, - ...searchKeymap, - ...historyKeymap, - indentWithTab, - ...foldKeymap, - ...completionKeymap, - ]), -].filter(ext => ext); - -function editorFromTextArea(textarea: HTMLTextAreaElement, extensions: Extension) { - let view = new EditorView({ - state: EditorState.create({ doc: textarea.value, extensions }), - }); - textarea.parentNode!.insertBefore(view.dom, textarea); - textarea.style.display = "none"; - if (textarea.form) - textarea.form.addEventListener("submit", () => { - textarea.value = view.state.doc.toString(); - }); - return view; -} - -export default class CustomJSModal extends Modal { - private plugin: CommanderPlugin; - editor: EditorView; - - public constructor( - plugin: CommanderPlugin, - ) { - super(app); - this.plugin = plugin; - } - - public onOpen(): void { - this.titleEl.setText("Macro Builder"); - const customCSSEl = new TextAreaComponent(this.contentEl); - this.editor = editorFromTextArea(customCSSEl.inputEl, basicSetup); - } - - public onClose(): void { - this.containerEl.empty(); - this.editor?.destroy(); - } -} diff --git a/src/ui/components/settingTabComponent.tsx b/src/ui/components/settingTabComponent.tsx index e137882..a27fd06 100644 --- a/src/ui/components/settingTabComponent.tsx +++ b/src/ui/components/settingTabComponent.tsx @@ -131,7 +131,22 @@ export default function settingTabComponent({ + > +
+
+ + Reordering/Sorting + +

+ As of Obsidian 1.1.0 you can reorder the Buttons + in the left ribbon by dragging. This will + replace the old sorting feature. +

+
+
), }, // { diff --git a/src/util.tsx b/src/util.tsx index 0188761..e784e48 100644 --- a/src/util.tsx +++ b/src/util.tsx @@ -43,12 +43,15 @@ interface ObsidianIconProps extends ComponentProps<"div"> { icon: string; size?: number; } -export function ObsidianIcon({ icon, size, ...props }: ObsidianIconProps): h.JSX.Element { +export function ObsidianIcon({ + icon, + size, + ...props +}: ObsidianIconProps): h.JSX.Element { const iconEl = useRef(null); useLayoutEffect(() => { // eslint-disable-next-line @typescript-eslint/no-non-null-assertion - iconEl.current!.style.setProperty("--icon-size", `${size}px`); setIcon(iconEl.current!, icon); }, [icon, size]); @@ -57,7 +60,12 @@ export function ObsidianIcon({ icon, size, ...props }: ObsidianIconProps): h.JSX export function isModeActive(mode: string): boolean { const { isMobile, appId } = app; - return mode === "any" || mode === appId || (mode === "mobile" && isMobile) || (mode === "desktop" && !isMobile); + return ( + mode === "any" || + mode === appId || + (mode === "mobile" && isMobile) || + (mode === "desktop" && !isMobile) + ); } export function updateHiderStylesheet(settings: CommanderSettings): void { @@ -65,14 +73,17 @@ export function updateHiderStylesheet(settings: CommanderSettings): void { for (const id of settings.hide.statusbar) { style += `div.status-bar-item.plugin-${id} {display: none !important; content-visibility: hidden;}`; } - for (const name of settings.hide.leftRibbon) { - style += `div.side-dock-ribbon-action[aria-label="${name}"] {display: none !important; content-visibility: hidden;}`; - } document.head.querySelector("style#cmdr")?.remove(); if (style) { - document.head.appendChild(createEl("style", { attr: { "id": "cmdr" }, text: style, type: "text/css" })); + document.head.appendChild( + createEl("style", { + attr: { id: "cmdr" }, + text: style, + type: "text/css", + }) + ); } }