@witchcraft/spellcraft 0.0.1

package/dist/internal/isValidChain.js

@@ -0,0 +1,22 @@
+import { Ok } from "@alanscodelog/utils/Result";
+import { areValidKeys } from "./areValidKeys.js";
+import { containsPossibleToggleChords } from "./containsPossibleToggleChords.js";
+import { isValidChord } from "./isValidChord.js";
+export function isValidChain(chain, manager) {
+  const sorter = manager.options.sorter;
+  if (chain.length === 0 || chain.length === 1 && chain[0].length === 0) {
+    return Ok(true);
+  }
+  const resIsValid = areValidKeys(chain, manager);
+  if (resIsValid.isError) return resIsValid;
+  const val = [];
+  for (let i = 0; i < chain.length; i++) {
+    const chord = chain[i];
+    const res2 = isValidChord(chain, chord, i, manager);
+    if (res2.isError) return res2;
+    val.push(sorter.sort([...chord], manager.keys));
+  }
+  const res = containsPossibleToggleChords(chain, manager);
+  if (res.isError) return res;
+  return Ok(true);
+}

package/dist/internal/isValidChord.d.ts

@@ -0,0 +1,11 @@
+import { type Result } from "@alanscodelog/utils/Result";
+import { KnownError } from "../helpers/KnownError.js";
+import { type Manager, type PickManager, SHORTCUT_ERROR } from "../types/index.js";
+/**
+ * Guards against invalid chords (for various reasons). See the {@link ERROR}.CHORD_W_... errors.
+ *
+ * Does not check if the keys are valid.
+ *
+ * @internal
+ */
+export declare function isValidChord(chain: string[][], chord: string[], i: number, manager: Pick<Manager, "keys"> & PickManager<"options", "stringifier" | "sorter">): Result<true, KnownError<typeof SHORTCUT_ERROR.CHORD_W_DUPLICATE_KEY | typeof SHORTCUT_ERROR.CHORD_W_ONLY_MODIFIERS | typeof SHORTCUT_ERROR.CHORD_W_MULTIPLE_TRIGGER_KEYS | typeof SHORTCUT_ERROR.CHORD_W_MULTIPLE_WHEEL_KEYS>>;

package/dist/internal/isValidChord.js

@@ -0,0 +1,59 @@
+import { crop } from "@alanscodelog/utils/crop";
+import { findDuplicates } from "@alanscodelog/utils/findDuplicates";
+import { indent } from "@alanscodelog/utils/indent";
+import { Err, Ok } from "@alanscodelog/utils/Result";
+import { getKeyFromIdOrVariant } from "../helpers/getKeyFromIdOrVariant.js";
+import { KnownError } from "../helpers/KnownError.js";
+import { SHORTCUT_ERROR } from "../types/index.js";
+import { isTriggerKey } from "../utils/isTriggerKey.js";
+import { isWheelKey } from "../utils/isWheelKey.js";
+export function isValidChord(chain, chord, i, manager) {
+  const keys = manager.keys;
+  const s = manager.options.stringifier;
+  const prettyChord = s.stringify(chord, manager);
+  const prettyChain = s.stringify(chain, manager);
+  const repeated = findDuplicates(chord, { equals: (id, otherId) => {
+    const key = getKeyFromIdOrVariant(id, keys).unwrap()[0];
+    const other = getKeyFromIdOrVariant(otherId, keys).unwrap()[0];
+    if (key.id === other.id) return true;
+    if (key.variants?.includes(other.id) || other.variants?.includes(key.id)) return true;
+    if (isWheelKey(key) && isWheelKey(other)) return false;
+    return false;
+  } });
+  if (repeated.length > 0) {
+    const prettyRepeated = s.stringifyList("keys", repeated, manager);
+    return Err(new KnownError(SHORTCUT_ERROR.CHORD_W_DUPLICATE_KEY, crop`
+			Chord "${prettyChord}" in chain "${prettyChain}" contains duplicate or incompatible keys:
+				${indent(prettyRepeated, 4)}
+			Chords cannot contain duplicate keys. This includes more than one of the same toggle, regardless of the state.
+		`, { chord, i, keys: repeated }));
+  }
+  const onlyModifiers = chord.filter((id) => getKeyFromIdOrVariant(id, keys).unwrap()[0].isModifier);
+  const containsOnlyModifiers = onlyModifiers.length === chord.length;
+  if (i < chain.length - 1 && containsOnlyModifiers) {
+    return Err(new KnownError(SHORTCUT_ERROR.CHORD_W_ONLY_MODIFIERS, crop`
+			Chain "${prettyChain}" is impossible.
+			Chord #${i + 1} "${prettyChord}" cannot contain only modifiers if it is followed by another chord.
+			A chord can only consist of only modifiers if it's the last chord in a chain.
+		`, { chord, i, keys: onlyModifiers }));
+  }
+  const wheelKeys = chord.filter((id) => isWheelKey(getKeyFromIdOrVariant(id, keys).unwrap()[0]));
+  const prettyWheelKeys = s.stringifyList("keys", wheelKeys, manager);
+  if (wheelKeys.length > 1) {
+    return Err(new KnownError(SHORTCUT_ERROR.CHORD_W_MULTIPLE_WHEEL_KEYS, crop`
+			Chain "${prettyChain}" is impossible.
+			Chord #${i + 1} "${prettyChord}" contains multiple wheel keys: ${prettyWheelKeys}
+			Chords can only contain one.
+		`, { chord, i, keys: wheelKeys }));
+  }
+  const triggerKeys = chord.filter((id) => isTriggerKey(getKeyFromIdOrVariant(id, keys).unwrap()[0]));
+  const prettyTriggerKeys = s.stringifyList("keys", triggerKeys, manager);
+  if (triggerKeys.length > 1) {
+    return Err(new KnownError(SHORTCUT_ERROR.CHORD_W_MULTIPLE_TRIGGER_KEYS, crop`
+			Chain "${prettyChain}" is impossible.
+			Chord #${i + 1} "${prettyChord}" contains multiple trigger (non-modifier/non-root toggle) keys: ${prettyTriggerKeys}
+			Chords can only contain one.
+		`, { chord, i, keys: triggerKeys }));
+  }
+  return Ok(true);
+}

