@robot-admin/naive-ui-components 0.16.0 → 0.17.1

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,191 +1,333 @@
 :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-99f7e295] {
+.c-split-pane[data-v-ea8d0f77] {
   display: flex;
   width: 100%;
   height: 100%;
+  min-width: 0;
+  min-height: 0;
   overflow: hidden;
   position: relative;
-  /* ─── 方向 ────────────────────────────────── */
 }
-.c-split-pane--horizontal[data-v-99f7e295] {
+.c-split-pane--horizontal[data-v-ea8d0f77] {
   flex-direction: row;
 }
-.c-split-pane--vertical[data-v-99f7e295] {
+.c-split-pane--vertical[data-v-ea8d0f77] {
   flex-direction: column;
 }
-.c-split-pane[data-v-99f7e295] {
-  /* ─── 拖拽中 ──────────────────────────────── */
-}
-.c-split-pane--dragging .split-panel__content[data-v-99f7e295] {
+.c-split-pane--dragging > .split-panel > .split-panel__content[data-v-ea8d0f77] {
   pointer-events: none;
   user-select: none;
 }
-.c-split-pane[data-v-99f7e295] {
-  /* ─── 禁用 ────────────────────────────────── */
-}
-.c-split-pane--disabled .split-gutter[data-v-99f7e295] {
-  cursor: default !important;
+.c-split-pane--disabled > .split-gutter[data-v-ea8d0f77] {
+  cursor: default;
   opacity: 0.5;
 }
-.c-split-pane--disabled .split-gutter[data-v-99f7e295]:hover {
-  background: transparent;
-}
-.c-split-pane[data-v-99f7e295] {
-  /* ─── 折叠过渡 ────────────────────────────── */
-}
-.c-split-pane--collapsed-first .split-panel[data-v-99f7e295], .c-split-pane--collapsed-second .split-panel[data-v-99f7e295] {
-  transition: width 0.3s ease, height 0.3s ease;
-}
-
-/* ─── 面板 ──────────────────────────────────── */
-.split-panel[data-v-99f7e295] {
+.split-panel[data-v-ea8d0f77] {
+  min-width: 0;
+  min-height: 0;
   overflow: hidden;
   position: relative;
+  display: flex;
+  flex-direction: column;
 }
-.split-panel__content[data-v-99f7e295] {
+.split-panel__content[data-v-ea8d0f77] {
   width: 100%;
   height: 100%;
+  min-width: 0;
+  min-height: 0;
   overflow: auto;
-}
-
-/* ─── 分割线手柄 ────────────────────────────── */
-.split-gutter[data-v-99f7e295] {
+  overscroll-behavior: contain;
+}
+.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;
   justify-content: center;
-  flex-shrink: 0;
+  flex: 0 0 auto;
   z-index: 1;
-  background: var(--c-border, #e1e4e8);
-  transition: background-color 0.2s ease;
+  touch-action: none;
+  user-select: none;
+  background: transparent;
   outline: none;
-  /* 水平方向 */
 }
-.c-split-pane--horizontal .split-gutter[data-v-99f7e295] {
-  cursor: col-resize;
-  min-width: 4px;
+.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-99f7e295]:hover, .c-split-pane--horizontal .split-gutter[data-v-99f7e295]:focus-visible {
-  background: var(--c-primary, #409eff);
+.c-split-pane--horizontal > .split-gutter[data-v-ea8d0f77] {
+  cursor: col-resize;
 }
-.split-gutter[data-v-99f7e295] {
-  /* 垂直方向 */
+.c-split-pane--horizontal > .split-gutter[data-v-ea8d0f77]::before {
+  inset: 0 auto;
+  width: 1px;
 }
-.c-split-pane--vertical .split-gutter[data-v-99f7e295] {
+.c-split-pane--vertical > .split-gutter[data-v-ea8d0f77] {
   cursor: row-resize;
-  min-height: 4px;
 }
-.c-split-pane--vertical .split-gutter[data-v-99f7e295]:hover, .c-split-pane--vertical .split-gutter[data-v-99f7e295]:focus-visible {
-  background: var(--c-primary, #409eff);
+.c-split-pane--vertical > .split-gutter[data-v-ea8d0f77]::before {
+  inset: auto 0;
+  height: 1px;
+}
+.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[data-v-99f7e295] {
-  /* focus 轮廓 */
+.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
+  );
 }
-.split-gutter[data-v-99f7e295]:focus-visible {
-  box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.3);
+.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);
 }
-.split-gutter[data-v-99f7e295] {
-  /* ─── 视觉指示条 ──────────────────────────── */
+.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__visual[data-v-99f7e295] {
+.split-gutter__visual[data-v-ea8d0f77] {
   display: flex;
   align-items: center;
   justify-content: center;
-}
-.split-gutter__dots[data-v-99f7e295] {
+  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: 2px;
+  gap: 5px;
+  pointer-events: none;
 }
-.c-split-pane--horizontal .split-gutter__dots[data-v-99f7e295] {
+.c-split-pane--horizontal > .split-gutter .split-gutter__dots[data-v-ea8d0f77] {
   flex-direction: column;
 }
-.c-split-pane--vertical .split-gutter__dots[data-v-99f7e295] {
-  flex-direction: row;
-}
-.split-gutter__dot[data-v-99f7e295] {
+.split-gutter__dot[data-v-ea8d0f77] {
   width: 3px;
   height: 3px;
   border-radius: 50%;
-  background: var(--c-text-4, #ccc);
-  transition: background-color 0.2s ease;
-}
-.split-gutter:hover .split-gutter__dot[data-v-99f7e295] {
-  background: #fff;
+  background: var(--split-grip-dot);
+  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
+  transition: background-color 0.16s ease;
 }
-.split-gutter[data-v-99f7e295] {
-  /* ─── 折叠按钮 ────────────────────────────── */
-}
-.split-gutter__collapse-btn[data-v-99f7e295] {
-  position: absolute;
+.split-gutter__collapse-btn[data-v-ea8d0f77] {
   display: flex;
   align-items: center;
   justify-content: center;
-  width: 16px;
-  height: 16px;
+  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: 1px solid var(--split-border);
   border-radius: 50%;
-  background: var(--c-bg-card, #fff);
-  color: var(--c-text-3, #999);
-  font-size: 12px;
+  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.2s ease, color 0.2s ease, background-color 0.2s ease;
-  z-index: 2;
+  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-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-ea8d0f77]:focus-visible {
+  outline: 2px solid var(--split-accent);
+  outline-offset: 2px;
+}
+.split-gutter__collapse-btn[data-v-ea8d0f77]:disabled {
+  cursor: default;
+}
+.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);
 }
-.split-gutter:hover .split-gutter__collapse-btn[data-v-99f7e295] {
+.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--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--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: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: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;
 }
-.split-gutter__collapse-btn[data-v-99f7e295]:hover {
-  color: var(--c-primary, #409eff);
-  background: var(--c-bg, #fff);
+.c-split-pane--horizontal.c-split-pane--collapsed-second > .split-gutter .split-gutter__controls[data-v-ea8d0f77] {
+  right: 0;
 }
-.split-gutter__collapse-btn[data-v-99f7e295] {
-  /* 水平方向的定位 */
+.c-split-pane--vertical.c-split-pane--collapsed-first > .split-gutter .split-gutter__controls[data-v-ea8d0f77] {
+  top: 0;
 }
-.c-split-pane--horizontal .split-gutter__collapse-btn[data-v-99f7e295] {
-  left: 50%;
-  transform: translateX(-50%);
+.c-split-pane--vertical.c-split-pane--collapsed-second > .split-gutter .split-gutter__controls[data-v-ea8d0f77] {
+  bottom: 0;
 }
-.c-split-pane--horizontal .split-gutter__collapse-btn--first[data-v-99f7e295] {
-  top: 8px;
+.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;
 }
-.c-split-pane--horizontal .split-gutter__collapse-btn--second[data-v-99f7e295] {
-  bottom: 8px;
+@media (hover: none), (pointer: coarse) {
+.split-gutter[data-v-ea8d0f77] {
+    --split-handle-thickness: 24px;
+    --split-button-size: 28px;
 }
-.split-gutter__collapse-btn[data-v-99f7e295] {
-  /* 垂直方向的定位 */
+.c-split-pane:not(.c-split-pane--disabled) > .split-gutter .split-gutter__collapse-btn[data-v-ea8d0f77] {
+    opacity: 1;
+    visibility: visible;
+    pointer-events: auto;
 }
-.c-split-pane--vertical .split-gutter__collapse-btn[data-v-99f7e295] {
-  top: 50%;
-  transform: translateY(-50%);
 }
-.c-split-pane--vertical .split-gutter__collapse-btn--first[data-v-99f7e295] {
-  left: 8px;
+@media (prefers-reduced-motion: reduce) {
+.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;
 }
-.c-split-pane--vertical .split-gutter__collapse-btn--second[data-v-99f7e295] {
-  right: 8px;
 }
 
 /* layer: shortcuts */
-.container[data-v-99f7e295]{width:100%;}
+.container[data-v-ea8d0f77]{width:100%;}
 @media (min-width: 640px){
-.container[data-v-99f7e295]{max-width:640px;}
+.container[data-v-ea8d0f77]{max-width:640px;}
 }
 @media (min-width: 768px){
-.container[data-v-99f7e295]{max-width:768px;}
+.container[data-v-ea8d0f77]{max-width:768px;}
 }
 @media (min-width: 1024px){
-.container[data-v-99f7e295]{max-width:1024px;}
+.container[data-v-ea8d0f77]{max-width:1024px;}
 }
 @media (min-width: 1280px){
-.container[data-v-99f7e295]{max-width:1280px;}
+.container[data-v-ea8d0f77]{max-width:1280px;}
 }
 @media (min-width: 1536px){
-.container[data-v-99f7e295]{max-width:1536px;}
+.container[data-v-ea8d0f77]{max-width:1536px;}
 }
 /* layer: default */
-.resize[data-v-99f7e295]{resize:both;}
-.px[data-v-99f7e295]{padding-left:1rem;padding-right:1rem;}
+.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`);function r(e){let{containerRef:t,direction:r,defaultSize:i,minSize:a,maxSize:o,disabled:s,collapsible:c,step:l,onResize:u,onCollapse:d,onExpand:f,onDragStart:p,onDragEnd:m}=e,h=Number.isFinite(a)?a:0,g=Number.isFinite(o)?o:100,_=Math.max(0,Math.min(100,Math.min(h,g))),v=Math.max(0,Math.min(100,Math.max(h,g))),y=Math.min(v,Math.max(_,Number.isFinite(i)?i:50)),b=(0,n.ref)(y),x=(0,n.ref)(!1),S=(0,n.ref)(null),C=(0,n.ref)(y),w=``,T=``,E=(0,n.computed)(()=>S.value===`first`),D=(0,n.computed)(()=>S.value===`second`),O=e=>Number.isFinite(e)?Math.min(v,Math.max(_,e)):b.value,k=()=>{let e=t.value;return e?r.value===`horizontal`?e.offsetWidth:e.offsetHeight:0},A=()=>{let e=t.value;if(!e)return 0;let n=e.getBoundingClientRect();return r.value===`horizontal`?n.left:n.top},j=e=>{let t=k();return t===0?b.value:O((e-A())/t*100)},M=e=>e instanceof TouchEvent?r.value===`horizontal`?e.touches[0].clientX:e.touches[0].clientY:r.value===`horizontal`?e.clientX:e.clientY,N=e=>{let t=O(e);t!==b.value&&(b.value=t,u?.(t,100-t))},P=e=>{if(!x.value||s.value)return;e.preventDefault();let t=j(M(e));S.value&&=null,N(t)},F=()=>{x.value&&(x.value=!1,document.body.style.cursor=w,document.body.style.userSelect=T,m?.(b.value),document.removeEventListener(`mousemove`,P),document.removeEventListener(`mouseup`,F),document.removeEventListener(`touchmove`,P),document.removeEventListener(`touchend`,F))},I=e=>{s.value||x.value||(e.preventDefault(),e.currentTarget?.focus(),x.value=!0,w=document.body.style.cursor,T=document.body.style.userSelect,document.body.style.cursor=r.value===`horizontal`?`col-resize`:`row-resize`,document.body.style.userSelect=`none`,p?.(b.value),document.addEventListener(`mousemove`,P),document.addEventListener(`mouseup`,F),document.addEventListener(`touchmove`,P,{passive:!1}),document.addEventListener(`touchend`,F))},L=()=>{s.value||!c.value||B(`first`)},R=(e=`first`)=>{!c.value||S.value===e||(S.value||(C.value=b.value),S.value=e,e===`first`?b.value=0:b.value=100,d?.(e),u?.(b.value,100-b.value))},z=()=>{if(!S.value)return;let e=S.value;S.value=null,b.value=O(C.value),f?.(e),u?.(b.value,100-b.value)},B=(e=`first`)=>{S.value===e?z():R(e)},V=(e,t)=>{let n=Number.isFinite(l)&&l>0?l:2;return{ArrowLeft:t?-n:0,ArrowRight:t?n:0,ArrowUp:t?0:-n,ArrowDown:t?0:n}[e]??null};return(0,n.onUnmounted)(()=>{x.value&&=(document.body.style.cursor=w,document.body.style.userSelect=T,!1),document.removeEventListener(`mousemove`,P),document.removeEventListener(`mouseup`,F),document.removeEventListener(`touchmove`,P),document.removeEventListener(`touchend`,F)}),{panelSize:b,isDragging:x,collapsedTarget:S,isFirstCollapsed:E,isSecondCollapsed:D,handleMouseDown:I,handleDoubleClick:L,handleKeyDown:e=>{if(s.value)return;if(e.key===`Home`){N(_),e.preventDefault();return}if(e.key===`End`){N(v),e.preventDefault();return}let t=V(e.key,r.value===`horizontal`);t===null||t===0||(e.preventDefault(),S.value&&=null,N(b.value+t))},collapse:R,expand:z,toggle:B,resetSize:()=>{S.value=null,b.value=y,u?.(y,100-y)},setSize:e=>{S.value=null,N(e)},getPanelInfo:()=>({first:{size:b.value,collapsed:E.value},second:{size:100-b.value,collapsed:D.value}})}}const i={class:`split-panel__content`},a=[`aria-orientation`,`aria-valuenow`,`aria-valuemin`,`aria-valuemax`,`aria-disabled`,`tabindex`],o={class:`split-gutter__visual`},s={class:`split-gutter__dots`},c=[`title`],l=[`title`],u={class:`split-panel__content`},d=(0,n.defineComponent)({name:`C_SplitPane`,__name:`index`,props:{direction:{default:`horizontal`},defaultSize:{default:50},minSize:{default:0},maxSize:{default:100},disabled:{type:Boolean,default:!1},collapsible:{type:Boolean,default:!0},showCollapseButton:{type:Boolean,default:!0},gutterSize:{default:6},step:{default:2}},emits:[`resize`,`collapse`,`expand`,`drag-start`,`drag-end`],setup(t,{expose:d,emit:f}){let p=t,m=f,h=(0,n.ref)(null),{panelSize:g,isDragging:_,isFirstCollapsed:v,isSecondCollapsed:y,handleMouseDown:b,handleDoubleClick:x,handleKeyDown:S,collapse:C,expand:w,toggle:T,resetSize:E,setSize:D,getPanelInfo:O}=r({containerRef:h,direction:(0,n.toRef)(p,`direction`),defaultSize:p.defaultSize,minSize:p.minSize,maxSize:p.maxSize,disabled:(0,n.toRef)(p,`disabled`),collapsible:(0,n.toRef)(p,`collapsible`),step:p.step,onResize:(e,t)=>m(`resize`,e,t),onCollapse:e=>m(`collapse`,e),onExpand:e=>m(`expand`,e),onDragStart:e=>m(`drag-start`,e),onDragEnd:e=>m(`drag-end`,e)}),k=(0,n.computed)(()=>{let e=`calc(${g.value}% - ${Math.max(0,p.gutterSize)/2}px)`;return p.direction===`horizontal`?{width:e}:{height:e}}),A=(0,n.computed)(()=>{let e=`calc(${100-g.value}% - ${Math.max(0,p.gutterSize)/2}px)`;return p.direction===`horizontal`?{width:e}:{height:e}}),j=(0,n.computed)(()=>p.direction===`horizontal`?{width:`${Math.max(0,p.gutterSize)}px`}:{height:`${Math.max(0,p.gutterSize)}px`}),M=(0,n.computed)(()=>p.direction===`horizontal`?v.value?`mdi:chevron-right`:`mdi:chevron-left`:v.value?`mdi:chevron-down`:`mdi:chevron-up`),N=(0,n.computed)(()=>p.direction===`horizontal`?y.value?`mdi:chevron-left`:`mdi:chevron-right`:y.value?`mdi:chevron-up`:`mdi:chevron-down`);return d({collapse:C,expand:w,toggle:T,resetSize:E,getPanelInfo:O,setSize:D}),(r,d)=>((0,n.openBlock)(),(0,n.createElementBlock)(`div`,{ref_key:`containerRef`,ref:h,class:(0,n.normalizeClass)([`c-split-pane`,[`c-split-pane--${t.direction}`,{"c-split-pane--dragging":(0,n.unref)(_),"c-split-pane--disabled":t.disabled,"c-split-pane--collapsed-first":(0,n.unref)(v),"c-split-pane--collapsed-second":(0,n.unref)(y)}]])},[(0,n.createCommentVNode)(` 首面板 `),(0,n.createElementVNode)(`div`,{class:`split-panel split-panel--first`,style:(0,n.normalizeStyle)(k.value)},[(0,n.createElementVNode)(`div`,i,[(0,n.renderSlot)(r.$slots,`first`,{},void 0,!0)])],4),(0,n.createCommentVNode)(` 分割线手柄 `),(0,n.createElementVNode)(`div`,{class:`split-gutter`,style:(0,n.normalizeStyle)(j.value),role:`separator`,"aria-orientation":t.direction===`horizontal`?`vertical`:`horizontal`,"aria-valuenow":Math.round((0,n.unref)(g)),"aria-valuemin":Math.min(t.minSize,t.maxSize),"aria-valuemax":Math.max(t.minSize,t.maxSize),"aria-disabled":t.disabled||void 0,tabindex:t.disabled?-1:0,onMousedown:d[4]||=(...e)=>(0,n.unref)(b)&&(0,n.unref)(b)(...e),onTouchstart:d[5]||=(0,n.withModifiers)((...e)=>(0,n.unref)(b)&&(0,n.unref)(b)(...e),[`prevent`]),onDblclick:d[6]||=(...e)=>(0,n.unref)(x)&&(0,n.unref)(x)(...e),onKeydown:d[7]||=(...e)=>(0,n.unref)(S)&&(0,n.unref)(S)(...e)},[(0,n.createElementVNode)(`div`,o,[(0,n.createElementVNode)(`div`,s,[((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`,title:(0,n.unref)(v)?`展开首面板`:`折叠首面板`,onClick:d[0]||=(0,n.withModifiers)(e=>(0,n.unref)(T)(`first`),[`stop`]),onMousedown:d[1]||=(0,n.withModifiers)(()=>{},[`stop`])},[(0,n.createVNode)(e.t,{name:M.value,size:16,color:`currentColor`},null,8,[`name`])],40,c),(0,n.createElementVNode)(`button`,{class:`split-gutter__collapse-btn split-gutter__collapse-btn--second`,title:(0,n.unref)(y)?`展开第二面板`:`折叠第二面板`,onClick:d[2]||=(0,n.withModifiers)(e=>(0,n.unref)(T)(`second`),[`stop`]),onMousedown:d[3]||=(0,n.withModifiers)(()=>{},[`stop`])},[(0,n.createVNode)(e.t,{name:N.value,size:16,color:`currentColor`},null,8,[`name`])],40,l)],64)):(0,n.createCommentVNode)(`v-if`,!0)],44,a),(0,n.createCommentVNode)(` 第二面板 `),(0,n.createElementVNode)(`div`,{class:`split-panel split-panel--second`,style:(0,n.normalizeStyle)(A.value)},[(0,n.createElementVNode)(`div`,u,[(0,n.renderSlot)(r.$slots,`second`,{},void 0,!0)])],4)],2))}});var f=t.t(d,[[`__scopeId`,`data-v-99f7e295`]]);Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return f}});
+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,onUnmounted as d,openBlock as f,ref as p,renderList as m,renderSlot as h,toRef as g,unref as _,withModifiers as v}from"vue";function y(e){let{containerRef:t,direction:n,defaultSize:i,minSize:a,maxSize:o,disabled:s,collapsible:c,step:l,onResize:u,onCollapse:f,onExpand:m,onDragStart:h,onDragEnd:g}=e,_=Number.isFinite(a)?a:0,v=Number.isFinite(o)?o:100,y=Math.max(0,Math.min(100,Math.min(_,v))),b=Math.max(0,Math.min(100,Math.max(_,v))),x=Math.min(b,Math.max(y,Number.isFinite(i)?i:50)),S=p(x),C=p(!1),w=p(null),T=p(x),E=``,D=``,O=r(()=>w.value===`first`),k=r(()=>w.value===`second`),A=e=>Number.isFinite(e)?Math.min(b,Math.max(y,e)):S.value,j=()=>{let e=t.value;return e?n.value===`horizontal`?e.offsetWidth:e.offsetHeight:0},M=()=>{let e=t.value;if(!e)return 0;let r=e.getBoundingClientRect();return n.value===`horizontal`?r.left:r.top},N=e=>{let t=j();return t===0?S.value:A((e-M())/t*100)},P=e=>e instanceof TouchEvent?n.value===`horizontal`?e.touches[0].clientX:e.touches[0].clientY:n.value===`horizontal`?e.clientX:e.clientY,F=e=>{let t=A(e);t!==S.value&&(S.value=t,u?.(t,100-t))},I=e=>{if(!C.value||s.value)return;e.preventDefault();let t=N(P(e));w.value&&=null,F(t)},L=()=>{C.value&&(C.value=!1,document.body.style.cursor=E,document.body.style.userSelect=D,g?.(S.value),document.removeEventListener(`mousemove`,I),document.removeEventListener(`mouseup`,L),document.removeEventListener(`touchmove`,I),document.removeEventListener(`touchend`,L))},R=e=>{s.value||C.value||(e.preventDefault(),e.currentTarget?.focus(),C.value=!0,E=document.body.style.cursor,D=document.body.style.userSelect,document.body.style.cursor=n.value===`horizontal`?`col-resize`:`row-resize`,document.body.style.userSelect=`none`,h?.(S.value),document.addEventListener(`mousemove`,I),document.addEventListener(`mouseup`,L),document.addEventListener(`touchmove`,I,{passive:!1}),document.addEventListener(`touchend`,L))},z=()=>{s.value||!c.value||H(`first`)},B=(e=`first`)=>{!c.value||w.value===e||(w.value||(T.value=S.value),w.value=e,e===`first`?S.value=0:S.value=100,f?.(e),u?.(S.value,100-S.value))},V=()=>{if(!w.value)return;let e=w.value;w.value=null,S.value=A(T.value),m?.(e),u?.(S.value,100-S.value)},H=(e=`first`)=>{w.value===e?V():B(e)},U=(e,t)=>{let n=Number.isFinite(l)&&l>0?l:2;return{ArrowLeft:t?-n:0,ArrowRight:t?n:0,ArrowUp:t?0:-n,ArrowDown:t?0:n}[e]??null};return d(()=>{C.value&&=(document.body.style.cursor=E,document.body.style.userSelect=D,!1),document.removeEventListener(`mousemove`,I),document.removeEventListener(`mouseup`,L),document.removeEventListener(`touchmove`,I),document.removeEventListener(`touchend`,L)}),{panelSize:S,isDragging:C,collapsedTarget:w,isFirstCollapsed:O,isSecondCollapsed:k,handleMouseDown:R,handleDoubleClick:z,handleKeyDown:e=>{if(s.value)return;if(e.key===`Home`){F(y),e.preventDefault();return}if(e.key===`End`){F(b),e.preventDefault();return}let t=U(e.key,n.value===`horizontal`);t===null||t===0||(e.preventDefault(),w.value&&=null,F(S.value+t))},collapse:B,expand:V,toggle:H,resetSize:()=>{w.value=null,S.value=x,u?.(x,100-x)},setSize:e=>{w.value=null,F(e)},getPanelInfo:()=>({first:{size:S.value,collapsed:O.value},second:{size:100-S.value,collapsed:k.value}})}}const b={class:`split-panel__content`},x=[`aria-orientation`,`aria-valuenow`,`aria-valuemin`,`aria-valuemax`,`aria-disabled`,`tabindex`],S={class:`split-gutter__visual`},C={class:`split-gutter__dots`},w=[`title`],T=[`title`],E={class:`split-panel__content`};var D=t(c({name:`C_SplitPane`,__name:`index`,props:{direction:{default:`horizontal`},defaultSize:{default:50},minSize:{default:0},maxSize:{default:100},disabled:{type:Boolean,default:!1},collapsible:{type:Boolean,default:!0},showCollapseButton:{type:Boolean,default:!0},gutterSize:{default:6},step:{default:2}},emits:[`resize`,`collapse`,`expand`,`drag-start`,`drag-end`],setup(t,{expose:c,emit:d}){let D=t,O=d,k=p(null),{panelSize:A,isDragging:j,isFirstCollapsed:M,isSecondCollapsed:N,handleMouseDown:P,handleDoubleClick:F,handleKeyDown:I,collapse:L,expand:R,toggle:z,resetSize:B,setSize:V,getPanelInfo:H}=y({containerRef:k,direction:g(D,`direction`),defaultSize:D.defaultSize,minSize:D.minSize,maxSize:D.maxSize,disabled:g(D,`disabled`),collapsible:g(D,`collapsible`),step:D.step,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)}),U=r(()=>{let e=`calc(${A.value}% - ${Math.max(0,D.gutterSize)/2}px)`;return D.direction===`horizontal`?{width:e}:{height:e}}),W=r(()=>{let e=`calc(${100-A.value}% - ${Math.max(0,D.gutterSize)/2}px)`;return D.direction===`horizontal`?{width:e}:{height:e}}),G=r(()=>D.direction===`horizontal`?{width:`${Math.max(0,D.gutterSize)}px`}:{height:`${Math.max(0,D.gutterSize)}px`}),K=r(()=>D.direction===`horizontal`?M.value?`mdi:chevron-right`:`mdi:chevron-left`:M.value?`mdi:chevron-down`:`mdi:chevron-up`),q=r(()=>D.direction===`horizontal`?N.value?`mdi:chevron-left`:`mdi:chevron-right`:N.value?`mdi:chevron-up`:`mdi:chevron-down`);return c({collapse:L,expand:R,toggle:z,resetSize:B,getPanelInfo:H,setSize:V}),(r,c)=>(f(),a(`div`,{ref_key:`containerRef`,ref:k,class:l([`c-split-pane`,[`c-split-pane--${t.direction}`,{"c-split-pane--dragging":_(j),"c-split-pane--disabled":t.disabled,"c-split-pane--collapsed-first":_(M),"c-split-pane--collapsed-second":_(N)}]])},[i(` 首面板 `),o(`div`,{class:`split-panel split-panel--first`,style:u(U.value)},[o(`div`,b,[h(r.$slots,`first`,{},void 0,!0)])],4),i(` 分割线手柄 `),o(`div`,{class:`split-gutter`,style:u(G.value),role:`separator`,"aria-orientation":t.direction===`horizontal`?`vertical`:`horizontal`,"aria-valuenow":Math.round(_(A)),"aria-valuemin":Math.min(t.minSize,t.maxSize),"aria-valuemax":Math.max(t.minSize,t.maxSize),"aria-disabled":t.disabled||void 0,tabindex:t.disabled?-1:0,onMousedown:c[4]||=(...e)=>_(P)&&_(P)(...e),onTouchstart:c[5]||=v((...e)=>_(P)&&_(P)(...e),[`prevent`]),onDblclick:c[6]||=(...e)=>_(F)&&_(F)(...e),onKeydown:c[7]||=(...e)=>_(I)&&_(I)(...e)},[o(`div`,S,[o(`div`,C,[(f(),a(n,null,m(3,e=>o(`span`,{key:e,class:`split-gutter__dot`})),64))])]),i(` 折叠按钮 `),t.showCollapseButton&&t.collapsible?(f(),a(n,{key:0},[o(`button`,{class:`split-gutter__collapse-btn split-gutter__collapse-btn--first`,title:_(M)?`展开首面板`:`折叠首面板`,onClick:c[0]||=v(e=>_(z)(`first`),[`stop`]),onMousedown:c[1]||=v(()=>{},[`stop`])},[s(e,{name:K.value,size:16,color:`currentColor`},null,8,[`name`])],40,w),o(`button`,{class:`split-gutter__collapse-btn split-gutter__collapse-btn--second`,title:_(N)?`展开第二面板`:`折叠第二面板`,onClick:c[2]||=v(e=>_(z)(`second`),[`stop`]),onMousedown:c[3]||=v(()=>{},[`stop`])},[s(e,{name:q.value,size:16,color:`currentColor`},null,8,[`name`])],40,T)],64)):i(`v-if`,!0)],44,x),i(` 第二面板 `),o(`div`,{class:`split-panel split-panel--second`,style:u(W.value)},[o(`div`,E,[h(r.$slots,`second`,{},void 0,!0)])],4)],2))}}),[[`__scopeId`,`data-v-99f7e295`]]);export{y as n,D 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};