@element-plus/nightly 0.0.20220305 → 0.0.20220306

package/lib/components/transfer/src/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../../packages/components/transfer/src/index.vue"],"sourcesContent":["<template>\n  <div :class=\"ns.b()\">\n    <transfer-panel\n      ref=\"leftPanel\"\n      :data=\"sourceData\"\n      :option-render=\"optionRender\"\n      :placeholder=\"panelFilterPlaceholder\"\n      :title=\"leftPanelTitle\"\n      :filterable=\"filterable\"\n      :format=\"format\"\n      :filter-method=\"filterMethod\"\n      :default-checked=\"leftDefaultChecked\"\n      :props=\"props\"\n      @checked-change=\"onSourceCheckedChange\"\n    >\n      <slot name=\"left-footer\"></slot>\n    </transfer-panel>\n    <div :class=\"ns.e('buttons')\">\n      <el-button\n        type=\"primary\"\n        :class=\"[ns.e('button'), ns.is('with-texts', hasButtonTexts)]\"\n        :disabled=\"rightChecked.length === 0\"\n        @click=\"addToLeft\"\n      >\n        <el-icon><arrow-left /></el-icon>\n        <span v-if=\"buttonTexts[0] !== undefined\">{{ buttonTexts[0] }}</span>\n      </el-button>\n      <el-button\n        type=\"primary\"\n        :class=\"[ns.e('button'), ns.is('with-texts', hasButtonTexts)]\"\n        :disabled=\"leftChecked.length === 0\"\n        @click=\"addToRight\"\n      >\n        <span v-if=\"buttonTexts[1] !== undefined\">{{ buttonTexts[1] }}</span>\n        <el-icon><arrow-right /></el-icon>\n      </el-button>\n    </div>\n    <transfer-panel\n      ref=\"rightPanel\"\n      :data=\"targetData\"\n      :option-render=\"optionRender\"\n      :placeholder=\"panelFilterPlaceholder\"\n      :filterable=\"filterable\"\n      :format=\"format\"\n      :filter-method=\"filterMethod\"\n      :title=\"rightPanelTitle\"\n      :default-checked=\"rightDefaultChecked\"\n      :props=\"props\"\n      @checked-change=\"onTargetCheckedChange\"\n    >\n      <slot name=\"right-footer\"></slot>\n    </transfer-panel>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  inject,\n  h,\n  reactive,\n  ref,\n  toRefs,\n  watch,\n} from 'vue'\nimport ElButton from '@element-plus/components/button'\nimport ElIcon from '@element-plus/components/icon'\nimport { elFormItemKey } from '@element-plus/tokens'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { ArrowLeft, ArrowRight } from '@element-plus/icons-vue'\nimport TransferPanel from './transfer-panel.vue'\nimport { useComputedData } from './useComputedData'\nimport {\n  useCheckedChange,\n  LEFT_CHECK_CHANGE_EVENT,\n  RIGHT_CHECK_CHANGE_EVENT,\n} from './useCheckedChange'\nimport { useMove } from './useMove'\nimport { CHANGE_EVENT } from './transfer'\n\nimport type { PropType, VNode } from 'vue'\nimport type { ElFormItemContext } from '@element-plus/tokens'\nimport type { DataItem, Format, Key, Props, TargetOrder } from './transfer'\n\ntype TransferType = InstanceType<typeof TransferPanel>\n\nexport default defineComponent({\n  name: 'ElTransfer',\n\n  components: {\n    TransferPanel,\n    ElButton,\n    ElIcon,\n    ArrowLeft,\n    ArrowRight,\n  },\n\n  props: {\n    data: {\n      type: Array as PropType<DataItem[]>,\n      default: () => [],\n    },\n    titles: {\n      type: Array as PropType<any> as PropType<[string, string]>,\n      default: () => [],\n    },\n    buttonTexts: {\n      type: Array as PropType<any> as PropType<[string, string]>,\n      default: () => [],\n    },\n    filterPlaceholder: {\n      type: String,\n      default: '',\n    },\n    filterMethod: Function as PropType<\n      (query: string, item: DataItem) => boolean\n    >,\n    leftDefaultChecked: {\n      type: Array as PropType<Key[]>,\n      default: () => [],\n    },\n    rightDefaultChecked: {\n      type: Array as PropType<Key[]>,\n      default: () => [],\n    },\n    renderContent: Function as PropType<(h, option) => VNode>,\n    modelValue: {\n      type: Array as PropType<Key[]>,\n      default: () => [],\n    },\n    format: {\n      type: Object as PropType<Format>,\n      default: () => ({}),\n    },\n    filterable: {\n      type: Boolean,\n      default: false,\n    },\n    props: {\n      type: Object as PropType<Props>,\n      default: () => ({\n        label: 'label',\n        key: 'key',\n        disabled: 'disabled',\n      }),\n    },\n    targetOrder: {\n      type: String as PropType<TargetOrder>,\n      default: 'original',\n      validator: (val: string) => {\n        return ['original', 'push', 'unshift'].includes(val)\n      },\n    },\n  },\n\n  emits: [\n    UPDATE_MODEL_EVENT,\n    CHANGE_EVENT,\n    LEFT_CHECK_CHANGE_EVENT,\n    RIGHT_CHECK_CHANGE_EVENT,\n  ],\n\n  setup(props, { emit, slots }) {\n    const { t } = useLocale()\n    const ns = useNamespace('transfer')\n    const elFormItem = inject(elFormItemKey, {} as ElFormItemContext)\n\n    const checkedState = reactive({\n      leftChecked: [],\n      rightChecked: [],\n    })\n\n    const { propsKey, sourceData, targetData } = useComputedData(props)\n\n    const { onSourceCheckedChange, onTargetCheckedChange } = useCheckedChange(\n      checkedState,\n      emit\n    )\n\n    const { addToLeft, addToRight } = useMove(\n      props,\n      checkedState,\n      propsKey,\n      emit\n    )\n\n    const leftPanel = ref<TransferType>()\n    const rightPanel = ref<TransferType>()\n\n    const clearQuery = (which: 'left' | 'right') => {\n      switch (which) {\n        case 'left':\n          leftPanel.value!.query = ''\n          break\n        case 'right':\n          rightPanel.value!.query = ''\n          break\n      }\n    }\n\n    const hasButtonTexts = computed(() => props.buttonTexts.length === 2)\n\n    const leftPanelTitle = computed(\n      () => props.titles[0] || t('el.transfer.titles.0')\n    )\n\n    const rightPanelTitle = computed(\n      () => props.titles[1] || t('el.transfer.titles.1')\n    )\n\n    const panelFilterPlaceholder = computed(\n      () => props.filterPlaceholder || t('el.transfer.filterPlaceholder')\n    )\n\n    watch(\n      () => props.modelValue,\n      () => {\n        elFormItem.validate?.('change')\n      }\n    )\n\n    const optionRender = computed(() => (option) => {\n      if (props.renderContent) return props.renderContent(h, option)\n\n      if (slots.default) return slots.default({ option })\n\n      return h('span', option[props.props.label] || option[props.props.key])\n    })\n\n    return {\n      ns,\n      sourceData,\n      targetData,\n      onSourceCheckedChange,\n      onTargetCheckedChange,\n      addToLeft,\n      addToRight,\n\n      ...toRefs(checkedState),\n\n      hasButtonTexts,\n      leftPanelTitle,\n      rightPanelTitle,\n      panelFilterPlaceholder,\n      clearQuery,\n      leftPanel,\n      rightPanel,\n\n      optionRender,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","TransferPanel","ElButton","ElIcon","ArrowLeft","ArrowRight","UPDATE_MODEL_EVENT","CHANGE_EVENT","LEFT_CHECK_CHANGE_EVENT","RIGHT_CHECK_CHANGE_EVENT","useLocale","useNamespace","inject","elFormItemKey","reactive","useComputedData","useCheckedChange","useMove","ref","computed"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../../packages/components/transfer/src/index.vue"],"sourcesContent":["<template>\n  <div :class=\"ns.b()\">\n    <transfer-panel\n      ref=\"leftPanel\"\n      :data=\"sourceData\"\n      :option-render=\"optionRender\"\n      :placeholder=\"panelFilterPlaceholder\"\n      :title=\"leftPanelTitle\"\n      :filterable=\"filterable\"\n      :format=\"format\"\n      :filter-method=\"filterMethod\"\n      :default-checked=\"leftDefaultChecked\"\n      :props=\"props\"\n      @checked-change=\"onSourceCheckedChange\"\n    >\n      <slot name=\"left-footer\"></slot>\n    </transfer-panel>\n    <div :class=\"ns.e('buttons')\">\n      <el-button\n        type=\"primary\"\n        :class=\"[ns.e('button'), ns.is('with-texts', hasButtonTexts)]\"\n        :disabled=\"rightChecked.length === 0\"\n        @click=\"addToLeft\"\n      >\n        <el-icon><arrow-left /></el-icon>\n        <span v-if=\"buttonTexts[0] !== undefined\">{{ buttonTexts[0] }}</span>\n      </el-button>\n      <el-button\n        type=\"primary\"\n        :class=\"[ns.e('button'), ns.is('with-texts', hasButtonTexts)]\"\n        :disabled=\"leftChecked.length === 0\"\n        @click=\"addToRight\"\n      >\n        <span v-if=\"buttonTexts[1] !== undefined\">{{ buttonTexts[1] }}</span>\n        <el-icon><arrow-right /></el-icon>\n      </el-button>\n    </div>\n    <transfer-panel\n      ref=\"rightPanel\"\n      :data=\"targetData\"\n      :option-render=\"optionRender\"\n      :placeholder=\"panelFilterPlaceholder\"\n      :filterable=\"filterable\"\n      :format=\"format\"\n      :filter-method=\"filterMethod\"\n      :title=\"rightPanelTitle\"\n      :default-checked=\"rightDefaultChecked\"\n      :props=\"props\"\n      @checked-change=\"onTargetCheckedChange\"\n    >\n      <slot name=\"right-footer\"></slot>\n    </transfer-panel>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  inject,\n  h,\n  reactive,\n  ref,\n  toRefs,\n  watch,\n} from 'vue'\nimport ElButton from '@element-plus/components/button'\nimport ElIcon from '@element-plus/components/icon'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { formItemContextKey } from '@element-plus/tokens'\nimport { ArrowLeft, ArrowRight } from '@element-plus/icons-vue'\nimport { debugWarn } from '@element-plus/utils'\nimport TransferPanel from './transfer-panel.vue'\nimport { useComputedData } from './useComputedData'\nimport {\n  useCheckedChange,\n  LEFT_CHECK_CHANGE_EVENT,\n  RIGHT_CHECK_CHANGE_EVENT,\n} from './useCheckedChange'\nimport { useMove } from './useMove'\nimport { CHANGE_EVENT } from './transfer'\n\nimport type { PropType, VNode } from 'vue'\nimport type { FormItemContext } from '@element-plus/tokens'\nimport type { DataItem, Format, Key, Props, TargetOrder } from './transfer'\n\ntype TransferType = InstanceType<typeof TransferPanel>\n\nexport default defineComponent({\n  name: 'ElTransfer',\n\n  components: {\n    TransferPanel,\n    ElButton,\n    ElIcon,\n    ArrowLeft,\n    ArrowRight,\n  },\n\n  props: {\n    data: {\n      type: Array as PropType<DataItem[]>,\n      default: () => [],\n    },\n    titles: {\n      type: Array as PropType<any> as PropType<[string, string]>,\n      default: () => [],\n    },\n    buttonTexts: {\n      type: Array as PropType<any> as PropType<[string, string]>,\n      default: () => [],\n    },\n    filterPlaceholder: {\n      type: String,\n      default: '',\n    },\n    filterMethod: Function as PropType<\n      (query: string, item: DataItem) => boolean\n    >,\n    leftDefaultChecked: {\n      type: Array as PropType<Key[]>,\n      default: () => [],\n    },\n    rightDefaultChecked: {\n      type: Array as PropType<Key[]>,\n      default: () => [],\n    },\n    renderContent: Function as PropType<(h, option) => VNode>,\n    modelValue: {\n      type: Array as PropType<Key[]>,\n      default: () => [],\n    },\n    format: {\n      type: Object as PropType<Format>,\n      default: () => ({}),\n    },\n    filterable: {\n      type: Boolean,\n      default: false,\n    },\n    props: {\n      type: Object as PropType<Props>,\n      default: () => ({\n        label: 'label',\n        key: 'key',\n        disabled: 'disabled',\n      }),\n    },\n    targetOrder: {\n      type: String as PropType<TargetOrder>,\n      default: 'original',\n      validator: (val: string) => {\n        return ['original', 'push', 'unshift'].includes(val)\n      },\n    },\n  },\n\n  emits: [\n    UPDATE_MODEL_EVENT,\n    CHANGE_EVENT,\n    LEFT_CHECK_CHANGE_EVENT,\n    RIGHT_CHECK_CHANGE_EVENT,\n  ],\n\n  setup(props, { emit, slots }) {\n    const { t } = useLocale()\n    const ns = useNamespace('transfer')\n    const elFormItem = inject(formItemContextKey, {} as FormItemContext)\n\n    const checkedState = reactive({\n      leftChecked: [],\n      rightChecked: [],\n    })\n\n    const { propsKey, sourceData, targetData } = useComputedData(props)\n\n    const { onSourceCheckedChange, onTargetCheckedChange } = useCheckedChange(\n      checkedState,\n      emit\n    )\n\n    const { addToLeft, addToRight } = useMove(\n      props,\n      checkedState,\n      propsKey,\n      emit\n    )\n\n    const leftPanel = ref<TransferType>()\n    const rightPanel = ref<TransferType>()\n\n    const clearQuery = (which: 'left' | 'right') => {\n      switch (which) {\n        case 'left':\n          leftPanel.value!.query = ''\n          break\n        case 'right':\n          rightPanel.value!.query = ''\n          break\n      }\n    }\n\n    const hasButtonTexts = computed(() => props.buttonTexts.length === 2)\n\n    const leftPanelTitle = computed(\n      () => props.titles[0] || t('el.transfer.titles.0')\n    )\n\n    const rightPanelTitle = computed(\n      () => props.titles[1] || t('el.transfer.titles.1')\n    )\n\n    const panelFilterPlaceholder = computed(\n      () => props.filterPlaceholder || t('el.transfer.filterPlaceholder')\n    )\n\n    watch(\n      () => props.modelValue,\n      () => {\n        elFormItem.validate?.('change').catch((err) => debugWarn(err))\n      }\n    )\n\n    const optionRender = computed(() => (option) => {\n      if (props.renderContent) return props.renderContent(h, option)\n\n      if (slots.default) return slots.default({ option })\n\n      return h('span', option[props.props.label] || option[props.props.key])\n    })\n\n    return {\n      ns,\n      sourceData,\n      targetData,\n      onSourceCheckedChange,\n      onTargetCheckedChange,\n      addToLeft,\n      addToRight,\n\n      ...toRefs(checkedState),\n\n      hasButtonTexts,\n      leftPanelTitle,\n      rightPanelTitle,\n      panelFilterPlaceholder,\n      clearQuery,\n      leftPanel,\n      rightPanel,\n\n      optionRender,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","TransferPanel","ElButton","ElIcon","ArrowLeft","ArrowRight","UPDATE_MODEL_EVENT","CHANGE_EVENT","LEFT_CHECK_CHANGE_EVENT","RIGHT_CHECK_CHANGE_EVENT","useLocale","useNamespace","inject","formItemContextKey","reactive","useComputedData","useCheckedChange","useMove","ref","computed"],"mappings":"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"}

