element-ps 1.0.4 → 1.0.8

package/lib/packages/components/form/src/form-item.vue_vue&type=template&id=24eda48b&lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"form-item.vue_vue&type=template&id=24eda48b&lang.js","sources":["../../../../../../../packages/components/form/src/form-item.vue?vue&type=template&id=24eda48b&lang.js"],"sourcesContent":["<template>\n  <div ref=\"formItemRef\" class=\"el-form-item\" :class=\"formItemClass\">\n    <LabelWrap\n      :is-auto-width=\"labelStyle.width === 'auto'\"\n      :update-all=\"elForm.labelWidth === 'auto'\"\n    >\n      <label\n        v-if=\"label || $slots.label\"\n        :for=\"labelFor\"\n        class=\"el-form-item__label\"\n        :style=\"labelStyle\"\n        :widget=\"widget\"\n      >\n        <slot name=\"label\" :label=\"label + elForm.labelSuffix\">\n          {{ label + elForm.labelSuffix }}\n        </slot>\n      </label>\n    </LabelWrap>\n    <div class=\"el-form-item__content\" :style=\"contentStyle\" :widget=\"widget\">\n      <slot></slot>\n      <transition name=\"el-zoom-in-top\">\n        <slot v-if=\"shouldShowError\" name=\"error\" :error=\"validateMessage\">\n          <div\n            class=\"el-form-item__error\"\n            :class=\"{\n              'el-form-item__error--inline':\n                typeof inlineMessage === 'boolean'\n                  ? inlineMessage\n                  : elForm.inlineMessage || false,\n            }\"\n          >\n            {{ validateMessage }}\n          </div>\n        </slot>\n      </transition>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  getCurrentInstance,\n  inject,\n  onBeforeUnmount,\n  onMounted,\n  provide,\n  reactive,\n  ref,\n  toRefs,\n} from 'vue'\nimport { addUnit, getPropByPath, useGlobalConfig } from '@element-ps/utils/util'\nimport { isValidComponentSize } from '@element-ps/utils/validators'\nimport { elFormItemKey, elFormKey } from '@element-ps/tokens'\nimport LabelWrap from './label-wrap'\n\nimport type { PropType, CSSProperties } from 'vue'\nimport type { ComponentSize } from '@element-ps/utils/types'\nimport type { ElFormContext } from '@element-ps/tokens'\nimport type { FormItemRule } from './form.type'\n\nexport default defineComponent({\n  name: 'PsFormItem',\n  componentName: 'PsFormItem',\n  components: {\n    LabelWrap,\n  },\n  props: {\n    label: String,\n    labelWidth: {\n      type: [String, Number],\n      default: '',\n    },\n    prop: String,\n    required: {\n      type: Boolean,\n      default: undefined,\n    },\n    rules: [Object, Array] as PropType<FormItemRule | FormItemRule[]>,\n    error: String,\n    validateStatus: String,\n    for: String,\n    inlineMessage: {\n      type: [String, Boolean],\n      default: '',\n    },\n    showMessage: {\n      type: Boolean,\n      default: true,\n    },\n    size: {\n      type: String as PropType<ComponentSize>,\n      validator: isValidComponentSize,\n    },\n    widget: {\n      type: String,\n    },\n  },\n  setup(props, { slots }) {\n    const $ELEMENT = useGlobalConfig()\n\n    const elForm = inject(elFormKey, {} as ElFormContext)\n    const validateState = ref('')\n    const validateMessage = ref('')\n\n    const computedLabelWidth = ref('')\n\n    const formItemRef = ref<HTMLDivElement>()\n\n    const vm = getCurrentInstance()\n    const isNested = computed(() => {\n      let parent = vm.parent\n      while (parent && parent.type.name !== 'PsForm') {\n        if (parent.type.name === 'PsFormItem') {\n          return true\n        }\n        parent = parent.parent\n      }\n      return false\n    })\n\n    let initialValue = undefined\n\n    const labelFor = computed(() => props.for || props.prop)\n    const labelStyle = computed(() => {\n      const ret: CSSProperties = {}\n      if (elForm.labelPosition === 'top') return ret\n      const labelWidth = addUnit(props.labelWidth || elForm.labelWidth)\n      if (labelWidth) {\n        ret.width = labelWidth\n      }\n      return ret\n    })\n    const contentStyle = computed(() => {\n      const ret: CSSProperties = {}\n      if (elForm.labelPosition === 'top' || elForm.inline) {\n        return ret\n      }\n      if (!props.label && !props.labelWidth && isNested.value) {\n        return ret\n      }\n      const labelWidth = addUnit(props.labelWidth || elForm.labelWidth)\n      if (!props.label && !slots.label) {\n        ret.marginLeft = labelWidth\n      }\n      return ret\n    })\n    const fieldValue = computed(() => {\n      const model = elForm.model\n      if (!model || !props.prop) {\n        return\n      }\n\n      let path = props.prop\n      if (path.indexOf(':') !== -1) {\n        path = path.replace(/:/, '.')\n      }\n\n      return getPropByPath(model, path, true).v\n    })\n    const isRequired = computed(() => {\n      const rules = getRules()\n      let required = false\n\n      if (rules && rules.length) {\n        rules.every((rule) => {\n          if (rule.required) {\n            required = true\n            return false\n          }\n          return true\n        })\n      }\n      return required\n    })\n    const elFormItemSize = computed(() => props.size || elForm.size)\n    const sizeClass = computed<ComponentSize>(() => {\n      return elFormItemSize.value || $ELEMENT.size\n    })\n\n    const getRules = () => {\n      const formRules = elForm.rules\n      const selfRules = props.rules\n      const requiredRule =\n        props.required !== undefined ? { required: !!props.required } : []\n\n      const prop = getPropByPath(formRules, props.prop || '', false)\n      const normalizedRule = formRules ? prop.o[props.prop || ''] || prop.v : []\n\n      return [].concat(selfRules || normalizedRule || []).concat(requiredRule)\n    }\n\n    const updateComputedLabelWidth = (width: string | number) => {\n      computedLabelWidth.value = width ? `${width}px` : ''\n    }\n\n    const elFormItem = reactive({\n      ...toRefs(props),\n      size: sizeClass,\n      $el: formItemRef,\n      updateComputedLabelWidth,\n    })\n\n    onMounted(() => {\n      if (props.prop) {\n        elForm?.addField(elFormItem)\n\n        const value = fieldValue.value\n        initialValue = Array.isArray(value) ? [...value] : value\n      }\n    })\n    onBeforeUnmount(() => {\n      elForm?.removeField(elFormItem)\n    })\n\n    provide(elFormItemKey, elFormItem)\n\n    const formItemClass = computed(() => [\n      {\n        'el-form-item--feedback': elForm.statusIcon,\n        'is-error': validateState.value === 'error',\n        'is-validating': validateState.value === 'validating',\n        'is-success': validateState.value === 'success',\n        'is-required': isRequired.value || props.required,\n        'is-no-asterisk': elForm.hideRequiredAsterisk,\n      },\n      sizeClass.value ? `el-form-item--${sizeClass.value}` : '',\n    ])\n\n    const shouldShowError = computed(() => {\n      return (\n        validateState.value === 'error' &&\n        props.showMessage &&\n        elForm.showMessage\n      )\n    })\n\n    return {\n      formItemRef,\n      formItemClass,\n      shouldShowError,\n      elForm,\n      labelStyle,\n      contentStyle,\n      validateMessage,\n      labelFor,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_createVNode","_renderSlot","_createElementVNode"],"mappings":";;;;;;;;;;0BACEA;IAAK,KAAI;AAAA,IAAc,2BAAM,gBAAuB;;IAClDC;MACG,iBAAe,gBAAW;MAC1B,cAAY,YAAO;;2BAEpB;QACQ,cAAS,YAAO,0BADxBD;;UAEG,KAAK;UACN,OAAM;AAAA,UACL,0BAAO;UACP,QAAQ;;UAETE;YAAoB,OAAO,aAAQ,YAAO;AAAA,aAA1C;oDACK,aAAQ,YAAO;;;;;;IAIxBC;MAAK,OAAM;AAAA,MAAyB,0BAAO;MAAe,QAAQ;;MAChED;MACAD,kCAAY,MAAK;6BACf;UAAY,uBAAZC;;YAA2C,OAAO;aAAlD;YACEC;cACE,2BAAM;;;mCAQH;;;;;;;;;;;"}
+{"version":3,"file":"form-item.vue_vue&type=template&id=24eda48b&lang.js","sources":["../../../../../../../packages/components/form/src/form-item.vue?vue&type=template&id=24eda48b&lang.js"],"sourcesContent":["<template>\n  <div ref=\"formItemRef\" class=\"el-form-item\" :class=\"formItemClass\">\n    <LabelWrap\n      :is-auto-width=\"labelStyle.width === 'auto'\"\n      :update-all=\"elForm.labelWidth === 'auto'\"\n    >\n      <label\n        v-if=\"label || $slots.label\"\n        :for=\"labelFor\"\n        class=\"el-form-item__label\"\n        :style=\"labelStyle\"\n        :widget=\"widget\"\n      >\n        <slot name=\"label\" :label=\"label + elForm.labelSuffix\">\n          {{ label + elForm.labelSuffix }}\n        </slot>\n      </label>\n    </LabelWrap>\n    <div class=\"el-form-item__content\" :style=\"contentStyle\" :widget=\"widget\">\n      <slot></slot>\n      <transition name=\"el-zoom-in-top\">\n        <slot v-if=\"shouldShowError\" name=\"error\" :error=\"validateMessage\">\n          <div\n            class=\"el-form-item__error\"\n            :class=\"{\n              'el-form-item__error--inline':\n                typeof inlineMessage === 'boolean'\n                  ? inlineMessage\n                  : elForm.inlineMessage || false,\n            }\"\n          >\n            {{ validateMessage }}\n          </div>\n        </slot>\n      </transition>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  getCurrentInstance,\n  inject,\n  onBeforeUnmount,\n  onMounted,\n  provide,\n  reactive,\n  ref,\n  toRefs,\n} from 'vue'\nimport { addUnit, getPropByPath, useGlobalConfig } from '@element-ps/utils/util'\nimport { isValidComponentSize } from '@element-ps/utils/validators'\nimport { elFormItemKey, elFormKey } from '@element-ps/tokens'\nimport LabelWrap from './label-wrap'\n\nimport type { PropType, CSSProperties } from 'vue'\nimport type { ComponentSize } from '@element-ps/utils/types'\nimport type { ElFormContext } from '@element-ps/tokens'\nimport type { FormItemRule } from './form.type'\n\nexport default defineComponent({\n  name: 'PsFormItem',\n  componentName: 'PsFormItem',\n  components: {\n    LabelWrap,\n  },\n  props: {\n    label: String,\n    labelWidth: {\n      type: [String, Number],\n      default: '',\n    },\n    prop: String,\n    required: {\n      type: Boolean,\n      default: undefined,\n    },\n    rules: [Object, Array] as PropType<FormItemRule | FormItemRule[]>,\n    error: String,\n    validateStatus: String,\n    for: String,\n    inlineMessage: {\n      type: [String, Boolean],\n      default: '',\n    },\n    showMessage: {\n      type: Boolean,\n      default: true,\n    },\n    size: {\n      type: String as PropType<ComponentSize>,\n      validator: isValidComponentSize,\n    },\n    widget: {\n      type: String,\n    },\n  },\n  setup(props, { slots }) {\n    const $ELEMENT = useGlobalConfig()\n\n    const elForm = inject(elFormKey, {} as ElFormContext)\n    const validateState = ref('')\n    const validateMessage = ref('')\n\n    const computedLabelWidth = ref('')\n\n    const formItemRef = ref<HTMLDivElement>()\n\n    const vm = getCurrentInstance()\n    const isNested = computed(() => {\n      let parent = vm.parent\n      while (parent && parent.type.name !== 'PsForm') {\n        if (parent.type.name === 'PsFormItem') {\n          return true\n        }\n        parent = parent.parent\n      }\n      return false\n    })\n\n    let initialValue = undefined\n\n    const labelFor = computed(() => props.for || props.prop)\n    const labelStyle = computed(() => {\n      const ret: CSSProperties = {}\n      if (elForm.labelPosition === 'top') return ret\n      const labelWidth = addUnit(props.labelWidth || elForm.labelWidth)\n      if (labelWidth) {\n        ret.width = labelWidth\n      }\n      return ret\n    })\n    const contentStyle = computed(() => {\n      const ret: CSSProperties = {}\n      if (elForm.labelPosition === 'top' || elForm.inline) {\n        return ret\n      }\n      if (!props.label && !props.labelWidth && isNested.value) {\n        return ret\n      }\n      const labelWidth = addUnit(props.labelWidth || elForm.labelWidth)\n      if (!props.label && !slots.label) {\n        ret.marginLeft = labelWidth\n      }\n      return ret\n    })\n    const fieldValue = computed(() => {\n      const model = elForm.model\n      if (!model || !props.prop) {\n        return\n      }\n\n      let path = props.prop\n      if (path.indexOf(':') !== -1) {\n        path = path.replace(/:/, '.')\n      }\n\n      return getPropByPath(model, path, true).v\n    })\n    const isRequired = computed(() => {\n      const rules = getRules()\n      let required = false\n\n      if (rules && rules.length) {\n        rules.every((rule) => {\n          if (rule.required) {\n            required = true\n            return false\n          }\n          return true\n        })\n      }\n      return required\n    })\n    const elFormItemSize = computed(() => props.size || elForm.size)\n    const sizeClass = computed<ComponentSize>(() => {\n      return elFormItemSize.value || $ELEMENT.size\n    })\n\n    const getRules = () => {\n      const formRules = elForm.rules\n      const selfRules = props.rules\n      const requiredRule =\n        props.required !== undefined ? { required: !!props.required } : []\n\n      const prop = getPropByPath(formRules, props.prop || '', false)\n      const normalizedRule = formRules ? prop.o[props.prop || ''] || prop.v : []\n\n      return [].concat(selfRules || normalizedRule || []).concat(requiredRule)\n    }\n\n    const updateComputedLabelWidth = (width: string | number) => {\n      computedLabelWidth.value = width ? `${width}px` : ''\n    }\n\n    const elFormItem = reactive({\n      ...toRefs(props),\n      size: sizeClass,\n      $el: formItemRef,\n      updateComputedLabelWidth,\n    })\n\n    onMounted(() => {\n      if (props.prop) {\n        const value = fieldValue.value\n        initialValue = (Array.isArray(value) ? [...value] : value) as any\n      }\n    })\n\n    provide(elFormItemKey, elFormItem as any)\n\n    const formItemClass = computed(() => [\n      {\n        'el-form-item--feedback': elForm.statusIcon,\n        'is-error': validateState.value === 'error',\n        'is-validating': validateState.value === 'validating',\n        'is-success': validateState.value === 'success',\n        'is-required': isRequired.value || props.required,\n        'is-no-asterisk': elForm.hideRequiredAsterisk,\n      },\n      sizeClass.value ? `el-form-item--${sizeClass.value}` : '',\n    ])\n\n    const shouldShowError = computed(() => {\n      return (\n        validateState.value === 'error' &&\n        props.showMessage &&\n        elForm.showMessage\n      )\n    })\n\n    return {\n      formItemRef,\n      formItemClass,\n      shouldShowError,\n      elForm,\n      labelStyle,\n      contentStyle,\n      validateMessage,\n      labelFor,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_createVNode","_renderSlot","_createElementVNode"],"mappings":";;;;;;;;;;0BACEA;IAAK,KAAI;AAAA,IAAc,2BAAM,gBAAuB;;IAClDC;MACG,iBAAe,gBAAW;MAC1B,cAAY,YAAO;;2BAEpB;QACQ,cAAS,YAAO,0BADxBD;;UAEG,KAAK;UACN,OAAM;AAAA,UACL,0BAAO;UACP,QAAQ;;UAETE;YAAoB,OAAO,aAAQ,YAAO;AAAA,aAA1C;oDACK,aAAQ,YAAO;;;;;;IAIxBC;MAAK,OAAM;AAAA,MAAyB,0BAAO;MAAe,QAAQ;;MAChED;MACAD,kCAAY,MAAK;6BACf;UAAY,uBAAZC;;YAA2C,OAAO;aAAlD;YACEC;cACE,2BAAM;;;mCAQH;;;;;;;;;;;"}

