gi-component 0.0.52 → 0.0.54

package/dist/index.es.js

@@ -1,6 +1,6 @@
 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 * as El from "element-plus";
-import El__default, { ElButton, ElSpace, ElDescriptions, ElDescriptionsItem, ElDialog, ElDrawer, ElInput, ElForm, ElTable, ElTableColumn, ElFormItem, ElText, ElMessage, ElIcon, ElSplitter, ElSplitterPanel, ElRow, ElPagination, ElTabs, ElTabPane, ElCheckbox, ElScrollbar, ElTree, ElCheckboxGroup, ElEmpty } 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 */
 var _sfc_main6 = /* @__PURE__ */ defineComponent({
   name: "ArrowDown",
@@ -171,6 +171,21 @@ var _sfc_main94 = /* @__PURE__ */ defineComponent({
     ]));
   }
 }), edit_default = _sfc_main94;
+var _sfc_main118 = /* @__PURE__ */ defineComponent({
+  name: "FullScreen",
+  __name: "full-screen",
+  setup(__props) {
+    return (_ctx, _cache) => (openBlock(), createElementBlock("svg", {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 1024 1024"
+    }, [
+      createElementVNode("path", {
+        fill: "currentColor",
+        d: "m160 96.064 192 .192a32 32 0 0 1 0 64l-192-.192V352a32 32 0 0 1-64 0V96h64zm0 831.872V928H96V672a32 32 0 1 1 64 0v191.936l192-.192a32 32 0 1 1 0 64zM864 96.064V96h64v256a32 32 0 1 1-64 0V160.064l-192 .192a32 32 0 1 1 0-64zm0 831.872-192-.192a32 32 0 0 1 0-64l192 .192V672a32 32 0 1 1 64 0v256h-64z"
+      })
+    ]));
+  }
+}), full_screen_default = _sfc_main118;
 var _sfc_main143 = /* @__PURE__ */ defineComponent({
   name: "InfoFilled",
   __name: "info-filled",
@@ -645,7 +660,7 @@ function useNavTabs(options) {
     canScrollRight
   };
 }
-const _sfc_main$l = /* @__PURE__ */ defineComponent({
+const _sfc_main$m = /* @__PURE__ */ defineComponent({
   __name: "button",
   props: {
     type: { default: "" },
@@ -711,7 +726,7 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$k = /* @__PURE__ */ defineComponent({
+const _sfc_main$l = /* @__PURE__ */ defineComponent({
   __name: "card",
   props: {
     title: { default: "" },
@@ -796,7 +811,91 @@ const _export_sfc = (sfc, props) => {
   }
   return target;
 };
-const Card = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["__scopeId", "data-v-4f2bae7b"]]);
+const Card = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["__scopeId", "data-v-4f2bae7b"]]);
+const _sfc_main$k = /* @__PURE__ */ defineComponent({
+  __name: "comment",
+  props: {
+    author: { default: "" },
+    avatar: { default: "" },
+    content: { default: "" },
+    datetime: { default: "" }
+  },
+  setup(__props) {
+    const props = __props;
+    const slots = useSlots();
+    const { b } = useBemClass();
+    const hasAuthor = computed(() => !!slots.author || !!props.author);
+    const hasDatetime = computed(() => !!slots.datetime || !!props.datetime);
+    const hasContent = computed(() => !!slots.content || !!props.content);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(unref(b)("comment"))
+      }, [
+        createElementVNode("div", {
+          class: normalizeClass(unref(b)("comment__inner"))
+        }, [
+          createElementVNode("div", {
+            class: normalizeClass(unref(b)("comment__avatar"))
+          }, [
+            renderSlot(_ctx.$slots, "avatar", {}, () => [
+              props.avatar ? (openBlock(), createBlock(unref(ElAvatar), {
+                key: 0,
+                size: 40,
+                src: props.avatar
+              }, null, 8, ["src"])) : createCommentVNode("", true)
+            ], true)
+          ], 2),
+          createElementVNode("div", {
+            class: normalizeClass(unref(b)("comment__content"))
+          }, [
+            hasAuthor.value || hasDatetime.value ? (openBlock(), createElementBlock("div", {
+              key: 0,
+              class: normalizeClass(unref(b)("comment__content-author"))
+            }, [
+              hasAuthor.value ? (openBlock(), createElementBlock("span", {
+                key: 0,
+                class: normalizeClass(unref(b)("comment__author"))
+              }, [
+                renderSlot(_ctx.$slots, "author", {}, () => [
+                  createTextVNode(toDisplayString(props.author), 1)
+                ], true)
+              ], 2)) : createCommentVNode("", true),
+              hasDatetime.value ? (openBlock(), createElementBlock("span", {
+                key: 1,
+                class: normalizeClass(unref(b)("comment__datetime"))
+              }, [
+                renderSlot(_ctx.$slots, "datetime", {}, () => [
+                  createTextVNode(toDisplayString(props.datetime), 1)
+                ], true)
+              ], 2)) : createCommentVNode("", true)
+            ], 2)) : createCommentVNode("", true),
+            hasContent.value ? (openBlock(), createElementBlock("div", {
+              key: 1,
+              class: normalizeClass(unref(b)("comment__content-detail"))
+            }, [
+              renderSlot(_ctx.$slots, "content", {}, () => [
+                createTextVNode(toDisplayString(props.content), 1)
+              ], true)
+            ], 2)) : createCommentVNode("", true),
+            unref(slots).actions ? (openBlock(), createElementBlock("div", {
+              key: 2,
+              class: normalizeClass(unref(b)("comment__actions"))
+            }, [
+              renderSlot(_ctx.$slots, "actions", {}, void 0, true)
+            ], 2)) : createCommentVNode("", true)
+          ], 2)
+        ], 2),
+        unref(slots).default ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: normalizeClass(unref(b)("comment__nested"))
+        }, [
+          renderSlot(_ctx.$slots, "default", {}, void 0, true)
+        ], 2)) : createCommentVNode("", true)
+      ], 2);
+    };
+  }
+});
+const Comment = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["__scopeId", "data-v-1c0cf275"]]);
 const _hoisted_1$6 = { key: 2 };
 const _sfc_main$j = /* @__PURE__ */ defineComponent({
   __name: "descriptions",
@@ -910,7 +1009,8 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$5 = { key: 0 };
+const _hoisted_1$5 = ["id"];
+const _hoisted_2$2 = { key: 0 };
 const _sfc_main$i = /* @__PURE__ */ defineComponent({
   __name: "dialog",
   props: /* @__PURE__ */ mergeModels({
@@ -922,6 +1022,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
     cancelButtonProps: {},
     style: {},
     simple: { type: Boolean },
+    showFullscreen: { type: Boolean, default: false },
     onOk: {},
     onBeforeOk: {},
     onCancel: {},
@@ -968,6 +1069,14 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
     const visible = useModel(__props, "modelValue");
     const props = __props;
     const { b } = useBemClass();
+    const isFullscreen = ref(false);
+    watch(
+      () => props.fullscreen,
+      (val) => {
+        isFullscreen.value = !!val;
+      },
+      { immediate: true }
+    );
     const getClass = computed(() => {
       const arr = [b("dialog")];
       if (props.simple) {
@@ -987,10 +1096,16 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
         onOk: void 0,
         onBeforeOk: void 0,
         onCancel: void 0,
-        simple: void 0
+        simple: void 0,
+        showFullscreen: void 0,
+        fullscreen: void 0,
+        title: void 0
       };
     });
     const okLoading = ref(false);
+    const toggleFullscreen = () => {
+      isFullscreen.value = !isFullscreen.value;
+    };
     const handleCancel = () => {
       var _a;
       (_a = props.onCancel) == null ? void 0 : _a.call(props);
@@ -1020,17 +1135,69 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
         modelValue: visible.value,
         "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => visible.value = $event),
         class: getClass.value,
-        title: props.title,
-        style: { maxWidth: !props.fullscreen ? "480px" : "100%", ...props.style }
+        fullscreen: isFullscreen.value,
+        "show-close": false,
+        style: { maxWidth: !isFullscreen.value ? "480px" : "100%", ...props.style }
       }), createSlots({
+        header: withCtx(({ close, titleId, titleClass }) => [
+          createElementVNode("div", {
+            class: normalizeClass(unref(b)("dialog-header"))
+          }, [
+            renderSlot(_ctx.$slots, "title", {}, () => [
+              createElementVNode("div", {
+                id: titleId,
+                class: normalizeClass(["el-dialog__title", [titleClass, unref(b)("dialog-title")]])
+              }, toDisplayString(props.title), 11, _hoisted_1$5)
+            ], true),
+            createVNode(unref(ElSpace), { size: 8 }, {
+              default: withCtx(() => [
+                props.showFullscreen ? (openBlock(), createBlock(unref(ElButton), {
+                  key: 0,
+                  class: normalizeClass(unref(b)("dialog-button")),
+                  text: "",
+                  circle: "",
+                  onClick: toggleFullscreen
+                }, {
+                  default: withCtx(() => [
+                    createVNode(unref(ElIcon), { size: 16 }, {
+                      default: withCtx(() => [
+                        createVNode(unref(full_screen_default))
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                }, 8, ["class"])) : createCommentVNode("", true),
+                props.showClose ? (openBlock(), createBlock(unref(ElButton), {
+                  key: 1,
+                  class: normalizeClass(unref(b)("dialog-button")),
+                  text: "",
+                  circle: "",
+                  onClick: close
+                }, {
+                  default: withCtx(() => [
+                    createVNode(unref(ElIcon), { size: 16 }, {
+                      default: withCtx(() => [
+                        createVNode(unref(close_default))
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                }, 8, ["class", "onClick"])) : createCommentVNode("", true)
+              ]),
+              _: 2
+            }, 1024)
+          ], 2)
+        ]),
         default: withCtx(() => [
           renderSlot(_ctx.$slots, "default", {}, () => {
             var _a;
             return [
-              typeof props.content === "string" ? (openBlock(), createElementBlock("p", _hoisted_1$5, toDisplayString(props.content), 1)) : createCommentVNode("", true),
+              typeof props.content === "string" ? (openBlock(), createElementBlock("p", _hoisted_2$2, toDisplayString(props.content), 1)) : createCommentVNode("", true),
               typeof props.content === "function" ? (openBlock(), createBlock(resolveDynamicComponent((_a = props == null ? void 0 : props.content) == null ? void 0 : _a.call(props)), { key: 1 })) : createCommentVNode("", true)
             ];
-          })
+          }, true)
         ]),
         _: 2
       }, [
@@ -1061,14 +1228,15 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
                 ]),
                 _: 1
               })) : (openBlock(), createBlock(resolveDynamicComponent(props.footer()), { key: 1 }))
-            ])
+            ], true)
           ]),
           key: "0"
         } : void 0
-      ]), 1040, ["modelValue", "class", "title", "style"]);
+      ]), 1040, ["modelValue", "class", "fullscreen", "style"]);
     };
   }
 });
