gi-component 0.0.54 → 0.0.56

package/dist/index.es.js

@@ -1,4 +1,4 @@
-import { defineComponent, createElementBlock, openBlock, createElementVNode, getCurrentInstance, ref, onMounted, watch, toValue, toRef, nextTick, onUnmounted, useAttrs, computed, createBlock, unref, mergeProps, withCtx, renderSlot, createTextVNode, toDisplayString, useSlots, normalizeClass, createCommentVNode, normalizeStyle, createVNode, createSlots, Fragment, renderList, mergeModels, useModel, resolveDynamicComponent, resolveComponent, h, createApp, onUpdated, inject, toRefs, watchEffect, reactive, provide, onBeforeUnmount, resolveDirective, normalizeProps, guardReactiveProps, withDirectives, useTemplateRef } from "vue";
+import { defineComponent, createElementBlock, openBlock, createElementVNode, getCurrentInstance, ref, onMounted, watch, toValue, toRef, nextTick, onUnmounted, useAttrs, computed, createBlock, unref, mergeProps, withCtx, renderSlot, createTextVNode, toDisplayString, useSlots, normalizeClass, createCommentVNode, normalizeStyle, createVNode, createSlots, Fragment, renderList, mergeModels, useModel, resolveDynamicComponent, resolveComponent, createApp, h, onUpdated, inject, toRefs, watchEffect, reactive, provide, onBeforeUnmount, normalizeProps, guardReactiveProps, useTemplateRef } from "vue";
 import * as El from "element-plus";
 import El__default, { ElButton, ElSpace, ElAvatar, ElDescriptions, ElDescriptionsItem, ElDialog, ElIcon, ElDrawer, ElInput, ElForm, ElTable, ElTableColumn, ElFormItem, ElText, ElMessage, ElSplitter, ElSplitterPanel, ElRow, ElPagination, ElTabs, ElTabPane, ElCheckbox, ElScrollbar, ElTree, ElCheckboxGroup, ElEmpty } from "element-plus";
 /*! Element Plus Icons Vue v2.3.2 */
