"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const vue = require("vue");
const comp = require("../../ui/src/comp.js");
const util = require("./util.js");
require("../../ui/index.js");
const utils = require("../../ui/src/utils.js");
const render = require("./render.js");
const XEUtils = require("xe-utils");
const renderer = require("../../../../@vxe-ui/core/es/src/renderer.js");
const index_esm = require("../../../../@vxe-ui/core/es/index.esm.js");
const formItemProps = {
  title: String,
  field: String,
  span: {
    type: [String, Number],
    default: null
  },
  align: {
    type: String,
    default: null
  },
  verticalAlign: {
    type: String,
    default: null
  },
  titleBackground: {
    type: Boolean,
    default: null
  },
  titleBold: {
    type: Boolean,
    default: null
  },
  titleAlign: {
    type: String,
    default: null
  },
  titleWidth: {
    type: [String, Number],
    default: null
  },
  titleColon: {
    type: Boolean,
    default: null
  },
  titleAsterisk: {
    type: Boolean,
    default: null
  },
  showTitle: {
    type: Boolean,
    default: true
  },
  vertical: {
    type: Boolean,
    default: null
  },
  padding: {
    type: Boolean,
    default: null
  },
  formatter: [String, Function],
  className: [String, Function],
  contentClassName: [String, Function],
  contentStyle: [Object, Function],
  titleClassName: [String, Function],
  titleStyle: [Object, Function],
  titleOverflow: {
    type: [Boolean, String],
    default: null
  },
  titlePrefix: Object,
  titleSuffix: Object,
  resetValue: { default: null },
  visibleMethod: Function,
  visible: {
    type: Boolean,
    default: null
  },
  showContent: {
    type: Boolean,
    default: null
  },
  folding: Boolean,
  collapseNode: Boolean,
  itemRender: Object,
  rules: Array,
  params: Object
};
const VxeFormItemComponent = comp.defineVxeComponent({
  name: "VxeFormItem",
  props: formItemProps,
  setup(props, { slots }) {
    const xID = XEUtils.uniqueId();
    const refElem = vue.ref();
    const $xeForm = vue.inject("$xeForm", {});
    const $xeFormGroup = vue.inject("$xeFormGroup", null);
    const formItem = vue.reactive(util.createItem($xeForm, props));
    formItem.slots = slots;
    const formItemInfo = { itemConfig: formItem };
    vue.provide("xeFormItemInfo", formItemInfo);
    const renderItem = ($xeForm2, item) => {
      const formProps = $xeForm2.props;
      const $xeGrid = $xeForm2.xeGrid;
      const { data, readonly, disabled } = formProps;
      const { visible, field, itemRender, contentStyle, showContent } = item;
      const compConf = utils.isEnableConf(itemRender) ? renderer.renderer.get(itemRender.name) : null;
      const itemStyle = compConf ? compConf.formItemStyle || compConf.itemStyle : null;
      const itemContentStyle = compConf ? compConf.formItemContentStyle || compConf.itemContentStyle : null;
      const params = { data, disabled, readonly, field, property: field, item, $form: $xeForm2, $grid: $xeGrid };
      if (visible === false) {
        return index_esm.renderEmptyElement();
      }
      return vue.h("div", {
        ref: refElem,
        key: item.id,
        itemid: item.id,
        class: render.getItemClass($xeForm2, item),
        style: XEUtils.isFunction(itemStyle) ? itemStyle(params) : itemStyle
      }, [
        render.renderTitle($xeForm2, item),
        showContent === false ? index_esm.renderEmptyElement() : vue.h("div", {
          class: render.getItemContentClass($xeForm2, item),
          style: Object.assign({}, XEUtils.isFunction(itemContentStyle) ? itemContentStyle(params) : itemContentStyle, XEUtils.isFunction(contentStyle) ? contentStyle(params) : contentStyle)
        }, [
          render.renderItemContent($xeForm2, item),
          render.renderItemErrorIcon($xeForm2, item)
        ])
      ]);
    };
    const renderVN = () => {
      const customLayout = $xeForm ? $xeForm.props.customLayout : false;
      const item = formItem;
      return customLayout ? renderItem($xeForm, item) : vue.h("div", {
        ref: refElem
      });
    };
    const $xeFormItem = {
      xID,
      formItem,
      renderVN
    };
    util.watchItem(props, formItem);
    vue.onMounted(() => {
      const elem = refElem.value;
      util.assembleItem($xeForm, elem, formItem, $xeFormGroup);
    });
    vue.onUnmounted(() => {
      util.destroyItem($xeForm, formItem);
    });
    vue.provide("$xeFormItem", $xeFormItem);
    vue.provide("$xeFormGroup", null);
    return $xeFormItem;
  },
  render() {
    return this.renderVN();
  }
});
exports.default = VxeFormItemComponent;
exports.formItemProps = formItemProps;
