@fangzhongya/fang-ui 0.0.97 → 0.0.99

package/dist/components/audios/src/index2.cjs

@@ -0,0 +1,238 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const index$2 = require("../../sliders/index.cjs");
+const index$3 = require("../../button/index.cjs");
+const up = require("../../../icons/vue/up.cjs");
+const down = require("../../../icons/vue/down.cjs");
+const play = require("../../../icons/vue/play.cjs");
+const pause = require("../../../icons/vue/pause.cjs");
+const sound = require("../../../icons/vue/sound.cjs");
+const mute = require("../../../icons/vue/mute.cjs");
+const hourFormat = require("@fangzhongya/utils/date/hourFormat");
+const data = require("./data.cjs");
+const index$1 = require("../../../hooks/cssname/index.cjs");
+const index = require("../../../hooks/locale/index.cjs");
+const util = require("../../players/common/util.cjs");
+const _hoisted_1 = ["onClick"];
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "index",
+  props: data.dataProps,
+  emits: data.dataEmits,
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const { getLocale } = index.useLocale();
+    const cs = index$1.useCssName("audios");
+    const props = __props;
+    const emit = __emit;
+    const audioRef = vue.ref(null);
+    const current = vue.ref(0);
+    const list = vue.computed(() => {
+      return util.getListValue(props.list);
+    });
+    const value = vue.computed(() => {
+      return list.value[current.value];
+    });
+    const slider = vue.ref(0);
+    const duration = vue.ref(0);
+    const currentTime = vue.ref(0);
+    const isPlaying = vue.ref(false);
+    const volume = vue.ref(50);
+    const isMuted = vue.ref(false);
+    const isMouse = vue.ref(true);
+    const onMousedown = () => {
+      isMouse.value = false;
+    };
+    const toggleMute = () => {
+      if (!audioRef.value) return;
+      isMuted.value = !isMuted.value;
+      audioRef.value.muted = isMuted.value;
+    };
+    const togglePlay = () => {
+      if (!audioRef.value) return;
+      if (isPlaying.value) {
+        audioRef.value.pause();
+      } else {
+        audioRef.value.play();
+      }
+      isPlaying.value = !isPlaying.value;
+    };
+    const onReplay = () => {
+      var _a;
+      (_a = audioRef.value) == null ? void 0 : _a.play();
+      isPlaying.value = true;
+    };
+    const playTrack = (i) => {
+      current.value = i;
+      if (audioRef.value) {
+        audioRef.value.src = value.value.url;
+        audioRef.value.load();
+        vue.nextTick(() => {
+          onReplay();
+        });
+      }
+    };
+    const onTrack = (is) => {
+      if (is) {
+        current.value--;
+      } else {
+        current.value++;
+      }
+      playTrack(current.value);
+    };
+    const formatTooltip = (number) => {
+      return hourFormat.hourFormat(number * duration.value / 100);
+    };
+    const onChangeSlider = () => {
+      if (audioRef.value) {
+        const v = slider.value * duration.value / 100;
+        console.log("v", v);
+        audioRef.value.currentTime = v;
+      }
+      isMouse.value = true;
+    };
+    const onChange = () => {
+      if (audioRef.value) {
+        audioRef.value.volume = volume.value / 100;
+      }
+    };
+    const handleTimeUpdate = () => {
+      if (audioRef.value) {
+        currentTime.value = audioRef.value.currentTime;
+        console.log("handleTimeUpdate", currentTime.value);
+        if (isMouse.value) {
+          slider.value = currentTime.value / duration.value * 100;
+        }
+      }
+    };
+    const handleLoadedMetadata = () => {
+      if (audioRef.value) {
+        duration.value = audioRef.value.duration;
+        console.log("handleLoadedMetadata", duration.value);
+      }
+    };
+    const handleEnded = () => {
+      isPlaying.value = false;
+      console.log("handleEnded", handleEnded);
+    };
+    vue.onMounted(() => {
+      var _a;
+      audioRef.value = new Audio();
+      audioRef.value.volume = volume.value / 100;
+      audioRef.value.src = (_a = value.value) == null ? void 0 : _a.url;
+      audioRef.value.addEventListener("timeupdate", handleTimeUpdate);
+      audioRef.value.addEventListener("loadedmetadata", handleLoadedMetadata);
+      audioRef.value.addEventListener("ended", handleEnded);
+      audioRef.value.addEventListener("canplaythrough", function() {
+        console.log("音频可以播放到结束，可以安全跳转");
+      });
+      audioRef.value.load();
+    });
+    vue.onUnmounted(() => {
+      if (audioRef.value) {
+        audioRef.value.removeEventListener("timeupdate", handleTimeUpdate);
+        audioRef.value.removeEventListener(
+          "loadedmetadata",
+          handleLoadedMetadata
+        );
+        audioRef.value.removeEventListener("ended", handleEnded);
+        audioRef.value.pause();
+      }
+    });
+    __expose({
+      ...data.dataExpose
+    });
+    return (_ctx, _cache) => {
+      var _a;
+      return vue.openBlock(), vue.createElementBlock("div", {
+        class: vue.normalizeClass([vue.unref(cs).z(), vue.unref(cs).is("playing", isPlaying.value)])
+      }, [
+        vue.createElementVNode("div", {
+          class: vue.normalizeClass(vue.unref(cs).z("name"))
+        }, vue.toDisplayString((_a = value.value) == null ? void 0 : _a.name), 3),
+        vue.createElementVNode("div", {
+          class: vue.normalizeClass(vue.unref(cs).z("slider"))
+        }, [
+          vue.createVNode(vue.unref(index$2.Sliders), {
+            class: vue.normalizeClass(vue.unref(cs).z("slider-slider")),
+            onChange: onChangeSlider,
+            onMousedown,
+            "format-tooltip": formatTooltip,
+            modelValue: slider.value,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => slider.value = $event)
+          }, null, 8, ["class", "modelValue"]),
+          vue.createElementVNode("div", {
+            class: vue.normalizeClass(vue.unref(cs).z("duration"))
+          }, [
+            vue.createElementVNode("span", {
+              class: vue.normalizeClass(vue.unref(cs).z("duration-began"))
+            }, vue.toDisplayString(vue.unref(hourFormat.hourFormat)(currentTime.value)), 3),
+            _cache[4] || (_cache[4] = vue.createElementVNode("span", null, "/", -1)),
+            vue.createElementVNode("span", {
+              class: vue.normalizeClass(vue.unref(cs).z("duration-end"))
+            }, vue.toDisplayString(vue.unref(hourFormat.hourFormat)(duration.value)), 3)
+          ], 2)
+        ], 2),
+        vue.createElementVNode("div", {
+          class: vue.normalizeClass(vue.unref(cs).z("control"))
+        }, [
+          vue.createElementVNode("div", {
+            class: vue.normalizeClass(vue.unref(cs).z("control-buts"))
+          }, [
+            vue.createVNode(vue.unref(index$3.Button), {
+              size: "small",
+              icon: up.default,
+              disabled: current.value == 0,
+              circle: "",
+              onClick: _cache[1] || (_cache[1] = ($event) => onTrack(true))
+            }, null, 8, ["disabled"]),
+            vue.createVNode(vue.unref(index$3.Button), {
+              icon: isPlaying.value ? pause.default : play.default,
+              circle: "",
+              onClick: togglePlay
+            }, null, 8, ["icon"]),
+            vue.createVNode(vue.unref(index$3.Button), {
+              size: "small",
+              icon: down.default,
+              circle: "",
+              disabled: current.value + 1 == list.value.length,
+              onClick: _cache[2] || (_cache[2] = ($event) => onTrack(false))
+            }, null, 8, ["disabled"])
+          ], 2),
+          vue.createElementVNode("div", {
+            class: vue.normalizeClass(vue.unref(cs).z("control-volume"))
+          }, [
+            vue.createVNode(vue.unref(index$3.Button), {
+              class: vue.normalizeClass(vue.unref(cs).z("control-volume-but")),
+              icon: isMuted.value ? mute.default : sound.default,
+              circle: "",
+              onClick: toggleMute,
+              size: "small"
+            }, null, 8, ["class", "icon"]),
+            vue.createVNode(vue.unref(index$2.Sliders), {
+              class: vue.normalizeClass(vue.unref(cs).z("control-volume-slider")),
+              size: "small",
+              onChange,
+              modelValue: volume.value,
+              "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => volume.value = $event)
+            }, null, 8, ["class", "modelValue"])
+          ], 2)
+        ], 2),
+        list.value.length > 1 ? (vue.openBlock(), vue.createElementBlock("div", {
+          key: 0,
+          class: vue.normalizeClass(vue.unref(cs).z("list"))
+        }, [
+          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(list.value, (item, index2) => {
+            return vue.openBlock(), vue.createElementBlock("div", {
+              class: vue.normalizeClass([vue.unref(cs).z("list-li"), vue.unref(cs).is("active", current.value === index2)]),
+              key: index2,
+              onClick: ($event) => playTrack(index2)
+            }, [
+              vue.createElementVNode("div", null, vue.toDisplayString(item.name), 1)
+            ], 10, _hoisted_1);
+          }), 128))
+        ], 2)) : vue.createCommentVNode("", true)
+      ], 2);
+    };
+  }
+});
+exports.default = _sfc_main;