+const DialogComponent = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-166b4c09"]]);
 const _hoisted_1$4 = { class: "el-message-box__message" };
 const _sfc_main$h = /* @__PURE__ */ defineComponent({
   __name: "dialog-content",
@@ -1122,7 +1290,7 @@ function createDialog() {
             dialogApp.unmount();
             container.remove();
           };
-          return () => h(_sfc_main$i, {
+          return () => h(DialogComponent, {
             ...dialogOptions.value,
             "modelValue": visible.value,
             "onUpdate:modelValue": (val) => visible.value = val,
@@ -1234,7 +1402,8 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
   }
 });
 const Dot = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["__scopeId", "data-v-575d79dc"]]);
-const _hoisted_1$3 = { key: 0 };
+const _hoisted_1$3 = ["id"];
+const _hoisted_2$1 = { key: 0 };
 const _sfc_main$f = /* @__PURE__ */ defineComponent({
   __name: "drawer",
   props: /* @__PURE__ */ mergeModels({
@@ -1312,7 +1481,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
         onOk: void 0,
         onBeforeOk: void 0,
         onCancel: void 0,
-        simple: void 0
+        title: void 0
       };
     });
     const okLoading = ref(false);
@@ -1345,20 +1514,58 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
         modelValue: visible.value,
         "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => visible.value = $event),
         class: getClass.value,
-        title: props.title,
+        "show-close": false,
         style: { ...props.style }
       }), createSlots({
         default: withCtx(() => [
           renderSlot(_ctx.$slots, "default", {}, () => {
             var _a;
             return [
-              typeof props.content === "string" ? (openBlock(), createElementBlock("p", _hoisted_1$3, toDisplayString(props.content), 1)) : createCommentVNode("", true),
+              typeof props.content === "string" ? (openBlock(), createElementBlock("p", _hoisted_2$1, toDisplayString(props.content), 1)) : createCommentVNode("", true),
               typeof props.content === "function" ? (openBlock(), createBlock(resolveDynamicComponent((_a = props == null ? void 0 : props.content) == null ? void 0 : _a.call(props)), { key: 1 })) : createCommentVNode("", true)
             ];
-          })
+          }, true)
         ]),
         _: 2
       }, [
+        props.withHeader ? {
+          name: "header",
+          fn: withCtx(({ close, titleId, titleClass }) => [
+            createElementVNode("div", {
+              class: normalizeClass(unref(b)("drawer-header"))
+            }, [
+              renderSlot(_ctx.$slots, "title", {}, () => [
+                createElementVNode("div", {
+                  id: titleId,
+                  class: normalizeClass(["el-drawer__title", [titleClass, unref(b)("drawer-title")]])
+                }, toDisplayString(props.title), 11, _hoisted_1$3)
+              ], true),
+              createVNode(unref(ElSpace), { size: 8 }, {
+                default: withCtx(() => [
+                  props.showClose ? (openBlock(), createBlock(unref(ElButton), {
+                    key: 0,
+                    class: normalizeClass(unref(b)("drawer-button")),
+                    text: "",
+                    circle: "",
+                    onClick: close
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(unref(ElIcon), { size: 16 }, {
+                        default: withCtx(() => [
+                          createVNode(unref(close_default))
+                        ]),
+                        _: 1
+                      })
+                    ]),
+                    _: 1
+                  }, 8, ["class", "onClick"])) : createCommentVNode("", true)
+                ]),
+                _: 2
+              }, 1024)
+            ], 2)
+          ]),
+          key: "0"
+        } : void 0,
         props.footer ? {
           name: "footer",
           fn: withCtx(() => [
@@ -1386,14 +1593,15 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
                 ]),
                 _: 1
               })) : (openBlock(), createBlock(resolveDynamicComponent(props.footer()), { key: 1 }))
