asai-vue-host-form 0.2.14 → 0.2.16

package/README.md

@@ -0,0 +1,98 @@
+# asai-vue-host-form — 动态表单渲染插件
+
+## 包信息
+
+| 建议 npm 名 | 入口文件 | $fn / 注入键 | 类型 |
+|------------|---------|-------------|------|
+| `@estun/asai-vue-host-form` | `src/components/index.ts` | —（全局组件） | Host |
+
+## 概述
+
+`asai-vue-host-form` 是**动态表单渲染引擎**，根据 JSON 配置递归生成表单，支持输入、只读展示、JSON 编辑、图片上传裁剪与字段规则控制。
+
+## 集成方式
+
+```typescript
+// monorepo — webclient/src/utils/index.ts
+import AsaiVueHostForm from '../plugs/asai-vue-host-form/src/components/index';
+// import '/node_modules/asai-vue-host-form/dist/asai-vue-host-form.css';
+// npm
+// import AsaiVueHostForm from '@estun/asai-vue-host-form';
+
+app.use(AsaiVueHostForm, lib);
+```
+
+```vue
+<AsaiFormLi :ujt="ujt" :asaidata="formConfig" :formdata="formData" :opt="{ isedit: true }" />
+```
+
+## 独立性约束
+
+- **禁止** cross-import 其它 `plugs/*`。
+- 图片裁剪弹窗通过 `$global.pop` 与 PopBox **运行时**集成，不 import `asai-vue-host-popbox`。
+
+## 主要 API / 导出
+
+| 组件 | 说明 |
+|------|------|
+| `AsaiFormLi` | 表单列表递归渲染器 |
+| `AsaiFormLabel` / `AsaiFormLabelArea` | 标签与区域 |
+| `AsaiFormShow` | 只读展示 |
+| `AsaiTextarea` / `AsaiTextJson` | 多行 / JSON 编辑 |
+| `AsaiUploadImgCut` / `AsaiUploadImgCutPop` | 图片裁剪与弹窗 |
+
+## 性能说明
+
+- 全局组件 **lazy** 加载（`loadvue` eager: false），首次使用表单时才拉 chunk。
+- 递归渲染大对象时注意字段数量；自定义组件通过 `cmComp(key)` 按需注入。
+
+## peerDependencies 建议
+
+```json
+{
+  "peerDependencies": {
+    "vue": "^3.4.0",
+    "@estun/asai-vue-host": "^1.0.0",
+    "@estun/asai-vue-host-popbox": "^1.0.0"
+  }
+}
+```
+
+---
+
+## 核心组件
+
+### AsaiFormLi
+
+| Props | 说明 |
+|-------|------|
+| `ujt` | 全局上下文 |
+| `asaidata` | 表单配置（rule、lang） |
+| `formdata` | 表单数据（双向） |
+| `opt.isedit` | 编辑 / 添加模式 |
+
+**渲染逻辑：**
+
+1. `noedit`/`noadd` == 2 → 只读（AsaiFormShow）
+2. 值为对象 → 递归；基本类型 → AsaiInput
+3. `noadd`/`noedit` == 1 → 隐藏
+
+### asaidata 配置
+
+| 参数 | 说明 |
+|------|------|
+| `rule[key].noedit/noadd` | 0=正常, 1=隐藏, 2=只读 |
+| `rule[key].require` | 必填 |
+| `rule[key].type` | text/number 等 |
+| `lang[key]` | 字段标签 |
+| `cmComp(key)` | 自定义组件钩子 |
+
+## 文件结构
+
+```
+asai-vue-host-form/
+├── src/components/asui/form/
+│   ├── AsaiFormLi.vue / AsaiFormShow.vue
+│   └── AsaiUploadImgCut*.vue
+└── README.md
+```

package/dist/{AsaiForm-DZVbpIN-.mjs → AsaiForm-DE5DGkqW.mjs}