@@ -702,13 +702,17 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
       print: { btnProps: { icon: printer_default }, btnText: "打印" }
     };
     const bindProps = computed(() => {
-      var _a;
-      const btnProps = ((_a = obj == null ? void 0 : obj[props.type]) == null ? void 0 : _a.btnProps) || { type: props.type };
-      return { ...attrs, ...props, ...btnProps };
+      if (props.type in obj) {
+        const { type: _, ...restProps2 } = props;
+        return { ...attrs, ...restProps2, ...obj[props.type].btnProps };
+      }
+      const { type, ...restProps } = props;
+      return { ...attrs, ...restProps, type };
     });
     const btnText = computed(() => {
-      var _a;
-      return ((_a = obj == null ? void 0 : obj[props.type]) == null ? void 0 : _a.btnText) || "";
+      if (props.type in obj)
+        return obj[props.type].btnText;
+      return "";
     });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(ElButton), mergeProps({
@@ -895,7 +899,7 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Comment = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["__scopeId", "data-v-1c0cf275"]]);
+const Comment = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["__scopeId", "data-v-fd6e787e"]]);
 const _hoisted_1$6 = { key: 2 };
 const _sfc_main$j = /* @__PURE__ */ defineComponent({
   __name: "descriptions",
@@ -1027,13 +1031,13 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
     onBeforeOk: {},
     onCancel: {},
     appendToBody: { type: Boolean },
-    appendTo: {},
+    appendTo: { default: "body" },
     beforeClose: {},
     destroyOnClose: { type: Boolean },
     closeOnClickModal: { type: Boolean, default: true },
     closeOnPressEscape: { type: Boolean },
     lockScroll: { type: Boolean, default: true },
-    modal: { type: Boolean },
+    modal: { type: Boolean, default: true },
     modalPenetrable: { type: Boolean },
     openDelay: {},
     closeDelay: {},
@@ -1236,7 +1240,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const DialogComponent = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-166b4c09"]]);
+const DialogComponent = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-88f7d91e"]]);
 const _hoisted_1$4 = { class: "el-message-box__message" };
 const _sfc_main$h = /* @__PURE__ */ defineComponent({
   __name: "dialog-content",
@@ -1274,27 +1278,42 @@ const DEF_OPTIONS$1 = {
   // footer: true,
   // closeOnClickModal: true
 };
+function buildMessageOptions(type, options) {
+  return {
+    ...options,
+    content: () => h(DialogContent, { type, content: options.content ?? "" }),
+    simple: true,
+    style: { maxWidth: "420px", ...options.style },
+    lockScroll: false
+  };
+}
 function createDialog() {
   const Dialog2 = {
+    /** 主应用上下文，需在 app.use 后赋值：Dialog._context = app._context */
     _context: {},
-    // 核心创建方法
+    /** 核心创建方法 */
     create(options) {
       const mergedOptions = { ...DEF_OPTIONS$1, ...options };
       const container = document.createElement("div");
       document.body.appendChild(container);
       const visible = ref(true);
-      const dialogOptions = ref(mergedOptions || {});
-      const dialogApp = createApp({
+      const dialogOptions = ref({ ...mergedOptions });
+      let destroyed = false;
+      let dialogApp;
+      const destroy = () => {
+        if (destroyed)
+          return;
+        destroyed = true;
+        dialogApp.unmount();
+        container.remove();
+      };
+      dialogApp = createApp({
         setup() {
-          const closed = () => {
-            dialogApp.unmount();
-            container.remove();
-          };
           return () => h(DialogComponent, {
             ...dialogOptions.value,
             "modelValue": visible.value,
             "onUpdate:modelValue": (val) => visible.value = val,
-            "onClosed": () => closed()
+            "onClosed": destroy
           });
         }
       });
@@ -1302,59 +1321,36 @@ function createDialog() {
       Object.assign(dialogApp._context, Dialog2._context);
       dialogApp.mount(container);
       return {
-        /** 关闭对话框 */
+        /** 关闭对话框，等待关闭动画结束后由 onClosed 触发销毁 */
         close: () => {
           visible.value = false;
-          setTimeout(() => {
-            dialogApp.unmount();
-            container.remove();
-          }, 300);
         },
-        /** 更新对话框 */
+        /** 动态更新对话框 props */
         update: (newProps) => {
-          dialogOptions.value = { ...dialogOptions.value, ...newProps };
+          if (newProps)
+            dialogOptions.value = { ...dialogOptions.value, ...newProps };
         }
       };
     },
-    /** 对话框-打开 */
+    /** 打开对话框 */
     open(options) {
       return this.create(options);
     },
+    /** 信息提示框 */
     info(options) {
-      return this.create({
-        ...options,
-        content: () => h(DialogContent, { type: "info", content: options.content }),
-        simple: true,
-        style: { maxWidth: "420px", ...options.style },
-        lockScroll: false
-      });
+      return this.create(buildMessageOptions("info", options));
     },
+    /** 成功提示框 */
     success(options) {
-      return this.create({
-        ...options,
-        content: () => h(DialogContent, { type: "success", content: options.content }),
-        simple: true,
-        style: { maxWidth: "420px", ...options.style },
-        lockScroll: false
-      });
+      return this.create(buildMessageOptions("success", options));
     },
+    /** 警告提示框 */
     warning(options) {
-      return this.create({
-        ...options,
-        content: () => h(DialogContent, { type: "warning", content: options.content }),
-        simple: true,
-        style: { maxWidth: "420px", ...options.style },
-        lockScroll: false
-      });
+      return this.create(buildMessageOptions("warning", options));
     },
+    /** 错误提示框 */
     error(options) {
-      return this.create({
-        ...options,
-        content: () => h(DialogContent, { type: "error", content: options.content }),
-        simple: true,
-        style: { maxWidth: "420px", ...options.style },
-        lockScroll: false
-      });
+      return this.create(buildMessageOptions("error", options));
     }
   };
   return Dialog2;
@@ -1605,25 +1601,31 @@ const Drawer$1 = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v
 const DEF_OPTIONS = {};
 function createDrawer() {
   const Drawer2 = {
+    /** 主应用上下文，需在 app.use 后赋值：Drawer._context = app._context */
     _context: {},
-    // 核心创建方法
+    /** 核心创建方法 */
     create(options) {
       const mergedOptions = { ...DEF_OPTIONS, ...options };
       const container = document.createElement("div");
       document.body.appendChild(container);
       const visible = ref(true);
-      const dialogOptions = ref(mergedOptions || {});
-      const drawerApp = createApp({
+      const drawerOptions = ref({ ...mergedOptions });
+      let destroyed = false;
+      let drawerApp;
+      const destroy = () => {
+        if (destroyed)
+          return;
+        destroyed = true;
+        drawerApp.unmount();
+        container.remove();
+      };
+      drawerApp = createApp({
         setup() {
-          const closed = () => {
-            drawerApp.unmount();
-            container.remove();
-          };
           return () => h(Drawer$1, {
-            ...dialogOptions.value,
+            ...drawerOptions.value,
             "modelValue": visible.value,
             "onUpdate:modelValue": (val) => visible.value = val,
-            "onClosed": () => closed()
+            "onClosed": destroy
           });
         }
       });
@@ -1631,21 +1633,18 @@ function createDrawer() {
       Object.assign(drawerApp._context, Drawer2._context);
       drawerApp.mount(container);
       return {
-        /** 关闭抽屉 */
+        /** 关闭抽屉，等待关闭动画结束后由 onClosed 触发销毁 */
         close: () => {
           visible.value = false;
-          setTimeout(() => {
-            drawerApp.unmount();
-            container.remove();
-          }, 300);
         },
-        /** 更新抽屉 */
+        /** 动态更新抽屉 props */
         update: (newProps) => {
-          dialogOptions.value = { ...dialogOptions.value, ...newProps };
+          if (newProps)
+            drawerOptions.value = { ...drawerOptions.value, ...newProps };
         }
       };
     },
-    /** 抽屉-打开 */
+    /** 打开抽屉 */
     open(options) {
       return this.create(options);
     }
@@ -1726,15 +1725,85 @@ const clearable = false;
 const _sfc_main$c = /* @__PURE__ */ defineComponent({
   __name: "edit-table",
   props: {
-    rowKey: { default: "id" },
-    data: { default: () => [] },
     columns: { default: () => [] },
-    cellDisabled: {}
+    cellDisabled: { type: [Boolean, Function] },
+    disabled: { type: Boolean },
+    data: { default: () => [] },
+    height: {},
+    maxHeight: {},
+    stripe: { type: Boolean },
+    border: { type: Boolean, default: true },
+    size: {},
+    fit: { type: Boolean },
+    showHeader: { type: Boolean, default: true },
+    highlightCurrentRow: { type: Boolean },
+    currentRowKey: {},
+    rowClassName: {},
+    rowStyle: {},
+    cellClassName: {},
+    cellStyle: {},
+    headerRowClassName: {},
+    headerRowStyle: {},
+    headerCellClassName: {},
+    headerCellStyle: {},
+    rowKey: { type: [String, Function], default: "id" },
+    emptyText: {},
+    defaultExpandAll: { type: Boolean },
+    expandRowKeys: {},
+    defaultSort: {},
+    tooltipEffect: {},
+    tooltipOptions: {},
+    appendFilterPanelTo: {},
+    showSummary: { type: Boolean },
+    sumText: {},
+    summaryMethod: {},
+    spanMethod: {},
+    selectOnIndeterminate: { type: Boolean },
+    indent: {},
+    lazy: { type: Boolean },
+    load: {},
+    treeProps: {},
+    tableLayout: {},
+    scrollbarAlwaysOn: { type: Boolean },
+    showOverflowTooltip: { type: [Boolean, Object] },
+    flexible: { type: Boolean },
+    scrollbarTabindex: {},
+    allowDragLastColumn: { type: Boolean },
+    tooltipFormatter: {},
+    preserveExpandedContent: { type: Boolean },
+    nativeScrollbar: { type: Boolean },
+    rowExpandable: {},
+    onSelect: {},
+    onSelectAll: {},
+    onSelectionChange: {},
+    onCellMouseEnter: {},
+    onCellMouseLeave: {},
+    onCellClick: {},
+    onCellDblclick: {},
+    onCellContextmenu: {},
+    onRowClick: {},
+    onRowContextmenu: {},
+    onRowDblclick: {},
+    onHeaderClick: {},
+    onHeaderContextmenu: {},
+    onSortChange: {},
+    onFilterChange: {},
+    onCurrentChange: {},
+    onHeaderDragend: {},
+    onExpandChange: {},
+    onScroll: {}
   },
   setup(__props, { expose: __expose }) {
     const props = __props;
     const attrs = useAttrs();
     const { b } = useBemClass();
+    const tableProps = computed(() => {
+      const { data, columns, cellDisabled, disabled, ...restProps } = props;
+      return {
+        ...attrs,
+        ...restProps
+      };
+    });
     const COMP_MAP = {
       "input": El.ElInput,
       "textarea": El.ElInput,
@@ -1854,13 +1923,14 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
         ref_key: "formRef",
         ref: formRef,
         model: form.value,
-        class: normalizeClass(unref(b)("edit-table"))
+        class: normalizeClass(unref(b)("edit-table")),
+        disabled: props.disabled
       }, {
         default: withCtx(() => [
           createVNode(unref(ElTable), mergeProps({
             data: form.value.tableData,
             border: ""
-          }, unref(attrs)), {
+          }, tableProps.value), createSlots({
             default: withCtx(() => [
               (openBlock(true), createElementBlock(Fragment, null, renderList(props.columns, (column, index2) => {
                 return openBlock(), createBlock(unref(ElTableColumn), mergeProps({
@@ -1900,15 +1970,30 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
                 }, 1040, ["width", "prop", "label", "label-class-name"]);
               }), 128))
             ]),
-            _: 3
-          }, 16, ["data"])
+            _: 2
+          }, [
+            _ctx.$slots.append ? {
+              name: "append",
+              fn: withCtx(() => [
+                renderSlot(_ctx.$slots, "append", {}, void 0, true)
+              ]),
+              key: "0"
+            } : void 0,
+            _ctx.$slots.empty ? {
+              name: "empty",
+              fn: withCtx(() => [
+                renderSlot(_ctx.$slots, "empty", {}, void 0, true)
+              ]),
+              key: "1"
+            } : void 0
+          ]), 1040, ["data"])
         ]),
         _: 3
-      }, 8, ["model", "class"]);
+      }, 8, ["model", "class", "disabled"]);
     };
   }
 });
-const EditTable = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["__scopeId", "data-v-b88099ba"]]);
+const _EditTable = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["__scopeId", "data-v-01bf53e6"]]);
 const _sfc_main$b = /* @__PURE__ */ defineComponent({
   __name: "flex",
   props: {
@@ -1924,16 +2009,19 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
   setup(__props) {
     const props = __props;
     const { b } = useBemClass();
+    const GAP_SIZE = ["small", "middle", "large"];
     const classNames = computed(() => {
-      const arr = [b("flex"), b(`flex__size--${props.gap}`)];
+      const arr = [b("flex")];
+      if (GAP_SIZE.includes(props.gap)) {
+        arr.push(b(`flex__size--${props.gap}`));
+      }
       if (props.full) {
         arr.push(b("flex--full"));
       }
       return arr;
     });
-    const SIZE_MAP = ["small", "middle", "large"];
     const resolvedGap = computed(() => {
-      if (props.gap === void 0 || props.gap === null || props.gap === "" || SIZE_MAP.includes(props.gap))
+      if (props.gap === void 0 || props.gap === null || props.gap === "" || GAP_SIZE.includes(props.gap))
         return void 0;
       if (typeof props.gap === "number")
         return `${props.gap}px`;
@@ -1972,7 +2060,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Flex = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-a3b9636f"]]);
+const Flex = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-6652f5ee"]]);
 const GridContextInjectionKey = Symbol(
   "GridContextInjectionKey"
 );
@@ -2460,7 +2548,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     renderSlot(_ctx.$slots, "default", {}, void 0, true)
   ], 6);
 }
-const Grid = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["render", _sfc_render], ["__scopeId", "data-v-6eabaf75"]]);
+const Grid = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["render", _sfc_render], ["__scopeId", "data-v-f4d52836"]]);
 const _hoisted_1$2 = {
   key: 0,
   class: "w-full"
@@ -3236,6 +3324,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
   }
 });
 const PageLayout = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-0ed9c74a"]]);
