element-plus 1.2.0-beta.5 → 1.2.0-beta.6

package/es/components/table/src/table/style-helper.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style-helper.mjs","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":[],"mappings":"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"}
+{"version":3,"file":"style-helper.mjs","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 { on, off } from '@element-plus/utils/dom'\nimport { useSize } from '@element-plus/hooks'\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 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 = useSize()\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":[],"mappings":"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"}

package/es/components/table/src/table-column/defaults.d.ts

@@ -33,7 +33,7 @@ interface TableColumnCtx<T> {
     showTooltipWhenOverflow: boolean;
     showOverflowTooltip: boolean;
     fixed: boolean | string;
-    formatter: (row: T, column: TableColumnCtx<T>, cellValue: any, index: number) => VNode;
+    formatter: (row: T, column: TableColumnCtx<T>, cellValue: any, index: number) => VNode | string;
     selectable: (row: T, index: number) => boolean;
     reserveSelection: boolean;
     filterMethod: FilterMethods<T>;
@@ -102,7 +102,7 @@ declare const _default: {
     showTooltipWhenOverflow: BooleanConstructor;
     showOverflowTooltip: BooleanConstructor;
     fixed: (BooleanConstructor | StringConstructor)[];
-    formatter: PropType<(row: any, column: TableColumnCtx<any>, cellValue: any, index: number) => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    formatter: PropType<(row: any, column: TableColumnCtx<any>, cellValue: any, index: number) => string | VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>>;
     selectable: PropType<(row: any, index: number) => boolean>;

package/es/components/table/src/table-column/defaults.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"defaults.mjs","sources":["../../../../../../../packages/components/table/src/table-column/defaults.ts"],"sourcesContent":["import type { PropType, ComponentInternalInstance, Ref, VNode } from 'vue'\nimport type { DefaultRow, Table } from '../table/defaults'\n\ntype CI<T> = { column: TableColumnCtx<T>; $index: number }\n\ntype Filters = {\n  text: string\n  value: string\n}[]\n\ntype FilterMethods<T> = (value, row: T, column: TableColumnCtx<T>) => void\n\ntype ValueOf<T> = T[keyof T]\n\ninterface TableColumnCtx<T> {\n  id: string\n  realWidth: number\n  type: string\n  label: string\n  className: string\n  labelClassName: string\n  property: string\n  prop: string\n  width: string | number\n  minWidth: string | number\n  renderHeader: (data: CI<T>) => VNode\n  sortable: boolean | string\n  sortMethod: (a: T, b: T) => number\n  sortBy: string | ((row: T, index: number) => string) | string[]\n  resizable: boolean\n  columnKey: string\n  rawColumnKey: string\n  align: string\n  headerAlign: string\n  showTooltipWhenOverflow: boolean\n  showOverflowTooltip: boolean\n  fixed: boolean | string\n  formatter: (\n    row: T,\n    column: TableColumnCtx<T>,\n    cellValue,\n    index: number\n  ) => VNode\n  selectable: (row: T, index: number) => boolean\n  reserveSelection: boolean\n  filterMethod: FilterMethods<T>\n  filteredValue: string[]\n  filters: Filters\n  filterPlacement: string\n  filterMultiple: boolean\n  index: number | ((index: number) => number)\n  sortOrders: ('ascending' | 'descending' | null)[]\n  renderCell: (data: any) => void\n  colSpan: number\n  rowSpan: number\n  children: TableColumnCtx<T>[]\n  level: number\n  filterable: boolean | FilterMethods<T> | Filters\n  order: string\n  isColumnGroup: boolean\n  columns: TableColumnCtx<T>[]\n  getColumnIndex: () => number\n  no: number\n  filterOpened?: boolean\n}\n\ninterface TableColumn<T> extends ComponentInternalInstance {\n  vnode: {\n    vParent: TableColumn<T> | Table<T>\n  } & VNode\n  vParent: TableColumn<T> | Table<T>\n  columnId: string\n  columnConfig: Ref<Partial<TableColumnCtx<T>>>\n}\n\nexport type { Filters, FilterMethods, TableColumnCtx, TableColumn, ValueOf }\n\nexport default {\n  type: {\n    type: String,\n    default: 'default',\n  },\n  label: String,\n  className: String,\n  labelClassName: String,\n  property: String,\n  prop: String,\n  width: {\n    type: [String, Number],\n    default: '',\n  },\n  minWidth: {\n    type: [String, Number],\n    default: '',\n  },\n  renderHeader: Function as PropType<\n    TableColumnCtx<DefaultRow>['renderHeader']\n  >,\n  sortable: {\n    type: [Boolean, String],\n    default: false,\n  },\n  sortMethod: Function as PropType<TableColumnCtx<DefaultRow>['sortMethod']>,\n  sortBy: [String, Function, Array] as PropType<\n    TableColumnCtx<DefaultRow>['sortBy']\n  >,\n  resizable: {\n    type: Boolean,\n    default: true,\n  },\n  columnKey: String,\n  align: String,\n  headerAlign: String,\n  showTooltipWhenOverflow: Boolean,\n  showOverflowTooltip: Boolean,\n  fixed: [Boolean, String],\n  formatter: Function as PropType<TableColumnCtx<DefaultRow>['formatter']>,\n  selectable: Function as PropType<TableColumnCtx<DefaultRow>['selectable']>,\n  reserveSelection: Boolean,\n  filterMethod: Function as PropType<\n    TableColumnCtx<DefaultRow>['filterMethod']\n  >,\n  filteredValue: Array as PropType<TableColumnCtx<DefaultRow>['filteredValue']>,\n  filters: Array as PropType<TableColumnCtx<DefaultRow>['filters']>,\n  filterPlacement: String,\n  filterMultiple: {\n    type: Boolean,\n    default: true,\n  },\n  index: [Number, Function] as PropType<TableColumnCtx<DefaultRow>['index']>,\n  sortOrders: {\n    type: Array as PropType<TableColumnCtx<DefaultRow>['sortOrders']>,\n    default: () => {\n      return ['ascending', 'descending', null]\n    },\n    validator: (val: TableColumnCtx<unknown>['sortOrders']) => {\n      return val.every(\n        (order: string) => ['ascending', 'descending', null].indexOf(order) > -1\n      )\n    },\n  },\n}\n"],"names":[],"mappings":"AA6EA,mBAAe;AAAA,EACb,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,OAAO;AAAA,EACP,WAAW;AAAA,EACX,gBAAgB;AAAA,EAChB,UAAU;AAAA,EACV,MAAM;AAAA,EACN,OAAO;AAAA,IACL,MAAM,CAAC,QAAQ;AAAA,IACf,SAAS;AAAA;AAAA,EAEX,UAAU;AAAA,IACR,MAAM,CAAC,QAAQ;AAAA,IACf,SAAS;AAAA;AAAA,EAEX,cAAc;AAAA,EAGd,UAAU;AAAA,IACR,MAAM,CAAC,SAAS;AAAA,IAChB,SAAS;AAAA;AAAA,EAEX,YAAY;AAAA,EACZ,QAAQ,CAAC,QAAQ,UAAU;AAAA,EAG3B,WAAW;AAAA,IACT,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,WAAW;AAAA,EACX,OAAO;AAAA,EACP,aAAa;AAAA,EACb,yBAAyB;AAAA,EACzB,qBAAqB;AAAA,EACrB,OAAO,CAAC,SAAS;AAAA,EACjB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,kBAAkB;AAAA,EAClB,cAAc;AAAA,EAGd,eAAe;AAAA,EACf,SAAS;AAAA,EACT,iBAAiB;AAAA,EACjB,gBAAgB;AAAA,IACd,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,OAAO,CAAC,QAAQ;AAAA,EAChB,YAAY;AAAA,IACV,MAAM;AAAA,IACN,SAAS,MAAM;AACb,aAAO,CAAC,aAAa,cAAc;AAAA;AAAA,IAErC,WAAW,CAAC,QAA+C;AACzD,aAAO,IAAI,MACT,CAAC,UAAkB,CAAC,aAAa,cAAc,MAAM,QAAQ,SAAS;AAAA;AAAA;AAAA;;;;"}
+{"version":3,"file":"defaults.mjs","sources":["../../../../../../../packages/components/table/src/table-column/defaults.ts"],"sourcesContent":["import type { PropType, ComponentInternalInstance, Ref, VNode } from 'vue'\nimport type { DefaultRow, Table } from '../table/defaults'\n\ntype CI<T> = { column: TableColumnCtx<T>; $index: number }\n\ntype Filters = {\n  text: string\n  value: string\n}[]\n\ntype FilterMethods<T> = (value, row: T, column: TableColumnCtx<T>) => void\n\ntype ValueOf<T> = T[keyof T]\n\ninterface TableColumnCtx<T> {\n  id: string\n  realWidth: number\n  type: string\n  label: string\n  className: string\n  labelClassName: string\n  property: string\n  prop: string\n  width: string | number\n  minWidth: string | number\n  renderHeader: (data: CI<T>) => VNode\n  sortable: boolean | string\n  sortMethod: (a: T, b: T) => number\n  sortBy: string | ((row: T, index: number) => string) | string[]\n  resizable: boolean\n  columnKey: string\n  rawColumnKey: string\n  align: string\n  headerAlign: string\n  showTooltipWhenOverflow: boolean\n  showOverflowTooltip: boolean\n  fixed: boolean | string\n  formatter: (\n    row: T,\n    column: TableColumnCtx<T>,\n    cellValue,\n    index: number\n  ) => VNode | string\n  selectable: (row: T, index: number) => boolean\n  reserveSelection: boolean\n  filterMethod: FilterMethods<T>\n  filteredValue: string[]\n  filters: Filters\n  filterPlacement: string\n  filterMultiple: boolean\n  index: number | ((index: number) => number)\n  sortOrders: ('ascending' | 'descending' | null)[]\n  renderCell: (data: any) => void\n  colSpan: number\n  rowSpan: number\n  children: TableColumnCtx<T>[]\n  level: number\n  filterable: boolean | FilterMethods<T> | Filters\n  order: string\n  isColumnGroup: boolean\n  columns: TableColumnCtx<T>[]\n  getColumnIndex: () => number\n  no: number\n  filterOpened?: boolean\n}\n\ninterface TableColumn<T> extends ComponentInternalInstance {\n  vnode: {\n    vParent: TableColumn<T> | Table<T>\n  } & VNode\n  vParent: TableColumn<T> | Table<T>\n  columnId: string\n  columnConfig: Ref<Partial<TableColumnCtx<T>>>\n}\n\nexport type { Filters, FilterMethods, TableColumnCtx, TableColumn, ValueOf }\n\nexport default {\n  type: {\n    type: String,\n    default: 'default',\n  },\n  label: String,\n  className: String,\n  labelClassName: String,\n  property: String,\n  prop: String,\n  width: {\n    type: [String, Number],\n    default: '',\n  },\n  minWidth: {\n    type: [String, Number],\n    default: '',\n  },\n  renderHeader: Function as PropType<\n    TableColumnCtx<DefaultRow>['renderHeader']\n  >,\n  sortable: {\n    type: [Boolean, String],\n    default: false,\n  },\n  sortMethod: Function as PropType<TableColumnCtx<DefaultRow>['sortMethod']>,\n  sortBy: [String, Function, Array] as PropType<\n    TableColumnCtx<DefaultRow>['sortBy']\n  >,\n  resizable: {\n    type: Boolean,\n    default: true,\n  },\n  columnKey: String,\n  align: String,\n  headerAlign: String,\n  showTooltipWhenOverflow: Boolean,\n  showOverflowTooltip: Boolean,\n  fixed: [Boolean, String],\n  formatter: Function as PropType<TableColumnCtx<DefaultRow>['formatter']>,\n  selectable: Function as PropType<TableColumnCtx<DefaultRow>['selectable']>,\n  reserveSelection: Boolean,\n  filterMethod: Function as PropType<\n    TableColumnCtx<DefaultRow>['filterMethod']\n  >,\n  filteredValue: Array as PropType<TableColumnCtx<DefaultRow>['filteredValue']>,\n  filters: Array as PropType<TableColumnCtx<DefaultRow>['filters']>,\n  filterPlacement: String,\n  filterMultiple: {\n    type: Boolean,\n    default: true,\n  },\n  index: [Number, Function] as PropType<TableColumnCtx<DefaultRow>['index']>,\n  sortOrders: {\n    type: Array as PropType<TableColumnCtx<DefaultRow>['sortOrders']>,\n    default: () => {\n      return ['ascending', 'descending', null]\n    },\n    validator: (val: TableColumnCtx<unknown>['sortOrders']) => {\n      return val.every(\n        (order: string) => ['ascending', 'descending', null].indexOf(order) > -1\n      )\n    },\n  },\n}\n"],"names":[],"mappings":"AA6EA,mBAAe;AAAA,EACb,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,OAAO;AAAA,EACP,WAAW;AAAA,EACX,gBAAgB;AAAA,EAChB,UAAU;AAAA,EACV,MAAM;AAAA,EACN,OAAO;AAAA,IACL,MAAM,CAAC,QAAQ;AAAA,IACf,SAAS;AAAA;AAAA,EAEX,UAAU;AAAA,IACR,MAAM,CAAC,QAAQ;AAAA,IACf,SAAS;AAAA;AAAA,EAEX,cAAc;AAAA,EAGd,UAAU;AAAA,IACR,MAAM,CAAC,SAAS;AAAA,IAChB,SAAS;AAAA;AAAA,EAEX,YAAY;AAAA,EACZ,QAAQ,CAAC,QAAQ,UAAU;AAAA,EAG3B,WAAW;AAAA,IACT,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,WAAW;AAAA,EACX,OAAO;AAAA,EACP,aAAa;AAAA,EACb,yBAAyB;AAAA,EACzB,qBAAqB;AAAA,EACrB,OAAO,CAAC,SAAS;AAAA,EACjB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,kBAAkB;AAAA,EAClB,cAAc;AAAA,EAGd,eAAe;AAAA,EACf,SAAS;AAAA,EACT,iBAAiB;AAAA,EACjB,gBAAgB;AAAA,IACd,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,OAAO,CAAC,QAAQ;AAAA,EAChB,YAAY;AAAA,IACV,MAAM;AAAA,IACN,SAAS,MAAM;AACb,aAAO,CAAC,aAAa,cAAc;AAAA;AAAA,IAErC,WAAW,CAAC,QAA+C;AACzD,aAAO,IAAI,MACT,CAAC,UAAkB,CAAC,aAAa,cAAc,MAAM,QAAQ,SAAS;AAAA;AAAA;AAAA;;;;"}

package/es/components/table/src/table-column/index.d.ts

@@ -39,7 +39,7 @@ declare const _default: import("vue").DefineComponent<{
     showTooltipWhenOverflow: BooleanConstructor;
     showOverflowTooltip: BooleanConstructor;
     fixed: (BooleanConstructor | StringConstructor)[];
-    formatter: import("vue").PropType<(row: any, column: TableColumnCtx<any>, cellValue: any, index: number) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    formatter: import("vue").PropType<(row: any, column: TableColumnCtx<any>, cellValue: any, index: number) => string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>>;
     selectable: import("vue").PropType<(row: any, index: number) => boolean>;
@@ -105,10 +105,10 @@ declare const _default: import("vue").DefineComponent<{
     index?: number | ((index: number) => number) | undefined;
     align?: string | undefined;
     filters?: import("./defaults").Filters | undefined;
+    prop?: string | undefined;
     filterMethod?: import("./defaults").FilterMethods<any> | undefined;
     className?: string | undefined;
     labelClassName?: string | undefined;
-    prop?: string | undefined;
     renderHeader?: ((data: {
         column: TableColumnCtx<any>;
         $index: number;
@@ -117,7 +117,7 @@ declare const _default: import("vue").DefineComponent<{
     }>) | undefined;
     sortMethod?: ((a: any, b: any) => number) | undefined;
     sortBy?: string | string[] | ((row: any, index: number) => string) | undefined;
-    formatter?: ((row: any, column: TableColumnCtx<any>, cellValue: any, index: number) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    formatter?: ((row: any, column: TableColumnCtx<any>, cellValue: any, index: number) => string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>) | undefined;
     selectable?: ((row: any, index: number) => boolean) | undefined;

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

@@ -101,7 +101,7 @@ declare const _default: import("vue").DefineComponent<{
     handleHeaderFooterMousewheel: (event: any, data: any) => void;
     handleMouseLeave: () => void;
     tableId: string;
-    tableSize: import("vue").ComputedRef<any>;
+    tableSize: import("vue").ComputedRef<"" | import("../../../utils/types").ComponentSize>;
     isHidden: import("vue").Ref<boolean>;
     isEmpty: import("vue").ComputedRef<boolean>;
     renderExpanded: import("vue").Ref<null>;
@@ -216,13 +216,13 @@ declare const _default: import("vue").DefineComponent<{
     selectOnIndeterminate: boolean;
     indent: number;
 } & {
-    emptyText?: string | undefined;
-    sumText?: string | undefined;
     size?: string | undefined;
     load?: ((row: any, treeNode: import("./table/defaults").TreeNode, resolve: (data: any[]) => void) => void) | undefined;
     height?: string | number | undefined;
     width?: string | number | undefined;
     maxHeight?: string | number | undefined;
+    emptyText?: string | undefined;
+    sumText?: string | undefined;
     cellClassName?: (string | ((data: {
         row: any;
         rowIndex: number;

package/es/components/table/src/util.mjs

@@ -247,7 +247,6 @@ function createTablePopper(trigger, popperContent, popperOptions, tooltipEffect)
   function renderArrow() {
     const arrow2 = document.createElement("div");
     arrow2.className = "el-popper__arrow";
-    arrow2.style.bottom = "-4px";
     return arrow2;
   }
   function showPopper() {

package/es/components/table/src/util.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"util.mjs","sources":["../../../../../../packages/components/table/src/util.ts"],"sourcesContent":["import { hasOwn } from '@vue/shared'\nimport { createPopper } from '@popperjs/core'\nimport PopupManager from '@element-plus/utils/popup-manager'\nimport { getValueByPath } from '@element-plus/utils/util'\nimport { off, on } from '@element-plus/utils/dom'\n\nimport type {\n  PopperInstance,\n  IPopperOptions,\n} from '@element-plus/components/popper'\nimport type { Indexable, Nullable } from '@element-plus/utils/types'\nimport type { TableColumnCtx } from './table-column/defaults'\n\nexport const getCell = function (event: Event): HTMLElement {\n  let cell = event.target as HTMLElement\n\n  while (cell && cell.tagName.toUpperCase() !== 'HTML') {\n    if (cell.tagName.toUpperCase() === 'TD') {\n      return cell\n    }\n    cell = cell.parentNode as HTMLElement\n  }\n\n  return null\n}\n\nconst isObject = function (obj: unknown): boolean {\n  return obj !== null && typeof obj === 'object'\n}\n\nexport const orderBy = function <T>(\n  array: T[],\n  sortKey: string,\n  reverse: string | number,\n  sortMethod,\n  sortBy: string | (string | ((a: T, b: T, array?: T[]) => number))[]\n) {\n  if (\n    !sortKey &&\n    !sortMethod &&\n    (!sortBy || (Array.isArray(sortBy) && !sortBy.length))\n  ) {\n    return array\n  }\n  if (typeof reverse === 'string') {\n    reverse = reverse === 'descending' ? -1 : 1\n  } else {\n    reverse = reverse && reverse < 0 ? -1 : 1\n  }\n  const getKey = sortMethod\n    ? null\n    : function (value, index) {\n        if (sortBy) {\n          if (!Array.isArray(sortBy)) {\n            sortBy = [sortBy]\n          }\n          return sortBy.map(function (by) {\n            if (typeof by === 'string') {\n              return getValueByPath(value, by)\n            } else {\n              return by(value, index, array)\n            }\n          })\n        }\n        if (sortKey !== '$key') {\n          if (isObject(value) && '$value' in value) value = value.$value\n        }\n        return [isObject(value) ? getValueByPath(value, sortKey) : value]\n      }\n  const compare = function (a, b) {\n    if (sortMethod) {\n      return sortMethod(a.value, b.value)\n    }\n    for (let i = 0, len = a.key.length; i < len; i++) {\n      if (a.key[i] < b.key[i]) {\n        return -1\n      }\n      if (a.key[i] > b.key[i]) {\n        return 1\n      }\n    }\n    return 0\n  }\n  return array\n    .map(function (value, index) {\n      return {\n        value,\n        index,\n        key: getKey ? getKey(value, index) : null,\n      }\n    })\n    .sort(function (a, b) {\n      let order = compare(a, b)\n      if (!order) {\n        // make stable https://en.wikipedia.org/wiki/Sorting_algorithm#Stability\n        order = a.index - b.index\n      }\n      return order * +reverse\n    })\n    .map((item) => item.value)\n}\n\nexport const getColumnById = function <T>(\n  table: {\n    columns: TableColumnCtx<T>[]\n  },\n  columnId: string\n): null | TableColumnCtx<T> {\n  let column = null\n  table.columns.forEach(function (item) {\n    if (item.id === columnId) {\n      column = item\n    }\n  })\n  return column\n}\n\nexport const getColumnByKey = function <T>(\n  table: {\n    columns: TableColumnCtx<T>[]\n  },\n  columnKey: string\n): TableColumnCtx<T> {\n  let column = null\n  for (let i = 0; i < table.columns.length; i++) {\n    const item = table.columns[i]\n    if (item.columnKey === columnKey) {\n      column = item\n      break\n    }\n  }\n  return column\n}\n\nexport const getColumnByCell = function <T>(\n  table: {\n    columns: TableColumnCtx<T>[]\n  },\n  cell: HTMLElement\n): null | TableColumnCtx<T> {\n  const matches = (cell.className || '').match(/el-table_[^\\s]+/gm)\n  if (matches) {\n    return getColumnById(table, matches[0])\n  }\n  return null\n}\n\nexport const getRowIdentity = <T>(\n  row: T,\n  rowKey: string | ((row: T) => any)\n): string => {\n  if (!row) throw new Error('Row is required when get row identity')\n  if (typeof rowKey === 'string') {\n    if (rowKey.indexOf('.') < 0) {\n      return `${row[rowKey]}`\n    }\n    const key = rowKey.split('.')\n    let current = row\n    for (let i = 0; i < key.length; i++) {\n      current = current[key[i]]\n    }\n    return `${current}`\n  } else if (typeof rowKey === 'function') {\n    return rowKey.call(null, row)\n  }\n}\n\nexport const getKeysMap = function <T>(\n  array: T[],\n  rowKey: string\n): Record<string, { row: T; index: number }> {\n  const arrayMap = {}\n  ;(array || []).forEach((row, index) => {\n    arrayMap[getRowIdentity(row, rowKey)] = { row, index }\n  })\n  return arrayMap\n}\n\nexport function mergeOptions<T, K>(defaults: T, config: K): T & K {\n  const options = {} as T & K\n  let key\n  for (key in defaults) {\n    options[key] = defaults[key]\n  }\n  for (key in config) {\n    if (hasOwn(config as unknown as Indexable<any>, key)) {\n      const value = config[key]\n      if (typeof value !== 'undefined') {\n        options[key] = value\n      }\n    }\n  }\n  return options\n}\n\nexport function parseWidth(width: number | string): number {\n  if (width !== undefined) {\n    width = parseInt(width as string, 10)\n    if (isNaN(width)) {\n      width = null\n    }\n  }\n  return +width\n}\n\nexport function parseMinWidth(minWidth): number {\n  if (typeof minWidth !== 'undefined') {\n    minWidth = parseWidth(minWidth)\n    if (isNaN(minWidth)) {\n      minWidth = 80\n    }\n  }\n  return minWidth\n}\n\nexport function parseHeight(height: number | string) {\n  if (typeof height === 'number') {\n    return height\n  }\n  if (typeof height === 'string') {\n    if (/^\\d+(?:px)?$/.test(height)) {\n      return parseInt(height, 10)\n    } else {\n      return height\n    }\n  }\n  return null\n}\n\n// https://github.com/reduxjs/redux/blob/master/src/compose.js\nexport function compose(...funcs) {\n  if (funcs.length === 0) {\n    return (arg) => arg\n  }\n  if (funcs.length === 1) {\n    return funcs[0]\n  }\n  return funcs.reduce(\n    (a, b) =>\n      (...args) =>\n        a(b(...args))\n  )\n}\n\nexport function toggleRowStatus<T>(\n  statusArr: T[],\n  row: T,\n  newVal: boolean\n): boolean {\n  let changed = false\n  const index = statusArr.indexOf(row)\n  const included = index !== -1\n\n  const addRow = () => {\n    statusArr.push(row)\n    changed = true\n  }\n  const removeRow = () => {\n    statusArr.splice(index, 1)\n    changed = true\n  }\n\n  if (typeof newVal === 'boolean') {\n    if (newVal && !included) {\n      addRow()\n    } else if (!newVal && included) {\n      removeRow()\n    }\n  } else {\n    if (included) {\n      removeRow()\n    } else {\n      addRow()\n    }\n  }\n  return changed\n}\n\nexport function walkTreeNode(\n  root,\n  cb,\n  childrenKey = 'children',\n  lazyKey = 'hasChildren'\n) {\n  const isNil = (array) => !(Array.isArray(array) && array.length)\n\n  function _walker(parent, children, level) {\n    cb(parent, children, level)\n    children.forEach((item) => {\n      if (item[lazyKey]) {\n        cb(item, null, level + 1)\n        return\n      }\n      const children = item[childrenKey]\n      if (!isNil(children)) {\n        _walker(item, children, level + 1)\n      }\n    })\n  }\n\n  root.forEach((item) => {\n    if (item[lazyKey]) {\n      cb(item, null, 0)\n      return\n    }\n    const children = item[childrenKey]\n    if (!isNil(children)) {\n      _walker(item, children, 0)\n    }\n  })\n}\n\nexport let removePopper\n\nexport function createTablePopper(\n  trigger: HTMLElement,\n  popperContent: string,\n  popperOptions: Partial<IPopperOptions>,\n  tooltipEffect: string\n) {\n  function renderContent(): HTMLDivElement {\n    const isLight = tooltipEffect === 'light'\n    const content = document.createElement('div')\n    content.className = `el-popper ${isLight ? 'is-light' : 'is-dark'}`\n    content.innerHTML = popperContent\n    content.style.zIndex = String(PopupManager.nextZIndex())\n    document.body.appendChild(content)\n    return content\n  }\n  function renderArrow(): HTMLDivElement {\n    const arrow = document.createElement('div')\n    arrow.className = 'el-popper__arrow'\n    arrow.style.bottom = '-4px'\n    return arrow\n  }\n  function showPopper() {\n    popperInstance && popperInstance.update()\n  }\n  removePopper = function removePopper() {\n    try {\n      popperInstance && popperInstance.destroy()\n      content && document.body.removeChild(content)\n      off(trigger, 'mouseenter', showPopper)\n      off(trigger, 'mouseleave', removePopper)\n    } catch {}\n  }\n  let popperInstance: Nullable<PopperInstance> = null\n  const content = renderContent()\n  const arrow = renderArrow()\n  content.appendChild(arrow)\n\n  popperInstance = createPopper(trigger, content, {\n    modifiers: [\n      {\n        name: 'offset',\n        options: {\n          offset: [0, 8],\n        },\n      },\n      {\n        name: 'arrow',\n        options: {\n          element: arrow,\n          padding: 10,\n        },\n      },\n    ],\n    ...popperOptions,\n  })\n  on(trigger, 'mouseenter', showPopper)\n  on(trigger, 'mouseleave', removePopper)\n  return popperInstance\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"util.mjs","sources":["../../../../../../packages/components/table/src/util.ts"],"sourcesContent":["import { hasOwn } from '@vue/shared'\nimport { createPopper } from '@popperjs/core'\nimport PopupManager from '@element-plus/utils/popup-manager'\nimport { getValueByPath } from '@element-plus/utils/util'\nimport { off, on } from '@element-plus/utils/dom'\n\nimport type {\n  PopperInstance,\n  IPopperOptions,\n} from '@element-plus/components/popper'\nimport type { Indexable, Nullable } from '@element-plus/utils/types'\nimport type { TableColumnCtx } from './table-column/defaults'\n\nexport const getCell = function (event: Event): HTMLElement {\n  let cell = event.target as HTMLElement\n\n  while (cell && cell.tagName.toUpperCase() !== 'HTML') {\n    if (cell.tagName.toUpperCase() === 'TD') {\n      return cell\n    }\n    cell = cell.parentNode as HTMLElement\n  }\n\n  return null\n}\n\nconst isObject = function (obj: unknown): boolean {\n  return obj !== null && typeof obj === 'object'\n}\n\nexport const orderBy = function <T>(\n  array: T[],\n  sortKey: string,\n  reverse: string | number,\n  sortMethod,\n  sortBy: string | (string | ((a: T, b: T, array?: T[]) => number))[]\n) {\n  if (\n    !sortKey &&\n    !sortMethod &&\n    (!sortBy || (Array.isArray(sortBy) && !sortBy.length))\n  ) {\n    return array\n  }\n  if (typeof reverse === 'string') {\n    reverse = reverse === 'descending' ? -1 : 1\n  } else {\n    reverse = reverse && reverse < 0 ? -1 : 1\n  }\n  const getKey = sortMethod\n    ? null\n    : function (value, index) {\n        if (sortBy) {\n          if (!Array.isArray(sortBy)) {\n            sortBy = [sortBy]\n          }\n          return sortBy.map(function (by) {\n            if (typeof by === 'string') {\n              return getValueByPath(value, by)\n            } else {\n              return by(value, index, array)\n            }\n          })\n        }\n        if (sortKey !== '$key') {\n          if (isObject(value) && '$value' in value) value = value.$value\n        }\n        return [isObject(value) ? getValueByPath(value, sortKey) : value]\n      }\n  const compare = function (a, b) {\n    if (sortMethod) {\n      return sortMethod(a.value, b.value)\n    }\n    for (let i = 0, len = a.key.length; i < len; i++) {\n      if (a.key[i] < b.key[i]) {\n        return -1\n      }\n      if (a.key[i] > b.key[i]) {\n        return 1\n      }\n    }\n    return 0\n  }\n  return array\n    .map(function (value, index) {\n      return {\n        value,\n        index,\n        key: getKey ? getKey(value, index) : null,\n      }\n    })\n    .sort(function (a, b) {\n      let order = compare(a, b)\n      if (!order) {\n        // make stable https://en.wikipedia.org/wiki/Sorting_algorithm#Stability\n        order = a.index - b.index\n      }\n      return order * +reverse\n    })\n    .map((item) => item.value)\n}\n\nexport const getColumnById = function <T>(\n  table: {\n    columns: TableColumnCtx<T>[]\n  },\n  columnId: string\n): null | TableColumnCtx<T> {\n  let column = null\n  table.columns.forEach(function (item) {\n    if (item.id === columnId) {\n      column = item\n    }\n  })\n  return column\n}\n\nexport const getColumnByKey = function <T>(\n  table: {\n    columns: TableColumnCtx<T>[]\n  },\n  columnKey: string\n): TableColumnCtx<T> {\n  let column = null\n  for (let i = 0; i < table.columns.length; i++) {\n    const item = table.columns[i]\n    if (item.columnKey === columnKey) {\n      column = item\n      break\n    }\n  }\n  return column\n}\n\nexport const getColumnByCell = function <T>(\n  table: {\n    columns: TableColumnCtx<T>[]\n  },\n  cell: HTMLElement\n): null | TableColumnCtx<T> {\n  const matches = (cell.className || '').match(/el-table_[^\\s]+/gm)\n  if (matches) {\n    return getColumnById(table, matches[0])\n  }\n  return null\n}\n\nexport const getRowIdentity = <T>(\n  row: T,\n  rowKey: string | ((row: T) => any)\n): string => {\n  if (!row) throw new Error('Row is required when get row identity')\n  if (typeof rowKey === 'string') {\n    if (rowKey.indexOf('.') < 0) {\n      return `${row[rowKey]}`\n    }\n    const key = rowKey.split('.')\n    let current = row\n    for (let i = 0; i < key.length; i++) {\n      current = current[key[i]]\n    }\n    return `${current}`\n  } else if (typeof rowKey === 'function') {\n    return rowKey.call(null, row)\n  }\n}\n\nexport const getKeysMap = function <T>(\n  array: T[],\n  rowKey: string\n): Record<string, { row: T; index: number }> {\n  const arrayMap = {}\n  ;(array || []).forEach((row, index) => {\n    arrayMap[getRowIdentity(row, rowKey)] = { row, index }\n  })\n  return arrayMap\n}\n\nexport function mergeOptions<T, K>(defaults: T, config: K): T & K {\n  const options = {} as T & K\n  let key\n  for (key in defaults) {\n    options[key] = defaults[key]\n  }\n  for (key in config) {\n    if (hasOwn(config as unknown as Indexable<any>, key)) {\n      const value = config[key]\n      if (typeof value !== 'undefined') {\n        options[key] = value\n      }\n    }\n  }\n  return options\n}\n\nexport function parseWidth(width: number | string): number {\n  if (width !== undefined) {\n    width = parseInt(width as string, 10)\n    if (isNaN(width)) {\n      width = null\n    }\n  }\n  return +width\n}\n\nexport function parseMinWidth(minWidth): number {\n  if (typeof minWidth !== 'undefined') {\n    minWidth = parseWidth(minWidth)\n    if (isNaN(minWidth)) {\n      minWidth = 80\n    }\n  }\n  return minWidth\n}\n\nexport function parseHeight(height: number | string) {\n  if (typeof height === 'number') {\n    return height\n  }\n  if (typeof height === 'string') {\n    if (/^\\d+(?:px)?$/.test(height)) {\n      return parseInt(height, 10)\n    } else {\n      return height\n    }\n  }\n  return null\n}\n\n// https://github.com/reduxjs/redux/blob/master/src/compose.js\nexport function compose(...funcs) {\n  if (funcs.length === 0) {\n    return (arg) => arg\n  }\n  if (funcs.length === 1) {\n    return funcs[0]\n  }\n  return funcs.reduce(\n    (a, b) =>\n      (...args) =>\n        a(b(...args))\n  )\n}\n\nexport function toggleRowStatus<T>(\n  statusArr: T[],\n  row: T,\n  newVal: boolean\n): boolean {\n  let changed = false\n  const index = statusArr.indexOf(row)\n  const included = index !== -1\n\n  const addRow = () => {\n    statusArr.push(row)\n    changed = true\n  }\n  const removeRow = () => {\n    statusArr.splice(index, 1)\n    changed = true\n  }\n\n  if (typeof newVal === 'boolean') {\n    if (newVal && !included) {\n      addRow()\n    } else if (!newVal && included) {\n      removeRow()\n    }\n  } else {\n    if (included) {\n      removeRow()\n    } else {\n      addRow()\n    }\n  }\n  return changed\n}\n\nexport function walkTreeNode(\n  root,\n  cb,\n  childrenKey = 'children',\n  lazyKey = 'hasChildren'\n) {\n  const isNil = (array) => !(Array.isArray(array) && array.length)\n\n  function _walker(parent, children, level) {\n    cb(parent, children, level)\n    children.forEach((item) => {\n      if (item[lazyKey]) {\n        cb(item, null, level + 1)\n        return\n      }\n      const children = item[childrenKey]\n      if (!isNil(children)) {\n        _walker(item, children, level + 1)\n      }\n    })\n  }\n\n  root.forEach((item) => {\n    if (item[lazyKey]) {\n      cb(item, null, 0)\n      return\n    }\n    const children = item[childrenKey]\n    if (!isNil(children)) {\n      _walker(item, children, 0)\n    }\n  })\n}\n\nexport let removePopper\n\nexport function createTablePopper(\n  trigger: HTMLElement,\n  popperContent: string,\n  popperOptions: Partial<IPopperOptions>,\n  tooltipEffect: string\n) {\n  function renderContent(): HTMLDivElement {\n    const isLight = tooltipEffect === 'light'\n    const content = document.createElement('div')\n    content.className = `el-popper ${isLight ? 'is-light' : 'is-dark'}`\n    content.innerHTML = popperContent\n    content.style.zIndex = String(PopupManager.nextZIndex())\n    document.body.appendChild(content)\n    return content\n  }\n  function renderArrow(): HTMLDivElement {\n    const arrow = document.createElement('div')\n    arrow.className = 'el-popper__arrow'\n    return arrow\n  }\n  function showPopper() {\n    popperInstance && popperInstance.update()\n  }\n  removePopper = function removePopper() {\n    try {\n      popperInstance && popperInstance.destroy()\n      content && document.body.removeChild(content)\n      off(trigger, 'mouseenter', showPopper)\n      off(trigger, 'mouseleave', removePopper)\n    } catch {}\n  }\n  let popperInstance: Nullable<PopperInstance> = null\n  const content = renderContent()\n  const arrow = renderArrow()\n  content.appendChild(arrow)\n\n  popperInstance = createPopper(trigger, content, {\n    modifiers: [\n      {\n        name: 'offset',\n        options: {\n          offset: [0, 8],\n        },\n      },\n      {\n        name: 'arrow',\n        options: {\n          element: arrow,\n          padding: 10,\n        },\n      },\n    ],\n    ...popperOptions,\n  })\n  on(trigger, 'mouseenter', showPopper)\n  on(trigger, 'mouseleave', removePopper)\n  return popperInstance\n}\n"],"names":[],"mappings":"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"}

package/es/components/tabs/index.d.ts

@@ -101,14 +101,14 @@ export declare const ElTabs: import("../../utils/types").SFCWithInstall<import("
         readonly lazy?: unknown;
     } & {
         disabled: boolean;
-        label: string;
         name: string;
+        label: string;
         closable: boolean;
         lazy: boolean;
     } & {}>, {
         disabled: boolean;
-        label: string;
         name: string;
+        label: string;
         closable: boolean;
         lazy: boolean;
     }>;
@@ -132,14 +132,14 @@ export declare const ElTabPane: import("../../utils/types").SFCWithInstall<impor
     readonly lazy?: unknown;
 } & {
     disabled: boolean;
-    label: string;
     name: string;
+    label: string;
     closable: boolean;
     lazy: boolean;
 } & {}>, {
     disabled: boolean;
-    label: string;
     name: string;
+    label: string;
     closable: boolean;
     lazy: boolean;
 }>>;

package/es/components/tabs/src/tab-nav.mjs

@@ -5,7 +5,7 @@ import { buildProps, definePropType, mutable } from '../../../utils/props.mjs';
 import { EVENT_CODE } from '../../../utils/aria.mjs';
 import { throwError } from '../../../utils/error.mjs';
 import { ElIcon } from '../../icon/index.mjs';
-import { ArrowLeft, ArrowRight, Close } from '@element-plus/icons';
+import { ArrowLeft, ArrowRight, Close } from '@element-plus/icons-vue';
 import '../../../tokens/index.mjs';
 import './tab-bar2.mjs';
 import { tabsRootContextKey } from '../../../tokens/tabs.mjs';

package/es/components/tabs/src/tab-nav.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tab-nav.mjs","sources":["../../../../../../packages/components/tabs/src/tab-nav.ts"],"sourcesContent":["import {\n  h,\n  defineComponent,\n  ref,\n  inject,\n  computed,\n  onUpdated,\n  onMounted,\n  watch,\n} from 'vue'\nimport { NOOP, capitalize } from '@vue/shared'\nimport {\n  useResizeObserver,\n  useDocumentVisibility,\n  useWindowFocus,\n} from '@vueuse/core'\nimport { buildProps, definePropType, mutable } from '@element-plus/utils/props'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport { throwError } from '@element-plus/utils/error'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowLeft, ArrowRight, Close } from '@element-plus/icons'\nimport { tabsRootContextKey } from '@element-plus/tokens'\nimport TabBar from './tab-bar.vue'\nimport type { ExtractPropTypes, CSSProperties } from 'vue'\nimport type { TabsPaneContext } from '@element-plus/tokens'\nexport interface Scrollable {\n  next?: boolean\n  prev?: number\n}\n\nexport const tabNavProps = buildProps({\n  panes: {\n    type: definePropType<TabsPaneContext[]>(Array),\n    default: () => mutable([] as const),\n  },\n  currentName: {\n    type: String,\n    default: '',\n  },\n  editable: Boolean,\n  onTabClick: {\n    type: definePropType<\n      (tab: TabsPaneContext, tabName: string, ev: Event) => void\n    >(Function),\n    default: NOOP,\n  },\n  onTabRemove: {\n    type: definePropType<(tab: TabsPaneContext, ev: Event) => void>(Function),\n    default: NOOP,\n  },\n  type: {\n    type: String,\n    values: ['card', 'border-card', ''],\n    default: '',\n  },\n  stretch: Boolean,\n} as const)\n\nexport type TabNavProps = ExtractPropTypes<typeof tabNavProps>\n\nconst COMPONENT_NAME = 'ElTabNav'\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  props: tabNavProps,\n\n  setup(props, { expose }) {\n    const visibility = useDocumentVisibility()\n    const focused = useWindowFocus()\n\n    const rootTabs = inject(tabsRootContextKey)\n    if (!rootTabs)\n      throwError(COMPONENT_NAME, `ElTabNav must be nested inside ElTabs`)\n\n    const scrollable = ref<false | Scrollable>(false)\n    const navOffset = ref(0)\n    const isFocus = ref(false)\n    const focusable = ref(true)\n\n    const navScroll$ = ref<HTMLDivElement>()\n    const nav$ = ref<HTMLDivElement>()\n    const el$ = ref<HTMLDivElement>()\n\n    const sizeName = computed(() =>\n      ['top', 'bottom'].includes(rootTabs.props.tabPosition)\n        ? 'width'\n        : 'height'\n    )\n    const navStyle = computed<CSSProperties>(() => {\n      const dir = sizeName.value === 'width' ? 'X' : 'Y'\n      return {\n        transform: `translate${dir}(-${navOffset.value}px)`,\n      }\n    })\n\n    const scrollPrev = () => {\n      if (!navScroll$.value) return\n\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      if (!navScroll$.value || !nav$.value) return\n\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      const nav = nav$.value\n      if (!scrollable.value || !el$.value || !navScroll$.value || !nav) return\n\n      const activeTab = el$.value.querySelector('.is-active')\n      if (!activeTab) return\n\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 || !navScroll$.value) return\n\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 || {}\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: KeyboardEvent) => {\n      const code = e.code\n\n      const { up, down, left, right } = EVENT_CODE\n      if (![up, down, left, right].includes(code)) return\n\n      // 左右上下键更换tab\n      const tabList = Array.from(\n        (e.currentTarget as HTMLDivElement).querySelectorAll<HTMLDivElement>(\n          '[role=tab]'\n        )\n      )\n      const currentIndex = tabList.indexOf(e.target as HTMLDivElement)\n\n      let nextIndex: number\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) isFocus.value = true\n    }\n    const removeFocus = () => (isFocus.value = false)\n\n    watch(visibility, (visibility) => {\n      if (visibility === 'hidden') {\n        focusable.value = false\n      } else if (visibility === 'visible') {\n        setTimeout(() => (focusable.value = true), 50)\n      }\n    })\n    watch(focused, (focused) => {\n      if (focused) {\n        setTimeout(() => (focusable.value = true), 50)\n      } else {\n        focusable.value = false\n      }\n    })\n\n    useResizeObserver(el$, update)\n\n    onMounted(() => setTimeout(() => scrollToActiveTab(), 0))\n    onUpdated(() => update())\n\n    expose({\n      scrollToActiveTab,\n      removeFocus,\n    })\n\n    return () => {\n      const scrollBtn = scrollable.value\n        ? [\n            h(\n              'span',\n              {\n                class: [\n                  'el-tabs__nav-prev',\n                  scrollable.value.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.value.next ? '' : 'is-disabled',\n                ],\n                onClick: scrollNext,\n              },\n              [h(ElIcon, {}, { default: () => h(ArrowRight) })]\n            ),\n          ]\n        : null\n\n      const tabs = props.panes.map((pane, index) => {\n        const tabName = pane.props.name || pane.index || `${index}`\n        const closable = pane.isClosable || props.editable\n        pane.index = `${index}`\n\n        const btnClose = closable\n          ? h(\n              ElIcon,\n              {\n                class: 'is-icon-close',\n                onClick: (ev: MouseEvent) => props.onTabRemove(pane, ev),\n              },\n              { default: () => h(Close) }\n            )\n          : null\n\n        const tabLabelContent =\n          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: () => setFocus(),\n            onBlur: () => removeFocus(),\n            onClick: (ev: MouseEvent) => {\n              removeFocus()\n              props.onTabClick(pane, tabName, ev)\n            },\n            onKeydown: (ev: KeyboardEvent) => {\n              if (\n                closable &&\n                (ev.code === EVENT_CODE.delete ||\n                  ev.code === EVENT_CODE.backspace)\n              ) {\n                props.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.value ? '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                    props.stretch &&\n                    ['top', 'bottom'].includes(rootTabs.props.tabPosition)\n                      ? 'is-stretch'\n                      : '',\n                  ],\n                  ref: nav$,\n                  style: navStyle.value,\n                  role: 'tablist',\n                  onKeydown: changeTab,\n                },\n                [\n                  !props.type\n                    ? h(TabBar, {\n                        tabs: [...props.panes],\n                      })\n                    : null,\n                  tabs,\n                ]\n              ),\n            ]\n          ),\n        ]\n      )\n    }\n  },\n})\n"],"names":["TabBar"],"mappings":"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"}
+{"version":3,"file":"tab-nav.mjs","sources":["../../../../../../packages/components/tabs/src/tab-nav.ts"],"sourcesContent":["import {\n  h,\n  defineComponent,\n  ref,\n  inject,\n  computed,\n  onUpdated,\n  onMounted,\n  watch,\n} from 'vue'\nimport { NOOP, capitalize } from '@vue/shared'\nimport {\n  useResizeObserver,\n  useDocumentVisibility,\n  useWindowFocus,\n} from '@vueuse/core'\nimport { buildProps, definePropType, mutable } from '@element-plus/utils/props'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport { throwError } from '@element-plus/utils/error'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowLeft, ArrowRight, Close } from '@element-plus/icons-vue'\nimport { tabsRootContextKey } from '@element-plus/tokens'\nimport TabBar from './tab-bar.vue'\nimport type { ExtractPropTypes, CSSProperties } from 'vue'\nimport type { TabsPaneContext } from '@element-plus/tokens'\nexport interface Scrollable {\n  next?: boolean\n  prev?: number\n}\n\nexport const tabNavProps = buildProps({\n  panes: {\n    type: definePropType<TabsPaneContext[]>(Array),\n    default: () => mutable([] as const),\n  },\n  currentName: {\n    type: String,\n    default: '',\n  },\n  editable: Boolean,\n  onTabClick: {\n    type: definePropType<\n      (tab: TabsPaneContext, tabName: string, ev: Event) => void\n    >(Function),\n    default: NOOP,\n  },\n  onTabRemove: {\n    type: definePropType<(tab: TabsPaneContext, ev: Event) => void>(Function),\n    default: NOOP,\n  },\n  type: {\n    type: String,\n    values: ['card', 'border-card', ''],\n    default: '',\n  },\n  stretch: Boolean,\n} as const)\n\nexport type TabNavProps = ExtractPropTypes<typeof tabNavProps>\n\nconst COMPONENT_NAME = 'ElTabNav'\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  props: tabNavProps,\n\n  setup(props, { expose }) {\n    const visibility = useDocumentVisibility()\n    const focused = useWindowFocus()\n\n    const rootTabs = inject(tabsRootContextKey)\n    if (!rootTabs)\n      throwError(COMPONENT_NAME, `ElTabNav must be nested inside ElTabs`)\n\n    const scrollable = ref<false | Scrollable>(false)\n    const navOffset = ref(0)\n    const isFocus = ref(false)\n    const focusable = ref(true)\n\n    const navScroll$ = ref<HTMLDivElement>()\n    const nav$ = ref<HTMLDivElement>()\n    const el$ = ref<HTMLDivElement>()\n\n    const sizeName = computed(() =>\n      ['top', 'bottom'].includes(rootTabs.props.tabPosition)\n        ? 'width'\n        : 'height'\n    )\n    const navStyle = computed<CSSProperties>(() => {\n      const dir = sizeName.value === 'width' ? 'X' : 'Y'\n      return {\n        transform: `translate${dir}(-${navOffset.value}px)`,\n      }\n    })\n\n    const scrollPrev = () => {\n      if (!navScroll$.value) return\n\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      if (!navScroll$.value || !nav$.value) return\n\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      const nav = nav$.value\n      if (!scrollable.value || !el$.value || !navScroll$.value || !nav) return\n\n      const activeTab = el$.value.querySelector('.is-active')\n      if (!activeTab) return\n\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 || !navScroll$.value) return\n\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 || {}\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: KeyboardEvent) => {\n      const code = e.code\n\n      const { up, down, left, right } = EVENT_CODE\n      if (![up, down, left, right].includes(code)) return\n\n      // 左右上下键更换tab\n      const tabList = Array.from(\n        (e.currentTarget as HTMLDivElement).querySelectorAll<HTMLDivElement>(\n          '[role=tab]'\n        )\n      )\n      const currentIndex = tabList.indexOf(e.target as HTMLDivElement)\n\n      let nextIndex: number\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) isFocus.value = true\n    }\n    const removeFocus = () => (isFocus.value = false)\n\n    watch(visibility, (visibility) => {\n      if (visibility === 'hidden') {\n        focusable.value = false\n      } else if (visibility === 'visible') {\n        setTimeout(() => (focusable.value = true), 50)\n      }\n    })\n    watch(focused, (focused) => {\n      if (focused) {\n        setTimeout(() => (focusable.value = true), 50)\n      } else {\n        focusable.value = false\n      }\n    })\n\n    useResizeObserver(el$, update)\n\n    onMounted(() => setTimeout(() => scrollToActiveTab(), 0))\n    onUpdated(() => update())\n\n    expose({\n      scrollToActiveTab,\n      removeFocus,\n    })\n\n    return () => {\n      const scrollBtn = scrollable.value\n        ? [\n            h(\n              'span',\n              {\n                class: [\n                  'el-tabs__nav-prev',\n                  scrollable.value.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.value.next ? '' : 'is-disabled',\n                ],\n                onClick: scrollNext,\n              },\n              [h(ElIcon, {}, { default: () => h(ArrowRight) })]\n            ),\n          ]\n        : null\n\n      const tabs = props.panes.map((pane, index) => {\n        const tabName = pane.props.name || pane.index || `${index}`\n        const closable = pane.isClosable || props.editable\n        pane.index = `${index}`\n\n        const btnClose = closable\n          ? h(\n              ElIcon,\n              {\n                class: 'is-icon-close',\n                onClick: (ev: MouseEvent) => props.onTabRemove(pane, ev),\n              },\n              { default: () => h(Close) }\n            )\n          : null\n\n        const tabLabelContent =\n          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: () => setFocus(),\n            onBlur: () => removeFocus(),\n            onClick: (ev: MouseEvent) => {\n              removeFocus()\n              props.onTabClick(pane, tabName, ev)\n            },\n            onKeydown: (ev: KeyboardEvent) => {\n              if (\n                closable &&\n                (ev.code === EVENT_CODE.delete ||\n                  ev.code === EVENT_CODE.backspace)\n              ) {\n                props.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.value ? '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                    props.stretch &&\n                    ['top', 'bottom'].includes(rootTabs.props.tabPosition)\n                      ? 'is-stretch'\n                      : '',\n                  ],\n                  ref: nav$,\n                  style: navStyle.value,\n                  role: 'tablist',\n                  onKeydown: changeTab,\n                },\n                [\n                  !props.type\n                    ? h(TabBar, {\n                        tabs: [...props.panes],\n                      })\n                    : null,\n                  tabs,\n                ]\n              ),\n            ]\n          ),\n        ]\n      )\n    }\n  },\n})\n"],"names":["TabBar"],"mappings":"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"}

package/es/components/tabs/src/tab-pane.vue.d.ts

@@ -16,14 +16,14 @@ declare const _default: import("vue").DefineComponent<{
     readonly lazy?: unknown;
 } & {
     disabled: boolean;
-    label: string;
     name: string;
+    label: string;
     closable: boolean;
     lazy: boolean;
 } & {}>, {
     disabled: boolean;
-    label: string;
     name: string;
+    label: string;
     closable: boolean;
     lazy: boolean;
 }>;

package/es/components/tabs/src/tabs.mjs

@@ -2,7 +2,7 @@ import { Fragment, defineComponent, getCurrentInstance, ref, onUpdated, onMounte
 import { isPromise, NOOP } from '@vue/shared';
 import { EVENT_CODE } from '../../../utils/aria.mjs';
 import { ElIcon } from '../../icon/index.mjs';
-import { Plus } from '@element-plus/icons';
+import { Plus } from '@element-plus/icons-vue';
 import { buildProps, definePropType } from '../../../utils/props.mjs';
 import { UPDATE_MODEL_EVENT, INPUT_EVENT } from '../../../utils/constants.mjs';
 import '../../../tokens/index.mjs';

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

@@ -1 +1 @@
-{"version":3,"file":"tabs.mjs","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  renderSlot,\n  watch,\n} from 'vue'\nimport { isPromise, NOOP } 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 { buildProps, definePropType } from '@element-plus/utils/props'\nimport { INPUT_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { tabsRootContextKey } from '@element-plus/tokens'\nimport TabNav from './tab-nav'\nimport type { TabsPaneContext } from '@element-plus/tokens'\n\nimport type {\n  Component,\n  ComponentInternalInstance,\n  VNode,\n  ExtractPropTypes,\n  Ref,\n} from 'vue'\n\nexport const tabsProps = buildProps({\n  type: {\n    type: String,\n    values: ['card', 'border-card', ''],\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,\n    values: ['top', 'right', 'bottom', 'left'],\n    default: 'top',\n  },\n  beforeLeave: {\n    type: definePropType<\n      (\n        newTabName: string,\n        oldTabName: string\n      ) => void | boolean | Promise<void | boolean>\n    >(Function),\n    default: () => true,\n  },\n  stretch: Boolean,\n} as const)\nexport type TabsProps = ExtractPropTypes<typeof tabsProps>\n\nexport const tabsEmits = {\n  [UPDATE_MODEL_EVENT]: (tabName: string) => typeof tabName === 'string',\n  [INPUT_EVENT]: (tabName: string) => typeof tabName === 'string',\n  'tab-click': (pane: TabsPaneContext, ev: Event) => ev instanceof Event,\n  edit: (paneName: string | null, action: 'remove' | 'add') =>\n    action === 'remove' || action === 'add',\n  'tab-remove': (paneName: string) => typeof paneName === 'string',\n  'tab-add': () => true,\n}\nexport type TabsEmits = typeof tabsEmits\n\nconst getPaneInstanceFromSlot = (\n  vnode: VNode,\n  paneInstanceList: ComponentInternalInstance[] = []\n) => {\n  const children = (vnode.children || []) as ArrayLike<VNode>\n  Array.from(children).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\nexport default defineComponent({\n  name: 'ElTabs',\n\n  props: tabsProps,\n  emits: tabsEmits,\n\n  setup(props, { emit, slots, expose }) {\n    const instance = getCurrentInstance()!\n    const nav$ = ref<InstanceType<typeof TabNav>>()\n\n    const panes: Ref<TabsPaneContext[]> = ref([])\n    const currentName = ref(props.modelValue || props.activeName || '0')\n\n    const paneStatesMap: Record<number, TabsPaneContext> = {}\n\n    const updatePaneInstances = (isForceUpdate = false) => {\n      if (slots.default) {\n        const children = instance.subTree.children as ArrayLike<VNode>\n        const content = Array.from(children).find(\n          ({ props }) => props?.class === 'el-tabs__content'\n        )\n        if (!content) return\n\n        const paneInstanceList: TabsPaneContext[] = getPaneInstanceFromSlot(\n          content\n        ).map((paneComponent) => paneStatesMap[paneComponent.uid])\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: string) => {\n      currentName.value = value\n      emit(INPUT_EVENT, value)\n      emit(UPDATE_MODEL_EVENT, value)\n    }\n\n    const setCurrentName = (value: string) => {\n      // should do nothing.\n      if (currentName.value === value) return\n\n      const canLeave = props.beforeLeave?.(value, currentName.value)\n      if (isPromise(canLeave)) {\n        canLeave.then(\n          () => {\n            changeCurrentName(value)\n\n            // call exposed function, Vue doesn't support expose in typescript yet.\n            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-expect-error\n            nav$.value?.removeFocus?.()\n          },\n          // ignore promise rejection in `before-leave` hook\n          NOOP\n        )\n      } else if (canLeave !== false) {\n        changeCurrentName(value)\n      }\n    }\n\n    const handleTabClick = (\n      tab: TabsPaneContext,\n      tabName: string,\n      event: Event\n    ) => {\n      if (tab.props.disabled) return\n      setCurrentName(tabName)\n      emit('tab-click', tab, event)\n    }\n\n    const handleTabRemove = (pane: TabsPaneContext, ev: Event) => {\n      if (pane.props.disabled) return\n      ev.stopPropagation()\n      emit('edit', pane.props.name, 'remove')\n      emit('tab-remove', pane.props.name)\n    }\n\n    const handleTabAdd = () => {\n      emit('edit', null, 'add')\n      emit('tab-add')\n    }\n\n    onUpdated(() => updatePaneInstances())\n    onMounted(() => updatePaneInstances())\n\n    watch(\n      () => props.activeName,\n      (modelValue) => setCurrentName(modelValue)\n    )\n\n    watch(\n      () => props.modelValue,\n      (modelValue) => setCurrentName(modelValue)\n    )\n\n    watch(currentName, async () => {\n      updatePaneInstances(true)\n      await nextTick()\n      await nav$.value?.$nextTick()\n\n      // call exposed function, Vue doesn't support expose in typescript yet.\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-expect-error\n      nav$.value?.scrollToActiveTab()\n    })\n\n    provide(tabsRootContextKey, {\n      props,\n      currentName,\n      updatePaneState: (pane) => (paneStatesMap[pane.uid] = pane),\n    })\n\n    expose({\n      currentName,\n    })\n\n    return () => {\n      const newButton =\n        props.editable || props.addable\n          ? h(\n              'span',\n              {\n                class: 'el-tabs__new-tab',\n                tabindex: '0',\n                onClick: handleTabAdd,\n                onKeydown: (ev: KeyboardEvent) => {\n                  if (ev.code === EVENT_CODE.enter) handleTabAdd()\n                },\n              },\n              [h(ElIcon, { class: 'is-icon-plus' }, { default: () => h(Plus) })]\n            )\n          : null\n\n      const header = h(\n        'div',\n        { class: ['el-tabs__header', `is-${props.tabPosition}`] },\n        [\n          newButton,\n          h(TabNav, {\n            currentName: currentName.value,\n            editable: props.editable,\n            type: props.type,\n            panes: panes.value,\n            stretch: props.stretch,\n            ref: nav$,\n            onTabClick: handleTabClick,\n            onTabRemove: handleTabRemove,\n          }),\n        ]\n      )\n\n      const panels = h('div', { class: 'el-tabs__content' }, [\n        renderSlot(slots, 'default'),\n      ])\n\n      return h(\n        'div',\n        {\n          class: {\n            'el-tabs': true,\n            'el-tabs--card': props.type === 'card',\n            [`el-tabs--${props.tabPosition}`]: true,\n            'el-tabs--border-card': props.type === 'border-card',\n          },\n        },\n        props.tabPosition !== 'bottom' ? [header, panels] : [panels, header]\n      )\n    }\n  },\n})\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"tabs.mjs","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  renderSlot,\n  watch,\n} from 'vue'\nimport { isPromise, NOOP } from '@vue/shared'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport ElIcon from '@element-plus/components/icon'\nimport { Plus } from '@element-plus/icons-vue'\nimport { buildProps, definePropType } from '@element-plus/utils/props'\nimport { INPUT_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { tabsRootContextKey } from '@element-plus/tokens'\nimport TabNav from './tab-nav'\nimport type { TabsPaneContext } from '@element-plus/tokens'\n\nimport type {\n  Component,\n  ComponentInternalInstance,\n  VNode,\n  ExtractPropTypes,\n  Ref,\n} from 'vue'\n\nexport const tabsProps = buildProps({\n  type: {\n    type: String,\n    values: ['card', 'border-card', ''],\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,\n    values: ['top', 'right', 'bottom', 'left'],\n    default: 'top',\n  },\n  beforeLeave: {\n    type: definePropType<\n      (\n        newTabName: string,\n        oldTabName: string\n      ) => void | boolean | Promise<void | boolean>\n    >(Function),\n    default: () => true,\n  },\n  stretch: Boolean,\n} as const)\nexport type TabsProps = ExtractPropTypes<typeof tabsProps>\n\nexport const tabsEmits = {\n  [UPDATE_MODEL_EVENT]: (tabName: string) => typeof tabName === 'string',\n  [INPUT_EVENT]: (tabName: string) => typeof tabName === 'string',\n  'tab-click': (pane: TabsPaneContext, ev: Event) => ev instanceof Event,\n  edit: (paneName: string | null, action: 'remove' | 'add') =>\n    action === 'remove' || action === 'add',\n  'tab-remove': (paneName: string) => typeof paneName === 'string',\n  'tab-add': () => true,\n}\nexport type TabsEmits = typeof tabsEmits\n\nconst getPaneInstanceFromSlot = (\n  vnode: VNode,\n  paneInstanceList: ComponentInternalInstance[] = []\n) => {\n  const children = (vnode.children || []) as ArrayLike<VNode>\n  Array.from(children).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\nexport default defineComponent({\n  name: 'ElTabs',\n\n  props: tabsProps,\n  emits: tabsEmits,\n\n  setup(props, { emit, slots, expose }) {\n    const instance = getCurrentInstance()!\n    const nav$ = ref<InstanceType<typeof TabNav>>()\n\n    const panes: Ref<TabsPaneContext[]> = ref([])\n    const currentName = ref(props.modelValue || props.activeName || '0')\n\n    const paneStatesMap: Record<number, TabsPaneContext> = {}\n\n    const updatePaneInstances = (isForceUpdate = false) => {\n      if (slots.default) {\n        const children = instance.subTree.children as ArrayLike<VNode>\n        const content = Array.from(children).find(\n          ({ props }) => props?.class === 'el-tabs__content'\n        )\n        if (!content) return\n\n        const paneInstanceList: TabsPaneContext[] = getPaneInstanceFromSlot(\n          content\n        ).map((paneComponent) => paneStatesMap[paneComponent.uid])\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: string) => {\n      currentName.value = value\n      emit(INPUT_EVENT, value)\n      emit(UPDATE_MODEL_EVENT, value)\n    }\n\n    const setCurrentName = (value: string) => {\n      // should do nothing.\n      if (currentName.value === value) return\n\n      const canLeave = props.beforeLeave?.(value, currentName.value)\n      if (isPromise(canLeave)) {\n        canLeave.then(\n          () => {\n            changeCurrentName(value)\n\n            // call exposed function, Vue doesn't support expose in typescript yet.\n            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-expect-error\n            nav$.value?.removeFocus?.()\n          },\n          // ignore promise rejection in `before-leave` hook\n          NOOP\n        )\n      } else if (canLeave !== false) {\n        changeCurrentName(value)\n      }\n    }\n\n    const handleTabClick = (\n      tab: TabsPaneContext,\n      tabName: string,\n      event: Event\n    ) => {\n      if (tab.props.disabled) return\n      setCurrentName(tabName)\n      emit('tab-click', tab, event)\n    }\n\n    const handleTabRemove = (pane: TabsPaneContext, ev: Event) => {\n      if (pane.props.disabled) return\n      ev.stopPropagation()\n      emit('edit', pane.props.name, 'remove')\n      emit('tab-remove', pane.props.name)\n    }\n\n    const handleTabAdd = () => {\n      emit('edit', null, 'add')\n      emit('tab-add')\n    }\n\n    onUpdated(() => updatePaneInstances())\n    onMounted(() => updatePaneInstances())\n\n    watch(\n      () => props.activeName,\n      (modelValue) => setCurrentName(modelValue)\n    )\n\n    watch(\n      () => props.modelValue,\n      (modelValue) => setCurrentName(modelValue)\n    )\n\n    watch(currentName, async () => {\n      updatePaneInstances(true)\n      await nextTick()\n      await nav$.value?.$nextTick()\n\n      // call exposed function, Vue doesn't support expose in typescript yet.\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-expect-error\n      nav$.value?.scrollToActiveTab()\n    })\n\n    provide(tabsRootContextKey, {\n      props,\n      currentName,\n      updatePaneState: (pane) => (paneStatesMap[pane.uid] = pane),\n    })\n\n    expose({\n      currentName,\n    })\n\n    return () => {\n      const newButton =\n        props.editable || props.addable\n          ? h(\n              'span',\n              {\n                class: 'el-tabs__new-tab',\n                tabindex: '0',\n                onClick: handleTabAdd,\n                onKeydown: (ev: KeyboardEvent) => {\n                  if (ev.code === EVENT_CODE.enter) handleTabAdd()\n                },\n              },\n              [h(ElIcon, { class: 'is-icon-plus' }, { default: () => h(Plus) })]\n            )\n          : null\n\n      const header = h(\n        'div',\n        { class: ['el-tabs__header', `is-${props.tabPosition}`] },\n        [\n          newButton,\n          h(TabNav, {\n            currentName: currentName.value,\n            editable: props.editable,\n            type: props.type,\n            panes: panes.value,\n            stretch: props.stretch,\n            ref: nav$,\n            onTabClick: handleTabClick,\n            onTabRemove: handleTabRemove,\n          }),\n        ]\n      )\n\n      const panels = h('div', { class: 'el-tabs__content' }, [\n        renderSlot(slots, 'default'),\n      ])\n\n      return h(\n        'div',\n        {\n          class: {\n            'el-tabs': true,\n            'el-tabs--card': props.type === 'card',\n            [`el-tabs--${props.tabPosition}`]: true,\n            'el-tabs--border-card': props.type === 'border-card',\n          },\n        },\n        props.tabPosition !== 'bottom' ? [header, panels] : [panels, header]\n      )\n    }\n  },\n})\n"],"names":[],"mappings":"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"}

package/es/components/tag/src/tag.vue_vue_type_script_lang.mjs

@@ -1,8 +1,9 @@
 import { defineComponent, computed } from 'vue';
 import { ElIcon } from '../../icon/index.mjs';
-import { useGlobalConfig } from '../../../utils/util.mjs';
-import { Close } from '@element-plus/icons';
+import { Close } from '@element-plus/icons-vue';
+import '../../../hooks/index.mjs';
 import { tagProps, tagEmits } from './tag.mjs';
+import { useSize } from '../../../hooks/use-common-props/index.mjs';
 
 var script = defineComponent({
   name: "ElTag",
@@ -10,8 +11,7 @@ var script = defineComponent({
   props: tagProps,
   emits: tagEmits,
   setup(props, { emit }) {
-    const ELEMENT = useGlobalConfig();
-    const tagSize = computed(() => props.size || ELEMENT.size);
+    const tagSize = useSize();
     const classes = computed(() => {
       const { type, hit, effect } = props;
       return [

package/es/components/tag/src/tag.vue_vue_type_script_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tag.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/tag/src/tag.vue"],"sourcesContent":["<template>\n  <span\n    v-if=\"!disableTransitions\"\n    :class=\"classes\"\n    :style=\"{ backgroundColor: color }\"\n    @click=\"handleClick\"\n  >\n    <slot></slot>\n    <el-icon v-if=\"closable\" class=\"el-tag__close\" @click=\"handleClose\">\n      <close />\n    </el-icon>\n  </span>\n  <transition v-else name=\"el-zoom-in-center\">\n    <span\n      :class=\"classes\"\n      :style=\"{ backgroundColor: color }\"\n      @click=\"handleClick\"\n    >\n      <slot></slot>\n      <el-icon v-if=\"closable\" class=\"el-tag__close\" @click=\"handleClose\">\n        <close />\n      </el-icon>\n    </span>\n  </transition>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport ElIcon from '@element-plus/components/icon'\nimport { useGlobalConfig } from '@element-plus/utils/util'\nimport { Close } from '@element-plus/icons'\n\nimport { tagProps, tagEmits } from './tag'\n\nexport default defineComponent({\n  name: 'ElTag',\n\n  components: { ElIcon, Close },\n\n  props: tagProps,\n  emits: tagEmits,\n\n  setup(props, { emit }) {\n    const ELEMENT = useGlobalConfig()\n\n    const tagSize = computed(() => props.size || ELEMENT.size)\n    const classes = computed(() => {\n      const { type, hit, effect } = props\n      return [\n        'el-tag',\n        type ? `el-tag--${type}` : '',\n        tagSize.value ? `el-tag--${tagSize.value}` : '',\n        effect ? `el-tag--${effect}` : '',\n        hit && 'is-hit',\n      ]\n    })\n\n    // methods\n    const handleClose = (event: MouseEvent) => {\n      event.stopPropagation()\n      emit('close', event)\n    }\n\n    const handleClick = (event: MouseEvent) => {\n      emit('click', event)\n    }\n\n    return {\n      classes,\n      handleClose,\n      handleClick,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;AAkCA,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EAEN,YAAY,EAAE,QAAQ;AAAA,EAEtB,OAAO;AAAA,EACP,OAAO;AAAA,EAEP,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,UAAU;AAEhB,UAAM,UAAU,SAAS,MAAM,MAAM,QAAQ,QAAQ;AACrD,UAAM,UAAU,SAAS,MAAM;AAC7B,YAAM,EAAE,MAAM,KAAK,WAAW;AAC9B,aAAO;AAAA,QACL;AAAA,QACA,OAAO,WAAW,SAAS;AAAA,QAC3B,QAAQ,QAAQ,WAAW,QAAQ,UAAU;AAAA,QAC7C,SAAS,WAAW,WAAW;AAAA,QAC/B,OAAO;AAAA;AAAA;AAKX,UAAM,cAAc,CAAC,UAAsB;AACzC,YAAM;AACN,WAAK,SAAS;AAAA;AAGhB,UAAM,cAAc,CAAC,UAAsB;AACzC,WAAK,SAAS;AAAA;AAGhB,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}
+{"version":3,"file":"tag.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/tag/src/tag.vue"],"sourcesContent":["<template>\n  <span\n    v-if=\"!disableTransitions\"\n    :class=\"classes\"\n    :style=\"{ backgroundColor: color }\"\n    @click=\"handleClick\"\n  >\n    <slot></slot>\n    <el-icon v-if=\"closable\" class=\"el-tag__close\" @click=\"handleClose\">\n      <close />\n    </el-icon>\n  </span>\n  <transition v-else name=\"el-zoom-in-center\">\n    <span\n      :class=\"classes\"\n      :style=\"{ backgroundColor: color }\"\n      @click=\"handleClick\"\n    >\n      <slot></slot>\n      <el-icon v-if=\"closable\" class=\"el-tag__close\" @click=\"handleClose\">\n        <close />\n      </el-icon>\n    </span>\n  </transition>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport ElIcon from '@element-plus/components/icon'\nimport { Close } from '@element-plus/icons-vue'\n\nimport { useSize } from '@element-plus/hooks'\nimport { tagProps, tagEmits } from './tag'\n\nexport default defineComponent({\n  name: 'ElTag',\n\n  components: { ElIcon, Close },\n\n  props: tagProps,\n  emits: tagEmits,\n\n  setup(props, { emit }) {\n    const tagSize = useSize()\n    const classes = computed(() => {\n      const { type, hit, effect } = props\n      return [\n        'el-tag',\n        type ? `el-tag--${type}` : '',\n        tagSize.value ? `el-tag--${tagSize.value}` : '',\n        effect ? `el-tag--${effect}` : '',\n        hit && 'is-hit',\n      ]\n    })\n\n    // methods\n    const handleClose = (event: MouseEvent) => {\n      event.stopPropagation()\n      emit('close', event)\n    }\n\n    const handleClick = (event: MouseEvent) => {\n      emit('click', event)\n    }\n\n    return {\n      classes,\n      handleClose,\n      handleClick,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;AAkCA,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EAEN,YAAY,EAAE,QAAQ;AAAA,EAEtB,OAAO;AAAA,EACP,OAAO;AAAA,EAEP,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,UAAU;AAChB,UAAM,UAAU,SAAS,MAAM;AAC7B,YAAM,EAAE,MAAM,KAAK,WAAW;AAC9B,aAAO;AAAA,QACL;AAAA,QACA,OAAO,WAAW,SAAS;AAAA,QAC3B,QAAQ,QAAQ,WAAW,QAAQ,UAAU;AAAA,QAC7C,SAAS,WAAW,WAAW;AAAA,QAC/B,OAAO;AAAA;AAAA;AAKX,UAAM,cAAc,CAAC,UAAsB;AACzC,YAAM;AACN,WAAK,SAAS;AAAA;AAGhB,UAAM,cAAc,CAAC,UAAsB;AACzC,WAAK,SAAS;AAAA;AAGhB,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}

package/es/components/tag/src/tag.vue_vue_type_template_id_525996c5_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tag.vue_vue_type_template_id_525996c5_lang.mjs","sources":["../../../../../../packages/components/tag/src/tag.vue?vue&type=template&id=525996c5&lang.js"],"sourcesContent":["<template>\n  <span\n    v-if=\"!disableTransitions\"\n    :class=\"classes\"\n    :style=\"{ backgroundColor: color }\"\n    @click=\"handleClick\"\n  >\n    <slot></slot>\n    <el-icon v-if=\"closable\" class=\"el-tag__close\" @click=\"handleClose\">\n      <close />\n    </el-icon>\n  </span>\n  <transition v-else name=\"el-zoom-in-center\">\n    <span\n      :class=\"classes\"\n      :style=\"{ backgroundColor: color }\"\n      @click=\"handleClick\"\n    >\n      <slot></slot>\n      <el-icon v-if=\"closable\" class=\"el-tag__close\" @click=\"handleClose\">\n        <close />\n      </el-icon>\n    </span>\n  </transition>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport ElIcon from '@element-plus/components/icon'\nimport { useGlobalConfig } from '@element-plus/utils/util'\nimport { Close } from '@element-plus/icons'\n\nimport { tagProps, tagEmits } from './tag'\n\nexport default defineComponent({\n  name: 'ElTag',\n\n  components: { ElIcon, Close },\n\n  props: tagProps,\n  emits: tagEmits,\n\n  setup(props, { emit }) {\n    const ELEMENT = useGlobalConfig()\n\n    const tagSize = computed(() => props.size || ELEMENT.size)\n    const classes = computed(() => {\n      const { type, hit, effect } = props\n      return [\n        'el-tag',\n        type ? `el-tag--${type}` : '',\n        tagSize.value ? `el-tag--${tagSize.value}` : '',\n        effect ? `el-tag--${effect}` : '',\n        hit && 'is-hit',\n      ]\n    })\n\n    // methods\n    const handleClose = (event: MouseEvent) => {\n      event.stopPropagation()\n      emit('close', event)\n    }\n\n    const handleClick = (event: MouseEvent) => {\n      emit('click', event)\n    }\n\n    return {\n      classes,\n      handleClose,\n      handleClick,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_renderSlot","_createBlock","_createVNode","_createElementVNode"],"mappings":";;;;;UAEW,wCADTA;;IAEG,sBAAO;IACP,yCAA0B;IAC1B,gDAAO;;IAERC;IACe,8BAAfC;;MAAyB,OAAM;AAAA,MAAiB,SAAO;;uBACrD;QAAAC;;;;yBAGJD;;IAAmB,MAAK;AAAA;qBACtB;MAAAE;QACG,sBAAO;QACP,yCAA0B;QAC1B,gDAAO;;QAERH;QACe,8BAAfC;;UAAyB,OAAM;AAAA,UAAiB,SAAO;;2BACrD;YAAAC;;;;;;;;;;;;"}
+{"version":3,"file":"tag.vue_vue_type_template_id_525996c5_lang.mjs","sources":["../../../../../../packages/components/tag/src/tag.vue?vue&type=template&id=525996c5&lang.js"],"sourcesContent":["<template>\n  <span\n    v-if=\"!disableTransitions\"\n    :class=\"classes\"\n    :style=\"{ backgroundColor: color }\"\n    @click=\"handleClick\"\n  >\n    <slot></slot>\n    <el-icon v-if=\"closable\" class=\"el-tag__close\" @click=\"handleClose\">\n      <close />\n    </el-icon>\n  </span>\n  <transition v-else name=\"el-zoom-in-center\">\n    <span\n      :class=\"classes\"\n      :style=\"{ backgroundColor: color }\"\n      @click=\"handleClick\"\n    >\n      <slot></slot>\n      <el-icon v-if=\"closable\" class=\"el-tag__close\" @click=\"handleClose\">\n        <close />\n      </el-icon>\n    </span>\n  </transition>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport ElIcon from '@element-plus/components/icon'\nimport { Close } from '@element-plus/icons-vue'\n\nimport { useSize } from '@element-plus/hooks'\nimport { tagProps, tagEmits } from './tag'\n\nexport default defineComponent({\n  name: 'ElTag',\n\n  components: { ElIcon, Close },\n\n  props: tagProps,\n  emits: tagEmits,\n\n  setup(props, { emit }) {\n    const tagSize = useSize()\n    const classes = computed(() => {\n      const { type, hit, effect } = props\n      return [\n        'el-tag',\n        type ? `el-tag--${type}` : '',\n        tagSize.value ? `el-tag--${tagSize.value}` : '',\n        effect ? `el-tag--${effect}` : '',\n        hit && 'is-hit',\n      ]\n    })\n\n    // methods\n    const handleClose = (event: MouseEvent) => {\n      event.stopPropagation()\n      emit('close', event)\n    }\n\n    const handleClick = (event: MouseEvent) => {\n      emit('click', event)\n    }\n\n    return {\n      classes,\n      handleClose,\n      handleClick,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_renderSlot","_createBlock","_createVNode","_createElementVNode"],"mappings":";;;;;UAEW,wCADTA;;IAEG,sBAAO;IACP,yCAA0B;IAC1B,gDAAO;;IAERC;IACe,8BAAfC;;MAAyB,OAAM;AAAA,MAAiB,SAAO;;uBACrD;QAAAC;;;;yBAGJD;;IAAmB,MAAK;AAAA;qBACtB;MAAAE;QACG,sBAAO;QACP,yCAA0B;QAC1B,gDAAO;;QAERH;QACe,8BAAfC;;UAAyB,OAAM;AAAA,UAAiB,SAAO;;2BACrD;YAAAC;;;;;;;;;;;;"}