@@ -8,7 +8,7 @@ const A = { class: "as-form-area" }, f = /* @__PURE__ */ p({
   },
   setup(e) {
     const a = e, { $fn: s } = a.ujt, { get: r, clear: m } = s.createComponentLoader({
-      files: /* @__PURE__ */ Object.assign({ "./AsaiFormLabel.vue": () => import("./AsaiFormLabel-BAXvUybW.mjs"), "./AsaiFormLabelArea.vue": () => import("./AsaiFormLabelArea-CmjCZFfF.mjs"), "./AsaiFormLi.vue": () => import("./AsaiFormLi-B-Po6qaB.mjs"), "./AsaiFormObject.vue": () => import("./AsaiFormObject-B8WHlNwq.mjs"), "./AsaiFormShow.vue": () => import("./AsaiFormShow-Da4NJXK7.mjs"), "./AsaiInput.vue": () => import("./AsaiInput-DahcJZqh.mjs"), "./AsaiRichEditor.vue": () => import("./AsaiRichEditor-DDOCr12f.mjs"), "./AsaiSelect.vue": () => import("./AsaiSelect-B4KZbNRO.mjs"), "./AsaiSelectCl.vue": () => import("./AsaiSelectCl-DY_5Y--8.mjs"), "./AsaiSelectLv.vue": () => import("./AsaiSelectLv-DNjfTp67.mjs"), "./AsaiTextJson.vue": () => import("./AsaiTextJson-Dr7yX0_I.mjs"), "./AsaiTextarea.vue": () => import("./AsaiTextarea-O38xA-tq.mjs"), "./AsaiUpBinary.vue": () => import("./AsaiUpBinary-DFmYr2_2.mjs"), "./AsaiUpload.vue": () => import("./AsaiUpload-D4kzZ5_G.mjs"), "./AsaiUploadImg.vue": () => import("./AsaiUploadImg-D8mMVNdc.mjs"), "./AsaiUploadImgCut.vue": () => import("./AsaiUploadImgCut-B3Y2hppn.mjs"), "./AsaiUploadImgCutPop.vue": () => import("./AsaiUploadImgCutPop-0gVLGw9m.mjs") }),
+      files: /* @__PURE__ */ Object.assign({ "./AsaiFormLabel.vue": () => import("./AsaiFormLabel-BAXvUybW.mjs"), "./AsaiFormLabelArea.vue": () => import("./AsaiFormLabelArea-CmjCZFfF.mjs"), "./AsaiFormLi.vue": () => import("./AsaiFormLi-B-Po6qaB.mjs"), "./AsaiFormObject.vue": () => import("./AsaiFormObject-B8WHlNwq.mjs"), "./AsaiFormShow.vue": () => import("./AsaiFormShow-Da4NJXK7.mjs"), "./AsaiInput.vue": () => import("./AsaiInput-D4BZoHDc.mjs"), "./AsaiRichEditor.vue": () => import("./AsaiRichEditor-H9WK-q7h.mjs"), "./AsaiRichEditorToolbar.vue": () => import("./AsaiRichEditorToolbar-BleVnkxV.mjs"), "./AsaiSelect.vue": () => import("./AsaiSelect-B4KZbNRO.mjs"), "./AsaiSelectCl.vue": () => import("./AsaiSelectCl-Cl6N0v40.mjs"), "./AsaiSelectLv.vue": () => import("./AsaiSelectLv-DNjfTp67.mjs"), "./AsaiTextJson.vue": () => import("./AsaiTextJson-Dr7yX0_I.mjs"), "./AsaiTextarea.vue": () => import("./AsaiTextarea-O38xA-tq.mjs"), "./AsaiUpBinary.vue": () => import("./AsaiUpBinary-CBV4sACD.mjs"), "./AsaiUpload.vue": () => import("./AsaiUpload-BQTw42KS.mjs"), "./AsaiUploadImg.vue": () => import("./AsaiUploadImg-CSQXvm8H.mjs"), "./AsaiUploadImgCut.vue": () => import("./AsaiUploadImgCut-DTWuaOl8.mjs"), "./AsaiUploadImgCutPop.vue": () => import("./AsaiUploadImgCutPop-0gVLGw9m.mjs") }),
       // 扫描当前目录下所有.vue文件
       eager: !1,
       // 异步加载（按需加载）

package/dist/{AsaiInput-DahcJZqh.mjs → AsaiInput-D4BZoHDc.mjs}

@@ -8,9 +8,7 @@ const V = /* @__PURE__ */ s({
     formkey: {}
   },
   setup(a) {
-    const t = a, { $fn: e } = t.ujt, l = c(() => e.As.toArr(t.asaidata?.lang?.[t.formkey + "data"]) || e.As.toArr(
-      t.asaidata?.rule?.[t.formkey]?.[t.formkey + "data"]
-    ) || e.As.toArr(e.lg(t.asaidata?.rule?.[t.formkey]?.data)) || []);
+    const t = a, { $fn: e } = t.ujt, l = c(() => e.As.toArr(t.asaidata?.lang?.[t.formkey + "data"]) || e.As.toArr(t.asaidata?.rule?.[t.formkey]?.[t.formkey + "data"]) || e.As.toArr(e.lg(t.asaidata?.rule?.[t.formkey]?.data)) || []);
     return (j, o) => {
       const y = f("AsfCheck"), i = f("AsfInput"), k = f("AsaiFormLabel");
       return d(), r(k, {

package/dist/AsaiRichEditor-H9WK-q7h.mjs

@@ -0,0 +1,125 @@
+import { defineComponent as H, defineAsyncComponent as U, ref as m, onMounted as j, onBeforeUnmount as z, createElementBlock as y, openBlock as v, normalizeStyle as g, createVNode as B, createElementVNode as x, unref as w, createCommentVNode as _, withDirectives as N, vModelText as F, nextTick as T } from "vue";
+import { _ as S } from "./_plugin-vue_export-helper-CHgC5LLL.mjs";
+const W = { class: "as-richtext-content" }, O = ["placeholder"], P = /* @__PURE__ */ H({
+  __name: "AsaiRichEditor",
+  props: {
+    ujt: {},
+    asaidata: {},
+    formdata: {},
+    formkey: {}
+  },
+  setup(E) {
+    const C = U({
+      loader: () => import("./AsaiRichEditorToolbar-BleVnkxV.mjs"),
+      delay: 120
+    }), t = E, { $global: L } = t.ujt, u = {
+      img: { maxWidth: 288, quality: 0.8 },
+      imgurls: {}
+    }, p = m(null), o = m(null), M = m(null), r = m(t.asaidata?.rule?.[t.formkey]?.editorty || 0);
+    let d = null, h = null, c = null;
+    async function s() {
+      return d || (h || (h = import("./useRichEditorMedia-BOIU0Dbf.mjs").then((a) => (d = a.createRichEditorMedia(u), d))), h);
+    }
+    j(() => {
+      k(), s();
+    }), z(() => {
+      c && clearTimeout(c);
+    });
+    function k() {
+      o.value && (o.value.innerHTML = t.formdata[t.formkey]);
+    }
+    function R() {
+      const a = window.prompt("请输入链接地址");
+      a && f("createLink", { target: { value: a } });
+    }
+    function b(a) {
+      p.value.accept = `${a}/*`, T(() => p.value?.click());
+    }
+    async function D(a) {
+      const e = a.target.files?.[0];
+      if (!e) return;
+      const n = await s();
+      let i, l = "";
+      e.type.startsWith("image") ? (i = await n.compressFile(e), l = `<img src="${i}" style="max-width:100%">`) : (e.size > 1024 * 1024 ? i = URL.createObjectURL(e) : i = await n.compressFile(e), l = e.type.startsWith("video") ? `<video controls src="${i}" style="max-width:100%"></video>` : `<a href="${i}" download="${e.name}">${e.name}</a>`), f("insertHTML", { target: { value: l } });
+    }
+    async function V() {
+      const a = await s(), e = Object.keys(u.imgurls);
+      for (let n = 0; n < e.length; n++) {
+        const i = e[n];
+        u.imgurls[i] === "1" && a.compressImage(i).then((l) => {
+          u.imgurls[i] = l, t.formdata[t.formkey] = t.formdata[t.formkey].replaceAll(i, l);
+        });
+      }
+    }
+    async function $(a) {
+      a.preventDefault();
+      const e = await s(), n = a.clipboardData?.getData("text/html") || "", i = e.sanitize(n, 1) || a.clipboardData?.getData("text/plain") || "";
+      f("insertHTML", { target: { value: i } });
+    }
+    function A() {
+      if (!o.value) return;
+      const a = o.value.innerHTML;
+      t.formdata[t.formkey] = a, c && clearTimeout(c), c = setTimeout(() => {
+        s().then((e) => {
+          o.value && (t.formdata[t.formkey] = e.sanitize(o.value.innerHTML));
+        });
+      }, 300);
+    }
+    function f(a, e = null) {
+      if (o.value) {
+        if (e?.target?.tagName === "SELECT" && e?.target?.value) {
+          document.execCommand(a, !1, e.target.value);
+          return;
+        }
+        document.execCommand(a, !1, e?.target?.value);
+      }
+    }
+    function I() {
+      r.value++, r.value > 2 && (r.value = 0), T(k);
+    }
+    return (a, e) => (v(), y("div", {
+      class: "as-richtext-area",
+      style: g(t.asaidata.rule?.[t.formkey]?.style || {})
+    }, [
+      B(w(C), {
+        lang: w(L).lang.richtexteditor,
+        onExec: f,
+        onMedia: b,
+        onLink: R,
+        onUploadImg: V,
+        onChangeView: I
+      }, null, 8, ["lang"]),
+      x("div", W, [
+        r.value != 1 ? (v(), y("div", {
+          key: 0,
+          style: g({ width: r.value > 1 ? "50%" : "100%" }),
+          ref_key: "rfRichEditor",
+          ref: o,
+          contenteditable: "true",
+          onPaste: $,
+          onInput: A
+        }, null, 36)) : _("", !0),
+        r.value > 0 ? N((v(), y("textarea", {
+          key: 1,
+          placeholder: t?.opt?.placeholder || "",
+          ref_key: "rfRichCode",
+          ref: M,
+          "onUpdate:modelValue": e[0] || (e[0] = (n) => t.formdata[t.formkey] = n),
+          style: g({ width: r.value > 1 ? "50%" : "100%" })
+        }, null, 12, O)), [
+          [F, t.formdata[t.formkey]]
+        ]) : _("", !0)
+      ]),
+      x("input", {
+        ref_key: "fileInput",
+        ref: p,
+        type: "file",
+        hidden: "",
+        onChange: D
+      }, null, 544)
+    ], 4));
+  }
+}), J = /* @__PURE__ */ S(P, [["__scopeId", "data-v-5c6cb195"]]);
+export {
+  J as default
+};

package/dist/AsaiRichEditorToolbar-BleVnkxV.mjs

@@ -0,0 +1,135 @@
+import { defineComponent as k, createElementBlock as u, openBlock as s, createElementVNode as n, toDisplayString as l, Fragment as r, renderList as b } from "vue";
+import { _ as v } from "./_plugin-vue_export-helper-CHgC5LLL.mjs";
+const y = { class: "as-richtext-toolbar" }, C = { value: "" }, g = ["value"], p = { value: "p" }, x = ["value"], m = ["title"], f = ["title"], $ = ["title"], a = ["title"], L = ["title"], I = ["title"], j = ["title"], B = ["title"], E = /* @__PURE__ */ k({
+  __name: "AsaiRichEditorToolbar",
+  props: {
+    lang: {}
+  },
+  emits: ["exec", "media", "link", "uploadImg", "changeView"],
+  setup(i, { emit: d }) {
+    const o = d;
+    return (z, t) => (s(), u("div", y, [
+      n("select", {
+        onChange: t[0] || (t[0] = (e) => o("exec", "fontSize", e))
+      }, [
+        n("option", C, l(i.lang.fontsize), 1),
+        (s(), u(r, null, b(7, (e) => n("option", {
+          key: "size" + e,
+          value: e + 1
+        }, l((e + 1) * 2 + 6) + "px", 9, g)), 64))
+      ], 32),
+      n("select", {
+        onChange: t[1] || (t[1] = (e) => o("exec", "formatBlock", e))
+      }, [
+        n("option", p, l(i.lang.paragraph), 1),
+        (s(), u(r, null, b(6, (e) => n("option", {
+          key: "h" + e,
+          value: "h" + e
+        }, l(i.lang.title) + l(e), 9, x)), 64))
+      ], 32),
+      n("button", {
+        type: "button",
+        onClick: t[2] || (t[2] = (e) => o("exec", "bold")),
+        title: i.lang.bold
+      }, "B", 8, m),
+      n("button", {
+        type: "button",
+        onClick: t[3] || (t[3] = (e) => o("exec", "underline")),
+        title: i.lang.underline
+      }, "U", 8, f),
+      n("button", {
+        type: "button",
+        onClick: t[4] || (t[4] = (e) => o("exec", "italic")),
+        title: i.lang.italic
+      }, "I", 8, $),
+      n("button", {
+        type: "button",
+        onClick: t[5] || (t[5] = (e) => o("exec", "strikethrough")),
+        title: i.lang.strikethrough
+      }, "S", 8, a),
+      n("input", {
+        type: "color",
+        onInput: t[6] || (t[6] = (e) => o("exec", "foreColor", e)),
+        title: i.lang.foreColor
+      }, null, 40, L),
+      n("input", {
+        type: "color",
+        onInput: t[7] || (t[7] = (e) => o("exec", "backColor", e)),
+        title: i.lang.backColor
+      }, null, 40, I),
+      n("button", {
+        type: "button",
+        onClick: t[8] || (t[8] = (e) => o("exec", "insertOrderedList")),
+        title: i.lang.insertOrderedList
+      }, "有", 8, j),
+      n("button", {
+        type: "button",
+        onClick: t[9] || (t[9] = (e) => o("exec", "insertUnorderedList")),
+        title: i.lang.insertUnorderedList
+      }, "无", 8, B),
+      n("button", {
+        type: "button",
+        onClick: t[10] || (t[10] = (e) => o("exec", "justifyCenter")),
+        title: "居中"
+      }, "中"),
+      n("button", {
+        type: "button",
+        onClick: t[11] || (t[11] = (e) => o("exec", "justifyFull")),
+        title: "两端对齐"
+      }, "两"),
+      n("button", {
+        type: "button",
+        onClick: t[12] || (t[12] = (e) => o("exec", "justifyRight")),
+        title: "右对齐"
+      }, "右"),
+      n("button", {
+        type: "button",
+        onClick: t[13] || (t[13] = (e) => o("exec", "justifyLeft")),
+        title: "左对齐"
+      }, "左"),
+      n("button", {
+        type: "button",
+        onClick: t[14] || (t[14] = (e) => o("exec", "delete")),
+        title: "删除"
+      }, "删"),
+      n("button", {
+        type: "button",
+        onClick: t[15] || (t[15] = (e) => o("link")),
+        title: "链接"
+      }, "链"),
+      n("button", {
+        type: "button",
+        onClick: t[16] || (t[16] = (e) => o("exec", "unlink")),
+        title: "删除链接"
+      }, "除"),
+      n("button", {
+        type: "button",
+        onClick: t[17] || (t[17] = (e) => o("media", "image")),
+        title: "图片"
+      }, "🖼️"),
+      n("button", {
+        type: "button",
+        onClick: t[18] || (t[18] = (e) => o("media", "video")),
+        title: "视频"
+      }, "🎬"),
+      n("button", {
+        type: "button",
+        onClick: t[19] || (t[19] = (e) => o("media", "file")),
+        title: "文件"
+      }, "📎"),
+      n("button", {
+        type: "button",
+        onClick: t[20] || (t[20] = (e) => o("uploadImg")),
+        title: "上传"
+      }, "上"),
+      n("button", {
+        type: "button",
+        onClick: t[21] || (t[21] = (e) => o("changeView")),
+        title: "切换"
+      }, "HTML")
+    ]));
+  }
+}), T = /* @__PURE__ */ v(E, [["__scopeId", "data-v-bf97b430"]]);
+export {
+  T as default
+};

package/dist/AsaiSelectCl-Cl6N0v40.mjs

@@ -0,0 +1,41 @@
+import { defineComponent as n, computed as i, resolveComponent as m, createBlock as u, openBlock as c, withCtx as k, createVNode as y } from "vue";
+const j = /* @__PURE__ */ n({
+  __name: "AsaiSelectCl",
+  props: {
+    ujt: {},
+    asaidata: {},
+    formdata: {},
+    formkey: {}
+  },
+  setup(e) {
+    const a = e, { $fn: r } = a.ujt, f = i(() => {
+      let o;
+      return a.asaidata?.rule?.[a.formkey]?.[a.formkey + "data"]?.nodeMap?.size > 0 ? o = [...a.asaidata.rule[a.formkey][a.formkey + "data"].nodeMap].map((t) => [t[1].id, t[1].nm, a.asaidata.rule[a.formkey][a.formkey + "data"].depthMap.get(t[0])]).filter((t) => t && t[0] !== "asai") : o = (r.As.toArr(a.asaidata?.lang?.[a.formkey + "data"]) || r.As.toArr(r.lg(a.asaidata?.rule?.[a.formkey]?.data)) || []).filter((t) => t && t[0] !== "asai"), (!a.formdata[a.formkey] || a.formdata[a.formkey] === "asai") && (a.formdata[a.formkey] = o?.[0]?.[0] || "asai"), o;
+    });
+    return (o, t) => {
+      const d = m("AsfSelect"), l = m("AsaiFormLabel");
+      return c(), u(l, {
+        ujt: e.ujt,
+        asaidata: e.asaidata,
+        formdata: e.formdata,
+        formkey: e.formkey
+      }, {
+        default: k(() => [
+          y(d, {
+            ujt: e.ujt,
+            opt: {
+              ...a.asaidata.rule?.[e.formkey]?.opt || {},
+              selectdata: f.value
+            },
+            modelValue: a.formdata[e.formkey],
+            "onUpdate:modelValue": t[0] || (t[0] = (s) => a.formdata[e.formkey] = s)
+          }, null, 8, ["ujt", "opt", "modelValue"])
+        ]),
+        _: 1
+      }, 8, ["ujt", "asaidata", "formdata", "formkey"]);
+    };
+  }
+});
+export {
+  j as default
+};

package/dist/{AsaiUpBinary-DFmYr2_2.mjs → AsaiUpBinary-CBV4sACD.mjs}

@@ -81,7 +81,7 @@ const b = ["accept"], j = { key: 0 }, x = ["src", "alt", "title"], I = ["title"]
       }, 8, ["ujt", "asaidata", "formdata", "formkey"]);
     };
   }
-}), z = /* @__PURE__ */ U($, [["__scopeId", "data-v-535f25e7"]]);
+}), z = /* @__PURE__ */ U($, [["__scopeId", "data-v-e9910494"]]);
 export {
   z as default
 };

package/dist/{AsaiUpload-D4kzZ5_G.mjs → AsaiUpload-BQTw42KS.mjs}

@@ -90,7 +90,7 @@ const w = { key: 0 }, x = ["src", "alt", "title"], B = ["title"], I = ["title"],
       }, 8, ["ujt", "asaidata", "formdata", "formkey"]);
     };
   }
