@fangzhongya/fang-ui 0.1.25 → 0.1.27

package/dist/components/array/index.css

@@ -12,6 +12,11 @@
   --g-main-bg: var(--bg-color-page);
 }
 
+.com-footer {
+  border-top: 1px solid var(--border);
+  padding: 20px 20px;
+}
+
 .array {
   width: 100%;
   display: inline-flex;

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

@@ -5,7 +5,6 @@ const data = require("./data.cjs");
 const index$1 = require("../../../hooks/cssname/index.cjs");
 const index$3 = require("../../icon/index.cjs");
 const clear = require("../../../icons/vue/clear.cjs");
-require("../../forms/src/data.cjs");
 const compons = require("../../common/compons.cjs");
 const index$2 = require("../../../hooks/props-default/index.cjs");
 const lineToLargeHump = require("@fangzhongya/utils/name/lineToLargeHump");

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

@@ -3,7 +3,6 @@ import { name, dataProps, dataExpose, dataSlot, dataEmits } from "./data.js";
 import { useCssName } from "../../../hooks/cssname/index.js";
 import { Icon } from "../../icon/index.js";
 import Clear from "../../../icons/vue/clear.js";
-import "../../forms/src/data.js";
 import { useGetCompons } from "../../common/compons.js";
 import { usePropsDefault, viewProps, getProps } from "../../../hooks/props-default/index.js";
 import { lineToLargeHump } from "@fangzhongya/utils/name/lineToLargeHump";

package/dist/components/audios/index.css

@@ -12,6 +12,11 @@
   --g-main-bg: var(--bg-color-page);
 }
 
+.com-footer {
+  border-top: 1px solid var(--border);
+  padding: 20px 20px;
+}
+
 .audios.is-playing .audios-name {
   background-color: antiquewhite;
 }

package/dist/components/box/index.css

@@ -12,6 +12,11 @@
   --g-main-bg: var(--bg-color-page);
 }
 
+.com-footer {
+  border-top: 1px solid var(--border);
+  padding: 20px 20px;
+}
+
 .box-mask {
   display: block;
   opacity: 0.5;
@@ -24,6 +29,30 @@
   background: rgba(2, 28, 39, 0.4);
 }
 
+.icon {
+  --color: inherit;
+  height: 1em;
+  width: 1em;
+  line-height: 1em;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  position: relative;
+  fill: currentColor;
+  color: var(--color);
+  font-size: inherit;
+}
+.icon-cont {
+  border: 0;
+  display: inline-flex;
+  align-items: center;
+  object-fit: contain;
+  justify-content: center;
+  font-size: inherit !important;
+  width: inherit !important;
+  height: inherit !important;
+}
+
 .box-title {
   padding: 10px;
   position: relative;

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

@@ -12,6 +12,11 @@
   --g-main-bg: var(--bg-color-page);
 }
 
+.com-footer {
+  border-top: 1px solid var(--border);
+  padding: 20px 20px;
+}
+
 .box-mask {
   display: block;
   opacity: 0.5;
@@ -24,6 +29,30 @@
   background: rgba(2, 28, 39, 0.4);
 }
 