package/lib/hooks/use-common-props/index.js

@@ -21,13 +21,13 @@ const useSize = (fallback, ignore = {}) => {
   const emptyRef = vue.ref(void 0);
   const size = ignore.prop ? emptyRef : index.useProp("size");
   const globalConfig = ignore.global ? emptyRef : index$1.useGlobalConfig("size");
-  const form$1 = ignore.form ? { size: void 0 } : vue.inject(form.elFormKey, void 0);
-  const formItem = ignore.formItem ? { size: void 0 } : vue.inject(form.elFormItemKey, void 0);
+  const form$1 = ignore.form ? { size: void 0 } : vue.inject(form.formContextKey, void 0);
+  const formItem = ignore.formItem ? { size: void 0 } : vue.inject(form.formItemContextKey, void 0);
   return vue.computed(() => size.value || vue.unref(fallback) || (formItem == null ? void 0 : formItem.size) || (form$1 == null ? void 0 : form$1.size) || globalConfig.value || "default");
 };
 const useDisabled = (fallback) => {
   const disabled = index.useProp("disabled");
-  const form$1 = vue.inject(form.elFormKey, void 0);
+  const form$1 = vue.inject(form.formContextKey, void 0);
   return vue.computed(() => disabled.value || vue.unref(fallback) || (form$1 == null ? void 0 : form$1.disabled) || false);
 };
 