-}), P = /* @__PURE__ */ U(L, [["__scopeId", "data-v-a305b28a"]]);
+}), P = /* @__PURE__ */ U(L, [["__scopeId", "data-v-50ddd40b"]]);
 export {
   P as default
 };

package/dist/{AsaiUploadImg-D8mMVNdc.mjs → AsaiUploadImg-CSQXvm8H.mjs}

@@ -1,4 +1,4 @@
-import { defineComponent as j, ref as u, onMounted as F, resolveComponent as y, createElementBlock as m, openBlock as p, Fragment as A, createVNode as k, withCtx as C, createElementVNode as c, withModifiers as I, normalizeClass as U, toDisplayString as _ } from "vue";
+import { defineComponent as j, ref as f, onMounted as F, resolveComponent as y, createElementBlock as m, openBlock as p, Fragment as A, createVNode as k, withCtx as C, createElementVNode as c, withModifiers as I, normalizeClass as U, toDisplayString as _ } from "vue";
 import { _ as b } from "./_plugin-vue_export-helper-CHgC5LLL.mjs";
 const w = { key: 0 }, x = ["src"], L = ["title"], D = /* @__PURE__ */ j({
   __name: "AsaiUploadImg",
@@ -9,14 +9,14 @@ const w = { key: 0 }, x = ["src"], L = ["title"], D = /* @__PURE__ */ j({
     formkey: {}
   },
   setup(e) {
-    const a = e, { $fn: d, $global: o } = a.ujt, r = u(null), f = u(null), n = u("+");
+    const a = e, { $fn: d, $global: o } = a.ujt, r = f(null), u = f(null), n = f("+");
     F(() => {
       const l = "popupload" + a.formkey;
       o.pop[l] || (o.pop[l] = { stat: 0, full: 0, tit: "", params: {} });
     });
     const v = async (l) => {
       if (r.value.value) {
-        if (f.value = l.target.files[0], r.value.value = "", !f.value) {
+        if (u.value = l.target.files[0], r.value.value = "", !u.value) {
           n.value = d.lg("asai.fail");
           return;
         }
@@ -37,7 +37,7 @@ const w = { key: 0 }, x = ["src"], L = ["title"], D = /* @__PURE__ */ j({
           } catch (s) {
             n.value = d.lg("asai.fail") + " " + s.message;
           }
-        }, t.readAsDataURL(f.value);
+        }, t.readAsDataURL(u.value);
       }
     };
     function g() {
@@ -89,7 +89,7 @@ const w = { key: 0 }, x = ["src"], L = ["title"], D = /* @__PURE__ */ j({
       ], 64);
     };
   }
-}), B = /* @__PURE__ */ b(D, [["__scopeId", "data-v-0bfdd149"]]);
+}), B = /* @__PURE__ */ b(D, [["__scopeId", "data-v-36b7ec3b"]]);
 export {
   B as default
 };