package/dist/components/audios/src/index2.js

@@ -0,0 +1,238 @@
+import { defineComponent, ref, computed, nextTick, onMounted, onUnmounted, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, createCommentVNode, toDisplayString, createVNode, Fragment, renderList } from "vue";
+import { Sliders } from "../../sliders/index.js";
+import { Button } from "../../button/index.js";
+import Up from "../../../icons/vue/up.js";
+import Down from "../../../icons/vue/down.js";
+import Play from "../../../icons/vue/play.js";
+import Pause from "../../../icons/vue/pause.js";
+import Sound from "../../../icons/vue/sound.js";
+import Mute from "../../../icons/vue/mute.js";
+import { hourFormat } from "@fangzhongya/utils/date/hourFormat";
+import { dataExpose, dataEmits, dataProps } from "./data.js";
+import { useCssName } from "../../../hooks/cssname/index.js";
+import { useLocale } from "../../../hooks/locale/index.js";
+import { getListValue } from "../../players/common/util.js";
+const _hoisted_1 = ["onClick"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "index",
+  props: dataProps,
+  emits: dataEmits,
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const { getLocale } = useLocale();
+    const cs = useCssName("audios");
+    const props = __props;
+    const emit = __emit;
+    const audioRef = ref(null);
+    const current = ref(0);
+    const list = computed(() => {
+      return getListValue(props.list);
+    });
+    const value = computed(() => {
+      return list.value[current.value];
+    });
+    const slider = ref(0);
+    const duration = ref(0);
+    const currentTime = ref(0);
+    const isPlaying = ref(false);
+    const volume = ref(50);
+    const isMuted = ref(false);
+    const isMouse = ref(true);
+    const onMousedown = () => {
+      isMouse.value = false;
+    };
+    const toggleMute = () => {
+      if (!audioRef.value) return;
+      isMuted.value = !isMuted.value;
+      audioRef.value.muted = isMuted.value;
+    };
+    const togglePlay = () => {
+      if (!audioRef.value) return;
+      if (isPlaying.value) {
+        audioRef.value.pause();
+      } else {
+        audioRef.value.play();
+      }
+      isPlaying.value = !isPlaying.value;
+    };
+    const onReplay = () => {
+      var _a;
+      (_a = audioRef.value) == null ? void 0 : _a.play();
+      isPlaying.value = true;
+    };
+    const playTrack = (i) => {
+      current.value = i;
+      if (audioRef.value) {
+        audioRef.value.src = value.value.url;
+        audioRef.value.load();
+        nextTick(() => {
+          onReplay();
+        });
+      }
+    };
+    const onTrack = (is) => {
+      if (is) {
+        current.value--;
+      } else {
+        current.value++;
+      }
+      playTrack(current.value);
+    };
+    const formatTooltip = (number) => {
+      return hourFormat(number * duration.value / 100);
+    };
+    const onChangeSlider = () => {
+      if (audioRef.value) {
+        const v = slider.value * duration.value / 100;
+        console.log("v", v);
+        audioRef.value.currentTime = v;
+      }
+      isMouse.value = true;
+    };
+    const onChange = () => {
+      if (audioRef.value) {
+        audioRef.value.volume = volume.value / 100;
+      }
+    };
+    const handleTimeUpdate = () => {
+      if (audioRef.value) {
+        currentTime.value = audioRef.value.currentTime;
+        console.log("handleTimeUpdate", currentTime.value);
+        if (isMouse.value) {
+          slider.value = currentTime.value / duration.value * 100;
+        }
+      }
+    };
+    const handleLoadedMetadata = () => {
+      if (audioRef.value) {
+        duration.value = audioRef.value.duration;
+        console.log("handleLoadedMetadata", duration.value);
+      }
+    };
+    const handleEnded = () => {
+      isPlaying.value = false;
+      console.log("handleEnded", handleEnded);
+    };
+    onMounted(() => {
+      var _a;
+      audioRef.value = new Audio();
+      audioRef.value.volume = volume.value / 100;
+      audioRef.value.src = (_a = value.value) == null ? void 0 : _a.url;
+      audioRef.value.addEventListener("timeupdate", handleTimeUpdate);
+      audioRef.value.addEventListener("loadedmetadata", handleLoadedMetadata);
+      audioRef.value.addEventListener("ended", handleEnded);
+      audioRef.value.addEventListener("canplaythrough", function() {
+        console.log("音频可以播放到结束，可以安全跳转");
+      });
+      audioRef.value.load();
+    });
+    onUnmounted(() => {
+      if (audioRef.value) {
+        audioRef.value.removeEventListener("timeupdate", handleTimeUpdate);
+        audioRef.value.removeEventListener(
+          "loadedmetadata",
+          handleLoadedMetadata
+        );
+        audioRef.value.removeEventListener("ended", handleEnded);
+        audioRef.value.pause();
+      }
+    });
+    __expose({
+      ...dataExpose
+    });
+    return (_ctx, _cache) => {
+      var _a;
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([unref(cs).z(), unref(cs).is("playing", isPlaying.value)])
+      }, [
+        createElementVNode("div", {
+          class: normalizeClass(unref(cs).z("name"))
+        }, toDisplayString((_a = value.value) == null ? void 0 : _a.name), 3),
+        createElementVNode("div", {
+          class: normalizeClass(unref(cs).z("slider"))
+        }, [
+          createVNode(unref(Sliders), {
+            class: normalizeClass(unref(cs).z("slider-slider")),
+            onChange: onChangeSlider,
+            onMousedown,
+            "format-tooltip": formatTooltip,
+            modelValue: slider.value,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => slider.value = $event)
+          }, null, 8, ["class", "modelValue"]),
+          createElementVNode("div", {
+            class: normalizeClass(unref(cs).z("duration"))
+          }, [
+            createElementVNode("span", {
+              class: normalizeClass(unref(cs).z("duration-began"))
+            }, toDisplayString(unref(hourFormat)(currentTime.value)), 3),
+            _cache[4] || (_cache[4] = createElementVNode("span", null, "/", -1)),
+            createElementVNode("span", {
+              class: normalizeClass(unref(cs).z("duration-end"))
+            }, toDisplayString(unref(hourFormat)(duration.value)), 3)
+          ], 2)
+        ], 2),
+        createElementVNode("div", {
+          class: normalizeClass(unref(cs).z("control"))
+        }, [
+          createElementVNode("div", {
+            class: normalizeClass(unref(cs).z("control-buts"))
+          }, [
+            createVNode(unref(Button), {
+              size: "small",
+              icon: Up,
+              disabled: current.value == 0,
+              circle: "",
+              onClick: _cache[1] || (_cache[1] = ($event) => onTrack(true))
+            }, null, 8, ["disabled"]),
+            createVNode(unref(Button), {
+              icon: isPlaying.value ? Pause : Play,
+              circle: "",
+              onClick: togglePlay
+            }, null, 8, ["icon"]),
+            createVNode(unref(Button), {
+              size: "small",
+              icon: Down,
+              circle: "",
+              disabled: current.value + 1 == list.value.length,
+              onClick: _cache[2] || (_cache[2] = ($event) => onTrack(false))
+            }, null, 8, ["disabled"])
+          ], 2),
+          createElementVNode("div", {
+            class: normalizeClass(unref(cs).z("control-volume"))
+          }, [
+            createVNode(unref(Button), {
+              class: normalizeClass(unref(cs).z("control-volume-but")),
+              icon: isMuted.value ? Mute : Sound,
+              circle: "",
+              onClick: toggleMute,
+              size: "small"
+            }, null, 8, ["class", "icon"]),
+            createVNode(unref(Sliders), {
+              class: normalizeClass(unref(cs).z("control-volume-slider")),
+              size: "small",
+              onChange,
+              modelValue: volume.value,
+              "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => volume.value = $event)
+            }, null, 8, ["class", "modelValue"])
+          ], 2)
+        ], 2),
+        list.value.length > 1 ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: normalizeClass(unref(cs).z("list"))
+        }, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(list.value, (item, index) => {
+            return openBlock(), createElementBlock("div", {
+              class: normalizeClass([unref(cs).z("list-li"), unref(cs).is("active", current.value === index)]),
+              key: index,
+              onClick: ($event) => playTrack(index)
+            }, [
+              createElementVNode("div", null, toDisplayString(item.name), 1)
+            ], 10, _hoisted_1);
+          }), 128))
+        ], 2)) : createCommentVNode("", true)
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/components/audios/style/index2.scss