package/lib/packages/components/index.js

@@ -72,21 +72,21 @@ var index$12 = require('./loading/index.js');
 var index$13 = require('./popover/index.js');
 var affix = require('./affix/src/affix.js');
 var alert = require('./alert/src/alert.js');
-var avatar = require('./avatar/src/avatar.js');
+var avatar = require('./avatar/src/avatar2.js');
 var backtop = require('./backtop/src/backtop.js');
 var badge = require('./badge/src/badge.js');
 var breadcrumb = require('./breadcrumb/src/breadcrumb.js');
 var breadcrumbItem = require('./breadcrumb/src/breadcrumb-item.js');
-var button = require('./button/src/button2.js');
-var card = require('./card/src/card.js');
+var button = require('./button/src/button.js');
+var card = require('./card/src/card2.js');
 var types = require('./cascader-panel/src/types.js');
 var config = require('./cascader-panel/src/config.js');
 var col = require('./col/src/col.js');
 var configProvider = require('./config-provider/src/config-provider.js');
 var useDialog = require('./dialog/src/use-dialog.js');
-var dialog = require('./dialog/src/dialog2.js');
+var dialog = require('./dialog/src/dialog.js');
 var divider = require('./divider/src/divider.js');
-var empty = require('./empty/src/empty.js');
+var empty = require('./empty/src/empty2.js');
 var icon = require('./icon/src/icon.js');
 var image = require('./image/src/image.js');
 var imageViewer = require('./image-viewer/src/image-viewer.js');
@@ -98,7 +98,7 @@ var menuItem = require('./menu/src/menu-item.js');
 var menuItemGroup = require('./menu/src/menu-item-group.js');
 var subMenu = require('./menu/src/sub-menu.js');
 var overlay = require('./overlay/src/overlay.js');
-var pageHeader = require('./page-header/src/page-header2.js');
+var pageHeader = require('./page-header/src/page-header.js');
 var pagination = require('./pagination/src/pagination.js');
 var popconfirm = require('./popconfirm/src/popconfirm.js');
 var defaults = require('./popper/src/use-popper/defaults.js');

package/lib/packages/components/input/src/input.js

@@ -75,6 +75,9 @@ const inputProps = props.buildProps({
   },
   maxlength: {
     type: [Number, String]
+  },
+  widget: {
+    type: String
   }
 });
 

package/lib/packages/components/input/src/input.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.js","sources":["../../../../../../../packages/components/input/src/input.ts"],"sourcesContent":["import { useFormItemProps } from '@element-ps/hooks'\nimport { buildProps, definePropType, mutable } from '@element-ps/utils/props'\nimport type { StyleValue } from '@element-ps/utils/types'\nimport type { ExtractPropTypes, Component } from 'vue'\n\ntype AutoSize = { minRows?: number; maxRows?: number } | boolean\n\nexport const inputProps = buildProps({\n  ...useFormItemProps,\n  modelValue: {\n    type: definePropType<string | number | null | undefined>(undefined),\n    default: '',\n  },\n  type: {\n    type: String,\n    default: 'text',\n  },\n  resize: {\n    type: String,\n    values: ['none', 'both', 'horizontal', 'vertical'],\n  },\n  autosize: {\n    type: definePropType<AutoSize>([Boolean, Object]),\n    default: false,\n  },\n  autocomplete: {\n    type: String,\n    default: 'off',\n  },\n  placeholder: {\n    type: String,\n  },\n  form: {\n    type: String,\n    default: '',\n  },\n  readonly: {\n    type: Boolean,\n    default: false,\n  },\n  clearable: {\n    type: Boolean,\n    default: false,\n  },\n  showPassword: {\n    type: Boolean,\n    default: false,\n  },\n  showWordLimit: {\n    type: Boolean,\n    default: false,\n  },\n  suffixIcon: {\n    type: definePropType<string | Component>([String, Object]),\n    default: '',\n  },\n  prefixIcon: {\n    type: definePropType<string | Component>([String, Object]),\n    default: '',\n  },\n  label: {\n    type: String,\n  },\n  tabindex: {\n    type: [Number, String],\n  },\n  validateEvent: {\n    type: Boolean,\n    default: true,\n  },\n  inputStyle: {\n    type: definePropType<StyleValue>([Object, Array, String]),\n    default: () => mutable({} as const),\n  },\n  maxlength: {\n    type: [Number, String],\n  },\n} as const)\nexport type InputProps = ExtractPropTypes<typeof inputProps>\n"],"names":["buildProps","useFormItemProps","definePropType","mutable"],"mappings":";;;;;;;;MAOa,aAAaA,iBAAW;AAAA,KAChCC;AAAA,EACH,YAAY;AAAA,IACV,MAAMC,qBAAmD;AAAA,IACzD,SAAS;AAAA;AAAA,EAEX,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,QAAQ;AAAA,IACN,MAAM;AAAA,IACN,QAAQ,CAAC,QAAQ,QAAQ,cAAc;AAAA;AAAA,EAEzC,UAAU;AAAA,IACR,MAAMA,qBAAyB,CAAC,SAAS;AAAA,IACzC,SAAS;AAAA;AAAA,EAEX,cAAc;AAAA,IACZ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,aAAa;AAAA,IACX,MAAM;AAAA;AAAA,EAER,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,UAAU;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,WAAW;AAAA,IACT,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,cAAc;AAAA,IACZ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,eAAe;AAAA,IACb,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,YAAY;AAAA,IACV,MAAMA,qBAAmC,CAAC,QAAQ;AAAA,IAClD,SAAS;AAAA;AAAA,EAEX,YAAY;AAAA,IACV,MAAMA,qBAAmC,CAAC,QAAQ;AAAA,IAClD,SAAS;AAAA;AAAA,EAEX,OAAO;AAAA,IACL,MAAM;AAAA;AAAA,EAER,UAAU;AAAA,IACR,MAAM,CAAC,QAAQ;AAAA;AAAA,EAEjB,eAAe;AAAA,IACb,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,YAAY;AAAA,IACV,MAAMA,qBAA2B,CAAC,QAAQ,OAAO;AAAA,IACjD,SAAS,MAAMC,cAAQ;AAAA;AAAA,EAEzB,WAAW;AAAA,IACT,MAAM,CAAC,QAAQ;AAAA;AAAA;;;;"}
+{"version":3,"file":"input.js","sources":["../../../../../../../packages/components/input/src/input.ts"],"sourcesContent":["import { useFormItemProps } from '@element-ps/hooks'\nimport { buildProps, definePropType, mutable } from '@element-ps/utils/props'\nimport type { StyleValue } from '@element-ps/utils/types'\nimport type { ExtractPropTypes, Component } from 'vue'\n\ntype AutoSize = { minRows?: number; maxRows?: number } | boolean\n\nexport const inputProps = buildProps({\n  ...useFormItemProps,\n  modelValue: {\n    type: definePropType<string | number | null | undefined>(undefined),\n    default: '',\n  },\n  type: {\n    type: String,\n    default: 'text',\n  },\n  resize: {\n    type: String,\n    values: ['none', 'both', 'horizontal', 'vertical'],\n  },\n  autosize: {\n    type: definePropType<AutoSize>([Boolean, Object]),\n    default: false,\n  },\n  autocomplete: {\n    type: String,\n    default: 'off',\n  },\n  placeholder: {\n    type: String,\n  },\n  form: {\n    type: String,\n    default: '',\n  },\n  readonly: {\n    type: Boolean,\n    default: false,\n  },\n  clearable: {\n    type: Boolean,\n    default: false,\n  },\n  showPassword: {\n    type: Boolean,\n    default: false,\n  },\n  showWordLimit: {\n    type: Boolean,\n    default: false,\n  },\n  suffixIcon: {\n    type: definePropType<string | Component>([String, Object]),\n    default: '',\n  },\n  prefixIcon: {\n    type: definePropType<string | Component>([String, Object]),\n    default: '',\n  },\n  label: {\n    type: String,\n  },\n  tabindex: {\n    type: [Number, String],\n  },\n  validateEvent: {\n    type: Boolean,\n    default: true,\n  },\n  inputStyle: {\n    type: definePropType<StyleValue>([Object, Array, String]),\n    default: () => mutable({} as const),\n  },\n  maxlength: {\n    type: [Number, String],\n  },\n  widget: {\n    type: String,\n  },\n} as const)\nexport type InputProps = ExtractPropTypes<typeof inputProps>\n"],"names":["buildProps","useFormItemProps","definePropType","mutable"],"mappings":";;;;;;;;MAOa,aAAaA,iBAAW;AAAA,KAChCC;AAAA,EACH,YAAY;AAAA,IACV,MAAMC,qBAAmD;AAAA,IACzD,SAAS;AAAA;AAAA,EAEX,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,QAAQ;AAAA,IACN,MAAM;AAAA,IACN,QAAQ,CAAC,QAAQ,QAAQ,cAAc;AAAA;AAAA,EAEzC,UAAU;AAAA,IACR,MAAMA,qBAAyB,CAAC,SAAS;AAAA,IACzC,SAAS;AAAA;AAAA,EAEX,cAAc;AAAA,IACZ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,aAAa;AAAA,IACX,MAAM;AAAA;AAAA,EAER,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,UAAU;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,WAAW;AAAA,IACT,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,cAAc;AAAA,IACZ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,eAAe;AAAA,IACb,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,YAAY;AAAA,IACV,MAAMA,qBAAmC,CAAC,QAAQ;AAAA,IAClD,SAAS;AAAA;AAAA,EAEX,YAAY;AAAA,IACV,MAAMA,qBAAmC,CAAC,QAAQ;AAAA,IAClD,SAAS;AAAA;AAAA,EAEX,OAAO;AAAA,IACL,MAAM;AAAA;AAAA,EAER,UAAU;AAAA,IACR,MAAM,CAAC,QAAQ;AAAA;AAAA,EAEjB,eAAe;AAAA,IACb,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,YAAY;AAAA,IACV,MAAMA,qBAA2B,CAAC,QAAQ,OAAO;AAAA,IACjD,SAAS,MAAMC,cAAQ;AAAA;AAAA,EAEzB,WAAW;AAAA,IACT,MAAM,CAAC,QAAQ;AAAA;AAAA,EAEjB,QAAQ;AAAA,IACN,MAAM;AAAA;AAAA;;;;"}

