@aiquants/drag-drop-panels 0.8.5 → 0.9.1

package/dist/index.es.js

@@ -1,276 +1,276 @@
-import qe, { forwardRef as Ie, createElement as Ee, useRef as F, useState as te, useEffect as K, useLayoutEffect as Se, useCallback as w, memo as st, useMemo as Ue, Fragment as ot } from "react";
-var we = { exports: {} }, pe = {};
-var We;
-function at() {
-  if (We) return pe;
-  We = 1;
-  var r = /* @__PURE__ */ Symbol.for("react.transitional.element"), e = /* @__PURE__ */ Symbol.for("react.fragment");
-  function n(s, o, i) {
-    var u = null;
-    if (i !== void 0 && (u = "" + i), o.key !== void 0 && (u = "" + o.key), "key" in o) {
-      i = {};
-      for (var c in o)
-        c !== "key" && (i[c] = o[c]);
-    } else i = o;
-    return o = i.ref, {
-      $$typeof: r,
-      type: s,
-      key: u,
-      ref: o !== void 0 ? o : null,
-      props: i
+import qt, { forwardRef as Wt, createElement as Ge, useRef as I, useState as se, useEffect as oe, useLayoutEffect as we, memo as mn, useMemo as Le, useId as fn, useCallback as k, Fragment as pn } from "react";
+var _e = { exports: {} }, Ne = {};
+var kt;
+function gn() {
+  if (kt) return Ne;
+  kt = 1;
+  var t = /* @__PURE__ */ Symbol.for("react.transitional.element"), n = /* @__PURE__ */ Symbol.for("react.fragment");
+  function e(o, r, a) {
+    var i = null;
+    if (a !== void 0 && (i = "" + a), r.key !== void 0 && (i = "" + r.key), "key" in r) {
+      a = {};
+      for (var d in r)
+        d !== "key" && (a[d] = r[d]);
+    } else a = r;
+    return r = a.ref, {
+      $$typeof: t,
+      type: o,
+      key: i,
+      ref: r !== void 0 ? r : null,
+      props: a
     };
   }
-  return pe.Fragment = e, pe.jsx = n, pe.jsxs = n, pe;
+  return Ne.Fragment = n, Ne.jsx = e, Ne.jsxs = e, Ne;
 }
-var xe = {};
-var ze;
-function lt() {
-  return ze || (ze = 1, process.env.NODE_ENV !== "production" && (function() {
-    function r(a) {
-      if (a == null) return null;
-      if (typeof a == "function")
-        return a.$$typeof === C ? null : a.displayName || a.name || null;
-      if (typeof a == "string") return a;
-      switch (a) {
-        case k:
+var Oe = {};
+var Ct;
+function xn() {
+  return Ct || (Ct = 1, process.env.NODE_ENV !== "production" && (function() {
+    function t(u) {
+      if (u == null) return null;
+      if (typeof u == "function")
+        return u.$$typeof === $ ? null : u.displayName || u.name || null;
+      if (typeof u == "string") return u;
+      switch (u) {
+        case T:
           return "Fragment";
-        case R:
+        case P:
           return "Profiler";
-        case _:
+        case h:
           return "StrictMode";
-        case U:
+        case L:
           return "Suspense";
-        case $:
+        case B:
           return "SuspenseList";
         case x:
           return "Activity";
       }
-      if (typeof a == "object")
-        switch (typeof a.tag == "number" && console.error(
+      if (typeof u == "object")
+        switch (typeof u.tag == "number" && console.error(
           "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
-        ), a.$$typeof) {
-          case j:
+        ), u.$$typeof) {
+          case C:
             return "Portal";
-          case Z:
-            return a.displayName || "Context";
-          case z:
-            return (a._context.displayName || "Context") + ".Consumer";
-          case Y:
-            var d = a.render;
-            return a = a.displayName, a || (a = d.displayName || d.name || "", a = a !== "" ? "ForwardRef(" + a + ")" : "ForwardRef"), a;
-          case L:
-            return d = a.displayName || null, d !== null ? d : r(a.type) || "Memo";
-          case f:
-            d = a._payload, a = a._init;
+          case l:
+            return u.displayName || "Context";
+          case N:
+            return (u._context.displayName || "Context") + ".Consumer";
+          case _:
+            var f = u.render;
+            return u = u.displayName, u || (u = f.displayName || f.name || "", u = u !== "" ? "ForwardRef(" + u + ")" : "ForwardRef"), u;
+          case J:
+            return f = u.displayName || null, f !== null ? f : t(u.type) || "Memo";
+          case p:
+            f = u._payload, u = u._init;
             try {
-              return r(a(d));
+              return t(u(f));
             } catch {
             }
         }
       return null;
     }
-    function e(a) {
-      return "" + a;
+    function n(u) {
+      return "" + u;
     }
-    function n(a) {
+    function e(u) {
       try {
-        e(a);
-        var d = !1;
+        n(u);
+        var f = !1;
       } catch {
-        d = !0;
+        f = !0;
       }
-      if (d) {
-        d = console;
-        var S = d.error, X = typeof Symbol == "function" && Symbol.toStringTag && a[Symbol.toStringTag] || a.constructor.name || "Object";
+      if (f) {
+        f = console;
+        var S = f.error, U = typeof Symbol == "function" && Symbol.toStringTag && u[Symbol.toStringTag] || u.constructor.name || "Object";
         return S.call(
-          d,
+          f,
           "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
-          X
-        ), e(a);
+          U
+        ), n(u);
       }
     }
-    function s(a) {
-      if (a === k) return "<>";
-      if (typeof a == "object" && a !== null && a.$$typeof === f)
+    function o(u) {
+      if (u === T) return "<>";
+      if (typeof u == "object" && u !== null && u.$$typeof === p)
         return "<...>";
       try {
-        var d = r(a);
-        return d ? "<" + d + ">" : "<...>";
+        var f = t(u);
+        return f ? "<" + f + ">" : "<...>";
       } catch {
         return "<...>";
       }
     }
-    function o() {
-      var a = W.A;
-      return a === null ? null : a.getOwner();
+    function r() {
+      var u = W.A;
+      return u === null ? null : u.getOwner();
     }
-    function i() {
+    function a() {
       return Error("react-stack-top-frame");
     }
-    function u(a) {
-      if (p.call(a, "key")) {
-        var d = Object.getOwnPropertyDescriptor(a, "key").get;
-        if (d && d.isReactWarning) return !1;
+    function i(u) {
+      if (v.call(u, "key")) {
+        var f = Object.getOwnPropertyDescriptor(u, "key").get;
+        if (f && f.isReactWarning) return !1;
       }
-      return a.key !== void 0;
+      return u.key !== void 0;
     }
-    function c(a, d) {
+    function d(u, f) {
       function S() {
-        v || (v = !0, console.error(
+        D || (D = !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)",
-          d
+          f
         ));
       }
-      S.isReactWarning = !0, Object.defineProperty(a, "key", {
+      S.isReactWarning = !0, Object.defineProperty(u, "key", {
         get: S,
         configurable: !0
       });
     }
-    function h() {
-      var a = r(this.type);
-      return D[a] || (D[a] = !0, console.error(
+    function m() {
+      var u = t(this.type);
+      return R[u] || (R[u] = !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."
-      )), a = this.props.ref, a !== void 0 ? a : null;
+      )), u = this.props.ref, u !== void 0 ? u : null;
     }
-    function N(a, d, S, X, G, Q) {
-      var V = S.ref;
-      return a = {
-        $$typeof: l,
-        type: a,
-        key: d,
+    function w(u, f, S, U, K, ae) {
+      var G = S.ref;
+      return u = {
+        $$typeof: E,
+        type: u,
+        key: f,
         props: S,
-        _owner: X
-      }, (V !== void 0 ? V : null) !== null ? Object.defineProperty(a, "ref", {
+        _owner: U
+      }, (G !== void 0 ? G : null) !== null ? Object.defineProperty(u, "ref", {
         enumerable: !1,
-        get: h
-      }) : Object.defineProperty(a, "ref", { enumerable: !1, value: null }), a._store = {}, Object.defineProperty(a._store, "validated", {
+        get: m
+      }) : Object.defineProperty(u, "ref", { enumerable: !1, value: null }), u._store = {}, Object.defineProperty(u._store, "validated", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
         value: 0
-      }), Object.defineProperty(a, "_debugInfo", {
+      }), Object.defineProperty(u, "_debugInfo", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
         value: null
-      }), Object.defineProperty(a, "_debugStack", {
+      }), Object.defineProperty(u, "_debugStack", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: G
-      }), Object.defineProperty(a, "_debugTask", {
+        value: K
+      }), Object.defineProperty(u, "_debugTask", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: Q
-      }), Object.freeze && (Object.freeze(a.props), Object.freeze(a)), a;
+        value: ae
+      }), Object.freeze && (Object.freeze(u.props), Object.freeze(u)), u;
     }
-    function b(a, d, S, X, G, Q) {
-      var V = d.children;
-      if (V !== void 0)
-        if (X)
-          if (g(V)) {
-            for (X = 0; X < V.length; X++)
-              M(V[X]);
-            Object.freeze && Object.freeze(V);
+    function b(u, f, S, U, K, ae) {
+      var G = f.children;
+      if (G !== void 0)
+        if (U)
+          if (y(G)) {
+            for (U = 0; U < G.length; U++)
+              A(G[U]);
+            Object.freeze && Object.freeze(G);
           } 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 M(V);
-      if (p.call(d, "key")) {
-        V = r(a);
-        var re = Object.keys(d).filter(function(se) {
-          return se !== "key";
+        else A(G);
+      if (v.call(f, "key")) {
+        G = t(u);
+        var H = Object.keys(f).filter(function(ue) {
+          return ue !== "key";
         });
-        X = 0 < re.length ? "{key: someKey, " + re.join(": ..., ") + ": ...}" : "{key: someKey}", H[V + X] || (re = 0 < re.length ? "{" + re.join(": ..., ") + ": ...}" : "{}", console.error(
+        U = 0 < H.length ? "{key: someKey, " + H.join(": ..., ") + ": ...}" : "{key: someKey}", X[G + U] || (H = 0 < H.length ? "{" + H.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} />`,
-          X,
-          V,
-          re,
-          V
-        ), H[V + X] = !0);
+          U,
+          G,
+          H,
+          G
+        ), X[G + U] = !0);
       }
-      if (V = null, S !== void 0 && (n(S), V = "" + S), u(d) && (n(d.key), V = "" + d.key), "key" in d) {
+      if (G = null, S !== void 0 && (e(S), G = "" + S), i(f) && (e(f.key), G = "" + f.key), "key" in f) {
         S = {};
-        for (var ce in d)
-          ce !== "key" && (S[ce] = d[ce]);
-      } else S = d;
-      return V && c(
+        for (var ve in f)
+          ve !== "key" && (S[ve] = f[ve]);
+      } else S = f;
+      return G && d(
         S,
-        typeof a == "function" ? a.displayName || a.name || "Unknown" : a
-      ), N(
-        a,
-        V,
-        S,
-        o(),
+        typeof u == "function" ? u.displayName || u.name || "Unknown" : u
+      ), w(
+        u,
         G,
-        Q
+        S,
+        r(),
+        K,
+        ae
       );
     }
-    function M(a) {
-      T(a) ? a._store && (a._store.validated = 1) : typeof a == "object" && a !== null && a.$$typeof === f && (a._payload.status === "fulfilled" ? T(a._payload.value) && a._payload.value._store && (a._payload.value._store.validated = 1) : a._store && (a._store.validated = 1));
+    function A(u) {
+      q(u) ? u._store && (u._store.validated = 1) : typeof u == "object" && u !== null && u.$$typeof === p && (u._payload.status === "fulfilled" ? q(u._payload.value) && u._payload.value._store && (u._payload.value._store.validated = 1) : u._store && (u._store.validated = 1));
     }
-    function T(a) {
-      return typeof a == "object" && a !== null && a.$$typeof === l;
+    function q(u) {
+      return typeof u == "object" && u !== null && u.$$typeof === E;
     }
-    var y = qe, l = /* @__PURE__ */ Symbol.for("react.transitional.element"), j = /* @__PURE__ */ Symbol.for("react.portal"), k = /* @__PURE__ */ Symbol.for("react.fragment"), _ = /* @__PURE__ */ Symbol.for("react.strict_mode"), R = /* @__PURE__ */ Symbol.for("react.profiler"), z = /* @__PURE__ */ Symbol.for("react.consumer"), Z = /* @__PURE__ */ Symbol.for("react.context"), Y = /* @__PURE__ */ Symbol.for("react.forward_ref"), U = /* @__PURE__ */ Symbol.for("react.suspense"), $ = /* @__PURE__ */ Symbol.for("react.suspense_list"), L = /* @__PURE__ */ Symbol.for("react.memo"), f = /* @__PURE__ */ Symbol.for("react.lazy"), x = /* @__PURE__ */ Symbol.for("react.activity"), C = /* @__PURE__ */ Symbol.for("react.client.reference"), W = y.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, p = Object.prototype.hasOwnProperty, g = Array.isArray, m = console.createTask ? console.createTask : function() {
+    var j = qt, E = /* @__PURE__ */ Symbol.for("react.transitional.element"), C = /* @__PURE__ */ Symbol.for("react.portal"), T = /* @__PURE__ */ Symbol.for("react.fragment"), h = /* @__PURE__ */ Symbol.for("react.strict_mode"), P = /* @__PURE__ */ Symbol.for("react.profiler"), N = /* @__PURE__ */ Symbol.for("react.consumer"), l = /* @__PURE__ */ Symbol.for("react.context"), _ = /* @__PURE__ */ Symbol.for("react.forward_ref"), L = /* @__PURE__ */ Symbol.for("react.suspense"), B = /* @__PURE__ */ Symbol.for("react.suspense_list"), J = /* @__PURE__ */ Symbol.for("react.memo"), p = /* @__PURE__ */ Symbol.for("react.lazy"), x = /* @__PURE__ */ Symbol.for("react.activity"), $ = /* @__PURE__ */ Symbol.for("react.client.reference"), W = j.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, v = Object.prototype.hasOwnProperty, y = Array.isArray, g = console.createTask ? console.createTask : function() {
       return null;
     };
-    y = {
-      react_stack_bottom_frame: function(a) {
-        return a();
+    j = {
+      react_stack_bottom_frame: function(u) {
+        return u();
       }
     };
-    var v, D = {}, A = y.react_stack_bottom_frame.bind(
-      y,
-      i
-    )(), O = m(s(i)), H = {};
-    xe.Fragment = k, xe.jsx = function(a, d, S) {
-      var X = 1e4 > W.recentlyCreatedOwnerStacks++;
+    var D, R = {}, Y = j.react_stack_bottom_frame.bind(
+      j,
+      a
+    )(), F = g(o(a)), X = {};
+    Oe.Fragment = T, Oe.jsx = function(u, f, S) {
+      var U = 1e4 > W.recentlyCreatedOwnerStacks++;
       return b(
-        a,
-        d,
+        u,
+        f,
         S,
         !1,
-        X ? Error("react-stack-top-frame") : A,
-        X ? m(s(a)) : O
+        U ? Error("react-stack-top-frame") : Y,
+        U ? g(o(u)) : F
       );
-    }, xe.jsxs = function(a, d, S) {
-      var X = 1e4 > W.recentlyCreatedOwnerStacks++;
+    }, Oe.jsxs = function(u, f, S) {
+      var U = 1e4 > W.recentlyCreatedOwnerStacks++;
       return b(
-        a,
-        d,
+        u,
+        f,
         S,
         !0,
-        X ? Error("react-stack-top-frame") : A,
-        X ? m(s(a)) : O
+        U ? Error("react-stack-top-frame") : Y,
+        U ? g(o(u)) : F
       );
     };
-  })()), xe;
+  })()), Oe;
 }
-var Ye;
-function it() {
-  return Ye || (Ye = 1, process.env.NODE_ENV === "production" ? we.exports = at() : we.exports = lt()), we.exports;
+var Nt;
+function vn() {
+  return Nt || (Nt = 1, process.env.NODE_ENV === "production" ? _e.exports = gn() : _e.exports = xn()), _e.exports;
 }
-var t = it();
-const ct = (r) => r.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), ut = (r) => r.replace(
+var s = vn();
+const bn = (t) => t.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), yn = (t) => t.replace(
   /^([A-Z])|[\s-_]+(\w)/g,
-  (e, n, s) => s ? s.toUpperCase() : n.toLowerCase()
-), Fe = (r) => {
-  const e = ut(r);
-  return e.charAt(0).toUpperCase() + e.slice(1);
-}, Be = (...r) => r.filter((e, n, s) => !!e && e.trim() !== "" && s.indexOf(e) === n).join(" ").trim(), dt = (r) => {
-  for (const e in r)
-    if (e.startsWith("aria-") || e === "role" || e === "title")
+  (n, e, o) => o ? o.toUpperCase() : e.toLowerCase()
+), Ot = (t) => {
+  const n = yn(t);
+  return n.charAt(0).toUpperCase() + n.slice(1);
+}, Ht = (...t) => t.filter((n, e, o) => !!n && n.trim() !== "" && o.indexOf(n) === e).join(" ").trim(), wn = (t) => {
+  for (const n in t)
+    if (n.startsWith("aria-") || n === "role" || n === "title")
       return !0;
 };
-var ht = {
+var jn = {
   xmlns: "http://www.w3.org/2000/svg",
   width: 24,
   height: 24,
@@ -281,51 +281,67 @@ var ht = {
   strokeLinecap: "round",
   strokeLinejoin: "round"
 };
-const mt = Ie(
+const Pn = Wt(
   ({
-    color: r = "currentColor",
-    size: e = 24,
-    strokeWidth: n = 2,
-    absoluteStrokeWidth: s,
-    className: o = "",
-    children: i,
-    iconNode: u,
-    ...c
-  }, h) => Ee(
+    color: t = "currentColor",
+    size: n = 24,
+    strokeWidth: e = 2,
+    absoluteStrokeWidth: o,
+    className: r = "",
+    children: a,
+    iconNode: i,
+    ...d
+  }, m) => Ge(
     "svg",
     {
-      ref: h,
-      ...ht,
-      width: e,
-      height: e,
-      stroke: r,
-      strokeWidth: s ? Number(n) * 24 / Number(e) : n,
-      className: Be("lucide", o),
-      ...!i && !dt(c) && { "aria-hidden": "true" },
-      ...c
+      ref: m,
+      ...jn,
+      width: n,
+      height: n,
+      stroke: t,
+      strokeWidth: o ? Number(e) * 24 / Number(n) : e,
+      className: Ht("lucide", r),
+      ...!a && !wn(d) && { "aria-hidden": "true" },
+      ...d
     },
     [
-      ...u.map(([N, b]) => Ee(N, b)),
-      ...Array.isArray(i) ? i : [i]
+      ...i.map(([w, b]) => Ge(w, b)),
+      ...Array.isArray(a) ? a : [a]
     ]
   )
 );
-const oe = (r, e) => {
-  const n = Ie(
-    ({ className: s, ...o }, i) => Ee(mt, {
-      ref: i,
-      iconNode: e,
-      className: Be(
-        `lucide-${ct(Fe(r))}`,
-        `lucide-${r}`,
-        s
+const ie = (t, n) => {
+  const e = Wt(
+    ({ className: o, ...r }, a) => Ge(Pn, {
+      ref: a,
+      iconNode: n,
+      className: Ht(
+        `lucide-${bn(Ot(t))}`,
+        `lucide-${t}`,
+        o
       ),
-      ...o
+      ...r
     })
   );
-  return n.displayName = Fe(r), n;
+  return e.displayName = Ot(t), e;
 };
-const ft = [
+const En = [
+  ["path", { d: "M12 5v14", key: "s699le" }],
+  ["path", { d: "m19 12-7 7-7-7", key: "1idqje" }]
+], Dn = ie("arrow-down", En);
+const kn = [
+  ["path", { d: "m12 19-7-7 7-7", key: "1l729n" }],
+  ["path", { d: "M19 12H5", key: "x3x0zl" }]
+], Cn = ie("arrow-left", kn);
+const Nn = [
+  ["path", { d: "M5 12h14", key: "1ays0h" }],
+  ["path", { d: "m12 5 7 7-7 7", key: "xquz4c" }]
+], On = ie("arrow-right", Nn);
+const Sn = [
+  ["path", { d: "m5 12 7-7 7 7", key: "hav0vg" }],
+  ["path", { d: "M12 19V5", key: "x0mq9r" }]
+], Mn = ie("arrow-up", Sn);
+const An = [
   [
     "path",
     {
@@ -334,8 +350,8 @@ const ft = [
     }
   ],
   ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
-], pt = oe("eye", ft);
-const xt = [
+], $n = ie("eye", An);
+const Tn = [
   [
     "path",
     {
@@ -352,20 +368,20 @@ const xt = [
     }
   ],
   ["path", { d: "m2 2 20 20", key: "1ooewy" }]
-], Xe = oe("eye-off", xt);
-const gt = [
+], St = ie("eye-off", Tn);
+const Rn = [
   ["path", { d: "M15 3h6v6", key: "1q9fwt" }],
   ["path", { d: "m21 3-7 7", key: "1l2asr" }],
   ["path", { d: "m3 21 7-7", key: "tjx5ai" }],
   ["path", { d: "M9 21H3v-6", key: "wtvkvv" }]
-], bt = oe("maximize-2", gt);
-const vt = [
+], _n = ie("maximize-2", Rn);
+const Ln = [
   ["path", { d: "m14 10 7-7", key: "oa77jy" }],
   ["path", { d: "M20 10h-6V4", key: "mjg0md" }],
   ["path", { d: "m3 21 7-7", key: "tjx5ai" }],
   ["path", { d: "M4 14h6v6", key: "rmj7iw" }]
-], yt = oe("minimize-2", vt);
-const wt = [
+], zn = ie("minimize-2", Ln);
+const In = [
   ["path", { d: "M12.586 12.586 19 19", key: "ea5xo7" }],
   [
     "path",
@@ -374,8 +390,8 @@ const wt = [
       key: "277e5u"
     }
   ]
-], jt = oe("mouse-pointer", wt);
-const Pt = [
+], qn = ie("mouse-pointer", In);
+const Wn = [
   ["path", { d: "M14 4.1 12 6", key: "ita8i4" }],
   ["path", { d: "m5.1 8-2.9-.8", key: "1go3kf" }],
   ["path", { d: "m6 12-1.9 2", key: "mnht97" }],
@@ -387,19 +403,19 @@ const Pt = [
       key: "s0h3yz"
     }
   ]
-], kt = oe("mouse-pointer-click", Pt);
-const Nt = [
+], Hn = ie("mouse-pointer-click", Wn);
+const Yn = [
   ["path", { d: "M18 6 6 18", key: "1bl5f8" }],
   ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
-], Ve = oe("x", Nt), le = class le {
+], Yt = ie("x", Yn), me = class me {
   /**
    * @constructor
    * @param {LogLevel} [level=LogLevel.WARN] - The minimum log level to output.
    * @param {string} [prefix="[drag-drop-panels]"] - The prefix to add to all log messages.
    * @param {ILogger} [impl=console] - The implementation to use for logging.
    */
-  constructor(e = 2, n = "[drag-drop-panels]", s = console) {
-    this.level = e, this.prefix = n, this.impl = s;
+  constructor(n = 2, e = "[drag-drop-panels]", o = console) {
+    this.level = n, this.prefix = e, this.impl = o;
   }
   /**
    * @method setLevel
@@ -407,8 +423,8 @@ const Nt = [
    * @description 静的インスタンスの現在のログレベルを更新します。
    * @param {LogLevel} level - The new log level.
    */
-  static setLevel(e) {
-    le.instance.setLevel(e);
+  static setLevel(n) {
+    me.instance.setLevel(n);
   }
   /**
    * @method setLevel
@@ -416,8 +432,8 @@ const Nt = [
    * @description 現在のログレベルを更新します。
    * @param {LogLevel} level - The new log level.
    */
-  setLevel(e) {
-    this.level = e;
+  setLevel(n) {
+    this.level = n;
   }
   /**
    * @method setImplementation
@@ -425,8 +441,8 @@ const Nt = [
    * @description 静的インスタンスのロガーの実装を更新します。
    * @param {ILogger} impl - The new logger implementation.
    */
-  static setImplementation(e) {
-    le.instance.setImplementation(e);
+  static setImplementation(n) {
+    me.instance.setImplementation(n);
   }
   /**
    * @method setImplementation
@@ -434,8 +450,8 @@ const Nt = [
    * @description ロガーの実装を更新します。
    * @param {ILogger} impl - The new logger implementation.
    */
-  setImplementation(e) {
-    this.impl = e;
+  setImplementation(n) {
+    this.impl = n;
   }
   /**
    * @method setPrefix
@@ -443,8 +459,8 @@ const Nt = [
    * @description 静的インスタンスのログのプレフィックスを更新します。
    * @param {string} prefix - The new prefix.
    */
-  static setPrefix(e) {
-    le.instance.setPrefix(e);
+  static setPrefix(n) {
+    me.instance.setPrefix(n);
   }
   /**
    * @method setPrefix
@@ -452,462 +468,1028 @@ const Nt = [
    * @description ログのプレフィックスを更新します。
    * @param {string} prefix - The new prefix.
    */
-  setPrefix(e) {
-    this.prefix = e;
+  setPrefix(n) {
+    this.prefix = n;
   }
-  formatMessage(e) {
-    return typeof e == "string" ? [`${this.prefix} ${e}`] : [this.prefix, e];
+  formatMessage(n) {
+    return typeof n == "string" ? [`${this.prefix} ${n}`] : [this.prefix, n];
   }
-  static debug(e, ...n) {
-    le.instance.debug(e, ...n);
+  static debug(n, ...e) {
+    me.instance.debug(n, ...e);
   }
-  debug(e, ...n) {
-    this.level <= 0 && this.impl.debug(...this.formatMessage(e), ...n);
+  debug(n, ...e) {
+    this.level <= 0 && this.impl.debug(...this.formatMessage(n), ...e);
   }
-  static info(e, ...n) {
-    le.instance.info(e, ...n);
+  static info(n, ...e) {
+    me.instance.info(n, ...e);
   }
-  info(e, ...n) {
-    this.level <= 1 && this.impl.info(...this.formatMessage(e), ...n);
+  info(n, ...e) {
+    this.level <= 1 && this.impl.info(...this.formatMessage(n), ...e);
   }
-  static warn(e, ...n) {
-    le.instance.warn(e, ...n);
+  static warn(n, ...e) {
+    me.instance.warn(n, ...e);
   }
-  warn(e, ...n) {
-    this.level <= 2 && this.impl.warn(...this.formatMessage(e), ...n);
+  warn(n, ...e) {
+    this.level <= 2 && this.impl.warn(...this.formatMessage(n), ...e);
   }
-  static error(e, ...n) {
-    le.instance.error(e, ...n);
+  static error(n, ...e) {
+    me.instance.error(n, ...e);
   }
-  error(e, ...n) {
-    this.level <= 3 && this.impl.error(...this.formatMessage(e), ...n);
+  error(n, ...e) {
+    this.level <= 3 && this.impl.error(...this.formatMessage(n), ...e);
   }
 };
-le.instance = new le(2, "[drag-drop-panels]");
-let Ce = le;
-const Dt = ({ config: r, panelId: e, sizeInfo: n, onSizeInfoClick: s }) => r.showPanelSizes && n ? (
+me.instance = new me(2, "[drag-drop-panels]");
+let Ke = me;
+const Fn = ({ config: t, panelId: n, sizeInfo: e, onSizeInfoClick: o }) => t.showPanelSizes && e ? (
   // biome-ignore lint/a11y/noStaticElementInteractions: クリックイベントを持つ静的要素。デバッグ目的のため、インタラクティブ性は限定的。
   // biome-ignore lint/a11y/useKeyWithClickEvents: キーボード操作はデバッグ機能では優先度が低い。
-  /* @__PURE__ */ t.jsxs(
+  /* @__PURE__ */ s.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: s,
-      onMouseDown: s,
-      onTouchStart: (o) => o instanceof TouchEvent && s(o),
-      onDragStart: s,
+      onClick: o,
+      onMouseDown: o,
+      onTouchStart: (r) => r instanceof TouchEvent && o(r),
+      onDragStart: o,
       children: [
-        /* @__PURE__ */ t.jsxs("div", { className: "text-[10px] opacity-80", children: [
+        /* @__PURE__ */ s.jsxs("div", { className: "text-[10px] opacity-80", children: [
           "ID:",
-          e
+          n
         ] }),
-        /* @__PURE__ */ t.jsxs("div", { children: [
-          n.width,
+        /* @__PURE__ */ s.jsxs("div", { children: [
+          e.width,
           "×",
-          n.height
+          e.height
         ] }),
-        /* @__PURE__ */ t.jsxs("div", { children: [
+        /* @__PURE__ */ s.jsxs("div", { children: [
           "X:",
-          n.x,
+          e.x,
           " Y:",
-          n.y
+          e.y
         ] }),
-        /* @__PURE__ */ t.jsxs("div", { className: "text-[10px] opacity-80", children: [
+        /* @__PURE__ */ s.jsxs("div", { className: "text-[10px] opacity-80", children: [
           "min:",
-          n.minHeight,
+          e.minHeight,
           " max:",
-          n.maxHeight
+          e.maxHeight
         ] })
       ]
     }
   )
-) : null, E = (r, e, ...n) => {
-  (r.logLevel ?? 0) >= e && Ce.info(...n);
-}, Ze = qe.memo(({ index: r, columnIndex: e, isDragging: n, dragOverPosition: s, originalPosition: o, onDragEnter: i, onDragLeave: u, config: c, customDrag: h }) => {
-  const N = o && o.columnIndex === e && (o.panelIndex === r || o.panelIndex + 1 === r), b = !N && s?.columnIndex === e && s?.insertIndex === r, M = F(null), [T, y] = te(null), l = n || (h?.isActive ?? !1);
-  return K(() => {
-    if (M.current) {
-      const j = M.current.getBoundingClientRect(), k = {
-        width: Math.round(j.width),
-        height: Math.round(j.height),
-        x: Math.round(j.left),
-        y: Math.round(j.top)
+) : null, M = (t, n, ...e) => {
+  (t.logLevel ?? 0) >= n && Ke.info(...e);
+}, et = (t, n, e) => t.columnIndex === n && (t.panelIndex === e || t.panelIndex + 1 === e), Ft = (t, n, e, o) => {
+  const r = Object.keys(t).find((d) => t[d].includes(n));
+  if (r === void 0 || t[e] === void 0) return null;
+  const a = { ...t };
+  if (r === e) {
+    const d = [...t[r]], m = d.indexOf(n);
+    return d.splice(m, 1), d.splice(m < o ? o - 1 : o, 0, n), a[e] = d, a;
+  }
+  a[r] = t[r].filter((d) => d !== n);
+  const i = [...t[e]];
+  return i.splice(o, 0, n), a[e] = i, a;
+}, De = Object.freeze(["previous-column", "next-column", "up", "down"]), Bn = (t, n) => t.columnPanels[n] ?? [], tt = (t) => t.columnKeys.map((n) => Bn(t, n).filter((e) => t.panelVisibility[e] === !0)), Pe = (t, n) => {
+  for (const [e, o] of tt(t).entries()) {
+    const r = o.indexOf(n);
+    if (r >= 0) return { column: e, index: r };
+  }
+  return null;
+}, Bt = (t, n, e) => {
+  switch (e) {
+    case "previous-column":
+    case "next-column": {
+      const o = n.column + (e === "previous-column" ? -1 : 1), r = t[o];
+      return r === void 0 ? null : { column: o, index: Math.min(n.index, r.length) };
+    }
+    case "up":
+      return n.index > 0 ? { column: n.column, index: n.index - 1 } : null;
+    case "down":
+      return n.index < t[n.column].length - 1 ? { column: n.column, index: n.index + 1 } : null;
+    default: {
+      const o = e;
+      throw new RangeError(`[@aiquants/drag-drop-panels] unknown panel move ${JSON.stringify(o)}; expected one of ${De.join(", ")}`);
+    }
+  }
+}, Un = (t, n, e, o) => {
+  const r = t.filter(n), a = (m) => [...t.slice(0, m), e, ...t.slice(m)], i = r[o];
+  if (i !== void 0) return a(t.indexOf(i));
+  const d = r[o - 1];
+  return a(d !== void 0 ? t.indexOf(d) + 1 : t.length);
+}, Xn = (t, n) => {
+  const e = Pe(t, n);
+  if (e === null) return [];
+  const o = tt(t);
+  return De.filter((r) => Bt(o, e, r) !== null);
+}, Vn = (t, n, e) => {
+  if (!De.includes(e)) throw new RangeError(`[@aiquants/drag-drop-panels] unknown panel move ${JSON.stringify(e)}; expected one of ${De.join(", ")}`);
+  const o = Pe(t, n);
+  if (o === null) return null;
+  const r = Bt(tt(t), o, e);
+  if (r === null) return null;
+  const a = (m) => t.panelVisibility[m] === !0, i = Object.fromEntries(Object.entries(t.columnPanels).map(([m, w]) => [m, w.filter((b) => b !== n)])), d = t.columnKeys[r.column];
+  return i[d] = Un(i[d] ?? [], a, n, r.index), { columnPanels: i, from: o, place: r };
+}, Zn = (t, n, e) => {
+  const o = (r, a) => (r[a] ?? []).filter((i) => i !== e);
+  for (const r of /* @__PURE__ */ new Set([...Object.keys(t), ...Object.keys(n)])) {
+    const a = o(t, r), i = o(n, r);
+    if (a.length !== i.length || a.some((d, m) => d !== i[m])) return !1;
+  }
+  return !0;
+}, Ut = Object.freeze({
+  "previous-column": Object.freeze({ key: "ArrowLeft", aria: "Alt+Shift+ArrowLeft", text: "Alt+Shift+←" }),
+  "next-column": Object.freeze({ key: "ArrowRight", aria: "Alt+Shift+ArrowRight", text: "Alt+Shift+→" }),
+  up: Object.freeze({ key: "ArrowUp", aria: "Alt+Shift+ArrowUp", text: "Alt+Shift+↑" }),
+  down: Object.freeze({ key: "ArrowDown", aria: "Alt+Shift+ArrowDown", text: "Alt+Shift+↓" })
+}), Gn = (t) => {
+  if (!(t.altKey && t.shiftKey) || t.ctrlKey || t.metaKey) return null;
+  const n = De.find((e) => Ut[e].key === t.key);
+  return n === void 0 ? null : n;
+}, Xt = qt.memo(({ index: t, columnIndex: n, isDragging: e, dragOverPosition: o, originalPosition: r, onDragEnter: a, onDragLeave: i, config: d, customDrag: m, label: w }) => {
+  const b = r !== null && et(r, n, t), A = !b && o?.columnIndex === n && o?.insertIndex === t, q = I(null), [j, E] = se(null), C = e || (m?.isActive ?? !1), T = b || !C ? "hidden" : A ? "target" : "shown";
+  return oe(() => {
+    if (q.current) {
+      const h = q.current.getBoundingClientRect(), P = {
+        width: Math.round(h.width),
+        height: Math.round(h.height),
+        x: Math.round(h.left),
+        y: Math.round(h.top)
       };
-      y(k), b && E(c, 1, `🎯 アクティブプレースホルダー ${r}-${e}:`, {
-        size: `${k.width}×${k.height}`,
-        position: `(${k.x}, ${k.y})`,
-        bottomRight: `(${k.x + k.width}, ${k.y + k.height})`,
-        center: `(${k.x + k.width / 2}, ${k.y + k.height / 2})`
+      E(P), A && M(d, 1, `🎯 アクティブプレースホルダー ${t}-${n}:`, {
+        size: `${P.width}×${P.height}`,
+        position: `(${P.x}, ${P.y})`,
+        bottomRight: `(${P.x + P.width}, ${P.y + P.height})`,
+        center: `(${P.x + P.width / 2}, ${P.y + P.height / 2})`
       });
     }
-  }, [b, r, e, c]), E(c, 2, `プレースホルダー${r}-${e}: 表示中`, { isHighlighted: b, isDragging: n, dragOverPosition: s, shouldShow: l }), // biome-ignore lint/a11y/noStaticElementInteractions: ドラッグイベントを処理するための対話的な要素。デバッグ目的のため、キーボード操作は必須ではない。
-  /* @__PURE__ */ t.jsxs(
+  }, [A, t, n, d]), M(d, 2, `プレースホルダー${t}-${n}: 表示中`, { isHighlighted: A, isDragging: e, dragOverPosition: o, shouldShow: C }), // biome-ignore lint/a11y/noStaticElementInteractions: ドラッグイベントを処理するための対話的な要素。デバッグ目的のため、キーボード操作は必須ではない。
+  /* @__PURE__ */ s.jsxs(
     "div",
     {
-      ref: M,
-      "data-placeholder-index": r,
-      "data-placeholder-column": e,
-      onDragEnter: () => i(e, r),
-      onDragLeave: (j) => u(j, e, r),
-      className: `relative flex w-full items-center justify-center transition-all duration-0 ${N ? "pointer-events-none h-0 overflow-hidden opacity-0" : l ? b ? "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"}`,
+      ref: q,
+      "data-placeholder-index": t,
+      "data-placeholder-column": n,
+      "data-aqdd-drop-placeholder": T,
+      onDragEnter: () => a(n, t),
+      onDragLeave: (h) => i(h, n, t),
+      className: `relative flex w-full items-center justify-center ${T === "hidden" ? "pointer-events-none h-0 overflow-hidden opacity-0" : T === "target" ? "my-2 scale-[1.02] rounded-xl border-4 border-dashed px-4 py-6 shadow-lg" : "my-2 rounded-xl border-2 border-dashed px-2 py-4"}`,
       children: [
-        !N && l && c.showPlaceholderInfo && T && /* @__PURE__ */ t.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: [
-          /* @__PURE__ */ t.jsxs("div", { children: [
-            T.width,
+        !b && C && d.showPlaceholderInfo && j && /* @__PURE__ */ s.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: [
+          /* @__PURE__ */ s.jsxs("div", { children: [
+            j.width,
             "×",
-            T.height
+            j.height
           ] }),
-          /* @__PURE__ */ t.jsxs("div", { children: [
+          /* @__PURE__ */ s.jsxs("div", { children: [
             "X:",
-            T.x,
+            j.x,
             " Y:",
-            T.y
+            j.y
           ] }),
-          /* @__PURE__ */ t.jsx("div", { className: "text-[10px] opacity-80", children: "min:200px max:500px" }),
-          /* @__PURE__ */ t.jsxs("div", { className: "mt-0.5 text-[10px] opacity-80", children: [
+          /* @__PURE__ */ s.jsx("div", { className: "text-[10px] opacity-80", children: "min:200px max:500px" }),
+          /* @__PURE__ */ s.jsxs("div", { className: "mt-0.5 text-[10px] opacity-80", children: [
             "PH-",
-            e,
+            n,
             "-",
-            r,
+            t,
             " ",
-            b ? "ACTIVE" : "IDLE"
+            A ? "ACTIVE" : "IDLE"
           ] })
         ] }),
-        !N && l && /* @__PURE__ */ t.jsxs("div", { className: "flex items-center space-x-2 text-sky-600", children: [
-          /* @__PURE__ */ t.jsxs("svg", { className: "h-6 w-6", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: [
-            /* @__PURE__ */ t.jsx("title", { children: "パネルをここにドロップ" }),
-            /* @__PURE__ */ t.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 6v6m0 0v6m0-6h6m-6 0H6" })
-          ] }),
-          /* @__PURE__ */ t.jsx("span", { className: "font-medium text-sm", children: "パネルをここにドロップ" })
+        !b && C && /* @__PURE__ */ s.jsxs("div", { className: "flex items-center space-x-2", children: [
+          /* @__PURE__ */ s.jsx("svg", { className: "h-6 w-6", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: /* @__PURE__ */ s.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 6v6m0 0v6m0-6h6m-6 0H6" }) }),
+          /* @__PURE__ */ s.jsx("span", { lang: w.lang, className: "font-medium text-sm", children: w.text })
         ] })
       ]
     }
   );
 });
-Ze.displayName = "InsertPlaceholder";
-const Ge = ({ columnIndex: r, isDragging: e, dragOverPosition: n, children: s, config: o }) => {
-  const i = F(null), [u, c] = te(null);
-  return K(() => {
-    if (i.current && e) {
-      const h = i.current.getBoundingClientRect(), N = n?.columnIndex === r, b = {
-        width: Math.round(h.width),
-        height: Math.round(h.height),
-        x: Math.round(h.left),
-        y: Math.round(h.top),
-        isActive: N
+Xt.displayName = "InsertPlaceholder";
+const Vt = ({ columnIndex: t, isDragging: n, dragOverPosition: e, children: o, config: r }) => {
+  const a = I(null), [i, d] = se(null);
+  return oe(() => {
+    if (a.current && n) {
+      const m = a.current.getBoundingClientRect(), w = e?.columnIndex === t, b = {
+        width: Math.round(m.width),
+        height: Math.round(m.height),
+        x: Math.round(m.left),
+        y: Math.round(m.top),
+        isActive: w
       };
-      c(b), N && E(o, 1, `🎯 アクティブドロップゾーン ${r}:`, {
+      d(b), w && M(r, 1, `🎯 アクティブドロップゾーン ${t}:`, {
         size: `${b.width}×${b.height}`,
         position: `(${b.x}, ${b.y})`,
         bottomRight: `(${b.x + b.width}, ${b.y + b.height})`,
         center: `(${b.x + b.width / 2}, ${b.y + b.height / 2})`
       });
     }
-  }, [e, n, r, o]), /* @__PURE__ */ t.jsxs("div", { ref: i, className: "relative", children: [
-    s,
-    e && u && o.showDropZoneOutlines && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      /* @__PURE__ */ t.jsx("div", { className: `pointer-events-none absolute inset-0 rounded-lg border-2 border-dashed transition-all duration-200 ${u.isActive ? "border-red-500 bg-red-100/20 shadow-lg" : "border-gray-400 bg-gray-100/10"}` }),
-      /* @__PURE__ */ t.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 ${u.isActive ? "bg-red-500/90 text-white" : "bg-gray-500/90 text-white"}`, children: [
-        /* @__PURE__ */ t.jsxs("div", { className: "font-bold", children: [
+  }, [n, e, t, r]), /* @__PURE__ */ s.jsxs("div", { ref: a, className: "relative", children: [
+    o,
+    n && i && r.showDropZoneOutlines && /* @__PURE__ */ s.jsxs(s.Fragment, { children: [
+      /* @__PURE__ */ s.jsx("div", { className: `pointer-events-none absolute inset-0 rounded-lg border-2 border-dashed transition-all duration-200 ${i.isActive ? "border-red-500 bg-red-100/20 shadow-lg" : "border-gray-400 bg-gray-100/10"}` }),
+      /* @__PURE__ */ s.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 ${i.isActive ? "bg-red-500/90 text-white" : "bg-gray-500/90 text-white"}`, children: [
+        /* @__PURE__ */ s.jsxs("div", { className: "font-bold", children: [
           "DropZone-",
-          r
+          t
         ] }),
-        /* @__PURE__ */ t.jsxs("div", { children: [
-          u.width,
+        /* @__PURE__ */ s.jsxs("div", { children: [
+          i.width,
           "×",
-          u.height
+          i.height
         ] }),
-        /* @__PURE__ */ t.jsxs("div", { children: [
+        /* @__PURE__ */ s.jsxs("div", { children: [
           "X:",
-          u.x,
+          i.x,
           " Y:",
-          u.y
+          i.y
         ] }),
-        /* @__PURE__ */ t.jsx("div", { className: "mt-0.5 text-[10px] opacity-80", children: u.isActive ? "ACTIVE" : "IDLE" })
+        /* @__PURE__ */ s.jsx("div", { className: "mt-0.5 text-[10px] opacity-80", children: i.isActive ? "ACTIVE" : "IDLE" })
       ] }),
-      /* @__PURE__ */ t.jsx(
+      /* @__PURE__ */ s.jsx(
         "div",
         {
-          className: `pointer-events-none absolute transition-all duration-200 ${u.isActive ? "opacity-100" : "opacity-50"}`,
+          className: `pointer-events-none absolute transition-all duration-200 ${i.isActive ? "opacity-100" : "opacity-50"}`,
           style: {
-            left: `${u.width / 2 - 6}px`,
-            top: `${u.height / 2 - 6}px`
+            left: `${i.width / 2 - 6}px`,
+            top: `${i.height / 2 - 6}px`
           },
-          children: /* @__PURE__ */ t.jsx("div", { className: `h-3 w-3 rounded-full border-2 ${u.isActive ? "border-red-700 bg-red-500" : "border-gray-700 bg-gray-500"}` })
+          children: /* @__PURE__ */ s.jsx("div", { className: `h-3 w-3 rounded-full border-2 ${i.isActive ? "border-red-700 bg-red-500" : "border-gray-700 bg-gray-500"}` })
         }
       ),
-      u.isActive && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-        /* @__PURE__ */ t.jsx("div", { className: "pointer-events-none absolute top-0 left-0 h-2 w-2 rounded-full bg-red-500" }),
-        /* @__PURE__ */ t.jsx("div", { className: "pointer-events-none absolute top-0 right-0 h-2 w-2 rounded-full bg-red-500" }),
-        /* @__PURE__ */ t.jsx("div", { className: "pointer-events-none absolute bottom-0 left-0 h-2 w-2 rounded-full bg-red-500" }),
-        /* @__PURE__ */ t.jsx("div", { className: "pointer-events-none absolute right-0 bottom-0 h-2 w-2 rounded-full bg-red-500" })
+      i.isActive && /* @__PURE__ */ s.jsxs(s.Fragment, { children: [
+        /* @__PURE__ */ s.jsx("div", { className: "pointer-events-none absolute top-0 left-0 h-2 w-2 rounded-full bg-red-500" }),
+        /* @__PURE__ */ s.jsx("div", { className: "pointer-events-none absolute top-0 right-0 h-2 w-2 rounded-full bg-red-500" }),
+        /* @__PURE__ */ s.jsx("div", { className: "pointer-events-none absolute bottom-0 left-0 h-2 w-2 rounded-full bg-red-500" }),
+        /* @__PURE__ */ s.jsx("div", { className: "pointer-events-none absolute right-0 bottom-0 h-2 w-2 rounded-full bg-red-500" })
       ] })
     ] })
   ] });
 };
-Ge.displayName = "DropZoneDebugOverlay";
-const Et = 0.25, St = typeof window < "u" ? Se : K, Ct = (r, e = Et) => {
-  const n = F(null), [s, o] = te(1);
-  return St(() => {
-    const i = n.current;
-    if (!i || r <= 0) {
-      o(1);
+Vt.displayName = "DropZoneDebugOverlay";
+const Zt = "[data-aqdd-scroll-root]", Ee = "data-aqdd-panel-action", Kn = 0.25, Jn = typeof window < "u" ? we : oe, Qn = (t, n = Kn) => {
+  const e = I(null), [o, r] = se(1);
+  return Jn(() => {
+    const a = e.current;
+    if (!a || t <= 0) {
+      r(1);
       return;
     }
-    const u = () => {
-      const h = i.clientWidth;
-      if (h <= 0)
+    const i = () => {
+      const m = a.clientWidth;
+      if (m <= 0)
         return;
-      const N = h >= r ? 1 : Math.max(h / r, e);
-      o((b) => Math.abs(b - N) < 5e-3 ? b : N);
+      const w = m >= t ? 1 : Math.max(m / t, n);
+      r((b) => Math.abs(b - w) < 5e-3 ? b : w);
     };
-    u();
-    const c = new ResizeObserver(u);
-    return c.observe(i), () => c.disconnect();
-  }, [r, e]), { containerRef: n, scale: s };
-}, Je = ({ columnId: r, onResizeStart: e, onResize: n, onResizeEnd: s, isResizing: o = !1, position: i = "right", className: u = "", debug: c = {} }) => {
-  const h = F(!1), N = F(null);
-  K(() => {
-    !o && h.current && (E(c, 1, "外部からのリサイズ解除を検出、ドラッグ状態を強制解除:", r), h.current = !1, document.body.style.cursor = "", document.body.style.userSelect = "", document.body.classList.remove("resizing-column"));
-  }, [o, r, c]);
-  const b = w(
-    (y) => {
-      y.preventDefault(), y.stopPropagation(), E(c, 2, "リサイズハンドル マウスダウン:", r), h.current = !0, e(r, y.clientX), document.body.style.cursor = "col-resize", document.body.style.userSelect = "none", document.body.classList.add("resizing-column");
-    },
-    [r, e, c]
-  );
-  K(() => {
-    const y = (j) => {
-      h.current && (j.preventDefault(), n(j.clientX));
-    }, l = () => {
-      h.current && (E(c, 2, "リサイズハンドル マウスアップ:", r), h.current = !1, s(), document.body.style.cursor = "", document.body.style.userSelect = "", document.body.classList.remove("resizing-column"));
-    };
-    return document.addEventListener("mousemove", y), document.addEventListener("mouseup", l), () => {
-      document.removeEventListener("mousemove", y), document.removeEventListener("mouseup", l);
-    };
-  }, [r, n, s, c]);
-  const M = w(
-    (y) => {
-      y.preventDefault(), y.stopPropagation();
-      const l = y.touches[0];
-      E(c, 2, "リサイズハンドル タッチスタート:", r), h.current = !0, e(r, l.clientX), document.body.style.cursor = "col-resize", document.body.style.userSelect = "none", document.body.classList.add("resizing-column");
-    },
-    [r, e, c]
-  );
-  K(() => {
-    const y = (j) => {
-      if (!h.current) return;
-      j.preventDefault();
-      const k = j.touches[0];
-      n(k.clientX);
-    }, l = () => {
-      h.current && (E(c, 2, "リサイズハンドル タッチエンド:", r), h.current = !1, s(), document.body.style.cursor = "", document.body.style.userSelect = "", document.body.classList.remove("resizing-column"));
+    i();
+    const d = new ResizeObserver(i);
+    return d.observe(a), () => d.disconnect();
+  }, [t, n]), { containerRef: e, scale: o };
+}, er = Object.freeze([
+  "--aqdd-panel-surface",
+  "--aqdd-panel-border",
+  "--aqdd-panel-title-color",
+  "--aqdd-header-button-color",
+  "--aqdd-header-button-hover-color",
+  "--aqdd-header-button-hover-surface",
+  "--aqdd-custom-badge-color",
+  "--aqdd-custom-badge-surface",
+  "--aqdd-default-panel-surface",
+  "--aqdd-default-panel-border",
+  "--aqdd-default-panel-title-color",
+  "--aqdd-default-header-button-color",
+  "--aqdd-default-header-button-hover-color",
+  "--aqdd-default-header-button-hover-surface",
+  "--aqdd-default-header-close-hover-color",
+  "--aqdd-default-custom-badge-color",
+  "--aqdd-default-custom-badge-surface"
+]), Gt = (t, n) => {
+  const e = window.getComputedStyle(t);
+  for (const o of er) {
+    const r = e.getPropertyValue(o).trim();
+    r !== "" && n.style.setProperty(o, r);
+  }
+}, Kt = (t, n, e) => {
+  const o = t.getBoundingClientRect(), r = t.cloneNode(!0);
+  return r.removeAttribute("data-panel-id"), Gt(t, r), r.style.position = "fixed", r.style.top = "0px", r.style.left = "0px", r.style.width = `${t.offsetWidth}px`, r.style.height = `${t.offsetHeight}px`, r.style.pointerEvents = "none", r.style.zIndex = "1000", r.style.opacity = "0.5", r.style.margin = "0", r.style.transition = "none", r.style.boxShadow = "0 8px 32px rgba(0,0,0,0.3)", r.style.transformOrigin = "top left", r.style.transform = `translate(${o.left}px, ${o.top}px) scale(${e})`, r.id = `drag-image-${n}`, document.body.appendChild(r), r;
+}, Jt = (t, n, e, o, r) => {
+  t.style.transform = `translate(${n - o.x}px, ${e - o.y}px) scale(${r * 1.05})`;
+}, tr = (t, n) => {
+  let e = n.closest("[data-drop-zone]");
+  for (; e !== null && e.closest("[data-aqdd-layout]") !== t; ) {
+    const o = e.parentElement;
+    e = o === null ? null : o.closest("[data-drop-zone]");
+  }
+  return e;
+}, nr = (t, n, e) => {
+  const o = document.elementFromPoint(n, e), r = o === null ? null : tr(t, o);
+  if (r === null) return null;
+  let a = null;
+  for (const i of r.querySelectorAll("[data-placeholder-index]")) {
+    if (i.closest("[data-drop-zone]") !== r) continue;
+    const { top: d, bottom: m } = i.getBoundingClientRect(), w = e < d ? d - e : e > m ? e - m : 0;
+    (a === null || w < a.distance) && (a = { insertIndex: Number(i.getAttribute("data-placeholder-index")), distance: w });
+  }
+  return a === null ? null : { columnIndex: Number(r.getAttribute("data-column-index")), insertIndex: a.insertIndex };
+}, Me = {
+  triggerDistance: 80,
+  scrollSpeed: 5,
+  maxScrollSpeed: 20
+}, nt = () => {
+  const t = window.visualViewport;
+  return t ? new DOMRect(t.offsetLeft, t.offsetTop, t.width, t.height) : new DOMRect(0, 0, window.innerWidth, window.innerHeight);
+}, rr = (t) => {
+  const n = t.getBoundingClientRect(), e = nt(), o = Math.max(n.left, e.left), r = Math.max(n.top, e.top), a = Math.min(n.right, e.right), i = Math.min(n.bottom, e.bottom);
+  return a > o && i > r ? new DOMRect(o, r, a - o, i - r) : null;
+}, Mt = (t, n, e = Me, o) => {
+  const { triggerDistance: r, scrollSpeed: a, maxScrollSpeed: i } = e, d = o === void 0 ? nt() : rr(o);
+  if (d === null) return { x: 0, y: 0 };
+  const { left: m, top: w, right: b, bottom: A } = d;
+  let q = 0, j = 0;
+  if (t >= m && t <= b && n >= w && n <= A) {
+    if (t < m + r) {
+      const E = Math.max(0, (m + r - t) / r);
+      q = -Math.min(i, a + E * (i - a));
+    } else if (t > b - r) {
+      const E = Math.max(0, (t - (b - r)) / r);
+      q = Math.min(i, a + E * (i - a));
+    }
+    if (n < w + r) {
+      const E = Math.max(0, (w + r - n) / r);
+      j = -Math.min(i, a + E * (i - a));
+    } else if (n > A - r) {
+      const E = Math.max(0, (n - (A - r)) / r);
+      j = Math.min(i, a + E * (i - a));
+    }
+  }
+  return { x: q, y: j };
+}, or = (t, n) => {
+  if (t === document.documentElement) return !1;
+  if (t === document.body) {
+    const r = window.getComputedStyle(document.documentElement);
+    if (r.overflowX === "visible" && r.overflowY === "visible") return !1;
+  }
+  const e = window.getComputedStyle(t), o = n === "x" ? e.overflowX : e.overflowY;
+  return o === "auto" || o === "scroll";
+}, sr = (t, n, e, o) => e === "x" ? o > 0 ? t.right - n.right : n.left - t.left : o > 0 ? t.bottom - n.bottom : n.top - t.top, Qt = (t, n, e) => {
+  const o = n === "x" ? t.scrollLeft : t.scrollTop;
+  return t.scrollBy(n === "x" ? { left: e, behavior: "instant" } : { top: e, behavior: "instant" }), (n === "x" ? t.scrollLeft : t.scrollTop) !== o;
+}, At = (t, n, e, o, r) => {
+  const a = sr(e, n, o, r);
+  return a > 0 && Qt(t, o, Math.sign(r) * Math.min(Math.abs(r), a));
+}, $t = (t, n, e) => {
+  if (Qt(t, n, e)) return;
+  const o = t.getBoundingClientRect();
+  for (let a = t.parentElement; a !== null; a = a.parentElement)
+    if (or(a, n) && At(a, a.getBoundingClientRect(), o, n, e)) return;
+  const r = document.scrollingElement;
+  r instanceof Element && r !== t && At(r, nt(), o, n, e);
+}, ar = (t, n) => {
+  if (n === void 0) {
+    (t.x !== 0 || t.y !== 0) && window.scrollBy(t.x, t.y);
+    return;
+  }
+  t.x !== 0 && $t(n, "x", t.x), t.y !== 0 && $t(n, "y", t.y);
+};
+class rt {
+  /**
+   * Creates a manager for an element, or for the window without one.
+   * 要素 (無ければウインドウ) の管理役を作る。
+   *
+   * @param config - The edge bands and speeds. 端の帯と速さ。
+   * @param scrollElement - The element to scroll. スクロールする要素。
+   */
+  constructor(n = Me, e) {
+    this.intervalId = null, this.isActive = !1, this.pointX = 0, this.pointY = 0, this.config = n, this.scrollElement = e;
+  }
+  /**
+   * Sets the element to scroll (the window without one).
+   * スクロールする要素を設定する (無ければウインドウ)。
+   *
+   * @param element - The element. 要素。
+   */
+  setScrollElement(n) {
+    this.scrollElement = n;
+  }
+  /**
+   * Starts scrolling for a pointer at a point; while it runs, it only moves the point.
+   * ある点のポインタのスクロールを始める (動いている間は点だけを移す)。
+   *
+   * @param clientX - The pointer's viewport x. ポインタのビューポートの x。
+   * @param clientY - The pointer's viewport y. ポインタのビューポートの y。
+   */
+  start(n, e) {
+    this.pointX = n, this.pointY = e, !this.isActive && (this.isActive = !0, this.intervalId = window.setInterval(() => {
+      const o = Mt(this.pointX, this.pointY, this.config, this.scrollElement);
+      ar(o, this.scrollElement);
+    }, 16));
+  }
+  /**
+   * Follows the pointer to a new point: starts scrolling when it enters an edge band, keeps scrolling toward its latest
+   * point while it stays in one, and stops when it leaves them.
+   * ポインタを新しい点へ追う処理 (端の帯へ入るとスクロールを始め、帯の中にいる間は最新の点へ向けて続け、帯を出ると止める)。
+   *
+   * @param clientX - The pointer's viewport x. ポインタのビューポートの x。
+   * @param clientY - The pointer's viewport y. ポインタのビューポートの y。
+   */
+  update(n, e) {
+    this.pointX = n, this.pointY = e;
+    const o = Mt(n, e, this.config, this.scrollElement);
+    (o.x !== 0 || o.y !== 0) && !this.isActive ? this.start(n, e) : o.x === 0 && o.y === 0 && this.isActive && this.stop();
+  }
+  /**
+   * Stops scrolling.
+   * スクロールを止める。
+   */
+  stop() {
+    this.intervalId !== null && (clearInterval(this.intervalId), this.intervalId = null), this.isActive = !1;
+  }
+  /**
+   * Whether it is scrolling now.
+   * 今スクロールしているか。
+   *
+   * @returns Whether a scroll runs. スクロールが動いているか。
+   */
+  isScrolling() {
+    return this.isActive;
+  }
+  /**
+   * Replaces the edge bands and speeds.
+   * 端の帯と速さを置き換える。
+   *
+   * @param newConfig - The edge bands and speeds. 端の帯と速さ。
+   */
+  updateConfig(n) {
+    this.config = n;
+  }
+}
+const Tt = "custom-dragging", lr = (t, n) => t === null ? n === null : n !== null && t.columnIndex === n.columnIndex && t.insertIndex === n.insertIndex, Rt = (t, n, e) => {
+  const { left: o, top: r, right: a, bottom: i } = t.getBoundingClientRect();
+  return n < o || n > a || e < r || e > i;
+}, ir = (t, n) => {
+  let e = null;
+  const o = (l) => {
+    const _ = t(), L = _.layoutRef.current;
+    if (L === null || Rt(L, l.x, l.y)) return null;
+    const B = nr(L, l.x, l.y), J = _.originOf(l.panelId);
+    return B === null || J === null || et(J, B.columnIndex, B.insertIndex) ? null : B;
+  }, r = () => {
+    if (e === null || e.phase !== "dragging") return;
+    const l = o(e);
+    n((_) => _ === null || lr(_.over, l) ? _ : { panelId: _.panelId, over: l });
+  }, a = (l) => {
+    if (e === null || l.pointerId !== e.pointerId) return;
+    if (e.x = l.clientX, e.y = l.clientY, e.phase === "pressing") {
+      Math.hypot(e.x - e.startX, e.y - e.startY) > t().config.slop && j();
+      return;
+    }
+    const _ = t(), L = _.layoutRef.current;
+    if (L === null || Rt(L, e.x, e.y)) {
+      E();
+      return;
+    }
+    Jt(e.image, e.x, e.y, e.offset, _.scale), e.edgeScroll.update(e.x, e.y), r();
+  }, i = (l) => {
+    if (e === null || l.pointerId !== e.pointerId) return;
+    if (e.phase === "pressing") {
+      j();
+      return;
+    }
+    e.x = l.clientX, e.y = l.clientY;
+    const _ = o(e), L = j();
+    if (L === null) return;
+    const B = t();
+    _ === null ? B.onCancel(L.panelId) : B.onDrop(L.panelId, _);
+  }, d = (l) => {
+    e !== null && l.pointerId === e.pointerId && E();
+  }, m = (l) => {
+    e !== null && e.phase === "pressing" && l.pointerId !== e.pointerId && j();
+  }, w = (l) => {
+    e !== null && e.phase === "dragging" && l.pointerId === e.pointerId && l.target === e.header && E();
+  }, b = (l) => {
+    e === null || e.phase !== "dragging" || l.key !== "Escape" || l.defaultPrevented || l.isComposing || (l.preventDefault(), E());
+  }, A = () => {
+    document.addEventListener("pointermove", a, !0), document.addEventListener("pointerup", i, !0), document.addEventListener("pointercancel", d, !0), document.addEventListener("pointerdown", m, !0), document.addEventListener("lostpointercapture", w, !0), document.addEventListener("keydown", b, !0);
+  }, q = () => {
+    document.removeEventListener("pointermove", a, !0), document.removeEventListener("pointerup", i, !0), document.removeEventListener("pointercancel", d, !0), document.removeEventListener("pointerdown", m, !0), document.removeEventListener("lostpointercapture", w, !0), document.removeEventListener("keydown", b, !0);
+  }, j = () => {
+    const l = e;
+    return l === null ? null : (e = null, q(), l.phase === "pressing" ? (window.clearTimeout(l.timer), l) : (document.removeEventListener("scroll", r, !0), l.edgeScroll.stop(), l.image.remove(), document.body.classList.remove(Tt), l.header.hasPointerCapture(l.pointerId) && l.header.releasePointerCapture(l.pointerId), n(null), l));
+  }, E = () => {
+    const l = j();
+    l !== null && l.phase === "dragging" && t().onCancel(l.panelId);
+  }, C = () => {
+    if (e === null || e.phase !== "pressing") return;
+    const l = e, _ = t(), L = _.panelElementOf(l.panelId), B = _.scrollRootRef.current;
+    if (!_.canStart || L === null || B === null || !l.header.isConnected) {
+      j();
+      return;
+    }
+    try {
+      l.header.setPointerCapture(l.pointerId);
+    } catch (x) {
+      if (x instanceof DOMException) {
+        j();
+        return;
+      }
+      throw x;
+    }
+    const { left: J, top: p } = L.getBoundingClientRect();
+    e = {
+      phase: "dragging",
+      pointerId: l.pointerId,
+      panelId: l.panelId,
+      header: l.header,
+      image: Kt(L, l.panelId, _.scale),
+      offset: { x: l.x - J, y: l.y - p },
+      edgeScroll: new rt(Me, B),
+      x: l.x,
+      y: l.y
+    }, document.addEventListener("scroll", r, { capture: !0, passive: !0 }), document.body.classList.add(Tt), n({ panelId: l.panelId, over: null }), _.onLift(l.panelId);
+  };
+  return { pressHeader: (l, _) => {
+    if (e !== null || !l.isPrimary || l.button !== 0 || l.pointerType !== "touch" && l.pointerType !== "pen") return;
+    const L = t();
+    L.canStart && (l.target instanceof Element && l.target.closest(`[${Ee}]`) !== null || (e = {
+      phase: "pressing",
+      pointerId: l.pointerId,
+      panelId: _,
+      header: l.currentTarget,
+      startX: l.clientX,
+      startY: l.clientY,
+      timer: window.setTimeout(C, L.config.longPressDelay),
+      x: l.clientX,
+      y: l.clientY
+    }, A()));
+  }, holdContextMenu: (l) => {
+    e !== null && e.header === l.currentTarget && l.preventDefault();
+  }, bindHeader: (l) => {
+    if (l === null) return;
+    const _ = (L) => {
+      e !== null && e.phase === "dragging" && e.header === l && L.cancelable && L.preventDefault();
     };
-    return document.addEventListener("touchmove", y, { passive: !1 }), document.addEventListener("touchend", l), () => {
-      document.removeEventListener("touchmove", y), document.removeEventListener("touchend", l);
+    return l.addEventListener("touchmove", _, { passive: !1 }), () => l.removeEventListener("touchmove", _);
+  }, cancel: E, dispose: () => {
+    j();
+  } };
+}, cr = (t) => {
+  const n = I(t);
+  we(() => {
+    n.current = t;
+  });
+  const [e, o] = se(null), [r] = se(() => ir(() => n.current, o));
+  return oe(() => r.dispose, [r]), { touchDrag: e, pressHeader: r.pressHeader, holdContextMenu: r.holdContextMenu, bindHeader: r.bindHeader, cancel: r.cancel };
+}, Ie = Object.freeze({
+  switchToCustomDragMode: { text: "カスタムドラッグモードに切り替え", lang: "ja" },
+  switchToNormalDragMode: { text: "通常ドラッグモードに戻す", lang: "ja" },
+  hidePanel: { text: "パネルを非表示", lang: "ja" },
+  maximizePanel: { text: "パネルを最大化", lang: "ja" },
+  restorePanel: { text: "元のサイズに戻す", lang: "ja" },
+  closePanel: { text: "パネルを閉じる", lang: "ja" },
+  movePanelToPreviousColumn: { text: "前の列へ移動", lang: "ja" },
+  movePanelToNextColumn: { text: "次の列へ移動", lang: "ja" },
+  movePanelUp: { text: "上へ移動", lang: "ja" },
+  movePanelDown: { text: "下へ移動", lang: "ja" },
+  customDragModeBadge: { text: "Custom", lang: "en" },
+  panelMoved: { text: "{title} を {column} 列目の {position} 番目へ移動しました", lang: "ja" },
+  panelMoveUnavailable: { text: "{title} は{move}できません", lang: "ja" },
+  panelDragStarted: { text: "{title} を持ち上げました", lang: "ja" },
+  panelDragCancelled: { text: "{title} の移動を取り消しました", lang: "ja" },
+  hiddenPanels: { text: "非表示のパネル:", lang: "ja" },
+  hiddenPanelBadge: { text: "非表示", lang: "ja" },
+  hiddenPanelNotice: { text: "このパネルは非表示です", lang: "ja" },
+  emptyColumn: { text: "このエリアは空です", lang: "ja" },
+  dropZone: { text: "Drop zone for column {column}", lang: "en" },
+  dropHere: { text: "パネルをここにドロップ", lang: "ja" },
+  resizeColumn: { text: "{column} 列目のカラム幅を調整", lang: "ja" }
+}), _t = new Set(Object.keys(Ie)), ur = Object.freeze({
+  panelMoved: Object.freeze(["title", "column", "position"]),
+  panelMoveUnavailable: Object.freeze(["title", "move"]),
+  panelDragStarted: Object.freeze(["title"]),
+  panelDragCancelled: Object.freeze(["title"]),
+  dropZone: Object.freeze(["column"]),
+  resizeColumn: Object.freeze(["column"])
+}), en = /\{(\w+)\}/g, Fr = Object.freeze(Object.fromEntries(Object.entries(Ie).map(([t, n]) => [t, n.text]))), dr = (t) => {
+  if (t !== void 0) {
+    const e = t;
+    if (e === null || typeof e != "object")
+      throw new TypeError(`[@aiquants/drag-drop-panels] labels must be an object; got ${e === null ? "null" : typeof e}`);
+    for (const o of Object.keys(e))
+      if (!_t.has(o))
+        throw new RangeError(`[@aiquants/drag-drop-panels] labels has the unknown key "${o}"; the labels are ${[..._t].join(", ")}`);
+  }
+  const n = {};
+  for (const e of Object.keys(Ie)) {
+    const o = t?.[e];
+    if (o === void 0) {
+      n[e] = Ie[e];
+      continue;
+    }
+    if (typeof o != "string")
+      throw new TypeError(`[@aiquants/drag-drop-panels] label "${e}" must be a string; got ${o === null ? "null" : typeof o}`);
+    const r = ur[e];
+    if (r !== void 0) {
+      for (const [, a] of o.matchAll(en))
+        if (!r.includes(a))
+          throw new RangeError(`[@aiquants/drag-drop-panels] label "${e}" uses the unknown placeholder {${a}}; it accepts ${r.map((i) => `{${i}}`).join(", ")}`);
+    }
+    n[e] = { text: o, lang: void 0 };
+  }
+  return Object.freeze(n);
+}, ze = (t, n) => {
+  const e = [], o = (r, a) => {
+    if (r === "") return;
+    const i = e[e.length - 1];
+    if (i !== void 0 && i.lang === a) {
+      e[e.length - 1] = { text: `${i.text}${r}`, lang: a };
+      return;
+    }
+    e.push({ text: r, lang: a });
+  };
+  for (const [r, a] of t.text.split(en).entries()) {
+    if (r % 2 === 0) {
+      o(a, t.lang);
+      continue;
+    }
+    const i = n[a];
+    if (i === void 0) throw new RangeError(`[@aiquants/drag-drop-panels] no value for the placeholder {${a}} of "${t.text}"`);
+    typeof i == "number" ? o(String(i), t.lang) : o(i.text, i.lang);
+  }
+  return e;
+}, Lt = (t, n) => ({
+  text: ze(t, n).map((e) => e.text).join(""),
+  lang: t.lang
+}), hr = 229, mr = /* @__PURE__ */ new Set(["", "auto", "hint"]), fr = (t) => {
+  for (const n of t.querySelectorAll("[popover]")) {
+    const e = n.getAttribute("popover");
+    if (e !== null && mr.has(e.toLowerCase()) && n.matches(":popover-open")) return !0;
+  }
+  return !1;
+}, pr = (t) => t.key !== "Escape" || t.defaultPrevented || t.isComposing || t.keyCode === hr || t.target instanceof Element && t.target.closest("dialog[open]") !== null ? !1 : !("popover" in HTMLElement.prototype && fr(document)), gr = "resizing-column", zt = (t) => {
+  document.body.style.cursor = t ? "col-resize" : "", document.body.style.userSelect = t ? "none" : "", document.body.classList.toggle(gr, t);
+}, tn = ({ columnId: t, onResizeStart: n, onResize: e, onResizeEnd: o, isResizing: r = !1, position: a = "right", className: i = "", debug: d = {}, label: m }) => {
+  const w = I({ columnId: t, onResize: e, onResizeEnd: o, debug: d });
+  we(() => {
+    w.current = { columnId: t, onResize: e, onResizeEnd: o, debug: d };
+  });
+  const b = I(null);
+  oe(() => {
+    r || b.current?.();
+  }, [r]), oe(() => () => b.current?.(), []);
+  const A = (j) => {
+    if (b.current !== null || !j.isPrimary || j.button !== 0) return;
+    const E = j.currentTarget, { pointerId: C } = j;
+    try {
+      E.setPointerCapture(C);
+    } catch (l) {
+      if (l instanceof DOMException) return;
+      throw l;
+    }
+    j.preventDefault(), j.stopPropagation(), M(d, 2, "リサイズハンドル ポインタダウン:", t, j.pointerType);
+    const T = (l) => {
+      l.pointerId === C && w.current.onResize(l.clientX);
+    }, h = (l) => {
+      l.pointerId === C && N(!0);
+    }, P = (l) => {
+      l.pointerId === C && N(!0);
+    }, N = (l) => {
+      b.current = null, document.removeEventListener("pointermove", T, !0), document.removeEventListener("pointerup", h, !0), document.removeEventListener("pointercancel", h, !0), E.removeEventListener("lostpointercapture", P), E.hasPointerCapture(C) && E.releasePointerCapture(C), zt(!1), M(w.current.debug, l ? 2 : 1, l ? "リサイズハンドル 終了:" : "リサイズハンドル 中断:", w.current.columnId), l && w.current.onResizeEnd();
     };
-  }, [r, n, s, c]), K(() => () => {
-    h.current && (E(c, 1, "リサイズハンドルアンマウント時のクリーンアップ:", r), document.body.style.cursor = "", document.body.style.userSelect = "", document.body.classList.remove("resizing-column"));
-  }, [r, c]);
-  const T = ["resize-handle", i, o ? "resizing" : "", u].filter(Boolean).join(" ");
+    b.current = () => N(!1), document.addEventListener("pointermove", T, !0), document.addEventListener("pointerup", h, !0), document.addEventListener("pointercancel", h, !0), E.addEventListener("lostpointercapture", P), zt(!0), n(t, j.clientX);
+  }, q = ["resize-handle", a, r ? "resizing" : "", i].filter(Boolean).join(" ");
   return (
     // biome-ignore lint/a11y/useFocusableInteractive: リサイズハンドルとして機能するためインタラクティブである必要がある
     // biome-ignore lint/a11y/useSemanticElements: divを使用するが、aria-roleでセマンティックな意味を提供している
     // biome-ignore lint/a11y/useAriaPropsForRole: リサイズハンドルのため、値の範囲を指定することが難しい
-    /* @__PURE__ */ t.jsxs("div", { ref: N, className: T, onMouseDown: b, onTouchStart: M, "data-column-id": r, "data-position": i, "aria-label": `${r}のカラム幅を調整`, role: "separator", "aria-orientation": "vertical", children: [
-      /* @__PURE__ */ t.jsx("div", { className: "resize-handle-bar" }),
-      c.showPanelSizes && /* @__PURE__ */ t.jsxs("div", { className: "resize-handle-debug-info", children: [
-        r,
-        o && " (resizing)"
+    /* @__PURE__ */ s.jsxs("div", { className: q, onPointerDown: A, "data-column-id": t, "data-position": a, "aria-label": m.text, lang: m.lang, role: "separator", "aria-orientation": "vertical", children: [
+      /* @__PURE__ */ s.jsx("div", { className: "resize-handle-bar" }),
+      d.showPanelSizes && /* @__PURE__ */ s.jsxs("div", { className: "resize-handle-debug-info", children: [
+        t,
+        r && " (resizing)"
       ] })
     ] })
   );
-}, Gt = ({ columnId: r, width: e, minWidth: n = 100, maxWidth: s = 800, onResizeStart: o, onResize: i, onResizeEnd: u, isResizing: c = !1, resizable: h = !0, className: N = "", debug: b = {}, children: M }) => {
-  const T = ["resizable-column", c ? "resizing" : "", N].filter(Boolean).join(" ");
-  return K(() => {
-    const y = document.querySelector(`[data-column-id="${r}"]`);
-    y && (y.style.setProperty("--column-width", `${e}px`), y.style.setProperty("--column-min-width", `${n}px`), y.style.setProperty("--column-max-width", `${s}px`));
-  }, [r, e, n, s]), /* @__PURE__ */ t.jsxs("div", { className: T, "data-column-id": r, "data-width": e, "data-min-width": n, "data-max-width": s, children: [
-    M,
-    h && /* @__PURE__ */ t.jsx(Je, { columnId: r, onResizeStart: o, onResize: i, onResizeEnd: u, isResizing: c, position: "right", debug: b }),
-    b.showPanelSizes && /* @__PURE__ */ t.jsxs("div", { className: "column-debug-size", children: [
-      e,
+}, Br = ({ columnId: t, width: n, minWidth: e = 100, maxWidth: o = 800, onResizeStart: r, onResize: a, onResizeEnd: i, isResizing: d = !1, resizable: m = !0, className: w = "", debug: b = {}, resizeHandleLabel: A, children: q }) => {
+  const j = ["resizable-column", d ? "resizing" : "", w].filter(Boolean).join(" ");
+  return oe(() => {
+    const E = document.querySelector(`[data-column-id="${t}"]`);
+    E && (E.style.setProperty("--column-width", `${n}px`), E.style.setProperty("--column-min-width", `${e}px`), E.style.setProperty("--column-max-width", `${o}px`));
+  }, [t, n, e, o]), /* @__PURE__ */ s.jsxs("div", { className: j, "data-column-id": t, "data-width": n, "data-min-width": e, "data-max-width": o, children: [
+    q,
+    m && /* @__PURE__ */ s.jsx(tn, { columnId: t, onResizeStart: r, onResize: a, onResizeEnd: i, isResizing: d, position: "right", debug: b, label: A }),
+    b.showPanelSizes && /* @__PURE__ */ s.jsxs("div", { className: "column-debug-size", children: [
+      n,
       "px",
-      c && " ↔"
+      d && " ↔"
     ] })
   ] });
-}, Me = st(
+}, xr = Object.freeze({ longPressDelay: 500, slop: 10 }), Ve = Object.freeze(["longPressDelay", "slop"]), vr = (t) => {
+  const n = t;
+  if (n === null || typeof n != "object")
+    throw new TypeError(`[@aiquants/drag-drop-panels] touchDragConfig must be an object; got ${n === null ? "null" : typeof n}`);
+  for (const e of Object.keys(n))
+    if (!Ve.includes(e))
+      throw new RangeError(`[@aiquants/drag-drop-panels] touchDragConfig has the unknown key "${e}"; the keys are ${Ve.join(", ")}`);
+  for (const e of Ve) {
+    const o = t[e];
+    if (typeof o != "number")
+      throw new TypeError(`[@aiquants/drag-drop-panels] touchDragConfig.${e} must be a number; got ${o === null ? "null" : typeof o}`);
+    if (!Number.isFinite(o) || o < 0)
+      throw new RangeError(`[@aiquants/drag-drop-panels] touchDragConfig.${e} must be a finite number of 0 or more; got ${o}`);
+  }
+}, It = Object.freeze({
+  "previous-column": "movePanelToPreviousColumn",
+  "next-column": "movePanelToNextColumn",
+  up: "movePanelUp",
+  down: "movePanelDown"
+}), br = Object.freeze({ "previous-column": Cn, "next-column": On, up: Mn, down: Dn }), yr = 'input, textarea, select, [contenteditable]:not([contenteditable="false"])', Ze = (t, n) => ({ segments: n, serial: t === null ? 1 : t.serial + 1 }), wr = "​", jr = "(prefers-reduced-motion: reduce)", Pr = () => typeof window.matchMedia == "function" && window.matchMedia(jr).matches, Er = (t) => {
+  t.key === "Enter" && t.repeat && t.preventDefault();
+}, Se = ({ action: t, label: n, tooltip: e, unavailable: o, keyShortcuts: r, onActivate: a, children: i }) => /* @__PURE__ */ s.jsx(
+  "button",
+  {
+    type: "button",
+    [Ee]: t,
+    "aria-label": n.text,
+    "aria-disabled": o ? !0 : void 0,
+    "aria-keyshortcuts": r,
+    title: e,
+    lang: n.lang,
+    className: "rounded p-1 motion-safe:transition-colors",
+    onClick: (d) => {
+      d.stopPropagation(), a();
+    },
+    children: i
+  }
+), Je = mn(
   ({
-    index: r,
-    columnIndex: e,
-    isDragging: n,
-    dragOverPosition: s,
-    originalPosition: o,
-    onDragEnter: i,
-    onDragLeave: u,
-    debugConfig: c,
-    customDrag: h
-  }) => /* @__PURE__ */ t.jsx(Ze, { index: r, columnIndex: e, isDragging: n, dragOverPosition: s, originalPosition: o, onDragEnter: i, onDragLeave: u, config: c, customDrag: h })
+    index: t,
+    columnIndex: n,
+    isDragging: e,
+    dragOverPosition: o,
+    originalPosition: r,
+    onDragEnter: a,
+    onDragLeave: i,
+    debugConfig: d,
+    customDrag: m,
+    label: w
+  }) => /* @__PURE__ */ s.jsx(Xt, { index: t, columnIndex: n, isDragging: e, dragOverPosition: o, originalPosition: r, onDragEnter: a, onDragLeave: i, config: d, customDrag: m, label: w })
 );
-Me.displayName = "LocalInsertPlaceholder";
-const Jt = ({
-  columns: r,
-  panels: e,
-  columnPanels: n,
-  // onColumnPanelsChange,
-  panelVisibility: s,
-  onPanelVisibilityChange: o,
+Je.displayName = "LocalInsertPlaceholder";
+const Ur = ({
+  columns: t,
+  panels: n,
+  columnPanels: e,
+  onColumnPanelsChange: o,
+  panelVisibility: r,
+  onPanelVisibilityChange: a,
   dragState: i,
-  dragOverPosition: u,
-  originalPanelPosition: c,
-  dragModes: h,
-  onDragStart: N,
-  onDragEnd: b,
-  onPlaceholderDragEnter: M,
-  onPlaceholderDragLeave: T,
-  onDragOverWithInsert: y,
-  onDropWithInsert: l,
-  onColumnDragLeave: j,
-  onPanelClick: k,
-  onPanelMouseDown: _,
-  onTouchStart: R,
-  onTouchMove: z,
-  onTouchEnd: Z,
-  debugConfig: Y,
-  panelSizes: U,
-  setPanelRef: $,
+  dragOverPosition: d,
+  originalPanelPosition: m,
+  dragModes: w,
+  onDragStart: b,
+  onDragEnd: A,
+  onPlaceholderDragEnter: q,
+  onPlaceholderDragLeave: j,
+  onDragOverWithInsert: E,
+  onDropWithInsert: C,
+  onColumnDragLeave: T,
+  onPanelClick: h,
+  onPanelMouseDown: P,
+  debugConfig: N,
+  panelSizes: l,
+  setPanelRef: _,
   enableResize: L = !1,
-  columnWidths: f,
+  columnWidths: B,
   // onColumnWidthChange,
-  onResizeStart: x,
-  onResize: C,
-  onResizeEnd: W,
-  isResizing: p = !1,
-  resizingColumn: g,
-  onPanelSizeInfoClick: m,
-  onToggleDragMode: v,
-  onPanelClose: D,
-  onPanelMaximizeChange: A,
-  customDrag: O,
-  dragHandle: H = "panel",
-  maximizedPanel: a = null,
-  panelClassName: d = "",
-  scale: S,
-  autoScale: X,
-  onScaleChange: G
+  onResizeStart: J,
+  onResize: p,
+  onResizeEnd: x,
+  isResizing: $ = !1,
+  resizingColumn: W,
+  onPanelSizeInfoClick: v,
+  onToggleDragMode: y,
+  onPanelClose: g,
+  onPanelMaximizeChange: D,
+  customDrag: R,
+  dragHandle: Y = "panel",
+  maximizedPanel: F = null,
+  panelClassName: X = "",
+  scale: u,
+  autoScale: f,
+  onScaleChange: S,
+  scrollRootElement: U = "div",
+  labels: K,
+  touchDragConfig: ae = xr
 }) => {
-  const Q = F(Y);
-  K(() => {
-    Q.current = Y;
-  }, [Y]);
-  const { containerRef: V, scale: re } = Ct(X?.requiredWidth ?? 0, X?.minScale), ce = a ? 1 : S ?? (X ? re : 1), se = Number.isFinite(ce) && ce > 0 ? ce : 1, ge = F(se);
-  ge.current = se, K(() => {
-    G && G(se);
-  }, [se, G]);
-  const et = se < 1 ? {
-    width: `${100 / se}%`,
-    height: `${100 / se}%`,
-    transform: `scale(${se})`,
+  if (U !== "div" && U !== "main")
+    throw new RangeError(`[@aiquants/drag-drop-panels] scrollRootElement must be "div" or "main"; got ${JSON.stringify(U)}`);
+  const G = U, H = Le(() => dr(K), [K]);
+  vr(ae);
+  const ve = fn(), ue = Le(() => {
+    const c = {};
+    return n.forEach((O) => {
+      c[O.id] = O;
+    }), c;
+  }, [n]), pe = Le(
+    () => ({
+      columnKeys: t.map((c) => c.key),
+      columnPanels: e,
+      panelVisibility: Object.fromEntries(Object.keys(r).map((c) => [c, r[c] === !0 && ue[c] !== void 0]))
+    }),
+    [t, e, r, ue]
+  ), ot = F === null ? null : Pe(pe, F), de = ot !== null, be = I(N);
+  oe(() => {
+    be.current = N;
+  }, [N]);
+  const { containerRef: rn, scale: on } = Qn(f?.requiredWidth ?? 0, f?.minScale), He = de ? 1 : u ?? (f ? on : 1), ge = Number.isFinite(He) && He > 0 ? He : 1, st = I(ge);
+  st.current = ge, oe(() => {
+    S && S(ge);
+  }, [ge, S]);
+  const sn = ge < 1 ? {
+    width: `${100 / ge}%`,
+    height: `${100 / ge}%`,
+    transform: `scale(${ge})`,
     transformOrigin: "top left"
-  } : void 0, he = F({}), Ne = F(/* @__PURE__ */ new Map());
-  K(() => {
-    E(Q.current, 1, "🎨 DragDropLayout - dragModes props changed:", {
-      dragModes: h,
+  } : void 0, he = I({}), Ye = I(/* @__PURE__ */ new Map());
+  oe(() => {
+    M(be.current, 1, "🎨 DragDropLayout - dragModes props changed:", {
+      dragModes: w,
       timestamp: (/* @__PURE__ */ new Date()).toISOString(),
-      keys: Object.keys(h),
-      values: Object.values(h)
+      keys: Object.keys(w),
+      values: Object.values(w)
     });
-  }, [h]);
-  const De = Ue(() => {
-    const P = {};
-    return e.forEach((B) => {
-      P[B.id] = B;
-    }), P;
-  }, [e]);
-  K(() => {
-    if (!(a && A))
+  }, [w]);
+  const [Fe, Be] = se(null), Ae = I(null), at = I({ arrangement: pe, labels: H, panelComponentMap: ue });
+  we(() => {
+    at.current = { arrangement: pe, labels: H, panelComponentMap: ue };
+  });
+  const lt = I(null), it = I(null), an = k((c) => {
+    it.current = c;
+  }, []), ct = I(null), Ue = (c, O) => {
+    const z = ue[O];
+    if (z === void 0) return;
+    const Q = ze(c, { title: { text: z.title, lang: void 0 } });
+    Be((ee) => Ze(ee, Q));
+  }, ut = (c, O, z, Q) => {
+    const ee = he.current[c], ne = document.activeElement, re = ee instanceof HTMLElement && ne !== null && ee.contains(ne) ? ne.closest(`[${Ee}]`)?.getAttribute(Ee) ?? Q : null;
+    Ae.current = { panelId: c, from: O, columnPanels: pe.columnPanels, focusAction: re }, o(z);
+  }, dt = (c) => {
+    for (const [O, z] of t.entries()) {
+      const Q = (e[z.key] ?? []).indexOf(c);
+      if (Q >= 0) return { columnIndex: O, panelIndex: Q };
+    }
+    return null;
+  }, ln = (c, O) => {
+    const z = Pe(pe, c), Q = t[O.columnIndex], ee = z === null || Q === void 0 ? null : Ft(e, c, Q.key, O.insertIndex);
+    if (z === null || ee === null) {
+      Ue(H.panelDragCancelled, c);
       return;
-    const P = (B) => {
-      B.key === "Escape" && A(null);
+    }
+    ut(c, z, ee, null);
+  }, ht = !(i.isDragging || R?.isActive === !0 || de), ke = cr({
+    config: ae,
+    layoutRef: lt,
+    scrollRootRef: it,
+    scale: ge,
+    canStart: ht,
+    panelElementOf: (c) => he.current[c] ?? null,
+    originOf: dt,
+    onLift: (c) => Ue(H.panelDragStarted, c),
+    onDrop: ln,
+    onCancel: (c) => Ue(H.panelDragCancelled, c)
+  }), { touchDrag: ye } = ke, mt = ye !== null && (!ht || Pe(pe, ye.panelId) === null), ft = ke.cancel;
+  oe(() => {
+    mt && ft();
+  }, [mt, ft]);
+  const $e = i.isDragging || R?.isActive === !0 || ye !== null;
+  we(() => {
+    $e && (Ae.current = null);
+  }, [$e]), we(() => {
+    const c = Ae.current;
+    if (c === null || (Ae.current = null, !Zn(c.columnPanels, e, c.panelId))) return;
+    const O = at.current, z = Pe({ ...O.arrangement, columnPanels: e }, c.panelId);
+    if (z === null || z.column === c.from.column && z.index === c.from.index) return;
+    const Q = ze(O.labels.panelMoved, { title: { text: O.panelComponentMap[c.panelId].title, lang: void 0 }, column: z.column + 1, position: z.index + 1 });
+    Be((te) => Ze(te, Q));
+    const ee = he.current[c.panelId];
+    if (c.focusAction === null || ee === null || ee === void 0) return;
+    const { activeElement: ne, body: re } = document;
+    if (ne === null || ne === re) {
+      const te = ee.querySelector(`[${Ee}="${c.focusAction}"]`);
+      te instanceof HTMLElement && te.focus({ preventScroll: !0 });
+    }
+    const V = document.activeElement;
+    V instanceof HTMLElement && ee.contains(V) && V.scrollIntoView({ block: "nearest", inline: "nearest" });
+  }, [e]), oe(() => {
+    if (!(de && D))
+      return;
+    const c = (O) => {
+      pr(O) && (O.preventDefault(), D(null));
     };
-    return document.addEventListener("keydown", P), () => document.removeEventListener("keydown", P);
-  }, [a, A]), Se(() => {
-    const P = /* @__PURE__ */ new Map();
-    Object.keys(he.current).forEach((q) => {
-      const ne = he.current[q];
-      if (ne) {
-        const de = ne.getBoundingClientRect();
-        P.set(q, {
-          rect: de,
-          height: ne.offsetHeight,
-          width: ne.offsetWidth
+    return document.addEventListener("keydown", c), () => document.removeEventListener("keydown", c);
+  }, [de, D]), we(() => {
+    const c = /* @__PURE__ */ new Map();
+    Object.keys(he.current).forEach((re) => {
+      const V = he.current[re];
+      if (V) {
+        const te = V.getBoundingClientRect();
+        c.set(re, {
+          rect: te,
+          height: V.offsetHeight,
+          width: V.offsetWidth
         });
       }
     });
-    const B = Ne.current, ee = 300, me = /* @__PURE__ */ new Set();
-    Object.values(n).forEach((q) => {
-      q.forEach((ne) => {
-        me.add(ne);
+    const O = Ye.current, z = 300, Q = /* @__PURE__ */ new Set();
+    Object.values(e).forEach((re) => {
+      re.forEach((V) => {
+        Q.add(V);
       });
-    }), new Set(B.keys()).forEach((q) => {
-      me.has(q) || (E(Q.current, 1, "パネル削除検出 - クリーンアップ:", q), B.delete(q), he.current[q] && delete he.current[q]);
-    }), P.forEach((q, ne) => {
-      const de = B.get(ne);
-      if (de) {
-        const J = de.rect.left - q.rect.left, fe = de.rect.top - q.rect.top;
-        if (J !== 0 || fe !== 0) {
-          E(Q.current, 2, "パネル移動検出 - アニメーション開始:", ne, { dx: J, dy: fe });
-          const ae = he.current[ne];
-          if (ae) {
-            const be = ge.current || 1;
-            ae.style.transform = `translate(${J / be}px, ${fe / be}px)`, ae.style.transition = "none", ae.classList.add("is-moving"), requestAnimationFrame(() => {
-              ae.style.transition = `transform ${ee}ms cubic-bezier(0.2, 0, 0.2, 1)`, ae.style.transform = "translate(0, 0)", setTimeout(() => {
-                ae.style.transition = "", ae.style.transform = "", ae.classList.remove("is-moving");
-              }, ee);
+    }), new Set(O.keys()).forEach((re) => {
+      Q.has(re) || (M(be.current, 1, "パネル削除検出 - クリーンアップ:", re), O.delete(re), he.current[re] && delete he.current[re]);
+    });
+    const ne = !Pr();
+    c.forEach((re, V) => {
+      if (!ne) return;
+      const te = O.get(V);
+      if (te) {
+        const le = te.rect.left - re.rect.left, xe = te.rect.top - re.rect.top;
+        if (le !== 0 || xe !== 0) {
+          M(be.current, 2, "パネル移動検出 - アニメーション開始:", V, { dx: le, dy: xe });
+          const ce = he.current[V];
+          if (ce) {
+            const Te = st.current || 1;
+            ce.style.transform = `translate(${le / Te}px, ${xe / Te}px)`, ce.style.transition = "none", ce.classList.add("is-moving"), requestAnimationFrame(() => {
+              ce.style.transition = `transform ${z}ms cubic-bezier(0.2, 0, 0.2, 1)`, ce.style.transform = "translate(0, 0)", setTimeout(() => {
+                ce.style.transition = "", ce.style.transform = "", ce.classList.remove("is-moving");
+              }, z);
             });
           }
         }
       } else {
-        E(Q.current, 1, "新規パネル検出 - フェードインアニメーション:", ne);
-        const J = he.current[ne];
-        J && (J.style.opacity = "0", J.style.transition = "none", requestAnimationFrame(() => {
-          J.style.transition = `opacity ${ee}ms ease-out`, J.style.opacity = "1", setTimeout(() => {
-            J.style.transition = "", J.style.opacity = "";
-          }, ee);
+        M(be.current, 1, "新規パネル検出 - フェードインアニメーション:", V);
+        const le = he.current[V];
+        le && (le.style.opacity = "0", le.style.transition = "none", requestAnimationFrame(() => {
+          le.style.transition = `opacity ${z}ms ease-out`, le.style.opacity = "1", setTimeout(() => {
+            le.style.transition = "", le.style.opacity = "";
+          }, z);
         }));
       }
-    }), Ne.current = P;
-  }, [n]), Se(() => {
-    const P = /* @__PURE__ */ new Map();
-    Object.keys(he.current).forEach((B) => {
-      const ee = he.current[B];
-      ee && P.set(B, { rect: ee.getBoundingClientRect(), height: ee.offsetHeight, width: ee.offsetWidth });
-    }), Ne.current = P;
-  }, [se]);
-  const tt = (P) => {
-    if (!s[P]) return null;
-    const B = De[P];
-    if (!B)
-      return E(Q.current, 1, `Panel config not found for panelId: ${P}`), null;
-    const ee = B.component, me = B.title, ue = i.draggedPanel === P, q = h[P] || "normal";
-    E(Q.current, 2, `🎨 renderPanel - ${P}:`, {
-      panelId: P,
-      dragMode: q,
+    }), Ye.current = c;
+  }, [e]), we(() => {
+    const c = /* @__PURE__ */ new Map();
+    Object.keys(he.current).forEach((O) => {
+      const z = he.current[O];
+      z && c.set(O, { rect: z.getBoundingClientRect(), height: z.offsetHeight, width: z.offsetWidth });
+    }), Ye.current = c;
+  }, [ge]);
+  const pt = (c, O, z) => {
+    if ($e) return;
+    const Q = Vn(pe, c, O);
+    if (Q === null) {
+      if (z) {
+        const ee = ze(H.panelMoveUnavailable, { title: { text: ue[c].title, lang: void 0 }, move: H[It[O]] });
+        Be((ne) => Ze(ne, ee));
+      }
+      return;
+    }
+    ut(c, Q.from, Q.columnPanels, `move-${O}`);
+  }, cn = (c, O) => {
+    if (c.defaultPrevented || de || !(c.target instanceof Node && c.currentTarget.contains(c.target))) return;
+    const z = Gn(c);
+    z !== null && (c.target instanceof Element && c.target.closest(yr) !== null || (c.preventDefault(), !c.repeat && pt(O, z, !0)));
+  }, gt = (c, O) => {
+    const z = ct.current;
+    if (z === "touch" || z === "pen") {
+      c.preventDefault();
+      return;
+    }
+    b(c, O);
+  }, Xe = ye === null ? d : ye.over, xt = ye === null ? m : dt(ye.panelId), un = (c) => {
+    if (!r[c]) return null;
+    const O = ue[c];
+    if (!O)
+      return M(be.current, 1, `Panel config not found for panelId: ${c}`), null;
+    const z = O.component, Q = O.title, ee = i.draggedPanel === c || ye?.panelId === c, ne = w[c] || "normal";
+    M(be.current, 2, `🎨 renderPanel - ${c}:`, {
+      panelId: c,
+      dragMode: ne,
       timestamp: (/* @__PURE__ */ new Date()).toISOString()
     });
-    const ne = (I) => {
-      he.current[P] = I, $ && $(P, I), I && Y.showPanelSizes && requestAnimationFrame(() => {
-        const ye = I.getBoundingClientRect(), Le = window.getComputedStyle(I);
-        E(Q.current, 1, `Panel ${P} mounted with size:`, {
-          width: ye.width,
-          height: ye.height,
-          x: ye.left,
-          y: ye.top,
-          minHeight: Le.minHeight,
-          maxHeight: Le.maxHeight
+    const re = (Z) => {
+      he.current[c] = Z, _ && _(c, Z), Z && N.showPanelSizes && requestAnimationFrame(() => {
+        const je = Z.getBoundingClientRect(), Ce = window.getComputedStyle(Z);
+        M(be.current, 1, `Panel ${c} mounted with size:`, {
+          width: je.width,
+          height: je.height,
+          x: je.left,
+          y: je.top,
+          minHeight: Ce.minHeight,
+          maxHeight: Ce.maxHeight
         });
       });
-    }, de = U[P], J = a === P, fe = !!A, ae = () => A?.(J ? null : P), be = J ? {
+    }, V = l[c], te = F === c, le = !!D, xe = () => D?.(te ? null : c), ce = te ? null : new Set(Xn(pe, c)), Te = te ? {
       position: "fixed",
       top: "var(--aqdd-maximize-top, 0px)",
       right: "var(--aqdd-maximize-right, 0px)",
@@ -917,473 +1499,475 @@ const Jt = ({
       minHeight: 0,
       maxHeight: "none"
     } : {
-      minHeight: B.minHeight ?? "200px",
-      maxHeight: B.maxHeight ?? "500px"
-    }, ve = H === "header", Oe = q === "normal" && !ve && !J, Te = q === "normal" && ve && !J, _e = ue ? "cursor-grabbing" : "cursor-grab", Re = `panel-draggable group relative flex flex-col overflow-hidden border border-slate-200 text-left shadow-lg backdrop-blur-lg ${q === "custom" ? "select-none" : ""}`, rt = J ? (
-      // 最大化中: 角丸・ホバー演出・grab カーソル無し、背景は不透過寄りで下のレイアウトを遮蔽
-      `${Re} rounded-none bg-white/95 p-4 ${d}`
-    ) : `${Re} rounded-2xl bg-white/80 p-4 transition-all duration-300 hover:-translate-y-1 hover:shadow-xl ${ve ? "" : _e} ${d}`;
+      minHeight: O.minHeight ?? "200px",
+      maxHeight: O.maxHeight ?? "500px"
+    }, Re = Y === "header", bt = ne === "normal" && !Re && !te, yt = ne === "normal" && Re && !te, wt = ee ? "cursor-grabbing" : "cursor-grab", jt = `panel-draggable relative flex flex-col overflow-hidden border text-left shadow-lg backdrop-blur-lg ${ne === "custom" ? "select-none" : ""}`, hn = te ? (
+      // 最大化中: 角丸・ホバー演出・grab カーソル無し (下のレイアウトを遮蔽する不透過寄りの面は CSS が data-maximized で描く)
+      `${jt} rounded-none p-4 ${X}`
+    ) : `${jt} rounded-2xl p-4 motion-safe:transition-all motion-safe:duration-300 motion-safe:hover:-translate-y-1 hover:shadow-xl ${Re ? "" : wt} ${X}`, Pt = ne === "custom" ? H.switchToNormalDragMode : H.switchToCustomDragMode, Et = te ? H.restorePanel : H.maximizePanel;
     return (
       // biome-ignore lint/a11y/noStaticElementInteractions: クリックイベントを持つ静的要素
-      /* @__PURE__ */ t.jsxs(
+      /* @__PURE__ */ s.jsxs(
         "div",
         {
-          ref: ne,
-          "data-panel-id": P,
-          "data-dragging": ue,
-          "data-maximized": J || void 0,
+          ref: re,
+          "data-panel-id": c,
+          "data-aqdd-panel": !0,
+          "data-aqdd-drag-mode": ne,
+          "data-dragging": ee,
+          "data-maximized": te || void 0,
           role: "presentation",
-          draggable: Oe,
-          onDragStart: (I) => Oe && N(I, P),
-          onDragEnd: b,
-          onClick: (I) => k?.(I, P),
-          onMouseDown: (I) => _?.(I, P),
-          onTouchStart: (I) => R?.(I, P),
-          onTouchMove: z,
-          onTouchEnd: Z,
-          style: be,
-          className: rt,
+          draggable: bt,
+          onDragStart: (Z) => bt && gt(Z, c),
+          onDragEnd: A,
+          onClick: (Z) => h?.(Z, c),
+          onMouseDown: (Z) => P?.(Z, c),
+          onKeyDown: (Z) => cn(Z, c),
+          style: Te,
+          className: hn,
           children: [
-            /* @__PURE__ */ t.jsxs(
+            /* @__PURE__ */ s.jsxs(
               "div",
               {
-                className: `group relative mb-3 flex items-center justify-between ${ve && !J ? _e : ""}`,
-                draggable: Te,
-                onDragStart: (I) => Te && N(I, P),
-                onDoubleClick: fe ? (I) => {
-                  I.stopPropagation(), ae();
+                ref: ke.bindHeader,
+                "data-aqdd-panel-header": !0,
+                className: `relative mb-3 ${Re && !te ? wt : ""}`,
+                draggable: yt,
+                onDragStart: (Z) => yt && gt(Z, c),
+                onPointerDown: (Z) => ke.pressHeader(Z, c),
+                onContextMenu: ke.holdContextMenu,
+                onKeyDown: Er,
+                onDoubleClick: le ? (Z) => {
+                  Z.stopPropagation(), !(Z.target instanceof Element && Z.target.closest(`[${Ee}]`) !== null) && xe();
                 } : void 0,
                 children: [
-                  /* @__PURE__ */ t.jsxs("div", { className: "flex items-center space-x-2", children: [
-                    /* @__PURE__ */ t.jsx("h3", { className: "font-semibold text-lg text-slate-700 transition-colors group-hover:text-slate-900", children: me }),
-                    q === "custom" && /* @__PURE__ */ t.jsx("span", { className: "rounded-md bg-orange-100 px-2 py-1 font-medium text-orange-600 text-xs", children: "Custom" })
-                  ] }),
-                  /* @__PURE__ */ t.jsxs("div", { className: "flex items-center space-x-1 opacity-0 transition-opacity group-hover:opacity-100", children: [
-                    /* @__PURE__ */ t.jsx(
-                      "button",
-                      {
-                        type: "button",
-                        onClick: (I) => {
-                          I.stopPropagation(), v && v(P);
-                        },
-                        onKeyDown: (I) => {
-                          (I.key === "Enter" || I.key === " ") && (I.preventDefault(), I.stopPropagation(), v && v(P));
-                        },
-                        tabIndex: 0,
-                        className: `cursor-pointer rounded p-1 text-xs transition-colors ${q === "custom" ? "bg-orange-100 text-orange-600 hover:bg-orange-200" : "text-slate-400 hover:bg-slate-100 hover:text-slate-600"}`,
-                        title: q === "custom" ? "通常ドラッグモードに戻す" : "カスタムドラッグモードに切り替え",
-                        children: q === "custom" ? /* @__PURE__ */ t.jsx(kt, { className: "h-4 w-4" }) : /* @__PURE__ */ t.jsx(jt, { className: "h-4 w-4" })
-                      }
-                    ),
-                    !J && /* @__PURE__ */ t.jsx(
-                      "button",
-                      {
-                        type: "button",
-                        onClick: (I) => {
-                          I.stopPropagation(), o({
-                            ...s,
-                            [P]: !1
-                          });
-                        },
-                        className: "rounded p-1 text-slate-400 transition-colors hover:bg-slate-100 hover:text-slate-600",
-                        title: "パネルを非表示",
-                        children: /* @__PURE__ */ t.jsx(Xe, { className: "h-4 w-4" })
-                      }
-                    ),
-                    fe && /* @__PURE__ */ t.jsx(
-                      "button",
-                      {
-                        type: "button",
-                        onClick: (I) => {
-                          I.stopPropagation(), ae();
-                        },
-                        className: "rounded p-1 text-slate-400 transition-colors hover:bg-slate-100 hover:text-slate-600",
-                        title: J ? "元のサイズに戻す" : "パネルを最大化",
-                        children: J ? /* @__PURE__ */ t.jsx(yt, { className: "h-4 w-4" }) : /* @__PURE__ */ t.jsx(bt, { className: "h-4 w-4" })
-                      }
-                    ),
-                    D && /* @__PURE__ */ t.jsx(
-                      "button",
-                      {
-                        type: "button",
-                        onClick: (I) => {
-                          I.stopPropagation(), D(P);
-                        },
-                        className: "rounded p-1 text-slate-400 transition-colors hover:bg-slate-100 hover:text-red-500",
-                        title: "パネルを閉じる",
-                        children: /* @__PURE__ */ t.jsx(Ve, { className: "h-4 w-4" })
-                      }
-                    )
+                  /* @__PURE__ */ s.jsx("h3", { "data-aqdd-panel-title": !0, className: "font-semibold text-lg", children: Q }),
+                  /* @__PURE__ */ s.jsxs("div", { "data-aqdd-panel-controls": !0, children: [
+                    ne === "custom" && /* @__PURE__ */ s.jsx("span", { "data-aqdd-custom-badge": !0, lang: H.customDragModeBadge.lang, className: "rounded-md px-2 py-1 font-medium text-xs", children: H.customDragModeBadge.text }),
+                    /* @__PURE__ */ s.jsxs("div", { "data-aqdd-panel-buttons": !0, children: [
+                      ce !== null && De.map((Z) => {
+                        const je = br[Z], Ce = H[It[Z]], Dt = Ut[Z];
+                        return /* @__PURE__ */ s.jsx(Se, { action: `move-${Z}`, label: Ce, tooltip: `${Ce.text} (${Dt.text})`, unavailable: !ce.has(Z), keyShortcuts: Dt.aria, onActivate: () => pt(c, Z, !1), children: /* @__PURE__ */ s.jsx(je, { className: "h-4 w-4", "aria-hidden": "true" }) }, Z);
+                      }),
+                      /* @__PURE__ */ s.jsx(Se, { action: "drag-mode", label: Pt, tooltip: Pt.text, unavailable: !1, keyShortcuts: void 0, onActivate: () => y?.(c), children: ne === "custom" ? /* @__PURE__ */ s.jsx(Hn, { className: "h-4 w-4", "aria-hidden": "true" }) : /* @__PURE__ */ s.jsx(qn, { className: "h-4 w-4", "aria-hidden": "true" }) }),
+                      !te && /* @__PURE__ */ s.jsx(Se, { action: "hide", label: H.hidePanel, tooltip: H.hidePanel.text, unavailable: !1, keyShortcuts: void 0, onActivate: () => a({ ...r, [c]: !1 }), children: /* @__PURE__ */ s.jsx(St, { className: "h-4 w-4", "aria-hidden": "true" }) }),
+                      le && /* @__PURE__ */ s.jsx(Se, { action: te ? "restore" : "maximize", label: Et, tooltip: Et.text, unavailable: !1, keyShortcuts: void 0, onActivate: xe, children: te ? /* @__PURE__ */ s.jsx(zn, { className: "h-4 w-4", "aria-hidden": "true" }) : /* @__PURE__ */ s.jsx(_n, { className: "h-4 w-4", "aria-hidden": "true" }) }),
+                      g && /* @__PURE__ */ s.jsx(Se, { action: "close", label: H.closePanel, tooltip: H.closePanel.text, unavailable: !1, keyShortcuts: void 0, onActivate: () => g(c), children: /* @__PURE__ */ s.jsx(Yt, { className: "h-4 w-4", "aria-hidden": "true" }) })
+                    ] })
                   ] })
                 ]
               }
             ),
-            /* @__PURE__ */ t.jsx("div", { "data-aqdd-scroll-area": !0, className: "panel-scroll-area min-h-0 flex-1 overflow-y-auto", children: /* @__PURE__ */ t.jsx(ee, { ...B.props || {} }) }),
-            /* @__PURE__ */ t.jsx(Dt, { config: Y, panelId: P, sizeInfo: de, onSizeInfoClick: (I) => m?.(I, P) })
+            /* @__PURE__ */ s.jsx("div", { "data-aqdd-scroll-area": !0, className: "panel-scroll-area min-h-0 flex-1 overflow-y-auto", children: /* @__PURE__ */ s.jsx(z, { ...O.props || {} }) }),
+            /* @__PURE__ */ s.jsx(Fn, { config: N, panelId: c, sizeInfo: V, onSizeInfoClick: (Z) => v?.(Z, c) })
           ]
         },
-        P
+        c
       )
     );
-  }, nt = (P, B) => {
-    const ee = n[P] || [];
-    let me = !1;
-    for (const q of ee)
-      if (s[q]) {
-        me = !0;
+  }, dn = (c, O) => {
+    const z = e[c] || [];
+    let Q = !1;
+    for (const V of z)
+      if (r[V]) {
+        Q = !0;
         break;
       }
-    const ue = i.isDragging || (O?.isActive ?? !1);
-    return /* @__PURE__ */ t.jsx(Ge, { columnIndex: B, isDragging: ue, dragOverPosition: u, config: Y, children: /* @__PURE__ */ t.jsxs(
+    const ee = $e, ne = Lt(H.dropZone, { column: O + 1 }), re = `${ve}-drop-zone-${O}`;
+    return /* @__PURE__ */ s.jsx(Vt, { columnIndex: O, isDragging: ee, dragOverPosition: Xe, config: N, children: /* @__PURE__ */ s.jsxs(
       "section",
       {
         "data-drop-zone": "true",
-        "data-column-key": P,
-        "data-column-index": B,
-        "aria-label": `Drop zone for column ${B + 1}`,
-        onDragOver: (q) => y(q, B),
-        onDrop: (q) => l(q, P),
-        onDragLeave: j,
-        className: "relative flex h-full flex-col transition-all duration-200",
+        "data-column-key": c,
+        "data-column-index": O,
+        "aria-labelledby": re,
+        onDragOver: (V) => E(V, O),
+        onDrop: (V) => C(V, c),
+        onDragLeave: T,
+        className: "relative flex h-full flex-col motion-safe:transition-all motion-safe:duration-200",
         children: [
-          /* @__PURE__ */ t.jsx("div", { className: "placeholder-container", children: /* @__PURE__ */ t.jsx(
-            Me,
+          /* @__PURE__ */ s.jsx("span", { id: re, hidden: !0, lang: ne.lang, children: ne.text }),
+          /* @__PURE__ */ s.jsx("div", { className: "placeholder-container", inert: de, children: /* @__PURE__ */ s.jsx(
+            Je,
             {
               index: 0,
-              columnIndex: B,
-              isDragging: ue,
-              dragOverPosition: u,
-              originalPosition: c,
-              onDragEnter: M,
-              onDragLeave: T,
-              debugConfig: Y,
-              customDrag: O
+              columnIndex: O,
+              isDragging: ee,
+              dragOverPosition: Xe,
+              originalPosition: xt,
+              onDragEnter: q,
+              onDragLeave: j,
+              debugConfig: N,
+              customDrag: R,
+              label: H.dropHere
             }
           ) }),
-          ee.map((q, ne) => {
-            const de = s[q], J = !(de || ue);
-            return /* @__PURE__ */ t.jsxs("div", { className: `panel-with-placeholder ${J ? "m-0 h-0 overflow-hidden p-0" : ""}`, "data-panel-hidden": J ? "true" : void 0, "aria-hidden": J ? "true" : void 0, children: [
-              de ? tt(q) : ue ? (
-                /* ドラッグ中のみ隠されたパネルのダミー表示 */
-                /* @__PURE__ */ t.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: [
-                  /* @__PURE__ */ t.jsxs("div", { className: "mb-2 flex items-center space-x-2", children: [
-                    /* @__PURE__ */ t.jsx("h3", { className: "font-semibold text-amber-700 text-base", children: De[q]?.title || q }),
-                    /* @__PURE__ */ t.jsx("span", { className: "rounded-md bg-amber-100 px-2 py-1 font-medium text-amber-600 text-xs", children: "非表示" })
-                  ] }),
-                  /* @__PURE__ */ t.jsx("div", { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ t.jsx("div", { className: "flex h-full items-center justify-center", children: /* @__PURE__ */ t.jsxs("div", { className: "text-center text-amber-600", children: [
-                    /* @__PURE__ */ t.jsx(Xe, { className: "mx-auto h-6 w-6 opacity-50" }),
-                    /* @__PURE__ */ t.jsx("p", { className: "mt-1 text-xs", children: "このパネルは非表示です" })
-                  ] }) }) })
-                ] })
-              ) : null,
-              /* @__PURE__ */ t.jsx(
-                Me,
-                {
-                  index: ne + 1,
-                  columnIndex: B,
-                  isDragging: ue,
-                  dragOverPosition: u,
-                  originalPosition: c,
-                  onDragEnter: M,
-                  onDragLeave: T,
-                  debugConfig: Y,
-                  customDrag: O
-                }
-              )
-            ] }, `panel-${q}`);
+          z.map((V, te) => {
+            const le = r[V], xe = !(le || ee), ce = de && V === F;
+            return /* @__PURE__ */ s.jsxs(
+              "div",
+              {
+                className: `panel-with-placeholder ${xe ? "m-0 h-0 overflow-hidden p-0" : ""}`,
+                "data-panel-hidden": xe ? "true" : void 0,
+                "aria-hidden": xe ? "true" : void 0,
+                inert: de && !ce,
+                children: [
+                  le ? un(V) : ee ? (
+                    /* ドラッグ中のみ隠されたパネルの代わりを出す (面・枠線・文字・印の色は CSS が --aqdd-* の変数から描く) */
+                    /* @__PURE__ */ s.jsxs("div", { "data-aqdd-hidden-panel-stand-in": !0, className: "hidden-panel-placeholder relative h-[120px] rounded-2xl border-2 border-dashed p-3 text-left shadow-lg backdrop-blur-lg", children: [
+                      /* @__PURE__ */ s.jsxs("div", { className: "mb-2 flex items-center space-x-2", children: [
+                        /* @__PURE__ */ s.jsx("h3", { className: "font-semibold text-base", children: ue[V]?.title || V }),
+                        /* @__PURE__ */ s.jsx("span", { "data-aqdd-hidden-panel-badge": !0, lang: H.hiddenPanelBadge.lang, className: "rounded-md px-2 py-1 font-medium text-xs", children: H.hiddenPanelBadge.text })
+                      ] }),
+                      /* @__PURE__ */ s.jsx("div", { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ s.jsx("div", { className: "flex h-full items-center justify-center", children: /* @__PURE__ */ s.jsxs("div", { className: "text-center", children: [
+                        /* @__PURE__ */ s.jsx(St, { className: "mx-auto h-6 w-6 opacity-50", "aria-hidden": "true" }),
+                        /* @__PURE__ */ s.jsx("p", { lang: H.hiddenPanelNotice.lang, className: "mt-1 text-xs", children: H.hiddenPanelNotice.text })
+                      ] }) }) })
+                    ] })
+                  ) : null,
+                  ce ? null : /* @__PURE__ */ s.jsx(
+                    Je,
+                    {
+                      index: te + 1,
+                      columnIndex: O,
+                      isDragging: ee,
+                      dragOverPosition: Xe,
+                      originalPosition: xt,
+                      onDragEnter: q,
+                      onDragLeave: j,
+                      debugConfig: N,
+                      customDrag: R,
+                      label: H.dropHere
+                    }
+                  )
+                ]
+              },
+              `panel-${V}`
+            );
           }),
-          !(me || ue) && /* @__PURE__ */ t.jsx("div", { className: "flex-shrink-0 rounded-xl border-2 border-slate-200 border-dashed bg-white/30 p-8 text-center text-slate-400 transition-all duration-200", children: /* @__PURE__ */ t.jsx("div", { className: "text-sm", children: "このエリアは空です" }) })
+          !(Q || ee) && /* @__PURE__ */ s.jsx("div", { "data-aqdd-empty-column": !0, className: "flex-shrink-0 rounded-xl border-2 border-dashed p-8 text-center motion-safe:transition-all motion-safe:duration-200", inert: de, children: /* @__PURE__ */ s.jsx("div", { lang: H.emptyColumn.lang, className: "text-sm", children: H.emptyColumn.text }) })
         ]
       }
     ) });
-  }, Ae = Object.keys(s).filter((P) => !s[P]);
-  return /* @__PURE__ */ t.jsxs("div", { className: "flex h-full flex-col", children: [
-    Ae.length > 0 && /* @__PURE__ */ t.jsx("div", { className: "border-slate-200 border-b bg-white/70 px-4 py-2 backdrop-blur-lg", children: /* @__PURE__ */ t.jsxs("div", { className: "flex flex-wrap gap-2", children: [
-      /* @__PURE__ */ t.jsx("span", { className: "mr-2 text-slate-600 text-sm", children: "非表示のパネル:" }),
-      Ae.map((P) => {
-        const ee = De[P]?.title || P;
-        return /* @__PURE__ */ t.jsxs(
-          "button",
-          {
-            type: "button",
-            onClick: () => o({
-              ...s,
-              [P]: !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: [
-              /* @__PURE__ */ t.jsx(pt, { className: "h-3 w-3" }),
-              /* @__PURE__ */ t.jsx("span", { children: ee })
-            ]
-          },
-          P
-        );
-      })
-    ] }) }),
-    /* @__PURE__ */ t.jsx("div", { ref: V, className: "relative min-h-0 flex-1 overflow-hidden", children: /* @__PURE__ */ t.jsx("div", { className: "h-full w-full", style: et, children: /* @__PURE__ */ t.jsx("main", { "data-aqdd-scroll-root": !0, className: "no-scrollbar h-full max-w-full flex-1 overflow-auto px-4 py-6 sm:px-6", children: /* @__PURE__ */ t.jsx("div", { className: "relative flex h-full items-start gap-6 pr-4", children: r.map((P, B) => {
-      const ee = f?.[P.id] || P.initialWidth || 350, me = L && (P.resizable ?? !0);
-      return /* @__PURE__ */ t.jsx(ot, { children: /* @__PURE__ */ t.jsxs(
-        "div",
-        {
-          className: `column relative ${P.className || ""} ${L ? "resize-enabled-column" : "auto-width-column"} ${p && g === P.id ? "column-resizing-active" : ""}`,
-          "data-column": B,
-          "data-column-id": P.id,
-          "data-min-width": P.minWidth || 350,
-          "data-max-width": P.maxWidth,
-          "data-column-width": L ? ee : void 0,
-          ...L && {
-            style: { "--column-width": `${ee}px` }
-          },
-          children: [
-            nt(P.key, B),
-            me && x && C && W && /* @__PURE__ */ t.jsx(Je, { columnId: P.id, onResizeStart: x, onResize: C, onResizeEnd: W, isResizing: p && g === P.id, position: "right", debug: Y })
-          ]
-        }
-      ) }, P.id);
-    }) }) }) }) })
-  ] });
+  }, vt = Object.keys(r).filter((c) => !r[c]);
+  return /* @__PURE__ */ s.jsxs(
+    "div",
+    {
+      ref: lt,
+      "data-aqdd-layout": !0,
+      className: "flex h-full flex-col",
+      onPointerDownCapture: (c) => {
+        ct.current = c.pointerType;
+      },
+      children: [
+        /* @__PURE__ */ s.jsxs("div", { "data-aqdd-announcer": !0, role: "status", "aria-live": "polite", "aria-atomic": "true", inert: de, children: [
+          Fe?.segments.map(
+            (c, O) => c.lang === void 0 ? c.text : /* @__PURE__ */ s.jsx("span", { lang: c.lang, children: c.text }, O)
+          ),
+          Fe !== null && Fe.serial % 2 === 0 ? wr : null
+        ] }),
+        vt.length > 0 && /* @__PURE__ */ s.jsx("div", { "data-aqdd-hidden-panels": !0, className: "border-b px-4 py-2 backdrop-blur-lg", inert: de, children: /* @__PURE__ */ s.jsxs("div", { className: "flex flex-wrap gap-2", children: [
+          /* @__PURE__ */ s.jsx("span", { lang: H.hiddenPanels.lang, className: "mr-2 text-sm", children: H.hiddenPanels.text }),
+          vt.map((c) => {
+            const z = ue[c]?.title || c;
+            return /* @__PURE__ */ s.jsxs(
+              "button",
+              {
+                type: "button",
+                "data-aqdd-restore-panel": c,
+                onClick: () => a({
+                  ...r,
+                  [c]: !0
+                }),
+                className: "flex items-center space-x-1 rounded-lg px-3 py-1 text-sm shadow-md hover:shadow-lg motion-safe:transition-all motion-safe:duration-200",
+                children: [
+                  /* @__PURE__ */ s.jsx($n, { className: "h-3 w-3", "aria-hidden": "true" }),
+                  /* @__PURE__ */ s.jsx("span", { children: z })
+                ]
+              },
+              c
+            );
+          })
+        ] }) }),
+        /* @__PURE__ */ s.jsx("div", { ref: rn, className: "relative min-h-0 flex-1 overflow-hidden", children: /* @__PURE__ */ s.jsx("div", { className: "h-full w-full", style: sn, children: /* @__PURE__ */ s.jsx(G, { ref: an, "data-aqdd-scroll-root": !0, className: "no-scrollbar h-full max-w-full flex-1 overflow-auto", children: /* @__PURE__ */ s.jsx("div", { "data-aqdd-columns": !0, className: "relative flex h-full items-start", children: t.map((c, O) => {
+          const z = B?.[c.id] || c.initialWidth || 350, Q = L && (c.resizable ?? !0);
+          return /* @__PURE__ */ s.jsx(pn, { children: /* @__PURE__ */ s.jsxs(
+            "div",
+            {
+              className: `column relative ${c.className || ""} ${L ? "resize-enabled-column" : "auto-width-column"} ${$ && W === c.id ? "column-resizing-active" : ""}`,
+              "data-column": O,
+              "data-column-id": c.id,
+              "data-min-width": c.minWidth || 350,
+              "data-max-width": c.maxWidth,
+              "data-column-width": L ? z : void 0,
+              inert: de && O !== ot.column,
+              ...L && {
+                style: { "--column-width": `${z}px` }
+              },
+              children: [
+                dn(c.key, O),
+                Q && !de && J && p && x && /* @__PURE__ */ s.jsx(
+                  tn,
+                  {
+                    columnId: c.id,
+                    onResizeStart: J,
+                    onResize: p,
+                    onResizeEnd: x,
+                    isResizing: $ && W === c.id,
+                    position: "right",
+                    debug: N,
+                    label: Lt(H.resizeColumn, { column: O + 1 })
+                  }
+                )
+              ]
+            }
+          ) }, c.id);
+        }) }) }) }) })
+      ]
+    }
+  );
 };
-const Mt = [
+const Dr = [
   ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
   ["path", { d: "M3 9h18", key: "1pudct" }],
   ["path", { d: "M3 15h18", key: "5xshup" }],
   ["path", { d: "M9 3v18", key: "fh3hqa" }],
   ["path", { d: "M15 3v18", key: "14nvp0" }]
-], $t = oe("grid-3x3", Mt);
-const At = [["path", { d: "M5 12h14", key: "1ays0h" }]], Ot = oe("minus", At);
-const Tt = [
+], kr = ie("grid-3x3", Dr);
+const Cr = [["path", { d: "M5 12h14", key: "1ays0h" }]], Nr = ie("minus", Cr);
+const Or = [
   ["path", { d: "M5 12h14", key: "1ays0h" }],
   ["path", { d: "M12 5v14", key: "s699le" }]
-], $e = oe("plus", Tt);
-const _t = [
+], Qe = ie("plus", Or);
+const Sr = [
   ["path", { d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8", key: "1357e3" }],
   ["path", { d: "M3 3v5h5", key: "1xhq8a" }]
-], Rt = oe("rotate-ccw", _t), Qt = ({ columnCount: r, onColumnCountChange: e, onAutoBalance: n, onResetWidths: s, minColumns: o = 2, maxColumns: i = 6, isResizing: u = !1, isResponsiveMode: c = !1, responsiveColumnCount: h }) => {
-  const N = r > o && !c, b = r < i && !c;
-  return /* @__PURE__ */ t.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: [
-    /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ t.jsx("span", { className: "font-medium text-slate-700 text-sm", children: "カラム数:" }),
-      /* @__PURE__ */ t.jsx(
+], Mr = ie("rotate-ccw", Sr), Xr = ({ columnCount: t, onColumnCountChange: n, onAutoBalance: e, onResetWidths: o, minColumns: r = 2, maxColumns: a = 6, isResizing: i = !1, isResponsiveMode: d = !1, responsiveColumnCount: m }) => {
+  const w = t > r && !d, b = t < a && !d;
+  return /* @__PURE__ */ s.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: [
+    /* @__PURE__ */ s.jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ s.jsx("span", { className: "font-medium text-slate-700 text-sm", children: "カラム数:" }),
+      /* @__PURE__ */ s.jsx(
         "button",
         {
           type: "button",
-          onClick: () => N && e(r - 1),
-          disabled: !N || u,
-          className: `rounded p-1 text-xs transition-colors ${N && !u ? "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: c ? "レスポンシブモード中：カラム数は自動調整されます" : `カラムを削除 (最小: ${o}列)`,
-          children: /* @__PURE__ */ t.jsx(Ot, { className: "h-3 w-3" })
+          onClick: () => w && n(t - 1),
+          disabled: !w || i,
+          className: `rounded p-1 text-xs transition-colors ${w && !i ? "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: d ? "レスポンシブモード中：カラム数は自動調整されます" : `カラムを削除 (最小: ${r}列)`,
+          children: /* @__PURE__ */ s.jsx(Nr, { className: "h-3 w-3" })
         }
       ),
-      /* @__PURE__ */ t.jsxs("div", { className: `min-w-[2rem] rounded border px-3 py-1 text-center font-mono text-sm ${c ? "border-blue-300 bg-blue-50 text-blue-700" : "border-slate-300 bg-slate-100 text-slate-700"}`, children: [
-        c ? h ?? r : r,
-        c && /* @__PURE__ */ t.jsx("span", { className: "ml-1 text-xs", children: "自動" })
+      /* @__PURE__ */ s.jsxs("div", { className: `min-w-[2rem] rounded border px-3 py-1 text-center font-mono text-sm ${d ? "border-blue-300 bg-blue-50 text-blue-700" : "border-slate-300 bg-slate-100 text-slate-700"}`, children: [
+        d ? m ?? t : t,
+        d && /* @__PURE__ */ s.jsx("span", { className: "ml-1 text-xs", children: "自動" })
       ] }),
-      /* @__PURE__ */ t.jsx(
+      /* @__PURE__ */ s.jsx(
         "button",
         {
           type: "button",
-          onClick: () => b && e(r + 1),
-          disabled: !b || u,
-          className: `rounded p-1 text-xs transition-colors ${b && !u ? "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: c ? "レスポンシブモード中：カラム数は自動調整されます" : `カラムを追加 (最大: ${i}列)`,
-          children: /* @__PURE__ */ t.jsx($e, { className: "h-3 w-3" })
+          onClick: () => b && n(t + 1),
+          disabled: !b || i,
+          className: `rounded p-1 text-xs transition-colors ${b && !i ? "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: d ? "レスポンシブモード中：カラム数は自動調整されます" : `カラムを追加 (最大: ${a}列)`,
+          children: /* @__PURE__ */ s.jsx(Qe, { className: "h-3 w-3" })
         }
       )
     ] }),
-    /* @__PURE__ */ t.jsx("div", { className: "h-6 w-px bg-slate-300" }),
-    /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ t.jsxs(
+    /* @__PURE__ */ s.jsx("div", { className: "h-6 w-px bg-slate-300" }),
+    /* @__PURE__ */ s.jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ s.jsxs(
         "button",
         {
           type: "button",
-          onClick: n,
-          disabled: u,
-          className: `flex items-center gap-1 rounded px-2 py-1 text-xs transition-colors ${u ? "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"}`,
+          onClick: e,
+          disabled: i,
+          className: `flex items-center gap-1 rounded px-2 py-1 text-xs transition-colors ${i ? "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: [
-            /* @__PURE__ */ t.jsx($t, { className: "h-3 w-3" }),
-            /* @__PURE__ */ t.jsx("span", { children: "バランス" })
+            /* @__PURE__ */ s.jsx(kr, { className: "h-3 w-3" }),
+            /* @__PURE__ */ s.jsx("span", { children: "バランス" })
           ]
         }
       ),
-      /* @__PURE__ */ t.jsxs(
+      /* @__PURE__ */ s.jsxs(
         "button",
         {
           type: "button",
-          onClick: s,
-          disabled: u,
-          className: `flex items-center gap-1 rounded px-2 py-1 text-xs transition-colors ${u ? "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"}`,
+          onClick: o,
+          disabled: i,
+          className: `flex items-center gap-1 rounded px-2 py-1 text-xs transition-colors ${i ? "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: [
-            /* @__PURE__ */ t.jsx(Rt, { className: "h-3 w-3" }),
-            /* @__PURE__ */ t.jsx("span", { children: "幅リセット" })
+            /* @__PURE__ */ s.jsx(Mr, { className: "h-3 w-3" }),
+            /* @__PURE__ */ s.jsx("span", { children: "幅リセット" })
           ]
         }
       )
     ] }),
-    u && /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-1 text-blue-600 text-xs", children: [
-      /* @__PURE__ */ t.jsx("div", { className: "h-2 w-2 animate-pulse rounded-full bg-blue-500" }),
-      /* @__PURE__ */ t.jsx("span", { children: "リサイズ中..." })
+    i && /* @__PURE__ */ s.jsxs("div", { className: "flex items-center gap-1 text-blue-600 text-xs", children: [
+      /* @__PURE__ */ s.jsx("div", { className: "h-2 w-2 animate-pulse rounded-full bg-blue-500" }),
+      /* @__PURE__ */ s.jsx("span", { children: "リサイズ中..." })
     ] })
   ] });
-}, Kt = ({ columnCount: r, onInsertColumn: e, onDeleteColumn: n, minColumns: s = 1, maxColumns: o = 6, isResizing: i = !1, disabled: u = !1 }) => {
-  const c = r < o && !u, h = r > s && !u;
-  return /* @__PURE__ */ t.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 ${u ? "bg-slate-100/80 opacity-60" : "bg-white/80"}`, children: [
-    u && /* @__PURE__ */ t.jsx("div", { className: "flex items-center gap-2 text-slate-500 text-xs", children: /* @__PURE__ */ t.jsx("span", { children: "レスポンシブモード有効中：カラム数は自動調整されます" }) }),
-    !u && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      /* @__PURE__ */ t.jsx(
+}, Vr = ({ columnCount: t, onInsertColumn: n, onDeleteColumn: e, minColumns: o = 1, maxColumns: r = 6, isResizing: a = !1, disabled: i = !1 }) => {
+  const d = t < r && !i, m = t > o && !i;
+  return /* @__PURE__ */ s.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 ${i ? "bg-slate-100/80 opacity-60" : "bg-white/80"}`, children: [
+    i && /* @__PURE__ */ s.jsx("div", { className: "flex items-center gap-2 text-slate-500 text-xs", children: /* @__PURE__ */ s.jsx("span", { children: "レスポンシブモード有効中：カラム数は自動調整されます" }) }),
+    !i && /* @__PURE__ */ s.jsxs(s.Fragment, { children: [
+      /* @__PURE__ */ s.jsx(
         "button",
         {
           type: "button",
-          onClick: () => c && e(0),
-          disabled: !c || i,
-          className: `flex h-8 w-8 items-center justify-center rounded border-2 border-dashed text-xs transition-colors ${c && !i ? "border-blue-300 text-blue-600 hover:border-blue-500 hover:bg-blue-50" : "cursor-not-allowed border-slate-200 text-slate-300"}`,
+          onClick: () => d && n(0),
+          disabled: !d || a,
+          className: `flex h-8 w-8 items-center justify-center rounded border-2 border-dashed text-xs transition-colors ${d && !a ? "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: /* @__PURE__ */ t.jsx($e, { className: "h-4 w-4" })
+          children: /* @__PURE__ */ s.jsx(Qe, { className: "h-4 w-4" })
         }
       ),
-      Array.from({ length: r }, (N, b) => /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-1", children: [
-        /* @__PURE__ */ t.jsxs("div", { className: "relative flex h-8 w-12 items-center justify-center rounded border border-slate-300 bg-slate-100", children: [
-          /* @__PURE__ */ t.jsx("span", { className: "font-medium font-mono text-slate-700 text-xs", children: b + 1 }),
-          h && !i && /* @__PURE__ */ t.jsx(
+      Array.from({ length: t }, (w, b) => /* @__PURE__ */ s.jsxs("div", { className: "flex items-center gap-1", children: [
+        /* @__PURE__ */ s.jsxs("div", { className: "relative flex h-8 w-12 items-center justify-center rounded border border-slate-300 bg-slate-100", children: [
+          /* @__PURE__ */ s.jsx("span", { className: "font-medium font-mono text-slate-700 text-xs", children: b + 1 }),
+          m && !a && /* @__PURE__ */ s.jsx(
             "button",
             {
               type: "button",
-              onClick: () => n(b),
+              onClick: () => e(b),
               className: "absolute -top-1 -right-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: `カラム ${b + 1} を削除`,
-              children: /* @__PURE__ */ t.jsx(Ve, { className: "h-2.5 w-2.5" })
+              children: /* @__PURE__ */ s.jsx(Yt, { className: "h-2.5 w-2.5" })
             }
           )
         ] }),
-        /* @__PURE__ */ t.jsx(
+        /* @__PURE__ */ s.jsx(
           "button",
           {
             type: "button",
-            onClick: () => c && e(b + 1),
-            disabled: !c || i,
-            className: `flex h-8 w-8 items-center justify-center rounded border-2 border-dashed text-xs transition-colors ${c && !i ? "border-blue-300 text-blue-600 hover:border-blue-500 hover:bg-blue-50" : "cursor-not-allowed border-slate-200 text-slate-300"}`,
+            onClick: () => d && n(b + 1),
+            disabled: !d || a,
+            className: `flex h-8 w-8 items-center justify-center rounded border-2 border-dashed text-xs transition-colors ${d && !a ? "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: /* @__PURE__ */ t.jsx($e, { className: "h-4 w-4" })
+            children: /* @__PURE__ */ s.jsx(Qe, { className: "h-4 w-4" })
           }
         )
       ] }, `column-${b}`))
     ] })
   ] });
-}, en = ({ config: r, onConfigChange: e, isVisible: n, onToggleVisibility: s }) => n ? /* @__PURE__ */ t.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: [
-  /* @__PURE__ */ t.jsxs("div", { className: "mb-3 flex items-center justify-between", children: [
-    /* @__PURE__ */ t.jsx("h3", { className: "font-bold text-gray-800 text-sm", children: "🛠️ デバッグ設定" }),
-    /* @__PURE__ */ t.jsx("button", { type: "button", onClick: s, className: "text-gray-500 text-lg hover:text-gray-700", title: "閉じる", children: "✕" })
+}, Zr = ({ config: t, onConfigChange: n, isVisible: e, onToggleVisibility: o }) => e ? /* @__PURE__ */ s.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: [
+  /* @__PURE__ */ s.jsxs("div", { className: "mb-3 flex items-center justify-between", children: [
+    /* @__PURE__ */ s.jsx("h3", { className: "font-bold text-gray-800 text-sm", children: "🛠️ デバッグ設定" }),
+    /* @__PURE__ */ s.jsx("button", { type: "button", onClick: o, className: "text-gray-500 text-lg hover:text-gray-700", title: "閉じる", children: "✕" })
   ] }),
-  /* @__PURE__ */ t.jsxs("div", { className: "space-y-2", children: [
-    /* @__PURE__ */ t.jsxs("label", { className: "flex items-center space-x-2 text-sm", children: [
-      /* @__PURE__ */ t.jsx(
+  /* @__PURE__ */ s.jsxs("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ s.jsxs("label", { className: "flex items-center space-x-2 text-sm", children: [
+      /* @__PURE__ */ s.jsx(
         "input",
         {
           type: "checkbox",
-          checked: r.showDebugPanel ?? !1,
-          onChange: (o) => e({
-            ...r,
-            showDebugPanel: o.target.checked
+          checked: t.showDebugPanel ?? !1,
+          onChange: (r) => n({
+            ...t,
+            showDebugPanel: r.target.checked
           }),
           className: "rounded"
         }
       ),
-      /* @__PURE__ */ t.jsx("span", { children: "デバッグパネル表示" })
+      /* @__PURE__ */ s.jsx("span", { children: "デバッグパネル表示" })
     ] }),
-    /* @__PURE__ */ t.jsxs("label", { className: "flex items-center space-x-2 text-sm", children: [
-      /* @__PURE__ */ t.jsx(
+    /* @__PURE__ */ s.jsxs("label", { className: "flex items-center space-x-2 text-sm", children: [
+      /* @__PURE__ */ s.jsx(
         "input",
         {
           type: "checkbox",
-          checked: r.showMousePosition ?? !1,
-          onChange: (o) => e({
-            ...r,
-            showMousePosition: o.target.checked
+          checked: t.showMousePosition ?? !1,
+          onChange: (r) => n({
+            ...t,
+            showMousePosition: r.target.checked
           }),
           className: "rounded"
         }
       ),
-      /* @__PURE__ */ t.jsx("span", { children: "マウス位置表示" })
+      /* @__PURE__ */ s.jsx("span", { children: "マウス位置表示" })
     ] }),
-    /* @__PURE__ */ t.jsxs("label", { className: "flex items-center space-x-2 text-sm", children: [
-      /* @__PURE__ */ t.jsx(
+    /* @__PURE__ */ s.jsxs("label", { className: "flex items-center space-x-2 text-sm", children: [
+      /* @__PURE__ */ s.jsx(
         "input",
         {
           type: "checkbox",
-          checked: r.showPanelSizes ?? !1,
-          onChange: (o) => e({
-            ...r,
-            showPanelSizes: o.target.checked
+          checked: t.showPanelSizes ?? !1,
+          onChange: (r) => n({
+            ...t,
+            showPanelSizes: r.target.checked
           }),
           className: "rounded"
         }
       ),
-      /* @__PURE__ */ t.jsx("span", { children: "パネルサイズ情報" })
+      /* @__PURE__ */ s.jsx("span", { children: "パネルサイズ情報" })
     ] }),
-    /* @__PURE__ */ t.jsxs("label", { className: "flex items-center space-x-2 text-sm", children: [
-      /* @__PURE__ */ t.jsx(
+    /* @__PURE__ */ s.jsxs("label", { className: "flex items-center space-x-2 text-sm", children: [
+      /* @__PURE__ */ s.jsx(
         "input",
         {
           type: "checkbox",
-          checked: r.showPlaceholderInfo ?? !1,
-          onChange: (o) => e({
-            ...r,
-            showPlaceholderInfo: o.target.checked
+          checked: t.showPlaceholderInfo ?? !1,
+          onChange: (r) => n({
+            ...t,
+            showPlaceholderInfo: r.target.checked
           }),
           className: "rounded"
         }
       ),
-      /* @__PURE__ */ t.jsx("span", { children: "プレースホルダー詳細" })
+      /* @__PURE__ */ s.jsx("span", { children: "プレースホルダー詳細" })
     ] }),
-    /* @__PURE__ */ t.jsxs("label", { className: "flex items-center space-x-2 text-sm", children: [
-      /* @__PURE__ */ t.jsx(
+    /* @__PURE__ */ s.jsxs("label", { className: "flex items-center space-x-2 text-sm", children: [
+      /* @__PURE__ */ s.jsx(
         "input",
         {
           type: "checkbox",
-          checked: r.showDropZoneOutlines ?? !1,
-          onChange: (o) => e({
-            ...r,
-            showDropZoneOutlines: o.target.checked
+          checked: t.showDropZoneOutlines ?? !1,
+          onChange: (r) => n({
+            ...t,
+            showDropZoneOutlines: r.target.checked
           }),
           className: "rounded"
         }
       ),
-      /* @__PURE__ */ t.jsx("span", { children: "ドロップゾーン境界" })
+      /* @__PURE__ */ s.jsx("span", { children: "ドロップゾーン境界" })
     ] }),
-    /* @__PURE__ */ t.jsxs("div", { className: "border-gray-200 border-t pt-2", children: [
-      /* @__PURE__ */ t.jsxs("label", { htmlFor: "log-level-slider", className: "mb-1 block text-sm", children: [
+    /* @__PURE__ */ s.jsxs("div", { className: "border-gray-200 border-t pt-2", children: [
+      /* @__PURE__ */ s.jsxs("label", { htmlFor: "log-level-slider", className: "mb-1 block text-sm", children: [
         "ログレベル: ",
-        r.logLevel ?? 0
+        t.logLevel ?? 0
       ] }),
-      /* @__PURE__ */ t.jsx(
+      /* @__PURE__ */ s.jsx(
         "input",
         {
           id: "log-level-slider",
           type: "range",
           min: "0",
           max: "2",
-          value: r.logLevel ?? 0,
-          onChange: (o) => e({
-            ...r,
-            logLevel: parseInt(o.target.value, 10)
+          value: t.logLevel ?? 0,
+          onChange: (r) => n({
+            ...t,
+            logLevel: parseInt(r.target.value, 10)
           }),
           className: "w-full",
           "aria-label": "ログレベル設定"
         }
       ),
-      /* @__PURE__ */ t.jsxs("div", { className: "mt-1 flex justify-between text-gray-500 text-xs", children: [
-        /* @__PURE__ */ t.jsx("span", { children: "無効" }),
-        /* @__PURE__ */ t.jsx("span", { children: "基本" }),
-        /* @__PURE__ */ t.jsx("span", { children: "詳細" })
+      /* @__PURE__ */ s.jsxs("div", { className: "mt-1 flex justify-between text-gray-500 text-xs", children: [
+        /* @__PURE__ */ s.jsx("span", { children: "無効" }),
+        /* @__PURE__ */ s.jsx("span", { children: "基本" }),
+        /* @__PURE__ */ s.jsx("span", { children: "詳細" })
       ] })
     ] }),
-    /* @__PURE__ */ t.jsxs("div", { className: "space-y-2 pt-2", children: [
-      /* @__PURE__ */ t.jsx(
+    /* @__PURE__ */ s.jsxs("div", { className: "space-y-2 pt-2", children: [
+      /* @__PURE__ */ s.jsx(
         "button",
         {
           type: "button",
-          onClick: () => e({
+          onClick: () => n({
             showDebugPanel: !0,
             showMousePosition: !0,
             showPanelSizes: !0,
@@ -1395,11 +1979,11 @@ const _t = [
           children: "すべて有効"
         }
       ),
-      /* @__PURE__ */ t.jsx(
+      /* @__PURE__ */ s.jsx(
         "button",
         {
           type: "button",
-          onClick: () => e({
+          onClick: () => n({
             showDebugPanel: !1,
             showMousePosition: !1,
             showPanelSizes: !1,
@@ -1413,1104 +1997,990 @@ const _t = [
       )
     ] })
   ] })
-] }) : /* @__PURE__ */ t.jsx("button", { type: "button", onClick: s, 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: "🛠️" }), ie = {
+] }) : /* @__PURE__ */ s.jsx("button", { type: "button", onClick: o, 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: "🛠️" }), fe = {
   prefix: "column",
   startIndex: 1,
   separator: "_"
-}, je = (r, e = ie) => {
-  const { prefix: n, startIndex: s, separator: o } = e, i = r + s;
-  return `${n}${o}${i}`;
-}, Qe = (r, e = ie) => Array.from({ length: r }, (n, s) => je(s, e)), Pe = (r, e = ie) => {
-  const { prefix: n, startIndex: s, separator: o } = e, i = `${n}${o}`;
-  if (!r.startsWith(i))
+}, qe = (t, n = fe) => {
+  const { prefix: e, startIndex: o, separator: r } = n, a = t + o;
+  return `${e}${r}${a}`;
+}, nn = (t, n = fe) => Array.from({ length: t }, (e, o) => qe(o, n)), We = (t, n = fe) => {
+  const { prefix: e, startIndex: o, separator: r } = n, a = `${e}${r}`;
+  if (!t.startsWith(a))
     return null;
-  const u = r.slice(i.length), c = parseInt(u, 10);
-  return Number.isNaN(c) || c < s ? null : c - s;
-}, tn = (r, e = ie) => Pe(r, e) !== null, nn = (r, e = ie) => {
-  const n = r.map((s) => Pe(s, e)).filter((s) => s !== null).sort((s, o) => s - o);
-  for (let s = 0; s < n.length; s++)
-    if (n[s] !== s)
-      return je(s, e);
-  return je(n.length, e);
-}, Lt = (r, e = ie) => r.sort((n, s) => {
-  const o = Pe(n, e) ?? -1, i = Pe(s, e) ?? -1;
-  return o - i;
-}), rn = (r, e = ie) => {
-  const n = {};
-  return r.forEach((s, o) => {
-    const i = je(o, e);
-    n[s] = i;
-  }), n;
-}, Wt = (r, e, n = ie) => {
-  const s = [];
-  Object.values(r).forEach((u) => {
-    s.push(...u);
+  const i = t.slice(a.length), d = parseInt(i, 10);
+  return Number.isNaN(d) || d < o ? null : d - o;
+}, Gr = (t, n = fe) => We(t, n) !== null, Kr = (t, n = fe) => {
+  const e = t.map((o) => We(o, n)).filter((o) => o !== null).sort((o, r) => o - r);
+  for (let o = 0; o < e.length; o++)
+    if (e[o] !== o)
+      return qe(o, n);
+  return qe(e.length, n);
+}, Ar = (t, n = fe) => t.sort((e, o) => {
+  const r = We(e, n) ?? -1, a = We(o, n) ?? -1;
+  return r - a;
+}), Jr = (t, n = fe) => {
+  const e = {};
+  return t.forEach((o, r) => {
+    const a = qe(r, n);
+    e[o] = a;
+  }), e;
+}, $r = (t, n, e = fe) => {
+  const o = [];
+  Object.values(t).forEach((i) => {
+    o.push(...i);
   });
-  const o = {}, i = Qe(e, n);
-  return i.forEach((u) => {
-    o[u] = [];
-  }), s.forEach((u, c) => {
-    const h = c % e, N = i[h];
-    o[N].push(u);
-  }), o;
-}, sn = ({ initialColumns: r, initialPanels: e, debug: n = {}, onLayoutChange: s }) => {
-  const [o, i] = te(() => {
-    const f = {};
-    for (const x of r)
-      f[x.id] = x.initialWidth || 400;
+  const r = {}, a = nn(n, e);
+  return a.forEach((i) => {
+    r[i] = [];
+  }), o.forEach((i, d) => {
+    const m = d % n, w = a[m];
+    r[w].push(i);
+  }), r;
+}, Qr = ({ initialColumns: t, initialPanels: n, debug: e = {}, onLayoutChange: o }) => {
+  const [r, a] = se(() => {
+    const p = {};
+    for (const x of t)
+      p[x.id] = x.initialWidth || 400;
     return {
-      columns: r,
-      columnWidths: f,
+      columns: t,
+      columnWidths: p,
       isResizing: !1,
       resizingColumn: null,
-      columnPanels: e,
+      columnPanels: n,
       showInsertPlaceholders: !1
     };
-  }), u = F(0), c = F(0);
-  K(() => {
-    s?.(o);
-  }, [o, s]);
-  const h = w(
-    (f, x) => {
-      E(n, 1, "カラム追加:", f.id, "at position:", x), i((C) => {
-        const W = [...C.columns], p = x ?? W.length;
-        W.splice(p, 0, f);
-        const g = {
-          ...C.columnWidths,
-          [f.id]: f.initialWidth || 400
-        }, m = {
-          ...C.columnPanels,
-          [f.id]: []
+  }), i = I(0), d = I(0);
+  oe(() => {
+    o?.(r);
+  }, [r, o]);
+  const m = k(
+    (p, x) => {
+      M(e, 1, "カラム追加:", p.id, "at position:", x), a(($) => {
+        const W = [...$.columns], v = x ?? W.length;
+        W.splice(v, 0, p);
+        const y = {
+          ...$.columnWidths,
+          [p.id]: p.initialWidth || 400
+        }, g = {
+          ...$.columnPanels,
+          [p.id]: []
         };
         return {
-          ...C,
+          ...$,
           columns: W,
-          columnWidths: g,
-          columnPanels: m
+          columnWidths: y,
+          columnPanels: g
         };
       });
     },
-    [n]
-  ), N = w(
-    (f) => {
-      E(n, 1, "カラム削除:", f), i((x) => {
-        const C = x.columnPanels[f] || [], W = x.columns.filter((v) => v.id !== f);
+    [e]
+  ), w = k(
+    (p) => {
+      M(e, 1, "カラム削除:", p), a((x) => {
+        const $ = x.columnPanels[p] || [], W = x.columns.filter((D) => D.id !== p);
         if (W.length === 0)
-          return E(n, 1, "警告: 最後のカラムを削除しようとしています"), x;
-        const p = W[0].id, g = { ...x.columnPanels };
-        C.length > 0 && (g[p] = [...g[p], ...C]), delete g[f];
-        const m = { ...x.columnWidths };
-        return delete m[f], {
+          return M(e, 1, "警告: 最後のカラムを削除しようとしています"), x;
+        const v = W[0].id, y = { ...x.columnPanels };
+        $.length > 0 && (y[v] = [...y[v], ...$]), delete y[p];
+        const g = { ...x.columnWidths };
+        return delete g[p], {
           ...x,
           columns: W,
-          columnWidths: m,
-          columnPanels: g
+          columnWidths: g,
+          columnPanels: y
         };
       });
     },
-    [n]
-  ), b = w(
-    (f, x) => {
-      E(n, 1, "カラム移動:", f, "->", x), i((C) => {
-        const W = [...C.columns], [p] = W.splice(f, 1);
-        return W.splice(x, 0, p), {
-          ...C,
+    [e]
+  ), b = k(
+    (p, x) => {
+      M(e, 1, "カラム移動:", p, "->", x), a(($) => {
+        const W = [...$.columns], [v] = W.splice(p, 1);
+        return W.splice(x, 0, v), {
+          ...$,
           columns: W
         };
       });
     },
-    [n]
-  ), M = w(
-    (f, x) => {
-      E(n, 2, "リサイズ開始:", f, "at X:", x), u.current = x, c.current = o.columnWidths[f] || 300, i((C) => ({
-        ...C,
+    [e]
+  ), A = k(
+    (p, x) => {
+      M(e, 2, "リサイズ開始:", p, "at X:", x), i.current = x, d.current = r.columnWidths[p] || 300, a(($) => ({
+        ...$,
         isResizing: !0,
-        resizingColumn: f
+        resizingColumn: p
       }));
     },
-    [n, o.columnWidths]
-  ), T = w(
-    (f) => {
-      const { resizingColumn: x, isResizing: C } = o;
-      if (!(C && x)) return;
-      const W = f - u.current, p = Math.max(100, Math.min(800, c.current + W));
-      E(n, 2, "リサイズ中:", x, "new width:", p), i((g) => ({
-        ...g,
+    [e, r.columnWidths]
+  ), q = k(
+    (p) => {
+      const { resizingColumn: x, isResizing: $ } = r;
+      if (!($ && x)) return;
+      const W = p - i.current, v = Math.max(100, Math.min(800, d.current + W));
+      M(e, 2, "リサイズ中:", x, "new width:", v), a((y) => ({
+        ...y,
         columnWidths: {
-          ...g.columnWidths,
-          [x]: p
+          ...y.columnWidths,
+          [x]: v
         }
       }));
     },
-    [n, o]
-  ), y = w(() => {
-    E(n, 2, "リサイズ終了"), i((f) => ({
-      ...f,
+    [e, r]
+  ), j = k(() => {
+    M(e, 2, "リサイズ終了"), a((p) => ({
+      ...p,
       isResizing: !1,
       resizingColumn: null
     }));
-  }, [n]), l = w(
-    (f, x) => {
-      E(n, 2, "カラム幅設定:", f, x), i((C) => ({
-        ...C,
+  }, [e]), E = k(
+    (p, x) => {
+      M(e, 2, "カラム幅設定:", p, x), a(($) => ({
+        ...$,
         columnWidths: {
-          ...C.columnWidths,
-          [f]: Math.max(100, Math.min(800, x))
+          ...$.columnWidths,
+          [p]: Math.max(100, Math.min(800, x))
         }
       }));
     },
-    [n]
-  ), j = w(() => {
-    E(n, 1, "カラム幅リセット"), i((f) => {
+    [e]
+  ), C = k(() => {
+    M(e, 1, "カラム幅リセット"), a((p) => {
       const x = {};
-      for (const C of f.columns)
-        x[C.id] = C.initialWidth || 400;
+      for (const $ of p.columns)
+        x[$.id] = $.initialWidth || 400;
       return {
-        ...f,
+        ...p,
         columnWidths: x
       };
     });
-  }, [n]), k = w(
-    (f, x, C, W) => {
-      E(n, 1, "パネル移動:", f, "from", x, "to", C, "at", W), i((p) => {
-        const g = { ...p.columnPanels };
-        if (x in g && (g[x] = g[x].filter((m) => m !== f)), C in g) {
-          const m = [...g[C]];
-          m.splice(W, 0, f), g[C] = m;
+  }, [e]), T = k(
+    (p, x, $, W) => {
+      M(e, 1, "パネル移動:", p, "from", x, "to", $, "at", W), a((v) => {
+        const y = { ...v.columnPanels };
+        if (x in y && (y[x] = y[x].filter((g) => g !== p)), $ in y) {
+          const g = [...y[$]];
+          g.splice(W, 0, p), y[$] = g;
         }
         return {
-          ...p,
-          columnPanels: g
+          ...v,
+          columnPanels: y
         };
       });
     },
-    [n]
-  ), _ = w(
-    (f, x, C) => {
-      E(n, 1, "パネル追加:", f, "to column:", x), i((W) => {
-        const p = { ...W.columnPanels };
-        x in p || (p[x] = []);
-        const g = [...p[x]], m = C ?? g.length;
-        return g.splice(m, 0, f), p[x] = g, {
+    [e]
+  ), h = k(
+    (p, x, $) => {
+      M(e, 1, "パネル追加:", p, "to column:", x), a((W) => {
+        const v = { ...W.columnPanels };
+        x in v || (v[x] = []);
+        const y = [...v[x]], g = $ ?? y.length;
+        return y.splice(g, 0, p), v[x] = y, {
           ...W,
-          columnPanels: p
+          columnPanels: v
         };
       });
     },
-    [n]
-  ), R = w(
-    (f) => {
-      E(n, 1, "パネル削除:", f), i((x) => {
-        const C = {};
-        for (const [W, p] of Object.entries(x.columnPanels))
-          C[W] = p.filter((g) => g !== f);
+    [e]
+  ), P = k(
+    (p) => {
+      M(e, 1, "パネル削除:", p), a((x) => {
+        const $ = {};
+        for (const [W, v] of Object.entries(x.columnPanels))
+          $[W] = v.filter((y) => y !== p);
         return {
           ...x,
-          columnPanels: C
+          columnPanels: $
         };
       });
     },
-    [n]
-  ), z = w(
-    (f) => {
-      E(n, 1, "カラム数更新:", f), i((x) => {
-        const C = x.columns.length;
-        if (f === C) return x;
-        const W = Wt(x.columnPanels, f, ie), p = Qe(f, ie), g = x.isResizing && x.resizingColumn && !p.includes(x.resizingColumn);
-        g && E(n, 1, "リサイズ中のカラムが削除されるためリサイズを強制終了:", x.resizingColumn);
-        const m = p.map((O, H) => ({
-          id: O,
-          title: `カラム ${H + 1}`,
+    [e]
+  ), N = k(
+    (p) => {
+      M(e, 1, "カラム数更新:", p), a((x) => {
+        const $ = x.columns.length;
+        if (p === $) return x;
+        const W = $r(x.columnPanels, p, fe), v = nn(p, fe), y = x.isResizing && x.resizingColumn && !v.includes(x.resizingColumn);
+        y && M(e, 1, "リサイズ中のカラムが削除されるためリサイズを強制終了:", x.resizingColumn);
+        const g = v.map((F, X) => ({
+          id: F,
+          title: `カラム ${X + 1}`,
           minWidth: 350,
           maxWidth: 800,
           initialWidth: 400,
-          resizable: !(H === 1 && f === 3)
-        })), v = {};
-        if (Object.entries(x.columnWidths).some(([, O]) => O !== 400))
-          p.forEach((O) => {
-            const H = x.columnWidths[O];
-            H && H !== 400 ? v[O] = H : v[O] = 400;
+          resizable: !(X === 1 && p === 3)
+        })), D = {};
+        if (Object.entries(x.columnWidths).some(([, F]) => F !== 400))
+          v.forEach((F) => {
+            const X = x.columnWidths[F];
+            X && X !== 400 ? D[F] = X : D[F] = 400;
           });
         else {
-          const O = C > f ? Object.values(x.columnWidths).reduce((a, d) => a + d, 0) : f * 400, H = Math.max(O / f, 350);
-          p.forEach((a) => {
-            v[a] = H;
+          const F = $ > p ? Object.values(x.columnWidths).reduce((u, f) => u + f, 0) : p * 400, X = Math.max(F / p, 350);
+          v.forEach((u) => {
+            D[u] = X;
           });
         }
         return {
           ...x,
-          columns: m,
+          columns: g,
           columnPanels: W,
-          columnWidths: v,
-          isResizing: g ? !1 : x.isResizing,
-          resizingColumn: g ? null : x.resizingColumn
+          columnWidths: D,
+          isResizing: y ? !1 : x.isResizing,
+          resizingColumn: y ? null : x.resizingColumn
         };
       });
     },
-    [n]
-  ), Z = w(() => {
-    E(n, 1, "カラム自動バランス調整"), i((f) => {
+    [e]
+  ), l = k(() => {
+    M(e, 1, "カラム自動バランス調整"), a((p) => {
       const x = [];
-      for (const p of Object.keys(f.columnPanels))
-        for (const g of f.columnPanels[p])
-          x.push(g);
-      const C = {};
-      for (const p of f.columns)
-        C[p.id] = [];
+      for (const v of Object.keys(p.columnPanels))
+        for (const y of p.columnPanels[v])
+          x.push(y);
+      const $ = {};
+      for (const v of p.columns)
+        $[v.id] = [];
       let W = 0;
-      for (const p of x) {
-        const g = f.columns[W % f.columns.length].id;
-        C[g].push(p), W += 1;
+      for (const v of x) {
+        const y = p.columns[W % p.columns.length].id;
+        $[y].push(v), W += 1;
       }
       return {
-        ...f,
-        columnPanels: C
+        ...p,
+        columnPanels: $
       };
     });
-  }, [n]), Y = w(
-    (f) => o.columns.find((x) => x.id === f),
-    [o.columns]
-  ), U = w(() => {
-    let f = 0;
-    for (const x of Object.values(o.columnWidths))
-      f += x;
-    return f;
-  }, [o.columnWidths]), $ = w((f) => document.querySelector(`[data-column-id="${f}"]`), []), L = w((f) => {
-    i((x) => ({
+  }, [e]), _ = k(
+    (p) => r.columns.find((x) => x.id === p),
+    [r.columns]
+  ), L = k(() => {
+    let p = 0;
+    for (const x of Object.values(r.columnWidths))
+      p += x;
+    return p;
+  }, [r.columnWidths]), B = k((p) => document.querySelector(`[data-column-id="${p}"]`), []), J = k((p) => {
+    a((x) => ({
       ...x,
-      showInsertPlaceholders: f
+      showInsertPlaceholders: p
     }));
   }, []);
   return {
-    layoutState: o,
-    addColumn: h,
-    removeColumn: N,
+    layoutState: r,
+    addColumn: m,
+    removeColumn: w,
     moveColumn: b,
-    startResize: M,
-    handleResize: T,
-    endResize: y,
-    setColumnWidth: l,
-    resetColumnWidths: j,
-    movePanel: k,
-    addPanel: _,
-    removePanel: R,
-    updateColumnCount: z,
-    autoBalanceColumns: Z,
-    getColumnById: Y,
-    getTotalWidth: U,
-    getColumnElement: $,
-    setShowInsertPlaceholders: L
+    startResize: A,
+    handleResize: q,
+    endResize: j,
+    setColumnWidth: E,
+    resetColumnWidths: C,
+    movePanel: T,
+    addPanel: h,
+    removePanel: P,
+    updateColumnCount: N,
+    autoBalanceColumns: l,
+    getColumnById: _,
+    getTotalWidth: L,
+    getColumnElement: B,
+    setShowInsertPlaceholders: J
   };
-}, ke = {
-  triggerDistance: 80,
-  scrollSpeed: 5,
-  maxScrollSpeed: 20
-}, He = (r, e, n = ke, s) => {
-  const { triggerDistance: o, scrollSpeed: i, maxScrollSpeed: u } = n;
-  let c;
-  s ? c = s.getBoundingClientRect() : c = new DOMRect(0, 0, window.innerWidth, window.innerHeight);
-  const { left: h, top: N, right: b, bottom: M } = c;
-  let T = 0, y = 0;
-  if (r >= h && r <= b && e >= N && e <= M) {
-    if (r < h + o) {
-      const l = Math.max(0, (h + o - r) / o);
-      T = -Math.min(u, i + l * (u - i));
-    } else if (r > b - o) {
-      const l = Math.max(0, (r - (b - o)) / o);
-      T = Math.min(u, i + l * (u - i));
-    }
-    if (e < N + o) {
-      const l = Math.max(0, (N + o - e) / o);
-      y = -Math.min(u, i + l * (u - i));
-    } else if (e > M - o) {
-      const l = Math.max(0, (e - (M - o)) / o);
-      y = Math.min(u, i + l * (u - i));
-    }
-  }
-  return { x: T, y };
-}, zt = (r, e) => {
-  (r.x !== 0 || r.y !== 0) && (e ? e.scrollBy(r.x, r.y) : window.scrollBy(r.x, r.y));
-};
-class Ke {
-  constructor(e = ke, n) {
-    this.intervalId = null, this.isActive = !1, this.config = e, this.scrollElement = n;
-  }
-  setScrollElement(e) {
-    this.scrollElement = e;
-  }
-  start(e, n) {
-    this.isActive || (this.isActive = !0, this.intervalId = window.setInterval(() => {
-      const s = He(e, n, this.config, this.scrollElement);
-      zt(s, this.scrollElement);
-    }, 16));
-  }
-  update(e, n) {
-    const s = He(e, n, this.config, this.scrollElement);
-    (s.x !== 0 || s.y !== 0) && !this.isActive ? this.start(e, n) : s.x === 0 && s.y === 0 && this.isActive && this.stop();
-  }
-  stop() {
-    this.intervalId !== null && (clearInterval(this.intervalId), this.intervalId = null), this.isActive = !1;
-  }
-  isScrolling() {
-    return this.isActive;
-  }
-  updateConfig(e) {
-    this.config = e;
-  }
-}
-const Yt = ({
-  debugConfig: r,
-  dragState: e,
-  customDrag: n,
-  clickState: s,
-  dragModes: o,
-  isMouseDown: i,
-  dragOverPosition: u,
-  setCustomDrag: c,
-  setDragState: h,
-  setDragOverPosition: N,
+}, Tr = ({
+  debugConfig: t,
+  dragState: n,
+  customDrag: e,
+  clickState: o,
+  dragModes: r,
+  isMouseDown: a,
+  dragOverPosition: i,
+  setCustomDrag: d,
+  setDragState: m,
+  setDragOverPosition: w,
   setOriginalPanelPosition: b,
-  setClickState: M,
-  setIsMouseDown: T,
-  findPanelPosition: y,
-  performPanelMove: l,
-  showMousePosition: j,
-  updateMousePosition: k,
-  recordMouseDown: _,
-  recordClickPosition: R,
-  isVirtualClick: z,
-  calculateMoveDistance: Z,
-  clearMouseTracking: Y,
-  resetDragState: U,
-  resetClickState: $,
-  createDragImage: L,
-  updateDragImagePosition: f,
+  setClickState: A,
+  setIsMouseDown: q,
+  findPanelPosition: j,
+  performPanelMove: E,
+  showMousePosition: C,
+  updateMousePosition: T,
+  recordMouseDown: h,
+  recordClickPosition: P,
+  isVirtualClick: N,
+  calculateMoveDistance: l,
+  clearMouseTracking: _,
+  resetDragState: L,
+  resetClickState: B,
+  createDragImage: J,
+  updateDragImagePosition: p,
   removeDragImage: x,
-  handlePlaceholderDragEnter: C,
+  handlePlaceholderDragEnter: $,
   handlePlaceholderDragLeave: W
 }) => {
-  const p = F(r);
-  p.current = r;
-  const g = F(null), m = F(null), v = F(0), D = F(new Ke(ke));
-  K(() => {
-    const d = document.querySelector("main[data-aqdd-scroll-root]");
-    d && D.current.setScrollElement(d);
+  const v = I(t);
+  v.current = t;
+  const y = I(null), g = I(null), D = I(0), R = I(new rt(Me));
+  oe(() => {
+    const f = document.querySelector(Zt);
+    f && R.current.setScrollElement(f);
   }, []);
-  const A = F(u);
-  K(() => {
-    A.current = u, E(p.current, 2, "dragOverPositionRef更新:", u);
-  }, [u]);
-  const O = w(
-    (d) => {
-      if (n.isActive || s.isClicked) {
-        d.preventDefault();
+  const Y = I(i);
+  oe(() => {
+    Y.current = i, M(v.current, 2, "dragOverPositionRef更新:", i);
+  }, [i]);
+  const F = k(
+    (f) => {
+      if (e.isActive || o.isClicked) {
+        f.preventDefault();
         const S = window.getSelection();
         S && S.rangeCount > 0 && S.removeAllRanges();
       }
-      if (n.isActive) {
-        k(d.clientX, d.clientY), f(d.clientX, d.clientY), D.current.update(d.clientX, d.clientY);
-        const S = document.elementFromPoint(d.clientX, d.clientY), X = S?.closest("[data-drop-zone]");
-        if (X) {
+      if (e.isActive) {
+        T(f.clientX, f.clientY), p(f.clientX, f.clientY), R.current.update(f.clientX, f.clientY);
+        const S = document.elementFromPoint(f.clientX, f.clientY), U = S?.closest("[data-drop-zone]");
+        if (U) {
           document.body.classList.add("droppable");
-          const G = X.getAttribute("data-column-index"), Q = G ? parseInt(G, 10) : null;
-          Q !== null && Q !== e.dragOverColumn && h((re) => ({ ...re, dragOverColumn: Q }));
-          const V = S?.closest("[data-placeholder-index]");
-          if (V) {
-            const re = V.getAttribute("data-placeholder-index"), ce = V.getAttribute("data-placeholder-column");
-            if (re && ce) {
-              const se = parseInt(re, 10), ge = parseInt(ce, 10);
-              C(ge, se);
+          const K = U.getAttribute("data-column-index"), ae = K ? parseInt(K, 10) : null;
+          ae !== null && ae !== n.dragOverColumn && m((H) => ({ ...H, dragOverColumn: ae }));
+          const G = S?.closest("[data-placeholder-index]");
+          if (G) {
+            const H = G.getAttribute("data-placeholder-index"), ve = G.getAttribute("data-placeholder-column");
+            if (H && ve) {
+              const ue = parseInt(H, 10), pe = parseInt(ve, 10);
+              $(pe, ue);
             }
           } else
             W();
         } else
-          document.body.classList.remove("droppable"), N(null), h((G) => ({ ...G, dragOverColumn: null }));
-      } else if (i && s.isClicked && s.panelId) {
-        if (o[s.panelId] !== "custom" || Z(d.clientX, d.clientY) < 10) return;
-        E(p.current, 1, "🚀 カスタムドラッグ開始 -", s.panelId);
-        const X = document.querySelector(`[data-panel-id="${s.panelId}"]`);
-        if (X && m.current) {
-          const G = X.getBoundingClientRect(), Q = m.current.x - G.left, V = m.current.y - G.top;
-          L(s.panelId, Q, V), document.body.classList.add("custom-dragging"), c({
+          document.body.classList.remove("droppable"), w(null), m((K) => ({ ...K, dragOverColumn: null }));
+      } else if (a && o.isClicked && o.panelId) {
+        if (r[o.panelId] !== "custom" || l(f.clientX, f.clientY) < 10) return;
+        M(v.current, 1, "🚀 カスタムドラッグ開始 -", o.panelId);
+        const U = document.querySelector(`[data-panel-id="${o.panelId}"]`);
+        if (U && g.current) {
+          const K = U.getBoundingClientRect(), ae = g.current.x - K.left, G = g.current.y - K.top;
+          J(o.panelId, ae, G), document.body.classList.add("custom-dragging"), d({
             isActive: !0,
-            panelId: s.panelId,
-            startX: Q,
-            startY: V
+            panelId: o.panelId,
+            startX: ae,
+            startY: G
           });
         }
-        h({ isDragging: !0, draggedPanel: s.panelId, dragOverColumn: null }), b(y(s.panelId)), j(d.clientX, d.clientY), M({ isClicked: !1, panelId: null }), T(!1), Y(), m.current = null, g.current && (clearTimeout(g.current), g.current = null);
+        m({ isDragging: !0, draggedPanel: o.panelId, dragOverColumn: null }), b(j(o.panelId)), C(f.clientX, f.clientY), A({ isClicked: !1, panelId: null }), q(!1), _(), g.current = null, y.current && (clearTimeout(y.current), y.current = null);
       }
     },
     [
-      n.isActive,
-      s,
-      e.dragOverColumn,
+      e.isActive,
       o,
-      i,
-      k,
-      h,
-      N,
-      Z,
-      y,
-      c,
-      b,
-      j,
-      M,
+      n.dragOverColumn,
+      r,
+      a,
       T,
-      Y,
-      L,
-      f,
+      m,
+      w,
+      l,
+      j,
+      d,
+      b,
       C,
+      A,
+      q,
+      _,
+      J,
+      p,
+      $,
       W
     ]
-  ), H = w(
-    (d) => {
-      if (E(p.current, 1, "🐭 カスタムドラッグハンドラー - グローバルマウスアップ", {
-        isActive: n.isActive,
-        panelId: n.panelId,
-        dragMode: n.panelId ? o[n.panelId] : "unknown"
-      }), n.isActive) {
-        D.current.stop();
-        const S = A.current;
+  ), X = k(
+    (f) => {
+      if (M(v.current, 1, "🐭 カスタムドラッグハンドラー - グローバルマウスアップ", {
+        isActive: e.isActive,
+        panelId: e.panelId,
+        dragMode: e.panelId ? r[e.panelId] : "unknown"
+      }), e.isActive) {
+        R.current.stop();
+        const S = Y.current;
         if (S) {
-          const G = document.elementFromPoint(d.clientX, d.clientY)?.closest("[data-drop-zone]");
-          if (G) {
-            const Q = G.getAttribute("data-column-key");
-            Q && o[n.panelId] === "custom" ? (E(p.current, 1, "🔄 カスタムドラッグパネル移動実行:", n.panelId, "→", Q), l(n.panelId, Q, S.insertIndex)) : E(p.current, 1, "🚫 カスタムドラッグパネル移動スキップ:", n.panelId, "モード:", o[n.panelId]);
+          const K = document.elementFromPoint(f.clientX, f.clientY)?.closest("[data-drop-zone]");
+          if (K) {
+            const ae = K.getAttribute("data-column-key");
+            ae && r[e.panelId] === "custom" ? (M(v.current, 1, "🔄 カスタムドラッグパネル移動実行:", e.panelId, "→", ae), E(e.panelId, ae, S.insertIndex)) : M(v.current, 1, "🚫 カスタムドラッグパネル移動スキップ:", e.panelId, "モード:", r[e.panelId]);
           }
         }
-        x(), document.body.classList.remove("custom-dragging", "droppable"), U(), v.current = 0;
-      } else if (z(d.clientX, d.clientY)) {
-        const X = document.elementFromPoint(d.clientX, d.clientY)?.closest("[data-panel-id]"), G = X?.getAttribute("data-panel-id") ?? null;
-        if (!(X && G) || o[G] !== "custom") {
-          g.current && (clearTimeout(g.current), g.current = null), $(), m.current = null, v.current = 0;
+        x(), document.body.classList.remove("custom-dragging", "droppable"), L(), D.current = 0;
+      } else if (N(f.clientX, f.clientY)) {
+        const U = document.elementFromPoint(f.clientX, f.clientY)?.closest("[data-panel-id]"), K = U?.getAttribute("data-panel-id") ?? null;
+        if (!(U && K) || r[K] !== "custom") {
+          y.current && (clearTimeout(y.current), y.current = null), B(), g.current = null, D.current = 0;
           return;
         }
-        v.current += 1, s.isClicked === !1 && v.current === 1 ? (E(p.current, 1, "🖱️ 仮想クリック検出 - ドラッグ待機状態へ:", G), M({ isClicked: !0, panelId: G }), g.current = window.setTimeout(() => {
-          E(p.current, 1, "⏳ クリック待機状態を自動解除:", G), $(), m.current = null, v.current = 0;
-        }, 2e3)) : (E(p.current, 1, "🚫 クリック待機状態を解除 - 仮想クリック検出停止:", G), g.current && (clearTimeout(g.current), g.current = null), $(), m.current = null, v.current = 0, g.current = window.setTimeout(() => {
-          E(p.current, 1, "⏳ 仮想クリック検出再開:", G);
+        D.current += 1, o.isClicked === !1 && D.current === 1 ? (M(v.current, 1, "🖱️ 仮想クリック検出 - ドラッグ待機状態へ:", K), A({ isClicked: !0, panelId: K }), y.current = window.setTimeout(() => {
+          M(v.current, 1, "⏳ クリック待機状態を自動解除:", K), B(), g.current = null, D.current = 0;
+        }, 2e3)) : (M(v.current, 1, "🚫 クリック待機状態を解除 - 仮想クリック検出停止:", K), y.current && (clearTimeout(y.current), y.current = null), B(), g.current = null, D.current = 0, y.current = window.setTimeout(() => {
+          M(v.current, 1, "⏳ 仮想クリック検出再開:", K);
         }, 2e3));
-      } else s.isClicked && ($(), m.current = null, v.current = 0);
-      i && T(!1);
+      } else o.isClicked && (B(), g.current = null, D.current = 0);
+      a && q(!1);
     },
-    [n.isActive, n.panelId, s, o, i, l, U, $, z, M, T, x]
-  ), a = w(
-    (d, S) => {
-      if (o[S] !== "custom") {
-        E(p.current, 1, "🚫 カスタムドラッグモードではない - スキップ:", S);
+    [e.isActive, e.panelId, o, r, a, E, L, B, N, A, q, x]
+  ), u = k(
+    (f, S) => {
+      if (r[S] !== "custom") {
+        M(v.current, 1, "🚫 カスタムドラッグモードではない - スキップ:", S);
         return;
       }
-      _(d.clientX, d.clientY), s.isClicked && s.panelId === S && (T(!0), g.current !== null && (clearTimeout(g.current), g.current = null), R(d.clientX, d.clientY), m.current = { x: d.clientX, y: d.clientY });
+      h(f.clientX, f.clientY), o.isClicked && o.panelId === S && (q(!0), y.current !== null && (clearTimeout(y.current), y.current = null), P(f.clientX, f.clientY), g.current = { x: f.clientX, y: f.clientY });
     },
-    [s, o, _, T, R]
+    [o, r, h, q, P]
   );
-  return K(() => () => {
-    g.current !== null && clearTimeout(g.current), D.current.stop();
+  return oe(() => () => {
+    y.current !== null && clearTimeout(y.current), R.current.stop();
   }, []), {
-    handleGlobalMouseMove: O,
-    handleGlobalMouseUp: H,
-    handleMouseDown: a
+    handleGlobalMouseMove: F,
+    handleGlobalMouseUp: X,
+    handleMouseDown: u
   };
-}, Ft = () => {
-  const [r, e] = te({
+}, Rr = () => {
+  const [t, n] = se({
     isDragging: !1,
     draggedPanel: null,
     dragOverColumn: null
-  }), [n, s] = te(null), [o, i] = te(null), [u, c] = te({
+  }), [e, o] = se(null), [r, a] = se(null), [i, d] = se({
     isActive: !1,
     panelId: "",
     startX: 0,
     startY: 0
-  }), [h, N] = te({
+  }), [m, w] = se({
     isClicked: !1,
     panelId: null
-  }), [b, M] = te({
-    isTouchDragging: !1,
-    startX: 0,
-    startY: 0,
-    currentX: 0,
-    currentY: 0,
-    draggedElement: null
-  }), [T, y] = te(!1), l = w(() => {
-    c({ isActive: !1, panelId: "", startX: 0, startY: 0 }), e({ isDragging: !1, draggedPanel: null, dragOverColumn: null }), s(null), i(null);
-  }, []), j = w(() => {
-    N({ isClicked: !1, panelId: null }), y(!1);
-  }, []), k = w(($) => {
-    e($);
-  }, []), _ = w(($) => {
-    s($);
-  }, []), R = w(($) => {
-    i($);
-  }, []), z = w(($) => {
-    c($);
-  }, []), Z = w(($) => {
-    N($);
-  }, []), Y = w(($) => {
-    M($);
-  }, []), U = w(($) => {
-    y($);
+  }), [b, A] = se(!1), q = k(() => {
+    d({ isActive: !1, panelId: "", startX: 0, startY: 0 }), n({ isDragging: !1, draggedPanel: null, dragOverColumn: null }), o(null), a(null);
+  }, []), j = k(() => {
+    w({ isClicked: !1, panelId: null }), A(!1);
+  }, []), E = k((l) => {
+    n(l);
+  }, []), C = k((l) => {
+    o(l);
+  }, []), T = k((l) => {
+    a(l);
+  }, []), h = k((l) => {
+    d(l);
+  }, []), P = k((l) => {
+    w(l);
+  }, []), N = k((l) => {
+    A(l);
   }, []);
   return {
     // States / 状態
-    dragState: r,
-    dragOverPosition: n,
-    originalPanelPosition: o,
-    customDrag: u,
-    clickState: h,
-    touchDragState: b,
-    isMouseDown: T,
+    dragState: t,
+    dragOverPosition: e,
+    originalPanelPosition: r,
+    customDrag: i,
+    clickState: m,
+    isMouseDown: b,
     // Stabilized Setters / 安定化されたセッター
-    setDragState: k,
-    setDragOverPosition: _,
-    setOriginalPanelPosition: R,
-    setCustomDrag: z,
-    setClickState: Z,
-    setTouchDragState: Y,
-    setIsMouseDown: U,
+    setDragState: E,
+    setDragOverPosition: C,
+    setOriginalPanelPosition: T,
+    setCustomDrag: h,
+    setClickState: P,
+    setIsMouseDown: N,
     // Utility Functions / ユーティリティ関数
-    resetDragState: l,
+    resetDragState: q,
     resetClickState: j
   };
-}, Xt = () => {
-  const [r, e] = te({
+}, _r = () => {
+  const [t, n] = se({
     x: 0,
     y: 0,
     isVisible: !1
-  }), n = F(null), s = F(0), o = F(null), i = w((y, l) => {
-    e({ x: y, y: l, isVisible: !0 });
-  }, []), u = w(() => {
-    e((y) => ({ ...y, isVisible: !1 }));
-  }, []), c = w((y, l) => {
-    e((j) => j.x === y && j.y === l ? j : {
-      x: y,
-      y: l,
-      isVisible: j.isVisible
+  }), e = I(null), o = I(0), r = I(null), a = k((j, E) => {
+    n({ x: j, y: E, isVisible: !0 });
+  }, []), i = k(() => {
+    n((j) => ({ ...j, isVisible: !1 }));
+  }, []), d = k((j, E) => {
+    n((C) => C.x === j && C.y === E ? C : {
+      x: j,
+      y: E,
+      isVisible: C.isVisible
     });
-  }, []), h = w((y, l) => {
-    s.current = Date.now(), o.current = { x: y, y: l };
-  }, []), N = w((y, l) => {
-    n.current = { x: y, y: l };
-  }, []), b = w((y, l, j = 500, k = 5) => Date.now() - (s.current || 0) >= j || !o.current ? !1 : Math.sqrt((y - o.current.x) ** 2 + (l - o.current.y) ** 2) < k, []), M = w((y, l) => {
-    if (!n.current)
+  }, []), m = k((j, E) => {
+    o.current = Date.now(), r.current = { x: j, y: E };
+  }, []), w = k((j, E) => {
+    e.current = { x: j, y: E };
+  }, []), b = k((j, E, C = 500, T = 5) => Date.now() - (o.current || 0) >= C || !r.current ? !1 : Math.sqrt((j - r.current.x) ** 2 + (E - r.current.y) ** 2) < T, []), A = k((j, E) => {
+    if (!e.current)
       return 0;
-    const j = Math.abs(y - n.current.x), k = Math.abs(l - n.current.y);
-    return Math.sqrt(j * j + k * k);
-  }, []), T = w(() => {
-    n.current = null, s.current = 0, o.current = null;
+    const C = Math.abs(j - e.current.x), T = Math.abs(E - e.current.y);
+    return Math.sqrt(C * C + T * T);
+  }, []), q = k(() => {
+    e.current = null, o.current = 0, r.current = null;
   }, []);
   return {
-    mousePosition: r,
-    lastClickPosition: n.current,
-    mouseDownTime: s.current,
-    mouseDownPosition: o.current,
-    showMousePosition: i,
-    hideMousePosition: u,
-    updateMousePosition: c,
-    recordMouseDown: h,
-    recordClickPosition: N,
+    mousePosition: t,
+    lastClickPosition: e.current,
+    mouseDownTime: o.current,
+    mouseDownPosition: r.current,
+    showMousePosition: a,
+    hideMousePosition: i,
+    updateMousePosition: d,
+    recordMouseDown: m,
+    recordClickPosition: w,
     isVirtualClick: b,
-    calculateMoveDistance: M,
-    clearMouseTracking: T
+    calculateMoveDistance: A,
+    clearMouseTracking: q
   };
-}, Ht = ({
-  debugConfig: r,
-  dragState: e,
-  customDrag: n,
-  dragModes: s,
-  columnPanels: o,
-  dragOverPosition: i,
-  originalPanelPosition: u,
-  setDragState: c,
-  setDragOverPosition: h,
-  setOriginalPanelPosition: N,
+}, Lr = ({
+  debugConfig: t,
+  dragState: n,
+  customDrag: e,
+  dragModes: o,
+  columnPanels: r,
+  dragOverPosition: a,
+  originalPanelPosition: i,
+  setDragState: d,
+  setDragOverPosition: m,
+  setOriginalPanelPosition: w,
   performPanelMove: b,
-  showMousePosition: M,
-  updateMousePosition: T,
-  resetDragState: y,
-  handlePlaceholderDragEnter: l,
-  handlePlaceholderDragLeave: j,
-  scale: k = 1
+  showMousePosition: A,
+  updateMousePosition: q,
+  resetDragState: j,
+  handlePlaceholderDragEnter: E,
+  handlePlaceholderDragLeave: C,
+  scale: T = 1
 }) => {
-  const _ = F(r);
-  _.current = r;
-  const R = F(o);
-  R.current = o;
-  const z = F(e);
-  z.current = e;
-  const Z = F(i);
-  Z.current = i;
-  const Y = F(u);
-  Y.current = u;
-  const U = F(k);
-  U.current = k;
-  const $ = F(new Ke(ke));
-  K(() => {
-    const p = document.querySelector("main[data-aqdd-scroll-root]");
-    p && $.current.setScrollElement(p);
+  const h = I(t);
+  h.current = t;
+  const P = I(r);
+  P.current = r;
+  const N = I(n);
+  N.current = n;
+  const l = I(a);
+  l.current = a;
+  const _ = I(i);
+  _.current = i;
+  const L = I(T);
+  L.current = T;
+  const B = I(new rt(Me));
+  oe(() => {
+    const v = document.querySelector(Zt);
+    v && B.current.setScrollElement(v);
   }, []);
-  const L = w(
-    (p, g) => {
-      if (n.isActive) {
-        E(_.current, 2, "カスタムドラッグアクティブ中 - 通常ドラッグを無効化:", g), p.preventDefault();
+  const J = k(
+    (v, y) => {
+      if (e.isActive) {
+        M(h.current, 2, "カスタムドラッグアクティブ中 - 通常ドラッグを無効化:", y), v.preventDefault();
         return;
       }
-      if (s[g] === "custom") {
-        E(_.current, 2, "カスタムドラッグモード - 通常ドラッグを無効化:", g), p.preventDefault();
+      if (o[y] === "custom") {
+        M(h.current, 2, "カスタムドラッグモード - 通常ドラッグを無効化:", y), v.preventDefault();
         return;
       }
-      E(_.current, 1, "ドラッグ開始:", g);
-      const m = Object.keys(R.current);
-      let v = null;
-      for (let D = 0; D < m.length; D++) {
-        const A = m[D], O = R.current[A].indexOf(g);
-        if (O !== -1) {
-          v = { columnIndex: D, panelIndex: O };
+      M(h.current, 1, "ドラッグ開始:", y);
+      const g = Object.keys(P.current);
+      let D = null;
+      for (let R = 0; R < g.length; R++) {
+        const Y = g[R], F = P.current[Y].indexOf(y);
+        if (F !== -1) {
+          D = { columnIndex: R, panelIndex: F };
           break;
         }
       }
-      if (N(v), p.dataTransfer) {
-        p.dataTransfer.setData("text/plain", g), p.dataTransfer.effectAllowed = "move";
-        const D = U.current;
-        if (D < 1) {
-          const A = p.currentTarget.closest("[data-panel-id]") ?? p.currentTarget, O = A.getBoundingClientRect(), H = A.offsetWidth, a = A.offsetHeight, d = A.cloneNode(!0);
-          d.removeAttribute("data-panel-id"), d.removeAttribute("id"), d.style.margin = "0", d.style.width = `${H}px`, d.style.height = `${a}px`, d.style.transform = `scale(${D})`, d.style.transformOrigin = "top left";
+      if (w(D), v.dataTransfer) {
+        v.dataTransfer.setData("text/plain", y), v.dataTransfer.effectAllowed = "move";
+        const R = L.current;
+        if (R < 1) {
+          const Y = v.currentTarget.closest("[data-panel-id]") ?? v.currentTarget, F = Y.getBoundingClientRect(), X = Y.offsetWidth, u = Y.offsetHeight, f = Y.cloneNode(!0);
+          f.removeAttribute("data-panel-id"), f.removeAttribute("id"), Gt(Y, f), f.style.margin = "0", f.style.width = `${X}px`, f.style.height = `${u}px`, f.style.transform = `scale(${R})`, f.style.transformOrigin = "top left";
           const S = document.createElement("div");
-          S.style.position = "fixed", S.style.top = "0", S.style.left = "-10000px", S.style.width = `${H * D}px`, S.style.height = `${a * D}px`, S.style.overflow = "hidden", S.style.opacity = "0.8", S.style.pointerEvents = "none", S.appendChild(d), document.body.appendChild(S), p.dataTransfer.setDragImage(S, p.clientX - O.left, p.clientY - O.top), requestAnimationFrame(() => S.remove());
+          S.style.position = "fixed", S.style.top = "0", S.style.left = "-10000px", S.style.width = `${X * R}px`, S.style.height = `${u * R}px`, S.style.overflow = "hidden", S.style.opacity = "0.8", S.style.pointerEvents = "none", S.appendChild(f), document.body.appendChild(S), v.dataTransfer.setDragImage(S, v.clientX - F.left, v.clientY - F.top), requestAnimationFrame(() => S.remove());
         }
       }
-      M(p.clientX, p.clientY), requestAnimationFrame(() => {
-        c({
+      A(v.clientX, v.clientY), requestAnimationFrame(() => {
+        d({
           isDragging: !0,
-          draggedPanel: g,
+          draggedPanel: y,
           dragOverColumn: null
         });
       });
     },
-    [s, n.isActive, N, M, c]
-  ), f = w(() => {
-    E(_.current, 1, "ドラッグ終了"), $.current.stop(), y();
-  }, [y]), x = w(
-    (p, g) => {
-      if (p.preventDefault(), p.dataTransfer.dropEffect = "move", !z.current.isDragging) return;
-      T(p.clientX, p.clientY), g !== z.current.dragOverColumn && c((D) => ({ ...D, dragOverColumn: g }));
-      const m = document.elementFromPoint(p.clientX, p.clientY), v = m?.closest("[data-placeholder-index]");
-      if (v) {
-        const D = v.getAttribute("data-placeholder-index"), A = v.getAttribute("data-placeholder-column");
-        if (D && A) {
-          const O = parseInt(D, 10), H = parseInt(A, 10);
-          l(H, O);
+    [o, e.isActive, w, A, d]
+  ), p = k(() => {
+    M(h.current, 1, "ドラッグ終了"), B.current.stop(), j();
+  }, [j]), x = k(
+    (v, y) => {
+      if (v.preventDefault(), v.dataTransfer.dropEffect = "move", !N.current.isDragging) return;
+      q(v.clientX, v.clientY), y !== N.current.dragOverColumn && d((R) => ({ ...R, dragOverColumn: y }));
+      const g = document.elementFromPoint(v.clientX, v.clientY), D = g?.closest("[data-placeholder-index]");
+      if (D) {
+        const R = D.getAttribute("data-placeholder-index"), Y = D.getAttribute("data-placeholder-column");
+        if (R && Y) {
+          const F = parseInt(R, 10), X = parseInt(Y, 10);
+          E(X, F);
         }
       } else
-        m?.closest("[data-drop-zone]") || j();
+        g?.closest("[data-drop-zone]") || C();
     },
-    [T, c, l, j]
-  ), C = w(
-    (p, g) => {
-      p.preventDefault();
-      const m = p.dataTransfer.getData("text/plain"), v = Z.current;
-      m && v && (E(_.current, 1, "🎯 ドロップ完了:", {
-        draggedPanel: m,
-        targetColumn: g,
-        insertPosition: `カラム${v.columnIndex} - 位置${v.insertIndex}`
-      }), b(m, g, v.insertIndex), h(null), f());
+    [q, d, E, C]
+  ), $ = k(
+    (v, y) => {
+      v.preventDefault();
+      const g = v.dataTransfer.getData("text/plain"), D = l.current;
+      g && D && (M(h.current, 1, "🎯 ドロップ完了:", {
+        draggedPanel: g,
+        targetColumn: y,
+        insertPosition: `カラム${D.columnIndex} - 位置${D.insertIndex}`
+      }), b(g, y, D.insertIndex), m(null), p());
     },
-    [b, h, f]
-  ), W = w(
-    (p) => {
-      const g = p.currentTarget, m = p.relatedTarget;
-      m && g.contains(m) || (h(null), c((v) => ({ ...v, dragOverColumn: null })));
+    [b, m, p]
+  ), W = k(
+    (v) => {
+      const y = v.currentTarget, g = v.relatedTarget;
+      g && y.contains(g) || (m(null), d((D) => ({ ...D, dragOverColumn: null })));
     },
-    [h, c]
+    [m, d]
   );
-  return K(() => {
-    const p = (g) => {
-      z.current.isDragging && (T(g.clientX, g.clientY), $.current.update(g.clientX, g.clientY));
+  return oe(() => {
+    const v = (y) => {
+      N.current.isDragging && (q(y.clientX, y.clientY), B.current.update(y.clientX, y.clientY));
     };
-    if (e.isDragging)
-      return document.addEventListener("dragover", p), () => {
-        document.removeEventListener("dragover", p), $.current.stop();
+    if (n.isDragging)
+      return document.addEventListener("dragover", v), () => {
+        document.removeEventListener("dragover", v), B.current.stop();
       };
-  }, [e.isDragging, T]), K(() => () => {
-    $.current.stop();
+  }, [n.isDragging, q]), oe(() => () => {
+    B.current.stop();
   }, []), {
-    handleDragStart: L,
-    handleDragEnd: f,
+    handleDragStart: J,
+    handleDragEnd: p,
     handleDragOverWithInsert: x,
-    handleDropWithInsert: C,
+    handleDropWithInsert: $,
     handleColumnDragLeave: W
   };
-}, qt = (r, e = 1) => {
-  const [n, s] = te(r), [o, i] = te({}), u = F({}), c = F(null), h = F({ x: 0, y: 0 }), N = F(e);
-  N.current = e;
-  const b = w((R) => document.querySelector(`[data-panel-id="${R}"]`), []), M = w(
-    (R, z) => {
-      const Z = z.getBoundingClientRect(), Y = window.getComputedStyle(z), U = {
-        width: Math.round(Z.width),
-        height: Math.round(Z.height),
-        x: Math.round(Z.left),
-        y: Math.round(Z.top),
-        minHeight: Y.minHeight || "auto",
-        maxHeight: Y.maxHeight || "none"
-      }, $ = u.current[R];
-      (!$ || Object.keys(U).some((L) => $[L] !== U[L])) && (u.current[R] = U, i((L) => ({
-        ...L,
-        [R]: U
+}, zr = (t, n = 1) => {
+  const [e, o] = se(t), [r, a] = se({}), i = I({}), d = I(null), m = I({ x: 0, y: 0 }), w = I(n);
+  w.current = n;
+  const b = k((P) => document.querySelector(`[data-panel-id="${P}"]`), []), A = k(
+    (P, N) => {
+      const l = N.getBoundingClientRect(), _ = window.getComputedStyle(N), L = {
+        width: Math.round(l.width),
+        height: Math.round(l.height),
+        x: Math.round(l.left),
+        y: Math.round(l.top),
+        minHeight: _.minHeight || "auto",
+        maxHeight: _.maxHeight || "none"
+      }, B = i.current[P];
+      (!B || Object.keys(L).some((J) => B[J] !== L[J])) && (i.current[P] = L, a((J) => ({
+        ...J,
+        [P]: L
       })));
     },
     []
     // setPanelSizes は React の state セッターなので依存配列に含める必要はありません
-  ), T = w(
-    (R) => {
-      const z = b(R);
-      z && M(R, z);
+  ), q = k(
+    (P) => {
+      const N = b(P);
+      N && A(P, N);
     },
-    [b, M]
-  ), y = w(
-    (R, z) => {
-      z && requestAnimationFrame(() => M(R, z));
+    [b, A]
+  ), j = k(
+    (P, N) => {
+      N && requestAnimationFrame(() => A(P, N));
     },
-    [M]
-  ), l = w(
-    (R, z, Z) => {
-      const Y = b(R);
-      if (!Y || c.current) return;
-      const U = N.current, $ = Y.getBoundingClientRect(), L = Y.cloneNode(!0);
-      L.removeAttribute("data-panel-id"), L.style.position = "fixed", L.style.top = "0px", L.style.left = "0px", L.style.width = `${Y.offsetWidth}px`, L.style.height = `${Y.offsetHeight}px`, L.style.pointerEvents = "none", L.style.zIndex = "1000", L.style.opacity = "0.5", L.style.margin = "0", L.style.transition = "none", L.style.boxShadow = "0 8px 32px rgba(0,0,0,0.3)", L.style.transformOrigin = "top left", L.style.transform = `translate(${$.left}px, ${$.top}px) scale(${U})`, L.id = `drag-image-${R}`, document.body.appendChild(L), c.current = L, h.current = { x: z, y: Z };
+    [A]
+  ), E = k(
+    (P, N, l) => {
+      const _ = b(P);
+      !_ || d.current || (d.current = Kt(_, P, w.current), m.current = { x: N, y: l });
     },
     [b]
-  ), j = w((R, z) => {
-    if (c.current) {
-      const Z = R - h.current.x, Y = z - h.current.y;
-      c.current.style.transform = `translate(${Z}px, ${Y}px) scale(${N.current * 1.05})`;
-    }
-  }, []), k = w(() => {
-    c.current && (c.current.remove(), c.current = null);
-  }, []), _ = w((R) => {
-    s((z) => ({
-      ...z,
-      [R]: !z[R]
+  ), C = k((P, N) => {
+    d.current && Jt(d.current, P, N, m.current, w.current);
+  }, []), T = k(() => {
+    d.current && (d.current.remove(), d.current = null);
+  }, []), h = k((P) => {
+    o((N) => ({
+      ...N,
+      [P]: !N[P]
     }));
   }, []);
   return {
     // State / 状態
-    panelVisibility: n,
-    panelSizes: o,
+    panelVisibility: e,
+    panelSizes: r,
     // State update functions / 状態更新関数
-    setPanelVisibility: s,
-    setPanelSizes: i,
-    setPanelRef: y,
-    updatePanelSize: T,
-    togglePanelVisibility: _,
+    setPanelVisibility: o,
+    setPanelSizes: a,
+    setPanelRef: j,
+    updatePanelSize: q,
+    togglePanelVisibility: h,
     // Utility functions / ユーティリティ関数
     getPanelElement: b,
     // Functions for drag image management / ドラッグイメージ管理用の関数
-    createDragImage: l,
-    updateDragImagePosition: j,
-    removeDragImage: k
+    createDragImage: E,
+    updateDragImagePosition: C,
+    removeDragImage: T
   };
-}, on = ({ initialColumnPanels: r, initialPanelVisibility: e, initialDragModes: n = {}, debugConfig: s, onPanelMove: o, onDragModeChange: i, onColumnPanelsChange: u, scale: c = 1 }) => {
-  const h = F(s);
-  h.current = s;
-  const [N, b] = te(r), [M, T] = te(n), y = F(N);
-  y.current = N;
-  const l = Ft(), j = Xt(), k = qt(e, c), _ = F({
+}, eo = ({ initialColumnPanels: t, initialPanelVisibility: n, initialDragModes: e = {}, debugConfig: o, onPanelMove: r, onDragModeChange: a, onColumnPanelsChange: i, scale: d = 1 }) => {
+  const m = I(o);
+  m.current = o;
+  const [w, b] = se(t), [A, q] = se(e), j = I(w), E = I(A), C = k((g) => {
+    if (typeof g == "function") throw new TypeError("setColumnPanels takes the next arrangement itself, not an updater function");
+    j.current = g, b(g);
+  }, []), T = k((g) => {
+    if (typeof g == "function") throw new TypeError("setDragModes takes the next drag modes themselves, not an updater function");
+    E.current = g, q(g);
+  }, []), h = Rr(), P = _r(), N = zr(n, d), l = I({
     mousemove: null,
     mouseup: null
-  }), R = w((m) => {
-    const v = Object.keys(y.current), D = Lt(v, ie);
-    for (let A = 0; A < D.length; A++) {
-      const O = D[A], H = y.current[O]?.indexOf(m) ?? -1;
-      if (H !== -1)
-        return { columnIndex: A, panelIndex: H };
+  }), _ = k((g) => {
+    const D = Object.keys(j.current), R = Ar(D, fe);
+    for (let Y = 0; Y < R.length; Y++) {
+      const F = R[Y], X = j.current[F]?.indexOf(g) ?? -1;
+      if (X !== -1)
+        return { columnIndex: Y, panelIndex: X };
     }
     return null;
-  }, []), z = w(
-    (m, v, D) => {
-      E(h.current, 1, "🔄 パネル移動実行:", m, "→", v, "@", D), b((A) => {
-        const O = { ...A }, H = Object.keys(O).find((a) => O[a].includes(m));
-        if (!H)
-          return console.error("Source column not found for panel:", m), A;
-        if (!O[v])
-          return console.error("Target column not found:", v), A;
-        if (H === v) {
-          const a = [...O[H]], d = a.indexOf(m), [S] = a.splice(d, 1), X = d < D ? D - 1 : D;
-          a.splice(X, 0, S), O[v] = a;
-        } else {
-          O[H] = O[H].filter((d) => d !== m);
-          const a = [...O[v]];
-          a.splice(D, 0, m), O[v] = a;
+  }, []), L = k(
+    (g, D, R) => {
+      M(m.current, 1, "🔄 パネル移動実行:", g, "→", D, "@", R);
+      const Y = j.current, F = Object.keys(Y).find((u) => Y[u].includes(g));
+      if (F === void 0) {
+        console.error("Source column not found for panel:", g);
+        return;
+      }
+      if (!Y[D]) {
+        console.error("Target column not found:", D);
+        return;
+      }
+      const X = Ft(Y, g, D, R);
+      X !== null && (C(X), M(m.current, 1, "✅ パネル移動完了:", g, "→", D), !(i === void 0 && r === void 0) && requestAnimationFrame(() => {
+        const u = [];
+        try {
+          i?.(X);
+        } catch (f) {
+          u.push(f);
         }
-        if (E(h.current, 1, "✅ パネル移動完了:", m, "→", v), u && requestAnimationFrame(() => {
-          u(O);
-        }), o) {
-          const a = Object.keys(A).find((d) => A[d].includes(m));
-          a && requestAnimationFrame(() => {
-            o(m, a, v, D);
-          });
+        try {
+          r?.(g, F, D, R);
+        } catch (f) {
+          u.push(f);
         }
-        return O;
-      });
+        if (u.length === 1) throw u[0];
+        if (u.length === 2) throw new AggregateError(u, "onColumnPanelsChange and onPanelMove both threw");
+      }));
     },
-    [u, o]
-  ), Z = w(
-    (m, v) => {
-      if (!(l.dragState.isDragging || l.customDrag.isActive)) return;
-      const D = l.originalPanelPosition;
-      if (D && D.columnIndex === m && (D.panelIndex === v || D.panelIndex + 1 === v)) {
-        E(h.current, 1, `元の位置への挿入をスキップ: カラム${m}, 位置${v}`);
+    [i, r, C]
+  ), B = k(
+    (g, D) => {
+      if (!(h.dragState.isDragging || h.customDrag.isActive)) return;
+      const R = h.originalPanelPosition;
+      if (R !== null && et(R, g, D)) {
+        M(m.current, 1, `元の位置への挿入をスキップ: カラム${g}, 位置${D}`);
         return;
       }
-      const A = l.dragOverPosition;
-      (!A || A.columnIndex !== m || A.insertIndex !== v) && (E(h.current, 1, `プレースホルダーエンター: カラム${m}, 位置${v}`), l.setDragOverPosition({ columnIndex: m, insertIndex: v }), l.setDragState((O) => ({ ...O, dragOverColumn: m })));
+      const Y = h.dragOverPosition;
+      (!Y || Y.columnIndex !== g || Y.insertIndex !== D) && (M(m.current, 1, `プレースホルダーエンター: カラム${g}, 位置${D}`), h.setDragOverPosition({ columnIndex: g, insertIndex: D }), h.setDragState((F) => ({ ...F, dragOverColumn: g })));
     },
-    [l]
-  ), Y = w(
-    (m, v, D) => {
-      if (l.dragState.isDragging || l.customDrag.isActive) {
-        if (l.customDrag.isActive)
-          E(h.current, 1, "🚫 カスタムドラッグ - プレースホルダーリーブ: ハイライトを解除します。"), l.setDragOverPosition(null);
-        else if (l.dragState.isDragging && m && v !== void 0 && D !== void 0) {
-          const A = l.dragOverPosition;
-          if (A && A.columnIndex === v && A.insertIndex === D) {
-            const O = m.currentTarget, H = m.relatedTarget;
-            H && O.contains(H) || (E(h.current, 1, `ノーマルドラッグ - プレースホルダーリーブ: カラム${v}, 位置${D}。ハイライトを解除します。`), l.setDragOverPosition(null));
+    [h]
+  ), J = k(
+    (g, D, R) => {
+      if (h.dragState.isDragging || h.customDrag.isActive) {
+        if (h.customDrag.isActive)
+          M(m.current, 1, "🚫 カスタムドラッグ - プレースホルダーリーブ: ハイライトを解除します。"), h.setDragOverPosition(null);
+        else if (h.dragState.isDragging && g && D !== void 0 && R !== void 0) {
+          const Y = h.dragOverPosition;
+          if (Y && Y.columnIndex === D && Y.insertIndex === R) {
+            const F = g.currentTarget, X = g.relatedTarget;
+            X && F.contains(X) || (M(m.current, 1, `ノーマルドラッグ - プレースホルダーリーブ: カラム${D}, 位置${R}。ハイライトを解除します。`), h.setDragOverPosition(null));
           }
         }
       }
     },
-    [l]
-  ), U = Yt({
-    debugConfig: h.current,
-    dragState: l.dragState,
-    customDrag: l.customDrag,
-    clickState: l.clickState,
-    dragModes: M,
-    isMouseDown: l.isMouseDown,
-    originalPanelPosition: l.originalPanelPosition,
-    dragOverPosition: l.dragOverPosition,
-    setCustomDrag: l.setCustomDrag,
-    setDragState: l.setDragState,
-    setDragOverPosition: l.setDragOverPosition,
-    setOriginalPanelPosition: l.setOriginalPanelPosition,
-    setClickState: l.setClickState,
-    setIsMouseDown: l.setIsMouseDown,
-    findPanelPosition: R,
-    performPanelMove: z,
-    showMousePosition: j.showMousePosition,
-    updateMousePosition: j.updateMousePosition,
-    recordMouseDown: j.recordMouseDown,
-    recordClickPosition: j.recordClickPosition,
-    isVirtualClick: j.isVirtualClick,
-    calculateMoveDistance: j.calculateMoveDistance,
-    clearMouseTracking: j.clearMouseTracking,
-    resetDragState: l.resetDragState,
-    resetClickState: l.resetClickState,
-    createDragImage: k.createDragImage,
-    updateDragImagePosition: k.updateDragImagePosition,
-    removeDragImage: k.removeDragImage,
-    handlePlaceholderDragEnter: Z,
-    handlePlaceholderDragLeave: Y
-  }), $ = Ht({
-    debugConfig: h.current,
-    dragState: l.dragState,
-    customDrag: l.customDrag,
-    dragModes: M,
-    columnPanels: N,
-    dragOverPosition: l.dragOverPosition,
-    originalPanelPosition: l.originalPanelPosition,
-    setDragState: l.setDragState,
-    setDragOverPosition: l.setDragOverPosition,
-    setOriginalPanelPosition: l.setOriginalPanelPosition,
-    performPanelMove: z,
-    showMousePosition: j.showMousePosition,
-    updateMousePosition: j.updateMousePosition,
-    resetDragState: l.resetDragState,
-    handlePlaceholderDragEnter: Z,
-    handlePlaceholderDragLeave: Y,
-    scale: c
-  }), L = w((m) => {
-    _.current.mousemove && _.current.mousemove(m);
-  }, []), f = w((m) => {
-    _.current.mouseup && _.current.mouseup(m);
+    [h]
+  ), p = Tr({
+    debugConfig: m.current,
+    dragState: h.dragState,
+    customDrag: h.customDrag,
+    clickState: h.clickState,
+    dragModes: A,
+    isMouseDown: h.isMouseDown,
+    originalPanelPosition: h.originalPanelPosition,
+    dragOverPosition: h.dragOverPosition,
+    setCustomDrag: h.setCustomDrag,
+    setDragState: h.setDragState,
+    setDragOverPosition: h.setDragOverPosition,
+    setOriginalPanelPosition: h.setOriginalPanelPosition,
+    setClickState: h.setClickState,
+    setIsMouseDown: h.setIsMouseDown,
+    findPanelPosition: _,
+    performPanelMove: L,
+    showMousePosition: P.showMousePosition,
+    updateMousePosition: P.updateMousePosition,
+    recordMouseDown: P.recordMouseDown,
+    recordClickPosition: P.recordClickPosition,
+    isVirtualClick: P.isVirtualClick,
+    calculateMoveDistance: P.calculateMoveDistance,
+    clearMouseTracking: P.clearMouseTracking,
+    resetDragState: h.resetDragState,
+    resetClickState: h.resetClickState,
+    createDragImage: N.createDragImage,
+    updateDragImagePosition: N.updateDragImagePosition,
+    removeDragImage: N.removeDragImage,
+    handlePlaceholderDragEnter: B,
+    handlePlaceholderDragLeave: J
+  }), x = Lr({
+    debugConfig: m.current,
+    dragState: h.dragState,
+    customDrag: h.customDrag,
+    dragModes: A,
+    columnPanels: w,
+    dragOverPosition: h.dragOverPosition,
+    originalPanelPosition: h.originalPanelPosition,
+    setDragState: h.setDragState,
+    setDragOverPosition: h.setDragOverPosition,
+    setOriginalPanelPosition: h.setOriginalPanelPosition,
+    performPanelMove: L,
+    showMousePosition: P.showMousePosition,
+    updateMousePosition: P.updateMousePosition,
+    resetDragState: h.resetDragState,
+    handlePlaceholderDragEnter: B,
+    handlePlaceholderDragLeave: J,
+    scale: d
+  }), $ = k((g) => {
+    l.current.mousemove && l.current.mousemove(g);
+  }, []), W = k((g) => {
+    l.current.mouseup && l.current.mouseup(g);
   }, []);
-  K(() => (E(h.current, 1, "🔧 グローバルイベントリスナー初期化 - refベース管理開始"), document.addEventListener("mousemove", L), document.addEventListener("mouseup", f), () => {
-    E(h.current, 1, "🔴 グローバルイベントリスナー終了 - refベース管理終了"), document.removeEventListener("mousemove", L), document.removeEventListener("mouseup", f);
-  }), [L, f]), K(() => {
-    const m = !l.clickState.isClicked && Object.entries(M).some(([, D]) => D === "custom"), v = l.clickState.isClicked && l.clickState.panelId;
-    if (m || v) {
-      const D = m ? "パターン1（仮想クリック検出）" : "パターン2,3（ドラッグ準備）";
-      E(h.current, 1, `🔧 イベントハンドラー設定開始: ${D}`), _.current.mousemove = U.handleGlobalMouseMove, _.current.mouseup = U.handleGlobalMouseUp;
+  oe(() => (M(m.current, 1, "🔧 グローバルイベントリスナー初期化 - refベース管理開始"), document.addEventListener("mousemove", $), document.addEventListener("mouseup", W), () => {
+    M(m.current, 1, "🔴 グローバルイベントリスナー終了 - refベース管理終了"), document.removeEventListener("mousemove", $), document.removeEventListener("mouseup", W);
+  }), [$, W]), oe(() => {
+    const g = !h.clickState.isClicked && Object.entries(A).some(([, R]) => R === "custom"), D = h.clickState.isClicked && h.clickState.panelId;
+    if (g || D) {
+      const R = g ? "パターン1（仮想クリック検出）" : "パターン2,3（ドラッグ準備）";
+      M(m.current, 1, `🔧 イベントハンドラー設定開始: ${R}`), l.current.mousemove = p.handleGlobalMouseMove, l.current.mouseup = p.handleGlobalMouseUp;
     } else
-      l.customDrag.isActive || l.dragState.isDragging || (_.current.mousemove = null, _.current.mouseup = null);
-  }, [l.clickState.isClicked, l.clickState.panelId, M, l.customDrag.isActive, l.dragState.isDragging, U.handleGlobalMouseMove, U.handleGlobalMouseUp]);
-  const x = w(
-    (m, v) => {
-      const D = m.touches[0], A = m.currentTarget;
-      l.setTouchDragState({
-        isTouchDragging: !0,
-        startX: D.clientX,
-        startY: D.clientY,
-        currentX: D.clientX,
-        currentY: D.clientY,
-        draggedElement: A
-      }), l.setDragState({
-        isDragging: !0,
-        draggedPanel: v,
-        dragOverColumn: null
-      });
-    },
-    [l]
-  ), C = w(
-    (m) => {
-      if (!l.touchDragState.isTouchDragging) return;
-      m.preventDefault();
-      const v = m.touches[0];
-      l.setTouchDragState((D) => ({
-        ...D,
-        currentX: v.clientX,
-        currentY: v.clientY
-      }));
-    },
-    [l.touchDragState.isTouchDragging, l]
-  ), W = w(
-    (m) => {
-      l.touchDragState.isTouchDragging && (l.setTouchDragState({
-        isTouchDragging: !1,
-        startX: 0,
-        startY: 0,
-        currentX: 0,
-        currentY: 0,
-        draggedElement: null
-      }), $.handleDragEnd());
-    },
-    [l.touchDragState.isTouchDragging, l, $]
-  ), p = w(
-    (m) => {
-      E(h.current, 1, "🔄 toggleDragMode called:", { panelId: m }), T((v) => {
-        const A = (v[m] || "normal") === "normal" ? "custom" : "normal", O = { ...v, [m]: A };
-        if (i)
-          try {
-            i(m, A);
-          } catch (H) {
-            console.error("🔄 Error in onDragModeChange:", H);
-          }
-        return O;
-      });
+      h.customDrag.isActive || h.dragState.isDragging || (l.current.mousemove = null, l.current.mouseup = null);
+  }, [h.clickState.isClicked, h.clickState.panelId, A, h.customDrag.isActive, h.dragState.isDragging, p.handleGlobalMouseMove, p.handleGlobalMouseUp]);
+  const v = k(
+    (g) => {
+      M(m.current, 1, "🔄 toggleDragMode called:", { panelId: g });
+      const D = E.current, R = (D[g] ?? "normal") === "normal" ? "custom" : "normal";
+      if (T({ ...D, [g]: R }), a !== void 0)
+        try {
+          a(g, R);
+        } catch (Y) {
+          console.error("🔄 Error in onDragModeChange:", Y);
+        }
     },
-    [i]
-  ), g = w((m, v) => {
-    m.stopPropagation(), E(h.current, 2, "パネルサイズ情報クリック:", v);
+    [a, T]
+  ), y = k((g, D) => {
+    g.stopPropagation(), M(m.current, 2, "パネルサイズ情報クリック:", D);
   }, []);
   return {
     // 状態
-    columnPanels: N,
-    panelVisibility: k.panelVisibility,
-    dragModes: M,
-    dragState: l.dragState,
-    dragOverPosition: l.dragOverPosition,
-    originalPanelPosition: l.originalPanelPosition,
-    touchDragState: l.touchDragState,
-    customDrag: l.customDrag,
-    clickState: l.clickState,
-    mousePosition: j.mousePosition,
-    panelSizes: k.panelSizes,
+    columnPanels: w,
+    panelVisibility: N.panelVisibility,
+    dragModes: A,
+    dragState: h.dragState,
+    dragOverPosition: h.dragOverPosition,
+    originalPanelPosition: h.originalPanelPosition,
+    customDrag: h.customDrag,
+    clickState: h.clickState,
+    mousePosition: P.mousePosition,
+    panelSizes: N.panelSizes,
     // 状態更新関数
-    setColumnPanels: b,
-    setPanelVisibility: k.setPanelVisibility,
+    setColumnPanels: C,
+    setPanelVisibility: N.setPanelVisibility,
     setDragModes: T,
-    setPanelRef: k.setPanelRef,
+    setPanelRef: N.setPanelRef,
     // イベントハンドラー
-    handleDragStart: $.handleDragStart,
-    handleDragEnd: $.handleDragEnd,
-    handleMouseDown: U.handleMouseDown,
-    handleTouchStart: x,
-    handleTouchMove: C,
-    handleTouchEnd: W,
-    handlePlaceholderDragEnter: Z,
-    handlePlaceholderDragLeave: Y,
-    handleDragOverWithInsert: $.handleDragOverWithInsert,
-    handleDropWithInsert: $.handleDropWithInsert,
-    handleColumnDragLeave: $.handleColumnDragLeave,
-    handlePanelSizeInfoClick: g,
+    handleDragStart: x.handleDragStart,
+    handleDragEnd: x.handleDragEnd,
+    handleMouseDown: p.handleMouseDown,
+    handlePlaceholderDragEnter: B,
+    handlePlaceholderDragLeave: J,
+    handleDragOverWithInsert: x.handleDragOverWithInsert,
+    handleDropWithInsert: x.handleDropWithInsert,
+    handleColumnDragLeave: x.handleColumnDragLeave,
+    handlePanelSizeInfoClick: y,
     // ユーティリティ関数
-    toggleDragMode: p,
-    findPanelPosition: R
+    toggleDragMode: v,
+    findPanelPosition: _
   };
-}, an = ({ minColumnWidth: r = 350, defaultColumns: e = 3, maxColumns: n = 6, minColumns: s = 1, currentColumnWidths: o = {} } = {}) => {
-  const [i, u] = te(0), c = F(0), h = F(null), [N, b] = te(!1), M = F(e);
-  K(() => {
+}, to = ({ minColumnWidth: t = 350, defaultColumns: n = 3, maxColumns: e = 6, minColumns: o = 1, currentColumnWidths: r = {} } = {}) => {
+  const [a, i] = se(0), d = I(0), m = I(null), [w, b] = se(!1), A = I(n);
+  oe(() => {
     if (typeof window > "u")
       return;
-    const l = () => {
-      const k = window.visualViewport?.width ?? 0, _ = document?.documentElement?.clientWidth ?? 0, R = document?.body?.clientWidth ?? 0, z = window.innerWidth ?? 0;
-      return _ > 0 ? Math.floor(_) : k > 0 ? Math.floor(k) : R > 0 ? Math.floor(R) : Math.floor(z);
-    }, j = () => {
-      h.current !== null && cancelAnimationFrame(h.current), h.current = requestAnimationFrame(() => {
-        const k = l();
-        h.current = null, k !== 0 && (Math.abs(c.current - k) < 2 || (c.current = k, u(k)));
+    const E = () => {
+      const T = window.visualViewport?.width ?? 0, h = document?.documentElement?.clientWidth ?? 0, P = document?.body?.clientWidth ?? 0, N = window.innerWidth ?? 0;
+      return h > 0 ? Math.floor(h) : T > 0 ? Math.floor(T) : P > 0 ? Math.floor(P) : Math.floor(N);
+    }, C = () => {
+      m.current !== null && cancelAnimationFrame(m.current), m.current = requestAnimationFrame(() => {
+        const T = E();
+        m.current = null, T !== 0 && (Math.abs(d.current - T) < 2 || (d.current = T, i(T)));
       });
     };
-    return j(), window.addEventListener("resize", j), window.addEventListener("orientationchange", j), window.visualViewport?.addEventListener("resize", j), () => {
-      h.current !== null && cancelAnimationFrame(h.current), window.removeEventListener("resize", j), window.removeEventListener("orientationchange", j), window.visualViewport?.removeEventListener("resize", j);
+    return C(), window.addEventListener("resize", C), window.addEventListener("orientationchange", C), window.visualViewport?.addEventListener("resize", C), () => {
+      m.current !== null && cancelAnimationFrame(m.current), window.removeEventListener("resize", C), window.removeEventListener("orientationchange", C), window.visualViewport?.removeEventListener("resize", C);
     };
   }, []);
-  const T = Ue(() => {
-    if (!N || i === 0)
-      return M.current = e, e;
-    const l = Math.max(i - 64, 0), j = 24, k = Object.values(o);
-    let _;
-    if (k.length > 0) {
-      const R = k.reduce((Y, U) => Y + U, 0) / k.length, z = Math.max(r, R);
-      _ = Math.floor((l + j) / (z + j)), k.reduce((Y, U) => Y + U, 0) + (k.length - 1) * j > l && k.length > s && (_ = Math.min(_, k.length - 1));
+  const q = Le(() => {
+    if (!w || a === 0)
+      return A.current = n, n;
+    const E = Math.max(a - 64, 0), C = 24, T = Object.values(r);
+    let h;
+    if (T.length > 0) {
+      const P = T.reduce((_, L) => _ + L, 0) / T.length, N = Math.max(t, P);
+      h = Math.floor((E + C) / (N + C)), T.reduce((_, L) => _ + L, 0) + (T.length - 1) * C > E && T.length > o && (h = Math.min(h, T.length - 1));
     } else
-      _ = Math.floor((l + j) / (r + j));
-    return _ = Math.max(s, Math.min(n, _)), M.current === _ ? M.current : (M.current = _, _);
-  }, [N, i, e, r, n, s, o]), y = w(() => {
-    b((l) => !l);
+      h = Math.floor((E + C) / (t + C));
+    return h = Math.max(o, Math.min(e, h)), A.current === h ? A.current : (A.current = h, h);
+  }, [w, a, n, t, e, o, r]), j = k(() => {
+    b((E) => !E);
   }, []);
   return {
-    responsiveColumnCount: T,
-    isResponsiveMode: N,
-    screenWidth: i,
-    toggleResponsiveMode: y
+    responsiveColumnCount: q,
+    isResponsiveMode: w,
+    screenWidth: a,
+    toggleResponsiveMode: j
   };
 };
-const It = [
+const Ir = [
   ["rect", { width: "20", height: "14", x: "2", y: "3", rx: "2", key: "48i651" }],
   ["line", { x1: "8", x2: "16", y1: "21", y2: "21", key: "1svkeh" }],
   ["line", { x1: "12", x2: "12", y1: "17", y2: "21", key: "vw1qmm" }]
-], Ut = oe("monitor", It);
-const Bt = [
+], qr = ie("monitor", Ir);
+const Wr = [
   ["rect", { width: "14", height: "20", x: "5", y: "2", rx: "2", ry: "2", key: "1yt0o3" }],
   ["path", { d: "M12 18h.01", key: "mhygvu" }]
-], Vt = oe("smartphone", Bt), ln = ({ isResponsiveMode: r, responsiveColumnCount: e, currentColumnCount: n, screenWidth: s, onToggleResponsive: o }) => /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-2 rounded-lg border border-slate-300 bg-white/90 px-3 py-1", children: [
-  /* @__PURE__ */ t.jsxs(
+], Hr = ie("smartphone", Wr), no = ({ isResponsiveMode: t, responsiveColumnCount: n, currentColumnCount: e, screenWidth: o, onToggleResponsive: r }) => /* @__PURE__ */ s.jsxs("div", { className: "flex items-center gap-2 rounded-lg border border-slate-300 bg-white/90 px-3 py-1", children: [
+  /* @__PURE__ */ s.jsxs(
     "button",
     {
       type: "button",
-      onClick: o,
-      className: `flex items-center gap-1 rounded px-2 py-1 text-xs transition-colors ${r ? "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: r ? "レスポンシブモードを無効化" : "レスポンシブモードを有効化",
+      onClick: r,
+      className: `flex items-center gap-1 rounded px-2 py-1 text-xs transition-colors ${t ? "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: t ? "レスポンシブモードを無効化" : "レスポンシブモードを有効化",
       children: [
-        r ? /* @__PURE__ */ t.jsx(Vt, { className: "h-3 w-3" }) : /* @__PURE__ */ t.jsx(Ut, { className: "h-3 w-3" }),
-        /* @__PURE__ */ t.jsx("span", { children: r ? "レスポンシブ" : "固定" })
+        t ? /* @__PURE__ */ s.jsx(Hr, { className: "h-3 w-3" }) : /* @__PURE__ */ s.jsx(qr, { className: "h-3 w-3" }),
+        /* @__PURE__ */ s.jsx("span", { children: t ? "レスポンシブ" : "固定" })
       ]
     }
   ),
-  r && /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-1 text-slate-600 text-xs", children: [
-    /* @__PURE__ */ t.jsxs("span", { className: "font-mono", children: [
-      s,
+  t && /* @__PURE__ */ s.jsxs("div", { className: "flex items-center gap-1 text-slate-600 text-xs", children: [
+    /* @__PURE__ */ s.jsxs("span", { className: "font-mono", children: [
+      o,
       "px"
     ] }),
-    /* @__PURE__ */ t.jsx("span", { children: "→" }),
-    /* @__PURE__ */ t.jsxs("span", { className: "font-semibold text-blue-600", children: [
-      e,
+    /* @__PURE__ */ s.jsx("span", { children: "→" }),
+    /* @__PURE__ */ s.jsxs("span", { className: "font-semibold text-blue-600", children: [
+      n,
       "列"
     ] }),
-    e !== n && /* @__PURE__ */ t.jsx("span", { className: "text-orange-600", children: "(変更予定)" })
+    n !== e && /* @__PURE__ */ s.jsx("span", { className: "text-orange-600", children: "(変更予定)" })
   ] })
-] }), cn = {
+] }), ro = {
   showDebugPanel: !1,
   showMousePosition: !1,
   showPanelSizes: !1,
@@ -2519,37 +2989,49 @@ const Bt = [
   logLevel: 0
 };
 export {
-  Qt as ColumnControlPanel,
-  Kt as ColumnInsertPanel,
-  ie as DEFAULT_COLUMN_ID_CONFIG,
-  cn as DEFAULT_DEBUG_CONFIG,
-  ke as DEFAULT_EDGE_SCROLL_CONFIG,
-  en as DebugControlPanel,
-  Jt as DragDropLayout,
-  Ge as DropZoneDebugOverlay,
-  Ke as EdgeScrollManager,
-  Ze as InsertPlaceholder,
-  Dt as PanelSizeDisplay,
-  Gt as ResizableColumn,
-  Je as ResizeHandle,
-  ln as ResponsiveControl,
-  He as calculateScrollVector,
-  rn as createColumnIdMapping,
-  E as debugLog,
-  je as generateColumnId,
-  Qe as generateColumnIds,
-  nn as getNextColumnId,
-  tn as isValidColumnId,
-  Wt as normalizeColumnPanels,
-  Pe as parseColumnId,
-  zt as performScroll,
-  Lt as sortColumnIds,
-  sn as useColumnLayout,
-  Yt as useCustomDragHandlers,
-  on as useDragDropColumns,
-  Ft as useDragDropState,
-  Xt as useMouseTracking,
-  Ht as useNormalDragHandlers,
-  qt as usePanelManagement,
-  an as useResponsiveColumns
+  Xr as ColumnControlPanel,
+  Vr as ColumnInsertPanel,
+  fe as DEFAULT_COLUMN_ID_CONFIG,
+  ro as DEFAULT_DEBUG_CONFIG,
+  Fr as DEFAULT_DRAG_DROP_LAYOUT_LABELS,
+  Me as DEFAULT_EDGE_SCROLL_CONFIG,
+  xr as DEFAULT_TOUCH_DRAG_CONFIG,
+  Zr as DebugControlPanel,
+  Ur as DragDropLayout,
+  Vt as DropZoneDebugOverlay,
+  rt as EdgeScrollManager,
+  Xt as InsertPlaceholder,
+  Ee as PANEL_ACTION_ATTRIBUTE,
+  De as PANEL_MOVES,
+  Ut as PANEL_MOVE_SHORTCUTS,
+  Fn as PanelSizeDisplay,
+  Br as ResizableColumn,
+  tn as ResizeHandle,
+  no as ResponsiveControl,
+  Zt as SCROLL_ROOT_SELECTOR,
+  ur as TEMPLATE_PLACEHOLDERS,
+  Xn as availablePanelMoves,
+  Mt as calculateScrollVector,
+  Jr as createColumnIdMapping,
+  M as debugLog,
+  qe as generateColumnId,
+  nn as generateColumnIds,
+  Kr as getNextColumnId,
+  Ft as insertPanelAt,
+  Gr as isValidColumnId,
+  Vn as movePanelInColumns,
+  $r as normalizeColumnPanels,
+  Gn as panelMoveOfKey,
+  We as parseColumnId,
+  ar as performScroll,
+  Pe as shownPanelPlace,
+  Ar as sortColumnIds,
+  Qr as useColumnLayout,
+  Tr as useCustomDragHandlers,
+  eo as useDragDropColumns,
+  Rr as useDragDropState,
+  _r as useMouseTracking,
+  Lr as useNormalDragHandlers,
+  zr as usePanelManagement,
+  to as useResponsiveColumns
 };