package/dist/{AsaiUploadImgCut-B3Y2hppn.mjs → AsaiUploadImgCut-DTWuaOl8.mjs}

@@ -1,4 +1,4 @@
-import { defineComponent as B, ref as x, computed as Y, createElementBlock as M, openBlock as f, createElementVNode as h, withDirectives as S, withModifiers as d, normalizeStyle as D, vShow as U, Fragment as j, nextTick as A } from "vue";
+import { defineComponent as B, ref as x, computed as Y, createElementBlock as M, openBlock as f, createElementVNode as h, withDirectives as S, withModifiers as c, normalizeStyle as D, vShow as U, Fragment as j, nextTick as A } from "vue";
 import { _ as R } from "./_plugin-vue_export-helper-CHgC5LLL.mjs";
 const F = { class: "as-img-area" }, O = {
   key: 0,
@@ -13,7 +13,7 @@ const F = { class: "as-img-area" }, O = {
     params: {}
   },
   setup(E) {
-    const g = E, w = x(""), b = x(null), I = x(null), X = x(null), m = g.params.min || 1, i = x({
+    const g = E, w = x(""), k = x(null), I = x(null), X = x(null), m = g.params.min || 1, i = x({
       x: 0,
       y: 0,
       width: 0,
@@ -36,7 +36,7 @@ const F = { class: "as-img-area" }, O = {
     })), z = Y(
       () => i.value.width > 0 && i.value.height > 0
     ), L = () => {
-      const n = b.value, t = X.value;
+      const n = k.value, t = X.value;
       if (!n || !t) {
         console.error("Image or container element not found.");
         return;
@@ -77,22 +77,22 @@ const F = { class: "as-img-area" }, O = {
           e.value.originalX + o,
           i.value.maxWidth - i.value.width
         )
-      ), c = Math.max(
+      ), d = Math.max(
         0,
         Math.min(
           e.value.originalY + s,
           i.value.maxHeight - i.value.height
         )
       );
-      Object.assign(i.value, { x: r, y: c });
+      Object.assign(i.value, { x: r, y: d });
     }, W = (n) => {
       const t = window.event || n, a = t.touches ? t.touches[0] : t;
       if (e.value.type !== "resize") return;
       const o = a.clientX - e.value.startX, s = a.clientY - e.value.startY, r = e.value.direction;
-      let c = e.value.originalWidth, l = e.value.originalHeight, u = e.value.originalX, p = e.value.originalY;
+      let d = e.value.originalWidth, l = e.value.originalHeight, u = e.value.originalX, p = e.value.originalY;
       switch (r) {
         case "tr":
-          c = Math.max(
+          d = Math.max(
             m,
             Math.min(
               e.value.originalWidth + o,
@@ -101,25 +101,25 @@ const F = { class: "as-img-area" }, O = {
           ), l = Math.max(m, e.value.originalHeight - s), p = Math.max(0, e.value.originalY + s);
           break;
         case "tl":
-          c = Math.max(m, e.value.originalWidth - o), l = Math.max(m, e.value.originalHeight - s), u = Math.max(0, e.value.originalX + o), p = Math.max(0, e.value.originalY + s);
+          d = Math.max(m, e.value.originalWidth - o), l = Math.max(m, e.value.originalHeight - s), u = Math.max(0, e.value.originalX + o), p = Math.max(0, e.value.originalY + s);
           break;
         case "br":
-          c = Math.max(m, e.value.originalWidth + o), l = Math.max(m, e.value.originalHeight + s);
+          d = Math.max(m, e.value.originalWidth + o), l = Math.max(m, e.value.originalHeight + s);
           break;
         case "bl":
-          c = Math.max(m, e.value.originalWidth - o), l = Math.max(m, e.value.originalHeight + s), u = Math.max(0, e.value.originalX + o);
+          d = Math.max(m, e.value.originalWidth - o), l = Math.max(m, e.value.originalHeight + s), u = Math.max(0, e.value.originalX + o);
           break;
       }
-      c = Math.min(c, i.value.maxWidth - u), l = Math.min(l, i.value.maxHeight - p), Object.assign(i.value, {
+      d = Math.min(d, i.value.maxWidth - u), l = Math.min(l, i.value.maxHeight - p), Object.assign(i.value, {
         x: u,
         y: p,
-        width: c,
+        width: d,
         height: l
       });
     }, y = () => {
       e.value.type = null, window.removeEventListener("mousemove", H), window.removeEventListener("touchmove", H), window.removeEventListener("mousemove", W), window.removeEventListener("touchmove", W), window.removeEventListener("mouseup", y), window.removeEventListener("touchend", y);
     }, C = () => {
-      const n = b.value, t = n.naturalWidth / n.width, a = n.naturalHeight / n.height, o = Math.min(
+      const n = k.value, t = n.naturalWidth / n.width, a = n.naturalHeight / n.height, o = Math.min(
         i.value.width * t,
         n.naturalWidth
       ), s = Math.min(
@@ -140,8 +140,8 @@ const F = { class: "as-img-area" }, O = {
         let l = g.params.asaidata.rule[g.params.formkey].data, u = {};
         if (l.width < o || l.height < s) {
           l.height / s > l.width / o ? (u.width = l.width, u.height = s * l.width / o) : (u.width = o * l.height / s, u.height = l.height);
-          const p = I.value, k = document.createElement("canvas");
-          k.width = u.width, k.height = u.height, k.getContext("2d").drawImage(p, 0, 0, u.width, u.height), w.value = k.toDataURL("image/png", 0.9);
+          const p = I.value, b = document.createElement("canvas");
+          b.width = u.width, b.height = u.height, b.getContext("2d").drawImage(p, 0, 0, u.width, u.height), w.value = b.toDataURL("image/png", 0.9);
         }
       });
     }, T = () => {
@@ -165,35 +165,35 @@ const F = { class: "as-img-area" }, O = {
         }, [
           h("img", {
             ref_key: "previewImage",
-            ref: b,
+            ref: k,
             src: g.params.base64Data,
             onLoad: L
           }, null, 40, P),
           S(h("div", {
             class: "as-img-crop-box",
             style: D($.value),
-            onMousedown: t[8] || (t[8] = d((a) => v("move"), ["prevent"])),
-            onTouchstart: t[9] || (t[9] = d((a) => v("move"), ["prevent"]))
+            onMousedown: t[8] || (t[8] = c((a) => v("move"), ["prevent"])),
+            onTouchstart: t[9] || (t[9] = c((a) => v("move"), ["prevent"]))
           }, [
             h("div", {
               class: "as-img-crop-handle top-left",
-              onMousedown: t[0] || (t[0] = d((a) => v("resize", "tl"), ["stop"])),
-              onTouchstart: t[1] || (t[1] = d((a) => v("resize", "tl"), ["stop"]))
+              onMousedown: t[0] || (t[0] = c((a) => v("resize", "tl"), ["stop"])),
+              onTouchstart: t[1] || (t[1] = c((a) => v("resize", "tl"), ["stop"]))
             }, null, 32),
             h("div", {
               class: "as-img-crop-handle top-right",
-              onMousedown: t[2] || (t[2] = d((a) => v("resize", "tr"), ["stop"])),
-              onTouchstart: t[3] || (t[3] = d((a) => v("resize", "tr"), ["stop"]))
+              onMousedown: t[2] || (t[2] = c((a) => v("resize", "tr"), ["stop"])),
+              onTouchstart: t[3] || (t[3] = c((a) => v("resize", "tr"), ["stop"]))
             }, null, 32),
             h("div", {
               class: "as-img-crop-handle bottom-left",
-              onMousedown: t[4] || (t[4] = d((a) => v("resize", "bl"), ["stop"])),
-              onTouchstart: t[5] || (t[5] = d((a) => v("resize", "bl"), ["stop"]))
+              onMousedown: t[4] || (t[4] = c((a) => v("resize", "bl"), ["stop"])),
+              onTouchstart: t[5] || (t[5] = c((a) => v("resize", "bl"), ["stop"]))
             }, null, 32),
             h("div", {
               class: "as-img-crop-handle bottom-right",
-              onMousedown: t[6] || (t[6] = d((a) => v("resize", "br"), ["stop"])),
-              onTouchstart: t[7] || (t[7] = d((a) => v("resize", "br"), ["stop"]))
+              onMousedown: t[6] || (t[6] = c((a) => v("resize", "br"), ["stop"])),
+              onTouchstart: t[7] || (t[7] = c((a) => v("resize", "br"), ["stop"]))
             }, null, 32)
           ], 36), [
             [U, z.value]
@@ -211,7 +211,7 @@ const F = { class: "as-img-area" }, O = {
       ])
     ]));
   }
-}), Z = /* @__PURE__ */ R(G, [["__scopeId", "data-v-24cc1149"]]);
+}), Z = /* @__PURE__ */ R(G, [["__scopeId", "data-v-f328eb1d"]]);
 export {
   Z as default
 };