package/lib/hooks/use-common-props/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../packages/hooks/use-common-props/index.ts"],"sourcesContent":["import { ref, unref, inject, computed } from 'vue'\nimport { elFormItemKey, elFormKey } from '@element-plus/tokens'\nimport { buildProp } from '@element-plus/utils'\nimport { componentSizes } from '@element-plus/constants'\nimport { useProp } from '../use-prop'\nimport { useGlobalConfig } from '../use-global-config'\nimport type { ComponentSize } from '@element-plus/constants'\nimport type { MaybeRef } from '@vueuse/core'\n\nexport const useSizeProp = buildProp({\n  type: String,\n  values: componentSizes,\n  required: false,\n} as const)\n\nexport const useSize = (\n  fallback?: MaybeRef<ComponentSize | undefined>,\n  ignore: Partial<Record<'prop' | 'form' | 'formItem' | 'global', boolean>> = {}\n) => {\n  const emptyRef = ref(undefined)\n\n  const size = ignore.prop ? emptyRef : useProp<ComponentSize>('size')\n  const globalConfig = ignore.global ? emptyRef : useGlobalConfig('size')\n  const form = ignore.form ? { size: undefined } : inject(elFormKey, undefined)\n  const formItem = ignore.formItem\n    ? { size: undefined }\n    : inject(elFormItemKey, undefined)\n\n  return computed(\n    (): ComponentSize =>\n      size.value ||\n      unref(fallback) ||\n      formItem?.size ||\n      form?.size ||\n      globalConfig.value ||\n      'default'\n  )\n}\n\nexport const useDisabled = (fallback?: MaybeRef<boolean | undefined>) => {\n  const disabled = useProp<boolean>('disabled')\n  const form = inject(elFormKey, undefined)\n  return computed(\n    () => disabled.value || unref(fallback) || form?.disabled || false\n  )\n}\n"],"names":["buildProp","componentSizes","ref","useProp","useGlobalConfig","form","inject","elFormKey","elFormItemKey","computed","unref"],"mappings":";;;;;;;;;;;;;;AAMY,MAAC,WAAW,GAAGA,eAAS,CAAC;AACrC,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,MAAM,EAAEC,mBAAc;AACxB,EAAE,QAAQ,EAAE,KAAK;AACjB,CAAC,EAAE;AACS,MAAC,OAAO,GAAG,CAAC,QAAQ,EAAE,MAAM,GAAG,EAAE,KAAK;AAClD,EAAE,MAAM,QAAQ,GAAGC,OAAG,CAAC,KAAK,CAAC,CAAC,CAAC;AAC/B,EAAE,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,GAAG,QAAQ,GAAGC,aAAO,CAAC,MAAM,CAAC,CAAC;AACxD,EAAE,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,GAAG,QAAQ,GAAGC,uBAAe,CAAC,MAAM,CAAC,CAAC;AAC1E,EAAE,MAAMC,MAAI,GAAG,MAAM,CAAC,IAAI,GAAG,EAAE,IAAI,EAAE,KAAK,CAAC,EAAE,GAAGC,UAAM,CAACC,cAAS,EAAE,KAAK,CAAC,CAAC,CAAC;AAC1E,EAAE,MAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,GAAG,EAAE,IAAI,EAAE,KAAK,CAAC,EAAE,GAAGD,UAAM,CAACE,kBAAa,EAAE,KAAK,CAAC,CAAC,CAAC;AACtF,EAAE,OAAOC,YAAQ,CAAC,MAAM,IAAI,CAAC,KAAK,IAAIC,SAAK,CAAC,QAAQ,CAAC,KAAK,QAAQ,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,KAAKL,MAAI,IAAI,IAAI,GAAG,KAAK,CAAC,GAAGA,MAAI,CAAC,IAAI,CAAC,IAAI,YAAY,CAAC,KAAK,IAAI,SAAS,CAAC,CAAC;AAChL,EAAE;AACU,MAAC,WAAW,GAAG,CAAC,QAAQ,KAAK;AACzC,EAAE,MAAM,QAAQ,GAAGF,aAAO,CAAC,UAAU,CAAC,CAAC;AACvC,EAAE,MAAME,MAAI,GAAGC,UAAM,CAACC,cAAS,EAAE,KAAK,CAAC,CAAC,CAAC;AACzC,EAAE,OAAOE,YAAQ,CAAC,MAAM,QAAQ,CAAC,KAAK,IAAIC,SAAK,CAAC,QAAQ,CAAC,KAAKL,MAAI,IAAI,IAAI,GAAG,KAAK,CAAC,GAAGA,MAAI,CAAC,QAAQ,CAAC,IAAI,KAAK,CAAC,CAAC;AAC/G;;;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../packages/hooks/use-common-props/index.ts"],"sourcesContent":["import { ref, unref, inject, computed } from 'vue'\nimport { formItemContextKey, formContextKey } from '@element-plus/tokens'\nimport { buildProp } from '@element-plus/utils'\nimport { componentSizes } from '@element-plus/constants'\nimport { useProp } from '../use-prop'\nimport { useGlobalConfig } from '../use-global-config'\nimport type { ComponentSize } from '@element-plus/constants'\nimport type { MaybeRef } from '@vueuse/core'\n\nexport const useSizeProp = buildProp({\n  type: String,\n  values: componentSizes,\n  required: false,\n} as const)\n\nexport const useSize = (\n  fallback?: MaybeRef<ComponentSize | undefined>,\n  ignore: Partial<Record<'prop' | 'form' | 'formItem' | 'global', boolean>> = {}\n) => {\n  const emptyRef = ref(undefined)\n\n  const size = ignore.prop ? emptyRef : useProp<ComponentSize>('size')\n  const globalConfig = ignore.global ? emptyRef : useGlobalConfig('size')\n  const form = ignore.form\n    ? { size: undefined }\n    : inject(formContextKey, undefined)\n  const formItem = ignore.formItem\n    ? { size: undefined }\n    : inject(formItemContextKey, undefined)\n\n  return computed(\n    (): ComponentSize =>\n      size.value ||\n      unref(fallback) ||\n      formItem?.size ||\n      form?.size ||\n      globalConfig.value ||\n      'default'\n  )\n}\n\nexport const useDisabled = (fallback?: MaybeRef<boolean | undefined>) => {\n  const disabled = useProp<boolean>('disabled')\n  const form = inject(formContextKey, undefined)\n  return computed(\n    () => disabled.value || unref(fallback) || form?.disabled || false\n  )\n}\n"],"names":["buildProp","componentSizes","ref","useProp","useGlobalConfig","form","inject","formContextKey","formItemContextKey","computed","unref"],"mappings":";;;;;;;;;;;;;;AAMY,MAAC,WAAW,GAAGA,eAAS,CAAC;AACrC,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,MAAM,EAAEC,mBAAc;AACxB,EAAE,QAAQ,EAAE,KAAK;AACjB,CAAC,EAAE;AACS,MAAC,OAAO,GAAG,CAAC,QAAQ,EAAE,MAAM,GAAG,EAAE,KAAK;AAClD,EAAE,MAAM,QAAQ,GAAGC,OAAG,CAAC,KAAK,CAAC,CAAC,CAAC;AAC/B,EAAE,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,GAAG,QAAQ,GAAGC,aAAO,CAAC,MAAM,CAAC,CAAC;AACxD,EAAE,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,GAAG,QAAQ,GAAGC,uBAAe,CAAC,MAAM,CAAC,CAAC;AAC1E,EAAE,MAAMC,MAAI,GAAG,MAAM,CAAC,IAAI,GAAG,EAAE,IAAI,EAAE,KAAK,CAAC,EAAE,GAAGC,UAAM,CAACC,mBAAc,EAAE,KAAK,CAAC,CAAC,CAAC;AAC/E,EAAE,MAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,GAAG,EAAE,IAAI,EAAE,KAAK,CAAC,EAAE,GAAGD,UAAM,CAACE,uBAAkB,EAAE,KAAK,CAAC,CAAC,CAAC;AAC3F,EAAE,OAAOC,YAAQ,CAAC,MAAM,IAAI,CAAC,KAAK,IAAIC,SAAK,CAAC,QAAQ,CAAC,KAAK,QAAQ,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,KAAKL,MAAI,IAAI,IAAI,GAAG,KAAK,CAAC,GAAGA,MAAI,CAAC,IAAI,CAAC,IAAI,YAAY,CAAC,KAAK,IAAI,SAAS,CAAC,CAAC;AAChL,EAAE;AACU,MAAC,WAAW,GAAG,CAAC,QAAQ,KAAK;AACzC,EAAE,MAAM,QAAQ,GAAGF,aAAO,CAAC,UAAU,CAAC,CAAC;AACvC,EAAE,MAAME,MAAI,GAAGC,UAAM,CAACC,mBAAc,EAAE,KAAK,CAAC,CAAC,CAAC;AAC9C,EAAE,OAAOE,YAAQ,CAAC,MAAM,QAAQ,CAAC,KAAK,IAAIC,SAAK,CAAC,QAAQ,CAAC,KAAKL,MAAI,IAAI,IAAI,GAAG,KAAK,CAAC,GAAGA,MAAI,CAAC,QAAQ,CAAC,IAAI,KAAK,CAAC,CAAC;AAC/G;;;;;;"}