package/lib/packages/components/input/src/input.vue_vue&type=script&lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.vue_vue&type=script&lang.js","sources":["../../../../../../../packages/components/input/src/input.vue"],"sourcesContent":["<template>\n  <div\n    v-show=\"type !== 'hidden'\"\n    :class=\"[\n      type === 'textarea' ? 'el-textarea' : 'el-input',\n      inputSize ? 'el-input--' + inputSize : '',\n      {\n        'is-disabled': inputDisabled,\n        'is-exceed': inputExceed,\n        'el-input-group': $slots.prepend || $slots.append,\n        'el-input-group--append': $slots.append,\n        'el-input-group--prepend': $slots.prepend,\n        'el-input--prefix': $slots.prefix || prefixIcon,\n        'el-input--suffix':\n          $slots.suffix || suffixIcon || clearable || showPassword,\n        'el-input--suffix--password-clear': clearable && showPassword,\n      },\n      $attrs.class,\n    ]\"\n    :style=\"containerStyle\"\n  >\n    <!-- input -->\n    <template v-if=\"type !== 'textarea'\">\n      <!-- prepend slot -->\n      <div v-if=\"$slots.prepend\" class=\"el-input-group__prepend\">\n        <slot name=\"prepend\" />\n      </div>\n\n      <input\n        ref=\"input\"\n        class=\"el-input__inner\"\n        v-bind=\"attrs\"\n        :type=\"showPassword ? (passwordVisible ? 'text' : 'password') : type\"\n        :disabled=\"inputDisabled\"\n        :readonly=\"readonly\"\n        :autocomplete=\"autocomplete\"\n        :tabindex=\"tabindex\"\n        :aria-label=\"label\"\n        :placeholder=\"placeholder\"\n        :style=\"inputStyle\"\n      />\n\n      <!-- prefix slot -->\n      <span v-if=\"$slots.prefix || prefixIcon\" class=\"el-input__prefix\">\n        <span class=\"el-input__prefix-inner\">\n          <slot name=\"prefix\"></slot>\n          <ps-icon v-if=\"prefixIcon\" class=\"el-input__icon\">\n            <component :is=\"prefixIcon\" />\n          </ps-icon>\n        </span>\n      </span>\n\n      <!-- suffix slot -->\n      <span v-if=\"suffixVisible\" class=\"el-input__suffix\">\n        <span class=\"el-input__suffix-inner\">\n          <template v-if=\"!showClear || !showPwdVisible || !isWordLimitVisible\">\n            <slot name=\"suffix\"></slot>\n            <ps-icon v-if=\"suffixIcon\" class=\"el-input__icon\">\n              <component :is=\"suffixIcon\" />\n            </ps-icon>\n          </template>\n          <ps-icon\n            v-if=\"showClear\"\n            class=\"el-input__icon el-input__clear\"\n          >\n            <circle-close />\n          </ps-icon>\n          <ps-icon\n            v-if=\"showPwdVisible\"\n            class=\"el-input__icon el-input__clear\"\n          >\n            <icon-view />\n          </ps-icon>\n          <span v-if=\"isWordLimitVisible\" class=\"el-input__count\">\n            <span class=\"el-input__count-inner\">\n              {{ textLength }} / {{ attrs.maxlength }}\n            </span>\n          </span>\n        </span>\n        <ps-icon\n          v-if=\"validateState && validateIcon\"\n          class=\"el-input__icon el-input__validateIcon\"\n        >\n          <component :is=\"validateIcon\" />\n        </ps-icon>\n      </span>\n\n      <!-- append slot -->\n      <div v-if=\"$slots.append\" class=\"el-input-group__append\">\n        <slot name=\"append\" />\n      </div>\n    </template>\n\n    <!-- textarea -->\n    <template v-else>\n      <textarea\n        ref=\"textarea\"\n        class=\"el-textarea__inner\"\n        v-bind=\"attrs\"\n        :tabindex=\"tabindex\"\n        :disabled=\"inputDisabled\"\n        :readonly=\"readonly\"\n        :autocomplete=\"autocomplete\"\n        :style=\"computedTextareaStyle\"\n        :aria-label=\"label\"\n        :placeholder=\"placeholder\"\n      />\n      <span v-if=\"isWordLimitVisible\" class=\"el-input__count\">\n        {{ textLength }} / {{ attrs.maxlength }}\n      </span>\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  inject,\n  computed,\n  watch,\n  nextTick,\n  getCurrentInstance,\n  ref,\n  shallowRef,\n  onMounted,\n  onUpdated,\n} from 'vue'\nimport { elFormKey, elFormItemKey } from '@element-ps/tokens'\nimport { useAttrs, useFormItem } from '@element-ps/hooks'\nimport { VALIDATE_STATE_MAP } from '@element-ps/utils/constants'\nimport { isObject } from '@element-ps/utils/util'\nimport isServer from '@element-ps/utils/isServer'\nimport { calcTextareaHeight } from './calc-textarea-height'\nimport { inputProps } from './input'\nimport type { StyleValue } from '@element-ps/utils/types'\nimport { PsIcon } from '@element-ps/components/icon'\nimport { CircleClose, View as IconView } from '@element-plus/icons'\n\nconst PENDANT_MAP = {\n  suffix: 'append',\n  prefix: 'prepend',\n} as const\n\nexport default defineComponent({\n  name: 'PsInput',\n  inheritAttrs: false,\n  components: { PsIcon, CircleClose, IconView },\n  props: inputProps,\n\n  setup(props, { slots, attrs: rawAttrs }) {\n    const instance = getCurrentInstance()!\n    const attrs = useAttrs()\n\n    const elForm = inject(elFormKey, undefined)\n    const elFormItem = inject(elFormItemKey, undefined)\n\n    const { size: inputSize, disabled: inputDisabled } = useFormItem({})\n\n    const input = ref<HTMLInputElement>()\n    const textarea = ref<HTMLTextAreaElement>()\n    const focused = ref(false)\n    const hovering = ref(false)\n    const passwordVisible = ref(false)\n    const _textareaCalcStyle = shallowRef(props.inputStyle)\n\n    const inputOrTextarea = computed(() => input.value || textarea.value)\n    const needStatusIcon = computed(() => elForm?.statusIcon ?? false)\n    const validateState = computed(() => elFormItem?.validateState || '')\n    const validateIcon = computed(() => VALIDATE_STATE_MAP[validateState.value])\n    const containerStyle = computed(() => rawAttrs.style as StyleValue)\n    const computedTextareaStyle = computed<StyleValue>(() => [\n      props.inputStyle,\n      _textareaCalcStyle.value,\n      { resize: props.resize },\n    ])\n    const nativeInputValue = computed(() =>\n      props.modelValue === null || props.modelValue === undefined\n        ? ''\n        : String(props.modelValue)\n    )\n    const showClear = computed(\n      () =>\n        props.clearable &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        !!nativeInputValue.value &&\n        (focused.value || hovering.value)\n    )\n    const showPwdVisible = computed(\n      () =>\n        props.showPassword &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        (!!nativeInputValue.value || focused.value)\n    )\n    const isWordLimitVisible = computed(\n      () =>\n        props.showWordLimit &&\n        !!attrs.value.maxlength &&\n        (props.type === 'text' || props.type === 'textarea') &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        !props.showPassword\n    )\n    const textLength = computed(() => Array.from(nativeInputValue.value).length)\n    const inputExceed = computed(\n      () =>\n        // show exceed style if length of initial value greater then maxlength\n        !!isWordLimitVisible.value &&\n        textLength.value > Number(attrs.value.maxlength)\n    )\n\n    const resizeTextarea = () => {\n      const { type, autosize } = props\n\n      if (isServer || type !== 'textarea') return\n\n      if (autosize) {\n        const minRows = isObject(autosize) ? autosize.minRows : undefined\n        const maxRows = isObject(autosize) ? autosize.maxRows : undefined\n        _textareaCalcStyle.value = {\n          ...calcTextareaHeight(textarea.value!, minRows, maxRows),\n        }\n      } else {\n        _textareaCalcStyle.value = {\n          minHeight: calcTextareaHeight(textarea.value!).minHeight,\n        }\n      }\n    }\n\n    const setNativeInputValue = () => {\n      const input = inputOrTextarea.value\n      if (!input || input.value === nativeInputValue.value) return\n      input.value = nativeInputValue.value\n    }\n\n    const calcIconOffset = (place: 'prefix' | 'suffix') => {\n      const { el } = instance.vnode\n      if (!el) return\n      const elList: HTMLSpanElement[] = Array.from(\n        el.querySelectorAll(`.el-input__${place}`)\n      )\n      const target = elList.find((item) => item.parentNode === el)\n\n      if (!target) return\n\n      const pendant = PENDANT_MAP[place]\n\n      if (slots[pendant]) {\n        target.style.transform = `translateX(${place === 'suffix' ? '-' : ''}${\n          el.querySelector(`.el-input-group__${pendant}`).offsetWidth\n        }px)`\n      } else {\n        target.removeAttribute('style')\n      }\n    }\n\n    const updateIconOffset = () => {\n      calcIconOffset('prefix')\n      calcIconOffset('suffix')\n    }\n\n    const suffixVisible = computed(\n      () =>\n        !!slots.suffix ||\n        !!props.suffixIcon ||\n        showClear.value ||\n        props.showPassword ||\n        isWordLimitVisible.value ||\n        (!!validateState.value && needStatusIcon.value)\n    )\n\n    watch(\n      () => props.modelValue,\n      () => {\n        nextTick(resizeTextarea)\n        if (props.validateEvent) {\n          elFormItem?.validate?.('change')\n        }\n      }\n    )\n\n    // native input value is set explicitly\n    // do not use v-model / :value in template\n    // see: https://github.com/ElemeFE/element/issues/14521\n    watch(nativeInputValue, () => setNativeInputValue())\n\n    // when change between <input> and <textarea>,\n    // update DOM dependent value and styles\n    // https://github.com/ElemeFE/element/issues/14857\n    watch(\n      () => props.type,\n      () => {\n        nextTick(() => {\n          setNativeInputValue()\n          resizeTextarea()\n          updateIconOffset()\n        })\n      }\n    )\n\n    onMounted(() => {\n      setNativeInputValue()\n      updateIconOffset()\n      nextTick(resizeTextarea)\n    })\n\n    onUpdated(() => {\n      nextTick(updateIconOffset)\n    })\n\n    return {\n      input,\n      textarea,\n      attrs,\n      inputSize,\n      validateState,\n      validateIcon,\n      containerStyle,\n      computedTextareaStyle,\n      inputDisabled,\n      showClear,\n      showPwdVisible,\n      isWordLimitVisible,\n      textLength,\n      hovering,\n      inputExceed,\n      passwordVisible,\n      inputOrTextarea,\n      suffixVisible,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","PsIcon","CircleClose","IconView","inputProps","getCurrentInstance","useAttrs","inject","elFormKey","elFormItemKey","useFormItem","ref","shallowRef","computed","VALIDATE_STATE_MAP","isServer","isObject","calcTextareaHeight"],"mappings":"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"}
+{"version":3,"file":"input.vue_vue&type=script&lang.js","sources":["../../../../../../../packages/components/input/src/input.vue"],"sourcesContent":["<template>\n  <div\n    v-show=\"type !== 'hidden'\"\n    :class=\"[\n      type === 'textarea' ? 'el-textarea' : 'el-input',\n      inputSize ? 'el-input--' + inputSize : '',\n      {\n        'is-disabled': inputDisabled,\n        'is-exceed': inputExceed,\n        'el-input-group': $slots.prepend || $slots.append,\n        'el-input-group--append': $slots.append,\n        'el-input-group--prepend': $slots.prepend,\n        'el-input--prefix': $slots.prefix || prefixIcon,\n        'el-input--suffix':\n          $slots.suffix || suffixIcon || clearable || showPassword,\n        'el-input--suffix--password-clear': clearable && showPassword,\n      },\n      $attrs.class,\n    ]\"\n    :style=\"containerStyle\"\n    :widget=\"widget\"\n  >\n    <!-- input -->\n    <template v-if=\"type !== 'textarea'\">\n      <!-- prepend slot -->\n      <div v-if=\"$slots.prepend\" class=\"el-input-group__prepend\">\n        <slot name=\"prepend\" />\n      </div>\n\n      <input\n        ref=\"input\"\n        class=\"el-input__inner\"\n        v-bind=\"attrs\"\n        :type=\"showPassword ? (passwordVisible ? 'text' : 'password') : type\"\n        :disabled=\"inputDisabled\"\n        :readonly=\"readonly\"\n        :autocomplete=\"autocomplete\"\n        :tabindex=\"tabindex\"\n        :aria-label=\"label\"\n        :placeholder=\"placeholder\"\n        :style=\"inputStyle\"\n      />\n\n      <!-- prefix slot -->\n      <span v-if=\"$slots.prefix || prefixIcon\" class=\"el-input__prefix\">\n        <span class=\"el-input__prefix-inner\">\n          <slot name=\"prefix\"></slot>\n          <ps-icon v-if=\"prefixIcon\" class=\"el-input__icon\">\n            <component :is=\"prefixIcon\" />\n          </ps-icon>\n        </span>\n      </span>\n\n      <!-- suffix slot -->\n      <span v-if=\"suffixVisible\" class=\"el-input__suffix\">\n        <span class=\"el-input__suffix-inner\">\n          <template v-if=\"!showClear || !showPwdVisible || !isWordLimitVisible\">\n            <slot name=\"suffix\"></slot>\n            <ps-icon v-if=\"suffixIcon\" class=\"el-input__icon\">\n              <component :is=\"suffixIcon\" />\n            </ps-icon>\n          </template>\n          <ps-icon v-if=\"showClear\" class=\"el-input__icon el-input__clear\">\n            <circle-close />\n          </ps-icon>\n          <ps-icon v-if=\"showPwdVisible\" class=\"el-input__icon el-input__clear\">\n            <icon-view />\n          </ps-icon>\n          <span v-if=\"isWordLimitVisible\" class=\"el-input__count\">\n            <span class=\"el-input__count-inner\">\n              {{ textLength }} / {{ attrs.maxlength }}\n            </span>\n          </span>\n        </span>\n        <ps-icon\n          v-if=\"validateState && validateIcon\"\n          class=\"el-input__icon el-input__validateIcon\"\n        >\n          <component :is=\"validateIcon\" />\n        </ps-icon>\n      </span>\n\n      <!-- append slot -->\n      <div v-if=\"$slots.append\" class=\"el-input-group__append\">\n        <slot name=\"append\" />\n      </div>\n    </template>\n\n    <!-- textarea -->\n    <template v-else>\n      <textarea\n        ref=\"textarea\"\n        class=\"el-textarea__inner\"\n        v-bind=\"attrs\"\n        :tabindex=\"tabindex\"\n        :disabled=\"inputDisabled\"\n        :readonly=\"readonly\"\n        :autocomplete=\"autocomplete\"\n        :style=\"computedTextareaStyle\"\n        :aria-label=\"label\"\n        :placeholder=\"placeholder\"\n      />\n      <span v-if=\"isWordLimitVisible\" class=\"el-input__count\">\n        {{ textLength }} / {{ attrs.maxlength }}\n      </span>\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  inject,\n  computed,\n  watch,\n  nextTick,\n  getCurrentInstance,\n  ref,\n  shallowRef,\n  onMounted,\n  onUpdated,\n} from 'vue'\nimport { elFormKey, elFormItemKey } from '@element-ps/tokens'\nimport { useAttrs, useFormItem } from '@element-ps/hooks'\nimport { VALIDATE_STATE_MAP } from '@element-ps/utils/constants'\nimport { isObject } from '@element-ps/utils/util'\nimport isServer from '@element-ps/utils/isServer'\nimport { calcTextareaHeight } from './calc-textarea-height'\nimport { inputProps } from './input'\nimport type { StyleValue } from '@element-ps/utils/types'\nimport { PsIcon } from '@element-ps/components/icon'\nimport { CircleClose, View as IconView } from '@element-plus/icons'\n\nconst PENDANT_MAP = {\n  suffix: 'append',\n  prefix: 'prepend',\n} as const\n\nexport default defineComponent({\n  name: 'PsInput',\n  inheritAttrs: false,\n  components: { PsIcon, CircleClose, IconView },\n  props: inputProps,\n\n  setup(props, { slots, attrs: rawAttrs }) {\n    const instance = getCurrentInstance()!\n    const attrs = useAttrs()\n\n    const elForm = inject(elFormKey, undefined)\n    const elFormItem = inject(elFormItemKey, undefined)\n\n    const { size: inputSize, disabled: inputDisabled } = useFormItem({})\n\n    const input = ref<HTMLInputElement>()\n    const textarea = ref<HTMLTextAreaElement>()\n    const focused = ref(false)\n    const hovering = ref(false)\n    const passwordVisible = ref(false)\n    const _textareaCalcStyle = shallowRef(props.inputStyle)\n\n    const inputOrTextarea = computed(() => input.value || textarea.value)\n    const needStatusIcon = computed(() => elForm?.statusIcon ?? false)\n    const validateState = computed(() => elFormItem?.validateState || '')\n    const validateIcon = computed(() => VALIDATE_STATE_MAP[validateState.value])\n    const containerStyle = computed(() => rawAttrs.style as StyleValue)\n    const computedTextareaStyle = computed<StyleValue>(() => [\n      props.inputStyle,\n      _textareaCalcStyle.value,\n      { resize: props.resize },\n    ])\n    const nativeInputValue = computed(() =>\n      props.modelValue === null || props.modelValue === undefined\n        ? ''\n        : String(props.modelValue)\n    )\n    const showClear = computed(\n      () =>\n        props.clearable &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        !!nativeInputValue.value &&\n        (focused.value || hovering.value)\n    )\n    const showPwdVisible = computed(\n      () =>\n        props.showPassword &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        (!!nativeInputValue.value || focused.value)\n    )\n    const isWordLimitVisible = computed(\n      () =>\n        props.showWordLimit &&\n        !!attrs.value.maxlength &&\n        (props.type === 'text' || props.type === 'textarea') &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        !props.showPassword\n    )\n    const textLength = computed(() => Array.from(nativeInputValue.value).length)\n    const inputExceed = computed(\n      () =>\n        // show exceed style if length of initial value greater then maxlength\n        !!isWordLimitVisible.value &&\n        textLength.value > Number(attrs.value.maxlength)\n    )\n\n    const resizeTextarea = () => {\n      const { type, autosize } = props\n\n      if (isServer || type !== 'textarea') return\n\n      if (autosize) {\n        const minRows = isObject(autosize) ? autosize.minRows : undefined\n        const maxRows = isObject(autosize) ? autosize.maxRows : undefined\n        _textareaCalcStyle.value = {\n          ...calcTextareaHeight(textarea.value!, minRows, maxRows),\n        }\n      } else {\n        _textareaCalcStyle.value = {\n          minHeight: calcTextareaHeight(textarea.value!).minHeight,\n        }\n      }\n    }\n\n    const setNativeInputValue = () => {\n      const input = inputOrTextarea.value\n      if (!input || input.value === nativeInputValue.value) return\n      input.value = nativeInputValue.value\n    }\n\n    const calcIconOffset = (place: 'prefix' | 'suffix') => {\n      const { el } = instance.vnode\n      if (!el) return\n      const elList: HTMLSpanElement[] = Array.from(\n        el.querySelectorAll(`.el-input__${place}`)\n      )\n      const target = elList.find((item) => item.parentNode === el)\n\n      if (!target) return\n\n      const pendant = PENDANT_MAP[place]\n\n      if (slots[pendant]) {\n        target.style.transform = `translateX(${place === 'suffix' ? '-' : ''}${\n          el.querySelector(`.el-input-group__${pendant}`).offsetWidth\n        }px)`\n      } else {\n        target.removeAttribute('style')\n      }\n    }\n\n    const updateIconOffset = () => {\n      calcIconOffset('prefix')\n      calcIconOffset('suffix')\n    }\n\n    const suffixVisible = computed(\n      () =>\n        !!slots.suffix ||\n        !!props.suffixIcon ||\n        showClear.value ||\n        props.showPassword ||\n        isWordLimitVisible.value ||\n        (!!validateState.value && needStatusIcon.value)\n    )\n\n    watch(\n      () => props.modelValue,\n      () => {\n        nextTick(resizeTextarea)\n        if (props.validateEvent) {\n          elFormItem?.validate?.('change')\n        }\n      }\n    )\n\n    // native input value is set explicitly\n    // do not use v-model / :value in template\n    // see: https://github.com/ElemeFE/element/issues/14521\n    watch(nativeInputValue, () => setNativeInputValue())\n\n    // when change between <input> and <textarea>,\n    // update DOM dependent value and styles\n    // https://github.com/ElemeFE/element/issues/14857\n    watch(\n      () => props.type,\n      () => {\n        nextTick(() => {\n          setNativeInputValue()\n          resizeTextarea()\n          updateIconOffset()\n        })\n      }\n    )\n\n    onMounted(() => {\n      setNativeInputValue()\n      updateIconOffset()\n      nextTick(resizeTextarea)\n    })\n\n    onUpdated(() => {\n      nextTick(updateIconOffset)\n    })\n\n    return {\n      input,\n      textarea,\n      attrs,\n      inputSize,\n      validateState,\n      validateIcon,\n      containerStyle,\n      computedTextareaStyle,\n      inputDisabled,\n      showClear,\n      showPwdVisible,\n      isWordLimitVisible,\n      textLength,\n      hovering,\n      inputExceed,\n      passwordVisible,\n      inputOrTextarea,\n      suffixVisible,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","PsIcon","CircleClose","IconView","inputProps","getCurrentInstance","useAttrs","inject","elFormKey","elFormItemKey","useFormItem","ref","shallowRef","computed","VALIDATE_STATE_MAP","isServer","isObject","calcTextareaHeight"],"mappings":"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"}

