@qxs-bns/components 0.0.53 → 0.0.54

package/lib/src/photo-crop-tool/src/photo-crop-tool.vue.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),t=require("@qxs-bns/hooks"),l=require("./composables.cjs"),a=require("@vueuse/core");const o=["src"];var u=e.defineComponent({name:"QxsPhotoCropTool",__name:"photo-crop-tool",props:{imgFile:{type:Object,default:()=>null},aspectRatio:{type:String,default:()=>"16 / 9"},defaultWidth:{type:Number,default:()=>320},defaultHeight:{type:Number,default:()=>180},zoomType:{type:String,default:()=>"fixed"}},setup(u,{expose:i}){const n=u;let r=0,s=0,v=0,h=0;const c=t.useNamespace("photo-crop-tool"),f=e.ref(null),p=e.ref(null),d=e.ref(null),m=e.ref(""),g=e.ref(""),y=e.ref({x:0,y:0}),w=e.ref({width:n.defaultWidth,height:n.defaultHeight,x:0,y:0}),{width:x,height:b}=a.useElementSize(f),{width:z}=a.useElementSize(d),{x:E,y:N,style:R}=a.useDraggable(f,{containerElement:p,draggingElement:f,disabled:e.computed((()=>!!g.value)),exact:!0,initialValue:y}),k=e.computed((()=>n.imgFile?URL.createObjectURL(n.imgFile):""));e.watch((()=>n.imgFile),(e=>{e&&!e.type.startsWith("image/")?m.value="文件类型错误":m.value=""}));const H=e.computed((()=>(d.value?.naturalWidth||0)/z.value)),C=e.computed((()=>{const e={left:0,top:0};return"bottom-right"===g.value?(e.left=w.value.x,e.top=w.value.y):"top-left"===g.value?(e.left=w.value.x-x.value,e.top=w.value.y-b.value):"top-right"===g.value?(e.top=w.value.y-b.value,e.left=w.value.x):"bottom-left"===g.value&&(e.left=w.value.x-x.value,e.top=w.value.y),e})),T=e.computed((()=>{const{aspectRatio:e}=n,t={width:`${w.value.width||n.defaultWidth}`,height:`${w.value.height||n.defaultHeight}`,"aspect-ratio":e,top:`${C.value.top}px`,left:`${C.value.left}px`};return"free"===n.zoomType?delete t["aspect-ratio"]:"fixed"===n.zoomType&&delete t.height,c.cssVarBlock(t)}));function F(e){return e*H.value}function M(e,t){const l=p.value?.clientWidth||1/0,a=p.value?.clientHeight||1/0;return{width:Math.min(Math.max(e,0),l),height:Math.min(Math.max(t,0),a)}}function W(e){const t=e.clientX-r,l=e.clientY-s;if("bottom-right"===g.value){if("free"===n.zoomType){const{width:e,height:a}=M(v+t,h+l);w.value.width=e,w.value.height=a}else if("fixed"===n.zoomType){const e=Number.parseFloat(n.aspectRatio.split(" / ")[0])/Number.parseFloat(n.aspectRatio.split(" / ")[1]);let l=v+t,a=l/e;const{width:o,height:u}=M(l,a);u>(p.value?.clientHeight||1/0)&&(a=p.value?.clientHeight||1/0,l=a*e),w.value.width=o,w.value.height=u}}else if("top-left"===g.value){if("free"===n.zoomType){const{width:e,height:a}=M(v-t,h-l);w.value.width=e,w.value.height=a}else if("fixed"===n.zoomType){const e=Number.parseFloat(n.aspectRatio.split(" / ")[0])/Number.parseFloat(n.aspectRatio.split(" / ")[1]);let l=v-t,a=l/e;const{width:o,height:u}=M(l,a);u>(p.value?.clientHeight||1/0)&&(a=p.value?.clientHeight||1/0,l=a*e),w.value.width=o,w.value.height=u}E.value=C.value.left,N.value=C.value.top}else if("top-right"===g.value){if("free"===n.zoomType){const{width:e,height:a}=M(v+t,h-l);w.value.width=e,w.value.height=a}else if("fixed"===n.zoomType){const e=Number.parseFloat(n.aspectRatio.split(" / ")[0])/Number.parseFloat(n.aspectRatio.split(" / ")[1]);let l=v+t,a=l/e;const{width:o,height:u}=M(l,a);u>(p.value?.clientHeight||1/0)&&(a=p.value?.clientHeight||1/0,l=a*e),w.value.width=o,w.value.height=u}E.value=C.value.left,N.value=C.value.top}else if("bottom-left"===g.value){if("free"===n.zoomType){const{width:e,height:a}=M(v-t,h+l);w.value.width=e,w.value.height=a}else if("fixed"===n.zoomType){const e=Number.parseFloat(n.aspectRatio.split(" / ")[0])/Number.parseFloat(n.aspectRatio.split(" / ")[1]);let l=v-t,a=l/e;const{width:o,height:u}=M(l,a);u>(p.value?.clientHeight||1/0)&&(a=p.value?.clientHeight||1/0,l=a*e),w.value.width=o,w.value.height=u}E.value=C.value.left,N.value=C.value.top}e.preventDefault(),e.stopPropagation()}function B(e,t){g.value=t,r=e.clientX,s=e.clientY,v=w.value.width,h=w.value.height,"bottom-right"===t?(w.value.x=E.value,w.value.y=N.value):"top-left"===t?(w.value.x=E.value+x.value,w.value.y=N.value+b.value):"top-right"===t?(w.value.x=E.value,w.value.y=N.value+b.value):"bottom-left"===t&&(w.value.x=E.value+x.value,w.value.y=N.value)}function L(){g.value=""}return document.addEventListener("mouseup",L),document.addEventListener("mousemove",W),e.onMounted((()=>{e.nextTick((()=>{y.value.x=(p.value?.offsetWidth||0)/2-w.value.width/2,y.value.y=(p.value?.offsetHeight||0)/2-w.value.height/2}))})),e.onUnmounted((()=>{k.value&&URL.revokeObjectURL(k.value),document.removeEventListener("mouseup",L),document.removeEventListener("mousemove",W)})),i({crop:async function(e=d.value){let t="transparent";p.value&&(t=window.getComputedStyle(p.value).backgroundColor);const a=document.createElement("canvas");a.width=F(p.value?.clientWidth||0),a.height=F(p.value?.clientHeight||0);const{drawImage:o,cropCanvas:u,drawColor:i}=l.useCanvas(a);return i(0,0,a.width,a.height,t),o(e,F(e.offsetLeft),F(e.offsetTop),e.naturalWidth,e.naturalHeight),await u(F(E.value),F(N.value),F(x.value),F(b.value))},resize:function(){w.value.width=n.defaultWidth,w.value.height=n.defaultHeight,E.value=0,N.value=0}}),(t,l)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"containerBoxRef",ref:p,class:e.normalizeClass([e.unref(c).e("img-box")])},[e.unref(m)?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass([e.unref(c).e("error-message")])},e.toDisplayString(e.unref(m)),3)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createElementVNode("img",{ref_key:"imgRef",ref:d,class:e.normalizeClass([e.unref(c).e("image")]),src:e.unref(k)},null,10,o),e.createElementVNode("div",{ref_key:"cropBoxRef",ref:f,class:e.normalizeClass([e.unref(c).e("crop-tool-box")]),style:e.normalizeStyle([e.unref(T),e.unref(g)?`left: ${e.unref(C).left}px;top: ${e.unref(C).top}px`:e.unref(R)])},[e.createElementVNode("div",{class:e.normalizeClass([e.unref(c).e("top-left")]),onMousedown:l[0]||(l[0]=e=>B(e,"top-left"))},null,34),e.createElementVNode("div",{class:e.normalizeClass([e.unref(c).e("top-right")]),onMousedown:l[1]||(l[1]=e=>B(e,"top-right"))},null,34),e.createElementVNode("div",{class:e.normalizeClass([e.unref(c).e("bottom-right")]),onMousedown:l[2]||(l[2]=e=>B(e,"bottom-right"))},null,34),e.createElementVNode("div",{class:e.normalizeClass([e.unref(c).e("bottom-left")]),onMousedown:l[3]||(l[3]=e=>B(e,"bottom-left"))},null,34)],6)],64))],2))}});exports.default=u;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),t=require("@qxs-bns/hooks"),o=require("./composables.cjs"),l=require("@vueuse/core");const i=["src"];var a=e.defineComponent({name:"QxsPhotoCropTool",__name:"photo-crop-tool",props:{imgFile:{type:Object,default:()=>null},aspectRatio:{type:String,default:()=>"16 / 9"},defaultWidth:{type:Number,default:()=>320},defaultHeight:{type:Number,default:()=>180},zoomType:{type:String,default:()=>"fixed"}},setup(a,{expose:u}){const n=a;let r=0,s=0,v=0,h=0;const c=t.useNamespace("photo-crop-tool"),p=e.ref(null),d=e.ref(null),f=e.ref(null),m=e.ref(""),g=e.ref(""),w=e.ref({x:0,y:0}),y=e.ref({width:n.defaultWidth,height:n.defaultHeight,x:0,y:0}),{width:x,height:b}=l.useElementSize(p),{width:E}=l.useElementSize(f),{x:T,y:M,style:z}=l.useDraggable(p,{containerElement:d,draggingElement:p,disabled:e.computed((()=>!!g.value)),exact:!0,initialValue:w}),N=e.computed((()=>n.imgFile?URL.createObjectURL(n.imgFile):""));e.watch((()=>n.imgFile),(e=>{e&&!e.type.startsWith("image/")?m.value="文件类型错误":m.value=""}));const R=e.computed((()=>(f.value?.naturalWidth||0)/E.value)),k=e.computed((()=>{const e={left:0,top:0};return"bottom-right"===g.value?(e.left=y.value.x,e.top=y.value.y):"top-left"===g.value?(e.left=y.value.x-x.value,e.top=y.value.y-b.value):"top-right"===g.value?(e.top=y.value.y-b.value,e.left=y.value.x):"bottom-left"===g.value&&(e.left=y.value.x-x.value,e.top=y.value.y),e})),H=e.computed((()=>{const{aspectRatio:e}=n,t={width:`${y.value.width||n.defaultWidth}`,height:`${y.value.height||n.defaultHeight}`,"aspect-ratio":e,top:`${k.value.top}px`,left:`${k.value.left}px`};return"free"===n.zoomType?delete t["aspect-ratio"]:"fixed"===n.zoomType&&delete t.height,c.cssVarBlock(t)}));function C(e){return e*R.value}function L(e,t){const o=d.value?.clientWidth||1/0,l=d.value?.clientHeight||1/0;return{width:Math.min(Math.max(e,0),o),height:Math.min(Math.max(t,0),l)}}function F(e){return e instanceof MouseEvent?{clientX:e.clientX,clientY:e.clientY}:e instanceof TouchEvent&&e.touches.length>0?{clientX:e.touches[0].clientX,clientY:e.touches[0].clientY}:{clientX:0,clientY:0}}function W(e,t){const{clientX:o,clientY:l}=F(e);g.value=t,r=o,s=l,v=y.value.width,h=y.value.height,document.addEventListener("touchmove",B,{passive:!1}),document.addEventListener("touchend",V),"bottom-right"===t?(y.value.x=T.value,y.value.y=M.value):"top-left"===t?(y.value.x=T.value+x.value,y.value.y=M.value+b.value):"top-right"===t?(y.value.x=T.value,y.value.y=M.value+b.value):"bottom-left"===t&&(y.value.x=T.value+x.value,y.value.y=M.value),e instanceof TouchEvent&&e.preventDefault()}function B(e){e instanceof TouchEvent&&g.value&&e.preventDefault();const{clientX:t,clientY:o}=F(e),l=t-r,i=o-s;if("bottom-right"===g.value){if("free"===n.zoomType){const{width:e,height:t}=L(v+l,h+i);y.value.width=e,y.value.height=t}else if("fixed"===n.zoomType){const e=Number.parseFloat(n.aspectRatio.split(" / ")[0])/Number.parseFloat(n.aspectRatio.split(" / ")[1]);let t=v+l,o=t/e;const{width:i,height:a}=L(t,o);a>(d.value?.clientHeight||1/0)&&(o=d.value?.clientHeight||1/0,t=o*e),y.value.width=i,y.value.height=a}}else if("top-left"===g.value){if("free"===n.zoomType){const{width:e,height:t}=L(v-l,h-i);y.value.width=e,y.value.height=t}else if("fixed"===n.zoomType){const e=Number.parseFloat(n.aspectRatio.split(" / ")[0])/Number.parseFloat(n.aspectRatio.split(" / ")[1]);let t=v-l,o=t/e;const{width:i,height:a}=L(t,o);a>(d.value?.clientHeight||1/0)&&(o=d.value?.clientHeight||1/0,t=o*e),y.value.width=i,y.value.height=a}T.value=k.value.left,M.value=k.value.top}else if("top-right"===g.value){if("free"===n.zoomType){const{width:e,height:t}=L(v+l,h-i);y.value.width=e,y.value.height=t}else if("fixed"===n.zoomType){const e=Number.parseFloat(n.aspectRatio.split(" / ")[0])/Number.parseFloat(n.aspectRatio.split(" / ")[1]);let t=v+l,o=t/e;const{width:i,height:a}=L(t,o);a>(d.value?.clientHeight||1/0)&&(o=d.value?.clientHeight||1/0,t=o*e),y.value.width=i,y.value.height=a}T.value=k.value.left,M.value=k.value.top}else if("bottom-left"===g.value){if("free"===n.zoomType){const{width:e,height:t}=L(v-l,h+i);y.value.width=e,y.value.height=t}else if("fixed"===n.zoomType){const e=Number.parseFloat(n.aspectRatio.split(" / ")[0])/Number.parseFloat(n.aspectRatio.split(" / ")[1]);let t=v-l,o=t/e;const{width:i,height:a}=L(t,o);a>(d.value?.clientHeight||1/0)&&(o=d.value?.clientHeight||1/0,t=o*e),y.value.width=i,y.value.height=a}T.value=k.value.left,M.value=k.value.top}}function V(){document.removeEventListener("touchmove",B),document.removeEventListener("touchend",V),g.value=""}return e.onMounted((()=>{e.nextTick((()=>{w.value.x=(d.value?.offsetWidth||0)/2-y.value.width/2,w.value.y=(d.value?.offsetHeight||0)/2-y.value.height/2})),document.addEventListener("mouseup",V),document.addEventListener("mousemove",B,{passive:!1}),document.addEventListener("touchmove",B,{passive:!1}),document.addEventListener("touchend",V)})),e.onUnmounted((()=>{N.value&&URL.revokeObjectURL(N.value),document.removeEventListener("mouseup",V),document.removeEventListener("mousemove",B)})),u({crop:async function(e=f.value){let t="transparent";d.value&&(t=window.getComputedStyle(d.value).backgroundColor);const l=document.createElement("canvas");l.width=C(d.value?.clientWidth||0),l.height=C(d.value?.clientHeight||0);const{drawImage:i,cropCanvas:a,drawColor:u}=o.useCanvas(l);return u(0,0,l.width,l.height,t),i(e,C(e.offsetLeft),C(e.offsetTop),e.naturalWidth,e.naturalHeight),await a(C(T.value),C(M.value),C(x.value),C(b.value))},resize:function(){y.value.width=n.defaultWidth,y.value.height=n.defaultHeight,T.value=0,M.value=0}}),(t,o)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"containerBoxRef",ref:d,class:e.normalizeClass([e.unref(c).e("img-box")])},[e.unref(m)?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass([e.unref(c).e("error-message")])},e.toDisplayString(e.unref(m)),3)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createElementVNode("img",{ref_key:"imgRef",ref:f,class:e.normalizeClass([e.unref(c).e("image")]),src:e.unref(N)},null,10,i),e.createElementVNode("div",{ref_key:"cropBoxRef",ref:p,class:e.normalizeClass([e.unref(c).e("crop-tool-box")]),style:e.normalizeStyle([e.unref(H),e.unref(g)?`left: ${e.unref(k).left}px;top: ${e.unref(k).top}px`:e.unref(z)]),onTouchstart:o[8]||(o[8]=e.withModifiers((()=>{}),["stop","prevent"])),onTouchend:e.withModifiers(V,["stop","prevent"])},[e.createElementVNode("div",{class:e.normalizeClass([e.unref(c).e("top-left")]),onMousedown:o[0]||(o[0]=e.withModifiers((e=>W(e,"top-left")),["stop","prevent"])),onTouchstart:o[1]||(o[1]=e.withModifiers((e=>W(e,"top-left")),["stop","prevent"])),onTouchend:e.withModifiers(V,["stop","prevent"])},null,34),e.createElementVNode("div",{class:e.normalizeClass([e.unref(c).e("top-right")]),onMousedown:o[2]||(o[2]=e.withModifiers((e=>W(e,"top-right")),["stop","prevent"])),onTouchstart:o[3]||(o[3]=e.withModifiers((e=>W(e,"top-right")),["stop","prevent"])),onTouchend:e.withModifiers(V,["stop","prevent"])},null,34),e.createElementVNode("div",{class:e.normalizeClass([e.unref(c).e("bottom-right")]),onMousedown:o[4]||(o[4]=e.withModifiers((e=>W(e,"bottom-right")),["stop","prevent"])),onTouchstart:o[5]||(o[5]=e.withModifiers((e=>W(e,"bottom-right")),["stop","prevent"])),onTouchend:e.withModifiers(V,["stop","prevent"])},null,34),e.createElementVNode("div",{class:e.normalizeClass([e.unref(c).e("bottom-left")]),onMousedown:o[6]||(o[6]=e.withModifiers((e=>W(e,"bottom-left")),["stop","prevent"])),onTouchstart:o[7]||(o[7]=e.withModifiers((e=>W(e,"bottom-left")),["stop","prevent"])),onTouchend:e.withModifiers(V,["stop","prevent"])},null,34)],38)],64))],2))}});exports.default=a;
 //# sourceMappingURL=photo-crop-tool.vue.cjs.map

