@aplus-frontend/ui 0.0.1-beta.3 → 0.0.1-beta.30

package/es/src/modal/components/modal-wrapper.vue2.mjs

@@ -1,4 +1,104 @@
-import f from "./modal-wrapper.vue.mjs";
+import { defineComponent as R, ref as a, computed as b, unref as l, watchEffect as k, watch as M, onMounted as C, onUnmounted as F, nextTick as c, resolveDirective as T, openBlock as v, createBlock as W, withCtx as $, withDirectives as z, createElementBlock as B, normalizeStyle as D, renderSlot as O } from "vue";
+import { useWindowSizeFn as A } from "@aplus-frontend/hooks";
+import { ScrollContainer as I } from "../../container/index.mjs";
+import { createModalContext as N } from "../hooks/use-modal-context.mjs";
+import { useMutationObserver as P } from "@vueuse/core";
+import { modalWrapperProps as U } from "../props.mjs";
+const j = ["loading-tip"], V = /* @__PURE__ */ R({
+  name: "ModalWrapper",
+  inheritAttrs: !1,
+  __name: "modal-wrapper",
+  props: U,
+  emits: ["height-change", "ext-height"],
+  setup(w, { expose: y, emit: _ }) {
+    const t = w, m = _, p = a(null), u = a(null), n = a(0), h = a(0), s = a(0);
+    let f = () => {
+    };
+    A(r.bind(null)), P(
+      u,
+      () => {
+        r();
+      },
+      {
+        attributes: !0,
+        subtree: !0
+      }
+    ), N({
+      redoModalHeight: r
+    });
+    const x = b(() => ({
+      minHeight: `${t.minHeight}px`,
+      [t.fullScreen ? "height" : "maxHeight"]: `${l(n)}px`
+    }));
+    k(() => {
+      t.useWrapper && r();
+    }), M(
+      () => t.fullScreen,
+      (e) => {
+        r(), e ? h.value = n.value : n.value = h.value;
+      }
+    ), C(() => {
+      const { modalHeaderHeight: e, modalFooterHeight: o } = t;
+      m("ext-height", e + o);
+    }), F(() => {
+      f && f();
+    });
+    async function S() {
+      c(() => {
+        var o;
+        const e = l(p);
+        e && ((o = e == null ? void 0 : e.scrollTo) == null || o.call(e, 0));
+      });
+    }
+    async function r() {
+      if (!t.open)
+        return;
+      const e = l(p);
+      if (!e)
+        return;
+      const o = e.$el.parentElement;
+      if (o) {
+        o.style.padding = "0", await c();
+        try {
+          const i = o.parentElement && o.parentElement.parentElement;
+          if (!i)
+            return;
+          const E = getComputedStyle(i).top, g = Number.parseInt(E);
+          let d = window.innerHeight - g * 2 + (t.footerOffset || 0) - t.modalFooterHeight - t.modalHeaderHeight;
+          g < 40 && (d -= 26), await c();
+          const H = l(u);
+          if (!H)
+            return;
+          await c(), s.value = H.scrollHeight, t.fullScreen ? n.value = window.innerHeight - t.modalFooterHeight - t.modalHeaderHeight - 28 : n.value = t.height ? t.height : s.value > d ? d : s.value, m("height-change", l(n));
+        } catch (i) {
+          console.log(i);
+        }
+      }
+    }
+    return y({ scrollTop: S, setModalHeight: r }), (e, o) => {
+      const i = T("loading");
+      return v(), W(l(I), {
+        ref_key: "wrapperRef",
+        ref: p,
+        scrollHeight: s.value
+      }, {
+        default: $(() => [
+          z((v(), B("div", {
+            ref_key: "spinRef",
+            ref: u,
+            style: D(x.value),
+            "loading-tip": e.loadingTip
+          }, [
+            O(e.$slots, "default")
+          ], 12, j)), [
+            [i, e.loading]
+          ])
+        ]),
+        _: 3
+      }, 8, ["scrollHeight"]);
+    };
+  }
+});
 export {
-  f as default
+  V as default
 };

