@qxs-bns/components 0.0.1

package/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./src/defaults.cjs"),o=require("./src/file-upload/index.cjs"),s=require("./src/fixed-action-bar/index.cjs"),t=require("./src/image-upload/index.cjs"),i=require("./src/photo-crop-tool/index.cjs"),l=e.default.install,r=e.default.version;exports.default=e.default;exports.QxsFileUpload=o.QxsFileUpload;exports.QxsFixedActionBar=s.QxsFixedActionBar;exports.QxsImageUpload=t.QxsImageUpload;exports.QxsPhotoCropTool=i.QxsPhotoCropTool;exports.install=l;exports.version=r;

package/index.js

@@ -0,0 +1,15 @@
+import o from "./src/defaults.js";
+import { QxsFileUpload as x } from "./src/file-upload/index.js";
+import { QxsFixedActionBar as i } from "./src/fixed-action-bar/index.js";
+import { QxsImageUpload as n } from "./src/image-upload/index.js";
+import { QxsPhotoCropTool as f } from "./src/photo-crop-tool/index.js";
+const t = o.install, e = o.version;
+export {
+  x as QxsFileUpload,
+  i as QxsFixedActionBar,
+  n as QxsImageUpload,
+  f as QxsPhotoCropTool,
+  o as default,
+  t as install,
+  e as version
+};

package/package.json

@@ -0,0 +1,44 @@
+{
+  "name": "@qxs-bns/components",
+  "version": "0.0.1",
+  "description": "Vue 3 Component Library",
+  "main": "./index.cjs",
+  "module": "./index.js",
+  "types": "./types/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./types/index.d.ts",
+      "import": "./index.js",
+      "require": "./index.cjs"
+    },
+    "./theme-chalk/*": "./theme-chalk/*"
+  },
+  "keywords": [
+    "vue",
+    "component",
+    "ui",
+    "vue3"
+  ],
+  "homepage": "https://trry-hub.github.io/qxs-bns/",
+  "bugs": {
+    "url": "https://github.com/trry-hub/qxs-bns/issues"
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/trry-hub/qxs-bns.git"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "peerDependencies": {
+    "vue": ">=3.3.0",
+    "element-plus": ">=2.4.0",
+    "@element-plus/icons-vue": "^2.0.0"
+  },
+  "dependencies": {
+    "@qxs-bns/hooks": "0.0.1",
+    "@qxs-bns/utils": "0.0.1"
+  }
+}

package/package.json.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="0.0.1";exports.version=e;

package/package.json.js

@@ -0,0 +1,4 @@
+const o = "0.0.1";
+export {
+  o as version
+};

package/packages/hooks/src/use-namespace/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("vue"),m="qxs",i="is-";function c(t,o,a,v,p){let u=`${t}-${o}`;return a&&(u+=`-${a}`),v&&(u+=`__${v}`),p&&(u+=`--${p}`),u}const $=Symbol("namespaceContextKey");function N(t){const o=r.getCurrentInstance()?r.inject($,r.ref(m)):r.ref(m);return r.computed(()=>r.unref(o)||m)}function y(t,o){const a=N();return{namespace:a,b:(e="")=>c(a.value,t,e,"",""),e:e=>e?c(a.value,t,"",e,""):"",m:e=>e?c(a.value,t,"","",e):"",be:(e,s)=>e&&s?c(a.value,t,e,s,""):"",em:(e,s)=>e&&s?c(a.value,t,"",e,s):"",bm:(e,s)=>e&&s?c(a.value,t,e,"",s):"",bem:(e,s,n)=>e&&s&&n?c(a.value,t,e,s,n):"",is:(e,...s)=>{const n=s.length>=1?s[0]:!0;return e&&n?`${i}${e}`:""},cssVar:e=>{const s={};for(const n in e)e[n]&&(s[`--${a.value}-${n}`]=e[n]);return s},cssVarName:e=>`--${a.value}-${e}`,cssVarBlock:e=>{const s={};for(const n in e)e[n]&&(s[`--${a.value}-${t}-${n}`]=e[n]);return s},cssVarBlockName:e=>`--${a.value}-${t}-${e}`}}exports.defaultNamespace=m;exports.namespaceContextKey=$;exports.useGetDerivedNamespace=N;exports.useNamespace=y;

package/packages/hooks/src/use-namespace/index.js