package/dist/internal/isValidCommand.d.ts

@@ -0,0 +1,12 @@
+import { type Result } from "@alanscodelog/utils/Result";
+import type { Manager, MultipleErrors, PickManager, Shortcut } from "../types/index.js";
+import { SHORTCUT_ERROR } from "../types/index.js";
+/**
+ * @internal
+ */
+export declare function isValidCommand(commandName: string | undefined, manager: Pick<Manager, "commands"> & Partial<Pick<Manager, "keys">> & PickManager<"options", "stringifier">, 
+/**
+ * Shortcut will only be added to error if the manager contains keys.
+ * Otherwise it will be ignored.
+ */
+shortcut?: Shortcut): Result<true, MultipleErrors<typeof SHORTCUT_ERROR.UNKNOWN_COMMAND>>;

package/dist/internal/isValidCommand.js

@@ -0,0 +1,20 @@
+import { crop } from "@alanscodelog/utils/crop";
+import { indent } from "@alanscodelog/utils/indent";
+import { Err, Ok } from "@alanscodelog/utils/Result";
+import { KnownError } from "../helpers/KnownError.js";
+import { SHORTCUT_ERROR } from "../types/index.js";
+export function isValidCommand(commandName, manager, shortcut) {
+  const commands = manager.commands;
+  const s = manager.options.stringifier;
+  if (commandName === void 0) return Ok(true);
+  const command = commands.entries[commandName];
+  if (command === void 0) {
+    const shortcutString = shortcut && "keys" in manager ? ` in shortcut ${s.stringify(shortcut, manager)}` : "";
+    return Err(new KnownError(SHORTCUT_ERROR.UNKNOWN_COMMAND, crop`
+			Unknown command: ${commandName}${shortcutString}. Cannot find in:
+
+			${indent(s.stringifyList("commands", Object.values(commands.entries)), 3)}
+			`, { command: commandName, commands, shortcut }));
+  }
+  return Ok(true);
+}

package/dist/internal/keyOrder.d.ts

@@ -0,0 +1,6 @@
+import type { Key, KeySortPos } from "../types/index.js";
+/**
+    *
+ * Determines the key order position based on a key's type and the given {@link KeySortPos}
+ */
+export declare function keyOrder(key: Key, dictOrEnum: KeySortPos): number;

package/dist/internal/keyOrder.js

@@ -0,0 +1,14 @@
+import { isMouseKey } from "../utils/isMouseKey.js";
+import { isWheelKey } from "../utils/isWheelKey.js";
+export function keyOrder(key, dictOrEnum) {
+  let type = [
+    key.isModifier ? "mod" : "",
+    key.isToggle ? "toggle" : "",
+    isMouseKey(key) ? "mouse" : "",
+    isWheelKey(key) ? "wheel" : ""
+  ].join("");
+  if (type === "") {
+    type = "normal";
+  }
+  return dictOrEnum[type];
+}

