@deot/vc-components 1.0.12 → 1.0.13

package/dist/index.umd.cjs

@@ -759,7 +759,7 @@
 
 	// [color, borderColor, backgroundColor], -> CSS
 	const THEME_MAP = {
-	  info: ['#5495f6', '#91d5ff', '#e6f7ff'],
+	  info: ['#2B72FD', '#91d5ff', '#e6f7ff'],
 	  success: ['#52c41a', '#b7eb8f', '#f6ffed'],
 	  error: ['#ed4014', '#ffb08f', '#fbe9e9'],
 	  warning: ['#ffbf00', '#ffe58f', '#fffbe6']
@@ -18896,7 +18896,7 @@
 	  color: {
 	    type: [Object, String],
 	    default: () => ({
-	      normal: "#5495f6",
+	      normal: "#2B72FD",
 	      success: "#52c41a",
 	      error: "#f5222d"
 	    })
@@ -20250,6 +20250,8 @@
 	      });
 	      if (!originalData.length) {
 	        rebuildData.value = [];
+	      } else {
+	        rebuildData.value = originalData.slice();
 	      }
 	      offsetPageSize.value = 0;
 	      await refreshLayout(0, originalData.length);
@@ -38603,17 +38605,24 @@
 	    const dataInstanceChanged = this.states._data !== data;
 	    this.states._data = data;
 	    this.states.data = data;
+	    const caches = /* @__PURE__ */ new Map();
+	    this.states.list.forEach((item) => {
+	      item.rows.forEach((row) => {
+	        caches.set(row.data, row);
+	      });
+	    });
 	    this.states.list = data.reduce((pre, row, index) => {
+	      const cache = caches.get(row) || { heightMap: {} };
 	      pre.push({
 	        rows: [
 	          {
 	            index,
 	            data: row,
-	            height: "",
+	            height: cache.height || "",
 	            heightMap: {
-	              left: "",
-	              main: "",
-	              right: ""
+	              left: cache.heightMap.left || "",
+	              main: cache.heightMap.main || "",
+	              right: cache.heightMap.right || ""
 	            }
 	          }
 	        ],
@@ -38621,6 +38630,7 @@
 	      });
 	      return pre;
 	    }, []);