package/lib/packages/components/input/src/input.vue_vue&type=template&id=3290dcb6&lang.js

@@ -4,32 +4,33 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
 
-const _hoisted_1 = {
+const _hoisted_1 = ["widget"];
+const _hoisted_2 = {
   key: 0,
   class: "el-input-group__prepend"
 };
-const _hoisted_2 = ["type", "disabled", "readonly", "autocomplete", "tabindex", "aria-label", "placeholder"];
-const _hoisted_3 = {
+const _hoisted_3 = ["type", "disabled", "readonly", "autocomplete", "tabindex", "aria-label", "placeholder"];
+const _hoisted_4 = {
   key: 1,
   class: "el-input__prefix"
 };
-const _hoisted_4 = { class: "el-input__prefix-inner" };
-const _hoisted_5 = {
+const _hoisted_5 = { class: "el-input__prefix-inner" };
+const _hoisted_6 = {
   key: 2,
   class: "el-input__suffix"
 };
-const _hoisted_6 = { class: "el-input__suffix-inner" };
-const _hoisted_7 = {
+const _hoisted_7 = { class: "el-input__suffix-inner" };
+const _hoisted_8 = {
   key: 3,
   class: "el-input__count"
 };
-const _hoisted_8 = { class: "el-input__count-inner" };
-const _hoisted_9 = {
+const _hoisted_9 = { class: "el-input__count-inner" };
+const _hoisted_10 = {
   key: 3,
   class: "el-input-group__append"
 };
-const _hoisted_10 = ["tabindex", "disabled", "readonly", "autocomplete", "aria-label", "placeholder"];
-const _hoisted_11 = {
+const _hoisted_11 = ["tabindex", "disabled", "readonly", "autocomplete", "aria-label", "placeholder"];
+const _hoisted_12 = {
   key: 0,
   class: "el-input__count"
 };
@@ -53,12 +54,13 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
       },
       _ctx.$attrs.class
     ]),
-    style: vue.normalizeStyle(_ctx.containerStyle)
+    style: vue.normalizeStyle(_ctx.containerStyle),
+    widget: _ctx.widget
   }, [
     vue.createCommentVNode(" input "),
     _ctx.type !== "textarea" ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
       vue.createCommentVNode(" prepend slot "),
-      _ctx.$slots.prepend ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+      _ctx.$slots.prepend ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
         vue.renderSlot(_ctx.$slots, "prepend")
       ])) : vue.createCommentVNode("v-if", true),
       vue.createElementVNode("input", vue.mergeProps({
@@ -73,10 +75,10 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         "aria-label": _ctx.label,
         placeholder: _ctx.placeholder,
         style: _ctx.inputStyle
-      }), null, 16, _hoisted_2),
+      }), null, 16, _hoisted_3),
       vue.createCommentVNode(" prefix slot "),
