@deot/vc-components 1.0.12 → 1.0.14

package/dist/index.js

@@ -772,7 +772,7 @@ const COMPONENT_NAME$1T = 'vc-alert';
 
 // [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']
@@ -10263,7 +10263,7 @@ const props$z = {
     validator: (v) => /(small|medium|large)/.test(v),
     default: "small"
   },
-  portalClass: [Object, String],
+  contentClass: [Object, String],
   width: {
     type: Number
   },
@@ -10312,6 +10312,10 @@ const props$z = {
     type: Boolean,
     default: true
   },
+  border: {
+    type: Boolean,
+    default: false
+  },
   /**
    * 兼容portal设计, 实现Promise方式
    */
@@ -10609,7 +10613,8 @@ const ModalView = /* @__PURE__ */ defineComponent({
           "class": [{
             'is-drag': props.draggable,
             'is-large': props.size === 'large' || props.size === 'medium',
-            'is-no-footer': !props.footer || !props.cancelText && !props.okText
+            'has-footer': props.footer && (props.cancelText || props.okText),
+            'has-border': props.border
           }, 'vc-modal__container'],
           "style": [basicStyle.value, draggableStyle.value]
         }, [createVNode("div", {
@@ -10641,7 +10646,7 @@ const ModalView = /* @__PURE__ */ defineComponent({
               "height": isTransitionEnd.value ? row.height : void 0,
               "contentClass": [{
                 'is-confirm': props.mode
-              }, props.portalClass, 'vc-modal__content']
+              }, props.contentClass, 'vc-modal__content']
             }, {
               default: () => [typeof props.content === 'string' ? createVNode("div", {
                 "innerHTML": props.content
@@ -12122,7 +12127,7 @@ const props$m = {
   color: {
     type: [Object, String],
     default: () => ({
-      normal: "#5495f6",
+      normal: "#2B72FD",
       success: "#52c41a",
       error: "#f5222d"
     })
@@ -13362,6 +13367,8 @@ const RecycleList = /* @__PURE__ */ defineComponent({
       });
       if (!originalData.length) {
         rebuildData.value = [];
+      } else {
+        rebuildData.value = originalData.slice();
       }
       offsetPageSize.value = 0;
       await refreshLayout(0, originalData.length);
@@ -14504,17 +14511,24 @@ class Store extends BaseWatcher {
     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 || ""
             }
           }
         ],
@@ -14522,6 +14536,7 @@ class Store extends BaseWatcher {
       });
       return pre;
     }, []);
+    caches.clear();
     this.current.update();
     this.expand.update();
     if (!this.states.reserveSelection) {
@@ -14655,12 +14670,12 @@ class Store extends BaseWatcher {
    */
   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(selectedMap, key) && !dataMap[key]) {
           deleted.push(selectedMap[key].row);
@@ -14835,8 +14850,10 @@ const COMPONENT_NAME$h = 'vc-table-normal-list';
 const NormalList = /* @__PURE__ */ defineComponent({
   name: COMPONENT_NAME$h,
   props: {
-    data: Array,
-    default: () => []
+    data: {
+      type: Array,
+      default: () => []
+    }
   },
   emits: ['row-resize'],
   setup(props, {
@@ -14878,7 +14895,7 @@ const TableBody = /* @__PURE__ */ defineComponent({
     expose
   }) {
     const instance = getCurrentInstance();
-    const table = getInstance('table', 'tableId');
+    const table = inject('vc-table');
     const states = useStates({
       data: 'data',
       list: 'list',
@@ -15002,7 +15019,7 @@ const TableBody = /* @__PURE__ */ defineComponent({
           column,
           row
         };
-        table.exposed.hoverState.value = hoverState;
+        table.hoverState.value = hoverState;
         table.emit('cell-mouse-enter', hoverState.row, hoverState.column, hoverState.cell, e);
       }
 
@@ -15035,7 +15052,7 @@ const TableBody = /* @__PURE__ */ defineComponent({
     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(index => {
@@ -15073,6 +15090,7 @@ const TableBody = /* @__PURE__ */ defineComponent({
         columns
       } = states;
       const key = getValueOfRow(row, rowIndex);
+      const selected = props.store.isSelected(row);
       return createVNode("div", {
         "key": key,
         "class": [getRowClass(row, rowIndex), 'vc-table__tr'],
@@ -15093,10 +15111,12 @@ const TableBody = /* @__PURE__ */ defineComponent({
         };
         if (columnsHidden.value[columnIndex]) {
           return createVNode("div", {
+            "key": column.id,
             "style": [sizeStyle]
           }, null);
         }
         return 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),
@@ -15106,7 +15126,8 @@ const TableBody = /* @__PURE__ */ defineComponent({
           column,
           rowIndex,
           columnIndex,
-          store: props.store
+          store: props.store,
+          selected
         })]);
       })]);
     };
@@ -15140,7 +15161,7 @@ const TableBody = /* @__PURE__ */ defineComponent({
       wrapper,
       getRootElement: () => instance.vnode.el
     });
-    const layout = table.exposed.layout;
+    const layout = table.layout;
     return () => {
       return createVNode("div", {
         "class": "vc-table__body"
@@ -15150,7 +15171,7 @@ const TableBody = /* @__PURE__ */ defineComponent({
         "disabled": true,
         "class": "vc-table__tbody",
         "scrollerOptions": {
-          barTo: `.${table.exposed.tableId}`,
+          barTo: `.${table.tableId}`,
           native: false,
           always: false,
           showBar: !props.fixed,
@@ -15202,7 +15223,7 @@ const TableHeader = /* @__PURE__ */ defineComponent({
     }
   },
   setup(props) {
-    const table = getInstance('table', 'tableId');
+    const table = inject('vc-table');
     const instance = getCurrentInstance();
     const draggingColumn = ref(null);
     const dragging = ref(false);
@@ -15309,7 +15330,7 @@ const TableHeader = /* @__PURE__ */ defineComponent({
       /* 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}`);
@@ -15322,7 +15343,7 @@ const TableHeader = /* @__PURE__ */ defineComponent({
           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;
@@ -15681,7 +15702,8 @@ const Table = /* @__PURE__ */ defineComponent({
   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 = getCurrentInstance();
     const store = new Store({
@@ -15797,7 +15819,8 @@ const Table = /* @__PURE__ */ defineComponent({
           };
         }
         return {
-          height: layout.states.viewportHeight ? layout.states.viewportHeight + 'px' : ''
+          height: layout.states.viewportHeight ? layout.states.viewportHeight + 'px' : '',
+          bottom: 0
         };
       }
     });
@@ -16001,8 +16024,8 @@ const Table = /* @__PURE__ */ defineComponent({
     }, {
       immediate: true
     });
-    watch(() => props.data, v => {
-      store.setData(v);
+    watch(() => [props.data, props.data.length], () => {
+      store.setData(props.data);
       isReady.value && nextTick(refreshLayout);
     }, {
       immediate: true
@@ -16040,7 +16063,7 @@ const Table = /* @__PURE__ */ defineComponent({
       isUnMount = true;
       unbindEvents();
     });
-    expose({
+    const exposed = {
       bodyXWrapper,
       bodyYWrapper,
       tableId,
@@ -16062,8 +16085,12 @@ const Table = /* @__PURE__ */ defineComponent({
       isReady,
       hoverState,
       renderExpanded,
-      hiddenColumns
-    });
+      hiddenColumns,
+      props,
+      emit
+    };
+    expose(exposed);
+    provide('vc-table', exposed);
     return () => {
       return createVNode("div", {
         "class": [classes.value, tableId, 'vc-table'],
@@ -16099,7 +16126,9 @@ const Table = /* @__PURE__ */ defineComponent({
         }, null), props.data.length === 0 && createVNode("div", {
           "ref": emptyBlock,
           "style": bodyWidthStyle.value,
-          "class": "vc-table__empty-block"
+          "class": [{
+            'is-absolute': !!props.height
+          }, 'vc-table__empty-wrapper']
         }, [createVNode("span", {
           "class": "vc-table__empty-text"
         }, [slots.empty ? slots.empty() : props.emptyText || '暂无数据'])]), slots.append && createVNode("div", {
@@ -16250,10 +16279,11 @@ const cellForced = {
       column,
       store,
       rowIndex,
-      level
+      level,
+      selected
     }) {
       return withDirectives(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()
@@ -16426,15 +16456,14 @@ const TableColumn = /* @__PURE__ */ defineComponent({
     tooltip: [String, Function]
   },
   setup(props, {
-    slots,
-    expose
+    slots
   }) {
     const instance = getCurrentInstance();
-    const table = getInstance('table', 'tableId');
-    const parent = getInstance('table-column', 'columnId') || table;
+    const table = inject('vc-table');
+    const parent = inject('vc-table-column', table);
     const isSubColumn = table !== parent; // 用于多久表头
 
-    const columnId = ref((parent.exposed.tableId || parent.exposed.columnId) + getUid('column'));
+    const columnId = ref((parent.tableId || parent.columnId) + getUid('column'));
     const realWidth = computed(() => {
       return parseWidth(props.width);
     });
@@ -16533,7 +16562,7 @@ const TableColumn = /* @__PURE__ */ defineComponent({
         column.renderCell = data => 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 {
@@ -16552,7 +16581,7 @@ const TableColumn = /* @__PURE__ */ defineComponent({
             style: {}
           };
           // 存在树形数组，且当前行无箭头图标且处于当前展开列，表格对齐
-          if (!isEmpty$1(table.exposed.store.states.treeData) && !prefix && data.isExpandColumn) {
+          if (!isEmpty$1(table.store.states.treeData) && !prefix && data.isExpandColumn) {
             prefix = createVNode("span", {
               "class": "vc-table-un-expand__indent"
             }, null);
@@ -16595,15 +16624,15 @@ const TableColumn = /* @__PURE__ */ defineComponent({
 
       // 影响布局
       watch(() => props.fixed, () => {
-        table.exposed.store.scheduleLayout(true);
+        table.store.scheduleLayout(true);
       });
       watch(() => realWidth.value, v => {
         columnConfig['width'] = v;
         columnConfig['realWidth'] = v;
-        table.exposed.store.scheduleLayout(false);
+        table.store.scheduleLayout(false);
       });
       watch(() => realMinWidth.value, () => {
-        table.exposed.store.scheduleLayout(false);
+        table.store.scheduleLayout(false);
       });
     };
     onBeforeMount(() => {
@@ -16611,17 +16640,17 @@ const TableColumn = /* @__PURE__ */ defineComponent({
       registerWatchers();
     });
     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);
     });
     onUnmounted(() => {
       if (!instance.parent) return;
-      table.exposed.store.removeColumn(columnConfig, isSubColumn && parent.exposed.columnConfig);
+      table.store.removeColumn(columnConfig, isSubColumn && parent.columnConfig);
     });
-    expose({
+    provide('vc-table-column', {
       columnId,
       columnConfig
     });
@@ -16862,7 +16891,7 @@ const Tabs = /* @__PURE__ */ defineComponent({
         if (!Array.from(items).length) return;
         let offset = 0;
         if (index > 0) {
-          const gutter = 16; // margin-right -> 16px
+          const gutter = 12; // margin-right -> 12px
           for (let i = 0; i < index; i++) {
             offset += parseFloat(items[i].offsetWidth) + gutter;
           }
@@ -16934,7 +16963,7 @@ const Tabs = /* @__PURE__ */ defineComponent({
       }, [slots.extra?.()]), createVNode("div", {
         "ref": wrapper,
         "style": {
-          padding: tabs.scrollable.value && '0 24px'
+          padding: tabs.scrollable.value ? '0 24px' : 0
         },
         "class": "vc-tabs__bar"
       }, [tabs.scrollable.value && createVNode(Icon, {