vue2-components-plus 1.0.68 → 1.0.70

package/dist/vue2-components-plus.js

@@ -290,15 +290,15 @@ function registerDirective(Vue2) {
   Vue2.directive("enterClick", enterClickDirective);
   Vue2.directive("enter-click", enterClickDirective);
 }
-let ThemeVar$1 = class ThemeVar {
-};
-ThemeVar$1.VARS = {};
-function loadCssVars$1() {
+class ThemeVar {
+}
+ThemeVar.VARS = {};
+function loadCssVars() {
   if (typeof document === "undefined") {
-    return ThemeVar$1.VARS;
+    return ThemeVar.VARS;
   }
-  if (Object.keys(ThemeVar$1.VARS).length > 0) {
-    return ThemeVar$1.VARS;
+  if (Object.keys(ThemeVar.VARS).length > 0) {
+    return ThemeVar.VARS;
   }
   const variables = {};
   Array.from(document.styleSheets || []).forEach((sheet) => {
@@ -317,7 +317,7 @@ function loadCssVars$1() {
       });
     });
   });
-  ThemeVar$1.VARS = variables;
+  ThemeVar.VARS = variables;
   return variables;
 }
 function toKebabCase$1(value) {
@@ -1060,37 +1060,7 @@ var __component__$5 = /* @__PURE__ */ normalizeComponent(
   null
 );
 const NsForm = __component__$5.exports;
-class ThemeVar2 {
-}
-ThemeVar2.VARS = {};
-function loadCssVars() {
-  if (typeof document === "undefined") {
-    return ThemeVar2.VARS;
-  }
-  if (Object.keys(ThemeVar2.VARS).length > 0) {
-    return ThemeVar2.VARS;
-  }
-  const variables = {};
-  Array.from(document.styleSheets || []).forEach((sheet) => {
-    let cssRules = [];
-    try {
-      cssRules = Array.from(sheet.cssRules || []);
-    } catch (error) {
-      cssRules = [];
-    }
-    cssRules.forEach((rule) => {
-      if (rule.selectorText !== ":root") {
-        return;
-      }
-      Array.from(rule.style || []).filter((name) => name.indexOf("--matrix-") === 0).forEach((name) => {
-        variables[name] = rule.style.getPropertyValue(name).trim();
-      });
-    });
-  });
-  ThemeVar2.VARS = variables;
-  return variables;
-}
-const DynamicFormTitle_vue_vue_type_style_index_0_scoped_29c80ec1_lang = "";
+const DynamicFormTitle_vue_vue_type_style_index_0_scoped_5d766a25_lang = "";
 const _sfc_main$4 = {
   name: "NsFormTitle",
   props: {
@@ -1116,7 +1086,7 @@ var __component__$4 = /* @__PURE__ */ normalizeComponent(
   _sfc_staticRenderFns$4,
   false,
   null,
-  "29c80ec1",
+  "5d766a25",
   null,
   null
 );
@@ -1530,8 +1500,175 @@ const RESERVED_KEYS = [
   "imageHeight",
   "linkText"
 ];
+function getColumnProps(column) {
+  const props = __spreadValues({}, column);
+  RESERVED_KEYS.forEach((key) => delete props[key]);
+  return props;
+}
+function getRenderer(slotRenderers, name) {
+  return name ? slotRenderers[name] : null;
+}
+function getCellValue(row, column) {
+  return column.prop ? row[column.prop] : void 0;
+}
+function isVisible(config, row) {
+  if (typeof config.show === "function") {
+    return config.show(row) !== false;
+  }
+  if (config.show === void 0) {
+    return true;
+  }
+  return !!config.show;
+}
+function isDisabled(config, row) {
+  return typeof config.disabled === "function" ? !!config.disabled(row) : !!config.disabled;
+}
+function emit(listeners, name, ...args) {
+  const handler = listeners && listeners[name];
+  if (!handler) {
+    return;
+  }
+  if (Array.isArray(handler)) {
+    handler.forEach((fn) => typeof fn === "function" && fn(...args));
+    return;
+  }
+  if (typeof handler === "function") {
+    handler(...args);
+  }
+}
+function resolveEnumText(column, value) {
+  const enumList = column.enum || column.options || [];
+  if (!Array.isArray(enumList)) {
+    return value;
+  }
+  const matched = enumList.find((item) => item.value === value);
+  return matched ? matched.label : value;
+}
+function renderActionButtons(h, scope, column, slotRenderers, listeners) {
+  const buttons = Array.isArray(column.buttons) ? column.buttons : [];
+  return buttons.filter((button) => isVisible(button, scope.row)).map((button, index2) => {
+    const slotRenderer = getRenderer(slotRenderers, button.slot);
+    if (slotRenderer) {
+      return slotRenderer(__spreadProps(__spreadValues({}, scope), { row: scope.row, column, button }));
+    }
+    return h(
+      "el-button",
+      {
+        key: button.label || index2,
+        props: {
+          size: button.size || "mini",
+          type: button.link ? "text" : button.type || "text",
+          icon: typeof button.icon === "string" ? button.icon : void 0,
+          disabled: isDisabled(button, scope.row)
+        },
+        on: {
+          click: () => {
+            if (typeof button.handler === "function") {
+              button.handler(scope.row, scope.$index);
+            }
+            emit(listeners, "button-click", scope.row, column, button);
+          }
+        }
+      },
+      [button.label]
+    );
+  });
+}
+function renderTag(h, scope, column) {
+  const cellValue = getCellValue(scope.row, column);
+  const tagType = typeof column.tagType === "function" ? column.tagType(scope.row, cellValue) : column.tagType;
+  const text = typeof column.formatter === "function" ? column.formatter(scope.row, column, cellValue) : resolveEnumText(column, cellValue);
+  return h("el-tag", { props: { type: tagType || "info", size: column.tagSize || "small" } }, [text]);
+}
+function renderImage(h, scope, column) {
+  const src = getCellValue(scope.row, column);
+  if (!src) {
+    return "-";
+  }
+  return h("img", {
+    style: {
+      width: column.imageWidth || "40px",
+      height: column.imageHeight || "40px",
+      objectFit: "cover",
+      borderRadius: "4px"
+    },
+    attrs: {
+      src,
+      alt: column.label || "image"
+    }
+  });
+}
+function renderLink(h, scope, column, slotRenderers, listeners) {
+  const renderer = getRenderer(slotRenderers, column.slot);
+  if (renderer) {
+    return renderer(scope);
+  }
+  const cellValue = getCellValue(scope.row, column);
+  return h(
+    "el-button",
+    {
+      props: {
+        type: "text"
+      },
+      on: {
+        click: () => emit(listeners, "link-click", scope.row, column)
+      }
+    },
+    [column.linkText || cellValue || "-"]
+  );
+}
+function renderDefaultCell(h, scope, column, slotRenderers, listeners) {
+  const renderer = getRenderer(slotRenderers, column.slot);
+  if (renderer) {
+    return renderer(scope);
+  }
+  if (column.type === "action") {
+    return h("div", { class: "ns-table-column__actions" }, renderActionButtons(h, scope, column, slotRenderers, listeners));
+  }
+  if (column.type === "tag") {
+    return renderTag(h, scope, column);
+  }
+  if (column.type === "image") {
+    return renderImage(h, scope, column);
+  }
+  if (column.type === "link") {
+    return renderLink(h, scope, column, slotRenderers, listeners);
+  }
+  const cellValue = getCellValue(scope.row, column);
+  if (typeof column.formatter === "function") {
+    return column.formatter(scope.row, column, cellValue);
+  }
+  if (column.enum) {
+    return resolveEnumText(column, cellValue);
+  }
+  return cellValue === void 0 || cellValue === null || cellValue === "" ? "-" : cellValue;
+}
+function renderColumn(h, column, slotRenderers, listeners) {
+  const children = Array.isArray(column.children) ? column.children.map(
+    (child, index2) => h(TableColumn, {
+      key: child.prop || child.label || index2,
+      props: {
+        column: child,
+        slotRenderers
+      },
+      on: listeners
+    })
+  ) : [];
+  const headerRenderer = getRenderer(slotRenderers, column.headerSlot);
+  return h(
+    "el-table-column",
+    {
+      props: getColumnProps(column),
+      scopedSlots: children.length ? headerRenderer ? { header: headerRenderer } : void 0 : __spreadValues({
+        default: (scope) => renderDefaultCell(h, scope, column, slotRenderers, listeners)
+      }, headerRenderer ? { header: headerRenderer } : {})
+    },
+    children
+  );
+}
 const TableColumn = {
   name: "NsTableColumn",
+  functional: true,
   props: {
     column: {
       type: Object,
@@ -1542,166 +1679,8 @@ const TableColumn = {
       default: () => ({})
     }
   },
-  methods: {
-    getColumnProps(column) {
-      const props = __spreadValues({}, column);
-      RESERVED_KEYS.forEach((key) => delete props[key]);
-      return props;
-    },
-    getRenderer(name) {
-      return name ? this.slotRenderers[name] : null;
-    },
-    getCellValue(row, column) {
-      return column.prop ? row[column.prop] : void 0;
-    },
-    isVisible(config, row) {
-      if (typeof config.show === "function") {
-        return config.show(row) !== false;
-      }
-      if (config.show === void 0) {
-        return true;
-      }
-      return !!config.show;
-    },
-    isDisabled(config, row) {
-      return typeof config.disabled === "function" ? !!config.disabled(row) : !!config.disabled;
-    },
-    renderActionButtons(h, scope, column) {
-      const buttons = Array.isArray(column.buttons) ? column.buttons : [];
-      return buttons.filter((button) => this.isVisible(button, scope.row)).map((button, index2) => {
-        const slotRenderer = this.getRenderer(button.slot);
-        if (slotRenderer) {
-          return slotRenderer(__spreadProps(__spreadValues({}, scope), { row: scope.row, column, button }));
-        }
-        return h(
-          "el-button",
-          {
-            key: button.label || index2,
-            props: {
-              size: button.size || "mini",
-              type: button.link ? "text" : button.type || "text",
-              icon: typeof button.icon === "string" ? button.icon : void 0,
-              disabled: this.isDisabled(button, scope.row)
-            },
-            on: {
-              click: () => {
-                if (typeof button.handler === "function") {
-                  button.handler(scope.row, scope.$index);
-                }
-                this.$emit("button-click", scope.row, column, button);
-              }
-            }
-          },
-          [button.label]
-        );
-      });
-    },
-    renderTag(h, scope, column) {
-      const cellValue = this.getCellValue(scope.row, column);
-      const tagType = typeof column.tagType === "function" ? column.tagType(scope.row, cellValue) : column.tagType;
-      const text = typeof column.formatter === "function" ? column.formatter(scope.row, column, cellValue) : this.resolveEnumText(column, cellValue);
-      return h("el-tag", { props: { type: tagType || "info", size: column.tagSize || "small" } }, [text]);
-    },
-    renderImage(h, scope, column) {
-      const src = this.getCellValue(scope.row, column);
-      if (!src) {
-        return "-";
-      }
-      return h("img", {
-        style: {
-          width: column.imageWidth || "40px",
-          height: column.imageHeight || "40px",
-          objectFit: "cover",
-          borderRadius: "4px"
-        },
-        attrs: {
-          src,
-          alt: column.label || "image"
-        }
-      });
-    },
-    renderLink(h, scope, column) {
-      const renderer = this.getRenderer(column.slot);
-      if (renderer) {
-        return renderer(scope);
-      }
-      const cellValue = this.getCellValue(scope.row, column);
-      return h(
-        "el-button",
-        {
-          props: {
-            type: "text"
-          },
-          on: {
-            click: () => this.$emit("link-click", scope.row, column)
-          }
-        },
-        [column.linkText || cellValue || "-"]
-      );
-    },
-    resolveEnumText(column, value) {
-      const enumList = column.enum || column.options || [];
-      if (!Array.isArray(enumList)) {
-        return value;
-      }
-      const matched = enumList.find((item) => item.value === value);
-      return matched ? matched.label : value;
-    },
-    renderDefaultCell(h, scope, column) {
-      const renderer = this.getRenderer(column.slot);
-      if (renderer) {
-        return renderer(scope);
-      }
-      if (column.type === "action") {
-        return h("div", { class: "ns-table-column__actions" }, this.renderActionButtons(h, scope, column));
-      }
-      if (column.type === "tag") {
-        return this.renderTag(h, scope, column);
-      }
-      if (column.type === "image") {
-        return this.renderImage(h, scope, column);
-      }
-      if (column.type === "link") {
-        return this.renderLink(h, scope, column);
-      }
-      const cellValue = this.getCellValue(scope.row, column);
-      if (typeof column.formatter === "function") {
-        return column.formatter(scope.row, column, cellValue);
-      }
-      if (column.enum) {
-        return this.resolveEnumText(column, cellValue);
-      }
-      return cellValue === void 0 || cellValue === null || cellValue === "" ? "-" : cellValue;
-    },
-    renderColumn(h, column) {
-      const children = Array.isArray(column.children) ? column.children.map(
-        (child, index2) => h(TableColumn, {
-          key: child.prop || child.label || index2,
-          props: {
-            column: child,
-            slotRenderers: this.slotRenderers
-          },
-          on: {
-            "link-click": (...args) => this.$emit("link-click", ...args),
-            "button-click": (...args) => this.$emit("button-click", ...args)
-          }
-        })
-      ) : [];
-      const headerRenderer = this.getRenderer(column.headerSlot);
-      return h(
-        "el-table-column",
-        {
-          props: this.getColumnProps(column),
-          scopedSlots: children.length ? headerRenderer ? { header: headerRenderer } : void 0 : __spreadValues({
-            default: (scope) => this.renderDefaultCell(h, scope, column)
-          }, headerRenderer ? { header: headerRenderer } : {})
-        },
-        children
-      );
-    }
-  },
-  render(h) {
-    return this.renderColumn(h, this.column);
+  render(h, ctx) {
+    return renderColumn(h, ctx.props.column, ctx.props.slotRenderers || {}, ctx.listeners || {});
   }
 };
 const TableColumn$1 = TableColumn;
@@ -1732,7 +1711,7 @@ function resetPagination(pagination) {
   pagination.pageSize = 10;
   return pagination;
 }
-const PageTable_vue_vue_type_style_index_0_scoped_9ad56349_lang = "";
+const PageTable_vue_vue_type_style_index_0_scoped_31eeea22_lang = "";
 const RESERVED_LISTENERS = ["add", "selection-change", "sort-change", "row-click", "size-change", "current-change", "link-click"];
 const _sfc_main$2 = {
   name: "NsTable",
@@ -1865,7 +1844,9 @@ const _sfc_main$2 = {
   },
   data() {
     return {
-      internalPagination: createPagination()
+      internalPagination: createPagination(),
+      resizeObserver: null,
+      layoutTimer: null
     };
   },
   computed: {
@@ -1884,12 +1865,9 @@ const _sfc_main$2 = {
       return listeners;
     },
     resolvedHeight() {
-      if (this.height !== void 0) {
+      if (this.height !== void 0 && this.height !== null && this.height !== "") {
         return this.height;
       }
-      if (this.autoHeight && this.maxHeight === void 0) {
-        return "100%";
-      }
       return void 0;
     },
     resolvedMaxHeight() {
@@ -1915,9 +1893,63 @@ const _sfc_main$2 = {
         }
       },
       immediate: true
+    },
+    tableData: {
+      handler() {
+        this.scheduleLayout();
+      },
+      deep: true,
+      immediate: true
+    },
+    columns: {
+      handler() {
+        this.scheduleLayout();
+      },
+      deep: true,
+      immediate: true
+    }
+  },
+  mounted() {
+    this.scheduleLayout();
+    this.initResizeObserver();
+  },
+  beforeDestroy() {
+    if (this.resizeObserver) {
+      this.resizeObserver.disconnect();
+      this.resizeObserver = null;
+    }
+    if (this.layoutTimer) {
+      clearTimeout(this.layoutTimer);
+      this.layoutTimer = null;
     }
   },
   methods: {
+    scheduleLayout() {
+      this.$nextTick(() => {
+        this.doLayout();
+        if (this.layoutTimer) {
+          clearTimeout(this.layoutTimer);
+        }
+        this.layoutTimer = setTimeout(() => {
+          this.doLayout();
+          this.layoutTimer = null;
+        }, 50);
+      });
+    },
+    initResizeObserver() {
+      if (typeof ResizeObserver === "undefined") {
+        return;
+      }
+      this.resizeObserver = new ResizeObserver(() => {
+        this.scheduleLayout();
+      });
+      if (this.$el) {
+        this.resizeObserver.observe(this.$el);
+      }
+      if (this.$el && this.$el.parentElement) {
+        this.resizeObserver.observe(this.$el.parentElement);
+      }
+    },
     handleAdd() {
       this.$emit("add");
     },
@@ -2061,7 +2093,7 @@ var __component__$2 = /* @__PURE__ */ normalizeComponent(
   _sfc_staticRenderFns$2,
   false,
   null,
-  "9ad56349",
+  "31eeea22",
   null,
   null
 );
@@ -2649,7 +2681,7 @@ const _sfc_main = {
     }
   },
   mounted() {
-    loadCssVars$1();
+    loadCssVars();
     this.visible = true;
     this.updateModalStyle();
     this.syncDialogInstance();
@@ -3153,7 +3185,7 @@ function install2(Vue2, options = {}) {
     }
   });
   setExternalApp(Vue2, options);
-  loadCssVars$1();
+  loadCssVars();
   if (Vue2 && Vue2.prototype) {
     Vue2.prototype.$NsDialog = NsDialog;
     Vue2.prototype.$closeAllNsDialog = closeAllNsDialog;