-      _ctx.$slots.prefix || _ctx.prefixIcon ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3, [
-        vue.createElementVNode("span", _hoisted_4, [
+      _ctx.$slots.prefix || _ctx.prefixIcon ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4, [
+        vue.createElementVNode("span", _hoisted_5, [
           vue.renderSlot(_ctx.$slots, "prefix"),
           _ctx.prefixIcon ? (vue.openBlock(), vue.createBlock(_component_ps_icon, {
             key: 0,
@@ -90,8 +92,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         ])
       ])) : vue.createCommentVNode("v-if", true),
       vue.createCommentVNode(" suffix slot "),
-      _ctx.suffixVisible ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_5, [
-        vue.createElementVNode("span", _hoisted_6, [
+      _ctx.suffixVisible ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_6, [
+        vue.createElementVNode("span", _hoisted_7, [
           !_ctx.showClear || !_ctx.showPwdVisible || !_ctx.isWordLimitVisible ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
             vue.renderSlot(_ctx.$slots, "suffix"),
             _ctx.suffixIcon ? (vue.openBlock(), vue.createBlock(_component_ps_icon, {
@@ -122,8 +124,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             ]),
             _: 1
           })) : vue.createCommentVNode("v-if", true),
-          _ctx.isWordLimitVisible ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_7, [
-            vue.createElementVNode("span", _hoisted_8, vue.toDisplayString(_ctx.textLength) + " / " + vue.toDisplayString(_ctx.attrs.maxlength), 1)
+          _ctx.isWordLimitVisible ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_8, [
+            vue.createElementVNode("span", _hoisted_9, vue.toDisplayString(_ctx.textLength) + " / " + vue.toDisplayString(_ctx.attrs.maxlength), 1)
           ])) : vue.createCommentVNode("v-if", true)
         ]),
         _ctx.validateState && _ctx.validateIcon ? (vue.openBlock(), vue.createBlock(_component_ps_icon, {
@@ -137,7 +139,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         })) : vue.createCommentVNode("v-if", true)
       ])) : vue.createCommentVNode("v-if", true),
       vue.createCommentVNode(" append slot "),
-      _ctx.$slots.append ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_9, [
+      _ctx.$slots.append ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_10, [
         vue.renderSlot(_ctx.$slots, "append")
       ])) : vue.createCommentVNode("v-if", true)
     ], 64)) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
@@ -153,10 +155,10 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         style: _ctx.computedTextareaStyle,
         "aria-label": _ctx.label,
         placeholder: _ctx.placeholder
-      }), null, 16, _hoisted_10),
-      _ctx.isWordLimitVisible ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_11, vue.toDisplayString(_ctx.textLength) + " / " + vue.toDisplayString(_ctx.attrs.maxlength), 1)) : vue.createCommentVNode("v-if", true)
+      }), null, 16, _hoisted_11),
+      _ctx.isWordLimitVisible ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_12, vue.toDisplayString(_ctx.textLength) + " / " + vue.toDisplayString(_ctx.attrs.maxlength), 1)) : vue.createCommentVNode("v-if", true)
     ], 64))
-  ], 6)), [
+  ], 14, _hoisted_1)), [
     [vue.vShow, _ctx.type !== "hidden"]
   ]);
 }