@@ -0,0 +1,3 @@
+@use '../../slider/style/index2.scss' as *;
+@use '../../button/style/index2.scss' as *;
+@use '../index.scss' as *;

package/dist/components/autocomplete/src/index2.cjs

@@ -1,21 +1,21 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const vues = require("vue");
+const vue = require("vue");
 const data = require("./data.cjs");
 const index = require("../../../hooks/cssname/index.cjs");
 const index$1 = require("../../../hooks/expose/index.cjs");
 const index$2 = require("element-plus/es/components/autocomplete/index");
-const _sfc_main = /* @__PURE__ */ vues.defineComponent({
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "index",
   props: data.dataProps,
   emits: data.dataEmits,
   setup(__props, { expose: __expose, emit: __emit }) {
-    const attrs = vues.useAttrs();
-    const slots = vues.useSlots();
+    const attrs = vue.useAttrs();
+    const slots = vue.useSlots();
     const cs = index.useCssName("autocomplete");
     const props = __props;
     const emit = __emit;
-    const elRef = vues.ref();
+    const elRef = vue.ref();
     __expose(
       index$1.useExpose(
         {
@@ -25,16 +25,16 @@ const _sfc_main = /* @__PURE__ */ vues.defineComponent({
       )
     );
     return (_ctx, _cache) => {
-      return vues.openBlock(), vues.createBlock(vues.unref(index$2.ElAutocomplete), vues.mergeProps({
+      return vue.openBlock(), vue.createBlock(vue.unref(index$2.ElAutocomplete), vue.mergeProps({
         ref_key: "elRef",
         ref: elRef,
-        class: vues.unref(cs).z()
-      }, vues.unref(attrs)), vues.createSlots({ _: 2 }, [
-        vues.renderList(Object.keys(vues.unref(slots)), (k) => {
+        class: vue.unref(cs).z()
+      }, vue.unref(attrs)), vue.createSlots({ _: 2 }, [
+        vue.renderList(Object.keys(vue.unref(slots)), (k) => {
           return {
             name: k,
-            fn: vues.withCtx((scope) => [
-              vues.renderSlot(_ctx.$slots, k, vues.normalizeProps(vues.guardReactiveProps(scope || {})))
+            fn: vue.withCtx((scope) => [
+              vue.renderSlot(_ctx.$slots, k, vue.normalizeProps(vue.guardReactiveProps(scope || {})))
             ])
           };
         })

package/dist/components/autocomplete/style/element.scss

@@ -1,3 +1,5 @@
+@use 'element-plus/theme-chalk/src/base.scss' as *;
 @use '../../input/style/index2.scss' as *;
 @use '../../scrollbar/style/index2.scss' as *;
-@use 'element-plus/theme-chalk/src/popper.scss' as *;
+@use 'element-plus/theme-chalk/src/popper.scss' as *;
+@use 'element-plus/theme-chalk/src/autocomplete.scss' as *;

package/dist/components/autocomplete/style/index2.scss

@@ -1,4 +1,2 @@
-@use 'element-plus/theme-chalk/src/base.scss' as *;
-@use 'element-plus/theme-chalk/src/autocomplete.scss' as *;
 @use './element.scss' as *;
 @use '../index.scss' as *;

package/dist/components/box/src/index2.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const vues = require("vue");
+const vue = require("vue");
 const data = require("./data.cjs");
 const index$1 = require("../../../hooks/cssname/index.cjs");
 const index = require("../../../hooks/locale/index.cjs");
@@ -8,17 +8,17 @@ const index$4 = require("../../box-title/index.cjs");
 const index$3 = require("../../box-mask/index.cjs");
 const index$2 = require("../../box-teleport/index.cjs");
 const _hoisted_1 = ["name"];
-const _sfc_main = /* @__PURE__ */ vues.defineComponent({
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "index",
   props: data.dataProps,
   emits: data.dataEmits,
   setup(__props, { expose: __expose, emit: __emit }) {
-    const isInit = vues.shallowRef(false);
+    const isInit = vue.shallowRef(false);
     const { getLocale } = index.useLocale();
     const cs = index$1.useCssName("box");
     const props = __props;
     const emit = __emit;
-    vues.watch(
+    vue.watch(
       () => props.modelValue,
       () => {
         if (props.modelValue) {
@@ -35,39 +35,39 @@ const _sfc_main = /* @__PURE__ */ vues.defineComponent({
       ...data.dataExpose
     });
     return (_ctx, _cache) => {
-      return vues.openBlock(), vues.createBlock(vues.unref(index$2.BoxTeleport), {
+      return vue.openBlock(), vue.createBlock(vue.unref(index$2.BoxTeleport), {
         disabled: props.disabled,
         to: props.to
       }, {
-        default: vues.withCtx(() => [
-          isInit.value ? vues.withDirectives((vues.openBlock(), vues.createElementBlock("div", {
+        default: vue.withCtx(() => [
+          isInit.value ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
             key: 0,
-            class: vues.normalizeClass([vues.unref(cs).z(), props.boxClass])
+            class: vue.normalizeClass([vue.unref(cs).z(), props.boxClass])
           }, [
-            vues.createVNode(vues.unref(index$3.BoxMask), {
+            vue.createVNode(vue.unref(index$3.BoxMask), {
               onClick: onClose,
-              cssprefix: props.cssprefix || vues.unref(cs).z()
+              cssprefix: props.cssprefix || vue.unref(cs).z()
             }, null, 8, ["cssprefix"]),
-            vues.createElementVNode("div", {
-              class: vues.normalizeClass(vues.unref(cs).z("body"))
+            vue.createElementVNode("div", {
+              class: vue.normalizeClass(vue.unref(cs).z("body"))
             }, [
-              vues.renderSlot(_ctx.$slots, vues.unref(data.dataSlot).title, {}, () => [
-                vues.createVNode(vues.unref(index$4.BoxTitle), {
+              vue.renderSlot(_ctx.$slots, vue.unref(data.dataSlot).title, {}, () => [
+                vue.createVNode(vue.unref(index$4.BoxTitle), {
                   onClose,
                   title: props.title
                 }, null, 8, ["title"])
               ]),
-              vues.createElementVNode("div", {
-                name: vues.unref(data.dataSlot).default,
-                class: vues.normalizeClass(vues.unref(cs).z("body-div"))
+              vue.createElementVNode("div", {
+                name: vue.unref(data.dataSlot).default,
+                class: vue.normalizeClass(vue.unref(cs).z("body-div"))
               }, [
-                vues.renderSlot(_ctx.$slots, "default")
+                vue.renderSlot(_ctx.$slots, "default")
               ], 10, _hoisted_1),
-              vues.renderSlot(_ctx.$slots, vues.unref(data.dataSlot).footer)
+              vue.renderSlot(_ctx.$slots, vue.unref(data.dataSlot).footer)
             ], 2)
           ], 2)), [
-            [vues.vShow, props.modelValue]
-          ]) : vues.createCommentVNode("", true)
+            [vue.vShow, props.modelValue]
+          ]) : vue.createCommentVNode("", true)
         ]),
         _: 3
       }, 8, ["disabled", "to"]);

package/dist/components/box-adjust/index.css

@@ -68,6 +68,23 @@
   display: flex;
   flex-direction: column;
 }
+.box-adjust-body.is-max {
+  width: 100vw !important;
+  height: 100vh !important;
+  top: initial !important;
+  left: initial !important;
+}
+.box-adjust-body.is-max::-webkit-scrollbar {
+  width: 0 !important;
+}
+.box-adjust-body .box-adjust-title-icon {
+  width: 20px;
+  display: inline-flex;
+  align-items: center;
+  margin: 0 4px;
+  height: 100%;
+  cursor: pointer;
+}
 .box-adjust-body-div {
   flex: 1;
   overflow-y: auto;

package/dist/components/box-adjust/index.scss

@@ -25,6 +25,24 @@ $box-adjust: 'box-adjust';
 		height: 40%;
 		display: flex;
 		flex-direction: column;
+		&.#{is('max')} {
+			width: 100vw !important;
+			height: 100vh !important;
+			top: initial !important;
+			left: initial !important;
+			&::-webkit-scrollbar {
+				width: 0 !important;
+			}
+		}
+		.#{z($box-adjust, 'title-icon')} {
+			width: 20px;
+			display: inline-flex;
+			align-items: center;
+			margin: 0 4px;
+			height: 100%;
+			cursor: pointer;
+		}
+
 		&-div {
 			flex: 1;
 			overflow-y: auto;