+const TABLE_SLOTS_KEY = Symbol("tableSlots");
 const _sfc_main$4 = /* @__PURE__ */ defineComponent({
   ...{
     name: "TableColumn"
@@ -3246,22 +3335,24 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     const props = __props;
+    const tableSlots = inject(TABLE_SLOTS_KEY, useSlots());
+    function renderColumnSlot(slotName, scope) {
+      const slotFn = tableSlots[slotName];
+      return slotFn ? slotFn(scope) : null;
+    }
     const columnProps = computed(() => {
       const { slotName, render, children, ...restProps } = props.column;
       return restProps;
     });
     return (_ctx, _cache) => {
       const _component_TableColumn = resolveComponent("TableColumn", true);
-      const _directive_slots = resolveDirective("slots");
       return openBlock(), createBlock(unref(ElTableColumn), normalizeProps(guardReactiveProps(columnProps.value)), createSlots({
         default: withCtx(() => [
           _ctx.column.children && _ctx.column.children.length > 0 ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(_ctx.column.children, (child) => {
-            return withDirectives((openBlock(), createBlock(_component_TableColumn, {
+            return openBlock(), createBlock(_component_TableColumn, {
               key: child.prop || child.label,
               column: child
-            }, null, 8, ["column"])), [
-              [_directive_slots, _ctx.$slots]
-            ]);
+            }, null, 8, ["column"]);
           }), 128)) : createCommentVNode("", true)
         ]),
         _: 2
@@ -3277,7 +3368,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
         } : _ctx.column.slotName ? {
           name: "default",
           fn: withCtx((scope) => [
-            renderSlot(_ctx.$slots, _ctx.column.slotName, normalizeProps(guardReactiveProps(scope)))
+            (openBlock(), createBlock(resolveDynamicComponent(() => renderColumnSlot(_ctx.column.slotName, scope))))
           ]),
           key: "1"
         } : void 0
@@ -3358,6 +3449,8 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
   setup(__props, { expose: __expose }) {
     const props = __props;
     const attrs = useAttrs();
+    const slots = useSlots();
+    provide(TABLE_SLOTS_KEY, slots);
     const { b } = useBemClass();
     const tableRef = useTemplateRef("tableRef");
     const tableProps = computed(() => {
@@ -3387,26 +3480,32 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
           ref_key: "tableRef",
           ref: tableRef,
           data: props.data
-        }), {
+        }), createSlots({
           default: withCtx(() => [
             (openBlock(true), createElementBlock(Fragment, null, renderList(props.columns, (item) => {
               return openBlock(), createBlock(_sfc_main$4, {
                 key: item.prop || item.label,
                 column: item
-              }, createSlots({ _: 2 }, [
-                renderList(_ctx.$slots, (_, slotName) => {
-                  return {
-                    name: slotName,
-                    fn: withCtx((scope) => [
-                      renderSlot(_ctx.$slots, slotName, mergeProps({ ref_for: true }, scope), void 0, true)
-                    ])
-                  };
-                })
-              ]), 1032, ["column"]);
+              }, null, 8, ["column"]);
             }), 128))
           ]),
-          _: 3
-        }, 16, ["data"]),
+          _: 2
+        }, [
+          _ctx.$slots.append ? {
+            name: "append",
+            fn: withCtx(() => [
+              renderSlot(_ctx.$slots, "append", {}, void 0, true)
+            ]),
+            key: "0"
+          } : void 0,
+          _ctx.$slots.empty ? {
+            name: "empty",
+            fn: withCtx(() => [
+              renderSlot(_ctx.$slots, "empty", {}, void 0, true)
+            ]),
+            key: "1"
+          } : void 0
+        ]), 1040, ["data"]),
         props.pagination !== false ? (openBlock(), createBlock(unref(ElRow), {
           key: 0,
           justify: "end",
@@ -3424,7 +3523,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _Table = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-42ae2dfb"]]);
+const _Table = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-39da9c8f"]]);
 const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   __name: "tabs",
   props: /* @__PURE__ */ mergeModels({
@@ -3499,7 +3598,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Tabs = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-75720764"]]);
+const Tabs = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-f6ea7029"]]);
 const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   __name: "tag",
   props: {
@@ -9382,7 +9481,7 @@ const components = {
   Form: _Form,
   PageLayout,
   Dialog: DialogComponent,
-  EditTable,
+  EditTable: _EditTable,
   Table: _Table,
   Tag,
   TreeTransfer
@@ -9403,7 +9502,7 @@ const GiGridItem = GridItem;
 const GiForm = _Form;
 const GiPageLayout = PageLayout;
 const GiDialog = DialogComponent;
-const GiEditTable = EditTable;
+const GiEditTable = _EditTable;
 const GiTable = _Table;
 const GiTag = Tag;
 const GiTreeTransfer = TreeTransfer;
@@ -9447,6 +9546,7 @@ export {
   GiTreeTransfer,
   Grid,
   GridItem,
+  TABLE_SLOTS_KEY,
   createDialog,
   createDrawer,
   createSelectDialog,