package/dist/internal/removeFromChain.d.ts

@@ -0,0 +1,3 @@
+import { type Result } from "@alanscodelog/utils/Result";
+import type { AnyInputEvent, Manager, ManagerSetEntries, MultipleErrors } from "../types/index.js";
+export declare function removeFromChain(manager: Manager, keys: string[], e?: AnyInputEvent): Result<true, MultipleErrors<ManagerSetEntries["state.chain"]["error"]>>;

package/dist/internal/removeFromChain.js

@@ -0,0 +1,32 @@
+import { Ok } from "@alanscodelog/utils/Result";
+import { checkTrigger } from "./checkTrigger.js";
+import { checkUntrigger } from "./checkUntrigger.js";
+import { cloneLastChord } from "./cloneLastChord.js";
+import { getPressedNonModifierKeys } from "./getPressedNonModifierKeys.js";
+import { setManagerProp } from "../core/setManagerProp.js";
+import { cloneChain } from "../utils/cloneChain.js";
+export function removeFromChain(manager, keys, e) {
+  if (keys.length === 0) return Ok(true);
+  if (manager.state.isAwaitingKeyup) {
+    checkUntrigger(manager, e);
+    if (getPressedNonModifierKeys(manager).length === 0) {
+      setManagerProp(manager, "state.isAwaitingKeyup", false);
+    }
+  }
+  if (manager.state.nextIsChord) return Ok(true);
+  const lastChord = cloneLastChord(manager.state.chain) ?? [];
+  for (const id of keys) {
+    const key = manager.keys.entries[id];
+    const i = lastChord.indexOf(key.id);
+    if (i > -1) {
+      lastChord.splice(i, 1);
+      const chain = manager.state.chain;
+      const precedingChords = chain.slice(0, chain.length - 1);
+      const spreadableLastChord = precedingChords.length === 0 && lastChord.length === 0 ? [] : [lastChord];
+      const res = setManagerProp(manager, "state.chain", cloneChain([...precedingChords, ...spreadableLastChord]));
+      if (res.isError) return res;
+    }
+  }
+  checkTrigger(manager, e);
+  return Ok(true);
+}

package/dist/internal/safeSetEmulatedToggleState.d.ts

@@ -0,0 +1,4 @@
+import type { Key, KeySetEntries, Manager } from "../types/index.js";
+export declare function safeSetEmulatedToggleState<THooks extends Manager["hooks"]>(key: Key, value: boolean, manager: KeySetEntries["toggleOnPressed" | "toggleOffPressed"]["manager"] & {
+    hooks?: THooks;
+}): import("@alanscodelog/utils").Result<true, import("../helpers/KnownError.ts").KnownError<"CANNOT_SET_WHILE_DISABLED"> | import("../types/manager.ts").CanHookErrors<THooks extends never ? never : THooks, "canSetKeyProp">>;

package/dist/internal/safeSetEmulatedToggleState.js

@@ -0,0 +1,13 @@
+import { setKeyProp } from "../core/setKeyProp.js";
+export function safeSetEmulatedToggleState(key, value, manager) {
+  const res = setKeyProp(key, "toggleOnPressed", value, manager, { check: "only" });
+  if (res.isOk) {
+    const res2 = setKeyProp(key, "toggleOffPressed", !value, manager, { check: "only" });
+    if (res2.isOk) {
+      setKeyProp(key, "toggleOnPressed", value, manager, { check: false });
+      setKeyProp(key, "toggleOffPressed", !value, manager, { check: false });
+    }
+    return res2;
+  }
+  return res;
+}

package/dist/internal/setKeysState.d.ts

@@ -0,0 +1,8 @@
+import { type Result } from "@alanscodelog/utils/Result";
+import type { CanHookErrors, KeySetEntries, Manager, MultipleErrors } from "../types/index.js";
+import { SHORTCUT_ERROR } from "../types/index.js";
+export declare function setKeysState<THooks extends Manager["hooks"]>(keysList: string[], manager: KeySetEntries["pressed" | "toggleOnPressed" | "toggleOffPressed"]["manager"] & {
+    hooks?: THooks;
+}, state: boolean, { ignoreToggleType }?: {
+    ignoreToggleType?: boolean;
+}): Result<true, MultipleErrors<typeof SHORTCUT_ERROR.CANNOT_SET_WHILE_DISABLED | typeof SHORTCUT_ERROR.INCORRECT_TOGGLE_STATE> | CanHookErrors<THooks extends never ? never : THooks, "canSetKeyProp">>;

