import { defineComponent, useModel, computed, resolveComponent, createBlock, openBlock, createSlots, withCtx, resolveDynamicComponent, mergeProps, renderList, createVNode, unref, mergeModels } from 'vue';
import VNodeRenderer from '../../common/VNodeRenderer.mjs';

var _sfc_main = /* @__PURE__ */ defineComponent({
  ...{
    name: "GmFormItemModule"
  },
  __name: "FormItemModule",
  props: /* @__PURE__ */ mergeModels({
    modelValue: { required: false },
    label: { type: String, required: false },
    field: { type: String, required: true },
    type: { type: String, required: true },
    options: { type: Array, required: false },
    children: { required: false },
    props: { type: Object, required: false }
  }, {
    "modelValue": { required: true },
    "modelModifiers": {}
  }),
  emits: /* @__PURE__ */ mergeModels(["change", "focus", "blur", "clear"], ["update:modelValue"]),
  setup(__props, { emit: __emit }) {
    const emit = __emit;
    const changeHandle = (val) => {
      emit("change", val, props.field);
    };
    const model = useModel(__props, "modelValue");
    const props = __props;
    const componentSlot = computed(() => {
      if (!props.children) return {};
      const keys = Object.keys(props.children);
      const slots = [];
      keys.forEach((key) => {
        if (!key.startsWith("label") && !key.startsWith("error")) {
          slots.push(key);
        }
      });
      return slots;
    });
    return (_ctx, _cache) => {
      const _component_gm_form_item = resolveComponent("gm-form-item");
      return openBlock(), createBlock(_component_gm_form_item, {
        label: props.label,
        prop: props.field
      }, createSlots({
        default: withCtx(() => [
          (openBlock(), createBlock(resolveDynamicComponent(props.type), mergeProps(props.props, {
            modelValue: model.value,
            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.value = $event),
            style: { "width": "100%" },
            clearable: "",
            onChange: changeHandle,
            onFocus: _cache[1] || (_cache[1] = ($event) => emit("focus", props.field)),
            onBlur: _cache[2] || (_cache[2] = ($event) => emit("blur", props.field)),
            onClear: _cache[3] || (_cache[3] = ($event) => emit("clear", props.field))
          }), createSlots({
            _: 2
            /* DYNAMIC */
          }, [
            renderList(componentSlot.value, (item) => {
              return {
                name: item,
                fn: withCtx(() => [
                  createVNode(unref(VNodeRenderer), {
                    vnode: props.children[item]()
                  }, null, 8, ["vnode"])
                ])
              };
            })
          ]), 1040, ["modelValue"]))
        ]),
        _: 2
        /* DYNAMIC */
      }, [
        props.children && props.children.label ? {
          name: "label",
          fn: withCtx(() => [
            createVNode(unref(VNodeRenderer), {
              vnode: props.children.label()
            }, null, 8, ["vnode"])
          ]),
          key: "0"
        } : void 0,
        props.children && props.children.error ? {
          name: "error",
          fn: withCtx(() => [
            createVNode(unref(VNodeRenderer), {
              vnode: props.children.error()
            }, null, 8, ["vnode"])
          ]),
          key: "1"
        } : void 0
      ]), 1032, ["label", "prop"]);
    };
  }
});

export { _sfc_main as default };
//# sourceMappingURL=FormItemModule.vue2.mjs.map
