diff --git a/src/app/page.tsx b/src/app/page.tsx
index fb56386..d504bb5 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -6,7 +6,7 @@ import KeycodePicker from "@/components/KeycodePicker";
import LayerSelector from "@/components/LayerSelector";
import Toolbar from "@/components/Toolbar";
import { parseViaDefinition } from "@/lib/parser";
-import { createDefaultKeymap, exportKeymap, importKeymap, downloadJson } from "@/lib/keymap";
+import { createDefaultKeymap, exportKeymap, exportToVIA, importAnyKeymap, downloadJson } from "@/lib/keymap";
import { ParsedLayout, Keymap, KeyboardDefinition } from "@/types/keyboard";
import defaultKb from "../../keyboards/60-percent.json";
@@ -37,25 +37,36 @@ export default function Home() {
[selectedKey, activeLayer]
);
- const handleExport = useCallback(() => {
- const json = exportKeymap("My Keymap", kbName, keymap);
- downloadJson(json, "keymap.json");
+ const handleExportVIA = useCallback(() => {
+ try {
+ const json = exportToVIA(keymap);
+ downloadJson(json, "via-keymap.json");
+ } catch (e) {
+ console.error(e);
+ alert("Failed to export VIA keymap")
+ }
+ }, [keymap]);
+
+ const handleExportKeylab = useCallback(() => {
+ try {
+ const json = exportKeymap("My Keymap", kbName, keymap);
+ downloadJson(json, "zumap-keymap.json");
+ } catch (e) {
+ console.error(e);
+ alert("Failed to export keymap")
+ }
}, [keymap, kbName]);
const handleImport = useCallback(
(json: string) => {
try {
- const file = importKeymap(json);
- // Pad layers to 4 if needed
- while (file.layers.length < 4) {
- file.layers.push(
- Array.from({ length: layout.keys.length }, () => "KC_NO")
- );
- }
- setKeymap(file.layers);
+ const layers = importAnyKeymap(json, layout.keys.length);
+
+ setKeymap(layers);
setSelectedKey(null);
setActiveLayer(0);
} catch (e) {
+ console.error(e);
alert("Invalid keymap file");
}
},
@@ -98,7 +109,8 @@ export default function Home() {
diff --git a/src/components/Toolbar.tsx b/src/components/Toolbar.tsx
index 2653170..4a3104f 100644
--- a/src/components/Toolbar.tsx
+++ b/src/components/Toolbar.tsx
@@ -3,12 +3,13 @@
import { useRef } from "react";
interface Props {
- onExport: () => void;
+ onExportVIA: () => void;
+ onExportKeylab: () => void;
onImport: (json: string) => void;
onLoadKeyboard: (json: string) => void;
}
-export default function Toolbar({ onExport, onImport, onLoadKeyboard }: Props) {
+export default function Toolbar({ onExportVIA, onExportKeylab, onImport, onLoadKeyboard }: Props) {
const keymapInputRef = useRef(null);
const kbInputRef = useRef(null);
@@ -27,11 +28,19 @@ export default function Toolbar({ onExport, onImport, onLoadKeyboard }: Props) {
return (
+
+
+