package/lib/packages/components/input/src/input.vue_vue&type=template&id=3290dcb6&lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.vue_vue&type=template&id=3290dcb6&lang.js","sources":["../../../../../../../packages/components/input/src/input.vue?vue&type=template&id=3290dcb6&lang.js"],"sourcesContent":["<template>\n  <div\n    v-show=\"type !== 'hidden'\"\n    :class=\"[\n      type === 'textarea' ? 'el-textarea' : 'el-input',\n      inputSize ? 'el-input--' + inputSize : '',\n      {\n        'is-disabled': inputDisabled,\n        'is-exceed': inputExceed,\n        'el-input-group': $slots.prepend || $slots.append,\n        'el-input-group--append': $slots.append,\n        'el-input-group--prepend': $slots.prepend,\n        'el-input--prefix': $slots.prefix || prefixIcon,\n        'el-input--suffix':\n          $slots.suffix || suffixIcon || clearable || showPassword,\n        'el-input--suffix--password-clear': clearable && showPassword,\n      },\n      $attrs.class,\n    ]\"\n    :style=\"containerStyle\"\n  >\n    <!-- input -->\n    <template v-if=\"type !== 'textarea'\">\n      <!-- prepend slot -->\n      <div v-if=\"$slots.prepend\" class=\"el-input-group__prepend\">\n        <slot name=\"prepend\" />\n      </div>\n\n      <input\n        ref=\"input\"\n        class=\"el-input__inner\"\n        v-bind=\"attrs\"\n        :type=\"showPassword ? (passwordVisible ? 'text' : 'password') : type\"\n        :disabled=\"inputDisabled\"\n        :readonly=\"readonly\"\n        :autocomplete=\"autocomplete\"\n        :tabindex=\"tabindex\"\n        :aria-label=\"label\"\n        :placeholder=\"placeholder\"\n        :style=\"inputStyle\"\n      />\n\n      <!-- prefix slot -->\n      <span v-if=\"$slots.prefix || prefixIcon\" class=\"el-input__prefix\">\n        <span class=\"el-input__prefix-inner\">\n          <slot name=\"prefix\"></slot>\n          <ps-icon v-if=\"prefixIcon\" class=\"el-input__icon\">\n            <component :is=\"prefixIcon\" />\n          </ps-icon>\n        </span>\n      </span>\n\n      <!-- suffix slot -->\n      <span v-if=\"suffixVisible\" class=\"el-input__suffix\">\n        <span class=\"el-input__suffix-inner\">\n          <template v-if=\"!showClear || !showPwdVisible || !isWordLimitVisible\">\n            <slot name=\"suffix\"></slot>\n            <ps-icon v-if=\"suffixIcon\" class=\"el-input__icon\">\n              <component :is=\"suffixIcon\" />\n            </ps-icon>\n          </template>\n          <ps-icon\n            v-if=\"showClear\"\n            class=\"el-input__icon el-input__clear\"\n          >\n            <circle-close />\n          </ps-icon>\n          <ps-icon\n            v-if=\"showPwdVisible\"\n            class=\"el-input__icon el-input__clear\"\n          >\n            <icon-view />\n          </ps-icon>\n          <span v-if=\"isWordLimitVisible\" class=\"el-input__count\">\n            <span class=\"el-input__count-inner\">\n              {{ textLength }} / {{ attrs.maxlength }}\n            </span>\n          </span>\n        </span>\n        <ps-icon\n          v-if=\"validateState && validateIcon\"\n          class=\"el-input__icon el-input__validateIcon\"\n        >\n          <component :is=\"validateIcon\" />\n        </ps-icon>\n      </span>\n\n      <!-- append slot -->\n      <div v-if=\"$slots.append\" class=\"el-input-group__append\">\n        <slot name=\"append\" />\n      </div>\n    </template>\n\n    <!-- textarea -->\n    <template v-else>\n      <textarea\n        ref=\"textarea\"\n        class=\"el-textarea__inner\"\n        v-bind=\"attrs\"\n        :tabindex=\"tabindex\"\n        :disabled=\"inputDisabled\"\n        :readonly=\"readonly\"\n        :autocomplete=\"autocomplete\"\n        :style=\"computedTextareaStyle\"\n        :aria-label=\"label\"\n        :placeholder=\"placeholder\"\n      />\n      <span v-if=\"isWordLimitVisible\" class=\"el-input__count\">\n        {{ textLength }} / {{ attrs.maxlength }}\n      </span>\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  inject,\n  computed,\n  watch,\n  nextTick,\n  getCurrentInstance,\n  ref,\n  shallowRef,\n  onMounted,\n  onUpdated,\n} from 'vue'\nimport { elFormKey, elFormItemKey } from '@element-ps/tokens'\nimport { useAttrs, useFormItem } from '@element-ps/hooks'\nimport { VALIDATE_STATE_MAP } from '@element-ps/utils/constants'\nimport { isObject } from '@element-ps/utils/util'\nimport isServer from '@element-ps/utils/isServer'\nimport { calcTextareaHeight } from './calc-textarea-height'\nimport { inputProps } from './input'\nimport type { StyleValue } from '@element-ps/utils/types'\nimport { PsIcon } from '@element-ps/components/icon'\nimport { CircleClose, View as IconView } from '@element-plus/icons'\n\nconst PENDANT_MAP = {\n  suffix: 'append',\n  prefix: 'prepend',\n} as const\n\nexport default defineComponent({\n  name: 'PsInput',\n  inheritAttrs: false,\n  components: { PsIcon, CircleClose, IconView },\n  props: inputProps,\n\n  setup(props, { slots, attrs: rawAttrs }) {\n    const instance = getCurrentInstance()!\n    const attrs = useAttrs()\n\n    const elForm = inject(elFormKey, undefined)\n    const elFormItem = inject(elFormItemKey, undefined)\n\n    const { size: inputSize, disabled: inputDisabled } = useFormItem({})\n\n    const input = ref<HTMLInputElement>()\n    const textarea = ref<HTMLTextAreaElement>()\n    const focused = ref(false)\n    const hovering = ref(false)\n    const passwordVisible = ref(false)\n    const _textareaCalcStyle = shallowRef(props.inputStyle)\n\n    const inputOrTextarea = computed(() => input.value || textarea.value)\n    const needStatusIcon = computed(() => elForm?.statusIcon ?? false)\n    const validateState = computed(() => elFormItem?.validateState || '')\n    const validateIcon = computed(() => VALIDATE_STATE_MAP[validateState.value])\n    const containerStyle = computed(() => rawAttrs.style as StyleValue)\n    const computedTextareaStyle = computed<StyleValue>(() => [\n      props.inputStyle,\n      _textareaCalcStyle.value,\n      { resize: props.resize },\n    ])\n    const nativeInputValue = computed(() =>\n      props.modelValue === null || props.modelValue === undefined\n        ? ''\n        : String(props.modelValue)\n    )\n    const showClear = computed(\n      () =>\n        props.clearable &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        !!nativeInputValue.value &&\n        (focused.value || hovering.value)\n    )\n    const showPwdVisible = computed(\n      () =>\n        props.showPassword &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        (!!nativeInputValue.value || focused.value)\n    )\n    const isWordLimitVisible = computed(\n      () =>\n        props.showWordLimit &&\n        !!attrs.value.maxlength &&\n        (props.type === 'text' || props.type === 'textarea') &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        !props.showPassword\n    )\n    const textLength = computed(() => Array.from(nativeInputValue.value).length)\n    const inputExceed = computed(\n      () =>\n        // show exceed style if length of initial value greater then maxlength\n        !!isWordLimitVisible.value &&\n        textLength.value > Number(attrs.value.maxlength)\n    )\n\n    const resizeTextarea = () => {\n      const { type, autosize } = props\n\n      if (isServer || type !== 'textarea') return\n\n      if (autosize) {\n        const minRows = isObject(autosize) ? autosize.minRows : undefined\n        const maxRows = isObject(autosize) ? autosize.maxRows : undefined\n        _textareaCalcStyle.value = {\n          ...calcTextareaHeight(textarea.value!, minRows, maxRows),\n        }\n      } else {\n        _textareaCalcStyle.value = {\n          minHeight: calcTextareaHeight(textarea.value!).minHeight,\n        }\n      }\n    }\n\n    const setNativeInputValue = () => {\n      const input = inputOrTextarea.value\n      if (!input || input.value === nativeInputValue.value) return\n      input.value = nativeInputValue.value\n    }\n\n    const calcIconOffset = (place: 'prefix' | 'suffix') => {\n      const { el } = instance.vnode\n      if (!el) return\n      const elList: HTMLSpanElement[] = Array.from(\n        el.querySelectorAll(`.el-input__${place}`)\n      )\n      const target = elList.find((item) => item.parentNode === el)\n\n      if (!target) return\n\n      const pendant = PENDANT_MAP[place]\n\n      if (slots[pendant]) {\n        target.style.transform = `translateX(${place === 'suffix' ? '-' : ''}${\n          el.querySelector(`.el-input-group__${pendant}`).offsetWidth\n        }px)`\n      } else {\n        target.removeAttribute('style')\n      }\n    }\n\n    const updateIconOffset = () => {\n      calcIconOffset('prefix')\n      calcIconOffset('suffix')\n    }\n\n    const suffixVisible = computed(\n      () =>\n        !!slots.suffix ||\n        !!props.suffixIcon ||\n        showClear.value ||\n        props.showPassword ||\n        isWordLimitVisible.value ||\n        (!!validateState.value && needStatusIcon.value)\n    )\n\n    watch(\n      () => props.modelValue,\n      () => {\n        nextTick(resizeTextarea)\n        if (props.validateEvent) {\n          elFormItem?.validate?.('change')\n        }\n      }\n    )\n\n    // native input value is set explicitly\n    // do not use v-model / :value in template\n    // see: https://github.com/ElemeFE/element/issues/14521\n    watch(nativeInputValue, () => setNativeInputValue())\n\n    // when change between <input> and <textarea>,\n    // update DOM dependent value and styles\n    // https://github.com/ElemeFE/element/issues/14857\n    watch(\n      () => props.type,\n      () => {\n        nextTick(() => {\n          setNativeInputValue()\n          resizeTextarea()\n          updateIconOffset()\n        })\n      }\n    )\n\n    onMounted(() => {\n      setNativeInputValue()\n      updateIconOffset()\n      nextTick(resizeTextarea)\n    })\n\n    onUpdated(() => {\n      nextTick(updateIconOffset)\n    })\n\n    return {\n      input,\n      textarea,\n      attrs,\n      inputSize,\n      validateState,\n      validateIcon,\n      containerStyle,\n      computedTextareaStyle,\n      inputDisabled,\n      showClear,\n      showPwdVisible,\n      isWordLimitVisible,\n      textLength,\n      hovering,\n      inputExceed,\n      passwordVisible,\n      inputOrTextarea,\n      suffixVisible,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_createCommentVNode","_renderSlot","_createElementVNode","_mergeProps","_createBlock","_createVNode"],"mappings":";;;;;;;;EAwBiC,OAAM;AAAA;;;;EAmBQ,OAAM;AAAA;qBACvC,OAAM;;;EASa,OAAM;AAAA;qBACzB,OAAM;;;EAmBsB,OAAM;AAAA;qBAC9B,OAAM;;;EAcQ,OAAM;AAAA;;;;EAmBA,OAAM;AAAA;;;;;8CA1G1CA;IAEG;;;;;;;;;;;;;;;IAgBA,0BAAO;;IAERC;IACgB,6CAAhBD;MACEC;MACW,YAAO,4BAAlBD,8BAAA;QACEE;;MAGFC,gCAAAC;QACE,KAAI;AAAA,QACJ,OAAM;AAAA,SACE;QACP,MAAM,oBAAgB,6CAAyC;QAC/D,UAAU;QACV,UAAU;QACV,cAAc;QACd,UAAU;QACV,cAAY;QACZ,aAAa;QACb,OAAO;;MAGVH;MACY,YAAO,UAAU,oCAA7BD,+BAAA;QACEG,+BAAA;UACED;UACe,oCAAfG;;YAA2B,OAAM;AAAA;iCAC/B;gCAAAA,4CAAgB;;;;;;MAKtBJ;MACY,uCAAZD,+BAAA;QACEG,+BAAA;WACmB,mBAAc,wBAAmB,4CAAlDH;YACEE;YACe,oCAAfG;;cAA2B,OAAM;AAAA;mCAC/B;kCAAAA,4CAAgB;;;;;UAIZ,mCADRA;;YAEE,OAAM;AAAA;iCAEN;cAAAC;;;;UAGM,wCADRD;;YAEE,OAAM;AAAA;iCAEN;cAAAC;;;;UAEU,4CAAZN,+BAAA;YACEG,+BAAA,gCACK,+CAAmB,WAAM;;;QAK1B,sBAAiB,sCADzBE;;UAEE,OAAM;AAAA;+BAEN;8BAAAA,4CAAgB;;;;;MAIpBJ;MACW,YAAO,2BAAlBD,8BAAA;QACEE;;gCAKJF;MADAC;MAEEE,mCAAAC;QACE,KAAI;AAAA,QACJ,OAAM;AAAA,SACE;QACP,UAAU;QACV,UAAU;QACV,UAAU;QACV,cAAc;QACd,OAAO;QACP,cAAY;QACZ,aAAa;;MAEJ,4CAAZJ,+BAAA,iCACK,+CAAmB,WAAM;;;gBA1GxB;;;;;;"}
+{"version":3,"file":"input.vue_vue&type=template&id=3290dcb6&lang.js","sources":["../../../../../../../packages/components/input/src/input.vue?vue&type=template&id=3290dcb6&lang.js"],"sourcesContent":["<template>\n  <div\n    v-show=\"type !== 'hidden'\"\n    :class=\"[\n      type === 'textarea' ? 'el-textarea' : 'el-input',\n      inputSize ? 'el-input--' + inputSize : '',\n      {\n        'is-disabled': inputDisabled,\n        'is-exceed': inputExceed,\n        'el-input-group': $slots.prepend || $slots.append,\n        'el-input-group--append': $slots.append,\n        'el-input-group--prepend': $slots.prepend,\n        'el-input--prefix': $slots.prefix || prefixIcon,\n        'el-input--suffix':\n          $slots.suffix || suffixIcon || clearable || showPassword,\n        'el-input--suffix--password-clear': clearable && showPassword,\n      },\n      $attrs.class,\n    ]\"\n    :style=\"containerStyle\"\n    :widget=\"widget\"\n  >\n    <!-- input -->\n    <template v-if=\"type !== 'textarea'\">\n      <!-- prepend slot -->\n      <div v-if=\"$slots.prepend\" class=\"el-input-group__prepend\">\n        <slot name=\"prepend\" />\n      </div>\n\n      <input\n        ref=\"input\"\n        class=\"el-input__inner\"\n        v-bind=\"attrs\"\n        :type=\"showPassword ? (passwordVisible ? 'text' : 'password') : type\"\n        :disabled=\"inputDisabled\"\n        :readonly=\"readonly\"\n        :autocomplete=\"autocomplete\"\n        :tabindex=\"tabindex\"\n        :aria-label=\"label\"\n        :placeholder=\"placeholder\"\n        :style=\"inputStyle\"\n      />\n\n      <!-- prefix slot -->\n      <span v-if=\"$slots.prefix || prefixIcon\" class=\"el-input__prefix\">\n        <span class=\"el-input__prefix-inner\">\n          <slot name=\"prefix\"></slot>\n          <ps-icon v-if=\"prefixIcon\" class=\"el-input__icon\">\n            <component :is=\"prefixIcon\" />\n          </ps-icon>\n        </span>\n      </span>\n\n      <!-- suffix slot -->\n      <span v-if=\"suffixVisible\" class=\"el-input__suffix\">\n        <span class=\"el-input__suffix-inner\">\n          <template v-if=\"!showClear || !showPwdVisible || !isWordLimitVisible\">\n            <slot name=\"suffix\"></slot>\n            <ps-icon v-if=\"suffixIcon\" class=\"el-input__icon\">\n              <component :is=\"suffixIcon\" />\n            </ps-icon>\n          </template>\n          <ps-icon v-if=\"showClear\" class=\"el-input__icon el-input__clear\">\n            <circle-close />\n          </ps-icon>\n          <ps-icon v-if=\"showPwdVisible\" class=\"el-input__icon el-input__clear\">\n            <icon-view />\n          </ps-icon>\n          <span v-if=\"isWordLimitVisible\" class=\"el-input__count\">\n            <span class=\"el-input__count-inner\">\n              {{ textLength }} / {{ attrs.maxlength }}\n            </span>\n          </span>\n        </span>\n        <ps-icon\n          v-if=\"validateState && validateIcon\"\n          class=\"el-input__icon el-input__validateIcon\"\n        >\n          <component :is=\"validateIcon\" />\n        </ps-icon>\n      </span>\n\n      <!-- append slot -->\n      <div v-if=\"$slots.append\" class=\"el-input-group__append\">\n        <slot name=\"append\" />\n      </div>\n    </template>\n\n    <!-- textarea -->\n    <template v-else>\n      <textarea\n        ref=\"textarea\"\n        class=\"el-textarea__inner\"\n        v-bind=\"attrs\"\n        :tabindex=\"tabindex\"\n        :disabled=\"inputDisabled\"\n        :readonly=\"readonly\"\n        :autocomplete=\"autocomplete\"\n        :style=\"computedTextareaStyle\"\n        :aria-label=\"label\"\n        :placeholder=\"placeholder\"\n      />\n      <span v-if=\"isWordLimitVisible\" class=\"el-input__count\">\n        {{ textLength }} / {{ attrs.maxlength }}\n      </span>\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  inject,\n  computed,\n  watch,\n  nextTick,\n  getCurrentInstance,\n  ref,\n  shallowRef,\n  onMounted,\n  onUpdated,\n} from 'vue'\nimport { elFormKey, elFormItemKey } from '@element-ps/tokens'\nimport { useAttrs, useFormItem } from '@element-ps/hooks'\nimport { VALIDATE_STATE_MAP } from '@element-ps/utils/constants'\nimport { isObject } from '@element-ps/utils/util'\nimport isServer from '@element-ps/utils/isServer'\nimport { calcTextareaHeight } from './calc-textarea-height'\nimport { inputProps } from './input'\nimport type { StyleValue } from '@element-ps/utils/types'\nimport { PsIcon } from '@element-ps/components/icon'\nimport { CircleClose, View as IconView } from '@element-plus/icons'\n\nconst PENDANT_MAP = {\n  suffix: 'append',\n  prefix: 'prepend',\n} as const\n\nexport default defineComponent({\n  name: 'PsInput',\n  inheritAttrs: false,\n  components: { PsIcon, CircleClose, IconView },\n  props: inputProps,\n\n  setup(props, { slots, attrs: rawAttrs }) {\n    const instance = getCurrentInstance()!\n    const attrs = useAttrs()\n\n    const elForm = inject(elFormKey, undefined)\n    const elFormItem = inject(elFormItemKey, undefined)\n\n    const { size: inputSize, disabled: inputDisabled } = useFormItem({})\n\n    const input = ref<HTMLInputElement>()\n    const textarea = ref<HTMLTextAreaElement>()\n    const focused = ref(false)\n    const hovering = ref(false)\n    const passwordVisible = ref(false)\n    const _textareaCalcStyle = shallowRef(props.inputStyle)\n\n    const inputOrTextarea = computed(() => input.value || textarea.value)\n    const needStatusIcon = computed(() => elForm?.statusIcon ?? false)\n    const validateState = computed(() => elFormItem?.validateState || '')\n    const validateIcon = computed(() => VALIDATE_STATE_MAP[validateState.value])\n    const containerStyle = computed(() => rawAttrs.style as StyleValue)\n    const computedTextareaStyle = computed<StyleValue>(() => [\n      props.inputStyle,\n      _textareaCalcStyle.value,\n      { resize: props.resize },\n    ])\n    const nativeInputValue = computed(() =>\n      props.modelValue === null || props.modelValue === undefined\n        ? ''\n        : String(props.modelValue)\n    )\n    const showClear = computed(\n      () =>\n        props.clearable &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        !!nativeInputValue.value &&\n        (focused.value || hovering.value)\n    )\n    const showPwdVisible = computed(\n      () =>\n        props.showPassword &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        (!!nativeInputValue.value || focused.value)\n    )\n    const isWordLimitVisible = computed(\n      () =>\n        props.showWordLimit &&\n        !!attrs.value.maxlength &&\n        (props.type === 'text' || props.type === 'textarea') &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        !props.showPassword\n    )\n    const textLength = computed(() => Array.from(nativeInputValue.value).length)\n    const inputExceed = computed(\n      () =>\n        // show exceed style if length of initial value greater then maxlength\n        !!isWordLimitVisible.value &&\n        textLength.value > Number(attrs.value.maxlength)\n    )\n\n    const resizeTextarea = () => {\n      const { type, autosize } = props\n\n      if (isServer || type !== 'textarea') return\n\n      if (autosize) {\n        const minRows = isObject(autosize) ? autosize.minRows : undefined\n        const maxRows = isObject(autosize) ? autosize.maxRows : undefined\n        _textareaCalcStyle.value = {\n          ...calcTextareaHeight(textarea.value!, minRows, maxRows),\n        }\n      } else {\n        _textareaCalcStyle.value = {\n          minHeight: calcTextareaHeight(textarea.value!).minHeight,\n        }\n      }\n    }\n\n    const setNativeInputValue = () => {\n      const input = inputOrTextarea.value\n      if (!input || input.value === nativeInputValue.value) return\n      input.value = nativeInputValue.value\n    }\n\n    const calcIconOffset = (place: 'prefix' | 'suffix') => {\n      const { el } = instance.vnode\n      if (!el) return\n      const elList: HTMLSpanElement[] = Array.from(\n        el.querySelectorAll(`.el-input__${place}`)\n      )\n      const target = elList.find((item) => item.parentNode === el)\n\n      if (!target) return\n\n      const pendant = PENDANT_MAP[place]\n\n      if (slots[pendant]) {\n        target.style.transform = `translateX(${place === 'suffix' ? '-' : ''}${\n          el.querySelector(`.el-input-group__${pendant}`).offsetWidth\n        }px)`\n      } else {\n        target.removeAttribute('style')\n      }\n    }\n\n    const updateIconOffset = () => {\n      calcIconOffset('prefix')\n      calcIconOffset('suffix')\n    }\n\n    const suffixVisible = computed(\n      () =>\n        !!slots.suffix ||\n        !!props.suffixIcon ||\n        showClear.value ||\n        props.showPassword ||\n        isWordLimitVisible.value ||\n        (!!validateState.value && needStatusIcon.value)\n    )\n\n    watch(\n      () => props.modelValue,\n      () => {\n        nextTick(resizeTextarea)\n        if (props.validateEvent) {\n          elFormItem?.validate?.('change')\n        }\n      }\n    )\n\n    // native input value is set explicitly\n    // do not use v-model / :value in template\n    // see: https://github.com/ElemeFE/element/issues/14521\n    watch(nativeInputValue, () => setNativeInputValue())\n\n    // when change between <input> and <textarea>,\n    // update DOM dependent value and styles\n    // https://github.com/ElemeFE/element/issues/14857\n    watch(\n      () => props.type,\n      () => {\n        nextTick(() => {\n          setNativeInputValue()\n          resizeTextarea()\n          updateIconOffset()\n        })\n      }\n    )\n\n    onMounted(() => {\n      setNativeInputValue()\n      updateIconOffset()\n      nextTick(resizeTextarea)\n    })\n\n    onUpdated(() => {\n      nextTick(updateIconOffset)\n    })\n\n    return {\n      input,\n      textarea,\n      attrs,\n      inputSize,\n      validateState,\n      validateIcon,\n      containerStyle,\n      computedTextareaStyle,\n      inputDisabled,\n      showClear,\n      showPwdVisible,\n      isWordLimitVisible,\n      textLength,\n      hovering,\n      inputExceed,\n      passwordVisible,\n      inputOrTextarea,\n      suffixVisible,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_createCommentVNode","_renderSlot","_createElementVNode","_mergeProps","_createBlock","_createVNode"],"mappings":";;;;;;;;;EAyBiC,OAAM;AAAA;;;;EAmBQ,OAAM;AAAA;qBACvC,OAAM;;;EASa,OAAM;AAAA;qBACzB,OAAM;;;EAasB,OAAM;AAAA;qBAC9B,OAAM;;;EAcQ,OAAM;AAAA;;;;EAmBA,OAAM;AAAA;;;;;8CArG1CA;IAEG;;;;;;;;;;;;;;;IAgBA,0BAAO;IACP,QAAQ;;IAETC;IACgB,6CAAhBD;MACEC;MACW,YAAO,4BAAlBD,8BAAA;QACEE;;MAGFC,gCAAAC;QACE,KAAI;AAAA,QACJ,OAAM;AAAA,SACE;QACP,MAAM,oBAAgB,6CAAyC;QAC/D,UAAU;QACV,UAAU;QACV,cAAc;QACd,UAAU;QACV,cAAY;QACZ,aAAa;QACb,OAAO;;MAGVH;MACY,YAAO,UAAU,oCAA7BD,+BAAA;QACEG,+BAAA;UACED;UACe,oCAAfG;;YAA2B,OAAM;AAAA;iCAC/B;gCAAAA,4CAAgB;;;;;;MAKtBJ;MACY,uCAAZD,+BAAA;QACEG,+BAAA;WACmB,mBAAc,wBAAmB,4CAAlDH;YACEE;YACe,oCAAfG;;cAA2B,OAAM;AAAA;mCAC/B;kCAAAA,4CAAgB;;;;;UAGL,mCAAfA;;YAA0B,OAAM;AAAA;iCAC9B;cAAAC;;;;UAEa,wCAAfD;;YAA+B,OAAM;AAAA;iCACnC;cAAAC;;;;UAEU,4CAAZN,+BAAA;YACEG,+BAAA,gCACK,+CAAmB,WAAM;;;QAK1B,sBAAiB,sCADzBE;;UAEE,OAAM;AAAA;+BAEN;8BAAAA,4CAAgB;;;;;MAIpBJ;MACW,YAAO,2BAAlBD,8BAAA;QACEE;;gCAKJF;MADAC;MAEEE,mCAAAC;QACE,KAAI;AAAA,QACJ,OAAM;AAAA,SACE;QACP,UAAU;QACV,UAAU;QACV,UAAU;QACV,cAAc;QACd,OAAO;QACP,cAAY;QACZ,aAAa;;MAEJ,4CAAZJ,+BAAA,iCACK,+CAAmB,WAAM;;;gBArGxB;;;;;;"}