package/dist/internal/setKeysState.js

@@ -0,0 +1,42 @@
+import { Err, Ok } from "@alanscodelog/utils/Result";
+import { safeSetEmulatedToggleState } from "./safeSetEmulatedToggleState.js";
+import { setKeyProp } from "../core/setKeyProp.js";
+import { KnownError } from "../helpers/KnownError.js";
+import { SHORTCUT_ERROR } from "../types/index.js";
+export function setKeysState(keysList, manager, state, {
+  ignoreToggleType = false
+} = {}) {
+  const s = manager.options.stringifier;
+  for (const id of keysList) {
+    const key = manager.keys.entries[id];
+    const isRoot = id === key.id;
+    const isOn = id === key.toggleOnId;
+    const isOff = id === key.toggleOffId;
+    if (isRoot && key.pressed === state || isOn && key.toggleOnPressed === state || isOff && key.toggleOffPressed === state) {
+      continue;
+    }
+    const res = setKeyProp(key, "pressed", state, manager);
+    if (res.isError) return res;
+    if (isRoot && state) {
+      if (ignoreToggleType && key.isToggle || key.isToggle === "emulated") {
+        if (key.toggleOnPressed && key.toggleOffPressed) {
+          return Err(new KnownError(
+            SHORTCUT_ERROR.INCORRECT_TOGGLE_STATE,
+            `Key ${s.stringify(key, manager)} is a toggle key whose on and off versions are both pressed, which is not a valid state. This should not happen if letting the manager manage the state.`,
+            { key }
+          ));
+        }
+        let res2;
+        if (!key.toggleOnPressed && !key.toggleOffPressed) {
+          res2 = safeSetEmulatedToggleState(key, true, manager);
+        } else if (key.toggleOnPressed) {
+          res2 = safeSetEmulatedToggleState(key, false, manager);
+        } else if (key.toggleOffPressed) {
+          res2 = safeSetEmulatedToggleState(key, true, manager);
+        }
+        if (res2?.isError) return res2;
+      }
+    }
+  }
+  return Ok(true);
+}

package/dist/internal/updateNativeKeysState.d.ts

@@ -0,0 +1,14 @@
+import type { AnyInputEvent, Manager } from "../types/index.js";
+/**
+ * Should be used after we attempt to process the event and set key states.
+ *
+ * This should cause it to only actually change the state if it was changed off-focus.
+ *
+ * Technically not neccesary with wheel/mouse events, but ordered similarly for consistency.
+ *
+ * Modifiers need to be added/removed from the chain on changes, but not toggles.
+ *
+ * Mutates the passed keys array to remove processed keys.
+ *
+ */
+export declare function updateNativeKeysState(manager: Manager, e: AnyInputEvent, keyIds?: string[]): void;

package/dist/internal/updateNativeKeysState.js

@@ -0,0 +1,58 @@
+import { multisplice } from "@alanscodelog/utils/multisplice";
+import { addToChain } from "./addToChain.js";
+import { getModifierState } from "./getModifierState.js";
+import { removeFromChain } from "./removeFromChain.js";
+import { safeSetEmulatedToggleState } from "./safeSetEmulatedToggleState.js";
+import { setKeyProp } from "../core/setKeyProp.js";
+import { KnownError } from "../helpers/KnownError.js";
+import { SHORTCUT_ERROR } from "../types/index.js";
+export function updateNativeKeysState(manager, e, keyIds = []) {
+  const s = manager.options.stringifier;
+  for (const id of manager.keys.nativeToggleKeys) {
+    const key = manager.keys.entries[id];
+    if (key.toggleOnPressed && key.toggleOffPressed) {
+      throw new KnownError(SHORTCUT_ERROR.INCORRECT_TOGGLE_STATE, `Key ${s.stringify(key, manager)} is a toggle key whose on and off versions are both pressed, which is not a valid state.`, { key });
+    }
+    const modifierState = getModifierState(key, e, manager);
+    if (modifierState === null) continue;
+    if (modifierState) {
+      if (!key.toggleOnPressed) {
+        safeSetEmulatedToggleState(key, true, manager);
+      }
+    } else {
+      if (key.toggleOnPressed) {
+        safeSetEmulatedToggleState(key, false, manager);
+      }
+    }
+  }
+  const added = [];
+  const removed = [];
+  for (const id of manager.keys.nativeModifierKeys) {
+    const key = manager.keys.entries[id];
+    const modifierState = getModifierState(key, e, manager);
+    if (modifierState === null) continue;
+    if (modifierState) {
+      if (!key.pressed) {
+        if (setKeyProp(key, "pressed", true, manager).isOk) {
+          added.push(id);
+        }
+      }
+    } else {
+      if (key.pressed) {
+        if (setKeyProp(key, "pressed", false, manager).isOk) {
+          removed.push(id);
+        }
+      }
+    }
+  }
+  if (added.length > 0) {
+    addToChain(manager, added, e);
+    const indexes = keyIds.map((key) => added.indexOf(key)).filter((i) => i > -1);
+    multisplice(keyIds, indexes);
+  }
+  if (removed.length > 0) {
+    removeFromChain(manager, removed, e);
+    const indexes = keyIds.map((key) => added.indexOf(key)).filter((i) => i > -1);
+    multisplice(keyIds, indexes);
+  }
+}

