import { a as createVueComponent, _ as _export_sfc, r as reactive, b as onMounted, d as axios, e as appUrl, c as createElementBlock, f as createBaseVNode, F as Fragment, g as renderList, o as openBlock, h as createVNode, w as withCtx, i as createTextVNode, u as unref, I as IconKeyboard, t as toDisplayString, j as withModifiers, k as isLocal, A as AuthCall, l as defineStore, m as ref, n as onUpdated, p as createCommentVNode, q as normalizeClass, s as createBlock, v as renderSlot, x as withDirectives, y as vModelText } from "./index-GNAKlyBz.js";
import { _ as _sfc_main$h, a as _sfc_main$i } from "./DialogComp-Ba5-BUTe.js";
/**
 * @license @tabler/icons-vue v3.30.0 - MIT
 *
 * This source code is licensed under the MIT license.
 * See the LICENSE file in the root directory of this source tree.
 */
var IconAlarm = createVueComponent("outline", "alarm", "IconAlarm", [["path", { "d": "M12 13m-7 0a7 7 0 1 0 14 0a7 7 0 1 0 -14 0", "key": "svg-0" }], ["path", { "d": "M12 10l0 3l2 0", "key": "svg-1" }], ["path", { "d": "M7 4l-2.75 2", "key": "svg-2" }], ["path", { "d": "M17 4l2.75 2", "key": "svg-3" }]]);
/**
 * @license @tabler/icons-vue v3.30.0 - MIT
 *
 * This source code is licensed under the MIT license.
 * See the LICENSE file in the root directory of this source tree.
 */
var IconArrowLeftCircle = createVueComponent("outline", "arrow-left-circle", "IconArrowLeftCircle", [["path", { "d": "M17 12h-14", "key": "svg-0" }], ["path", { "d": "M6 9l-3 3l3 3", "key": "svg-1" }], ["path", { "d": "M19 12m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-2" }]]);
/**
 * @license @tabler/icons-vue v3.30.0 - MIT
 *
 * This source code is licensed under the MIT license.
 * See the LICENSE file in the root directory of this source tree.
 */
var IconArrowRightCircle = createVueComponent("outline", "arrow-right-circle", "IconArrowRightCircle", [["path", { "d": "M18 15l3 -3l-3 -3", "key": "svg-0" }], ["path", { "d": "M5 12m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-1" }], ["path", { "d": "M7 12h14", "key": "svg-2" }]]);
/**
 * @license @tabler/icons-vue v3.30.0 - MIT
 *
 * This source code is licensed under the MIT license.
 * See the LICENSE file in the root directory of this source tree.
 */
var IconDeviceFloppy = createVueComponent("outline", "device-floppy", "IconDeviceFloppy", [["path", { "d": "M6 4h10l4 4v10a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2", "key": "svg-0" }], ["path", { "d": "M12 14m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-1" }], ["path", { "d": "M14 4l0 4l-6 0l0 -4", "key": "svg-2" }]]);
/**
 * @license @tabler/icons-vue v3.30.0 - MIT
 *
 * This source code is licensed under the MIT license.
 * See the LICENSE file in the root directory of this source tree.
 */
var IconPencil = createVueComponent("outline", "pencil", "IconPencil", [["path", { "d": "M4 20h4l10.5 -10.5a2.828 2.828 0 1 0 -4 -4l-10.5 10.5v4", "key": "svg-0" }], ["path", { "d": "M13.5 6.5l4 4", "key": "svg-1" }]]);
/**
 * @license @tabler/icons-vue v3.30.0 - MIT
 *
 * This source code is licensed under the MIT license.
 * See the LICENSE file in the root directory of this source tree.
 */
var IconPlus = createVueComponent("outline", "plus", "IconPlus", [["path", { "d": "M12 5l0 14", "key": "svg-0" }], ["path", { "d": "M5 12l14 0", "key": "svg-1" }]]);
/**
 * @license @tabler/icons-vue v3.30.0 - MIT
 *
 * This source code is licensed under the MIT license.
 * See the LICENSE file in the root directory of this source tree.
 */
var IconRestore = createVueComponent("outline", "restore", "IconRestore", [["path", { "d": "M3.06 13a9 9 0 1 0 .49 -4.087", "key": "svg-0" }], ["path", { "d": "M3 4.001v5h5", "key": "svg-1" }], ["path", { "d": "M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-2" }]]);
/**
 * @license @tabler/icons-vue v3.30.0 - MIT
 *
 * This source code is licensed under the MIT license.
 * See the LICENSE file in the root directory of this source tree.
 */
var IconTimeDuration15 = createVueComponent("outline", "time-duration-15", "IconTimeDuration15", [["path", { "d": "M12 15h2a1 1 0 0 0 1 -1v-1a1 1 0 0 0 -1 -1h-2v-3h3", "key": "svg-0" }], ["path", { "d": "M9 9v6", "key": "svg-1" }], ["path", { "d": "M3 12v.01", "key": "svg-2" }], ["path", { "d": "M12 21v.01", "key": "svg-3" }], ["path", { "d": "M7.5 4.2v.01", "key": "svg-4" }], ["path", { "d": "M16.5 19.8v.01", "key": "svg-5" }], ["path", { "d": "M7.5 19.8v.01", "key": "svg-6" }], ["path", { "d": "M4.2 16.5v.01", "key": "svg-7" }], ["path", { "d": "M19.8 16.5v.01", "key": "svg-8" }], ["path", { "d": "M4.2 7.5v.01", "key": "svg-9" }], ["path", { "d": "M21 12a9 9 0 0 0 -9 -9", "key": "svg-10" }]]);
/**
 * @license @tabler/icons-vue v3.30.0 - MIT
 *
 * This source code is licensed under the MIT license.
 * See the LICENSE file in the root directory of this source tree.
 */
var IconTrash = createVueComponent("outline", "trash", "IconTrash", [["path", { "d": "M4 7l16 0", "key": "svg-0" }], ["path", { "d": "M10 11l0 6", "key": "svg-1" }], ["path", { "d": "M14 11l0 6", "key": "svg-2" }], ["path", { "d": "M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12", "key": "svg-3" }], ["path", { "d": "M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3", "key": "svg-4" }]]);
/**
 * @license @tabler/icons-vue v3.30.0 - MIT
 *
 * This source code is licensed under the MIT license.
 * See the LICENSE file in the root directory of this source tree.
 */
var IconPlayerRecordFilled = createVueComponent("filled", "player-record-filled", "IconPlayerRecordFilled", [["path", { "d": "M8 5.072a8 8 0 1 1 -3.995 7.213l-.005 -.285l.005 -.285a8 8 0 0 1 3.995 -6.643z", "key": "svg-0" }]]);
/**
 * @license @tabler/icons-vue v3.30.0 - MIT
 *
 * This source code is licensed under the MIT license.
 * See the LICENSE file in the root directory of this source tree.
 */
