'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
var iconsVue = require('@ant-design/icons-vue');
require('../../../utils/index.cjs');
require('../../../locale/index.cjs');
var LocaleReceiver = require('../../locale-provider/src/LocaleReceiver.cjs');
var index = require('../../button/index.cjs');
var props = require('./props.cjs');
var _class = require('../../../utils/dom/class.cjs');
var en_US = require('../../../locale/lang/en_US.cjs');

var TourPanel = /* @__PURE__ */ vue.defineComponent({
  name: "ATourPanel",
  inheritAttrs: false,
  props: props.tourStepProps(),
  setup(props, {
    attrs,
    slots
  }) {
    const {
      current,
      total
    } = vue.toRefs(props);
    const isLastStep = vue.computed(() => current.value === total.value - 1);
    const prevBtnClick = (e) => {
      var _a;
      const prevButtonProps = props.prevButtonProps;
      (_a = props.onPrev) == null ? void 0 : _a.call(props, e);
      if (typeof (prevButtonProps == null ? void 0 : prevButtonProps.onClick) === "function")
        prevButtonProps == null ? void 0 : prevButtonProps.onClick();
    };
    const nextBtnClick = (e) => {
      var _a, _b;
      const nextButtonProps = props.nextButtonProps;
      if (isLastStep.value)
        (_a = props.onFinish) == null ? void 0 : _a.call(props, e);
      else
        (_b = props.onNext) == null ? void 0 : _b.call(props, e);
      if (typeof (nextButtonProps == null ? void 0 : nextButtonProps.onClick) === "function")
        nextButtonProps == null ? void 0 : nextButtonProps.onClick();
    };
    return () => {
      const {
        prefixCls,
        title,
        onClose,
        cover,
        description,
        type: stepType,
        arrow
      } = props;
      const prevButtonProps = props.prevButtonProps;
      const nextButtonProps = props.nextButtonProps;
      let headerNode;
      if (title) {
        headerNode = vue.createVNode("div", {
          "class": `${prefixCls}-header`
        }, [vue.createVNode("div", {
          "class": `${prefixCls}-title`
        }, [title])]);
      }
      let descriptionNode;
      if (description)
        descriptionNode = vue.createVNode("div", {
          "class": `${prefixCls}-description`
        }, [description]);
      let coverNode;
      if (cover)
        coverNode = vue.createVNode("div", {
          "class": `${prefixCls}-cover`
        }, [cover]);
      let mergeIndicatorNode;
      if (slots.indicatorsRender) {
        mergeIndicatorNode = slots.indicatorsRender({
          current: current.value,
          total
        });
      } else {
        mergeIndicatorNode = [...Array.from({
          length: total.value
        }).keys()].map((stepItem, index) => {
          return vue.createVNode("span", {
            "key": stepItem,
            "class": _class.classNames(index === current.value && `${prefixCls}-indicator-active`, `${prefixCls}-indicator`)
          }, null);
        });
      }
      const mainBtnType = stepType === "primary" ? "default" : "primary";
      const secondaryBtnProps = {
        type: "default",
        ghost: stepType === "primary"
      };
      return vue.createVNode(LocaleReceiver.default, {
        "componentName": "Tour",
        "defaultLocale": en_US.default.Tour
      }, {
        default: (contextLocale) => vue.createVNode("div", {
          ...attrs,
          "class": _class.classNames(stepType === "primary" ? `${prefixCls}-primary` : "", attrs.class, `${prefixCls}-content`)
        }, [arrow && vue.createVNode("div", {
          "class": `${prefixCls}-arrow`,
          "key": "arrow"
        }, null), vue.createVNode("div", {
          "class": `${prefixCls}-inner`
        }, [vue.createVNode(iconsVue.CloseOutlined, {
          "class": `${prefixCls}-close`,
          "onClick": onClose
        }, null), coverNode, headerNode, descriptionNode, vue.createVNode("div", {
          "class": `${prefixCls}-footer`
        }, [total.value > 1 && vue.createVNode("div", {
          "class": `${prefixCls}-indicators`
        }, [mergeIndicatorNode]), vue.createVNode("div", {
          "class": `${prefixCls}-buttons`
        }, [current.value !== 0 ? vue.createVNode(index.Button, {
          ...secondaryBtnProps,
          ...prevButtonProps,
          "onClick": prevBtnClick,
          "size": "small",
          "class": _class.classNames(`${prefixCls}-prev-btn`, prevButtonProps == null ? void 0 : prevButtonProps.className)
        }, {
          default: () => {
            var _a;
            return [(_a = prevButtonProps == null ? void 0 : prevButtonProps.children) != null ? _a : contextLocale.Previous];
          }
        }) : null, vue.createVNode(index.Button, {
          "type": mainBtnType,
          ...nextButtonProps,
          "onClick": nextBtnClick,
          "size": "small",
          "class": _class.classNames(`${prefixCls}-next-btn`, nextButtonProps == null ? void 0 : nextButtonProps.className)
        }, {
          default: () => {
            var _a;
            return [(_a = nextButtonProps == null ? void 0 : nextButtonProps.children) != null ? _a : isLastStep.value ? contextLocale.Finish : contextLocale.Next];
          }
        })])])])])
      });
    };
  }
});

exports.default = TourPanel;
//# sourceMappingURL=PanelRender.cjs.map
