react-bwin 0.1.2 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -73,9 +73,16 @@ declare global {
73
73
  sillElement: HTMLElement
74
74
  mount(container: HTMLElement): void
75
75
  enableFeatures(): void
76
+ fit(): void
76
77
  }
77
78
 
78
- type WindowProps = Omit<ConfigRoot, 'children'> & { panes: ConfigNode[] }
79
+ type WindowRef = {
80
+ binaryWindow: BinaryWindow
81
+ }
82
+
83
+ type WindowProps = Omit<ConfigRoot, 'children'> & {
84
+ panes?: ConfigNode[]
85
+ }
79
86
  }
80
87
 
81
88
  export {
@@ -1,6 +1,6 @@
1
- import g, { useRef as M, useEffect as L } from "react";
2
- var q = Object.defineProperty, U = (e, t, i) => t in e ? q(e, t, { enumerable: !0, configurable: !0, writable: !0, value: i }) : e[t] = i, b = (e, t, i) => U(e, typeof t != "symbol" ? t + "" : t, i);
3
- function X(e = 0.7, t = 128) {
1
+ import g, { useRef as M, useEffect as L, forwardRef as q, useImperativeHandle as U } from "react";
2
+ var X = Object.defineProperty, Y = (e, t, i) => t in e ? X(e, t, { enumerable: !0, configurable: !0, writable: !0, value: i }) : e[t] = i, b = (e, t, i) => Y(e, typeof t != "symbol" ? t + "" : t, i);
3
+ function j(e = 0.7, t = 128) {
4
4
  const i = 256 - t, n = Math.floor(Math.random() * i + t), s = Math.floor(Math.random() * i + t), o = Math.floor(Math.random() * i + t), h = Math.max(0.5, Math.random() * e);
5
5
  return `rgba(${n}, ${s}, ${o}, ${h})`;
6
6
  }
@@ -24,7 +24,7 @@ function N(e, t) {
24
24
  for (; t.firstChild; )
25
25
  e.append(t.firstChild);
26
26
  }
27
- function Y(e, t) {
27
+ function K(e, t) {
28
28
  const i = document.createElement("div");
29
29
  N(i, e), N(e, t), N(t, i);
30
30
  }
@@ -49,10 +49,10 @@ function z(e) {
49
49
  }
50
50
  return NaN;
51
51
  }
52
- function j(e) {
52
+ function V(e) {
53
53
  return e !== null && typeof e == "object" && !Array.isArray(e) && Object.getPrototypeOf(e) === Object.prototype;
54
54
  }
55
- function K(e, t) {
55
+ function Z(e, t) {
56
56
  for (const i in t) {
57
57
  if (Object.hasOwn(e, i))
58
58
  throw new Error(`Key "${i}" already exists in target object`);
@@ -60,7 +60,7 @@ function K(e, t) {
60
60
  }
61
61
  return e;
62
62
  }
63
- function V(e) {
63
+ function J(e) {
64
64
  const t = document.createElement("template");
65
65
  return t.innerHTML = e.trim(), t.content;
66
66
  }
@@ -69,7 +69,7 @@ function v(e) {
69
69
  return null;
70
70
  if (typeof e == "string")
71
71
  try {
72
- const t = V(e);
72
+ const t = J(e);
73
73
  return t.childNodes.length === 1 ? t.firstChild : t;
74
74
  } catch {
75
75
  return document.createTextNode(e);
@@ -90,7 +90,7 @@ const r = {
90
90
  Unknown: "unknown",
91
91
  Outside: "outside"
92
92
  };
93
- function Z(e) {
93
+ function Q(e) {
94
94
  switch (e) {
95
95
  case r.Top:
96
96
  return r.Bottom;
@@ -104,33 +104,33 @@ function Z(e) {
104
104
  throw new Error(`[bwin] Invalid position: ${e}`);
105
105
  }
106
106
  }
107
- function J({ width: e, height: t, x: i }) {
107
+ function tt({ width: e, height: t, x: i }) {
108
108
  return t / e * i;
109
109
  }
110
- function Q({ width: e, height: t, y: i }) {
110
+ function et({ width: e, height: t, y: i }) {
111
111
  return e / t * i;
112
112
  }
113
- function tt({ width: e, height: t, x: i }) {
113
+ function it({ width: e, height: t, x: i }) {
114
114
  return t - t / e * i;
115
115
  }
116
- function et({ width: e, height: t, y: i }) {
116
+ function nt({ width: e, height: t, y: i }) {
117
117
  return e - e / t * i;
118
118
  }
119
- function it(e, { clientX: t, clientY: i }) {
119
+ function st(e, { clientX: t, clientY: i }) {
120
120
  const n = e.getBoundingClientRect(), { width: s, height: o } = n, h = t - n.left, a = i - n.top;
121
121
  if (h < 0 || h > s || a < 0 || a > o)
122
122
  return r.Outside;
123
- const d = 0.3, l = J({ width: s, height: o, x: h }), c = tt({ width: s, height: o, x: h }), p = Q({ width: s, height: o, y: a }), u = et({ width: s, height: o, y: a });
124
- return h < s * (0.5 - d / 2) && a > l && a < c ? r.Left : h > s * (0.5 + d / 2) && a < l && a > c ? r.Right : a < o * (0.5 - d / 2) && h > p && h < u ? r.Top : a > o * (0.5 + d / 2) && h < p && h > u ? r.Bottom : h > s * (0.5 - d / 2) && h < s * (0.5 + d / 2) && a > o * (0.5 - d / 2) && a < o * (0.5 + d / 2) ? r.Center : r.Unknown;
123
+ const d = 0.3, c = tt({ width: s, height: o, x: h }), l = it({ width: s, height: o, x: h }), p = et({ width: s, height: o, y: a }), u = nt({ width: s, height: o, y: a });
124
+ return h < s * (0.5 - d / 2) && a > c && a < l ? r.Left : h > s * (0.5 + d / 2) && a < c && a > l ? r.Right : a < o * (0.5 - d / 2) && h > p && h < u ? r.Top : a > o * (0.5 + d / 2) && h < p && h > u ? r.Bottom : h > s * (0.5 - d / 2) && h < s * (0.5 + d / 2) && a > o * (0.5 - d / 2) && a < o * (0.5 + d / 2) ? r.Center : r.Unknown;
125
125
  }
126
- const nt = 100, st = 100, E = {
126
+ const ot = 100, ht = 100, E = {
127
127
  left: 0,
128
128
  top: 0,
129
129
  width: 150,
130
130
  height: 150,
131
131
  // Initial min values, real min width/height is calculated based on children
132
- minWidth: nt,
133
- minHeight: st
132
+ minWidth: ot,
133
+ minHeight: ht
134
134
  };
135
135
  class m {
136
136
  constructor({
@@ -142,12 +142,12 @@ class m {
142
142
  minHeight: h = E.minHeight,
143
143
  domNode: a = null,
144
144
  store: d = {},
145
- position: l,
146
- id: c
145
+ position: c,
146
+ id: l
147
147
  } = E) {
148
- if (this.id = c ?? D(), !l)
148
+ if (this.id = l ?? D(), !c)
149
149
  throw new Error("[bwin] Sash position is required");
150
- this.position = l, this.domNode = a, this._top = i, this._left = t, this._width = n, this._height = s, this.children = [], this.minWidth = o, this.minHeight = h, this.store = d;
150
+ this.position = c, this.domNode = a, this._top = i, this._left = t, this._width = n, this._height = s, this.children = [], this.minWidth = o, this.minHeight = h, this.store = d;
151
151
  }
152
152
  walk(t) {
153
153
  this.children.forEach((i) => i.walk(t)), t(this);
@@ -281,10 +281,10 @@ class m {
281
281
  this._width = t;
282
282
  const [n, s, o, h] = this.getChildren();
283
283
  if (h && s) {
284
- const a = h.width + s.width, d = i * (h.width / a), l = a + i;
285
- let c = h.width + d, p = l - c, u = s.left + d;
284
+ const a = h.width + s.width, d = i * (h.width / a), c = a + i;
285
+ let l = h.width + d, p = c - l, u = s.left + d;
286
286
  const f = h.calcMinWidth(), w = s.calcMinWidth();
287
- c < f && p > w ? (c = f, p = l - c, u = h.left + c) : p < w && c > f && (p = w, c = l - p, u = h.left + c), h.width = c, s.width = p, s.left = u;
287
+ l < f && p > w ? (l = f, p = c - l, u = h.left + l) : p < w && l > f && (p = w, l = c - p, u = h.left + l), h.width = l, s.width = p, s.left = u;
288
288
  }
289
289
  n && o && (n.width += i, o.width += i);
290
290
  }
@@ -296,10 +296,10 @@ class m {
296
296
  this._height = t;
297
297
  const [n, s, o, h] = this.getChildren();
298
298
  if (n && o) {
299
- const a = n.height + o.height, d = i * (n.height / a), l = a + i;
300
- let c = n.height + d, p = l - c, u = o.top + d;
299
+ const a = n.height + o.height, d = i * (n.height / a), c = a + i;
300
+ let l = n.height + d, p = c - l, u = o.top + d;
301
301
  const f = n.calcMinHeight(), w = o.calcMinHeight();
302
- c < f && p > w ? (c = f, p = l - c, u = n.top + c) : p < w && c > f && (p = w, c = l - p, u = n.top + c), n.height = c, o.height = p, o.top = u;
302
+ l < f && p > w ? (l = f, p = c - l, u = n.top + l) : p < w && l > f && (p = w, l = c - p, u = n.top + l), n.height = l, o.height = p, o.top = u;
303
303
  }
304
304
  h && s && (h.height += i, s.height += i);
305
305
  }
@@ -318,14 +318,14 @@ class P {
318
318
  minHeight: h,
319
319
  position: a,
320
320
  size: d,
321
- ...l
321
+ ...c
322
322
  }) {
323
- b(this, "left"), b(this, "top"), b(this, "width"), b(this, "height"), this.parentRect = t, this.children = i, this.siblingConfigNode = n, this.id = s, this.minWidth = o, this.minHeight = h, this.position = this.getPosition(a), this.size = this.getSize(d), this.nonCoreData = l, this.setBounds();
323
+ b(this, "left"), b(this, "top"), b(this, "width"), b(this, "height"), this.parentRect = t, this.children = i, this.siblingConfigNode = n, this.id = s, this.minWidth = o, this.minHeight = h, this.position = this.getPosition(a), this.size = this.getSize(d), this.nonCoreData = c, this.setBounds();
324
324
  }
325
325
  getPosition(t) {
326
326
  if (!this.siblingConfigNode)
327
327
  return t;
328
- const i = Z(this.siblingConfigNode.position);
328
+ const i = Q(this.siblingConfigNode.position);
329
329
  if (!t)
330
330
  return i;
331
331
  if (t !== i)
@@ -386,7 +386,7 @@ class P {
386
386
  });
387
387
  }
388
388
  normConfig(t) {
389
- if (j(t))
389
+ if (V(t))
390
390
  return t;
391
391
  if (Array.isArray(t))
392
392
  return {
@@ -451,7 +451,7 @@ const x = {
451
451
  }, $ = {
452
452
  fitContainer: !1
453
453
  };
454
- class ot extends P {
454
+ class rt extends P {
455
455
  constructor({
456
456
  id: t,
457
457
  children: i,
@@ -473,7 +473,7 @@ class ot extends P {
473
473
  }), this.fitContainer = o;
474
474
  }
475
475
  }
476
- class ht extends m {
476
+ class at extends m {
477
477
  constructor(t = E) {
478
478
  super({ ...t, position: r.Root }), Object.assign(this, $);
479
479
  }
@@ -482,11 +482,11 @@ function S(e) {
482
482
  const t = document.createElement("bw-pane");
483
483
  return t.style.top = `${e.top}px`, t.style.left = `${e.left}px`, t.style.width = `${e.width}px`, t.style.height = `${e.height}px`, t.setAttribute("sash-id", e.id), t.setAttribute("position", e.position), t;
484
484
  }
485
- function rt(e) {
485
+ function lt(e) {
486
486
  const t = e.domNode;
487
487
  return t.style.top = `${e.top}px`, t.style.left = `${e.left}px`, t.style.width = `${e.width}px`, t.style.height = `${e.height}px`, t.setAttribute("position", e.position), t;
488
488
  }
489
- function at(e, { size: t }) {
489
+ function dt(e, { size: t }) {
490
490
  const i = z(t);
491
491
  let n = e.width / 2;
492
492
  i && (i < 1 ? n = e.width * i : n = i);
@@ -505,7 +505,7 @@ function at(e, { size: t }) {
505
505
  }), h = S(o);
506
506
  return o.domNode = h, N(h, e.domNode), e.addChild(s), e.addChild(o), s;
507
507
  }
508
- function lt(e, { size: t }) {
508
+ function ct(e, { size: t }) {
509
509
  const i = z(t);
510
510
  let n = e.width / 2;
511
511
  i && (i < 1 ? n = e.width * i : n = i);
@@ -524,7 +524,7 @@ function lt(e, { size: t }) {
524
524
  }), h = S(s);
525
525
  return s.domNode = h, N(h, e.domNode), e.addChild(s), e.addChild(o), o;
526
526
  }
527
- function dt(e, { size: t }) {
527
+ function pt(e, { size: t }) {
528
528
  const i = z(t);
529
529
  let n = e.height / 2;
530
530
  i && (i < 1 ? n = e.height * i : n = i);
@@ -543,7 +543,7 @@ function dt(e, { size: t }) {
543
543
  }), h = S(o);
544
544
  return o.domNode = h, N(h, e.domNode), e.addChild(s), e.addChild(o), s;
545
545
  }
546
- function ct(e, { size: t }) {
546
+ function ut(e, { size: t }) {
547
547
  const i = z(t);
548
548
  let n = e.height / 2;
549
549
  i && (i < 1 ? n = e.height * i : n = i);
@@ -562,27 +562,27 @@ function ct(e, { size: t }) {
562
562
  }), h = S(s);
563
563
  return s.domNode = h, N(h, e.domNode), e.addChild(s), e.addChild(o), o;
564
564
  }
565
- function pt(e, { position: t, size: i, minWidth: n, minHeight: s }) {
565
+ function gt(e, { position: t, size: i, minWidth: n, minHeight: s }) {
566
566
  if (t === r.Left)
567
- return at(e, { size: i });
567
+ return dt(e, { size: i });
568
568
  if (t === r.Right)
569
- return lt(e, { size: i });
569
+ return ct(e, { size: i });
570
570
  if (t === r.Top)
571
- return dt(e, { size: i });
571
+ return pt(e, { size: i });
572
572
  if (t === r.Bottom)
573
- return ct(e, { size: i });
573
+ return ut(e, { size: i });
574
574
  }
575
- const ut = {
575
+ const ft = {
576
576
  createPane(e) {
577
577
  const t = S(e);
578
578
  return e.store.droppable === !1 && t.setAttribute("can-drop", "false"), t;
579
579
  },
580
580
  // Intended to be overridden
581
581
  onPaneCreate(e, t) {
582
- t.store.content && e.append(v(t.store.content)), this != null && this.debug && (e.style.backgroundColor = X(), e.innerHTML = "", e.append(T(e)));
582
+ t.store.content && e.append(v(t.store.content)), this != null && this.debug && (e.style.backgroundColor = j(), e.innerHTML = "", e.append(T(e)));
583
583
  },
584
584
  updatePane(e) {
585
- return rt(e);
585
+ return lt(e);
586
586
  },
587
587
  // Intended to be overridden
588
588
  onPaneUpdate(e, t) {
@@ -599,7 +599,7 @@ const ut = {
599
599
  if (!t) throw new Error("[bwin] Position is required when adding pane");
600
600
  const n = this.rootSash.getById(e);
601
601
  if (!n) throw new Error("[bwin] Parent sash not found when adding pane");
602
- const s = pt(n, { position: t, size: i });
602
+ const s = gt(n, { position: t, size: i });
603
603
  return n.id = D(), this.update(), s;
604
604
  },
605
605
  /**
@@ -627,7 +627,7 @@ height: ${e.style.height}
627
627
  `;
628
628
  return t.innerHTML = i.trim(), t;
629
629
  }
630
- const gt = {
630
+ const wt = {
631
631
  createWindow() {
632
632
  const e = document.createElement("bw-window");
633
633
  return e.style.width = `${this.rootSash.width}px`, e.style.height = `${this.rootSash.height}px`, e.setAttribute("sash-id", this.rootSash.id), e;
@@ -648,7 +648,7 @@ const gt = {
648
648
  i.children.length > 0 ? t.includes(i.id) ? (this.updateMuntin(i), this.onMuntinUpdate(i.domNode, i)) : (i.domNode = this.createMuntin(i), this.windowElement.append(i.domNode)) : t.includes(i.id) ? (this.updatePane(i), this.onPaneUpdate(i.domNode, i)) : (i.domNode || (i.domNode = this.createPane(i)), this.windowElement.prepend(i.domNode));
649
649
  });
650
650
  }
651
- }, ft = {
651
+ }, mt = {
652
652
  muntinSize: 4,
653
653
  createMuntin(e) {
654
654
  const t = document.createElement("bw-muntin"), i = e.leftChild, n = e.topChild;
@@ -662,15 +662,18 @@ const gt = {
662
662
  },
663
663
  onMuntinUpdate(e, t) {
664
664
  }
665
- }, wt = {
665
+ }, bt = {
666
666
  fitContainer: !1,
667
+ fit() {
668
+ this.rootSash.width = this.containerElement.clientWidth, this.rootSash.height = this.containerElement.clientHeight, this.update();
669
+ },
667
670
  enableFitContainer() {
668
671
  new ResizeObserver((e) => {
669
672
  for (const t of e)
670
- t.target === this.containerElement && this.fitContainer && (this.rootSash.width = t.contentRect.width, this.rootSash.height = t.contentRect.height, this.update());
673
+ t.target === this.containerElement && this.fitContainer && this.fit();
671
674
  }).observe(this.containerElement);
672
675
  }
673
- }, mt = {
676
+ }, yt = {
674
677
  activeMuntinSash: null,
675
678
  isResizeStarted: !1,
676
679
  isDropStarted: !1,
@@ -691,21 +694,21 @@ const gt = {
691
694
  if (!this.isResizeStarted || !this.activeMuntinSash) return;
692
695
  const [t, i, n, s] = this.activeMuntinSash.getChildren(), o = this.activeMuntinSash.isLeftRightSplit(), h = this.activeMuntinSash.isTopBottomSplit();
693
696
  if (o && s && i) {
694
- const a = e.pageX - this.lastX, d = s.width + a, l = i.width - a;
695
- if (d <= s.calcMinWidth() || l <= i.calcMinWidth())
697
+ const a = e.pageX - this.lastX, d = s.width + a, c = i.width - a;
698
+ if (d <= s.calcMinWidth() || c <= i.calcMinWidth())
696
699
  return;
697
- s.width = d, i.width = l, i.left = i.left + a, this.update(), this.lastX = e.pageX;
700
+ s.width = d, i.width = c, i.left = i.left + a, this.update(), this.lastX = e.pageX;
698
701
  } else if (h && t && n) {
699
- const a = e.pageY - this.lastY, d = t.height + a, l = n.height - a;
700
- if (d <= t.calcMinHeight() || l <= n.calcMinHeight())
702
+ const a = e.pageY - this.lastY, d = t.height + a, c = n.height - a;
703
+ if (d <= t.calcMinHeight() || c <= n.calcMinHeight())
701
704
  return;
702
- t.height = d, n.height = l, n.top = n.top + a, this.update(), this.lastY = e.pageY;
705
+ t.height = d, n.height = c, n.top = n.top + a, this.update(), this.lastY = e.pageY;
703
706
  }
704
707
  }), document.addEventListener("mouseup", () => {
705
708
  this.isResizeStarted = !1, this.activeMuntinSash = null, this.revertResizeStyles();
706
709
  });
707
710
  }
708
- }, bt = {
711
+ }, Et = {
709
712
  activeDropPaneEl: null,
710
713
  // Intended to be overridden in `BinaryWindow` class
711
714
  onPaneDrop(e, t) {
@@ -715,7 +718,7 @@ const gt = {
715
718
  e.preventDefault();
716
719
  const t = e.target.matches("bw-pane") ? e.target : e.target.closest("bw-pane");
717
720
  if (!t || (t !== this.activeDropPaneEl && (this.activeDropPaneEl && this.activeDropPaneEl.removeAttribute("drop-area"), this.activeDropPaneEl = t), t.getAttribute("can-drop") === "false")) return;
718
- const i = it(t, e);
721
+ const i = st(t, e);
719
722
  t.setAttribute("drop-area", i);
720
723
  }), this.windowElement.addEventListener("dragleave", (e) => {
721
724
  e.currentTarget.contains(e.relatedTarget) && e.currentTarget !== e.relatedTarget || this.activeDropPaneEl && (this.activeDropPaneEl.removeAttribute("drop-area"), this.activeDropPaneEl = null);
@@ -725,12 +728,12 @@ const gt = {
725
728
  this.onPaneDrop(e, i), typeof i.store.onDrop == "function" && i.store.onDrop(e, i), this.activeDropPaneEl.removeAttribute("drop-area"), this.activeDropPaneEl = null;
726
729
  });
727
730
  }
728
- }, yt = !1;
731
+ }, vt = !0;
729
732
  class H {
730
733
  constructor(t) {
731
- b(this, "windowElement", null), b(this, "containerElement", null), b(this, "debug", yt);
734
+ b(this, "windowElement", null), b(this, "containerElement", null), b(this, "debug", vt);
732
735
  let i = null;
733
- t instanceof ht ? (i = t, this.rootSash = t) : (i = new ot(t), this.rootSash = i.buildSashTree()), this.fitContainer = i.fitContainer;
736
+ t instanceof at ? (i = t, this.rootSash = t) : (i = new rt(t), this.rootSash = i.buildSashTree()), this.fitContainer = i.fitContainer;
734
737
  }
735
738
  frame(t) {
736
739
  this.containerElement = t, this.windowElement = this.createWindow(), this.glaze(), this.containerElement.append(this.windowElement);
@@ -744,17 +747,17 @@ class H {
744
747
  }
745
748
  static assemble(...t) {
746
749
  t.forEach((i) => {
747
- K(this.prototype, i);
750
+ Z(this.prototype, i);
748
751
  });
749
752
  }
750
753
  }
751
754
  H.assemble(
752
- gt,
753
- ft,
754
- ut,
755
755
  wt,
756
+ mt,
757
+ ft,
756
758
  bt,
757
- mt
759
+ Et,
760
+ yt
758
761
  );
759
762
  function G(e) {
760
763
  if (e.tagName === "BW-PANE")
@@ -764,14 +767,14 @@ function G(e) {
764
767
  throw new Error("[bwin] Pane element not found");
765
768
  return t.getAttribute("sash-id");
766
769
  }
767
- const Et = {
770
+ const Nt = {
768
771
  label: "",
769
772
  className: "bw-glass-action--close",
770
773
  onClick: (e, t) => {
771
774
  const i = G(e.target);
772
775
  t.removePane(i);
773
776
  }
774
- }, vt = {
777
+ }, zt = {
775
778
  label: "",
776
779
  className: "bw-glass-action--minimize",
777
780
  onClick: (e, t) => {
@@ -782,7 +785,7 @@ const Et = {
782
785
  const s = e.target.closest("bw-pane"), o = e.target.closest("bw-glass"), h = s.getAttribute("sash-id"), a = s.getAttribute("position");
783
786
  n.bwGlassElement = o, n.bwOriginalPosition = a, n.bwOriginalBoundingRect = R(s), t.removePane(h);
784
787
  }
785
- }, Nt = {
788
+ }, Ct = {
786
789
  label: "",
787
790
  className: "bw-glass-action--maximize",
788
791
  onClick: (e) => {
@@ -790,19 +793,19 @@ const Et = {
790
793
  t.hasAttribute("maximized") ? (t.removeAttribute("maximized"), t.style.left = `${t.bwOriginalBoundingRect.left}px`, t.style.top = `${t.bwOriginalBoundingRect.top}px`, t.style.width = `${t.bwOriginalBoundingRect.width}px`, t.style.height = `${t.bwOriginalBoundingRect.height}px`) : (t.setAttribute("maximized", ""), t.bwOriginalBoundingRect = R(t), t.style.left = "0", t.style.top = "0", t.style.width = "100%", t.style.height = "100%");
791
794
  }
792
795
  };
793
- function zt(e, t) {
796
+ function St(e, t) {
794
797
  const i = e.left + e.width, n = e.top + e.height, s = t.left + t.width, o = t.top + t.height;
795
798
  if (e.left >= s || t.left >= i || e.top >= o || t.top >= n)
796
799
  return null;
797
- const h = Math.max(e.left, t.left), a = Math.max(e.top, t.top), d = Math.min(i, s), l = Math.min(n, o);
800
+ const h = Math.max(e.left, t.left), a = Math.max(e.top, t.top), d = Math.min(i, s), c = Math.min(n, o);
798
801
  return {
799
802
  left: h,
800
803
  top: a,
801
804
  width: d - h,
802
- height: l - a
805
+ height: c - a
803
806
  };
804
807
  }
805
- const I = [vt, Nt, Et], Ct = {
808
+ const I = [zt, Ct, Nt], At = {
806
809
  enableActions() {
807
810
  this.handleMinimizedGlassClick(), this.observeActionButtons();
808
811
  },
@@ -810,7 +813,7 @@ const I = [vt, Nt, Et], Ct = {
810
813
  const t = e.bwOriginalBoundingRect;
811
814
  let i = 0, n = null;
812
815
  if (this.windowElement.querySelectorAll("bw-pane").forEach((s) => {
813
- const o = R(s), h = zt(t, o);
816
+ const o = R(s), h = St(t, o);
814
817
  if (h) {
815
818
  const a = h.width * h.height;
816
819
  a > i && (i = a, n = s);
@@ -914,7 +917,7 @@ class W {
914
917
  return this.domNode.querySelector("bw-glass-header");
915
918
  }
916
919
  }
917
- const St = {
920
+ const Mt = {
918
921
  activeDragGlassEl: null,
919
922
  activeDragGlassPaneCanDrop: !1,
920
923
  onPaneDrop(e, t) {
@@ -922,7 +925,7 @@ const St = {
922
925
  const i = this.activeDropPaneEl.getAttribute("drop-area");
923
926
  if (i === "center") {
924
927
  const n = this.activeDragGlassEl.closest("bw-pane"), s = this.activeDropPaneEl.getAttribute("can-drop") !== "false";
925
- Y(n, this.activeDropPaneEl), n.setAttribute("can-drop", s);
928
+ K(n, this.activeDropPaneEl), n.setAttribute("can-drop", s);
926
929
  return;
927
930
  } else {
928
931
  const n = G(this.activeDragGlassEl);
@@ -950,7 +953,7 @@ const St = {
950
953
  this.activeDragGlassEl && (this.activeDragGlassEl.removeAttribute("draggable"), this.activeDragGlassEl.closest("bw-pane").setAttribute("can-drop", this.activeDragGlassPaneCanDrop), this.activeDragGlassEl = null);
951
954
  });
952
955
  }
953
- }, At = {
956
+ }, Rt = {
954
957
  trimMuntin(e) {
955
958
  e.hasAttribute("vertical") ? (e.style.top = `${parseFloat(e.style.top) + this.muntinSize / 2}px`, e.style.height = `${parseFloat(e.style.height) - this.muntinSize}px`) : e.hasAttribute("horizontal") && (e.style.left = `${parseFloat(e.style.left) + this.muntinSize / 2}px`, e.style.width = `${parseFloat(e.style.width) - this.muntinSize}px`);
956
959
  },
@@ -1008,13 +1011,13 @@ class O extends H {
1008
1011
  }
1009
1012
  }
1010
1013
  }
1011
- O.assemble(St, At, Ct);
1014
+ O.assemble(Mt, Rt, At);
1012
1015
  const y = 4;
1013
- function Mt({ sash: e }) {
1014
- var c;
1016
+ function Pt({ sash: e }) {
1017
+ var l;
1015
1018
  const t = M(), i = e.leftChild, n = e.topChild;
1016
- let s, o, h, a, d, l;
1017
- return i ? (s = y, o = e.height - y, h = e.top + y / 2, a = e.left + i.width - y / 2, d = !0) : n && (s = e.width - y, o = y, h = e.top + n.height - y / 2, a = e.left + y / 2, l = !0), L(() => {
1019
+ let s, o, h, a, d, c;
1020
+ return i ? (s = y, o = e.height - y, h = e.top + y / 2, a = e.left + i.width - y / 2, d = !0) : n && (s = e.width - y, o = y, h = e.top + n.height - y / 2, a = e.left + y / 2, c = !0), L(() => {
1018
1021
  e.domNode = t.current;
1019
1022
  }, []), /* @__PURE__ */ g.createElement(
1020
1023
  "bw-muntin",
@@ -1027,22 +1030,22 @@ function Mt({ sash: e }) {
1027
1030
  left: a
1028
1031
  },
1029
1032
  vertical: d,
1030
- horizontal: l,
1031
- resizable: ((c = e.store) == null ? void 0 : c.resizable) === !1 ? "false" : "true",
1033
+ horizontal: c,
1034
+ resizable: ((l = e.store) == null ? void 0 : l.resizable) === !1 ? "false" : "true",
1032
1035
  ref: t
1033
1036
  }
1034
1037
  );
1035
1038
  }
1036
- function Rt({
1039
+ function xt({
1037
1040
  sash: e,
1038
1041
  bwin: t
1039
1042
  }) {
1040
- var c, p, u, f, w;
1043
+ var l, p, u, f, w;
1041
1044
  const i = M(), { left: n, top: s, width: o, height: h, id: a, position: d } = e;
1042
1045
  L(() => {
1043
1046
  e.domNode = i.current;
1044
1047
  }, []);
1045
- const l = ((c = e.store) == null ? void 0 : c.actions) === void 0 ? I : Array.isArray(e.store.actions) ? e.store.actions : [];
1048
+ const c = ((l = e.store) == null ? void 0 : l.actions) === void 0 ? I : Array.isArray(e.store.actions) ? e.store.actions : [];
1046
1049
  return /* @__PURE__ */ g.createElement(
1047
1050
  "bw-pane",
1048
1051
  {
@@ -1058,7 +1061,7 @@ function Rt({
1058
1061
  "can-drag": ((u = e.store) == null ? void 0 : u.draggable) === !1 ? "false" : "true"
1059
1062
  },
1060
1063
  ((f = e.store) == null ? void 0 : f.title) && /* @__PURE__ */ g.createElement("bw-glass-title", null, e.store.title),
1061
- l.length > 0 && /* @__PURE__ */ g.createElement("bw-glass-action-container", null, l.map((A, k) => {
1064
+ c.length > 0 && /* @__PURE__ */ g.createElement("bw-glass-action-container", null, c.map((A, k) => {
1062
1065
  const F = A.className ? `bw-glass-action ${A.className}` : "bw-glass-action";
1063
1066
  return /* @__PURE__ */ g.createElement(
1064
1067
  "button",
@@ -1073,26 +1076,32 @@ function Rt({
1073
1076
  ), /* @__PURE__ */ g.createElement("bw-glass-content", null, (w = e.store) == null ? void 0 : w.content))
1074
1077
  );
1075
1078
  }
1076
- function xt(e) {
1077
- const t = M(), i = M(), { panes: n, ...s } = e, o = { children: n, ...s }, h = new O(o), a = [], d = [];
1078
- return h.rootSash.walk((l) => {
1079
- l.children.length > 0 ? a.push(l) : d.push(l);
1079
+ const $t = q((e, t) => {
1080
+ const i = M(), n = M(), { panes: s, ...o } = e, h = { ...o, children: s }, a = new O(h), d = [], c = [];
1081
+ return a.rootSash.walk((l) => {
1082
+ l.children.length > 0 ? d.push(l) : c.push(l);
1080
1083
  }), L(() => {
1081
- const l = t.current;
1082
- l != null && l.parentElement && (h.windowElement = l, h.containerElement = l.parentElement, h.sillElement = i.current, h.enableFeatures());
1083
- }, []), /* @__PURE__ */ g.createElement(
1084
+ const l = i.current;
1085
+ l != null && l.parentElement && (a.windowElement = l, a.containerElement = l.parentElement, a.sillElement = n.current, a.enableFeatures());
1086
+ }, []), U(
1087
+ t,
1088
+ () => ({
1089
+ binaryWindow: a
1090
+ }),
1091
+ []
1092
+ ), /* @__PURE__ */ g.createElement(
1084
1093
  "bw-window",
1085
1094
  {
1086
- "sash-id": h.rootSash.id,
1087
- style: { width: h.rootSash.width, height: h.rootSash.height },
1088
- ref: t
1095
+ "sash-id": a.rootSash.id,
1096
+ style: { width: a.rootSash.width, height: a.rootSash.height },
1097
+ ref: i
1089
1098
  },
1090
- d.map((l) => /* @__PURE__ */ g.createElement(Rt, { key: l.id, sash: l, bwin: h })),
1091
- a.map((l) => /* @__PURE__ */ g.createElement(Mt, { key: l.id, sash: l })),
1092
- /* @__PURE__ */ g.createElement("bw-sill", { ref: i })
1099
+ c.map((l) => /* @__PURE__ */ g.createElement(xt, { key: l.id, sash: l, bwin: a })),
1100
+ d.map((l) => /* @__PURE__ */ g.createElement(Pt, { key: l.id, sash: l })),
1101
+ /* @__PURE__ */ g.createElement("bw-sill", { ref: n })
1093
1102
  );
1094
- }
1103
+ });
1095
1104
  export {
1096
1105
  I as BUILTIN_ACTIONS,
1097
- xt as Window
1106
+ $t as Window
1098
1107
  };
@@ -1,8 +1,8 @@
1
- (function(y,p){typeof exports=="object"&&typeof module<"u"?p(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],p):(y=typeof globalThis<"u"?globalThis:y||self,p(y.ReactBinaryWindow={},y.React))})(this,function(y,p){"use strict";var I=Object.defineProperty,k=(e,t,i)=>t in e?I(e,t,{enumerable:!0,configurable:!0,writable:!0,value:i}):e[t]=i,b=(e,t,i)=>k(e,typeof t!="symbol"?t+"":t,i);function F(e=.7,t=128){const i=256-t,n=Math.floor(Math.random()*i+t),s=Math.floor(Math.random()*i+t),o=Math.floor(Math.random()*i+t),h=Math.max(.5,Math.random()*e);return`rgba(${n}, ${s}, ${o}, ${h})`}function D(e=2,t=3){if(e<0||t<0)throw new Error("Parameters must be non-negative numbers");const i="ABCDEFGHIJKLMNOPQRSTUVWXYZ",n="0123456789";let s="";for(let o=0;o<e;o++){const h=Math.floor(Math.random()*i.length);s+=i[h]}s+="-";for(let o=0;o<t;o++){const h=Math.floor(Math.random()*n.length);s+=n[h]}return s}function N(e,t){for(;t.firstChild;)e.append(t.firstChild)}function _(e,t){const i=document.createElement("div");N(i,e),N(e,t),N(t,i)}function z(e){if(typeof e=="number"&&!isNaN(e))return e;if(typeof e=="string"){const t=e.trim();if(t.endsWith("%")){const i=t.slice(0,-1);if(!i)return NaN;const n=Number(i);return isNaN(n)?NaN:n/100}if(t.endsWith("px")){const i=t.slice(0,-2);if(!i)return NaN;const n=Number(i);return isNaN(n)?NaN:n}return Number(t)}return NaN}function q(e){return e!==null&&typeof e=="object"&&!Array.isArray(e)&&Object.getPrototypeOf(e)===Object.prototype}function U(e,t){for(const i in t){if(Object.hasOwn(e,i))throw new Error(`Key "${i}" already exists in target object`);e[i]=t[i]}return e}function j(e){const t=document.createElement("template");return t.innerHTML=e.trim(),t.content}function C(e){if(e==null||e==="")return null;if(typeof e=="string")try{const t=j(e);return t.childNodes.length===1?t.firstChild:t}catch{return document.createTextNode(e)}return e instanceof Node?e:document.createTextNode(String(e))}function M(e){const t=parseFloat(e.style.left)||0,i=parseFloat(e.style.top)||0,n=parseFloat(e.style.width)||0,s=parseFloat(e.style.height)||0;return{left:t,top:i,width:n,height:s}}const r={Top:"top",Right:"right",Bottom:"bottom",Left:"left",Center:"center",Root:"root",Unknown:"unknown",Outside:"outside"};function X(e){switch(e){case r.Top:return r.Bottom;case r.Right:return r.Left;case r.Bottom:return r.Top;case r.Left:return r.Right;default:throw new Error(`[bwin] Invalid position: ${e}`)}}function Y({width:e,height:t,x:i}){return t/e*i}function K({width:e,height:t,y:i}){return e/t*i}function V({width:e,height:t,x:i}){return t-t/e*i}function Z({width:e,height:t,y:i}){return e-e/t*i}function J(e,{clientX:t,clientY:i}){const n=e.getBoundingClientRect(),{width:s,height:o}=n,h=t-n.left,a=i-n.top;if(h<0||h>s||a<0||a>o)return r.Outside;const d=.3,l=Y({width:s,height:o,x:h}),c=V({width:s,height:o,x:h}),u=K({width:s,height:o,y:a}),g=Z({width:s,height:o,y:a});return h<s*(.5-d/2)&&a>l&&a<c?r.Left:h>s*(.5+d/2)&&a<l&&a>c?r.Right:a<o*(.5-d/2)&&h>u&&h<g?r.Top:a>o*(.5+d/2)&&h<u&&h>g?r.Bottom:h>s*(.5-d/2)&&h<s*(.5+d/2)&&a>o*(.5-d/2)&&a<o*(.5+d/2)?r.Center:r.Unknown}const Q=100,tt=100,E={left:0,top:0,width:150,height:150,minWidth:Q,minHeight:tt};class f{constructor({left:t=E.left,top:i=E.top,width:n=E.width,height:s=E.height,minWidth:o=E.minWidth,minHeight:h=E.minHeight,domNode:a=null,store:d={},position:l,id:c}=E){if(this.id=c??D(),!l)throw new Error("[bwin] Sash position is required");this.position=l,this.domNode=a,this._top=i,this._left=t,this._width=n,this._height=s,this.children=[],this.minWidth=o,this.minHeight=h,this.store=d}walk(t){this.children.forEach(i=>i.walk(t)),t(this)}isLeaf(){return this.children.length===0}isSplit(){return this.children.length>0}isLeftRightSplit(){return this.children.some(t=>t.position===r.Left||t.position===r.Right)}isTopBottomSplit(){return this.children.some(t=>t.position===r.Top||t.position===r.Bottom)}get leftChild(){return this.children.find(t=>t.position===r.Left)}get rightChild(){return this.children.find(t=>t.position===r.Right)}get topChild(){return this.children.find(t=>t.position===r.Top)}get bottomChild(){return this.children.find(t=>t.position===r.Bottom)}getChildren(){let t=null,i=null,n=null,s=null;for(const o of this.children)o.position===r.Left?t=o:o.position===r.Right?i=o:o.position===r.Top?n=o:o.position===r.Bottom&&(s=o);return[n,i,s,t]}getAllLeafDescendants(){const t=[];return this.walk(i=>{i.children.length===0&&t.push(i)}),t}calcMinWidth(){if(this.isLeaf())return this.minWidth;const[t,i,n,s]=this.getChildren();if(s&&i){const o=s.calcMinWidth()+i.calcMinWidth();return Math.max(this.minWidth,o)}if(t&&n){const o=Math.max(t.calcMinWidth(),n.calcMinWidth());return Math.max(this.minWidth,o)}}calcMinHeight(){if(this.isLeaf())return this.minHeight;const[t,i,n,s]=this.getChildren();if(s&&i){const o=Math.max(s.calcMinHeight(),i.calcMinHeight());return Math.max(this.minHeight,o)}if(t&&n){const o=t.calcMinHeight()+n.calcMinHeight();return Math.max(this.minHeight,o)}}getById(t){if(this.id===t)return this;for(const i of this.children){const n=i.getById(t);if(n)return n}return null}getAllIds(){const t=[this.id];for(const i of this.children)t.push(...i.getAllIds());return t}addChild(t){if(this.children.length>=2)throw new Error("[bwin] Maximum 2 children allowed");this.children.push(t)}getDescendantParentById(t){for(const i of this.children){if(i.id===t)return this;const n=i.getDescendantParentById(t);if(n)return n}return null}getChildSiblingById(t){return this.children.find(i=>i.id!==t)}get top(){return this._top}set top(t){const i=t-this._top;this._top=t;const[n,s,o,h]=this.getChildren();n&&o&&(n.top+=i,o.top+=i),h&&s&&(h.top+=i,s.top+=i)}get left(){return this._left}set left(t){const i=t-this._left;this._left=t;const[n,s,o,h]=this.getChildren();h&&s&&(h.left+=i,s.left+=i),n&&o&&(n.left+=i,o.left+=i)}get width(){return this._width}set width(t){const i=t-this._width;this._width=t;const[n,s,o,h]=this.getChildren();if(h&&s){const a=h.width+s.width,d=i*(h.width/a),l=a+i;let c=h.width+d,u=l-c,g=s.left+d;const w=h.calcMinWidth(),m=s.calcMinWidth();c<w&&u>m?(c=w,u=l-c,g=h.left+c):u<m&&c>w&&(u=m,c=l-u,g=h.left+c),h.width=c,s.width=u,s.left=g}n&&o&&(n.width+=i,o.width+=i)}get height(){return this._height}set height(t){const i=t-this._height;this._height=t;const[n,s,o,h]=this.getChildren();if(n&&o){const a=n.height+o.height,d=i*(n.height/a),l=a+i;let c=n.height+d,u=l-c,g=o.top+d;const w=n.calcMinHeight(),m=o.calcMinHeight();c<w&&u>m?(c=w,u=l-c,g=n.top+c):u<m&&c>w&&(u=m,c=l-u,g=n.top+c),n.height=c,o.height=u,o.top=g}h&&s&&(h.height+=i,s.height+=i)}}const L={size:"50%",position:r.Left};class P{constructor({parentRect:t,children:i,siblingConfigNode:n,id:s,minWidth:o,minHeight:h,position:a,size:d,...l}){b(this,"left"),b(this,"top"),b(this,"width"),b(this,"height"),this.parentRect=t,this.children=i,this.siblingConfigNode=n,this.id=s,this.minWidth=o,this.minHeight=h,this.position=this.getPosition(a),this.size=this.getSize(d),this.nonCoreData=l,this.setBounds()}getPosition(t){if(!this.siblingConfigNode)return t;const i=X(this.siblingConfigNode.position);if(!t)return i;if(t!==i)throw new Error("[bwin] Sibling position and current position are not opposite");return t}getSize(t){if(!this.siblingConfigNode)return z(t);if(!t){if(this.siblingConfigNode.size<1)return 1-this.siblingConfigNode.size;if(this.siblingConfigNode.position===r.Left||this.siblingConfigNode.position===r.Right)return this.parentRect.width-this.siblingConfigNode.width;if(this.siblingConfigNode.position===r.Top||this.siblingConfigNode.position===r.Bottom)return this.parentRect.height-this.siblingConfigNode.height}const i=z(t);if(i<1){if(i+this.siblingConfigNode.size!==1)throw new Error("[bwin] Sum of sibling sizes is not equal to 1")}else{if((this.position===r.Left||this.position===r.Right)&&i+this.siblingConfigNode.size!==this.parentRect.width)throw new Error("[bwin] Sum of sibling sizes is not equal to parent width");if((this.position===r.Top||this.position===r.Bottom)&&i+this.siblingConfigNode.size!==this.parentRect.height)throw new Error("[bwin] Sum of sibling sizes is not equal to parent height")}return i}setBounds(){if(this.position===r.Root)this.left=0,this.top=0,this.width=this.parentRect.width,this.height=this.parentRect.height;else if(this.position===r.Left){const t=this.size<1?this.parentRect.width*this.size:this.size;this.left=this.parentRect.left,this.top=this.parentRect.top,this.width=t,this.height=this.parentRect.height}else if(this.position===r.Right){const t=this.size<1?this.parentRect.width*this.size:this.size;this.left=this.parentRect.left+this.parentRect.width-t,this.top=this.parentRect.top,this.width=t,this.height=this.parentRect.height}else if(this.position===r.Top){const t=this.size<1?this.parentRect.height*this.size:this.size;this.left=this.parentRect.left,this.top=this.parentRect.top,this.width=this.parentRect.width,this.height=t}else if(this.position===r.Bottom){const t=this.size<1?this.parentRect.height*this.size:this.size;this.left=this.parentRect.left,this.top=this.parentRect.top+this.parentRect.height-t,this.width=this.parentRect.width,this.height=t}}createSash(){return new f({left:this.left,top:this.top,width:this.width,height:this.height,position:this.position,id:this.id,minWidth:this.minWidth,minHeight:this.minHeight,store:this.nonCoreData})}normConfig(t){if(q(t))return t;if(Array.isArray(t))return{children:t};if(typeof t=="string"||typeof t=="number"){const i=z(t);if(isNaN(i))throw new Error(`[bwin] Invalid size value: ${i}`);return{size:t}}else{if(t==null)return{};throw new Error(`[bwin] Invalid config value: ${t}`)}}createPrimaryConfigNode({size:t,position:i,children:n,id:s,minWidth:o,minHeight:h,...a}){return new P({parentRect:this,size:t??L.size,position:i??L.position,children:n,id:s,minWidth:o,minHeight:h,...a})}createSecondaryConfigNode({size:t,position:i,children:n,id:s,minWidth:o,minHeight:h,...a},d){return new P({parentRect:this,size:t,position:i,children:n,siblingConfigNode:d,id:s,minWidth:o,minHeight:h,...a})}buildSashTree(){const t=this.createSash();if(!Array.isArray(this.children)||this.children.length===0)return t;const i=this.normConfig(this.children[0]),n=this.normConfig(this.children.at(1));let s,o;return!i.size&&!i.position&&n?(n.position||(n.position=r.Right),s=this.createPrimaryConfigNode(n),o=this.createSecondaryConfigNode(i,s)):(s=this.createPrimaryConfigNode(i),o=this.createSecondaryConfigNode(n,s)),s&&o&&(t.children.push(s.buildSashTree()),t.children.push(o.buildSashTree())),t}}const R={width:333,height:333},$={fitContainer:!1};class et extends P{constructor({id:t,children:i,width:n=R.width,height:s=R.height,fitContainer:o=$.fitContainer,...h}={...R,...$}){super({id:t,children:i,size:NaN,position:r.Root,parentRect:{width:n,height:s},...h}),this.fitContainer=o}}class it extends f{constructor(t=E){super({...t,position:r.Root}),Object.assign(this,$)}}function S(e){const t=document.createElement("bw-pane");return t.style.top=`${e.top}px`,t.style.left=`${e.left}px`,t.style.width=`${e.width}px`,t.style.height=`${e.height}px`,t.setAttribute("sash-id",e.id),t.setAttribute("position",e.position),t}function nt(e){const t=e.domNode;return t.style.top=`${e.top}px`,t.style.left=`${e.left}px`,t.style.width=`${e.width}px`,t.style.height=`${e.height}px`,t.setAttribute("position",e.position),t}function st(e,{size:t}){const i=z(t);let n=e.width/2;i&&(i<1?n=e.width*i:n=i);const s=new f({top:e.top,left:e.left,width:n,height:e.height,position:r.Left}),o=new f({top:e.top,left:e.left+s.width,width:e.width-n,height:e.height,position:r.Right}),h=S(o);return o.domNode=h,N(h,e.domNode),e.addChild(s),e.addChild(o),s}function ot(e,{size:t}){const i=z(t);let n=e.width/2;i&&(i<1?n=e.width*i:n=i);const s=new f({left:e.left,top:e.top,width:e.width-n,height:e.height,position:r.Left}),o=new f({left:e.left+s.width,top:e.top,width:n,height:e.height,position:r.Right}),h=S(s);return s.domNode=h,N(h,e.domNode),e.addChild(s),e.addChild(o),o}function ht(e,{size:t}){const i=z(t);let n=e.height/2;i&&(i<1?n=e.height*i:n=i);const s=new f({left:e.left,top:e.top,width:e.width,height:n,position:r.Top}),o=new f({left:e.left,top:e.top+s.height,width:e.width,height:e.height-n,position:r.Bottom}),h=S(o);return o.domNode=h,N(h,e.domNode),e.addChild(s),e.addChild(o),s}function rt(e,{size:t}){const i=z(t);let n=e.height/2;i&&(i<1?n=e.height*i:n=i);const s=new f({top:e.top,left:e.left,width:e.width,height:e.height-n,position:r.Top}),o=new f({top:e.top+s.height,left:e.left,width:e.width,height:n,position:r.Bottom}),h=S(s);return s.domNode=h,N(h,e.domNode),e.addChild(s),e.addChild(o),o}function at(e,{position:t,size:i,minWidth:n,minHeight:s}){if(t===r.Left)return st(e,{size:i});if(t===r.Right)return ot(e,{size:i});if(t===r.Top)return ht(e,{size:i});if(t===r.Bottom)return rt(e,{size:i})}const lt={createPane(e){const t=S(e);return e.store.droppable===!1&&t.setAttribute("can-drop","false"),t},onPaneCreate(e,t){t.store.content&&e.append(C(t.store.content)),this!=null&&this.debug&&(e.style.backgroundColor=F(),e.innerHTML="",e.append(T(e)))},updatePane(e){return nt(e)},onPaneUpdate(e,t){this!=null&&this.debug&&(e.innerHTML="",e.append(T(e)))},addPane(e,{position:t,size:i}){if(!t)throw new Error("[bwin] Position is required when adding pane");const n=this.rootSash.getById(e);if(!n)throw new Error("[bwin] Parent sash not found when adding pane");const s=at(n,{position:t,size:i});return n.id=D(),this.update(),s},removePane(e){const t=this.rootSash.getDescendantParentById(e);if(!t)throw new Error("[bwin] Parent sash not found when removing pane");const i=t.getChildSiblingById(e);t.id=D(),i.children.length===0?(t.domNode=i.domNode,t.domNode.setAttribute("sash-id",t.id),t.children=[]):(t.children=i.children,i.position===r.Left?i.width=t.width:i.position===r.Right?(i.width=t.width,i.left=t.left):i.position===r.Top?i.height=t.height:i.position===r.Bottom&&(i.height=t.height,i.top=t.top)),this.update()}};function T(e){const t=document.createElement("pre");t.style.fontSize="10px";const i=`
1
+ (function(y,p){typeof exports=="object"&&typeof module<"u"?p(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],p):(y=typeof globalThis<"u"?globalThis:y||self,p(y.ReactBinaryWindow={},y.React))})(this,function(y,p){"use strict";var O=Object.defineProperty,k=(e,t,i)=>t in e?O(e,t,{enumerable:!0,configurable:!0,writable:!0,value:i}):e[t]=i,b=(e,t,i)=>k(e,typeof t!="symbol"?t+"":t,i);function F(e=.7,t=128){const i=256-t,n=Math.floor(Math.random()*i+t),s=Math.floor(Math.random()*i+t),o=Math.floor(Math.random()*i+t),h=Math.max(.5,Math.random()*e);return`rgba(${n}, ${s}, ${o}, ${h})`}function D(e=2,t=3){if(e<0||t<0)throw new Error("Parameters must be non-negative numbers");const i="ABCDEFGHIJKLMNOPQRSTUVWXYZ",n="0123456789";let s="";for(let o=0;o<e;o++){const h=Math.floor(Math.random()*i.length);s+=i[h]}s+="-";for(let o=0;o<t;o++){const h=Math.floor(Math.random()*n.length);s+=n[h]}return s}function N(e,t){for(;t.firstChild;)e.append(t.firstChild)}function _(e,t){const i=document.createElement("div");N(i,e),N(e,t),N(t,i)}function z(e){if(typeof e=="number"&&!isNaN(e))return e;if(typeof e=="string"){const t=e.trim();if(t.endsWith("%")){const i=t.slice(0,-1);if(!i)return NaN;const n=Number(i);return isNaN(n)?NaN:n/100}if(t.endsWith("px")){const i=t.slice(0,-2);if(!i)return NaN;const n=Number(i);return isNaN(n)?NaN:n}return Number(t)}return NaN}function q(e){return e!==null&&typeof e=="object"&&!Array.isArray(e)&&Object.getPrototypeOf(e)===Object.prototype}function U(e,t){for(const i in t){if(Object.hasOwn(e,i))throw new Error(`Key "${i}" already exists in target object`);e[i]=t[i]}return e}function j(e){const t=document.createElement("template");return t.innerHTML=e.trim(),t.content}function C(e){if(e==null||e==="")return null;if(typeof e=="string")try{const t=j(e);return t.childNodes.length===1?t.firstChild:t}catch{return document.createTextNode(e)}return e instanceof Node?e:document.createTextNode(String(e))}function A(e){const t=parseFloat(e.style.left)||0,i=parseFloat(e.style.top)||0,n=parseFloat(e.style.width)||0,s=parseFloat(e.style.height)||0;return{left:t,top:i,width:n,height:s}}const r={Top:"top",Right:"right",Bottom:"bottom",Left:"left",Center:"center",Root:"root",Unknown:"unknown",Outside:"outside"};function X(e){switch(e){case r.Top:return r.Bottom;case r.Right:return r.Left;case r.Bottom:return r.Top;case r.Left:return r.Right;default:throw new Error(`[bwin] Invalid position: ${e}`)}}function Y({width:e,height:t,x:i}){return t/e*i}function K({width:e,height:t,y:i}){return e/t*i}function V({width:e,height:t,x:i}){return t-t/e*i}function Z({width:e,height:t,y:i}){return e-e/t*i}function J(e,{clientX:t,clientY:i}){const n=e.getBoundingClientRect(),{width:s,height:o}=n,h=t-n.left,a=i-n.top;if(h<0||h>s||a<0||a>o)return r.Outside;const d=.3,c=Y({width:s,height:o,x:h}),l=V({width:s,height:o,x:h}),u=K({width:s,height:o,y:a}),g=Z({width:s,height:o,y:a});return h<s*(.5-d/2)&&a>c&&a<l?r.Left:h>s*(.5+d/2)&&a<c&&a>l?r.Right:a<o*(.5-d/2)&&h>u&&h<g?r.Top:a>o*(.5+d/2)&&h<u&&h>g?r.Bottom:h>s*(.5-d/2)&&h<s*(.5+d/2)&&a>o*(.5-d/2)&&a<o*(.5+d/2)?r.Center:r.Unknown}const Q=100,tt=100,E={left:0,top:0,width:150,height:150,minWidth:Q,minHeight:tt};class f{constructor({left:t=E.left,top:i=E.top,width:n=E.width,height:s=E.height,minWidth:o=E.minWidth,minHeight:h=E.minHeight,domNode:a=null,store:d={},position:c,id:l}=E){if(this.id=l??D(),!c)throw new Error("[bwin] Sash position is required");this.position=c,this.domNode=a,this._top=i,this._left=t,this._width=n,this._height=s,this.children=[],this.minWidth=o,this.minHeight=h,this.store=d}walk(t){this.children.forEach(i=>i.walk(t)),t(this)}isLeaf(){return this.children.length===0}isSplit(){return this.children.length>0}isLeftRightSplit(){return this.children.some(t=>t.position===r.Left||t.position===r.Right)}isTopBottomSplit(){return this.children.some(t=>t.position===r.Top||t.position===r.Bottom)}get leftChild(){return this.children.find(t=>t.position===r.Left)}get rightChild(){return this.children.find(t=>t.position===r.Right)}get topChild(){return this.children.find(t=>t.position===r.Top)}get bottomChild(){return this.children.find(t=>t.position===r.Bottom)}getChildren(){let t=null,i=null,n=null,s=null;for(const o of this.children)o.position===r.Left?t=o:o.position===r.Right?i=o:o.position===r.Top?n=o:o.position===r.Bottom&&(s=o);return[n,i,s,t]}getAllLeafDescendants(){const t=[];return this.walk(i=>{i.children.length===0&&t.push(i)}),t}calcMinWidth(){if(this.isLeaf())return this.minWidth;const[t,i,n,s]=this.getChildren();if(s&&i){const o=s.calcMinWidth()+i.calcMinWidth();return Math.max(this.minWidth,o)}if(t&&n){const o=Math.max(t.calcMinWidth(),n.calcMinWidth());return Math.max(this.minWidth,o)}}calcMinHeight(){if(this.isLeaf())return this.minHeight;const[t,i,n,s]=this.getChildren();if(s&&i){const o=Math.max(s.calcMinHeight(),i.calcMinHeight());return Math.max(this.minHeight,o)}if(t&&n){const o=t.calcMinHeight()+n.calcMinHeight();return Math.max(this.minHeight,o)}}getById(t){if(this.id===t)return this;for(const i of this.children){const n=i.getById(t);if(n)return n}return null}getAllIds(){const t=[this.id];for(const i of this.children)t.push(...i.getAllIds());return t}addChild(t){if(this.children.length>=2)throw new Error("[bwin] Maximum 2 children allowed");this.children.push(t)}getDescendantParentById(t){for(const i of this.children){if(i.id===t)return this;const n=i.getDescendantParentById(t);if(n)return n}return null}getChildSiblingById(t){return this.children.find(i=>i.id!==t)}get top(){return this._top}set top(t){const i=t-this._top;this._top=t;const[n,s,o,h]=this.getChildren();n&&o&&(n.top+=i,o.top+=i),h&&s&&(h.top+=i,s.top+=i)}get left(){return this._left}set left(t){const i=t-this._left;this._left=t;const[n,s,o,h]=this.getChildren();h&&s&&(h.left+=i,s.left+=i),n&&o&&(n.left+=i,o.left+=i)}get width(){return this._width}set width(t){const i=t-this._width;this._width=t;const[n,s,o,h]=this.getChildren();if(h&&s){const a=h.width+s.width,d=i*(h.width/a),c=a+i;let l=h.width+d,u=c-l,g=s.left+d;const w=h.calcMinWidth(),m=s.calcMinWidth();l<w&&u>m?(l=w,u=c-l,g=h.left+l):u<m&&l>w&&(u=m,l=c-u,g=h.left+l),h.width=l,s.width=u,s.left=g}n&&o&&(n.width+=i,o.width+=i)}get height(){return this._height}set height(t){const i=t-this._height;this._height=t;const[n,s,o,h]=this.getChildren();if(n&&o){const a=n.height+o.height,d=i*(n.height/a),c=a+i;let l=n.height+d,u=c-l,g=o.top+d;const w=n.calcMinHeight(),m=o.calcMinHeight();l<w&&u>m?(l=w,u=c-l,g=n.top+l):u<m&&l>w&&(u=m,l=c-u,g=n.top+l),n.height=l,o.height=u,o.top=g}h&&s&&(h.height+=i,s.height+=i)}}const L={size:"50%",position:r.Left};class P{constructor({parentRect:t,children:i,siblingConfigNode:n,id:s,minWidth:o,minHeight:h,position:a,size:d,...c}){b(this,"left"),b(this,"top"),b(this,"width"),b(this,"height"),this.parentRect=t,this.children=i,this.siblingConfigNode=n,this.id=s,this.minWidth=o,this.minHeight=h,this.position=this.getPosition(a),this.size=this.getSize(d),this.nonCoreData=c,this.setBounds()}getPosition(t){if(!this.siblingConfigNode)return t;const i=X(this.siblingConfigNode.position);if(!t)return i;if(t!==i)throw new Error("[bwin] Sibling position and current position are not opposite");return t}getSize(t){if(!this.siblingConfigNode)return z(t);if(!t){if(this.siblingConfigNode.size<1)return 1-this.siblingConfigNode.size;if(this.siblingConfigNode.position===r.Left||this.siblingConfigNode.position===r.Right)return this.parentRect.width-this.siblingConfigNode.width;if(this.siblingConfigNode.position===r.Top||this.siblingConfigNode.position===r.Bottom)return this.parentRect.height-this.siblingConfigNode.height}const i=z(t);if(i<1){if(i+this.siblingConfigNode.size!==1)throw new Error("[bwin] Sum of sibling sizes is not equal to 1")}else{if((this.position===r.Left||this.position===r.Right)&&i+this.siblingConfigNode.size!==this.parentRect.width)throw new Error("[bwin] Sum of sibling sizes is not equal to parent width");if((this.position===r.Top||this.position===r.Bottom)&&i+this.siblingConfigNode.size!==this.parentRect.height)throw new Error("[bwin] Sum of sibling sizes is not equal to parent height")}return i}setBounds(){if(this.position===r.Root)this.left=0,this.top=0,this.width=this.parentRect.width,this.height=this.parentRect.height;else if(this.position===r.Left){const t=this.size<1?this.parentRect.width*this.size:this.size;this.left=this.parentRect.left,this.top=this.parentRect.top,this.width=t,this.height=this.parentRect.height}else if(this.position===r.Right){const t=this.size<1?this.parentRect.width*this.size:this.size;this.left=this.parentRect.left+this.parentRect.width-t,this.top=this.parentRect.top,this.width=t,this.height=this.parentRect.height}else if(this.position===r.Top){const t=this.size<1?this.parentRect.height*this.size:this.size;this.left=this.parentRect.left,this.top=this.parentRect.top,this.width=this.parentRect.width,this.height=t}else if(this.position===r.Bottom){const t=this.size<1?this.parentRect.height*this.size:this.size;this.left=this.parentRect.left,this.top=this.parentRect.top+this.parentRect.height-t,this.width=this.parentRect.width,this.height=t}}createSash(){return new f({left:this.left,top:this.top,width:this.width,height:this.height,position:this.position,id:this.id,minWidth:this.minWidth,minHeight:this.minHeight,store:this.nonCoreData})}normConfig(t){if(q(t))return t;if(Array.isArray(t))return{children:t};if(typeof t=="string"||typeof t=="number"){const i=z(t);if(isNaN(i))throw new Error(`[bwin] Invalid size value: ${i}`);return{size:t}}else{if(t==null)return{};throw new Error(`[bwin] Invalid config value: ${t}`)}}createPrimaryConfigNode({size:t,position:i,children:n,id:s,minWidth:o,minHeight:h,...a}){return new P({parentRect:this,size:t??L.size,position:i??L.position,children:n,id:s,minWidth:o,minHeight:h,...a})}createSecondaryConfigNode({size:t,position:i,children:n,id:s,minWidth:o,minHeight:h,...a},d){return new P({parentRect:this,size:t,position:i,children:n,siblingConfigNode:d,id:s,minWidth:o,minHeight:h,...a})}buildSashTree(){const t=this.createSash();if(!Array.isArray(this.children)||this.children.length===0)return t;const i=this.normConfig(this.children[0]),n=this.normConfig(this.children.at(1));let s,o;return!i.size&&!i.position&&n?(n.position||(n.position=r.Right),s=this.createPrimaryConfigNode(n),o=this.createSecondaryConfigNode(i,s)):(s=this.createPrimaryConfigNode(i),o=this.createSecondaryConfigNode(n,s)),s&&o&&(t.children.push(s.buildSashTree()),t.children.push(o.buildSashTree())),t}}const R={width:333,height:333},$={fitContainer:!1};class et extends P{constructor({id:t,children:i,width:n=R.width,height:s=R.height,fitContainer:o=$.fitContainer,...h}={...R,...$}){super({id:t,children:i,size:NaN,position:r.Root,parentRect:{width:n,height:s},...h}),this.fitContainer=o}}class it extends f{constructor(t=E){super({...t,position:r.Root}),Object.assign(this,$)}}function S(e){const t=document.createElement("bw-pane");return t.style.top=`${e.top}px`,t.style.left=`${e.left}px`,t.style.width=`${e.width}px`,t.style.height=`${e.height}px`,t.setAttribute("sash-id",e.id),t.setAttribute("position",e.position),t}function nt(e){const t=e.domNode;return t.style.top=`${e.top}px`,t.style.left=`${e.left}px`,t.style.width=`${e.width}px`,t.style.height=`${e.height}px`,t.setAttribute("position",e.position),t}function st(e,{size:t}){const i=z(t);let n=e.width/2;i&&(i<1?n=e.width*i:n=i);const s=new f({top:e.top,left:e.left,width:n,height:e.height,position:r.Left}),o=new f({top:e.top,left:e.left+s.width,width:e.width-n,height:e.height,position:r.Right}),h=S(o);return o.domNode=h,N(h,e.domNode),e.addChild(s),e.addChild(o),s}function ot(e,{size:t}){const i=z(t);let n=e.width/2;i&&(i<1?n=e.width*i:n=i);const s=new f({left:e.left,top:e.top,width:e.width-n,height:e.height,position:r.Left}),o=new f({left:e.left+s.width,top:e.top,width:n,height:e.height,position:r.Right}),h=S(s);return s.domNode=h,N(h,e.domNode),e.addChild(s),e.addChild(o),o}function ht(e,{size:t}){const i=z(t);let n=e.height/2;i&&(i<1?n=e.height*i:n=i);const s=new f({left:e.left,top:e.top,width:e.width,height:n,position:r.Top}),o=new f({left:e.left,top:e.top+s.height,width:e.width,height:e.height-n,position:r.Bottom}),h=S(o);return o.domNode=h,N(h,e.domNode),e.addChild(s),e.addChild(o),s}function rt(e,{size:t}){const i=z(t);let n=e.height/2;i&&(i<1?n=e.height*i:n=i);const s=new f({top:e.top,left:e.left,width:e.width,height:e.height-n,position:r.Top}),o=new f({top:e.top+s.height,left:e.left,width:e.width,height:n,position:r.Bottom}),h=S(s);return s.domNode=h,N(h,e.domNode),e.addChild(s),e.addChild(o),o}function at(e,{position:t,size:i,minWidth:n,minHeight:s}){if(t===r.Left)return st(e,{size:i});if(t===r.Right)return ot(e,{size:i});if(t===r.Top)return ht(e,{size:i});if(t===r.Bottom)return rt(e,{size:i})}const lt={createPane(e){const t=S(e);return e.store.droppable===!1&&t.setAttribute("can-drop","false"),t},onPaneCreate(e,t){t.store.content&&e.append(C(t.store.content)),this!=null&&this.debug&&(e.style.backgroundColor=F(),e.innerHTML="",e.append(T(e)))},updatePane(e){return nt(e)},onPaneUpdate(e,t){this!=null&&this.debug&&(e.innerHTML="",e.append(T(e)))},addPane(e,{position:t,size:i}){if(!t)throw new Error("[bwin] Position is required when adding pane");const n=this.rootSash.getById(e);if(!n)throw new Error("[bwin] Parent sash not found when adding pane");const s=at(n,{position:t,size:i});return n.id=D(),this.update(),s},removePane(e){const t=this.rootSash.getDescendantParentById(e);if(!t)throw new Error("[bwin] Parent sash not found when removing pane");const i=t.getChildSiblingById(e);t.id=D(),i.children.length===0?(t.domNode=i.domNode,t.domNode.setAttribute("sash-id",t.id),t.children=[]):(t.children=i.children,i.position===r.Left?i.width=t.width:i.position===r.Right?(i.width=t.width,i.left=t.left):i.position===r.Top?i.height=t.height:i.position===r.Bottom&&(i.height=t.height,i.top=t.top)),this.update()}};function T(e){const t=document.createElement("pre");t.style.fontSize="10px";const i=`
2
2
  ${e.getAttribute("sash-id")}
3
3
  ${e.getAttribute("position")}
4
4
  top: ${e.style.top}
5
5
  left: ${e.style.left}
6
6
  width: ${e.style.width}
7
7
  height: ${e.style.height}
8
- `;return t.innerHTML=i.trim(),t}const dt={createWindow(){const e=document.createElement("bw-window");return e.style.width=`${this.rootSash.width}px`,e.style.height=`${this.rootSash.height}px`,e.setAttribute("sash-id",this.rootSash.id),e},glaze(){this.rootSash.walk(e=>{let t=null;e.children.length>0?(t=this.createMuntin(e),this.onMuntinCreate(t,e),this.windowElement.append(t)):(t=this.createPane(e),this.onPaneCreate(t,e),this.windowElement.prepend(t)),e.domNode=t})},update(){this.windowElement.style.width=`${this.rootSash.width}px`,this.windowElement.style.height=`${this.rootSash.height}px`;const e=this.rootSash.getAllIds(),t=[];this.windowElement.querySelectorAll("[sash-id]").forEach(i=>{const n=i.getAttribute("sash-id");t.push(n),e.includes(n)||i.remove()}),this.rootSash.walk(i=>{i.children.length>0?t.includes(i.id)?(this.updateMuntin(i),this.onMuntinUpdate(i.domNode,i)):(i.domNode=this.createMuntin(i),this.windowElement.append(i.domNode)):t.includes(i.id)?(this.updatePane(i),this.onPaneUpdate(i.domNode,i)):(i.domNode||(i.domNode=this.createPane(i)),this.windowElement.prepend(i.domNode))})}},ct={muntinSize:4,createMuntin(e){const t=document.createElement("bw-muntin"),i=e.leftChild,n=e.topChild;return i?(t.style.width=`${this.muntinSize}px`,t.style.height=`${e.height}px`,t.style.top=`${e.top}px`,t.style.left=`${e.left+i.width-this.muntinSize/2}px`,t.setAttribute("vertical","")):n&&(t.style.width=`${e.width}px`,t.style.height=`${this.muntinSize}px`,t.style.top=`${e.top+n.height-this.muntinSize/2}px`,t.style.left=`${e.left}px`,t.setAttribute("horizontal","")),t.setAttribute("sash-id",e.id),e.store.resizable===!1&&t.setAttribute("resizable","false"),t},onMuntinCreate(e,t){},updateMuntin(e){const t=e.domNode,i=e.leftChild,n=e.topChild;i?(t.style.height=`${e.height}px`,t.style.top=`${e.top}px`,t.style.left=`${e.left+i.width-this.muntinSize/2}px`):n&&(t.style.width=`${e.width}px`,t.style.top=`${e.top+n.height-this.muntinSize/2}px`,t.style.left=`${e.left}px`)},onMuntinUpdate(e,t){}},pt={fitContainer:!1,enableFitContainer(){new ResizeObserver(e=>{for(const t of e)t.target===this.containerElement&&this.fitContainer&&(this.rootSash.width=t.contentRect.width,this.rootSash.height=t.contentRect.height,this.update())}).observe(this.containerElement)}},ut={activeMuntinSash:null,isResizeStarted:!1,isDropStarted:!1,lastX:0,lastY:0,applyResizeStyles(){this.activeMuntinSash.domNode.hasAttribute("vertical")?document.body.classList.add("body--bw-resize-x"):this.activeMuntinSash.domNode.hasAttribute("horizontal")&&document.body.classList.add("body--bw-resize-y")},revertResizeStyles(){document.body.classList.remove("body--bw-resize-x"),document.body.classList.remove("body--bw-resize-y")},enableResize(){document.addEventListener("mousedown",e=>{if(e.target.tagName!=="BW-MUNTIN"||e.target.getAttribute("resizable")==="false")return;const t=e.target.getAttribute("sash-id");this.activeMuntinSash=this.rootSash.getById(t),this.activeMuntinSash&&(this.isResizeStarted=!0,this.lastX=e.pageX,this.lastY=e.pageY,this.applyResizeStyles())}),document.addEventListener("mousemove",e=>{if(!this.isResizeStarted||!this.activeMuntinSash)return;const[t,i,n,s]=this.activeMuntinSash.getChildren(),o=this.activeMuntinSash.isLeftRightSplit(),h=this.activeMuntinSash.isTopBottomSplit();if(o&&s&&i){const a=e.pageX-this.lastX,d=s.width+a,l=i.width-a;if(d<=s.calcMinWidth()||l<=i.calcMinWidth())return;s.width=d,i.width=l,i.left=i.left+a,this.update(),this.lastX=e.pageX}else if(h&&t&&n){const a=e.pageY-this.lastY,d=t.height+a,l=n.height-a;if(d<=t.calcMinHeight()||l<=n.calcMinHeight())return;t.height=d,n.height=l,n.top=n.top+a,this.update(),this.lastY=e.pageY}}),document.addEventListener("mouseup",()=>{this.isResizeStarted=!1,this.activeMuntinSash=null,this.revertResizeStyles()})}},gt={activeDropPaneEl:null,onPaneDrop(e,t){},enableDrop(){this.windowElement.addEventListener("dragover",e=>{e.preventDefault();const t=e.target.matches("bw-pane")?e.target:e.target.closest("bw-pane");if(!t||(t!==this.activeDropPaneEl&&(this.activeDropPaneEl&&this.activeDropPaneEl.removeAttribute("drop-area"),this.activeDropPaneEl=t),t.getAttribute("can-drop")==="false"))return;const i=J(t,e);t.setAttribute("drop-area",i)}),this.windowElement.addEventListener("dragleave",e=>{e.currentTarget.contains(e.relatedTarget)&&e.currentTarget!==e.relatedTarget||this.activeDropPaneEl&&(this.activeDropPaneEl.removeAttribute("drop-area"),this.activeDropPaneEl=null)}),this.windowElement.addEventListener("drop",e=>{if(!this.activeDropPaneEl||this.activeDropPaneEl.getAttribute("can-drop")==="false")return;const t=this.activeDropPaneEl.getAttribute("sash-id"),i=this.rootSash.getById(t);this.onPaneDrop(e,i),typeof i.store.onDrop=="function"&&i.store.onDrop(e,i),this.activeDropPaneEl.removeAttribute("drop-area"),this.activeDropPaneEl=null})}},ft=!1;class W{constructor(t){b(this,"windowElement",null),b(this,"containerElement",null),b(this,"debug",ft);let i=null;t instanceof it?(i=t,this.rootSash=t):(i=new et(t),this.rootSash=i.buildSashTree()),this.fitContainer=i.fitContainer}frame(t){this.containerElement=t,this.windowElement=this.createWindow(),this.glaze(),this.containerElement.append(this.windowElement)}enableFeatures(){this.enableResize(),this.enableDrop(),this.fitContainer&&this.enableFitContainer()}mount(t){this.frame(t),this.enableFeatures()}static assemble(...t){t.forEach(i=>{U(this.prototype,i)})}}W.assemble(dt,ct,lt,pt,gt,ut);function H(e){if(e.tagName==="BW-PANE")return e.getAttribute("sash-id");const t=e.closest("bw-pane");if(!t)throw new Error("[bwin] Pane element not found");return t.getAttribute("sash-id")}const wt={label:"",className:"bw-glass-action--close",onClick:(e,t)=>{const i=H(e.target);t.removePane(i)}},mt={label:"",className:"bw-glass-action--minimize",onClick:(e,t)=>{const i=t.sillElement;if(!i)throw new Error("[bwin] Sill element not found when minimizing");const n=C('<button class="bw-minimized-glass" />');i.append(n);const s=e.target.closest("bw-pane"),o=e.target.closest("bw-glass"),h=s.getAttribute("sash-id"),a=s.getAttribute("position");n.bwGlassElement=o,n.bwOriginalPosition=a,n.bwOriginalBoundingRect=M(s),t.removePane(h)}},bt={label:"",className:"bw-glass-action--maximize",onClick:e=>{const t=e.target.closest("bw-pane");t.hasAttribute("maximized")?(t.removeAttribute("maximized"),t.style.left=`${t.bwOriginalBoundingRect.left}px`,t.style.top=`${t.bwOriginalBoundingRect.top}px`,t.style.width=`${t.bwOriginalBoundingRect.width}px`,t.style.height=`${t.bwOriginalBoundingRect.height}px`):(t.setAttribute("maximized",""),t.bwOriginalBoundingRect=M(t),t.style.left="0",t.style.top="0",t.style.width="100%",t.style.height="100%")}};function yt(e,t){const i=e.left+e.width,n=e.top+e.height,s=t.left+t.width,o=t.top+t.height;if(e.left>=s||t.left>=i||e.top>=o||t.top>=n)return null;const h=Math.max(e.left,t.left),a=Math.max(e.top,t.top),d=Math.min(i,s),l=Math.min(n,o);return{left:h,top:a,width:d-h,height:l-a}}const B=[mt,bt,wt],Et={enableActions(){this.handleMinimizedGlassClick(),this.observeActionButtons()},restoreGlass(e){const t=e.bwOriginalBoundingRect;let i=0,n=null;if(this.windowElement.querySelectorAll("bw-pane").forEach(s=>{const o=M(s),h=yt(t,o);if(h){const a=h.width*h.height;a>i&&(i=a,n=s)}}),n){const s=e.bwOriginalPosition,o=M(n);let h=0;if(s===r.Left||s===r.Right)h=t.width>=o.width?o.width/2:t.width;else if(s===r.Top||s===r.Bottom)h=t.height>=o.height?o.height/2:t.height;else throw new Error("[bwin] Invalid position when restoring glass");this.addPane(n.getAttribute("sash-id"),{position:s,size:h}).domNode.append(e.bwGlassElement)}},handleMinimizedGlassClick(){this.sillElement.addEventListener("click",e=>{if(!e.target.matches(".bw-minimized-glass"))return;const t=e.target;this.restoreGlass(t),t.remove()})},updateDisabledStateOfActionButtons(){this.updateDisabledState(".bw-glass-action--close"),this.updateDisabledState(".bw-glass-action--minimize"),this.updateDisabledState(".bw-glass-action--maximize")},updateDisabledState(e){if(this.windowElement.querySelectorAll("bw-pane").length===1){const t=this.windowElement.querySelector(e);t&&t.setAttribute("disabled","")}else this.windowElement.querySelectorAll(e).forEach(t=>{t.removeAttribute("disabled")})},observeActionButtons(){this.updateDisabledStateOfActionButtons(),new MutationObserver(e=>{e.forEach(t=>{t.type==="childList"&&this.updateDisabledStateOfActionButtons()})}).observe(this.windowElement,{childList:!0})}},A={title:null,content:null,tabs:[],actions:void 0,draggable:!0};class G{constructor({title:t=A.title,content:i=A.content,tabs:n=A.tabs,actions:s=A.actions,draggable:o=A.draggable,sash:h,binaryWindow:a}){b(this,"domNode"),this.title=t,this.content=i,this.tabs=n,this.actions=s,this.sash=h,this.draggable=o,this.binaryWindow=a,this.build()}build(){const t=document.createElement("bw-glass-header");if(Array.isArray(this.tabs)&&this.tabs.length>0)t.append(this.createTabs());else if(this.title){const s=document.createElement("bw-glass-title");s.append(C(this.title)),t.append(s)}t.setAttribute("can-drag",this.draggable),t.append(this.createActions());const i=document.createElement("bw-glass-content"),n=C(this.content);n&&i.append(n),this.domNode=document.createElement("bw-glass"),this.domNode.append(t,i)}createTabs(){const t=document.createElement("bw-glass-tab-container");for(const i of this.tabs){const n=(i==null?void 0:i.label)??i,s=C(`<button class="bw-glass-tab">${n}</button>`);t.append(s)}return t}createActions(){const t=document.createElement("bw-glass-action-container"),i=this.actions===void 0?B:Array.isArray(this.actions)?this.actions:[];for(const n of i){const s=(n==null?void 0:n.label)??n,o=n.className?`bw-glass-action ${n.className}`:"bw-glass-action",h=C(`<button class="${o}">${s}</button>`);typeof n.onClick=="function"&&h.addEventListener("click",a=>{n.onClick(a,this.binaryWindow)}),t.append(h)}return t}get contentElement(){return this.domNode.querySelector("bw-glass-content")}get headerElement(){return this.domNode.querySelector("bw-glass-header")}}const vt={activeDragGlassEl:null,activeDragGlassPaneCanDrop:!1,onPaneDrop(e,t){if(!this.activeDragGlassEl)return;const i=this.activeDropPaneEl.getAttribute("drop-area");if(i==="center"){const n=this.activeDragGlassEl.closest("bw-pane"),s=this.activeDropPaneEl.getAttribute("can-drop")!=="false";_(n,this.activeDropPaneEl),n.setAttribute("can-drop",s);return}else{const n=H(this.activeDragGlassEl);this.addPane(t.id,{position:i}).domNode.append(this.activeDragGlassEl),this.removePane(n)}},enableDrag(){document.addEventListener("mousedown",e=>{if(e.button!==0||!e.target.matches("bw-glass-header"))return;if(e.target.getAttribute("can-drag")==="false"){e.preventDefault();return}const t=e.target.closest("bw-glass");t.setAttribute("draggable",!0),this.activeDragGlassEl=t}),document.addEventListener("mouseup",()=>{this.activeDragGlassEl&&(this.activeDragGlassEl.removeAttribute("draggable"),this.activeDragGlassEl=null)}),this.windowElement.addEventListener("dragstart",e=>{if(!(e.target instanceof HTMLElement)||!e.target.matches("bw-glass")||!this.activeDragGlassEl)return;e.dataTransfer.effectAllowed="move";const t=this.activeDragGlassEl.closest("bw-pane");this.activeDragGlassPaneCanDrop=t.getAttribute("can-drop")!=="false",t.setAttribute("can-drop",!1)}),this.windowElement.addEventListener("dragend",()=>{this.activeDragGlassEl&&(this.activeDragGlassEl.removeAttribute("draggable"),this.activeDragGlassEl.closest("bw-pane").setAttribute("can-drop",this.activeDragGlassPaneCanDrop),this.activeDragGlassEl=null)})}},Nt={trimMuntin(e){e.hasAttribute("vertical")?(e.style.top=`${parseFloat(e.style.top)+this.muntinSize/2}px`,e.style.height=`${parseFloat(e.style.height)-this.muntinSize}px`):e.hasAttribute("horizontal")&&(e.style.left=`${parseFloat(e.style.left)+this.muntinSize/2}px`,e.style.width=`${parseFloat(e.style.width)-this.muntinSize}px`)},onMuntinCreate(e){this.trimMuntin(e)},onMuntinUpdate(e){this.trimMuntin(e)}};class O extends W{constructor(){super(...arguments),b(this,"sillElement",null)}frame(){super.frame(...arguments);const t=C("<bw-sill />");this.windowElement.append(t),this.sillElement=t}enableFeatures(){super.enableFeatures(),this.enableDrag(),this.enableActions()}onPaneCreate(t,i){const n=new G({...i.store,sash:i,binaryWindow:this});t.innerHTML="",t.append(n.domNode),this.debug&&n.contentElement.prepend(`${i.id}`)}onPaneUpdate(){}addGlass(t,i,n){const s=this.addPane(t,{position:i}),o=new G({...n,sash:s,binaryWindow:this});s.domNode.append(o.domNode)}removeGlass(t,i){if(i)this.removePane(t);else{const n=this.rootSash.getById(t);if(!n)throw new Error("[bwin] Pane not found when removing glass");const s=n.domNode.querySelector("bw-glass");s&&s.remove()}}}O.assemble(vt,Nt,Et);const v=4;function zt({sash:e}){var c;const t=p.useRef(),i=e.leftChild,n=e.topChild;let s,o,h,a,d,l;return i?(s=v,o=e.height-v,h=e.top+v/2,a=e.left+i.width-v/2,d=!0):n&&(s=e.width-v,o=v,h=e.top+n.height-v/2,a=e.left+v/2,l=!0),p.useEffect(()=>{e.domNode=t.current},[]),p.createElement("bw-muntin",{"sash-id":e.id,style:{width:s,height:o,top:h,left:a},vertical:d,horizontal:l,resizable:((c=e.store)==null?void 0:c.resizable)===!1?"false":"true",ref:t})}function Ct({sash:e,bwin:t}){var c,u,g,w,m;const i=p.useRef(),{left:n,top:s,width:o,height:h,id:a,position:d}=e;p.useEffect(()=>{e.domNode=i.current},[]);const l=((c=e.store)==null?void 0:c.actions)===void 0?B:Array.isArray(e.store.actions)?e.store.actions:[];return p.createElement("bw-pane",{"sash-id":a,position:d,style:{left:n,top:s,width:o,height:h},"can-drop":((u=e.store)==null?void 0:u.droppable)===!1?"false":"true",ref:i},p.createElement("bw-glass",null,p.createElement("bw-glass-header",{"can-drag":((g=e.store)==null?void 0:g.draggable)===!1?"false":"true"},((w=e.store)==null?void 0:w.title)&&p.createElement("bw-glass-title",null,e.store.title),l.length>0&&p.createElement("bw-glass-action-container",null,l.map((x,At)=>{const Mt=x.className?`bw-glass-action ${x.className}`:"bw-glass-action";return p.createElement("button",{className:Mt,key:At,onClick:Pt=>x.onClick(Pt,t)},x.label)}))),p.createElement("bw-glass-content",null,(m=e.store)==null?void 0:m.content)))}function St(e){const t=p.useRef(),i=p.useRef(),{panes:n,...s}=e,o={children:n,...s},h=new O(o),a=[],d=[];return h.rootSash.walk(l=>{l.children.length>0?a.push(l):d.push(l)}),p.useEffect(()=>{const l=t.current;l!=null&&l.parentElement&&(h.windowElement=l,h.containerElement=l.parentElement,h.sillElement=i.current,h.enableFeatures())},[]),p.createElement("bw-window",{"sash-id":h.rootSash.id,style:{width:h.rootSash.width,height:h.rootSash.height},ref:t},d.map(l=>p.createElement(Ct,{key:l.id,sash:l,bwin:h})),a.map(l=>p.createElement(zt,{key:l.id,sash:l})),p.createElement("bw-sill",{ref:i}))}y.BUILTIN_ACTIONS=B,y.Window=St,Object.defineProperty(y,Symbol.toStringTag,{value:"Module"})});
8
+ `;return t.innerHTML=i.trim(),t}const dt={createWindow(){const e=document.createElement("bw-window");return e.style.width=`${this.rootSash.width}px`,e.style.height=`${this.rootSash.height}px`,e.setAttribute("sash-id",this.rootSash.id),e},glaze(){this.rootSash.walk(e=>{let t=null;e.children.length>0?(t=this.createMuntin(e),this.onMuntinCreate(t,e),this.windowElement.append(t)):(t=this.createPane(e),this.onPaneCreate(t,e),this.windowElement.prepend(t)),e.domNode=t})},update(){this.windowElement.style.width=`${this.rootSash.width}px`,this.windowElement.style.height=`${this.rootSash.height}px`;const e=this.rootSash.getAllIds(),t=[];this.windowElement.querySelectorAll("[sash-id]").forEach(i=>{const n=i.getAttribute("sash-id");t.push(n),e.includes(n)||i.remove()}),this.rootSash.walk(i=>{i.children.length>0?t.includes(i.id)?(this.updateMuntin(i),this.onMuntinUpdate(i.domNode,i)):(i.domNode=this.createMuntin(i),this.windowElement.append(i.domNode)):t.includes(i.id)?(this.updatePane(i),this.onPaneUpdate(i.domNode,i)):(i.domNode||(i.domNode=this.createPane(i)),this.windowElement.prepend(i.domNode))})}},ct={muntinSize:4,createMuntin(e){const t=document.createElement("bw-muntin"),i=e.leftChild,n=e.topChild;return i?(t.style.width=`${this.muntinSize}px`,t.style.height=`${e.height}px`,t.style.top=`${e.top}px`,t.style.left=`${e.left+i.width-this.muntinSize/2}px`,t.setAttribute("vertical","")):n&&(t.style.width=`${e.width}px`,t.style.height=`${this.muntinSize}px`,t.style.top=`${e.top+n.height-this.muntinSize/2}px`,t.style.left=`${e.left}px`,t.setAttribute("horizontal","")),t.setAttribute("sash-id",e.id),e.store.resizable===!1&&t.setAttribute("resizable","false"),t},onMuntinCreate(e,t){},updateMuntin(e){const t=e.domNode,i=e.leftChild,n=e.topChild;i?(t.style.height=`${e.height}px`,t.style.top=`${e.top}px`,t.style.left=`${e.left+i.width-this.muntinSize/2}px`):n&&(t.style.width=`${e.width}px`,t.style.top=`${e.top+n.height-this.muntinSize/2}px`,t.style.left=`${e.left}px`)},onMuntinUpdate(e,t){}},pt={fitContainer:!1,fit(){this.rootSash.width=this.containerElement.clientWidth,this.rootSash.height=this.containerElement.clientHeight,this.update()},enableFitContainer(){new ResizeObserver(e=>{for(const t of e)t.target===this.containerElement&&this.fitContainer&&this.fit()}).observe(this.containerElement)}},ut={activeMuntinSash:null,isResizeStarted:!1,isDropStarted:!1,lastX:0,lastY:0,applyResizeStyles(){this.activeMuntinSash.domNode.hasAttribute("vertical")?document.body.classList.add("body--bw-resize-x"):this.activeMuntinSash.domNode.hasAttribute("horizontal")&&document.body.classList.add("body--bw-resize-y")},revertResizeStyles(){document.body.classList.remove("body--bw-resize-x"),document.body.classList.remove("body--bw-resize-y")},enableResize(){document.addEventListener("mousedown",e=>{if(e.target.tagName!=="BW-MUNTIN"||e.target.getAttribute("resizable")==="false")return;const t=e.target.getAttribute("sash-id");this.activeMuntinSash=this.rootSash.getById(t),this.activeMuntinSash&&(this.isResizeStarted=!0,this.lastX=e.pageX,this.lastY=e.pageY,this.applyResizeStyles())}),document.addEventListener("mousemove",e=>{if(!this.isResizeStarted||!this.activeMuntinSash)return;const[t,i,n,s]=this.activeMuntinSash.getChildren(),o=this.activeMuntinSash.isLeftRightSplit(),h=this.activeMuntinSash.isTopBottomSplit();if(o&&s&&i){const a=e.pageX-this.lastX,d=s.width+a,c=i.width-a;if(d<=s.calcMinWidth()||c<=i.calcMinWidth())return;s.width=d,i.width=c,i.left=i.left+a,this.update(),this.lastX=e.pageX}else if(h&&t&&n){const a=e.pageY-this.lastY,d=t.height+a,c=n.height-a;if(d<=t.calcMinHeight()||c<=n.calcMinHeight())return;t.height=d,n.height=c,n.top=n.top+a,this.update(),this.lastY=e.pageY}}),document.addEventListener("mouseup",()=>{this.isResizeStarted=!1,this.activeMuntinSash=null,this.revertResizeStyles()})}},gt={activeDropPaneEl:null,onPaneDrop(e,t){},enableDrop(){this.windowElement.addEventListener("dragover",e=>{e.preventDefault();const t=e.target.matches("bw-pane")?e.target:e.target.closest("bw-pane");if(!t||(t!==this.activeDropPaneEl&&(this.activeDropPaneEl&&this.activeDropPaneEl.removeAttribute("drop-area"),this.activeDropPaneEl=t),t.getAttribute("can-drop")==="false"))return;const i=J(t,e);t.setAttribute("drop-area",i)}),this.windowElement.addEventListener("dragleave",e=>{e.currentTarget.contains(e.relatedTarget)&&e.currentTarget!==e.relatedTarget||this.activeDropPaneEl&&(this.activeDropPaneEl.removeAttribute("drop-area"),this.activeDropPaneEl=null)}),this.windowElement.addEventListener("drop",e=>{if(!this.activeDropPaneEl||this.activeDropPaneEl.getAttribute("can-drop")==="false")return;const t=this.activeDropPaneEl.getAttribute("sash-id"),i=this.rootSash.getById(t);this.onPaneDrop(e,i),typeof i.store.onDrop=="function"&&i.store.onDrop(e,i),this.activeDropPaneEl.removeAttribute("drop-area"),this.activeDropPaneEl=null})}},ft=!0;class W{constructor(t){b(this,"windowElement",null),b(this,"containerElement",null),b(this,"debug",ft);let i=null;t instanceof it?(i=t,this.rootSash=t):(i=new et(t),this.rootSash=i.buildSashTree()),this.fitContainer=i.fitContainer}frame(t){this.containerElement=t,this.windowElement=this.createWindow(),this.glaze(),this.containerElement.append(this.windowElement)}enableFeatures(){this.enableResize(),this.enableDrop(),this.fitContainer&&this.enableFitContainer()}mount(t){this.frame(t),this.enableFeatures()}static assemble(...t){t.forEach(i=>{U(this.prototype,i)})}}W.assemble(dt,ct,lt,pt,gt,ut);function H(e){if(e.tagName==="BW-PANE")return e.getAttribute("sash-id");const t=e.closest("bw-pane");if(!t)throw new Error("[bwin] Pane element not found");return t.getAttribute("sash-id")}const wt={label:"",className:"bw-glass-action--close",onClick:(e,t)=>{const i=H(e.target);t.removePane(i)}},mt={label:"",className:"bw-glass-action--minimize",onClick:(e,t)=>{const i=t.sillElement;if(!i)throw new Error("[bwin] Sill element not found when minimizing");const n=C('<button class="bw-minimized-glass" />');i.append(n);const s=e.target.closest("bw-pane"),o=e.target.closest("bw-glass"),h=s.getAttribute("sash-id"),a=s.getAttribute("position");n.bwGlassElement=o,n.bwOriginalPosition=a,n.bwOriginalBoundingRect=A(s),t.removePane(h)}},bt={label:"",className:"bw-glass-action--maximize",onClick:e=>{const t=e.target.closest("bw-pane");t.hasAttribute("maximized")?(t.removeAttribute("maximized"),t.style.left=`${t.bwOriginalBoundingRect.left}px`,t.style.top=`${t.bwOriginalBoundingRect.top}px`,t.style.width=`${t.bwOriginalBoundingRect.width}px`,t.style.height=`${t.bwOriginalBoundingRect.height}px`):(t.setAttribute("maximized",""),t.bwOriginalBoundingRect=A(t),t.style.left="0",t.style.top="0",t.style.width="100%",t.style.height="100%")}};function yt(e,t){const i=e.left+e.width,n=e.top+e.height,s=t.left+t.width,o=t.top+t.height;if(e.left>=s||t.left>=i||e.top>=o||t.top>=n)return null;const h=Math.max(e.left,t.left),a=Math.max(e.top,t.top),d=Math.min(i,s),c=Math.min(n,o);return{left:h,top:a,width:d-h,height:c-a}}const B=[mt,bt,wt],Et={enableActions(){this.handleMinimizedGlassClick(),this.observeActionButtons()},restoreGlass(e){const t=e.bwOriginalBoundingRect;let i=0,n=null;if(this.windowElement.querySelectorAll("bw-pane").forEach(s=>{const o=A(s),h=yt(t,o);if(h){const a=h.width*h.height;a>i&&(i=a,n=s)}}),n){const s=e.bwOriginalPosition,o=A(n);let h=0;if(s===r.Left||s===r.Right)h=t.width>=o.width?o.width/2:t.width;else if(s===r.Top||s===r.Bottom)h=t.height>=o.height?o.height/2:t.height;else throw new Error("[bwin] Invalid position when restoring glass");this.addPane(n.getAttribute("sash-id"),{position:s,size:h}).domNode.append(e.bwGlassElement)}},handleMinimizedGlassClick(){this.sillElement.addEventListener("click",e=>{if(!e.target.matches(".bw-minimized-glass"))return;const t=e.target;this.restoreGlass(t),t.remove()})},updateDisabledStateOfActionButtons(){this.updateDisabledState(".bw-glass-action--close"),this.updateDisabledState(".bw-glass-action--minimize"),this.updateDisabledState(".bw-glass-action--maximize")},updateDisabledState(e){if(this.windowElement.querySelectorAll("bw-pane").length===1){const t=this.windowElement.querySelector(e);t&&t.setAttribute("disabled","")}else this.windowElement.querySelectorAll(e).forEach(t=>{t.removeAttribute("disabled")})},observeActionButtons(){this.updateDisabledStateOfActionButtons(),new MutationObserver(e=>{e.forEach(t=>{t.type==="childList"&&this.updateDisabledStateOfActionButtons()})}).observe(this.windowElement,{childList:!0})}},M={title:null,content:null,tabs:[],actions:void 0,draggable:!0};class G{constructor({title:t=M.title,content:i=M.content,tabs:n=M.tabs,actions:s=M.actions,draggable:o=M.draggable,sash:h,binaryWindow:a}){b(this,"domNode"),this.title=t,this.content=i,this.tabs=n,this.actions=s,this.sash=h,this.draggable=o,this.binaryWindow=a,this.build()}build(){const t=document.createElement("bw-glass-header");if(Array.isArray(this.tabs)&&this.tabs.length>0)t.append(this.createTabs());else if(this.title){const s=document.createElement("bw-glass-title");s.append(C(this.title)),t.append(s)}t.setAttribute("can-drag",this.draggable),t.append(this.createActions());const i=document.createElement("bw-glass-content"),n=C(this.content);n&&i.append(n),this.domNode=document.createElement("bw-glass"),this.domNode.append(t,i)}createTabs(){const t=document.createElement("bw-glass-tab-container");for(const i of this.tabs){const n=(i==null?void 0:i.label)??i,s=C(`<button class="bw-glass-tab">${n}</button>`);t.append(s)}return t}createActions(){const t=document.createElement("bw-glass-action-container"),i=this.actions===void 0?B:Array.isArray(this.actions)?this.actions:[];for(const n of i){const s=(n==null?void 0:n.label)??n,o=n.className?`bw-glass-action ${n.className}`:"bw-glass-action",h=C(`<button class="${o}">${s}</button>`);typeof n.onClick=="function"&&h.addEventListener("click",a=>{n.onClick(a,this.binaryWindow)}),t.append(h)}return t}get contentElement(){return this.domNode.querySelector("bw-glass-content")}get headerElement(){return this.domNode.querySelector("bw-glass-header")}}const vt={activeDragGlassEl:null,activeDragGlassPaneCanDrop:!1,onPaneDrop(e,t){if(!this.activeDragGlassEl)return;const i=this.activeDropPaneEl.getAttribute("drop-area");if(i==="center"){const n=this.activeDragGlassEl.closest("bw-pane"),s=this.activeDropPaneEl.getAttribute("can-drop")!=="false";_(n,this.activeDropPaneEl),n.setAttribute("can-drop",s);return}else{const n=H(this.activeDragGlassEl);this.addPane(t.id,{position:i}).domNode.append(this.activeDragGlassEl),this.removePane(n)}},enableDrag(){document.addEventListener("mousedown",e=>{if(e.button!==0||!e.target.matches("bw-glass-header"))return;if(e.target.getAttribute("can-drag")==="false"){e.preventDefault();return}const t=e.target.closest("bw-glass");t.setAttribute("draggable",!0),this.activeDragGlassEl=t}),document.addEventListener("mouseup",()=>{this.activeDragGlassEl&&(this.activeDragGlassEl.removeAttribute("draggable"),this.activeDragGlassEl=null)}),this.windowElement.addEventListener("dragstart",e=>{if(!(e.target instanceof HTMLElement)||!e.target.matches("bw-glass")||!this.activeDragGlassEl)return;e.dataTransfer.effectAllowed="move";const t=this.activeDragGlassEl.closest("bw-pane");this.activeDragGlassPaneCanDrop=t.getAttribute("can-drop")!=="false",t.setAttribute("can-drop",!1)}),this.windowElement.addEventListener("dragend",()=>{this.activeDragGlassEl&&(this.activeDragGlassEl.removeAttribute("draggable"),this.activeDragGlassEl.closest("bw-pane").setAttribute("can-drop",this.activeDragGlassPaneCanDrop),this.activeDragGlassEl=null)})}},Nt={trimMuntin(e){e.hasAttribute("vertical")?(e.style.top=`${parseFloat(e.style.top)+this.muntinSize/2}px`,e.style.height=`${parseFloat(e.style.height)-this.muntinSize}px`):e.hasAttribute("horizontal")&&(e.style.left=`${parseFloat(e.style.left)+this.muntinSize/2}px`,e.style.width=`${parseFloat(e.style.width)-this.muntinSize}px`)},onMuntinCreate(e){this.trimMuntin(e)},onMuntinUpdate(e){this.trimMuntin(e)}};class I extends W{constructor(){super(...arguments),b(this,"sillElement",null)}frame(){super.frame(...arguments);const t=C("<bw-sill />");this.windowElement.append(t),this.sillElement=t}enableFeatures(){super.enableFeatures(),this.enableDrag(),this.enableActions()}onPaneCreate(t,i){const n=new G({...i.store,sash:i,binaryWindow:this});t.innerHTML="",t.append(n.domNode),this.debug&&n.contentElement.prepend(`${i.id}`)}onPaneUpdate(){}addGlass(t,i,n){const s=this.addPane(t,{position:i}),o=new G({...n,sash:s,binaryWindow:this});s.domNode.append(o.domNode)}removeGlass(t,i){if(i)this.removePane(t);else{const n=this.rootSash.getById(t);if(!n)throw new Error("[bwin] Pane not found when removing glass");const s=n.domNode.querySelector("bw-glass");s&&s.remove()}}}I.assemble(vt,Nt,Et);const v=4;function zt({sash:e}){var l;const t=p.useRef(),i=e.leftChild,n=e.topChild;let s,o,h,a,d,c;return i?(s=v,o=e.height-v,h=e.top+v/2,a=e.left+i.width-v/2,d=!0):n&&(s=e.width-v,o=v,h=e.top+n.height-v/2,a=e.left+v/2,c=!0),p.useEffect(()=>{e.domNode=t.current},[]),p.createElement("bw-muntin",{"sash-id":e.id,style:{width:s,height:o,top:h,left:a},vertical:d,horizontal:c,resizable:((l=e.store)==null?void 0:l.resizable)===!1?"false":"true",ref:t})}function Ct({sash:e,bwin:t}){var l,u,g,w,m;const i=p.useRef(),{left:n,top:s,width:o,height:h,id:a,position:d}=e;p.useEffect(()=>{e.domNode=i.current},[]);const c=((l=e.store)==null?void 0:l.actions)===void 0?B:Array.isArray(e.store.actions)?e.store.actions:[];return p.createElement("bw-pane",{"sash-id":a,position:d,style:{left:n,top:s,width:o,height:h},"can-drop":((u=e.store)==null?void 0:u.droppable)===!1?"false":"true",ref:i},p.createElement("bw-glass",null,p.createElement("bw-glass-header",{"can-drag":((g=e.store)==null?void 0:g.draggable)===!1?"false":"true"},((w=e.store)==null?void 0:w.title)&&p.createElement("bw-glass-title",null,e.store.title),c.length>0&&p.createElement("bw-glass-action-container",null,c.map((x,Mt)=>{const At=x.className?`bw-glass-action ${x.className}`:"bw-glass-action";return p.createElement("button",{className:At,key:Mt,onClick:Pt=>x.onClick(Pt,t)},x.label)}))),p.createElement("bw-glass-content",null,(m=e.store)==null?void 0:m.content)))}const St=p.forwardRef((e,t)=>{const i=p.useRef(),n=p.useRef(),{panes:s,...o}=e,h={...o,children:s},a=new I(h),d=[],c=[];return a.rootSash.walk(l=>{l.children.length>0?d.push(l):c.push(l)}),p.useEffect(()=>{const l=i.current;l!=null&&l.parentElement&&(a.windowElement=l,a.containerElement=l.parentElement,a.sillElement=n.current,a.enableFeatures())},[]),p.useImperativeHandle(t,()=>({binaryWindow:a}),[]),p.createElement("bw-window",{"sash-id":a.rootSash.id,style:{width:a.rootSash.width,height:a.rootSash.height},ref:i},c.map(l=>p.createElement(Ct,{key:l.id,sash:l,bwin:a})),d.map(l=>p.createElement(zt,{key:l.id,sash:l})),p.createElement("bw-sill",{ref:n}))});y.BUILTIN_ACTIONS=B,y.Window=St,Object.defineProperty(y,Symbol.toStringTag,{value:"Module"})});
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "react-bwin",
3
3
  "description": "A tiling window manager in React based on Binary Window library",
4
- "version": "0.1.2",
4
+ "version": "0.2.0",
5
5
  "type": "module",
6
6
  "repository": {
7
7
  "type": "git",
@@ -45,10 +45,11 @@
45
45
  "@types/react": "^16.14.62",
46
46
  "@types/react-dom": "^16.9.24",
47
47
  "@vitejs/plugin-react": "^4.3.4",
48
- "bwin": "0.1.3",
48
+ "bwin": "0.1.5",
49
49
  "prettier": "^3.4.1",
50
50
  "react": "^16.14.0",
51
51
  "react-dom": "^16.14.0",
52
+ "react-router-dom": "^6.18.0",
52
53
  "typescript": "^5.6.2",
53
54
  "vite": "^6.0.1"
54
55
  }