+	    caches.clear();
 	    this.current.update();
 	    this.expand.update();
 	    if (!this.states.reserveSelection) {
@@ -38754,12 +38764,12 @@
 	   */
 	  cleanSelection() {
 	    const { primaryKey } = this.table.props;
-	    const { selection = [] } = this.states;
+	    const { selection = [], data } = this.states;
 	    let deleted;
 	    if (primaryKey) {
 	      deleted = [];
 	      const selectedMap = getValuesMap(selection, primaryKey);
-	      const dataMap = getValuesMap(selection, primaryKey);
+	      const dataMap = getValuesMap(data, primaryKey);
 	      for (const key in selectedMap) {
 	        if (hasOwn$1(selectedMap, key) && !dataMap[key]) {
 	          deleted.push(selectedMap[key].row);
@@ -38934,8 +38944,10 @@
 	const NormalList = /* @__PURE__ */ vue.defineComponent({
 	  name: COMPONENT_NAME$h,
 	  props: {
-	    data: Array,
-	    default: () => []
+	    data: {
+	      type: Array,
+	      default: () => []
+	    }
 	  },
 	  emits: ['row-resize'],
 	  setup(props, {
@@ -38977,7 +38989,7 @@
 	    expose
 	  }) {
 	    const instance = vue.getCurrentInstance();
-	    const table = getInstance$1('table', 'tableId');
+	    const table = vue.inject('vc-table');
 	    const states = useStates({
 	      data: 'data',
 	      list: 'list',
@@ -39101,7 +39113,7 @@
 	          column,
 	          row
 	        };
-	        table.exposed.hoverState.value = hoverState;
+	        table.hoverState.value = hoverState;
 	        table.emit('cell-mouse-enter', hoverState.row, hoverState.column, hoverState.cell, e);
 	      }
 
@@ -39134,7 +39146,7 @@
 	    const handleCellMouseLeave = e => {
 	      const cell = getCell(e);
 	      if (!cell) return;
-	      const oldHoverState = table.exposed.hoverState.value || {};
+	      const oldHoverState = table.hoverState.value || {};
 	      table.emit('cell-mouse-leave', oldHoverState.row, oldHoverState.column, oldHoverState.cell, e);
 	    };
 	    const handleMouseEnter = debounce$1(index => {
@@ -39172,6 +39184,7 @@
 	        columns
 	      } = states;
 	      const key = getValueOfRow(row, rowIndex);
+	      const selected = props.store.isSelected(row);
 	      return vue.createVNode("div", {
 	        "key": key,
 	        "class": [getRowClass(row, rowIndex), 'vc-table__tr'],
@@ -39192,10 +39205,12 @@
 	        };
 	        if (columnsHidden.value[columnIndex]) {
 	          return vue.createVNode("div", {
+	            "key": column.id,
 	            "style": [sizeStyle]
 	          }, null);
 	        }
 	        return vue.createVNode("div", {
+	          "key": column.id,
 	          "style": [getCellStyle(rowIndex, columnIndex, row, column), sizeStyle],
 	          "class": [getCellClass(rowIndex, columnIndex, row, column), 'vc-table__td'],
 	          "onMouseenter": e => handleCellMouseEnter(e, row),
@@ -39205,7 +39220,8 @@
 	          column,
 	          rowIndex,
 	          columnIndex,
-	          store: props.store
+	          store: props.store,
+	          selected
 	        })]);
 	      })]);
 	    };
@@ -39239,7 +39255,7 @@
 	      wrapper,
 	      getRootElement: () => instance.vnode.el
 	    });
-	    const layout = table.exposed.layout;
+	    const layout = table.layout;
 	    return () => {
 	      return vue.createVNode("div", {
 	        "class": "vc-table__body"
@@ -39249,7 +39265,7 @@
 	        "disabled": true,
 	        "class": "vc-table__tbody",
 	        "scrollerOptions": {
-	          barTo: `.${table.exposed.tableId}`,
+	          barTo: `.${table.tableId}`,
 	          native: false,
 	          always: false,
 	          showBar: !props.fixed,
@@ -39301,7 +39317,7 @@
 	    }
 	  },
 	  setup(props) {
-	    const table = getInstance$1('table', 'tableId');
+	    const table = vue.inject('vc-table');
 	    const instance = vue.getCurrentInstance();
 	    const draggingColumn = vue.ref(null);
 	    const dragging = vue.ref(false);
@@ -39408,7 +39424,7 @@
 	      /* istanbul ignore if */
 	      if (draggingColumn.value && props.border) {
 	        dragging.value = true;
-	        table.exposed.resizeProxyVisible.value = true;
+	        table.resizeProxyVisible.value = true;
 	        const tableEl = table.vnode.el;
 	        const tableLeft = tableEl.getBoundingClientRect().left;
 	        const columnEl = instance.vnode.el.querySelector(`.vc-table__th.${column.id}`);
@@ -39421,7 +39437,7 @@
 	          startColumnLeft: columnRect.left - tableLeft,
 	          tableLeft
 	        };
-	        const resizeProxy = table.exposed.resizeProxy.value;
+	        const resizeProxy = table.resizeProxy.value;
 	        resizeProxy.style.left = dragState.value.startLeft + 'px';
 	        document.onselectstart = () => false;
 	        document.ondragstart = () => false;
@@ -39780,7 +39796,8 @@
 	  emits: ['select', 'select-all', 'selection-change', 'cell-mouse-enter', 'cell-mouse-leave', 'cell-click', 'cell-dblclick', 'row-click', 'row-contextmenu', 'row-dblclick', 'header-click', 'header-contextmenu', 'current-change', 'header-dragend ', 'expand-change', 'sort-change'],
 	  setup(props, {
 	    slots,
-	    expose
+	    expose,
+	    emit
 	  }) {
 	    const instance = vue.getCurrentInstance();
 	    const store = new Store({
@@ -40100,8 +40117,8 @@
 	    }, {
 	      immediate: true
 	    });
-	    vue.watch(() => props.data, v => {
-	      store.setData(v);
+	    vue.watch(() => [props.data, props.data.length], () => {
+	      store.setData(props.data);
 	      isReady.value && vue.nextTick(refreshLayout);
 	    }, {
 	      immediate: true
@@ -40139,7 +40156,7 @@
 	      isUnMount = true;
 	      unbindEvents();
 	    });
-	    expose({
+	    const exposed = {
 	      bodyXWrapper,
 	      bodyYWrapper,
 	      tableId,
@@ -40161,8 +40178,12 @@
 	      isReady,
 	      hoverState,
 	      renderExpanded,
-	      hiddenColumns
-	    });
+	      hiddenColumns,
+	      props,
+	      emit
+	    };
+	    expose(exposed);
+	    vue.provide('vc-table', exposed);
 	    return () => {
 	      return vue.createVNode("div", {
 	        "class": [classes.value, tableId, 'vc-table'],
@@ -40349,10 +40370,11 @@
 	      column,
 	      store,
 	      rowIndex,
-	      level
+	      level,
+	      selected
 	    }) {
 	      return vue.withDirectives(vue.createVNode(Checkbox, {
-	        "modelValue": store.isSelected(row),
+	        "modelValue": selected,
 	        "disabled": column.selectable ? !column.selectable.call(null, row, rowIndex) : false,
 	        "onChange": () => store.rowSelectedChanged(row),
 	        "onClick": e => e.stopPropagation()
@@ -40525,15 +40547,14 @@
 	    tooltip: [String, Function]
 	  },
 	  setup(props, {
-	    slots,
-	    expose
+	    slots
 	  }) {
 	    const instance = vue.getCurrentInstance();
-	    const table = getInstance$1('table', 'tableId');
-	    const parent = getInstance$1('table-column', 'columnId') || table;
+	    const table = vue.inject('vc-table');
+	    const parent = vue.inject('vc-table-column', table);
 	    const isSubColumn = table !== parent; // 用于多久表头
 
-	    const columnId = vue.ref((parent.exposed.tableId || parent.exposed.columnId) + getUid('column'));
+	    const columnId = vue.ref((parent.tableId || parent.columnId) + getUid('column'));
 	    const realWidth = vue.computed(() => {
 	      return parseWidth(props.width);
 	    });
@@ -40632,7 +40653,7 @@
 	        column.renderCell = data => vue.createVNode("div", {
 	          "class": "vc-table__cell"
 	        }, [originRenderCell(data)]);
-	        table.exposed.renderExpanded.value = data => {
+	        table.renderExpanded.value = data => {
 	          return slots.default ? slots.default(data) : slots.default;
 	        };
 	      } else {
@@ -40651,7 +40672,7 @@
 	            style: {}
 	          };
 	          // 存在树形数组，且当前行无箭头图标且处于当前展开列，表格对齐
-	          if (!isEmpty$1(table.exposed.store.states.treeData) && !prefix && data.isExpandColumn) {
+	          if (!isEmpty$1(table.store.states.treeData) && !prefix && data.isExpandColumn) {
 	            prefix = vue.createVNode("span", {
 	              "class": "vc-table-un-expand__indent"
 	            }, null);
@@ -40694,15 +40715,15 @@
 
 	      // 影响布局
 	      vue.watch(() => props.fixed, () => {
-	        table.exposed.store.scheduleLayout(true);
+	        table.store.scheduleLayout(true);
 	      });
 	      vue.watch(() => realWidth.value, v => {
 	        columnConfig['width'] = v;
 	        columnConfig['realWidth'] = v;
-	        table.exposed.store.scheduleLayout(false);
+	        table.store.scheduleLayout(false);
 	      });
 	      vue.watch(() => realMinWidth.value, () => {
-	        table.exposed.store.scheduleLayout(false);
+	        table.store.scheduleLayout(false);
 	      });
 	    };
 	    vue.onBeforeMount(() => {
@@ -40710,17 +40731,17 @@
 	      registerWatchers();
 	    });
 	    vue.onMounted(() => {
-	      const children = isSubColumn ? parent.vnode.el.children : parent.exposed.hiddenColumns.value.children;
+	      const children = isSubColumn ? parent.vnode.el.children : parent.hiddenColumns.value.children;
 
 	      // DOM上
 	      const columnIndex = [...children].indexOf(instance.vnode.el);
-	      table.exposed.store.insertColumn(columnConfig, columnIndex, isSubColumn && parent.exposed.columnConfig);
+	      table.store.insertColumn(columnConfig, columnIndex, isSubColumn && parent.columnConfig);
 	    });
 	    vue.onUnmounted(() => {
 	      if (!instance.parent) return;
-	      table.exposed.store.removeColumn(columnConfig, isSubColumn && parent.exposed.columnConfig);
+	      table.store.removeColumn(columnConfig, isSubColumn && parent.columnConfig);
 	    });
-	    expose({
+	    vue.provide('vc-table-column', {
 	      columnId,
 	      columnConfig
 	    });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deot/vc-components",
-  "version": "1.0.12",
+  "version": "1.0.13",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",