@aiquants/drag-drop-panels 0.2.0

package/dist/index.umd.js

@@ -0,0 +1,22 @@
+(function(L,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("react"),require("lucide-react")):typeof define=="function"&&define.amd?define(["exports","react","lucide-react"],t):(L=typeof globalThis<"u"?globalThis:L||self,t(L.AiquantsDragDropPanels={},L.React,L["lucide-react"]))})(this,(function(L,t,$){"use strict";var ie={exports:{}},re={};/**
+ * @license React
+ * react-jsx-runtime.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var be;function Se(){if(be)return re;be=1;var n=Symbol.for("react.transitional.element"),l=Symbol.for("react.fragment");function s(a,r,d){var m=null;if(d!==void 0&&(m=""+d),r.key!==void 0&&(m=""+r.key),"key"in r){d={};for(var u in r)u!=="key"&&(d[u]=r[u])}else d=r;return r=d.ref,{$$typeof:n,type:a,key:m,ref:r!==void 0?r:null,props:d}}return re.Fragment=l,re.jsx=s,re.jsxs=s,re}var oe={};/**
+ * @license React
+ * react-jsx-runtime.development.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var pe;function Oe(){return pe||(pe=1,process.env.NODE_ENV!=="production"&&(function(){function n(c){if(c==null)return null;if(typeof c=="function")return c.$$typeof===y?null:c.displayName||c.name||null;if(typeof c=="string")return c;switch(c){case h:return"Fragment";case H:return"Profiler";case O:return"StrictMode";case G:return"Suspense";case I:return"SuspenseList";case g:return"Activity"}if(typeof c=="object")switch(typeof c.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),c.$$typeof){case P:return"Portal";case Z:return c.displayName||"Context";case V:return(c._context.displayName||"Context")+".Consumer";case N:var p=c.render;return c=c.displayName,c||(c=p.displayName||p.name||"",c=c!==""?"ForwardRef("+c+")":"ForwardRef"),c;case K:return p=c.displayName||null,p!==null?p:n(c.type)||"Memo";case f:p=c._payload,c=c._init;try{return n(c(p))}catch{}}return null}function l(c){return""+c}function s(c){try{l(c);var p=!1}catch{p=!0}if(p){p=console;var R=p.error,U=typeof Symbol=="function"&&Symbol.toStringTag&&c[Symbol.toStringTag]||c.constructor.name||"Object";return R.call(p,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",U),l(c)}}function a(c){if(c===h)return"<>";if(typeof c=="object"&&c!==null&&c.$$typeof===f)return"<...>";try{var p=n(c);return p?"<"+p+">":"<...>"}catch{return"<...>"}}function r(){var c=k.A;return c===null?null:c.getOwner()}function d(){return Error("react-stack-top-frame")}function m(c){if(C.call(c,"key")){var p=Object.getOwnPropertyDescriptor(c,"key").get;if(p&&p.isReactWarning)return!1}return c.key!==void 0}function u(c,p){function R(){E||(E=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",p))}R.isReactWarning=!0,Object.defineProperty(c,"key",{get:R,configurable:!0})}function v(){var c=n(this.type);return M[c]||(M[c]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),c=this.props.ref,c!==void 0?c:null}function S(c,p,R,U,x,F){var _=R.ref;return c={$$typeof:w,type:c,key:p,props:R,_owner:U},(_!==void 0?_:null)!==null?Object.defineProperty(c,"ref",{enumerable:!1,get:v}):Object.defineProperty(c,"ref",{enumerable:!1,value:null}),c._store={},Object.defineProperty(c._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(c,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(c,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:x}),Object.defineProperty(c,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:F}),Object.freeze&&(Object.freeze(c.props),Object.freeze(c)),c}function j(c,p,R,U,x,F){var _=p.children;if(_!==void 0)if(U)if(i(_)){for(U=0;U<_.length;U++)A(_[U]);Object.freeze&&Object.freeze(_)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else A(_);if(C.call(p,"key")){_=n(c);var J=Object.keys(p).filter(function(z){return z!=="key"});U=0<J.length?"{key: someKey, "+J.join(": ..., ")+": ...}":"{key: someKey}",B[_+U]||(J=0<J.length?"{"+J.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
+  let props = %s;
+  <%s {...props} />
+React keys must be passed directly to JSX without using spread:
+  let props = %s;
+  <%s key={someKey} {...props} />`,U,_,J,_),B[_+U]=!0)}if(_=null,R!==void 0&&(s(R),_=""+R),m(p)&&(s(p.key),_=""+p.key),"key"in p){R={};for(var q in p)q!=="key"&&(R[q]=p[q])}else R=p;return _&&u(R,typeof c=="function"?c.displayName||c.name||"Unknown":c),S(c,_,R,r(),x,F)}function A(c){T(c)?c._store&&(c._store.validated=1):typeof c=="object"&&c!==null&&c.$$typeof===f&&(c._payload.status==="fulfilled"?T(c._payload.value)&&c._payload.value._store&&(c._payload.value._store.validated=1):c._store&&(c._store.validated=1))}function T(c){return typeof c=="object"&&c!==null&&c.$$typeof===w}var o=t,w=Symbol.for("react.transitional.element"),P=Symbol.for("react.portal"),h=Symbol.for("react.fragment"),O=Symbol.for("react.strict_mode"),H=Symbol.for("react.profiler"),V=Symbol.for("react.consumer"),Z=Symbol.for("react.context"),N=Symbol.for("react.forward_ref"),G=Symbol.for("react.suspense"),I=Symbol.for("react.suspense_list"),K=Symbol.for("react.memo"),f=Symbol.for("react.lazy"),g=Symbol.for("react.activity"),y=Symbol.for("react.client.reference"),k=o.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,C=Object.prototype.hasOwnProperty,i=Array.isArray,b=console.createTask?console.createTask:function(){return null};o={react_stack_bottom_frame:function(c){return c()}};var E,M={},Y=o.react_stack_bottom_frame.bind(o,d)(),X=b(a(d)),B={};oe.Fragment=h,oe.jsx=function(c,p,R){var U=1e4>k.recentlyCreatedOwnerStacks++;return j(c,p,R,!1,U?Error("react-stack-top-frame"):Y,U?b(a(c)):X)},oe.jsxs=function(c,p,R){var U=1e4>k.recentlyCreatedOwnerStacks++;return j(c,p,R,!0,U?Error("react-stack-top-frame"):Y,U?b(a(c)):X)}})()),oe}var ve;function Te(){return ve||(ve=1,process.env.NODE_ENV==="production"?ie.exports=Se():ie.exports=Oe()),ie.exports}var e=Te();const ye=({config:n,panelId:l,sizeInfo:s,onSizeInfoClick:a})=>n.showPanelSizes&&s?e.jsxs("div",{className:"absolute top-1 right-24 z-10 cursor-default rounded-md bg-red-500/90 px-2 py-1 font-mono text-white text-xs leading-tight shadow-lg",onClick:a,onMouseDown:a,onTouchStart:r=>r instanceof TouchEvent&&a(r),onDragStart:a,children:[e.jsxs("div",{className:"text-[10px] opacity-80",children:["ID:",l]}),e.jsxs("div",{children:[s.width,"×",s.height]}),e.jsxs("div",{children:["X:",s.x," Y:",s.y]}),e.jsxs("div",{className:"text-[10px] opacity-80",children:["min:",s.minHeight," max:",s.maxHeight]})]}):null,D=(n,l,...s)=>{(n.logLevel??0)>=l&&console.log(...s)},ue=t.memo(({index:n,columnIndex:l,isDragging:s,dragOverPosition:a,originalPosition:r,onDragEnter:d,onDragLeave:m,config:u,customDrag:v})=>{const S=r&&r.columnIndex===l&&(r.panelIndex===n||r.panelIndex+1===n),j=!S&&a?.columnIndex===l&&a?.insertIndex===n,A=t.useRef(null),[T,o]=t.useState(null),w=s||(v?.isActive??!1);return t.useEffect(()=>{if(A.current){const P=A.current.getBoundingClientRect(),h={width:Math.round(P.width),height:Math.round(P.height),x:Math.round(P.left),y:Math.round(P.top)};o(h),j&&D(u,1,`🎯 アクティブプレースホルダー ${n}-${l}:`,{size:`${h.width}×${h.height}`,position:`(${h.x}, ${h.y})`,bottomRight:`(${h.x+h.width}, ${h.y+h.height})`,center:`(${h.x+h.width/2}, ${h.y+h.height/2})`})}},[j,n,l,u]),D(u,2,`プレースホルダー${n}-${l}: 表示中`,{isHighlighted:j,isDragging:s,dragOverPosition:a,shouldShow:w}),e.jsxs("div",{ref:A,"data-placeholder-index":n,"data-placeholder-column":l,onDragEnter:()=>d(l,n),onDragLeave:P=>m(P,l,n),className:`relative flex w-full items-center justify-center transition-all duration-0 ${S?"pointer-events-none h-0 overflow-hidden opacity-0":w?j?"my-2 scale-[1.02] rounded-xl border-4 border-sky-500 border-dashed bg-sky-200 px-4 py-6 shadow-lg ring-2 ring-sky-400 ring-opacity-50":"my-2 rounded-xl border-2 border-sky-300 border-dashed bg-sky-50/70 px-2 py-4 opacity-80":"pointer-events-none h-0 overflow-hidden opacity-0"}`,children:[!S&&w&&u.showPlaceholderInfo&&T&&e.jsxs("div",{className:"absolute top-1 right-1 z-10 rounded-md bg-blue-500/90 px-2 py-1 font-mono text-white text-xs leading-tight shadow-lg",children:[e.jsxs("div",{children:[T.width,"×",T.height]}),e.jsxs("div",{children:["X:",T.x," Y:",T.y]}),e.jsx("div",{className:"text-[10px] opacity-80",children:"min:200px max:500px"}),e.jsxs("div",{className:"mt-0.5 text-[10px] opacity-80",children:["PH-",l,"-",n," ",j?"ACTIVE":"IDLE"]})]}),!S&&w&&e.jsxs("div",{className:"flex items-center space-x-2 text-sky-600",children:[e.jsxs("svg",{className:"h-6 w-6",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:[e.jsx("title",{children:"パネルをここにドロップ"}),e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 6v6m0 0v6m0-6h6m-6 0H6"})]}),e.jsx("span",{className:"font-medium text-sm",children:"パネルをここにドロップ"})]})]})});ue.displayName="InsertPlaceholder";const de=({columnIndex:n,isDragging:l,dragOverPosition:s,children:a,config:r})=>{const d=t.useRef(null),[m,u]=t.useState(null);return t.useEffect(()=>{if(d.current&&l){const v=d.current.getBoundingClientRect(),S=s?.columnIndex===n,j={width:Math.round(v.width),height:Math.round(v.height),x:Math.round(v.left),y:Math.round(v.top),isActive:S};u(j),S&&D(r,1,`🎯 アクティブドロップゾーン ${n}:`,{size:`${j.width}×${j.height}`,position:`(${j.x}, ${j.y})`,bottomRight:`(${j.x+j.width}, ${j.y+j.height})`,center:`(${j.x+j.width/2}, ${j.y+j.height/2})`})}},[l,s,n,r]),e.jsxs("div",{ref:d,className:"relative",children:[a,l&&m&&r.showDropZoneOutlines&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:`pointer-events-none absolute inset-0 rounded-lg border-2 border-dashed transition-all duration-200 ${m.isActive?"border-red-500 bg-red-100/20 shadow-lg":"border-gray-400 bg-gray-100/10"}`}),e.jsxs("div",{className:`absolute top-2 left-2 z-20 rounded-md px-2 py-1 font-mono text-xs leading-tight shadow-lg transition-all duration-200 ${m.isActive?"bg-red-500/90 text-white":"bg-gray-500/90 text-white"}`,children:[e.jsxs("div",{className:"font-bold",children:["DropZone-",n]}),e.jsxs("div",{children:[m.width,"×",m.height]}),e.jsxs("div",{children:["X:",m.x," Y:",m.y]}),e.jsx("div",{className:"mt-0.5 text-[10px] opacity-80",children:m.isActive?"ACTIVE":"IDLE"})]}),e.jsx("div",{className:`pointer-events-none absolute transition-all duration-200 ${m.isActive?"opacity-100":"opacity-50"}`,style:{left:`${m.width/2-6}px`,top:`${m.height/2-6}px`},children:e.jsx("div",{className:`h-3 w-3 rounded-full border-2 ${m.isActive?"border-red-700 bg-red-500":"border-gray-700 bg-gray-500"}`})}),m.isActive&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"pointer-events-none absolute top-0 left-0 h-2 w-2 rounded-full bg-red-500"}),e.jsx("div",{className:"pointer-events-none absolute top-0 right-0 h-2 w-2 rounded-full bg-red-500"}),e.jsx("div",{className:"pointer-events-none absolute bottom-0 left-0 h-2 w-2 rounded-full bg-red-500"}),e.jsx("div",{className:"pointer-events-none absolute right-0 bottom-0 h-2 w-2 rounded-full bg-red-500"})]})]})]})};de.displayName="DropZoneDebugOverlay";const me=({columnId:n,onResizeStart:l,onResize:s,onResizeEnd:a,isResizing:r=!1,position:d="right",className:m="",debug:u={}})=>{const v=t.useRef(!1),S=t.useRef(null);t.useEffect(()=>{!r&&v.current&&(D(u,1,"外部からのリサイズ解除を検出、ドラッグ状態を強制解除:",n),v.current=!1,document.body.style.cursor="",document.body.style.userSelect="",document.body.classList.remove("resizing-column"))},[r,n,u]);const j=t.useCallback(o=>{o.preventDefault(),o.stopPropagation(),D(u,2,"リサイズハンドル マウスダウン:",n),v.current=!0,l(n,o.clientX),document.body.style.cursor="col-resize",document.body.style.userSelect="none",document.body.classList.add("resizing-column")},[n,l,u]);t.useEffect(()=>{const o=P=>{v.current&&(P.preventDefault(),s(P.clientX))},w=()=>{v.current&&(D(u,2,"リサイズハンドル マウスアップ:",n),v.current=!1,a(),document.body.style.cursor="",document.body.style.userSelect="",document.body.classList.remove("resizing-column"))};return document.addEventListener("mousemove",o),document.addEventListener("mouseup",w),()=>{document.removeEventListener("mousemove",o),document.removeEventListener("mouseup",w)}},[n,s,a,u]);const A=t.useCallback(o=>{o.preventDefault(),o.stopPropagation();const w=o.touches[0];D(u,2,"リサイズハンドル タッチスタート:",n),v.current=!0,l(n,w.clientX),document.body.style.cursor="col-resize",document.body.style.userSelect="none",document.body.classList.add("resizing-column")},[n,l,u]);t.useEffect(()=>{const o=P=>{if(!v.current)return;P.preventDefault();const h=P.touches[0];s(h.clientX)},w=()=>{v.current&&(D(u,2,"リサイズハンドル タッチエンド:",n),v.current=!1,a(),document.body.style.cursor="",document.body.style.userSelect="",document.body.classList.remove("resizing-column"))};return document.addEventListener("touchmove",o,{passive:!1}),document.addEventListener("touchend",w),()=>{document.removeEventListener("touchmove",o),document.removeEventListener("touchend",w)}},[n,s,a,u]),t.useEffect(()=>()=>{v.current&&(D(u,1,"リサイズハンドルアンマウント時のクリーンアップ:",n),document.body.style.cursor="",document.body.style.userSelect="",document.body.classList.remove("resizing-column"))},[n,u]);const T=["resize-handle",d,r?"resizing":"",m].filter(Boolean).join(" ");return e.jsxs("div",{ref:S,className:T,onMouseDown:j,onTouchStart:A,"data-column-id":n,"data-position":d,"aria-label":`${n}のカラム幅を調整`,role:"separator","aria-orientation":"vertical",children:[e.jsx("div",{className:"resize-handle-bar"}),u.showPanelSizes&&e.jsxs("div",{className:"resize-handle-debug-info",children:[n,r&&" (resizing)"]})]})},Re=({columnId:n,width:l,minWidth:s=100,maxWidth:a=800,onResizeStart:r,onResize:d,onResizeEnd:m,isResizing:u=!1,resizable:v=!0,className:S="",debug:j={},children:A})=>{const T=["resizable-column",u?"resizing":"",S].filter(Boolean).join(" ");return t.useEffect(()=>{const o=document.querySelector(`[data-column-id="${n}"]`);o&&(o.style.setProperty("--column-width",`${l}px`),o.style.setProperty("--column-min-width",`${s}px`),o.style.setProperty("--column-max-width",`${a}px`))},[n,l,s,a]),e.jsxs("div",{className:T,"data-column-id":n,"data-width":l,"data-min-width":s,"data-max-width":a,children:[A,v&&e.jsx(me,{columnId:n,onResizeStart:r,onResize:d,onResizeEnd:m,isResizing:u,position:"right",debug:j}),j.showPanelSizes&&e.jsxs("div",{className:"column-debug-size",children:[l,"px",u&&" ↔"]})]})},he=t.memo(({index:n,columnIndex:l,isDragging:s,dragOverPosition:a,originalPosition:r,onDragEnter:d,onDragLeave:m,debugConfig:u,customDrag:v})=>e.jsx(ue,{index:n,columnIndex:l,isDragging:s,dragOverPosition:a,originalPosition:r,onDragEnter:d,onDragLeave:m,config:u,customDrag:v}));he.displayName="LocalInsertPlaceholder";const Ae=({columns:n,panels:l,columnPanels:s,panelVisibility:a,onPanelVisibilityChange:r,dragState:d,dragOverPosition:m,originalPanelPosition:u,dragModes:v,onDragStart:S,onDragEnd:j,onPlaceholderDragEnter:A,onPlaceholderDragLeave:T,onDragOverWithInsert:o,onDropWithInsert:w,onColumnDragLeave:P,onPanelClick:h,onPanelMouseDown:O,onTouchStart:H,onTouchMove:V,onTouchEnd:Z,debugConfig:N,panelSizes:G,setPanelRef:I,enableResize:K=!1,columnWidths:f,onResizeStart:g,onResize:y,onResizeEnd:k,isResizing:C=!1,resizingColumn:i,onPanelSizeInfoClick:b,onToggleDragMode:E,customDrag:M})=>{const Y=t.useRef(N);t.useEffect(()=>{Y.current=N},[N]);const X=t.useRef({}),B=t.useRef(new Map);t.useEffect(()=>{D(Y.current,1,"🎨 DragDropLayout - dragModes props changed:",{dragModes:v,timestamp:new Date().toISOString(),keys:Object.keys(v),values:Object.values(v)})},[v]);const c=t.useMemo(()=>{const x={};return l.forEach(F=>{x[F.id]=F}),x},[l]);t.useLayoutEffect(()=>{const x=new Map;Object.keys(X.current).forEach(z=>{const Q=X.current[z];if(Q){const ne=Q.getBoundingClientRect();x.set(z,{rect:ne,height:Q.offsetHeight,width:Q.offsetWidth})}});const F=B.current,_=300,J=new Set;Object.values(s).forEach(z=>{z.forEach(Q=>J.add(Q))}),new Set(F.keys()).forEach(z=>{J.has(z)||(D(Y.current,1,"パネル削除検出 - クリーンアップ:",z),F.delete(z),X.current[z]&&delete X.current[z])}),x.forEach((z,Q)=>{const ne=F.get(Q);if(ne){const W=ne.rect.left-z.rect.left,se=ne.rect.top-z.rect.top;if(W!==0||se!==0){D(Y.current,2,"パネル移動検出 - アニメーション開始:",Q,{dx:W,dy:se});const te=X.current[Q];te&&(te.style.transform=`translate(${W}px, ${se}px)`,te.style.transition="none",te.classList.add("is-moving"),requestAnimationFrame(()=>{te.style.transition=`transform ${_}ms cubic-bezier(0.2, 0, 0.2, 1)`,te.style.transform="translate(0, 0)",setTimeout(()=>{te.style.transition="",te.style.transform="",te.classList.remove("is-moving")},_)}))}}else{D(Y.current,1,"新規パネル検出 - フェードインアニメーション:",Q);const W=X.current[Q];W&&(W.style.opacity="0",W.style.transition="none",requestAnimationFrame(()=>{W.style.transition=`opacity ${_}ms ease-out`,W.style.opacity="1",setTimeout(()=>{W.style.transition="",W.style.opacity=""},_)}))}}),B.current=x},[s]);const p=x=>{if(!a[x])return null;const F=c[x];if(!F)return D(Y.current,1,`Panel config not found for panelId: ${x}`),null;const _=F.component,J=F.title,q=d.draggedPanel===x,z=v[x]||"normal";D(Y.current,2,`🎨 renderPanel - ${x}:`,{panelId:x,dragMode:z,timestamp:new Date().toISOString()});const Q=W=>{X.current[x]=W,I&&I(x,W),W&&N.showPanelSizes&&requestAnimationFrame(()=>{const se=W.getBoundingClientRect(),te=window.getComputedStyle(W);D(Y.current,1,`Panel ${x} mounted with size:`,{width:se.width,height:se.height,x:se.left,y:se.top,minHeight:te.minHeight,maxHeight:te.maxHeight})})},ne=G[x];return e.jsxs("div",{ref:Q,"data-panel-id":x,"data-dragging":q,role:"presentation",draggable:z==="normal",onDragStart:W=>z==="normal"&&S(W,x),onDragEnd:j,onClick:W=>h?.(W,x),onMouseDown:W=>O?.(W,x),onTouchStart:W=>H?.(W,x),onTouchMove:V,onTouchEnd:Z,className:`panel-draggable group relative flex min-h-[200px] max-h-[500px] flex-col overflow-hidden rounded-2xl border border-slate-200 bg-white/80 p-4 text-left shadow-lg backdrop-blur-lg transition-all duration-300 hover:-translate-y-1 hover:shadow-xl ${z==="custom"?"select-none":""} ${q?"cursor-grabbing":"cursor-grab"}`,children:[e.jsxs("div",{className:"group relative mb-3 flex items-center justify-between",children:[e.jsxs("div",{className:"flex items-center space-x-2",children:[e.jsx("h3",{className:"font-semibold text-lg text-slate-700 transition-colors group-hover:text-slate-900",children:J}),z==="custom"&&e.jsx("span",{className:"rounded-md bg-orange-100 px-2 py-1 font-medium text-orange-600 text-xs",children:"Custom"})]}),e.jsxs("div",{className:"flex items-center space-x-1 opacity-0 transition-opacity group-hover:opacity-100",children:[e.jsx("button",{type:"button",onClick:W=>{W.stopPropagation(),E&&E(x)},onKeyDown:W=>{(W.key==="Enter"||W.key===" ")&&(W.preventDefault(),W.stopPropagation(),E&&E(x))},tabIndex:0,className:`cursor-pointer rounded p-1 text-xs transition-colors ${z==="custom"?"bg-orange-100 text-orange-600 hover:bg-orange-200":"text-slate-400 hover:bg-slate-100 hover:text-slate-600"}`,title:z==="custom"?"通常ドラッグモードに戻す":"カスタムドラッグモードに切り替え",children:z==="custom"?e.jsx($.MousePointerClick,{className:"h-4 w-4"}):e.jsx($.MousePointer,{className:"h-4 w-4"})}),e.jsx("button",{type:"button",onClick:W=>{W.stopPropagation(),r({...a,[x]:!1})},className:"rounded p-1 text-slate-400 transition-colors hover:bg-slate-100 hover:text-slate-600",title:"パネルを非表示",children:e.jsx($.EyeOff,{className:"h-4 w-4"})})]})]}),e.jsx("div",{className:"panel-scroll-area flex-1 min-h-0 overflow-y-auto",children:e.jsx(_,{...F.props||{}})}),e.jsx(ye,{config:N,panelId:x,sizeInfo:ne,onSizeInfoClick:W=>b?.(W,x)})]},x)},R=(x,F)=>{const _=s[x]||[];let J=!1;for(const z of _)if(a[z]){J=!0;break}const q=d.isDragging||(M?.isActive??!1);return e.jsx(de,{columnIndex:F,isDragging:q,dragOverPosition:m,config:N,children:e.jsxs("section",{"data-drop-zone":"true","data-column-key":x,"data-column-index":F,"aria-label":`Drop zone for column ${F+1}`,onDragOver:z=>o(z,F),onDrop:z=>w(z,x),onDragLeave:P,className:"relative flex h-full flex-col transition-all duration-200",children:[e.jsx("div",{className:"placeholder-container",children:e.jsx(he,{index:0,columnIndex:F,isDragging:q,dragOverPosition:m,originalPosition:u,onDragEnter:A,onDragLeave:T,debugConfig:N,customDrag:M})}),_.map((z,Q)=>{const ne=a[z],W=!ne&&!q;return e.jsxs("div",{className:`panel-with-placeholder ${W?"h-0 m-0 p-0 overflow-hidden":""}`,"data-panel-hidden":W?"true":void 0,"aria-hidden":W?"true":void 0,children:[ne?p(z):q?e.jsxs("div",{className:"hidden-panel-placeholder relative h-[120px] rounded-2xl border-2 border-amber-300 border-dashed bg-gradient-to-br from-amber-50 to-orange-50 p-3 text-left shadow-lg backdrop-blur-lg",children:[e.jsxs("div",{className:"mb-2 flex items-center space-x-2",children:[e.jsx("h3",{className:"font-semibold text-base text-amber-700",children:c[z]?.title||z}),e.jsx("span",{className:"rounded-md bg-amber-100 px-2 py-1 font-medium text-amber-600 text-xs",children:"非表示"})]}),e.jsx("div",{className:"flex-1 overflow-hidden",children:e.jsx("div",{className:"flex h-full items-center justify-center",children:e.jsxs("div",{className:"text-center text-amber-600",children:[e.jsx($.EyeOff,{className:"h-6 w-6 opacity-50 mx-auto"}),e.jsx("p",{className:"text-xs mt-1",children:"このパネルは非表示です"})]})})})]}):null,e.jsx(he,{index:Q+1,columnIndex:F,isDragging:q,dragOverPosition:m,originalPosition:u,onDragEnter:A,onDragLeave:T,debugConfig:N,customDrag:M})]},`panel-${z}`)}),!J&&!q&&e.jsx("div",{className:"flex-shrink-0 rounded-xl border-2 border-slate-200 border-dashed bg-white/30 p-8 textcenter text-slate-400 transition-all duration-200",children:e.jsx("div",{className:"text-sm",children:"このエリアは空です"})})]})})},U=Object.keys(a).filter(x=>!a[x]);return e.jsxs("div",{className:"flex h-full flex-col",children:[U.length>0&&e.jsx("div",{className:"border-slate-200 border-b bg-white/70 px-4 py-2 backdrop-blur-lg",children:e.jsxs("div",{className:"flex flex-wrap gap-2",children:[e.jsx("span",{className:"mr-2 text-slate-600 text-sm",children:"非表示のパネル:"}),U.map(x=>{const _=c[x]?.title||x;return e.jsxs("button",{type:"button",onClick:()=>r({...a,[x]:!0}),className:"flex items-center space-x-1 rounded-lg border border-sky-300 bg-gradient-to-r from-sky-500 to-indigo-500 px-3 py-1 text-sm text-white shadow-md transition-all duration-200 hover:from-sky-600 hover:to-indigo-600 hover:shadow-lg",children:[e.jsx($.Eye,{className:"h-3 w-3"}),e.jsx("span",{children:_})]},x)})]})}),e.jsx("main",{className:"max-w-full flex-1 overflow-auto px-4 py-6 sm:px-6 no-scrollbar",children:e.jsx("div",{className:"relative flex h-full items-start gap-6 pr-4",children:n.map((x,F)=>{const _=f?.[x.id]||x.initialWidth||350,J=K&&(x.resizable??!0);return e.jsx(t.Fragment,{children:e.jsxs("div",{className:`column relative ${x.className||""} ${K?"resize-enabled-column":"auto-width-column"} ${C&&i===x.id?"column-resizing-active":""}`,"data-column":F,"data-column-id":x.id,"data-min-width":x.minWidth||350,"data-max-width":x.maxWidth,"data-column-width":K?_:void 0,...K&&{style:{"--column-width":`${_}px`}},children:[R(x.key,F),J&&g&&y&&k&&e.jsx(me,{columnId:x.id,onResizeStart:g,onResize:y,onResizeEnd:k,isResizing:C&&i===x.id,position:"right",debug:N})]})},x.id)})})})]})},Me=({columnCount:n,onColumnCountChange:l,onAutoBalance:s,onResetWidths:a,minColumns:r=2,maxColumns:d=6,isResizing:m=!1,isResponsiveMode:u=!1,responsiveColumnCount:v})=>{const S=n>r&&!u,j=n<d&&!u;return e.jsxs("div",{className:"flex items-center gap-3 rounded-lg border border-slate-200 bg-white/80 px-4 py-2 shadow-sm backdrop-blur-lg",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"font-medium text-slate-700 text-sm",children:"カラム数:"}),e.jsx("button",{type:"button",onClick:()=>S&&l(n-1),disabled:!S||m,className:`rounded p-1 text-xs transition-colors ${S&&!m?"border border-slate-300 text-slate-600 hover:border-red-300 hover:bg-red-50 hover:text-red-600":"cursor-not-allowed border border-slate-200 bg-slate-50 text-slate-300"}`,title:u?"レスポンシブモード中：カラム数は自動調整されます":`カラムを削除 (最小: ${r}列)`,children:e.jsx($.Minus,{className:"h-3 w-3"})}),e.jsxs("div",{className:`min-w-[2rem] rounded border px-3 py-1 text-center font-mono text-sm ${u?"border-blue-300 bg-blue-50 text-blue-700":"border-slate-300 bg-slate-100 text-slate-700"}`,children:[u?v??n:n,u&&e.jsx("span",{className:"ml-1 text-xs",children:"自動"})]}),e.jsx("button",{type:"button",onClick:()=>j&&l(n+1),disabled:!j||m,className:`rounded p-1 text-xs transition-colors ${j&&!m?"border border-slate-300 text-slate-600 hover:border-blue-300 hover:bg-blue-50 hover:text-blue-600":"cursor-not-allowed border border-slate-200 bg-slate-50 text-slate-300"}`,title:u?"レスポンシブモード中：カラム数は自動調整されます":`カラムを追加 (最大: ${d}列)`,children:e.jsx($.Plus,{className:"h-3 w-3"})})]}),e.jsx("div",{className:"h-6 w-px bg-slate-300"}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsxs("button",{type:"button",onClick:s,disabled:m,className:`flex items-center gap-1 rounded px-2 py-1 text-xs transition-colors ${m?"cursor-not-allowed border border-slate-200 bg-slate-50 text-slate-300":"border border-slate-300 text-slate-600 hover:border-green-300 hover:bg-green-50 hover:text-green-600"}`,title:"パネルを全カラムに均等分散",children:[e.jsx($.Grid3X3,{className:"h-3 w-3"}),e.jsx("span",{children:"バランス"})]}),e.jsxs("button",{type:"button",onClick:a,disabled:m,className:`flex items-center gap-1 rounded px-2 py-1 text-xs transition-colors ${m?"cursor-not-allowed border border-slate-200 bg-slate-50 text-slate-300":"border border-slate-300 text-slate-600 hover:border-orange-300 hover:bg-orange-50 hover:text-orange-600"}`,title:"カラム幅を初期値にリセット",children:[e.jsx($.RotateCcw,{className:"h-3 w-3"}),e.jsx("span",{children:"幅リセット"})]})]}),m&&e.jsxs("div",{className:"flex items-center gap-1 text-blue-600 text-xs",children:[e.jsx("div",{className:"h-2 w-2 animate-pulse rounded-full bg-blue-500"}),e.jsx("span",{children:"リサイズ中..."})]})]})},_e=({columnCount:n,onInsertColumn:l,onDeleteColumn:s,minColumns:a=1,maxColumns:r=6,isResizing:d=!1,disabled:m=!1})=>{const u=n<r&&!m,v=n>a&&!m;return e.jsxs("div",{className:`flex items-center justify-center gap-1 rounded-lg border border-slate-200 px-4 py-2 shadow-sm backdrop-blur-lg ${m?"bg-slate-100/80 opacity-60":"bg-white/80"}`,children:[m&&e.jsx("div",{className:"flex items-center gap-2 text-slate-500 text-xs",children:e.jsx("span",{children:"レスポンシブモード有効中：カラム数は自動調整されます"})}),!m&&e.jsxs(e.Fragment,{children:[e.jsx("button",{type:"button",onClick:()=>u&&l(0),disabled:!u||d,className:`flex h-8 w-8 items-center justify-center rounded border-2 border-dashed text-xs transition-colors ${u&&!d?"border-blue-300 text-blue-600 hover:border-blue-500 hover:bg-blue-50":"cursor-not-allowed border-slate-200 text-slate-300"}`,title:"この位置に新しいカラムを挿入",children:e.jsx($.Plus,{className:"h-4 w-4"})}),Array.from({length:n},(S,j)=>e.jsxs("div",{className:"flex items-center gap-1",children:[e.jsxs("div",{className:"relative flex h-8 w-12 items-center justify-center rounded border border-slate-300 bg-slate-100",children:[e.jsx("span",{className:"font-mono text-xs font-medium text-slate-700",children:j+1}),v&&!d&&e.jsx("button",{type:"button",onClick:()=>s(j),className:"absolute -right-1 -top-1 flex h-4 w-4 items-center justify-center rounded-full border border-red-300 bg-red-100 text-red-600 hover:bg-red-200",title:`カラム ${j+1} を削除`,children:e.jsx($.X,{className:"h-2.5 w-2.5"})})]}),e.jsx("button",{type:"button",onClick:()=>u&&l(j+1),disabled:!u||d,className:`flex h-8 w-8 items-center justify-center rounded border-2 border-dashed text-xs transition-colors ${u&&!d?"border-blue-300 text-blue-600 hover:border-blue-500 hover:bg-blue-50":"cursor-not-allowed border-slate-200 text-slate-300"}`,title:"この位置に新しいカラムを挿入",children:e.jsx($.Plus,{className:"h-4 w-4"})})]},`column-${j}`))]})]})},Le=({config:n,onConfigChange:l,isVisible:s,onToggleVisibility:a})=>s?e.jsxs("div",{className:"fixed right-4 bottom-4 z-50 max-w-sm rounded-lg border border-gray-300 bg-white p-4 shadow-xl",children:[e.jsxs("div",{className:"mb-3 flex items-center justify-between",children:[e.jsx("h3",{className:"font-bold text-gray-800 text-sm",children:"🛠️ デバッグ設定"}),e.jsx("button",{type:"button",onClick:a,className:"text-gray-500 text-lg hover:text-gray-700",title:"閉じる",children:"✕"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsxs("label",{className:"flex items-center space-x-2 text-sm",children:[e.jsx("input",{type:"checkbox",checked:n.showDebugPanel??!1,onChange:r=>l({...n,showDebugPanel:r.target.checked}),className:"rounded"}),e.jsx("span",{children:"デバッグパネル表示"})]}),e.jsxs("label",{className:"flex items-center space-x-2 text-sm",children:[e.jsx("input",{type:"checkbox",checked:n.showMousePosition??!1,onChange:r=>l({...n,showMousePosition:r.target.checked}),className:"rounded"}),e.jsx("span",{children:"マウス位置表示"})]}),e.jsxs("label",{className:"flex items-center space-x-2 text-sm",children:[e.jsx("input",{type:"checkbox",checked:n.showPanelSizes??!1,onChange:r=>l({...n,showPanelSizes:r.target.checked}),className:"rounded"}),e.jsx("span",{children:"パネルサイズ情報"})]}),e.jsxs("label",{className:"flex items-center space-x-2 text-sm",children:[e.jsx("input",{type:"checkbox",checked:n.showPlaceholderInfo??!1,onChange:r=>l({...n,showPlaceholderInfo:r.target.checked}),className:"rounded"}),e.jsx("span",{children:"プレースホルダー詳細"})]}),e.jsxs("label",{className:"flex items-center space-x-2 text-sm",children:[e.jsx("input",{type:"checkbox",checked:n.showDropZoneOutlines??!1,onChange:r=>l({...n,showDropZoneOutlines:r.target.checked}),className:"rounded"}),e.jsx("span",{children:"ドロップゾーン境界"})]}),e.jsxs("div",{className:"border-gray-200 border-t pt-2",children:[e.jsxs("label",{htmlFor:"log-level-slider",className:"mb-1 block text-sm",children:["ログレベル: ",n.logLevel??0]}),e.jsx("input",{id:"log-level-slider",type:"range",min:"0",max:"2",value:n.logLevel??0,onChange:r=>l({...n,logLevel:parseInt(r.target.value)}),className:"w-full","aria-label":"ログレベル設定"}),e.jsxs("div",{className:"mt-1 flex justify-between text-gray-500 text-xs",children:[e.jsx("span",{children:"無効"}),e.jsx("span",{children:"基本"}),e.jsx("span",{children:"詳細"})]})]}),e.jsxs("div",{className:"space-y-2 pt-2",children:[e.jsx("button",{type:"button",onClick:()=>l({showDebugPanel:!0,showMousePosition:!0,showPanelSizes:!0,showPlaceholderInfo:!0,showDropZoneOutlines:!0,logLevel:2}),className:"w-full rounded bg-blue-100 px-2 py-1 text-blue-700 text-sm transition-colors hover:bg-blue-200",children:"すべて有効"}),e.jsx("button",{type:"button",onClick:()=>l({showDebugPanel:!1,showMousePosition:!1,showPanelSizes:!1,showPlaceholderInfo:!1,showDropZoneOutlines:!1,logLevel:0}),className:"w-full rounded bg-gray-100 px-2 py-1 text-gray-700 text-sm transition-colors hover:bg-gray-200",children:"すべて無効"})]})]})]}):e.jsx("button",{type:"button",onClick:a,className:"fixed right-4 bottom-4 z-50 rounded-lg bg-gray-800 p-2 text-white shadow-lg transition-colors hover:bg-gray-700",title:"デバッグ設定を開く",children:"🛠️"}),We=({isResponsiveMode:n,responsiveColumnCount:l,currentColumnCount:s,screenWidth:a,onToggleResponsive:r})=>e.jsxs("div",{className:"flex items-center gap-2 rounded-lg border border-slate-300 bg-white/90 px-3 py-1",children:[e.jsxs("button",{type:"button",onClick:r,className:`flex items-center gap-1 rounded px-2 py-1 text-xs transition-colors ${n?"border border-blue-300 bg-blue-100 text-blue-700":"border border-slate-300 text-slate-600 hover:bg-blue-50 hover:text-blue-600"}`,title:n?"レスポンシブモードを無効化":"レスポンシブモードを有効化",children:[n?e.jsx($.Smartphone,{className:"h-3 w-3"}):e.jsx($.Monitor,{className:"h-3 w-3"}),e.jsx("span",{children:n?"レスポンシブ":"固定"})]}),n&&e.jsxs("div",{className:"flex items-center gap-1 text-slate-600 text-xs",children:[e.jsxs("span",{className:"font-mono",children:[a,"px"]}),e.jsx("span",{children:"→"}),e.jsxs("span",{className:"font-semibold text-blue-600",children:[l,"列"]}),l!==s&&e.jsx("span",{className:"text-orange-600",children:"(変更予定)"})]})]}),ee={prefix:"column",startIndex:1,separator:"_"},le=(n,l=ee)=>{const{prefix:s,startIndex:a,separator:r}=l,d=n+a;return`${s}${r}${d}`},fe=(n,l=ee)=>Array.from({length:n},(s,a)=>le(a,l)),ae=(n,l=ee)=>{const{prefix:s,startIndex:a,separator:r}=l,d=`${s}${r}`;if(!n.startsWith(d))return null;const m=n.slice(d.length),u=parseInt(m,10);return Number.isNaN(u)||u<a?null:u-a},ze=(n,l=ee)=>ae(n,l)!==null,Ye=(n,l=ee)=>{const s=n.map(a=>ae(a,l)).filter(a=>a!==null).sort((a,r)=>a-r);for(let a=0;a<s.length;a++)if(s[a]!==a)return le(a,l);return le(s.length,l)},we=(n,l=ee)=>n.sort((s,a)=>{const r=ae(s,l)??-1,d=ae(a,l)??-1;return r-d}),Fe=(n,l=ee)=>{const s={};return n.forEach((a,r)=>{const d=le(r,l);s[a]=d}),s},je=(n,l,s=ee)=>{const a=[];Object.values(n).forEach(m=>{a.push(...m)});const r={},d=fe(l,s);return d.forEach(m=>{r[m]=[]}),a.forEach((m,u)=>{const v=u%l,S=d[v];r[S].push(m)}),r},Xe=({initialColumns:n,initialPanels:l,debug:s={},onLayoutChange:a})=>{const[r,d]=t.useState(()=>{const f={};for(const g of n)f[g.id]=g.initialWidth||400;return{columns:n,columnWidths:f,isResizing:!1,resizingColumn:null,columnPanels:l,showInsertPlaceholders:!1}}),m=t.useRef(0),u=t.useRef(0);t.useEffect(()=>{a?.(r)},[r,a]);const v=t.useCallback((f,g)=>{D(s,1,"カラム追加:",f.id,"at position:",g),d(y=>{const k=[...y.columns],C=g??k.length;k.splice(C,0,f);const i={...y.columnWidths,[f.id]:f.initialWidth||400},b={...y.columnPanels,[f.id]:[]};return{...y,columns:k,columnWidths:i,columnPanels:b}})},[s]),S=t.useCallback(f=>{D(s,1,"カラム削除:",f),d(g=>{const y=g.columnPanels[f]||[],k=g.columns.filter(E=>E.id!==f);if(k.length===0)return D(s,1,"警告: 最後のカラムを削除しようとしています"),g;const C=k[0].id,i={...g.columnPanels};y.length>0&&(i[C]=[...i[C],...y]),delete i[f];const b={...g.columnWidths};return delete b[f],{...g,columns:k,columnWidths:b,columnPanels:i}})},[s]),j=t.useCallback((f,g)=>{D(s,1,"カラム移動:",f,"->",g),d(y=>{const k=[...y.columns],[C]=k.splice(f,1);return k.splice(g,0,C),{...y,columns:k}})},[s]),A=t.useCallback((f,g)=>{D(s,2,"リサイズ開始:",f,"at X:",g),m.current=g,u.current=r.columnWidths[f]||300,d(y=>({...y,isResizing:!0,resizingColumn:f}))},[s,r.columnWidths]),T=t.useCallback(f=>{const{resizingColumn:g,isResizing:y}=r;if(!(y&&g))return;const k=f-m.current,C=Math.max(100,Math.min(800,u.current+k));D(s,2,"リサイズ中:",g,"new width:",C),d(i=>({...i,columnWidths:{...i.columnWidths,[g]:C}}))},[s,r]),o=t.useCallback(()=>{D(s,2,"リサイズ終了"),d(f=>({...f,isResizing:!1,resizingColumn:null}))},[s]),w=t.useCallback((f,g)=>{D(s,2,"カラム幅設定:",f,g),d(y=>({...y,columnWidths:{...y.columnWidths,[f]:Math.max(100,Math.min(800,g))}}))},[s]),P=t.useCallback(()=>{D(s,1,"カラム幅リセット"),d(f=>{const g={};for(const y of f.columns)g[y.id]=y.initialWidth||400;return{...f,columnWidths:g}})},[s]),h=t.useCallback((f,g,y,k)=>{D(s,1,"パネル移動:",f,"from",g,"to",y,"at",k),d(C=>{const i={...C.columnPanels};if(g in i&&(i[g]=i[g].filter(b=>b!==f)),y in i){const b=[...i[y]];b.splice(k,0,f),i[y]=b}return{...C,columnPanels:i}})},[s]),O=t.useCallback((f,g,y)=>{D(s,1,"パネル追加:",f,"to column:",g),d(k=>{const C={...k.columnPanels};g in C||(C[g]=[]);const i=[...C[g]],b=y??i.length;return i.splice(b,0,f),C[g]=i,{...k,columnPanels:C}})},[s]),H=t.useCallback(f=>{D(s,1,"パネル削除:",f),d(g=>{const y={};for(const[k,C]of Object.entries(g.columnPanels))y[k]=C.filter(i=>i!==f);return{...g,columnPanels:y}})},[s]),V=t.useCallback(f=>{D(s,1,"カラム数更新:",f),d(g=>{const y=g.columns.length;if(f===y)return g;const k=je(g.columnPanels,f,ee),C=fe(f,ee),i=g.isResizing&&g.resizingColumn&&!C.includes(g.resizingColumn);i&&D(s,1,"リサイズ中のカラムが削除されるためリサイズを強制終了:",g.resizingColumn);const b=C.map((X,B)=>({id:X,title:`カラム ${B+1}`,minWidth:350,maxWidth:800,initialWidth:400,resizable:!(B===1&&f===3)})),E={};if(Object.entries(g.columnWidths).some(([,X])=>X!==400))C.forEach(X=>{const B=g.columnWidths[X];B&&B!==400?E[X]=B:E[X]=400});else{const X=y>f?Object.values(g.columnWidths).reduce((c,p)=>c+p,0):f*400,B=Math.max(X/f,350);C.forEach(c=>{E[c]=B})}return{...g,columns:b,columnPanels:k,columnWidths:E,isResizing:i?!1:g.isResizing,resizingColumn:i?null:g.resizingColumn}})},[s]),Z=t.useCallback(()=>{D(s,1,"カラム自動バランス調整"),d(f=>{const g=[];for(const C of Object.keys(f.columnPanels))for(const i of f.columnPanels[C])g.push(i);const y={};for(const C of f.columns)y[C.id]=[];let k=0;for(const C of g){const i=f.columns[k%f.columns.length].id;y[i].push(C),k+=1}return{...f,columnPanels:y}})},[s]),N=t.useCallback(f=>r.columns.find(g=>g.id===f),[r.columns]),G=t.useCallback(()=>{let f=0;for(const g of Object.values(r.columnWidths))f+=g;return f},[r.columnWidths]),I=t.useCallback(f=>document.querySelector(`[data-column-id="${f}"]`),[]),K=t.useCallback(f=>{d(g=>({...g,showInsertPlaceholders:f}))},[]);return{layoutState:r,addColumn:v,removeColumn:S,moveColumn:j,startResize:A,handleResize:T,endResize:o,setColumnWidth:w,resetColumnWidths:P,movePanel:h,addPanel:O,removePanel:H,updateColumnCount:V,autoBalanceColumns:Z,getColumnById:N,getTotalWidth:G,getColumnElement:I,setShowInsertPlaceholders:K}},ce={triggerDistance:80,scrollSpeed:5,maxScrollSpeed:20},ge=(n,l,s=ce,a)=>{const{triggerDistance:r,scrollSpeed:d,maxScrollSpeed:m}=s;let u;a?u=a.getBoundingClientRect():u=new DOMRect(0,0,window.innerWidth,window.innerHeight);const{left:v,top:S,right:j,bottom:A}=u;let T=0,o=0;if(n>=v&&n<=j&&l>=S&&l<=A){if(n<v+r){const w=Math.max(0,(v+r-n)/r);T=-Math.min(m,d+w*(m-d))}else if(n>j-r){const w=Math.max(0,(n-(j-r))/r);T=Math.min(m,d+w*(m-d))}if(l<S+r){const w=Math.max(0,(S+r-l)/r);o=-Math.min(m,d+w*(m-d))}else if(l>A-r){const w=Math.max(0,(l-(A-r))/r);o=Math.min(m,d+w*(m-d))}}return{x:T,y:o}},Ce=(n,l)=>{(n.x!==0||n.y!==0)&&(l?l.scrollBy(n.x,n.y):window.scrollBy(n.x,n.y))};class xe{constructor(l=ce,s){this.intervalId=null,this.isActive=!1,this.config=l,this.scrollElement=s}setScrollElement(l){this.scrollElement=l}start(l,s){this.isActive||(this.isActive=!0,this.intervalId=window.setInterval(()=>{const a=ge(l,s,this.config,this.scrollElement);Ce(a,this.scrollElement)},16))}update(l,s){const a=ge(l,s,this.config,this.scrollElement);(a.x!==0||a.y!==0)&&!this.isActive?this.start(l,s):a.x===0&&a.y===0&&this.isActive&&this.stop()}stop(){this.intervalId!==null&&(clearInterval(this.intervalId),this.intervalId=null),this.isActive=!1}isScrolling(){return this.isActive}updateConfig(l){this.config=l}}const Pe=({debugConfig:n,dragState:l,customDrag:s,clickState:a,dragModes:r,isMouseDown:d,dragOverPosition:m,setCustomDrag:u,setDragState:v,setDragOverPosition:S,setOriginalPanelPosition:j,setClickState:A,setIsMouseDown:T,findPanelPosition:o,performPanelMove:w,showMousePosition:P,updateMousePosition:h,recordMouseDown:O,recordClickPosition:H,isVirtualClick:V,calculateMoveDistance:Z,clearMouseTracking:N,resetDragState:G,resetClickState:I,createDragImage:K,updateDragImagePosition:f,removeDragImage:g,handlePlaceholderDragEnter:y,handlePlaceholderDragLeave:k})=>{const C=t.useRef(n);C.current=n;const i=t.useRef(null),b=t.useRef(null),E=t.useRef(0),M=t.useRef(new xe(ce));t.useEffect(()=>{const p=document.querySelector("main.max-w-full.flex-1.overflow-auto");p&&M.current.setScrollElement(p)},[]);const Y=t.useRef(m);t.useEffect(()=>{Y.current=m,D(C.current,2,"dragOverPositionRef更新:",m)},[m]);const X=t.useCallback(p=>{if(s.isActive||a.isClicked){p.preventDefault();const R=window.getSelection();R&&R.rangeCount>0&&R.removeAllRanges()}if(s.isActive){h(p.clientX,p.clientY),f(p.clientX,p.clientY),M.current.update(p.clientX,p.clientY);const R=document.elementFromPoint(p.clientX,p.clientY),U=R?.closest("[data-drop-zone]");if(U){document.body.classList.add("droppable");const x=U.getAttribute("data-column-index"),F=x?parseInt(x):null;F!==null&&F!==l.dragOverColumn&&v(J=>({...J,dragOverColumn:F}));const _=R?.closest("[data-placeholder-index]");if(_){const J=_.getAttribute("data-placeholder-index"),q=_.getAttribute("data-placeholder-column");if(J&&q){const z=parseInt(J),Q=parseInt(q);y(Q,z)}}else k()}else document.body.classList.remove("droppable"),S(null),v(x=>({...x,dragOverColumn:null}))}else if(d&&a.isClicked&&a.panelId){if(r[a.panelId]!=="custom"||Z(p.clientX,p.clientY)<10)return;D(C.current,1,"🚀 カスタムドラッグ開始 -",a.panelId);const U=document.querySelector(`[data-panel-id="${a.panelId}"]`);if(U&&b.current){const x=U.getBoundingClientRect(),F=b.current.x-x.left,_=b.current.y-x.top;K(a.panelId,F,_),document.body.classList.add("custom-dragging"),u({isActive:!0,panelId:a.panelId,startX:F,startY:_})}v({isDragging:!0,draggedPanel:a.panelId,dragOverColumn:null}),j(o(a.panelId)),P(p.clientX,p.clientY),A({isClicked:!1,panelId:null}),T(!1),N(),b.current=null,i.current&&(clearTimeout(i.current),i.current=null)}},[s.isActive,a,l.dragOverColumn,r,d,h,v,S,Z,o,u,j,P,A,T,N,K,f,y,k]),B=t.useCallback(p=>{if(D(C.current,1,"🐭 カスタムドラッグハンドラー - グローバルマウスアップ",{isActive:s.isActive,panelId:s.panelId,dragMode:s.panelId?r[s.panelId]:"unknown"}),s.isActive){M.current.stop();const R=Y.current;if(R){const x=document.elementFromPoint(p.clientX,p.clientY)?.closest("[data-drop-zone]");if(x){const F=x.getAttribute("data-column-key");F&&r[s.panelId]==="custom"?(D(C.current,1,"🔄 カスタムドラッグパネル移動実行:",s.panelId,"→",F),w(s.panelId,F,R.insertIndex)):D(C.current,1,"🚫 カスタムドラッグパネル移動スキップ:",s.panelId,"モード:",r[s.panelId])}}g(),document.body.classList.remove("custom-dragging","droppable"),G(),E.current=0}else if(V(p.clientX,p.clientY)){const U=document.elementFromPoint(p.clientX,p.clientY)?.closest("[data-panel-id]"),x=U?.getAttribute("data-panel-id")??null;if(!U||!x||r[x]!=="custom"){i.current&&(clearTimeout(i.current),i.current=null),I(),b.current=null,E.current=0;return}E.current+=1,a.isClicked===!1&&E.current===1?(D(C.current,1,"🖱️ 仮想クリック検出 - ドラッグ待機状態へ:",x),A({isClicked:!0,panelId:x}),i.current=window.setTimeout(()=>{D(C.current,1,"⏳ クリック待機状態を自動解除:",x),I(),b.current=null,E.current=0},2e3)):(D(C.current,1,"🚫 クリック待機状態を解除 - 仮想クリック検出停止:",x),i.current&&(clearTimeout(i.current),i.current=null),I(),b.current=null,E.current=0,i.current=window.setTimeout(()=>{D(C.current,1,"⏳ 仮想クリック検出再開:",x)},2e3))}else a.isClicked&&(I(),b.current=null,E.current=0);d&&T(!1)},[s.isActive,s.panelId,a,r,d,w,G,I,V,A,T,g]),c=t.useCallback((p,R)=>{if(r[R]!=="custom"){D(C.current,1,"🚫 カスタムドラッグモードではない - スキップ:",R);return}O(p.clientX,p.clientY),a.isClicked&&a.panelId===R&&(T(!0),i.current!==null&&(clearTimeout(i.current),i.current=null),H(p.clientX,p.clientY),b.current={x:p.clientX,y:p.clientY})},[a,r,O,T,H]);return t.useEffect(()=>()=>{i.current!==null&&clearTimeout(i.current),M.current.stop()},[]),{handleGlobalMouseMove:X,handleGlobalMouseUp:B,handleMouseDown:c}},ke=()=>{const[n,l]=t.useState({x:0,y:0,isVisible:!1}),s=t.useRef(null),a=t.useRef(0),r=t.useRef(null),d=t.useCallback((o,w)=>{l({x:o,y:w,isVisible:!0})},[]),m=t.useCallback(()=>{l(o=>({...o,isVisible:!1}))},[]),u=t.useCallback((o,w)=>{l(P=>P.x===o&&P.y===w?P:{x:o,y:w,isVisible:P.isVisible})},[]),v=t.useCallback((o,w)=>{a.current=Date.now(),r.current={x:o,y:w}},[]),S=t.useCallback((o,w)=>{s.current={x:o,y:w}},[]),j=t.useCallback((o,w,P=500,h=5)=>Date.now()-(a.current||0)>=P||!r.current?!1:Math.sqrt((o-r.current.x)**2+(w-r.current.y)**2)<h,[]),A=t.useCallback((o,w)=>{if(!s.current)return 0;const P=Math.abs(o-s.current.x),h=Math.abs(w-s.current.y);return Math.sqrt(P*P+h*h)},[]),T=t.useCallback(()=>{s.current=null,a.current=0,r.current=null},[]);return{mousePosition:n,lastClickPosition:s.current,mouseDownTime:a.current,mouseDownPosition:r.current,showMousePosition:d,hideMousePosition:m,updateMousePosition:u,recordMouseDown:v,recordClickPosition:S,isVirtualClick:j,calculateMoveDistance:A,clearMouseTracking:T}},De=()=>{const[n,l]=t.useState({isDragging:!1,draggedPanel:null,dragOverColumn:null}),[s,a]=t.useState(null),[r,d]=t.useState(null),[m,u]=t.useState({isActive:!1,panelId:"",startX:0,startY:0}),[v,S]=t.useState({isClicked:!1,panelId:null}),[j,A]=t.useState({isTouchDragging:!1,startX:0,startY:0,currentX:0,currentY:0,draggedElement:null}),[T,o]=t.useState(!1),w=t.useCallback(()=>{u({isActive:!1,panelId:"",startX:0,startY:0}),l({isDragging:!1,draggedPanel:null,dragOverColumn:null}),a(null),d(null)},[]),P=t.useCallback(()=>{S({isClicked:!1,panelId:null}),o(!1)},[]),h=t.useCallback(I=>{l(I)},[]),O=t.useCallback(I=>{a(I)},[]),H=t.useCallback(I=>{d(I)},[]),V=t.useCallback(I=>{u(I)},[]),Z=t.useCallback(I=>{S(I)},[]),N=t.useCallback(I=>{A(I)},[]),G=t.useCallback(I=>{o(I)},[]);return{dragState:n,dragOverPosition:s,originalPanelPosition:r,customDrag:m,clickState:v,touchDragState:j,isMouseDown:T,setDragState:h,setDragOverPosition:O,setOriginalPanelPosition:H,setCustomDrag:V,setClickState:Z,setTouchDragState:N,setIsMouseDown:G,resetDragState:w,resetClickState:P}},Ee=({debugConfig:n,dragState:l,customDrag:s,dragModes:a,columnPanels:r,dragOverPosition:d,originalPanelPosition:m,setDragState:u,setDragOverPosition:v,setOriginalPanelPosition:S,performPanelMove:j,showMousePosition:A,updateMousePosition:T,resetDragState:o,handlePlaceholderDragEnter:w,handlePlaceholderDragLeave:P})=>{const h=t.useRef(n);h.current=n;const O=t.useRef(r);O.current=r;const H=t.useRef(l);H.current=l;const V=t.useRef(d);V.current=d;const Z=t.useRef(m);Z.current=m;const N=t.useRef(new xe(ce));t.useEffect(()=>{const y=document.querySelector("main.max-w-full.flex-1.overflow-auto");y&&N.current.setScrollElement(y)},[]);const G=t.useCallback((y,k)=>{if(s.isActive){D(h.current,2,"カスタムドラッグアクティブ中 - 通常ドラッグを無効化:",k),y.preventDefault();return}if(a[k]==="custom"){D(h.current,2,"カスタムドラッグモード - 通常ドラッグを無効化:",k),y.preventDefault();return}D(h.current,1,"ドラッグ開始:",k);const C=Object.keys(O.current);let i=null;for(let b=0;b<C.length;b++){const E=C[b],M=O.current[E].indexOf(k);if(M!==-1){i={columnIndex:b,panelIndex:M};break}}S(i),y.dataTransfer&&(y.dataTransfer.setData("text/plain",k),y.dataTransfer.effectAllowed="move"),A(y.clientX,y.clientY),requestAnimationFrame(()=>{u({isDragging:!0,draggedPanel:k,dragOverColumn:null})})},[a,s.isActive,S,A,u]),I=t.useCallback(()=>{D(h.current,1,"ドラッグ終了"),N.current.stop(),o()},[o]),K=t.useCallback((y,k)=>{if(y.preventDefault(),y.dataTransfer.dropEffect="move",!H.current.isDragging)return;T(y.clientX,y.clientY),k!==H.current.dragOverColumn&&u(b=>({...b,dragOverColumn:k}));const C=document.elementFromPoint(y.clientX,y.clientY),i=C?.closest("[data-placeholder-index]");if(i){const b=i.getAttribute("data-placeholder-index"),E=i.getAttribute("data-placeholder-column");if(b&&E){const M=parseInt(b),Y=parseInt(E);w(Y,M)}}else C?.closest("[data-drop-zone]")||P()},[T,u,w,P]),f=t.useCallback((y,k)=>{y.preventDefault();const C=y.dataTransfer.getData("text/plain"),i=V.current;C&&i&&(D(h.current,1,"🎯 ドロップ完了:",{draggedPanel:C,targetColumn:k,insertPosition:`カラム${i.columnIndex} - 位置${i.insertIndex}`}),j(C,k,i.insertIndex),v(null),I())},[j,v,I]),g=t.useCallback(y=>{const k=y.currentTarget,C=y.relatedTarget;C&&k.contains(C)||(v(null),u(i=>({...i,dragOverColumn:null})))},[v,u]);return t.useEffect(()=>{const y=k=>{H.current.isDragging&&(T(k.clientX,k.clientY),N.current.update(k.clientX,k.clientY))};if(l.isDragging)return document.addEventListener("dragover",y),()=>{document.removeEventListener("dragover",y),N.current.stop()}},[l.isDragging,T]),t.useEffect(()=>()=>{N.current.stop()},[]),{handleDragStart:G,handleDragEnd:I,handleDragOverWithInsert:K,handleDropWithInsert:f,handleColumnDragLeave:g}},Ne=n=>{const[l,s]=t.useState(n),[a,r]=t.useState({}),d=t.useRef({}),m=t.useRef(null),u=t.useRef({x:0,y:0}),v=t.useCallback(h=>document.querySelector(`[data-panel-id="${h}"]`),[]),S=t.useCallback((h,O)=>{const H=O.getBoundingClientRect(),V=window.getComputedStyle(O),Z={width:Math.round(H.width),height:Math.round(H.height),x:Math.round(H.left),y:Math.round(H.top),minHeight:V.minHeight||"auto",maxHeight:V.maxHeight||"none"},N=d.current[h];(!N||Object.keys(Z).some(G=>N[G]!==Z[G]))&&(d.current[h]=Z,r(G=>({...G,[h]:Z})))},[]),j=t.useCallback(h=>{const O=v(h);O&&S(h,O)},[v,S]),A=t.useCallback((h,O)=>{O&&requestAnimationFrame(()=>S(h,O))},[S]),T=t.useCallback((h,O,H)=>{const V=v(h);if(!V||m.current)return;const Z=V.getBoundingClientRect(),N=V.cloneNode(!0);N.style.position="fixed",N.style.top="0px",N.style.left="0px",N.style.width=`${Z.width}px`,N.style.height=`${Z.height}px`,N.style.pointerEvents="none",N.style.zIndex="1000",N.style.opacity="0.5",N.style.margin="0",N.style.transition="none",N.style.boxShadow="0 8px 32px rgba(0,0,0,0.3)",N.style.transform=`translate(${Z.left}px, ${Z.top}px)`,N.id=`drag-image-${h}`,document.body.appendChild(N),m.current=N,u.current={x:O,y:H}},[v]),o=t.useCallback((h,O)=>{if(m.current){const H=h-u.current.x,V=O-u.current.y;m.current.style.transform=`translate(${H}px, ${V}px) scale(1.05)`}},[]),w=t.useCallback(()=>{m.current&&(m.current.remove(),m.current=null)},[]),P=t.useCallback(h=>{s(O=>({...O,[h]:!O[h]}))},[]);return{panelVisibility:l,panelSizes:a,setPanelVisibility:s,setPanelSizes:r,setPanelRef:A,updatePanelSize:j,togglePanelVisibility:P,getPanelElement:v,createDragImage:T,updateDragImagePosition:o,removeDragImage:w}},Ie=({minColumnWidth:n=350,defaultColumns:l=3,maxColumns:s=6,minColumns:a=1,currentColumnWidths:r={}}={})=>{const[d,m]=t.useState(0),u=t.useRef(0),v=t.useRef(null),[S,j]=t.useState(!1),A=t.useRef(l);t.useEffect(()=>{if(typeof window>"u")return;const w=()=>{const h=window.visualViewport?.width??0,O=document?.documentElement?.clientWidth??0,H=document?.body?.clientWidth??0,V=window.innerWidth??0;return O>0?Math.floor(O):h>0?Math.floor(h):H>0?Math.floor(H):Math.floor(V)},P=()=>{v.current!==null&&cancelAnimationFrame(v.current),v.current=requestAnimationFrame(()=>{const h=w();v.current=null,h!==0&&(Math.abs(u.current-h)<2||(u.current=h,m(h)))})};return P(),window.addEventListener("resize",P),window.addEventListener("orientationchange",P),window.visualViewport?.addEventListener("resize",P),()=>{v.current!==null&&cancelAnimationFrame(v.current),window.removeEventListener("resize",P),window.removeEventListener("orientationchange",P),window.visualViewport?.removeEventListener("resize",P)}},[]);const T=t.useMemo(()=>{if(!S||d===0)return A.current=l,l;const w=Math.max(d-64,0),P=24,h=Object.values(r);let O;if(h.length>0){const H=h.reduce((N,G)=>N+G,0)/h.length,V=Math.max(n,H);O=Math.floor((w+P)/(V+P)),h.reduce((N,G)=>N+G,0)+(h.length-1)*P>w&&h.length>a&&(O=Math.min(O,h.length-1))}else O=Math.floor((w+P)/(n+P));return O=Math.max(a,Math.min(s,O)),A.current===O?A.current:(A.current=O,O)},[S,d,l,n,s,a,r]),o=t.useCallback(()=>{j(w=>!w)},[]);return{responsiveColumnCount:T,isResponsiveMode:S,screenWidth:d,toggleResponsiveMode:o}},He=({initialColumnPanels:n,initialPanelVisibility:l,initialDragModes:s={},debugConfig:a,onPanelMove:r,onDragModeChange:d,onColumnPanelsChange:m})=>{const u=t.useRef(a);u.current=a;const[v,S]=t.useState(n),[j,A]=t.useState(s),T=t.useRef(v);T.current=v;const o=De(),w=ke(),P=Ne(l),h=t.useRef({mousemove:null,mouseup:null}),O=t.useCallback(i=>{const b=Object.keys(T.current),E=we(b,ee);for(let M=0;M<E.length;M++){const Y=E[M],X=T.current[Y]?.indexOf(i)??-1;if(X!==-1)return{columnIndex:M,panelIndex:X}}return null},[]),H=t.useCallback((i,b,E)=>{D(u.current,1,"🔄 パネル移動実行:",i,"→",b,"@",E),S(M=>{const Y={...M},X=Object.keys(Y).find(B=>Y[B].includes(i));if(!X)return console.error("Source column not found for panel:",i),M;if(!Y[b])return console.error("Target column not found:",b),M;if(X===b){const B=[...Y[X]],c=B.indexOf(i),[p]=B.splice(c,1),R=c<E?E-1:E;B.splice(R,0,p),Y[b]=B}else{Y[X]=Y[X].filter(c=>c!==i);const B=[...Y[b]];B.splice(E,0,i),Y[b]=B}if(D(u.current,1,"✅ パネル移動完了:",i,"→",b),m&&requestAnimationFrame(()=>{m(Y)}),r){const B=Object.keys(M).find(c=>M[c].includes(i));B&&requestAnimationFrame(()=>{r(i,B,b,E)})}return Y})},[m,r]),V=t.useCallback((i,b)=>{if(!o.dragState.isDragging&&!o.customDrag.isActive)return;const E=o.originalPanelPosition;if(E&&E.columnIndex===i&&(E.panelIndex===b||E.panelIndex+1===b)){D(u.current,1,`元の位置への挿入をスキップ: カラム${i}, 位置${b}`);return}const M=o.dragOverPosition;(!M||M.columnIndex!==i||M.insertIndex!==b)&&(D(u.current,1,`プレースホルダーエンター: カラム${i}, 位置${b}`),o.setDragOverPosition({columnIndex:i,insertIndex:b}),o.setDragState(Y=>({...Y,dragOverColumn:i})))},[o]),Z=t.useCallback((i,b,E)=>{if(!(!o.dragState.isDragging&&!o.customDrag.isActive)){if(o.customDrag.isActive)D(u.current,1,"🚫 カスタムドラッグ - プレースホルダーリーブ: ハイライトを解除します。"),o.setDragOverPosition(null);else if(o.dragState.isDragging&&i&&b!==void 0&&E!==void 0){const M=o.dragOverPosition;if(M&&M.columnIndex===b&&M.insertIndex===E){const Y=i.currentTarget,X=i.relatedTarget;X&&Y.contains(X)||(D(u.current,1,`ノーマルドラッグ - プレースホルダーリーブ: カラム${b}, 位置${E}。ハイライトを解除します。`),o.setDragOverPosition(null))}}}},[o]),N=Pe({debugConfig:u.current,dragState:o.dragState,customDrag:o.customDrag,clickState:o.clickState,dragModes:j,isMouseDown:o.isMouseDown,originalPanelPosition:o.originalPanelPosition,dragOverPosition:o.dragOverPosition,setCustomDrag:o.setCustomDrag,setDragState:o.setDragState,setDragOverPosition:o.setDragOverPosition,setOriginalPanelPosition:o.setOriginalPanelPosition,setClickState:o.setClickState,setIsMouseDown:o.setIsMouseDown,findPanelPosition:O,performPanelMove:H,showMousePosition:w.showMousePosition,updateMousePosition:w.updateMousePosition,recordMouseDown:w.recordMouseDown,recordClickPosition:w.recordClickPosition,isVirtualClick:w.isVirtualClick,calculateMoveDistance:w.calculateMoveDistance,clearMouseTracking:w.clearMouseTracking,resetDragState:o.resetDragState,resetClickState:o.resetClickState,createDragImage:P.createDragImage,updateDragImagePosition:P.updateDragImagePosition,removeDragImage:P.removeDragImage,handlePlaceholderDragEnter:V,handlePlaceholderDragLeave:Z}),G=Ee({debugConfig:u.current,dragState:o.dragState,customDrag:o.customDrag,dragModes:j,columnPanels:v,dragOverPosition:o.dragOverPosition,originalPanelPosition:o.originalPanelPosition,setDragState:o.setDragState,setDragOverPosition:o.setDragOverPosition,setOriginalPanelPosition:o.setOriginalPanelPosition,performPanelMove:H,showMousePosition:w.showMousePosition,updateMousePosition:w.updateMousePosition,resetDragState:o.resetDragState,handlePlaceholderDragEnter:V,handlePlaceholderDragLeave:Z}),I=t.useCallback(i=>{h.current.mousemove&&h.current.mousemove(i)},[]),K=t.useCallback(i=>{h.current.mouseup&&h.current.mouseup(i)},[]);t.useEffect(()=>(D(u.current,1,"🔧 グローバルイベントリスナー初期化 - refベース管理開始"),document.addEventListener("mousemove",I),document.addEventListener("mouseup",K),()=>{D(u.current,1,"🔴 グローバルイベントリスナー終了 - refベース管理終了"),document.removeEventListener("mousemove",I),document.removeEventListener("mouseup",K)}),[I,K]),t.useEffect(()=>{const i=!o.clickState.isClicked&&Object.entries(j).some(([,E])=>E==="custom"),b=o.clickState.isClicked&&o.clickState.panelId;if(i||b){const E=i?"パターン1（仮想クリック検出）":"パターン2,3（ドラッグ準備）";D(u.current,1,`🔧 イベントハンドラー設定開始: ${E}`),h.current.mousemove=N.handleGlobalMouseMove,h.current.mouseup=N.handleGlobalMouseUp}else o.customDrag.isActive||o.dragState.isDragging||(h.current.mousemove=null,h.current.mouseup=null)},[o.clickState.isClicked,o.clickState.panelId,j,o.customDrag.isActive,o.dragState.isDragging,N.handleGlobalMouseMove,N.handleGlobalMouseUp]);const f=t.useCallback((i,b)=>{const E=i.touches[0],M=i.currentTarget;o.setTouchDragState({isTouchDragging:!0,startX:E.clientX,startY:E.clientY,currentX:E.clientX,currentY:E.clientY,draggedElement:M}),o.setDragState({isDragging:!0,draggedPanel:b,dragOverColumn:null})},[o]),g=t.useCallback(i=>{if(!o.touchDragState.isTouchDragging)return;i.preventDefault();const b=i.touches[0];o.setTouchDragState(E=>({...E,currentX:b.clientX,currentY:b.clientY}))},[o.touchDragState.isTouchDragging,o]),y=t.useCallback(i=>{o.touchDragState.isTouchDragging&&(o.setTouchDragState({isTouchDragging:!1,startX:0,startY:0,currentX:0,currentY:0,draggedElement:null}),G.handleDragEnd())},[o.touchDragState.isTouchDragging,o,G]),k=t.useCallback(i=>{D(u.current,1,"🔄 toggleDragMode called:",{panelId:i}),A(b=>{const M=(b[i]||"normal")==="normal"?"custom":"normal",Y={...b,[i]:M};if(d)try{d(i,M)}catch(X){console.error("🔄 Error in onDragModeChange:",X)}return Y})},[d]),C=t.useCallback((i,b)=>{i.stopPropagation(),D(u.current,2,"パネルサイズ情報クリック:",b)},[]);return{columnPanels:v,panelVisibility:P.panelVisibility,dragModes:j,dragState:o.dragState,dragOverPosition:o.dragOverPosition,originalPanelPosition:o.originalPanelPosition,touchDragState:o.touchDragState,customDrag:o.customDrag,clickState:o.clickState,mousePosition:w.mousePosition,panelSizes:P.panelSizes,setColumnPanels:S,setPanelVisibility:P.setPanelVisibility,setDragModes:A,setPanelRef:P.setPanelRef,handleDragStart:G.handleDragStart,handleDragEnd:G.handleDragEnd,handleMouseDown:N.handleMouseDown,handleTouchStart:f,handleTouchMove:g,handleTouchEnd:y,handlePlaceholderDragEnter:V,handlePlaceholderDragLeave:Z,handleDragOverWithInsert:G.handleDragOverWithInsert,handleDropWithInsert:G.handleDropWithInsert,handleColumnDragLeave:G.handleColumnDragLeave,handlePanelSizeInfoClick:C,toggleDragMode:k,findPanelPosition:O}},Ue={showDebugPanel:!1,showMousePosition:!1,showPanelSizes:!1,showPlaceholderInfo:!1,showDropZoneOutlines:!1,logLevel:0};L.ColumnControlPanel=Me,L.ColumnInsertPanel=_e,L.DEFAULT_COLUMN_ID_CONFIG=ee,L.DEFAULT_DEBUG_CONFIG=Ue,L.DEFAULT_EDGE_SCROLL_CONFIG=ce,L.DebugControlPanel=Le,L.DragDropLayout=Ae,L.DropZoneDebugOverlay=de,L.EdgeScrollManager=xe,L.InsertPlaceholder=ue,L.PanelSizeDisplay=ye,L.ResizableColumn=Re,L.ResizeHandle=me,L.ResponsiveControl=We,L.calculateScrollVector=ge,L.createColumnIdMapping=Fe,L.debugLog=D,L.generateColumnId=le,L.generateColumnIds=fe,L.getNextColumnId=Ye,L.isValidColumnId=ze,L.normalizeColumnPanels=je,L.parseColumnId=ae,L.performScroll=Ce,L.sortColumnIds=we,L.useColumnLayout=Xe,L.useCustomDragHandlers=Pe,L.useDragDropColumns=He,L.useDragDropState=De,L.useMouseTracking=ke,L.useNormalDragHandlers=Ee,L.usePanelManagement=Ne,L.useResponsiveColumns=Ie,Object.defineProperty(L,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -0,0 +1,69 @@
+{
+    "name": "@aiquants/drag-drop-panels",
+    "version": "0.2.0",
+    "description": "Reusable drag-and-drop panel layout components and utilities",
+    "keywords": [
+        "react",
+        "drag-drop",
+        "panels",
+        "layout",
+        "component",
+        "ui"
+    ],
+    "author": {
+        "name": "fehde-k",
+        "url": "https://x.com/fehdek"
+    },
+    "license": "MIT",
+    "main": "dist/index.umd.js",
+    "module": "dist/index.es.js",
+    "types": "dist/index.d.ts",
+    "exports": {
+        ".": {
+            "types": "./dist/index.d.ts",
+            "import": "./dist/index.es.js",
+            "require": "./dist/index.umd.js"
+        },
+        "./css": "./dist/drag-drop-panels.css"
+    },
+    "files": [
+        "dist",
+        "README.md"
+    ],
+    "scripts": {
+        "build": "vite build",
+        "dev": "vite build --watch",
+        "typecheck": "tsc --noEmit",
+        "license-check": "pnpm dlx license-checker --production --onlyAllow \"MIT;Apache-2.0;BSD-2-Clause;BSD-3-Clause;ISC;Unlicense\"",
+        "license-check:json": "pnpm dlx license-checker --production --onlyAllow \"MIT;Apache-2.0;BSD-2-Clause;BSD-3-Clause;ISC;Unlicense\" --json",
+        "clean": "rimraf dist",
+        "prepublishOnly": "npm run clean && npm run typecheck && npm run test --if-present && npm run build",
+        "publish:patch": "npm version patch && npm publish",
+        "publish:minor": "npm version minor && npm publish",
+        "publish:major": "npm version major && npm publish"
+    },
+    "engines": {
+        "node": ">=18.0.0",
+        "npm": ">=8.0.0"
+    },
+    "peerDependencies": {
+        "react": "^19.1.0",
+        "react-dom": "^19.1.0"
+    },
+    "devDependencies": {
+        "@types/react": "^19.2.2",
+        "@types/react-dom": "^19.2.2",
+        "@vitejs/plugin-react": "^4.7.0",
+        "lucide-react": "^0.544.0",
+        "react": "^19.2.0",
+        "react-dom": "^19.2.0",
+        "rimraf": "^6.0.1",
+        "typescript": "^5.9.3",
+        "vite": "^7.1.12",
+        "vite-plugin-dts": "^3.9.1",
+        "vite-tsconfig-paths": "^5.1.4"
+    },
+    "publishConfig": {
+        "access": "public"
+    }
+}