package/lib/hooks/use-form-item/index.d.ts

@@ -1,4 +1,4 @@
 export declare const useFormItem: () => {
-    form: import("element-plus/es/tokens").ElFormContext | undefined;
-    formItem: import("element-plus/es/tokens").ElFormItemContext | undefined;
+    form: import("element-plus/es/tokens").FormContext | undefined;
+    formItem: import("element-plus/es/tokens").FormItemContext | undefined;
 };

package/lib/hooks/use-form-item/index.js

@@ -7,8 +7,8 @@ require('../../tokens/index.js');
 var form = require('../../tokens/form.js');
 
 const useFormItem = () => {
-  const form$1 = vue.inject(form.elFormKey, void 0);
-  const formItem = vue.inject(form.elFormItemKey, void 0);
+  const form$1 = vue.inject(form.formContextKey, void 0);
+  const formItem = vue.inject(form.formItemContextKey, void 0);
   return {
     form: form$1,
     formItem

package/lib/hooks/use-form-item/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../packages/hooks/use-form-item/index.ts"],"sourcesContent":["import { inject } from 'vue'\nimport { elFormKey, elFormItemKey } from '@element-plus/tokens'\n\nexport const useFormItem = () => {\n  const form = inject(elFormKey, undefined)\n  const formItem = inject(elFormItemKey, undefined)\n  return {\n    form,\n    formItem,\n  }\n}\n"],"names":["form","inject","elFormKey","elFormItemKey"],"mappings":";;;;;;;;AAEY,MAAC,WAAW,GAAG,MAAM;AACjC,EAAE,MAAMA,MAAI,GAAGC,UAAM,CAACC,cAAS,EAAE,KAAK,CAAC,CAAC,CAAC;AACzC,EAAE,MAAM,QAAQ,GAAGD,UAAM,CAACE,kBAAa,EAAE,KAAK,CAAC,CAAC,CAAC;AACjD,EAAE,OAAO;AACT,UAAIH,MAAI;AACR,IAAI,QAAQ;AACZ,GAAG,CAAC;AACJ;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../packages/hooks/use-form-item/index.ts"],"sourcesContent":["import { inject } from 'vue'\nimport { formContextKey, formItemContextKey } from '@element-plus/tokens'\n\nexport const useFormItem = () => {\n  const form = inject(formContextKey, undefined)\n  const formItem = inject(formItemContextKey, undefined)\n  return {\n    form,\n    formItem,\n  }\n}\n"],"names":["form","inject","formContextKey","formItemContextKey"],"mappings":";;;;;;;;AAEY,MAAC,WAAW,GAAG,MAAM;AACjC,EAAE,MAAMA,MAAI,GAAGC,UAAM,CAACC,mBAAc,EAAE,KAAK,CAAC,CAAC,CAAC;AAC9C,EAAE,MAAM,QAAQ,GAAGD,UAAM,CAACE,uBAAkB,EAAE,KAAK,CAAC,CAAC,CAAC;AACtD,EAAE,OAAO;AACT,UAAIH,MAAI;AACR,IAAI,QAAQ;AACZ,GAAG,CAAC;AACJ;;;;"}

package/lib/index.js

@@ -61,6 +61,8 @@ var tokens = require('./components/dropdown/src/tokens.js');
 var index$q = require('./components/dropdown/index.js');
 var empty = require('./components/empty/src/empty.js');
 var index$r = require('./components/empty/index.js');
+var form = require('./components/form/src/form.js');
+var formItem = require('./components/form/src/form-item.js');
 var index$s = require('./components/form/index.js');
 var icon = require('./components/icon/src/icon.js');
 var index$t = require('./components/icon/index.js');
@@ -203,7 +205,7 @@ var button$1 = require('./tokens/button.js');
 var collapse$1 = require('./tokens/collapse.js');
 var configProvider$1 = require('./tokens/config-provider.js');
 var dialog$1 = require('./tokens/dialog.js');
-var form = require('./tokens/form.js');
+var form$1 = require('./tokens/form.js');
 var pagination$1 = require('./tokens/pagination.js');
 var radio$1 = require('./tokens/radio.js');
 var scrollbar$1 = require('./tokens/scrollbar.js');
@@ -309,6 +311,10 @@ exports.ElDropdownItem = index$q.ElDropdownItem;
 exports.ElDropdownMenu = index$q.ElDropdownMenu;
 exports.emptyProps = empty.emptyProps;
 exports.ElEmpty = index$r.ElEmpty;
+exports.formEmits = form.formEmits;
+exports.formProps = form.formProps;
+exports.formItemProps = formItem.formItemProps;
+exports.formItemValidateStates = formItem.formItemValidateStates;
 exports.ElForm = index$s.ElForm;
 exports.ElFormItem = index$s.ElFormItem;
 exports.iconProps = icon.iconProps;
@@ -530,8 +536,8 @@ exports.buttonGroupContextKey = button$1.buttonGroupContextKey;
 exports.collapseContextKey = collapse$1.collapseContextKey;
 exports.configProviderContextKey = configProvider$1.configProviderContextKey;
 exports.dialogInjectionKey = dialog$1.dialogInjectionKey;
-exports.elFormItemKey = form.elFormItemKey;
-exports.elFormKey = form.elFormKey;
+exports.formContextKey = form$1.formContextKey;
+exports.formItemContextKey = form$1.formItemContextKey;
 exports.elPaginationKey = pagination$1.elPaginationKey;
 exports.radioGroupKey = radio$1.radioGroupKey;
 exports.scrollbarContextKey = scrollbar$1.scrollbarContextKey;

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../packages/element-plus/index.ts"],"sourcesContent":["import installer from './defaults'\nexport * from '@element-plus/components'\nexport * from '@element-plus/directives'\nexport * from '@element-plus/hooks'\nexport * from '@element-plus/tokens'\nexport { makeInstaller } from './make-installer'\n\nexport const install = installer.install\nexport const version = installer.version\nexport default installer\n"],"names":["installer"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMY,MAAC,OAAO,GAAGA,mBAAS,CAAC,QAAQ;AAC7B,MAAC,OAAO,GAAGA,mBAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":["../../../packages/element-plus/index.ts"],"sourcesContent":["import installer from './defaults'\nexport * from '@element-plus/components'\nexport * from '@element-plus/directives'\nexport * from '@element-plus/hooks'\nexport * from '@element-plus/tokens'\nexport { makeInstaller } from './make-installer'\n\nexport const install = installer.install\nexport const version = installer.version\nexport default installer\n"],"names":["installer"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMY,MAAC,OAAO,GAAGA,mBAAS,CAAC,QAAQ;AAC7B,MAAC,OAAO,GAAGA,mBAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/tokens/form.d.ts

@@ -1,42 +1,22 @@
-import type { InjectionKey } from 'vue';
-import type { ValidateFieldsError } from 'async-validator';
+import type { InjectionKey, SetupContext, UnwrapRef } from 'vue';
 import type { ComponentSize } from 'element-plus/es/constants';
-export interface ElFormContext {
-    registerLabelWidth(width: number, oldWidth: number): void;
-    deregisterLabelWidth(width: number): void;
-    autoLabelWidth: string | undefined;
-    emit: (evt: string, ...args: any[]) => void;
-    addField: (field: ElFormItemContext) => void;
-    removeField: (field: ElFormItemContext) => void;
-    resetFields: () => void;
-    clearValidate: (props: string | string[]) => void;
-    validateField: (props: string | string[], cb: ValidateFieldCallback) => void;
-    labelSuffix: string;
-    inline?: boolean;
-    inlineMessage?: boolean;
-    model?: Record<string, unknown>;
-    size?: ComponentSize;
-    showMessage?: boolean;
-    labelPosition?: string;
-    labelWidth?: string | number;
-    rules?: Record<string, unknown>;
-    statusIcon?: boolean;
-    hideRequiredAsterisk?: boolean;
-    disabled?: boolean;
-}
-export interface ValidateFieldCallback {
-    (isValid?: string, invalidFields?: ValidateFieldsError): void;
-}
-export interface ElFormItemContext {
-    prop?: string;
-    size?: ComponentSize;
+import type { FormProps, FormEmits, FormItemProps, FormValidateCallback, FormLabelWidthContext } from 'element-plus/es/components/form';
+import type { Arrayable } from 'element-plus/es/utils';
+export declare type FormContext = FormProps & UnwrapRef<FormLabelWidthContext> & {
+    emit: SetupContext<FormEmits>['emit'];
+    addField: (field: FormItemContext) => void;
+    removeField: (field: FormItemContext) => void;
+    resetFields: (props?: Arrayable<string>) => void;
+    clearValidate: (props?: Arrayable<string>) => void;
+    validateField: (props?: Arrayable<string>, callback?: FormValidateCallback) => Promise<void>;
+};
+export interface FormItemContext extends FormItemProps {
+    $el: HTMLDivElement | undefined;
+    size: ComponentSize;
     validateState: string;
-    $el: HTMLDivElement;
-    validate(trigger: string, callback?: ValidateFieldCallback): void;
-    updateComputedLabelWidth(width: number): void;
-    evaluateValidationEnabled(): void;
+    validate: (trigger: string, callback?: FormValidateCallback) => Promise<void>;
     resetField(): void;
     clearValidate(): void;
 }
-export declare const elFormKey: InjectionKey<ElFormContext>;
-export declare const elFormItemKey: InjectionKey<ElFormItemContext>;
+export declare const formContextKey: InjectionKey<FormContext>;
+export declare const formItemContextKey: InjectionKey<FormItemContext>;

package/lib/tokens/form.js

@@ -2,9 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const elFormKey = Symbol("elForm");
-const elFormItemKey = Symbol("elFormItem");
+const formContextKey = Symbol("formContextKey");
+const formItemContextKey = Symbol("formItemContextKey");
 
-exports.elFormItemKey = elFormItemKey;
-exports.elFormKey = elFormKey;
+exports.formContextKey = formContextKey;
+exports.formItemContextKey = formItemContextKey;
 //# sourceMappingURL=form.js.map

package/lib/tokens/form.js.map

@@ -1 +1 @@
-{"version":3,"file":"form.js","sources":["../../../../packages/tokens/form.ts"],"sourcesContent":["import type { InjectionKey } from 'vue'\nimport type { ValidateFieldsError } from 'async-validator'\nimport type { ComponentSize } from '@element-plus/constants'\n\nexport interface ElFormContext {\n  registerLabelWidth(width: number, oldWidth: number): void\n  deregisterLabelWidth(width: number): void\n  autoLabelWidth: string | undefined\n  emit: (evt: string, ...args: any[]) => void\n  addField: (field: ElFormItemContext) => void\n  removeField: (field: ElFormItemContext) => void\n  resetFields: () => void\n  clearValidate: (props: string | string[]) => void\n  validateField: (props: string | string[], cb: ValidateFieldCallback) => void\n  labelSuffix: string\n  inline?: boolean\n  inlineMessage?: boolean\n  model?: Record<string, unknown>\n  size?: ComponentSize\n  showMessage?: boolean\n  labelPosition?: string\n  labelWidth?: string | number\n  rules?: Record<string, unknown>\n  statusIcon?: boolean\n  hideRequiredAsterisk?: boolean\n  disabled?: boolean\n}\n\nexport interface ValidateFieldCallback {\n  (isValid?: string, invalidFields?: ValidateFieldsError): void\n}\n\nexport interface ElFormItemContext {\n  prop?: string\n  size?: ComponentSize\n  validateState: string\n  $el: HTMLDivElement\n  validate(trigger: string, callback?: ValidateFieldCallback): void\n  updateComputedLabelWidth(width: number): void\n  evaluateValidationEnabled(): void\n  resetField(): void\n  clearValidate(): void\n}\n\nexport const elFormKey: InjectionKey<ElFormContext> = Symbol('elForm')\nexport const elFormItemKey: InjectionKey<ElFormItemContext> =\n  Symbol('elFormItem')\n"],"names":[],"mappings":";;;;AAAY,MAAC,SAAS,GAAG,MAAM,CAAC,QAAQ,EAAE;AAC9B,MAAC,aAAa,GAAG,MAAM,CAAC,YAAY;;;;;"}
+{"version":3,"file":"form.js","sources":["../../../../packages/tokens/form.ts"],"sourcesContent":["import type { InjectionKey, SetupContext, UnwrapRef } from 'vue'\nimport type { ComponentSize } from '@element-plus/constants'\nimport type {\n  FormProps,\n  FormEmits,\n  FormItemProps,\n  FormValidateCallback,\n  FormLabelWidthContext,\n} from '@element-plus/components/form'\nimport type { Arrayable } from '@element-plus/utils'\n\nexport type FormContext = FormProps &\n  UnwrapRef<FormLabelWidthContext> & {\n    emit: SetupContext<FormEmits>['emit']\n\n    // expose\n    addField: (field: FormItemContext) => void\n    removeField: (field: FormItemContext) => void\n    resetFields: (props?: Arrayable<string>) => void\n    clearValidate: (props?: Arrayable<string>) => void\n    validateField: (\n      props?: Arrayable<string>,\n      callback?: FormValidateCallback\n    ) => Promise<void>\n  }\n\nexport interface FormItemContext extends FormItemProps {\n  $el: HTMLDivElement | undefined\n  size: ComponentSize\n  validateState: string\n  validate: (trigger: string, callback?: FormValidateCallback) => Promise<void>\n  resetField(): void\n  clearValidate(): void\n}\n\nexport const formContextKey: InjectionKey<FormContext> =\n  Symbol('formContextKey')\nexport const formItemContextKey: InjectionKey<FormItemContext> =\n  Symbol('formItemContextKey')\n"],"names":[],"mappings":";;;;AAAY,MAAC,cAAc,GAAG,MAAM,CAAC,gBAAgB,EAAE;AAC3C,MAAC,kBAAkB,GAAG,MAAM,CAAC,oBAAoB;;;;;"}

package/lib/tokens/index.js

@@ -21,8 +21,8 @@ exports.buttonGroupContextKey = button.buttonGroupContextKey;
 exports.collapseContextKey = collapse.collapseContextKey;
 exports.configProviderContextKey = configProvider.configProviderContextKey;
 exports.dialogInjectionKey = dialog.dialogInjectionKey;
-exports.elFormItemKey = form.elFormItemKey;
-exports.elFormKey = form.elFormKey;
+exports.formContextKey = form.formContextKey;
+exports.formItemContextKey = form.formItemContextKey;
 exports.elPaginationKey = pagination.elPaginationKey;
 exports.radioGroupKey = radio.radioGroupKey;
 exports.scrollbarContextKey = scrollbar.scrollbarContextKey;

package/lib/utils/error.d.ts

@@ -1,2 +1,3 @@
 export declare function throwError(scope: string, m: string): never;
+export declare function debugWarn(err: Error): void;
 export declare function debugWarn(scope: string, message: string): void;

package/lib/utils/error.js

@@ -2,6 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+require('./types.js');
+var shared = require('@vue/shared');
+
 class ElementPlusError extends Error {
   constructor(m) {
     super(m);
@@ -13,7 +16,8 @@ function throwError(scope, m) {
 }
 function debugWarn(scope, message) {
   if (process.env.NODE_ENV !== "production") {
-    console.warn(new ElementPlusError(`[${scope}] ${message}`));
+    const error = shared.isString(scope) ? new ElementPlusError(`[${scope}] ${message}`) : scope;
+    console.warn(error);
   }
 }
 

package/lib/utils/error.js.map

@@ -1 +1 @@
-{"version":3,"file":"error.js","sources":["../../../../packages/utils/error.ts"],"sourcesContent":["class ElementPlusError extends Error {\n  constructor(m: string) {\n    super(m)\n    this.name = 'ElementPlusError'\n  }\n}\n\nexport function throwError(scope: string, m: string): never {\n  throw new ElementPlusError(`[${scope}] ${m}`)\n}\n\nexport function debugWarn(scope: string, message: string): void {\n  if (process.env.NODE_ENV !== 'production') {\n    // eslint-disable-next-line no-console\n    console.warn(new ElementPlusError(`[${scope}] ${message}`))\n  }\n}\n"],"names":[],"mappings":";;;;AAAA,MAAM,gBAAgB,SAAS,KAAK,CAAC;AACrC,EAAE,WAAW,CAAC,CAAC,EAAE;AACjB,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;AACb,IAAI,IAAI,CAAC,IAAI,GAAG,kBAAkB,CAAC;AACnC,GAAG;AACH,CAAC;AACM,SAAS,UAAU,CAAC,KAAK,EAAE,CAAC,EAAE;AACrC,EAAE,MAAM,IAAI,gBAAgB,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;AAChD,CAAC;AACM,SAAS,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE;AAC1C,EAAE,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,EAAE;AAC7C,IAAI,OAAO,CAAC,IAAI,CAAC,IAAI,gBAAgB,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC;AAChE,GAAG;AACH;;;;;"}
+{"version":3,"file":"error.js","sources":["../../../../packages/utils/error.ts"],"sourcesContent":["import { isString } from './types'\n\nclass ElementPlusError extends Error {\n  constructor(m: string) {\n    super(m)\n    this.name = 'ElementPlusError'\n  }\n}\n\nexport function throwError(scope: string, m: string): never {\n  throw new ElementPlusError(`[${scope}] ${m}`)\n}\n\nexport function debugWarn(err: Error): void\nexport function debugWarn(scope: string, message: string): void\nexport function debugWarn(scope: string | Error, message?: string): void {\n  if (process.env.NODE_ENV !== 'production') {\n    const error: Error = isString(scope)\n      ? new ElementPlusError(`[${scope}] ${message}`)\n      : scope\n    // eslint-disable-next-line no-console\n    console.warn(error)\n  }\n}\n"],"names":["isString"],"mappings":";;;;;;;AACA,MAAM,gBAAgB,SAAS,KAAK,CAAC;AACrC,EAAE,WAAW,CAAC,CAAC,EAAE;AACjB,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;AACb,IAAI,IAAI,CAAC,IAAI,GAAG,kBAAkB,CAAC;AACnC,GAAG;AACH,CAAC;AACM,SAAS,UAAU,CAAC,KAAK,EAAE,CAAC,EAAE;AACrC,EAAE,MAAM,IAAI,gBAAgB,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;AAChD,CAAC;AACM,SAAS,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE;AAC1C,EAAE,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,EAAE;AAC7C,IAAI,MAAM,KAAK,GAAGA,eAAQ,CAAC,KAAK,CAAC,GAAG,IAAI,gBAAgB,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,EAAE,OAAO,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC;AAC1F,IAAI,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;AACxB,GAAG;AACH;;;;;"}

package/lib/utils/index.js

@@ -45,7 +45,7 @@ exports.debugWarn = error.debugWarn;
 exports.throwError = error.throwError;
 exports.isKorean = i18n.isKorean;
 exports.entriesOf = objects.entriesOf;
-exports.getPropByPath = objects.getPropByPath;
+exports.getProp = objects.getProp;
 exports.keysOf = objects.keysOf;
 exports.cAF = raf.cAF;
 exports.rAF = raf.rAF;

package/lib/utils/objects.d.ts

@@ -1,10 +1,8 @@
 import type { Entries } from 'type-fest';
+import type { Arrayable } from '.';
 export declare const keysOf: <T>(arr: T) => (keyof T)[];
 export declare const entriesOf: <T>(arr: T) => Entries<T>;
 export { hasOwn } from '@vue/shared';
-/** @deprecated TODO: improve it, use lodash */
-export declare function getPropByPath(obj: any, path: string, strict: boolean): {
-    o: any;
-    k: string;
-    v: any;
+export declare const getProp: <T = any>(obj: Record<string, any>, path: Arrayable<string>, defaultValue?: any) => {
+    value: T;
 };

package/lib/utils/objects.js

@@ -2,51 +2,27 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var lodashUnified = require('lodash-unified');
 var shared = require('@vue/shared');
-var error = require('./error.js');
 
-const SCOPE = "UtilV2/objects";
 const keysOf = (arr) => Object.keys(arr);
 const entriesOf = (arr) => Object.entries(arr);
-function getPropByPath(obj, path, strict) {
-  let tempObj = obj;
-  let key, value;
-  if (obj && shared.hasOwn(obj, path)) {
-    key = path;
-    value = tempObj == null ? void 0 : tempObj[path];
-  } else {
-    path = path.replace(/\[(\w+)\]/g, ".$1");
-    path = path.replace(/^\./, "");
-    const keyArr = path.split(".");
-    let i = 0;
-    for (i; i < keyArr.length - 1; i++) {
-      if (!tempObj && !strict)
-        break;
-      const key2 = keyArr[i];
-      if (key2 in tempObj) {
-        tempObj = tempObj[key2];
-      } else {
-        if (strict) {
-          error.throwError(SCOPE, "Please transfer a valid prop path to form item!");
-        }
-        break;
-      }
-    }
-    key = keyArr[i];
-    value = tempObj == null ? void 0 : tempObj[keyArr[i]];
-  }
+const getProp = (obj, path, defaultValue) => {
   return {
-    o: tempObj,
-    k: key,
-    v: value
+    get value() {
+      return lodashUnified.get(obj, path, defaultValue);
+    },
+    set value(val) {
+      lodashUnified.set(obj, path, val);
+    }
   };
-}
+};
 
 Object.defineProperty(exports, 'hasOwn', {
   enumerable: true,
   get: function () { return shared.hasOwn; }
 });
 exports.entriesOf = entriesOf;
-exports.getPropByPath = getPropByPath;
+exports.getProp = getProp;
 exports.keysOf = keysOf;
 //# sourceMappingURL=objects.js.map

package/lib/utils/objects.js.map

@@ -1 +1 @@
-{"version":3,"file":"objects.js","sources":["../../../../packages/utils/objects.ts"],"sourcesContent":["import { hasOwn } from '@vue/shared'\nimport { throwError } from './error'\nimport type { Entries } from 'type-fest'\n\nconst SCOPE = 'UtilV2/objects'\n\nexport const keysOf = <T>(arr: T) => Object.keys(arr) as Array<keyof T>\nexport const entriesOf = <T>(arr: T) => Object.entries(arr) as Entries<T>\nexport { hasOwn } from '@vue/shared'\n\n/** @deprecated TODO: improve it, use lodash */\nexport function getPropByPath(\n  obj: any,\n  path: string,\n  strict: boolean\n): {\n  o: any\n  k: string\n  v: any\n} {\n  let tempObj = obj\n  let key, value\n\n  if (obj && hasOwn(obj, path)) {\n    key = path\n    value = tempObj?.[path]\n  } else {\n    path = path.replace(/\\[(\\w+)\\]/g, '.$1')\n    path = path.replace(/^\\./, '')\n\n    const keyArr = path.split('.')\n    let i = 0\n    for (i; i < keyArr.length - 1; i++) {\n      if (!tempObj && !strict) break\n      const key = keyArr[i]\n\n      if (key in tempObj) {\n        tempObj = tempObj[key]\n      } else {\n        if (strict) {\n          throwError(SCOPE, 'Please transfer a valid prop path to form item!')\n        }\n        break\n      }\n    }\n    key = keyArr[i]\n    value = tempObj?.[keyArr[i]]\n  }\n  return {\n    o: tempObj,\n    k: key,\n    v: value,\n  }\n}\n"],"names":["hasOwn","throwError"],"mappings":";;;;;;;AAEA,MAAM,KAAK,GAAG,gBAAgB,CAAC;AACnB,MAAC,MAAM,GAAG,CAAC,GAAG,KAAK,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE;AACpC,MAAC,SAAS,GAAG,CAAC,GAAG,KAAK,MAAM,CAAC,OAAO,CAAC,GAAG,EAAE;AAE/C,SAAS,aAAa,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,EAAE;AACjD,EAAE,IAAI,OAAO,GAAG,GAAG,CAAC;AACpB,EAAE,IAAI,GAAG,EAAE,KAAK,CAAC;AACjB,EAAE,IAAI,GAAG,IAAIA,aAAM,CAAC,GAAG,EAAE,IAAI,CAAC,EAAE;AAChC,IAAI,GAAG,GAAG,IAAI,CAAC;AACf,IAAI,KAAK,GAAG,OAAO,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;AACrD,GAAG,MAAM;AACT,IAAI,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC,YAAY,EAAE,KAAK,CAAC,CAAC;AAC7C,IAAI,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;AACnC,IAAI,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;AACnC,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC;AACd,IAAI,KAAK,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE;AACxC,MAAM,IAAI,CAAC,OAAO,IAAI,CAAC,MAAM;AAC7B,QAAQ,MAAM;AACd,MAAM,MAAM,IAAI,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;AAC7B,MAAM,IAAI,IAAI,IAAI,OAAO,EAAE;AAC3B,QAAQ,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;AAChC,OAAO,MAAM;AACb,QAAQ,IAAI,MAAM,EAAE;AACpB,UAAUC,gBAAU,CAAC,KAAK,EAAE,iDAAiD,CAAC,CAAC;AAC/E,SAAS;AACT,QAAQ,MAAM;AACd,OAAO;AACP,KAAK;AACL,IAAI,GAAG,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;AACpB,IAAI,KAAK,GAAG,OAAO,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;AAC1D,GAAG;AACH,EAAE,OAAO;AACT,IAAI,CAAC,EAAE,OAAO;AACd,IAAI,CAAC,EAAE,GAAG;AACV,IAAI,CAAC,EAAE,KAAK;AACZ,GAAG,CAAC;AACJ;;;;;;;;;;"}
+{"version":3,"file":"objects.js","sources":["../../../../packages/utils/objects.ts"],"sourcesContent":["import { get, set } from 'lodash-unified'\nimport type { Entries } from 'type-fest'\nimport type { Arrayable } from '.'\n\nexport const keysOf = <T>(arr: T) => Object.keys(arr) as Array<keyof T>\nexport const entriesOf = <T>(arr: T) => Object.entries(arr) as Entries<T>\nexport { hasOwn } from '@vue/shared'\n\nexport const getProp = <T = any>(\n  obj: Record<string, any>,\n  path: Arrayable<string>,\n  defaultValue?: any\n): { value: T } => {\n  return {\n    get value() {\n      return get(obj, path, defaultValue)\n    },\n    set value(val: any) {\n      set(obj, path, val)\n    },\n  }\n}\n"],"names":["get","set"],"mappings":";;;;;;;AACY,MAAC,MAAM,GAAG,CAAC,GAAG,KAAK,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE;AACpC,MAAC,SAAS,GAAG,CAAC,GAAG,KAAK,MAAM,CAAC,OAAO,CAAC,GAAG,EAAE;AAE1C,MAAC,OAAO,GAAG,CAAC,GAAG,EAAE,IAAI,EAAE,YAAY,KAAK;AACpD,EAAE,OAAO;AACT,IAAI,IAAI,KAAK,GAAG;AAChB,MAAM,OAAOA,iBAAG,CAAC,GAAG,EAAE,IAAI,EAAE,YAAY,CAAC,CAAC;AAC1C,KAAK;AACL,IAAI,IAAI,KAAK,CAAC,GAAG,EAAE;AACnB,MAAMC,iBAAG,CAAC,GAAG,EAAE,IAAI,EAAE,GAAG,CAAC,CAAC;AAC1B,KAAK;AACL,GAAG,CAAC;AACJ;;;;;;;;;;"}

package/lib/version.d.ts

@@ -1 +1 @@
-export declare const version = "0.0.20220305";
+export declare const version = "0.0.20220306";

package/lib/version.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const version = "0.0.20220305";
+const version = "0.0.20220306";
 
 exports.version = version;
 //# sourceMappingURL=version.js.map

package/lib/version.js.map

@@ -1 +1 @@
-{"version":3,"file":"version.js","sources":["../../../packages/element-plus/version.ts"],"sourcesContent":["export const version = '0.0.20220305'\n"],"names":[],"mappings":";;;;AAAY,MAAC,OAAO,GAAG;;;;"}
+{"version":3,"file":"version.js","sources":["../../../packages/element-plus/version.ts"],"sourcesContent":["export const version = '0.0.20220306'\n"],"names":[],"mappings":";;;;AAAY,MAAC,OAAO,GAAG;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@element-plus/nightly",
-  "version": "0.0.20220305",
+  "version": "0.0.20220306",
   "description": "A Component Library for Vue 3",
   "homepage": "https://element-plus.org/",
   "keywords": [
@@ -77,5 +77,5 @@
     "not ie 11",
     "not op_mini all"
   ],
-  "gitHead": "13ffea11147727a0aa205c2cad57ab7722c07430"
+  "gitHead": "c72679e4e902955f31a16eca1c3f9fd2be8d1cf0"
 }

package/theme-chalk/el-dropdown.css

@@ -1 +1 @@
-.el-dropdown{--el-dropdown-menu-box-shadow:var(--el-box-shadow-light);--el-dropdown-menuItem-hover-fill:var(--el-color-primary-light-9);--el-dropdown-menuItem-hover-color:var(--el-color-primary-light-3);--el-dropdown-menu-index:10;display:inline-flex;position:relative;color:var(--el-text-color-regular);font-size:var(--el-font-size-base);line-height:1;vertical-align:top}.el-dropdown__popper{--el-dropdown-menu-box-shadow:var(--el-box-shadow-light);--el-dropdown-menuItem-hover-fill:var(--el-color-primary-light-9);--el-dropdown-menuItem-hover-color:var(--el-color-primary-light-3);--el-dropdown-menu-index:10}.el-dropdown__popper.el-popper[role=tooltip]{background:#fff;border:1px solid var(--el-border-color-light);box-shadow:var(--el-dropdown-menu-box-shadow)}.el-dropdown__popper.el-popper[role=tooltip] .el-popper__arrow::before{border:1px solid var(--el-border-color-light)}.el-dropdown__popper.el-popper[role=tooltip][data-popper-placement^=top] .el-popper__arrow::before{border-top-color:transparent;border-left-color:transparent}.el-dropdown__popper.el-popper[role=tooltip][data-popper-placement^=bottom] .el-popper__arrow::before{border-bottom-color:transparent;border-right-color:transparent}.el-dropdown__popper.el-popper[role=tooltip][data-popper-placement^=left] .el-popper__arrow::before{border-left-color:transparent;border-bottom-color:transparent}.el-dropdown__popper.el-popper[role=tooltip][data-popper-placement^=right] .el-popper__arrow::before{border-right-color:transparent;border-top-color:transparent}.el-dropdown__popper .el-dropdown-menu{border:none}.el-dropdown__popper .el-dropdown__popper-selfdefine{outline:0}.el-dropdown__popper .el-scrollbar__bar{z-index:calc(var(--el-dropdown-menu-index) + 1)}.el-dropdown__popper .el-dropdown__list{list-style:none;padding:0;margin:0;box-sizing:border-box}.el-dropdown .el-dropdown__caret-button{padding-left:0;padding-right:0;display:inline-flex;justify-content:center;align-items:center;width:32px;border-left:none}.el-dropdown .el-dropdown__caret-button>span{display:inline-flex}.el-dropdown .el-dropdown__caret-button::before{content:"";position:absolute;display:block;width:1px;top:5px;bottom:5px;left:0;background:rgba(0,0,0,.5)}.el-dropdown .el-dropdown__caret-button.el-button::before{background:var(--el-border-color-base);opacity:.5}.el-dropdown .el-dropdown__caret-button:hover::before{top:0;bottom:0}.el-dropdown .el-dropdown__caret-button .el-dropdown__icon{font-size:inherit;padding-left:0}.el-dropdown .el-dropdown-selfdefine{outline:0}.el-dropdown--large .el-dropdown__caret-button{width:40px}.el-dropdown--small .el-dropdown__caret-button{width:24px}.el-dropdown-menu{position:relative;top:0;left:0;z-index:var(--el-dropdown-menu-index);padding:5px 0;margin:0;background-color:#fff;border:none;border-radius:var(--el-border-radius-base);box-shadow:none;list-style:none}.el-dropdown-menu__item{display:flex;align-items:center;white-space:nowrap;list-style:none;line-height:22px;padding:5px 16px;margin:0;font-size:var(--el-font-size-base);color:var(--el-text-color-regular);cursor:pointer;outline:0}.el-dropdown-menu__item:not(.is-disabled):focus{background-color:var(--el-dropdown-menuItem-hover-fill);color:var(--el-dropdown-menuItem-hover-color)}.el-dropdown-menu__item i{margin-right:5px}.el-dropdown-menu__item--divided{margin:6px 0;border-top:1px solid var(--el-border-color-lighter)}.el-dropdown-menu__item.is-disabled{cursor:not-allowed;color:var(--el-text-color-disabled-base)}.el-dropdown-menu--large{padding:7px 0}.el-dropdown-menu--large .el-dropdown-menu__item{padding:7px 20px;line-height:22px;font-size:14px}.el-dropdown-menu--large .el-dropdown-menu__item--divided{margin:8px 0}.el-dropdown-menu--small{padding:3px 0}.el-dropdown-menu--small .el-dropdown-menu__item{padding:2px 12px;line-height:20px;font-size:12px}.el-dropdown-menu--small .el-dropdown-menu__item--divided{margin:4px 0}
+.el-dropdown{--el-dropdown-menu-box-shadow:var(--el-box-shadow-light);--el-dropdown-menuItem-hover-fill:var(--el-color-primary-light-9);--el-dropdown-menuItem-hover-color:var(--el-color-primary-light-3);--el-dropdown-menu-index:10;display:inline-flex;position:relative;color:var(--el-text-color-regular);font-size:var(--el-font-size-base);line-height:1;vertical-align:top}.el-dropdown.is-disabled{color:var(--el-text-color-placeholder);cursor:not-allowed}.el-dropdown__popper{--el-dropdown-menu-box-shadow:var(--el-box-shadow-light);--el-dropdown-menuItem-hover-fill:var(--el-color-primary-light-9);--el-dropdown-menuItem-hover-color:var(--el-color-primary-light-3);--el-dropdown-menu-index:10}.el-dropdown__popper.el-popper[role=tooltip]{background:#fff;border:1px solid var(--el-border-color-light);box-shadow:var(--el-dropdown-menu-box-shadow)}.el-dropdown__popper.el-popper[role=tooltip] .el-popper__arrow::before{border:1px solid var(--el-border-color-light)}.el-dropdown__popper.el-popper[role=tooltip][data-popper-placement^=top] .el-popper__arrow::before{border-top-color:transparent;border-left-color:transparent}.el-dropdown__popper.el-popper[role=tooltip][data-popper-placement^=bottom] .el-popper__arrow::before{border-bottom-color:transparent;border-right-color:transparent}.el-dropdown__popper.el-popper[role=tooltip][data-popper-placement^=left] .el-popper__arrow::before{border-left-color:transparent;border-bottom-color:transparent}.el-dropdown__popper.el-popper[role=tooltip][data-popper-placement^=right] .el-popper__arrow::before{border-right-color:transparent;border-top-color:transparent}.el-dropdown__popper .el-dropdown-menu{border:none}.el-dropdown__popper .el-dropdown__popper-selfdefine{outline:0}.el-dropdown__popper .el-scrollbar__bar{z-index:calc(var(--el-dropdown-menu-index) + 1)}.el-dropdown__popper .el-dropdown__list{list-style:none;padding:0;margin:0;box-sizing:border-box}.el-dropdown .el-dropdown__caret-button{padding-left:0;padding-right:0;display:inline-flex;justify-content:center;align-items:center;width:32px;border-left:none}.el-dropdown .el-dropdown__caret-button>span{display:inline-flex}.el-dropdown .el-dropdown__caret-button::before{content:"";position:absolute;display:block;width:1px;top:5px;bottom:5px;left:0;background:rgba(0,0,0,.5)}.el-dropdown .el-dropdown__caret-button.el-button::before{background:var(--el-border-color-base);opacity:.5}.el-dropdown .el-dropdown__caret-button:hover::before{top:0;bottom:0}.el-dropdown .el-dropdown__caret-button .el-dropdown__icon{font-size:inherit;padding-left:0}.el-dropdown .el-dropdown-selfdefine{outline:0}.el-dropdown--large .el-dropdown__caret-button{width:40px}.el-dropdown--small .el-dropdown__caret-button{width:24px}.el-dropdown-menu{position:relative;top:0;left:0;z-index:var(--el-dropdown-menu-index);padding:5px 0;margin:0;background-color:#fff;border:none;border-radius:var(--el-border-radius-base);box-shadow:none;list-style:none}.el-dropdown-menu__item{display:flex;align-items:center;white-space:nowrap;list-style:none;line-height:22px;padding:5px 16px;margin:0;font-size:var(--el-font-size-base);color:var(--el-text-color-regular);cursor:pointer;outline:0}.el-dropdown-menu__item:not(.is-disabled):focus{background-color:var(--el-dropdown-menuItem-hover-fill);color:var(--el-dropdown-menuItem-hover-color)}.el-dropdown-menu__item i{margin-right:5px}.el-dropdown-menu__item--divided{margin:6px 0;border-top:1px solid var(--el-border-color-lighter)}.el-dropdown-menu__item.is-disabled{cursor:not-allowed;color:var(--el-text-color-disabled-base)}.el-dropdown-menu--large{padding:7px 0}.el-dropdown-menu--large .el-dropdown-menu__item{padding:7px 20px;line-height:22px;font-size:14px}.el-dropdown-menu--large .el-dropdown-menu__item--divided{margin:8px 0}.el-dropdown-menu--small{padding:3px 0}.el-dropdown-menu--small .el-dropdown-menu__item{padding:2px 12px;line-height:20px;font-size:12px}.el-dropdown-menu--small .el-dropdown-menu__item--divided{margin:4px 0}