var IconPlayerStopFilled = createVueComponent("filled", "player-stop-filled", "IconPlayerStopFilled", [["path", { "d": "M17 4h-10a3 3 0 0 0 -3 3v10a3 3 0 0 0 3 3h10a3 3 0 0 0 3 -3v-10a3 3 0 0 0 -3 -3z", "key": "svg-0" }]]);
const _hoisted_1$d = { class: "macro-overview mcrm-block block__dark" };
const _hoisted_2$b = { class: "macro-overview__list" };
const _sfc_main$g = {
  __name: "MacroOverview",
  setup(__props) {
    const macros = reactive({
      list: []
    });
    onMounted(() => {
      axios.post(appUrl() + "/macro/list").then((data) => {
        if (data.data.length > 0) macros.list = data.data;
      });
    });
    function runMacro(macro) {
      const data = isLocal() ? { macro } : AuthCall({ macro });
      axios.post(appUrl() + "/macro/play", data).then((data2) => {
        console.log(data2);
      });
    }
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1$d, [
        _cache[0] || (_cache[0] = createBaseVNode("h4", { class: "border-b-2 border-transparent" }, "Saved Macros", -1)),
        createBaseVNode("div", _hoisted_2$b, [
          (openBlock(true), createElementBlock(Fragment, null, renderList(macros.list, (macro, i) => {
            return openBlock(), createElementBlock("div", {
              class: "macro-item",
              key: i
            }, [
              createVNode(_sfc_main$h, {
                variant: "dark",
                class: "w-full",
                size: "sm",
                onClick: withModifiers(($event) => runMacro(macro), ["prevent"])
              }, {
                default: withCtx(() => [
                  createVNode(unref(IconKeyboard)),
                  createTextVNode(" " + toDisplayString(macro), 1)
                ]),
                _: 2
              }, 1032, ["onClick"])
            ]);
          }), 128))
        ])
      ]);
    };
  }
};
const MacroOverview = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["__scopeId", "data-v-f9a187e3"]]);
const keyMap = {
  // Modifier keys
  Control: "Ctrl",
  Shift: "Shift",
  Alt: "Alt",
  Meta: "Win",
  CapsLock: "Caps",
  // Special keys
  PageUp: "PgUp",
  PageDown: "PgDn",
  ScrollLock: "Scr Lk",
  Insert: "Ins",
  Delete: "Del",
  Escape: "Esc",
  Space: "Space",
  // Symbol keys
  Backquote: "`",
  Backslash: "\\",
  BracketLeft: "[",
  BracketRight: "]",
  Comma: ",",
  Equal: "=",
  Minus: "-",
  Period: ".",
  Quote: "'",
  Semicolon: ";",
  Slash: "/",
  // Arrow keys
  ArrowUp: "▲",
  ArrowRight: "▶",
  ArrowDown: "▼",
  ArrowLeft: "◀",
  // Media keys
  MediaPlayPause: "Play",
  MediaStop: "Stop",
  MediaTrackNext: "Next",
  MediaTrackPrevious: "Prev",
  MediaVolumeDown: "Down",
  MediaVolumeUp: "Up",
  AudioVolumeMute: "Mute",
  AudioVolumeDown: "Down",
  AudioVolumeUp: "Up"
};
const filterKey = (e) => {
  const k = {};
  if (e.location === 1) k.loc = "left";
  if (e.location === 2) k.loc = "right";
  if (e.location === 3) k.loc = "num";
  if (e.key.includes("Media") || e.key.includes("Audio")) k.loc = mediaPrefix(e);
  if (keyMap[e.code] || keyMap[e.key]) {
    k.str = keyMap[e.code] || keyMap[e.key];
  } else {
    k.str = e.key.toLowerCase();
  }
  return k;
};
const mediaPrefix = (e) => {
  switch (e.key) {
    case "MediaPlayPause":
    case "MediaStop":
    case "MediaTrackNext":
    case "MediaTrackPrevious":
      return "Media";
    case "MediaVolumeDown":
    case "MediaVolumeUp":
    case "AudioVolumeDown":
    case "AudioVolumeUp":
    case "AudioVolumeMute":
      return "Volume";
  }
};
const isRepeat = (lastStep, e, direction) => {
  return lastStep && lastStep.type === "key" && lastStep.code === e.code && lastStep.direction === direction;
};
const invalidMacro = (steps) => {
  const downKeys = [];
  const upKeys = [];
  Object.keys(steps).forEach((stepKey) => {
    const step = steps[stepKey];
    if (step.type !== "key") return;
    if (step.direction == "down") downKeys.push(step.key);
    if (step.direction == "up") {
      if (!downKeys.includes(step.key)) upKeys.push(step.key);
      else downKeys.splice(downKeys.indexOf(step.key), 1);
    }
  });
  if (upKeys.length === 0 && downKeys.length === 0) return false;
  return { down: downKeys, up: upKeys };
};
const useMacroRecorderStore = defineStore("macrorecorder", () => {
  const state = ref({
    record: false,
    edit: false,
    editKey: false,
    editDelay: false,
    validationErrors: false
  });
  const macroName = ref("");
  const steps = ref([]);
  const delay = ref({
    start: 0,
    fixed: false
  });
  const getEditKey = () => steps.value[state.value.editKey];
  const getAdjacentKey = (pos, includeDelay = false) => {
    let returnVal = false;
    const mod = pos == "before" ? -1 : 1;
    const keyIndex = state.value.editKey + 2 * mod;
    const delayIndex = includeDelay ? state.value.editKey + 1 * mod : false;
    if (steps.value[keyIndex]) returnVal = steps.value[keyIndex];
    if (delayIndex && steps.value[delayIndex])
      returnVal = {
        delay: steps.value[delayIndex],
        key: steps.value[keyIndex],
        delayIndex
      };
    return returnVal;
  };
  const getEditDelay = () => steps.value[state.value.editDelay];
  const recordStep = (e, direction = false, key = false) => {
    const lastStep = steps.value[steps.value.length - 1];
    let stepVal = {};
    if (typeof e === "object" && !isRepeat(lastStep, e, direction)) {
      if (key === false) recordDelay();
      stepVal = {
        type: "key",
        key: e.key,
        code: e.code,
        location: e.location,
        direction,
        keyObj: filterKey(e)
      };
    } else if (direction && key !== false) {
      stepVal = steps.value[key];
      stepVal.direction = direction;
    } else if (typeof e === "number") {
      stepVal = { type: "delay", value: parseFloat(e.toFixed()) };
    }
    if (key !== false) steps.value[key] = stepVal;
    else steps.value.push(stepVal);
  };
  const recordDelay = () => {
    if (delay.value.fixed !== false)
      recordStep(delay.value.fixed);
    else if (delay.value.start == 0)
      delay.value.start = performance.now();
    else {
      recordStep(performance.now() - delay.value.start);
      delay.value.start = performance.now();
    }
  };
  const insertKey = (e, direction, adjacentDelayIndex) => {
    let min, max, newKeyIndex, newDelayIndex;
    if (adjacentDelayIndex === null) {
      min = state.value.editKey == 0 ? 0 : state.value.editKey;
      max = state.value.editKey == 0 ? 1 : false;
      newKeyIndex = max === false ? min + 2 : min;
      newDelayIndex = min + 1;
    } else if (state.value.editKey < adjacentDelayIndex) {
      min = state.value.editKey;
      max = adjacentDelayIndex;
      newKeyIndex = min + 2;
      newDelayIndex = min + 1;
    } else {
      min = adjacentDelayIndex;
      max = state.value.editKey;
      newKeyIndex = min + 1;
      newDelayIndex = min + 2;
    }
    if (max !== false) {
      for (let i = Object.keys(steps.value).length - 1; i >= max; i--) {
        steps.value[i + 2] = steps.value[i];
      }
    }
    recordStep(e, direction, newKeyIndex);
    recordStep(10, false, newDelayIndex);
    state.value.editKey = false;
  };
  const deleteEditKey = () => {
    if (state.value.editKey === 0) steps.value.splice(state.value.editKey, 2);
    else steps.value.splice(state.value.editKey - 1, 2);
    state.value.editKey = false;
  };
  const restartDelay = () => {
    delay.value.start = performance.now();
  };
  const changeName = (name) => {
    macroName.value = name;
    console.log(macroName.value);
  };
  const changeDelay = (fixed) => {
    delay.value.fixed = fixed;
    formatDelays();
  };
  const formatDelays = () => {
    steps.value = steps.value.map((step) => {
      if (step.type === "delay" && delay.value.fixed !== false) step.value = delay.value.fixed;
      return step;
    });
  };
  const toggleEdit = (type, key) => {
    if (type === "key") {
      state.value.editKey = key;
      state.value.editDelay = false;
    }
    if (type === "delay") {
      state.value.editKey = false;
      state.value.editDelay = key;
    }
  };
  const resetEdit = () => {
    state.value.edit = false;
    state.value.editKey = false;
    state.value.editDelay = false;
  };
  const reset = () => {
    state.value.record = false;
    delay.value.start = 0;
    steps.value = [];
    if (state.value.edit) resetEdit();
  };
  const save = () => {
    state.value.validationErrors = invalidMacro(steps.value);
    if (state.value.validationErrors) return false;
    axios.post(appUrl() + "/macro/record", { name: macroName.value, steps: steps.value }).then((data) => {
      console.log(data);
    });
    return true;
  };
  return {
    state,
    steps,
    delay,
    getEditKey,
    getAdjacentKey,
    getEditDelay,
    recordStep,
    insertKey,
    deleteEditKey,
    restartDelay,
    changeName,
    changeDelay,
    toggleEdit,
    resetEdit,
    reset,
    save
  };
});
const _hoisted_1$c = { key: 0 };
const _hoisted_2$a = ["innerHTML"];
const _hoisted_3$6 = { class: "dir" };
const _hoisted_4$4 = { key: 1 };
const _sfc_main$f = {
  __name: "MacroKey",
  props: {
    keyObj: Object,
    direction: String,
    active: Boolean,
    empty: Boolean
  },
  setup(__props) {
    const props = __props;
    const dir = reactive({
      value: false
    });
    onMounted(() => {
      if (props.empty) return;
      setDirection();
    });
    onUpdated(() => {
      setDirection();
    });
    const setDirection = () => {
      if (props.direction) dir.value = props.direction;
      else dir.value = props.keyObj.direction;
    };
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("kbd", {
        class: normalizeClass(`${__props.active ? "active" : ""} ${__props.empty ? "empty" : ""}`)
      }, [
        __props.keyObj ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
          __props.keyObj.loc ? (openBlock(), createElementBlock("sup", _hoisted_1$c, toDisplayString(__props.keyObj.loc), 1)) : createCommentVNode("", true),
          createBaseVNode("span", {
            innerHTML: __props.keyObj.str
          }, null, 8, _hoisted_2$a),
          createBaseVNode("span", _hoisted_3$6, toDisplayString(dir.value === "down" ? "↓" : "↑"), 1)
        ], 64)) : __props.empty ? (openBlock(), createElementBlock("span", _hoisted_4$4, "[ ]")) : createCommentVNode("", true)
      ], 2);
    };
  }
};
const _sfc_main$e = {
  __name: "DelaySpan",
  props: {
    value: Number,
    active: Boolean,
    preset: Boolean
  },
  setup(__props) {
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("span", {
        class: normalizeClass(`delay ${__props.active ? "active" : ""} ${__props.preset ? "preset" : ""}`)
      }, [
        __props.value < 1e4 ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
          createTextVNode(toDisplayString(__props.value) + " ", 1),
          _cache[0] || (_cache[0] = createBaseVNode("i", null, "ms", -1))
        ], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
          _cache[1] || (_cache[1] = createTextVNode(" >10 ")),
          _cache[2] || (_cache[2] = createBaseVNode("i", null, "s", -1))
        ], 64))
      ], 2);
    };
  }
};
const DelaySpan = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-05e04cbb"]]);
const _sfc_main$d = {
  __name: "RecorderOutput",
  setup(__props) {
    const macroRecorder = useMacroRecorderStore();
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", {
        class: normalizeClass(`macro-recorder__output ${unref(macroRecorder).state.record && "record"} ${unref(macroRecorder).state.edit && "edit"}`)
      }, [
        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(macroRecorder).steps, (step, key) => {
          return openBlock(), createElementBlock(Fragment, null, [
            step.type === "key" ? (openBlock(), createBlock(_sfc_main$f, {
              key,
              "key-obj": step.keyObj,
              direction: step.direction,
              active: unref(macroRecorder).state.editKey === key,
              onClick: ($event) => unref(macroRecorder).state.edit ? unref(macroRecorder).toggleEdit("key", key) : false
            }, null, 8, ["key-obj", "direction", "active", "onClick"])) : step.type === "delay" ? (openBlock(), createBlock(DelaySpan, {
              key,
              value: step.value,
              active: unref(macroRecorder).state.editDelay === key,
              onClick: ($event) => unref(macroRecorder).toggleEdit("delay", key)
            }, null, 8, ["value", "active", "onClick"])) : createCommentVNode("", true),
            _cache[0] || (_cache[0] = createBaseVNode("hr", { class: "spacer" }, null, -1))
          ], 64);
        }), 256))
      ], 2);
    };
  }
};
const RecorderOutput = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-33cbf1af"]]);
const _sfc_main$c = {
  __name: "RecorderInput",
  setup(__props) {
    const macroInput = ref(null);
    const macroRecorder = useMacroRecorderStore();
    onUpdated(() => {
      if (macroRecorder.state.record) {
        macroInput.value.focus();
        if (macroRecorder.delay.start !== 0) macroRecorder.restartDelay();
      }
    });
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", {
        class: normalizeClass(`recorder-input__container ${unref(macroRecorder).state.record && "record"}`)
      }, [
        unref(macroRecorder).state.record ? (openBlock(), createElementBlock("input", {
          key: 0,
          class: normalizeClass(`macro-recorder__input ${unref(macroRecorder).state.record && "record"}`),
          type: "text",
          ref_key: "macroInput",
          ref: macroInput,
          onFocus: _cache[0] || (_cache[0] = ($event) => console.log("focus")),
          onKeydown: _cache[1] || (_cache[1] = withModifiers(($event) => unref(macroRecorder).recordStep($event, "down"), ["prevent"])),
          onKeyup: _cache[2] || (_cache[2] = withModifiers(($event) => unref(macroRecorder).recordStep($event, "up"), ["prevent"]))
        }, null, 34)) : createCommentVNode("", true)
      ], 2);
    };
  }
};
const RecorderInput = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["__scopeId", "data-v-9a99c4ac"]]);
const _hoisted_1$b = { class: "context-menu" };
const _sfc_main$b = {
  __name: "ContextMenu",
  props: {
    open: Boolean
  },
  setup(__props, { expose: __expose }) {
    __expose({ toggle });
    const props = __props;
    const menuOpen = ref(false);
    onMounted(() => {
      menuOpen.value = props.open;
    });
    function toggle() {
      console.log("toggle");
      menuOpen.value = !menuOpen.value;
    }
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1$b, [
        createBaseVNode("div", {
          class: "context-menu__trigger",
          onClick: toggle
        }, [
          renderSlot(_ctx.$slots, "trigger")
        ]),
        createBaseVNode("div", {
          class: normalizeClass(`context-menu__content ${menuOpen.value ? "open" : ""}`)
        }, [
          renderSlot(_ctx.$slots, "content")
        ], 2)
      ]);
    };
  }
};
const _hoisted_1$a = {
  type: "number",
  step: "10",
  min: "0",
  max: "3600000",
  ref: "customDelayInput",
  placeholder: "100"
};
const _hoisted_2$9 = { class: "flex justify-end" };
const _sfc_main$a = {
  __name: "FixedDelayMenu",
  setup(__props) {
    const macroRecorder = useMacroRecorderStore();
    const ctxtMenu = ref();
    function changeDelay(num) {
      macroRecorder.changeDelay(num);
      ctxtMenu.value.toggle();
    }
    return (_ctx, _cache) => {
      return openBlock(), createBlock(_sfc_main$b, {
        ref_key: "ctxtMenu",
        ref: ctxtMenu
      }, {
        trigger: withCtx(() => [
          createVNode(_sfc_main$h, {
            variant: "secondary",
            size: "sm"
          }, {
            default: withCtx(() => [
              createVNode(unref(IconTimeDuration15)),
              _cache[5] || (_cache[5] = createTextVNode("Fixed delay "))
            ]),
            _: 1
          })
        ]),
        content: withCtx(() => [
          createBaseVNode("ul", null, [
            createBaseVNode("li", {
              onClick: _cache[0] || (_cache[0] = ($event) => changeDelay(0))
            }, "0ms"),
            createBaseVNode("li", {
              onClick: _cache[1] || (_cache[1] = ($event) => changeDelay(15))
            }, "15ms"),
            createBaseVNode("li", {
              onClick: _cache[2] || (_cache[2] = ($event) => changeDelay(50))
            }, "50ms"),
            createBaseVNode("li", {
              onClick: _cache[3] || (_cache[3] = ($event) => changeDelay(100))
            }, "100ms"),
            createBaseVNode("li", null, [
              createVNode(_sfc_main$i, null, {
                trigger: withCtx(() => _cache[6] || (_cache[6] = [
                  createBaseVNode("span", null, "Custom delay", -1)
                ])),
                content: withCtx(() => [
                  _cache[9] || (_cache[9] = createBaseVNode("h4", { class: "text-slate-50 mb-4" }, "Custom delay", -1)),
                  createBaseVNode("form", {
                    class: "grid gap-4 w-44",
                    onSubmit: _cache[4] || (_cache[4] = withModifiers(($event) => changeDelay(parseInt(_ctx.$refs.customDelayInput.value)), ["prevent"]))
                  }, [
                    createBaseVNode("div", null, [
                      createBaseVNode("input", _hoisted_1$a, null, 512),
                      _cache[7] || (_cache[7] = createBaseVNode("span", null, "ms", -1))
                    ]),
                    createBaseVNode("div", _hoisted_2$9, [
                      createVNode(_sfc_main$h, {
                        variant: "primary",
                        size: "sm"
                      }, {
                        default: withCtx(() => _cache[8] || (_cache[8] = [
                          createTextVNode("Set custom delay")
                        ])),
                        _: 1
                      })
                    ])
                  ], 32)
                ]),
                _: 1
              })
            ])
          ])
        ]),
        _: 1
      }, 512);
    };
  }
};
const FixedDelayMenu = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-597b5d4a"]]);
const _hoisted_1$9 = {
  id: "edit-key-dialog",
  class: "dialog__content"
};
const _hoisted_2$8 = {
  class: "grid gap-4",
  "submit.prevent": ""
};
const _hoisted_3$5 = { class: "flex gap-2 justify-center" };
const _hoisted_4$3 = { class: "flex justify-end" };
const _sfc_main$9 = {
  __name: "EditKeyDialog",
  setup(__props) {
    const editable = reactive({
      key: {},
      newKey: {}
    });
    const macroRecorder = useMacroRecorderStore();
    const newKeyInput = ref(null);
    onMounted(() => {
      editable.key = macroRecorder.getEditKey();
      editable.newKey.direction = editable.key.direction;
    });
    const handleNewKey = (e) => {
      editable.newKey.e = e;
      editable.newKey.keyObj = filterKey(e);
    };
    const handleNewDirection = (direction) => {
      editable.newKey.direction = direction;
      editable.newKey.keyObj = filterKey(editable.key);
    };
    const changeKey = () => {
      macroRecorder.recordStep(
        editable.newKey.e,
        editable.newKey.direction,
        macroRecorder.state.editKey
      );
      macroRecorder.state.editKey = false;
    };
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1$9, [
        _cache[9] || (_cache[9] = createBaseVNode("h4", { class: "text-slate-50 mb-4" }, "Press a key", -1)),
        createBaseVNode("div", {
          class: "flex justify-center",
          onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$refs.newKeyInput.focus())
        }, [
          editable.key.keyObj ? (openBlock(), createBlock(_sfc_main$f, {
            key: 0,
            "key-obj": editable.key.keyObj,
            direction: editable.key.direction
          }, null, 8, ["key-obj", "direction"])) : createCommentVNode("", true),
          typeof editable.newKey.keyObj === "object" ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
            _cache[5] || (_cache[5] = createBaseVNode("span", { class: "px-4 flex items-center text-white" }, " >>> ", -1)),
            createVNode(_sfc_main$f, {
              "key-obj": editable.newKey.keyObj,
              direction: editable.newKey.direction
            }, null, 8, ["key-obj", "direction"])
          ], 64)) : createCommentVNode("", true)
        ]),
        createBaseVNode("form", _hoisted_2$8, [
          createBaseVNode("input", {
            class: "size-0 opacity-0",
            type: "text",
            min: "0",
            max: "1",
            ref_key: "newKeyInput",
            ref: newKeyInput,
            placeholder: "New key",
            autofocus: "",
            onKeydown: _cache[1] || (_cache[1] = withModifiers(($event) => handleNewKey($event), ["prevent"]))
          }, null, 544),
          createBaseVNode("div", _hoisted_3$5, [
            createVNode(_sfc_main$h, {
              variant: "secondary",
              class: normalizeClass(editable.newKey.direction === "down" ? "selected" : ""),
              size: "sm",
              onClick: _cache[2] || (_cache[2] = withModifiers(($event) => handleNewDirection("down"), ["prevent"]))
            }, {
              default: withCtx(() => _cache[6] || (_cache[6] = [
                createTextVNode(" ↓ Down ")
              ])),
              _: 1
            }, 8, ["class"]),
            createVNode(_sfc_main$h, {
              variant: "secondary",
              class: normalizeClass(editable.newKey.direction === "up" ? "selected" : ""),
              size: "sm",
              onClick: _cache[3] || (_cache[3] = withModifiers(($event) => handleNewDirection("up"), ["prevent"]))
            }, {
              default: withCtx(() => _cache[7] || (_cache[7] = [
                createTextVNode(" ↑ Up ")
              ])),
              _: 1
            }, 8, ["class"])
          ]),
          createBaseVNode("div", _hoisted_4$3, [
            createVNode(_sfc_main$h, {
              variant: "primary",
              size: "sm",
              onClick: _cache[4] || (_cache[4] = withModifiers(($event) => changeKey(), ["prevent"]))
            }, {
              default: withCtx(() => _cache[8] || (_cache[8] = [
                createTextVNode(" Change key ")
              ])),
              _: 1
            })
          ])
        ])
      ]);
    };
  }
};
const EditKeyDialog = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-601167b6"]]);
const _hoisted_1$8 = {
  id: "edit-delay-dialog",
  class: "dialog__content"
};
const _hoisted_2$7 = {
  key: 0,
  class: "flex justify-center"
};
const _hoisted_3$4 = {
  class: "grid gap-4 mt-6",
  "submit.prevent": ""
};
const _hoisted_4$2 = { key: 0 };
const _hoisted_5$2 = { class: "flex justify-end" };
const _sfc_main$8 = {
  __name: "EditDelayDialog",
  setup(__props) {
    const macroRecorder = useMacroRecorderStore();
    const editable = reactive({
      delay: {},
      newDelay: { value: 0 }
    });
    onMounted(() => {
      editable.delay = macroRecorder.getEditDelay();
      editable.newDelay.value = editable.delay.value;
      console.log(editable);
    });
    const changeDelay = () => {
      if (!editable.newDelay.value) return;
      macroRecorder.recordStep(editable.newDelay.value, false, macroRecorder.state.editDelay);
      macroRecorder.state.editDelay = false;
    };
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1$8, [
        _cache[4] || (_cache[4] = createBaseVNode("h4", { class: "text-slate-50 mb-4" }, "Edit delay", -1)),
        editable.delay.value ? (openBlock(), createElementBlock("div", _hoisted_2$7, [
          createVNode(DelaySpan, {
            class: "!text-lg",
            value: editable.delay.value
          }, null, 8, ["value"])
        ])) : createCommentVNode("", true),
        createBaseVNode("form", _hoisted_3$4, [
          editable.newDelay.value ? (openBlock(), createElementBlock("div", _hoisted_4$2, [
            withDirectives(createBaseVNode("input", {
              type: "number",
              min: "0",
              max: "3600000",
              step: "10",
              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => editable.newDelay.value = $event),
              autofocus: ""
            }, null, 512), [
              [vModelText, editable.newDelay.value]
            ]),
            _cache[2] || (_cache[2] = createBaseVNode("span", null, "ms", -1))
          ])) : createCommentVNode("", true),
          createBaseVNode("div", _hoisted_5$2, [
            createVNode(_sfc_main$h, {
              variant: "primary",
              size: "sm",
              onClick: _cache[1] || (_cache[1] = withModifiers(($event) => changeDelay(), ["prevent"]))
            }, {
              default: withCtx(() => _cache[3] || (_cache[3] = [
                createTextVNode(" Change delay ")
              ])),
              _: 1
            })
          ])
        ])
      ]);
    };
  }
};
const EditDelayDialog = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-d4c82ec9"]]);
const _hoisted_1$7 = {
  id: "delete-key-dialog",
  class: "dialog__content"
};
const _hoisted_2$6 = { class: "flex justify-center w-full mb-4" };
const _hoisted_3$3 = { class: "flex justify-end gap-2 mt-6" };
const _sfc_main$7 = {
  __name: "DeleteKeyDialog",
  setup(__props) {
    const macroRecorder = useMacroRecorderStore();
    const keyObj = ref(null);
    onMounted(() => {
      keyObj.value = filterKey(macroRecorder.getEditKey());
    });
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1$7, [
        _cache[2] || (_cache[2] = createBaseVNode("h4", { class: "text-slate-50 mb-4" }, "Delete key", -1)),
        createBaseVNode("div", _hoisted_2$6, [
          keyObj.value ? (openBlock(), createBlock(_sfc_main$f, {
            key: 0,
            "key-obj": keyObj.value
          }, null, 8, ["key-obj"])) : createCommentVNode("", true)
        ]),
        _cache[3] || (_cache[3] = createBaseVNode("p", { class: "text-sm text-slate-300" }, "Are you sure you want to delete this key?", -1)),
        createBaseVNode("div", _hoisted_3$3, [
          createVNode(_sfc_main$h, {
            variant: "danger",
            size: "sm",
            onClick: _cache[0] || (_cache[0] = ($event) => unref(macroRecorder).deleteEditKey())
          }, {
            default: withCtx(() => _cache[1] || (_cache[1] = [
              createTextVNode(" Delete key ")
            ])),
            _: 1
          })
        ])
      ]);
    };
  }
};
const DeleteKeyDialog = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-7dc19ba4"]]);
const _hoisted_1$6 = {
  id: "insert-key-dialog",
  class: "dialog__content w-96"
};
const _hoisted_2$5 = { class: "text-slate-50 mb-4" };
const _hoisted_3$2 = {
  key: 0,
  class: "text-center"
};
const _hoisted_4$1 = { class: "insert-key__direction" };
const _hoisted_5$1 = { class: "flex justify-end" };
const _sfc_main$6 = {
  __name: "InsertKeyDialog",
  props: {
    position: String
  },
  setup(__props) {
    const props = __props;
    const macroRecorder = useMacroRecorderStore();
    const keyObjs = reactive({
      selected: null,
      insert: null,
      insertEvent: null,
      insertDirection: "down",
      adjacent: null,
      adjacentDelay: null,
      adjacentDelayIndex: null
    });
    const insertKeyInput = ref(null);
    const inputFocus = ref(false);
    onMounted(() => {
      keyObjs.selected = filterKey(macroRecorder.getEditKey());
      const adjacentKey = macroRecorder.getAdjacentKey(props.position, true);
      if (adjacentKey) keyObjs.adjacent = filterKey(adjacentKey.key);
      if (adjacentKey.delay) {
        keyObjs.adjacentDelay = adjacentKey.delay;
        keyObjs.adjacentDelayIndex = adjacentKey.delayIndex;
      }
    });
    const handleInsertKey = (e) => {
      keyObjs.insert = filterKey(e);
      keyObjs.insertEvent = e;
    };
    const insertKey = () => {
      macroRecorder.insertKey(keyObjs.insertEvent, keyObjs.insertDirection, keyObjs.adjacentDelayIndex);
    };
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1$6, [
        createBaseVNode("h4", _hoisted_2$5, "Insert key " + toDisplayString(__props.position), 1),
        inputFocus.value ? (openBlock(), createElementBlock("p", _hoisted_3$2, "[Press a key]")) : createCommentVNode("", true),
        createBaseVNode("input", {
          class: "size-0 opacity-0",
          type: "text",
          min: "0",
          max: "1",
          ref_key: "insertKeyInput",
          ref: insertKeyInput,
          placeholder: "New key",
          onFocusin: _cache[0] || (_cache[0] = ($event) => inputFocus.value = true),
          onFocusout: _cache[1] || (_cache[1] = ($event) => inputFocus.value = false),
          onKeydown: _cache[2] || (_cache[2] = withModifiers(($event) => handleInsertKey($event), ["prevent"])),
          autofocus: ""
        }, null, 544),
        createBaseVNode("div", {
          class: normalizeClass(["insert-output", __props.position == "before" ? "flex-row-reverse" : ""])
        }, [
          keyObjs.selected ? (openBlock(), createBlock(_sfc_main$f, {
            key: 0,
            "key-obj": keyObjs.selected
          }, null, 8, ["key-obj"])) : createCommentVNode("", true),
          _cache[10] || (_cache[10] = createBaseVNode("hr", { class: "spacer" }, null, -1)),
          createVNode(DelaySpan, {
            preset: true,
            value: 10
          }),
          _cache[11] || (_cache[11] = createBaseVNode("hr", { class: "spacer" }, null, -1)),
          keyObjs.insert ? (openBlock(), createBlock(_sfc_main$f, {
            key: 1,
            class: "insert",
            "key-obj": keyObjs.insert,
            direction: keyObjs.insertDirection,
            onClick: _cache[3] || (_cache[3] = ($event) => insertKeyInput.value.focus())
          }, null, 8, ["key-obj", "direction"])) : createCommentVNode("", true),
          !keyObjs.insert ? (openBlock(), createBlock(_sfc_main$f, {
            key: 2,
            empty: true,
            onClick: _cache[4] || (_cache[4] = ($event) => insertKeyInput.value.focus())
          })) : createCommentVNode("", true),
          keyObjs.adjacentDelay ? (openBlock(), createElementBlock(Fragment, { key: 3 }, [
            _cache[8] || (_cache[8] = createBaseVNode("hr", { class: "spacer" }, null, -1)),
            createVNode(DelaySpan, {
              value: keyObjs.adjacentDelay.value
            }, null, 8, ["value"])
          ], 64)) : createCommentVNode("", true),
          keyObjs.adjacent ? (openBlock(), createElementBlock(Fragment, { key: 4 }, [
            _cache[9] || (_cache[9] = createBaseVNode("hr", { class: "spacer" }, null, -1)),
            createVNode(_sfc_main$f, {
              "key-obj": keyObjs.adjacent
            }, null, 8, ["key-obj"])
          ], 64)) : createCommentVNode("", true)
        ], 2),
        createBaseVNode("div", _hoisted_4$1, [
          createVNode(_sfc_main$h, {
            variant: "secondary",
            class: normalizeClass(keyObjs.insertDirection === "down" ? "selected" : ""),
            size: "sm",
            onClick: _cache[5] || (_cache[5] = withModifiers(($event) => keyObjs.insertDirection = "down", ["prevent"]))
          }, {
            default: withCtx(() => _cache[12] || (_cache[12] = [
              createTextVNode(" ↓ Down ")
            ])),
            _: 1
          }, 8, ["class"]),
          createVNode(_sfc_main$h, {
            variant: "secondary",
            class: normalizeClass(keyObjs.insertDirection === "up" ? "selected" : ""),
            size: "sm",
            onClick: _cache[6] || (_cache[6] = withModifiers(($event) => keyObjs.insertDirection = "up", ["prevent"]))
          }, {
            default: withCtx(() => _cache[13] || (_cache[13] = [
              createTextVNode(" ↑ Up ")
            ])),
            _: 1
          }, 8, ["class"])
        ]),
        createBaseVNode("div", _hoisted_5$1, [
          createVNode(_sfc_main$h, {
            variant: "primary",
            size: "sm",
            onClick: _cache[7] || (_cache[7] = ($event) => insertKey())
          }, {
            default: withCtx(() => _cache[14] || (_cache[14] = [
              createTextVNode("Insert key")
            ])),
            _: 1
          })
        ])
      ]);
    };
  }
};
const InsertKeyDialog = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-d2aab140"]]);
const _hoisted_1$5 = {
  key: 0,
  class: "macro-edit__dialogs"
};
const _hoisted_2$4 = {
  key: 0,
  class: "flex gap-2"
};
const _sfc_main$5 = {
  __name: "EditDialogs",
  setup(__props) {
    const macroRecorder = useMacroRecorderStore();
    const insert = reactive({ position: null });
    const ctxtMenu = ref();
    onMounted(() => {
      macroRecorder.$subscribe((mutation) => {
        if (mutation.events && mutation.events.key == "editKey" && mutation.events.newValue === false) {
          insert.position = null;
        }
      });
    });
    function onOpenDialog() {
      if (insert.position !== null) ctxtMenu.value.toggle();
    }
    function onCloseDialog() {
      macroRecorder.state.editKey = false;
      macroRecorder.state.editDelay = false;
      insert.position = null;
    }
    return (_ctx, _cache) => {
      return unref(macroRecorder).state.edit !== false ? (openBlock(), createElementBlock("div", _hoisted_1$5, [
        unref(macroRecorder).state.editKey !== false && typeof unref(macroRecorder).getEditKey() === "object" ? (openBlock(), createElementBlock("div", _hoisted_2$4, [
          createVNode(_sfc_main$b, {
            ref_key: "ctxtMenu",
            ref: ctxtMenu
          }, {
            trigger: withCtx(() => [
              createVNode(_sfc_main$h, {
                variant: "dark",
                size: "sm"
              }, {
                default: withCtx(() => [
                  createVNode(unref(IconPlus)),
                  _cache[2] || (_cache[2] = createTextVNode(" Insert "))
                ]),
                _: 1
              })
            ]),
            content: withCtx(() => [
              createBaseVNode("ul", null, [
                createBaseVNode("li", {
                  onClick: _cache[0] || (_cache[0] = ($event) => insert.position = "before")
                }, [
                  createVNode(unref(IconArrowLeftCircle)),
                  _cache[3] || (_cache[3] = createTextVNode(" Before"))
                ]),
                createBaseVNode("li", {
                  onClick: _cache[1] || (_cache[1] = ($event) => insert.position = "after")
                }, [
                  createVNode(unref(IconArrowRightCircle)),
                  _cache[4] || (_cache[4] = createTextVNode(" After"))
                ])
              ])
            ]),
            _: 1
          }, 512),
          insert.position !== null ? (openBlock(), createBlock(_sfc_main$i, {
            key: 0,
            open: insert.position !== null,
            onOnOpen: onOpenDialog,
            onOnClose: onCloseDialog
          }, {
            content: withCtx(() => [
              createVNode(InsertKeyDialog, {
                position: insert.position
              }, null, 8, ["position"])
            ]),
            _: 1
          }, 8, ["open"])) : createCommentVNode("", true),
          createVNode(_sfc_main$i, {
            id: `edit-key-${unref(macroRecorder).state.editKey}`,
            onOnOpen: onOpenDialog,
            onOnClose: onCloseDialog
          }, {
            trigger: withCtx(() => [
              createVNode(_sfc_main$h, {
                variant: "secondary",
                size: "sm"
              }, {
                default: withCtx(() => [
                  createVNode(unref(IconPencil)),
                  _cache[5] || (_cache[5] = createTextVNode("Edit "))
                ]),
                _: 1
              })
            ]),
            content: withCtx(() => [
              createVNode(EditKeyDialog)
            ]),
            _: 1
          }, 8, ["id"]),
          createVNode(_sfc_main$i, {
            onOnOpen: onOpenDialog,
            onOnClose: onCloseDialog
          }, {
            trigger: withCtx(() => [
              createVNode(_sfc_main$h, {
                size: "sm",
                variant: "danger"
              }, {
                default: withCtx(() => [
                  createVNode(unref(IconTrash)),
                  _cache[6] || (_cache[6] = createTextVNode("Delete "))
                ]),
                _: 1
              })
            ]),
            content: withCtx(() => [
              createVNode(DeleteKeyDialog)
            ]),
            _: 1
          })
        ])) : createCommentVNode("", true),
        unref(macroRecorder).state.editDelay !== false && typeof unref(macroRecorder).getEditDelay() === "object" ? (openBlock(), createBlock(_sfc_main$i, {
          key: 1,
          onOnOpen: onOpenDialog,
          onOnClose: onCloseDialog
        }, {
          trigger: withCtx(() => [
            createVNode(_sfc_main$h, {
              variant: "secondary",
              size: "sm"
            }, {
              default: withCtx(() => [
                createVNode(unref(IconAlarm)),
                _cache[7] || (_cache[7] = createTextVNode("Edit "))
              ]),
              _: 1
            })
          ]),
          content: withCtx(() => [
            createVNode(EditDelayDialog)
          ]),
          _: 1
        })) : createCommentVNode("", true)
      ])) : createCommentVNode("", true);
    };
  }
};
const EditDialogs = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-bf9e32be"]]);
const _hoisted_1$4 = { class: "macro-recorder__header" };
const _hoisted_2$3 = { class: "w-full grid grid-cols-[auto_1fr_auto] gap-2" };
const _sfc_main$4 = {
  __name: "RecorderHeader",
  setup(__props) {
    const macroRecorder = useMacroRecorderStore();
    const nameSet = ref(false);
    function changeName(name) {
      macroRecorder.changeName(name);
      nameSet.value = name.length > 0;
    }
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1$4, [
        createBaseVNode("div", _hoisted_2$3, [
          _cache[7] || (_cache[7] = createBaseVNode("h4", { class: "" }, "Name:", -1)),
          createBaseVNode("input", {
            id: "macro-name",
            type: "text",
            onInput: _cache[0] || (_cache[0] = withModifiers(($event) => changeName($event.target.value), ["prevent"])),
            placeholder: "New macro"
          }, null, 32),
          createBaseVNode("div", {
            class: normalizeClass(`recording__buttons ${!nameSet.value || unref(macroRecorder).state.edit ? "disabled" : ""}`)
          }, [
            createTextVNode(toDisplayString(unref(macroRecorder).name) + " ", 1),
            !unref(macroRecorder).state.record ? (openBlock(), createBlock(_sfc_main$h, {
              key: 0,
              variant: "primary",
              size: "sm",
              onClick: _cache[1] || (_cache[1] = ($event) => unref(macroRecorder).state.record = true)
            }, {
              default: withCtx(() => [
                createVNode(unref(IconPlayerRecordFilled), { class: "text-red-500" }),
                _cache[5] || (_cache[5] = createTextVNode("Record "))
              ]),
              _: 1
            })) : createCommentVNode("", true),
            unref(macroRecorder).state.record ? (openBlock(), createBlock(_sfc_main$h, {
              key: 1,
              variant: "danger",
              size: "sm",
              onClick: _cache[2] || (_cache[2] = ($event) => unref(macroRecorder).state.record = false)
            }, {
              default: withCtx(() => [
                createVNode(unref(IconPlayerStopFilled), { class: "text-white" }),
                _cache[6] || (_cache[6] = createTextVNode("Stop "))
              ]),
              _: 1
            })) : createCommentVNode("", true)
          ], 2)
        ]),
        unref(macroRecorder).steps.length > 0 ? (openBlock(), createElementBlock("div", {
          key: 0,
          class: normalizeClass(`edit__buttons ${unref(macroRecorder).state.record ? "disabled" : ""}`)
        }, [
          createBaseVNode("div", null, [
            !unref(macroRecorder).state.edit ? (openBlock(), createBlock(_sfc_main$h, {
              key: 0,
              variant: "secondary",
              size: "sm",
              onClick: _cache[3] || (_cache[3] = ($event) => unref(macroRecorder).state.edit = true)
            }, {
              default: withCtx(() => [
                createVNode(unref(IconPencil)),
                _cache[8] || (_cache[8] = createTextVNode("Edit "))
              ]),
              _: 1
            })) : createCommentVNode("", true),
            unref(macroRecorder).state.edit ? (openBlock(), createBlock(_sfc_main$h, {
              key: 1,
              variant: "danger",
              size: "sm",
              onClick: _cache[4] || (_cache[4] = ($event) => unref(macroRecorder).resetEdit())
            }, {
              default: withCtx(() => [
                createVNode(unref(IconPlayerStopFilled)),
                _cache[9] || (_cache[9] = createTextVNode("Stop "))
              ]),
              _: 1
            })) : createCommentVNode("", true)
          ]),
          unref(macroRecorder).state.edit ? (openBlock(), createBlock(FixedDelayMenu, { key: 0 })) : createCommentVNode("", true),
          createVNode(EditDialogs)
        ], 2)) : createCommentVNode("", true)
      ]);
    };
  }
};
const RecorderHeader = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-19251359"]]);
const _hoisted_1$3 = {
  id: "validation-error__dialog",
  class: "dialog__content"
};
const _hoisted_2$2 = {
  key: 0,
  class: "grid gap-4"
};
const _hoisted_3$1 = { key: 0 };
const _hoisted_4 = { key: 1 };
const _hoisted_5 = { class: "flex justify-end mt-4" };
const _sfc_main$3 = {
  __name: "ValidationErrorDialog",
  setup(__props) {
    const macroRecorder = useMacroRecorderStore();
    const errors = reactive({
      up: [],
      down: []
    });
    onMounted(() => {
      macroRecorder.$subscribe((mutation) => {
        if (mutation.events && mutation.events.key == "validationErrors") {
          errors.up = mutation.events.newValue !== false ? macroRecorder.state.validationErrors.up : [];
          errors.down = mutation.events.newValue !== false ? macroRecorder.state.validationErrors.down : [];
        }
        console.log(mutation);
      });
    });
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1$3, [
        _cache[4] || (_cache[4] = createBaseVNode("h4", { class: "text-slate-50 mb-4" }, "There's an error in your macro", -1)),
        errors && errors.up.length > 0 || errors.down.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_2$2, [
          errors.down.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_3$1, [
            _cache[1] || (_cache[1] = createBaseVNode("p", null, [
              createTextVNode(" The following keys have been "),
              createBaseVNode("strong", null, "pressed"),
              createTextVNode(" down, but "),
              createBaseVNode("strong", null, "not released"),
              createTextVNode(". ")
            ], -1)),
            createBaseVNode("ul", null, [
              (openBlock(true), createElementBlock(Fragment, null, renderList(errors.down, (key) => {
                return openBlock(), createElementBlock("li", { key }, toDisplayString(key.toUpperCase()), 1);
              }), 128))
            ])
          ])) : createCommentVNode("", true),
          errors.up.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_4, [
            _cache[2] || (_cache[2] = createBaseVNode("p", null, [
              createTextVNode(" The following keys have been "),
              createBaseVNode("strong", null, "released"),
              createTextVNode(", but "),
              createBaseVNode("strong", null, "not pressed"),
              createTextVNode(" down. ")
            ], -1)),
            createBaseVNode("ul", null, [
              (openBlock(true), createElementBlock(Fragment, null, renderList(errors.up, (key) => {
                return openBlock(), createElementBlock("li", { key }, toDisplayString(key.toUpperCase()), 1);
              }), 128))
            ])
          ])) : createCommentVNode("", true)
        ])) : createCommentVNode("", true),
        createBaseVNode("div", _hoisted_5, [
          createVNode(_sfc_main$h, {
            size: "sm",
            variant: "danger",
            onClick: _cache[0] || (_cache[0] = ($event) => unref(macroRecorder).state.validationErrors = false)
          }, {
            default: withCtx(() => _cache[3] || (_cache[3] = [
              createTextVNode(" Close ")
            ])),
            _: 1
          })
        ])
      ]);
    };
  }
};
const ValidationErrorDialog = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-ff532573"]]);
const _hoisted_1$2 = { class: "macro-recorder__footer" };
const _sfc_main$2 = {
  __name: "RecorderFooter",
  setup(__props) {
    const macroRecorder = useMacroRecorderStore();
    const errorDialog = ref();
    onMounted(() => {
      macroRecorder.$subscribe((mutation) => {
        if (mutation.events && mutation.events.key == "validationErrors") {
          errorDialog.value.toggleDialog(mutation.events.newValue !== false);
        }
      });
    });
    const toggleSave = () => {
      if (!macroRecorder.save()) errorDialog.value.toggleDialog(true);
    };
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1$2, [
        unref(macroRecorder).steps.length > 0 ? (openBlock(), createBlock(_sfc_main$h, {
          key: 0,
          variant: "danger",
          size: "sm",
          onClick: _cache[0] || (_cache[0] = ($event) => unref(macroRecorder).reset())
        }, {
          default: withCtx(() => [
            createVNode(unref(IconRestore)),
            _cache[2] || (_cache[2] = createTextVNode(" Reset "))
          ]),
          _: 1
        })) : createCommentVNode("", true),
        createVNode(_sfc_main$i, {
          ref_key: "errorDialog",
          ref: errorDialog
        }, {
          content: withCtx(() => [
            createVNode(ValidationErrorDialog)
          ]),
          _: 1
        }, 512),
        unref(macroRecorder).steps.length > 0 ? (openBlock(), createBlock(_sfc_main$h, {
          key: 1,
          disabled: unref(macroRecorder).state.record || unref(macroRecorder).state.edit,
          variant: "success",
          size: "sm",
          onClick: _cache[1] || (_cache[1] = ($event) => toggleSave())
        }, {
          default: withCtx(() => [
            createVNode(unref(IconDeviceFloppy)),
            _cache[3] || (_cache[3] = createTextVNode(" Save "))
          ]),
          _: 1
        }, 8, ["disabled"])) : createCommentVNode("", true)
      ]);
    };
  }
};
const RecorderFooter = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-fec5e8b6"]]);
const _hoisted_1$1 = { class: "macro-recorder mcrm-block block__light" };
const _hoisted_2$1 = { class: "recorder-interface" };
const _sfc_main$1 = {
  __name: "MacroRecorder",
  setup(__props) {
    const macroRecorder = useMacroRecorderStore();
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1$1, [
        createBaseVNode("div", _hoisted_2$1, [
          createVNode(RecorderHeader),
          createBaseVNode("div", {
            class: normalizeClass(`recorder-interface__container ${unref(macroRecorder).state.record && "record"} ${unref(macroRecorder).state.edit && "edit"}`)
          }, [
            createVNode(RecorderOutput),
            createVNode(RecorderInput)
          ], 2),
          createVNode(RecorderFooter)
        ])
      ]);
    };
  }
};
const _hoisted_1 = {
  id: "macros",
  class: "panel"
};
const _hoisted_2 = { class: "panel__content !p-0" };
const _hoisted_3 = { class: "macro-panel__content" };
const _sfc_main = {
  __name: "MacrosView",
  setup(__props) {
    ref(false);
    ref(null);
    onMounted(() => {
    });
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1, [
        _cache[0] || (_cache[0] = createBaseVNode("h1", { class: "panel__title" }, "Macros", -1)),
        createBaseVNode("div", _hoisted_2, [
          createBaseVNode("div", _hoisted_3, [
            createVNode(MacroOverview),
            createVNode(_sfc_main$1)
          ])
        ])
      ]);
    };
  }
};
const MacrosView = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c7be9772"]]);
export {
  MacrosView as default
};