+.icon {
+  --color: inherit;
+  height: 1em;
+  width: 1em;
+  line-height: 1em;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  position: relative;
+  fill: currentColor;
+  color: var(--color);
+  font-size: inherit;
+}
+.icon-cont {
+  border: 0;
+  display: inline-flex;
+  align-items: center;
+  object-fit: contain;
+  justify-content: center;
+  font-size: inherit !important;
+  width: inherit !important;
+  height: inherit !important;
+}
+
 .box-title {
   padding: 10px;
   position: relative;
@@ -80,7 +109,6 @@
 .box-adjust-body .box-adjust-title-icon {
   width: 20px;
   display: inline-flex;
-  color: #fff;
   align-items: center;
   margin: 0 4px;
   height: 100%;

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

@@ -1,8 +1,3 @@
-// @use '../common.scss' as *;
-
-// @use '../box-mask/src/index.scss' as *;
-// @use '../box-title/src/index.scss' as *;
-
 @use '../scss/common.scss' as *;
 @use '../box-mask/index.scss' as *;
 @use '../box-title/index.scss' as *;
@@ -37,7 +32,6 @@ $box-adjust: 'box-adjust';
 		.#{z($box-adjust, 'title-icon')} {
 			width: 20px;
 			display: inline-flex;
-			color: #fff;
 			align-items: center;
 			margin: 0 4px;
 			height: 100%;

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

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
+const index$6 = require("../../icon/index.cjs");
 const data = require("./data.cjs");
 const index$1 = require("../../../hooks/cssname/index.cjs");
 const index = require("../../../hooks/locale/index.cjs");
@@ -9,8 +10,8 @@ const star = require("../../../icons/vue/star.cjs");
 const index$5 = require("../../box-title/index.cjs");
 const index$4 = require("../../box-mask/index.cjs");
 const index$3 = require("../../box-teleport/index.cjs");
-const index$7 = require("../../../directives/adjust/index.cjs");
-const index$6 = require("../../../directives/drag/index.cjs");
+const index$8 = require("../../../directives/adjust/index.cjs");
+const index$7 = require("../../../directives/drag/index.cjs");
 const data$1 = require("../../box-title/src/data.cjs");
 const index$2 = require("../../../hooks/props-default/index.cjs");
 const _hoisted_1 = ["title"];
@@ -51,7 +52,6 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       ...data.dataExpose
     });
     return (_ctx, _cache) => {
-      const _component_Icon = vue.resolveComponent("Icon");
       return vue.openBlock(), vue.createBlock(vue.unref(index$3.BoxTeleport), {
         disabled: vue.unref(props).disabled,
         to: vue.unref(props).to
@@ -83,7 +83,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                         vue.unref(cs).z("title-max")
                       ])
                     }, [
-                      vue.createVNode(_component_Icon, null, {
+                      vue.createVNode(vue.unref(index$6.Icon), null, {
                         default: vue.withCtx(() => [
                           maxvalue.value ? vue.renderSlot(_ctx.$slots, vue.unref(data.dataSlot)["icon-full"], { key: 0 }, () => [
                             vue.createVNode(star.default)
@@ -105,10 +105,10 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
               ], 2),
               vue.renderSlot(_ctx.$slots, vue.unref(data.dataSlot).footer)
             ], 2)), [
-              [vue.unref(index$6.default), {
+              [vue.unref(index$7.default), {
                 dom: vue.unref(props).drag
               }],
-              [vue.unref(index$7.default), {
+              [vue.unref(index$8.default), {
                 often: vue.unref(props).often,
                 all: { position: true }
               }]

package/dist/components/box-adjust/src/index2.js

@@ -1,4 +1,5 @@
-import { defineComponent, shallowRef, watch, resolveComponent, createBlock, openBlock, unref, withCtx, withDirectives, createCommentVNode, createElementBlock, normalizeClass, createVNode, renderSlot, createElementVNode, vShow } from "vue";
+import { defineComponent, shallowRef, watch, createBlock, openBlock, unref, withCtx, withDirectives, createCommentVNode, createElementBlock, normalizeClass, createVNode, renderSlot, createElementVNode, vShow } from "vue";
+import { Icon } from "../../icon/index.js";
 import { name, dataProps, dataExpose, dataSlot, dataEmits } from "./data.js";
 import { useCssName } from "../../../hooks/cssname/index.js";
 import { useLocale } from "../../../hooks/locale/index.js";
@@ -49,7 +50,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       ...dataExpose
     });
     return (_ctx, _cache) => {
-      const _component_Icon = resolveComponent("Icon");
       return openBlock(), createBlock(unref(BoxTeleport), {
         disabled: unref(props).disabled,
         to: unref(props).to
@@ -81,7 +81,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                         unref(cs).z("title-max")
                       ])
                     }, [
-                      createVNode(_component_Icon, null, {
+                      createVNode(unref(Icon), null, {
                         default: withCtx(() => [
                           maxvalue.value ? renderSlot(_ctx.$slots, unref(dataSlot)["icon-full"], { key: 0 }, () => [
                             createVNode(Star)

package/dist/components/box-fun/index.cjs

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const index = require("./src/index.cjs");
+const _function = require("./src/function.cjs");
+const BoxFun = _function.withInstall(index.default, "BoxFun");
+exports.BoxFun = BoxFun;
+exports.default = BoxFun;

package/dist/components/box-fun/index.d.ts

@@ -0,0 +1,7 @@
+import { DataProps } from '../box/src/data';
+declare const BoxFun: (content?: string | Function, props?: DataProps & {
+    isCancel?: boolean;
+    cancelName?: string;
+    confirmName?: string;
+}, verify?: () => boolean) => Promise<unknown>;
+export { BoxFun, BoxFun as default };

package/dist/components/box-fun/index.js

@@ -0,0 +1,7 @@
+import SrcVue from "./src/index.js";
+import { withInstall } from "./src/function.js";
+const BoxFun = withInstall(SrcVue, "BoxFun");
+export {
+  BoxFun,
+  BoxFun as default
+};

package/dist/components/box-fun/src/data.cjs

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const buildProps = require("../../../utils/vues/buildProps.cjs");
+const name = "box-fun";
+const dataProps = buildProps.buildProps({
+  /**
+   * @props {String, Function} content='' 内容
+   */
+  content: {
+    type: [String, Function]
+  },
+  /**
+   * @props { Object } props={} 配置
+   */
+  props: {
+    type: Object
+  },
+  /**
+   * @props { Function } verify=()=>true 校验
+   */
+  verify: {
+    type: Function
+  }
+});
+const dataEmits = {};
+const dataSlot = {
+  default: "default"
+};
+const dataExpose = { name };
+exports.dataEmits = dataEmits;
+exports.dataExpose = dataExpose;
+exports.dataProps = dataProps;
+exports.dataSlot = dataSlot;
+exports.name = name;

package/dist/components/box-fun/src/data.d.ts

@@ -0,0 +1,35 @@
+import { ExtractPublicPropTypes } from 'vue';
+/**
+ * @title {h3} BoxFun
+ * @text box-fun
+ */
+export declare const name = "box-fun";
+export declare const dataProps: {
+    /**
+     * @props {String, Function} content='' 内容
+     */
+    content: {
+        type: (StringConstructor | FunctionConstructor)[];
+    };
+    /**
+     * @props { Object } props={} 配置
+     */
+    props: {
+        type: ObjectConstructor;
+    };
+    /**
+     * @props { Function } verify=()=>true 校验
+     */
+    verify: {
+        type: FunctionConstructor;
+    };
+};
+export type DataProps = ExtractPublicPropTypes<typeof dataProps>;
+export declare const dataEmits: {};
+export type DataEmits = typeof dataEmits;
+export declare const dataSlot: {
+    default: string;
+};
+export declare const dataExpose: {
+    name: string;
+};

package/dist/components/box-fun/src/data.js

@@ -0,0 +1,34 @@
+import { buildProps } from "../../../utils/vues/buildProps.js";
+const name = "box-fun";
+const dataProps = buildProps({
+  /**
+   * @props {String, Function} content='' 内容
+   */
+  content: {
+    type: [String, Function]
+  },
+  /**
+   * @props { Object } props={} 配置
+   */
+  props: {
+    type: Object
+  },
+  /**
+   * @props { Function } verify=()=>true 校验
+   */
+  verify: {
+    type: Function
+  }
+});
+const dataEmits = {};
+const dataSlot = {
+  default: "default"
+};
+const dataExpose = { name };
+export {
+  dataEmits,
+  dataExpose,
+  dataProps,
+  dataSlot,
+  name
+};

package/dist/components/box-fun/src/function.cjs

@@ -0,0 +1,97 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const vue = require("vue");
+const index$2 = require("../../box/index.cjs");
+const getBoxDom = require("../../../utils/vues/getBoxDom.cjs");
+const index$1 = require("../../button/index.cjs");
+const index = require("../../../hooks/locale/index.cjs");
+const BoxFun = (content = "", props = {}, verify = () => true) => {
+  return new Promise((resolve, reject) => {
+    const mountNode = document.createElement("div");
+    const dom = getBoxDom.getBoxDom();
+    (dom ?? document.body).appendChild(mountNode);
+    const visible = vue.ref(true);
+    const app = vue.createApp({
+      render() {
+        const { getLocale } = index.useLocale();
+        let defaultFun;
+        if (typeof content === "string") {
+          defaultFun = () => vue.h("div", content);
+        } else if (content) {
+          defaultFun = content;
+        }
+        const cancel = vue.h(
+          index$1.Button,
+          {
+            onClick() {
+              visible.value = false;
+              vue.nextTick(() => {
+                app.unmount();
+                mountNode.remove();
+              });
+              reject(false);
+            }
+          },
+          {
+            default() {
+              return props.cancelName ?? getLocale("form.cancel");
+            }
+          }
+        );
+        return vue.h(
+          index$2.Box,
+          {
+            modelValue: visible.value,
+            "onUpdate:modelValue": (value) => {
+              visible.value = value;
+            },
+            ...props
+          },
+          {
+            footer: () => {
+              return vue.h(
+                "div",
+                {
+                  class: "com-footer",
+                  style: {
+                    "text-align": "right"
+                  }
+                },
+                [
+                  props.isCancel === false ? void 0 : cancel,
+                  vue.h(
+                    index$1.Button,
+                    {
+                      type: "primary",
+                      onClick: async () => {
+                        if (await verify()) {
+                          visible.value = false;
+                          vue.nextTick(() => {
+                            app.unmount();
+                            mountNode.remove();
+                          });
+                          resolve(true);
+                        }
+                      }
+                    },
+                    {
+                      default() {
+                        return props.confirmName ?? getLocale("form.confirm");
+                      }
+                    }
+                  )
+                ]
+              );
+            },
+            default: defaultFun
+          }
+        );
+      }
+    });
+    app.mount(mountNode);
+  });
+};
+function withInstall(fun, name) {
+  return BoxFun;
+}
+exports.withInstall = withInstall;

package/dist/components/box-fun/src/function.d.ts

@@ -0,0 +1,8 @@
+import { DataProps } from '../box/src/data';
+type Props = {
+    isCancel?: boolean;
+    cancelName?: string;
+    confirmName?: string;
+};
+export declare function withInstall<T>(fun: T, name: string): (content?: string | Function, props?: DataProps & Props, verify?: () => boolean) => Promise<unknown>;
+export {};

package/dist/components/box-fun/src/function.js

@@ -0,0 +1,97 @@
+import { ref, createApp, h, nextTick } from "vue";
+import { Box } from "../../box/index.js";
+import { getBoxDom } from "../../../utils/vues/getBoxDom.js";
+import { Button } from "../../button/index.js";
+import { useLocale } from "../../../hooks/locale/index.js";
+const BoxFun = (content = "", props = {}, verify = () => true) => {
+  return new Promise((resolve, reject) => {
+    const mountNode = document.createElement("div");
+    const dom = getBoxDom();
+    (dom ?? document.body).appendChild(mountNode);
+    const visible = ref(true);
+    const app = createApp({
+      render() {
+        const { getLocale } = useLocale();
+        let defaultFun;
+        if (typeof content === "string") {
+          defaultFun = () => h("div", content);
+        } else if (content) {
+          defaultFun = content;
+        }
+        const cancel = h(
+          Button,
+          {
+            onClick() {
+              visible.value = false;
+              nextTick(() => {
+                app.unmount();
+                mountNode.remove();
+              });
+              reject(false);
+            }
+          },
+          {
+            default() {
+              return props.cancelName ?? getLocale("form.cancel");
+            }
+          }
+        );
+        return h(
+          Box,
+          {
+            modelValue: visible.value,
+            "onUpdate:modelValue": (value) => {
+              visible.value = value;
+            },
+            ...props
+          },
+          {
+            footer: () => {
+              return h(
+                "div",
+                {
+                  class: "com-footer",
+                  style: {
+                    "text-align": "right"
+                  }
+                },
+                [
+                  props.isCancel === false ? void 0 : cancel,
+                  h(
+                    Button,
+                    {
+                      type: "primary",
+                      onClick: async () => {
+                        if (await verify()) {
+                          visible.value = false;
+                          nextTick(() => {
+                            app.unmount();
+                            mountNode.remove();
+                          });
+                          resolve(true);
+                        }
+                      }
+                    },
+                    {
+                      default() {
+                        return props.confirmName ?? getLocale("form.confirm");
+                      }
+                    }
+                  )
+                ]
+              );
+            },
+            default: defaultFun
+          }
+        );
+      }
+    });
+    app.mount(mountNode);
+  });
+};
+function withInstall(fun, name) {
+  return BoxFun;
+}
+export {
+  withInstall
+};

package/dist/components/box-fun/src/index.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+require("./data.cjs");
+const SrcVue = {};
+exports.default = SrcVue;

package/dist/components/box-fun/src/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: {};
+export default _default;

package/dist/components/box-fun/src/index.js

@@ -0,0 +1,5 @@
+import "./data.js";
+const SrcVue = {};
+export {
+  SrcVue as default
+};

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

@@ -12,6 +12,11 @@
   --g-main-bg: var(--bg-color-page);
 }
 
+.com-footer {
+  border-top: 1px solid var(--border);
+  padding: 20px 20px;
+}
+
 .box-mask {
   display: block;
   opacity: 0.5;
@@ -24,6 +29,30 @@
   background: rgba(2, 28, 39, 0.4);
 }
 
+.icon {
+  --color: inherit;
+  height: 1em;
+  width: 1em;
+  line-height: 1em;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  position: relative;
+  fill: currentColor;
+  color: var(--color);
+  font-size: inherit;
+}
+.icon-cont {
+  border: 0;
+  display: inline-flex;
+  align-items: center;
+  object-fit: contain;
+  justify-content: center;
+  font-size: inherit !important;
+  width: inherit !important;
+  height: inherit !important;
+}
+
 .box-title {
   padding: 10px;
   position: relative;

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

@@ -12,6 +12,11 @@
   --g-main-bg: var(--bg-color-page);
 }
 
+.com-footer {
+  border-top: 1px solid var(--border);
+  padding: 20px 20px;
+}
+
 .box-mask {
   display: block;
   opacity: 0.5;

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

@@ -4,7 +4,7 @@ const vue = require("vue");
 const data = require("./data.cjs");
 const index$1 = require("../../../hooks/cssname/index.cjs");
 const index = require("../../../hooks/locale/index.cjs");
-const enums = require("../../../utils/enums.cjs");
+const getBoxDom = require("../../../utils/vues/getBoxDom.cjs");
 const index$2 = require("../../../hooks/props-default/index.cjs");
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "index",
@@ -17,16 +17,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const props = index$2.usePropsDefault(data.name, prs, data.dataProps);
     index$2.viewProps(props, data.name);
     const emit = __emit;
-    const id = enums.FunctConfig.BOXIDNAME.trim();
-    if (document && !(document == null ? void 0 : document.querySelector(id))) {
-      const d = document.createElement("div");
-      if (id.startsWith("#")) {
-        d.id = id.replace(/^#/, "");
-      } else if (id.startsWith(".")) {
-        d.className = id.replace(/./g, " ");
-      }
-      document.body.appendChild(d);
-    }
+    getBoxDom.getBoxDom();
     __expose({
       ...data.dataExpose
     });