package/lib/src/photo-crop-tool/src/photo-crop-tool.vue.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"photo-crop-tool.vue.cjs","sources":["../../../../../../packages/components/src/photo-crop-tool/src/photo-crop-tool.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { PropType } from 'vue'\nimport { useNamespace } from '@qxs-bns/hooks'\nimport { useCanvas } from './composables'\n\ndefineOptions({\n  name: 'QxsPhotoCropTool',\n})\n\nconst props = defineProps({\n  imgFile: {\n    type: Object as PropType<File>,\n    default: () => null,\n  },\n  aspectRatio: {\n    type: String,\n    default: () => '16 / 9',\n  },\n  defaultWidth: {\n    type: Number,\n    default: () => 320,\n  },\n  defaultHeight: {\n    type: Number,\n    default: () => 180,\n  },\n  /**\n   * free 自由缩放\n   * fixed 固定比例缩放\n   */\n  zoomType: {\n    type: String,\n    default: () => 'fixed',\n  },\n})\nlet startX = 0\nlet startY = 0\nlet startWidth = 0\nlet startHeight = 0\n\nconst ns = useNamespace('photo-crop-tool')\n\nconst cropBoxRef = ref<HTMLElement | null>(null)\nconst containerBoxRef = ref<HTMLElement | null>(null)\nconst imgRef = ref<HTMLImageElement | null>(null)\nconst errorMessage = ref('')\nconst dargPoint = ref('')\nconst initialValue = ref({\n  x: 0,\n  y: 0,\n})\nconst cropInfo = ref({\n  width: props.defaultWidth,\n  height: props.defaultHeight,\n  x: 0,\n  y: 0,\n})\n\nconst { width, height } = useElementSize(cropBoxRef)\nconst { width: imgWidth } = useElementSize(imgRef)\n\nconst { x, y, style } = useDraggable(cropBoxRef, {\n  containerElement: containerBoxRef,\n  draggingElement: cropBoxRef,\n  disabled: computed(() => !!dargPoint.value),\n  exact: true,\n  initialValue,\n})\n\nconst imageUrl = computed(() => {\n  if (!props.imgFile) {\n    return ''\n  }\n  return URL.createObjectURL(props.imgFile)\n})\n\nwatch(\n  () => props.imgFile,\n  (newFile: File | null) => {\n    if (newFile && !newFile.type.startsWith('image/')) {\n      errorMessage.value = '文件类型错误'\n    }\n    else {\n      errorMessage.value = ''\n    }\n  },\n)\n\nconst ratio = computed(() => {\n  return (imgRef.value?.naturalWidth || 0) / imgWidth.value\n})\n\nconst customStyle = computed(() => {\n  const position = {\n    left: 0,\n    top: 0,\n  }\n  if (dargPoint.value === 'bottom-right') {\n    position.left = cropInfo.value.x\n    position.top = cropInfo.value.y\n  }\n  else if (dargPoint.value === 'top-left') {\n    position.left = cropInfo.value.x - width.value\n    position.top = cropInfo.value.y - height.value\n  }\n  else if (dargPoint.value === 'top-right') {\n    position.top = cropInfo.value.y - height.value\n    position.left = cropInfo.value.x\n  }\n  else if (dargPoint.value === 'bottom-left') {\n    position.left = cropInfo.value.x - width.value\n    position.top = cropInfo.value.y\n  }\n  return position\n})\n\nconst sizeStyle = computed(() => {\n  const { aspectRatio } = props\n\n  const style: {\n    'height'?: string\n    'width': string\n    'aspect-ratio'?: string\n    'top': string\n    'left': string\n  } = {\n    'width': `${cropInfo.value.width || props.defaultWidth}`,\n    'height': `${cropInfo.value.height || props.defaultHeight}`,\n    'aspect-ratio': aspectRatio,\n    'top': `${customStyle.value.top}px`,\n    'left': `${customStyle.value.left}px`,\n  }\n  if (props.zoomType === 'free') {\n    delete style['aspect-ratio']\n  }\n  else if (props.zoomType === 'fixed') {\n    delete style.height\n  }\n  return ns.cssVarBlock(style)\n})\n\nfunction zoom(pixel: number) {\n  return pixel * ratio.value\n}\nasync function crop(img: HTMLImageElement = imgRef.value!) {\n  let backgroundColor = 'transparent'\n  if (containerBoxRef.value) {\n    backgroundColor = window.getComputedStyle(\n      containerBoxRef.value,\n    ).backgroundColor\n  }\n  const canvas = document.createElement('canvas')\n  canvas.width = zoom(containerBoxRef.value?.clientWidth || 0)\n  canvas.height = zoom(containerBoxRef.value?.clientHeight || 0)\n  const { drawImage, cropCanvas, drawColor } = useCanvas(canvas)\n  drawColor(0, 0, canvas.width, canvas.height, backgroundColor)\n  drawImage(\n    img,\n    zoom(img.offsetLeft),\n    zoom(img.offsetTop),\n    img.naturalWidth,\n    img.naturalHeight,\n  )\n  return await cropCanvas(\n    zoom(x.value),\n    zoom(y.value),\n    zoom(width.value),\n    zoom(height.value),\n  )\n}\n\nfunction checkBoundaries(\n  newWidth: number,\n  newHeight: number,\n): { width: number, height: number } {\n  const maxWidth = containerBoxRef.value?.clientWidth || Infinity\n  const maxHeight = containerBoxRef.value?.clientHeight || Infinity\n\n  return {\n    width: Math.min(Math.max(newWidth, 0), maxWidth),\n    height: Math.min(Math.max(newHeight, 0), maxHeight),\n  }\n}\n\nfunction mousemove(e: MouseEvent) {\n  const deltaX = e.clientX - startX\n  const deltaY = e.clientY - startY\n\n  if (dargPoint.value === 'bottom-right') {\n    if (props.zoomType === 'free') {\n      const { width, height } = checkBoundaries(\n        startWidth + deltaX,\n        startHeight + deltaY,\n      )\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    else if (props.zoomType === 'fixed') {\n      const aspectRatio\n        = Number.parseFloat(props.aspectRatio.split(' / ')[0])\n          / Number.parseFloat(props.aspectRatio.split(' / ')[1])\n      let newWidth = startWidth + deltaX\n      let newHeight = newWidth / aspectRatio\n      const { width, height } = checkBoundaries(newWidth, newHeight)\n      if (height > (containerBoxRef.value?.clientHeight || Infinity)) {\n        newHeight = containerBoxRef.value?.clientHeight || Infinity\n        newWidth = newHeight * aspectRatio\n      }\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n  }\n  else if (dargPoint.value === 'top-left') {\n    if (props.zoomType === 'free') {\n      const { width, height } = checkBoundaries(\n        startWidth - deltaX,\n        startHeight - deltaY,\n      )\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    else if (props.zoomType === 'fixed') {\n      const aspectRatio\n        = Number.parseFloat(props.aspectRatio.split(' / ')[0])\n          / Number.parseFloat(props.aspectRatio.split(' / ')[1])\n      let newWidth = startWidth - deltaX\n      let newHeight = newWidth / aspectRatio\n      const { width, height } = checkBoundaries(newWidth, newHeight)\n      if (height > (containerBoxRef.value?.clientHeight || Infinity)) {\n        newHeight = containerBoxRef.value?.clientHeight || Infinity\n        newWidth = newHeight * aspectRatio\n      }\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    x.value = customStyle.value.left\n    y.value = customStyle.value.top\n  }\n  else if (dargPoint.value === 'top-right') {\n    if (props.zoomType === 'free') {\n      const { width, height } = checkBoundaries(\n        startWidth + deltaX,\n        startHeight - deltaY,\n      )\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    else if (props.zoomType === 'fixed') {\n      const aspectRatio\n        = Number.parseFloat(props.aspectRatio.split(' / ')[0])\n          / Number.parseFloat(props.aspectRatio.split(' / ')[1])\n      let newWidth = startWidth + deltaX\n      let newHeight = newWidth / aspectRatio\n      const { width, height } = checkBoundaries(newWidth, newHeight)\n      if (height > (containerBoxRef.value?.clientHeight || Infinity)) {\n        newHeight = containerBoxRef.value?.clientHeight || Infinity\n        newWidth = newHeight * aspectRatio\n      }\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    x.value = customStyle.value.left\n    y.value = customStyle.value.top\n  }\n  else if (dargPoint.value === 'bottom-left') {\n    if (props.zoomType === 'free') {\n      const { width, height } = checkBoundaries(\n        startWidth - deltaX,\n        startHeight + deltaY,\n      )\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    else if (props.zoomType === 'fixed') {\n      const aspectRatio\n        = Number.parseFloat(props.aspectRatio.split(' / ')[0])\n          / Number.parseFloat(props.aspectRatio.split(' / ')[1])\n      let newWidth = startWidth - deltaX\n      let newHeight = newWidth / aspectRatio\n      const { width, height } = checkBoundaries(newWidth, newHeight)\n      if (height > (containerBoxRef.value?.clientHeight || Infinity)) {\n        newHeight = containerBoxRef.value?.clientHeight || Infinity\n        newWidth = newHeight * aspectRatio\n      }\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    x.value = customStyle.value.left\n    y.value = customStyle.value.top\n  }\n  e.preventDefault()\n  e.stopPropagation()\n}\n\nfunction mousedown(e: MouseEvent, point: string) {\n  dargPoint.value = point\n  startX = e.clientX\n  startY = e.clientY\n  startWidth = cropInfo.value.width\n  startHeight = cropInfo.value.height\n\n  if (point === 'bottom-right') {\n    cropInfo.value.x = x.value\n    cropInfo.value.y = y.value\n  }\n  else if (point === 'top-left') {\n    cropInfo.value.x = x.value + width.value\n    cropInfo.value.y = y.value + height.value\n  }\n  else if (point === 'top-right') {\n    cropInfo.value.x = x.value\n    cropInfo.value.y = y.value + height.value\n  }\n  else if (point === 'bottom-left') {\n    cropInfo.value.x = x.value + width.value\n    cropInfo.value.y = y.value\n  }\n}\n\nfunction mouseup() {\n  dargPoint.value = ''\n}\n\nfunction resize() {\n  cropInfo.value.width = props.defaultWidth\n  cropInfo.value.height = props.defaultHeight\n  x.value = 0\n  y.value = 0\n}\n\ndocument.addEventListener('mouseup', mouseup)\ndocument.addEventListener('mousemove', mousemove)\n\nonMounted(() => {\n  nextTick(() => {\n    // 初始化位置\n    initialValue.value.x\n      = (containerBoxRef.value?.offsetWidth || 0) / 2 - cropInfo.value.width / 2\n    initialValue.value.y\n      = (containerBoxRef.value?.offsetHeight || 0) / 2\n        - cropInfo.value.height / 2\n  })\n})\n\nonUnmounted(() => {\n  if (imageUrl.value) {\n    URL.revokeObjectURL(imageUrl.value)\n  }\n  document.removeEventListener('mouseup', mouseup)\n  document.removeEventListener('mousemove', mousemove)\n})\n\ndefineExpose({\n  crop,\n  resize,\n})\n</script>\n\n<template>\n  <div\n    ref=\"containerBoxRef\"\n    :class=\"[ns.e('img-box')]\"\n  >\n    <div\n      v-if=\"errorMessage\"\n      :class=\"[ns.e('error-message')]\"\n    >\n      {{ errorMessage }}\n    </div>\n    <template v-else>\n      <img\n        ref=\"imgRef\"\n        :class=\"[ns.e('image')]\"\n        :src=\"imageUrl\"\n      >\n      <div\n        ref=\"cropBoxRef\"\n        :class=\"[ns.e('crop-tool-box')]\"\n        :style=\"[\n          sizeStyle,\n          dargPoint\n            ? `left: ${customStyle.left}px;top: ${customStyle.top}px`\n            : style,\n        ]\"\n      >\n        <div\n          :class=\"[ns.e('top-left')]\"\n          @mousedown=\"mousedown($event, 'top-left')\"\n        />\n        <div\n          :class=\"[ns.e('top-right')]\"\n          @mousedown=\"mousedown($event, 'top-right')\"\n        />\n        <div\n          :class=\"[ns.e('bottom-right')]\"\n          @mousedown=\"mousedown($event, 'bottom-right')\"\n        />\n        <div\n          :class=\"[ns.e('bottom-left')]\"\n          @mousedown=\"mousedown($event, 'bottom-left')\"\n        />\n      </div>\n    </template>\n  </div>\n</template>\n"],"names":["props","__props","startX","startY","startWidth","startHeight","ns","useNamespace","cropBoxRef","ref","containerBoxRef","imgRef","errorMessage","dargPoint","initialValue","x","y","cropInfo","width","defaultWidth","height","defaultHeight","useElementSize","imgWidth","style","useDraggable","containerElement","draggingElement","disabled","computed","value","exact","imageUrl","imgFile","URL","createObjectURL","watch","newFile","type","startsWith","ratio","naturalWidth","customStyle","position","left","top","sizeStyle","aspectRatio","zoomType","cssVarBlock","zoom","pixel","checkBoundaries","newWidth","newHeight","maxWidth","clientWidth","Infinity","maxHeight","clientHeight","Math","min","max","mousemove","e","deltaX","clientX","deltaY","clientY","Number","parseFloat","split","preventDefault","stopPropagation","mousedown","point","mouseup","document","addEventListener","onMounted","nextTick","offsetWidth","offsetHeight","onUnmounted","revokeObjectURL","removeEventListener","__expose","crop","async","img","backgroundColor","window","getComputedStyle","canvas","createElement","drawImage","cropCanvas","drawColor","useCanvas","offsetLeft","offsetTop","naturalHeight","resize"],"mappings":"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"}
+{"version":3,"file":"photo-crop-tool.vue.cjs","sources":["../../../../../../packages/components/src/photo-crop-tool/src/photo-crop-tool.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { PropType } from 'vue'\nimport { useNamespace } from '@qxs-bns/hooks'\nimport { useCanvas } from './composables'\n\ndefineOptions({\n  name: 'QxsPhotoCropTool',\n})\n\nconst props = defineProps({\n  imgFile: {\n    type: Object as PropType<File>,\n    default: () => null,\n  },\n  aspectRatio: {\n    type: String,\n    default: () => '16 / 9',\n  },\n  defaultWidth: {\n    type: Number,\n    default: () => 320,\n  },\n  defaultHeight: {\n    type: Number,\n    default: () => 180,\n  },\n  /**\n   * free 自由缩放\n   * fixed 固定比例缩放\n   */\n  zoomType: {\n    type: String,\n    default: () => 'fixed',\n  },\n})\nlet startX = 0\nlet startY = 0\nlet startWidth = 0\nlet startHeight = 0\n\nconst ns = useNamespace('photo-crop-tool')\n\nconst cropBoxRef = ref<HTMLElement | null>(null)\nconst containerBoxRef = ref<HTMLElement | null>(null)\nconst imgRef = ref<HTMLImageElement | null>(null)\nconst errorMessage = ref('')\nconst dargPoint = ref('')\nconst initialValue = ref({\n  x: 0,\n  y: 0,\n})\nconst cropInfo = ref({\n  width: props.defaultWidth,\n  height: props.defaultHeight,\n  x: 0,\n  y: 0,\n})\n\nconst { width, height } = useElementSize(cropBoxRef)\nconst { width: imgWidth } = useElementSize(imgRef)\n\nconst { x, y, style } = useDraggable(cropBoxRef, {\n  containerElement: containerBoxRef,\n  draggingElement: cropBoxRef,\n  disabled: computed(() => !!dargPoint.value),\n  exact: true,\n  initialValue,\n})\n\nconst imageUrl = computed(() => {\n  if (!props.imgFile) {\n    return ''\n  }\n  return URL.createObjectURL(props.imgFile)\n})\n\nwatch(\n  () => props.imgFile,\n  (newFile: File | null) => {\n    if (newFile && !newFile.type.startsWith('image/')) {\n      errorMessage.value = '文件类型错误'\n    }\n    else {\n      errorMessage.value = ''\n    }\n  },\n)\n\nconst ratio = computed(() => {\n  return (imgRef.value?.naturalWidth || 0) / imgWidth.value\n})\n\nconst customStyle = computed(() => {\n  const position = {\n    left: 0,\n    top: 0,\n  }\n  if (dargPoint.value === 'bottom-right') {\n    position.left = cropInfo.value.x\n    position.top = cropInfo.value.y\n  }\n  else if (dargPoint.value === 'top-left') {\n    position.left = cropInfo.value.x - width.value\n    position.top = cropInfo.value.y - height.value\n  }\n  else if (dargPoint.value === 'top-right') {\n    position.top = cropInfo.value.y - height.value\n    position.left = cropInfo.value.x\n  }\n  else if (dargPoint.value === 'bottom-left') {\n    position.left = cropInfo.value.x - width.value\n    position.top = cropInfo.value.y\n  }\n  return position\n})\n\nconst sizeStyle = computed(() => {\n  const { aspectRatio } = props\n\n  const style: {\n    'height'?: string\n    'width': string\n    'aspect-ratio'?: string\n    'top': string\n    'left': string\n  } = {\n    'width': `${cropInfo.value.width || props.defaultWidth}`,\n    'height': `${cropInfo.value.height || props.defaultHeight}`,\n    'aspect-ratio': aspectRatio,\n    'top': `${customStyle.value.top}px`,\n    'left': `${customStyle.value.left}px`,\n  }\n  if (props.zoomType === 'free') {\n    delete style['aspect-ratio']\n  }\n  else if (props.zoomType === 'fixed') {\n    delete style.height\n  }\n  return ns.cssVarBlock(style)\n})\n\nfunction zoom(pixel: number) {\n  return pixel * ratio.value\n}\nasync function crop(img: HTMLImageElement = imgRef.value!) {\n  let backgroundColor = 'transparent'\n  if (containerBoxRef.value) {\n    backgroundColor = window.getComputedStyle(\n      containerBoxRef.value,\n    ).backgroundColor\n  }\n  const canvas = document.createElement('canvas')\n  canvas.width = zoom(containerBoxRef.value?.clientWidth || 0)\n  canvas.height = zoom(containerBoxRef.value?.clientHeight || 0)\n  const { drawImage, cropCanvas, drawColor } = useCanvas(canvas)\n  drawColor(0, 0, canvas.width, canvas.height, backgroundColor)\n  drawImage(\n    img,\n    zoom(img.offsetLeft),\n    zoom(img.offsetTop),\n    img.naturalWidth,\n    img.naturalHeight,\n  )\n  return await cropCanvas(\n    zoom(x.value),\n    zoom(y.value),\n    zoom(width.value),\n    zoom(height.value),\n  )\n}\n\nfunction checkBoundaries(\n  newWidth: number,\n  newHeight: number,\n): { width: number, height: number } {\n  const maxWidth = containerBoxRef.value?.clientWidth || Infinity\n  const maxHeight = containerBoxRef.value?.clientHeight || Infinity\n\n  return {\n    width: Math.min(Math.max(newWidth, 0), maxWidth),\n    height: Math.min(Math.max(newHeight, 0), maxHeight),\n  }\n}\n\nfunction getClientPos(e: MouseEvent | TouchEvent): { clientX: number, clientY: number } {\n  if (e instanceof MouseEvent) {\n    return { clientX: e.clientX, clientY: e.clientY }\n  }\n  else if (e instanceof TouchEvent && e.touches.length > 0) {\n    return { clientX: e.touches[0].clientX, clientY: e.touches[0].clientY }\n  }\n  return { clientX: 0, clientY: 0 }\n}\n\nfunction handleStart(e: MouseEvent | TouchEvent, point: string) {\n  const { clientX, clientY } = getClientPos(e)\n  dargPoint.value = point\n  startX = clientX\n  startY = clientY\n  startWidth = cropInfo.value.width\n  startHeight = cropInfo.value.height\n\n  // 添加移动端事件监听\n  document.addEventListener('touchmove', handleMove, { passive: false })\n  document.addEventListener('touchend', handleEnd)\n\n  if (point === 'bottom-right') {\n    cropInfo.value.x = x.value\n    cropInfo.value.y = y.value\n  }\n  else if (point === 'top-left') {\n    cropInfo.value.x = x.value + width.value\n    cropInfo.value.y = y.value + height.value\n  }\n  else if (point === 'top-right') {\n    cropInfo.value.x = x.value\n    cropInfo.value.y = y.value + height.value\n  }\n  else if (point === 'bottom-left') {\n    cropInfo.value.x = x.value + width.value\n    cropInfo.value.y = y.value\n  }\n\n  // Prevent touch scrolling\n  if (e instanceof TouchEvent) {\n    e.preventDefault()\n  }\n}\n\nfunction handleMove(e: MouseEvent | TouchEvent) {\n  // Only prevent default if we're in a drag operation\n  if (e instanceof TouchEvent && dargPoint.value) {\n    e.preventDefault()\n  }\n\n  const { clientX, clientY } = getClientPos(e)\n  const deltaX = clientX - startX\n  const deltaY = clientY - startY\n\n  if (dargPoint.value === 'bottom-right') {\n    if (props.zoomType === 'free') {\n      const { width, height } = checkBoundaries(\n        startWidth + deltaX,\n        startHeight + deltaY,\n      )\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    else if (props.zoomType === 'fixed') {\n      const aspectRatio\n        = Number.parseFloat(props.aspectRatio.split(' / ')[0])\n          / Number.parseFloat(props.aspectRatio.split(' / ')[1])\n      let newWidth = startWidth + deltaX\n      let newHeight = newWidth / aspectRatio\n      const { width, height } = checkBoundaries(newWidth, newHeight)\n      if (height > (containerBoxRef.value?.clientHeight || Infinity)) {\n        newHeight = containerBoxRef.value?.clientHeight || Infinity\n        newWidth = newHeight * aspectRatio\n      }\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n  }\n  else if (dargPoint.value === 'top-left') {\n    if (props.zoomType === 'free') {\n      const { width, height } = checkBoundaries(\n        startWidth - deltaX,\n        startHeight - deltaY,\n      )\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    else if (props.zoomType === 'fixed') {\n      const aspectRatio\n        = Number.parseFloat(props.aspectRatio.split(' / ')[0])\n          / Number.parseFloat(props.aspectRatio.split(' / ')[1])\n      let newWidth = startWidth - deltaX\n      let newHeight = newWidth / aspectRatio\n      const { width, height } = checkBoundaries(newWidth, newHeight)\n      if (height > (containerBoxRef.value?.clientHeight || Infinity)) {\n        newHeight = containerBoxRef.value?.clientHeight || Infinity\n        newWidth = newHeight * aspectRatio\n      }\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    x.value = customStyle.value.left\n    y.value = customStyle.value.top\n  }\n  else if (dargPoint.value === 'top-right') {\n    if (props.zoomType === 'free') {\n      const { width, height } = checkBoundaries(\n        startWidth + deltaX,\n        startHeight - deltaY,\n      )\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    else if (props.zoomType === 'fixed') {\n      const aspectRatio\n        = Number.parseFloat(props.aspectRatio.split(' / ')[0])\n          / Number.parseFloat(props.aspectRatio.split(' / ')[1])\n      let newWidth = startWidth + deltaX\n      let newHeight = newWidth / aspectRatio\n      const { width, height } = checkBoundaries(newWidth, newHeight)\n      if (height > (containerBoxRef.value?.clientHeight || Infinity)) {\n        newHeight = containerBoxRef.value?.clientHeight || Infinity\n        newWidth = newHeight * aspectRatio\n      }\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    x.value = customStyle.value.left\n    y.value = customStyle.value.top\n  }\n  else if (dargPoint.value === 'bottom-left') {\n    if (props.zoomType === 'free') {\n      const { width, height } = checkBoundaries(\n        startWidth - deltaX,\n        startHeight + deltaY,\n      )\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    else if (props.zoomType === 'fixed') {\n      const aspectRatio\n        = Number.parseFloat(props.aspectRatio.split(' / ')[0])\n          / Number.parseFloat(props.aspectRatio.split(' / ')[1])\n      let newWidth = startWidth - deltaX\n      let newHeight = newWidth / aspectRatio\n      const { width, height } = checkBoundaries(newWidth, newHeight)\n      if (height > (containerBoxRef.value?.clientHeight || Infinity)) {\n        newHeight = containerBoxRef.value?.clientHeight || Infinity\n        newWidth = newHeight * aspectRatio\n      }\n      cropInfo.value.width = width\n      cropInfo.value.height = height\n    }\n    x.value = customStyle.value.left\n    y.value = customStyle.value.top\n  }\n}\n\nfunction handleEnd() {\n  // 移除移动端事件监听\n  document.removeEventListener('touchmove', handleMove)\n  document.removeEventListener('touchend', handleEnd)\n\n  dargPoint.value = ''\n}\n\nfunction resize() {\n  cropInfo.value.width = props.defaultWidth\n  cropInfo.value.height = props.defaultHeight\n  x.value = 0\n  y.value = 0\n}\n\nonMounted(() => {\n  nextTick(() => {\n    // 初始化位置\n    initialValue.value.x\n      = (containerBoxRef.value?.offsetWidth || 0) / 2 - cropInfo.value.width / 2\n    initialValue.value.y\n      = (containerBoxRef.value?.offsetHeight || 0) / 2\n        - cropInfo.value.height / 2\n  })\n\n  // 只添加鼠标事件监听\n  document.addEventListener('mouseup', handleEnd)\n  document.addEventListener('mousemove', handleMove, { passive: false })\n  document.addEventListener('touchmove', handleMove, { passive: false })\n  document.addEventListener('touchend', handleEnd)\n})\n\nonUnmounted(() => {\n  if (imageUrl.value) {\n    URL.revokeObjectURL(imageUrl.value)\n  }\n  // 确保移除所有事件监听\n  document.removeEventListener('mouseup', handleEnd)\n  document.removeEventListener('mousemove', handleMove)\n})\n\ndefineExpose({\n  crop,\n  resize,\n})\n</script>\n\n<template>\n  <div\n    ref=\"containerBoxRef\"\n    :class=\"[ns.e('img-box')]\"\n  >\n    <div\n      v-if=\"errorMessage\"\n      :class=\"[ns.e('error-message')]\"\n    >\n      {{ errorMessage }}\n    </div>\n    <template v-else>\n      <img\n        ref=\"imgRef\"\n        :class=\"[ns.e('image')]\"\n        :src=\"imageUrl\"\n      >\n      <div\n        ref=\"cropBoxRef\"\n        :class=\"[ns.e('crop-tool-box')]\"\n        :style=\"[\n          sizeStyle,\n          dargPoint\n            ? `left: ${customStyle.left}px;top: ${customStyle.top}px`\n            : style,\n        ]\"\n        @touchstart.stop.prevent\n        @touchend.stop.prevent=\"handleEnd\"\n      >\n        <div\n          :class=\"[ns.e('top-left')]\"\n          @mousedown.stop.prevent=\"handleStart($event, 'top-left')\"\n          @touchstart.stop.prevent=\"handleStart($event, 'top-left')\"\n          @touchend.stop.prevent=\"handleEnd\"\n        />\n        <div\n          :class=\"[ns.e('top-right')]\"\n          @mousedown.stop.prevent=\"handleStart($event, 'top-right')\"\n          @touchstart.stop.prevent=\"handleStart($event, 'top-right')\"\n          @touchend.stop.prevent=\"handleEnd\"\n        />\n        <div\n          :class=\"[ns.e('bottom-right')]\"\n          @mousedown.stop.prevent=\"handleStart($event, 'bottom-right')\"\n          @touchstart.stop.prevent=\"handleStart($event, 'bottom-right')\"\n          @touchend.stop.prevent=\"handleEnd\"\n        />\n        <div\n          :class=\"[ns.e('bottom-left')]\"\n          @mousedown.stop.prevent=\"handleStart($event, 'bottom-left')\"\n          @touchstart.stop.prevent=\"handleStart($event, 'bottom-left')\"\n          @touchend.stop.prevent=\"handleEnd\"\n        />\n      </div>\n    </template>\n  </div>\n</template>\n"],"names":["props","__props","startX","startY","startWidth","startHeight","ns","useNamespace","cropBoxRef","ref","containerBoxRef","imgRef","errorMessage","dargPoint","initialValue","x","y","cropInfo","width","defaultWidth","height","defaultHeight","useElementSize","imgWidth","style","useDraggable","containerElement","draggingElement","disabled","computed","value","exact","imageUrl","imgFile","URL","createObjectURL","watch","newFile","type","startsWith","ratio","naturalWidth","customStyle","position","left","top","sizeStyle","aspectRatio","zoomType","cssVarBlock","zoom","pixel","checkBoundaries","newWidth","newHeight","maxWidth","clientWidth","Infinity","maxHeight","clientHeight","Math","min","max","getClientPos","e","MouseEvent","clientX","clientY","TouchEvent","touches","length","handleStart","point","document","addEventListener","handleMove","passive","handleEnd","preventDefault","deltaX","deltaY","Number","parseFloat","split","removeEventListener","onMounted","nextTick","offsetWidth","offsetHeight","onUnmounted","revokeObjectURL","__expose","crop","async","img","backgroundColor","window","getComputedStyle","canvas","createElement","drawImage","cropCanvas","drawColor","useCanvas","offsetLeft","offsetTop","naturalHeight","resize"],"mappings":"4fASA,MAAMA,EAAQC,EA0Bd,IAAIC,EAAS,EACTC,EAAS,EACTC,EAAa,EACbC,EAAc,EAEZ,MAAAC,EAAKC,eAAa,mBAElBC,EAAaC,MAAwB,MACrCC,EAAkBD,MAAwB,MAC1CE,EAASF,MAA6B,MACtCG,EAAeH,MAAI,IACnBI,EAAYJ,MAAI,IAChBK,EAAeL,EAAAA,IAAI,CACvBM,EAAG,EACHC,EAAG,IAECC,EAAWR,EAAAA,IAAI,CACnBS,MAAOlB,EAAMmB,aACbC,OAAQpB,EAAMqB,cACdN,EAAG,EACHC,EAAG,KAGCE,MAAEA,EAAAE,OAAOA,GAAWE,EAAAA,eAAed,IACjCU,MAAOK,GAAaD,EAAAA,eAAeX,IAErCI,EAAEA,EAAGC,EAAAA,EAAAQ,MAAGA,GAAUC,EAAAA,aAAajB,EAAY,CAC/CkB,iBAAkBhB,EAClBiB,gBAAiBnB,EACjBoB,SAAUC,EAAAA,UAAS,MAAQhB,EAAUiB,QACrCC,OAAO,EACPjB,iBAGIkB,EAAWH,EAAAA,UAAS,IACnB7B,EAAMiC,QAGJC,IAAIC,gBAAgBnC,EAAMiC,SAFxB,KAKXG,EAAAA,OACE,IAAMpC,EAAMiC,UACXI,IACKA,IAAYA,EAAQC,KAAKC,WAAW,UACtC3B,EAAakB,MAAQ,SAGrBlB,EAAakB,MAAQ,EAAA,IAKrB,MAAAU,EAAQX,EAAAA,UAAS,KACblB,EAAOmB,OAAOW,cAAgB,GAAKlB,EAASO,QAGhDY,EAAcb,EAAAA,UAAS,KAC3B,MAAMc,EAAW,CACfC,KAAM,EACNC,IAAK,GAkBA,MAhBiB,iBAApBhC,EAAUiB,OACHa,EAAAC,KAAO3B,EAASa,MAAMf,EACtB4B,EAAAE,IAAM5B,EAASa,MAAMd,GAEH,aAApBH,EAAUiB,OACjBa,EAASC,KAAO3B,EAASa,MAAMf,EAAIG,EAAMY,MACzCa,EAASE,IAAM5B,EAASa,MAAMd,EAAII,EAAOU,OAEd,cAApBjB,EAAUiB,OACjBa,EAASE,IAAM5B,EAASa,MAAMd,EAAII,EAAOU,MAChCa,EAAAC,KAAO3B,EAASa,MAAMf,GAEJ,gBAApBF,EAAUiB,QACjBa,EAASC,KAAO3B,EAASa,MAAMf,EAAIG,EAAMY,MAChCa,EAAAE,IAAM5B,EAASa,MAAMd,GAEzB2B,CAAA,IAGHG,EAAYjB,EAAAA,UAAS,KACnB,MAAAkB,YAAEA,GAAgB/C,EAElBwB,EAMF,CACFN,MAAS,GAAGD,EAASa,MAAMZ,OAASlB,EAAMmB,eAC1CC,OAAU,GAAGH,EAASa,MAAMV,QAAUpB,EAAMqB,gBAC5C,eAAgB0B,EAChBF,IAAO,GAAGH,EAAYZ,MAAMe,QAC5BD,KAAQ,GAAGF,EAAYZ,MAAMc,UAQxB,MANgB,SAAnB5C,EAAMgD,gBACDxB,EAAM,gBAEa,UAAnBxB,EAAMgD,iBACNxB,EAAMJ,OAERd,EAAG2C,YAAYzB,EAAK,IAG7B,SAAS0B,EAAKC,GACZ,OAAOA,EAAQX,EAAMV,KAAA,CA6Bd,SAAAsB,EACPC,EACAC,GAEM,MAAAC,EAAW7C,EAAgBoB,OAAO0B,aAAeC,IACjDC,EAAYhD,EAAgBoB,OAAO6B,cAAgBF,IAElD,MAAA,CACLvC,MAAO0C,KAAKC,IAAID,KAAKE,IAAIT,EAAU,GAAIE,GACvCnC,OAAQwC,KAAKC,IAAID,KAAKE,IAAIR,EAAW,GAAII,GAC3C,CAGF,SAASK,EAAaC,GACpB,OAAIA,aAAaC,WACR,CAAEC,QAASF,EAAEE,QAASC,QAASH,EAAEG,SAEjCH,aAAaI,YAAcJ,EAAEK,QAAQC,OAAS,EAC9C,CAAEJ,QAASF,EAAEK,QAAQ,GAAGH,QAASC,QAASH,EAAEK,QAAQ,GAAGF,SAEzD,CAAED,QAAS,EAAGC,QAAS,EAAE,CAGzB,SAAAI,EAAYP,EAA4BQ,GAC/C,MAAMN,QAAEA,EAAAC,QAASA,GAAYJ,EAAaC,GAC1CnD,EAAUiB,MAAQ0C,EACTtE,EAAAgE,EACA/D,EAAAgE,EACT/D,EAAaa,EAASa,MAAMZ,MAC5Bb,EAAcY,EAASa,MAAMV,OAG7BqD,SAASC,iBAAiB,YAAaC,EAAY,CAAEC,SAAS,IACrDH,SAAAC,iBAAiB,WAAYG,GAExB,iBAAVL,GACOvD,EAAAa,MAAMf,EAAIA,EAAEe,MACZb,EAAAa,MAAMd,EAAIA,EAAEc,OAEJ,aAAV0C,GACPvD,EAASa,MAAMf,EAAIA,EAAEe,MAAQZ,EAAMY,MACnCb,EAASa,MAAMd,EAAIA,EAAEc,MAAQV,EAAOU,OAEnB,cAAV0C,GACEvD,EAAAa,MAAMf,EAAIA,EAAEe,MACrBb,EAASa,MAAMd,EAAIA,EAAEc,MAAQV,EAAOU,OAEnB,gBAAV0C,IACPvD,EAASa,MAAMf,EAAIA,EAAEe,MAAQZ,EAAMY,MAC1Bb,EAAAa,MAAMd,EAAIA,EAAEc,OAInBkC,aAAaI,YACfJ,EAAEc,gBACJ,CAGF,SAASH,EAAWX,GAEdA,aAAaI,YAAcvD,EAAUiB,OACvCkC,EAAEc,iBAGJ,MAAMZ,QAAEA,EAAAC,QAASA,GAAYJ,EAAaC,GACpCe,EAASb,EAAUhE,EACnB8E,EAASb,EAAUhE,EAErB,GAAoB,iBAApBU,EAAUiB,OACR,GAAmB,SAAnB9B,EAAMgD,SAAqB,CAC7B,MAAQ9B,MAAAA,EAAOE,OAAAA,GAAWgC,EACxBhD,EAAa2E,EACb1E,EAAc2E,GAEhB/D,EAASa,MAAMZ,MAAQA,EACvBD,EAASa,MAAMV,OAASA,CAAA,MAC1B,GAC4B,UAAnBpB,EAAMgD,SAAsB,CACnC,MAAMD,EACFkC,OAAOC,WAAWlF,EAAM+C,YAAYoC,MAAM,OAAO,IAC/CF,OAAOC,WAAWlF,EAAM+C,YAAYoC,MAAM,OAAO,IACvD,IAAI9B,EAAWjD,EAAa2E,EACxBzB,EAAYD,EAAWN,EACrB,MAAE7B,MAAAA,EAAOE,OAAAA,GAAWgC,EAAgBC,EAAUC,GAChDlC,GAAUV,EAAgBoB,OAAO6B,cAAgBF,OACvCH,EAAA5C,EAAgBoB,OAAO6B,cAAgBF,IACnDJ,EAAWC,EAAYP,GAEzB9B,EAASa,MAAMZ,MAAQA,EACvBD,EAASa,MAAMV,OAASA,CAAA,OAE5B,GAC6B,aAApBP,EAAUiB,MAAsB,CACnC,GAAmB,SAAnB9B,EAAMgD,SAAqB,CAC7B,MAAQ9B,MAAAA,EAAOE,OAAAA,GAAWgC,EACxBhD,EAAa2E,EACb1E,EAAc2E,GAEhB/D,EAASa,MAAMZ,MAAQA,EACvBD,EAASa,MAAMV,OAASA,CAAA,MAC1B,GAC4B,UAAnBpB,EAAMgD,SAAsB,CACnC,MAAMD,EACFkC,OAAOC,WAAWlF,EAAM+C,YAAYoC,MAAM,OAAO,IAC/CF,OAAOC,WAAWlF,EAAM+C,YAAYoC,MAAM,OAAO,IACvD,IAAI9B,EAAWjD,EAAa2E,EACxBzB,EAAYD,EAAWN,EACrB,MAAE7B,MAAAA,EAAOE,OAAAA,GAAWgC,EAAgBC,EAAUC,GAChDlC,GAAUV,EAAgBoB,OAAO6B,cAAgBF,OACvCH,EAAA5C,EAAgBoB,OAAO6B,cAAgBF,IACnDJ,EAAWC,EAAYP,GAEzB9B,EAASa,MAAMZ,MAAQA,EACvBD,EAASa,MAAMV,OAASA,CAAA,CAExBL,EAAAe,MAAQY,EAAYZ,MAAMc,KAC1B5B,EAAAc,MAAQY,EAAYZ,MAAMe,GAAA,MAC9B,GAC6B,cAApBhC,EAAUiB,MAAuB,CACpC,GAAmB,SAAnB9B,EAAMgD,SAAqB,CAC7B,MAAQ9B,MAAAA,EAAOE,OAAAA,GAAWgC,EACxBhD,EAAa2E,EACb1E,EAAc2E,GAEhB/D,EAASa,MAAMZ,MAAQA,EACvBD,EAASa,MAAMV,OAASA,CAAA,MAC1B,GAC4B,UAAnBpB,EAAMgD,SAAsB,CACnC,MAAMD,EACFkC,OAAOC,WAAWlF,EAAM+C,YAAYoC,MAAM,OAAO,IAC/CF,OAAOC,WAAWlF,EAAM+C,YAAYoC,MAAM,OAAO,IACvD,IAAI9B,EAAWjD,EAAa2E,EACxBzB,EAAYD,EAAWN,EACrB,MAAE7B,MAAAA,EAAOE,OAAAA,GAAWgC,EAAgBC,EAAUC,GAChDlC,GAAUV,EAAgBoB,OAAO6B,cAAgBF,OACvCH,EAAA5C,EAAgBoB,OAAO6B,cAAgBF,IACnDJ,EAAWC,EAAYP,GAEzB9B,EAASa,MAAMZ,MAAQA,EACvBD,EAASa,MAAMV,OAASA,CAAA,CAExBL,EAAAe,MAAQY,EAAYZ,MAAMc,KAC1B5B,EAAAc,MAAQY,EAAYZ,MAAMe,GAAA,MAC9B,GAC6B,gBAApBhC,EAAUiB,MAAyB,CACtC,GAAmB,SAAnB9B,EAAMgD,SAAqB,CAC7B,MAAQ9B,MAAAA,EAAOE,OAAAA,GAAWgC,EACxBhD,EAAa2E,EACb1E,EAAc2E,GAEhB/D,EAASa,MAAMZ,MAAQA,EACvBD,EAASa,MAAMV,OAASA,CAAA,MAC1B,GAC4B,UAAnBpB,EAAMgD,SAAsB,CACnC,MAAMD,EACFkC,OAAOC,WAAWlF,EAAM+C,YAAYoC,MAAM,OAAO,IAC/CF,OAAOC,WAAWlF,EAAM+C,YAAYoC,MAAM,OAAO,IACvD,IAAI9B,EAAWjD,EAAa2E,EACxBzB,EAAYD,EAAWN,EACrB,MAAE7B,MAAAA,EAAOE,OAAAA,GAAWgC,EAAgBC,EAAUC,GAChDlC,GAAUV,EAAgBoB,OAAO6B,cAAgBF,OACvCH,EAAA5C,EAAgBoB,OAAO6B,cAAgBF,IACnDJ,EAAWC,EAAYP,GAEzB9B,EAASa,MAAMZ,MAAQA,EACvBD,EAASa,MAAMV,OAASA,CAAA,CAExBL,EAAAe,MAAQY,EAAYZ,MAAMc,KAC1B5B,EAAAc,MAAQY,EAAYZ,MAAMe,GAAA,CAC9B,CAGF,SAASgC,IAEEJ,SAAAW,oBAAoB,YAAaT,GACjCF,SAAAW,oBAAoB,WAAYP,GAEzChE,EAAUiB,MAAQ,EAAA,QAUpBuD,EAAAA,WAAU,KACRC,EAAAA,UAAS,KAEMxE,EAAAgB,MAAMf,GACdL,EAAgBoB,OAAOyD,aAAe,GAAK,EAAItE,EAASa,MAAMZ,MAAQ,EAC9DJ,EAAAgB,MAAMd,GACdN,EAAgBoB,OAAO0D,cAAgB,GAAK,EAC3CvE,EAASa,MAAMV,OAAS,CAAA,IAIvBqD,SAAAC,iBAAiB,UAAWG,GACrCJ,SAASC,iBAAiB,YAAaC,EAAY,CAAEC,SAAS,IAC9DH,SAASC,iBAAiB,YAAaC,EAAY,CAAEC,SAAS,IACrDH,SAAAC,iBAAiB,WAAYG,EAAS,IAGjDY,EAAAA,aAAY,KACNzD,EAASF,OACPI,IAAAwD,gBAAgB1D,EAASF,OAGtB2C,SAAAW,oBAAoB,UAAWP,GAC/BJ,SAAAW,oBAAoB,YAAaT,EAAU,IAGzCgB,EAAA,CACXC,KAjPaC,eAAKC,EAAwBnF,EAAOmB,OACjD,IAAIiE,EAAkB,cAClBrF,EAAgBoB,QAClBiE,EAAkBC,OAAOC,iBACvBvF,EAAgBoB,OAChBiE,iBAEE,MAAAG,EAASzB,SAAS0B,cAAc,UACtCD,EAAOhF,MAAQgC,EAAKxC,EAAgBoB,OAAO0B,aAAe,GAC1D0C,EAAO9E,OAAS8B,EAAKxC,EAAgBoB,OAAO6B,cAAgB,GAC5D,MAAMyC,UAAEA,EAAWC,WAAAA,EAAAC,UAAYA,GAAcC,EAAAA,UAAUL,GASvD,OARAI,EAAU,EAAG,EAAGJ,EAAOhF,MAAOgF,EAAO9E,OAAQ2E,GAC7CK,EACEN,EACA5C,EAAK4C,EAAIU,YACTtD,EAAK4C,EAAIW,WACTX,EAAIrD,aACJqD,EAAIY,qBAEOL,EACXnD,EAAKnC,EAAEe,OACPoB,EAAKlC,EAAEc,OACPoB,EAAKhC,EAAMY,OACXoB,EAAK9B,EAAOU,OACd,EA0NA6E,OAnCF,WACW1F,EAAAa,MAAMZ,MAAQlB,EAAMmB,aACpBF,EAAAa,MAAMV,OAASpB,EAAMqB,cAC9BN,EAAEe,MAAQ,EACVd,EAAEc,MAAQ,CAAA"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@qxs-bns/components",
   "type": "module",
-  "version": "0.0.53",
+  "version": "0.0.54",
   "description": "Vue 3 Component Library",
   "license": "MIT",
   "homepage": "https://trry-hub.github.io/qxs-bns/",
@@ -41,8 +41,10 @@
   },
   "dependencies": {
     "@amap/amap-jsapi-loader": "^1.0.1",
+    "@iconify/vue": "^5.0.0",
     "@qxs-bns/directives": "0.0.19",
     "@qxs-bns/hooks": "0.0.5",
+    "@qxs-bns/icon": "0.0.0",
     "@qxs-bns/utils": "0.0.26",
     "@vueuse/core": "^11.3.0",
     "echarts": "^5.5.1",

package/theme-chalk/index.css

@@ -1 +1 @@
-:root [data-fixed-calc-width]{position:fixed;right:0;left:0%}:root [data-mode=mobile] [data-fixed-calc-width]{width:100% !important}.qxs-data-chart__table{box-sizing:border-box;display:flex;flex-direction:column}.qxs-data-chart__table .title{display:flex;align-items:center;justify-content:space-between;padding:0 5px;margin-top:2px;margin-bottom:7px;font-family:sans-serif;font-size:14px;font-weight:bolder;color:#464646}.qxs-data-chart__table>div[class*=-table]{position:relative;display:flex;flex:1;flex-direction:column;overflow:hidden;background-color:rgba(0,0,0,0);border-top-left-radius:4px;border-top-right-radius:4px}.qxs-data-chart__table>div[class*=-table] [class*=-table__body-wrapper] [class*=-table__cell]{border-right:0}.qxs-data-chart__table>div[class*=-table] [class*=-table__body-wrapper] [class$=table__empty-text]{line-height:unset}.qxs-data-chart__empty{display:flex;align-items:center;justify-content:center;height:100%}.qxs-data-chart__empty-content{display:flex;flex-direction:column;align-items:center;pointer-events:none;margin-top:-2px}.qxs-data-chart__empty-description{font-size:14px;color:#74767e;margin-left:1px}.qxs-data-chart__wrapper{height:100%}.qxs-fixed-action-bar__actionbar{bottom:0;z-index:10;padding:var(--qxs-fixed-action-bar-actionbar-padding);padding-bottom:calc(env(safe-area-inset-bottom) + var(--qxs-fixed-action-bar-actionbar-padding-bottom));text-align:center;background-color:var(--qxs-bg-color, #fff);box-shadow:0 0 1px 0 var(--qxs-border-color, #f3f3f2);transition:box-shadow .3s,var(--qxs-transition-box-shadow, #f3f3f2)}.qxs-fixed-action-bar__actionbar.is-shadow{box-shadow:0 0 1px 0 var(--qxs-border-color, #f3f3f2)}.qxs-photo-crop-tool__img-box{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;overflow:hidden;background-color:#fafafa}.qxs-photo-crop-tool__error-message{color:red}.qxs-photo-crop-tool__image{max-width:100%;max-height:100%;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;user-select:none;-o-object-fit:contain;object-fit:contain;-webkit-user-drag:none}.qxs-photo-crop-tool__crop-tool-box{position:absolute;width:calc(var(--qxs-photo-crop-tool-width)*1px);max-width:100%;height:calc(var(--qxs-photo-crop-tool-height)*1px);max-height:100%;aspect-ratio:var(--qxs-photo-crop-tool-aspect-ratio);overflow:hidden;cursor:move;border:1px dashed #fff;box-shadow:0 0 0 9999px rgba(0,0,0,.4)}.qxs-photo-crop-tool__crop-tool-box>div{position:absolute;z-index:3;width:30%;aspect-ratio:1/1;background-color:rgba(2,2,2,.01);border-radius:50%;transition:all .3s}.qxs-photo-crop-tool__crop-tool-box>div:hover,.qxs-photo-crop-tool__crop-tool-box>div:active{background-color:rgba(2,2,2,.5)}.qxs-photo-crop-tool__top-left{top:0;left:0;cursor:nwse-resize;transform:translate3d(-50%, -50%, 0)}.qxs-photo-crop-tool__top-right{top:0;right:0;cursor:nesw-resize;transform:translate3d(50%, -50%, 0)}.qxs-photo-crop-tool__bottom-right{right:0;bottom:0;cursor:nwse-resize;transform:translate3d(50%, 50%, 0)}.qxs-photo-crop-tool__bottom-left{bottom:0;left:0;cursor:nesw-resize;transform:translate3d(-50%, 50%, 0)}.qxs-image-upload__container{line-height:initial}.qxs-image-upload__control{display:inline-block;vertical-align:top}.qxs-image-upload__control .image{position:relative;overflow:hidden;border-radius:6px}.qxs-image-upload__control .image .mask{position:absolute;top:0;width:100%;height:100%;background-color:var(--qxs-overlay-color-lighter);opacity:0;transition:opacity .3s}.qxs-image-upload__control .image .mask .actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;width:100px;height:100px;position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%)}.qxs-image-upload__control .image .mask .actions span{width:50%;color:var(--qxs-color-white);text-align:center;cursor:pointer;transition:color .1s,transform .1s}.qxs-image-upload__control .image .mask .actions span:hover{transform:scale(1.5)}.qxs-image-upload__control .image .mask .actions span [class=qxs-icon]{font-size:24px}.qxs-image-upload__control .image:hover .mask{opacity:1}.qxs-image-upload__control .is-drag{display:inline-block !important;font-size:0}.qxs-image-upload__control .is-drag [class$=-upload-dragger]{display:inline-block;padding:0;font-size:0}.qxs-image-upload__control .is-drag [class$=-upload-dragger] [class$=-image]{display:block}.qxs-image-upload__control .is-drag [class$=-upload-dragger].is-dragover{border-width:1px}.qxs-image-upload__control .is-drag [class$=-upload-dragger] .image-slot{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;font-size:14px;color:var(--qxs-text-color-placeholder);background-color:#f5f5f5;transition:all .3s}.qxs-image-upload__control .is-drag [class$=-upload-dragger] .image-slot:hover{background-color:#eee}.qxs-image-upload__control .is-drag [class$=-upload-dragger] .image-slot [class$=-icon]{font-size:28px}.qxs-image-upload__control .is-drag [class$=-upload-dragger] .image-slot p{margin-top:10px;margin-bottom:0;line-height:1em;color:#5a5a5a}.qxs-image-upload__control .is-drag [class$=-upload-dragger] .progress{position:absolute;top:0}.qxs-image-upload__control .is-drag [class$=-upload-dragger] .progress::after{position:absolute;top:0;left:0;width:100%;height:100%;content:"";background-color:var(--qxs-overlay-color-lighter)}.qxs-image-upload__control .is-drag [class$=-upload-dragger] .progress [class$=-progress]{z-index:1;position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%)}.qxs-image-upload__control .is-drag [class$=-upload-dragger] .progress [class$=-progress] [class$=-progress__text]{color:var(--qxs-text-color-placeholder)}.qxs-image-upload__container [class$=-upload__tip-text]{font-size:14px;line-height:32px;color:#c8c8c8}.qxs-file-upload__control .is-drag{display:inline-block !important}.qxs-file-upload__control .is-drag [class$=-upload-dragger]{padding:0}.qxs-file-upload__control .is-drag [class$=-upload-dragger] [class$=-icon--upload]{margin-bottom:0;font-size:40px}.qxs-file-upload__control .is-drag [class$=-upload-dragger] [class$=-upload__text]{padding:0 6px;font-size:14px;line-height:1.5}.qxs-file-upload__control .is-drag.is-dragover{border-width:1px}.qxs-file-upload__control .is-drag .slot{width:160px;height:90px}.qxs-tiny-mce-editor__tiny-mce .tox-tinymce{border-width:1px;border-radius:var(--qxs-border-radius-base, 4px)}.qxs-tiny-mce-editor__tiny-mce .tox-tinymce:not(.tox-tinymce-inline) .tox-editor-header{box-shadow:0 2px 2px -2px rgba(34,47,62,.1),0 4px 4px -4px rgba(34,47,62,.07)}.qxs-tiny-mce-editor__tiny-mce .tox-tinymce .tox-sidebar-wrap{overflow-y:auto}.qxs-tiny-mce-editor__tiny-mce .tox-tinymce .tox-sidebar-wrap .tox-edit-area::before{border-width:1px;border-radius:0}.qxs-tiny-mce-editor .tox-tinymce-aux{z-index:2500 !important}.qxs-subject-list__list-exam .flex{display:flex;align-items:center}.qxs-subject-list__list-exam .flex-items-center{display:flex;align-items:center}.qxs-subject-list__list-exam .flex-justify-between{display:flex;justify-content:space-between}.qxs-subject-list__list-exam .flex-justify-center{display:flex;justify-content:center}.qxs-subject-list__list-exam .flex-justify-end{display:flex;justify-content:flex-end}.qxs-subject-list__list-exam .margin-left-10{margin-left:10px}.qxs-subject-list__list-exam .label{min-width:50px}.qxs-subject-list__list-exam .flex-1{flex:1}.qxs-subject-list__list-exam .subject-list-wrapper{width:100%;margin-bottom:20px}.qxs-subject-list__list-exam .margin-bottom{margin-bottom:20px}.qxs-subject-list__list-exam .auto-line{flex:1;height:1px;margin:0 15px;background-color:#c8c8c8}.qxs-subject-list__list-exam .title{font-size:14px;font-weight:500}.qxs-subject-list__list-exam .rich-text img{max-width:100%}.qxs-subject-single__single-exam .preview-answer{display:flex;flex-direction:column;margin-bottom:10px}.qxs-subject-single__single-exam .flex{display:flex;align-items:center}.qxs-subject-single__single-exam .margin-bottom{margin-bottom:20px}.qxs-subject-single__single-exam .answer-list .answer-item{margin-top:15px}.qxs-subject-single__single-exam .answer-list .answer-item .input{width:300px}.qxs-subject-single__single-exam .answer-list .answer-item .input [class$=-input]{font-weight:bold}.qxs-subject-single__single-exam .answer-list .answer-item .correct{margin:0 10px}.qxs-subject-single__single-exam .answer-list .answer-item .correct:hover{color:#3d61e3;cursor:pointer}.qxs-subject-single__single-exam .answer-list .answer-item .is-correct{color:#67c23a}.qxs-subject-single__single-exam .answer-list .answer-item .icon{margin-left:10px;font-size:18px;color:#a3a3a3;cursor:pointer}.qxs-subject-single__single-exam .answer-list .answer-item .disabled{color:#c0c4cc;cursor:not-allowed}.qxs-subject-single__single-exam .preview .answer-radio{padding-left:10px}.qxs-subject-single__single-exam .preview .answer-radio .radio{margin-top:10px}.qxs-subject-blank-fill__blank-fill-exam .flex{display:flex;align-items:center}.qxs-subject-blank-fill__blank-fill-exam .label{min-width:50px;margin-right:10px}.qxs-subject-blank-fill__blank-fill-exam .margin-bottom{margin-bottom:20px}.qxs-subject-blank-fill__blank-fill-exam .answer-list .answer-item{width:100%;margin-top:15px}.qxs-subject-blank-fill__blank-fill-exam .answer-list .answer-item .answer-tags{flex:1;padding:5px 15px;border:1px solid #eee;border-radius:4px}.qxs-subject-blank-fill__blank-fill-exam .answer-list .answer-item .answer-tags [class$=-tag]{margin-right:10px}.qxs-subject-blank-fill__blank-fill-exam .preview .content{min-height:100px;padding-top:10px;background-color:#fff}.qxs-subject-text-fill__text-fill-exam .flex{display:flex;align-items:center}.qxs-subject-text-fill__text-fill-exam .label{min-width:50px;margin-right:10px}.qxs-subject-text-fill__text-fill-exam .margin-bottom{margin-bottom:20px}.qxs-subject-text-fill__text-fill-exam .answer-list .answer-item{width:100%;margin-top:15px}.qxs-subject-text-fill__text-fill-exam .answer-list .answer-item .answer-tags{flex:1;padding:5px 15px;border:1px solid #eee;border-radius:4px}.qxs-subject-text-fill__text-fill-exam .answer-list .answer-item .operation .icon{margin-left:10px;font-size:16px;color:#a3a3a3;cursor:pointer}.qxs-subject-text-fill__text-fill-exam .answer-list .answer-item .operation .disabled{color:#c0c4cc;cursor:not-allowed}.qxs-subject-text-fill__text-fill-exam .preview .content{min-height:100px;margin-top:10px}.qxs-subject-scale__scale-exam .flex{display:flex;align-items:center}.qxs-subject-scale__scale-exam .label{min-width:50px}.qxs-subject-scale__scale-exam .margin-bottom{margin-bottom:20px}.qxs-subject-scale__scale-exam .answer{margin:20px 0}.qxs-subject-scale__scale-exam .answer .answer-list{margin-left:40px}.qxs-subject-scale__scale-exam .answer .answer-list .answer-item{margin-bottom:20px}.qxs-subject-scale__scale-exam .answer .answer-list .answer-item .order{width:16px;margin-right:10px}.qxs-subject-scale__scale-exam .answer .answer-list .answer-item .icon{margin-left:10px;font-size:16px;color:#a3a3a3;cursor:pointer}.qxs-subject-scale__scale-exam .answer .answer-list .answer-item .disabled{color:#c0c4cc;cursor:not-allowed}.qxs-subject-scale__scale-exam .preview .answer-radio .radio-item .qxs-radio-wrapper{margin-inline-end:0}.qxs-subject-layout__layout-exam{padding:10px;font-size:12px;color:#5a5a5a}.qxs-subject-layout__layout-exam .edit{position:relative;padding:20px 10px;padding-bottom:10px;margin-top:20px;background-color:#f6f7fb}.qxs-subject-layout__layout-exam .edit .triangle-up{position:absolute;top:-20px;left:100px;width:0;height:0;border-right:20px solid rgba(0,0,0,0);border-bottom:20px solid #f6f7fb;border-left:20px solid rgba(0,0,0,0)}.qxs-subject-action__action-exam .action{padding:20px 0}.qxs-subject-action__action-exam .active{padding-right:10px;padding-left:10px;background-color:#f6f7fb}.qxs-subject-action__action-exam .btn-margin{margin-right:10px}.qxs-subject-action__action-exam .has-set{display:flex;align-items:center;font-size:12px;color:#bbb}.qxs-subject-action__action-exam .vertical-radio-group{display:flex;flex-direction:column;align-items:flex-start;margin-left:20px}.qxs-subject-action__action-exam .vertical-radio-group ::v-deep(.qxs-radio){display:block;margin-right:0}.qxs-subject-type__type-list .type-item{margin-bottom:20px}.qxs-subject-type__type-list .base-subject{display:flex;flex-wrap:wrap;align-items:center}.qxs-subject-type__type-list .base-subject .item{width:50px;height:22px;margin-top:10px;margin-right:10px;font-size:14px;color:#5a5a5a;text-align:center;cursor:pointer;background:#fafafa}.qxs-subject-type__type-list .base-subject .item:hover{color:#3d61e3;background:rgba(61,97,227,.12)}
+:root [data-fixed-calc-width]{position:fixed;right:0;left:0%}:root [data-mode=mobile] [data-fixed-calc-width]{width:100% !important}.qxs-data-chart__table{box-sizing:border-box;display:flex;flex-direction:column}.qxs-data-chart__table .title{display:flex;align-items:center;justify-content:space-between;padding:0 5px;margin-top:2px;margin-bottom:7px;font-family:sans-serif;font-size:14px;font-weight:bolder;color:#464646}.qxs-data-chart__table>div[class*=-table]{position:relative;display:flex;flex:1;flex-direction:column;overflow:hidden;background-color:rgba(0,0,0,0);border-top-left-radius:4px;border-top-right-radius:4px}.qxs-data-chart__table>div[class*=-table] [class*=-table__body-wrapper] [class*=-table__cell]{border-right:0}.qxs-data-chart__table>div[class*=-table] [class*=-table__body-wrapper] [class$=table__empty-text]{line-height:unset}.qxs-data-chart__empty{display:flex;align-items:center;justify-content:center;height:100%}.qxs-data-chart__empty-content{display:flex;flex-direction:column;align-items:center;pointer-events:none;margin-top:-2px}.qxs-data-chart__empty-description{font-size:14px;color:#74767e;margin-left:1px}.qxs-data-chart__wrapper{height:100%}.qxs-fixed-action-bar__actionbar{bottom:0;z-index:10;padding:var(--qxs-fixed-action-bar-actionbar-padding);padding-bottom:calc(env(safe-area-inset-bottom) + var(--qxs-fixed-action-bar-actionbar-padding-bottom));text-align:center;background-color:var(--qxs-bg-color, #fff);box-shadow:0 0 1px 0 var(--qxs-border-color, #f3f3f2);transition:box-shadow .3s,var(--qxs-transition-box-shadow, #f3f3f2)}.qxs-fixed-action-bar__actionbar.is-shadow{box-shadow:0 0 1px 0 var(--qxs-border-color, #f3f3f2)}.qxs-photo-crop-tool__img-box{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;overflow:hidden;background-color:#fafafa}.qxs-photo-crop-tool__error-message{color:red}.qxs-photo-crop-tool__image{max-width:100%;max-height:100%;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;user-select:none;-o-object-fit:contain;object-fit:contain;-webkit-user-drag:none}.qxs-photo-crop-tool__crop-tool-box{position:absolute;width:calc(var(--qxs-photo-crop-tool-width)*1px);max-width:100%;height:calc(var(--qxs-photo-crop-tool-height)*1px);max-height:100%;aspect-ratio:var(--qxs-photo-crop-tool-aspect-ratio);overflow:hidden;cursor:move;border:1px dashed #fff;box-shadow:0 0 0 9999px rgba(0,0,0,.4)}.qxs-photo-crop-tool__crop-tool-box>div{position:absolute;z-index:3;width:30%;aspect-ratio:1/1;background-color:rgba(2,2,2,.01);border-radius:50%;transition:all .3s}.qxs-photo-crop-tool__crop-tool-box>div:after{content:"";position:absolute;width:10px;height:10px;top:50%;left:50%;transform:translate3d(-50%, -50%, 0);border-radius:50%;background-color:var(--qxs-color-primary, #3d61e3)}.qxs-photo-crop-tool__crop-tool-box>div:hover,.qxs-photo-crop-tool__crop-tool-box>div:active{background-color:rgba(2,2,2,.5)}.qxs-photo-crop-tool__top-left{top:0;left:0;cursor:nwse-resize;transform:translate3d(-50%, -50%, 0)}.qxs-photo-crop-tool__top-right{top:0;right:0;cursor:nesw-resize;transform:translate3d(50%, -50%, 0)}.qxs-photo-crop-tool__bottom-right{right:0;bottom:0;cursor:nwse-resize;transform:translate3d(50%, 50%, 0)}.qxs-photo-crop-tool__bottom-left{bottom:0;left:0;cursor:nesw-resize;transform:translate3d(-50%, 50%, 0)}.el-image-upload__container{line-height:initial}.el-image-upload__control>.el-upload-list--picture-card .el-upload-list__item{width:var(--el-image-upload-width);height:var(--el-image-upload-height)}.el-image-upload__control>.el-upload-list--picture-card .el-upload-list__item [role=progressbar]{width:calc(min(var(--el-image-upload-width),var(--el-image-upload-height))/4*3) !important}.el-image-upload__control>.el-upload-list--picture-card .el-upload-list__item [role=progressbar] .el-progress-circle{width:calc(min(var(--el-image-upload-width),var(--el-image-upload-height))/4*3) !important;height:calc(min(var(--el-image-upload-width),var(--el-image-upload-height))/4*3) !important}.el-image-upload__control>.el-upload-list--picture-card .is-drag{width:var(--el-image-upload-width);height:var(--el-image-upload-height)}.el-image-upload__control>.el-upload-list--picture-card .is-drag .el-upload-dragger{border:unset;background-color:unset;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.el-image-upload__control>.el-upload-list--picture-card .is-drag .el-upload-dragger .image-slot [class$=-icon]{font-size:28px;margin-bottom:10px}.el-image-upload__more-than-limit .is-drag{display:none}.el-image-upload__container .el-upload__tip-text{font-size:14px;line-height:32px;color:#c8c8c8}.qxs-file-upload__control .is-drag{display:inline-block !important}.qxs-file-upload__control .is-drag [class$=-upload-dragger]{padding:0}.qxs-file-upload__control .is-drag [class$=-upload-dragger] [class$=-icon--upload]{margin-bottom:0;font-size:40px}.qxs-file-upload__control .is-drag [class$=-upload-dragger] [class$=-upload__text]{padding:0 6px;font-size:14px;line-height:1.5}.qxs-file-upload__control .is-drag.is-dragover{border-width:1px}.qxs-file-upload__control .is-drag .slot{width:160px;height:90px}.qxs-tiny-mce-editor__tiny-mce .tox-tinymce{border-width:1px;border-radius:var(--qxs-border-radius-base, 4px)}.qxs-tiny-mce-editor__tiny-mce .tox-tinymce:not(.tox-tinymce-inline) .tox-editor-header{box-shadow:0 2px 2px -2px rgba(34,47,62,.1),0 4px 4px -4px rgba(34,47,62,.07)}.qxs-tiny-mce-editor__tiny-mce .tox-tinymce .tox-sidebar-wrap{overflow-y:auto}.qxs-tiny-mce-editor__tiny-mce .tox-tinymce .tox-sidebar-wrap .tox-edit-area::before{border-width:1px;border-radius:0}.qxs-tiny-mce-editor .tox-tinymce-aux{z-index:2500 !important}.qxs-subject-list__list-exam .flex{display:flex;align-items:center}.qxs-subject-list__list-exam .flex-items-center{display:flex;align-items:center}.qxs-subject-list__list-exam .flex-justify-between{display:flex;justify-content:space-between}.qxs-subject-list__list-exam .flex-justify-center{display:flex;justify-content:center}.qxs-subject-list__list-exam .flex-justify-end{display:flex;justify-content:flex-end}.qxs-subject-list__list-exam .margin-left-10{margin-left:10px}.qxs-subject-list__list-exam .label{min-width:50px}.qxs-subject-list__list-exam .flex-1{flex:1}.qxs-subject-list__list-exam .subject-list-wrapper{width:100%;margin-bottom:20px}.qxs-subject-list__list-exam .margin-bottom{margin-bottom:20px}.qxs-subject-list__list-exam .auto-line{flex:1;height:1px;margin:0 15px;background-color:#c8c8c8}.qxs-subject-list__list-exam .title{font-size:14px;font-weight:500}.qxs-subject-list__list-exam .rich-text img{max-width:100%}.qxs-subject-single__single-exam .preview-answer{display:flex;flex-direction:column;margin-bottom:10px}.qxs-subject-single__single-exam .flex{display:flex;align-items:center}.qxs-subject-single__single-exam .margin-bottom{margin-bottom:20px}.qxs-subject-single__single-exam .answer-list .answer-item{margin-top:15px}.qxs-subject-single__single-exam .answer-list .answer-item .input{width:300px}.qxs-subject-single__single-exam .answer-list .answer-item .input [class$=-input]{font-weight:bold}.qxs-subject-single__single-exam .answer-list .answer-item .correct{margin:0 10px}.qxs-subject-single__single-exam .answer-list .answer-item .correct:hover{color:#3d61e3;cursor:pointer}.qxs-subject-single__single-exam .answer-list .answer-item .is-correct{color:#67c23a}.qxs-subject-single__single-exam .answer-list .answer-item .icon{margin-left:10px;font-size:18px;color:#a3a3a3;cursor:pointer}.qxs-subject-single__single-exam .answer-list .answer-item .disabled{color:#c0c4cc;cursor:not-allowed}.qxs-subject-single__single-exam .preview .answer-radio{padding-left:10px}.qxs-subject-single__single-exam .preview .answer-radio .radio{margin-top:10px}.qxs-subject-blank-fill__blank-fill-exam .flex{display:flex;align-items:center}.qxs-subject-blank-fill__blank-fill-exam .label{min-width:50px;margin-right:10px}.qxs-subject-blank-fill__blank-fill-exam .margin-bottom{margin-bottom:20px}.qxs-subject-blank-fill__blank-fill-exam .answer-list .answer-item{width:100%;margin-top:15px}.qxs-subject-blank-fill__blank-fill-exam .answer-list .answer-item .answer-tags{flex:1;padding:5px 15px;border:1px solid #eee;border-radius:4px}.qxs-subject-blank-fill__blank-fill-exam .answer-list .answer-item .answer-tags [class$=-tag]{margin-right:10px}.qxs-subject-blank-fill__blank-fill-exam .preview .content{min-height:100px;padding-top:10px;background-color:#fff}.qxs-subject-text-fill__text-fill-exam .flex{display:flex;align-items:center}.qxs-subject-text-fill__text-fill-exam .label{min-width:50px;margin-right:10px}.qxs-subject-text-fill__text-fill-exam .margin-bottom{margin-bottom:20px}.qxs-subject-text-fill__text-fill-exam .answer-list .answer-item{width:100%;margin-top:15px}.qxs-subject-text-fill__text-fill-exam .answer-list .answer-item .answer-tags{flex:1;padding:5px 15px;border:1px solid #eee;border-radius:4px}.qxs-subject-text-fill__text-fill-exam .answer-list .answer-item .operation .icon{margin-left:10px;font-size:16px;color:#a3a3a3;cursor:pointer}.qxs-subject-text-fill__text-fill-exam .answer-list .answer-item .operation .disabled{color:#c0c4cc;cursor:not-allowed}.qxs-subject-text-fill__text-fill-exam .preview .content{min-height:100px;margin-top:10px}.qxs-subject-scale__scale-exam .flex{display:flex;align-items:center}.qxs-subject-scale__scale-exam .label{min-width:50px}.qxs-subject-scale__scale-exam .margin-bottom{margin-bottom:20px}.qxs-subject-scale__scale-exam .answer{margin:20px 0}.qxs-subject-scale__scale-exam .answer .answer-list{margin-left:40px}.qxs-subject-scale__scale-exam .answer .answer-list .answer-item{margin-bottom:20px}.qxs-subject-scale__scale-exam .answer .answer-list .answer-item .order{width:16px;margin-right:10px}.qxs-subject-scale__scale-exam .answer .answer-list .answer-item .icon{margin-left:10px;font-size:16px;color:#a3a3a3;cursor:pointer}.qxs-subject-scale__scale-exam .answer .answer-list .answer-item .disabled{color:#c0c4cc;cursor:not-allowed}.qxs-subject-scale__scale-exam .preview .answer-radio .radio-item .qxs-radio-wrapper{margin-inline-end:0}.qxs-subject-layout__layout-exam{padding:10px;font-size:12px;color:#5a5a5a}.qxs-subject-layout__layout-exam .edit{position:relative;padding:20px 10px;padding-bottom:10px;margin-top:20px;background-color:#f6f7fb}.qxs-subject-layout__layout-exam .edit .triangle-up{position:absolute;top:-20px;left:100px;width:0;height:0;border-right:20px solid rgba(0,0,0,0);border-bottom:20px solid #f6f7fb;border-left:20px solid rgba(0,0,0,0)}.qxs-subject-action__action-exam .action{padding:20px 0}.qxs-subject-action__action-exam .active{padding-right:10px;padding-left:10px;background-color:#f6f7fb}.qxs-subject-action__action-exam .btn-margin{margin-right:10px}.qxs-subject-action__action-exam .has-set{display:flex;align-items:center;font-size:12px;color:#bbb}.qxs-subject-action__action-exam .vertical-radio-group{display:flex;flex-direction:column;align-items:flex-start;margin-left:20px}.qxs-subject-action__action-exam .vertical-radio-group ::v-deep(.qxs-radio){display:block;margin-right:0}.qxs-subject-type__type-list .type-item{margin-bottom:20px}.qxs-subject-type__type-list .base-subject{display:flex;flex-wrap:wrap;align-items:center}.qxs-subject-type__type-list .base-subject .item{width:50px;height:22px;margin-top:10px;margin-right:10px;font-size:14px;color:#5a5a5a;text-align:center;cursor:pointer;background:#fafafa}.qxs-subject-type__type-list .base-subject .item:hover{color:#3d61e3;background:rgba(61,97,227,.12)}.qxs-icon{position:relative;display:inline-flex;align-items:center;justify-content:center;width:1em;height:1em;font-size:1em;line-height:1em;vertical-align:-2px;fill:currentcolor}.qxs-icon svg{width:100%;height:100%}

package/theme-chalk/index.scss

@@ -11,3 +11,4 @@
 @use "./src/subject-layout";
 @use "./src/subject-action";
 @use "./src/subject-type";
+@use './src/icon';

package/theme-chalk/src/icon.css

@@ -0,0 +1 @@
+.qxs-icon{position:relative;display:inline-flex;align-items:center;justify-content:center;width:1em;height:1em;font-size:1em;line-height:1em;vertical-align:-2px;fill:currentcolor}.qxs-icon svg{width:100%;height:100%}

package/theme-chalk/src/icon.scss

@@ -0,0 +1,19 @@
+@use "mixins/mixins" as *;
+
+@include b(icon) {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 1em;
+  height: 1em;
+  font-size: 1em;
+  line-height: 1em;
+  vertical-align: -2px;
+  fill: currentcolor;
+
+  svg {
+    width: 100%;
+    height: 100%;
+  }
+}

package/theme-chalk/src/image-upload.css

@@ -1 +1 @@
-.qxs-image-upload__container{line-height:initial}.qxs-image-upload__control{display:inline-block;vertical-align:top}.qxs-image-upload__control .image{position:relative;overflow:hidden;border-radius:6px}.qxs-image-upload__control .image .mask{position:absolute;top:0;width:100%;height:100%;background-color:var(--qxs-overlay-color-lighter);opacity:0;transition:opacity .3s}.qxs-image-upload__control .image .mask .actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;width:100px;height:100px;position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%)}.qxs-image-upload__control .image .mask .actions span{width:50%;color:var(--qxs-color-white);text-align:center;cursor:pointer;transition:color .1s,transform .1s}.qxs-image-upload__control .image .mask .actions span:hover{transform:scale(1.5)}.qxs-image-upload__control .image .mask .actions span [class=qxs-icon]{font-size:24px}.qxs-image-upload__control .image:hover .mask{opacity:1}.qxs-image-upload__control .is-drag{display:inline-block !important;font-size:0}.qxs-image-upload__control .is-drag [class$=-upload-dragger]{display:inline-block;padding:0;font-size:0}.qxs-image-upload__control .is-drag [class$=-upload-dragger] [class$=-image]{display:block}.qxs-image-upload__control .is-drag [class$=-upload-dragger].is-dragover{border-width:1px}.qxs-image-upload__control .is-drag [class$=-upload-dragger] .image-slot{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;font-size:14px;color:var(--qxs-text-color-placeholder);background-color:#f5f5f5;transition:all .3s}.qxs-image-upload__control .is-drag [class$=-upload-dragger] .image-slot:hover{background-color:#eee}.qxs-image-upload__control .is-drag [class$=-upload-dragger] .image-slot [class$=-icon]{font-size:28px}.qxs-image-upload__control .is-drag [class$=-upload-dragger] .image-slot p{margin-top:10px;margin-bottom:0;line-height:1em;color:#5a5a5a}.qxs-image-upload__control .is-drag [class$=-upload-dragger] .progress{position:absolute;top:0}.qxs-image-upload__control .is-drag [class$=-upload-dragger] .progress::after{position:absolute;top:0;left:0;width:100%;height:100%;content:"";background-color:var(--qxs-overlay-color-lighter)}.qxs-image-upload__control .is-drag [class$=-upload-dragger] .progress [class$=-progress]{z-index:1;position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%)}.qxs-image-upload__control .is-drag [class$=-upload-dragger] .progress [class$=-progress] [class$=-progress__text]{color:var(--qxs-text-color-placeholder)}.qxs-image-upload__container [class$=-upload__tip-text]{font-size:14px;line-height:32px;color:#c8c8c8}
+.el-image-upload__container{line-height:initial}.el-image-upload__control>.el-upload-list--picture-card .el-upload-list__item{width:var(--el-image-upload-width);height:var(--el-image-upload-height)}.el-image-upload__control>.el-upload-list--picture-card .el-upload-list__item [role=progressbar]{width:calc(min(var(--el-image-upload-width),var(--el-image-upload-height))/4*3) !important}.el-image-upload__control>.el-upload-list--picture-card .el-upload-list__item [role=progressbar] .el-progress-circle{width:calc(min(var(--el-image-upload-width),var(--el-image-upload-height))/4*3) !important;height:calc(min(var(--el-image-upload-width),var(--el-image-upload-height))/4*3) !important}.el-image-upload__control>.el-upload-list--picture-card .is-drag{width:var(--el-image-upload-width);height:var(--el-image-upload-height)}.el-image-upload__control>.el-upload-list--picture-card .is-drag .el-upload-dragger{border:unset;background-color:unset;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.el-image-upload__control>.el-upload-list--picture-card .is-drag .el-upload-dragger .image-slot [class$=-icon]{font-size:28px;margin-bottom:10px}.el-image-upload__more-than-limit .is-drag{display:none}.el-image-upload__container .el-upload__tip-text{font-size:14px;line-height:32px;color:#c8c8c8}

package/theme-chalk/src/image-upload.scss

@@ -1,134 +1,56 @@
-@use "mixins/mixins" as *;
+@use 'element-plus/theme-chalk/src/mixins/config' as *;
+@use 'element-plus/theme-chalk/src/mixins/mixins' as *;
 
 @include b(image-upload) {
+
   @include e(container) {
     line-height: initial;
 
     @include e(control) {
-      display: inline-block;
-      vertical-align: top;
-
-      .image {
-        position: relative;
-        overflow: hidden;
-        border-radius: 6px;
-
-        .mask {
-          position: absolute;
-          top: 0;
-          width: 100%;
-          height: 100%;
-          background-color: var(--#{$namespace}-overlay-color-lighter);
-          opacity: 0;
-          transition: opacity 0.3s;
-
-          .actions {
-            display: flex;
-            flex-wrap: wrap;
-            align-items: center;
-            justify-content: center;
-            width: 100px;
-            height: 100px;
-
-            @include position-center(xy);
-
-            span {
-              width: 50%;
-              color: var(--#{$namespace}-color-white);
-              text-align: center;
-              cursor: pointer;
-              transition: color 0.1s, transform 0.1s;
-
-              &:hover {
-                transform: scale(1.5);
-              }
-
-              [class="#{$namespace}-icon"] {
-                font-size: 24px;
-              }
+      >.#{$namespace}-upload-list--picture-card {
+        
+        .#{$namespace}-upload-list__item {
+          width: getCssVar('image-upload', 'width');
+          height: getCssVar('image-upload', 'height');
+          [role="progressbar"] {
+            width: calc(min(getCssVar('image-upload', 'width'), getCssVar('image-upload', 'height')) / 4 * 3)!important;
+
+            .#{$namespace}-progress-circle {
+              width: calc(min(getCssVar('image-upload', 'width'), getCssVar('image-upload', 'height')) / 4 * 3)!important;
+              height: calc(min(getCssVar('image-upload', 'width'), getCssVar('image-upload', 'height')) / 4 * 3)!important;
             }
           }
         }
 
-        &:hover .mask {
-          opacity: 1;
-        }
-      }
-
-      .is-drag {
-        display: inline-block !important;
-        font-size: 0;
-
-        [class$="-upload-dragger"] {
-          display: inline-block;
-          padding: 0;
-          font-size: 0;
-
-          [class$="-image"] {
-            display: block;
-          }
-
-          &.is-dragover {
-            border-width: 1px;
-          }
+        .is-drag {
+          width: getCssVar('image-upload', 'width');
+          height: getCssVar('image-upload', 'height');
 
-          .image-slot {
-            display: flex;
-            flex-direction: column;
-            align-items: center;
-            justify-content: center;
+          .#{$namespace}-upload-dragger {
+            border: unset;
+            background-color: unset;
             width: 100%;
             height: 100%;
-            font-size: 14px;
-            color: var(--#{$namespace}-text-color-placeholder);
-            background-color: #f5f5f5;
-            transition: all 0.3s;
-
-            &:hover {
-              background-color: #eee;
-            }
-
-            [class$="-icon"] {
-              font-size: 28px;
-            }
-
-            p {
-              margin-top: 10px;
-              margin-bottom: 0;
-              line-height: 1em;
-              color: #5a5a5a;
-            }
-          }
-
-          .progress {
-            position: absolute;
-            top: 0;
-
-            &::after {
-              position: absolute;
-              top: 0;
-              left: 0;
-              width: 100%;
-              height: 100%;
-              content: "";
-              background-color: var(--#{$namespace}-overlay-color-lighter);
-            }
-
-            [class$="-progress"] {
-              z-index: 1;
-
-              @include position-center(xy);
-
-              [class$="-progress__text"] {
-                color: var(--#{$namespace}-text-color-placeholder);
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            .image-slot {
+              [class$="-icon"] {
+                font-size: 28px;
+                margin-bottom: 10px;
               }
             }
           }
         }
       }
     }
+    @include e(more-than-limit) {
+      .is-drag {
+        display: none;
+      }
+    }
 
-    [class$="-upload__tip-text"] {
+    .#{$namespace}-upload__tip-text {
       font-size: 14px;
       line-height: 32px;
       color: #c8c8c8;

package/theme-chalk/src/photo-crop-tool.css

@@ -1 +1 @@
-.qxs-photo-crop-tool__img-box{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;overflow:hidden;background-color:#fafafa}.qxs-photo-crop-tool__error-message{color:red}.qxs-photo-crop-tool__image{max-width:100%;max-height:100%;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;user-select:none;-o-object-fit:contain;object-fit:contain;-webkit-user-drag:none}.qxs-photo-crop-tool__crop-tool-box{position:absolute;width:calc(var(--qxs-photo-crop-tool-width)*1px);max-width:100%;height:calc(var(--qxs-photo-crop-tool-height)*1px);max-height:100%;aspect-ratio:var(--qxs-photo-crop-tool-aspect-ratio);overflow:hidden;cursor:move;border:1px dashed #fff;box-shadow:0 0 0 9999px rgba(0,0,0,.4)}.qxs-photo-crop-tool__crop-tool-box>div{position:absolute;z-index:3;width:30%;aspect-ratio:1/1;background-color:rgba(2,2,2,.01);border-radius:50%;transition:all .3s}.qxs-photo-crop-tool__crop-tool-box>div:hover,.qxs-photo-crop-tool__crop-tool-box>div:active{background-color:rgba(2,2,2,.5)}.qxs-photo-crop-tool__top-left{top:0;left:0;cursor:nwse-resize;transform:translate3d(-50%, -50%, 0)}.qxs-photo-crop-tool__top-right{top:0;right:0;cursor:nesw-resize;transform:translate3d(50%, -50%, 0)}.qxs-photo-crop-tool__bottom-right{right:0;bottom:0;cursor:nwse-resize;transform:translate3d(50%, 50%, 0)}.qxs-photo-crop-tool__bottom-left{bottom:0;left:0;cursor:nesw-resize;transform:translate3d(-50%, 50%, 0)}
+.qxs-photo-crop-tool__img-box{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;overflow:hidden;background-color:#fafafa}.qxs-photo-crop-tool__error-message{color:red}.qxs-photo-crop-tool__image{max-width:100%;max-height:100%;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;user-select:none;-o-object-fit:contain;object-fit:contain;-webkit-user-drag:none}.qxs-photo-crop-tool__crop-tool-box{position:absolute;width:calc(var(--qxs-photo-crop-tool-width)*1px);max-width:100%;height:calc(var(--qxs-photo-crop-tool-height)*1px);max-height:100%;aspect-ratio:var(--qxs-photo-crop-tool-aspect-ratio);overflow:hidden;cursor:move;border:1px dashed #fff;box-shadow:0 0 0 9999px rgba(0,0,0,.4)}.qxs-photo-crop-tool__crop-tool-box>div{position:absolute;z-index:3;width:30%;aspect-ratio:1/1;background-color:rgba(2,2,2,.01);border-radius:50%;transition:all .3s}.qxs-photo-crop-tool__crop-tool-box>div:after{content:"";position:absolute;width:10px;height:10px;top:50%;left:50%;transform:translate3d(-50%, -50%, 0);border-radius:50%;background-color:var(--qxs-color-primary, #3d61e3)}.qxs-photo-crop-tool__crop-tool-box>div:hover,.qxs-photo-crop-tool__crop-tool-box>div:active{background-color:rgba(2,2,2,.5)}.qxs-photo-crop-tool__top-left{top:0;left:0;cursor:nwse-resize;transform:translate3d(-50%, -50%, 0)}.qxs-photo-crop-tool__top-right{top:0;right:0;cursor:nesw-resize;transform:translate3d(50%, -50%, 0)}.qxs-photo-crop-tool__bottom-right{right:0;bottom:0;cursor:nwse-resize;transform:translate3d(50%, 50%, 0)}.qxs-photo-crop-tool__bottom-left{bottom:0;left:0;cursor:nesw-resize;transform:translate3d(-50%, 50%, 0)}

package/theme-chalk/src/photo-crop-tool.scss

@@ -36,8 +36,10 @@
       overflow: hidden;
       cursor: move;
       border: 1px dashed #fff;
-      box-shadow: 0 0 0 9999px rgb(0 0 0 / 40%); /* 扩展阴影以覆盖周围区域 */
-      > div {
+      box-shadow: 0 0 0 9999px rgb(0 0 0 / 40%);
+
+      /* 扩展阴影以覆盖周围区域 */
+      >div {
         position: absolute;
         z-index: 3;
         width: 30%;
@@ -46,6 +48,18 @@
         border-radius: 50%;
         transition: all 0.3s;
 
+        &:after {
+          content: "";
+          position: absolute;
+          width: 10px;
+          height: 10px;
+          top: 50%;
+          left: 50%;
+          transform: translate3d(-50%, -50%, 0);
+          border-radius: 50%;
+          background-color: var(--#{$namespace}-color-primary, $text-color-primary);
+        }
+
         &:hover,
         &:active {
           background-color: rgba($color: #020202, $alpha: 50%);
@@ -81,4 +95,4 @@
       }
     }
   }
-}
+}

package/types/src/components.d.ts

@@ -8,4 +8,5 @@ export * from './subject-layout/index';
 export * from './subject-list/index';
 export * from './subject-type/index';
 export * from './tiny-mce-editor/index';
+export * from './icon/index';
 //# sourceMappingURL=components.d.ts.map

package/types/src/components.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../../../packages/components/src/components.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAA;AAElC,cAAc,qBAAqB,CAAA;AAEnC,cAAc,0BAA0B,CAAA;AAExC,cAAc,sBAAsB,CAAA;AAEpC,cAAc,yBAAyB,CAAA;AAEvC,cAAc,wBAAwB,CAAA;AAEtC,cAAc,wBAAwB,CAAA;AAEtC,cAAc,sBAAsB,CAAA;AAEpC,cAAc,sBAAsB,CAAA;AAEpC,cAAc,yBAAyB,CAAA"}
+{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../../../packages/components/src/components.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAA;AAElC,cAAc,qBAAqB,CAAA;AAEnC,cAAc,0BAA0B,CAAA;AAExC,cAAc,sBAAsB,CAAA;AAEpC,cAAc,yBAAyB,CAAA;AAEvC,cAAc,wBAAwB,CAAA;AAEtC,cAAc,wBAAwB,CAAA;AAEtC,cAAc,sBAAsB,CAAA;AAEpC,cAAc,sBAAsB,CAAA;AAEpC,cAAc,yBAAyB,CAAA;AAEvC,cAAc,cAAc,CAAA"}

package/types/src/icon/index.d.ts

@@ -0,0 +1,4 @@
+declare const Icon: import("../withInstall").SFCWithInstall<import("vue").DefineComponent<import("./src/icon.vue").PropsType, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("./src/icon.vue").PropsType> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>> & Record<string, any>;
+export { Icon, };
+export default Icon;
+//# sourceMappingURL=index.d.ts.map

package/types/src/icon/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../packages/components/src/icon/index.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,IAAI,+YAAyB,CAAA;AAEnC,OAAO,EACL,IAAI,GACL,CAAA;AAED,eAAe,IAAI,CAAA"}

package/types/src/icon/src/icon.vue.d.ts

@@ -0,0 +1,11 @@
+export interface PropsType {
+    name: string;
+    runtime?: boolean;
+    flip?: 'horizontal' | 'vertical' | 'both' | '';
+    rotate?: number;
+    color?: string;
+    size?: string | number;
+}
+declare const _default: import("vue").DefineComponent<PropsType, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PropsType> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;
+//# sourceMappingURL=icon.vue.d.ts.map

package/types/src/icon/src/icon.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.vue.d.ts","sourceRoot":"","sources":["../../../../../../packages/components/src/icon/src/icon.vue"],"names":[],"mappings":"AA8GA,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,IAAI,CAAC,EAAE,YAAY,GAAG,UAAU,GAAG,MAAM,GAAG,EAAE,CAAA;IAC9C,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CACvB;;AAgHD,wBAMG"}

package/types/src/icon/style/index.d.ts

@@ -0,0 +1,3 @@
+import '../../base/style';
+import '../../../../theme-chalk/src/icon.scss';
+//# sourceMappingURL=index.d.ts.map

package/types/src/icon/style/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../packages/components/src/icon/style/index.ts"],"names":[],"mappings":"AAAA,OAAO,kBAAkB,CAAA;AACzB,OAAO,uCAAuC,CAAA"}

package/types/src/image-upload/index.d.ts

@@ -1,10 +1,47 @@
-declare const QxsImageUpload: import("../withInstall").SFCWithInstall<import("vue").DefineComponent<import("./src/image-upload.vue").ImageUploadProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    onSuccess: (res: any, uploadFile: import("element-plus").UploadFile, uploadFiles: import("element-plus").UploadFiles) => any;
-    "update:url": (url: string) => any;
-}, string, import("vue").PublicProps, Readonly<import("./src/image-upload.vue").ImageUploadProps> & Readonly<{
+declare const QxsImageUpload: import("../withInstall").SFCWithInstall<{
+    new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("./src/image-upload.vue").ImageUploadProps & {
+        fileList?: import("element-plus").UploadFile[];
+    }> & Readonly<{
+        onOnSuccess?: ((res: any, uploadFile: import("element-plus").UploadFile, uploadFiles: import("element-plus").UploadFiles) => any) | undefined;
+        onRemove?: ((file: import("element-plus").UploadFile) => any) | undefined;
+        "onUpdate:fileList"?: ((value: import("element-plus").UploadFile[]) => any) | undefined;
+    }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        onSuccess: (res: any, uploadFile: import("element-plus").UploadFile, uploadFiles: import("element-plus").UploadFiles) => any;
+        remove: (file: import("element-plus").UploadFile) => any;
+        "update:fileList": (value: import("element-plus").UploadFile[]) => any;
+    }, import("vue").PublicProps, {}, false, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import("./src/image-upload.vue").ImageUploadProps & {
+        fileList?: import("element-plus").UploadFile[];
+    }> & Readonly<{
+        onOnSuccess?: ((res: any, uploadFile: import("element-plus").UploadFile, uploadFiles: import("element-plus").UploadFiles) => any) | undefined;
+        onRemove?: ((file: import("element-plus").UploadFile) => any) | undefined;
+        "onUpdate:fileList"?: ((value: import("element-plus").UploadFile[]) => any) | undefined;
+    }>, {}, {}, {}, {}, {}>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import("vue").ComponentOptionsBase<Readonly<import("./src/image-upload.vue").ImageUploadProps & {
+    fileList?: import("element-plus").UploadFile[];
+}> & Readonly<{
     onOnSuccess?: ((res: any, uploadFile: import("element-plus").UploadFile, uploadFiles: import("element-plus").UploadFiles) => any) | undefined;
-    "onUpdate:url"?: ((url: string) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>> & Record<string, any>;
+    onRemove?: ((file: import("element-plus").UploadFile) => any) | undefined;
+    "onUpdate:fileList"?: ((value: import("element-plus").UploadFile[]) => any) | undefined;
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    onSuccess: (res: any, uploadFile: import("element-plus").UploadFile, uploadFiles: import("element-plus").UploadFiles) => any;
+    remove: (file: import("element-plus").UploadFile) => any;
+    "update:fileList": (value: import("element-plus").UploadFile[]) => any;
+}, string, {}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+    $slots: {
+        default?: ((props: {}) => any) | undefined;
+        tip?: ((props: {}) => any) | undefined;
+    };
+})> & Record<string, any>;
 export { QxsImageUpload, };
 export default QxsImageUpload;
 //# sourceMappingURL=index.d.ts.map

package/types/src/image-upload/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../packages/components/src/image-upload/index.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,cAAc;;;;;;yGAAyB,CAAA;AAE7C,OAAO,EACL,cAAc,GACf,CAAA;AAED,eAAe,cAAc,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../packages/components/src/image-upload/index.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yBAAyB,CAAA;AAE7C,OAAO,EACL,cAAc,GACf,CAAA;AAED,eAAe,cAAc,CAAA"}