package/lib/packages/components/page-header/index.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var withInstall = require('../../utils/with-install.js');
-require('./src/page-header.js');
-var pageHeader = require('./src/page-header2.js');
+require('./src/page-header2.js');
+var pageHeader = require('./src/page-header.js');
 var pageHeader_vue_vue_type_script_lang = require('./src/page-header.vue_vue&type=script&lang.js');
 
 const PsPageHeader = withInstall.withInstall(pageHeader_vue_vue_type_script_lang["default"]);

package/lib/packages/components/page-header/src/page-header.js

@@ -2,11 +2,19 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var pageHeader_vue_vue_type_script_lang = require('./page-header.vue_vue&type=script&lang.js');
-var pageHeader_vue_vue_type_template_id_d12fb4b2_lang = require('./page-header.vue_vue&type=template&id=d12fb4b2&lang.js');
+var icons = require('@element-plus/icons');
 
-pageHeader_vue_vue_type_script_lang["default"].render = pageHeader_vue_vue_type_template_id_d12fb4b2_lang.render;
-pageHeader_vue_vue_type_script_lang["default"].__file = "packages/components/page-header/src/page-header.vue";
+const pageHeaderProps = {
+  icon: {
+    type: [String, Object],
+    default: icons.Back
+  },
+  title: String,
+  content: {
+    type: String,
+    default: ""
+  }
+};
 
-exports["default"] = pageHeader_vue_vue_type_script_lang["default"];
+exports.pageHeaderProps = pageHeaderProps;
 //# sourceMappingURL=page-header.js.map

package/lib/packages/components/page-header/src/page-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"page-header.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}
+{"version":3,"file":"page-header.js","sources":["../../../../../../../packages/components/page-header/src/page-header.ts"],"sourcesContent":["import { Back } from '@element-plus/icons'\nimport type { ExtractPropTypes, PropType, Component } from 'vue'\n\nexport const pageHeaderProps = {\n  icon: {\n    type: [String, Object] as PropType<string | Component>,\n    default: Back,\n  },\n  title: String,\n  content: {\n    type: String,\n    default: '',\n  },\n} as const\nexport type PageHeaderProps = ExtractPropTypes<typeof pageHeaderProps>\n"],"names":["Back"],"mappings":";;;;;;MAGa,kBAAkB;AAAA,EAC7B,MAAM;AAAA,IACJ,MAAM,CAAC,QAAQ;AAAA,IACf,SAASA;AAAA;AAAA,EAEX,OAAO;AAAA,EACP,SAAS;AAAA,IACP,MAAM;AAAA,IACN,SAAS;AAAA;AAAA;;;;"}

package/lib/packages/components/page-header/src/page-header.vue_vue&type=script&lang.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
 require('../../../hooks/index.js');
-var pageHeader = require('./page-header2.js');
+var pageHeader = require('./page-header.js');
 var index = require('../../icon/index.js');
 var index$1 = require('../../../hooks/use-locale/index.js');
 

package/lib/packages/components/page-header/src/page-header2.js

@@ -2,19 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var icons = require('@element-plus/icons');
+var pageHeader_vue_vue_type_script_lang = require('./page-header.vue_vue&type=script&lang.js');
+var pageHeader_vue_vue_type_template_id_d12fb4b2_lang = require('./page-header.vue_vue&type=template&id=d12fb4b2&lang.js');
 
-const pageHeaderProps = {
-  icon: {
-    type: [String, Object],
-    default: icons.Back
-  },
-  title: String,
-  content: {
-    type: String,
-    default: ""
-  }
-};
+pageHeader_vue_vue_type_script_lang["default"].render = pageHeader_vue_vue_type_template_id_d12fb4b2_lang.render;
+pageHeader_vue_vue_type_script_lang["default"].__file = "packages/components/page-header/src/page-header.vue";
 
-exports.pageHeaderProps = pageHeaderProps;
+exports["default"] = pageHeader_vue_vue_type_script_lang["default"];
 //# sourceMappingURL=page-header2.js.map

package/lib/packages/components/page-header/src/page-header2.js.map