package/dist/layouts/createLayout.d.ts

@@ -0,0 +1,25 @@
+import type { RawKey } from "../types/keys.js";
+/**
+ * Creates the given keyboard layout, assiging the correct sizes and positions to keys.
+ *
+ * It returns an array of raw keys so that if you're extending {@link Key} you can create them with your extended class (you should override {@link Key.create}).
+ *
+ * Labels are assigned for most keys in english as a fallback, see {@link labelWithEvent}/{@link labelWithKeyboardMap} for proper labeling during runtime.
+ *
+ * Currently only supports generating the following layouts: `ansi`, `iso`. Technically the layout returned is a variation of these that includes half height 1.3333u (4u / 3 keys) media keys over the numpad.
+ *
+ * Pull requests for [standard layouts]([https://www.w3.org/TR/uievents-code) welcomed.
+ *
+ * You can remove sections using the options. Note that this just removes them and does not do any repositioning. If you only remove the numpad, for example, the media keys will still be placed above it. The idea is to easily allow reducing the size of the created layout to then adjust only a few keys to your liking.
+ *
+ * Also note the `navigation` section is split into two sections with `navigation` only refering to the 6 `Insert`, `Home`, etc. keys, and `arrowKeys` refering to the arrow keys.
+ *
+ * This also adds the following classes to some keys: `center-label` for media and arrow keys, and `iso-enter` for the iso enter which requires a different approach to styling (see the demo, it's painful).
+ */
+export declare function createLayout<TNumpad extends boolean = true, TMediaKeys extends boolean = true, TFn extends boolean = true, TNavigation extends boolean = true, TArrowKeys extends boolean = true, TNames extends string = "Escape" | (TFn extends true ? "F1" | "F2" | "F3" | "F4" | "F5" | "F6" | "F7" | "F8" | "F9" | "F10" | "F11" | "F12" : never) | "Backquote" | "Digit1" | "Digit2" | "Digit3" | "Digit4" | "Digit5" | "Digit6" | "Digit7" | "Digit8" | "Digit9" | "Digit0" | "Minus" | "Equal" | "Backspace" | "Tab" | "KeyQ" | "KeyW" | "KeyE" | "KeyR" | "KeyT" | "KeyY" | "KeyU" | "KeyI" | "KeyO" | "KeyP" | "BracketLeft" | "BracketRight" | "Backslash" | "CapsLock" | "KeyA" | "KeyS" | "KeyD" | "KeyF" | "KeyG" | "KeyH" | "KeyJ" | "KeyK" | "KeyL" | "Semicolon" | "Quote" | "Enter" | "VirtualShiftLeft" | "IntlBackslash" | "KeyZ" | "KeyX" | "KeyC" | "KeyV" | "KeyB" | "KeyN" | "KeyM" | "Comma" | "Period" | "Slash" | "VirtualShiftRight" | "VirtualControlLeft" | "VirtualMetaLeft" | "VirtualAltLeft" | "Space" | "VirtualAltRight" | "VirtualMetaRight" | "ContextMenu" | "VirtualControlRight" | "PrintScreen" | "ScrollLock" | "Pause" | (TNavigation extends true ? "Insert" | "Home" | "PageUp" : never) | (TArrowKeys extends true ? "ArrowUp" | "ArrowLeft" | "ArrowDown" | "ArrowRight" : never) | (TMediaKeys extends true ? "AudioVolumeMute" | "AudioVolumeDown" | "AudioVolumeUp" | "MediaTrackPrevious" | "MediaTrackPause" | "MediaTrackNext" : never) | (TNumpad extends true ? ("NumLock" | "NumpadDivide" | "NumpadMultiply" | "NumpadSubtract" | "Numpad7" | "Numpad8" | "Numpad9" | "NumpadAdd" | "Numpad4" | "Numpad5" | "Numpad6" | "Numpad1" | "Numpad2" | "Numpad3" | "NumpadEnter" | "Numpad0" | "NumpadDecimal") : never)>(type?: "ansi" | "iso" | "", { numpad, mediaKeys, fn, navigation, arrowKeys }?: Partial<{
+    numpad: TNumpad;
+    mediaKeys: TMediaKeys;
+    fn: TFn;
+    navigation: TNavigation;
+    arrowKeys: TArrowKeys;
+}>): RawKey<TNames>[];

