element-pe 1.0.8 → 1.0.9-alpha.12

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

@@ -1,12 +1,12 @@
 import { ref, watchEffect, watch, unref, computed, onMounted, nextTick, onUnmounted } from 'vue';
 import throttle from 'lodash/throttle';
 import { addResizeListener, removeResizeListener } from '../../../../utils/resize-event.mjs';
-import { useGlobalConfig } from '../../../../utils/util.mjs';
 import { on, off } from '../../../../utils/dom.mjs';
+import '../../../../hooks/index.mjs';
 import { parseHeight } from '../util.mjs';
+import { useSize } from '../../../../hooks/use-common-props/index.mjs';
 
 function useStyle(props, layout, store, table) {
-  const $ELEMENT = useGlobalConfig();
   const isHidden = ref(false);
   const renderExpanded = ref(null);
   const resizeProxyVisible = ref(false);
@@ -166,9 +166,7 @@ function useStyle(props, layout, store, table) {
       doLayout();
     }
   };
-  const tableSize = computed(() => {
-    return props.size || $ELEMENT.size;
-  });
+  const tableSize = useSize();
   const bodyWidth = computed(() => {
     const { bodyWidth: bodyWidth_, scrollY, gutterWidth } = layout;
     return bodyWidth_.value ? `${bodyWidth_.value - (scrollY.value ? gutterWidth : 0)}px` : "";

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-body/index.d.ts

@@ -47,7 +47,7 @@ declare const _default: import("vue").DefineComponent<{
     context: Table<any>;
     stripe: boolean;
 } & {
-    store?: unknown;
+    store?: any;
     rowClassName?: import("../table/defaults").ColumnCls<any> | undefined;
     rowStyle?: import("../table/defaults").ColumnStyle<any> | undefined;
     tooltipEffect?: string | undefined;

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>;
@@ -76,11 +76,11 @@ declare const _default: {
     property: StringConstructor;
     prop: StringConstructor;
     width: {
-        type: (NumberConstructor | StringConstructor)[];
+        type: (StringConstructor | NumberConstructor)[];
         default: string;
     };
     minWidth: {
-        type: (NumberConstructor | StringConstructor)[];
+        type: (StringConstructor | NumberConstructor)[];
         default: string;
     };
     renderHeader: PropType<(data: CI<any>) => VNode<import("vue").RendererNode, import("vue").RendererElement, {
@@ -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

@@ -10,11 +10,11 @@ declare const _default: import("vue").DefineComponent<{
     property: StringConstructor;
     prop: StringConstructor;
     width: {
-        type: (NumberConstructor | StringConstructor)[];
+        type: (StringConstructor | NumberConstructor)[];
         default: string;
     };
     minWidth: {
-        type: (NumberConstructor | StringConstructor)[];
+        type: (StringConstructor | NumberConstructor)[];
         default: string;
     };
     renderHeader: import("vue").PropType<(data: {
@@ -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>;
@@ -101,14 +101,14 @@ declare const _default: import("vue").DefineComponent<{
     filterMultiple: boolean;
 } & {
     fixed?: string | boolean | undefined;
-    filters?: import("./defaults").Filters | undefined;
     label?: string | undefined;
     index?: number | ((index: number) => number) | undefined;
-    filterMethod?: import("./defaults").FilterMethods<any> | undefined;
     align?: string | undefined;
+    prop?: string | undefined;
+    filters?: import("./defaults").Filters | 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-footer/index.d.ts

@@ -42,11 +42,11 @@ declare const _default: import("vue").DefineComponent<{
 } & {
     fixed: string;
     border: boolean;
-    store: unknown;
+    store: any;
     defaultSort: Sort;
 } & {
-    summaryMethod?: SummaryMethod<any> | undefined;
     sumText?: string | undefined;
+    summaryMethod?: SummaryMethod<any> | undefined;
 }>, {
     fixed: string;
     border: boolean;

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

@@ -59,7 +59,7 @@ declare const _default: import("vue").DefineComponent<{
 } & {
     fixed: string;
     border: boolean;
-    store: unknown;
+    store: any;
     defaultSort: Sort;
 } & {}>, {
     fixed: string;

package/es/components/table/src/table-header/index.mjs

@@ -6,7 +6,7 @@ import { hColgroup } from '../h-helper.mjs';
 import useEvent from './event-helper.mjs';
 import useStyle from './style.helper.mjs';
 import useUtils from './utils-helper.mjs';
-import script from '../filter-panel.vue_vue&type=script&lang.mjs';
+import script from '../filter-panel.vue_vue_type_script_lang.mjs';
 
 var TableHeader = defineComponent({
   name: "ElTableHeader",

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

@@ -1,6 +1,6 @@
-import script from './table.vue_vue&type=script&lang.mjs';
-export { default } from './table.vue_vue&type=script&lang.mjs';
-import { render } from './table.vue_vue&type=template&id=4a1660ad&lang.mjs';
+import script from './table.vue_vue_type_script_lang.mjs';
+export { default } from './table.vue_vue_type_script_lang.mjs';
+import { render } from './table.vue_vue_type_template_id_4a1660ad_lang.mjs';
 
 script.render = render;
 script.__file = "packages/components/table/src/table.vue";

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

@@ -6,9 +6,9 @@ declare const _default: import("vue").DefineComponent<{
         default: () => never[];
     };
     size: StringConstructor;
-    width: (NumberConstructor | StringConstructor)[];
-    height: (NumberConstructor | StringConstructor)[];
-    maxHeight: (NumberConstructor | StringConstructor)[];
+    width: (StringConstructor | NumberConstructor)[];
+    height: (StringConstructor | NumberConstructor)[];
+    maxHeight: (StringConstructor | NumberConstructor)[];
     fit: {
         type: BooleanConstructor;
         default: boolean;
@@ -52,7 +52,7 @@ declare const _default: import("vue").DefineComponent<{
         columnIndex: number;
     }) => import("vue").CSSProperties)) | undefined>;
     highlightCurrentRow: BooleanConstructor;
-    currentRowKey: (NumberConstructor | StringConstructor)[];
+    currentRowKey: (StringConstructor | NumberConstructor)[];
     emptyText: StringConstructor;
     expandRowKeys: import("vue").PropType<any[] | undefined>;
     defaultExpandAll: BooleanConstructor;
@@ -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>;
@@ -157,10 +157,10 @@ declare const _default: import("vue").DefineComponent<{
     clearSort: () => void;
     doLayout: () => void;
     sort: (prop: string, order: string) => void;
-    t: (...args: any[]) => string;
+    t: import("element-pe/es/hooks").Translator;
     setDragVisible: (visible: boolean) => void;
     context: Table<any>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("select-all" | "select" | "expand-change" | "current-change" | "selection-change" | "cell-mouse-enter" | "cell-mouse-leave" | "cell-contextmenu" | "cell-click" | "cell-dblclick" | "row-click" | "row-contextmenu" | "row-dblclick" | "header-click" | "header-contextmenu" | "sort-change" | "filter-change" | "header-dragend")[], "select-all" | "select" | "expand-change" | "current-change" | "selection-change" | "cell-mouse-enter" | "cell-mouse-leave" | "cell-contextmenu" | "cell-click" | "cell-dblclick" | "row-click" | "row-contextmenu" | "row-dblclick" | "header-click" | "header-contextmenu" | "sort-change" | "filter-change" | "header-dragend", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("select" | "select-all" | "expand-change" | "current-change" | "selection-change" | "cell-mouse-enter" | "cell-mouse-leave" | "cell-contextmenu" | "cell-click" | "cell-dblclick" | "row-click" | "row-contextmenu" | "row-dblclick" | "header-click" | "header-contextmenu" | "sort-change" | "filter-change" | "header-dragend")[], "select" | "select-all" | "expand-change" | "current-change" | "selection-change" | "cell-mouse-enter" | "cell-mouse-leave" | "cell-contextmenu" | "cell-click" | "cell-dblclick" | "row-click" | "row-contextmenu" | "row-dblclick" | "header-click" | "header-contextmenu" | "sort-change" | "filter-change" | "header-dragend", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     data?: unknown;
     size?: unknown;
     width?: unknown;
@@ -198,11 +198,11 @@ declare const _default: import("vue").DefineComponent<{
     style?: unknown;
     className?: unknown;
 } & {
+    lazy: boolean;
+    data: any[];
     style: import("vue").CSSProperties;
     border: boolean;
-    data: any[];
     fit: boolean;
-    lazy: boolean;
     className: string;
     stripe: boolean;
     treeProps: {
@@ -216,9 +216,12 @@ declare const _default: import("vue").DefineComponent<{
     selectOnIndeterminate: boolean;
     indent: number;
 } & {
+    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;
-    size?: string | undefined;
+    emptyText?: string | undefined;
+    sumText?: string | undefined;
     maxHeight?: string | number | undefined;
     cellClassName?: (string | ((data: {
         row: any;
@@ -226,13 +229,11 @@ declare const _default: import("vue").DefineComponent<{
         column: import("./table-column/defaults").TableColumnCtx<any>;
         columnIndex: number;
     }) => string)) | undefined;
-    emptyText?: string | undefined;
     defaultSort?: import("./table/defaults").Sort | undefined;
     rowClassName?: import("./table/defaults").ColumnCls<any> | undefined;
     rowStyle?: import("./table/defaults").ColumnStyle<any> | undefined;
     tooltipEffect?: string | undefined;
     summaryMethod?: import("./table/defaults").SummaryMethod<any> | undefined;
-    sumText?: string | undefined;
     rowKey?: string | ((row: any) => string) | undefined;
     cellStyle?: (import("vue").CSSProperties | ((data: {
         row: any;
@@ -264,7 +265,6 @@ declare const _default: import("vue").DefineComponent<{
         rowspan: number;
         colspan: number;
     }) | undefined;
-    load?: ((row: any, treeNode: import("./table/defaults").TreeNode, resolve: (data: any[]) => void) => void) | undefined;
     currentRowKey?: string | number | undefined;
 }> & {
     onSelect?: ((...args: any[]) => any) | undefined;
@@ -286,11 +286,11 @@ declare const _default: import("vue").DefineComponent<{
     "onFilter-change"?: ((...args: any[]) => any) | undefined;
     "onHeader-dragend"?: ((...args: any[]) => any) | undefined;
 }, {
+    lazy: boolean;
+    data: any[];
     style: import("vue").CSSProperties;
     border: boolean;
-    data: any[];
     fit: boolean;
-    lazy: boolean;
     className: string;
     stripe: boolean;
     treeProps: {

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

@@ -0,0 +1,135 @@
+import { defineComponent, getCurrentInstance, computed } from 'vue';
+import debounce from 'lodash/debounce';
+import '../../../directives/index.mjs';
+import '../../../hooks/index.mjs';
+import { createStore } from './store/helper.mjs';
+import TableLayout from './table-layout.mjs';
+import TableHeader from './table-header/index.mjs';
+import TableBody from './table-body/index.mjs';
+import TableFooter from './table-footer/index.mjs';
+import useUtils from './table/utils-helper.mjs';
+import useStyle from './table/style-helper.mjs';
+import defaultProps from './table/defaults.mjs';
+import Mousewheel from '../../../directives/mousewheel/index.mjs';
+import { useLocale } from '../../../hooks/use-locale/index.mjs';
+
+let tableIdSeed = 1;
+var script = defineComponent({
+  name: "ElTable",
+  directives: {
+    Mousewheel
+  },
+  components: {
+    TableHeader,
+    TableBody,
+    TableFooter
+  },
+  props: defaultProps,
+  emits: [
+    "select",
+    "select-all",
+    "selection-change",
+    "cell-mouse-enter",
+    "cell-mouse-leave",
+    "cell-contextmenu",
+    "cell-click",
+    "cell-dblclick",
+    "row-click",
+    "row-contextmenu",
+    "row-dblclick",
+    "header-click",
+    "header-contextmenu",
+    "sort-change",
+    "filter-change",
+    "current-change",
+    "header-dragend",
+    "expand-change"
+  ],
+  setup(props) {
+    const { t } = useLocale();
+    const table = getCurrentInstance();
+    const store = createStore(table, props);
+    table.store = store;
+    const layout = new TableLayout({
+      store: table.store,
+      table,
+      fit: props.fit,
+      showHeader: props.showHeader
+    });
+    table.layout = layout;
+    const isEmpty = computed(() => (store.states.data.value || []).length === 0);
+    const {
+      setCurrentRow,
+      toggleRowSelection,
+      clearSelection,
+      clearFilter,
+      toggleAllSelection,
+      toggleRowExpansion,
+      clearSort,
+      sort
+    } = useUtils(store);
+    const {
+      isHidden,
+      renderExpanded,
+      setDragVisible,
+      isGroup,
+      handleMouseLeave,
+      handleHeaderFooterMousewheel,
+      tableSize,
+      bodyHeight,
+      emptyBlockStyle,
+      handleFixedMousewheel,
+      fixedHeight,
+      fixedBodyHeight,
+      resizeProxyVisible,
+      bodyWidth,
+      resizeState,
+      doLayout
+    } = useStyle(props, layout, store, table);
+    const debouncedUpdateLayout = debounce(doLayout, 50);
+    const tableId = `el-table_${tableIdSeed++}`;
+    table.tableId = tableId;
+    table.state = {
+      isGroup,
+      resizeState,
+      doLayout,
+      debouncedUpdateLayout
+    };
+    return {
+      layout,
+      store,
+      handleHeaderFooterMousewheel,
+      handleMouseLeave,
+      tableId,
+      tableSize,
+      isHidden,
+      isEmpty,
+      renderExpanded,
+      resizeProxyVisible,
+      resizeState,
+      isGroup,
+      bodyWidth,
+      bodyHeight,
+      emptyBlockStyle,
+      debouncedUpdateLayout,
+      handleFixedMousewheel,
+      fixedHeight,
+      fixedBodyHeight,
+      setCurrentRow,
+      toggleRowSelection,
+      clearSelection,
+      clearFilter,
+      toggleAllSelection,
+      toggleRowExpansion,
+      clearSort,
+      doLayout,
+      sort,
+      t,
+      setDragVisible,
+      context: table
+    };
+  }
+});
+
+export { script as default };
+//# sourceMappingURL=table.vue_vue_type_script_lang.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"table.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/table/src/table.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      {\n        'el-table--fit': fit,\n        'el-table--striped': stripe,\n        'el-table--border': border || isGroup,\n        'el-table--hidden': isHidden,\n        'el-table--group': isGroup,\n        'el-table--fluid-height': maxHeight,\n        'el-table--scrollable-x': layout.scrollX.value,\n        'el-table--scrollable-y': layout.scrollY.value,\n        'el-table--enable-row-hover': !store.states.isComplex.value,\n        'el-table--enable-row-transition':\n          (store.states.data.value || []).length !== 0 &&\n          (store.states.data.value || []).length < 100,\n      },\n      tableSize ? `el-table--${tableSize}` : '',\n      className,\n      'el-table',\n    ]\"\n    :style=\"style\"\n    @mouseleave=\"handleMouseLeave()\"\n  >\n    <div ref=\"hiddenColumns\" class=\"hidden-columns\">\n      <slot></slot>\n    </div>\n    <div\n      v-if=\"showHeader\"\n      ref=\"headerWrapper\"\n      v-mousewheel=\"handleHeaderFooterMousewheel\"\n      class=\"el-table__header-wrapper\"\n    >\n      <table-header\n        ref=\"tableHeader\"\n        :border=\"border\"\n        :default-sort=\"defaultSort\"\n        :store=\"store\"\n        :style=\"{\n          width: layout.bodyWidth.value ? layout.bodyWidth.value + 'px' : '',\n        }\"\n        @set-drag-visible=\"setDragVisible\"\n      />\n    </div>\n    <div ref=\"bodyWrapper\" :style=\"[bodyHeight]\" class=\"el-table__body-wrapper\">\n      <table-body\n        :context=\"context\"\n        :highlight=\"highlightCurrentRow\"\n        :row-class-name=\"rowClassName\"\n        :tooltip-effect=\"tooltipEffect\"\n        :row-style=\"rowStyle\"\n        :store=\"store\"\n        :stripe=\"stripe\"\n        :style=\"{\n          width: bodyWidth,\n        }\"\n      />\n      <div\n        v-if=\"isEmpty\"\n        ref=\"emptyBlock\"\n        :style=\"emptyBlockStyle\"\n        class=\"el-table__empty-block\"\n      >\n        <span class=\"el-table__empty-text\">\n          <slot name=\"empty\">{{ emptyText || t('el.table.emptyText') }}</slot>\n        </span>\n      </div>\n      <div\n        v-if=\"$slots.append\"\n        ref=\"appendWrapper\"\n        class=\"el-table__append-wrapper\"\n      >\n        <slot name=\"append\"></slot>\n      </div>\n    </div>\n    <div\n      v-if=\"showSummary\"\n      v-show=\"!isEmpty\"\n      ref=\"footerWrapper\"\n      v-mousewheel=\"handleHeaderFooterMousewheel\"\n      class=\"el-table__footer-wrapper\"\n    >\n      <table-footer\n        :border=\"border\"\n        :default-sort=\"defaultSort\"\n        :store=\"store\"\n        :style=\"{\n          width: layout.bodyWidth.value ? layout.bodyWidth.value + 'px' : '',\n        }\"\n        :sum-text=\"sumText || t('el.table.sumText')\"\n        :summary-method=\"summaryMethod\"\n      />\n    </div>\n    <div\n      v-if=\"store.states.fixedColumns.value.length > 0\"\n      ref=\"fixedWrapper\"\n      v-mousewheel=\"handleFixedMousewheel\"\n      :style=\"[\n        {\n          width: layout.fixedWidth.value ? layout.fixedWidth.value + 'px' : '',\n        },\n        fixedHeight,\n      ]\"\n      class=\"el-table__fixed\"\n    >\n      <div\n        v-if=\"showHeader\"\n        ref=\"fixedHeaderWrapper\"\n        class=\"el-table__fixed-header-wrapper\"\n      >\n        <table-header\n          ref=\"fixedTableHeader\"\n          :border=\"border\"\n          :store=\"store\"\n          :style=\"{\n            width: bodyWidth,\n          }\"\n          fixed=\"left\"\n          @set-drag-visible=\"setDragVisible\"\n        />\n      </div>\n      <div\n        ref=\"fixedBodyWrapper\"\n        :style=\"[\n          {\n            top: layout.headerHeight.value + 'px',\n          },\n          fixedBodyHeight,\n        ]\"\n        class=\"el-table__fixed-body-wrapper\"\n      >\n        <table-body\n          :highlight=\"highlightCurrentRow\"\n          :row-class-name=\"rowClassName\"\n          :tooltip-effect=\"tooltipEffect\"\n          :row-style=\"rowStyle\"\n          :store=\"store\"\n          :stripe=\"stripe\"\n          :style=\"{\n            width: bodyWidth,\n          }\"\n          fixed=\"left\"\n        />\n        <div\n          v-if=\"$slots.append\"\n          :style=\"{ height: layout.appendHeight.value + 'px' }\"\n          class=\"el-table__append-gutter\"\n        ></div>\n      </div>\n      <div\n        v-if=\"showSummary\"\n        v-show=\"!isEmpty\"\n        ref=\"fixedFooterWrapper\"\n        class=\"el-table__fixed-footer-wrapper\"\n      >\n        <table-footer\n          :border=\"border\"\n          :store=\"store\"\n          :style=\"{\n            width: bodyWidth,\n          }\"\n          :sum-text=\"sumText || t('el.table.sumText')\"\n          :summary-method=\"summaryMethod\"\n          fixed=\"left\"\n        />\n      </div>\n    </div>\n    <div\n      v-if=\"store.states.rightFixedColumns.value.length > 0\"\n      ref=\"rightFixedWrapper\"\n      v-mousewheel=\"handleFixedMousewheel\"\n      :style=\"[\n        {\n          width: layout.rightFixedWidth.value\n            ? layout.rightFixedWidth.value + 'px'\n            : '',\n          right: layout.scrollY.value\n            ? (border ? layout.gutterWidth : layout.gutterWidth || 0) + 'px'\n            : '',\n        },\n        fixedHeight,\n      ]\"\n      class=\"el-table__fixed-right\"\n    >\n      <div\n        v-if=\"showHeader\"\n        ref=\"rightFixedHeaderWrapper\"\n        class=\"el-table__fixed-header-wrapper\"\n      >\n        <table-header\n          ref=\"rightFixedTableHeader\"\n          :border=\"border\"\n          :store=\"store\"\n          :style=\"{\n            width: bodyWidth,\n          }\"\n          fixed=\"right\"\n          @set-drag-visible=\"setDragVisible\"\n        />\n      </div>\n      <div\n        ref=\"rightFixedBodyWrapper\"\n        :style=\"[{ top: layout.headerHeight.value + 'px' }, fixedBodyHeight]\"\n        class=\"el-table__fixed-body-wrapper\"\n      >\n        <table-body\n          :highlight=\"highlightCurrentRow\"\n          :row-class-name=\"rowClassName\"\n          :tooltip-effect=\"tooltipEffect\"\n          :row-style=\"rowStyle\"\n          :store=\"store\"\n          :stripe=\"stripe\"\n          :style=\"{\n            width: bodyWidth,\n          }\"\n          fixed=\"right\"\n        />\n        <div\n          v-if=\"$slots.append\"\n          :style=\"{ height: layout.appendHeight.value + 'px' }\"\n          class=\"el-table__append-gutter\"\n        ></div>\n      </div>\n      <div\n        v-if=\"showSummary\"\n        v-show=\"!isEmpty\"\n        ref=\"rightFixedFooterWrapper\"\n        class=\"el-table__fixed-footer-wrapper\"\n      >\n        <table-footer\n          :border=\"border\"\n          :store=\"store\"\n          :style=\"{\n            width: bodyWidth,\n          }\"\n          :sum-text=\"sumText || t('el.table.sumText')\"\n          :summary-method=\"summaryMethod\"\n          fixed=\"right\"\n        />\n      </div>\n    </div>\n    <div\n      v-if=\"store.states.rightFixedColumns.value.length > 0\"\n      ref=\"rightFixedPatch\"\n      :style=\"{\n        width: layout.scrollY.value ? layout.gutterWidth + 'px' : '0',\n        height: layout.headerHeight.value + 'px',\n      }\"\n      class=\"el-table__fixed-right-patch\"\n    ></div>\n    <div\n      v-show=\"resizeProxyVisible\"\n      ref=\"resizeProxy\"\n      class=\"el-table__column-resize-proxy\"\n    ></div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, getCurrentInstance, computed } from 'vue'\nimport debounce from 'lodash/debounce'\nimport { Mousewheel } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport { createStore } from './store/helper'\nimport TableLayout from './table-layout'\nimport TableHeader from './table-header'\nimport TableBody from './table-body'\nimport TableFooter from './table-footer'\nimport useUtils from './table/utils-helper'\nimport useStyle from './table/style-helper'\nimport defaultProps from './table/defaults'\n\nimport type { Table } from './table/defaults'\n\nlet tableIdSeed = 1\nexport default defineComponent({\n  name: 'ElTable',\n  directives: {\n    Mousewheel,\n  },\n  components: {\n    TableHeader,\n    TableBody,\n    TableFooter,\n  },\n  props: defaultProps,\n  emits: [\n    'select',\n    'select-all',\n    'selection-change',\n    'cell-mouse-enter',\n    'cell-mouse-leave',\n    'cell-contextmenu',\n    'cell-click',\n    'cell-dblclick',\n    'row-click',\n    'row-contextmenu',\n    'row-dblclick',\n    'header-click',\n    'header-contextmenu',\n    'sort-change',\n    'filter-change',\n    'current-change',\n    'header-dragend',\n    'expand-change',\n  ],\n  setup(props) {\n    type Row = typeof props.data[number]\n    const { t } = useLocale()\n    const table = getCurrentInstance() as Table<Row>\n    const store = createStore<Row>(table, props)\n    table.store = store\n    const layout = new TableLayout<Row>({\n      store: table.store,\n      table,\n      fit: props.fit,\n      showHeader: props.showHeader,\n    })\n    table.layout = layout\n\n    const isEmpty = computed(() => (store.states.data.value || []).length === 0)\n\n    /**\n     * open functions\n     */\n    const {\n      setCurrentRow,\n      toggleRowSelection,\n      clearSelection,\n      clearFilter,\n      toggleAllSelection,\n      toggleRowExpansion,\n      clearSort,\n      sort,\n    } = useUtils<Row>(store)\n    const {\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    } = useStyle<Row>(props, layout, store, table)\n\n    const debouncedUpdateLayout = debounce(doLayout, 50)\n\n    const tableId = `el-table_${tableIdSeed++}`\n    table.tableId = tableId\n    table.state = {\n      isGroup,\n      resizeState,\n      doLayout,\n      debouncedUpdateLayout,\n    }\n    return {\n      layout,\n      store,\n      handleHeaderFooterMousewheel,\n      handleMouseLeave,\n      tableId,\n      tableSize,\n      isHidden,\n      isEmpty,\n      renderExpanded,\n      resizeProxyVisible,\n      resizeState,\n      isGroup,\n      bodyWidth,\n      bodyHeight,\n      emptyBlockStyle,\n      debouncedUpdateLayout,\n      handleFixedMousewheel,\n      fixedHeight,\n      fixedBodyHeight,\n      setCurrentRow,\n      toggleRowSelection,\n      clearSelection,\n      clearFilter,\n      toggleAllSelection,\n      toggleRowExpansion,\n      clearSort,\n      doLayout,\n      sort,\n      t,\n      setDragVisible,\n      context: table,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAkRA,IAAI,cAAc;AAClB,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV;AAAA;AAAA,EAEF,YAAY;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA;AAAA,EAEF,OAAO;AAAA,EACP,OAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,EAEF,MAAM,OAAO;AAEX,UAAM,EAAE,MAAM;AACd,UAAM,QAAQ;AACd,UAAM,QAAQ,YAAiB,OAAO;AACtC,UAAM,QAAQ;AACd,UAAM,SAAS,IAAI,YAAiB;AAAA,MAClC,OAAO,MAAM;AAAA,MACb;AAAA,MACA,KAAK,MAAM;AAAA,MACX,YAAY,MAAM;AAAA;AAEpB,UAAM,SAAS;AAEf,UAAM,UAAU,SAAS,MAAO,OAAM,OAAO,KAAK,SAAS,IAAI,WAAW;AAK1E,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,QACE,SAAc;AAClB,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,QACE,SAAc,OAAO,QAAQ,OAAO;AAExC,UAAM,wBAAwB,SAAS,UAAU;AAEjD,UAAM,UAAU,YAAY;AAC5B,UAAM,UAAU;AAChB,UAAM,QAAQ;AAAA,MACZ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAEF,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAS;AAAA;AAAA;AAAA;;;;"}