@@ -1 +1 @@
-{"version":3,"file":"page-header2.js","sources":["../../../../../../../packages/components/page-header/src/page-header.ts"],"sourcesContent":["import { Back } from '@element-plus/icons'\nimport type { ExtractPropTypes, PropType, Component } from 'vue'\n\nexport const pageHeaderProps = {\n  icon: {\n    type: [String, Object] as PropType<string | Component>,\n    default: Back,\n  },\n  title: String,\n  content: {\n    type: String,\n    default: '',\n  },\n} as const\nexport type PageHeaderProps = ExtractPropTypes<typeof pageHeaderProps>\n"],"names":["Back"],"mappings":";;;;;;MAGa,kBAAkB;AAAA,EAC7B,MAAM;AAAA,IACJ,MAAM,CAAC,QAAQ;AAAA,IACf,SAASA;AAAA;AAAA,EAEX,OAAO;AAAA,EACP,SAAS;AAAA,IACP,MAAM;AAAA,IACN,SAAS;AAAA;AAAA;;;;"}
+{"version":3,"file":"page-header2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}

package/lib/packages/components/popconfirm/src/popconfirm.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 require('../../button/index.js');
 var props = require('../../../utils/props.js');
-var button = require('../../button/src/button2.js');
+var button = require('../../button/src/button.js');
 
 const popconfirmProps = props.buildProps({
   title: {

package/lib/packages/components/tabs/src/tabs.js

@@ -81,12 +81,10 @@ var Tabs = vue.defineComponent({
         panes.value = [];
       }
     };
-    vue.onUpdated(() => {
-      setPaneInstances();
-    });
-    vue.onMounted(() => {
-      setPaneInstances();
-    });
+    vue.onUpdated(() => setPaneInstances());
+    vue.onMounted(() => setPaneInstances());
+    vue.watch(() => props.activeName, (modelValue) => currentName.value = modelValue);
+    vue.watch(() => props.modelValue, (modelValue) => currentName.value = modelValue);
     return {
       nav$,
       currentName,

package/lib/packages/components/tabs/src/tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","sources":["../../../../../../../packages/components/tabs/src/tabs.ts"],"sourcesContent":["import {\n  defineComponent,\n  Fragment,\n  getCurrentInstance,\n  h,\n  onMounted,\n  onUpdated,\n  provide,\n  ref,\n} from 'vue'\nimport { Plus } from '@element-plus/icons'\nimport PsIcon from '@element-ps/components/icon'\nimport TabNav from './tab-nav.vue'\n\nimport type { Component, ComponentInternalInstance, PropType, VNode } from 'vue'\nimport type {\n  BeforeLeave,\n  IElTabsProps,\n  ITabType,\n  ITabPosition,\n  Pane,\n  RootTabs,\n  UpdatePaneStateCallback,\n} from './token'\n\nexport default defineComponent({\n  name: 'PsTabs',\n  components: { TabNav },\n  props: {\n    type: {\n      type: String as PropType<ITabType>,\n      default: '',\n    },\n    activeName: {\n      type: String,\n      default: '',\n    },\n    closable: Boolean,\n    addable: Boolean,\n    modelValue: {\n      type: String,\n      default: '',\n    },\n    editable: Boolean,\n    tabPosition: {\n      type: String as PropType<ITabPosition>,\n      default: 'top',\n    },\n    beforeLeave: {\n      type: Function as PropType<BeforeLeave>,\n      default: null,\n    },\n    stretch: Boolean,\n  },\n  setup(props: IElTabsProps, ctx) {\n    const nav$ = ref<typeof TabNav>(null)\n    const currentName = ref(props.modelValue || props.activeName || '0')\n    const panes = ref([])\n    const instance = getCurrentInstance()\n    const paneStatesMap = {}\n\n    provide<RootTabs>('rootTabs', {\n      props,\n      currentName,\n    })\n\n    provide<UpdatePaneStateCallback>('updatePaneState', (pane: Pane) => {\n      paneStatesMap[pane.uid] = pane\n    })\n\n    const getPaneInstanceFromSlot = (\n      vnode: VNode,\n      paneInstanceList: ComponentInternalInstance[] = []\n    ) => {\n      Array.from((vnode.children || []) as ArrayLike<VNode>).forEach((node) => {\n        let type = node.type\n        type = (type as Component).name || type\n        if (type === 'PsTabPane' && node.component) {\n          paneInstanceList.push(node.component)\n        } else if (type === Fragment || type === 'template') {\n          getPaneInstanceFromSlot(node, paneInstanceList)\n        }\n      })\n      return paneInstanceList\n    }\n\n    const setPaneInstances = (isForceUpdate = false) => {\n      if (ctx.slots.default) {\n        const children = instance.subTree.children\n\n        const content = Array.from(children as ArrayLike<VNode>).find(\n          ({ props }) => {\n            return props.class === 'el-tabs__content'\n          }\n        )\n\n        if (!content) return\n\n        const paneInstanceList: Pane[] = getPaneInstanceFromSlot(content).map(\n          (paneComponent) => {\n            return paneStatesMap[paneComponent.uid]\n          }\n        )\n        const panesChanged = !(\n          paneInstanceList.length === panes.value.length &&\n          paneInstanceList.every(\n            (pane, index) => pane.uid === panes.value[index].uid\n          )\n        )\n\n        if (isForceUpdate || panesChanged) {\n          panes.value = paneInstanceList\n        }\n      } else if (panes.value.length !== 0) {\n        panes.value = []\n      }\n    }\n\n    onUpdated(() => {\n      setPaneInstances()\n    })\n\n    onMounted(() => {\n      setPaneInstances()\n    })\n\n    return {\n      nav$,\n      currentName,\n      panes,\n    }\n  },\n\n  render() {\n    const {\n      type,\n      currentName,\n      panes,\n      editable,\n      addable,\n      tabPosition,\n      stretch,\n    } = this\n\n    const newButton =\n      editable || addable\n        ? h(\n            'span',\n            {\n              class: 'el-tabs__new-tab',\n              tabindex: '0',\n            },\n          [h(PsIcon, { class: 'is-icon-plus' }, { default: () => h(Plus) })]\n          )\n        : null\n\n    const header = h(\n      'div',\n      {\n        class: ['el-tabs__header', `is-${tabPosition}`],\n      },\n      [\n        newButton,\n        h(TabNav, {\n          currentName,\n          editable,\n          type,\n          panes,\n          stretch,\n          ref: 'nav$',\n        }),\n      ]\n    )\n\n    const panels = h(\n      'div',\n      {\n        class: 'el-tabs__content',\n      },\n      this.$slots?.default()\n    )\n\n    return h(\n      'div',\n      {\n        class: {\n          'el-tabs': true,\n          'el-tabs--card': type === 'card',\n          [`el-tabs--${tabPosition}`]: true,\n          'el-tabs--border-card': type === 'border-card',\n        },\n      },\n      tabPosition !== 'bottom' ? [header, panels] : [panels, header]\n    )\n  },\n})\n"],"names":["defineComponent","TabNav","ref","getCurrentInstance","Fragment","h","PsIcon","Plus"],"mappings":"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"}
+{"version":3,"file":"tabs.js","sources":["../../../../../../../packages/components/tabs/src/tabs.ts"],"sourcesContent":["import {\n  defineComponent,\n  Fragment,\n  getCurrentInstance,\n  h,\n  onMounted,\n  onUpdated,\n  provide,\n  ref, watch,\n} from 'vue'\nimport { Plus } from '@element-plus/icons'\nimport PsIcon from '@element-ps/components/icon'\nimport TabNav from './tab-nav.vue'\n\nimport type { Component, ComponentInternalInstance, PropType, VNode } from 'vue'\nimport type {\n  BeforeLeave,\n  IElTabsProps,\n  ITabType,\n  ITabPosition,\n  Pane,\n  RootTabs,\n  UpdatePaneStateCallback,\n} from './token'\n\nexport default defineComponent({\n  name: 'PsTabs',\n  components: { TabNav },\n  props: {\n    type: {\n      type: String as PropType<ITabType>,\n      default: '',\n    },\n    activeName: {\n      type: String,\n      default: '',\n    },\n    closable: Boolean,\n    addable: Boolean,\n    modelValue: {\n      type: String,\n      default: '',\n    },\n    editable: Boolean,\n    tabPosition: {\n      type: String as PropType<ITabPosition>,\n      default: 'top',\n    },\n    beforeLeave: {\n      type: Function as PropType<BeforeLeave>,\n      default: null,\n    },\n    stretch: Boolean,\n  },\n  setup(props: IElTabsProps, ctx) {\n    const nav$ = ref<typeof TabNav>(null)\n    const currentName = ref(props.modelValue || props.activeName || '0')\n    const panes = ref([])\n    const instance = getCurrentInstance()\n    const paneStatesMap = {}\n\n    provide<RootTabs>('rootTabs', {\n      props,\n      currentName,\n    })\n\n    provide<UpdatePaneStateCallback>('updatePaneState', (pane: Pane) => {\n      paneStatesMap[pane.uid] = pane\n    })\n\n    const getPaneInstanceFromSlot = (\n      vnode: VNode,\n      paneInstanceList: ComponentInternalInstance[] = []\n    ) => {\n      Array.from((vnode.children || []) as ArrayLike<VNode>).forEach((node) => {\n        let type = node.type\n        type = (type as Component).name || type\n        if (type === 'PsTabPane' && node.component) {\n          paneInstanceList.push(node.component)\n        } else if (type === Fragment || type === 'template') {\n          getPaneInstanceFromSlot(node, paneInstanceList)\n        }\n      })\n      return paneInstanceList\n    }\n\n    const setPaneInstances = (isForceUpdate = false) => {\n      if (ctx.slots.default) {\n        const children = instance.subTree.children\n\n        const content = Array.from(children as ArrayLike<VNode>).find(\n          ({ props }) => {\n            return props.class === 'el-tabs__content'\n          }\n        )\n\n        if (!content) return\n\n        const paneInstanceList: Pane[] = getPaneInstanceFromSlot(content).map(\n          (paneComponent) => {\n            return paneStatesMap[paneComponent.uid]\n          }\n        )\n        const panesChanged = !(\n          paneInstanceList.length === panes.value.length &&\n          paneInstanceList.every(\n            (pane, index) => pane.uid === panes.value[index].uid\n          )\n        )\n\n        if (isForceUpdate || panesChanged) {\n          panes.value = paneInstanceList\n        }\n      } else if (panes.value.length !== 0) {\n        panes.value = []\n      }\n    }\n\n    onUpdated(() => setPaneInstances())\n    onMounted(() => setPaneInstances())\n\n    watch(\n      () => props.activeName,\n      (modelValue) => currentName.value = modelValue\n    )\n\n    watch(\n      () => props.modelValue,\n      (modelValue) => currentName.value = modelValue\n    )\n\n    return {\n      nav$,\n      currentName,\n      panes,\n    }\n  },\n\n  render() {\n    const {\n      type,\n      currentName,\n      panes,\n      editable,\n      addable,\n      tabPosition,\n      stretch,\n    } = this\n\n    const newButton =\n      editable || addable\n        ? h(\n            'span',\n            {\n              class: 'el-tabs__new-tab',\n              tabindex: '0',\n            },\n          [h(PsIcon, { class: 'is-icon-plus' }, { default: () => h(Plus) })]\n          )\n        : null\n\n    const header = h(\n      'div',\n      {\n        class: ['el-tabs__header', `is-${tabPosition}`],\n      },\n      [\n        newButton,\n        h(TabNav, {\n          currentName,\n          editable,\n          type,\n          panes,\n          stretch,\n          ref: 'nav$',\n        }),\n      ]\n    )\n\n    const panels = h(\n      'div',\n      {\n        class: 'el-tabs__content',\n      },\n      this.$slots?.default()\n    )\n\n    return h(\n      'div',\n      {\n        class: {\n          'el-tabs': true,\n          'el-tabs--card': type === 'card',\n          [`el-tabs--${tabPosition}`]: true,\n          'el-tabs--border-card': type === 'border-card',\n        },\n      },\n      tabPosition !== 'bottom' ? [header, panels] : [panels, header]\n    )\n  },\n})\n"],"names":["defineComponent","TabNav","ref","getCurrentInstance","Fragment","h","PsIcon","Plus"],"mappings":"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"}

package/lib/utils/util.d.ts

@@ -31,4 +31,4 @@ export declare function deduplicate<T>(arr: T[]): T[];
 export declare function $<T>(ref: Ref<T>): T;
 export declare function addUnit(value: string | number): string;
 export declare function isEqualWithFunction(obj: any, other: any): boolean;
-export declare const refAttacher: <T extends ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | HTMLElement>(ref: Ref<T>) => (val: T) => void;
+export declare const refAttacher: <T extends HTMLElement | ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>>(ref: Ref<T>) => (val: T) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "element-ps",
-  "version": "1.0.4",
+  "version": "1.0.8",
   "description": "A Component Library for Vue 3",
   "homepage": "https://element-plus.org/",
   "keywords": [

package/web-types.json

@@ -1 +1 @@
-{"$schema":"https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json","framework":"vue","name":"element-ps","version":"1.0.4","contributions":{"html":{"types-syntax":"typescript","description-markup":"markdown"}}}
+{"$schema":"https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json","framework":"vue","name":"element-ps","version":"1.0.8","contributions":{"html":{"types-syntax":"typescript","description-markup":"markdown"}}}