package/dist/layouts/createLayout.js

@@ -0,0 +1,221 @@
+import { calculateAndSetPositionAndSize } from "../helpers/calculateAndSetPositionAndWidth.js";
+const start = 0;
+const mediaKey = { height: 0.5, width: 4 / 3 };
+const setY = (yVal) => (val) => {
+  val.y = yVal;
+  return val;
+};
+export function createLayout(type = "ansi", {
+  numpad = true,
+  mediaKeys = true,
+  fn = true,
+  navigation = true,
+  arrowKeys = true
+} = {}) {
+  const keys = [
+    ...calculateAndSetPositionAndSize([
+      { id: "Escape", label: "Esc" },
+      ...fn ? [
+        { id: "F1", x: 2 },
+        { id: "F2" },
+        { id: "F3" },
+        { id: "F4" },
+        { id: "F5", x: 6.5 },
+        { id: "F6" },
+        { id: "F7" },
+        { id: "F8" },
+        { id: "F9", x: 11 },
+        { id: "F10" },
+        { id: "F11" },
+        { id: "F12" }
+      ] : []
+    ]).map(setY(start + 0)),
+    ...calculateAndSetPositionAndSize([
+      { id: "Backquote", label: "`" },
+      { id: "Digit1", label: "1" },
+      { id: "Digit2", label: "2" },
+      { id: "Digit3", label: "3" },
+      { id: "Digit4", label: "4" },
+      { id: "Digit5", label: "5" },
+      { id: "Digit6", label: "6" },
+      { id: "Digit7", label: "7" },
+      { id: "Digit8", label: "8" },
+      { id: "Digit9", label: "9" },
+      { id: "Digit0", label: "0" },
+      { id: "Minus", label: "-" },
+      { id: "Equal", label: "=" },
+      { id: "Backspace", width: 2 }
+    ]).map(setY(start + 2)),
+    ...calculateAndSetPositionAndSize([
+      { id: "Tab", width: 1.5 },
+      { id: "KeyQ", label: "q" },
+      { id: "KeyW", label: "w" },
+      { id: "KeyE", label: "e" },
+      { id: "KeyR", label: "r" },
+      { id: "KeyT", label: "t" },
+      { id: "KeyY", label: "y" },
+      { id: "KeyU", label: "u" },
+      { id: "KeyI", label: "i" },
+      { id: "KeyO", label: "o" },
+      { id: "KeyP", label: "p" },
+      { id: "BracketLeft", label: "[" },
+      { id: "BracketRight", label: "]" },
+      type === "ansi" ? { id: "Backslash", label: "\\", width: 1.5 } : type === "iso" ? { id: "Enter", width: 1.5, height: 2, classes: ["iso-enter"] } : {}
+    ]).map(setY(start + 3)),
+    ...calculateAndSetPositionAndSize([
+      { id: "CapsLock", width: 1.75, isToggle: "native" },
+      { id: "KeyA", label: "a" },
+      { id: "KeyS", label: "s" },
+      { id: "KeyD", label: "d" },
+      { id: "KeyF", label: "f" },
+      { id: "KeyG", label: "g" },
+      { id: "KeyH", label: "h" },
+      { id: "KeyJ", label: "j" },
+      { id: "KeyK", label: "k" },
+      { id: "KeyL", label: "l" },
+      { id: "Semicolon", label: ";" },
+      { id: "Quote", label: "'" },
+      type === "ansi" ? { id: "Enter", width: 2.25 } : type === "iso" ? { id: "Backslash", label: "#", width: 1 } : {}
+    ]).map(setY(start + 4)),
+    ...calculateAndSetPositionAndSize([
+      ...type === "ansi" ? [
+        { id: "VirtualShiftLeft", isModifier: "native", label: "Shift", variants: ["ShiftLeft", "ShiftRight", "Shift"], width: 2.25 }
+      ] : type === "iso" ? [
+        { id: "VirtualShiftLeft", isModifier: "native", label: "Shift", variants: ["ShiftLeft", "ShiftRight", "Shift"], width: 1.25 },
+        { id: "IntlBackslash", label: "\\", width: 1 }
+      ] : [],
+      { id: "KeyZ", label: "z" },
+      { id: "KeyX", label: "x" },
+      { id: "KeyC", label: "c" },
+      { id: "KeyV", label: "v" },
+      { id: "KeyB", label: "b" },
+      { id: "KeyN", label: "n" },
+      { id: "KeyM", label: "m" },
+      { id: "Comma", label: "," },
+      { id: "Period", label: "." },
+      { id: "Slash", label: "/" },
+      {
+        id: "VirtualShiftRight",
+        isModifier: "native",
+        label: "Shift",
+        variants: ["ShiftLeft", "ShiftRight", "Shift"],
+        width: 2.75
+      }
+    ]).map(setY(start + 5)),
+    ...calculateAndSetPositionAndSize([
+      {
+        id: "VirtualControlLeft",
+        isModifier: "native",
+        label: "Ctrl",
+        variants: ["ControlLeft", "ControlRight", "Control", "Ctrl"],
+        width: 1.25
+      },
+      {
+        id: "VirtualMetaLeft",
+        isModifier: "native",
+        label: "Meta",
+        variants: ["MetaLeft", "MetaRight", "Meta"],
+        width: 1.25
+      },
+      {
+        id: "VirtualAltLeft",
+        isModifier: "native",
+        label: "Alt",
+        variants: ["AltLeft", "AltRight", "Alt"],
+        width: 1.25
+      },
+      { id: "Space", label: "", width: 6.25 },
+      {
+        id: "VirtualAltRight",
+        isModifier: "native",
+        label: "Alt",
+        variants: ["AltLeft", "AltRight", "Alt"],
+        width: 1.25
+      },
+      {
+        id: "VirtualMetaRight",
+        isModifier: "native",
+        label: "Meta",
+        variants: ["MetaLeft", "MetaRight", "Meta"],
+        width: 1.25
+      },
+      { id: "ContextMenu", label: "Menu", width: 1.25 },
+      {
+        id: "VirtualControlRight",
+        isModifier: "native",
+        label: "Ctrl",
+        variants: ["ControlLeft", "ControlRight", "Control", "Ctrl"],
+        width: 1.25
+      }
+    ]).map(setY(start + 6)),
+    ...calculateAndSetPositionAndSize([
+      { id: "PrintScreen", label: "PrtScn", x: 15.5 },
+      { id: "ScrollLock", label: "Scroll\nLock", isToggle: "native" },
+      { id: "Pause", label: "Pause\nBreak" }
+    ]).map(setY(start)),
+    ...navigation ? [
+      ...calculateAndSetPositionAndSize([
+        { id: "Insert", x: 15.5 },
+        { id: "Home" },
+        { id: "PageUp", label: "Pg\nUp" }
+      ]).map(setY(start + 2)),
+      ...calculateAndSetPositionAndSize([
+        { id: "Delete", x: 15.5 },
+        { id: "End" },
+        { id: "PageDown", label: "Pg\nDown" }
+      ]).map(setY(start + 3))
+    ] : [],
+    ...arrowKeys ? [
+      ...calculateAndSetPositionAndSize([
+        { id: "ArrowUp", label: "\u25B2", x: 16.5, y: start + 5, classes: ["center-label"] }
+      ]),
+      ...calculateAndSetPositionAndSize([
+        { id: "ArrowLeft", label: "\u25C4", x: 15.5, classes: ["center-label"] },
+        { id: "ArrowDown", label: "\u25BC", classes: ["center-label"] },
+        { id: "ArrowRight", label: "\u25BA", classes: ["center-label"] }
+      ]).map(setY(start + 6))
+    ] : [],
+    ...mediaKeys ? [
+      ...calculateAndSetPositionAndSize([
+        { id: "AudioVolumeMute", label: "\u{1F507}", x: 19, ...mediaKey, classes: ["center-label"] },
+        { id: "AudioVolumeDown", label: "\u{1F509}", ...mediaKey, classes: ["center-label"] },
+        { id: "AudioVolumeUp", label: "\u{1F50A}", ...mediaKey, classes: ["center-label"] }
+      ]).map(setY(start)),
+      ...calculateAndSetPositionAndSize([
+        { id: "MediaTrackPrevious", label: "\u23EE\uFE0F", x: 19, ...mediaKey, classes: ["center-label"] },
+        { id: "MediaTrackPause", label: "\u23EF\uFE0F", ...mediaKey, classes: ["center-label"] },
+        { id: "MediaTrackNext", label: "\u23ED\uFE0F", ...mediaKey, classes: ["center-label"] }
+      ]).map(setY(start + 0.5))
+    ] : [],
+    ...numpad ? [
+      ...calculateAndSetPositionAndSize([
+        { id: "NumLock", label: "Num\nLock", x: 19, isToggle: "native" },
+        { id: "NumpadDivide", label: "/" },
+        { id: "NumpadMultiply", label: "*" },
+        { id: "NumpadSubtract", label: "-" }
+      ]).map(setY(start + 2)),
+      ...calculateAndSetPositionAndSize([
+        { id: "Numpad7", label: "7", x: 19 },
+        { id: "Numpad8", label: "8" },
+        { id: "Numpad9", label: "9" },
+        { id: "NumpadAdd", label: "+", height: 2 }
+      ]).map(setY(start + 3)),
+      ...calculateAndSetPositionAndSize([
+        { id: "Numpad4", label: "4", x: 19 },
+        { id: "Numpad5", label: "5" },
+        { id: "Numpad6", label: "6" }
+      ]).map(setY(start + 4)),
+      ...calculateAndSetPositionAndSize([
+        { id: "Numpad1", label: "1", x: 19 },
+        { id: "Numpad2", label: "2" },
+        { id: "Numpad3", label: "3" },
+        { id: "NumpadEnter", label: "+", height: 2 }
+      ]).map(setY(start + 5)),
+      ...calculateAndSetPositionAndSize([
+        { id: "Numpad0", label: "0", x: 19, width: 2 },
+        { id: "NumpadDecimal", label: "." }
+      ]).map(setY(start + 6))
+    ] : []
+  ];
+  return keys;
+}

