element-plus 1.2.0-beta.1 → 1.2.0-beta.2

package/lib/components/table/src/table/style-helper.js.map

@@ -1 +1 @@
-{"version":3,"file":"style-helper.js","sources":["../../../../../../../packages/components/table/src/table/style-helper.ts"],"sourcesContent":["import {\n  onMounted,\n  onUnmounted,\n  computed,\n  ref,\n  watchEffect,\n  watch,\n  unref,\n  nextTick,\n} from 'vue'\nimport throttle from 'lodash/throttle'\nimport {\n  addResizeListener,\n  removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { useGlobalConfig } from '@element-plus/utils/util'\nimport { on, off } from '@element-plus/utils/dom'\nimport { parseHeight } from '../util'\n\nimport type { ResizableElement } from '@element-plus/utils/resize-event'\nimport type { Table, TableProps } from './defaults'\nimport type { Store } from '../store'\nimport type TableLayout from '../table-layout'\nimport type { TableColumnCtx } from '../table-column/defaults'\n\nfunction useStyle<T>(\n  props: TableProps<T>,\n  layout: TableLayout<T>,\n  store: Store<T>,\n  table: Table<T>\n) {\n  const $ELEMENT = useGlobalConfig()\n  const isHidden = ref(false)\n  const renderExpanded = ref(null)\n  const resizeProxyVisible = ref(false)\n  const setDragVisible = (visible: boolean) => {\n    resizeProxyVisible.value = visible\n  }\n  const resizeState = ref({\n    width: null,\n    height: null,\n  })\n  const isGroup = ref(false)\n\n  watchEffect(() => {\n    layout.setHeight(props.height)\n  })\n  watchEffect(() => {\n    layout.setMaxHeight(props.maxHeight)\n  })\n  watch(\n    () => [props.currentRowKey, store.states.rowKey],\n    ([currentRowKey, rowKey]) => {\n      if (!unref(rowKey)) return\n      store.setCurrentRowKey(`${currentRowKey}`)\n    },\n    {\n      immediate: true,\n    }\n  )\n  watch(\n    () => props.data,\n    (data) => {\n      table.store.commit('setData', data)\n    },\n    {\n      immediate: true,\n      deep: true,\n    }\n  )\n  watchEffect(() => {\n    if (props.expandRowKeys) {\n      store.setExpandRowKeysAdapter(props.expandRowKeys)\n    }\n  })\n\n  const handleMouseLeave = () => {\n    table.store.commit('setHoverRow', null)\n    if (table.hoverState) table.hoverState = null\n  }\n\n  const handleHeaderFooterMousewheel = (event, data) => {\n    const { pixelX, pixelY } = data\n    if (Math.abs(pixelX) >= Math.abs(pixelY)) {\n      table.refs.bodyWrapper.scrollLeft += data.pixelX / 5\n    }\n  }\n\n  const shouldUpdateHeight = computed(() => {\n    return (\n      props.height ||\n      props.maxHeight ||\n      store.states.fixedColumns.value.length > 0 ||\n      store.states.rightFixedColumns.value.length > 0\n    )\n  })\n\n  const doLayout = () => {\n    if (shouldUpdateHeight.value) {\n      layout.updateElsHeight()\n    }\n    layout.updateColumnsWidth()\n    syncPostion()\n  }\n  onMounted(async () => {\n    setScrollClass('is-scrolling-left')\n    store.updateColumns()\n    await nextTick()\n    bindEvents()\n    doLayout()\n\n    resizeState.value = {\n      width: table.vnode.el.offsetWidth,\n      height: table.vnode.el.offsetHeight,\n    }\n\n    // init filters\n    store.states.columns.value.forEach((column: TableColumnCtx<T>) => {\n      if (column.filteredValue && column.filteredValue.length) {\n        table.store.commit('filterChange', {\n          column,\n          values: column.filteredValue,\n          silent: true,\n        })\n      }\n    })\n    table.$ready = true\n  })\n  const setScrollClassByEl = (el: HTMLElement, className: string) => {\n    if (!el) return\n    const classList = Array.from(el.classList).filter(\n      (item) => !item.startsWith('is-scrolling-')\n    )\n    classList.push(layout.scrollX.value ? className : 'is-scrolling-none')\n    el.className = classList.join(' ')\n  }\n  const setScrollClass = (className: string) => {\n    const { bodyWrapper } = table.refs\n    setScrollClassByEl(bodyWrapper, className)\n  }\n  const syncPostion = throttle(function () {\n    if (!table.refs.bodyWrapper) return\n    const { scrollLeft, scrollTop, offsetWidth, scrollWidth } =\n      table.refs.bodyWrapper\n    const {\n      headerWrapper,\n      footerWrapper,\n      fixedBodyWrapper,\n      rightFixedBodyWrapper,\n    } = table.refs\n    if (headerWrapper) headerWrapper.scrollLeft = scrollLeft\n    if (footerWrapper) footerWrapper.scrollLeft = scrollLeft\n    if (fixedBodyWrapper) fixedBodyWrapper.scrollTop = scrollTop\n    if (rightFixedBodyWrapper) rightFixedBodyWrapper.scrollTop = scrollTop\n    const maxScrollLeftPosition = scrollWidth - offsetWidth - 1\n    if (scrollLeft >= maxScrollLeftPosition) {\n      setScrollClass('is-scrolling-right')\n    } else if (scrollLeft === 0) {\n      setScrollClass('is-scrolling-left')\n    } else {\n      setScrollClass('is-scrolling-middle')\n    }\n  }, 10)\n\n  const bindEvents = () => {\n    table.refs.bodyWrapper.addEventListener('scroll', syncPostion, {\n      passive: true,\n    })\n    if (props.fit) {\n      addResizeListener(table.vnode.el as ResizableElement, resizeListener)\n    } else {\n      on(window, 'resize', doLayout)\n    }\n  }\n  onUnmounted(() => {\n    unbindEvents()\n  })\n  const unbindEvents = () => {\n    table.refs.bodyWrapper?.removeEventListener('scroll', syncPostion, true)\n    if (props.fit) {\n      removeResizeListener(table.vnode.el as ResizableElement, resizeListener)\n    } else {\n      off(window, 'resize', doLayout)\n    }\n  }\n  const resizeListener = () => {\n    if (!table.$ready) return\n    let shouldUpdateLayout = false\n    const el = table.vnode.el\n    const { width: oldWidth, height: oldHeight } = resizeState.value\n\n    const width = el.offsetWidth\n    if (oldWidth !== width) {\n      shouldUpdateLayout = true\n    }\n\n    const height = el.offsetHeight\n    if ((props.height || shouldUpdateHeight.value) && oldHeight !== height) {\n      shouldUpdateLayout = true\n    }\n\n    if (shouldUpdateLayout) {\n      resizeState.value = {\n        width,\n        height,\n      }\n      doLayout()\n    }\n  }\n  const tableSize = computed(() => {\n    return props.size || $ELEMENT.size\n  })\n  const bodyWidth = computed(() => {\n    const { bodyWidth: bodyWidth_, scrollY, gutterWidth } = layout\n    return bodyWidth_.value\n      ? `${(bodyWidth_.value as number) - (scrollY.value ? gutterWidth : 0)}px`\n      : ''\n  })\n  const bodyHeight = computed(() => {\n    const headerHeight = layout.headerHeight.value || 0\n    const bodyHeight = layout.bodyHeight.value\n    const footerHeight = layout.footerHeight.value || 0\n    if (props.height) {\n      return {\n        height: bodyHeight ? `${bodyHeight}px` : '',\n      }\n    } else if (props.maxHeight) {\n      const maxHeight = parseHeight(props.maxHeight)\n      if (typeof maxHeight === 'number') {\n        return {\n          'max-height': `${\n            maxHeight - footerHeight - (props.showHeader ? headerHeight : 0)\n          }px`,\n        }\n      }\n    }\n    return {}\n  })\n  const emptyBlockStyle = computed(() => {\n    if (props.data && props.data.length) return null\n    let height = '100%'\n    if (layout.appendHeight.value) {\n      height = `calc(100% - ${layout.appendHeight.value}px)`\n    }\n    return {\n      width: bodyWidth.value,\n      height,\n    }\n  })\n  /**\n   * fix layout\n   */\n  const handleFixedMousewheel = (event, data) => {\n    const bodyWrapper = table.refs.bodyWrapper\n    if (Math.abs(data.spinY) > 0) {\n      const currentScrollTop = bodyWrapper.scrollTop\n      if (data.pixelY < 0 && currentScrollTop !== 0) {\n        event.preventDefault()\n      }\n      if (\n        data.pixelY > 0 &&\n        bodyWrapper.scrollHeight - bodyWrapper.clientHeight > currentScrollTop\n      ) {\n        event.preventDefault()\n      }\n      bodyWrapper.scrollTop += Math.ceil(data.pixelY / 5)\n    } else {\n      bodyWrapper.scrollLeft += Math.ceil(data.pixelX / 5)\n    }\n  }\n  const fixedHeight = computed(() => {\n    if (props.maxHeight) {\n      if (props.showSummary) {\n        return {\n          bottom: 0,\n        }\n      }\n      return {\n        bottom:\n          layout.scrollX.value && props.data.length\n            ? `${layout.gutterWidth}px`\n            : '',\n      }\n    } else {\n      if (props.showSummary) {\n        return {\n          height: layout.tableHeight.value\n            ? `${layout.tableHeight.value}px`\n            : '',\n        }\n      }\n      return {\n        height: layout.viewportHeight.value\n          ? `${layout.viewportHeight.value}px`\n          : '',\n      }\n    }\n  })\n  const fixedBodyHeight = computed(() => {\n    if (props.height) {\n      return {\n        height: layout.fixedBodyHeight.value\n          ? `${layout.fixedBodyHeight.value}px`\n          : '',\n      }\n    } else if (props.maxHeight) {\n      let maxHeight = parseHeight(props.maxHeight)\n      if (typeof maxHeight === 'number') {\n        maxHeight = layout.scrollX.value\n          ? maxHeight - layout.gutterWidth\n          : maxHeight\n        if (props.showHeader) {\n          maxHeight -= layout.headerHeight.value\n        }\n        maxHeight -= layout.footerHeight.value\n        return {\n          'max-height': `${maxHeight}px`,\n        }\n      }\n    }\n    return {}\n  })\n\n  return {\n    isHidden,\n    renderExpanded,\n    setDragVisible,\n    isGroup,\n    handleMouseLeave,\n    handleHeaderFooterMousewheel,\n    tableSize,\n    bodyHeight,\n    emptyBlockStyle,\n    handleFixedMousewheel,\n    fixedHeight,\n    fixedBodyHeight,\n    resizeProxyVisible,\n    bodyWidth,\n    resizeState,\n    doLayout,\n  }\n}\n\nexport default useStyle\n"],"names":["useGlobalConfig","ref","unref","computed","nextTick","throttle","parseHeight"],"mappings":"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"}
+{"version":3,"file":"style-helper.js","sources":["../../../../../../../packages/components/table/src/table/style-helper.ts"],"sourcesContent":["import {\n  onMounted,\n  onUnmounted,\n  computed,\n  ref,\n  watchEffect,\n  watch,\n  unref,\n  nextTick,\n} from 'vue'\nimport throttle from 'lodash/throttle'\nimport {\n  addResizeListener,\n  removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { useGlobalConfig } from '@element-plus/utils/util'\nimport { on, off } from '@element-plus/utils/dom'\nimport { parseHeight } from '../util'\n\nimport type { ResizableElement } from '@element-plus/utils/resize-event'\nimport type { Table, TableProps } from './defaults'\nimport type { Store } from '../store'\nimport type TableLayout from '../table-layout'\nimport type { TableColumnCtx } from '../table-column/defaults'\n\nfunction useStyle<T>(\n  props: TableProps<T>,\n  layout: TableLayout<T>,\n  store: Store<T>,\n  table: Table<T>\n) {\n  const $ELEMENT = useGlobalConfig()\n  const isHidden = ref(false)\n  const renderExpanded = ref(null)\n  const resizeProxyVisible = ref(false)\n  const setDragVisible = (visible: boolean) => {\n    resizeProxyVisible.value = visible\n  }\n  const resizeState = ref({\n    width: null,\n    height: null,\n  })\n  const isGroup = ref(false)\n\n  watchEffect(() => {\n    layout.setHeight(props.height)\n  })\n  watchEffect(() => {\n    layout.setMaxHeight(props.maxHeight)\n  })\n  watch(\n    () => [props.currentRowKey, store.states.rowKey],\n    ([currentRowKey, rowKey]) => {\n      if (!unref(rowKey)) return\n      store.setCurrentRowKey(`${currentRowKey}`)\n    },\n    {\n      immediate: true,\n    }\n  )\n  watch(\n    () => props.data,\n    (data) => {\n      table.store.commit('setData', data)\n    },\n    {\n      immediate: true,\n      deep: true,\n    }\n  )\n  watchEffect(() => {\n    if (props.expandRowKeys) {\n      store.setExpandRowKeysAdapter(props.expandRowKeys)\n    }\n  })\n\n  const handleMouseLeave = () => {\n    table.store.commit('setHoverRow', null)\n    if (table.hoverState) table.hoverState = null\n  }\n\n  const handleHeaderFooterMousewheel = (event, data) => {\n    const { pixelX, pixelY } = data\n    if (Math.abs(pixelX) >= Math.abs(pixelY)) {\n      table.refs.bodyWrapper.scrollLeft += data.pixelX / 5\n    }\n  }\n\n  const shouldUpdateHeight = computed(() => {\n    return (\n      props.height ||\n      props.maxHeight ||\n      store.states.fixedColumns.value.length > 0 ||\n      store.states.rightFixedColumns.value.length > 0\n    )\n  })\n\n  const doLayout = () => {\n    if (shouldUpdateHeight.value) {\n      layout.updateElsHeight()\n    }\n    layout.updateColumnsWidth()\n    requestAnimationFrame(syncPostion)\n  }\n  onMounted(async () => {\n    setScrollClass('is-scrolling-left')\n    store.updateColumns()\n    await nextTick()\n    bindEvents()\n    requestAnimationFrame(doLayout)\n\n    resizeState.value = {\n      width: table.vnode.el.offsetWidth,\n      height: table.vnode.el.offsetHeight,\n    }\n\n    // init filters\n    store.states.columns.value.forEach((column: TableColumnCtx<T>) => {\n      if (column.filteredValue && column.filteredValue.length) {\n        table.store.commit('filterChange', {\n          column,\n          values: column.filteredValue,\n          silent: true,\n        })\n      }\n    })\n    table.$ready = true\n  })\n  const setScrollClassByEl = (el: HTMLElement, className: string) => {\n    if (!el) return\n    const classList = Array.from(el.classList).filter(\n      (item) => !item.startsWith('is-scrolling-')\n    )\n    classList.push(layout.scrollX.value ? className : 'is-scrolling-none')\n    el.className = classList.join(' ')\n  }\n  const setScrollClass = (className: string) => {\n    const { bodyWrapper } = table.refs\n    setScrollClassByEl(bodyWrapper, className)\n  }\n  const syncPostion = throttle(function () {\n    if (!table.refs.bodyWrapper) return\n    const { scrollLeft, scrollTop, offsetWidth, scrollWidth } =\n      table.refs.bodyWrapper\n    const {\n      headerWrapper,\n      footerWrapper,\n      fixedBodyWrapper,\n      rightFixedBodyWrapper,\n    } = table.refs\n    if (headerWrapper) headerWrapper.scrollLeft = scrollLeft\n    if (footerWrapper) footerWrapper.scrollLeft = scrollLeft\n    if (fixedBodyWrapper) fixedBodyWrapper.scrollTop = scrollTop\n    if (rightFixedBodyWrapper) rightFixedBodyWrapper.scrollTop = scrollTop\n    const maxScrollLeftPosition = scrollWidth - offsetWidth - 1\n    if (scrollLeft >= maxScrollLeftPosition) {\n      setScrollClass('is-scrolling-right')\n    } else if (scrollLeft === 0) {\n      setScrollClass('is-scrolling-left')\n    } else {\n      setScrollClass('is-scrolling-middle')\n    }\n  }, 10)\n\n  const bindEvents = () => {\n    table.refs.bodyWrapper.addEventListener('scroll', syncPostion, {\n      passive: true,\n    })\n    if (props.fit) {\n      addResizeListener(table.vnode.el as ResizableElement, resizeListener)\n    } else {\n      on(window, 'resize', doLayout)\n    }\n  }\n  onUnmounted(() => {\n    unbindEvents()\n  })\n  const unbindEvents = () => {\n    table.refs.bodyWrapper?.removeEventListener('scroll', syncPostion, true)\n    if (props.fit) {\n      removeResizeListener(table.vnode.el as ResizableElement, resizeListener)\n    } else {\n      off(window, 'resize', doLayout)\n    }\n  }\n  const resizeListener = () => {\n    if (!table.$ready) return\n    let shouldUpdateLayout = false\n    const el = table.vnode.el\n    const { width: oldWidth, height: oldHeight } = resizeState.value\n\n    const width = el.offsetWidth\n    if (oldWidth !== width) {\n      shouldUpdateLayout = true\n    }\n\n    const height = el.offsetHeight\n    if ((props.height || shouldUpdateHeight.value) && oldHeight !== height) {\n      shouldUpdateLayout = true\n    }\n\n    if (shouldUpdateLayout) {\n      resizeState.value = {\n        width,\n        height,\n      }\n      doLayout()\n    }\n  }\n  const tableSize = computed(() => {\n    return props.size || $ELEMENT.size\n  })\n  const bodyWidth = computed(() => {\n    const { bodyWidth: bodyWidth_, scrollY, gutterWidth } = layout\n    return bodyWidth_.value\n      ? `${(bodyWidth_.value as number) - (scrollY.value ? gutterWidth : 0)}px`\n      : ''\n  })\n  const bodyHeight = computed(() => {\n    const headerHeight = layout.headerHeight.value || 0\n    const bodyHeight = layout.bodyHeight.value\n    const footerHeight = layout.footerHeight.value || 0\n    if (props.height) {\n      return {\n        height: bodyHeight ? `${bodyHeight}px` : '',\n      }\n    } else if (props.maxHeight) {\n      const maxHeight = parseHeight(props.maxHeight)\n      if (typeof maxHeight === 'number') {\n        return {\n          'max-height': `${\n            maxHeight - footerHeight - (props.showHeader ? headerHeight : 0)\n          }px`,\n        }\n      }\n    }\n    return {}\n  })\n  const emptyBlockStyle = computed(() => {\n    if (props.data && props.data.length) return null\n    let height = '100%'\n    if (layout.appendHeight.value) {\n      height = `calc(100% - ${layout.appendHeight.value}px)`\n    }\n    return {\n      width: bodyWidth.value,\n      height,\n    }\n  })\n  /**\n   * fix layout\n   */\n  const handleFixedMousewheel = (event, data) => {\n    const bodyWrapper = table.refs.bodyWrapper\n    if (Math.abs(data.spinY) > 0) {\n      const currentScrollTop = bodyWrapper.scrollTop\n      if (data.pixelY < 0 && currentScrollTop !== 0) {\n        event.preventDefault()\n      }\n      if (\n        data.pixelY > 0 &&\n        bodyWrapper.scrollHeight - bodyWrapper.clientHeight > currentScrollTop\n      ) {\n        event.preventDefault()\n      }\n      bodyWrapper.scrollTop += Math.ceil(data.pixelY / 5)\n    } else {\n      bodyWrapper.scrollLeft += Math.ceil(data.pixelX / 5)\n    }\n  }\n  const fixedHeight = computed(() => {\n    if (props.maxHeight) {\n      if (props.showSummary) {\n        return {\n          bottom: 0,\n        }\n      }\n      return {\n        bottom:\n          layout.scrollX.value && props.data.length\n            ? `${layout.gutterWidth}px`\n            : '',\n      }\n    } else {\n      if (props.showSummary) {\n        return {\n          height: layout.tableHeight.value\n            ? `${layout.tableHeight.value}px`\n            : '',\n        }\n      }\n      return {\n        height: layout.viewportHeight.value\n          ? `${layout.viewportHeight.value}px`\n          : '',\n      }\n    }\n  })\n  const fixedBodyHeight = computed(() => {\n    if (props.height) {\n      return {\n        height: layout.fixedBodyHeight.value\n          ? `${layout.fixedBodyHeight.value}px`\n          : '',\n      }\n    } else if (props.maxHeight) {\n      let maxHeight = parseHeight(props.maxHeight)\n      if (typeof maxHeight === 'number') {\n        maxHeight = layout.scrollX.value\n          ? maxHeight - layout.gutterWidth\n          : maxHeight\n        if (props.showHeader) {\n          maxHeight -= layout.headerHeight.value\n        }\n        maxHeight -= layout.footerHeight.value\n        return {\n          'max-height': `${maxHeight}px`,\n        }\n      }\n    }\n    return {}\n  })\n\n  return {\n    isHidden,\n    renderExpanded,\n    setDragVisible,\n    isGroup,\n    handleMouseLeave,\n    handleHeaderFooterMousewheel,\n    tableSize,\n    bodyHeight,\n    emptyBlockStyle,\n    handleFixedMousewheel,\n    fixedHeight,\n    fixedBodyHeight,\n    resizeProxyVisible,\n    bodyWidth,\n    resizeState,\n    doLayout,\n  }\n}\n\nexport default useStyle\n"],"names":["useGlobalConfig","ref","unref","computed","nextTick","throttle","parseHeight"],"mappings":";;;;;;;;;;;;;;;AAyBA,kBACE,OACA,QACA,OACA,OACA;AACA,QAAM,WAAWA;AACjB,QAAM,WAAWC,QAAI;AACrB,QAAM,iBAAiBA,QAAI;AAC3B,QAAM,qBAAqBA,QAAI;AAC/B,QAAM,iBAAiB,CAAC,YAAqB;AAC3C,uBAAmB,QAAQ;AAAA;AAE7B,QAAM,cAAcA,QAAI;AAAA,IACtB,OAAO;AAAA,IACP,QAAQ;AAAA;AAEV,QAAM,UAAUA,QAAI;AAEpB,kBAAY,MAAM;AAChB,WAAO,UAAU,MAAM;AAAA;AAEzB,kBAAY,MAAM;AAChB,WAAO,aAAa,MAAM;AAAA;AAE5B,YACE,MAAM,CAAC,MAAM,eAAe,MAAM,OAAO,SACzC,CAAC,CAAC,eAAe,YAAY;AAC3B,QAAI,CAACC,UAAM;AAAS;AACpB,UAAM,iBAAiB,GAAG;AAAA,KAE5B;AAAA,IACE,WAAW;AAAA;AAGf,YACE,MAAM,MAAM,MACZ,CAAC,SAAS;AACR,UAAM,MAAM,OAAO,WAAW;AAAA,KAEhC;AAAA,IACE,WAAW;AAAA,IACX,MAAM;AAAA;AAGV,kBAAY,MAAM;AAChB,QAAI,MAAM,eAAe;AACvB,YAAM,wBAAwB,MAAM;AAAA;AAAA;AAIxC,QAAM,mBAAmB,MAAM;AAC7B,UAAM,MAAM,OAAO,eAAe;AAClC,QAAI,MAAM;AAAY,YAAM,aAAa;AAAA;AAG3C,QAAM,+BAA+B,CAAC,OAAO,SAAS;AACpD,UAAM,EAAE,QAAQ,WAAW;AAC3B,QAAI,KAAK,IAAI,WAAW,KAAK,IAAI,SAAS;AACxC,YAAM,KAAK,YAAY,cAAc,KAAK,SAAS;AAAA;AAAA;AAIvD,QAAM,qBAAqBC,aAAS,MAAM;AACxC,WACE,MAAM,UACN,MAAM,aACN,MAAM,OAAO,aAAa,MAAM,SAAS,KACzC,MAAM,OAAO,kBAAkB,MAAM,SAAS;AAAA;AAIlD,QAAM,WAAW,MAAM;AACrB,QAAI,mBAAmB,OAAO;AAC5B,aAAO;AAAA;AAET,WAAO;AACP,0BAAsB;AAAA;AAExB,gBAAU,YAAY;AACpB,mBAAe;AACf,UAAM;AACN,UAAMC;AACN;AACA,0BAAsB;AAEtB,gBAAY,QAAQ;AAAA,MAClB,OAAO,MAAM,MAAM,GAAG;AAAA,MACtB,QAAQ,MAAM,MAAM,GAAG;AAAA;AAIzB,UAAM,OAAO,QAAQ,MAAM,QAAQ,CAAC,WAA8B;AAChE,UAAI,OAAO,iBAAiB,OAAO,cAAc,QAAQ;AACvD,cAAM,MAAM,OAAO,gBAAgB;AAAA,UACjC;AAAA,UACA,QAAQ,OAAO;AAAA,UACf,QAAQ;AAAA;AAAA;AAAA;AAId,UAAM,SAAS;AAAA;AAEjB,QAAM,qBAAqB,CAAC,IAAiB,cAAsB;AACjE,QAAI,CAAC;AAAI;AACT,UAAM,YAAY,MAAM,KAAK,GAAG,WAAW,OACzC,CAAC,SAAS,CAAC,KAAK,WAAW;AAE7B,cAAU,KAAK,OAAO,QAAQ,QAAQ,YAAY;AAClD,OAAG,YAAY,UAAU,KAAK;AAAA;AAEhC,QAAM,iBAAiB,CAAC,cAAsB;AAC5C,UAAM,EAAE,gBAAgB,MAAM;AAC9B,uBAAmB,aAAa;AAAA;AAElC,QAAM,cAAcC,6BAAS,WAAY;AACvC,QAAI,CAAC,MAAM,KAAK;AAAa;AAC7B,UAAM,EAAE,YAAY,WAAW,aAAa,gBAC1C,MAAM,KAAK;AACb,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,QACE,MAAM;AACV,QAAI;AAAe,oBAAc,aAAa;AAC9C,QAAI;AAAe,oBAAc,aAAa;AAC9C,QAAI;AAAkB,uBAAiB,YAAY;AACnD,QAAI;AAAuB,4BAAsB,YAAY;AAC7D,UAAM,wBAAwB,cAAc,cAAc;AAC1D,QAAI,cAAc,uBAAuB;AACvC,qBAAe;AAAA,eACN,eAAe,GAAG;AAC3B,qBAAe;AAAA,WACV;AACL,qBAAe;AAAA;AAAA,KAEhB;AAEH,QAAM,aAAa,MAAM;AACvB,UAAM,KAAK,YAAY,iBAAiB,UAAU,aAAa;AAAA,MAC7D,SAAS;AAAA;AAEX,QAAI,MAAM,KAAK;AACb,oCAAkB,MAAM,MAAM,IAAwB;AAAA,WACjD;AACL,aAAG,QAAQ,UAAU;AAAA;AAAA;AAGzB,kBAAY,MAAM;AAChB;AAAA;AAEF,QAAM,eAAe,MAAM;AAjL7B;AAkLI,gBAAM,KAAK,gBAAX,mBAAwB,oBAAoB,UAAU,aAAa;AACnE,QAAI,MAAM,KAAK;AACb,uCAAqB,MAAM,MAAM,IAAwB;AAAA,WACpD;AACL,cAAI,QAAQ,UAAU;AAAA;AAAA;AAG1B,QAAM,iBAAiB,MAAM;AAC3B,QAAI,CAAC,MAAM;AAAQ;AACnB,QAAI,qBAAqB;AACzB,UAAM,KAAK,MAAM,MAAM;AACvB,UAAM,EAAE,OAAO,UAAU,QAAQ,cAAc,YAAY;AAE3D,UAAM,QAAQ,GAAG;AACjB,QAAI,aAAa,OAAO;AACtB,2BAAqB;AAAA;AAGvB,UAAM,SAAS,GAAG;AAClB,QAAK,OAAM,UAAU,mBAAmB,UAAU,cAAc,QAAQ;AACtE,2BAAqB;AAAA;AAGvB,QAAI,oBAAoB;AACtB,kBAAY,QAAQ;AAAA,QAClB;AAAA,QACA;AAAA;AAEF;AAAA;AAAA;AAGJ,QAAM,YAAYF,aAAS,MAAM;AAC/B,WAAO,MAAM,QAAQ,SAAS;AAAA;AAEhC,QAAM,YAAYA,aAAS,MAAM;AAC/B,UAAM,EAAE,WAAW,YAAY,SAAS,gBAAgB;AACxD,WAAO,WAAW,QACd,GAAI,WAAW,iBAA4B,QAAQ,cAAc,SACjE;AAAA;AAEN,QAAM,aAAaA,aAAS,MAAM;AAChC,UAAM,eAAe,OAAO,aAAa,SAAS;AAClD,UAAM,cAAa,OAAO,WAAW;AACrC,UAAM,eAAe,OAAO,aAAa,SAAS;AAClD,QAAI,MAAM,QAAQ;AAChB,aAAO;AAAA,QACL,QAAQ,cAAa,GAAG,kBAAiB;AAAA;AAAA,eAElC,MAAM,WAAW;AAC1B,YAAM,YAAYG,mBAAY,MAAM;AACpC,UAAI,OAAO,cAAc,UAAU;AACjC,eAAO;AAAA,UACL,cAAc,GACZ,YAAY,sBAAsB,aAAa,eAAe;AAAA;AAAA;AAAA;AAKtE,WAAO;AAAA;AAET,QAAM,kBAAkBH,aAAS,MAAM;AACrC,QAAI,MAAM,QAAQ,MAAM,KAAK;AAAQ,aAAO;AAC5C,QAAI,SAAS;AACb,QAAI,OAAO,aAAa,OAAO;AAC7B,eAAS,eAAe,OAAO,aAAa;AAAA;AAE9C,WAAO;AAAA,MACL,OAAO,UAAU;AAAA,MACjB;AAAA;AAAA;AAMJ,QAAM,wBAAwB,CAAC,OAAO,SAAS;AAC7C,UAAM,cAAc,MAAM,KAAK;AAC/B,QAAI,KAAK,IAAI,KAAK,SAAS,GAAG;AAC5B,YAAM,mBAAmB,YAAY;AACrC,UAAI,KAAK,SAAS,KAAK,qBAAqB,GAAG;AAC7C,cAAM;AAAA;AAER,UACE,KAAK,SAAS,KACd,YAAY,eAAe,YAAY,eAAe,kBACtD;AACA,cAAM;AAAA;AAER,kBAAY,aAAa,KAAK,KAAK,KAAK,SAAS;AAAA,WAC5C;AACL,kBAAY,cAAc,KAAK,KAAK,KAAK,SAAS;AAAA;AAAA;AAGtD,QAAM,cAAcA,aAAS,MAAM;AACjC,QAAI,MAAM,WAAW;AACnB,UAAI,MAAM,aAAa;AACrB,eAAO;AAAA,UACL,QAAQ;AAAA;AAAA;AAGZ,aAAO;AAAA,QACL,QACE,OAAO,QAAQ,SAAS,MAAM,KAAK,SAC/B,GAAG,OAAO,kBACV;AAAA;AAAA,WAEH;AACL,UAAI,MAAM,aAAa;AACrB,eAAO;AAAA,UACL,QAAQ,OAAO,YAAY,QACvB,GAAG,OAAO,YAAY,YACtB;AAAA;AAAA;AAGR,aAAO;AAAA,QACL,QAAQ,OAAO,eAAe,QAC1B,GAAG,OAAO,eAAe,YACzB;AAAA;AAAA;AAAA;AAIV,QAAM,kBAAkBA,aAAS,MAAM;AACrC,QAAI,MAAM,QAAQ;AAChB,aAAO;AAAA,QACL,QAAQ,OAAO,gBAAgB,QAC3B,GAAG,OAAO,gBAAgB,YAC1B;AAAA;AAAA,eAEG,MAAM,WAAW;AAC1B,UAAI,YAAYG,mBAAY,MAAM;AAClC,UAAI,OAAO,cAAc,UAAU;AACjC,oBAAY,OAAO,QAAQ,QACvB,YAAY,OAAO,cACnB;AACJ,YAAI,MAAM,YAAY;AACpB,uBAAa,OAAO,aAAa;AAAA;AAEnC,qBAAa,OAAO,aAAa;AACjC,eAAO;AAAA,UACL,cAAc,GAAG;AAAA;AAAA;AAAA;AAIvB,WAAO;AAAA;AAGT,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA;;;;"}

