@qin-ui/antd-vue-pro 1.1.25 → 2.0.0

package/es/form/index.js

@@ -1,20 +1,639 @@
-import { B, d, C, b, f, F, e, h, U, _, i, u, j, k } from "./index-1cdda7ac.js";
-import "vue";
-import "ant-design-vue";
-import "../component-provider/index.js";
+import { Form, Input, Textarea, InputSearch, InputPassword, InputNumber, Select, Cascader, DatePicker, RangePicker, TimePicker, CheckboxGroup, RadioGroup, Switch, Slider, TreeSelect, Transfer, Row, Col, FormItem } from "ant-design-vue";
+import "ant-design-vue/es/table";
+import { useProviderDisabled, useInjectDisabled } from "ant-design-vue/es/config-provider/DisabledContext";
+import { colProps } from "ant-design-vue/es/grid/Col";
+import { formItemProps, useInjectFormItemContext } from "ant-design-vue/es/form";
+import { defineComponent, provide, inject, useSlots, watchEffect, createBlock, openBlock, unref, mergeProps, withCtx, createVNode, renderSlot, computed, toValue, normalizeProps, guardReactiveProps, resolveComponent, createElementBlock, Fragment, renderList, createSlots, ref, reactive, useAttrs, createCommentVNode, resolveDynamicComponent, isVNode, createTextVNode, toDisplayString } from "vue";
+import { I as INJECT_CONFIG, g as getObject } from "../component-provider/index-DtsWFG3s.js";
+import { i as isPlainObject, t as toPath, g as get, s as set, c as cloneDeep } from "../vendor/utils/lodash-es-Bu1KKNMo.js";
+const _sfc_main$6 = /* @__PURE__ */ defineComponent({
+  ...{ name: "ProForm", inheritAttrs: false },
+  __name: "index",
+  props: {
+    grid: { type: [Boolean, Object], default: false },
+    form: { default: () => ({}) }
+  },
+  setup(__props) {
+    const props = __props;
+    provide(FORM, props.form);
+    const { formData, fields, setFormRef } = props.form;
+    const config = INJECT_CONFIG["pro-form"];
+    const { grid: _injectGrid, ...injectAttrs } = inject(
+      config.injectionKey,
+      config.default
+    );
+    const slots = useSlots();
+    watchEffect(() => {
+      Object.keys(slots).forEach((name) => {
+        if (name === "default") return;
+        provide(`${TeleportComponentNamePrefix}${name}`, slots[name]);
+      });
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Form), mergeProps({
+        ref: (el) => {
+          var _a;
+          return (_a = unref(setFormRef)) == null ? void 0 : _a(el);
+        },
+        model: unref(formData)
+      }, mergeProps(injectAttrs, _ctx.$attrs)), {
+        default: withCtx(() => [
+          createVNode(unref(_sfc_main$3), {
+            fields: unref(fields),
+            grid: _ctx.grid
+          }, null, 8, ["fields", "grid"]),
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["model"]);
+    };
+  }
+});
+const FORM_ITEM_SLOT_KEYS = ["label", "extra", "help", "tooltip"];
+const COMPONENT_MAP = /* @__PURE__ */ new Map([
+  ["input", Input],
+  ["textarea", Textarea],
+  ["input-search", InputSearch],
+  ["input-password", InputPassword],
+  ["input-number", InputNumber],
+  ["select", Select],
+  ["cascader", Cascader],
+  ["date-picker", DatePicker],
+  ["range-picker", RangePicker],
+  ["time-picker", TimePicker],
+  ["checkbox-group", CheckboxGroup],
+  ["radio-group", RadioGroup],
+  ["switch", Switch],
+  ["slider", Slider],
+  ["tree-select", TreeSelect],
+  ["transfer", Transfer]
+]);
+const TeleportComponentNamePrefix = "TeleportComponent_";
+const FORM = Symbol("form");
+const PATH = Symbol("path");
+const _sfc_main$5 = /* @__PURE__ */ defineComponent({
+  __name: "index",
+  props: {
+    path: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const namePath = computed(() => {
+      return Array.isArray(props.path) ? props.path.join(".") : props.path;
+    });
+    provide(PATH, namePath);
+    return (_ctx, _cache) => {
+      return renderSlot(_ctx.$slots, "default", { path: namePath.value });
+    };
+  }
+});
+const _sfc_main$4 = /* @__PURE__ */ defineComponent({
+  __name: "index",
+  props: {
+    field: {}
+  },
+  setup(__props) {
+    const formItemPropKeys = Object.keys(formItemProps()).concat(["container"]);
+    const gridItemPropKeys = Object.keys(colProps());
+    const props = __props;
+    const config = INJECT_CONFIG["pro-form-item"];
+    const injectFormItemProps = inject(config.injectionKey, config.default);
+    const groupedAttributes = computed(() => {
+      let gridItemProps2 = {};
+      let formItemProps2 = {};
+      const componentProps = { slots: {} };
+      const formItemSlots = {};
+      if (isPlainObject(props.field)) {
+        const { path, name, fields, className, style, hidden, span, getFormItemRef, getComponentRef, getFormItemComputedProps, getComponentComputedProps, slots = {}, ...rest } = props.field;
+        const {
+          class: injectClassName,
+          style: injectStyle,
+          span: injectSpan,
+          xs,
+          sm,
+          md,
+          lg,
+          xl,
+          xxl,
+          ...injectRest
+        } = injectFormItemProps;
+        const initGridItemProps = span || span === 0 ? { span } : { xs, sm, md, lg, xl, xxl, span: injectSpan };
+        gridItemProps2 = fields ? { span: span ?? 24 } : initGridItemProps;
+        formItemProps2 = mergeProps(
+          injectRest,
+          { class: injectClassName, style: injectStyle },
+          { class: toValue(className), style: toValue(style) }
+        );
+        Object.keys(rest).forEach((k) => {
+          if (gridItemPropKeys.includes(k)) {
+            gridItemProps2[k] = rest[k];
+          } else if (formItemPropKeys.includes(k) || k.startsWith("data-form-item")) {
+            formItemProps2[k] = rest[k];
+          } else {
+            componentProps[k] = rest[k];
+          }
+        });
+        Object.keys(slots).forEach((k) => {
+          if (FORM_ITEM_SLOT_KEYS.includes(k)) {
+            formItemSlots[k] = slots[k];
+          } else {
+            componentProps["slots"][k] = slots[k];
+          }
+        });
+      }
+      return { gridItemProps: gridItemProps2, formItemProps: formItemProps2, componentProps, formItemSlots };
+    });
+    return (_ctx, _cache) => {
+      return renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(groupedAttributes.value)));
+    };
+  }
+});
+const _sfc_main$3 = /* @__PURE__ */ defineComponent({
+  ...{ name: "BaseFormItem", inheritAttrs: false },
+  __name: "index",
+  props: {
+    grid: { type: [Boolean, Object], default: void 0 },
+    fields: { default: () => [] },
+    disabled: { type: Boolean, default: void 0 }
+  },
+  setup(__props) {
+    const props = __props;
+    const validFields = computed(
+      () => {
+        var _a, _b;
+        return (_b = (_a = props.fields).filter) == null ? void 0 : _b.call(_a, (field) => !field.hidden);
+      }
+    );
+    useProviderDisabled(computed(() => props.disabled));
+    const config = INJECT_CONFIG["pro-form"];
+    const { grid: injectGrid } = inject(config.injectionKey, config.default);
+    const enableGrid = computed(() => {
+      if (props.grid !== void 0) return !!props.grid;
+      return !!injectGrid;
+    });
+    const computedGridProps = computed(() => {
+      return enableGrid.value ? { ...getObject(injectGrid), ...getObject(props.grid) } : {};
+    });
+    const formItemRefs = [];
+    const componentRefs = [];
+    const onFormItemMounted = (index, formItemProps2) => {
+      const field = validFields.value[index];
+      Object.assign(field, {
+        getFormItemRef: () => formItemRefs[index],
+        getFormItemComputedProps: () => formItemProps2
+      });
+    };
+    const onComponentMounted = (index) => {
+      const field = validFields.value[index];
+      Object.assign(field, {
+        getComponentRef: () => {
+          var _a;
+          return (_a = componentRefs[index]) == null ? void 0 : _a.getComponentRef();
+        },
+        getComponentComputedProps: () => {
+          var _a;
+          return (_a = componentRefs[index]) == null ? void 0 : _a.getComponentComputedProps();
+        }
+      });
+    };
+    return (_ctx, _cache) => {
+      const _component_BaseFormItem = resolveComponent("BaseFormItem");
+      return openBlock(), createBlock(unref(_sfc_main$1), mergeProps({
+        component: enableGrid.value ? unref(Row) : void 0
+      }, computedGridProps.value), {
+        default: withCtx(() => [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(validFields.value, ({ path: _path, name: _name, ...field }, index) => {
+            return openBlock(), createBlock(_sfc_main$5, mergeProps({
+              key: unref(toPath)(toValue(_name ?? _path)).join(".") || index
+            }, { ref_for: true }, { path: _name ?? _path }), {
+              default: withCtx(({ path }) => [
+                createVNode(_sfc_main$4, { field }, {
+                  default: withCtx(({
+                    gridItemProps,
+                    formItemProps: { container, ...formItemProps2 },
+                    componentProps,
+                    formItemSlots
+                  }) => [
+                    createVNode(unref(_sfc_main$1), mergeProps({
+                      component: enableGrid.value ? unref(Col) : void 0
+                    }, { ref_for: true }, gridItemProps), {
+                      default: withCtx(() => [
+                        createVNode(unref(_sfc_main$1), {
+                          component: container,
+                          path
+                        }, {
+                          default: withCtx(() => [
+                            createVNode(unref(FormItem), mergeProps({ ref_for: true }, formItemProps2, {
+                              ref_for: true,
+                              ref: (el) => formItemRefs[index] = el,
+                              name: unref(toPath)(path),
+                              path,
+                              onVnodeMounted: ($event) => onFormItemMounted(index, formItemProps2)
+                            }), createSlots({
+                              default: withCtx(() => [
+                                field.fields ? (openBlock(), createBlock(_component_BaseFormItem, {
+                                  key: 0,
+                                  grid: field.grid ?? _ctx.grid,
+                                  fields: field.fields,
+                                  disabled: field.disabled
+                                }, null, 8, ["grid", "fields", "disabled"])) : (openBlock(), createBlock(unref(_sfc_main$2), mergeProps({
+                                  key: 1,
+                                  ref_for: true,
+                                  ref: (el) => componentRefs[index] = el
+                                }, { ref_for: true }, componentProps, {
+                                  path,
+                                  onVnodeMounted: ($event) => onComponentMounted(index)
+                                }), null, 16, ["path", "onVnodeMounted"]))
+                              ]),
+                              _: 2
+                            }, [
+                              renderList(formItemSlots, (slot, name) => {
+                                return {
+                                  name,
+                                  fn: withCtx((scoped) => [
+                                    createVNode(unref(_sfc_main), mergeProps({
+                                      path,
+                                      component: slot
+                                    }, { ref_for: true }, scoped), null, 16, ["path", "component"])
+                                  ])
+                                };
+                              })
+                            ]), 1040, ["name", "path", "onVnodeMounted"])
+                          ]),
+                          _: 2
+                        }, 1032, ["component", "path"])
+                      ]),
+                      _: 2
+                    }, 1040, ["component"])
+                  ]),
+                  _: 2
+                }, 1032, ["field"])
+              ]),
+              _: 2
+            }, 1040);
+          }), 128))
+        ]),
+        _: 1
+      }, 16, ["component"]);
+    };
+  }
+});
+const useFields = (initFields) => {
+  const fields = ref([]);
+  fields.value = initFields || [];
+  const _map = /* @__PURE__ */ new Map();
+  const cacheMatch = (pathStr, updater) => {
+    var _a;
+    const fieldPath = _map.get(pathStr) || [];
+    if (fieldPath.length === 0) return false;
+    const fieldIndex = fieldPath[fieldPath.length - 1];
+    const parentField = fieldPath.length === 1 ? fields.value : get(fields.value, fieldPath.slice(0, -2));
+    const field = (_a = parentField == null ? void 0 : parentField.fields) == null ? void 0 : _a[fieldIndex];
+    const _path = toPath((field == null ? void 0 : field.name) ?? (field == null ? void 0 : field.path)).join(".");
+    if (_path === pathStr) {
+      updater({ field, fieldIndex, parentField });
+      return true;
+    }
+    return false;
+  };
+  const updaterMatch = (path, updater, options = {}) => {
+    if (!path) return;
+    const pathStr = typeof path === "function" ? "" : toPath(path).join(".");
+    const { all = typeof path === "function" } = options;
+    if (pathStr && _map.has(pathStr) && !all) {
+      const bool = cacheMatch(pathStr, updater);
+      if (bool) return;
+    }
+    const queue = fields.value.map((field, i) => ({
+      field,
+      fieldPath: [i],
+      parentField: { fields: fields.value }
+    }));
+    while (queue.length) {
+      const { field, fieldPath, parentField } = queue.shift();
+      let matched = false;
+      const _path = toPath(field.name ?? field.path).join(".");
+      if (_path) _map.set(_path, fieldPath);
+      if (typeof path === "function") {
+        matched = path(field);
+      } else if (_path) {
+        matched = pathStr === _path;
+      }
+      if (matched) {
+        const fieldIndex = fieldPath[fieldPath.length - 1];
+        updater({ field, fieldIndex, parentField });
+        if (!all) return;
+      }
+      if (Array.isArray(field.fields)) {
+        field.fields.forEach((f, i) => {
+          queue.push({
+            field: f,
+            fieldPath: [...fieldPath, "fields", i],
+            parentField: field
+          });
+        });
+      }
+    }
+  };
+  function getField(path, options) {
+    if (!path) return void 0;
+    const res = [];
+    updaterMatch(
+      path,
+      ({ field }) => {
+        res.push(field);
+      },
+      options
+    );
+    return (options == null ? void 0 : options.all) ? res : res[0];
+  }
+  function setField(path, field, options) {
+    if (!path || !field) return;
+    const { updateType = "merge", ...rest } = options || {};
+    updaterMatch(
+      path,
+      ({ field: preField, fieldIndex, parentField }) => {
+        let value = field;
+        if (typeof field === "function") {
+          value = field(preField);
+        }
+        if (!value) return;
+        if (updateType === "rewrite") {
+          parentField.fields[fieldIndex] = value;
+        } else {
+          Object.assign(preField, value);
+        }
+      },
+      rest
+    );
+  }
+  function deleteField(path, options) {
+    if (!path) return;
+    updaterMatch(
+      path,
+      ({ fieldIndex, parentField }) => {
+        parentField.fields.splice(fieldIndex, 1);
+      },
+      options
+    );
+  }
+  function addFields(path, newFields, options, placement) {
+    if (newFields.length === 0) return;
+    if (path) {
+      updaterMatch(
+        path,
+        ({ fieldIndex, parentField }) => {
+          const index = placement === "after" ? fieldIndex + 1 : fieldIndex;
+          parentField.fields.splice(index, 0, ...newFields);
+        },
+        options
+      );
+    } else if (placement === "after") {
+      fields.value.push(...newFields);
+    } else {
+      fields.value.unshift(...newFields);
+    }
+  }
+  function appendField(path, field, options) {
+    const newFields = Array.isArray(field) ? field : [field];
+    addFields(path, newFields, options, "after");
+  }
+  function prependField(path, field, options) {
+    const newFields = Array.isArray(field) ? field : [field];
+    addFields(path, newFields, options, "before");
+  }
+  function getParentField(path, options) {
+    if (!path) return void 0;
+    const res = [];
+    updaterMatch(
+      path,
+      ({ parentField }) => {
+        res.push(parentField);
+      },
+      options
+    );
+    return (options == null ? void 0 : options.all) ? res : res[0];
+  }
+  return {
+    fields,
+    getField,
+    setField,
+    deleteField,
+    appendField,
+    prependField,
+    getParentField
+  };
+};
+const useFormData = (initFormData = {}) => {
+  const formData = reactive(initFormData);
+  function getFormData(path) {
+    if (!path) return void 0;
+    return get(formData, path);
+  }
+  function setFormData(...args) {
+    let path;
+    let value;
+    if (args.length >= 2) {
+      [path, value] = args;
+      if (!path) return;
+    } else {
+      [value] = args;
+    }
+    if (path) {
+      if (typeof value === "function") {
+        const preValue = getFormData(path);
+        value = value(preValue);
+      }
+      set(formData, path, value);
+    } else {
+      if (typeof value === "function") {
+        const preValue = formData;
+        value = value(preValue);
+      }
+      if (!isPlainObject(value)) return;
+      Object.keys(formData).forEach((key) => {
+        delete formData[key];
+      });
+      Object.assign(formData, value);
+    }
+  }
+  return { formData, getFormData, setFormData };
+};
+const useFormRef = () => {
+  const formRef = ref();
+  const setFormRef = (inst) => {
+    formRef.value = inst;
+  };
+  return { formRef, setFormRef };
+};
+function useForm(...args) {
+  let initFormData = {}, initFields = [], root = true;
+  if (args.length === 1) {
+    root = args[0];
+  } else if (args.length >= 2) {
+    initFormData = args[0];
+    initFields = args[1];
+    root = args[2] ?? root;
+  }
+  if (!root) {
+    const injectForm = inject(FORM);
+    if (injectForm) return injectForm;
+  }
+  return {
+    ...useFormData(initFormData),
+    ...useFields(initFields),
+    ...useFormRef()
+  };
+}
+const initPropsMap = /* @__PURE__ */ new Map();
+const getInitProps = (field) => {
+  const { component, type = "" } = field;
+  if (COMPONENT_MAP.has(component)) {
+    const k = [component, type].filter(Boolean).join(".");
+    if (initPropsMap.has(k)) {
+      return initPropsMap.get(k);
+    } else if (INJECT_CONFIG[k]) {
+      const config = INJECT_CONFIG[k];
+      const injectProps = inject(config.injectionKey, config.default);
+      initPropsMap.set(k, injectProps);
+      return injectProps;
+    }
+  }
+  return {};
+};
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+  ...{ name: "BaseField", inheritAttrs: false },
+  __name: "index",
+  props: {
+    component: { default: void 0 },
+    path: { default: "" }
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const form = useForm(false);
+    const { formData, getFormData, setFormData } = form;
+    const componentRef = ref();
+    const formItemContext = useInjectFormItemContext();
+    const triggerFormItemChange = () => {
+      if (COMPONENT_MAP.has(props.component)) return;
+      formItemContext.onFieldChange();
+    };
+    const attrs = useAttrs();
+    const value = computed({
+      get() {
+        return getFormData == null ? void 0 : getFormData(props.path);
+      },
+      set(val) {
+        const { valueFormatter } = attrs;
+        if (valueFormatter && typeof valueFormatter === "function") {
+          const oldVal = cloneDeep(get(formData == null ? void 0 : formData.value, props.path));
+          setFormData == null ? void 0 : setFormData(props.path, valueFormatter(val, oldVal));
+        } else {
+          setFormData == null ? void 0 : setFormData(props.path, val);
+        }
+        triggerFormItemChange();
+      }
+    });
+    const parentDisabled = useInjectDisabled();
+    const groupedAttrs = computed(() => {
+      const initProps = getInitProps({
+        component: props.component,
+        type: attrs.type
+      });
+      const mergedProps = mergeProps(
+        initProps,
+        attrs,
+        { class: attrs.componentClassName, style: attrs.componentStyle },
+        { class: initProps.componentClassName, style: initProps.componentStyle },
+        { disabled: attrs.disabled ?? parentDisabled.value ?? initProps.disabled },
+        { modelName: attrs.modelName ?? initProps.modelName ?? "value" }
+      );
+      const { valueFormatter, modelName, slots, componentClassName, componentStyle, componentContainer, ...rest } = mergedProps;
+      return { attrs: rest, slots, componentContainer, modelName };
+    });
+    const teleportComponent = inject(
+      `${TeleportComponentNamePrefix}${props.path}`,
+      void 0
+    );
+    const is = computed(() => {
+      return teleportComponent ?? COMPONENT_MAP.get(props.component) ?? props.component;
+    });
+    __expose({
+      getComponentRef: () => componentRef.value,
+      getComponentComputedProps: () => groupedAttrs.value.attrs
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(_sfc_main$1), {
+        component: groupedAttrs.value.componentContainer,
+        path: _ctx.path
+      }, {
+        default: withCtx(() => [
+          is.value ? (openBlock(), createBlock(resolveDynamicComponent(is.value), mergeProps({ key: 0 }, groupedAttrs.value.attrs, {
+            ref_key: "componentRef",
+            ref: componentRef,
+            [`${groupedAttrs.value.modelName}`]: value.value,
+            [`onUpdate:${groupedAttrs.value.modelName}`]: _cache[0] || (_cache[0] = ($event) => value.value = $event),
+            path: _ctx.path
+          }), createSlots({ _: 2 }, [
+            renderList(groupedAttrs.value.slots, (slot, name) => {
+              return {
+                name,
+                fn: withCtx((scoped) => [
+                  createVNode(unref(_sfc_main), mergeProps({ path: _ctx.path }, scoped, { component: slot }), null, 16, ["path", "component"])
+                ])
+              };
+            })
+          ]), 1040, ["path"])) : createCommentVNode("", true)
+        ]),
+        _: 1
+      }, 8, ["component", "path"]);
+    };
+  }
+});
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  ...{ name: "ContainerFragment", inheritAttrs: false },
+  __name: "index",
+  props: {
+    component: {}
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return _ctx.component ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.component), normalizeProps(mergeProps({ key: 0 }, _ctx.$attrs)), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16)) : renderSlot(_ctx.$slots, "default", { key: 1 });
+    };
+  }
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{ name: "SlotComponent", inheritAttrs: false },
+  __name: "index",
+  props: {
+    component: { type: [Object, String, Number, Boolean, null, Function] }
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return isVNode(toValue(_ctx.component)) ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.component), normalizeProps(mergeProps({ key: 0 }, _ctx.$attrs)), null, 16)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+        createTextVNode(toDisplayString(_ctx.component), 1)
+      ], 64));
+    };
+  }
+});
 export {
-  B as BaseField,
-  d as BaseFormItem,
-  C as COMPONENT_MAP,
-  b as ContainerFragment,
-  f as FORM_DATA,
-  F as FORM_ITEM_SLOT_KEYS,
-  e as SlotComponent,
-  h as UPDATE_ACTIVE_PATH,
-  U as UPDATE_FORM_DATA,
-  _ as default,
-  i as useFields,
-  u as useForm,
-  j as useFormData,
-  k as useInitProps
+  _sfc_main$2 as BaseField,
+  _sfc_main$6 as BaseForm,
+  _sfc_main$3 as BaseFormItem,
+  COMPONENT_MAP,
+  _sfc_main$1 as ContainerFragment,
+  FORM,
+  FORM_ITEM_SLOT_KEYS,
+  PATH,
+  _sfc_main as SlotComponent,
+  TeleportComponentNamePrefix,
+  _sfc_main$6 as default,
+  useFields,
+  useForm,
+  useFormData
 };