package/dist/module.d.mts

@@ -0,0 +1,13 @@
+import * as _nuxt_schema from '@nuxt/schema';
+
+declare module "@nuxt/schema" {
+    interface PublicRuntimeConfig {
+        witchcraftSpellcraft: {};
+    }
+}
+interface ModuleOptions {
+}
+declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
+
+export { _default as default };
+export type { ModuleOptions };

package/dist/module.json

@@ -0,0 +1,9 @@
+{
+  "name": "witchcraftSpellcraft",
+  "configKey": "witchcraftSpellcraft",
+  "version": "0.0.1",
+  "builder": {
+    "@nuxt/module-builder": "1.0.2",
+    "unbuild": "3.6.1"
+  }
+}

package/dist/module.mjs

@@ -0,0 +1,40 @@
+import { createResolver, defineNuxtModule, addTypeTemplate, addImportsDir } from '@nuxt/kit';
+
+const dependencies = {
+	"@witchcraft/ui": "^0.2.4"};
+const pkg = {
+	dependencies: dependencies};
+
+const { resolve } = createResolver(import.meta.url);
+const module = defineNuxtModule({
+  meta: {
+    name: "witchcraftSpellcraft",
+    configKey: "witchcraftSpellcraft"
+  },
+  defaults: {},
+  moduleDependencies: {
+    "@witchcraft/ui/nuxt": {
+      version: pkg.dependencies["@witchcraft/ui"]
+    }
+  },
+  async setup(_options, nuxt) {
+    addTypeTemplate({
+      filename: "types/witchcraft-spellcraft.d.ts",
+      getContents: () => `
+				import { type NavigatorWKeyboard } from "./src/types/general.ts"
+
+
+				declare global {
+					interface Navigator {
+						keyboard: NavigatorWKeyboard["keyboard"]
+					}
+				}
+			`
+    });
+    addImportsDir(resolve("runtime/composables"));
+    addImportsDir(resolve("runtime/utils"));
+    nuxt.options.alias["#witchcraft-spellcraft"] = resolve("runtime");
+  }
+});
+
+export { module as default };