@@ -0,0 +1,49 @@
+import { getCurrentInstance as p, inject as N, ref as v, computed as V, unref as y } from "vue";
+const $ = "qxs", i = "is-";
+function c(n, u, a, o, m) {
+  let r = `${n}-${u}`;
+  return a && (r += `-${a}`), o && (r += `__${o}`), m && (r += `--${m}`), r;
+}
+const l = Symbol("namespaceContextKey");
+function B(n) {
+  const u = p() ? N(l, v($)) : v($);
+  return V(() => y(u) || $);
+}
+function D(n, u) {
+  const a = B();
+  return {
+    namespace: a,
+    b: (s = "") => c(a.value, n, s, "", ""),
+    e: (s) => s ? c(a.value, n, "", s, "") : "",
+    m: (s) => s ? c(a.value, n, "", "", s) : "",
+    be: (s, e) => s && e ? c(a.value, n, s, e, "") : "",
+    em: (s, e) => s && e ? c(a.value, n, "", s, e) : "",
+    bm: (s, e) => s && e ? c(a.value, n, s, "", e) : "",
+    bem: (s, e, t) => s && e && t ? c(a.value, n, s, e, t) : "",
+    is: (s, ...e) => {
+      const t = e.length >= 1 ? e[0] : !0;
+      return s && t ? `${i}${s}` : "";
+    },
+    // css
+    cssVar: (s) => {
+      const e = {};
+      for (const t in s)
+        s[t] && (e[`--${a.value}-${t}`] = s[t]);
+      return e;
+    },
+    cssVarName: (s) => `--${a.value}-${s}`,
+    cssVarBlock: (s) => {
+      const e = {};
+      for (const t in s)
+        s[t] && (e[`--${a.value}-${n}-${t}`] = s[t]);
+      return e;
+    },
+    cssVarBlockName: (s) => `--${a.value}-${n}-${s}`
+  };
+}
+export {
+  $ as defaultNamespace,
+  l as namespaceContextKey,
+  B as useGetDerivedNamespace,
+  D as useNamespace
+};

package/src/components.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./file-upload/index.cjs"),o=require("./fixed-action-bar/index.cjs"),i=require("./image-upload/index.cjs"),r=require("./photo-crop-tool/index.cjs");exports.QxsFileUpload=e.QxsFileUpload;exports.QxsFixedActionBar=o.QxsFixedActionBar;exports.QxsImageUpload=i.QxsImageUpload;exports.QxsPhotoCropTool=r.QxsPhotoCropTool;

package/src/components.js

@@ -0,0 +1,10 @@
+import { QxsFileUpload as x } from "./file-upload/index.js";
+import { QxsFixedActionBar as p } from "./fixed-action-bar/index.js";
+import { QxsImageUpload as m } from "./image-upload/index.js";
+import { QxsPhotoCropTool as f } from "./photo-crop-tool/index.js";
+export {
+  x as QxsFileUpload,
+  p as QxsFixedActionBar,
+  m as QxsImageUpload,
+  f as QxsPhotoCropTool
+};

package/src/defaults.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./components.cjs"),t=require("./make-installer.cjs"),l=t.makeInstaller(e);exports.default=l;

package/src/defaults.js

@@ -0,0 +1,6 @@
+import * as o from "./components.js";
+import { makeInstaller as t } from "./make-installer.js";
+const a = t(o);
+export {
+  a as default
+};

package/src/file-upload/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../withInstall.cjs"),l=require("./src/file-upload.vue.cjs"),e=t.withInstall(l.default);exports.QxsFileUpload=e;exports.default=e;

package/src/file-upload/index.js

@@ -0,0 +1,7 @@
+import { withInstall as o } from "../withInstall.js";
+import t from "./src/file-upload.vue.js";
+const l = o(t);
+export {
+  l as QxsFileUpload,
+  l as default
+};

