@robot-admin/naive-ui-components 0.17.0 → 0.17.2

package/dist/C_Signature2.js

@@ -1 +1 @@
-import{t as e}from"./C_Icon2.js";import{t}from"./export-helper.js";import{computed as n,createCommentVNode as r,createElementBlock as i,createElementVNode as a,createTextVNode as o,createVNode as s,defineComponent as c,normalizeClass as l,normalizeStyle as u,onMounted as d,onUnmounted as f,openBlock as p,reactive as m,readonly as h,ref as g,shallowRef as _,toRef as v,unref as y,watch as b,withCtx as x}from"vue";import{NButton as S,NButtonGroup as ee,NColorPicker as te,NInputNumber as ne}from"naive-ui";function C(e){let{canvasRef:t,penConfig:n,mode:r,disabled:i,backgroundImage:a,importedImage:o,onStrokeComplete:s,onDrawStart:c,onDrawing:l}=e,u=g(!1),d=g([]),f=null,p=()=>{let e=t.value;if(!e||(f=e.getContext(`2d`,{willReadFrequently:!0}),!f))return;let n=window.devicePixelRatio||1,r=e.getBoundingClientRect();e.width=r.width*n,e.height=r.height*n,f.scale(n,n),f.lineCap=`round`,f.lineJoin=`round`},m=e=>{let n=t.value;if(!n)return{x:0,y:0};let r=n.getBoundingClientRect(),i,a;if(`touches`in e&&e.touches.length>0)({clientX:i,clientY:a}=e.touches[0]);else if(`clientX`in e)({clientX:i,clientY:a}=e);else return{x:0,y:0};return{x:i-r.left,y:a-r.top,timestamp:Date.now()}},_=(e,t,n,r=!1)=>{f&&(f.save(),r?(f.globalCompositeOperation=`destination-out`,f.lineWidth=20):(f.globalCompositeOperation=`source-over`,f.strokeStyle=n.color,f.lineWidth=n.width,f.globalAlpha=n.opacity),f.beginPath(),f.moveTo(e.x,e.y),f.lineTo(t.x,t.y),f.stroke(),f.restore())},v=e=>{if(i.value)return;e.preventDefault(),u.value=!0,d.value=[];let t=m(e);d.value.push(t),c()},y=e=>{if(!u.value||i.value)return;e.preventDefault();let t=m(e),a=d.value[d.value.length-1];a&&_(a,t,n.value,r.value===`eraser`),d.value.push(t),l(t)},b=e=>{!u.value||i.value||(e.preventDefault(),u.value=!1,d.value.length>0&&(s({points:[...d.value],color:n.value.color,width:n.value.width,opacity:n.value.opacity,mode:r.value}),d.value=[]))};return{isDrawing:h(u),initCanvas:p,bindEvents:()=>{let e=t.value;e&&(e.addEventListener(`mousedown`,v),e.addEventListener(`mousemove`,y),e.addEventListener(`mouseup`,b),e.addEventListener(`mouseleave`,b),e.addEventListener(`touchstart`,v,{passive:!1}),e.addEventListener(`touchmove`,y,{passive:!1}),e.addEventListener(`touchend`,b),e.addEventListener(`touchcancel`,b))},unbindEvents:()=>{let e=t.value;e&&(e.removeEventListener(`mousedown`,v),e.removeEventListener(`mousemove`,y),e.removeEventListener(`mouseup`,b),e.removeEventListener(`mouseleave`,b),e.removeEventListener(`touchstart`,v),e.removeEventListener(`touchmove`,y),e.removeEventListener(`touchend`,b),e.removeEventListener(`touchcancel`,b))},redrawStrokes:e=>{if(!f||!t.value)return;let n=t.value,{width:r,height:i}=n.getBoundingClientRect();f.clearRect(0,0,n.width,n.height),a?.value&&f.drawImage(a.value,0,0,r,i),o?.value&&f.drawImage(o.value,0,0,r,i),e.forEach(e=>{for(let t=1;t<e.points.length;t++)_(e.points[t-1],e.points[t],{color:e.color,width:e.width,opacity:e.opacity},e.mode===`eraser`)})},clearCanvas:()=>{!f||!t.value||f.clearRect(0,0,t.value.width,t.value.height)}}}const w=e=>e.map(e=>({...e,points:e.points.map(e=>({...e}))}));function T(e={}){let{onChange:t}=e,r=Math.max(2,Math.floor(e.maxHistory??50)),i=g([]),a=g([]),o=g(-1),s=n(()=>o.value>0),c=n(()=>o.value<a.value.length-1),l=e=>{i.value.push(w([e])[0]),u()},u=()=>{a.value=a.value.slice(0,o.value+1),a.value.push(w(i.value)),o.value++,a.value.length>r&&(a.value.shift(),o.value--),t?.(w(i.value))},d=()=>s.value?(o.value--,i.value=w(a.value[o.value]),t?.(w(i.value)),!0):!1,f=()=>c.value?(o.value++,i.value=w(a.value[o.value]),t?.(w(i.value)),!0):!1,p=()=>{i.value=[],a.value=[[]],o.value=0,t?.([])},m=e=>{i.value=w(e),a.value=[w(e)],o.value=0,t?.(w(i.value))},_=n(()=>i.value.length===0);return a.value=[[]],o.value=0,{strokes:h(i),canUndo:h(s),canRedo:h(c),isEmpty:h(_),addStroke:l,undo:d,redo:f,clear:p,loadData:m}}function E(e){let{canvasRef:t,watermark:n}=e,r=(e,t,n,r)=>{let i={"top-left":{x:10,y:n+10},"top-right":{x:e.width-t-10,y:n+10},"bottom-left":{x:10,y:e.height-10},"bottom-right":{x:e.width-t-10,y:e.height-10}};return i[r]||i[`bottom-right`]},i=(e,t)=>{let i=e.getContext(`2d`);if(!i||!n?.value)return;let a={fontSize:n.value.fontSize||12,color:n.value.color||`#999999`,position:n.value.position||`bottom-right`};i.save(),i.font=`${a.fontSize}px Arial`,i.fillStyle=a.color,i.textBaseline=`bottom`;let o=i.measureText(t).width,{x:s,y:c}=r(e,o,a.fontSize,a.position);i.fillText(t,s,c),i.restore()},a=(e,t,n)=>{let r=document.createElement(`canvas`);r.width=e.width,r.height=e.height;let i=r.getContext(`2d`);if(!i)throw Error(`无法创建临时 Canvas`);return t&&(i.fillStyle=n,i.fillRect(0,0,r.width,r.height)),i.drawImage(e,0,0),{canvas:r,ctx:i}},o=(e,t)=>{let{includeBackground:r=!1,backgroundColor:o=`#FFFFFF`,includeWatermark:s=!1}=t,{canvas:c}=a(e,r,o);return s&&n?.value?.text&&i(c,n.value.text),c},s=(e,t)=>new Promise((n,r)=>{e.toBlob(e=>e?n(e):r(Error(`导出失败`)),`image/png`,t)}),c=e=>{let t=e.getContext(`2d`);if(!t)return!0;let{data:n}=t.getImageData(0,0,e.width,e.height);return!n.some(e=>e!==0)},l=async(e={})=>{let n=t.value;if(!n)throw Error(`Canvas 未初始化`);if(c(n))throw Error(`签名为空，请先签名后再导出`);let{format:r=`png`,quality:i=.92}=e,a=o(n,{...e,includeBackground:e.includeBackground??r===`jpeg`});if(r===`blob`)return s(a,i);if(r===`svg`){let e=a.toDataURL(`image/png`),t=`<svg xmlns="http://www.w3.org/2000/svg" width="${a.width}" height="${a.height}" viewBox="0 0 ${a.width} ${a.height}"><image href="${e}" width="100%" height="100%"/></svg>`;return`data:image/svg+xml;charset=utf-8,${encodeURIComponent(t)}`}let l=r===`jpeg`?`image/jpeg`:`image/png`;return a.toDataURL(l,i)};return{exportSignature:l,download:async(e=`signature`,t={})=>{let n=t.format||`png`,r=await l({...t,format:n});if(r instanceof Blob){let t=URL.createObjectURL(r),i=document.createElement(`a`);i.href=t,i.download=`${e}.${n===`blob`?`png`:n}`,document.body.appendChild(i),i.click(),i.remove(),setTimeout(()=>URL.revokeObjectURL(t),1e3)}else if(typeof r==`string`){let t=document.createElement(`a`);t.href=r,t.download=`${e}.${n}`,document.body.appendChild(t),t.click(),t.remove()}},loadImage:async e=>{let n=t.value;if(!n)throw Error(`Canvas 未初始化`);let r=n.getContext(`2d`);if(!r)throw Error(`无法获取 Canvas 上下文`);return new Promise((t,i)=>{let a=new Image;a.crossOrigin=`anonymous`,a.onload=()=>{r.clearRect(0,0,n.width,n.height),r.drawImage(a,0,0,n.width,n.height),t()},a.onerror=()=>i(Error(`图片加载失败: ${e}`)),a.src=e})}}}const re={color:`#000000`,width:2,opacity:1},ie={show:!1,text:``,fontSize:12,color:`#999999`,position:`bottom-right`},D=[`#000000`,`#FF0000`,`#0000FF`,`#00AA00`,`#FF6600`,`#9900FF`],ae={class:`c-signature`},oe={key:0,class:`signature-toolbar`},se={class:`toolbar-section`},ce={key:0,class:`toolbar-section`},le={key:1,class:`toolbar-section`},ue={class:`toolbar-section`},O={class:`toolbar-section`},de={key:0,class:`canvas-placeholder`};var k=t(c({name:`C_Signature`,__name:`index`,props:{width:{default:`100%`},height:{default:300},penConfig:{},eraserConfig:{},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},backgroundImage:{},backgroundColor:{},watermark:{},showToolbar:{type:Boolean,default:!0},maxHistory:{default:50}},emits:[`start-draw`,`drawing`,`end-draw`,`clear`,`undo`,`redo`,`change`,`error`],setup(t,{expose:c,emit:h}){let w=t,k=h,A=g(null),j=g(null),M=_(null),N=_(null),P=n(()=>w.disabled||w.readonly),F=g(`pen`),I=m({...re,...w.penConfig}),fe=m({...ie,...w.watermark}),{strokes:L,canUndo:R,canRedo:z,isEmpty:B,addStroke:V,undo:pe,redo:me,clear:H,loadData:he}=T({maxHistory:w.maxHistory,onChange:e=>{W.redrawStrokes(e),k(`change`,e)}}),U=n(()=>B.value&&!N.value),W=C({canvasRef:A,penConfig:v(I),mode:F,disabled:P,backgroundImage:M,importedImage:N,onStrokeComplete:e=>{V(e),k(`end-draw`,e)},onDrawStart:()=>k(`start-draw`),onDrawing:e=>k(`drawing`,e)}),G=E({canvasRef:A,watermark:v(fe)}),K=()=>{let e=pe();return e&&k(`undo`),e},q=()=>{let e=me();return e&&k(`redo`),e},J=()=>{N.value=null,H(),k(`clear`)},ge=async e=>G.exportSignature(e),_e=async(e,t)=>G.download(e,t);function Y(e){return new Promise((t,n)=>{let r=new Image;r.crossOrigin=`anonymous`,r.onload=()=>t(r),r.onerror=()=>n(Error(`签名图片加载失败`)),r.src=e})}let X=0;async function Z(e){let t=++X;if(!e){M.value=null,W.redrawStrokes(L.value);return}let n=await Y(e);t===X&&(M.value=n,W.redrawStrokes(L.value))}let ve=async e=>{N.value=await Y(e),H()},ye=()=>L.value.map(e=>({...e,points:e.points.map(e=>({...e}))})),be=e=>{N.value=null,he(e)},xe=()=>U.value;d(()=>{W.initCanvas(),W.bindEvents(),typeof ResizeObserver<`u`&&j.value&&(Q=new ResizeObserver(()=>{W.initCanvas(),W.redrawStrokes(L.value)}),Q.observe(j.value)),Z(w.backgroundImage).catch($)});let Q=null;function $(e){k(`error`,e instanceof Error?e:Error(String(e)))}return b(()=>w.backgroundImage,e=>{Z(e).catch($)}),f(()=>{X++,Q?.disconnect(),W.unbindEvents()}),c({clear:J,undo:K,redo:q,export:ge,download:_e,loadImage:ve,getSignatureData:ye,loadSignatureData:be,isEmpty:xe}),(n,c)=>(p(),i(`div`,ae,[t.showToolbar?(p(),i(`div`,oe,[a(`div`,se,[s(y(ee),null,{default:x(()=>[s(y(S),{type:F.value===`pen`?`primary`:`default`,size:`small`,disabled:P.value,onClick:c[0]||=e=>F.value=`pen`},{icon:x(()=>[s(e,{name:`mdi:draw`,size:16,color:`currentColor`})]),default:x(()=>[c[4]||=o(` 画笔 `,-1)]),_:1},8,[`type`,`disabled`]),s(y(S),{type:F.value===`eraser`?`primary`:`default`,size:`small`,disabled:P.value,onClick:c[1]||=e=>F.value=`eraser`},{icon:x(()=>[s(e,{name:`mdi:eraser`,size:16,color:`currentColor`})]),default:x(()=>[c[5]||=o(` 橡皮擦 `,-1)]),_:1},8,[`type`,`disabled`])]),_:1})]),c[11]||=a(`div`,{class:`toolbar-section divider`},null,-1),F.value===`pen`?(p(),i(`div`,ce,[c[6]||=a(`span`,{class:`section-label`},`颜色`,-1),s(y(te),{value:I.color,"onUpdate:value":c[2]||=e=>I.color=e,"show-alpha":!1,disabled:P.value,size:`small`,swatches:y(D)},null,8,[`value`,`disabled`,`swatches`])])):r(`v-if`,!0),F.value===`pen`?(p(),i(`div`,le,[c[7]||=a(`span`,{class:`section-label`},`粗细`,-1),s(y(ne),{value:I.width,"onUpdate:value":c[3]||=e=>I.width=e,min:1,max:20,disabled:P.value,size:`small`,style:{width:`80px`}},null,8,[`value`,`disabled`])])):r(`v-if`,!0),c[12]||=a(`div`,{class:`toolbar-section divider`},null,-1),a(`div`,ue,[s(y(S),{size:`small`,disabled:P.value||!y(R),onClick:K},{icon:x(()=>[s(e,{name:`mdi:undo`,size:16,color:`currentColor`})]),default:x(()=>[c[8]||=o(` 撤销 `,-1)]),_:1},8,[`disabled`]),s(y(S),{size:`small`,disabled:P.value||!y(z),onClick:q},{icon:x(()=>[s(e,{name:`mdi:redo`,size:16,color:`currentColor`})]),default:x(()=>[c[9]||=o(` 重做 `,-1)]),_:1},8,[`disabled`])]),c[13]||=a(`div`,{class:`toolbar-section divider`},null,-1),a(`div`,O,[s(y(S),{size:`small`,type:`error`,disabled:P.value||U.value,onClick:J},{icon:x(()=>[s(e,{name:`mdi:delete-outline`,size:16,color:`currentColor`})]),default:x(()=>[c[10]||=o(` 清空 `,-1)]),_:1},8,[`disabled`])])])):r(`v-if`,!0),a(`div`,{ref_key:`canvasWrapperRef`,ref:j,class:l([`signature-canvas-wrapper`,{disabled:t.disabled,readonly:t.readonly}]),style:u({width:typeof t.width==`number`?`${t.width}px`:t.width,height:typeof t.height==`number`?`${t.height}px`:t.height,backgroundColor:t.backgroundColor||`transparent`})},[a(`canvas`,{ref_key:`canvasRef`,ref:A,class:l([`signature-canvas`,{disabled:t.disabled,readonly:t.readonly}])},null,2),U.value&&!t.disabled&&!t.readonly?(p(),i(`div`,de,` 请在此处签名 `)):r(`v-if`,!0)],6)]))}}),[[`__scopeId`,`data-v-66ce1727`]]);export{C as i,E as n,T as r,k as t};
+import{t as e}from"./C_Icon2.js";import{t}from"./export-helper.js";import{computed as n,createCommentVNode as r,createElementBlock as i,createElementVNode as a,createTextVNode as o,createVNode as s,defineComponent as c,normalizeClass as l,normalizeStyle as u,onMounted as d,onUnmounted as f,openBlock as p,reactive as m,readonly as h,ref as g,shallowRef as _,toRef as v,unref as y,watch as b,withCtx as x}from"vue";import{NButton as S,NButtonGroup as ee,NColorPicker as C,NInputNumber as te}from"naive-ui";function w(e){let{canvasRef:t,penConfig:n,mode:r,disabled:i,backgroundImage:a,importedImage:o,onStrokeComplete:s,onDrawStart:c,onDrawing:l}=e,u=g(!1),d=g([]),f=null,p=()=>{let e=t.value;if(!e||(f=e.getContext(`2d`,{willReadFrequently:!0}),!f))return;let n=window.devicePixelRatio||1,r=e.getBoundingClientRect();e.width=r.width*n,e.height=r.height*n,f.scale(n,n),f.lineCap=`round`,f.lineJoin=`round`},m=e=>{let n=t.value;if(!n)return{x:0,y:0};let r=n.getBoundingClientRect(),i,a;if(`touches`in e&&e.touches.length>0)({clientX:i,clientY:a}=e.touches[0]);else if(`clientX`in e)({clientX:i,clientY:a}=e);else return{x:0,y:0};return{x:i-r.left,y:a-r.top,timestamp:Date.now()}},_=(e,t,n,r=!1)=>{f&&(f.save(),r?(f.globalCompositeOperation=`destination-out`,f.lineWidth=20):(f.globalCompositeOperation=`source-over`,f.strokeStyle=n.color,f.lineWidth=n.width,f.globalAlpha=n.opacity),f.beginPath(),f.moveTo(e.x,e.y),f.lineTo(t.x,t.y),f.stroke(),f.restore())},v=e=>{if(i.value)return;e.preventDefault(),u.value=!0,d.value=[];let t=m(e);d.value.push(t),c()},y=e=>{if(!u.value||i.value)return;e.preventDefault();let t=m(e),a=d.value[d.value.length-1];a&&_(a,t,n.value,r.value===`eraser`),d.value.push(t),l(t)},b=e=>{!u.value||i.value||(e.preventDefault(),u.value=!1,d.value.length>0&&(s({points:[...d.value],color:n.value.color,width:n.value.width,opacity:n.value.opacity,mode:r.value}),d.value=[]))};return{isDrawing:h(u),initCanvas:p,bindEvents:()=>{let e=t.value;e&&(e.addEventListener(`mousedown`,v),e.addEventListener(`mousemove`,y),e.addEventListener(`mouseup`,b),e.addEventListener(`mouseleave`,b),e.addEventListener(`touchstart`,v,{passive:!1}),e.addEventListener(`touchmove`,y,{passive:!1}),e.addEventListener(`touchend`,b),e.addEventListener(`touchcancel`,b))},unbindEvents:()=>{let e=t.value;e&&(e.removeEventListener(`mousedown`,v),e.removeEventListener(`mousemove`,y),e.removeEventListener(`mouseup`,b),e.removeEventListener(`mouseleave`,b),e.removeEventListener(`touchstart`,v),e.removeEventListener(`touchmove`,y),e.removeEventListener(`touchend`,b),e.removeEventListener(`touchcancel`,b))},redrawStrokes:e=>{if(!f||!t.value)return;let n=t.value,{width:r,height:i}=n.getBoundingClientRect();f.clearRect(0,0,n.width,n.height),a?.value&&f.drawImage(a.value,0,0,r,i),o?.value&&f.drawImage(o.value,0,0,r,i),e.forEach(e=>{for(let t=1;t<e.points.length;t++)_(e.points[t-1],e.points[t],{color:e.color,width:e.width,opacity:e.opacity},e.mode===`eraser`)})},clearCanvas:()=>{!f||!t.value||f.clearRect(0,0,t.value.width,t.value.height)}}}const T=e=>e.map(e=>({...e,points:e.points.map(e=>({...e}))}));function E(e={}){let{onChange:t}=e,r=Math.max(2,Math.floor(e.maxHistory??50)),i=g([]),a=g([]),o=g(-1),s=n(()=>o.value>0),c=n(()=>o.value<a.value.length-1),l=e=>{i.value.push(T([e])[0]),u()},u=()=>{a.value=a.value.slice(0,o.value+1),a.value.push(T(i.value)),o.value++,a.value.length>r&&(a.value.shift(),o.value--),t?.(T(i.value))},d=()=>s.value?(o.value--,i.value=T(a.value[o.value]),t?.(T(i.value)),!0):!1,f=()=>c.value?(o.value++,i.value=T(a.value[o.value]),t?.(T(i.value)),!0):!1,p=()=>{i.value=[],a.value=[[]],o.value=0,t?.([])},m=e=>{i.value=T(e),a.value=[T(e)],o.value=0,t?.(T(i.value))},_=n(()=>i.value.length===0);return a.value=[[]],o.value=0,{strokes:h(i),canUndo:h(s),canRedo:h(c),isEmpty:h(_),addStroke:l,undo:d,redo:f,clear:p,loadData:m}}function D(e){let{canvasRef:t,watermark:n}=e,r=(e,t,n,r)=>{let i={"top-left":{x:10,y:n+10},"top-right":{x:e.width-t-10,y:n+10},"bottom-left":{x:10,y:e.height-10},"bottom-right":{x:e.width-t-10,y:e.height-10}};return i[r]||i[`bottom-right`]},i=(e,t)=>{let i=e.getContext(`2d`);if(!i||!n?.value)return;let a={fontSize:n.value.fontSize||12,color:n.value.color||`#999999`,position:n.value.position||`bottom-right`};i.save(),i.font=`${a.fontSize}px Arial`,i.fillStyle=a.color,i.textBaseline=`bottom`;let o=i.measureText(t).width,{x:s,y:c}=r(e,o,a.fontSize,a.position);i.fillText(t,s,c),i.restore()},a=(e,t,n)=>{let r=document.createElement(`canvas`);r.width=e.width,r.height=e.height;let i=r.getContext(`2d`);if(!i)throw Error(`无法创建临时 Canvas`);return t&&(i.fillStyle=n,i.fillRect(0,0,r.width,r.height)),i.drawImage(e,0,0),{canvas:r,ctx:i}},o=(e,t)=>{let{includeBackground:r=!1,backgroundColor:o=`#FFFFFF`,includeWatermark:s=!1}=t,{canvas:c}=a(e,r,o);return s&&n?.value?.text&&i(c,n.value.text),c},s=(e,t)=>new Promise((n,r)=>{e.toBlob(e=>e?n(e):r(Error(`导出失败`)),`image/png`,t)}),c=e=>{let t=e.getContext(`2d`);if(!t)return!0;let{data:n}=t.getImageData(0,0,e.width,e.height);return!n.some(e=>e!==0)},l=async(e={})=>{let n=t.value;if(!n)throw Error(`Canvas 未初始化`);if(c(n))throw Error(`签名为空，请先签名后再导出`);let{format:r=`png`,quality:i=.92}=e,a=o(n,{...e,includeBackground:e.includeBackground??r===`jpeg`});if(r===`blob`)return s(a,i);if(r===`svg`){let e=a.toDataURL(`image/png`),t=`<svg xmlns="http://www.w3.org/2000/svg" width="${a.width}" height="${a.height}" viewBox="0 0 ${a.width} ${a.height}"><image href="${e}" width="100%" height="100%"/></svg>`;return`data:image/svg+xml;charset=utf-8,${encodeURIComponent(t)}`}let l=r===`jpeg`?`image/jpeg`:`image/png`;return a.toDataURL(l,i)};return{exportSignature:l,download:async(e=`signature`,t={})=>{let n=t.format||`png`,r=await l({...t,format:n});if(r instanceof Blob){let t=URL.createObjectURL(r),i=document.createElement(`a`);i.href=t,i.download=`${e}.${n===`blob`?`png`:n}`,document.body.appendChild(i),i.click(),i.remove(),setTimeout(()=>URL.revokeObjectURL(t),1e3)}else if(typeof r==`string`){let t=document.createElement(`a`);t.href=r,t.download=`${e}.${n}`,document.body.appendChild(t),t.click(),t.remove()}},loadImage:async e=>{let n=t.value;if(!n)throw Error(`Canvas 未初始化`);let r=n.getContext(`2d`);if(!r)throw Error(`无法获取 Canvas 上下文`);return new Promise((t,i)=>{let a=new Image;a.crossOrigin=`anonymous`,a.onload=()=>{r.clearRect(0,0,n.width,n.height),r.drawImage(a,0,0,n.width,n.height),t()},a.onerror=()=>i(Error(`图片加载失败: ${e}`)),a.src=e})}}}const ne={color:`#000000`,width:2,opacity:1},re={show:!1,text:``,fontSize:12,color:`#999999`,position:`bottom-right`},ie=[`#000000`,`#FF0000`,`#0000FF`,`#00AA00`,`#FF6600`,`#9900FF`],ae={class:`c-signature`},O={key:0,class:`signature-toolbar`},oe={class:`toolbar-section`},se={key:0,class:`toolbar-section`},ce={key:1,class:`toolbar-section`},le={class:`toolbar-section`},ue={class:`toolbar-section`},de={key:0,class:`canvas-placeholder`};var k=t(c({name:`C_Signature`,__name:`index`,props:{width:{default:`100%`},height:{default:300},penConfig:{},eraserConfig:{},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},backgroundImage:{},backgroundColor:{},watermark:{},showToolbar:{type:Boolean,default:!0},maxHistory:{default:50}},emits:[`start-draw`,`drawing`,`end-draw`,`clear`,`undo`,`redo`,`change`,`error`],setup(t,{expose:c,emit:h}){let T=t,k=h,A=g(null),j=g(null),M=_(null),N=_(null),P=n(()=>T.disabled||T.readonly),F=0,I=!1,L=g(`pen`),R=m({...ne,...T.penConfig}),fe=m({...re,...T.watermark}),{strokes:z,canUndo:B,canRedo:pe,isEmpty:me,addStroke:V,undo:he,redo:ge,clear:H,loadData:_e}=E({maxHistory:T.maxHistory,onChange:e=>{W.redrawStrokes(e),k(`change`,e)}}),U=n(()=>me.value&&!N.value),W=w({canvasRef:A,penConfig:v(R),mode:L,disabled:P,backgroundImage:M,importedImage:N,onStrokeComplete:e=>{V(e),k(`end-draw`,e)},onDrawStart:()=>k(`start-draw`),onDrawing:e=>k(`drawing`,e)}),G=D({canvasRef:A,watermark:v(fe)}),K=()=>{let e=he();return e&&k(`undo`),e},q=()=>{let e=ge();return e&&k(`redo`),e},J=()=>{F++,N.value=null,H(),k(`clear`)},ve=async e=>G.exportSignature(e),ye=async(e,t)=>G.download(e,t);function Y(e){return new Promise((t,n)=>{let r=new Image;r.crossOrigin=`anonymous`,r.onload=()=>t(r),r.onerror=()=>n(Error(`签名图片加载失败`)),r.src=e})}let X=0;async function Z(e){let t=++X;if(!e){M.value=null,W.redrawStrokes(z.value);return}try{let n=await Y(e);if(I||t!==X)return;M.value=n,W.redrawStrokes(z.value)}catch(e){if(!I&&t===X)throw e}}let be=async e=>{if(I)return;let t=++F,n=await Y(e);I||t!==F||(N.value=n,H())},xe=()=>z.value.map(e=>({...e,points:e.points.map(e=>({...e}))})),Se=e=>{F++,N.value=null,_e(e)},Ce=()=>U.value;d(()=>{W.initCanvas(),W.bindEvents(),typeof ResizeObserver<`u`&&j.value&&(Q=new ResizeObserver(()=>{W.initCanvas(),W.redrawStrokes(z.value)}),Q.observe(j.value)),Z(T.backgroundImage).catch($)});let Q=null;function $(e){k(`error`,e instanceof Error?e:Error(String(e)))}return b(()=>T.backgroundImage,e=>{Z(e).catch($)}),f(()=>{I=!0,F++,X++,Q?.disconnect(),W.unbindEvents()}),c({clear:J,undo:K,redo:q,export:ve,download:ye,loadImage:be,getSignatureData:xe,loadSignatureData:Se,isEmpty:Ce}),(n,c)=>(p(),i(`div`,ae,[t.showToolbar?(p(),i(`div`,O,[a(`div`,oe,[s(y(ee),null,{default:x(()=>[s(y(S),{type:L.value===`pen`?`primary`:`default`,size:`small`,disabled:P.value,onClick:c[0]||=e=>L.value=`pen`},{icon:x(()=>[s(e,{name:`mdi:draw`,size:16,color:`currentColor`})]),default:x(()=>[c[4]||=o(` 画笔 `,-1)]),_:1},8,[`type`,`disabled`]),s(y(S),{type:L.value===`eraser`?`primary`:`default`,size:`small`,disabled:P.value,onClick:c[1]||=e=>L.value=`eraser`},{icon:x(()=>[s(e,{name:`mdi:eraser`,size:16,color:`currentColor`})]),default:x(()=>[c[5]||=o(` 橡皮擦 `,-1)]),_:1},8,[`type`,`disabled`])]),_:1})]),c[11]||=a(`div`,{class:`toolbar-section divider`},null,-1),L.value===`pen`?(p(),i(`div`,se,[c[6]||=a(`span`,{class:`section-label`},`颜色`,-1),s(y(C),{value:R.color,"onUpdate:value":c[2]||=e=>R.color=e,"show-alpha":!1,disabled:P.value,size:`small`,swatches:y(ie)},null,8,[`value`,`disabled`,`swatches`])])):r(`v-if`,!0),L.value===`pen`?(p(),i(`div`,ce,[c[7]||=a(`span`,{class:`section-label`},`粗细`,-1),s(y(te),{value:R.width,"onUpdate:value":c[3]||=e=>R.width=e,min:1,max:20,disabled:P.value,size:`small`,style:{width:`80px`}},null,8,[`value`,`disabled`])])):r(`v-if`,!0),c[12]||=a(`div`,{class:`toolbar-section divider`},null,-1),a(`div`,le,[s(y(S),{size:`small`,disabled:P.value||!y(B),onClick:K},{icon:x(()=>[s(e,{name:`mdi:undo`,size:16,color:`currentColor`})]),default:x(()=>[c[8]||=o(` 撤销 `,-1)]),_:1},8,[`disabled`]),s(y(S),{size:`small`,disabled:P.value||!y(pe),onClick:q},{icon:x(()=>[s(e,{name:`mdi:redo`,size:16,color:`currentColor`})]),default:x(()=>[c[9]||=o(` 重做 `,-1)]),_:1},8,[`disabled`])]),c[13]||=a(`div`,{class:`toolbar-section divider`},null,-1),a(`div`,ue,[s(y(S),{size:`small`,type:`error`,disabled:P.value||U.value,onClick:J},{icon:x(()=>[s(e,{name:`mdi:delete-outline`,size:16,color:`currentColor`})]),default:x(()=>[c[10]||=o(` 清空 `,-1)]),_:1},8,[`disabled`])])])):r(`v-if`,!0),a(`div`,{ref_key:`canvasWrapperRef`,ref:j,class:l([`signature-canvas-wrapper`,{disabled:t.disabled,readonly:t.readonly}]),style:u({width:typeof t.width==`number`?`${t.width}px`:t.width,height:typeof t.height==`number`?`${t.height}px`:t.height,backgroundColor:t.backgroundColor||`transparent`})},[a(`canvas`,{ref_key:`canvasRef`,ref:A,class:l([`signature-canvas`,{disabled:t.disabled,readonly:t.readonly}])},null,2),U.value&&!t.disabled&&!t.readonly?(p(),i(`div`,de,` 请在此处签名 `)):r(`v-if`,!0)],6)]))}}),[[`__scopeId`,`data-v-4ad3c383`]]);export{w as i,D as n,E as r,k as t};