package/es/src/modal/components/modal.d.ts

@@ -423,10 +423,10 @@ declare const _default: DefineComponent<{
 }, {
     loading: boolean;
     open: boolean;
-    mask: boolean;
     closable: boolean;
     centered: boolean;
     okType: "danger" | ButtonType;
+    mask: boolean;
     maskClosable: boolean;
     keyboard: boolean;
     confirmLoading: boolean;

package/es/src/modal/components/modal.mjs

@@ -1,12 +1,12 @@
-import { defineComponent as p, toRefs as f, unref as d, createVNode as m, isVNode as u } from "vue";
+import { isVNode as p, defineComponent as f, toRefs as d, unref as m, createVNode as u } from "vue";
 import { Modal as M } from "ant-design-vue";
 import { basicProps as b } from "../props.mjs";
 import { useModalDragMove as g } from "../hooks/use-modal-drag.mjs";
 import { extendSlots as j } from "../../utils/slot.mjs";
 function y(o) {
-  return typeof o == "function" || Object.prototype.toString.call(o) === "[object Object]" && !u(o);
+  return typeof o == "function" || Object.prototype.toString.call(o) === "[object Object]" && !p(o);
 }
-const N = /* @__PURE__ */ p({
+const N = /* @__PURE__ */ f({
   name: "Modal",
   inheritAttrs: !1,
   props: b,
@@ -20,7 +20,7 @@ const N = /* @__PURE__ */ p({
       open: a,
       draggable: l,
       destroyOnClose: s
-    } = f(o);
+    } = d(o);
     g({
       open: a,
       destroyOnClose: s,
@@ -32,11 +32,11 @@ const N = /* @__PURE__ */ p({
     return () => {
       let t;
       const i = {
-        ...d(n),
+        ...m(n),
         ...o,
         onCancel: c
       };
-      return m(M, i, y(t = j(e)) ? t : {
+      return u(M, i, y(t = j(e)) ? t : {
         default: () => [t]
       });
     };

package/es/src/modal/hooks/use-modal-drag.mjs

@@ -1,4 +1,4 @@
-import { watchEffect as x, unref as c } from "vue";
+import { unref as c, watchEffect as x } from "vue";
 import { useTimeoutFn as A } from "@vueuse/core";
 function X(n) {
   const a = (o, t) => getComputedStyle(o)[t], D = (o) => {

package/es/src/modal/hooks/use-modal.mjs

@@ -1,4 +1,4 @@
-import { reactive as P, ref as d, computed as h, unref as t, toRaw as c, getCurrentInstance as v, watchEffect as w, nextTick as E, onUnmounted as O } from "vue";
+import { reactive as P, ref as d, getCurrentInstance as h, onUnmounted as w, unref as t, computed as v, toRaw as c, watchEffect as E, nextTick as O } from "vue";
 import { isProdMode as M } from "@aplus-frontend/utils";
 import { isEqual as H } from "lodash-unified";
 import { tryOnUnmounted as I } from "@vueuse/core";
@@ -7,11 +7,11 @@ const u = P({}), g = P({});
 function C() {
   const r = d(null), a = d(!1), s = d(0);
   function i(e, o) {
-    if (!v())
+    if (!h())
       throw new Error(
         "useModal() can only be used inside setup() or functional components!"
       );
-    s.value = o, M() && O(() => {
+    s.value = o, M() && w(() => {
       r.value = null, a.value = !1, u[String(t(s))] = null;
     }), !(t(a) && M() && e === t(r)) && (r.value = e, a.value = !0, e.emitOpen = (p, l) => {
       g[l] = p;
@@ -27,7 +27,7 @@ function C() {
       var o;
       (o = n()) == null || o.setModalProps(e);
     },
-    getOpen: h(() => g[~~t(s)]),
+    getOpen: v(() => g[~~t(s)]),
     redoModalHeight: () => {
       var e, o;
       (o = (e = n()) == null ? void 0 : e.redoModalHeight) == null || o.call(e);
@@ -53,7 +53,7 @@ function C() {
   return [i, f];
 }
 const D = (r) => {
-  const a = d(null), s = v(), i = d(0), n = () => {
+  const a = d(null), s = h(), i = d(0), n = () => {
     const e = t(a);
     if (!e)
       throw new Error("useModalInner instance is undefined!");
@@ -63,9 +63,9 @@ const D = (r) => {
       a.value = null;
     }), i.value = o, a.value = e, s == null || s.emit("register", e, o);
   };
-  return w(() => {
+  return E(() => {
     const e = u[t(i)];
-    e && (!r || !R(r) || E(() => {
+    e && (!r || !R(r) || O(() => {
       r(e);
     }));
   }), [
@@ -75,7 +75,7 @@ const D = (r) => {
         var o;
         (o = n()) == null || o.setModalProps({ loading: e });
       },
-      getOpen: h(() => g[~~t(i)]),
+      getOpen: v(() => g[~~t(i)]),
       changeOkLoading: (e = !0) => {
         var o;
         (o = n()) == null || o.setModalProps({ confirmLoading: e });

package/es/src/modal/index.mjs

@@ -1,11 +1,13 @@
 import { withInstall as o } from "@aplus-frontend/utils";
-import "./style/index.css";
-import r from "./basic.vue.mjs";
-import "@aplus-frontend/hooks";
-import { useModal as l, useModalInner as n } from "./hooks/use-modal.mjs";
-const i = o(r);
+import "./basic.vue.mjs";
+import { useModalContext as l } from "./hooks/use-modal-context.mjs";
+import { useModal as f, useModalInner as d } from "./hooks/use-modal.mjs";
+import "./interface.mjs";
+import r from "./basic.vue2.mjs";
+const p = o(r);
 export {
-  i as BaseModal,
-  l as useModal,
-  n as useModalInner
+  p as BaseModal,
+  f as useModal,
+  l as useModalContext,
+  d as useModalInner
 };

package/es/src/modal/interface.mjs

@@ -0,0 +1 @@
+

package/es/src/modal/props.mjs

@@ -12,7 +12,7 @@ const e = {
 }, t = Object.assign({}, e, {
   defaultFullscreen: { type: Boolean },
   // Can it be full screen
-  canFullscreen: { type: Boolean, default: !0 },
+  canFullscreen: { type: Boolean, default: !1 },
   // After enabling the wrapper, the bottom can be increased in height
   wrapperFooterOffset: { type: Number, default: 0 },
   // Warm reminder message

package/es/src/modal/style/index.css

@@ -14,48 +14,50 @@
 .fullscreen-modal .ant-modal-footer {
   margin-top: 0;
 }
-.ant-modal {
+.aplus-basic-modal {
   width: 520px;
   padding-bottom: 0;
 }
-.ant-modal .ant-modal-body > .scrollbar {
-  padding: 14px;
+.aplus-basic-modal .ant-modal-body > .aplus-scrollbar {
+  padding: 20px;
+  padding-bottom: 0;
 }
-.ant-modal-title {
+.aplus-basic-modal .ant-modal-title {
   font-size: 16px;
   font-weight: bold;
 }
-.ant-modal-title .base-title {
+.aplus-basic-modal .ant-modal-title .aplus-basic-title {
   cursor: move !important;
+  padding-left: 0;
 }
-.ant-modal .ant-modal-body {
+.aplus-basic-modal .ant-modal-body {
   padding: 0;
 }
-.ant-modal .ant-modal-body > .scrollbar > .scrollbar__bar.is-horizontal {
+.aplus-basic-modal .ant-modal-body > .aplus-scrollbar > .aplus-scrollbar__bar.is-horizontal {
   display: none;
 }
-.ant-modal-large {
+.aplus-basic-modal .ant-modal-large {
   top: 60px;
 }
-.ant-modal-large--mini {
+.aplus-basic-modal .ant-modal-large .ant-modal--mini {
   top: 16px;
 }
-.ant-modal-header {
-  padding: 16px;
-  border-bottom: 1px solid #eee;
+.aplus-basic-modal .ant-modal-header {
+  padding: 15px 20px;
+  margin-bottom: 0;
+  border-bottom: 1px solid #dee4ed;
 }
-.ant-modal-content {
+.aplus-basic-modal .ant-modal-content {
   padding: 0 !important;
-  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 #000000;
 }
-.ant-modal-footer {
-  padding: 10px 16px;
-  border-top: 1px solid #eee;
+.aplus-basic-modal .ant-modal-footer {
+  padding: 20px;
+  margin-top: 0;
 }
-.ant-modal-footer button + button {
+.aplus-basic-modal .ant-modal-footer button + button {
   margin-left: 10px;
 }
-.ant-modal-close {
+.aplus-basic-modal .ant-modal-close {
   top: 0 !important;
   right: 0 !important;
   width: auto !important;
@@ -63,41 +65,38 @@
   background: transparent !important;
   font-weight: normal;
 }
-.ant-modal-close-x {
+.aplus-basic-modal .ant-modal-close-x {
   display: inline-block;
   width: 96px;
   height: 56px;
   line-height: 56px !important;
 }
-.ant-modal-confirm-body .ant-modal-confirm-content > * {
+.aplus-basic-modal .ant-modal-confirm-body .ant-modal-confirm-content > * {
   color: #909399;
 }
-.ant-modal-confirm-confirm.error .ant-modal-confirm-body > .anticon {
+.aplus-basic-modal .ant-modal-confirm-confirm.error .ant-modal-confirm-body > .anticon {
   color: #ed6f6f;
 }
-.ant-modal-confirm-btns .ant-btn:last-child {
+.aplus-basic-modal .ant-modal-confirm-btns .ant-btn:last-child {
   margin-right: 0;
 }
-.ant-modal-confirm-info .ant-modal-confirm-body > .anticon {
+.aplus-basic-modal .ant-modal-confirm-info .ant-modal-confirm-body > .anticon {
   color: #efbd47;
 }
-.ant-modal-confirm-confirm.success .ant-modal-confirm-body > .anticon {
+.aplus-basic-modal .ant-modal-confirm-confirm.success .ant-modal-confirm-body > .anticon {
   color: #34b77c;
 }
-.ant-modal-confirm .ant-modal-body {
-  padding: 24px !important;
-}
-@media screen and (max-height: 600px) {
+@media screen and (height <= 600px) {
   .ant-modal {
     top: 60px;
   }
 }
-@media screen and (max-height: 540px) {
+@media screen and (height <= 540px) {
   .ant-modal {
     top: 30px;
   }
 }
-@media screen and (max-height: 480px) {
+@media screen and (height <= 480px) {
   .ant-modal {
     top: 10px;
   }

package/es/src/pro-form/component-map.mjs

@@ -1,53 +1,68 @@
-import { Input as t, InputNumber as s, AutoComplete as p, Select as c, TreeSelect as a, Switch as m, Radio as n, Checkbox as o, Cascader as u, Slider as f, Rate as k, Transfer as P, DatePicker as r, TimePicker as i, Divider as T } from "ant-design-vue";
-import d from "./components/api-radio-group.vue.mjs";
-import S from "./components/radio-button-group.vue.mjs";
-import _ from "./components/api-select.vue.mjs";
-import l from "./components/api-tree.vue.mjs";
-import A from "./components/api-tree-select.vue.mjs";
-import C from "./components/api-cascader.vue.mjs";
-import I from "./components/api-transfer.vue.mjs";
-import { StrengthMeter as h } from "../strength-meter/index.mjs";
-import { IconPicker as R } from "../icon-picker/index.mjs";
-import { CountdownInput as G } from "../count-down/index.mjs";
-import { BasicTitle as w } from "../basic/index.mjs";
-import { CropperAvatar as g } from "../cropper/index.mjs";
+import { Input as t, InputNumber as m, AutoComplete as c, Select as a, TreeSelect as n, Switch as u, Radio as f, Checkbox as i, Cascader as k, Slider as d, Rate as P, Transfer as T, DatePicker as r, TimePicker as s, Divider as l } from "ant-design-vue";
+import "./components/api-radio-group.vue2.mjs";
+import "./components/radio-button-group.vue2.mjs";
+import "./components/api-select.vue2.mjs";
+import "./components/api-tree.vue2.mjs";
+import "./components/api-tree-select.vue2.mjs";
+import "./components/api-cascader.vue2.mjs";
+import "./components/api-transfer.vue2.mjs";
+import { StrengthMeter as S } from "../strength-meter/index.mjs";
+import { IconPicker as _ } from "../icon-picker/index.mjs";
+import { CountdownInput as A } from "../count-down/index.mjs";
+import { BasicTitle as C } from "../basic/index.mjs";
+import { CropperAvatar as I } from "../cropper/index.mjs";
+import h from "./components/api-select.vue.mjs";
+import R from "./components/api-tree.vue.mjs";
+import G from "./components/api-tree-select.vue.mjs";
+import w from "./components/api-radio-group.vue.mjs";
+import g from "./components/radio-button-group.vue.mjs";
+import x from "./components/api-cascader.vue.mjs";
+import M from "./components/api-transfer.vue.mjs";
 const e = /* @__PURE__ */ new Map();
 e.set("Input", t);
 e.set("InputGroup", t.Group);
 e.set("InputPassword", t.Password);
 e.set("InputSearch", t.Search);
 e.set("InputTextArea", t.TextArea);
-e.set("InputNumber", s);
-e.set("AutoComplete", p);
-e.set("Select", c);
-e.set("ApiSelect", _);
-e.set("ApiTree", l);
-e.set("TreeSelect", a);
-e.set("ApiTreeSelect", A);
-e.set("ApiRadioGroup", d);
-e.set("Switch", m);
-e.set("RadioButtonGroup", S);
-e.set("RadioGroup", n.Group);
-e.set("Checkbox", o);
-e.set("CheckboxGroup", o.Group);
-e.set("ApiCascader", C);
-e.set("Cascader", u);
-e.set("Slider", f);
-e.set("Rate", k);
-e.set("Transfer", P);
-e.set("ApiTransfer", I);
+e.set("InputNumber", m);
+e.set("AutoComplete", c);
+e.set("Select", a);
+e.set("ApiSelect", h);
+e.set("ApiTree", R);
+e.set("TreeSelect", n);
+e.set("ApiTreeSelect", G);
+e.set("ApiRadioGroup", w);
+e.set("Switch", u);
+e.set("RadioButtonGroup", g);
+e.set("RadioGroup", f.Group);
+e.set("Checkbox", i);
+e.set("CheckboxGroup", i.Group);
+e.set("ApiCascader", x);
+e.set("Cascader", k);
+e.set("Slider", d);
+e.set("Rate", P);
+e.set("Transfer", T);
+e.set("ApiTransfer", M);
 e.set("DatePicker", r);
 e.set("MonthPicker", r.MonthPicker);
 e.set("RangePicker", r.RangePicker);
 e.set("WeekPicker", r.WeekPicker);
-e.set("TimePicker", i);
-e.set("TimeRangePicker", i.TimeRangePicker);
-e.set("StrengthMeter", h);
-e.set("IconPicker", R);
-e.set("InputCountDown", G);
-e.set("Divider", T);
-e.set("CropperAvatar", g);
-e.set("BasicTitle", w);
+e.set("TimePicker", s);
+e.set("TimeRangePicker", s.TimeRangePicker);
+e.set("StrengthMeter", S);
+e.set("IconPicker", _);
+e.set("InputCountDown", A);
+e.set("Divider", l);
+e.set("CropperAvatar", I);
+e.set("BasicTitle", C);
+function V(o, p) {
+  e.set(o, p);
+}
+function X(o) {
+  e.delete(o);
+}
 export {
-  e as componentMap
+  V as add,
+  e as componentMap,
+  X as del
 };

package/es/src/pro-form/components/api-cascader.vue.d.ts

@@ -24,10 +24,10 @@ declare const _default: DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRunt
     onChange?: ((...args: any[]) => any) | undefined;
     onDefaultChange?: ((...args: any[]) => any) | undefined;
 }, {
-    immediate: boolean;
     resultField: string;
     labelField: string;
     valueField: string;
+    immediate: boolean;
     childrenField: string;
     apiParamKey: string;
     initFetchParams: Record<string, any>;

package/es/src/pro-form/components/api-radio-group.vue.d.ts

@@ -21,14 +21,14 @@ declare const _default: DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRunt
     immediate: boolean;
 }>>> & {
     onChange?: ((...args: any[]) => any) | undefined;
-    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
     "onOptions-change"?: ((...args: any[]) => any) | undefined;
+    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
 }, {
-    immediate: boolean;
     params: string | Record<string, any>;
     resultField: string;
     labelField: string;
     valueField: string;
+    immediate: boolean;
     isBtn: boolean;
 }, {}>;
 export default _default;

package/es/src/pro-form/components/api-select.vue.d.ts

@@ -37,16 +37,16 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<__VLS_WithDefau
     options: () => never[];
 }>>> & {
     onChange?: ((...args: any[]) => any) | undefined;
-    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
     "onOptions-change"?: ((...args: any[]) => any) | undefined;
+    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
 }, {
-    options: ApiSelectOption[];
-    immediate: boolean;
     params: Record<string, any>;
     resultField: string;
     labelField: string;
     valueField: string;
+    immediate: boolean;
     alwaysLoad: boolean;
+    options: ApiSelectOption[];
 }, {}>, Partial<Record<NonNullable<keyof SelectSlotsType>, (_: any) => any>>>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;

package/es/src/pro-form/components/api-transfer.vue.d.ts

@@ -27,10 +27,10 @@ declare const _default: DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRunt
     "onOptions-change"?: ((...args: any[]) => any) | undefined;
 }, {
     disabled: boolean;
-    immediate: boolean;
     resultField: string;
     labelField: string;
     valueField: string;
+    immediate: boolean;
     alwaysLoad: boolean;
     showSearch: boolean;
     showSelectAll: boolean;

package/es/src/pro-form/components/api-tree-select.vue.d.ts

@@ -25,10 +25,10 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<__VLS_WithDefau
     "onOptions-change"?: ((...args: any[]) => any) | undefined;
     "onLoad-data"?: ((...args: any[]) => any) | undefined;
 }, {
-    immediate: boolean;
     resultField: string;
     labelField: string;
     valueField: string;
+    immediate: boolean;
     async: boolean;
     childrenField: string;
 }, {}>, Partial<Record<NonNullable<AntdTreeSelectSlotNames>, (_: any) => any>>>;

package/es/src/pro-form/components/api-tree-select.vue.mjs

@@ -2,7 +2,7 @@ import { defineComponent as k, useAttrs as w, ref as u, computed as B, unref as
 import { TreeSelect as x } from "ant-design-vue";
 import { get as z } from "lodash-unified";
 import { LoadingOutlined as I } from "@ant-design/icons-vue";
-import { isFunction as M, isArray as m } from "@fruits-chain/utils";
+import { isArray as m, isFunction as M } from "@fruits-chain/utils";
 const H = /* @__PURE__ */ k({
   name: "ApApiTreeSelect",
   __name: "api-tree-select",

package/es/src/pro-form/components/api-tree.vue.d.ts

@@ -14,11 +14,11 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<__VLS_WithDefau
     resultField: string;
 }>>> & {
     onChange?: ((...args: any[]) => any) | undefined;
-    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
     "onOptions-change"?: ((...args: any[]) => any) | undefined;
+    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
 }, {
-    immediate: boolean;
     resultField: string;
+    immediate: boolean;
 }, {}>, Partial<Record<NonNullable<AntdTreeSlotNames>, (_: any) => any>>>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;