package/src/file-upload/src/file-upload.vue.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),N=require("../../../node_modules/.pnpm/@element-plus_icons-vue@2.3.1_vue@3.5.12_typescript@5.6.3_/node_modules/@element-plus/icons-vue/dist/index.cjs"),h=require("../../../packages/hooks/src/use-namespace/index.cjs"),c=require("../../../node_modules/.pnpm/element-plus@2.8.7_vue@3.5.12_typescript@5.6.3_/node_modules/element-plus/es/components/message/index.cjs"),E={class:"slot"},x={key:0,class:"el-upload__tip"},C={style:{display:"inline-block"}},V=e.defineComponent({name:"QxsFileUpload",__name:"file-upload",props:{action:{},headers:{},data:{},name:{default:"file"},size:{default:20},max:{default:3},accept:{default:"zip,rar"},files:{default:()=>[]},notip:{type:Boolean,default:!1},ext:{}},emits:["onSuccess"],setup(d,{emit:u}){const a=d,p=u,m=h.useNamespace("file-upload"),i=e.computed(()=>a.accept.split(",").map(t=>t.split("/").pop())),f=t=>{var r;const l=(r=t.name.split(".").at(-1))!=null?r:"",s=i.value.includes(l),n=t.size/1024/1024<a.size;return s||c.ElMessage.error(`上传文件只支持 ${i.value.join(" / ")} 格式！`),n||c.ElMessage.error(`上传文件大小不能超过 ${a.size}MB！`),s&&n},_=()=>{c.ElMessage.warning("文件上传超过限制")},v=(t,o,l)=>{p("onSuccess",t,o,l)};return(t,o)=>{const l=e.resolveComponent("el-icon"),s=e.resolveComponent("el-alert"),n=e.resolveComponent("el-upload");return e.openBlock(),e.createBlock(n,{headers:t.headers,action:t.action,data:t.data,name:t.name,"before-upload":f,"on-exceed":_,"on-success":v,"file-list":t.files,limit:t.max,drag:"",class:e.normalizeClass(e.unref(m).e("control"))},{tip:e.withCtx(()=>[t.notip?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",x,[e.createElementVNode("div",C,[e.createVNode(s,{title:`上传文件支持 ${i.value.join(" / ")} 格式，单个文件大小不超过 ${t.size}MB，且文件数量不超过 ${t.max} 个`,type:"info","show-icon":"",closable:!1},null,8,["title"])])]))]),default:e.withCtx(()=>[e.createElementVNode("div",E,[e.createVNode(l,{class:"el-icon--upload"},{default:e.withCtx(()=>[e.createVNode(e.unref(N.UploadFilled))]),_:1}),o[0]||(o[0]=e.createElementVNode("div",{class:"el-upload__text"},[e.createTextVNode(" 将文件拖到此处，或"),e.createElementVNode("em",null,"点击上传")],-1))])]),_:1},8,["headers","action","data","name","file-list","limit","class"])}}});exports.default=V;

package/src/file-upload/src/file-upload.vue.js

@@ -0,0 +1,82 @@
+import { defineComponent as B, computed as x, resolveComponent as c, openBlock as u, createBlock as C, normalizeClass as E, unref as f, withCtx as d, createElementBlock as $, createElementVNode as s, createVNode as r, createCommentVNode as b, createTextVNode as S } from "vue";
+import { UploadFilled as V } from "../../../node_modules/.pnpm/@element-plus_icons-vue@2.3.1_vue@3.5.12_typescript@5.6.3_/node_modules/@element-plus/icons-vue/dist/index.js";
+import { useNamespace as g } from "../../../packages/hooks/src/use-namespace/index.js";
+import { ElMessage as p } from "../../../node_modules/.pnpm/element-plus@2.8.7_vue@3.5.12_typescript@5.6.3_/node_modules/element-plus/es/components/message/index.js";
+const w = { class: "slot" }, M = {
+  key: 0,
+  class: "el-upload__tip"
+}, U = { style: { display: "inline-block" } }, Q = /* @__PURE__ */ B({
+  name: "QxsFileUpload",
+  __name: "file-upload",
+  props: {
+    action: {},
+    headers: {},
+    data: {},
+    name: { default: "file" },
+    size: { default: 20 },
+    max: { default: 3 },
+    accept: { default: "zip,rar" },
+    files: { default: () => [] },
+    notip: { type: Boolean, default: !1 },
+    ext: {}
+  },
+  emits: ["onSuccess"],
+  setup(_, { emit: h }) {
+    const n = _, v = h, z = g("file-upload"), i = x(() => n.accept.split(",").map((e) => e.split("/").pop())), k = (e) => {
+      var m;
+      const t = (m = e.name.split(".").at(-1)) != null ? m : "", l = i.value.includes(t), a = e.size / 1024 / 1024 < n.size;
+      return l || p.error(`上传文件只支持 ${i.value.join(" / ")} 格式！`), a || p.error(`上传文件大小不能超过 ${n.size}MB！`), l && a;
+    }, N = () => {
+      p.warning("文件上传超过限制");
+    }, y = (e, o, t) => {
+      v("onSuccess", e, o, t);
+    };
+    return (e, o) => {
+      const t = c("el-icon"), l = c("el-alert"), a = c("el-upload");
+      return u(), C(a, {
+        headers: e.headers,
+        action: e.action,
+        data: e.data,
+        name: e.name,
+        "before-upload": k,
+        "on-exceed": N,
+        "on-success": y,
+        "file-list": e.files,
+        limit: e.max,
+        drag: "",
+        class: E(f(z).e("control"))
+      }, {
+        tip: d(() => [
+          e.notip ? b("", !0) : (u(), $("div", M, [
+            s("div", U, [
+              r(l, {
+                title: `上传文件支持 ${i.value.join(" / ")} 格式，单个文件大小不超过 ${e.size}MB，且文件数量不超过 ${e.max} 个`,
+                type: "info",
+                "show-icon": "",
+                closable: !1
+              }, null, 8, ["title"])
+            ])
+          ]))
+        ]),
+        default: d(() => [
+          s("div", w, [
+            r(t, { class: "el-icon--upload" }, {
+              default: d(() => [
+                r(f(V))
+              ]),
+              _: 1
+            }),
+            o[0] || (o[0] = s("div", { class: "el-upload__text" }, [
+              S(" 将文件拖到此处，或"),
+              s("em", null, "点击上传")
+            ], -1))
+          ])
+        ]),
+        _: 1
+      }, 8, ["headers", "action", "data", "name", "file-list", "limit", "class"]);
+    };
+  }
+});
+export {
+  Q as default
+};

package/src/file-upload/src/file-upload.vue2.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./file-upload.vue.cjs");exports.default=e.default;

package/src/file-upload/src/file-upload.vue2.js

@@ -0,0 +1,4 @@
+import f from "./file-upload.vue.js";
+export {
+  f as default
+};

package/src/fixed-action-bar/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../withInstall.cjs"),i=require("./src/fixed-action-bar.vue.cjs"),e=t.withInstall(i.default);exports.QxsFixedActionBar=e;exports.default=e;

package/src/fixed-action-bar/index.js

@@ -0,0 +1,7 @@
+import { withInstall as t } from "../withInstall.js";
+import o from "./src/fixed-action-bar.vue.js";
+const a = t(o);
+export {
+  a as QxsFixedActionBar,
+  a as default
+};

package/src/fixed-action-bar/src/fixed-action-bar.vue.cjs

@@ -0,0 +1 @@
+"use strict";var E=Object.defineProperty;var f=Object.getOwnPropertySymbols;var S=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable;var p=(o,n,t)=>n in o?E(o,n,{enumerable:!0,configurable:!0,writable:!0,value:t}):o[n]=t,h=(o,n)=>{for(var t in n||(n={}))S.call(n,t)&&p(o,t,n[t]);if(f)for(var t of f(n))y.call(n,t)&&p(o,t,n[t]);return o};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),_=require("../../../packages/hooks/src/use-namespace/index.cjs"),l=require("../../../node_modules/.pnpm/@vueuse_core@10.11.1_vue@3.5.12_typescript@5.6.3_/node_modules/@vueuse/core/index.cjs"),$=e.defineComponent({name:"QxsFixedActionBar",inheritAttrs:!1,__name:"fixed-action-bar",props:{padding:{type:String,default:"8px"}},setup(o){const n=o,t=_.useNamespace("fixed-action-bar"),b=e.useAttrs(),s=e.ref(!1),a=e.ref(null),i=e.ref(null),d=l.useParentElement(i),{height:g}=l.useElementSize(a,void 0,{box:"border-box"}),{left:w}=l.useElementBounding(d),{width:x}=l.useElementSize(d,void 0,{box:"border-box"});function r(){const c=window.scrollY||document.documentElement.scrollTop,m=window.innerHeight||document.documentElement.clientHeight,v=document.documentElement.scrollHeight;s.value=Math.ceil(c+m)>=v}e.onMounted(()=>{r(),window.addEventListener("scroll",r)}),e.onUnmounted(()=>{window.removeEventListener("scroll",r)});const u=e.computed(()=>h({width:`${x||0}px`,left:`${w}px`,class:`${s.value?"":t.is("shadow")} ${b.class||""}`},t.cssVarBlock({"actionbar-padding":`${n.padding}`})));return(c,m)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("div",{ref_key:"placeholderRef",ref:i,style:e.normalizeStyle(`width: 100%; height: ${e.unref(g)}px`)},null,4),e.createElementVNode("div",{ref_key:"actionbar",ref:a,style:e.normalizeStyle(u.value),class:e.normalizeClass([u.value.class,e.unref(t).e("actionbar")]),"data-fixed-calc-width":""},[e.renderSlot(c.$slots,"default")],6)],64))}});exports.default=$;

package/src/fixed-action-bar/src/fixed-action-bar.vue.js

@@ -0,0 +1,63 @@
+var $ = Object.defineProperty;
+var u = Object.getOwnPropertySymbols;
+var B = Object.prototype.hasOwnProperty, S = Object.prototype.propertyIsEnumerable;
+var p = (o, t, e) => t in o ? $(o, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[t] = e, f = (o, t) => {
+  for (var e in t || (t = {}))
+    B.call(t, e) && p(o, e, t[e]);
+  if (u)
+    for (var e of u(t))
+      S.call(t, e) && p(o, e, t[e]);
+  return o;
+};
+import { defineComponent as k, useAttrs as H, ref as c, onMounted as z, onUnmounted as A, computed as L, openBlock as C, createElementBlock as F, Fragment as M, createElementVNode as h, normalizeStyle as w, unref as x, normalizeClass as N, renderSlot as P } from "vue";
+import { useNamespace as R } from "../../../packages/hooks/src/use-namespace/index.js";
+import { useParentElement as T, useElementSize as b, useElementBounding as V } from "../../../node_modules/.pnpm/@vueuse_core@10.11.1_vue@3.5.12_typescript@5.6.3_/node_modules/@vueuse/core/index.js";
+const Y = /* @__PURE__ */ k({
+  name: "QxsFixedActionBar",
+  inheritAttrs: !1,
+  __name: "fixed-action-bar",
+  props: {
+    padding: {
+      type: String,
+      default: "8px"
+    }
+  },
+  setup(o) {
+    const t = o, e = R("fixed-action-bar"), g = H(), r = c(!1), a = c(null), s = c(null), i = T(s), { height: v } = b(a, void 0, { box: "border-box" }), { left: E } = V(i), { width: y } = b(i, void 0, { box: "border-box" });
+    function n() {
+      const l = window.scrollY || document.documentElement.scrollTop, m = window.innerHeight || document.documentElement.clientHeight, _ = document.documentElement.scrollHeight;
+      r.value = Math.ceil(l + m) >= _;
+    }
+    z(() => {
+      n(), window.addEventListener("scroll", n);
+    }), A(() => {
+      window.removeEventListener("scroll", n);
+    });
+    const d = L(() => f({
+      width: `${y || 0}px`,
+      left: `${E}px`,
+      class: `${r.value ? "" : e.is("shadow")} ${g.class || ""}`
+    }, e.cssVarBlock({
+      "actionbar-padding": `${t.padding}`
+    })));
+    return (l, m) => (C(), F(M, null, [
+      h("div", {
+        ref_key: "placeholderRef",
+        ref: s,
+        style: w(`width: 100%; height: ${x(v)}px`)
+      }, null, 4),
+      h("div", {
+        ref_key: "actionbar",
+        ref: a,
+        style: w(d.value),
+        class: N([d.value.class, x(e).e("actionbar")]),
+        "data-fixed-calc-width": ""
+      }, [
+        P(l.$slots, "default")
+      ], 6)
+    ], 64));
+  }
+});
+export {
+  Y as default
+};

package/src/fixed-action-bar/src/fixed-action-bar.vue2.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./fixed-action-bar.vue.cjs");exports.default=e.default;

package/src/fixed-action-bar/src/fixed-action-bar.vue2.js

@@ -0,0 +1,4 @@
+import f from "./fixed-action-bar.vue.js";
+export {
+  f as default
+};

package/src/image-upload/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../withInstall.cjs"),l=require("./src/image-upload.vue.cjs"),e=t.withInstall(l.default);exports.QxsImageUpload=e;exports.default=e;

package/src/image-upload/index.js

@@ -0,0 +1,7 @@
+import { withInstall as o } from "../withInstall.js";
+import t from "./src/image-upload.vue.js";
+const r = o(t);
+export {
+  r as QxsImageUpload,
+  r as default
+};

package/src/image-upload/src/image-upload.vue.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),p=require("../../../node_modules/.pnpm/@element-plus_icons-vue@2.3.1_vue@3.5.12_typescript@5.6.3_/node_modules/@element-plus/icons-vue/dist/index.cjs"),C=require("../../../packages/hooks/src/use-namespace/index.cjs"),u=require("../../../node_modules/.pnpm/element-plus@2.8.7_vue@3.5.12_typescript@5.6.3_/node_modules/element-plus/es/components/message/index.cjs"),$={key:1,class:"image"},B={class:"mask"},E={class:"actions"},S={key:0,class:"el-upload__tip-text"},z={style:{display:"inline-block"}},b=e.defineComponent({name:"QxsImageUpload",__name:"image-upload",props:{action:{},headers:{},data:{},name:{default:"file"},url:{default:""},size:{default:20},width:{default:160},accept:{default:"image/jpeg,image/jpg,image/png,image/gif"},height:{default:90},placeholder:{default:"点击上传图片"},notip:{type:Boolean,default:!1},tipText:{},beforeUpload:{}},emits:["update:url","onSuccess"],setup(m,{emit:h}){const s=m,c=h,d=C.useNamespace("image-upload"),l=e.ref({imageViewerVisible:!1,progress:{preview:"",percent:0}}),n=e.computed(()=>s.accept.split(",").map(t=>t.split("/").pop()));function g(){l.value.imageViewerVisible=!0}function f(){l.value.imageViewerVisible=!1}function v(){c("update:url","")}const w=t=>{var r;const i=(r=t.name.split(".").at(-1))!=null?r:"",o=n.value.includes(i),a=t.size/1024/1024<s.size;return o?a?l.value.progress.preview=URL.createObjectURL(t):u.ElMessage.error(`上传图片大小不能超过 ${s.size}MB！`):u.ElMessage.error(`上传图片只支持${n.value.join(" / ")}格式！`),o&&a&&(!s.beforeUpload||s.beforeUpload(t))},V=t=>{l.value.progress.percent=~~t.percent},y=(...t)=>{l.value.progress.preview="",l.value.progress.percent=0,c("onSuccess",...t)};return(t,N)=>{const i=e.resolveComponent("el-icon"),o=e.resolveComponent("el-image"),a=e.resolveComponent("el-progress"),r=e.resolveComponent("el-upload"),k=e.resolveComponent("el-image-viewer");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(d).e("upload-container"))},[e.createVNode(r,{"show-file-list":!1,headers:t.headers,action:t.action,data:t.data,name:t.name,"before-upload":w,"on-progress":V,"on-success":y,drag:"",accept:t.accept,class:e.normalizeClass(e.unref(d).e("image-upload"))},{default:e.withCtx(()=>[t.url===""?(e.openBlock(),e.createBlock(o,{key:0,src:t.url===""?t.placeholder:t.url,style:e.normalizeStyle(`width:${t.width}px;height:${t.height}px;`),fit:"fill"},{error:e.withCtx(()=>[e.createElementVNode("div",{class:"image-slot",style:e.normalizeStyle(`width:${t.width}px;height:${t.height}px;`)},[e.createVNode(i,null,{default:e.withCtx(()=>[e.createVNode(e.unref(p.Plus))]),_:1}),e.createElementVNode("p",null,e.toDisplayString(t.placeholder),1)],4)]),_:1},8,["src","style"])):(e.openBlock(),e.createElementBlock("div",$,[e.createVNode(o,{src:t.url,style:e.normalizeStyle(`width:${t.width}px;height:${t.height}px;`),fit:"fill"},null,8,["src","style"]),e.createElementVNode("div",B,[e.createElementVNode("div",E,[e.createElementVNode("span",{title:"预览",onClick:e.withModifiers(g,["stop"])},[e.createVNode(i,null,{default:e.withCtx(()=>[e.createVNode(e.unref(p.ZoomIn))]),_:1})]),e.createElementVNode("span",{title:"移除",onClick:e.withModifiers(v,["stop"])},[e.createVNode(i,null,{default:e.withCtx(()=>[e.createVNode(e.unref(p.Delete))]),_:1})])])])])),e.withDirectives(e.createElementVNode("div",{class:"progress",style:e.normalizeStyle(`width:${t.width}px;height:${t.height}px;`)},[e.createVNode(o,{src:l.value.progress.preview,style:e.normalizeStyle(`width:${t.width}px;height:${t.height}px;`),fit:"fill"},null,8,["src","style"]),e.createVNode(a,{type:"circle",width:Math.min(t.width,t.height)*.8,percentage:l.value.progress.percent},null,8,["width","percentage"])],4),[[e.vShow,t.url===""&&l.value.progress.percent]])]),_:1},8,["headers","action","data","name","accept","class"]),t.notip?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",S,[e.createElementVNode("div",z,e.toDisplayString(t.tipText||`上传图片支持 ${n.value.join(" / ")} 格式，且图片大小不超过 ${t.size}MB，建议图片尺寸为 ${t.width}*${t.height}`),1)])),l.value.imageViewerVisible?(e.openBlock(),e.createBlock(k,{key:1,"url-list":[t.url],teleported:"",onClose:f},null,8,["url-list"])):e.createCommentVNode("",!0)],2)}}});exports.default=b;

package/src/image-upload/src/image-upload.vue.js

@@ -0,0 +1,164 @@
+import { defineComponent as E, ref as O, computed as T, resolveComponent as r, openBlock as n, createElementBlock as g, normalizeClass as w, unref as p, createVNode as s, withCtx as d, createBlock as y, normalizeStyle as u, createElementVNode as t, toDisplayString as $, withModifiers as k, withDirectives as I, vShow as L, createCommentVNode as _ } from "vue";
+import { Plus as P, ZoomIn as R, Delete as Q } from "../../../node_modules/.pnpm/@element-plus_icons-vue@2.3.1_vue@3.5.12_typescript@5.6.3_/node_modules/@element-plus/icons-vue/dist/index.js";
+import { useNamespace as Z } from "../../../packages/hooks/src/use-namespace/index.js";
+import { ElMessage as V } from "../../../node_modules/.pnpm/element-plus@2.8.7_vue@3.5.12_typescript@5.6.3_/node_modules/element-plus/es/components/message/index.js";
+const q = {
+  key: 1,
+  class: "image"
+}, A = { class: "mask" }, F = { class: "actions" }, G = {
+  key: 0,
+  class: "el-upload__tip-text"
+}, H = { style: { display: "inline-block" } }, Y = /* @__PURE__ */ E({
+  name: "QxsImageUpload",
+  __name: "image-upload",
+  props: {
+    action: {},
+    headers: {},
+    data: {},
+    name: { default: "file" },
+    url: { default: "" },
+    size: { default: 20 },
+    width: { default: 160 },
+    accept: { default: "image/jpeg,image/jpg,image/png,image/gif" },
+    height: { default: 90 },
+    placeholder: { default: "点击上传图片" },
+    notip: { type: Boolean, default: !1 },
+    tipText: {},
+    beforeUpload: {}
+  },
+  emits: ["update:url", "onSuccess"],
+  setup(b, { emit: z }) {
+    const o = b, f = z, v = Z("image-upload"), l = O({
+      imageViewerVisible: !1,
+      progress: {
+        preview: "",
+        percent: 0
+      }
+    }), m = T(() => o.accept.split(",").map((e) => e.split("/").pop()));
+    function C() {
+      l.value.imageViewerVisible = !0;
+    }
+    function B() {
+      l.value.imageViewerVisible = !1;
+    }
+    function S() {
+      f("update:url", "");
+    }
+    const U = (e) => {
+      var h;
+      const a = (h = e.name.split(".").at(-1)) != null ? h : "", i = m.value.includes(a), c = e.size / 1024 / 1024 < o.size;
+      return i ? c ? l.value.progress.preview = URL.createObjectURL(e) : V.error(`上传图片大小不能超过 ${o.size}MB！`) : V.error(`上传图片只支持${m.value.join(" / ")}格式！`), i && c && (!o.beforeUpload || o.beforeUpload(e));
+    }, N = (e) => {
+      l.value.progress.percent = ~~e.percent;
+    }, j = (...e) => {
+      l.value.progress.preview = "", l.value.progress.percent = 0, f("onSuccess", ...e);
+    };
+    return (e, M) => {
+      const a = r("el-icon"), i = r("el-image"), c = r("el-progress"), h = r("el-upload"), D = r("el-image-viewer");
+      return n(), g("div", {
+        class: w(p(v).e("upload-container"))
+      }, [
+        s(h, {
+          "show-file-list": !1,
+          headers: e.headers,
+          action: e.action,
+          data: e.data,
+          name: e.name,
+          "before-upload": U,
+          "on-progress": N,
+          "on-success": j,
+          drag: "",
+          accept: e.accept,
+          class: w(p(v).e("image-upload"))
+        }, {
+          default: d(() => [
+            e.url === "" ? (n(), y(i, {
+              key: 0,
+              src: e.url === "" ? e.placeholder : e.url,
+              style: u(`width:${e.width}px;height:${e.height}px;`),
+              fit: "fill"
+            }, {
+              error: d(() => [
+                t("div", {
+                  class: "image-slot",
+                  style: u(`width:${e.width}px;height:${e.height}px;`)
+                }, [
+                  s(a, null, {
+                    default: d(() => [
+                      s(p(P))
+                    ]),
+                    _: 1
+                  }),
+                  t("p", null, $(e.placeholder), 1)
+                ], 4)
+              ]),
+              _: 1
+            }, 8, ["src", "style"])) : (n(), g("div", q, [
+              s(i, {
+                src: e.url,
+                style: u(`width:${e.width}px;height:${e.height}px;`),
+                fit: "fill"
+              }, null, 8, ["src", "style"]),
+              t("div", A, [
+                t("div", F, [
+                  t("span", {
+                    title: "预览",
+                    onClick: k(C, ["stop"])
+                  }, [
+                    s(a, null, {
+                      default: d(() => [
+                        s(p(R))
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  t("span", {
+                    title: "移除",
+                    onClick: k(S, ["stop"])
+                  }, [
+                    s(a, null, {
+                      default: d(() => [
+                        s(p(Q))
+                      ]),
+                      _: 1
+                    })
+                  ])
+                ])
+              ])
+            ])),
+            I(t("div", {
+              class: "progress",
+              style: u(`width:${e.width}px;height:${e.height}px;`)
+            }, [
+              s(i, {
+                src: l.value.progress.preview,
+                style: u(`width:${e.width}px;height:${e.height}px;`),
+                fit: "fill"
+              }, null, 8, ["src", "style"]),
+              s(c, {
+                type: "circle",
+                width: Math.min(e.width, e.height) * 0.8,
+                percentage: l.value.progress.percent
+              }, null, 8, ["width", "percentage"])
+            ], 4), [
+              [L, e.url === "" && l.value.progress.percent]
+            ])
+          ]),
+          _: 1
+        }, 8, ["headers", "action", "data", "name", "accept", "class"]),
+        e.notip ? _("", !0) : (n(), g("div", G, [
+          t("div", H, $(e.tipText || `上传图片支持 ${m.value.join(" / ")} 格式，且图片大小不超过 ${e.size}MB，建议图片尺寸为 ${e.width}*${e.height}`), 1)
+        ])),
+        l.value.imageViewerVisible ? (n(), y(D, {
+          key: 1,
+          "url-list": [e.url],
+          teleported: "",
+          onClose: B
+        }, null, 8, ["url-list"])) : _("", !0)
+      ], 2);
+    };
+  }
+});
+export {
+  Y as default
+};

package/src/image-upload/src/image-upload.vue2.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./image-upload.vue.cjs");exports.default=e.default;

package/src/image-upload/src/image-upload.vue2.js

@@ -0,0 +1,4 @@
+import f from "./image-upload.vue.js";
+export {
+  f as default
+};

package/src/make-installer.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../package.json.cjs");function a(e){const n=r=>{for(const t in e)r.use(e[t])};return{version:s.version,install:n}}exports.makeInstaller=a;

package/src/make-installer.js

@@ -0,0 +1,13 @@
+import { version as i } from "../package.json.js";
+function s(n) {
+  return {
+    version: i,
+    install: (r) => {
+      for (const t in n)
+        r.use(n[t]);
+    }
+  };
+}
+export {
+  s as makeInstaller
+};

package/src/photo-crop-tool/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("../withInstall.cjs"),t=require("./src/photo-crop-tool.vue.cjs"),e=o.withInstall(t.default);exports.QxsPhotoCropTool=e;exports.default=e;

package/src/photo-crop-tool/index.js

@@ -0,0 +1,7 @@
+import { withInstall as o } from "../withInstall.js";
+import t from "./src/photo-crop-tool.vue.js";
+const s = o(t);
+export {
+  s as QxsPhotoCropTool,
+  s as default
+};

package/src/photo-crop-tool/src/composables.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("vue");function g(l){const e=d.ref(null);return l&&(e.value=l.getContext("2d")),{clearCanvas:()=>{e.value&&e.value.clearRect(0,0,l.width,l.height)},drawColor:(o,r,t,n,a)=>{e.value&&(e.value.fillStyle=a,e.value.fillRect(o,r,t,n))},drawImage:(o,r,t,n,a)=>{e.value.drawImage(o,r,t,n,a)},cropCanvas:(o,r,t,n)=>new Promise(a=>{if(e.value){const u=document.createElement("canvas");u.width=t,u.height=n;const c=u.getContext("2d");c?(c.drawImage(l,o,r,t,n,0,0,t,n),u.toBlob(i=>{if(i){const s=new File([i],"cropped_image.png",{type:"image/png"});a(s)}else a(null)},"image/png")):a(null)}else a(null)})}}exports.useCanvas=g;

package/src/photo-crop-tool/src/composables.js

@@ -0,0 +1,33 @@
+import { ref as s } from "vue";
+function v(l) {
+  const e = s(null);
+  return l && (e.value = l.getContext("2d")), {
+    clearCanvas: () => {
+      e.value && e.value.clearRect(0, 0, l.width, l.height);
+    },
+    drawColor: (o, r, t, n, a) => {
+      e.value && (e.value.fillStyle = a, e.value.fillRect(o, r, t, n));
+    },
+    drawImage: (o, r, t, n, a) => {
+      e.value.drawImage(o, r, t, n, a);
+    },
+    cropCanvas: (o, r, t, n) => new Promise((a) => {
+      if (e.value) {
+        const c = document.createElement("canvas");
+        c.width = t, c.height = n;
+        const u = c.getContext("2d");
+        u ? (u.drawImage(l, o, r, t, n, 0, 0, t, n), c.toBlob((i) => {
+          if (i) {
+            const p = new File([i], "cropped_image.png", { type: "image/png" });
+            a(p);
+          } else
+            a(null);
+        }, "image/png")) : a(null);
+      } else
+        a(null);
+    })
+  };
+}
+export {
+  v as useCanvas
+};