@element-plus/nightly 0.0.20220202 → 0.0.20220206

package/es/components/tree/src/tree.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tree.mjs","sources":["../../../../../../packages/components/tree/src/tree.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"el$\"\n    class=\"el-tree\"\n    :class=\"{\n      'el-tree--highlight-current': highlightCurrent,\n      'is-dragging': !!dragState.draggingNode,\n      'is-drop-not-allow': !dragState.allowDrop,\n      'is-drop-inner': dragState.dropType === 'inner',\n    }\"\n    role=\"tree\"\n  >\n    <el-tree-node\n      v-for=\"child in root.childNodes\"\n      :key=\"getNodeKey(child)\"\n      :node=\"child\"\n      :props=\"props\"\n      :accordion=\"accordion\"\n      :render-after-expand=\"renderAfterExpand\"\n      :show-checkbox=\"showCheckbox\"\n      :render-content=\"renderContent\"\n      @node-expand=\"handleNodeExpand\"\n    />\n    <div v-if=\"isEmpty\" class=\"el-tree__empty-block\">\n      <span class=\"el-tree__empty-text\">{{\n        emptyText ?? t('el.tree.emptyText')\n      }}</span>\n    </div>\n    <div\n      v-show=\"dragState.showDropIndicator\"\n      ref=\"dropIndicator$\"\n      class=\"el-tree__drop-indicator\"\n    ></div>\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  ref,\n  provide,\n  computed,\n  watch,\n  getCurrentInstance,\n} from 'vue'\nimport { useLocale } from '@element-plus/hooks'\nimport TreeStore from './model/tree-store'\nimport { getNodeKey as getNodeKeyUtil } from './model/util'\nimport ElTreeNode from './tree-node.vue'\nimport { useNodeExpandEventBroadcast } from './model/useNodeExpandEventBroadcast'\nimport { useDragNodeHandler } from './model/useDragNode'\nimport { useKeydown } from './model/useKeydown'\nimport type Node from './model/node'\n\nimport type { ComponentInternalInstance, PropType, Component } from 'vue'\nimport type { Nullable } from '@element-plus/utils/types'\nimport type {\n  TreeComponentProps,\n  TreeNodeData,\n  TreeKey,\n  TreeData,\n} from './tree.type'\n\nexport default defineComponent({\n  name: 'ElTree',\n  components: { ElTreeNode },\n  props: {\n    data: {\n      type: Array,\n      default: () => [],\n    },\n    emptyText: {\n      type: String,\n    },\n    renderAfterExpand: {\n      type: Boolean,\n      default: true,\n    },\n    nodeKey: String,\n    checkStrictly: Boolean,\n    defaultExpandAll: Boolean,\n    expandOnClickNode: {\n      type: Boolean,\n      default: true,\n    },\n    checkOnClickNode: Boolean,\n    checkDescendants: {\n      type: Boolean,\n      default: false,\n    },\n    autoExpandParent: {\n      type: Boolean,\n      default: true,\n    },\n    defaultCheckedKeys: Array as PropType<\n      TreeComponentProps['defaultCheckedKeys']\n    >,\n    defaultExpandedKeys: Array as PropType<\n      TreeComponentProps['defaultExpandedKeys']\n    >,\n    currentNodeKey: [String, Number] as PropType<string | number>,\n    renderContent: Function,\n    showCheckbox: {\n      type: Boolean,\n      default: false,\n    },\n    draggable: {\n      type: Boolean,\n      default: false,\n    },\n    allowDrag: Function,\n    allowDrop: Function,\n    props: {\n      type: Object as PropType<TreeComponentProps['props']>,\n      default: () => ({\n        children: 'children',\n        label: 'label',\n        disabled: 'disabled',\n      }),\n    },\n    lazy: {\n      type: Boolean,\n      default: false,\n    },\n    highlightCurrent: Boolean,\n    load: Function as PropType<TreeComponentProps['load']>,\n    filterNodeMethod: Function as PropType<\n      TreeComponentProps['filterNodeMethod']\n    >,\n    accordion: Boolean,\n    indent: {\n      type: Number,\n      default: 18,\n    },\n    icon: [String, Object] as PropType<string | Component>,\n  },\n  emits: [\n    'check-change',\n    'current-change',\n    'node-click',\n    'node-contextmenu',\n    'node-collapse',\n    'node-expand',\n    'check',\n    'node-drag-start',\n    'node-drag-end',\n    'node-drop',\n    'node-drag-leave',\n    'node-drag-enter',\n    'node-drag-over',\n  ],\n  setup(props, ctx) {\n    const { t } = useLocale()\n\n    const store = ref<TreeStore>(\n      new TreeStore({\n        key: props.nodeKey,\n        data: props.data,\n        lazy: props.lazy,\n        props: props.props,\n        load: props.load,\n        currentNodeKey: props.currentNodeKey,\n        checkStrictly: props.checkStrictly,\n        checkDescendants: props.checkDescendants,\n        defaultCheckedKeys: props.defaultCheckedKeys,\n        defaultExpandedKeys: props.defaultExpandedKeys,\n        autoExpandParent: props.autoExpandParent,\n        defaultExpandAll: props.defaultExpandAll,\n        filterNodeMethod: props.filterNodeMethod,\n      })\n    )\n\n    store.value.initialize()\n\n    const root = ref<Node>(store.value.root)\n    const currentNode = ref<Node>(null)\n    const el$ = ref<Nullable<HTMLElement>>(null)\n    const dropIndicator$ = ref<Nullable<HTMLElement>>(null)\n\n    const { broadcastExpanded } = useNodeExpandEventBroadcast(props)\n\n    const { dragState } = useDragNodeHandler({\n      props,\n      ctx,\n      el$,\n      dropIndicator$,\n      store,\n    })\n\n    useKeydown({ el$ }, store)\n\n    const isEmpty = computed(() => {\n      const { childNodes } = root.value\n      return (\n        !childNodes ||\n        childNodes.length === 0 ||\n        childNodes.every(({ visible }) => !visible)\n      )\n    })\n\n    watch(\n      () => props.defaultCheckedKeys,\n      (newVal) => {\n        store.value.setDefaultCheckedKey(newVal)\n      }\n    )\n\n    watch(\n      () => props.defaultExpandedKeys,\n      (newVal) => {\n        store.value.defaultExpandedKeys = newVal\n        store.value.setDefaultExpandedKeys(newVal)\n      }\n    )\n\n    watch(\n      () => props.data,\n      (newVal) => {\n        store.value.setData(newVal)\n      },\n      { deep: true }\n    )\n\n    watch(\n      () => props.checkStrictly,\n      (newVal) => {\n        store.value.checkStrictly = newVal\n      }\n    )\n\n    const filter = (value) => {\n      if (!props.filterNodeMethod)\n        throw new Error('[Tree] filterNodeMethod is required when filter')\n      store.value.filter(value)\n    }\n\n    const getNodeKey = (node: Node) => {\n      return getNodeKeyUtil(props.nodeKey, node.data)\n    }\n\n    const getNodePath = (data: TreeKey | TreeNodeData) => {\n      if (!props.nodeKey)\n        throw new Error('[Tree] nodeKey is required in getNodePath')\n      const node = store.value.getNode(data)\n      if (!node) return []\n      const path = [node.data]\n      let parent = node.parent\n      while (parent && parent !== root.value) {\n        path.push(parent.data)\n        parent = parent.parent\n      }\n      return path.reverse()\n    }\n\n    const getCheckedNodes = (\n      leafOnly: boolean,\n      includeHalfChecked: boolean\n    ): TreeNodeData[] => {\n      return store.value.getCheckedNodes(leafOnly, includeHalfChecked)\n    }\n\n    const getCheckedKeys = (leafOnly: boolean): TreeKey[] => {\n      return store.value.getCheckedKeys(leafOnly)\n    }\n\n    const getCurrentNode = (): TreeNodeData => {\n      const currentNode = store.value.getCurrentNode()\n      return currentNode ? currentNode.data : null\n    }\n\n    const getCurrentKey = (): any => {\n      if (!props.nodeKey)\n        throw new Error('[Tree] nodeKey is required in getCurrentKey')\n      const currentNode = getCurrentNode()\n      return currentNode ? currentNode[props.nodeKey] : null\n    }\n\n    const setCheckedNodes = (nodes: Node[], leafOnly: boolean) => {\n      if (!props.nodeKey)\n        throw new Error('[Tree] nodeKey is required in setCheckedNodes')\n      store.value.setCheckedNodes(nodes, leafOnly)\n    }\n\n    const setCheckedKeys = (keys, leafOnly: boolean) => {\n      if (!props.nodeKey)\n        throw new Error('[Tree] nodeKey is required in setCheckedKeys')\n      store.value.setCheckedKeys(keys, leafOnly)\n    }\n\n    const setChecked = (\n      data: TreeKey | TreeNodeData,\n      checked: boolean,\n      deep: boolean\n    ) => {\n      store.value.setChecked(data, checked, deep)\n    }\n\n    const getHalfCheckedNodes = (): TreeNodeData[] => {\n      return store.value.getHalfCheckedNodes()\n    }\n\n    const getHalfCheckedKeys = (): TreeKey[] => {\n      return store.value.getHalfCheckedKeys()\n    }\n\n    const setCurrentNode = (node: Node, shouldAutoExpandParent = true) => {\n      if (!props.nodeKey)\n        throw new Error('[Tree] nodeKey is required in setCurrentNode')\n      store.value.setUserCurrentNode(node, shouldAutoExpandParent)\n    }\n\n    const setCurrentKey = (key: TreeKey, shouldAutoExpandParent = true) => {\n      if (!props.nodeKey)\n        throw new Error('[Tree] nodeKey is required in setCurrentKey')\n      store.value.setCurrentNodeKey(key, shouldAutoExpandParent)\n    }\n\n    const getNode = (data: TreeKey | TreeNodeData): Node => {\n      return store.value.getNode(data)\n    }\n\n    const remove = (data: TreeNodeData | Node) => {\n      store.value.remove(data)\n    }\n\n    const append = (\n      data: TreeNodeData,\n      parentNode: TreeNodeData | TreeKey | Node\n    ) => {\n      store.value.append(data, parentNode)\n    }\n\n    const insertBefore = (\n      data: TreeNodeData,\n      refNode: TreeKey | TreeNodeData\n    ) => {\n      store.value.insertBefore(data, refNode)\n    }\n\n    const insertAfter = (\n      data: TreeNodeData,\n      refNode: TreeKey | TreeNodeData\n    ) => {\n      store.value.insertAfter(data, refNode)\n    }\n\n    const handleNodeExpand = (\n      nodeData: TreeNodeData,\n      node: Node,\n      instance: ComponentInternalInstance\n    ) => {\n      broadcastExpanded(node)\n      ctx.emit('node-expand', nodeData, node, instance)\n    }\n\n    const updateKeyChildren = (key: TreeKey, data: TreeData) => {\n      if (!props.nodeKey)\n        throw new Error('[Tree] nodeKey is required in updateKeyChild')\n      store.value.updateChildren(key, data)\n    }\n\n    provide('RootTree', {\n      ctx,\n      props,\n      store,\n      root,\n      currentNode,\n      instance: getCurrentInstance(),\n    } as any)\n\n    return {\n      // ref\n      store,\n      root,\n      currentNode,\n      dragState,\n      el$,\n      dropIndicator$,\n\n      // computed\n      isEmpty,\n\n      // methods\n      filter,\n      getNodeKey,\n      getNodePath,\n      getCheckedNodes,\n      getCheckedKeys,\n      getCurrentNode,\n      getCurrentKey,\n      setCheckedNodes,\n      setCheckedKeys,\n      setChecked,\n      getHalfCheckedNodes,\n      getHalfCheckedKeys,\n      setCurrentNode,\n      setCurrentKey,\n      t,\n      getNode,\n      remove,\n      append,\n      insertBefore,\n      insertAfter,\n      handleNodeExpand,\n      updateKeyChildren,\n    }\n  },\n})\n</script>\n"],"names":["getNodeKey","getNodeKeyUtil","_openBlock"],"mappings":"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"}
+{"version":3,"file":"tree.mjs","sources":["../../../../../../packages/components/tree/src/tree.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"el$\"\n    class=\"el-tree\"\n    :class=\"{\n      'el-tree--highlight-current': highlightCurrent,\n      'is-dragging': !!dragState.draggingNode,\n      'is-drop-not-allow': !dragState.allowDrop,\n      'is-drop-inner': dragState.dropType === 'inner',\n    }\"\n    role=\"tree\"\n  >\n    <el-tree-node\n      v-for=\"child in root.childNodes\"\n      :key=\"getNodeKey(child)\"\n      :node=\"child\"\n      :props=\"props\"\n      :accordion=\"accordion\"\n      :render-after-expand=\"renderAfterExpand\"\n      :show-checkbox=\"showCheckbox\"\n      :render-content=\"renderContent\"\n      @node-expand=\"handleNodeExpand\"\n    />\n    <div v-if=\"isEmpty\" class=\"el-tree__empty-block\">\n      <span class=\"el-tree__empty-text\">{{\n        emptyText ?? t('el.tree.emptyText')\n      }}</span>\n    </div>\n    <div\n      v-show=\"dragState.showDropIndicator\"\n      ref=\"dropIndicator$\"\n      class=\"el-tree__drop-indicator\"\n    ></div>\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  ref,\n  provide,\n  computed,\n  watch,\n  getCurrentInstance,\n} from 'vue'\nimport { useLocale } from '@element-plus/hooks'\nimport TreeStore from './model/tree-store'\nimport { getNodeKey as getNodeKeyUtil } from './model/util'\nimport ElTreeNode from './tree-node.vue'\nimport { useNodeExpandEventBroadcast } from './model/useNodeExpandEventBroadcast'\nimport { useDragNodeHandler } from './model/useDragNode'\nimport { useKeydown } from './model/useKeydown'\nimport type Node from './model/node'\n\nimport type { ComponentInternalInstance, PropType, Component } from 'vue'\nimport type { Nullable } from '@element-plus/utils/types'\nimport type {\n  TreeComponentProps,\n  TreeNodeData,\n  TreeKey,\n  TreeData,\n} from './tree.type'\n\nexport default defineComponent({\n  name: 'ElTree',\n  components: { ElTreeNode },\n  props: {\n    data: {\n      type: Array,\n      default: () => [],\n    },\n    emptyText: {\n      type: String,\n    },\n    renderAfterExpand: {\n      type: Boolean,\n      default: true,\n    },\n    nodeKey: String,\n    checkStrictly: Boolean,\n    defaultExpandAll: Boolean,\n    expandOnClickNode: {\n      type: Boolean,\n      default: true,\n    },\n    checkOnClickNode: Boolean,\n    checkDescendants: {\n      type: Boolean,\n      default: false,\n    },\n    autoExpandParent: {\n      type: Boolean,\n      default: true,\n    },\n    defaultCheckedKeys: Array as PropType<\n      TreeComponentProps['defaultCheckedKeys']\n    >,\n    defaultExpandedKeys: Array as PropType<\n      TreeComponentProps['defaultExpandedKeys']\n    >,\n    currentNodeKey: [String, Number] as PropType<string | number>,\n    renderContent: Function,\n    showCheckbox: {\n      type: Boolean,\n      default: false,\n    },\n    draggable: {\n      type: Boolean,\n      default: false,\n    },\n    allowDrag: Function,\n    allowDrop: Function,\n    props: {\n      type: Object as PropType<TreeComponentProps['props']>,\n      default: () => ({\n        children: 'children',\n        label: 'label',\n        disabled: 'disabled',\n      }),\n    },\n    lazy: {\n      type: Boolean,\n      default: false,\n    },\n    highlightCurrent: Boolean,\n    load: Function as PropType<TreeComponentProps['load']>,\n    filterNodeMethod: Function as PropType<\n      TreeComponentProps['filterNodeMethod']\n    >,\n    accordion: Boolean,\n    indent: {\n      type: Number,\n      default: 18,\n    },\n    icon: [String, Object] as PropType<string | Component>,\n  },\n  emits: [\n    'check-change',\n    'current-change',\n    'node-click',\n    'node-contextmenu',\n    'node-collapse',\n    'node-expand',\n    'check',\n    'node-drag-start',\n    'node-drag-end',\n    'node-drop',\n    'node-drag-leave',\n    'node-drag-enter',\n    'node-drag-over',\n  ],\n  setup(props, ctx) {\n    const { t } = useLocale()\n\n    const store = ref<TreeStore>(\n      new TreeStore({\n        key: props.nodeKey,\n        data: props.data,\n        lazy: props.lazy,\n        props: props.props,\n        load: props.load,\n        currentNodeKey: props.currentNodeKey,\n        checkStrictly: props.checkStrictly,\n        checkDescendants: props.checkDescendants,\n        defaultCheckedKeys: props.defaultCheckedKeys,\n        defaultExpandedKeys: props.defaultExpandedKeys,\n        autoExpandParent: props.autoExpandParent,\n        defaultExpandAll: props.defaultExpandAll,\n        filterNodeMethod: props.filterNodeMethod,\n      })\n    )\n\n    store.value.initialize()\n\n    const root = ref<Node>(store.value.root)\n    const currentNode = ref<Node>(null)\n    const el$ = ref<Nullable<HTMLElement>>(null)\n    const dropIndicator$ = ref<Nullable<HTMLElement>>(null)\n\n    const { broadcastExpanded } = useNodeExpandEventBroadcast(props)\n\n    const { dragState } = useDragNodeHandler({\n      props,\n      ctx,\n      el$,\n      dropIndicator$,\n      store,\n    })\n\n    useKeydown({ el$ }, store)\n\n    const isEmpty = computed(() => {\n      const { childNodes } = root.value\n      return (\n        !childNodes ||\n        childNodes.length === 0 ||\n        childNodes.every(({ visible }) => !visible)\n      )\n    })\n\n    watch(\n      () => props.defaultCheckedKeys,\n      (newVal) => {\n        store.value.setDefaultCheckedKey(newVal)\n      }\n    )\n\n    watch(\n      () => props.defaultExpandedKeys,\n      (newVal) => {\n        store.value.setDefaultExpandedKeys(newVal)\n      }\n    )\n\n    watch(\n      () => props.data,\n      (newVal) => {\n        store.value.setData(newVal)\n      },\n      { deep: true }\n    )\n\n    watch(\n      () => props.checkStrictly,\n      (newVal) => {\n        store.value.checkStrictly = newVal\n      }\n    )\n\n    const filter = (value) => {\n      if (!props.filterNodeMethod)\n        throw new Error('[Tree] filterNodeMethod is required when filter')\n      store.value.filter(value)\n    }\n\n    const getNodeKey = (node: Node) => {\n      return getNodeKeyUtil(props.nodeKey, node.data)\n    }\n\n    const getNodePath = (data: TreeKey | TreeNodeData) => {\n      if (!props.nodeKey)\n        throw new Error('[Tree] nodeKey is required in getNodePath')\n      const node = store.value.getNode(data)\n      if (!node) return []\n      const path = [node.data]\n      let parent = node.parent\n      while (parent && parent !== root.value) {\n        path.push(parent.data)\n        parent = parent.parent\n      }\n      return path.reverse()\n    }\n\n    const getCheckedNodes = (\n      leafOnly?: boolean,\n      includeHalfChecked?: boolean\n    ): TreeNodeData[] => {\n      return store.value.getCheckedNodes(leafOnly, includeHalfChecked)\n    }\n\n    const getCheckedKeys = (leafOnly?: boolean): TreeKey[] => {\n      return store.value.getCheckedKeys(leafOnly)\n    }\n\n    const getCurrentNode = (): TreeNodeData => {\n      const currentNode = store.value.getCurrentNode()\n      return currentNode ? currentNode.data : null\n    }\n\n    const getCurrentKey = (): any => {\n      if (!props.nodeKey)\n        throw new Error('[Tree] nodeKey is required in getCurrentKey')\n      const currentNode = getCurrentNode()\n      return currentNode ? currentNode[props.nodeKey] : null\n    }\n\n    const setCheckedNodes = (nodes: Node[], leafOnly?: boolean) => {\n      if (!props.nodeKey)\n        throw new Error('[Tree] nodeKey is required in setCheckedNodes')\n      store.value.setCheckedNodes(nodes, leafOnly)\n    }\n\n    const setCheckedKeys = (keys, leafOnly?: boolean) => {\n      if (!props.nodeKey)\n        throw new Error('[Tree] nodeKey is required in setCheckedKeys')\n      store.value.setCheckedKeys(keys, leafOnly)\n    }\n\n    const setChecked = (\n      data: TreeKey | TreeNodeData,\n      checked: boolean,\n      deep: boolean\n    ) => {\n      store.value.setChecked(data, checked, deep)\n    }\n\n    const getHalfCheckedNodes = (): TreeNodeData[] => {\n      return store.value.getHalfCheckedNodes()\n    }\n\n    const getHalfCheckedKeys = (): TreeKey[] => {\n      return store.value.getHalfCheckedKeys()\n    }\n\n    const setCurrentNode = (node: Node, shouldAutoExpandParent = true) => {\n      if (!props.nodeKey)\n        throw new Error('[Tree] nodeKey is required in setCurrentNode')\n      store.value.setUserCurrentNode(node, shouldAutoExpandParent)\n    }\n\n    const setCurrentKey = (key: TreeKey, shouldAutoExpandParent = true) => {\n      if (!props.nodeKey)\n        throw new Error('[Tree] nodeKey is required in setCurrentKey')\n      store.value.setCurrentNodeKey(key, shouldAutoExpandParent)\n    }\n\n    const getNode = (data: TreeKey | TreeNodeData): Node => {\n      return store.value.getNode(data)\n    }\n\n    const remove = (data: TreeNodeData | Node) => {\n      store.value.remove(data)\n    }\n\n    const append = (\n      data: TreeNodeData,\n      parentNode: TreeNodeData | TreeKey | Node\n    ) => {\n      store.value.append(data, parentNode)\n    }\n\n    const insertBefore = (\n      data: TreeNodeData,\n      refNode: TreeKey | TreeNodeData\n    ) => {\n      store.value.insertBefore(data, refNode)\n    }\n\n    const insertAfter = (\n      data: TreeNodeData,\n      refNode: TreeKey | TreeNodeData\n    ) => {\n      store.value.insertAfter(data, refNode)\n    }\n\n    const handleNodeExpand = (\n      nodeData: TreeNodeData,\n      node: Node,\n      instance: ComponentInternalInstance\n    ) => {\n      broadcastExpanded(node)\n      ctx.emit('node-expand', nodeData, node, instance)\n    }\n\n    const updateKeyChildren = (key: TreeKey, data: TreeData) => {\n      if (!props.nodeKey)\n        throw new Error('[Tree] nodeKey is required in updateKeyChild')\n      store.value.updateChildren(key, data)\n    }\n\n    provide('RootTree', {\n      ctx,\n      props,\n      store,\n      root,\n      currentNode,\n      instance: getCurrentInstance(),\n    } as any)\n\n    return {\n      // ref\n      store,\n      root,\n      currentNode,\n      dragState,\n      el$,\n      dropIndicator$,\n\n      // computed\n      isEmpty,\n\n      // methods\n      filter,\n      getNodeKey,\n      getNodePath,\n      getCheckedNodes,\n      getCheckedKeys,\n      getCurrentNode,\n      getCurrentKey,\n      setCheckedNodes,\n      setCheckedKeys,\n      setChecked,\n      getHalfCheckedNodes,\n      getHalfCheckedKeys,\n      setCurrentNode,\n      setCurrentKey,\n      t,\n      getNode,\n      remove,\n      append,\n      insertBefore,\n      insertAfter,\n      handleNodeExpand,\n      updateKeyChildren,\n    }\n  },\n})\n</script>\n"],"names":["getNodeKey","getNodeKeyUtil","_openBlock"],"mappings":"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"}