-            ])
+            ], true)
           ]),
-          key: "0"
+          key: "1"
         } : void 0
-      ]), 1040, ["modelValue", "class", "title", "style"]);
+      ]), 1040, ["modelValue", "class", "style"]);
     };
   }
 });
+const Drawer$1 = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-a9d2ac8f"]]);
 const DEF_OPTIONS = {};
 function createDrawer() {
   const Drawer2 = {
@@ -1411,7 +1619,7 @@ function createDrawer() {
             drawerApp.unmount();
             container.remove();
           };
-          return () => h(_sfc_main$f, {
+          return () => h(Drawer$1, {
             ...dialogOptions.value,
             "modelValue": visible.value,
             "onUpdate:modelValue": (val) => visible.value = val,
@@ -9158,10 +9366,11 @@ const createSelectDialog = (params) => {
 };
 void [Dialog.info, Dialog.success, Dialog.warning, Dialog.error];
 const components = {
-  Button: _sfc_main$l,
+  Button: _sfc_main$m,
   Card,
+  Comment,
   Descriptions: _sfc_main$j,
-  Drawer: _sfc_main$f,
+  Drawer: Drawer$1,
   Dot,
   Tabs,
   InputGroup,
@@ -9172,16 +9381,17 @@ const components = {
   GridItem,
   Form: _Form,
   PageLayout,
-  Dialog: _sfc_main$i,
+  Dialog: DialogComponent,
   EditTable,
   Table: _Table,
   Tag,
   TreeTransfer
 };
-const GiButton = _sfc_main$l;
+const GiButton = _sfc_main$m;
 const GiCard = Card;
+const GiComment = Comment;
 const GiDescriptions = _sfc_main$j;
-const GiDrawer = _sfc_main$f;
+const GiDrawer = Drawer$1;
 const GiDot = Dot;
 const GiTabs = Tabs;
 const GiInputGroup = InputGroup;
@@ -9192,7 +9402,7 @@ const GiGrid = Grid;
 const GiGridItem = GridItem;
 const GiForm = _Form;
 const GiPageLayout = PageLayout;
-const GiDialog = _sfc_main$i;
+const GiDialog = DialogComponent;
 const GiEditTable = EditTable;
 const GiTable = _Table;
 const GiTag = Tag;
@@ -9217,6 +9427,7 @@ export {
   Drawer,
   GiButton,
   GiCard,
+  GiComment,
   GiDescriptions,
   GiDialog,
   GiDot,
@@ -9234,6 +9445,8 @@ export {
   GiTabs,
   GiTag,
   GiTreeTransfer,
+  Grid,
+  GridItem,
   createDialog,
   createDrawer,
   createSelectDialog,