video-split-screen 1.0.15 → 1.0.17

package/dist/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),y={1:{type:"1",label:"1分屏",count:1,cols:1,rows:1},2:{type:"2",label:"2分屏",count:2,cols:2,rows:1},3:{type:"3",label:"3分屏",count:3,cols:2,rows:2},4:{type:"4",label:"4分屏",count:4,cols:2,rows:2},6:{type:"6",label:"6分屏",count:6,cols:3,rows:2},7:{type:"7",label:"7分屏",count:7,cols:4,rows:4},8:{type:"8",label:"8分屏",count:8,cols:4,rows:4},9:{type:"9",label:"9分屏",count:9,cols:3,rows:3},10:{type:"10",label:"10分屏",count:10,cols:6,rows:4},13:{type:"13",label:"13分屏",count:13,cols:4,rows:4},16:{type:"16",label:"16分屏",count:16,cols:4,rows:4}},I={};function G(i){if(I[i])return I[i];const o={1:[{col:1,colSpan:1,row:1,rowSpan:1}],2:[{col:1,colSpan:1,row:1,rowSpan:1},{col:2,colSpan:1,row:1,rowSpan:1}],3:[{col:1,colSpan:1,row:1,rowSpan:2,isMain:!0},{col:2,colSpan:1,row:1,rowSpan:1},{col:2,colSpan:1,row:2,rowSpan:1}],4:[{col:1,colSpan:1,row:1,rowSpan:1},{col:2,colSpan:1,row:1,rowSpan:1},{col:1,colSpan:1,row:2,rowSpan:1},{col:2,colSpan:1,row:2,rowSpan:1}],6:[{col:1,colSpan:1,row:1,rowSpan:1},{col:2,colSpan:1,row:1,rowSpan:1},{col:3,colSpan:1,row:1,rowSpan:1},{col:1,colSpan:1,row:2,rowSpan:1},{col:2,colSpan:1,row:2,rowSpan:1},{col:3,colSpan:1,row:2,rowSpan:1}],7:[{col:1,colSpan:2,row:1,rowSpan:2},{col:3,colSpan:2,row:1,rowSpan:2},{col:1,colSpan:2,row:3,rowSpan:2},{col:3,colSpan:1,row:3,rowSpan:1},{col:4,colSpan:1,row:3,rowSpan:1},{col:3,colSpan:1,row:4,rowSpan:1},{col:4,colSpan:1,row:4,rowSpan:1}],8:[{col:1,colSpan:3,row:1,rowSpan:3,isMain:!0},{col:4,colSpan:1,row:1,rowSpan:1},{col:4,colSpan:1,row:2,rowSpan:1},{col:4,colSpan:1,row:3,rowSpan:1},{col:1,colSpan:1,row:4,rowSpan:1},{col:2,colSpan:1,row:4,rowSpan:1},{col:3,colSpan:1,row:4,rowSpan:1},{col:4,colSpan:1,row:4,rowSpan:1}],9:[{col:1,colSpan:1,row:1,rowSpan:1},{col:2,colSpan:1,row:1,rowSpan:1},{col:3,colSpan:1,row:1,rowSpan:1},{col:1,colSpan:1,row:2,rowSpan:1},{col:2,colSpan:1,row:2,rowSpan:1},{col:3,colSpan:1,row:2,rowSpan:1},{col:1,colSpan:1,row:3,rowSpan:1},{col:2,colSpan:1,row:3,rowSpan:1},{col:3,colSpan:1,row:3,rowSpan:1}],10:[{col:1,colSpan:5,row:1,rowSpan:3,isMain:!0},{col:6,colSpan:1,row:1,rowSpan:1},{col:6,colSpan:1,row:2,rowSpan:1},{col:6,colSpan:1,row:3,rowSpan:1},{col:1,colSpan:1,row:4,rowSpan:1},{col:2,colSpan:1,row:4,rowSpan:1},{col:3,colSpan:1,row:4,rowSpan:1},{col:4,colSpan:1,row:4,rowSpan:1},{col:5,colSpan:1,row:4,rowSpan:1},{col:6,colSpan:1,row:4,rowSpan:1}],13:[{col:1,colSpan:2,row:1,rowSpan:2,isMain:!0},{col:3,colSpan:1,row:1,rowSpan:1},{col:4,colSpan:1,row:1,rowSpan:1},{col:3,colSpan:1,row:2,rowSpan:1},{col:4,colSpan:1,row:2,rowSpan:1},{col:1,colSpan:1,row:3,rowSpan:1},{col:2,colSpan:1,row:3,rowSpan:1},{col:3,colSpan:1,row:3,rowSpan:1},{col:4,colSpan:1,row:3,rowSpan:1},{col:1,colSpan:1,row:4,rowSpan:1},{col:2,colSpan:1,row:4,rowSpan:1},{col:3,colSpan:1,row:4,rowSpan:1},{col:4,colSpan:1,row:4,rowSpan:1}],16:[{col:1,colSpan:1,row:1,rowSpan:1},{col:2,colSpan:1,row:1,rowSpan:1},{col:3,colSpan:1,row:1,rowSpan:1},{col:4,colSpan:1,row:1,rowSpan:1},{col:1,colSpan:1,row:2,rowSpan:1},{col:2,colSpan:1,row:2,rowSpan:1},{col:3,colSpan:1,row:2,rowSpan:1},{col:4,colSpan:1,row:2,rowSpan:1},{col:1,colSpan:1,row:3,rowSpan:1},{col:2,colSpan:1,row:3,rowSpan:1},{col:3,colSpan:1,row:3,rowSpan:1},{col:4,colSpan:1,row:3,rowSpan:1},{col:1,colSpan:1,row:4,rowSpan:1},{col:2,colSpan:1,row:4,rowSpan:1},{col:3,colSpan:1,row:4,rowSpan:1},{col:4,colSpan:1,row:4,rowSpan:1}]}[i]||[];return o.length>0&&(I[i]=o),o}function M(){return Object.keys(y)}const K={class:"layout-icon"},Z={key:0,viewBox:"0 0 48 48",fill:"none"},ee={key:1,viewBox:"0 0 48 48",fill:"none"},te={key:2,viewBox:"0 0 48 48",fill:"none"},oe={key:3,viewBox:"0 0 48 48",fill:"none"},re={key:4,viewBox:"0 0 48 48",fill:"none"},ae={key:5,viewBox:"0 0 48 48",fill:"none"},le={key:6,viewBox:"0 0 48 48",fill:"none"},ne={key:7,viewBox:"0 0 48 48",fill:"none"},ce={key:8,viewBox:"0 0 54 48",fill:"none"},ie={key:9,viewBox:"0 0 48 48",fill:"none"},de={key:10,viewBox:"0 0 48 48",fill:"none"},se=e.defineComponent({__name:"VideoLayoutIcon",props:{type:{}},setup(i){return(v,o)=>(e.openBlock(),e.createElementBlock("div",K,[i.type==="1"?(e.openBlock(),e.createElementBlock("svg",Z,[...o[0]||(o[0]=[e.createElementVNode("rect",{x:"4",y:"4",width:"40",height:"40",stroke:"currentColor","stroke-width":"2"},null,-1)])])):i.type==="2"?(e.openBlock(),e.createElementBlock("svg",ee,[...o[1]||(o[1]=[e.createElementVNode("rect",{x:"4",y:"4",width:"19",height:"40",stroke:"currentColor","stroke-width":"1.5"},null,-1),e.createElementVNode("rect",{x:"25",y:"4",width:"19",height:"40",stroke:"currentColor","stroke-width":"1.5"},null,-1)])])):i.type==="3"?(e.openBlock(),e.createElementBlock("svg",te,[...o[2]||(o[2]=[e.createElementVNode("rect",{x:"4",y:"4",width:"20",height:"40",stroke:"currentColor","stroke-width":"2"},null,-1),e.createElementVNode("rect",{x:"26",y:"4",width:"18",height:"19",stroke:"currentColor","stroke-width":"1.5"},null,-1),e.createElementVNode("rect",{x:"26",y:"25",width:"18",height:"19",stroke:"currentColor","stroke-width":"1.5"},null,-1)])])):i.type==="4"?(e.openBlock(),e.createElementBlock("svg",oe,[...o[3]||(o[3]=[e.createElementVNode("rect",{x:"4",y:"4",width:"19",height:"19",stroke:"currentColor","stroke-width":"1.5"},null,-1),e.createElementVNode("rect",{x:"25",y:"4",width:"19",height:"19",stroke:"currentColor","stroke-width":"1.5"},null,-1),e.createElementVNode("rect",{x:"4",y:"25",width:"19",height:"19",stroke:"currentColor","stroke-width":"1.5"},null,-1),e.createElementVNode("rect",{x:"25",y:"25",width:"19",height:"19",stroke:"currentColor","stroke-width":"1.5"},null,-1)])])):i.type==="6"?(e.openBlock(),e.createElementBlock("svg",re,[...o[4]||(o[4]=[e.createStaticVNode('<rect x="3" y="4" width="13" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="4" width="12" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="4" width="13" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="3" y="24" width="13" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="24" width="12" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="24" width="13" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect>',6)])])):i.type==="7"?(e.openBlock(),e.createElementBlock("svg",ae,[...o[5]||(o[5]=[e.createStaticVNode('<rect x="4" y="4" width="19" height="19" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="25" y="4" width="19" height="19" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="4" y="25" width="19" height="19" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="25" y="25" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="35" y="25" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="25" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="35" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>',7)])])):i.type==="8"?(e.openBlock(),e.createElementBlock("svg",le,[...o[6]||(o[6]=[e.createStaticVNode('<rect x="4" y="4" width="28" height="29" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="34" y="4" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="14.5" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="24.5" width="10" height="8.5" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="14" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="24" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="35" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>',8)])])):i.type==="9"?(e.openBlock(),e.createElementBlock("svg",ne,[...o[7]||(o[7]=[e.createStaticVNode('<rect x="4" y="4" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="4" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="4" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="4" y="18" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="18" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="18" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="4" y="32" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="32" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="32" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect>',9)])])):i.type==="10"?(e.openBlock(),e.createElementBlock("svg",ce,[...o[8]||(o[8]=[e.createStaticVNode('<rect x="3" y="4" width="36" height="29" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="41" y="4" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="41" y="14.5" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="41" y="24.5" width="10" height="8.5" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="3" y="35" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="11" y="35" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="19" y="35" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="27" y="35" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="35" y="35" width="6" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="42" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>',10)])])):i.type==="13"?(e.openBlock(),e.createElementBlock("svg",ie,[...o[9]||(o[9]=[e.createStaticVNode('<rect x="4" y="4" width="18" height="18" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="24" y="4" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="4" width="10" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="24" y="14" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="14" width="10" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="24" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="14" y="24" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="24" y="24" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="24" width="10" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="34" width="8" height="10" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="14" y="34" width="8" height="10" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="24" y="34" width="8" height="10" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="34" width="10" height="10" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>',13)])])):i.type==="16"?(e.openBlock(),e.createElementBlock("svg",de,[...o[10]||(o[10]=[e.createStaticVNode('<rect x="4" y="4" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="15" y="4" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="26" y="4" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="37" y="4" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="15" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="15" y="15" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="26" y="15" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="37" y="15" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="26" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="15" y="26" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="26" y="26" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="37" y="26" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="37" width="9" height="7" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="15" y="37" width="9" height="7" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="26" y="37" width="9" height="7" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="37" y="37" width="7" height="7" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>',16)])])):e.createCommentVNode("",!0)]))}}),O=(i,v)=>{const o=i.__vccOpts||i;for(const[g,w]of v)o[g]=w;return o},$=O(se,[["__scopeId","data-v-31e0404d"]]),he={key:0,class:"layout-toolbar",role:"toolbar","aria-label":"布局切换工具栏"},we={class:"layout-buttons"},ue=["onClick","title","aria-label","aria-pressed"],pe={class:"layout-label"},ve={class:"video-grid-container",role:"region","aria-label":"视频网格"},ye=["aria-label","onDragstart","onDragenter","onDragleave","onDrop"],ke={class:"video-placeholder"},ge={class:"placeholder-number"},Se=.5,me="grabbing",fe="0.8",Ce=e.defineComponent({__name:"VideoGridLayout",props:{videos:{},layout:{default:"1"},availableLayouts:{},showToolbar:{type:Boolean,default:!0},width:{},height:{},placeholderText:{},placeholders:{}},emits:["layoutChange","videosChange"],setup(i,{emit:v}){const o=i,g=v,w=e.ref(o.layout);e.watch(()=>o.layout,t=>{w.value=t});const P=e.computed(()=>o.availableLayouts&&o.availableLayouts.length>0?o.availableLayouts:M()),p=e.shallowRef([]);function E(t){const r=Array.isArray(t)?t:o.videos||[],l=V.value,a={};p.value.forEach((s,h)=>{s&&s.id!==void 0&&(a[s.id]=s.__labelNumber??h+1)});const c=Array.from({length:l}).map((s,h)=>{const n=r[h];if(n){const k=a[n.id]??n.__labelNumber??h+1;return{...n,__labelNumber:k}}});p.value=c}e.watch(()=>o.videos,t=>{if(!Array.isArray(t)){console.warn("[VideoGridLayout] Invalid videos prop, expected array");return}E(t)},{flush:"post"});let A=!1;e.watch(p,t=>{!A&&Array.isArray(t)&&g("videosChange",t)});const _=e.computed(()=>{const t=y[w.value];return t||(console.warn(`[VideoGridLayout] Invalid layout type: ${w.value}, fallback to '4'`),y[4])}),S=e.computed(()=>G(w.value)),V=e.computed(()=>{var t;return((t=_.value)==null?void 0:t.count)||4}),x=e.computed(()=>p.value.slice(0,V.value).map(t=>t).filter(Boolean));E(o.videos),e.watch(V,()=>{E(o.videos)});const T=e.computed(()=>{const t=S.value.map((r,l)=>({p:r,idx:l}));return t.sort((r,l)=>r.p.row===l.p.row?(r.p.col||0)-(l.p.col||0):(r.p.row||0)-(l.p.row||0)),t.map(r=>r.idx)}),u=e.ref(-1),m=e.ref(-1),b=e.shallowRef(null),d=e.shallowRef(null);let f=null,C=null;const z=e.computed(()=>{const t=_.value;return{display:"grid",gridTemplateColumns:(t==null?void 0:t.colTemplate)||`repeat(${(t==null?void 0:t.cols)||2}, 1fr)`,gridTemplateRows:(t==null?void 0:t.rowTemplate)||`repeat(${(t==null?void 0:t.rows)||2}, 1fr)`,gap:"4px",width:o.width||"100%",height:o.height||"100%"}}),F=e.computed(()=>({width:o.width||"100%",height:o.height||"100%"}));function Y(t){const r=t,l=T.value[r];if(Array.isArray(o.placeholders)&&o.placeholders[l]!==void 0)return String(o.placeholders[l]);if(typeof o.placeholderText=="function")try{return o.placeholderText(r)}catch{return String(r+1)}return o.placeholderText?String(o.placeholderText):String(r+1)}function H(t){const r=S.value[t];return!r||typeof r.col!="number"||typeof r.row!="number"?{}:{gridColumn:`${r.col} / span ${r.colSpan}`,gridRow:`${r.row} / span ${r.rowSpan}`}}function U(t){const r=S.value[t];return(r==null?void 0:r.isMain)||!1}function j(t){w.value=t,g("layoutChange",w.value)}function B(){if(b.value&&document.body.contains(b.value)){try{document.body.removeChild(b.value)}catch(t){console.warn("[VideoGridLayout] Failed to cleanup drag image:",t)}b.value=null}if(d.value&&document.body.contains(d.value)){try{document.body.removeChild(d.value)}catch{}d.value=null}f&&(document.removeEventListener("mousemove",f),f=null),C&&(document.removeEventListener("drag",C),C=null)}function q(t,r){if(r<0||r>=p.value.length){console.warn("[VideoGridLayout] Invalid drag index:",r);return}if(u.value=r,!t.dataTransfer)return;t.dataTransfer.effectAllowed="move";const a=t.target.closest(".video-item");if(a)try{if(B(),t.dataTransfer){t.dataTransfer.effectAllowed="move";const n=new Image;n.src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",t.dataTransfer.setDragImage(n,0,0)}const c=a.cloneNode(!0);c.querySelectorAll(".progress-bar, .play-button").forEach(n=>n.remove()),c.querySelectorAll('[style*="transition"], [style*="animation"], .video-icon').forEach(n=>{try{n.style.transition="none",n.style.animation="none"}catch{}}),c.style.position="fixed",c.style.margin="0",c.style.pointerEvents="none",c.style.opacity=fe,c.style.zIndex="9999",document.body.appendChild(c),d.value=c;try{const n=a.getBoundingClientRect();c.style.width=`${n.width}px`,c.style.height=`${n.height}px`}catch{}f=n=>{if(!d.value)return;const k=d.value.offsetWidth||0,L=d.value.offsetHeight||0,N=Math.max(0,n.clientX-k/2),D=Math.max(0,n.clientY-L/2);d.value.style.left=`${N}px`,d.value.style.top=`${D}px`},document.addEventListener("mousemove",f),C=n=>{if(!d.value)return;const k=d.value.offsetWidth||0,L=d.value.offsetHeight||0,N=Math.max(0,(n.clientX||0)-k/2),D=Math.max(0,(n.clientY||0)-L/2);d.value.style.left=`${N}px`,d.value.style.top=`${D}px`},document.addEventListener("drag",C),a.style.opacity=String(Se),a.style.cursor=me,a.style.borderColor="#ff6b6b"}catch(c){console.error("[VideoGridLayout] Drag start error:",c),B()}}function W(t,r){t.preventDefault(),t.stopPropagation();const l=u.value;if(l===-1||l===r){u.value=-1;return}if(r<0||r>=S.value.length){console.warn("[VideoGridLayout] Invalid drop index:",r),u.value=-1;return}try{const a=t.currentTarget;a&&(a.style.backgroundColor="rgba(66, 184, 131, 0.3)",a.style.borderColor="#42b883",setTimeout(()=>{a.style.backgroundColor="",a.style.borderColor=""},200));const c=[...p.value],s=c[l],h=c[r];c[l]=h,c[r]=s,A=!0,p.value=c,setTimeout(()=>{A=!1,g("videosChange",p.value.filter(Boolean))},0)}catch(a){console.error("[VideoGridLayout] Drop error:",a)}finally{u.value=-1}}function X(t,r){t.preventDefault(),u.value!==-1&&u.value!==r&&(m.value=r)}function Q(t,r){t.preventDefault();const l=t.target,a=t.relatedTarget;l.contains(a)||m.value===r&&(m.value=-1)}function J(t){const l=t.target.closest(".video-item");l&&(l.style.opacity="1",l.style.cursor="move",l.style.borderColor=""),B(),u.value=-1,m.value=-1}return e.onBeforeUnmount(()=>{B()}),(t,r)=>(e.openBlock(),e.createElementBlock("div",{class:"video-grid-layout",role:"application","aria-label":"视频分屏布局",style:e.normalizeStyle(F.value)},[i.showToolbar?(e.openBlock(),e.createElementBlock("div",he,[r[1]||(r[1]=e.createElementVNode("div",{class:"toolbar-title"},"分屏布局",-1)),e.createElementVNode("div",we,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(P.value,l=>{var a,c,s;return e.openBlock(),e.createElementBlock("button",{key:l,class:e.normalizeClass(["layout-btn",{active:w.value===l}]),onClick:h=>j(l),title:((a=e.unref(y)[l])==null?void 0:a.label)||"","aria-label":`切换到${((c=e.unref(y)[l])==null?void 0:c.label)||""}布局`,"aria-pressed":w.value===l,type:"button"},[e.createVNode($,{type:l},null,8,["type"]),e.createElementVNode("span",pe,e.toDisplayString(((s=e.unref(y)[l])==null?void 0:s.label)||""),1)],10,ue)}),128))])])):e.createCommentVNode("",!0),e.createElementVNode("div",ve,[e.createElementVNode("div",{class:"video-grid",style:e.normalizeStyle(z.value)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(S.value,(l,a)=>{var c,s,h;return e.openBlock(),e.createElementBlock("div",{key:((c=x.value[a])==null?void 0:c.id)??a,class:e.normalizeClass(["video-item",{"main-video":U(a),dragging:u.value===a,"drag-over":m.value===a&&u.value!==a}]),style:e.normalizeStyle(H(a)),draggable:!0,"aria-label":`视频 ${a+1}: ${((s=x.value[a])==null?void 0:s.title)||((h=x.value[a])==null?void 0:h.id)||""}`,role:"article",tabindex:"0",onDragstart:n=>q(n,a),onDragover:r[0]||(r[0]=e.withModifiers(()=>{},["prevent"])),onDragenter:n=>X(n,a),onDragleave:n=>Q(n,a),onDrop:n=>W(n,a),onDragend:J},[e.renderSlot(t.$slots,"video",{video:x.value[a],index:a},()=>[e.createElementVNode("div",ke,[e.createElementVNode("div",ge,e.toDisplayString(Y(T.value.indexOf(a))),1)])],!0)],46,ye)}),128))],4)])],4))}}),R=O(Ce,[["__scopeId","data-v-f0958f8e"]]),xe={VideoGridLayout:R,VideoLayoutIcon:$},be={install(i){Object.entries(xe).forEach(([v,o])=>{i.component(v,o)})}};exports.LAYOUT_CONFIGS=y;exports.VideoGridLayout=R;exports.VideoLayoutIcon=$;exports.default=be;exports.getAllLayoutTypes=M;exports.getLayoutPositions=G;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),k={1:{type:"1",label:"1分屏",count:1,cols:1,rows:1},2:{type:"2",label:"2分屏",count:2,cols:2,rows:1},3:{type:"3",label:"3分屏",count:3,cols:2,rows:2},4:{type:"4",label:"4分屏",count:4,cols:2,rows:2},6:{type:"6",label:"6分屏",count:6,cols:3,rows:2},7:{type:"7",label:"7分屏",count:7,cols:4,rows:4},8:{type:"8",label:"8分屏",count:8,cols:4,rows:4},9:{type:"9",label:"9分屏",count:9,cols:3,rows:3},10:{type:"10",label:"10分屏",count:10,cols:6,rows:4},13:{type:"13",label:"13分屏",count:13,cols:4,rows:4},16:{type:"16",label:"16分屏",count:16,cols:4,rows:4}},B={};function L(n){if(B[n])return B[n];const o={1:[{col:1,colSpan:1,row:1,rowSpan:1}],2:[{col:1,colSpan:1,row:1,rowSpan:1},{col:2,colSpan:1,row:1,rowSpan:1}],3:[{col:1,colSpan:1,row:1,rowSpan:2,isMain:!0},{col:2,colSpan:1,row:1,rowSpan:1},{col:2,colSpan:1,row:2,rowSpan:1}],4:[{col:1,colSpan:1,row:1,rowSpan:1},{col:2,colSpan:1,row:1,rowSpan:1},{col:1,colSpan:1,row:2,rowSpan:1},{col:2,colSpan:1,row:2,rowSpan:1}],6:[{col:1,colSpan:1,row:1,rowSpan:1},{col:2,colSpan:1,row:1,rowSpan:1},{col:3,colSpan:1,row:1,rowSpan:1},{col:1,colSpan:1,row:2,rowSpan:1},{col:2,colSpan:1,row:2,rowSpan:1},{col:3,colSpan:1,row:2,rowSpan:1}],7:[{col:1,colSpan:2,row:1,rowSpan:2},{col:3,colSpan:2,row:1,rowSpan:2},{col:1,colSpan:2,row:3,rowSpan:2},{col:3,colSpan:1,row:3,rowSpan:1},{col:4,colSpan:1,row:3,rowSpan:1},{col:3,colSpan:1,row:4,rowSpan:1},{col:4,colSpan:1,row:4,rowSpan:1}],8:[{col:1,colSpan:3,row:1,rowSpan:3,isMain:!0},{col:4,colSpan:1,row:1,rowSpan:1},{col:4,colSpan:1,row:2,rowSpan:1},{col:4,colSpan:1,row:3,rowSpan:1},{col:1,colSpan:1,row:4,rowSpan:1},{col:2,colSpan:1,row:4,rowSpan:1},{col:3,colSpan:1,row:4,rowSpan:1},{col:4,colSpan:1,row:4,rowSpan:1}],9:[{col:1,colSpan:1,row:1,rowSpan:1},{col:2,colSpan:1,row:1,rowSpan:1},{col:3,colSpan:1,row:1,rowSpan:1},{col:1,colSpan:1,row:2,rowSpan:1},{col:2,colSpan:1,row:2,rowSpan:1},{col:3,colSpan:1,row:2,rowSpan:1},{col:1,colSpan:1,row:3,rowSpan:1},{col:2,colSpan:1,row:3,rowSpan:1},{col:3,colSpan:1,row:3,rowSpan:1}],10:[{col:1,colSpan:5,row:1,rowSpan:3,isMain:!0},{col:6,colSpan:1,row:1,rowSpan:1},{col:6,colSpan:1,row:2,rowSpan:1},{col:6,colSpan:1,row:3,rowSpan:1},{col:1,colSpan:1,row:4,rowSpan:1},{col:2,colSpan:1,row:4,rowSpan:1},{col:3,colSpan:1,row:4,rowSpan:1},{col:4,colSpan:1,row:4,rowSpan:1},{col:5,colSpan:1,row:4,rowSpan:1},{col:6,colSpan:1,row:4,rowSpan:1}],13:[{col:1,colSpan:2,row:1,rowSpan:2,isMain:!0},{col:3,colSpan:1,row:1,rowSpan:1},{col:4,colSpan:1,row:1,rowSpan:1},{col:3,colSpan:1,row:2,rowSpan:1},{col:4,colSpan:1,row:2,rowSpan:1},{col:1,colSpan:1,row:3,rowSpan:1},{col:2,colSpan:1,row:3,rowSpan:1},{col:3,colSpan:1,row:3,rowSpan:1},{col:4,colSpan:1,row:3,rowSpan:1},{col:1,colSpan:1,row:4,rowSpan:1},{col:2,colSpan:1,row:4,rowSpan:1},{col:3,colSpan:1,row:4,rowSpan:1},{col:4,colSpan:1,row:4,rowSpan:1}],16:[{col:1,colSpan:1,row:1,rowSpan:1},{col:2,colSpan:1,row:1,rowSpan:1},{col:3,colSpan:1,row:1,rowSpan:1},{col:4,colSpan:1,row:1,rowSpan:1},{col:1,colSpan:1,row:2,rowSpan:1},{col:2,colSpan:1,row:2,rowSpan:1},{col:3,colSpan:1,row:2,rowSpan:1},{col:4,colSpan:1,row:2,rowSpan:1},{col:1,colSpan:1,row:3,rowSpan:1},{col:2,colSpan:1,row:3,rowSpan:1},{col:3,colSpan:1,row:3,rowSpan:1},{col:4,colSpan:1,row:3,rowSpan:1},{col:1,colSpan:1,row:4,rowSpan:1},{col:2,colSpan:1,row:4,rowSpan:1},{col:3,colSpan:1,row:4,rowSpan:1},{col:4,colSpan:1,row:4,rowSpan:1}]}[n]||[];return o.length>0&&(B[n]=o),o}function D(){return Object.keys(k)}const H={class:"layout-icon"},W={key:0,viewBox:"0 0 48 48",fill:"none"},q={key:1,viewBox:"0 0 48 48",fill:"none"},J={key:2,viewBox:"0 0 48 48",fill:"none"},K={key:3,viewBox:"0 0 48 48",fill:"none"},Q={key:4,viewBox:"0 0 48 48",fill:"none"},X={key:5,viewBox:"0 0 48 48",fill:"none"},Z={key:6,viewBox:"0 0 48 48",fill:"none"},ee={key:7,viewBox:"0 0 48 48",fill:"none"},te={key:8,viewBox:"0 0 54 48",fill:"none"},oe={key:9,viewBox:"0 0 48 48",fill:"none"},re={key:10,viewBox:"0 0 48 48",fill:"none"},ae=e.defineComponent({__name:"VideoLayoutIcon",props:{type:{}},setup(n){return(p,o)=>(e.openBlock(),e.createElementBlock("div",H,[n.type==="1"?(e.openBlock(),e.createElementBlock("svg",W,[...o[0]||(o[0]=[e.createElementVNode("rect",{x:"4",y:"4",width:"40",height:"40",stroke:"currentColor","stroke-width":"2"},null,-1)])])):n.type==="2"?(e.openBlock(),e.createElementBlock("svg",q,[...o[1]||(o[1]=[e.createElementVNode("rect",{x:"4",y:"4",width:"19",height:"40",stroke:"currentColor","stroke-width":"1.5"},null,-1),e.createElementVNode("rect",{x:"25",y:"4",width:"19",height:"40",stroke:"currentColor","stroke-width":"1.5"},null,-1)])])):n.type==="3"?(e.openBlock(),e.createElementBlock("svg",J,[...o[2]||(o[2]=[e.createElementVNode("rect",{x:"4",y:"4",width:"20",height:"40",stroke:"currentColor","stroke-width":"2"},null,-1),e.createElementVNode("rect",{x:"26",y:"4",width:"18",height:"19",stroke:"currentColor","stroke-width":"1.5"},null,-1),e.createElementVNode("rect",{x:"26",y:"25",width:"18",height:"19",stroke:"currentColor","stroke-width":"1.5"},null,-1)])])):n.type==="4"?(e.openBlock(),e.createElementBlock("svg",K,[...o[3]||(o[3]=[e.createElementVNode("rect",{x:"4",y:"4",width:"19",height:"19",stroke:"currentColor","stroke-width":"1.5"},null,-1),e.createElementVNode("rect",{x:"25",y:"4",width:"19",height:"19",stroke:"currentColor","stroke-width":"1.5"},null,-1),e.createElementVNode("rect",{x:"4",y:"25",width:"19",height:"19",stroke:"currentColor","stroke-width":"1.5"},null,-1),e.createElementVNode("rect",{x:"25",y:"25",width:"19",height:"19",stroke:"currentColor","stroke-width":"1.5"},null,-1)])])):n.type==="6"?(e.openBlock(),e.createElementBlock("svg",Q,[...o[4]||(o[4]=[e.createStaticVNode('<rect x="3" y="4" width="13" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="4" width="12" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="4" width="13" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="3" y="24" width="13" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="24" width="12" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="24" width="13" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect>',6)])])):n.type==="7"?(e.openBlock(),e.createElementBlock("svg",X,[...o[5]||(o[5]=[e.createStaticVNode('<rect x="4" y="4" width="19" height="19" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="25" y="4" width="19" height="19" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="4" y="25" width="19" height="19" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="25" y="25" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="35" y="25" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="25" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="35" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>',7)])])):n.type==="8"?(e.openBlock(),e.createElementBlock("svg",Z,[...o[6]||(o[6]=[e.createStaticVNode('<rect x="4" y="4" width="28" height="29" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="34" y="4" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="14.5" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="24.5" width="10" height="8.5" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="14" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="24" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="35" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>',8)])])):n.type==="9"?(e.openBlock(),e.createElementBlock("svg",ee,[...o[7]||(o[7]=[e.createStaticVNode('<rect x="4" y="4" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="4" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="4" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="4" y="18" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="18" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="18" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="4" y="32" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="32" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="32" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect>',9)])])):n.type==="10"?(e.openBlock(),e.createElementBlock("svg",te,[...o[8]||(o[8]=[e.createStaticVNode('<rect x="3" y="4" width="36" height="29" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="41" y="4" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="41" y="14.5" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="41" y="24.5" width="10" height="8.5" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="3" y="35" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="11" y="35" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="19" y="35" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="27" y="35" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="35" y="35" width="6" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="42" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>',10)])])):n.type==="13"?(e.openBlock(),e.createElementBlock("svg",oe,[...o[9]||(o[9]=[e.createStaticVNode('<rect x="4" y="4" width="18" height="18" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="24" y="4" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="4" width="10" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="24" y="14" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="14" width="10" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="24" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="14" y="24" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="24" y="24" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="24" width="10" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="34" width="8" height="10" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="14" y="34" width="8" height="10" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="24" y="34" width="8" height="10" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="34" width="10" height="10" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>',13)])])):n.type==="16"?(e.openBlock(),e.createElementBlock("svg",re,[...o[10]||(o[10]=[e.createStaticVNode('<rect x="4" y="4" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="15" y="4" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="26" y="4" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="37" y="4" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="15" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="15" y="15" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="26" y="15" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="37" y="15" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="26" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="15" y="26" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="26" y="26" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="37" y="26" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="37" width="9" height="7" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="15" y="37" width="9" height="7" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="26" y="37" width="9" height="7" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="37" y="37" width="7" height="7" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>',16)])])):e.createCommentVNode("",!0)]))}}),_=(n,p)=>{const o=n.__vccOpts||n;for(const[v,s]of p)o[v]=s;return o},E=_(ae,[["__scopeId","data-v-31e0404d"]]),le={key:0,class:"layout-toolbar",role:"toolbar","aria-label":"布局切换工具栏"},ce={class:"layout-buttons"},ne=["onClick","title","aria-label","aria-pressed"],ie={class:"layout-label"},de={class:"video-grid-container",role:"region","aria-label":"视频网格"},se=["aria-label","onDragstart","onDragenter","onDragleave","onDrop"],he={class:"video-placeholder"},we={class:"placeholder-number"},ue=.5,pe="grabbing",ke="0.8",ve=e.defineComponent({__name:"VideoGridLayout",props:{videos:{},layout:{default:"1"},availableLayouts:{},showToolbar:{type:Boolean,default:!0},width:{},height:{},placeholderText:{},placeholders:{}},emits:["layoutChange","videosChange"],setup(n,{emit:p}){const o=n,v=p,s=e.ref(o.layout);e.watch(()=>o.layout,t=>{s.value=t});const $=e.computed(()=>o.availableLayouts&&o.availableLayouts.length>0?o.availableLayouts:D()),u=e.shallowRef([]);function f(t){const r=Array.isArray(t)?t:o.videos||[],l=b.value,a={};u.value.forEach((i,w)=>{i&&i.id!==void 0&&(a[i.id]=i.__labelNumber??w+1)});const c=Array.from({length:l}).map((i,w)=>{const d=r[w];if(d){const j=a[d.id]??d.__labelNumber??w+1;return{...d,__labelNumber:j}}});u.value=c}e.watch(()=>o.videos,t=>{if(!Array.isArray(t)){console.warn("[VideoGridLayout] Invalid videos prop, expected array");return}f(t)},{flush:"post"});let x=!1;e.watch(u,t=>{!x&&Array.isArray(t)&&v("videosChange",t)});const V=e.computed(()=>{const t=k[s.value];return t||(console.warn(`[VideoGridLayout] Invalid layout type: ${s.value}, fallback to '4'`),k[4])}),y=e.computed(()=>L(s.value)),b=e.computed(()=>{var t;return((t=V.value)==null?void 0:t.count)||4}),C=e.computed(()=>u.value.slice(0,b.value).map(t=>t).filter(Boolean));f(o.videos),e.watch(b,()=>{f(o.videos)});const N=e.computed(()=>{const t=y.value.map((r,l)=>({p:r,idx:l}));return t.sort((r,l)=>r.p.row===l.p.row?(r.p.col||0)-(l.p.col||0):(r.p.row||0)-(l.p.row||0)),t.map(r=>r.idx)}),h=e.ref(-1),S=e.ref(-1),g=e.shallowRef(null),A=e.computed(()=>{const t=V.value;return{display:"grid",gridTemplateColumns:(t==null?void 0:t.colTemplate)||`repeat(${(t==null?void 0:t.cols)||2}, 1fr)`,gridTemplateRows:(t==null?void 0:t.rowTemplate)||`repeat(${(t==null?void 0:t.rows)||2}, 1fr)`,gap:"4px",width:o.width||"100%",height:o.height||"100%"}}),T=e.computed(()=>({width:o.width||"100%",height:o.height||"100%"}));function G(t){const r=t,l=N.value[r];if(Array.isArray(o.placeholders)&&o.placeholders[l]!==void 0)return String(o.placeholders[l]);if(typeof o.placeholderText=="function")try{return o.placeholderText(r)}catch{return String(r+1)}return o.placeholderText?String(o.placeholderText):String(r+1)}function O(t){const r=y.value[t];return!r||typeof r.col!="number"||typeof r.row!="number"?{}:{gridColumn:`${r.col} / span ${r.colSpan}`,gridRow:`${r.row} / span ${r.rowSpan}`}}function M(t){const r=y.value[t];return(r==null?void 0:r.isMain)||!1}function R(t){s.value=t,v("layoutChange",s.value)}function m(){if(g.value&&document.body.contains(g.value)){try{document.body.removeChild(g.value)}catch(t){console.warn("[VideoGridLayout] Failed to cleanup drag image:",t)}g.value=null}}function P(t,r){if(r<0||r>=u.value.length){console.warn("[VideoGridLayout] Invalid drag index:",r);return}if(h.value=r,!t.dataTransfer)return;t.dataTransfer.effectAllowed="move";const a=t.target.closest(".video-item");if(a)try{m();const c=a.cloneNode(!0);c.style.width=`${a.offsetWidth}px`,c.style.height=`${a.offsetHeight}px`,c.style.opacity=ke,c.style.position="absolute",c.style.top="-9999px",c.style.pointerEvents="none",document.body.appendChild(c),g.value=c,t.dataTransfer.setDragImage(c,a.offsetWidth/2,a.offsetHeight/2),setTimeout(()=>{m()},100),a.style.opacity=String(ue),a.style.cursor=pe}catch(c){console.error("[VideoGridLayout] Drag start error:",c),m()}}function F(t,r){t.preventDefault(),t.stopPropagation();const l=h.value;if(l===-1||l===r){h.value=-1;return}if(r<0||r>=y.value.length){console.warn("[VideoGridLayout] Invalid drop index:",r),h.value=-1;return}try{const a=t.currentTarget;a&&(a.style.backgroundColor="rgba(66, 184, 131, 0.3)",a.style.borderColor="#42b883",setTimeout(()=>{a.style.backgroundColor="",a.style.borderColor=""},200));const c=[...u.value],i=c[l],w=c[r];c[l]=w,c[r]=i,x=!0,u.value=c,setTimeout(()=>{x=!1,v("videosChange",u.value.filter(Boolean))},0)}catch(a){console.error("[VideoGridLayout] Drop error:",a)}finally{h.value=-1}}function z(t,r){t.preventDefault(),h.value!==-1&&h.value!==r&&(S.value=r)}function U(t,r){t.preventDefault();const l=t.target,a=t.relatedTarget;l.contains(a)||S.value===r&&(S.value=-1)}function Y(t){const l=t.target.closest(".video-item");l&&(l.style.opacity="1",l.style.cursor="move"),m(),h.value=-1,S.value=-1}return e.onBeforeUnmount(()=>{m()}),(t,r)=>(e.openBlock(),e.createElementBlock("div",{class:"video-grid-layout",role:"application","aria-label":"视频分屏布局",style:e.normalizeStyle(T.value)},[n.showToolbar?(e.openBlock(),e.createElementBlock("div",le,[r[1]||(r[1]=e.createElementVNode("div",{class:"toolbar-title"},"分屏布局",-1)),e.createElementVNode("div",ce,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList($.value,l=>{var a,c,i;return e.openBlock(),e.createElementBlock("button",{key:l,class:e.normalizeClass(["layout-btn",{active:s.value===l}]),onClick:w=>R(l),title:((a=e.unref(k)[l])==null?void 0:a.label)||"","aria-label":`切换到${((c=e.unref(k)[l])==null?void 0:c.label)||""}布局`,"aria-pressed":s.value===l,type:"button"},[e.createVNode(E,{type:l},null,8,["type"]),e.createElementVNode("span",ie,e.toDisplayString(((i=e.unref(k)[l])==null?void 0:i.label)||""),1)],10,ne)}),128))])])):e.createCommentVNode("",!0),e.createElementVNode("div",de,[e.createElementVNode("div",{class:"video-grid",style:e.normalizeStyle(A.value)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(y.value,(l,a)=>{var c,i,w;return e.openBlock(),e.createElementBlock("div",{key:((c=C.value[a])==null?void 0:c.id)??a,class:e.normalizeClass(["video-item",{"main-video":M(a),dragging:h.value===a,"drag-over":S.value===a&&h.value!==a}]),style:e.normalizeStyle(O(a)),draggable:!0,"aria-label":`视频 ${a+1}: ${((i=C.value[a])==null?void 0:i.title)||((w=C.value[a])==null?void 0:w.id)||""}`,role:"article",tabindex:"0",onDragstart:d=>P(d,a),onDragover:r[0]||(r[0]=e.withModifiers(()=>{},["prevent"])),onDragenter:d=>z(d,a),onDragleave:d=>U(d,a),onDrop:d=>F(d,a),onDragend:Y},[e.renderSlot(t.$slots,"video",{video:C.value[a],index:a},()=>[e.createElementVNode("div",he,[e.createElementVNode("div",we,e.toDisplayString(G(N.value.indexOf(a))),1)])],!0)],46,se)}),128))],4)])],4))}}),I=_(ve,[["__scopeId","data-v-1b7d75db"]]),ye={VideoGridLayout:I,VideoLayoutIcon:E},Se={install(n){Object.entries(ye).forEach(([p,o])=>{n.component(p,o)})}};exports.LAYOUT_CONFIGS=k;exports.VideoGridLayout=I;exports.VideoLayoutIcon=E;exports.default=Se;exports.getAllLayoutTypes=D;exports.getLayoutPositions=L;

package/dist/index.mjs

@@ -1,5 +1,5 @@
-import { defineComponent as W, createElementBlock as i, openBlock as s, createCommentVNode as X, createElementVNode as d, createStaticVNode as S, ref as O, watch as I, computed as g, shallowRef as R, onBeforeUnmount as dt, normalizeStyle as N, Fragment as U, renderList as z, unref as P, normalizeClass as j, createVNode as ht, toDisplayString as q, withModifiers as wt, renderSlot as ut } from "vue";
-const C = {
+import { defineComponent as F, createElementBlock as c, openBlock as i, createCommentVNode as U, createElementVNode as d, createStaticVNode as g, ref as A, watch as L, computed as y, shallowRef as E, onBeforeUnmount as at, normalizeStyle as B, Fragment as N, renderList as M, unref as V, normalizeClass as R, createVNode as lt, toDisplayString as P, withModifiers as nt, renderSlot as ct } from "vue";
+const S = {
   1: {
     type: "1",
     label: "1分屏",
@@ -77,11 +77,11 @@ const C = {
     cols: 4,
     rows: 4
   }
-}, H = {};
-function pt(c) {
-  if (H[c])
-    return H[c];
-  const e = {
+}, T = {};
+function it(n) {
+  if (T[n])
+    return T[n];
+  const o = {
     1: [
       { col: 1, colSpan: 1, row: 1, rowSpan: 1 }
     ],
@@ -183,64 +183,64 @@ function pt(c) {
       { col: 3, colSpan: 1, row: 4, rowSpan: 1 },
       { col: 4, colSpan: 1, row: 4, rowSpan: 1 }
     ]
-  }[c] || [];
-  return e.length > 0 && (H[c] = e), e;
+  }[n] || [];
+  return o.length > 0 && (T[n] = o), o;
 }
-function vt() {
-  return Object.keys(C);
+function dt() {
+  return Object.keys(S);
 }
-const yt = { class: "layout-icon" }, gt = {
+const st = { class: "layout-icon" }, ht = {
   key: 0,
   viewBox: "0 0 48 48",
   fill: "none"
-}, kt = {
+}, wt = {
   key: 1,
   viewBox: "0 0 48 48",
   fill: "none"
-}, St = {
+}, ut = {
   key: 2,
   viewBox: "0 0 48 48",
   fill: "none"
-}, ft = {
+}, pt = {
   key: 3,
   viewBox: "0 0 48 48",
   fill: "none"
-}, Ct = {
+}, vt = {
   key: 4,
   viewBox: "0 0 48 48",
   fill: "none"
-}, xt = {
+}, yt = {
   key: 5,
   viewBox: "0 0 48 48",
   fill: "none"
-}, mt = {
+}, kt = {
   key: 6,
   viewBox: "0 0 48 48",
   fill: "none"
-}, bt = {
+}, gt = {
   key: 7,
   viewBox: "0 0 48 48",
   fill: "none"
-}, At = {
+}, St = {
   key: 8,
   viewBox: "0 0 54 48",
   fill: "none"
-}, Lt = {
+}, Ct = {
   key: 9,
   viewBox: "0 0 48 48",
   fill: "none"
-}, Dt = {
+}, ft = {
   key: 10,
   viewBox: "0 0 48 48",
   fill: "none"
-}, $t = /* @__PURE__ */ W({
+}, xt = /* @__PURE__ */ F({
   __name: "VideoLayoutIcon",
   props: {
     type: {}
   },
-  setup(c) {
-    return (k, e) => (s(), i("div", yt, [
-      c.type === "1" ? (s(), i("svg", gt, [...e[0] || (e[0] = [
+  setup(n) {
+    return (k, o) => (i(), c("div", st, [
+      n.type === "1" ? (i(), c("svg", ht, [...o[0] || (o[0] = [
         d("rect", {
           x: "4",
           y: "4",
@@ -249,7 +249,7 @@ const yt = { class: "layout-icon" }, gt = {
           stroke: "currentColor",
           "stroke-width": "2"
         }, null, -1)
-      ])])) : c.type === "2" ? (s(), i("svg", kt, [...e[1] || (e[1] = [
+      ])])) : n.type === "2" ? (i(), c("svg", wt, [...o[1] || (o[1] = [
         d("rect", {
           x: "4",
           y: "4",
@@ -266,7 +266,7 @@ const yt = { class: "layout-icon" }, gt = {
           stroke: "currentColor",
           "stroke-width": "1.5"
         }, null, -1)
-      ])])) : c.type === "3" ? (s(), i("svg", St, [...e[2] || (e[2] = [
+      ])])) : n.type === "3" ? (i(), c("svg", ut, [...o[2] || (o[2] = [
         d("rect", {
           x: "4",
           y: "4",
@@ -291,7 +291,7 @@ const yt = { class: "layout-icon" }, gt = {
           stroke: "currentColor",
           "stroke-width": "1.5"
         }, null, -1)
-      ])])) : c.type === "4" ? (s(), i("svg", ft, [...e[3] || (e[3] = [
+      ])])) : n.type === "4" ? (i(), c("svg", pt, [...o[3] || (o[3] = [
         d("rect", {
           x: "4",
           y: "4",
@@ -324,38 +324,38 @@ const yt = { class: "layout-icon" }, gt = {
           stroke: "currentColor",
           "stroke-width": "1.5"
         }, null, -1)
-      ])])) : c.type === "6" ? (s(), i("svg", Ct, [...e[4] || (e[4] = [
-        S('<rect x="3" y="4" width="13" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="4" width="12" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="4" width="13" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="3" y="24" width="13" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="24" width="12" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="24" width="13" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect>', 6)
-      ])])) : c.type === "7" ? (s(), i("svg", xt, [...e[5] || (e[5] = [
-        S('<rect x="4" y="4" width="19" height="19" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="25" y="4" width="19" height="19" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="4" y="25" width="19" height="19" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="25" y="25" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="35" y="25" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="25" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="35" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>', 7)
-      ])])) : c.type === "8" ? (s(), i("svg", mt, [...e[6] || (e[6] = [
-        S('<rect x="4" y="4" width="28" height="29" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="34" y="4" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="14.5" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="24.5" width="10" height="8.5" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="14" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="24" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="35" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>', 8)
-      ])])) : c.type === "9" ? (s(), i("svg", bt, [...e[7] || (e[7] = [
-        S('<rect x="4" y="4" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="4" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="4" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="4" y="18" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="18" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="18" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="4" y="32" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="32" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="32" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect>', 9)
-      ])])) : c.type === "10" ? (s(), i("svg", At, [...e[8] || (e[8] = [
-        S('<rect x="3" y="4" width="36" height="29" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="41" y="4" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="41" y="14.5" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="41" y="24.5" width="10" height="8.5" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="3" y="35" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="11" y="35" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="19" y="35" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="27" y="35" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="35" y="35" width="6" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="42" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>', 10)
-      ])])) : c.type === "13" ? (s(), i("svg", Lt, [...e[9] || (e[9] = [
-        S('<rect x="4" y="4" width="18" height="18" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="24" y="4" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="4" width="10" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="24" y="14" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="14" width="10" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="24" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="14" y="24" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="24" y="24" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="24" width="10" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="34" width="8" height="10" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="14" y="34" width="8" height="10" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="24" y="34" width="8" height="10" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="34" width="10" height="10" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>', 13)
-      ])])) : c.type === "16" ? (s(), i("svg", Dt, [...e[10] || (e[10] = [
-        S('<rect x="4" y="4" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="15" y="4" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="26" y="4" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="37" y="4" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="15" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="15" y="15" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="26" y="15" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="37" y="15" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="26" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="15" y="26" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="26" y="26" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="37" y="26" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="37" width="9" height="7" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="15" y="37" width="9" height="7" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="26" y="37" width="9" height="7" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="37" y="37" width="7" height="7" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>', 16)
-      ])])) : X("", !0)
+      ])])) : n.type === "6" ? (i(), c("svg", vt, [...o[4] || (o[4] = [
+        g('<rect x="3" y="4" width="13" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="4" width="12" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="4" width="13" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="3" y="24" width="13" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="24" width="12" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="24" width="13" height="18" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect>', 6)
+      ])])) : n.type === "7" ? (i(), c("svg", yt, [...o[5] || (o[5] = [
+        g('<rect x="4" y="4" width="19" height="19" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="25" y="4" width="19" height="19" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="4" y="25" width="19" height="19" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="25" y="25" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="35" y="25" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="25" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="35" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>', 7)
+      ])])) : n.type === "8" ? (i(), c("svg", kt, [...o[6] || (o[6] = [
+        g('<rect x="4" y="4" width="28" height="29" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="34" y="4" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="14.5" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="24.5" width="10" height="8.5" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="14" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="24" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="35" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>', 8)
+      ])])) : n.type === "9" ? (i(), c("svg", gt, [...o[7] || (o[7] = [
+        g('<rect x="4" y="4" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="4" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="4" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="4" y="18" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="18" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="18" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="4" y="32" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="18" y="32" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect><rect x="32" y="32" width="12" height="12" stroke="currentColor" stroke-width="1.5" data-v-31e0404d></rect>', 9)
+      ])])) : n.type === "10" ? (i(), c("svg", St, [...o[8] || (o[8] = [
+        g('<rect x="3" y="4" width="36" height="29" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="41" y="4" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="41" y="14.5" width="10" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="41" y="24.5" width="10" height="8.5" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="3" y="35" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="11" y="35" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="19" y="35" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="27" y="35" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="35" y="35" width="6" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="42" y="35" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>', 10)
+      ])])) : n.type === "13" ? (i(), c("svg", Ct, [...o[9] || (o[9] = [
+        g('<rect x="4" y="4" width="18" height="18" stroke="currentColor" stroke-width="2" data-v-31e0404d></rect><rect x="24" y="4" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="4" width="10" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="24" y="14" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="14" width="10" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="24" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="14" y="24" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="24" y="24" width="8" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="24" width="10" height="8" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="34" width="8" height="10" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="14" y="34" width="8" height="10" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="24" y="34" width="8" height="10" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="34" y="34" width="10" height="10" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>', 13)
+      ])])) : n.type === "16" ? (i(), c("svg", ft, [...o[10] || (o[10] = [
+        g('<rect x="4" y="4" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="15" y="4" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="26" y="4" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="37" y="4" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="15" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="15" y="15" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="26" y="15" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="37" y="15" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="26" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="15" y="26" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="26" y="26" width="9" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="37" y="26" width="7" height="9" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="4" y="37" width="9" height="7" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="15" y="37" width="9" height="7" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="26" y="37" width="9" height="7" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect><rect x="37" y="37" width="7" height="7" stroke="currentColor" stroke-width="1.2" data-v-31e0404d></rect>', 16)
+      ])])) : U("", !0)
     ]));
   }
-}), Q = (c, k) => {
-  const e = c.__vccOpts || c;
-  for (const [x, p] of k)
-    e[x] = p;
-  return e;
-}, J = /* @__PURE__ */ Q($t, [["__scopeId", "data-v-31e0404d"]]), Bt = {
+}), Y = (n, k) => {
+  const o = n.__vccOpts || n;
+  for (const [C, w] of k)
+    o[C] = w;
+  return o;
+}, j = /* @__PURE__ */ Y(xt, [["__scopeId", "data-v-31e0404d"]]), mt = {
   key: 0,
   class: "layout-toolbar",
   role: "toolbar",
   "aria-label": "布局切换工具栏"
-}, It = { class: "layout-buttons" }, _t = ["onClick", "title", "aria-label", "aria-pressed"], Et = { class: "layout-label" }, Vt = {
+}, bt = { class: "layout-buttons" }, Dt = ["onClick", "title", "aria-label", "aria-pressed"], Lt = { class: "layout-label" }, _t = {
   class: "video-grid-container",
   role: "region",
   "aria-label": "视频网格"
-}, Tt = ["aria-label", "onDragstart", "onDragenter", "onDragleave", "onDrop"], Gt = { class: "video-placeholder" }, Mt = { class: "placeholder-number" }, Ot = 0.5, Rt = "grabbing", Nt = "0.8", Pt = /* @__PURE__ */ W({
+}, $t = ["aria-label", "onDragstart", "onDragenter", "onDragleave", "onDrop"], It = { class: "video-placeholder" }, At = { class: "placeholder-number" }, Bt = 0.5, Vt = "grabbing", Tt = "0.8", Gt = /* @__PURE__ */ F({
   __name: "VideoGridLayout",
   props: {
     videos: {},
@@ -368,159 +368,128 @@ const yt = { class: "layout-icon" }, gt = {
     placeholders: {}
   },
   emits: ["layoutChange", "videosChange"],
-  setup(c, { emit: k }) {
-    const e = c, x = k, p = O(e.layout);
-    I(() => e.layout, (t) => {
-      p.value = t;
+  setup(n, { emit: k }) {
+    const o = n, C = k, w = A(o.layout);
+    L(() => o.layout, (t) => {
+      w.value = t;
     });
-    const K = g(() => e.availableLayouts && e.availableLayouts.length > 0 ? e.availableLayouts : vt()), y = R([]);
+    const z = y(() => o.availableLayouts && o.availableLayouts.length > 0 ? o.availableLayouts : dt()), v = E([]);
     function _(t) {
-      const o = Array.isArray(t) ? t : e.videos || [], a = V.value, r = {};
-      y.value.forEach((w, u) => {
-        w && w.id !== void 0 && (r[w.id] = w.__labelNumber ?? u + 1);
+      const e = Array.isArray(t) ? t : o.videos || [], a = I.value, r = {};
+      v.value.forEach((s, p) => {
+        s && s.id !== void 0 && (r[s.id] = s.__labelNumber ?? p + 1);
       });
-      const n = Array.from({ length: a }).map((w, u) => {
-        const l = o[u];
-        if (l) {
-          const f = r[l.id] ?? l.__labelNumber ?? u + 1;
-          return { ...l, __labelNumber: f };
+      const l = Array.from({ length: a }).map((s, p) => {
+        const h = e[p];
+        if (h) {
+          const rt = r[h.id] ?? h.__labelNumber ?? p + 1;
+          return { ...h, __labelNumber: rt };
         }
       });
-      y.value = n;
+      v.value = l;
     }
-    I(() => e.videos, (t) => {
+    L(() => o.videos, (t) => {
       if (!Array.isArray(t)) {
         console.warn("[VideoGridLayout] Invalid videos prop, expected array");
         return;
       }
       _(t);
     }, { flush: "post" });
-    let E = !1;
-    I(y, (t) => {
-      !E && Array.isArray(t) && x("videosChange", t);
+    let $ = !1;
+    L(v, (t) => {
+      !$ && Array.isArray(t) && C("videosChange", t);
     });
-    const Y = g(() => {
-      const t = C[p.value];
-      return t || (console.warn(`[VideoGridLayout] Invalid layout type: ${p.value}, fallback to '4'`), C[4]);
-    }), m = g(() => pt(p.value)), V = g(() => {
+    const G = y(() => {
+      const t = S[w.value];
+      return t || (console.warn(`[VideoGridLayout] Invalid layout type: ${w.value}, fallback to '4'`), S[4]);
+    }), f = y(() => it(w.value)), I = y(() => {
       var t;
-      return ((t = Y.value) == null ? void 0 : t.count) || 4;
-    }), D = g(() => y.value.slice(0, V.value).map((t) => t).filter(Boolean));
-    _(e.videos), I(V, () => {
-      _(e.videos);
+      return ((t = G.value) == null ? void 0 : t.count) || 4;
+    }), D = y(() => v.value.slice(0, I.value).map((t) => t).filter(Boolean));
+    _(o.videos), L(I, () => {
+      _(o.videos);
     });
-    const F = g(() => {
-      const t = m.value.map((o, a) => ({ p: o, idx: a }));
-      return t.sort((o, a) => o.p.row === a.p.row ? (o.p.col || 0) - (a.p.col || 0) : (o.p.row || 0) - (a.p.row || 0)), t.map((o) => o.idx);
-    }), v = O(-1), b = O(-1), $ = R(null), h = R(null);
-    let A = null, L = null;
-    const Z = g(() => {
-      const t = Y.value;
+    const O = y(() => {
+      const t = f.value.map((e, a) => ({ p: e, idx: a }));
+      return t.sort((e, a) => e.p.row === a.p.row ? (e.p.col || 0) - (a.p.col || 0) : (e.p.row || 0) - (a.p.row || 0)), t.map((e) => e.idx);
+    }), u = A(-1), x = A(-1), m = E(null), H = y(() => {
+      const t = G.value;
       return {
         display: "grid",
         gridTemplateColumns: (t == null ? void 0 : t.colTemplate) || `repeat(${(t == null ? void 0 : t.cols) || 2}, 1fr)`,
         gridTemplateRows: (t == null ? void 0 : t.rowTemplate) || `repeat(${(t == null ? void 0 : t.rows) || 2}, 1fr)`,
         gap: "4px",
-        width: e.width || "100%",
-        height: e.height || "100%"
+        width: o.width || "100%",
+        height: o.height || "100%"
       };
-    }), tt = g(() => ({
-      width: e.width || "100%",
-      height: e.height || "100%"
+    }), W = y(() => ({
+      width: o.width || "100%",
+      height: o.height || "100%"
     }));
-    function et(t) {
-      const o = t, a = F.value[o];
-      if (Array.isArray(e.placeholders) && e.placeholders[a] !== void 0)
-        return String(e.placeholders[a]);
-      if (typeof e.placeholderText == "function")
+    function q(t) {
+      const e = t, a = O.value[e];
+      if (Array.isArray(o.placeholders) && o.placeholders[a] !== void 0)
+        return String(o.placeholders[a]);
+      if (typeof o.placeholderText == "function")
         try {
-          return e.placeholderText(o);
+          return o.placeholderText(e);
         } catch {
-          return String(o + 1);
+          return String(e + 1);
         }
-      return e.placeholderText ? String(e.placeholderText) : String(o + 1);
+      return o.placeholderText ? String(o.placeholderText) : String(e + 1);
     }
-    function ot(t) {
-      const o = m.value[t];
-      return !o || typeof o.col != "number" || typeof o.row != "number" ? {} : {
-        gridColumn: `${o.col} / span ${o.colSpan}`,
-        gridRow: `${o.row} / span ${o.rowSpan}`
+    function J(t) {
+      const e = f.value[t];
+      return !e || typeof e.col != "number" || typeof e.row != "number" ? {} : {
+        gridColumn: `${e.col} / span ${e.colSpan}`,
+        gridRow: `${e.row} / span ${e.rowSpan}`
       };
     }
-    function rt(t) {
-      const o = m.value[t];
-      return (o == null ? void 0 : o.isMain) || !1;
+    function K(t) {
+      const e = f.value[t];
+      return (e == null ? void 0 : e.isMain) || !1;
     }
-    function at(t) {
-      p.value = t, x("layoutChange", p.value);
+    function Q(t) {
+      w.value = t, C("layoutChange", w.value);
     }
-    function B() {
-      if ($.value && document.body.contains($.value)) {
+    function b() {
+      if (m.value && document.body.contains(m.value)) {
         try {
-          document.body.removeChild($.value);
+          document.body.removeChild(m.value);
         } catch (t) {
           console.warn("[VideoGridLayout] Failed to cleanup drag image:", t);
         }
-        $.value = null;
+        m.value = null;
       }
-      if (h.value && document.body.contains(h.value)) {
-        try {
-          document.body.removeChild(h.value);
-        } catch {
-        }
-        h.value = null;
-      }
-      A && (document.removeEventListener("mousemove", A), A = null), L && (document.removeEventListener("drag", L), L = null);
     }
-    function lt(t, o) {
-      if (o < 0 || o >= y.value.length) {
-        console.warn("[VideoGridLayout] Invalid drag index:", o);
+    function X(t, e) {
+      if (e < 0 || e >= v.value.length) {
+        console.warn("[VideoGridLayout] Invalid drag index:", e);
         return;
       }
-      if (v.value = o, !t.dataTransfer) return;
+      if (u.value = e, !t.dataTransfer) return;
       t.dataTransfer.effectAllowed = "move";
       const r = t.target.closest(".video-item");
       if (r)
         try {
-          if (B(), t.dataTransfer) {
-            t.dataTransfer.effectAllowed = "move";
-            const l = new Image();
-            l.src = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7", t.dataTransfer.setDragImage(l, 0, 0);
-          }
-          const n = r.cloneNode(!0);
-          n.querySelectorAll(".progress-bar, .play-button").forEach((l) => l.remove()), n.querySelectorAll('[style*="transition"], [style*="animation"], .video-icon').forEach((l) => {
-            try {
-              l.style.transition = "none", l.style.animation = "none";
-            } catch {
-            }
-          }), n.style.position = "fixed", n.style.margin = "0", n.style.pointerEvents = "none", n.style.opacity = Nt, n.style.zIndex = "9999", document.body.appendChild(n), h.value = n;
-          try {
-            const l = r.getBoundingClientRect();
-            n.style.width = `${l.width}px`, n.style.height = `${l.height}px`;
-          } catch {
-          }
-          A = (l) => {
-            if (!h.value) return;
-            const f = h.value.offsetWidth || 0, T = h.value.offsetHeight || 0, G = Math.max(0, l.clientX - f / 2), M = Math.max(0, l.clientY - T / 2);
-            h.value.style.left = `${G}px`, h.value.style.top = `${M}px`;
-          }, document.addEventListener("mousemove", A), L = (l) => {
-            if (!h.value) return;
-            const f = h.value.offsetWidth || 0, T = h.value.offsetHeight || 0, G = Math.max(0, (l.clientX || 0) - f / 2), M = Math.max(0, (l.clientY || 0) - T / 2);
-            h.value.style.left = `${G}px`, h.value.style.top = `${M}px`;
-          }, document.addEventListener("drag", L), r.style.opacity = String(Ot), r.style.cursor = Rt, r.style.borderColor = "#ff6b6b";
-        } catch (n) {
-          console.error("[VideoGridLayout] Drag start error:", n), B();
+          b();
+          const l = r.cloneNode(!0);
+          l.style.width = `${r.offsetWidth}px`, l.style.height = `${r.offsetHeight}px`, l.style.opacity = Tt, l.style.position = "absolute", l.style.top = "-9999px", l.style.pointerEvents = "none", document.body.appendChild(l), m.value = l, t.dataTransfer.setDragImage(l, r.offsetWidth / 2, r.offsetHeight / 2), setTimeout(() => {
+            b();
+          }, 100), r.style.opacity = String(Bt), r.style.cursor = Vt;
+        } catch (l) {
+          console.error("[VideoGridLayout] Drag start error:", l), b();
         }
     }
-    function nt(t, o) {
+    function Z(t, e) {
       t.preventDefault(), t.stopPropagation();
-      const a = v.value;
-      if (a === -1 || a === o) {
-        v.value = -1;
+      const a = u.value;
+      if (a === -1 || a === e) {
+        u.value = -1;
         return;
       }
-      if (o < 0 || o >= m.value.length) {
-        console.warn("[VideoGridLayout] Invalid drop index:", o), v.value = -1;
+      if (e < 0 || e >= f.value.length) {
+        console.warn("[VideoGridLayout] Invalid drop index:", e), u.value = -1;
         return;
       }
       try {
@@ -528,112 +497,112 @@ const yt = { class: "layout-icon" }, gt = {
         r && (r.style.backgroundColor = "rgba(66, 184, 131, 0.3)", r.style.borderColor = "#42b883", setTimeout(() => {
           r.style.backgroundColor = "", r.style.borderColor = "";
         }, 200));
-        const n = [...y.value], w = n[a], u = n[o];
-        n[a] = u, n[o] = w, E = !0, y.value = n, setTimeout(() => {
-          E = !1, x("videosChange", y.value.filter(Boolean));
+        const l = [...v.value], s = l[a], p = l[e];
+        l[a] = p, l[e] = s, $ = !0, v.value = l, setTimeout(() => {
+          $ = !1, C("videosChange", v.value.filter(Boolean));
         }, 0);
       } catch (r) {
         console.error("[VideoGridLayout] Drop error:", r);
       } finally {
-        v.value = -1;
+        u.value = -1;
       }
     }
-    function ct(t, o) {
-      t.preventDefault(), v.value !== -1 && v.value !== o && (b.value = o);
+    function tt(t, e) {
+      t.preventDefault(), u.value !== -1 && u.value !== e && (x.value = e);
     }
-    function it(t, o) {
+    function ot(t, e) {
       t.preventDefault();
       const a = t.target, r = t.relatedTarget;
-      a.contains(r) || b.value === o && (b.value = -1);
+      a.contains(r) || x.value === e && (x.value = -1);
     }
-    function st(t) {
+    function et(t) {
       const a = t.target.closest(".video-item");
-      a && (a.style.opacity = "1", a.style.cursor = "move", a.style.borderColor = ""), B(), v.value = -1, b.value = -1;
+      a && (a.style.opacity = "1", a.style.cursor = "move"), b(), u.value = -1, x.value = -1;
     }
-    return dt(() => {
-      B();
-    }), (t, o) => (s(), i("div", {
+    return at(() => {
+      b();
+    }), (t, e) => (i(), c("div", {
       class: "video-grid-layout",
       role: "application",
       "aria-label": "视频分屏布局",
-      style: N(tt.value)
+      style: B(W.value)
     }, [
-      c.showToolbar ? (s(), i("div", Bt, [
-        o[1] || (o[1] = d("div", { class: "toolbar-title" }, "分屏布局", -1)),
-        d("div", It, [
-          (s(!0), i(U, null, z(K.value, (a) => {
-            var r, n, w;
-            return s(), i("button", {
+      n.showToolbar ? (i(), c("div", mt, [
+        e[1] || (e[1] = d("div", { class: "toolbar-title" }, "分屏布局", -1)),
+        d("div", bt, [
+          (i(!0), c(N, null, M(z.value, (a) => {
+            var r, l, s;
+            return i(), c("button", {
               key: a,
-              class: j(["layout-btn", { active: p.value === a }]),
-              onClick: (u) => at(a),
-              title: ((r = P(C)[a]) == null ? void 0 : r.label) || "",
-              "aria-label": `切换到${((n = P(C)[a]) == null ? void 0 : n.label) || ""}布局`,
-              "aria-pressed": p.value === a,
+              class: R(["layout-btn", { active: w.value === a }]),
+              onClick: (p) => Q(a),
+              title: ((r = V(S)[a]) == null ? void 0 : r.label) || "",
+              "aria-label": `切换到${((l = V(S)[a]) == null ? void 0 : l.label) || ""}布局`,
+              "aria-pressed": w.value === a,
               type: "button"
             }, [
-              ht(J, { type: a }, null, 8, ["type"]),
-              d("span", Et, q(((w = P(C)[a]) == null ? void 0 : w.label) || ""), 1)
-            ], 10, _t);
+              lt(j, { type: a }, null, 8, ["type"]),
+              d("span", Lt, P(((s = V(S)[a]) == null ? void 0 : s.label) || ""), 1)
+            ], 10, Dt);
           }), 128))
         ])
-      ])) : X("", !0),
-      d("div", Vt, [
+      ])) : U("", !0),
+      d("div", _t, [
         d("div", {
           class: "video-grid",
-          style: N(Z.value)
+          style: B(H.value)
         }, [
-          (s(!0), i(U, null, z(m.value, (a, r) => {
-            var n, w, u;
-            return s(), i("div", {
-              key: ((n = D.value[r]) == null ? void 0 : n.id) ?? r,
-              class: j(["video-item", {
-                "main-video": rt(r),
-                dragging: v.value === r,
-                "drag-over": b.value === r && v.value !== r
+          (i(!0), c(N, null, M(f.value, (a, r) => {
+            var l, s, p;
+            return i(), c("div", {
+              key: ((l = D.value[r]) == null ? void 0 : l.id) ?? r,
+              class: R(["video-item", {
+                "main-video": K(r),
+                dragging: u.value === r,
+                "drag-over": x.value === r && u.value !== r
               }]),
-              style: N(ot(r)),
+              style: B(J(r)),
               draggable: !0,
-              "aria-label": `视频 ${r + 1}: ${((w = D.value[r]) == null ? void 0 : w.title) || ((u = D.value[r]) == null ? void 0 : u.id) || ""}`,
+              "aria-label": `视频 ${r + 1}: ${((s = D.value[r]) == null ? void 0 : s.title) || ((p = D.value[r]) == null ? void 0 : p.id) || ""}`,
               role: "article",
               tabindex: "0",
-              onDragstart: (l) => lt(l, r),
-              onDragover: o[0] || (o[0] = wt(() => {
+              onDragstart: (h) => X(h, r),
+              onDragover: e[0] || (e[0] = nt(() => {
               }, ["prevent"])),
-              onDragenter: (l) => ct(l, r),
-              onDragleave: (l) => it(l, r),
-              onDrop: (l) => nt(l, r),
-              onDragend: st
+              onDragenter: (h) => tt(h, r),
+              onDragleave: (h) => ot(h, r),
+              onDrop: (h) => Z(h, r),
+              onDragend: et
             }, [
-              ut(t.$slots, "video", {
+              ct(t.$slots, "video", {
                 video: D.value[r],
                 index: r
               }, () => [
-                d("div", Gt, [
-                  d("div", Mt, q(et(F.value.indexOf(r))), 1)
+                d("div", It, [
+                  d("div", At, P(q(O.value.indexOf(r))), 1)
                 ])
               ], !0)
-            ], 46, Tt);
+            ], 46, $t);
           }), 128))
         ], 4)
       ])
     ], 4));
   }
-}), Ht = /* @__PURE__ */ Q(Pt, [["__scopeId", "data-v-f0958f8e"]]), Yt = {
-  VideoGridLayout: Ht,
-  VideoLayoutIcon: J
-}, Ut = {
-  install(c) {
-    Object.entries(Yt).forEach(([k, e]) => {
-      c.component(k, e);
+}), Ot = /* @__PURE__ */ Y(Gt, [["__scopeId", "data-v-1b7d75db"]]), Et = {
+  VideoGridLayout: Ot,
+  VideoLayoutIcon: j
+}, Mt = {
+  install(n) {
+    Object.entries(Et).forEach(([k, o]) => {
+      n.component(k, o);
     });
   }
 };
 export {
-  C as LAYOUT_CONFIGS,
-  Ht as VideoGridLayout,
-  J as VideoLayoutIcon,
-  Ut as default,
-  vt as getAllLayoutTypes,
-  pt as getLayoutPositions
+  S as LAYOUT_CONFIGS,
+  Ot as VideoGridLayout,
+  j as VideoLayoutIcon,
+  Mt as default,
+  dt as getAllLayoutTypes,
+  it as getLayoutPositions
 };

package/dist/style.css

@@ -1 +1 @@
-.video-grid-layout{width:100%;height:100%;display:flex;flex-direction:column;background:#0015294d}.layout-toolbar{padding:12px 16px;background:#fff;border-bottom:1px solid #e0e0e0;display:flex;align-items:center;gap:16px;flex-wrap:wrap}.toolbar-title{font-size:14px;font-weight:600;color:#333}.layout-buttons{display:flex;gap:8px;flex-wrap:wrap}.layout-btn{display:flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid #d0d0d0;background:#fff;border-radius:4px;cursor:pointer;transition:all .2s;font-size:12px;color:#666}.layout-btn:hover{border-color:#42b883;color:#42b883;background:#f0fdf4}.layout-btn.active{border-color:#42b883;background:#42b883;color:#fff}.layout-label{font-size:12px}.video-grid-container{flex:1;padding:8px;display:flex;align-items:center;justify-content:center;min-height:0;overflow:hidden;box-sizing:border-box}.video-grid{width:100%;height:100%;max-width:100%;max-height:100%;background:#00409f33;padding:4px;border-radius:4px;box-sizing:border-box}.video-item{position:relative;background:#00152999;border:2px solid rgba(0,64,159,.49);border-radius:4px;overflow:hidden;cursor:move;transition:border-color .2s ease,background .2s ease,box-shadow .2s ease,transform .2s ease;min-height:0;min-width:0;-webkit-user-select:none;user-select:none;-webkit-user-drag:element;will-change:transform}.video-item.dragging{opacity:.5;cursor:grabbing;transform:scale(.98);box-shadow:0 4px 12px #0000004d}.video-item:hover{border-color:#42b883cc;background:#001529cc}.video-item.drag-over{border:1px solid rgba(66,184,131,1)!important;background:#42b88333!important}.video-item:focus{outline:1px solid rgba(66,184,131,1);outline-offset:1px}.video-item.main-video{border-width:1px}.video-item>*{width:100%;height:100%}.video-placeholder{display:flex;align-items:center;justify-content:center;height:100%;color:#3de6ff80;-webkit-user-select:none;user-select:none;background:#00409f4d}.placeholder-number{font-size:48px;font-weight:700;color:#3de6ff99;text-shadow:0 0 10px rgba(61,230,255,.3)}@media (max-width: 768px){.layout-toolbar{flex-direction:column;align-items:flex-start}.layout-label{display:none}}.layout-icon[data-v-31e0404d]{width:16px;height:16px;display:inline-flex;align-items:center;justify-content:center}.layout-icon svg[data-v-31e0404d]{width:100%;height:100%}.video-grid-layout[data-v-f0958f8e]{width:100%;height:100%;display:flex;flex-direction:column;background:#0015294d}.layout-toolbar[data-v-f0958f8e]{padding:12px 16px;background:#fff;border-bottom:1px solid #e0e0e0;display:flex;align-items:center;gap:16px;flex-wrap:wrap}.toolbar-title[data-v-f0958f8e]{font-size:14px;font-weight:600;color:#333}.layout-buttons[data-v-f0958f8e]{display:flex;gap:8px;flex-wrap:wrap}.layout-btn[data-v-f0958f8e]{display:flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid #d0d0d0;background:#fff;border-radius:4px;cursor:pointer;transition:all .2s;font-size:12px;color:#666}.layout-btn[data-v-f0958f8e]:hover{border-color:#42b883;color:#42b883;background:#f0fdf4}.layout-btn.active[data-v-f0958f8e]{border-color:#42b883;background:#42b883;color:#fff}.layout-label[data-v-f0958f8e]{font-size:12px}.video-grid-container[data-v-f0958f8e]{flex:1;padding:8px;display:flex;align-items:center;justify-content:center;min-height:0;overflow:hidden;box-sizing:border-box}.video-grid[data-v-f0958f8e]{width:100%;height:100%;max-width:100%;max-height:100%;background:#00409f33;padding:4px;border-radius:4px;box-sizing:border-box}.video-item[data-v-f0958f8e]{position:relative;background:#00152999;border:2px solid rgba(0,64,159,.49);border-radius:4px;overflow:hidden;cursor:move;min-height:0;min-width:0;-webkit-user-select:none;user-select:none;-webkit-user-drag:element}.video-item.dragging[data-v-f0958f8e]{opacity:.5;cursor:grabbing}.video-item[data-v-f0958f8e]:hover{border-color:#42b883cc;background:#001529cc}.video-item.drag-over[data-v-f0958f8e]{border:1px solid rgba(66,184,131,1)!important;background:#42b88333!important}.video-item[data-v-f0958f8e]:focus{outline:1px solid rgba(66,184,131,1);outline-offset:1px}.video-item.main-video[data-v-f0958f8e]{border-width:1px}.video-item[data-v-f0958f8e]>*{width:100%;height:100%}.video-placeholder[data-v-f0958f8e]{display:flex;align-items:center;justify-content:center;height:100%;color:#3de6ff80;-webkit-user-select:none;user-select:none;background:#00409f4d}.placeholder-number[data-v-f0958f8e]{font-size:48px;font-weight:700;color:#3de6ff99;text-shadow:0 0 10px rgba(61,230,255,.3)}@media (max-width: 768px){.layout-toolbar[data-v-f0958f8e]{flex-direction:column;align-items:flex-start}.layout-label[data-v-f0958f8e]{display:none}}
+.video-grid-layout{width:100%;height:100%;display:flex;flex-direction:column;background:#0015294d}.layout-toolbar{padding:12px 16px;background:#fff;border-bottom:1px solid #e0e0e0;display:flex;align-items:center;gap:16px;flex-wrap:wrap}.toolbar-title{font-size:14px;font-weight:600;color:#333}.layout-buttons{display:flex;gap:8px;flex-wrap:wrap}.layout-btn{display:flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid #d0d0d0;background:#fff;border-radius:4px;cursor:pointer;transition:all .2s;font-size:12px;color:#666}.layout-btn:hover{border-color:#42b883;color:#42b883;background:#f0fdf4}.layout-btn.active{border-color:#42b883;background:#42b883;color:#fff}.layout-label{font-size:12px}.video-grid-container{flex:1;padding:8px;display:flex;align-items:center;justify-content:center;min-height:0;overflow:hidden;box-sizing:border-box}.video-grid{width:100%;height:100%;max-width:100%;max-height:100%;background:#00409f33;padding:4px;border-radius:4px;box-sizing:border-box}.video-item{position:relative;background:#00152999;border:2px solid rgba(0,64,159,.49);border-radius:4px;overflow:hidden;cursor:move;transition:border-color .2s ease,background .2s ease,box-shadow .2s ease,transform .2s ease;min-height:0;min-width:0;-webkit-user-select:none;user-select:none;-webkit-user-drag:element;will-change:transform}.video-item.dragging{opacity:.5;cursor:grabbing;transform:scale(.98);box-shadow:0 4px 12px #0000004d}.video-item:hover{border-color:#42b883cc;background:#001529cc}.video-item.drag-over{border:1px solid rgba(66,184,131,1)!important;background:#42b88333!important}.video-item:focus{outline:1px solid rgba(66,184,131,1);outline-offset:1px}.video-item.main-video{border-width:1px}.video-item>*{width:100%;height:100%}.video-placeholder{display:flex;align-items:center;justify-content:center;height:100%;color:#3de6ff80;-webkit-user-select:none;user-select:none;background:#00409f4d}.placeholder-number{font-size:48px;font-weight:700;color:#3de6ff99;text-shadow:0 0 10px rgba(61,230,255,.3)}@media (max-width: 768px){.layout-toolbar{flex-direction:column;align-items:flex-start}.layout-label{display:none}}.layout-icon[data-v-31e0404d]{width:16px;height:16px;display:inline-flex;align-items:center;justify-content:center}.layout-icon svg[data-v-31e0404d]{width:100%;height:100%}.video-grid-layout[data-v-1b7d75db]{width:100%;height:100%;display:flex;flex-direction:column;background:#0015294d}.layout-toolbar[data-v-1b7d75db]{padding:12px 16px;background:#fff;border-bottom:1px solid #e0e0e0;display:flex;align-items:center;gap:16px;flex-wrap:wrap}.toolbar-title[data-v-1b7d75db]{font-size:14px;font-weight:600;color:#333}.layout-buttons[data-v-1b7d75db]{display:flex;gap:8px;flex-wrap:wrap}.layout-btn[data-v-1b7d75db]{display:flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid #d0d0d0;background:#fff;border-radius:4px;cursor:pointer;transition:all .2s;font-size:12px;color:#666}.layout-btn[data-v-1b7d75db]:hover{border-color:#42b883;color:#42b883;background:#f0fdf4}.layout-btn.active[data-v-1b7d75db]{border-color:#42b883;background:#42b883;color:#fff}.layout-label[data-v-1b7d75db]{font-size:12px}.video-grid-container[data-v-1b7d75db]{flex:1;padding:8px;display:flex;align-items:center;justify-content:center;min-height:0;overflow:hidden;box-sizing:border-box}.video-grid[data-v-1b7d75db]{width:100%;height:100%;max-width:100%;max-height:100%;background:#00409f33;padding:4px;border-radius:4px;box-sizing:border-box}.video-item[data-v-1b7d75db]{position:relative;background:#00152999;border:2px solid rgba(0,64,159,.49);border-radius:4px;overflow:hidden;cursor:move;min-height:0;min-width:0;-webkit-user-select:none;user-select:none;-webkit-user-drag:element}.video-item.dragging[data-v-1b7d75db]{opacity:.5;cursor:grabbing}.video-item[data-v-1b7d75db]:hover{border-color:#42b883cc;background:#001529cc}.video-item.drag-over[data-v-1b7d75db]{border:1px solid rgba(66,184,131,1)!important;background:#42b88333!important}.video-item[data-v-1b7d75db]:focus{outline:1px solid rgba(66,184,131,1);outline-offset:1px}.video-item.main-video[data-v-1b7d75db]{border-width:1px}.video-item[data-v-1b7d75db]>*{width:100%;height:100%}.video-placeholder[data-v-1b7d75db]{display:flex;align-items:center;justify-content:center;height:100%;color:#3de6ff80;-webkit-user-select:none;user-select:none;background:#00409f4d}.placeholder-number[data-v-1b7d75db]{font-size:48px;font-weight:700;color:#3de6ff99;text-shadow:0 0 10px rgba(61,230,255,.3)}@media (max-width: 768px){.layout-toolbar[data-v-1b7d75db]{flex-direction:column;align-items:flex-start}.layout-label[data-v-1b7d75db]{display:none}}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "video-split-screen",
-  "version": "1.0.15",
+  "version": "1.0.17",
   "description": "Vue 3 视频分屏组件（VideoSplitScreen）",
   "keywords": [
     "vue",
@@ -20,9 +20,9 @@
   ],
   "repository": {
     "type": "git",
-    "url": "https://github.com/your-username/video-split-screen"
+    "url": "https://github.com/laylwenl/videoSplitScreen.git"
   },
-  "homepage": "https://github.com/your-username/video-split-screen#readme",
+  "homepage": "https://github.com/laylwenl/videoSplitScreen#readme",
   "publishConfig": {
     "access": "public"
   },