package/es/components/tree/src/tree.vue.d.ts

@@ -356,12 +356,12 @@ declare const _default: import("vue").DefineComponent<{
     filter: (value: any) => void;
     getNodeKey: (node: Node) => any;
     getNodePath: (data: TreeKey | TreeNodeData) => TreeNodeData[];
-    getCheckedNodes: (leafOnly: boolean, includeHalfChecked: boolean) => TreeNodeData[];
-    getCheckedKeys: (leafOnly: boolean) => TreeKey[];
+    getCheckedNodes: (leafOnly?: boolean | undefined, includeHalfChecked?: boolean | undefined) => TreeNodeData[];
+    getCheckedKeys: (leafOnly?: boolean | undefined) => TreeKey[];
     getCurrentNode: () => TreeNodeData;
     getCurrentKey: () => any;
-    setCheckedNodes: (nodes: Node[], leafOnly: boolean) => void;
-    setCheckedKeys: (keys: any, leafOnly: boolean) => void;
+    setCheckedNodes: (nodes: Node[], leafOnly?: boolean | undefined) => void;
+    setCheckedKeys: (keys: any, leafOnly?: boolean | undefined) => void;
     setChecked: (data: TreeKey | TreeNodeData, checked: boolean, deep: boolean) => void;
     getHalfCheckedNodes: () => TreeNodeData[];
     getHalfCheckedKeys: () => TreeKey[];

package/es/hooks/index.d.ts

@@ -1,5 +1,7 @@
 export * from './use-attrs';
 export * from './use-common-props';
+export * from './use-deprecated';
+export * from './use-draggable';
 export * from './use-focus';
 export * from './use-form-item';
 export * from './use-global-config';

package/es/hooks/index.mjs

@@ -1,5 +1,7 @@
 export { useAttrs } from './use-attrs/index.mjs';
 export { useDisabled, useSize, useSizeProp } from './use-common-props/index.mjs';
+export { useDeprecated } from './use-deprecated/index.mjs';
+export { useDraggable } from './use-draggable/index.mjs';
 export { useFocus } from './use-focus/index.mjs';
 export { useFormItem } from './use-form-item/index.mjs';
 export { provideGlobalConfig, useGlobalConfig } from './use-global-config/index.mjs';

package/es/hooks/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/hooks/use-deprecated/index.d.ts

@@ -0,0 +1,10 @@
+import type { MaybeRef } from '@vueuse/core';
+declare type DeprecationParam = {
+    from: string;
+    replacement: string;
+    scope: string;
+    version: string;
+    ref: string;
+};
+export declare const useDeprecated: ({ from, replacement, scope, version, ref }: DeprecationParam, condition: MaybeRef<boolean>) => void;
+export {};

package/es/hooks/use-deprecated/index.mjs

@@ -0,0 +1,17 @@
+import { watch, unref } from 'vue';
+import { debugWarn } from '../../utils/error.mjs';
+
+const useDeprecated = ({ from, replacement, scope, version, ref }, condition) => {
+  watch(() => unref(condition), (val) => {
+    if (val) {
+      debugWarn(scope, `API ${from} is about to be deprecated in version ${version}, please use ${replacement} instead.
+For more detail, please visit: ${ref}
+`);
+    }
+  }, {
+    immediate: true
+  });
+};
+
+export { useDeprecated };
+//# sourceMappingURL=index.mjs.map

package/es/hooks/use-deprecated/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-deprecated/index.ts"],"sourcesContent":["import { unref, watch } from 'vue'\nimport { debugWarn } from '@element-plus/utils/error'\n\nimport type { MaybeRef } from '@vueuse/core'\n\ntype DeprecationParam = {\n  from: string\n  replacement: string\n  scope: string\n  version: string\n  ref: string\n}\n\nexport const useDeprecated = (\n  { from, replacement, scope, version, ref }: DeprecationParam,\n  condition: MaybeRef<boolean>\n) => {\n  watch(\n    () => unref(condition),\n    (val) => {\n      if (val) {\n        debugWarn(\n          scope,\n          `API ${from} is about to be deprecated in version ${version}, please use ${replacement} instead.\nFor more detail, please visit: ${ref}\n`\n        )\n      }\n    },\n    {\n      immediate: true,\n    }\n  )\n}\n"],"names":[],"mappings":";;;AAEY,MAAC,aAAa,GAAG,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,EAAE,SAAS,KAAK;AACxF,EAAE,KAAK,CAAC,MAAM,KAAK,CAAC,SAAS,CAAC,EAAE,CAAC,GAAG,KAAK;AACzC,IAAI,IAAI,GAAG,EAAE;AACb,MAAM,SAAS,CAAC,KAAK,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,sCAAsC,EAAE,OAAO,CAAC,aAAa,EAAE,WAAW,CAAC;AAC9G,+BAA+B,EAAE,GAAG,CAAC;AACrC,CAAC,CAAC,CAAC;AACH,KAAK;AACL,GAAG,EAAE;AACL,IAAI,SAAS,EAAE,IAAI;AACnB,GAAG,CAAC,CAAC;AACL;;;;"}

package/es/hooks/use-draggable/index.d.ts

@@ -0,0 +1,2 @@
+import type { Ref, ComputedRef } from 'vue';
+export declare const useDraggable: (targetRef: Ref<HTMLElement | undefined>, dragRef: Ref<HTMLElement | undefined>, draggable: ComputedRef<boolean>) => void;

package/es/hooks/use-draggable/index.mjs

@@ -0,0 +1,65 @@
+import { onMounted, watchEffect, onBeforeUnmount } from 'vue';
+import { addUnit } from '../../utils/util.mjs';
+
+const useDraggable = (targetRef, dragRef, draggable) => {
+  let transform = {
+    offsetX: 0,
+    offsetY: 0
+  };
+  const onMousedown = (e) => {
+    const downX = e.clientX;
+    const downY = e.clientY;
+    const { offsetX, offsetY } = transform;
+    const targetRect = targetRef.value.getBoundingClientRect();
+    const targetLeft = targetRect.left;
+    const targetTop = targetRect.top;
+    const targetWidth = targetRect.width;
+    const targetHeight = targetRect.height;
+    const clientWidth = document.documentElement.clientWidth;
+    const clientHeight = document.documentElement.clientHeight;
+    const minLeft = -targetLeft + offsetX;
+    const minTop = -targetTop + offsetY;
+    const maxLeft = clientWidth - targetLeft - targetWidth + offsetX;
+    const maxTop = clientHeight - targetTop - targetHeight + offsetY;
+    const onMousemove = (e2) => {
+      const moveX = Math.min(Math.max(offsetX + e2.clientX - downX, minLeft), maxLeft);
+      const moveY = Math.min(Math.max(offsetY + e2.clientY - downY, minTop), maxTop);
+      transform = {
+        offsetX: moveX,
+        offsetY: moveY
+      };
+      targetRef.value.style.transform = `translate(${addUnit(moveX)}, ${addUnit(moveY)})`;
+    };
+    const onMouseup = () => {
+      document.removeEventListener("mousemove", onMousemove);
+      document.removeEventListener("mouseup", onMouseup);
+    };
+    document.addEventListener("mousemove", onMousemove);
+    document.addEventListener("mouseup", onMouseup);
+  };
+  const onDraggable = () => {
+    if (dragRef.value && targetRef.value) {
+      dragRef.value.addEventListener("mousedown", onMousedown);
+    }
+  };
+  const offDraggable = () => {
+    if (dragRef.value && targetRef.value) {
+      dragRef.value.removeEventListener("mousedown", onMousedown);
+    }
+  };
+  onMounted(() => {
+    watchEffect(() => {
+      if (draggable.value) {
+        onDraggable();
+      } else {
+        offDraggable();
+      }
+    });
+  });
+  onBeforeUnmount(() => {
+    offDraggable();
+  });
+};
+
+export { useDraggable };
+//# sourceMappingURL=index.mjs.map

package/es/hooks/use-draggable/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-draggable/index.ts"],"sourcesContent":["import { onBeforeUnmount, onMounted, watchEffect } from 'vue'\nimport { addUnit } from '@element-plus/utils/util'\nimport type { Ref, ComputedRef } from 'vue'\n\nexport const useDraggable = (\n  targetRef: Ref<HTMLElement | undefined>,\n  dragRef: Ref<HTMLElement | undefined>,\n  draggable: ComputedRef<boolean>\n) => {\n  let transform = {\n    offsetX: 0,\n    offsetY: 0,\n  }\n\n  const onMousedown = (e: MouseEvent) => {\n    const downX = e.clientX\n    const downY = e.clientY\n    const { offsetX, offsetY } = transform\n\n    const targetRect = targetRef.value.getBoundingClientRect()\n    const targetLeft = targetRect.left\n    const targetTop = targetRect.top\n    const targetWidth = targetRect.width\n    const targetHeight = targetRect.height\n\n    const clientWidth = document.documentElement.clientWidth\n    const clientHeight = document.documentElement.clientHeight\n\n    const minLeft = -targetLeft + offsetX\n    const minTop = -targetTop + offsetY\n    const maxLeft = clientWidth - targetLeft - targetWidth + offsetX\n    const maxTop = clientHeight - targetTop - targetHeight + offsetY\n\n    const onMousemove = (e: MouseEvent) => {\n      const moveX = Math.min(\n        Math.max(offsetX + e.clientX - downX, minLeft),\n        maxLeft\n      )\n      const moveY = Math.min(\n        Math.max(offsetY + e.clientY - downY, minTop),\n        maxTop\n      )\n\n      transform = {\n        offsetX: moveX,\n        offsetY: moveY,\n      }\n      targetRef.value.style.transform = `translate(${addUnit(moveX)}, ${addUnit(\n        moveY\n      )})`\n    }\n\n    const onMouseup = () => {\n      document.removeEventListener('mousemove', onMousemove)\n      document.removeEventListener('mouseup', onMouseup)\n    }\n\n    document.addEventListener('mousemove', onMousemove)\n    document.addEventListener('mouseup', onMouseup)\n  }\n\n  const onDraggable = () => {\n    if (dragRef.value && targetRef.value) {\n      dragRef.value.addEventListener('mousedown', onMousedown)\n    }\n  }\n\n  const offDraggable = () => {\n    if (dragRef.value && targetRef.value) {\n      dragRef.value.removeEventListener('mousedown', onMousedown)\n    }\n  }\n\n  onMounted(() => {\n    watchEffect(() => {\n      if (draggable.value) {\n        onDraggable()\n      } else {\n        offDraggable()\n      }\n    })\n  })\n\n  onBeforeUnmount(() => {\n    offDraggable()\n  })\n}\n"],"names":[],"mappings":"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"}

package/es/index.mjs

@@ -83,6 +83,7 @@ export { ElPopconfirm } from './components/popconfirm/index.mjs';
 export { default as ElPopperArrow } from './components/popper/src/arrow.mjs';
 export { default as ElPopperTrigger } from './components/popper/src/trigger.mjs';
 export { default as ElPopperContent } from './components/popper/src/content.mjs';
+export { useDeprecateAppendToBody } from './components/popper/src/deprecation.mjs';
 export { Effect, usePopperArrowProps, usePopperContentProps, usePopperCoreConfigProps, usePopperProps, usePopperTriggerProps } from './components/popper/src/popper.mjs';
 export { POPPER_CONTENT_INJECTION_KEY, POPPER_INJECTION_KEY } from './components/popper/src/tokens.mjs';
 export { ElPopper } from './components/popper/index.mjs';
@@ -161,6 +162,8 @@ export { default as Mousewheel } from './directives/mousewheel/index.mjs';
 export { default as Resize } from './directives/resize/index.mjs';
 export { useAttrs } from './hooks/use-attrs/index.mjs';
 export { useDisabled, useSize, useSizeProp } from './hooks/use-common-props/index.mjs';
+export { useDeprecated } from './hooks/use-deprecated/index.mjs';
+export { useDraggable } from './hooks/use-draggable/index.mjs';
 export { useFocus } from './hooks/use-focus/index.mjs';
 export { useFormItem } from './hooks/use-form-item/index.mjs';
 export { provideGlobalConfig, useGlobalConfig } from './hooks/use-global-config/index.mjs';

package/es/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","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 * from '@element-plus/utils/popup-manager'\nexport { makeInstaller } from './make-installer'\n\nexport const install = installer.install\nexport const version = installer.version\nexport default installer\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOY,MAAC,OAAO,GAAG,SAAS,CAAC,QAAQ;AAC7B,MAAC,OAAO,GAAG,SAAS,CAAC;;;;"}
+{"version":3,"file":"index.mjs","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 * from '@element-plus/utils/popup-manager'\nexport { makeInstaller } from './make-installer'\n\nexport const install = installer.install\nexport const version = installer.version\nexport default installer\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOY,MAAC,OAAO,GAAG,SAAS,CAAC,QAAQ;AAC7B,MAAC,OAAO,GAAG,SAAS,CAAC;;;;"}

package/es/version.d.ts

@@ -1 +1 @@
-export declare const version = "0.0.20220202";
+export declare const version = "0.0.20220206";

package/es/version.mjs

@@ -1,4 +1,4 @@
-const version = "0.0.20220202";
+const version = "0.0.20220206";
 
 export { version };
 //# sourceMappingURL=version.mjs.map

package/es/version.mjs.map

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

package/lib/components/autocomplete/index.d.ts

@@ -39,8 +39,9 @@ declare const _Autocomplete: SFCWithInstall<import("vue").DefineComponent<{
     };
     popperAppendToBody: {
         type: BooleanConstructor;
-        default: boolean;
+        default: undefined;
     };
+    teleported: import("../../utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
     highlightFirstItem: {
         type: BooleanConstructor;
         default: boolean;
@@ -63,6 +64,7 @@ declare const _Autocomplete: SFCWithInstall<import("vue").DefineComponent<{
     id: import("vue").ComputedRef<string>;
     suggestionVisible: import("vue").ComputedRef<boolean>;
     suggestionLoading: import("vue").ComputedRef<boolean>;
+    compatTeleported: import("vue").ComputedRef<boolean>;
     getData: (queryString: string) => void;
     handleInput: (value: string) => void;
     handleChange: (value: any) => void;
@@ -126,8 +128,9 @@ declare const _Autocomplete: SFCWithInstall<import("vue").DefineComponent<{
     };
     popperAppendToBody: {
         type: BooleanConstructor;
-        default: boolean;
+        default: undefined;
     };
+    teleported: import("../../utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
     highlightFirstItem: {
         type: BooleanConstructor;
         default: boolean;
@@ -144,6 +147,7 @@ declare const _Autocomplete: SFCWithInstall<import("vue").DefineComponent<{
     modelValue: string | number;
     placement: import("@popperjs/core").Placement;
     popperClass: string;
+    teleported: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     valueKey: string;
     debounce: number;
     fetchSuggestions: (queryString: string, cb: (data: any[]) => void) => void;
@@ -194,8 +198,9 @@ export declare const ElAutocomplete: SFCWithInstall<import("vue").DefineComponen
     };
     popperAppendToBody: {
         type: BooleanConstructor;
-        default: boolean;
+        default: undefined;
     };
+    teleported: import("../../utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
     highlightFirstItem: {
         type: BooleanConstructor;
         default: boolean;
@@ -218,6 +223,7 @@ export declare const ElAutocomplete: SFCWithInstall<import("vue").DefineComponen
     id: import("vue").ComputedRef<string>;
     suggestionVisible: import("vue").ComputedRef<boolean>;
     suggestionLoading: import("vue").ComputedRef<boolean>;
+    compatTeleported: import("vue").ComputedRef<boolean>;
     getData: (queryString: string) => void;
     handleInput: (value: string) => void;
     handleChange: (value: any) => void;
@@ -281,8 +287,9 @@ export declare const ElAutocomplete: SFCWithInstall<import("vue").DefineComponen
     };
     popperAppendToBody: {
         type: BooleanConstructor;
-        default: boolean;
+        default: undefined;
     };
+    teleported: import("../../utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
     highlightFirstItem: {
         type: BooleanConstructor;
         default: boolean;
@@ -299,6 +306,7 @@ export declare const ElAutocomplete: SFCWithInstall<import("vue").DefineComponen
     modelValue: string | number;
     placement: import("@popperjs/core").Placement;
     popperClass: string;
+    teleported: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     valueKey: string;
     debounce: number;
     fetchSuggestions: (queryString: string, cb: (data: any[]) => void) => void;

package/lib/components/autocomplete/src/index.js

@@ -13,19 +13,23 @@ var error = require('../../../utils/error.js');
 var index$1 = require('../../input/index.js');
 var index$2 = require('../../scrollbar/index.js');
 var index = require('../../tooltip/index.js');
+require('../../popper/index.js');
 var index$3 = require('../../icon/index.js');
 var iconsVue = require('@element-plus/icons-vue');
 var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
 var index$4 = require('../../../directives/click-outside/index.js');
+var tooltip = require('../../tooltip/src/tooltip.js');
 var index$5 = require('../../../hooks/use-namespace/index.js');
+var deprecation = require('../../popper/src/deprecation.js');
 var index$6 = require('../../../hooks/use-attrs/index.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var debounce__default = /*#__PURE__*/_interopDefaultLegacy(debounce);
 
+const COMPONENT_NAME = "ElAutocomplete";
 const _sfc_main = vue.defineComponent({
-  name: "ElAutocomplete",
+  name: COMPONENT_NAME,
   components: {
     ElTooltip: index.ElTooltip,
     ElInput: index$1.ElInput,
@@ -86,8 +90,9 @@ const _sfc_main = vue.defineComponent({
     },
     popperAppendToBody: {
       type: Boolean,
-      default: true
+      default: void 0
     },
+    teleported: tooltip.useTooltipContentProps.teleported,
     highlightFirstItem: {
       type: Boolean,
       default: false
@@ -104,6 +109,7 @@ const _sfc_main = vue.defineComponent({
   ],
   setup(props, ctx) {
     const ns = index$5.useNamespace("autocomplete");
+    const { compatTeleported } = deprecation.useDeprecateAppendToBody(COMPONENT_NAME, "popperAppendToBody");
     const attrs = index$6.useAttrs();
     const suggestions = vue.ref([]);
     const highlightedIndex = vue.ref(-1);
@@ -251,6 +257,7 @@ const _sfc_main = vue.defineComponent({
       id,
       suggestionVisible,
       suggestionLoading,
+      compatTeleported,
       getData,
       handleInput,
       handleChange,
@@ -284,7 +291,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     placement: _ctx.placement,
     "fallback-placements": ["bottom-start", "top-start"],
     "popper-class": `${_ctx.ns.e("popper")} ${_ctx.popperClass}`,
-    "append-to-body": _ctx.popperAppendToBody,
+    teleported: _ctx.compatTeleported,
     "gpu-acceleration": false,
     pure: "",
     "manual-mode": "",
@@ -388,7 +395,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
       ])
     ]),
     _: 3
-  }, 8, ["visible", "placement", "popper-class", "append-to-body", "transition", "onShow"]);
+  }, 8, ["visible", "placement", "popper-class", "teleported", "transition", "onShow"]);
 }
 var Autocomplete = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["render", _sfc_render]]);
 

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../../packages/components/autocomplete/src/index.vue"],"sourcesContent":["<template>\n  <el-tooltip\n    ref=\"popper\"\n    v-model:visible=\"suggestionVisible\"\n    :placement=\"placement\"\n    :fallback-placements=\"['bottom-start', 'top-start']\"\n    :popper-class=\"`${ns.e('popper')} ${popperClass}`\"\n    :append-to-body=\"popperAppendToBody\"\n    :gpu-acceleration=\"false\"\n    pure\n    manual-mode\n    effect=\"light\"\n    trigger=\"click\"\n    :transition=\"`${ns.namespace.value}-zoom-in-top`\"\n    persistent\n    @show=\"onSuggestionShow\"\n  >\n    <div\n      v-clickoutside=\"close\"\n      :class=\"[ns.b(), $attrs.class]\"\n      :style=\"$attrs.style\"\n      role=\"combobox\"\n      aria-haspopup=\"listbox\"\n      :aria-expanded=\"suggestionVisible\"\n      :aria-owns=\"id\"\n    >\n      <el-input\n        ref=\"inputRef\"\n        v-bind=\"attrs\"\n        :model-value=\"modelValue\"\n        @input=\"handleInput\"\n        @change=\"handleChange\"\n        @focus=\"handleFocus\"\n        @blur=\"handleBlur\"\n        @clear=\"handleClear\"\n        @keydown.up.prevent=\"highlight(highlightedIndex - 1)\"\n        @keydown.down.prevent=\"highlight(highlightedIndex + 1)\"\n        @keydown.enter=\"handleKeyEnter\"\n        @keydown.tab=\"close\"\n      >\n        <template v-if=\"$slots.prepend\" #prepend>\n          <slot name=\"prepend\"></slot>\n        </template>\n        <template v-if=\"$slots.append\" #append>\n          <slot name=\"append\"></slot>\n        </template>\n        <template v-if=\"$slots.prefix\" #prefix>\n          <slot name=\"prefix\"></slot>\n        </template>\n        <template v-if=\"$slots.suffix\" #suffix>\n          <slot name=\"suffix\"></slot>\n        </template>\n      </el-input>\n    </div>\n    <template #content>\n      <div\n        ref=\"regionRef\"\n        :class=\"[ns.b('suggestion'), ns.is('loading', suggestionLoading)]\"\n        :style=\"{ minWidth: dropdownWidth, outline: 'none' }\"\n        role=\"region\"\n      >\n        <el-scrollbar\n          :id=\"id\"\n          tag=\"ul\"\n          :wrap-class=\"ns.be('suggestion', 'wrap')\"\n          :view-class=\"ns.be('suggestion', 'list')\"\n          role=\"listbox\"\n        >\n          <li v-if=\"suggestionLoading\">\n            <el-icon class=\"is-loading\"><loading /></el-icon>\n          </li>\n          <template v-else>\n            <li\n              v-for=\"(item, index) in suggestions\"\n              :id=\"`${id}-item-${index}`\"\n              :key=\"index\"\n              :class=\"{ highlighted: highlightedIndex === index }\"\n              role=\"option\"\n              :aria-selected=\"highlightedIndex === index\"\n              @click=\"select(item)\"\n            >\n              <slot :item=\"item\">{{ item[valueKey] }}</slot>\n            </li>\n          </template>\n        </el-scrollbar>\n      </div>\n    </template>\n  </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, onMounted, nextTick } from 'vue'\nimport { NOOP } from '@vue/shared'\nimport debounce from 'lodash/debounce'\nimport { useAttrs, useNamespace } from '@element-plus/hooks'\nimport { ClickOutside } from '@element-plus/directives'\nimport { generateId, isArray } from '@element-plus/utils/util'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { throwError } from '@element-plus/utils/error'\nimport ElInput from '@element-plus/components/input'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElIcon from '@element-plus/components/icon'\nimport { Loading } from '@element-plus/icons-vue'\n\nimport type { Placement } from '@element-plus/components/popper'\nimport type { PropType } from 'vue'\n\nexport default defineComponent({\n  name: 'ElAutocomplete',\n  components: {\n    ElTooltip,\n    ElInput,\n    ElScrollbar,\n    ElIcon,\n    Loading,\n  },\n  directives: {\n    clickoutside: ClickOutside,\n  },\n  inheritAttrs: false,\n  props: {\n    valueKey: {\n      type: String,\n      default: 'value',\n    },\n    modelValue: {\n      type: [String, Number],\n      default: '',\n    },\n    debounce: {\n      type: Number,\n      default: 300,\n    },\n    placement: {\n      type: String as PropType<Placement>,\n      validator: (val: string): boolean => {\n        return [\n          'top',\n          'top-start',\n          'top-end',\n          'bottom',\n          'bottom-start',\n          'bottom-end',\n        ].includes(val)\n      },\n      default: 'bottom-start',\n    },\n    fetchSuggestions: {\n      type: Function as PropType<\n        (queryString: string, cb: (data: any[]) => void) => void\n      >,\n      default: NOOP,\n    },\n    popperClass: {\n      type: String,\n      default: '',\n    },\n    triggerOnFocus: {\n      type: Boolean,\n      default: true,\n    },\n    selectWhenUnmatched: {\n      type: Boolean,\n      default: false,\n    },\n    hideLoading: {\n      type: Boolean,\n      default: false,\n    },\n    popperAppendToBody: {\n      type: Boolean,\n      default: true,\n    },\n    highlightFirstItem: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  emits: [\n    UPDATE_MODEL_EVENT,\n    'input',\n    'change',\n    'focus',\n    'blur',\n    'clear',\n    'select',\n  ],\n  setup(props, ctx) {\n    const ns = useNamespace('autocomplete')\n    const attrs = useAttrs()\n    const suggestions = ref<any[]>([])\n    const highlightedIndex = ref(-1)\n    const dropdownWidth = ref('')\n    const activated = ref(false)\n    const suggestionDisabled = ref(false)\n    const loading = ref(false)\n    const inputRef = ref<{\n      inputOrTextarea: HTMLInputElement | HTMLTextAreaElement\n      focus: () => void\n      $el: HTMLElement\n    } | null>(null)\n    const regionRef = ref<HTMLElement | null>(null)\n    const popper = ref(null)\n\n    const id = computed(() => {\n      return ns.b(String(generateId()))\n    })\n    const suggestionVisible = computed(() => {\n      const isValidData =\n        isArray(suggestions.value) && suggestions.value.length > 0\n      return (isValidData || loading.value) && activated.value\n    })\n    const suggestionLoading = computed(() => {\n      return !props.hideLoading && loading.value\n    })\n\n    const onSuggestionShow = () => {\n      nextTick(() => {\n        if (suggestionVisible.value) {\n          dropdownWidth.value = `${inputRef.value!.$el.offsetWidth}px`\n        }\n      })\n    }\n\n    onMounted(() => {\n      inputRef.value!.inputOrTextarea.setAttribute('role', 'textbox')\n      inputRef.value!.inputOrTextarea.setAttribute('aria-autocomplete', 'list')\n      inputRef.value!.inputOrTextarea.setAttribute('aria-controls', 'id')\n      inputRef.value!.inputOrTextarea.setAttribute(\n        'aria-activedescendant',\n        `${id.value}-item-${highlightedIndex.value}`\n      )\n    })\n\n    const getData = (queryString: string) => {\n      if (suggestionDisabled.value) {\n        return\n      }\n      loading.value = true\n      props.fetchSuggestions(queryString, (suggestionsArg) => {\n        loading.value = false\n        if (suggestionDisabled.value) {\n          return\n        }\n        if (isArray(suggestionsArg)) {\n          suggestions.value = suggestionsArg\n          highlightedIndex.value = props.highlightFirstItem ? 0 : -1\n        } else {\n          throwError(\n            'ElAutocomplete',\n            'autocomplete suggestions must be an array'\n          )\n        }\n      })\n    }\n    const debouncedGetData = debounce(getData, props.debounce)\n    const handleInput = (value: string) => {\n      ctx.emit('input', value)\n      ctx.emit(UPDATE_MODEL_EVENT, value)\n      suggestionDisabled.value = false\n      if (!props.triggerOnFocus && !value) {\n        suggestionDisabled.value = true\n        suggestions.value = []\n        return\n      }\n      debouncedGetData(value)\n    }\n    const handleChange = (value) => {\n      ctx.emit('change', value)\n    }\n    const handleFocus = (e) => {\n      activated.value = true\n      ctx.emit('focus', e)\n      if (props.triggerOnFocus) {\n        debouncedGetData(String(props.modelValue))\n      }\n    }\n    const handleBlur = (e) => {\n      ctx.emit('blur', e)\n    }\n    const handleClear = () => {\n      activated.value = false\n      ctx.emit(UPDATE_MODEL_EVENT, '')\n      ctx.emit('clear')\n    }\n    const handleKeyEnter = () => {\n      if (\n        suggestionVisible.value &&\n        highlightedIndex.value >= 0 &&\n        highlightedIndex.value < suggestions.value.length\n      ) {\n        select(suggestions.value[highlightedIndex.value])\n      } else if (props.selectWhenUnmatched) {\n        ctx.emit('select', { value: props.modelValue })\n        nextTick(() => {\n          suggestions.value = []\n          highlightedIndex.value = -1\n        })\n      }\n    }\n    const close = () => {\n      activated.value = false\n    }\n    const focus = () => {\n      inputRef.value?.focus()\n    }\n    const select = (item) => {\n      ctx.emit('input', item[props.valueKey])\n      ctx.emit(UPDATE_MODEL_EVENT, item[props.valueKey])\n      ctx.emit('select', item)\n      nextTick(() => {\n        suggestions.value = []\n        highlightedIndex.value = -1\n      })\n    }\n    const highlight = (index: number) => {\n      if (!suggestionVisible.value || loading.value) {\n        return\n      }\n      if (index < 0) {\n        highlightedIndex.value = -1\n        return\n      }\n      if (index >= suggestions.value.length) {\n        index = suggestions.value.length - 1\n      }\n      const suggestion = regionRef.value!.querySelector(\n        `.${ns.be('suggestion', 'wrap')}`\n      )!\n      const suggestionList = suggestion.querySelectorAll(\n        `.${ns.be('suggestion', 'list')} li`\n      )!\n      const highlightItem = suggestionList[index]\n      const scrollTop = suggestion.scrollTop\n      const { offsetTop, scrollHeight } = highlightItem as HTMLElement\n\n      if (offsetTop + scrollHeight > scrollTop + suggestion.clientHeight) {\n        suggestion.scrollTop += scrollHeight\n      }\n      if (offsetTop < scrollTop) {\n        suggestion.scrollTop -= scrollHeight\n      }\n      highlightedIndex.value = index\n      inputRef.value!.inputOrTextarea.setAttribute(\n        'aria-activedescendant',\n        `${id.value}-item-${highlightedIndex.value}`\n      )\n    }\n\n    return {\n      attrs,\n      suggestions,\n      highlightedIndex,\n      dropdownWidth,\n      activated,\n      suggestionDisabled,\n      loading,\n      inputRef,\n      regionRef,\n      popper,\n\n      id,\n      suggestionVisible,\n      suggestionLoading,\n\n      getData,\n      handleInput,\n      handleChange,\n      handleFocus,\n      handleBlur,\n      handleClear,\n      handleKeyEnter,\n      close,\n      focus,\n      select,\n      highlight,\n      onSuggestionShow,\n      ns,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","ElTooltip","ElInput","ElScrollbar","ElIcon","Loading","ClickOutside","NOOP","UPDATE_MODEL_EVENT","useNamespace","useAttrs","ref","computed","generateId","isArray","debounce","_normalizeClass","_withModifiers"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../../packages/components/autocomplete/src/index.vue"],"sourcesContent":["<template>\n  <el-tooltip\n    ref=\"popper\"\n    v-model:visible=\"suggestionVisible\"\n    :placement=\"placement\"\n    :fallback-placements=\"['bottom-start', 'top-start']\"\n    :popper-class=\"`${ns.e('popper')} ${popperClass}`\"\n    :teleported=\"compatTeleported\"\n    :gpu-acceleration=\"false\"\n    pure\n    manual-mode\n    effect=\"light\"\n    trigger=\"click\"\n    :transition=\"`${ns.namespace.value}-zoom-in-top`\"\n    persistent\n    @show=\"onSuggestionShow\"\n  >\n    <div\n      v-clickoutside=\"close\"\n      :class=\"[ns.b(), $attrs.class]\"\n      :style=\"$attrs.style\"\n      role=\"combobox\"\n      aria-haspopup=\"listbox\"\n      :aria-expanded=\"suggestionVisible\"\n      :aria-owns=\"id\"\n    >\n      <el-input\n        ref=\"inputRef\"\n        v-bind=\"attrs\"\n        :model-value=\"modelValue\"\n        @input=\"handleInput\"\n        @change=\"handleChange\"\n        @focus=\"handleFocus\"\n        @blur=\"handleBlur\"\n        @clear=\"handleClear\"\n        @keydown.up.prevent=\"highlight(highlightedIndex - 1)\"\n        @keydown.down.prevent=\"highlight(highlightedIndex + 1)\"\n        @keydown.enter=\"handleKeyEnter\"\n        @keydown.tab=\"close\"\n      >\n        <template v-if=\"$slots.prepend\" #prepend>\n          <slot name=\"prepend\"></slot>\n        </template>\n        <template v-if=\"$slots.append\" #append>\n          <slot name=\"append\"></slot>\n        </template>\n        <template v-if=\"$slots.prefix\" #prefix>\n          <slot name=\"prefix\"></slot>\n        </template>\n        <template v-if=\"$slots.suffix\" #suffix>\n          <slot name=\"suffix\"></slot>\n        </template>\n      </el-input>\n    </div>\n    <template #content>\n      <div\n        ref=\"regionRef\"\n        :class=\"[ns.b('suggestion'), ns.is('loading', suggestionLoading)]\"\n        :style=\"{ minWidth: dropdownWidth, outline: 'none' }\"\n        role=\"region\"\n      >\n        <el-scrollbar\n          :id=\"id\"\n          tag=\"ul\"\n          :wrap-class=\"ns.be('suggestion', 'wrap')\"\n          :view-class=\"ns.be('suggestion', 'list')\"\n          role=\"listbox\"\n        >\n          <li v-if=\"suggestionLoading\">\n            <el-icon class=\"is-loading\"><loading /></el-icon>\n          </li>\n          <template v-else>\n            <li\n              v-for=\"(item, index) in suggestions\"\n              :id=\"`${id}-item-${index}`\"\n              :key=\"index\"\n              :class=\"{ highlighted: highlightedIndex === index }\"\n              role=\"option\"\n              :aria-selected=\"highlightedIndex === index\"\n              @click=\"select(item)\"\n            >\n              <slot :item=\"item\">{{ item[valueKey] }}</slot>\n            </li>\n          </template>\n        </el-scrollbar>\n      </div>\n    </template>\n  </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, onMounted, nextTick } from 'vue'\nimport { NOOP } from '@vue/shared'\nimport debounce from 'lodash/debounce'\nimport { useAttrs, useNamespace } from '@element-plus/hooks'\nimport { ClickOutside } from '@element-plus/directives'\nimport { generateId, isArray } from '@element-plus/utils/util'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { throwError } from '@element-plus/utils/error'\nimport ElInput from '@element-plus/components/input'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElTooltip, {\n  useTooltipContentProps,\n} from '@element-plus/components/tooltip'\nimport { useDeprecateAppendToBody } from '@element-plus/components/popper'\nimport ElIcon from '@element-plus/components/icon'\nimport { Loading } from '@element-plus/icons-vue'\n\nimport type { Placement } from '@element-plus/components/popper'\nimport type { PropType } from 'vue'\n\nconst COMPONENT_NAME = 'ElAutocomplete'\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  components: {\n    ElTooltip,\n    ElInput,\n    ElScrollbar,\n    ElIcon,\n    Loading,\n  },\n  directives: {\n    clickoutside: ClickOutside,\n  },\n  inheritAttrs: false,\n  props: {\n    valueKey: {\n      type: String,\n      default: 'value',\n    },\n    modelValue: {\n      type: [String, Number],\n      default: '',\n    },\n    debounce: {\n      type: Number,\n      default: 300,\n    },\n    placement: {\n      type: String as PropType<Placement>,\n      validator: (val: string): boolean => {\n        return [\n          'top',\n          'top-start',\n          'top-end',\n          'bottom',\n          'bottom-start',\n          'bottom-end',\n        ].includes(val)\n      },\n      default: 'bottom-start',\n    },\n    fetchSuggestions: {\n      type: Function as PropType<\n        (queryString: string, cb: (data: any[]) => void) => void\n      >,\n      default: NOOP,\n    },\n    popperClass: {\n      type: String,\n      default: '',\n    },\n    triggerOnFocus: {\n      type: Boolean,\n      default: true,\n    },\n    selectWhenUnmatched: {\n      type: Boolean,\n      default: false,\n    },\n    hideLoading: {\n      type: Boolean,\n      default: false,\n    },\n    popperAppendToBody: {\n      type: Boolean,\n      default: undefined,\n    },\n    teleported: useTooltipContentProps.teleported,\n    highlightFirstItem: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  emits: [\n    UPDATE_MODEL_EVENT,\n    'input',\n    'change',\n    'focus',\n    'blur',\n    'clear',\n    'select',\n  ],\n  setup(props, ctx) {\n    const ns = useNamespace('autocomplete')\n    const { compatTeleported } = useDeprecateAppendToBody(\n      COMPONENT_NAME,\n      'popperAppendToBody'\n    )\n    const attrs = useAttrs()\n    const suggestions = ref<any[]>([])\n    const highlightedIndex = ref(-1)\n    const dropdownWidth = ref('')\n    const activated = ref(false)\n    const suggestionDisabled = ref(false)\n    const loading = ref(false)\n    const inputRef = ref<{\n      inputOrTextarea: HTMLInputElement | HTMLTextAreaElement\n      focus: () => void\n      $el: HTMLElement\n    } | null>(null)\n    const regionRef = ref<HTMLElement | null>(null)\n    const popper = ref(null)\n\n    const id = computed(() => {\n      return ns.b(String(generateId()))\n    })\n    const suggestionVisible = computed(() => {\n      const isValidData =\n        isArray(suggestions.value) && suggestions.value.length > 0\n      return (isValidData || loading.value) && activated.value\n    })\n    const suggestionLoading = computed(() => {\n      return !props.hideLoading && loading.value\n    })\n\n    const onSuggestionShow = () => {\n      nextTick(() => {\n        if (suggestionVisible.value) {\n          dropdownWidth.value = `${inputRef.value!.$el.offsetWidth}px`\n        }\n      })\n    }\n\n    onMounted(() => {\n      inputRef.value!.inputOrTextarea.setAttribute('role', 'textbox')\n      inputRef.value!.inputOrTextarea.setAttribute('aria-autocomplete', 'list')\n      inputRef.value!.inputOrTextarea.setAttribute('aria-controls', 'id')\n      inputRef.value!.inputOrTextarea.setAttribute(\n        'aria-activedescendant',\n        `${id.value}-item-${highlightedIndex.value}`\n      )\n    })\n\n    const getData = (queryString: string) => {\n      if (suggestionDisabled.value) {\n        return\n      }\n      loading.value = true\n      props.fetchSuggestions(queryString, (suggestionsArg) => {\n        loading.value = false\n        if (suggestionDisabled.value) {\n          return\n        }\n        if (isArray(suggestionsArg)) {\n          suggestions.value = suggestionsArg\n          highlightedIndex.value = props.highlightFirstItem ? 0 : -1\n        } else {\n          throwError(\n            'ElAutocomplete',\n            'autocomplete suggestions must be an array'\n          )\n        }\n      })\n    }\n    const debouncedGetData = debounce(getData, props.debounce)\n    const handleInput = (value: string) => {\n      ctx.emit('input', value)\n      ctx.emit(UPDATE_MODEL_EVENT, value)\n      suggestionDisabled.value = false\n      if (!props.triggerOnFocus && !value) {\n        suggestionDisabled.value = true\n        suggestions.value = []\n        return\n      }\n      debouncedGetData(value)\n    }\n    const handleChange = (value) => {\n      ctx.emit('change', value)\n    }\n    const handleFocus = (e) => {\n      activated.value = true\n      ctx.emit('focus', e)\n      if (props.triggerOnFocus) {\n        debouncedGetData(String(props.modelValue))\n      }\n    }\n    const handleBlur = (e) => {\n      ctx.emit('blur', e)\n    }\n    const handleClear = () => {\n      activated.value = false\n      ctx.emit(UPDATE_MODEL_EVENT, '')\n      ctx.emit('clear')\n    }\n    const handleKeyEnter = () => {\n      if (\n        suggestionVisible.value &&\n        highlightedIndex.value >= 0 &&\n        highlightedIndex.value < suggestions.value.length\n      ) {\n        select(suggestions.value[highlightedIndex.value])\n      } else if (props.selectWhenUnmatched) {\n        ctx.emit('select', { value: props.modelValue })\n        nextTick(() => {\n          suggestions.value = []\n          highlightedIndex.value = -1\n        })\n      }\n    }\n    const close = () => {\n      activated.value = false\n    }\n    const focus = () => {\n      inputRef.value?.focus()\n    }\n    const select = (item) => {\n      ctx.emit('input', item[props.valueKey])\n      ctx.emit(UPDATE_MODEL_EVENT, item[props.valueKey])\n      ctx.emit('select', item)\n      nextTick(() => {\n        suggestions.value = []\n        highlightedIndex.value = -1\n      })\n    }\n    const highlight = (index: number) => {\n      if (!suggestionVisible.value || loading.value) {\n        return\n      }\n      if (index < 0) {\n        highlightedIndex.value = -1\n        return\n      }\n      if (index >= suggestions.value.length) {\n        index = suggestions.value.length - 1\n      }\n      const suggestion = regionRef.value!.querySelector(\n        `.${ns.be('suggestion', 'wrap')}`\n      )!\n      const suggestionList = suggestion.querySelectorAll(\n        `.${ns.be('suggestion', 'list')} li`\n      )!\n      const highlightItem = suggestionList[index]\n      const scrollTop = suggestion.scrollTop\n      const { offsetTop, scrollHeight } = highlightItem as HTMLElement\n\n      if (offsetTop + scrollHeight > scrollTop + suggestion.clientHeight) {\n        suggestion.scrollTop += scrollHeight\n      }\n      if (offsetTop < scrollTop) {\n        suggestion.scrollTop -= scrollHeight\n      }\n      highlightedIndex.value = index\n      inputRef.value!.inputOrTextarea.setAttribute(\n        'aria-activedescendant',\n        `${id.value}-item-${highlightedIndex.value}`\n      )\n    }\n\n    return {\n      attrs,\n      suggestions,\n      highlightedIndex,\n      dropdownWidth,\n      activated,\n      suggestionDisabled,\n      loading,\n      inputRef,\n      regionRef,\n      popper,\n\n      id,\n      suggestionVisible,\n      suggestionLoading,\n\n      // deprecation in 2.1.0\n      compatTeleported,\n\n      getData,\n      handleInput,\n      handleChange,\n      handleFocus,\n      handleBlur,\n      handleClear,\n      handleKeyEnter,\n      close,\n      focus,\n      select,\n      highlight,\n      onSuggestionShow,\n      ns,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","ElTooltip","ElInput","ElScrollbar","ElIcon","Loading","ClickOutside","NOOP","useTooltipContentProps","UPDATE_MODEL_EVENT","useNamespace","useDeprecateAppendToBody","useAttrs","ref","computed","generateId","isArray","debounce","_normalizeClass","_withModifiers"],"mappings":"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"}

package/lib/components/autocomplete/src/index.vue.d.ts

@@ -40,8 +40,9 @@ declare const _default: import("vue").DefineComponent<{
     };
     popperAppendToBody: {
         type: BooleanConstructor;
-        default: boolean;
+        default: undefined;
     };
+    teleported: import("../../../utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
     highlightFirstItem: {
         type: BooleanConstructor;
         default: boolean;
@@ -64,6 +65,7 @@ declare const _default: import("vue").DefineComponent<{
     id: import("vue").ComputedRef<string>;
     suggestionVisible: import("vue").ComputedRef<boolean>;
     suggestionLoading: import("vue").ComputedRef<boolean>;
+    compatTeleported: import("vue").ComputedRef<boolean>;
     getData: (queryString: string) => void;
     handleInput: (value: string) => void;
     handleChange: (value: any) => void;
@@ -127,8 +129,9 @@ declare const _default: import("vue").DefineComponent<{
     };
     popperAppendToBody: {
         type: BooleanConstructor;
-        default: boolean;
+        default: undefined;
     };
+    teleported: import("../../../utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
     highlightFirstItem: {
         type: BooleanConstructor;
         default: boolean;
@@ -145,6 +148,7 @@ declare const _default: import("vue").DefineComponent<{
     modelValue: string | number;
     placement: Placement;
     popperClass: string;
+    teleported: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     valueKey: string;
     debounce: number;
     fetchSuggestions: (queryString: string, cb: (data: any[]) => void) => void;

package/lib/components/cascader/index.d.ts

@@ -37,8 +37,9 @@ declare const _Cascader: SFCWithInstall<import("vue").DefineComponent<{
     };
     popperAppendToBody: {
         type: BooleanConstructor;
-        default: boolean;
+        default: undefined;
     };
+    teleported: import("../../utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
     modelValue: import("vue").PropType<import("../cascader-panel/src/node").CascaderValue>;
     options: {
         type: import("vue").PropType<import("../cascader-panel/src/node").CascaderOption[]>;
@@ -1626,6 +1627,7 @@ declare const _Cascader: SFCWithInstall<import("vue").DefineComponent<{
     multiple: import("vue").ComputedRef<boolean>;
     readonly: import("vue").ComputedRef<boolean>;
     clearBtnVisible: import("vue").ComputedRef<boolean>;
+    compatTeleported: import("vue").ComputedRef<boolean>;
     t: import("../..").Translator;
     togglePopperVisible: (visible?: boolean | undefined) => void;
     hideSuggestionPanel: () => void;
@@ -1678,8 +1680,9 @@ declare const _Cascader: SFCWithInstall<import("vue").DefineComponent<{
     };
     popperAppendToBody: {
         type: BooleanConstructor;
-        default: boolean;
+        default: undefined;
     };
+    teleported: import("../../utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
     modelValue: import("vue").PropType<import("../cascader-panel/src/node").CascaderValue>;
     options: {
         type: import("vue").PropType<import("../cascader-panel/src/node").CascaderOption[]>;
@@ -1702,6 +1705,7 @@ declare const _Cascader: SFCWithInstall<import("vue").DefineComponent<{
     disabled: boolean;
     props: import("../cascader-panel/src/node").CascaderProps;
     popperClass: string;
+    teleported: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     clearable: boolean;
     debounce: number;
     popperAppendToBody: boolean;
@@ -1751,8 +1755,9 @@ export declare const ElCascader: SFCWithInstall<import("vue").DefineComponent<{
     };
     popperAppendToBody: {
         type: BooleanConstructor;
-        default: boolean;
+        default: undefined;
     };
+    teleported: import("../../utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
     modelValue: import("vue").PropType<import("../cascader-panel/src/node").CascaderValue>;
     options: {
         type: import("vue").PropType<import("../cascader-panel/src/node").CascaderOption[]>;
@@ -3340,6 +3345,7 @@ export declare const ElCascader: SFCWithInstall<import("vue").DefineComponent<{
     multiple: import("vue").ComputedRef<boolean>;
     readonly: import("vue").ComputedRef<boolean>;
     clearBtnVisible: import("vue").ComputedRef<boolean>;
+    compatTeleported: import("vue").ComputedRef<boolean>;
     t: import("../..").Translator;
     togglePopperVisible: (visible?: boolean | undefined) => void;
     hideSuggestionPanel: () => void;
@@ -3392,8 +3398,9 @@ export declare const ElCascader: SFCWithInstall<import("vue").DefineComponent<{
     };
     popperAppendToBody: {
         type: BooleanConstructor;
-        default: boolean;
+        default: undefined;
     };
+    teleported: import("../../utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
     modelValue: import("vue").PropType<import("../cascader-panel/src/node").CascaderValue>;
     options: {
         type: import("vue").PropType<import("../cascader-panel/src/node").CascaderOption[]>;
@@ -3416,6 +3423,7 @@ export declare const ElCascader: SFCWithInstall<import("vue").DefineComponent<{
     disabled: boolean;
     props: import("../cascader-panel/src/node").CascaderProps;
     popperClass: string;
+    teleported: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     clearable: boolean;
     debounce: number;
     popperAppendToBody: boolean;