diff --git a/CHANGELOG.md b/CHANGELOG.md deleted file mode 100644 index c3d858c..0000000 --- a/CHANGELOG.md +++ /dev/null @@ -1,3 +0,0 @@ -## 0.1.0 - First Release -* Every feature added -* Every bug fixed diff --git a/keymaps/wordcount.json b/keymaps/wordcount.json index 09e9ca2..28c2400 100644 --- a/keymaps/wordcount.json +++ b/keymaps/wordcount.json @@ -1,5 +1,5 @@ { "body": { - "ctrl-alt-o": "wordcount:toggle" + "ctrl-shift-,": "commandpalette:toggle" } } diff --git a/lib/commandpalette.js b/lib/commandpalette.js new file mode 100644 index 0000000..defc702 --- /dev/null +++ b/lib/commandpalette.js @@ -0,0 +1,15 @@ +"use babel"; + +import CommandPalette from "./components/palette"; + +module.exports = { + activate() { + inkdrop.components.registerClass(CommandPalette); + inkdrop.layouts.addComponentToLayout("modal", "CommandPalette"); + }, + + deactivate() { + inkdrop.layouts.removeComponentFromLayout("modal", "CommandPalette"); + inkdrop.components.deleteClass(CommandPalette); + }, +}; diff --git a/lib/components/palette.js b/lib/components/palette.js new file mode 100644 index 0000000..cff6d3b --- /dev/null +++ b/lib/components/palette.js @@ -0,0 +1,63 @@ +"use babel"; + +import React, { useEffect, useCallback, useRef, useLayoutEffect } from "react"; +import { logger, useModal } from "inkdrop"; + +const CommandPalette = (props) => { + const modal = useModal(); + const { Dialog } = inkdrop.components.classes; + + const searchRef = useRef(null); + + const toggle = useCallback(() => { + modal.show(); + logger.debug("Dialog was toggled!"); + }, []); + + useEffect(() => { + const sub = inkdrop.commands.add(document.body, { + "commandpalette:toggle": toggle, + }); + return () => sub.dispose(); + }, [toggle]); + + useLayoutEffect(() => { + document + .getElementById("cpInput") + .addEventListener("visibilitychange", onVisibilityChange); + + return () => + document + .getElementById("cpInput") + .removeEventListener("visibilitychange", onVisibilityChange); + }); + + const onVisibilityChange = () => { + if (element.classList.contains("visible")) { + document.getElementById("cpInput").focus(); + } + }; + + return ( + + +
+
+
+ +
+
+
+
+
+ ); +}; + +export default CommandPalette; diff --git a/lib/wordcount-message-dialog.js b/lib/wordcount-message-dialog.js deleted file mode 100644 index 4919b52..0000000 --- a/lib/wordcount-message-dialog.js +++ /dev/null @@ -1,35 +0,0 @@ -'use babel'; - -import React, { useEffect, useCallback } from 'react' -import { logger, useModal } from 'inkdrop' - -const WordcountMessageDialog = (props) => { - const modal = useModal() - const { Dialog } = inkdrop.components.classes - - const toggle = useCallback(() => { - modal.show() - logger.debug('Wordcount was toggled!') - }, []) - - useEffect(() => { - const sub = inkdrop.commands.add(document.body, { - 'wordcount:toggle': toggle - }) - return () => sub.dispose() - }, [toggle]) - - return ( - - Wordcount - Wordcount was toggled! - - - - - ) -} - -export default WordcountMessageDialog diff --git a/lib/wordcount.js b/lib/wordcount.js deleted file mode 100644 index 7f6ed33..0000000 --- a/lib/wordcount.js +++ /dev/null @@ -1,23 +0,0 @@ -'use babel'; - -import WordcountMessageDialog from './wordcount-message-dialog'; - -module.exports = { - - activate() { - inkdrop.components.registerClass(WordcountMessageDialog); - inkdrop.layouts.addComponentToLayout( - 'modal', - 'WordcountMessageDialog' - ) - }, - - deactivate() { - inkdrop.layouts.removeComponentFromLayout( - 'modal', - 'WordcountMessageDialog' - ) - inkdrop.components.deleteClass(WordcountMessageDialog); - } - -}; diff --git a/menus/commandpalette.json b/menus/commandpalette.json new file mode 100644 index 0000000..244dce1 --- /dev/null +++ b/menus/commandpalette.json @@ -0,0 +1,18 @@ +{ + "menu": [ + { + "label": "Plugins", + "submenu": [ + { + "label": "Command Palette", + "submenu": [ + { + "label": "Show/Hide Command Palette", + "command": "commandpalette:toggle" + } + ] + } + ] + } + ] +} diff --git a/menus/wordcount.json b/menus/wordcount.json deleted file mode 100644 index 2d7dce7..0000000 --- a/menus/wordcount.json +++ /dev/null @@ -1,26 +0,0 @@ -{ - "context-menu": { - ".CodeMirror": [ - { - "label": "Toggle wordcount", - "command": "wordcount:toggle" - } - ] - }, - "menu": [ - { - "label": "Plugins", - "submenu": [ - { - "label": "wordcount", - "submenu": [ - { - "label": "Toggle", - "command": "wordcount:toggle" - } - ] - } - ] - } - ] -} diff --git a/package.json b/package.json index a9b0d8e..8086d77 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "command-palette", - "main": "./lib/wordcount", + "main": "./lib/commandpalette", "version": "0.0.1", "description": "A command palette for inkdrop", "keywords": [], diff --git a/styles/palettemodal.less b/styles/palettemodal.less new file mode 100644 index 0000000..c5726fd --- /dev/null +++ b/styles/palettemodal.less @@ -0,0 +1,9 @@ +.commandpalette { + padding: 0rem !important ; + background-color: red; +} + +.cpInput { + width: 400px; + background-color: var(--page-background) !important ; +} diff --git a/styles/wordcount.less b/styles/wordcount.less deleted file mode 100644 index 96fa7ed..0000000 --- a/styles/wordcount.less +++ /dev/null @@ -1,2 +0,0 @@ -.wordcount { -} diff --git a/yarn.lock b/yarn.lock new file mode 100644 index 0000000..fb57ccd --- /dev/null +++ b/yarn.lock @@ -0,0 +1,4 @@ +# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY. +# yarn lockfile v1 + +