package/lib/components/table/src/table-body/render-helper.js

@@ -27,8 +27,7 @@ function useRender(props) {
     getCellStyle,
     getCellClass,
     getSpan,
-    getColspanRealWidth,
-    isColumnHidden
+    getColspanRealWidth
   } = stylesHelper["default"](props);
   const firstDefaultColumnIndex = vue.computed(() => {
     return props.store.states.columns.value.findIndex(({ type }) => type === "default");
@@ -105,7 +104,7 @@ function useRender(props) {
     }));
   };
   const cellChildren = (cellIndex, column, data) => {
-    return isColumnHidden(cellIndex) ? null : column.renderCell(data);
+    return column.renderCell(data);
   };
   const wrappedRowRender = (row, $index) => {
     const store = props.store;

package/lib/components/table/src/table-body/render-helper.js.map

@@ -1 +1 @@
-{"version":3,"file":"render-helper.js","sources":["../../../../../../../packages/components/table/src/table-body/render-helper.ts"],"sourcesContent":["import { h, getCurrentInstance, computed } from 'vue'\nimport { getRowIdentity } from '../util'\nimport useEvents from './events-helper'\nimport useStyles from './styles-helper'\n\nimport type { TableBodyProps } from './defaults'\nimport type {\n  RenderRowData,\n  Table,\n  TreeNode,\n  TableProps,\n} from '../table/defaults'\n\nfunction useRender<T>(props: Partial<TableBodyProps<T>>) {\n  const instance = getCurrentInstance()\n  const parent = instance.parent as Table<T>\n  const {\n    handleDoubleClick,\n    handleClick,\n    handleContextMenu,\n    handleMouseEnter,\n    handleMouseLeave,\n    handleCellMouseEnter,\n    handleCellMouseLeave,\n    tooltipContent,\n    tooltipTrigger,\n  } = useEvents(props)\n  const {\n    getRowStyle,\n    getRowClass,\n    getCellStyle,\n    getCellClass,\n    getSpan,\n    getColspanRealWidth,\n    isColumnHidden,\n  } = useStyles(props)\n  const firstDefaultColumnIndex = computed(() => {\n    return props.store.states.columns.value.findIndex(\n      ({ type }) => type === 'default'\n    )\n  })\n  const getKeyOfRow = (row: T, index: number) => {\n    const rowKey = (parent.props as Partial<TableProps<T>>).rowKey\n    if (rowKey) {\n      return getRowIdentity(row, rowKey)\n    }\n    return index\n  }\n  const rowRender = (row: T, $index: number, treeRowData?: TreeNode) => {\n    const { tooltipEffect, store } = props\n    const { indent, columns } = store.states\n    const rowClasses = getRowClass(row, $index)\n    let display = true\n    if (treeRowData) {\n      rowClasses.push(`el-table__row--level-${treeRowData.level}`)\n      display = treeRowData.display\n    }\n    const displayStyle = display\n      ? null\n      : {\n          display: 'none',\n        }\n    return h(\n      'tr',\n      {\n        style: [displayStyle, getRowStyle(row, $index)],\n        class: rowClasses,\n        key: getKeyOfRow(row, $index),\n        onDblclick: ($event) => handleDoubleClick($event, row),\n        onClick: ($event) => handleClick($event, row),\n        onContextmenu: ($event) => handleContextMenu($event, row),\n        onMouseenter: () => handleMouseEnter($index),\n        onMouseleave: handleMouseLeave,\n      },\n      columns.value.map((column, cellIndex) => {\n        const { rowspan, colspan } = getSpan(row, column, $index, cellIndex)\n        if (!rowspan || !colspan) {\n          return null\n        }\n        const columnData = { ...column }\n        columnData.realWidth = getColspanRealWidth(\n          columns.value,\n          colspan,\n          cellIndex\n        )\n        const data: RenderRowData<T> = {\n          store: props.store,\n          _self: props.context || parent,\n          column: columnData,\n          row,\n          $index,\n        }\n        if (cellIndex === firstDefaultColumnIndex.value && treeRowData) {\n          data.treeNode = {\n            indent: treeRowData.level * indent.value,\n            level: treeRowData.level,\n          }\n          if (typeof treeRowData.expanded === 'boolean') {\n            data.treeNode.expanded = treeRowData.expanded\n            // 表明是懒加载\n            if ('loading' in treeRowData) {\n              data.treeNode.loading = treeRowData.loading\n            }\n            if ('noLazyChildren' in treeRowData) {\n              data.treeNode.noLazyChildren = treeRowData.noLazyChildren\n            }\n          }\n        }\n        const baseKey = `${$index},${cellIndex}`\n        const patchKey = columnData.columnKey || columnData.rawColumnKey || ''\n        const tdChildren = cellChildren(cellIndex, column, data)\n        return h(\n          'td',\n          {\n            style: getCellStyle($index, cellIndex, row, column),\n            class: getCellClass($index, cellIndex, row, column),\n            key: `${patchKey}${baseKey}`,\n            rowspan,\n            colspan,\n            onMouseenter: ($event) =>\n              handleCellMouseEnter($event, { ...row, tooltipEffect }),\n            onMouseleave: handleCellMouseLeave,\n          },\n          [tdChildren]\n        )\n      })\n    )\n  }\n  const cellChildren = (cellIndex, column, data) => {\n    return isColumnHidden(cellIndex) ? null : column.renderCell(data)\n  }\n  const wrappedRowRender = (row: T, $index: number) => {\n    const store = props.store\n    const { isRowExpanded, assertRowKey } = store\n    const { treeData, lazyTreeNodeMap, childrenColumnName, rowKey } =\n      store.states\n    const hasExpandColumn = store.states.columns.value.some(\n      ({ type }) => type === 'expand'\n    )\n    if (hasExpandColumn && isRowExpanded(row)) {\n      const renderExpanded = parent.renderExpanded\n      const tr = rowRender(row, $index, undefined)\n      if (!renderExpanded) {\n        console.error('[Element Error]renderExpanded is required.')\n        return tr\n      }\n      // 使用二维数组，避免修改 $index\n      // Use a two dimensional array avoid modifying $index\n      return [\n        [\n          tr,\n          h(\n            'tr',\n            {\n              key: `expanded-row__${tr.key as string}`,\n            },\n            [\n              h(\n                'td',\n                {\n                  colspan: store.states.columns.value.length,\n                  class: 'el-table__cell el-table__expanded-cell',\n                },\n                [renderExpanded({ row, $index, store })]\n              ),\n            ]\n          ),\n        ],\n      ]\n    } else if (Object.keys(treeData.value).length) {\n      assertRowKey()\n      // TreeTable 时，rowKey 必须由用户设定，不使用 getKeyOfRow 计算\n      // 在调用 rowRender 函数时，仍然会计算 rowKey，不太好的操作\n      const key = getRowIdentity(row, rowKey.value)\n      let cur = treeData.value[key]\n      let treeRowData = null\n      if (cur) {\n        treeRowData = {\n          expanded: cur.expanded,\n          level: cur.level,\n          display: true,\n        }\n        if (typeof cur.lazy === 'boolean') {\n          if (typeof cur.loaded === 'boolean' && cur.loaded) {\n            treeRowData.noLazyChildren = !(cur.children && cur.children.length)\n          }\n          treeRowData.loading = cur.loading\n        }\n      }\n      const tmp = [rowRender(row, $index, treeRowData)]\n      // 渲染嵌套数据\n      if (cur) {\n        // currentRow 记录的是 index，所以还需主动增加 TreeTable 的 index\n        let i = 0\n        const traverse = (children, parent) => {\n          if (!(children && children.length && parent)) return\n          children.forEach((node) => {\n            // 父节点的 display 状态影响子节点的显示状态\n            const innerTreeRowData = {\n              display: parent.display && parent.expanded,\n              level: parent.level + 1,\n              expanded: false,\n              noLazyChildren: false,\n              loading: false,\n            }\n            const childKey = getRowIdentity(node, rowKey.value)\n            if (childKey === undefined || childKey === null) {\n              throw new Error('For nested data item, row-key is required.')\n            }\n            cur = { ...treeData.value[childKey] }\n            // 对于当前节点，分成有无子节点两种情况。\n            // 如果包含子节点的，设置 expanded 属性。\n            // 对于它子节点的 display 属性由它本身的 expanded 与 display 共同决定。\n            if (cur) {\n              innerTreeRowData.expanded = cur.expanded\n              // 懒加载的某些节点，level 未知\n              cur.level = cur.level || innerTreeRowData.level\n              cur.display = !!(cur.expanded && innerTreeRowData.display)\n              if (typeof cur.lazy === 'boolean') {\n                if (typeof cur.loaded === 'boolean' && cur.loaded) {\n                  innerTreeRowData.noLazyChildren = !(\n                    cur.children && cur.children.length\n                  )\n                }\n                innerTreeRowData.loading = cur.loading\n              }\n            }\n            i++\n            tmp.push(rowRender(node, $index + i, innerTreeRowData))\n            if (cur) {\n              const nodes =\n                lazyTreeNodeMap.value[childKey] ||\n                node[childrenColumnName.value]\n              traverse(nodes, cur)\n            }\n          })\n        }\n        // 对于 root 节点，display 一定为 true\n        cur.display = true\n        const nodes =\n          lazyTreeNodeMap.value[key] || row[childrenColumnName.value]\n        traverse(nodes, cur)\n      }\n      return tmp\n    } else {\n      return rowRender(row, $index, undefined)\n    }\n  }\n\n  return {\n    wrappedRowRender,\n    tooltipContent,\n    tooltipTrigger,\n  }\n}\n\nexport default useRender\n"],"names":["getCurrentInstance","useEvents","useStyles","computed","getRowIdentity","h"],"mappings":"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"}
+{"version":3,"file":"render-helper.js","sources":["../../../../../../../packages/components/table/src/table-body/render-helper.ts"],"sourcesContent":["import { h, getCurrentInstance, computed } from 'vue'\nimport { getRowIdentity } from '../util'\nimport useEvents from './events-helper'\nimport useStyles from './styles-helper'\n\nimport type { TableBodyProps } from './defaults'\nimport type {\n  RenderRowData,\n  Table,\n  TreeNode,\n  TableProps,\n} from '../table/defaults'\n\nfunction useRender<T>(props: Partial<TableBodyProps<T>>) {\n  const instance = getCurrentInstance()\n  const parent = instance.parent as Table<T>\n  const {\n    handleDoubleClick,\n    handleClick,\n    handleContextMenu,\n    handleMouseEnter,\n    handleMouseLeave,\n    handleCellMouseEnter,\n    handleCellMouseLeave,\n    tooltipContent,\n    tooltipTrigger,\n  } = useEvents(props)\n  const {\n    getRowStyle,\n    getRowClass,\n    getCellStyle,\n    getCellClass,\n    getSpan,\n    getColspanRealWidth,\n  } = useStyles(props)\n  const firstDefaultColumnIndex = computed(() => {\n    return props.store.states.columns.value.findIndex(\n      ({ type }) => type === 'default'\n    )\n  })\n  const getKeyOfRow = (row: T, index: number) => {\n    const rowKey = (parent.props as Partial<TableProps<T>>).rowKey\n    if (rowKey) {\n      return getRowIdentity(row, rowKey)\n    }\n    return index\n  }\n  const rowRender = (row: T, $index: number, treeRowData?: TreeNode) => {\n    const { tooltipEffect, store } = props\n    const { indent, columns } = store.states\n    const rowClasses = getRowClass(row, $index)\n    let display = true\n    if (treeRowData) {\n      rowClasses.push(`el-table__row--level-${treeRowData.level}`)\n      display = treeRowData.display\n    }\n    const displayStyle = display\n      ? null\n      : {\n          display: 'none',\n        }\n    return h(\n      'tr',\n      {\n        style: [displayStyle, getRowStyle(row, $index)],\n        class: rowClasses,\n        key: getKeyOfRow(row, $index),\n        onDblclick: ($event) => handleDoubleClick($event, row),\n        onClick: ($event) => handleClick($event, row),\n        onContextmenu: ($event) => handleContextMenu($event, row),\n        onMouseenter: () => handleMouseEnter($index),\n        onMouseleave: handleMouseLeave,\n      },\n      columns.value.map((column, cellIndex) => {\n        const { rowspan, colspan } = getSpan(row, column, $index, cellIndex)\n        if (!rowspan || !colspan) {\n          return null\n        }\n        const columnData = { ...column }\n        columnData.realWidth = getColspanRealWidth(\n          columns.value,\n          colspan,\n          cellIndex\n        )\n        const data: RenderRowData<T> = {\n          store: props.store,\n          _self: props.context || parent,\n          column: columnData,\n          row,\n          $index,\n        }\n        if (cellIndex === firstDefaultColumnIndex.value && treeRowData) {\n          data.treeNode = {\n            indent: treeRowData.level * indent.value,\n            level: treeRowData.level,\n          }\n          if (typeof treeRowData.expanded === 'boolean') {\n            data.treeNode.expanded = treeRowData.expanded\n            // 表明是懒加载\n            if ('loading' in treeRowData) {\n              data.treeNode.loading = treeRowData.loading\n            }\n            if ('noLazyChildren' in treeRowData) {\n              data.treeNode.noLazyChildren = treeRowData.noLazyChildren\n            }\n          }\n        }\n        const baseKey = `${$index},${cellIndex}`\n        const patchKey = columnData.columnKey || columnData.rawColumnKey || ''\n        const tdChildren = cellChildren(cellIndex, column, data)\n        return h(\n          'td',\n          {\n            style: getCellStyle($index, cellIndex, row, column),\n            class: getCellClass($index, cellIndex, row, column),\n            key: `${patchKey}${baseKey}`,\n            rowspan,\n            colspan,\n            onMouseenter: ($event) =>\n              handleCellMouseEnter($event, { ...row, tooltipEffect }),\n            onMouseleave: handleCellMouseLeave,\n          },\n          [tdChildren]\n        )\n      })\n    )\n  }\n  const cellChildren = (cellIndex, column, data) => {\n    return column.renderCell(data)\n  }\n  const wrappedRowRender = (row: T, $index: number) => {\n    const store = props.store\n    const { isRowExpanded, assertRowKey } = store\n    const { treeData, lazyTreeNodeMap, childrenColumnName, rowKey } =\n      store.states\n    const hasExpandColumn = store.states.columns.value.some(\n      ({ type }) => type === 'expand'\n    )\n    if (hasExpandColumn && isRowExpanded(row)) {\n      const renderExpanded = parent.renderExpanded\n      const tr = rowRender(row, $index, undefined)\n      if (!renderExpanded) {\n        console.error('[Element Error]renderExpanded is required.')\n        return tr\n      }\n      // 使用二维数组，避免修改 $index\n      // Use a two dimensional array avoid modifying $index\n      return [\n        [\n          tr,\n          h(\n            'tr',\n            {\n              key: `expanded-row__${tr.key as string}`,\n            },\n            [\n              h(\n                'td',\n                {\n                  colspan: store.states.columns.value.length,\n                  class: 'el-table__cell el-table__expanded-cell',\n                },\n                [renderExpanded({ row, $index, store })]\n              ),\n            ]\n          ),\n        ],\n      ]\n    } else if (Object.keys(treeData.value).length) {\n      assertRowKey()\n      // TreeTable 时，rowKey 必须由用户设定，不使用 getKeyOfRow 计算\n      // 在调用 rowRender 函数时，仍然会计算 rowKey，不太好的操作\n      const key = getRowIdentity(row, rowKey.value)\n      let cur = treeData.value[key]\n      let treeRowData = null\n      if (cur) {\n        treeRowData = {\n          expanded: cur.expanded,\n          level: cur.level,\n          display: true,\n        }\n        if (typeof cur.lazy === 'boolean') {\n          if (typeof cur.loaded === 'boolean' && cur.loaded) {\n            treeRowData.noLazyChildren = !(cur.children && cur.children.length)\n          }\n          treeRowData.loading = cur.loading\n        }\n      }\n      const tmp = [rowRender(row, $index, treeRowData)]\n      // 渲染嵌套数据\n      if (cur) {\n        // currentRow 记录的是 index，所以还需主动增加 TreeTable 的 index\n        let i = 0\n        const traverse = (children, parent) => {\n          if (!(children && children.length && parent)) return\n          children.forEach((node) => {\n            // 父节点的 display 状态影响子节点的显示状态\n            const innerTreeRowData = {\n              display: parent.display && parent.expanded,\n              level: parent.level + 1,\n              expanded: false,\n              noLazyChildren: false,\n              loading: false,\n            }\n            const childKey = getRowIdentity(node, rowKey.value)\n            if (childKey === undefined || childKey === null) {\n              throw new Error('For nested data item, row-key is required.')\n            }\n            cur = { ...treeData.value[childKey] }\n            // 对于当前节点，分成有无子节点两种情况。\n            // 如果包含子节点的，设置 expanded 属性。\n            // 对于它子节点的 display 属性由它本身的 expanded 与 display 共同决定。\n            if (cur) {\n              innerTreeRowData.expanded = cur.expanded\n              // 懒加载的某些节点，level 未知\n              cur.level = cur.level || innerTreeRowData.level\n              cur.display = !!(cur.expanded && innerTreeRowData.display)\n              if (typeof cur.lazy === 'boolean') {\n                if (typeof cur.loaded === 'boolean' && cur.loaded) {\n                  innerTreeRowData.noLazyChildren = !(\n                    cur.children && cur.children.length\n                  )\n                }\n                innerTreeRowData.loading = cur.loading\n              }\n            }\n            i++\n            tmp.push(rowRender(node, $index + i, innerTreeRowData))\n            if (cur) {\n              const nodes =\n                lazyTreeNodeMap.value[childKey] ||\n                node[childrenColumnName.value]\n              traverse(nodes, cur)\n            }\n          })\n        }\n        // 对于 root 节点，display 一定为 true\n        cur.display = true\n        const nodes =\n          lazyTreeNodeMap.value[key] || row[childrenColumnName.value]\n        traverse(nodes, cur)\n      }\n      return tmp\n    } else {\n      return rowRender(row, $index, undefined)\n    }\n  }\n\n  return {\n    wrappedRowRender,\n    tooltipContent,\n    tooltipTrigger,\n  }\n}\n\nexport default useRender\n"],"names":["getCurrentInstance","useEvents","useStyles","computed","getRowIdentity","h"],"mappings":"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"}

package/lib/components/table/src/table-header/event-helper.js

@@ -68,7 +68,9 @@ function useEvent(props, emit) {
           const columnWidth = finalLeft - startColumnLeft;
           column.width = column.realWidth = columnWidth;
           table.emit("header-dragend", column.width, startLeft - startColumnLeft, column, event);
-          props.store.scheduleLayout(false, true);
+          requestAnimationFrame(() => {
+            props.store.scheduleLayout(false, true);
+          });
           document.body.style.cursor = "";
           dragging.value = false;
           draggingColumn.value = null;

package/lib/components/table/src/table-header/event-helper.js.map

@@ -1 +1 @@
-{"version":3,"file":"event-helper.js","sources":["../../../../../../../packages/components/table/src/table-header/event-helper.ts"],"sourcesContent":["import { getCurrentInstance, ref } from 'vue'\nimport { hasClass, addClass, removeClass } from '@element-plus/utils/dom'\nimport isServer from '@element-plus/utils/isServer'\n\nimport type { TableHeaderProps } from '.'\nimport type { TableColumnCtx } from '../table-column/defaults'\nimport type { Table } from '../table/defaults'\n\nfunction useEvent<T>(props: TableHeaderProps<T>, emit) {\n  const instance = getCurrentInstance()\n  const parent = instance.parent as Table<T>\n  const handleFilterClick = (event: Event) => {\n    event.stopPropagation()\n    return\n  }\n\n  const handleHeaderClick = (event: Event, column: TableColumnCtx<T>) => {\n    if (!column.filters && column.sortable) {\n      handleSortClick(event, column, false)\n    } else if (column.filterable && !column.sortable) {\n      handleFilterClick(event)\n    }\n    parent.emit('header-click', column, event)\n  }\n\n  const handleHeaderContextMenu = (event: Event, column: TableColumnCtx<T>) => {\n    parent.emit('header-contextmenu', column, event)\n  }\n  const draggingColumn = ref(null)\n  const dragging = ref(false)\n  const dragState = ref({})\n  const handleMouseDown = (event: MouseEvent, column: TableColumnCtx<T>) => {\n    if (isServer) return\n    if (column.children && column.children.length > 0) return\n    /* istanbul ignore if */\n    if (draggingColumn.value && props.border) {\n      dragging.value = true\n\n      const table = parent\n      emit('set-drag-visible', true)\n      const tableEl = table.vnode.el\n      const tableLeft = tableEl.getBoundingClientRect().left\n      const columnEl = instance.vnode.el.querySelector(`th.${column.id}`)\n      const columnRect = columnEl.getBoundingClientRect()\n      const minLeft = columnRect.left - tableLeft + 30\n\n      addClass(columnEl, 'noclick')\n\n      dragState.value = {\n        startMouseLeft: event.clientX,\n        startLeft: columnRect.right - tableLeft,\n        startColumnLeft: columnRect.left - tableLeft,\n        tableLeft,\n      }\n      const resizeProxy = table.refs.resizeProxy as HTMLElement\n      resizeProxy.style.left = `${(dragState.value as any).startLeft}px`\n\n      document.onselectstart = function () {\n        return false\n      }\n      document.ondragstart = function () {\n        return false\n      }\n\n      const handleMouseMove = (event: MouseEvent) => {\n        const deltaLeft =\n          event.clientX - (dragState.value as any).startMouseLeft\n        const proxyLeft = (dragState.value as any).startLeft + deltaLeft\n\n        resizeProxy.style.left = `${Math.max(minLeft, proxyLeft)}px`\n      }\n\n      const handleMouseUp = () => {\n        if (dragging.value) {\n          const { startColumnLeft, startLeft } = dragState.value as any\n          const finalLeft = parseInt(resizeProxy.style.left, 10)\n          const columnWidth = finalLeft - startColumnLeft\n          column.width = column.realWidth = columnWidth\n          table.emit(\n            'header-dragend',\n            column.width,\n            startLeft - startColumnLeft,\n            column,\n            event\n          )\n          props.store.scheduleLayout(false, true)\n\n          document.body.style.cursor = ''\n          dragging.value = false\n          draggingColumn.value = null\n          dragState.value = {}\n          emit('set-drag-visible', false)\n        }\n\n        document.removeEventListener('mousemove', handleMouseMove)\n        document.removeEventListener('mouseup', handleMouseUp)\n        document.onselectstart = null\n        document.ondragstart = null\n\n        setTimeout(function () {\n          removeClass(columnEl, 'noclick')\n        }, 0)\n      }\n\n      document.addEventListener('mousemove', handleMouseMove)\n      document.addEventListener('mouseup', handleMouseUp)\n    }\n  }\n\n  const handleMouseMove = (event: MouseEvent, column: TableColumnCtx<T>) => {\n    if (column.children && column.children.length > 0) return\n    let target = event.target as HTMLElement\n    while (target && target.tagName !== 'TH') {\n      target = target.parentNode as HTMLElement\n    }\n\n    if (!column || !column.resizable) return\n\n    if (!dragging.value && props.border) {\n      const rect = target.getBoundingClientRect()\n\n      const bodyStyle = document.body.style\n      if (rect.width > 12 && rect.right - event.pageX < 8) {\n        bodyStyle.cursor = 'col-resize'\n        if (hasClass(target, 'is-sortable')) {\n          target.style.cursor = 'col-resize'\n        }\n        draggingColumn.value = column\n      } else if (!dragging.value) {\n        bodyStyle.cursor = ''\n        if (hasClass(target, 'is-sortable')) {\n          target.style.cursor = 'pointer'\n        }\n        draggingColumn.value = null\n      }\n    }\n  }\n\n  const handleMouseOut = () => {\n    if (isServer) return\n    document.body.style.cursor = ''\n  }\n  const toggleOrder = ({ order, sortOrders }) => {\n    if (order === '') return sortOrders[0]\n    const index = sortOrders.indexOf(order || null)\n    return sortOrders[index > sortOrders.length - 2 ? 0 : index + 1]\n  }\n  const handleSortClick = (\n    event: Event,\n    column: TableColumnCtx<T>,\n    givenOrder: string | boolean\n  ) => {\n    event.stopPropagation()\n    const order =\n      column.order === givenOrder ? null : givenOrder || toggleOrder(column)\n\n    let target = event.target as HTMLElement\n    while (target && target.tagName !== 'TH') {\n      target = target.parentNode as HTMLElement\n    }\n\n    if (target && target.tagName === 'TH') {\n      if (hasClass(target, 'noclick')) {\n        removeClass(target, 'noclick')\n        return\n      }\n    }\n\n    if (!column.sortable) return\n\n    const states = props.store.states\n    let sortProp = states.sortProp.value\n    let sortOrder\n    const sortingColumn = states.sortingColumn.value\n\n    if (\n      sortingColumn !== column ||\n      (sortingColumn === column && sortingColumn.order === null)\n    ) {\n      if (sortingColumn) {\n        sortingColumn.order = null\n      }\n      states.sortingColumn.value = column\n      sortProp = column.property\n    }\n    if (!order) {\n      sortOrder = column.order = null\n    } else {\n      sortOrder = column.order = order\n    }\n\n    states.sortProp.value = sortProp\n    states.sortOrder.value = sortOrder\n\n    parent.store.commit('changeSortCondition')\n  }\n\n  return {\n    handleHeaderClick,\n    handleHeaderContextMenu,\n    handleMouseDown,\n    handleMouseMove,\n    handleMouseOut,\n    handleSortClick,\n    handleFilterClick,\n  }\n}\n\nexport default useEvent\n"],"names":["getCurrentInstance","ref","isServer","hasClass"],"mappings":"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"}
+{"version":3,"file":"event-helper.js","sources":["../../../../../../../packages/components/table/src/table-header/event-helper.ts"],"sourcesContent":["import { getCurrentInstance, ref } from 'vue'\nimport { hasClass, addClass, removeClass } from '@element-plus/utils/dom'\nimport isServer from '@element-plus/utils/isServer'\n\nimport type { TableHeaderProps } from '.'\nimport type { TableColumnCtx } from '../table-column/defaults'\nimport type { Table } from '../table/defaults'\n\nfunction useEvent<T>(props: TableHeaderProps<T>, emit) {\n  const instance = getCurrentInstance()\n  const parent = instance.parent as Table<T>\n  const handleFilterClick = (event: Event) => {\n    event.stopPropagation()\n    return\n  }\n\n  const handleHeaderClick = (event: Event, column: TableColumnCtx<T>) => {\n    if (!column.filters && column.sortable) {\n      handleSortClick(event, column, false)\n    } else if (column.filterable && !column.sortable) {\n      handleFilterClick(event)\n    }\n    parent.emit('header-click', column, event)\n  }\n\n  const handleHeaderContextMenu = (event: Event, column: TableColumnCtx<T>) => {\n    parent.emit('header-contextmenu', column, event)\n  }\n  const draggingColumn = ref(null)\n  const dragging = ref(false)\n  const dragState = ref({})\n  const handleMouseDown = (event: MouseEvent, column: TableColumnCtx<T>) => {\n    if (isServer) return\n    if (column.children && column.children.length > 0) return\n    /* istanbul ignore if */\n    if (draggingColumn.value && props.border) {\n      dragging.value = true\n\n      const table = parent\n      emit('set-drag-visible', true)\n      const tableEl = table.vnode.el\n      const tableLeft = tableEl.getBoundingClientRect().left\n      const columnEl = instance.vnode.el.querySelector(`th.${column.id}`)\n      const columnRect = columnEl.getBoundingClientRect()\n      const minLeft = columnRect.left - tableLeft + 30\n\n      addClass(columnEl, 'noclick')\n\n      dragState.value = {\n        startMouseLeft: event.clientX,\n        startLeft: columnRect.right - tableLeft,\n        startColumnLeft: columnRect.left - tableLeft,\n        tableLeft,\n      }\n      const resizeProxy = table.refs.resizeProxy as HTMLElement\n      resizeProxy.style.left = `${(dragState.value as any).startLeft}px`\n\n      document.onselectstart = function () {\n        return false\n      }\n      document.ondragstart = function () {\n        return false\n      }\n\n      const handleMouseMove = (event: MouseEvent) => {\n        const deltaLeft =\n          event.clientX - (dragState.value as any).startMouseLeft\n        const proxyLeft = (dragState.value as any).startLeft + deltaLeft\n\n        resizeProxy.style.left = `${Math.max(minLeft, proxyLeft)}px`\n      }\n\n      const handleMouseUp = () => {\n        if (dragging.value) {\n          const { startColumnLeft, startLeft } = dragState.value as any\n          const finalLeft = parseInt(resizeProxy.style.left, 10)\n          const columnWidth = finalLeft - startColumnLeft\n          column.width = column.realWidth = columnWidth\n          table.emit(\n            'header-dragend',\n            column.width,\n            startLeft - startColumnLeft,\n            column,\n            event\n          )\n          requestAnimationFrame(() => {\n            props.store.scheduleLayout(false, true)\n          })\n          document.body.style.cursor = ''\n          dragging.value = false\n          draggingColumn.value = null\n          dragState.value = {}\n          emit('set-drag-visible', false)\n        }\n\n        document.removeEventListener('mousemove', handleMouseMove)\n        document.removeEventListener('mouseup', handleMouseUp)\n        document.onselectstart = null\n        document.ondragstart = null\n\n        setTimeout(function () {\n          removeClass(columnEl, 'noclick')\n        }, 0)\n      }\n\n      document.addEventListener('mousemove', handleMouseMove)\n      document.addEventListener('mouseup', handleMouseUp)\n    }\n  }\n\n  const handleMouseMove = (event: MouseEvent, column: TableColumnCtx<T>) => {\n    if (column.children && column.children.length > 0) return\n    let target = event.target as HTMLElement\n    while (target && target.tagName !== 'TH') {\n      target = target.parentNode as HTMLElement\n    }\n\n    if (!column || !column.resizable) return\n\n    if (!dragging.value && props.border) {\n      const rect = target.getBoundingClientRect()\n\n      const bodyStyle = document.body.style\n      if (rect.width > 12 && rect.right - event.pageX < 8) {\n        bodyStyle.cursor = 'col-resize'\n        if (hasClass(target, 'is-sortable')) {\n          target.style.cursor = 'col-resize'\n        }\n        draggingColumn.value = column\n      } else if (!dragging.value) {\n        bodyStyle.cursor = ''\n        if (hasClass(target, 'is-sortable')) {\n          target.style.cursor = 'pointer'\n        }\n        draggingColumn.value = null\n      }\n    }\n  }\n\n  const handleMouseOut = () => {\n    if (isServer) return\n    document.body.style.cursor = ''\n  }\n  const toggleOrder = ({ order, sortOrders }) => {\n    if (order === '') return sortOrders[0]\n    const index = sortOrders.indexOf(order || null)\n    return sortOrders[index > sortOrders.length - 2 ? 0 : index + 1]\n  }\n  const handleSortClick = (\n    event: Event,\n    column: TableColumnCtx<T>,\n    givenOrder: string | boolean\n  ) => {\n    event.stopPropagation()\n    const order =\n      column.order === givenOrder ? null : givenOrder || toggleOrder(column)\n\n    let target = event.target as HTMLElement\n    while (target && target.tagName !== 'TH') {\n      target = target.parentNode as HTMLElement\n    }\n\n    if (target && target.tagName === 'TH') {\n      if (hasClass(target, 'noclick')) {\n        removeClass(target, 'noclick')\n        return\n      }\n    }\n\n    if (!column.sortable) return\n\n    const states = props.store.states\n    let sortProp = states.sortProp.value\n    let sortOrder\n    const sortingColumn = states.sortingColumn.value\n\n    if (\n      sortingColumn !== column ||\n      (sortingColumn === column && sortingColumn.order === null)\n    ) {\n      if (sortingColumn) {\n        sortingColumn.order = null\n      }\n      states.sortingColumn.value = column\n      sortProp = column.property\n    }\n    if (!order) {\n      sortOrder = column.order = null\n    } else {\n      sortOrder = column.order = order\n    }\n\n    states.sortProp.value = sortProp\n    states.sortOrder.value = sortOrder\n\n    parent.store.commit('changeSortCondition')\n  }\n\n  return {\n    handleHeaderClick,\n    handleHeaderContextMenu,\n    handleMouseDown,\n    handleMouseMove,\n    handleMouseOut,\n    handleSortClick,\n    handleFilterClick,\n  }\n}\n\nexport default useEvent\n"],"names":["getCurrentInstance","ref","isServer","hasClass"],"mappings":";;;;;;;;AAQA,kBAAqB,OAA4B,MAAM;AACrD,QAAM,WAAWA;AACjB,QAAM,SAAS,SAAS;AACxB,QAAM,oBAAoB,CAAC,UAAiB;AAC1C,UAAM;AACN;AAAA;AAGF,QAAM,oBAAoB,CAAC,OAAc,WAA8B;AACrE,QAAI,CAAC,OAAO,WAAW,OAAO,UAAU;AACtC,sBAAgB,OAAO,QAAQ;AAAA,eACtB,OAAO,cAAc,CAAC,OAAO,UAAU;AAChD,wBAAkB;AAAA;AAEpB,WAAO,KAAK,gBAAgB,QAAQ;AAAA;AAGtC,QAAM,0BAA0B,CAAC,OAAc,WAA8B;AAC3E,WAAO,KAAK,sBAAsB,QAAQ;AAAA;AAE5C,QAAM,iBAAiBC,QAAI;AAC3B,QAAM,WAAWA,QAAI;AACrB,QAAM,YAAYA,QAAI;AACtB,QAAM,kBAAkB,CAAC,OAAmB,WAA8B;AACxE,QAAIC;AAAU;AACd,QAAI,OAAO,YAAY,OAAO,SAAS,SAAS;AAAG;AAEnD,QAAI,eAAe,SAAS,MAAM,QAAQ;AACxC,eAAS,QAAQ;AAEjB,YAAM,QAAQ;AACd,WAAK,oBAAoB;AACzB,YAAM,UAAU,MAAM,MAAM;AAC5B,YAAM,YAAY,QAAQ,wBAAwB;AAClD,YAAM,WAAW,SAAS,MAAM,GAAG,cAAc,MAAM,OAAO;AAC9D,YAAM,aAAa,SAAS;AAC5B,YAAM,UAAU,WAAW,OAAO,YAAY;AAE9C,mBAAS,UAAU;AAEnB,gBAAU,QAAQ;AAAA,QAChB,gBAAgB,MAAM;AAAA,QACtB,WAAW,WAAW,QAAQ;AAAA,QAC9B,iBAAiB,WAAW,OAAO;AAAA,QACnC;AAAA;AAEF,YAAM,cAAc,MAAM,KAAK;AAC/B,kBAAY,MAAM,OAAO,GAAI,UAAU,MAAc;AAErD,eAAS,gBAAgB,WAAY;AACnC,eAAO;AAAA;AAET,eAAS,cAAc,WAAY;AACjC,eAAO;AAAA;AAGT,YAAM,mBAAkB,CAAC,WAAsB;AAC7C,cAAM,YACJ,OAAM,UAAW,UAAU,MAAc;AAC3C,cAAM,YAAa,UAAU,MAAc,YAAY;AAEvD,oBAAY,MAAM,OAAO,GAAG,KAAK,IAAI,SAAS;AAAA;AAGhD,YAAM,gBAAgB,MAAM;AAC1B,YAAI,SAAS,OAAO;AAClB,gBAAM,EAAE,iBAAiB,cAAc,UAAU;AACjD,gBAAM,YAAY,SAAS,YAAY,MAAM,MAAM;AACnD,gBAAM,cAAc,YAAY;AAChC,iBAAO,QAAQ,OAAO,YAAY;AAClC,gBAAM,KACJ,kBACA,OAAO,OACP,YAAY,iBACZ,QACA;AAEF,gCAAsB,MAAM;AAC1B,kBAAM,MAAM,eAAe,OAAO;AAAA;AAEpC,mBAAS,KAAK,MAAM,SAAS;AAC7B,mBAAS,QAAQ;AACjB,yBAAe,QAAQ;AACvB,oBAAU,QAAQ;AAClB,eAAK,oBAAoB;AAAA;AAG3B,iBAAS,oBAAoB,aAAa;AAC1C,iBAAS,oBAAoB,WAAW;AACxC,iBAAS,gBAAgB;AACzB,iBAAS,cAAc;AAEvB,mBAAW,WAAY;AACrB,0BAAY,UAAU;AAAA,WACrB;AAAA;AAGL,eAAS,iBAAiB,aAAa;AACvC,eAAS,iBAAiB,WAAW;AAAA;AAAA;AAIzC,QAAM,kBAAkB,CAAC,OAAmB,WAA8B;AACxE,QAAI,OAAO,YAAY,OAAO,SAAS,SAAS;AAAG;AACnD,QAAI,SAAS,MAAM;AACnB,WAAO,UAAU,OAAO,YAAY,MAAM;AACxC,eAAS,OAAO;AAAA;AAGlB,QAAI,CAAC,UAAU,CAAC,OAAO;AAAW;AAElC,QAAI,CAAC,SAAS,SAAS,MAAM,QAAQ;AACnC,YAAM,OAAO,OAAO;AAEpB,YAAM,YAAY,SAAS,KAAK;AAChC,UAAI,KAAK,QAAQ,MAAM,KAAK,QAAQ,MAAM,QAAQ,GAAG;AACnD,kBAAU,SAAS;AACnB,YAAIC,aAAS,QAAQ,gBAAgB;AACnC,iBAAO,MAAM,SAAS;AAAA;AAExB,uBAAe,QAAQ;AAAA,iBACd,CAAC,SAAS,OAAO;AAC1B,kBAAU,SAAS;AACnB,YAAIA,aAAS,QAAQ,gBAAgB;AACnC,iBAAO,MAAM,SAAS;AAAA;AAExB,uBAAe,QAAQ;AAAA;AAAA;AAAA;AAK7B,QAAM,iBAAiB,MAAM;AAC3B,QAAID;AAAU;AACd,aAAS,KAAK,MAAM,SAAS;AAAA;AAE/B,QAAM,cAAc,CAAC,EAAE,OAAO,iBAAiB;AAC7C,QAAI,UAAU;AAAI,aAAO,WAAW;AACpC,UAAM,QAAQ,WAAW,QAAQ,SAAS;AAC1C,WAAO,WAAW,QAAQ,WAAW,SAAS,IAAI,IAAI,QAAQ;AAAA;AAEhE,QAAM,kBAAkB,CACtB,OACA,QACA,eACG;AACH,UAAM;AACN,UAAM,QACJ,OAAO,UAAU,aAAa,OAAO,cAAc,YAAY;AAEjE,QAAI,SAAS,MAAM;AACnB,WAAO,UAAU,OAAO,YAAY,MAAM;AACxC,eAAS,OAAO;AAAA;AAGlB,QAAI,UAAU,OAAO,YAAY,MAAM;AACrC,UAAIC,aAAS,QAAQ,YAAY;AAC/B,wBAAY,QAAQ;AACpB;AAAA;AAAA;AAIJ,QAAI,CAAC,OAAO;AAAU;AAEtB,UAAM,SAAS,MAAM,MAAM;AAC3B,QAAI,WAAW,OAAO,SAAS;AAC/B,QAAI;AACJ,UAAM,gBAAgB,OAAO,cAAc;AAE3C,QACE,kBAAkB,UACjB,kBAAkB,UAAU,cAAc,UAAU,MACrD;AACA,UAAI,eAAe;AACjB,sBAAc,QAAQ;AAAA;AAExB,aAAO,cAAc,QAAQ;AAC7B,iBAAW,OAAO;AAAA;AAEpB,QAAI,CAAC,OAAO;AACV,kBAAY,OAAO,QAAQ;AAAA,WACtB;AACL,kBAAY,OAAO,QAAQ;AAAA;AAG7B,WAAO,SAAS,QAAQ;AACxB,WAAO,UAAU,QAAQ;AAEzB,WAAO,MAAM,OAAO;AAAA;AAGtB,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA;;;;"}

package/lib/components/tabs/src/tab-nav.vue_vue&type=script&lang.js

@@ -255,14 +255,14 @@ var script = vue.defineComponent({
           scrollable.prev ? "" : "is-disabled"
         ],
         onClick: scrollPrev
-      }, [vue.h(index.ElIcon, {}, () => [vue.h(icons.ArrowLeft)])]),
+      }, [vue.h(index.ElIcon, {}, { default: () => vue.h(icons.ArrowLeft) })]),
       vue.h("span", {
         class: [
           "el-tabs__nav-next",
           scrollable.next ? "" : "is-disabled"
         ],
         onClick: scrollNext
-      }, [vue.h("i", {}, () => [vue.h(icons.ArrowRight)])])
+      }, [vue.h(index.ElIcon, {}, { default: () => vue.h(icons.ArrowRight) })])
     ] : null;
     const tabs = panes.map((pane, index$1) => {
       var _a, _b;
@@ -274,7 +274,7 @@ var script = vue.defineComponent({
         onClick: (ev) => {
           onTabRemove(pane, ev);
         }
-      }, () => [vue.h(icons.Close)]) : null;
+      }, { default: () => vue.h(icons.Close) }) : null;
       const tabLabelContent = ((_b = (_a = pane.instance.slots).label) == null ? void 0 : _b.call(_a)) || pane.props.label;
       const tabindex = pane.active ? 0 : -1;
       return vue.h("div", {

package/lib/components/tabs/src/tab-nav.vue_vue&type=script&lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab-nav.vue_vue&type=script&lang.js","sources":["../../../../../../packages/components/tabs/src/tab-nav.vue"],"sourcesContent":["<script lang=\"ts\">\nimport {\n  h,\n  defineComponent,\n  ref,\n  inject,\n  computed,\n  onUpdated,\n  onMounted,\n  onBeforeUnmount,\n} from 'vue'\nimport { NOOP, capitalize } from '@vue/shared'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport {\n  addResizeListener,\n  removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { on, off } from '@element-plus/utils/dom'\nimport { throwError } from '@element-plus/utils/error'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowLeft, ArrowRight, Close } from '@element-plus/icons'\nimport TabBar from './tab-bar.vue'\n\nimport type { ResizableElement } from '@element-plus/utils/resize-event'\nimport type { PropType } from 'vue'\nimport type { Nullable } from '@element-plus/utils/types'\nimport type { RootTabs, Pane, ITabType } from './token'\n\ntype RefElement = Nullable<HTMLElement>\n\ninterface Scrollable {\n  next?: boolean\n  prev?: number\n}\n\nexport default defineComponent({\n  name: 'ElTabNav',\n  components: {\n    TabBar,\n  },\n  props: {\n    panes: {\n      type: Array as PropType<Pane[]>,\n      default: () => [] as Pane[],\n    },\n    currentName: {\n      type: String,\n      default: '',\n    },\n    editable: Boolean,\n    onTabClick: {\n      type: Function as PropType<\n        (tab: Pane, tabName: string, ev: Event) => void\n      >,\n      default: NOOP,\n    },\n    onTabRemove: {\n      type: Function as PropType<(tab: Pane, ev: Event) => void>,\n      default: NOOP,\n    },\n    type: {\n      type: String as PropType<ITabType>,\n      default: '',\n    },\n    stretch: Boolean,\n  },\n  setup() {\n    const rootTabs = inject<RootTabs>('rootTabs')\n    if (!rootTabs) {\n      throwError('[ElTabNav]', `ElTabNav must be nested inside ElTabs`)\n    }\n\n    const scrollable = ref<boolean | Scrollable>(false)\n    const navOffset = ref(0)\n    const isFocus = ref(false)\n    const focusable = ref(true)\n\n    const navScroll$ = ref<RefElement>(null)\n    const nav$ = ref<RefElement>(null)\n    const el$ = ref<RefElement>(null)\n\n    const sizeName = computed(() => {\n      return ['top', 'bottom'].includes(rootTabs.props.tabPosition)\n        ? 'width'\n        : 'height'\n    })\n    const navStyle = computed(() => {\n      const dir = sizeName.value === 'width' ? 'X' : 'Y'\n      return {\n        transform: `translate${dir}(-${navOffset.value}px)`,\n      }\n    })\n\n    const scrollPrev = () => {\n      const containerSize =\n        navScroll$.value[`offset${capitalize(sizeName.value)}`]\n      const currentOffset = navOffset.value\n\n      if (!currentOffset) return\n\n      const newOffset =\n        currentOffset > containerSize ? currentOffset - containerSize : 0\n\n      navOffset.value = newOffset\n    }\n\n    const scrollNext = () => {\n      const navSize = nav$.value[`offset${capitalize(sizeName.value)}`]\n      const containerSize =\n        navScroll$.value[`offset${capitalize(sizeName.value)}`]\n      const currentOffset = navOffset.value\n\n      if (navSize - currentOffset <= containerSize) return\n\n      const newOffset =\n        navSize - currentOffset > containerSize * 2\n          ? currentOffset + containerSize\n          : navSize - containerSize\n\n      navOffset.value = newOffset\n    }\n\n    const scrollToActiveTab = () => {\n      if (!scrollable.value) return\n      const nav = nav$.value\n      const activeTab = el$.value.querySelector('.is-active')\n      if (!activeTab) return\n      const navScroll = navScroll$.value\n      const isHorizontal = ['top', 'bottom'].includes(\n        rootTabs.props.tabPosition\n      )\n      const activeTabBounding = activeTab.getBoundingClientRect()\n      const navScrollBounding = navScroll.getBoundingClientRect()\n      const maxOffset = isHorizontal\n        ? nav.offsetWidth - navScrollBounding.width\n        : nav.offsetHeight - navScrollBounding.height\n      const currentOffset = navOffset.value\n      let newOffset = currentOffset\n\n      if (isHorizontal) {\n        if (activeTabBounding.left < navScrollBounding.left) {\n          newOffset =\n            currentOffset - (navScrollBounding.left - activeTabBounding.left)\n        }\n        if (activeTabBounding.right > navScrollBounding.right) {\n          newOffset =\n            currentOffset + activeTabBounding.right - navScrollBounding.right\n        }\n      } else {\n        if (activeTabBounding.top < navScrollBounding.top) {\n          newOffset =\n            currentOffset - (navScrollBounding.top - activeTabBounding.top)\n        }\n        if (activeTabBounding.bottom > navScrollBounding.bottom) {\n          newOffset =\n            currentOffset +\n            (activeTabBounding.bottom - navScrollBounding.bottom)\n        }\n      }\n      newOffset = Math.max(newOffset, 0)\n      navOffset.value = Math.min(newOffset, maxOffset)\n    }\n\n    const update = () => {\n      if (!nav$.value) return\n      const navSize = nav$.value[`offset${capitalize(sizeName.value)}`]\n      const containerSize =\n        navScroll$.value[`offset${capitalize(sizeName.value)}`]\n      const currentOffset = navOffset.value\n\n      if (containerSize < navSize) {\n        const currentOffset = navOffset.value\n        scrollable.value = (scrollable.value || {}) as Scrollable\n        scrollable.value.prev = currentOffset\n        scrollable.value.next = currentOffset + containerSize < navSize\n        if (navSize - currentOffset < containerSize) {\n          navOffset.value = navSize - containerSize\n        }\n      } else {\n        scrollable.value = false\n        if (currentOffset > 0) {\n          navOffset.value = 0\n        }\n      }\n    }\n\n    const changeTab = (e) => {\n      const code = e.code\n      let nextIndex\n      let currentIndex, tabList\n\n      const { up, down, left, right } = EVENT_CODE\n      if ([up, down, left, right].indexOf(code) !== -1) {\n        // 左右上下键更换tab\n        tabList = e.currentTarget.querySelectorAll('[role=tab]')\n        currentIndex = Array.prototype.indexOf.call(tabList, e.target)\n      } else {\n        return\n      }\n      if (code === left || code === up) {\n        // left\n        if (currentIndex === 0) {\n          // first\n          nextIndex = tabList.length - 1\n        } else {\n          nextIndex = currentIndex - 1\n        }\n      } else {\n        // right\n        if (currentIndex < tabList.length - 1) {\n          // not last\n          nextIndex = currentIndex + 1\n        } else {\n          nextIndex = 0\n        }\n      }\n      tabList[nextIndex].focus() // 改变焦点元素\n      tabList[nextIndex].click() // 选中下一个tab\n      setFocus()\n    }\n\n    const setFocus = () => {\n      if (focusable.value) {\n        isFocus.value = true\n      }\n    }\n\n    const removeFocus = () => {\n      isFocus.value = false\n    }\n\n    const visibilityChangeHandler = () => {\n      const visibility = document.visibilityState\n      if (visibility === 'hidden') {\n        focusable.value = false\n      } else if (visibility === 'visible') {\n        setTimeout(() => {\n          focusable.value = true\n        }, 50)\n      }\n    }\n\n    const windowBlurHandler = () => {\n      focusable.value = false\n    }\n\n    const windowFocusHandler = () => {\n      setTimeout(() => {\n        focusable.value = true\n      }, 50)\n    }\n\n    onUpdated(() => {\n      update()\n    })\n\n    onMounted(() => {\n      addResizeListener(el$.value as ResizableElement, update)\n      on(document, 'visibilitychange', visibilityChangeHandler)\n      on(window, 'blur', windowBlurHandler)\n      on(window, 'focus', windowFocusHandler)\n      setTimeout(() => {\n        scrollToActiveTab()\n      }, 0)\n    })\n\n    onBeforeUnmount(() => {\n      if (el$.value) {\n        removeResizeListener(el$.value as ResizableElement, update)\n      }\n      off(document, 'visibilitychange', visibilityChangeHandler)\n      off(window, 'blur', windowBlurHandler)\n      off(window, 'focus', windowFocusHandler)\n    })\n\n    return {\n      rootTabs,\n\n      scrollable,\n      navOffset,\n      isFocus,\n      focusable,\n\n      navScroll$,\n      nav$,\n      el$,\n\n      sizeName,\n      navStyle,\n\n      scrollPrev,\n      scrollNext,\n      scrollToActiveTab,\n      update,\n      changeTab,\n      setFocus,\n      removeFocus,\n      visibilityChangeHandler,\n      windowBlurHandler,\n      windowFocusHandler,\n    }\n  },\n  render() {\n    const {\n      type,\n      panes,\n      editable,\n      stretch,\n      onTabClick,\n      onTabRemove,\n      navStyle,\n      scrollable,\n      scrollNext,\n      scrollPrev,\n      changeTab,\n      setFocus,\n      removeFocus,\n      rootTabs,\n      isFocus,\n    } = this\n\n    const scrollBtn = scrollable\n      ? [\n          h(\n            'span',\n            {\n              class: [\n                'el-tabs__nav-prev',\n                scrollable.prev ? '' : 'is-disabled',\n              ],\n              onClick: scrollPrev,\n            },\n            [h(ElIcon, {}, () => [h(ArrowLeft)])]\n          ),\n          h(\n            'span',\n            {\n              class: [\n                'el-tabs__nav-next',\n                scrollable.next ? '' : 'is-disabled',\n              ],\n              onClick: scrollNext,\n            },\n            [h('i', {}, () => [h(ArrowRight)])]\n          ),\n        ]\n      : null\n\n    const tabs = panes.map((pane, index) => {\n      const tabName = pane.props.name || pane.index || `${index}`\n      const closable = pane.isClosable || editable\n\n      pane.index = `${index}`\n\n      const btnClose = closable\n        ? h(\n            ElIcon,\n            {\n              class: 'is-icon-close',\n              onClick: (ev) => {\n                onTabRemove(pane, ev)\n              },\n            },\n            () => [h(Close)]\n          )\n        : null\n\n      const tabLabelContent = pane.instance.slots.label?.() || pane.props.label\n      const tabindex = pane.active ? 0 : -1\n\n      return h(\n        'div',\n        {\n          class: {\n            'el-tabs__item': true,\n            [`is-${rootTabs.props.tabPosition}`]: true,\n            'is-active': pane.active,\n            'is-disabled': pane.props.disabled,\n            'is-closable': closable,\n            'is-focus': isFocus,\n          },\n          id: `tab-${tabName}`,\n          key: `tab-${tabName}`,\n          'aria-controls': `pane-${tabName}`,\n          role: 'tab',\n          'aria-selected': pane.active,\n          ref: `tab-${tabName}`,\n          tabindex,\n          onFocus: () => {\n            setFocus()\n          },\n          onBlur: () => {\n            removeFocus()\n          },\n          onClick: (ev) => {\n            removeFocus()\n            onTabClick(pane, tabName, ev)\n          },\n          onKeydown: (ev) => {\n            if (\n              closable &&\n              (ev.code === EVENT_CODE.delete ||\n                ev.code === EVENT_CODE.backspace)\n            ) {\n              onTabRemove(pane, ev)\n            }\n          },\n        },\n        [tabLabelContent, btnClose]\n      )\n    })\n\n    return h(\n      'div',\n      {\n        ref: 'el$',\n        class: [\n          'el-tabs__nav-wrap',\n          scrollable ? 'is-scrollable' : '',\n          `is-${rootTabs.props.tabPosition}`,\n        ],\n      },\n      [\n        scrollBtn,\n        h(\n          'div',\n          {\n            class: 'el-tabs__nav-scroll',\n            ref: 'navScroll$',\n          },\n          [\n            h(\n              'div',\n              {\n                class: [\n                  'el-tabs__nav',\n                  `is-${rootTabs.props.tabPosition}`,\n                  stretch &&\n                  ['top', 'bottom'].includes(rootTabs.props.tabPosition)\n                    ? 'is-stretch'\n                    : '',\n                ],\n                ref: 'nav$',\n                style: navStyle,\n                role: 'tablist',\n                onKeydown: changeTab,\n              },\n              [\n                !type\n                  ? h(TabBar, {\n                      tabs: [...panes],\n                    })\n                  : null,\n                tabs,\n              ]\n            ),\n          ]\n        ),\n      ]\n    )\n  },\n})\n</script>\n"],"names":["defineComponent","TabBar","NOOP","inject","ref","computed","capitalize","EVENT_CODE","h","ElIcon","ArrowLeft","ArrowRight","index","Close"],"mappings":"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"}
+{"version":3,"file":"tab-nav.vue_vue&type=script&lang.js","sources":["../../../../../../packages/components/tabs/src/tab-nav.vue"],"sourcesContent":["<script lang=\"ts\">\nimport {\n  h,\n  defineComponent,\n  ref,\n  inject,\n  computed,\n  onUpdated,\n  onMounted,\n  onBeforeUnmount,\n} from 'vue'\nimport { NOOP, capitalize } from '@vue/shared'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport {\n  addResizeListener,\n  removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { on, off } from '@element-plus/utils/dom'\nimport { throwError } from '@element-plus/utils/error'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowLeft, ArrowRight, Close } from '@element-plus/icons'\nimport TabBar from './tab-bar.vue'\n\nimport type { ResizableElement } from '@element-plus/utils/resize-event'\nimport type { PropType } from 'vue'\nimport type { Nullable } from '@element-plus/utils/types'\nimport type { RootTabs, Pane, ITabType } from './token'\n\ntype RefElement = Nullable<HTMLElement>\n\ninterface Scrollable {\n  next?: boolean\n  prev?: number\n}\n\nexport default defineComponent({\n  name: 'ElTabNav',\n  components: {\n    TabBar,\n  },\n  props: {\n    panes: {\n      type: Array as PropType<Pane[]>,\n      default: () => [] as Pane[],\n    },\n    currentName: {\n      type: String,\n      default: '',\n    },\n    editable: Boolean,\n    onTabClick: {\n      type: Function as PropType<\n        (tab: Pane, tabName: string, ev: Event) => void\n      >,\n      default: NOOP,\n    },\n    onTabRemove: {\n      type: Function as PropType<(tab: Pane, ev: Event) => void>,\n      default: NOOP,\n    },\n    type: {\n      type: String as PropType<ITabType>,\n      default: '',\n    },\n    stretch: Boolean,\n  },\n  setup() {\n    const rootTabs = inject<RootTabs>('rootTabs')\n    if (!rootTabs) {\n      throwError('[ElTabNav]', `ElTabNav must be nested inside ElTabs`)\n    }\n\n    const scrollable = ref<boolean | Scrollable>(false)\n    const navOffset = ref(0)\n    const isFocus = ref(false)\n    const focusable = ref(true)\n\n    const navScroll$ = ref<RefElement>(null)\n    const nav$ = ref<RefElement>(null)\n    const el$ = ref<RefElement>(null)\n\n    const sizeName = computed(() => {\n      return ['top', 'bottom'].includes(rootTabs.props.tabPosition)\n        ? 'width'\n        : 'height'\n    })\n    const navStyle = computed(() => {\n      const dir = sizeName.value === 'width' ? 'X' : 'Y'\n      return {\n        transform: `translate${dir}(-${navOffset.value}px)`,\n      }\n    })\n\n    const scrollPrev = () => {\n      const containerSize =\n        navScroll$.value[`offset${capitalize(sizeName.value)}`]\n      const currentOffset = navOffset.value\n\n      if (!currentOffset) return\n\n      const newOffset =\n        currentOffset > containerSize ? currentOffset - containerSize : 0\n\n      navOffset.value = newOffset\n    }\n\n    const scrollNext = () => {\n      const navSize = nav$.value[`offset${capitalize(sizeName.value)}`]\n      const containerSize =\n        navScroll$.value[`offset${capitalize(sizeName.value)}`]\n      const currentOffset = navOffset.value\n\n      if (navSize - currentOffset <= containerSize) return\n\n      const newOffset =\n        navSize - currentOffset > containerSize * 2\n          ? currentOffset + containerSize\n          : navSize - containerSize\n\n      navOffset.value = newOffset\n    }\n\n    const scrollToActiveTab = () => {\n      if (!scrollable.value) return\n      const nav = nav$.value\n      const activeTab = el$.value.querySelector('.is-active')\n      if (!activeTab) return\n      const navScroll = navScroll$.value\n      const isHorizontal = ['top', 'bottom'].includes(\n        rootTabs.props.tabPosition\n      )\n      const activeTabBounding = activeTab.getBoundingClientRect()\n      const navScrollBounding = navScroll.getBoundingClientRect()\n      const maxOffset = isHorizontal\n        ? nav.offsetWidth - navScrollBounding.width\n        : nav.offsetHeight - navScrollBounding.height\n      const currentOffset = navOffset.value\n      let newOffset = currentOffset\n\n      if (isHorizontal) {\n        if (activeTabBounding.left < navScrollBounding.left) {\n          newOffset =\n            currentOffset - (navScrollBounding.left - activeTabBounding.left)\n        }\n        if (activeTabBounding.right > navScrollBounding.right) {\n          newOffset =\n            currentOffset + activeTabBounding.right - navScrollBounding.right\n        }\n      } else {\n        if (activeTabBounding.top < navScrollBounding.top) {\n          newOffset =\n            currentOffset - (navScrollBounding.top - activeTabBounding.top)\n        }\n        if (activeTabBounding.bottom > navScrollBounding.bottom) {\n          newOffset =\n            currentOffset +\n            (activeTabBounding.bottom - navScrollBounding.bottom)\n        }\n      }\n      newOffset = Math.max(newOffset, 0)\n      navOffset.value = Math.min(newOffset, maxOffset)\n    }\n\n    const update = () => {\n      if (!nav$.value) return\n      const navSize = nav$.value[`offset${capitalize(sizeName.value)}`]\n      const containerSize =\n        navScroll$.value[`offset${capitalize(sizeName.value)}`]\n      const currentOffset = navOffset.value\n\n      if (containerSize < navSize) {\n        const currentOffset = navOffset.value\n        scrollable.value = (scrollable.value || {}) as Scrollable\n        scrollable.value.prev = currentOffset\n        scrollable.value.next = currentOffset + containerSize < navSize\n        if (navSize - currentOffset < containerSize) {\n          navOffset.value = navSize - containerSize\n        }\n      } else {\n        scrollable.value = false\n        if (currentOffset > 0) {\n          navOffset.value = 0\n        }\n      }\n    }\n\n    const changeTab = (e) => {\n      const code = e.code\n      let nextIndex\n      let currentIndex, tabList\n\n      const { up, down, left, right } = EVENT_CODE\n      if ([up, down, left, right].indexOf(code) !== -1) {\n        // 左右上下键更换tab\n        tabList = e.currentTarget.querySelectorAll('[role=tab]')\n        currentIndex = Array.prototype.indexOf.call(tabList, e.target)\n      } else {\n        return\n      }\n      if (code === left || code === up) {\n        // left\n        if (currentIndex === 0) {\n          // first\n          nextIndex = tabList.length - 1\n        } else {\n          nextIndex = currentIndex - 1\n        }\n      } else {\n        // right\n        if (currentIndex < tabList.length - 1) {\n          // not last\n          nextIndex = currentIndex + 1\n        } else {\n          nextIndex = 0\n        }\n      }\n      tabList[nextIndex].focus() // 改变焦点元素\n      tabList[nextIndex].click() // 选中下一个tab\n      setFocus()\n    }\n\n    const setFocus = () => {\n      if (focusable.value) {\n        isFocus.value = true\n      }\n    }\n\n    const removeFocus = () => {\n      isFocus.value = false\n    }\n\n    const visibilityChangeHandler = () => {\n      const visibility = document.visibilityState\n      if (visibility === 'hidden') {\n        focusable.value = false\n      } else if (visibility === 'visible') {\n        setTimeout(() => {\n          focusable.value = true\n        }, 50)\n      }\n    }\n\n    const windowBlurHandler = () => {\n      focusable.value = false\n    }\n\n    const windowFocusHandler = () => {\n      setTimeout(() => {\n        focusable.value = true\n      }, 50)\n    }\n\n    onUpdated(() => {\n      update()\n    })\n\n    onMounted(() => {\n      addResizeListener(el$.value as ResizableElement, update)\n      on(document, 'visibilitychange', visibilityChangeHandler)\n      on(window, 'blur', windowBlurHandler)\n      on(window, 'focus', windowFocusHandler)\n      setTimeout(() => {\n        scrollToActiveTab()\n      }, 0)\n    })\n\n    onBeforeUnmount(() => {\n      if (el$.value) {\n        removeResizeListener(el$.value as ResizableElement, update)\n      }\n      off(document, 'visibilitychange', visibilityChangeHandler)\n      off(window, 'blur', windowBlurHandler)\n      off(window, 'focus', windowFocusHandler)\n    })\n\n    return {\n      rootTabs,\n\n      scrollable,\n      navOffset,\n      isFocus,\n      focusable,\n\n      navScroll$,\n      nav$,\n      el$,\n\n      sizeName,\n      navStyle,\n\n      scrollPrev,\n      scrollNext,\n      scrollToActiveTab,\n      update,\n      changeTab,\n      setFocus,\n      removeFocus,\n      visibilityChangeHandler,\n      windowBlurHandler,\n      windowFocusHandler,\n    }\n  },\n  render() {\n    const {\n      type,\n      panes,\n      editable,\n      stretch,\n      onTabClick,\n      onTabRemove,\n      navStyle,\n      scrollable,\n      scrollNext,\n      scrollPrev,\n      changeTab,\n      setFocus,\n      removeFocus,\n      rootTabs,\n      isFocus,\n    } = this\n\n    const scrollBtn = scrollable\n      ? [\n          h(\n            'span',\n            {\n              class: [\n                'el-tabs__nav-prev',\n                scrollable.prev ? '' : 'is-disabled',\n              ],\n              onClick: scrollPrev,\n            },\n            [h(ElIcon, {}, { default: () => h(ArrowLeft) })]\n          ),\n          h(\n            'span',\n            {\n              class: [\n                'el-tabs__nav-next',\n                scrollable.next ? '' : 'is-disabled',\n              ],\n              onClick: scrollNext,\n            },\n            [h(ElIcon, {}, { default: () => h(ArrowRight) })]\n          ),\n        ]\n      : null\n\n    const tabs = panes.map((pane, index) => {\n      const tabName = pane.props.name || pane.index || `${index}`\n      const closable = pane.isClosable || editable\n\n      pane.index = `${index}`\n\n      const btnClose = closable\n        ? h(\n            ElIcon,\n            {\n              class: 'is-icon-close',\n              onClick: (ev) => {\n                onTabRemove(pane, ev)\n              },\n            },\n            { default: () => h(Close) }\n          )\n        : null\n\n      const tabLabelContent = pane.instance.slots.label?.() || pane.props.label\n      const tabindex = pane.active ? 0 : -1\n\n      return h(\n        'div',\n        {\n          class: {\n            'el-tabs__item': true,\n            [`is-${rootTabs.props.tabPosition}`]: true,\n            'is-active': pane.active,\n            'is-disabled': pane.props.disabled,\n            'is-closable': closable,\n            'is-focus': isFocus,\n          },\n          id: `tab-${tabName}`,\n          key: `tab-${tabName}`,\n          'aria-controls': `pane-${tabName}`,\n          role: 'tab',\n          'aria-selected': pane.active,\n          ref: `tab-${tabName}`,\n          tabindex,\n          onFocus: () => {\n            setFocus()\n          },\n          onBlur: () => {\n            removeFocus()\n          },\n          onClick: (ev) => {\n            removeFocus()\n            onTabClick(pane, tabName, ev)\n          },\n          onKeydown: (ev) => {\n            if (\n              closable &&\n              (ev.code === EVENT_CODE.delete ||\n                ev.code === EVENT_CODE.backspace)\n            ) {\n              onTabRemove(pane, ev)\n            }\n          },\n        },\n        [tabLabelContent, btnClose]\n      )\n    })\n\n    return h(\n      'div',\n      {\n        ref: 'el$',\n        class: [\n          'el-tabs__nav-wrap',\n          scrollable ? 'is-scrollable' : '',\n          `is-${rootTabs.props.tabPosition}`,\n        ],\n      },\n      [\n        scrollBtn,\n        h(\n          'div',\n          {\n            class: 'el-tabs__nav-scroll',\n            ref: 'navScroll$',\n          },\n          [\n            h(\n              'div',\n              {\n                class: [\n                  'el-tabs__nav',\n                  `is-${rootTabs.props.tabPosition}`,\n                  stretch &&\n                  ['top', 'bottom'].includes(rootTabs.props.tabPosition)\n                    ? 'is-stretch'\n                    : '',\n                ],\n                ref: 'nav$',\n                style: navStyle,\n                role: 'tablist',\n                onKeydown: changeTab,\n              },\n              [\n                !type\n                  ? h(TabBar, {\n                      tabs: [...panes],\n                    })\n                  : null,\n                tabs,\n              ]\n            ),\n          ]\n        ),\n      ]\n    )\n  },\n})\n</script>\n"],"names":["defineComponent","TabBar","NOOP","inject","ref","computed","capitalize","EVENT_CODE","h","ElIcon","ArrowLeft","ArrowRight","index","Close"],"mappings":"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"}

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

