element-plus/es/components/form/src/form.mjs.map

A Component Library for Vue 3

{"version":3,"file":"form.mjs","sources":["../../../../../../packages/components/form/src/form.vue"],"sourcesContent":["<template>\n  <form :class=\"formKls\">\n    <slot></slot>\n  </form>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  provide,\n  reactive,\n  ref,\n  toRefs,\n  watch,\n} from 'vue'\nimport { elFormKey } from '@element-plus/tokens'\nimport { debugWarn } from '@element-plus/utils'\nimport { useSize } from '@element-plus/hooks'\nimport type { ValidateFieldsError } from 'async-validator'\n\nimport type { PropType } from 'vue'\nimport type { ComponentSize } from '@element-plus/constants'\nimport type { FormRulesMap } from './form.type'\nimport type {\n  ElFormItemContext as FormItemCtx,\n  ValidateFieldCallback,\n} from '@element-plus/tokens'\n\nfunction useFormLabelWidth() {\n  const potentialLabelWidthArr = ref([])\n  const autoLabelWidth = computed(() => {\n    if (!potentialLabelWidthArr.value.length) return '0'\n    const max = Math.max(...potentialLabelWidthArr.value)\n    return max ? `${max}px` : ''\n  })\n\n  function getLabelWidthIndex(width: number) {\n    const index = potentialLabelWidthArr.value.indexOf(width)\n    if (index === -1) {\n      debugWarn('Form', `unexpected width ${width}`)\n    }\n    return index\n  }\n\n  function registerLabelWidth(val: number, oldVal: number) {\n    if (val && oldVal) {\n      const index = getLabelWidthIndex(oldVal)\n      potentialLabelWidthArr.value.splice(index, 1, val)\n    } else if (val) {\n      potentialLabelWidthArr.value.push(val)\n    }\n  }\n\n  function deregisterLabelWidth(val: number) {\n    const index = getLabelWidthIndex(val)\n    index > -1 && potentialLabelWidthArr.value.splice(index, 1)\n  }\n\n  return {\n    autoLabelWidth,\n    registerLabelWidth,\n    deregisterLabelWidth,\n  }\n}\n\nexport interface Callback {\n  (isValid?: boolean, invalidFields?: ValidateFieldsError): void\n}\n\nexport default defineComponent({\n  name: 'ElForm',\n  props: {\n    model: Object,\n    rules: Object as PropType<FormRulesMap>,\n    labelPosition: String,\n    labelWidth: {\n      type: [String, Number],\n      default: '',\n    },\n    labelSuffix: {\n      type: String,\n      default: '',\n    },\n    inline: Boolean,\n    inlineMessage: Boolean,\n    statusIcon: Boolean,\n    showMessage: {\n      type: Boolean,\n      default: true,\n    },\n    size: String as PropType<ComponentSize>,\n    disabled: Boolean,\n    validateOnRuleChange: {\n      type: Boolean,\n      default: true,\n    },\n    hideRequiredAsterisk: {\n      type: Boolean,\n      default: false,\n    },\n    scrollToError: Boolean,\n  },\n  emits: ['validate'],\n  setup(props, { emit }) {\n    const fields: FormItemCtx[] = []\n\n    watch(\n      () => props.rules,\n      () => {\n        fields.forEach((field) => {\n          field.evaluateValidationEnabled()\n        })\n\n        if (props.validateOnRuleChange) {\n          validate(() => ({}))\n        }\n      }\n    )\n\n    const formSize = useSize()\n    const prefix = 'el-form'\n    const formKls = computed(() => {\n      const { labelPosition, inline } = props\n      return [\n        prefix,\n        `${prefix}--${formSize.value}`,\n        labelPosition ? `${prefix}--label-${labelPosition}` : '',\n        inline ? `${prefix}--inline` : '',\n      ]\n    })\n\n    const addField = (field: FormItemCtx) => {\n      if (field) {\n        fields.push(field)\n      }\n    }\n\n    const removeField = (field: FormItemCtx) => {\n      if (field.prop) {\n        fields.splice(fields.indexOf(field), 1)\n      }\n    }\n\n    const resetFields = () => {\n      if (!props.model) {\n        debugWarn('Form', 'model is required for resetFields to work.')\n        return\n      }\n      fields.forEach((field) => {\n        field.resetField()\n      })\n    }\n\n    const clearValidate = (props: string | string[] = []) => {\n      const fds = props.length\n        ? typeof props === 'string'\n          ? fields.filter((field) => props === field.prop)\n          : fields.filter((field) => props.indexOf(field.prop) > -1)\n        : fields\n      fds.forEach((field) => {\n        field.clearValidate()\n      })\n    }\n\n    const validate = (callback?: Callback) => {\n      if (!props.model) {\n        debugWarn('Form', 'model is required for validate to work!')\n        return\n      }\n\n      let promise: Promise<boolean> | undefined\n      // if no callback, return promise\n      if (typeof callback !== 'function') {\n        promise = new Promise((resolve, reject) => {\n          callback = function (valid, invalidFields) {\n            if (valid) {\n              resolve(true)\n            } else {\n              reject(invalidFields)\n            }\n          }\n        })\n      }\n\n      if (fields.length === 0) {\n        callback(true)\n      }\n      let valid = true\n      let count = 0\n      let invalidFields = {}\n      let firstInvalidFields\n      for (const field of fields) {\n        field.validate('', (message, field) => {\n          if (message) {\n            valid = false\n            firstInvalidFields || (firstInvalidFields = field)\n          }\n          invalidFields = { ...invalidFields, ...field }\n          if (++count === fields.length) {\n            callback(valid, invalidFields)\n          }\n        })\n      }\n      if (!valid && props.scrollToError) {\n        scrollToField(Object.keys(firstInvalidFields)[0])\n      }\n      return promise\n    }\n\n    const validateField = (\n      props: string | string[],\n      cb: ValidateFieldCallback\n    ) => {\n      props = [].concat(props)\n      const fds = fields.filter((field) => props.indexOf(field.prop) !== -1)\n      if (!fields.length) {\n        debugWarn('Form', 'please pass correct props!')\n        return\n      }\n\n      fds.forEach((field) => {\n        field.validate('', cb)\n      })\n    }\n\n    const scrollToField = (prop: string) => {\n      fields.forEach((item) => {\n        if (item.prop === prop) {\n          item.$el.scrollIntoView?.()\n        }\n      })\n    }\n\n    const elForm = reactive({\n      ...toRefs(props),\n      resetFields,\n      clearValidate,\n      validateField,\n      emit,\n      addField,\n      removeField,\n      ...useFormLabelWidth(),\n    })\n\n    provide(elFormKey, elForm)\n\n    return {\n      formKls,\n      validate, // export\n      resetFields,\n      clearValidate,\n      validateField,\n      scrollToField,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":"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"}