"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const aria = require("../../../constants/aria.js");
const event = require("../../../utils/dom/event.js");
const icon = require("../../../utils/vue/icon.js");
const index = require("../../../hooks/use-locale/index.js");
const index$1 = require("../../icon/index.js");
const index$2 = require("../../button/index.js");
const helper = require("./helper.js");
const step = require("./step.js");
const vue = require("vue");
const omit = require("../../../../../lodash-es/omit.js");
const _hoisted_1 = ["aria-label"];
var step_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ vue.defineComponent({
  name: "ElTourStep",
  __name: "step",
  props: step.tourStepProps,
  emits: step.tourStepEmits,
  setup(__props, { emit: __emit }) {
    const props = __props;
    const emit = __emit;
    const { Close } = icon.CloseComponents;
    const { t } = index.useLocale();
    const { currentStep, current, total, showClose, closeIcon, mergedType, ns, slots: tourSlots, updateModelValue, onClose: tourOnClose, onFinish: tourOnFinish, onChange } = vue.inject(helper.tourKey);
    vue.watch(props, (val) => {
      currentStep.value = val;
    }, { immediate: true });
    const mergedShowClose = vue.computed(() => props.showClose ?? showClose.value);
    const mergedCloseIcon = vue.computed(() => props.closeIcon ?? closeIcon.value ?? Close);
    const filterButtonProps = (btnProps) => {
      if (!btnProps) return;
      return omit.default(btnProps, ["children", "onClick"]);
    };
    const onPrev = () => {
      var _a, _b;
      current.value -= 1;
      if ((_a = props.prevButtonProps) == null ? void 0 : _a.onClick) (_b = props.prevButtonProps) == null ? void 0 : _b.onClick();
      onChange();
    };
    const onNext = () => {
      var _a;
      if (current.value >= total.value - 1) onFinish();
      else current.value += 1;
      if ((_a = props.nextButtonProps) == null ? void 0 : _a.onClick) props.nextButtonProps.onClick();
      onChange();
    };
    const onFinish = () => {
      onClose();
      tourOnFinish();
    };
    const onClose = () => {
      updateModelValue(false);
      tourOnClose();
      emit("close");
    };
    const handleKeydown = (e) => {
      var _a;
      if ((_a = e.target) == null ? void 0 : _a.isContentEditable) return;
      switch (event.getEventCode(e)) {
        case aria.EVENT_CODE.left:
          e.preventDefault();
          current.value > 0 && onPrev();
          break;
        case aria.EVENT_CODE.right:
          e.preventDefault();
          onNext();
          break;
      }
    };
    vue.onMounted(() => {
      window.addEventListener("keydown", handleKeydown);
    });
    vue.onBeforeUnmount(() => {
      window.removeEventListener("keydown", handleKeydown);
    });
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
        mergedShowClose.value ? (vue.openBlock(), vue.createElementBlock("button", {
          key: 0,
          "aria-label": vue.unref(t)("el.tour.close"),
          class: vue.normalizeClass(vue.unref(ns).e("closebtn")),
          type: "button",
          onClick: onClose
        }, [vue.createVNode(vue.unref(index$1.ElIcon), { class: vue.normalizeClass(vue.unref(ns).e("close")) }, {
          default: vue.withCtx(() => [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(mergedCloseIcon.value)))]),
          _: 1
        }, 8, ["class"])], 10, _hoisted_1)) : vue.createCommentVNode("v-if", true),
        vue.createElementVNode("header", { class: vue.normalizeClass([vue.unref(ns).e("header"), { "show-close": vue.unref(showClose) }]) }, [vue.renderSlot(_ctx.$slots, "header", {}, () => [vue.createElementVNode("span", {
          role: "heading",
          class: vue.normalizeClass(vue.unref(ns).e("title"))
        }, vue.toDisplayString(__props.title), 3)])], 2),
        vue.createElementVNode("div", { class: vue.normalizeClass(vue.unref(ns).e("body")) }, [vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createElementVNode("span", null, vue.toDisplayString(__props.description), 1)])], 2),
        vue.createElementVNode("footer", { class: vue.normalizeClass(vue.unref(ns).e("footer")) }, [vue.createElementVNode("div", { class: vue.normalizeClass(vue.unref(ns).b("indicators")) }, [vue.unref(tourSlots).indicators ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(tourSlots).indicators), {
          key: 0,
          current: vue.unref(current),
          total: vue.unref(total)
        }, null, 8, ["current", "total"])) : (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 1 }, vue.renderList(vue.unref(total), (item, index2) => {
          return vue.openBlock(), vue.createElementBlock("span", {
            key: item,
            class: vue.normalizeClass([vue.unref(ns).b("indicator"), vue.unref(ns).is("active", index2 === vue.unref(current))])
          }, null, 2);
        }), 128))], 2), vue.createElementVNode("div", { class: vue.normalizeClass(vue.unref(ns).b("buttons")) }, [vue.unref(current) > 0 ? (vue.openBlock(), vue.createBlock(vue.unref(index$2.ElButton), vue.mergeProps({
          key: 0,
          size: "small",
          type: vue.unref(mergedType)
        }, filterButtonProps(__props.prevButtonProps), { onClick: onPrev }), {
          default: vue.withCtx(() => {
            var _a;
            return [vue.createTextVNode(vue.toDisplayString(((_a = __props.prevButtonProps) == null ? void 0 : _a.children) ?? vue.unref(t)("el.tour.previous")), 1)];
          }),
          _: 1
        }, 16, ["type"])) : vue.createCommentVNode("v-if", true), vue.unref(current) <= vue.unref(total) - 1 ? (vue.openBlock(), vue.createBlock(vue.unref(index$2.ElButton), vue.mergeProps({
          key: 1,
          size: "small",
          type: vue.unref(mergedType) === "primary" ? "default" : "primary"
        }, filterButtonProps(__props.nextButtonProps), { onClick: onNext }), {
          default: vue.withCtx(() => {
            var _a;
            return [vue.createTextVNode(vue.toDisplayString(((_a = __props.nextButtonProps) == null ? void 0 : _a.children) ?? (vue.unref(current) === vue.unref(total) - 1 ? vue.unref(t)("el.tour.finish") : vue.unref(t)("el.tour.next"))), 1)];
          }),
          _: 1
        }, 16, ["type"])) : vue.createCommentVNode("v-if", true)], 2)], 2)
      ], 64);
    };
  }
});
exports.default = step_vue_vue_type_script_setup_true_lang_default;