@@ -181,7 +181,7 @@ var Tabs = vue.defineComponent({
           handleTabAdd();
         }
       }
-    }, [vue.h(index.ElIcon, { class: "is-icon-plus" }, () => [icons.Plus])]) : null;
+    }, [vue.h(index.ElIcon, { class: "is-icon-plus" }, { default: () => vue.h(icons.Plus) })]) : null;
     const header = vue.h("div", {
       class: ["el-tabs__header", `is-${tabPosition}`]
     }, [

package/lib/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  nextTick,\n  onMounted,\n  onUpdated,\n  provide,\n  ref,\n  watch,\n} from 'vue'\nimport { isPromise } from '@vue/shared'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport ElIcon from '@element-plus/components/icon'\nimport { Plus } from '@element-plus/icons'\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: 'ElTabs',\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  emits: [\n    'tab-click',\n    'edit',\n    'tab-remove',\n    'tab-add',\n    'input',\n    'update:modelValue',\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    watch(\n      () => props.activeName,\n      (modelValue) => {\n        setCurrentName(modelValue)\n      }\n    )\n\n    watch(\n      () => props.modelValue,\n      (modelValue) => {\n        setCurrentName(modelValue)\n      }\n    )\n\n    watch(currentName, () => {\n      nextTick(() => {\n        nav$.value &&\n          nav$.value.$nextTick(() => {\n            nav$.value && nav$.value.scrollToActiveTab()\n          })\n      })\n      setPaneInstances(true)\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 === 'ElTabPane' && 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    const changeCurrentName = (value) => {\n      currentName.value = value\n      ctx.emit('input', value)\n      ctx.emit('update:modelValue', value)\n    }\n\n    const setCurrentName = (value) => {\n      // should do nothing.\n      if (currentName.value === value) return\n\n      const beforeLeave = props.beforeLeave\n      const before = beforeLeave && beforeLeave(value, currentName.value)\n      if (before && isPromise(before)) {\n        before.then(\n          () => {\n            changeCurrentName(value)\n            nav$.value.removeFocus?.()\n          },\n          () => {\n            // ignore promise rejection in `before-leave` hook\n          }\n        )\n      } else if (before !== false) {\n        changeCurrentName(value)\n      }\n    }\n\n    const handleTabClick = (tab, tabName, event) => {\n      if (tab.props.disabled) return\n      setCurrentName(tabName)\n      ctx.emit('tab-click', tab, event)\n    }\n\n    const handleTabRemove = (pane, ev) => {\n      if (pane.props.disabled) return\n      ev.stopPropagation()\n      ctx.emit('edit', pane.props.name, 'remove')\n      ctx.emit('tab-remove', pane.props.name)\n    }\n\n    const handleTabAdd = () => {\n      ctx.emit('edit', null, 'add')\n      ctx.emit('tab-add')\n    }\n\n    onUpdated(() => {\n      setPaneInstances()\n    })\n\n    onMounted(() => {\n      setPaneInstances()\n    })\n\n    return {\n      nav$,\n      handleTabClick,\n      handleTabRemove,\n      handleTabAdd,\n      currentName,\n      panes,\n    }\n  },\n\n  render() {\n    const {\n      type,\n      handleTabClick,\n      handleTabRemove,\n      handleTabAdd,\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              onClick: handleTabAdd,\n              onKeydown: (ev) => {\n                if (ev.code === EVENT_CODE.enter) {\n                  handleTabAdd()\n                }\n              },\n            },\n            [h(ElIcon, { class: 'is-icon-plus' }, () => [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          onTabClick: handleTabClick,\n          onTabRemove: handleTabRemove,\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","isPromise","h","EVENT_CODE","ElIcon","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  nextTick,\n  onMounted,\n  onUpdated,\n  provide,\n  ref,\n  watch,\n} from 'vue'\nimport { isPromise } from '@vue/shared'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport ElIcon from '@element-plus/components/icon'\nimport { Plus } from '@element-plus/icons'\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: 'ElTabs',\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  emits: [\n    'tab-click',\n    'edit',\n    'tab-remove',\n    'tab-add',\n    'input',\n    'update:modelValue',\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    watch(\n      () => props.activeName,\n      (modelValue) => {\n        setCurrentName(modelValue)\n      }\n    )\n\n    watch(\n      () => props.modelValue,\n      (modelValue) => {\n        setCurrentName(modelValue)\n      }\n    )\n\n    watch(currentName, () => {\n      nextTick(() => {\n        nav$.value &&\n          nav$.value.$nextTick(() => {\n            nav$.value && nav$.value.scrollToActiveTab()\n          })\n      })\n      setPaneInstances(true)\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 === 'ElTabPane' && 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    const changeCurrentName = (value) => {\n      currentName.value = value\n      ctx.emit('input', value)\n      ctx.emit('update:modelValue', value)\n    }\n\n    const setCurrentName = (value) => {\n      // should do nothing.\n      if (currentName.value === value) return\n\n      const beforeLeave = props.beforeLeave\n      const before = beforeLeave && beforeLeave(value, currentName.value)\n      if (before && isPromise(before)) {\n        before.then(\n          () => {\n            changeCurrentName(value)\n            nav$.value.removeFocus?.()\n          },\n          () => {\n            // ignore promise rejection in `before-leave` hook\n          }\n        )\n      } else if (before !== false) {\n        changeCurrentName(value)\n      }\n    }\n\n    const handleTabClick = (tab, tabName, event) => {\n      if (tab.props.disabled) return\n      setCurrentName(tabName)\n      ctx.emit('tab-click', tab, event)\n    }\n\n    const handleTabRemove = (pane, ev) => {\n      if (pane.props.disabled) return\n      ev.stopPropagation()\n      ctx.emit('edit', pane.props.name, 'remove')\n      ctx.emit('tab-remove', pane.props.name)\n    }\n\n    const handleTabAdd = () => {\n      ctx.emit('edit', null, 'add')\n      ctx.emit('tab-add')\n    }\n\n    onUpdated(() => {\n      setPaneInstances()\n    })\n\n    onMounted(() => {\n      setPaneInstances()\n    })\n\n    return {\n      nav$,\n      handleTabClick,\n      handleTabRemove,\n      handleTabAdd,\n      currentName,\n      panes,\n    }\n  },\n\n  render() {\n    const {\n      type,\n      handleTabClick,\n      handleTabRemove,\n      handleTabAdd,\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              onClick: handleTabAdd,\n              onKeydown: (ev) => {\n                if (ev.code === EVENT_CODE.enter) {\n                  handleTabAdd()\n                }\n              },\n            },\n            [h(ElIcon, { 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          onTabClick: handleTabClick,\n          onTabRemove: handleTabRemove,\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","isPromise","h","EVENT_CODE","ElIcon","Plus"],"mappings":"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"}

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

@@ -0,0 +1,23 @@
+export declare const ElTeleport: import("../../utils/types").SFCWithInstall<import("vue").DefineComponent<{
+    container: import("../../utils/props").BuildPropReturn<import("../../utils/props").PropWrapper<string | HTMLElement>, string, unknown, unknown, unknown>;
+    style: import("../../utils/props").BuildPropReturn<import("../../utils/props").PropWrapper<import("vue").StyleValue>, unknown, unknown, unknown, unknown>;
+    zIndex: import("../../utils/props").BuildPropReturn<StringConstructor, string, unknown, unknown, unknown>;
+}, {
+    containerRef: import("vue").Ref<HTMLElement | undefined>;
+    containerStyle: import("vue").ComputedRef<{}>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    container?: unknown;
+    style?: unknown;
+    zIndex?: unknown;
+} & {
+    zIndex: string;
+    container: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
+} & {
+    style?: import("vue").StyleValue | undefined;
+}>, {
+    zIndex: string;
+    style: import("vue").StyleValue;
+    container: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
+}>> & Record<string, any>;
+export default ElTeleport;
+export * from './src/teleport';

package/lib/components/teleport/index.js

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var withInstall = require('../../utils/with-install.js');
+require('./src/teleport2.js');
+var teleport = require('./src/teleport.js');
+var teleport_vue_vue_type_script_lang = require('./src/teleport.vue_vue&type=script&lang.js');
+
+const ElTeleport = withInstall.withInstall(teleport_vue_vue_type_script_lang["default"]);
+
+exports.elTeleportProps = teleport.elTeleportProps;
+exports.ElTeleport = ElTeleport;
+exports["default"] = ElTeleport;
+//# sourceMappingURL=index.js.map

package/lib/components/teleport/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../packages/components/teleport/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils/with-install'\nimport Teleport from './src/teleport.vue'\n\nexport const ElTeleport = withInstall(Teleport)\n\nexport default ElTeleport\n\nexport * from './src/teleport'\n"],"names":["withInstall","Teleport"],"mappings":";;;;;;;;;MAGa,aAAaA,wBAAYC;;;;;;"}

package/lib/components/teleport/src/teleport.d.ts

@@ -0,0 +1,7 @@
+import type { ExtractPropTypes, StyleValue } from 'vue';
+export declare const elTeleportProps: {
+    container: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<string | HTMLElement>, string, unknown, unknown, unknown>;
+    style: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<StyleValue>, unknown, unknown, unknown, unknown>;
+    zIndex: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, string, unknown, unknown, unknown>;
+};
+export declare type ElTeleportProps = ExtractPropTypes<typeof elTeleportProps>;

package/lib/components/teleport/src/teleport.js

@@ -0,0 +1,22 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var props = require('../../../utils/props.js');
+
+const elTeleportProps = props.buildProps({
+  container: {
+    type: props.definePropType([String, Object]),
+    default: "body"
+  },
+  style: {
+    type: props.definePropType([String, Array, Object])
+  },
+  zIndex: {
+    type: String,
+    default: "2000"
+  }
+});
+
+exports.elTeleportProps = elTeleportProps;
+//# sourceMappingURL=teleport.js.map

package/lib/components/teleport/src/teleport.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"teleport.js","sources":["../../../../../../packages/components/teleport/src/teleport.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils/props'\n\nimport type { ExtractPropTypes, StyleValue } from 'vue'\n\nexport const elTeleportProps = buildProps({\n  container: {\n    type: definePropType<string | HTMLElement>([String, Object]),\n    default: 'body',\n  },\n  style: {\n    type: definePropType<StyleValue>([String, Array, Object]),\n  },\n  zIndex: {\n    type: String,\n    default: '2000',\n  },\n})\n\nexport type ElTeleportProps = ExtractPropTypes<typeof elTeleportProps>\n"],"names":["buildProps","definePropType"],"mappings":";;;;;;MAIa,kBAAkBA,iBAAW;AAAA,EACxC,WAAW;AAAA,IACT,MAAMC,qBAAqC,CAAC,QAAQ;AAAA,IACpD,SAAS;AAAA;AAAA,EAEX,OAAO;AAAA,IACL,MAAMA,qBAA2B,CAAC,QAAQ,OAAO;AAAA;AAAA,EAEnD,QAAQ;AAAA,IACN,MAAM;AAAA,IACN,SAAS;AAAA;AAAA;;;;"}

package/lib/components/teleport/src/teleport.vue.d.ts

@@ -0,0 +1,22 @@
+declare const _default: import("vue").DefineComponent<{
+    container: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<string | HTMLElement>, string, unknown, unknown, unknown>;
+    style: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<import("vue").StyleValue>, unknown, unknown, unknown, unknown>;
+    zIndex: import("../../../utils/props").BuildPropReturn<StringConstructor, string, unknown, unknown, unknown>;
+}, {
+    containerRef: import("vue").Ref<HTMLElement | undefined>;
+    containerStyle: import("vue").ComputedRef<{}>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    container?: unknown;
+    style?: unknown;
+    zIndex?: unknown;
+} & {
+    zIndex: string;
+    container: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
+} & {
+    style?: import("vue").StyleValue | undefined;
+}>, {
+    zIndex: string;
+    style: import("vue").StyleValue;
+    container: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
+}>;
+export default _default;

package/lib/components/teleport/src/teleport.vue_vue&type=script&lang.js

@@ -0,0 +1,32 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+var isServer = require('../../../utils/isServer.js');
+var teleport = require('./teleport.js');
+
+var script = vue.defineComponent({
+  props: teleport.elTeleportProps,
+  setup(props) {
+    const containerRef = vue.ref();
+    const containerStyle = vue.computed(() => {
+      return props.container === "body" || isServer["default"] && props.container === document.body ? [
+        props.style,
+        {
+          position: "absolute",
+          top: `0px`,
+          left: `0px`,
+          zIndex: props.zIndex
+        }
+      ] : {};
+    });
+    return {
+      containerRef,
+      containerStyle
+    };
+  }
+});
+
+exports["default"] = script;
+//# sourceMappingURL=teleport.vue_vue&type=script&lang.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"teleport.vue_vue&type=script&lang.js","sources":["../../../../../../packages/components/teleport/src/teleport.vue"],"sourcesContent":["<template>\n  <teleport v-if=\"container\" :to=\"container\">\n    <div ref=\"containerRef\" class=\"el-teleport\" :style=\"containerStyle\">\n      <slot />\n    </div>\n  </teleport>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, ref } from 'vue'\nimport isServer from '@element-plus/utils/isServer'\nimport { elTeleportProps } from './teleport'\n\nexport default defineComponent({\n  props: elTeleportProps,\n  setup(props) {\n    const containerRef = ref<HTMLElement>()\n    const containerStyle = computed(() => {\n      return props.container === 'body' ||\n        (isServer && props.container === document.body)\n        ? [\n            props.style,\n            {\n              position: 'absolute',\n              top: `0px`,\n              left: `0px`,\n              zIndex: props.zIndex,\n            },\n          ]\n        : {}\n    })\n    return {\n      containerRef,\n      containerStyle,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","elTeleportProps","ref","computed","isServer"],"mappings":";;;;;;;;AAaA,aAAeA,oBAAgB;AAAA,EAC7B,OAAOC;AAAA,EACP,MAAM,OAAO;AACX,UAAM,eAAeC;AACrB,UAAM,iBAAiBC,aAAS,MAAM;AACpC,aAAO,MAAM,cAAc,UACxBC,uBAAY,MAAM,cAAc,SAAS,OACxC;AAAA,QACE,MAAM;AAAA,QACN;AAAA,UACE,UAAU;AAAA,UACV,KAAK;AAAA,UACL,MAAM;AAAA,UACN,QAAQ,MAAM;AAAA;AAAA,UAGlB;AAAA;AAEN,WAAO;AAAA,MACL;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}

package/lib/components/teleport/src/teleport.vue_vue&type=template&id=787c6a36&lang.js

@@ -0,0 +1,23 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return _ctx.container ? (vue.openBlock(), vue.createBlock(vue.Teleport, {
+    key: 0,
+    to: _ctx.container
+  }, [
+    vue.createElementVNode("div", {
+      ref: "containerRef",
+      class: "el-teleport",
+      style: vue.normalizeStyle(_ctx.containerStyle)
+    }, [
+      vue.renderSlot(_ctx.$slots, "default")
+    ], 4)
+  ], 8, ["to"])) : vue.createCommentVNode("v-if", true);
+}
+
+exports.render = render;
+//# sourceMappingURL=teleport.vue_vue&type=template&id=787c6a36&lang.js.map

package/lib/components/teleport/src/teleport.vue_vue&type=template&id=787c6a36&lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"teleport.vue_vue&type=template&id=787c6a36&lang.js","sources":["../../../../../../packages/components/teleport/src/teleport.vue?vue&type=template&id=787c6a36&lang.js"],"sourcesContent":["<template>\n  <teleport v-if=\"container\" :to=\"container\">\n    <div ref=\"containerRef\" class=\"el-teleport\" :style=\"containerStyle\">\n      <slot />\n    </div>\n  </teleport>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, ref } from 'vue'\nimport isServer from '@element-plus/utils/isServer'\nimport { elTeleportProps } from './teleport'\n\nexport default defineComponent({\n  props: elTeleportProps,\n  setup(props) {\n    const containerRef = ref<HTMLElement>()\n    const containerStyle = computed(() => {\n      return props.container === 'body' ||\n        (isServer && props.container === document.body)\n        ? [\n            props.style,\n            {\n              position: 'absolute',\n              top: `0px`,\n              left: `0px`,\n              zIndex: props.zIndex,\n            },\n          ]\n        : {}\n    })\n    return {\n      containerRef,\n      containerStyle,\n    }\n  },\n})\n</script>\n"],"names":["_createBlock","_createElementVNode","_renderSlot"],"mappings":";;;;;;;SACkB,mCAAhBA;;IAA4B,IAAI;;IAC9BC;MAAK,KAAI;AAAA,MAAe,OAAM;AAAA,MAAe,0BAAO;;MAClDC;;;;;;;"}

package/lib/components/teleport/src/teleport2.js

@@ -0,0 +1,12 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var teleport_vue_vue_type_script_lang = require('./teleport.vue_vue&type=script&lang.js');
+var teleport_vue_vue_type_template_id_787c6a36_lang = require('./teleport.vue_vue&type=template&id=787c6a36&lang.js');
+
+teleport_vue_vue_type_script_lang["default"].render = teleport_vue_vue_type_template_id_787c6a36_lang.render;
+teleport_vue_vue_type_script_lang["default"].__file = "packages/components/teleport/src/teleport.vue";
+
+exports["default"] = teleport_vue_vue_type_script_lang["default"];
+//# sourceMappingURL=teleport2.js.map

package/lib/components/teleport/src/teleport2.js.map

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