package/dist/C_SplitPane.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./C_Icon2.cjs`);const e=require(`./C_SplitPane2.cjs`);exports.C_SplitPane=e.t,exports.useSplitResize=e.n;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./C_SplitPane2.cjs`);exports.C_SplitPane=e.t,exports.useSplitResize=e.n;

package/dist/C_SplitPane.css

@@ -1,6 +1,6 @@
 :root{--c-primary: var(--primary-color, #2080f0);--c-primary-hover: var(--primary-color-hover, #4098fc);--c-primary-pressed: var(--primary-color-pressed, #1060c9);--c-success: var(--success-color, #18a058);--c-warning: var(--warning-color, #f0a020);--c-error: var(--error-color, #d03050);--c-info: var(--info-color, #2080f0);--c-bg-body: var(--body-color, #ffffff);--c-bg-card: var(--card-color, #ffffff);--c-bg-surface: var(--popover-color, #ffffff);--c-text-1: var(--text-color-1, #262626);--c-text-2: var(--text-color-2, #525252);--c-text-3: var(--text-color-3, #a3a3a3);--c-text-4: var(--text-color-4, #c0c0c0);--c-border: var(--border-color, #e5e7eb);--c-radius-sm: var(--border-radius-small, 4px);--c-radius: var(--border-radius, 6px);--c-transition-fast: 0.15s cubic-bezier(0.4, 0, 0.2, 1);--c-transition-base: 0.3s cubic-bezier(0.4, 0, 0.2, 1);--c-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);--c-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);--c-shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1)}
 
-.c-split-pane[data-v-7ce0c058] {
+.c-split-pane[data-v-ea8d0f77] {
   display: flex;
   width: 100%;
   height: 100%;
@@ -9,21 +9,21 @@
   overflow: hidden;
   position: relative;
 }
-.c-split-pane--horizontal[data-v-7ce0c058] {
+.c-split-pane--horizontal[data-v-ea8d0f77] {
   flex-direction: row;
 }
-.c-split-pane--vertical[data-v-7ce0c058] {
+.c-split-pane--vertical[data-v-ea8d0f77] {
   flex-direction: column;
 }
-.c-split-pane--dragging > .split-panel > .split-panel__content[data-v-7ce0c058] {
+.c-split-pane--dragging > .split-panel > .split-panel__content[data-v-ea8d0f77] {
   pointer-events: none;
   user-select: none;
 }
-.c-split-pane--disabled > .split-gutter[data-v-7ce0c058] {
+.c-split-pane--disabled > .split-gutter[data-v-ea8d0f77] {
   cursor: default;
   opacity: 0.5;
 }
-.split-panel[data-v-7ce0c058] {
+.split-panel[data-v-ea8d0f77] {
   min-width: 0;
   min-height: 0;
   overflow: hidden;
@@ -31,7 +31,7 @@
   display: flex;
   flex-direction: column;
 }
-.split-panel__content[data-v-7ce0c058] {
+.split-panel__content[data-v-ea8d0f77] {
   width: 100%;
   height: 100%;
   min-width: 0;
@@ -39,7 +39,29 @@
   overflow: auto;
   overscroll-behavior: contain;
 }
-.split-gutter[data-v-7ce0c058] {
+.split-gutter[data-v-ea8d0f77] {
+  --split-accent: var(--c-primary, var(--primary-color, #2080f0));
+  --split-surface: var(--c-bg-card, var(--card-color, #fff));
+  --split-border: var(--c-border, var(--border-color, #dfe3eb));
+  --split-text: var(--c-text-3, var(--text-color-3, #8b939e));
+  --split-handle-length: 80px;
+  --split-handle-thickness: 16px;
+  --split-button-size: 24px;
+  --split-control-gap: 6px;
+  --split-controls-length: var(--split-handle-length);
+  --split-line-color: color-mix(in srgb, var(--split-border) 75%, transparent);
+  --split-grip-border: color-mix(
+    in srgb,
+    var(--split-border) 88%,
+    var(--split-text)
+  );
+  --split-grip-shadow:
+    0 1px 2px rgb(15 23 42 / 7%), 0 3px 8px rgb(15 23 42 / 4%);
+  --split-grip-dot: color-mix(
+    in srgb,
+    var(--split-text) 72%,
+    var(--split-border)
+  );
   position: relative;
   display: flex;
   align-items: center;
@@ -48,132 +70,264 @@
   z-index: 1;
   touch-action: none;
   user-select: none;
-  background: var(--c-border, #e1e4e8);
-  transition: background-color 0.16s ease;
+  background: transparent;
   outline: none;
 }
-.c-split-pane--horizontal > .split-gutter[data-v-7ce0c058] {
+.split-gutter[data-v-ea8d0f77]::before {
+  content: "";
+  position: absolute;
+  background: var(--split-line-color);
+  pointer-events: none;
+  transition: background-color 0.16s ease;
+}
+.c-split-pane--horizontal > .split-gutter[data-v-ea8d0f77] {
   cursor: col-resize;
 }
-.c-split-pane--vertical > .split-gutter[data-v-7ce0c058] {
-  cursor: row-resize;
+.c-split-pane--horizontal > .split-gutter[data-v-ea8d0f77]::before {
+  inset: 0 auto;
+  width: 1px;
 }
-.split-gutter[data-v-7ce0c058]:hover, .split-gutter[data-v-7ce0c058]:focus-visible, .split-gutter[data-v-7ce0c058]:focus-within {
-  background: var(--c-primary, #18a058);
+.c-split-pane--vertical > .split-gutter[data-v-ea8d0f77] {
+  cursor: row-resize;
 }
-.split-gutter[data-v-7ce0c058]:focus-visible {
-  box-shadow: inset 0 0 0 1px var(--c-primary, #18a058);
+.c-split-pane--vertical > .split-gutter[data-v-ea8d0f77]::before {
+  inset: auto 0;
+  height: 1px;
 }
-.split-gutter__visual[data-v-7ce0c058] {
+.split-gutter__controls[data-v-ea8d0f77] {
+  position: absolute;
   display: flex;
   align-items: center;
   justify-content: center;
+  gap: var(--split-control-gap);
   pointer-events: none;
 }
-.split-gutter__dots[data-v-7ce0c058] {
-  display: flex;
-  gap: 3px;
+.split-gutter__controls--with-collapse[data-v-ea8d0f77] {
+  --split-controls-length: calc(
+    var(--split-handle-length) + var(--split-button-size) * 2 +
+      var(--split-control-gap) * 2
+  );
 }
-.c-split-pane--horizontal > .split-gutter .split-gutter__dots[data-v-7ce0c058] {
+.c-split-pane--horizontal > .split-gutter .split-gutter__controls[data-v-ea8d0f77] {
   flex-direction: column;
+  width: var(--split-button-size);
+  height: min(var(--split-controls-length), 100% - 8px);
 }
-.c-split-pane--vertical > .split-gutter .split-gutter__dots[data-v-7ce0c058] {
-  flex-direction: row;
+.c-split-pane--vertical > .split-gutter .split-gutter__controls[data-v-ea8d0f77] {
+  width: min(var(--split-controls-length), 100% - 8px);
+  height: var(--split-button-size);
 }
-.split-gutter__dot[data-v-7ce0c058] {
+.split-gutter__visual[data-v-ea8d0f77] {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex: 1 1 0;
+  box-sizing: border-box;
+  border: 1px solid var(--split-grip-border);
+  border-radius: 999px;
+  background: linear-gradient(180deg, color-mix(in srgb, var(--split-surface) 97%, #fff), color-mix(in srgb, var(--split-surface) 97%, var(--split-text)));
+  box-shadow: var(--split-grip-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.25);
+  cursor: inherit;
+  pointer-events: auto;
+  transition: border-color 0.16s ease, box-shadow 0.16s ease;
+}
+.c-split-pane--horizontal > .split-gutter .split-gutter__visual[data-v-ea8d0f77] {
+  width: var(--split-handle-thickness);
+  min-height: 20px;
+}
+.c-split-pane--vertical > .split-gutter .split-gutter__visual[data-v-ea8d0f77] {
+  min-width: 20px;
+  height: var(--split-handle-thickness);
+}
+.split-gutter__dots[data-v-ea8d0f77] {
+  display: flex;
+  gap: 5px;
+  pointer-events: none;
+}
+.c-split-pane--horizontal > .split-gutter .split-gutter__dots[data-v-ea8d0f77] {
+  flex-direction: column;
+}
+.split-gutter__dot[data-v-ea8d0f77] {
   width: 3px;
   height: 3px;
   border-radius: 50%;
-  background: var(--c-text-3, #8b939e);
+  background: var(--split-grip-dot);
+  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
   transition: background-color 0.16s ease;
 }
-.split-gutter:hover .split-gutter__dot[data-v-7ce0c058], .split-gutter:focus-within .split-gutter__dot[data-v-7ce0c058] {
-  background: var(--c-bg-card, #fff);
-}
-.split-gutter__collapse-btn[data-v-7ce0c058] {
-  position: absolute;
+.split-gutter__collapse-btn[data-v-ea8d0f77] {
   display: flex;
   align-items: center;
   justify-content: center;
-  width: 22px;
-  height: 22px;
+  flex: 0 1 var(--split-button-size);
+  width: var(--split-button-size);
+  height: var(--split-button-size);
+  min-width: 14px;
+  min-height: 14px;
+  box-sizing: border-box;
   padding: 0;
-  border: 1px solid var(--c-border, #e1e4e8);
-  border-radius: 6px;
-  background: var(--c-bg-card, #fff);
-  color: var(--c-text-3, #666);
+  border: 1px solid var(--split-border);
+  border-radius: 50%;
+  background: var(--split-surface);
+  color: var(--split-text);
+  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
   cursor: pointer;
   opacity: 0;
-  transition: opacity 0.16s ease, color 0.16s ease;
-  z-index: 2;
-}
-.split-gutter:hover .split-gutter__collapse-btn[data-v-7ce0c058], .split-gutter:focus-within .split-gutter__collapse-btn[data-v-7ce0c058] {
-  opacity: 1;
+  visibility: hidden;
+  pointer-events: none;
+  transition: opacity 0.16s ease, border-color 0.16s ease, color 0.16s ease;
 }
-.split-gutter__collapse-btn[data-v-7ce0c058]:hover, .split-gutter__collapse-btn[data-v-7ce0c058]:focus-visible {
-  color: var(--c-primary, #18a058);
+.split-gutter__collapse-btn[data-v-ea8d0f77]:hover, .split-gutter__collapse-btn[data-v-ea8d0f77]:focus-visible {
+  color: var(--split-accent);
+  border-color: color-mix(in srgb, var(--split-accent) 55%, var(--split-border));
 }
-.split-gutter__collapse-btn[data-v-7ce0c058]:focus-visible {
-  outline: 2px solid var(--c-primary, #18a058);
+.split-gutter__collapse-btn[data-v-ea8d0f77]:focus-visible {
+  outline: 2px solid var(--split-accent);
   outline-offset: 2px;
 }
-.split-gutter__collapse-btn[data-v-7ce0c058]:disabled {
+.split-gutter__collapse-btn[data-v-ea8d0f77]:disabled {
   cursor: default;
 }
-.c-split-pane--horizontal > .split-gutter .split-gutter__collapse-btn[data-v-7ce0c058] {
-  left: 50%;
-  transform: translateX(-50%);
+.split-gutter__chevron[data-v-ea8d0f77] {
+  width: 14px;
+  height: 14px;
+  fill: none;
+  stroke: currentColor;
+  stroke-width: 1.6;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  pointer-events: none;
+}
+.split-gutter__collapse-btn--second .split-gutter__chevron[data-v-ea8d0f77] {
+  transform: rotate(180deg);
+}
+.c-split-pane--vertical > .split-gutter .split-gutter__collapse-btn--first .split-gutter__chevron[data-v-ea8d0f77] {
+  transform: rotate(90deg);
+}
+.c-split-pane--vertical > .split-gutter .split-gutter__collapse-btn--second .split-gutter__chevron[data-v-ea8d0f77] {
+  transform: rotate(270deg);
+}
+.c-split-pane--collapsed-first > .split-gutter .split-gutter__collapse-btn--first .split-gutter__chevron[data-v-ea8d0f77] {
+  transform: rotate(180deg);
+}
+.c-split-pane--collapsed-second > .split-gutter .split-gutter__collapse-btn--second .split-gutter__chevron[data-v-ea8d0f77] {
+  transform: none;
 }
-.c-split-pane--horizontal > .split-gutter .split-gutter__collapse-btn--first[data-v-7ce0c058] {
-  top: 8px;
+.c-split-pane--vertical.c-split-pane--collapsed-first > .split-gutter .split-gutter__collapse-btn--first .split-gutter__chevron[data-v-ea8d0f77] {
+  transform: rotate(270deg);
 }
-.c-split-pane--horizontal > .split-gutter .split-gutter__collapse-btn--second[data-v-7ce0c058] {
-  bottom: 8px;
+.c-split-pane--vertical.c-split-pane--collapsed-second > .split-gutter .split-gutter__collapse-btn--second .split-gutter__chevron[data-v-ea8d0f77] {
+  transform: rotate(90deg);
 }
-.c-split-pane--vertical > .split-gutter .split-gutter__collapse-btn[data-v-7ce0c058] {
-  top: 50%;
-  transform: translateY(-50%);
+.c-split-pane:not(.c-split-pane--disabled) > .split-gutter[data-v-ea8d0f77]:hover, .c-split-pane:not(.c-split-pane--disabled) > .split-gutter[data-v-ea8d0f77]:focus-within {
+  --split-line-color: color-mix(
+    in srgb,
+    var(--split-accent) 28%,
+    var(--split-border)
+  );
+  --split-grip-border: color-mix(
+    in srgb,
+    var(--split-accent) 55%,
+    var(--split-border)
+  );
+  --split-grip-dot: var(--split-accent);
+  --split-grip-shadow:
+    0 1px 3px rgb(15 23 42 / 9%),
+    0 3px 12px color-mix(in srgb, var(--split-accent) 13%, transparent);
 }
-.c-split-pane--vertical > .split-gutter .split-gutter__collapse-btn--first[data-v-7ce0c058] {
-  left: 8px;
+.c-split-pane:not(.c-split-pane--disabled) > .split-gutter:hover .split-gutter__collapse-btn[data-v-ea8d0f77], .c-split-pane:not(.c-split-pane--disabled) > .split-gutter:focus-within .split-gutter__collapse-btn[data-v-ea8d0f77] {
+  opacity: 1;
+  visibility: visible;
+  pointer-events: auto;
+}
+.c-split-pane:not(.c-split-pane--disabled) > .split-gutter:focus-visible .split-gutter__visual[data-v-ea8d0f77] {
+  outline: 2px solid var(--split-accent);
+  outline-offset: 3px;
+}
+.c-split-pane--dragging:not(.c-split-pane--disabled) > .split-gutter[data-v-ea8d0f77] {
+  --split-line-color: color-mix(
+    in srgb,
+    var(--split-accent) 28%,
+    var(--split-border)
+  );
+  --split-grip-border: color-mix(
+    in srgb,
+    var(--split-accent) 55%,
+    var(--split-border)
+  );
+  --split-grip-dot: var(--split-accent);
+  --split-grip-shadow:
+    0 1px 3px rgb(15 23 42 / 9%),
+    0 3px 12px color-mix(in srgb, var(--split-accent) 13%, transparent);
+}
+.c-split-pane--collapsed-first > .split-gutter .split-gutter__collapse-btn[data-v-ea8d0f77],
+.c-split-pane--collapsed-second > .split-gutter .split-gutter__collapse-btn[data-v-ea8d0f77] {
+  opacity: 1;
+  visibility: visible;
+  pointer-events: auto;
+}
+.c-split-pane--horizontal.c-split-pane--collapsed-first > .split-gutter .split-gutter__controls[data-v-ea8d0f77] {
+  left: 0;
+}
+.c-split-pane--horizontal.c-split-pane--collapsed-second > .split-gutter .split-gutter__controls[data-v-ea8d0f77] {
+  right: 0;
+}
+.c-split-pane--vertical.c-split-pane--collapsed-first > .split-gutter .split-gutter__controls[data-v-ea8d0f77] {
+  top: 0;
 }
-.c-split-pane--vertical > .split-gutter .split-gutter__collapse-btn--second[data-v-7ce0c058] {
-  right: 8px;
+.c-split-pane--vertical.c-split-pane--collapsed-second > .split-gutter .split-gutter__controls[data-v-ea8d0f77] {
+  bottom: 0;
+}
+.c-split-pane--disabled > .split-gutter .split-gutter__visual[data-v-ea8d0f77] {
+  pointer-events: none;
+  box-shadow: none;
+}
+.c-split-pane--disabled > .split-gutter .split-gutter__collapse-btn[data-v-ea8d0f77] {
+  visibility: hidden;
+  pointer-events: none;
 }
 @media (hover: none), (pointer: coarse) {
-.split-gutter__collapse-btn[data-v-7ce0c058] {
+.split-gutter[data-v-ea8d0f77] {
+    --split-handle-thickness: 24px;
+    --split-button-size: 28px;
+}
+.c-split-pane:not(.c-split-pane--disabled) > .split-gutter .split-gutter__collapse-btn[data-v-ea8d0f77] {
     opacity: 1;
+    visibility: visible;
+    pointer-events: auto;
 }
 }
 @media (prefers-reduced-motion: reduce) {
-.split-gutter[data-v-7ce0c058],
-  .split-gutter__dot[data-v-7ce0c058],
-  .split-gutter__collapse-btn[data-v-7ce0c058] {
+.split-gutter[data-v-ea8d0f77]::before,
+  .split-gutter__visual[data-v-ea8d0f77],
+  .split-gutter__dot[data-v-ea8d0f77],
+  .split-gutter__collapse-btn[data-v-ea8d0f77] {
     transition: none;
 }
 }
 
 /* layer: shortcuts */
-.container[data-v-7ce0c058]{width:100%;}
+.container[data-v-ea8d0f77]{width:100%;}
 @media (min-width: 640px){
-.container[data-v-7ce0c058]{max-width:640px;}
+.container[data-v-ea8d0f77]{max-width:640px;}
 }
 @media (min-width: 768px){
-.container[data-v-7ce0c058]{max-width:768px;}
+.container[data-v-ea8d0f77]{max-width:768px;}
 }
 @media (min-width: 1024px){
-.container[data-v-7ce0c058]{max-width:1024px;}
+.container[data-v-ea8d0f77]{max-width:1024px;}
 }
 @media (min-width: 1280px){
-.container[data-v-7ce0c058]{max-width:1280px;}
+.container[data-v-ea8d0f77]{max-width:1280px;}
 }
 @media (min-width: 1536px){
-.container[data-v-7ce0c058]{max-width:1536px;}
+.container[data-v-ea8d0f77]{max-width:1536px;}
 }
 /* layer: default */
-.visible[data-v-7ce0c058]{visibility:visible;}
-.flex[data-v-7ce0c058]{display:flex;}
-.table[data-v-7ce0c058]{display:table;}
-.resize[data-v-7ce0c058]{resize:both;}
-.px[data-v-7ce0c058]{padding-left:1rem;padding-right:1rem;}
-.blur[data-v-7ce0c058]{--un-blur:blur(8px);filter:var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia);}
+.visible[data-v-ea8d0f77]{visibility:visible;}
+.m9\.5[data-v-ea8d0f77]{margin:2.375rem;}
+.flex[data-v-ea8d0f77]{display:flex;}
+.table[data-v-ea8d0f77]{display:table;}
+.resize[data-v-ea8d0f77]{resize:both;}
+.px[data-v-ea8d0f77]{padding-left:1rem;padding-right:1rem;}
+.blur[data-v-ea8d0f77]{--un-blur:blur(8px);filter:var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia);}

package/dist/C_SplitPane.js

@@ -1 +1 @@
-import"./C_Icon2.js";import{n as e,t}from"./C_SplitPane2.js";export{t as C_SplitPane,e as useSplitResize};
+import{n as e,t}from"./C_SplitPane2.js";export{t as C_SplitPane,e as useSplitResize};

package/dist/C_SplitPane2.cjs

@@ -1 +1 @@
-require(`./chunk.cjs`);const e=require(`./C_Icon2.cjs`),t=require(`./export-helper.cjs`);let n=require(`vue`);const r=(e,t)=>typeof e==`number`&&Number.isFinite(e)?e:t,i=e=>Math.max(4,r(e,6));function a(e){let t=Math.max(0,Math.min(100,r(e.minSize,0))),n=Math.max(0,Math.min(100,r(e.maxSize,100))),i=Math.min(t,n),a=Math.max(t,n),o=Math.max(0,r(e.availableLength,0));if(!o)return{min:i,max:a};let s=Math.max(0,r(e.minFirstSize,0)),c=Math.max(0,r(e.minSecondSize,0)),l=Math.max(i,s/o*100),u=Math.min(a,100-c/o*100);if(l<=u)return{min:l,max:u};let d=s+c?s/(s+c)*100:50,f=Math.max(i,Math.min(a,d));return{min:f,max:f}}function o(e,t,n){return Math.min(n,Math.max(t,r(e,50)))}const s=new WeakMap;function c(e){return`button`in e&&e.button!==0?!1:!(`isPrimary`in e)||e.isPrimary}function l(e,t,n){if(!(`touches`in e))return t===`horizontal`?e.clientX:e.clientY;let r=n===void 0?e.touches[0]:Array.from(e.touches).find(e=>e.identifier===n);if(r)return t===`horizontal`?r.clientX:r.clientY}function u(e,t){return t===void 0||!(`pointerId`in e)?!0:e.pointerId===t}function d(e,t){let{style:n}=e.body,r=t===`horizontal`?`col-resize`:`row-resize`,i=[`cursor`,`user-select`].map(e=>({name:e,value:n.getPropertyValue(e),priority:n.getPropertyPriority(e),owned:e===`cursor`?r:`none`}));for(let e of i)n.setProperty(e.name,e.owned);return()=>{for(let e of i)n.getPropertyValue(e.name)===e.owned&&(e.value?n.setProperty(e.name,e.value,e.priority):n.removeProperty(e.name))}}function f(e){return`pointerId`in e?{move:[`pointermove`],end:[`pointerup`,`pointercancel`]}:`touches`in e?{move:[`touchmove`],end:[`touchend`,`touchcancel`]}:{move:[`mousemove`],end:[`mouseup`]}}function p(e,t){let n=l(e,t.direction);if(n===void 0)return;let r=t.element.ownerDocument,i=r.defaultView;s.get(r)?.();let a=d(r,t.direction),o=`pointerId`in e?e.pointerId:void 0,c=`touches`in e?e.touches[0]?.identifier:void 0,p=!0;e.preventDefault(),e.stopPropagation(),e.currentTarget?.focus();let m=e=>{if(!u(e,o))return;let r=l(e,t.direction,c);r!==void 0&&(e.cancelable&&e.preventDefault(),t.onDelta(r-n))},h=e=>{if(!(e&&!u(e,o))&&p){p=!1,a();for(let[e,t]of v)r.removeEventListener(e,t);i?.removeEventListener(`blur`,h),s.get(r)===h&&s.delete(r),t.onEnd()}},g=()=>{r.hidden&&h()},_=f(e),v=[..._.move.map(e=>[e,m]),..._.end.map(e=>[e,h]),[`visibilitychange`,g]];for(let[e,t]of v)r.addEventListener(e,t,{passive:!1});return i?.addEventListener(`blur`,h),s.set(r,h),h}function m(e){return e===0?`first`:e===100?`second`:null}function h(e,t,n,r,i){if(e===`Home`)return i.min;if(e===`End`)return i.max;let a=t===`horizontal`?`ArrowLeft`:`ArrowUp`,o=t===`horizontal`?`ArrowRight`:`ArrowDown`;if(e===a)return r-n;if(e===o)return r+n}function g(e){let{containerRef:t,direction:s,disabled:l,collapsible:u}=e,d=(0,n.ref)(0),f=(0,n.computed)(()=>i((0,n.toValue)(e.gutterSize))),g=(0,n.computed)(()=>Math.max(0,d.value-f.value)),_=(0,n.computed)(()=>a({minSize:(0,n.toValue)(e.minSize),maxSize:(0,n.toValue)(e.maxSize),minFirstSize:(0,n.toValue)(e.minFirstSize)??0,minSecondSize:(0,n.toValue)(e.minSecondSize)??0,availableLength:g.value})),v=(0,n.ref)(o((0,n.toValue)(e.defaultSize),_.value.min,_.value.max)),y=(0,n.computed)(()=>(0,n.toValue)(e.size)!==void 0),b=(0,n.computed)(()=>y.value?r((0,n.toValue)(e.size),50):v.value),x=(0,n.computed)(()=>u.value?b.value===0?`first`:b.value===100?`second`:null:null),S=(0,n.computed)(()=>x.value?x.value===`first`?0:100:o(b.value,_.value.min,_.value.max)),C=(0,n.ref)(!1),w=(0,n.computed)(()=>x.value===`first`),T=(0,n.computed)(()=>x.value===`second`),E=r((0,n.toValue)(e.defaultSize),50),D=x.value?o(E>0&&E<100?E:50,_.value.min,_.value.max):S.value,O,k,A=(t,n=!1)=>{if(!Number.isFinite(t))return;let r=n?t:o(t,_.value.min,_.value.max);r!==b.value&&(y.value||(v.value=r),e.onUpdateSize?.(r))};(0,n.watch)(S,(t,n)=>{let r=m(n),i=x.value;!r&&i&&(D=n),r&&r!==i&&e.onExpand?.(r),i&&i!==r&&e.onCollapse?.(i),e.onResize?.(t,100-t)},{flush:`sync`}),(0,n.watch)(_,()=>{x.value||A(S.value)},{flush:`sync`}),(0,n.watch)([l,s],()=>O?.(),{flush:`sync`}),(0,n.watch)(u,()=>{x.value||A(S.value)},{flush:`sync`});let j=()=>{let e=t.value;if(!e)return;let n=e.getBoundingClientRect();d.value=s.value===`horizontal`?n.width:n.height};(0,n.watch)(s,j,{flush:`post`}),(0,n.onMounted)(()=>{j(),typeof ResizeObserver<`u`&&t.value&&(k=new ResizeObserver(j),k.observe(t.value))});let M=(e=`first`)=>{!u.value||x.value===e||(x.value||(D=S.value),A(e===`first`?0:100,!0))},N=()=>{x.value&&A(D)},P=(e=`first`)=>{x.value===e?N():M(e)};return(0,n.onUnmounted)(()=>{O?.(),k?.disconnect()}),{panelSize:S,isDragging:C,collapsedTarget:x,isFirstCollapsed:w,isSecondCollapsed:T,bounds:_,gutterSize:f,handleMouseDown:n=>{if(l.value||C.value||!c(n))return;let r=t.value;if(!r||(j(),!g.value))return;let i=S.value;O=p(n,{element:r,direction:s.value,onDelta:e=>A(i+e/g.value*100),onEnd:()=>{C.value=!1,O=void 0,e.onDragEnd?.(S.value)}}),O&&(C.value=!0,e.onDragStart?.(S.value))},handleDoubleClick:()=>{l.value||P(`first`)},handleKeyDown:t=>{if(l.value||t.target!==t.currentTarget)return;if(t.key===`Enter`){u.value&&(t.preventDefault(),x.value?N():M(`first`));return}let i=Math.max(0,r((0,n.toValue)(e.step),2))||2,a=t.shiftKey?10:1,o=h(t.key,s.value,i*a,S.value,_.value);o!==void 0&&(t.preventDefault(),A(o))},collapse:M,expand:N,toggle:P,resetSize:()=>A(r((0,n.toValue)(e.defaultSize),50)),setSize:e=>A(e),getPanelInfo:()=>({first:{size:S.value,collapsed:w.value},second:{size:100-S.value,collapsed:T.value}})}}const _=[`aria-hidden`,`inert`],v={class:`split-panel__content`},y=[`aria-orientation`,`aria-valuenow`,`aria-valuemin`,`aria-valuemax`,`aria-disabled`,`aria-label`,`tabindex`],b={class:`split-gutter__visual`},x={class:`split-gutter__dots`},S=[`disabled`,`aria-label`,`aria-expanded`,`title`],C=[`disabled`,`aria-label`,`aria-expanded`,`title`],w=[`aria-hidden`,`inert`],T={class:`split-panel__content`},E=(0,n.defineComponent)({name:`C_SplitPane`,__name:`index`,props:{ariaLabel:{default:`调整面板大小`},direction:{default:`horizontal`},size:{},defaultSize:{default:50},minSize:{default:0},maxSize:{default:100},minFirstSize:{default:0},minSecondSize:{default:0},disabled:{type:Boolean,default:!1},collapsible:{type:Boolean,default:!0},showCollapseButton:{type:Boolean,default:!0},gutterSize:{default:6},step:{default:2}},emits:[`update:size`,`resize`,`collapse`,`expand`,`drag-start`,`drag-end`],setup(t,{expose:r,emit:i}){let a=t,o=i,s=(0,n.useId)(),c=`split-${s}-first`,l=`split-${s}-second`,u=(0,n.ref)(null),{panelSize:d,bounds:f,gutterSize:p,isDragging:m,isFirstCollapsed:h,isSecondCollapsed:E,handleMouseDown:D,handleDoubleClick:O,handleKeyDown:k,collapse:A,expand:j,toggle:M,resetSize:N,setSize:P,getPanelInfo:F}=g({containerRef:u,direction:(0,n.toRef)(a,`direction`),size:(0,n.toRef)(a,`size`),defaultSize:(0,n.toRef)(a,`defaultSize`),minSize:(0,n.toRef)(a,`minSize`),maxSize:(0,n.toRef)(a,`maxSize`),minFirstSize:(0,n.toRef)(a,`minFirstSize`),minSecondSize:(0,n.toRef)(a,`minSecondSize`),gutterSize:(0,n.toRef)(a,`gutterSize`),disabled:(0,n.toRef)(a,`disabled`),collapsible:(0,n.toRef)(a,`collapsible`),step:(0,n.toRef)(a,`step`),onUpdateSize:e=>o(`update:size`,e),onResize:(e,t)=>o(`resize`,e,t),onCollapse:e=>o(`collapse`,e),onExpand:e=>o(`expand`,e),onDragStart:e=>o(`drag-start`,e),onDragEnd:e=>o(`drag-end`,e)}),I=(0,n.computed)(()=>({flex:`${d.value} 1 0px`})),L=(0,n.computed)(()=>({flex:`${100-d.value} 1 0px`})),R=(0,n.computed)(()=>a.direction===`horizontal`?{width:`${p.value}px`}:{height:`${p.value}px`}),z=(0,n.computed)(()=>a.direction===`horizontal`?h.value?`mdi:chevron-right`:`mdi:chevron-left`:h.value?`mdi:chevron-down`:`mdi:chevron-up`),B=(0,n.computed)(()=>a.direction===`horizontal`?E.value?`mdi:chevron-left`:`mdi:chevron-right`:E.value?`mdi:chevron-up`:`mdi:chevron-down`);return r({collapse:A,expand:j,toggle:M,resetSize:N,getPanelInfo:F,setSize:P}),(r,i)=>((0,n.openBlock)(),(0,n.createElementBlock)(`div`,{ref_key:`containerRef`,ref:u,class:(0,n.normalizeClass)([`c-split-pane`,[`c-split-pane--${t.direction}`,{"c-split-pane--dragging":(0,n.unref)(m),"c-split-pane--disabled":t.disabled,"c-split-pane--collapsed-first":(0,n.unref)(h),"c-split-pane--collapsed-second":(0,n.unref)(E)}]])},[(0,n.createCommentVNode)(` 首面板 `),(0,n.createElementVNode)(`div`,{class:`split-panel split-panel--first`,id:c,style:(0,n.normalizeStyle)(I.value),"aria-hidden":(0,n.unref)(h)||void 0,inert:(0,n.unref)(h)},[(0,n.createElementVNode)(`div`,v,[(0,n.renderSlot)(r.$slots,`first`,{size:(0,n.unref)(d),collapsed:(0,n.unref)(h)},void 0,!0)])],12,_),(0,n.createCommentVNode)(` 分割线手柄 `),(0,n.createElementVNode)(`div`,{class:`split-gutter`,style:(0,n.normalizeStyle)(R.value),role:`separator`,"aria-orientation":t.direction===`horizontal`?`vertical`:`horizontal`,"aria-valuenow":(0,n.unref)(d),"aria-valuemin":(0,n.unref)(h)?0:(0,n.unref)(f).min,"aria-valuemax":(0,n.unref)(E)?100:(0,n.unref)(f).max,"aria-disabled":t.disabled||void 0,"aria-controls":c,"aria-label":t.ariaLabel,tabindex:t.disabled?-1:0,onPointerdown:i[6]||=(...e)=>(0,n.unref)(D)&&(0,n.unref)(D)(...e),onDblclick:i[7]||=(...e)=>(0,n.unref)(O)&&(0,n.unref)(O)(...e),onKeydown:i[8]||=(...e)=>(0,n.unref)(k)&&(0,n.unref)(k)(...e)},[(0,n.createElementVNode)(`div`,b,[(0,n.createElementVNode)(`div`,x,[((0,n.openBlock)(),(0,n.createElementBlock)(n.Fragment,null,(0,n.renderList)(3,e=>(0,n.createElementVNode)(`span`,{key:e,class:`split-gutter__dot`})),64))])]),(0,n.createCommentVNode)(` 折叠按钮 `),t.showCollapseButton&&t.collapsible?((0,n.openBlock)(),(0,n.createElementBlock)(n.Fragment,{key:0},[(0,n.createElementVNode)(`button`,{class:`split-gutter__collapse-btn split-gutter__collapse-btn--first`,type:`button`,disabled:t.disabled,"aria-label":(0,n.unref)(h)?`展开首面板`:`折叠首面板`,"aria-expanded":!(0,n.unref)(h),"aria-controls":c,title:(0,n.unref)(h)?`展开首面板`:`折叠首面板`,onClick:i[0]||=(0,n.withModifiers)(e=>(0,n.unref)(M)(`first`),[`stop`]),onPointerdown:i[1]||=(0,n.withModifiers)(()=>{},[`stop`]),onDblclick:i[2]||=(0,n.withModifiers)(()=>{},[`stop`])},[(0,n.createVNode)(e.t,{name:z.value,size:16,color:`currentColor`},null,8,[`name`])],40,S),(0,n.createElementVNode)(`button`,{class:`split-gutter__collapse-btn split-gutter__collapse-btn--second`,type:`button`,disabled:t.disabled,"aria-label":(0,n.unref)(E)?`展开第二面板`:`折叠第二面板`,"aria-expanded":!(0,n.unref)(E),"aria-controls":l,title:(0,n.unref)(E)?`展开第二面板`:`折叠第二面板`,onClick:i[3]||=(0,n.withModifiers)(e=>(0,n.unref)(M)(`second`),[`stop`]),onPointerdown:i[4]||=(0,n.withModifiers)(()=>{},[`stop`]),onDblclick:i[5]||=(0,n.withModifiers)(()=>{},[`stop`])},[(0,n.createVNode)(e.t,{name:B.value,size:16,color:`currentColor`},null,8,[`name`])],40,C)],64)):(0,n.createCommentVNode)(`v-if`,!0)],44,y),(0,n.createCommentVNode)(` 第二面板 `),(0,n.createElementVNode)(`div`,{class:`split-panel split-panel--second`,id:l,style:(0,n.normalizeStyle)(L.value),"aria-hidden":(0,n.unref)(E)||void 0,inert:(0,n.unref)(E)},[(0,n.createElementVNode)(`div`,T,[(0,n.renderSlot)(r.$slots,`second`,{size:100-(0,n.unref)(d),collapsed:(0,n.unref)(E)},void 0,!0)])],12,w)],2))}});var D=t.t(E,[[`__scopeId`,`data-v-7ce0c058`]]);Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return D}});
+require(`./chunk.cjs`);const e=require(`./export-helper.cjs`);let t=require(`vue`);const n=(e,t)=>typeof e==`number`&&Number.isFinite(e)?e:t,r=e=>Math.max(4,n(e,6));function i(e){let t=Math.max(0,Math.min(100,n(e.minSize,0))),r=Math.max(0,Math.min(100,n(e.maxSize,100))),i=Math.min(t,r),a=Math.max(t,r),o=Math.max(0,n(e.availableLength,0));if(!o)return{min:i,max:a};let s=Math.max(0,n(e.minFirstSize,0)),c=Math.max(0,n(e.minSecondSize,0)),l=Math.max(i,s/o*100),u=Math.min(a,100-c/o*100);if(l<=u)return{min:l,max:u};let d=s+c?s/(s+c)*100:50,f=Math.max(i,Math.min(a,d));return{min:f,max:f}}function a(e,t,r){return Math.min(r,Math.max(t,n(e,50)))}const o=new WeakMap;function s(e){return`button`in e&&e.button!==0?!1:!(`isPrimary`in e)||e.isPrimary}function c(e,t,n){if(!(`touches`in e))return t===`horizontal`?e.clientX:e.clientY;let r=n===void 0?e.touches[0]:Array.from(e.touches).find(e=>e.identifier===n);if(r)return t===`horizontal`?r.clientX:r.clientY}function l(e,t){return t===void 0||!(`pointerId`in e)?!0:e.pointerId===t}function u(e,t){let{style:n}=e.body,r=t===`horizontal`?`col-resize`:`row-resize`,i=[`cursor`,`user-select`].map(e=>({name:e,value:n.getPropertyValue(e),priority:n.getPropertyPriority(e),owned:e===`cursor`?r:`none`}));for(let e of i)n.setProperty(e.name,e.owned);return()=>{for(let e of i)n.getPropertyValue(e.name)===e.owned&&(e.value?n.setProperty(e.name,e.value,e.priority):n.removeProperty(e.name))}}function d(e){return`pointerId`in e?{move:[`pointermove`],end:[`pointerup`,`pointercancel`]}:`touches`in e?{move:[`touchmove`],end:[`touchend`,`touchcancel`]}:{move:[`mousemove`],end:[`mouseup`]}}function f(e,t){let n=c(e,t.direction);if(n===void 0)return;let r=t.element.ownerDocument,i=r.defaultView;o.get(r)?.();let a=u(r,t.direction),s=`pointerId`in e?e.pointerId:void 0,f=`touches`in e?e.touches[0]?.identifier:void 0,p=!0;e.preventDefault(),e.stopPropagation(),e.currentTarget?.focus();let m=e=>{if(!l(e,s))return;let r=c(e,t.direction,f);r!==void 0&&(e.cancelable&&e.preventDefault(),t.onDelta(r-n))},h=e=>{if(!(e&&!l(e,s))&&p){p=!1,a();for(let[e,t]of v)r.removeEventListener(e,t);i?.removeEventListener(`blur`,h),o.get(r)===h&&o.delete(r),t.onEnd()}},g=()=>{r.hidden&&h()},_=d(e),v=[..._.move.map(e=>[e,m]),..._.end.map(e=>[e,h]),[`visibilitychange`,g]];for(let[e,t]of v)r.addEventListener(e,t,{passive:!1});return i?.addEventListener(`blur`,h),o.set(r,h),h}function p(e){return e===0?`first`:e===100?`second`:null}function m(e,t,n,r,i){if(e===`Home`)return i.min;if(e===`End`)return i.max;let a=t===`horizontal`?`ArrowLeft`:`ArrowUp`,o=t===`horizontal`?`ArrowRight`:`ArrowDown`;if(e===a)return r-n;if(e===o)return r+n}function h(e){let{containerRef:o,direction:c,disabled:l,collapsible:u}=e,d=(0,t.ref)(0),h=(0,t.computed)(()=>r((0,t.toValue)(e.gutterSize))),g=(0,t.computed)(()=>Math.max(0,d.value-h.value)),_=(0,t.computed)(()=>i({minSize:(0,t.toValue)(e.minSize),maxSize:(0,t.toValue)(e.maxSize),minFirstSize:(0,t.toValue)(e.minFirstSize)??0,minSecondSize:(0,t.toValue)(e.minSecondSize)??0,availableLength:g.value})),v=(0,t.ref)(a((0,t.toValue)(e.defaultSize),_.value.min,_.value.max)),y=(0,t.computed)(()=>(0,t.toValue)(e.size)!==void 0),b=(0,t.computed)(()=>y.value?n((0,t.toValue)(e.size),50):v.value),x=(0,t.computed)(()=>u.value?b.value===0?`first`:b.value===100?`second`:null:null),S=(0,t.computed)(()=>x.value?x.value===`first`?0:100:a(b.value,_.value.min,_.value.max)),C=(0,t.ref)(!1),w=(0,t.computed)(()=>x.value===`first`),T=(0,t.computed)(()=>x.value===`second`),E=n((0,t.toValue)(e.defaultSize),50),D=x.value?a(E>0&&E<100?E:50,_.value.min,_.value.max):S.value,O,k,A=(t,n=!1)=>{if(!Number.isFinite(t))return;let r=n?t:a(t,_.value.min,_.value.max);r!==b.value&&(y.value||(v.value=r),e.onUpdateSize?.(r))};(0,t.watch)(S,(t,n)=>{let r=p(n),i=x.value;!r&&i&&(D=n),r&&r!==i&&e.onExpand?.(r),i&&i!==r&&e.onCollapse?.(i),e.onResize?.(t,100-t)},{flush:`sync`}),(0,t.watch)(_,()=>{x.value||A(S.value)},{flush:`sync`}),(0,t.watch)([l,c],()=>O?.(),{flush:`sync`}),(0,t.watch)(u,()=>{x.value||A(S.value)},{flush:`sync`});let j=()=>{let e=o.value;if(!e)return;let t=e.getBoundingClientRect();d.value=c.value===`horizontal`?t.width:t.height};(0,t.watch)(c,j,{flush:`post`}),(0,t.onMounted)(()=>{j(),typeof ResizeObserver<`u`&&o.value&&(k=new ResizeObserver(j),k.observe(o.value))});let M=(e=`first`)=>{!u.value||x.value===e||(x.value||(D=S.value),A(e===`first`?0:100,!0))},N=()=>{x.value&&A(D)},P=(e=`first`)=>{x.value===e?N():M(e)};return(0,t.onUnmounted)(()=>{O?.(),k?.disconnect()}),{panelSize:S,isDragging:C,collapsedTarget:x,isFirstCollapsed:w,isSecondCollapsed:T,bounds:_,gutterSize:h,handleMouseDown:t=>{if(l.value||C.value||!s(t))return;let n=o.value;if(!n||(j(),!g.value))return;let r=S.value;O=f(t,{element:n,direction:c.value,onDelta:e=>A(r+e/g.value*100),onEnd:()=>{C.value=!1,O=void 0,e.onDragEnd?.(S.value)}}),O&&(C.value=!0,e.onDragStart?.(S.value))},handleDoubleClick:()=>{l.value||P(`first`)},handleKeyDown:r=>{if(l.value||r.target!==r.currentTarget)return;if(r.key===`Enter`){u.value&&(r.preventDefault(),x.value?N():M(`first`));return}let i=Math.max(0,n((0,t.toValue)(e.step),2))||2,a=r.shiftKey?10:1,o=m(r.key,c.value,i*a,S.value,_.value);o!==void 0&&(r.preventDefault(),A(o))},collapse:M,expand:N,toggle:P,resetSize:()=>A(n((0,t.toValue)(e.defaultSize),50)),setSize:e=>A(e),getPanelInfo:()=>({first:{size:S.value,collapsed:w.value},second:{size:100-S.value,collapsed:T.value}})}}const g=[`aria-hidden`,`inert`],_={class:`split-panel__content`},v=[`aria-orientation`,`aria-valuenow`,`aria-valuemin`,`aria-valuemax`,`aria-disabled`,`aria-label`,`tabindex`],y=[`disabled`,`aria-label`,`aria-expanded`,`title`],b={class:`split-gutter__visual`,"aria-hidden":`true`},x={class:`split-gutter__dots`},S=[`disabled`,`aria-label`,`aria-expanded`,`title`],C=[`aria-hidden`,`inert`],w={class:`split-panel__content`},T=(0,t.defineComponent)({name:`C_SplitPane`,__name:`index`,props:{ariaLabel:{default:`调整面板大小`},direction:{default:`horizontal`},size:{},defaultSize:{default:50},minSize:{default:0},maxSize:{default:100},minFirstSize:{default:0},minSecondSize:{default:0},disabled:{type:Boolean,default:!1},collapsible:{type:Boolean,default:!0},showCollapseButton:{type:Boolean,default:!0},gutterSize:{default:6},step:{default:2}},emits:[`update:size`,`resize`,`collapse`,`expand`,`drag-start`,`drag-end`],setup(e,{expose:n,emit:r}){let i=e,a=r,o=(0,t.useId)(),s=`split-${o}-first`,c=`split-${o}-second`,l=(0,t.ref)(null),{panelSize:u,bounds:d,gutterSize:f,isDragging:p,isFirstCollapsed:m,isSecondCollapsed:T,handleMouseDown:E,handleDoubleClick:D,handleKeyDown:O,collapse:k,expand:A,toggle:j,resetSize:M,setSize:N,getPanelInfo:P}=h({containerRef:l,direction:(0,t.toRef)(i,`direction`),size:(0,t.toRef)(i,`size`),defaultSize:(0,t.toRef)(i,`defaultSize`),minSize:(0,t.toRef)(i,`minSize`),maxSize:(0,t.toRef)(i,`maxSize`),minFirstSize:(0,t.toRef)(i,`minFirstSize`),minSecondSize:(0,t.toRef)(i,`minSecondSize`),gutterSize:(0,t.toRef)(i,`gutterSize`),disabled:(0,t.toRef)(i,`disabled`),collapsible:(0,t.toRef)(i,`collapsible`),step:(0,t.toRef)(i,`step`),onUpdateSize:e=>a(`update:size`,e),onResize:(e,t)=>a(`resize`,e,t),onCollapse:e=>a(`collapse`,e),onExpand:e=>a(`expand`,e),onDragStart:e=>a(`drag-start`,e),onDragEnd:e=>a(`drag-end`,e)}),F=(0,t.computed)(()=>({flex:`${u.value} 1 0px`})),I=(0,t.computed)(()=>({flex:`${100-u.value} 1 0px`})),L=(0,t.computed)(()=>i.direction===`horizontal`?{width:`${f.value}px`}:{height:`${f.value}px`});return n({collapse:k,expand:A,toggle:j,resetSize:M,getPanelInfo:P,setSize:N}),(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{ref_key:`containerRef`,ref:l,class:(0,t.normalizeClass)([`c-split-pane`,[`c-split-pane--${e.direction}`,{"c-split-pane--dragging":(0,t.unref)(p),"c-split-pane--disabled":e.disabled,"c-split-pane--collapsed-first":(0,t.unref)(m),"c-split-pane--collapsed-second":(0,t.unref)(T)}]])},[(0,t.createCommentVNode)(` 首面板 `),(0,t.createElementVNode)(`div`,{class:`split-panel split-panel--first`,id:s,style:(0,t.normalizeStyle)(F.value),"aria-hidden":(0,t.unref)(m)||void 0,inert:(0,t.unref)(m)},[(0,t.createElementVNode)(`div`,_,[(0,t.renderSlot)(n.$slots,`first`,{size:(0,t.unref)(u),collapsed:(0,t.unref)(m)},void 0,!0)])],12,g),(0,t.createCommentVNode)(` 分割线手柄 `),(0,t.createElementVNode)(`div`,{class:`split-gutter`,style:(0,t.normalizeStyle)(L.value),role:`separator`,"aria-orientation":e.direction===`horizontal`?`vertical`:`horizontal`,"aria-valuenow":(0,t.unref)(u),"aria-valuemin":(0,t.unref)(m)?0:(0,t.unref)(d).min,"aria-valuemax":(0,t.unref)(T)?100:(0,t.unref)(d).max,"aria-disabled":e.disabled||void 0,"aria-controls":s,"aria-label":e.ariaLabel,tabindex:e.disabled?-1:0,onPointerdown:r[6]||=(...e)=>(0,t.unref)(E)&&(0,t.unref)(E)(...e),onDblclick:r[7]||=(...e)=>(0,t.unref)(D)&&(0,t.unref)(D)(...e),onKeydown:r[8]||=(...e)=>(0,t.unref)(O)&&(0,t.unref)(O)(...e)},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`split-gutter__controls`,{"split-gutter__controls--with-collapse":e.showCollapseButton&&e.collapsible}])},[e.showCollapseButton&&e.collapsible?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:0,class:`split-gutter__collapse-btn split-gutter__collapse-btn--first`,type:`button`,disabled:e.disabled,"aria-label":(0,t.unref)(m)?`展开首面板`:`折叠首面板`,"aria-expanded":!(0,t.unref)(m),"aria-controls":s,title:(0,t.unref)(m)?`展开首面板`:`折叠首面板`,onClick:r[0]||=(0,t.withModifiers)(e=>(0,t.unref)(j)(`first`),[`stop`]),onPointerdown:r[1]||=(0,t.withModifiers)(()=>{},[`stop`]),onDblclick:r[2]||=(0,t.withModifiers)(()=>{},[`stop`])},[...r[9]||=[(0,t.createElementVNode)(`svg`,{class:`split-gutter__chevron`,viewBox:`0 0 16 16`,"aria-hidden":`true`,focusable:`false`},[(0,t.createElementVNode)(`path`,{d:`m9.5 4.5-3.5 3.5 3.5 3.5`})],-1)]],40,y)):(0,t.createCommentVNode)(`v-if`,!0),(0,t.createElementVNode)(`div`,b,[(0,t.createElementVNode)(`div`,x,[((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(3,e=>(0,t.createElementVNode)(`span`,{key:e,class:`split-gutter__dot`})),64))])]),e.showCollapseButton&&e.collapsible?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:1,class:`split-gutter__collapse-btn split-gutter__collapse-btn--second`,type:`button`,disabled:e.disabled,"aria-label":(0,t.unref)(T)?`展开第二面板`:`折叠第二面板`,"aria-expanded":!(0,t.unref)(T),"aria-controls":c,title:(0,t.unref)(T)?`展开第二面板`:`折叠第二面板`,onClick:r[3]||=(0,t.withModifiers)(e=>(0,t.unref)(j)(`second`),[`stop`]),onPointerdown:r[4]||=(0,t.withModifiers)(()=>{},[`stop`]),onDblclick:r[5]||=(0,t.withModifiers)(()=>{},[`stop`])},[...r[10]||=[(0,t.createElementVNode)(`svg`,{class:`split-gutter__chevron`,viewBox:`0 0 16 16`,"aria-hidden":`true`,focusable:`false`},[(0,t.createElementVNode)(`path`,{d:`m9.5 4.5-3.5 3.5 3.5 3.5`})],-1)]],40,S)):(0,t.createCommentVNode)(`v-if`,!0)],2)],44,v),(0,t.createCommentVNode)(` 第二面板 `),(0,t.createElementVNode)(`div`,{class:`split-panel split-panel--second`,id:c,style:(0,t.normalizeStyle)(I.value),"aria-hidden":(0,t.unref)(T)||void 0,inert:(0,t.unref)(T)},[(0,t.createElementVNode)(`div`,w,[(0,t.renderSlot)(n.$slots,`second`,{size:100-(0,t.unref)(u),collapsed:(0,t.unref)(T)},void 0,!0)])],12,C)],2))}});var E=e.t(T,[[`__scopeId`,`data-v-ea8d0f77`]]);Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return h}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return E}});

package/dist/C_SplitPane2.js

@@ -1 +1 @@
-import{t as e}from"./C_Icon2.js";import{t}from"./export-helper.js";import{Fragment as n,computed as r,createCommentVNode as i,createElementBlock as a,createElementVNode as o,createVNode as s,defineComponent as c,normalizeClass as l,normalizeStyle as u,onMounted as d,onUnmounted as f,openBlock as p,ref as m,renderList as h,renderSlot as g,toRef as _,toValue as v,unref as y,useId as b,watch as x,withModifiers as S}from"vue";const C=(e,t)=>typeof e==`number`&&Number.isFinite(e)?e:t,w=e=>Math.max(4,C(e,6));function T(e){let t=Math.max(0,Math.min(100,C(e.minSize,0))),n=Math.max(0,Math.min(100,C(e.maxSize,100))),r=Math.min(t,n),i=Math.max(t,n),a=Math.max(0,C(e.availableLength,0));if(!a)return{min:r,max:i};let o=Math.max(0,C(e.minFirstSize,0)),s=Math.max(0,C(e.minSecondSize,0)),c=Math.max(r,o/a*100),l=Math.min(i,100-s/a*100);if(c<=l)return{min:c,max:l};let u=o+s?o/(o+s)*100:50,d=Math.max(r,Math.min(i,u));return{min:d,max:d}}function E(e,t,n){return Math.min(n,Math.max(t,C(e,50)))}const D=new WeakMap;function O(e){return`button`in e&&e.button!==0?!1:!(`isPrimary`in e)||e.isPrimary}function k(e,t,n){if(!(`touches`in e))return t===`horizontal`?e.clientX:e.clientY;let r=n===void 0?e.touches[0]:Array.from(e.touches).find(e=>e.identifier===n);if(r)return t===`horizontal`?r.clientX:r.clientY}function A(e,t){return t===void 0||!(`pointerId`in e)?!0:e.pointerId===t}function j(e,t){let{style:n}=e.body,r=t===`horizontal`?`col-resize`:`row-resize`,i=[`cursor`,`user-select`].map(e=>({name:e,value:n.getPropertyValue(e),priority:n.getPropertyPriority(e),owned:e===`cursor`?r:`none`}));for(let e of i)n.setProperty(e.name,e.owned);return()=>{for(let e of i)n.getPropertyValue(e.name)===e.owned&&(e.value?n.setProperty(e.name,e.value,e.priority):n.removeProperty(e.name))}}function M(e){return`pointerId`in e?{move:[`pointermove`],end:[`pointerup`,`pointercancel`]}:`touches`in e?{move:[`touchmove`],end:[`touchend`,`touchcancel`]}:{move:[`mousemove`],end:[`mouseup`]}}function N(e,t){let n=k(e,t.direction);if(n===void 0)return;let r=t.element.ownerDocument,i=r.defaultView;D.get(r)?.();let a=j(r,t.direction),o=`pointerId`in e?e.pointerId:void 0,s=`touches`in e?e.touches[0]?.identifier:void 0,c=!0;e.preventDefault(),e.stopPropagation(),e.currentTarget?.focus();let l=e=>{if(!A(e,o))return;let r=k(e,t.direction,s);r!==void 0&&(e.cancelable&&e.preventDefault(),t.onDelta(r-n))},u=e=>{if(!(e&&!A(e,o))&&c){c=!1,a();for(let[e,t]of p)r.removeEventListener(e,t);i?.removeEventListener(`blur`,u),D.get(r)===u&&D.delete(r),t.onEnd()}},d=()=>{r.hidden&&u()},f=M(e),p=[...f.move.map(e=>[e,l]),...f.end.map(e=>[e,u]),[`visibilitychange`,d]];for(let[e,t]of p)r.addEventListener(e,t,{passive:!1});return i?.addEventListener(`blur`,u),D.set(r,u),u}function P(e){return e===0?`first`:e===100?`second`:null}function F(e,t,n,r,i){if(e===`Home`)return i.min;if(e===`End`)return i.max;let a=t===`horizontal`?`ArrowLeft`:`ArrowUp`,o=t===`horizontal`?`ArrowRight`:`ArrowDown`;if(e===a)return r-n;if(e===o)return r+n}function I(e){let{containerRef:t,direction:n,disabled:i,collapsible:a}=e,o=m(0),s=r(()=>w(v(e.gutterSize))),c=r(()=>Math.max(0,o.value-s.value)),l=r(()=>T({minSize:v(e.minSize),maxSize:v(e.maxSize),minFirstSize:v(e.minFirstSize)??0,minSecondSize:v(e.minSecondSize)??0,availableLength:c.value})),u=m(E(v(e.defaultSize),l.value.min,l.value.max)),p=r(()=>v(e.size)!==void 0),h=r(()=>p.value?C(v(e.size),50):u.value),g=r(()=>a.value?h.value===0?`first`:h.value===100?`second`:null:null),_=r(()=>g.value?g.value===`first`?0:100:E(h.value,l.value.min,l.value.max)),y=m(!1),b=r(()=>g.value===`first`),S=r(()=>g.value===`second`),D=C(v(e.defaultSize),50),k=g.value?E(D>0&&D<100?D:50,l.value.min,l.value.max):_.value,A,j,M=(t,n=!1)=>{if(!Number.isFinite(t))return;let r=n?t:E(t,l.value.min,l.value.max);r!==h.value&&(p.value||(u.value=r),e.onUpdateSize?.(r))};x(_,(t,n)=>{let r=P(n),i=g.value;!r&&i&&(k=n),r&&r!==i&&e.onExpand?.(r),i&&i!==r&&e.onCollapse?.(i),e.onResize?.(t,100-t)},{flush:`sync`}),x(l,()=>{g.value||M(_.value)},{flush:`sync`}),x([i,n],()=>A?.(),{flush:`sync`}),x(a,()=>{g.value||M(_.value)},{flush:`sync`});let I=()=>{let e=t.value;if(!e)return;let r=e.getBoundingClientRect();o.value=n.value===`horizontal`?r.width:r.height};x(n,I,{flush:`post`}),d(()=>{I(),typeof ResizeObserver<`u`&&t.value&&(j=new ResizeObserver(I),j.observe(t.value))});let L=(e=`first`)=>{!a.value||g.value===e||(g.value||(k=_.value),M(e===`first`?0:100,!0))},R=()=>{g.value&&M(k)},z=(e=`first`)=>{g.value===e?R():L(e)};return f(()=>{A?.(),j?.disconnect()}),{panelSize:_,isDragging:y,collapsedTarget:g,isFirstCollapsed:b,isSecondCollapsed:S,bounds:l,gutterSize:s,handleMouseDown:r=>{if(i.value||y.value||!O(r))return;let a=t.value;if(!a||(I(),!c.value))return;let o=_.value;A=N(r,{element:a,direction:n.value,onDelta:e=>M(o+e/c.value*100),onEnd:()=>{y.value=!1,A=void 0,e.onDragEnd?.(_.value)}}),A&&(y.value=!0,e.onDragStart?.(_.value))},handleDoubleClick:()=>{i.value||z(`first`)},handleKeyDown:t=>{if(i.value||t.target!==t.currentTarget)return;if(t.key===`Enter`){a.value&&(t.preventDefault(),g.value?R():L(`first`));return}let r=Math.max(0,C(v(e.step),2))||2,o=t.shiftKey?10:1,s=F(t.key,n.value,r*o,_.value,l.value);s!==void 0&&(t.preventDefault(),M(s))},collapse:L,expand:R,toggle:z,resetSize:()=>M(C(v(e.defaultSize),50)),setSize:e=>M(e),getPanelInfo:()=>({first:{size:_.value,collapsed:b.value},second:{size:100-_.value,collapsed:S.value}})}}const L=[`aria-hidden`,`inert`],R={class:`split-panel__content`},z=[`aria-orientation`,`aria-valuenow`,`aria-valuemin`,`aria-valuemax`,`aria-disabled`,`aria-label`,`tabindex`],B={class:`split-gutter__visual`},V={class:`split-gutter__dots`},H=[`disabled`,`aria-label`,`aria-expanded`,`title`],U=[`disabled`,`aria-label`,`aria-expanded`,`title`],W=[`aria-hidden`,`inert`],G={class:`split-panel__content`};var K=t(c({name:`C_SplitPane`,__name:`index`,props:{ariaLabel:{default:`调整面板大小`},direction:{default:`horizontal`},size:{},defaultSize:{default:50},minSize:{default:0},maxSize:{default:100},minFirstSize:{default:0},minSecondSize:{default:0},disabled:{type:Boolean,default:!1},collapsible:{type:Boolean,default:!0},showCollapseButton:{type:Boolean,default:!0},gutterSize:{default:6},step:{default:2}},emits:[`update:size`,`resize`,`collapse`,`expand`,`drag-start`,`drag-end`],setup(t,{expose:c,emit:d}){let f=t,v=d,x=b(),C=`split-${x}-first`,w=`split-${x}-second`,T=m(null),{panelSize:E,bounds:D,gutterSize:O,isDragging:k,isFirstCollapsed:A,isSecondCollapsed:j,handleMouseDown:M,handleDoubleClick:N,handleKeyDown:P,collapse:F,expand:K,toggle:q,resetSize:J,setSize:Y,getPanelInfo:X}=I({containerRef:T,direction:_(f,`direction`),size:_(f,`size`),defaultSize:_(f,`defaultSize`),minSize:_(f,`minSize`),maxSize:_(f,`maxSize`),minFirstSize:_(f,`minFirstSize`),minSecondSize:_(f,`minSecondSize`),gutterSize:_(f,`gutterSize`),disabled:_(f,`disabled`),collapsible:_(f,`collapsible`),step:_(f,`step`),onUpdateSize:e=>v(`update:size`,e),onResize:(e,t)=>v(`resize`,e,t),onCollapse:e=>v(`collapse`,e),onExpand:e=>v(`expand`,e),onDragStart:e=>v(`drag-start`,e),onDragEnd:e=>v(`drag-end`,e)}),Z=r(()=>({flex:`${E.value} 1 0px`})),Q=r(()=>({flex:`${100-E.value} 1 0px`})),$=r(()=>f.direction===`horizontal`?{width:`${O.value}px`}:{height:`${O.value}px`}),ee=r(()=>f.direction===`horizontal`?A.value?`mdi:chevron-right`:`mdi:chevron-left`:A.value?`mdi:chevron-down`:`mdi:chevron-up`),te=r(()=>f.direction===`horizontal`?j.value?`mdi:chevron-left`:`mdi:chevron-right`:j.value?`mdi:chevron-up`:`mdi:chevron-down`);return c({collapse:F,expand:K,toggle:q,resetSize:J,getPanelInfo:X,setSize:Y}),(r,c)=>(p(),a(`div`,{ref_key:`containerRef`,ref:T,class:l([`c-split-pane`,[`c-split-pane--${t.direction}`,{"c-split-pane--dragging":y(k),"c-split-pane--disabled":t.disabled,"c-split-pane--collapsed-first":y(A),"c-split-pane--collapsed-second":y(j)}]])},[i(` 首面板 `),o(`div`,{class:`split-panel split-panel--first`,id:C,style:u(Z.value),"aria-hidden":y(A)||void 0,inert:y(A)},[o(`div`,R,[g(r.$slots,`first`,{size:y(E),collapsed:y(A)},void 0,!0)])],12,L),i(` 分割线手柄 `),o(`div`,{class:`split-gutter`,style:u($.value),role:`separator`,"aria-orientation":t.direction===`horizontal`?`vertical`:`horizontal`,"aria-valuenow":y(E),"aria-valuemin":y(A)?0:y(D).min,"aria-valuemax":y(j)?100:y(D).max,"aria-disabled":t.disabled||void 0,"aria-controls":C,"aria-label":t.ariaLabel,tabindex:t.disabled?-1:0,onPointerdown:c[6]||=(...e)=>y(M)&&y(M)(...e),onDblclick:c[7]||=(...e)=>y(N)&&y(N)(...e),onKeydown:c[8]||=(...e)=>y(P)&&y(P)(...e)},[o(`div`,B,[o(`div`,V,[(p(),a(n,null,h(3,e=>o(`span`,{key:e,class:`split-gutter__dot`})),64))])]),i(` 折叠按钮 `),t.showCollapseButton&&t.collapsible?(p(),a(n,{key:0},[o(`button`,{class:`split-gutter__collapse-btn split-gutter__collapse-btn--first`,type:`button`,disabled:t.disabled,"aria-label":y(A)?`展开首面板`:`折叠首面板`,"aria-expanded":!y(A),"aria-controls":C,title:y(A)?`展开首面板`:`折叠首面板`,onClick:c[0]||=S(e=>y(q)(`first`),[`stop`]),onPointerdown:c[1]||=S(()=>{},[`stop`]),onDblclick:c[2]||=S(()=>{},[`stop`])},[s(e,{name:ee.value,size:16,color:`currentColor`},null,8,[`name`])],40,H),o(`button`,{class:`split-gutter__collapse-btn split-gutter__collapse-btn--second`,type:`button`,disabled:t.disabled,"aria-label":y(j)?`展开第二面板`:`折叠第二面板`,"aria-expanded":!y(j),"aria-controls":w,title:y(j)?`展开第二面板`:`折叠第二面板`,onClick:c[3]||=S(e=>y(q)(`second`),[`stop`]),onPointerdown:c[4]||=S(()=>{},[`stop`]),onDblclick:c[5]||=S(()=>{},[`stop`])},[s(e,{name:te.value,size:16,color:`currentColor`},null,8,[`name`])],40,U)],64)):i(`v-if`,!0)],44,z),i(` 第二面板 `),o(`div`,{class:`split-panel split-panel--second`,id:w,style:u(Q.value),"aria-hidden":y(j)||void 0,inert:y(j)},[o(`div`,G,[g(r.$slots,`second`,{size:100-y(E),collapsed:y(j)},void 0,!0)])],12,W)],2))}}),[[`__scopeId`,`data-v-7ce0c058`]]);export{I as n,K as t};
+import{t as e}from"./export-helper.js";import{Fragment as t,computed as n,createCommentVNode as r,createElementBlock as i,createElementVNode as a,defineComponent as o,normalizeClass as s,normalizeStyle as c,onMounted as l,onUnmounted as u,openBlock as d,ref as f,renderList as p,renderSlot as m,toRef as h,toValue as g,unref as _,useId as v,watch as y,withModifiers as b}from"vue";const x=(e,t)=>typeof e==`number`&&Number.isFinite(e)?e:t,S=e=>Math.max(4,x(e,6));function C(e){let t=Math.max(0,Math.min(100,x(e.minSize,0))),n=Math.max(0,Math.min(100,x(e.maxSize,100))),r=Math.min(t,n),i=Math.max(t,n),a=Math.max(0,x(e.availableLength,0));if(!a)return{min:r,max:i};let o=Math.max(0,x(e.minFirstSize,0)),s=Math.max(0,x(e.minSecondSize,0)),c=Math.max(r,o/a*100),l=Math.min(i,100-s/a*100);if(c<=l)return{min:c,max:l};let u=o+s?o/(o+s)*100:50,d=Math.max(r,Math.min(i,u));return{min:d,max:d}}function w(e,t,n){return Math.min(n,Math.max(t,x(e,50)))}const T=new WeakMap;function E(e){return`button`in e&&e.button!==0?!1:!(`isPrimary`in e)||e.isPrimary}function D(e,t,n){if(!(`touches`in e))return t===`horizontal`?e.clientX:e.clientY;let r=n===void 0?e.touches[0]:Array.from(e.touches).find(e=>e.identifier===n);if(r)return t===`horizontal`?r.clientX:r.clientY}function O(e,t){return t===void 0||!(`pointerId`in e)?!0:e.pointerId===t}function k(e,t){let{style:n}=e.body,r=t===`horizontal`?`col-resize`:`row-resize`,i=[`cursor`,`user-select`].map(e=>({name:e,value:n.getPropertyValue(e),priority:n.getPropertyPriority(e),owned:e===`cursor`?r:`none`}));for(let e of i)n.setProperty(e.name,e.owned);return()=>{for(let e of i)n.getPropertyValue(e.name)===e.owned&&(e.value?n.setProperty(e.name,e.value,e.priority):n.removeProperty(e.name))}}function A(e){return`pointerId`in e?{move:[`pointermove`],end:[`pointerup`,`pointercancel`]}:`touches`in e?{move:[`touchmove`],end:[`touchend`,`touchcancel`]}:{move:[`mousemove`],end:[`mouseup`]}}function j(e,t){let n=D(e,t.direction);if(n===void 0)return;let r=t.element.ownerDocument,i=r.defaultView;T.get(r)?.();let a=k(r,t.direction),o=`pointerId`in e?e.pointerId:void 0,s=`touches`in e?e.touches[0]?.identifier:void 0,c=!0;e.preventDefault(),e.stopPropagation(),e.currentTarget?.focus();let l=e=>{if(!O(e,o))return;let r=D(e,t.direction,s);r!==void 0&&(e.cancelable&&e.preventDefault(),t.onDelta(r-n))},u=e=>{if(!(e&&!O(e,o))&&c){c=!1,a();for(let[e,t]of p)r.removeEventListener(e,t);i?.removeEventListener(`blur`,u),T.get(r)===u&&T.delete(r),t.onEnd()}},d=()=>{r.hidden&&u()},f=A(e),p=[...f.move.map(e=>[e,l]),...f.end.map(e=>[e,u]),[`visibilitychange`,d]];for(let[e,t]of p)r.addEventListener(e,t,{passive:!1});return i?.addEventListener(`blur`,u),T.set(r,u),u}function M(e){return e===0?`first`:e===100?`second`:null}function N(e,t,n,r,i){if(e===`Home`)return i.min;if(e===`End`)return i.max;let a=t===`horizontal`?`ArrowLeft`:`ArrowUp`,o=t===`horizontal`?`ArrowRight`:`ArrowDown`;if(e===a)return r-n;if(e===o)return r+n}function P(e){let{containerRef:t,direction:r,disabled:i,collapsible:a}=e,o=f(0),s=n(()=>S(g(e.gutterSize))),c=n(()=>Math.max(0,o.value-s.value)),d=n(()=>C({minSize:g(e.minSize),maxSize:g(e.maxSize),minFirstSize:g(e.minFirstSize)??0,minSecondSize:g(e.minSecondSize)??0,availableLength:c.value})),p=f(w(g(e.defaultSize),d.value.min,d.value.max)),m=n(()=>g(e.size)!==void 0),h=n(()=>m.value?x(g(e.size),50):p.value),_=n(()=>a.value?h.value===0?`first`:h.value===100?`second`:null:null),v=n(()=>_.value?_.value===`first`?0:100:w(h.value,d.value.min,d.value.max)),b=f(!1),T=n(()=>_.value===`first`),D=n(()=>_.value===`second`),O=x(g(e.defaultSize),50),k=_.value?w(O>0&&O<100?O:50,d.value.min,d.value.max):v.value,A,P,F=(t,n=!1)=>{if(!Number.isFinite(t))return;let r=n?t:w(t,d.value.min,d.value.max);r!==h.value&&(m.value||(p.value=r),e.onUpdateSize?.(r))};y(v,(t,n)=>{let r=M(n),i=_.value;!r&&i&&(k=n),r&&r!==i&&e.onExpand?.(r),i&&i!==r&&e.onCollapse?.(i),e.onResize?.(t,100-t)},{flush:`sync`}),y(d,()=>{_.value||F(v.value)},{flush:`sync`}),y([i,r],()=>A?.(),{flush:`sync`}),y(a,()=>{_.value||F(v.value)},{flush:`sync`});let I=()=>{let e=t.value;if(!e)return;let n=e.getBoundingClientRect();o.value=r.value===`horizontal`?n.width:n.height};y(r,I,{flush:`post`}),l(()=>{I(),typeof ResizeObserver<`u`&&t.value&&(P=new ResizeObserver(I),P.observe(t.value))});let L=(e=`first`)=>{!a.value||_.value===e||(_.value||(k=v.value),F(e===`first`?0:100,!0))},R=()=>{_.value&&F(k)},z=(e=`first`)=>{_.value===e?R():L(e)};return u(()=>{A?.(),P?.disconnect()}),{panelSize:v,isDragging:b,collapsedTarget:_,isFirstCollapsed:T,isSecondCollapsed:D,bounds:d,gutterSize:s,handleMouseDown:n=>{if(i.value||b.value||!E(n))return;let a=t.value;if(!a||(I(),!c.value))return;let o=v.value;A=j(n,{element:a,direction:r.value,onDelta:e=>F(o+e/c.value*100),onEnd:()=>{b.value=!1,A=void 0,e.onDragEnd?.(v.value)}}),A&&(b.value=!0,e.onDragStart?.(v.value))},handleDoubleClick:()=>{i.value||z(`first`)},handleKeyDown:t=>{if(i.value||t.target!==t.currentTarget)return;if(t.key===`Enter`){a.value&&(t.preventDefault(),_.value?R():L(`first`));return}let n=Math.max(0,x(g(e.step),2))||2,o=t.shiftKey?10:1,s=N(t.key,r.value,n*o,v.value,d.value);s!==void 0&&(t.preventDefault(),F(s))},collapse:L,expand:R,toggle:z,resetSize:()=>F(x(g(e.defaultSize),50)),setSize:e=>F(e),getPanelInfo:()=>({first:{size:v.value,collapsed:T.value},second:{size:100-v.value,collapsed:D.value}})}}const F=[`aria-hidden`,`inert`],I={class:`split-panel__content`},L=[`aria-orientation`,`aria-valuenow`,`aria-valuemin`,`aria-valuemax`,`aria-disabled`,`aria-label`,`tabindex`],R=[`disabled`,`aria-label`,`aria-expanded`,`title`],z={class:`split-gutter__visual`,"aria-hidden":`true`},B={class:`split-gutter__dots`},V=[`disabled`,`aria-label`,`aria-expanded`,`title`],H=[`aria-hidden`,`inert`],U={class:`split-panel__content`};var W=e(o({name:`C_SplitPane`,__name:`index`,props:{ariaLabel:{default:`调整面板大小`},direction:{default:`horizontal`},size:{},defaultSize:{default:50},minSize:{default:0},maxSize:{default:100},minFirstSize:{default:0},minSecondSize:{default:0},disabled:{type:Boolean,default:!1},collapsible:{type:Boolean,default:!0},showCollapseButton:{type:Boolean,default:!0},gutterSize:{default:6},step:{default:2}},emits:[`update:size`,`resize`,`collapse`,`expand`,`drag-start`,`drag-end`],setup(e,{expose:o,emit:l}){let u=e,g=l,y=v(),x=`split-${y}-first`,S=`split-${y}-second`,C=f(null),{panelSize:w,bounds:T,gutterSize:E,isDragging:D,isFirstCollapsed:O,isSecondCollapsed:k,handleMouseDown:A,handleDoubleClick:j,handleKeyDown:M,collapse:N,expand:W,toggle:G,resetSize:K,setSize:q,getPanelInfo:J}=P({containerRef:C,direction:h(u,`direction`),size:h(u,`size`),defaultSize:h(u,`defaultSize`),minSize:h(u,`minSize`),maxSize:h(u,`maxSize`),minFirstSize:h(u,`minFirstSize`),minSecondSize:h(u,`minSecondSize`),gutterSize:h(u,`gutterSize`),disabled:h(u,`disabled`),collapsible:h(u,`collapsible`),step:h(u,`step`),onUpdateSize:e=>g(`update:size`,e),onResize:(e,t)=>g(`resize`,e,t),onCollapse:e=>g(`collapse`,e),onExpand:e=>g(`expand`,e),onDragStart:e=>g(`drag-start`,e),onDragEnd:e=>g(`drag-end`,e)}),Y=n(()=>({flex:`${w.value} 1 0px`})),X=n(()=>({flex:`${100-w.value} 1 0px`})),Z=n(()=>u.direction===`horizontal`?{width:`${E.value}px`}:{height:`${E.value}px`});return o({collapse:N,expand:W,toggle:G,resetSize:K,getPanelInfo:J,setSize:q}),(n,o)=>(d(),i(`div`,{ref_key:`containerRef`,ref:C,class:s([`c-split-pane`,[`c-split-pane--${e.direction}`,{"c-split-pane--dragging":_(D),"c-split-pane--disabled":e.disabled,"c-split-pane--collapsed-first":_(O),"c-split-pane--collapsed-second":_(k)}]])},[r(` 首面板 `),a(`div`,{class:`split-panel split-panel--first`,id:x,style:c(Y.value),"aria-hidden":_(O)||void 0,inert:_(O)},[a(`div`,I,[m(n.$slots,`first`,{size:_(w),collapsed:_(O)},void 0,!0)])],12,F),r(` 分割线手柄 `),a(`div`,{class:`split-gutter`,style:c(Z.value),role:`separator`,"aria-orientation":e.direction===`horizontal`?`vertical`:`horizontal`,"aria-valuenow":_(w),"aria-valuemin":_(O)?0:_(T).min,"aria-valuemax":_(k)?100:_(T).max,"aria-disabled":e.disabled||void 0,"aria-controls":x,"aria-label":e.ariaLabel,tabindex:e.disabled?-1:0,onPointerdown:o[6]||=(...e)=>_(A)&&_(A)(...e),onDblclick:o[7]||=(...e)=>_(j)&&_(j)(...e),onKeydown:o[8]||=(...e)=>_(M)&&_(M)(...e)},[a(`div`,{class:s([`split-gutter__controls`,{"split-gutter__controls--with-collapse":e.showCollapseButton&&e.collapsible}])},[e.showCollapseButton&&e.collapsible?(d(),i(`button`,{key:0,class:`split-gutter__collapse-btn split-gutter__collapse-btn--first`,type:`button`,disabled:e.disabled,"aria-label":_(O)?`展开首面板`:`折叠首面板`,"aria-expanded":!_(O),"aria-controls":x,title:_(O)?`展开首面板`:`折叠首面板`,onClick:o[0]||=b(e=>_(G)(`first`),[`stop`]),onPointerdown:o[1]||=b(()=>{},[`stop`]),onDblclick:o[2]||=b(()=>{},[`stop`])},[...o[9]||=[a(`svg`,{class:`split-gutter__chevron`,viewBox:`0 0 16 16`,"aria-hidden":`true`,focusable:`false`},[a(`path`,{d:`m9.5 4.5-3.5 3.5 3.5 3.5`})],-1)]],40,R)):r(`v-if`,!0),a(`div`,z,[a(`div`,B,[(d(),i(t,null,p(3,e=>a(`span`,{key:e,class:`split-gutter__dot`})),64))])]),e.showCollapseButton&&e.collapsible?(d(),i(`button`,{key:1,class:`split-gutter__collapse-btn split-gutter__collapse-btn--second`,type:`button`,disabled:e.disabled,"aria-label":_(k)?`展开第二面板`:`折叠第二面板`,"aria-expanded":!_(k),"aria-controls":S,title:_(k)?`展开第二面板`:`折叠第二面板`,onClick:o[3]||=b(e=>_(G)(`second`),[`stop`]),onPointerdown:o[4]||=b(()=>{},[`stop`]),onDblclick:o[5]||=b(()=>{},[`stop`])},[...o[10]||=[a(`svg`,{class:`split-gutter__chevron`,viewBox:`0 0 16 16`,"aria-hidden":`true`,focusable:`false`},[a(`path`,{d:`m9.5 4.5-3.5 3.5 3.5 3.5`})],-1)]],40,V)):r(`v-if`,!0)],2)],44,L),r(` 第二面板 `),a(`div`,{class:`split-panel split-panel--second`,id:S,style:c(X.value),"aria-hidden":_(k)||void 0,inert:_(k)},[a(`div`,U,[m(n.$slots,`second`,{size:100-_(w),collapsed:_(k)},void 0,!0)])],12,H)],2))}}),[[`__scopeId`,`data-v-ea8d0f77`]]);export{P as n,W as t};