"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
Object.defineProperty(exports, "CheckableTag", {
  enumerable: true,
  get: function () {
    return _CheckableTag.default;
  }
});
Object.defineProperty(exports, "CheckableTagGroup", {
  enumerable: true,
  get: function () {
    return _CheckableTagGroup.default;
  }
});
exports.tagProps = exports.default = void 0;
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _vue = require("vue");
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _classNames = _interopRequireDefault(require("../_util/classNames"));
var _vueTypes = _interopRequireDefault(require("../_util/vue-types"));
var _CloseOutlined = _interopRequireDefault(require("@ant-design/icons-vue/lib/icons/CloseOutlined"));
var _wave = _interopRequireDefault(require("../_util/wave"));
var _type = require("../_util/type");
var _CheckableTag = _interopRequireDefault(require("./CheckableTag"));
var _CheckableTagGroup = _interopRequireDefault(require("./CheckableTagGroup"));
var _useConfigInject = _interopRequireDefault(require("../config-provider/hooks/useConfigInject"));
var _warning = _interopRequireDefault(require("../_util/warning"));
var _style = _interopRequireDefault(require("./style"));
var _useColor = _interopRequireDefault(require("./hooks/useColor"));
const tagProps = () => ({
  prefixCls: String,
  color: {
    type: String
  },
  closable: {
    type: Boolean,
    default: false
  },
  closeIcon: _vueTypes.default.any,
  /** @deprecated `visible` will be removed in next major version. */
  visible: {
    type: Boolean,
    default: undefined
  },
  onClose: {
    type: Function
  },
  onClick: (0, _type.eventType)(),
  'onUpdate:visible': Function,
  icon: _vueTypes.default.any,
  /**
   * @deprecated Please use `variant="filled"` instead
   */
  bordered: {
    type: Boolean,
    default: true
  },
  disabled: Boolean,
  href: String,
  target: String,
  variant: String
});
exports.tagProps = tagProps;
const Tag = (0, _vue.defineComponent)({
  compatConfig: {
    MODE: 3
  },
  name: 'ATag',
  inheritAttrs: false,
  props: tagProps(),
  // emits: ['update:visible', 'close'],
  slots: Object,
  setup(props, {
    slots,
    emit,
    attrs
  }) {
    const {
      prefixCls,
      direction
    } = (0, _useConfigInject.default)('tag', props);
    const [wrapSSR, hashId] = (0, _style.default)(prefixCls);
    const visible = (0, _vue.shallowRef)(true);
    // Warning for deprecated usage
    if (process.env.NODE_ENV !== 'production') {
      (0, _warning.default)(props.visible === undefined, 'Tag', '`visible` is deprecated, please use `<Tag v-show="visible" />` instead.');
    }
    // ====================== Colors ======================
    const colors = (0, _useColor.default)(props);
    const isInternalColor = (0, _vue.computed)(() => colors.value.isPreset || colors.value.isStatus);
    (0, _vue.watchEffect)(() => {
      if (props.visible !== undefined) {
        visible.value = props.visible;
      }
    });
    const handleCloseClick = e => {
      if (props.disabled) {
        return;
      }
      e.stopPropagation();
      emit('update:visible', false);
      emit('close', e);
      if (e.defaultPrevented) {
        return;
      }
      if (props.visible === undefined) {
        visible.value = false;
      }
    };
    const tagClassName = (0, _vue.computed)(() => (0, _classNames.default)(prefixCls.value, hashId.value, `${prefixCls.value}-${colors.value.mergedVariant}`, {
      [`${prefixCls.value}-${colors.value.mergedColor}`]: isInternalColor.value,
      [`${prefixCls.value}-hidden`]: !visible.value,
      [`${prefixCls.value}-rtl`]: direction.value === 'rtl',
      [`${prefixCls.value}-disabled`]: props.disabled
    }));
    const handleClick = e => {
      emit('click', e);
    };
    return () => {
      var _a, _b, _c;
      const {
        icon = (_a = slots.icon) === null || _a === void 0 ? void 0 : _a.call(slots),
        closeIcon = (_b = slots.closeIcon) === null || _b === void 0 ? void 0 : _b.call(slots),
        closable = false,
        disabled,
        href,
        target
      } = props;
      const renderCloseIcon = () => {
        if (closable) {
          return closeIcon ? (0, _vue.createVNode)("span", {
            "class": `${prefixCls.value}-close-icon`,
            "onClick": handleCloseClick
          }, [closeIcon]) : (0, _vue.createVNode)(_CloseOutlined.default, {
            "class": `${prefixCls.value}-close-icon`,
            "onClick": handleCloseClick
          }, null);
        }
        return null;
      };
      let tagStyle = (0, _extends2.default)({}, attrs.style || {});
      if (!props.disabled) {
        tagStyle = (0, _extends2.default)((0, _extends2.default)({}, colors.value.customTagStyle), tagStyle);
      }
      const iconNode = icon || null;
      const children = (_c = slots.default) === null || _c === void 0 ? void 0 : _c.call(slots);
      const kids = iconNode ? (0, _vue.createVNode)(_vue.Fragment, null, [iconNode, (0, _vue.createVNode)("span", null, [children])]) : children;
      const isNeedWave = props.onClick !== undefined;
      const TagWrapper = href ? 'a' : 'span';
      const tagNode = (0, _vue.createVNode)(TagWrapper, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, attrs), {}, {
        "onClick": disabled ? undefined : handleClick,
        "href": disabled ? undefined : href,
        "target": target,
        "class": [tagClassName.value, attrs.class],
        "style": tagStyle
      }, href && disabled ? {
        'aria-disabled': true
      } : {}), {
        default: () => [kids, renderCloseIcon()]
      });
      return wrapSSR(isNeedWave ? (0, _vue.createVNode)(_wave.default, null, {
        default: () => [tagNode]
      }) : tagNode);
    };
  }
});
Tag.CheckableTag = _CheckableTag.default;
Tag.CheckableTagGroup = _CheckableTagGroup.default;
Tag.install = function (app) {
  app.component(Tag.name, Tag);
  app.component(_CheckableTag.default.name, _CheckableTag.default);
  app.component(_CheckableTagGroup.default.name, _CheckableTagGroup.default);
  return app;
};
var _default = exports.default = Tag;