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 (
-
- )
-}
-
-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
+
+