@ai-matrx/summon 0.1.17 → 0.1.19
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.
- package/CHANGELOG.md +26 -1
- package/dist/chunk-server-C4KQZFIN.js +411 -0
- package/dist/chunk-server-C4KQZFIN.js.map +1 -0
- package/dist/chunk-server-H7NUWPEM.js +94 -0
- package/dist/chunk-server-H7NUWPEM.js.map +1 -0
- package/dist/chunk-server-WP7NOTZQ.js +208 -0
- package/dist/chunk-server-WP7NOTZQ.js.map +1 -0
- package/dist/dock.cjs +41 -112
- package/dist/dock.cjs.map +1 -1
- package/dist/dock.js +42 -113
- package/dist/dock.js.map +1 -1
- package/dist/handles.js +9 -272
- package/dist/handles.js.map +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +350 -810
- package/dist/index.js.map +1 -1
- package/dist/lite.cjs +16 -76
- package/dist/lite.cjs.map +1 -1
- package/dist/lite.js +17 -77
- package/dist/lite.js.map +1 -1
- package/dist/open.js +74 -439
- package/dist/open.js.map +1 -1
- package/dist/react.cjs +2 -2
- package/dist/react.cjs.map +1 -1
- package/dist/react.js +2 -2
- package/dist/react.js.map +1 -1
- package/dist/window.cjs +192 -287
- package/dist/window.cjs.map +1 -1
- package/dist/window.d.cts +3 -1
- package/dist/window.d.ts +3 -1
- package/dist/window.js +70 -165
- package/dist/window.js.map +1 -1
- package/package.json +4 -4
package/dist/window.cjs
CHANGED
|
@@ -100,14 +100,14 @@ __export(window_exports, {
|
|
|
100
100
|
module.exports = __toCommonJS(window_exports);
|
|
101
101
|
|
|
102
102
|
// src/window/WindowPanel.tsx
|
|
103
|
-
var
|
|
103
|
+
var import_react17 = __toESM(require("react"), 1);
|
|
104
104
|
var import_design_system7 = require("@ai-matrx/design-system");
|
|
105
105
|
var import_design_system8 = require("@ai-matrx/design-system");
|
|
106
106
|
var import_cn9 = require("@ai-matrx/design-system/cn");
|
|
107
107
|
var import_media_query = require("@ai-matrx/kit/media-query");
|
|
108
108
|
var import_react_dom3 = require("react-dom");
|
|
109
109
|
var import_summon10 = require("@ai-matrx/summon");
|
|
110
|
-
var
|
|
110
|
+
var import_react18 = require("@ai-matrx/summon/react");
|
|
111
111
|
|
|
112
112
|
// src/window/icons.tsx
|
|
113
113
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
@@ -132,39 +132,13 @@ function glyph(children) {
|
|
|
132
132
|
);
|
|
133
133
|
};
|
|
134
134
|
}
|
|
135
|
-
var XIcon = glyph(/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
136
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M18 6 6 18" }),
|
|
137
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m6 6 12 12" })
|
|
138
|
-
] }));
|
|
139
135
|
var MinusIcon = glyph(/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M5 12h14" }));
|
|
140
|
-
var Maximize2Icon = glyph(/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
141
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M15 3h6v6" }),
|
|
142
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m21 3-7 7" }),
|
|
143
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m3 21 7-7" }),
|
|
144
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M9 21H3v-6" })
|
|
145
|
-
] }));
|
|
146
|
-
var Minimize2Icon = glyph(/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
147
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m14 10 7-7" }),
|
|
148
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M20 10h-6V4" }),
|
|
149
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m3 21 7-7" }),
|
|
150
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M4 14h6v6" })
|
|
151
|
-
] }));
|
|
152
136
|
var RectangleVerticalIcon = glyph(/* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { width: "12", height: "20", x: "6", y: "2", rx: "2" }));
|
|
153
137
|
var PanelLeftCloseIcon = glyph(/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
154
138
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { width: "18", height: "18", x: "3", y: "3", rx: "2" }),
|
|
155
139
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M9 3v18" }),
|
|
156
140
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m16 15-3-3 3-3" })
|
|
157
141
|
] }));
|
|
158
|
-
var PanelLeftIcon = glyph(/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
159
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { width: "18", height: "18", x: "3", y: "3", rx: "2" }),
|
|
160
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M9 3v18" })
|
|
161
|
-
] }));
|
|
162
|
-
var AppWindowIcon = glyph(/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
163
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "2", y: "4", width: "20", height: "16", rx: "2" }),
|
|
164
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M10 4v4" }),
|
|
165
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M2 8h20" }),
|
|
166
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M6 4v4" })
|
|
167
|
-
] }));
|
|
168
142
|
var SaveIcon = glyph(
|
|
169
143
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
170
144
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M15.2 3a2 2 0 0 1 1.4.6l3.8 3.8a2 2 0 0 1 .6 1.4V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z" }),
|
|
@@ -172,19 +146,15 @@ var SaveIcon = glyph(
|
|
|
172
146
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M7 3v4a1 1 0 0 0 1 1h7" })
|
|
173
147
|
] })
|
|
174
148
|
);
|
|
175
|
-
var TriangleAlertIcon = glyph(
|
|
176
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
177
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }),
|
|
178
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12 9v4" }),
|
|
179
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12 17h.01" })
|
|
180
|
-
] })
|
|
181
|
-
);
|
|
182
149
|
var ArrowLeftToLineIcon = glyph(/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
183
150
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M3 19V5" }),
|
|
184
151
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m13 6-6 6 6 6" }),
|
|
185
152
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M7 12h14" })
|
|
186
153
|
] }));
|
|
187
154
|
|
|
155
|
+
// src/window/WindowPanel.tsx
|
|
156
|
+
var import_icons8 = require("@ai-matrx/design-system/icons");
|
|
157
|
+
|
|
188
158
|
// src/window/LayoutIcon.tsx
|
|
189
159
|
var import_cn = require("@ai-matrx/design-system/cn");
|
|
190
160
|
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
@@ -467,16 +437,6 @@ var MIN_WIDTH = 180;
|
|
|
467
437
|
var MIN_HEIGHT = 80;
|
|
468
438
|
var DEFAULT_WIDTH = 320;
|
|
469
439
|
var DEFAULT_HEIGHT = 400;
|
|
470
|
-
var RESIZE_CURSOR = {
|
|
471
|
-
e: "ew-resize",
|
|
472
|
-
w: "ew-resize",
|
|
473
|
-
n: "ns-resize",
|
|
474
|
-
s: "ns-resize",
|
|
475
|
-
se: "nwse-resize",
|
|
476
|
-
nw: "nwse-resize",
|
|
477
|
-
ne: "nesw-resize",
|
|
478
|
-
sw: "nesw-resize"
|
|
479
|
-
};
|
|
480
440
|
function resolveSize(value, fallback) {
|
|
481
441
|
if (value === void 0) return fallback;
|
|
482
442
|
if (typeof value === "number") return value;
|
|
@@ -674,86 +634,53 @@ function useWindowPanel(opts = {}) {
|
|
|
674
634
|
dispatch((0, import_summon.updateWindowTitle)({ id, title: opts.title }));
|
|
675
635
|
}
|
|
676
636
|
}, [id, opts.title, dispatch]);
|
|
677
|
-
const dragStart = (0, import_react.useRef)(null);
|
|
678
637
|
const onTriggerPopout = opts.onTriggerPopout;
|
|
679
638
|
const onTriggerPopoutRef = (0, import_react.useRef)(onTriggerPopout);
|
|
680
639
|
(0, import_react.useEffect)(() => {
|
|
681
640
|
onTriggerPopoutRef.current = onTriggerPopout;
|
|
682
641
|
}, [onTriggerPopout]);
|
|
642
|
+
const gestureRef = (0, import_react.useRef)(null);
|
|
643
|
+
(0, import_react.useEffect)(() => () => gestureRef.current?.cancel(), []);
|
|
683
644
|
const onDragStart = (0, import_react.useCallback)(
|
|
684
645
|
(e) => {
|
|
685
646
|
e.preventDefault();
|
|
686
647
|
dispatch((0, import_summon.focusWindow)(id));
|
|
687
648
|
if (!entry || entry.state === "maximized") return;
|
|
688
|
-
|
|
689
|
-
mx: e.clientX,
|
|
690
|
-
my: e.clientY,
|
|
691
|
-
wx: entry.windowed.x,
|
|
692
|
-
wy: entry.windowed.y
|
|
693
|
-
};
|
|
694
|
-
setIsInteracting(true);
|
|
695
|
-
const releaseCursor = (0, import_design_system.holdDragCursor)();
|
|
649
|
+
const origin = { x: entry.windowed.x, y: entry.windowed.y };
|
|
696
650
|
let dragOutState = INITIAL_DRAG_OUT_STATE;
|
|
697
|
-
let lastClientX = e.clientX;
|
|
698
|
-
let lastClientY = e.clientY;
|
|
699
651
|
const popoutEnabled = onTriggerPopoutRef.current !== void 0;
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
window.innerHeight,
|
|
714
|
-
performance.now()
|
|
715
|
-
);
|
|
716
|
-
if (result.state.isCandidate !== dragOutState.isCandidate) {
|
|
717
|
-
dispatch(
|
|
718
|
-
(0, import_summon.setPopoutCandidate)({ id: result.state.isCandidate ? id : null })
|
|
652
|
+
gestureRef.current?.cancel();
|
|
653
|
+
gestureRef.current = (0, import_design_system.startPointerDrag)(e, {
|
|
654
|
+
onStart: () => setIsInteracting(true),
|
|
655
|
+
onMove: ({ dx, dy }, ev) => {
|
|
656
|
+
dispatch((0, import_summon.updateWindowRect)({ id, rect: { x: origin.x + dx, y: origin.y + dy } }));
|
|
657
|
+
if (!popoutEnabled) return;
|
|
658
|
+
const result = evaluateDragOut(
|
|
659
|
+
{ clientX: ev.clientX, clientY: ev.clientY },
|
|
660
|
+
dragOutState,
|
|
661
|
+
DEFAULT_DRAG_OUT_CONFIG,
|
|
662
|
+
window.innerWidth,
|
|
663
|
+
window.innerHeight,
|
|
664
|
+
performance.now()
|
|
719
665
|
);
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
|
|
728
|
-
|
|
729
|
-
|
|
730
|
-
|
|
731
|
-
|
|
732
|
-
|
|
733
|
-
dispatch((0, import_summon.setPopoutCandidate)({ id: null }));
|
|
734
|
-
}
|
|
735
|
-
if (wasCandidate && onTriggerPopoutRef.current && entry) {
|
|
736
|
-
const lastRect = {
|
|
737
|
-
x: dragOrigin?.wx ?? entry.windowed.x,
|
|
738
|
-
y: dragOrigin?.wy ?? entry.windowed.y,
|
|
739
|
-
width: entry.windowed.width,
|
|
740
|
-
height: entry.windowed.height
|
|
741
|
-
};
|
|
742
|
-
onTriggerPopoutRef.current(lastRect);
|
|
743
|
-
} else {
|
|
744
|
-
const { vw, vh, degenerate } = (0, import_summon2.safeViewportDims)();
|
|
745
|
-
if (!degenerate) {
|
|
746
|
-
dispatch(
|
|
747
|
-
(0, import_summon.clampWindowRect)({ id, viewportWidth: vw, viewportHeight: vh })
|
|
748
|
-
);
|
|
666
|
+
if (result.state.isCandidate !== dragOutState.isCandidate) {
|
|
667
|
+
dispatch((0, import_summon.setPopoutCandidate)({ id: result.state.isCandidate ? id : null }));
|
|
668
|
+
}
|
|
669
|
+
dragOutState = result.state;
|
|
670
|
+
},
|
|
671
|
+
onEnd: () => {
|
|
672
|
+
gestureRef.current = null;
|
|
673
|
+
const wasCandidate = dragOutState.isCandidate;
|
|
674
|
+
setIsInteracting(false);
|
|
675
|
+
if (popoutEnabled && wasCandidate) dispatch((0, import_summon.setPopoutCandidate)({ id: null }));
|
|
676
|
+
if (wasCandidate && onTriggerPopoutRef.current) {
|
|
677
|
+
onTriggerPopoutRef.current({ x: origin.x, y: origin.y, width: entry.windowed.width, height: entry.windowed.height });
|
|
678
|
+
return;
|
|
749
679
|
}
|
|
680
|
+
const { vw, vh, degenerate } = (0, import_summon2.safeViewportDims)();
|
|
681
|
+
if (!degenerate) dispatch((0, import_summon.clampWindowRect)({ id, viewportWidth: vw, viewportHeight: vh }));
|
|
750
682
|
}
|
|
751
|
-
|
|
752
|
-
void lastClientY;
|
|
753
|
-
};
|
|
754
|
-
document.addEventListener("pointermove", onMove);
|
|
755
|
-
document.addEventListener("pointerup", onUp);
|
|
756
|
-
document.addEventListener("pointercancel", onUp);
|
|
683
|
+
});
|
|
757
684
|
},
|
|
758
685
|
[dispatch, id, entry]
|
|
759
686
|
);
|
|
@@ -763,44 +690,21 @@ function useWindowPanel(opts = {}) {
|
|
|
763
690
|
e.stopPropagation();
|
|
764
691
|
dispatch((0, import_summon.focusWindow)(id));
|
|
765
692
|
if (!entry || entry.state !== "windowed") return;
|
|
766
|
-
const
|
|
767
|
-
|
|
768
|
-
|
|
769
|
-
|
|
770
|
-
|
|
771
|
-
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
778
|
-
|
|
779
|
-
if (edge.includes("w")) {
|
|
780
|
-
nw = Math.min(maxWidth, Math.max(minWidth, width - dx));
|
|
781
|
-
nx = x + (width - nw);
|
|
782
|
-
}
|
|
783
|
-
if (edge.includes("n")) {
|
|
784
|
-
nh = Math.min(maxHeight, Math.max(minHeight, height - dy));
|
|
785
|
-
ny = y + (height - nh);
|
|
693
|
+
const origin = { ...entry.windowed };
|
|
694
|
+
gestureRef.current?.cancel();
|
|
695
|
+
gestureRef.current = (0, import_design_system.startPointerDrag)(e, {
|
|
696
|
+
// THE CURSOR LAW: the edge's resize cursor holds on <html> until release.
|
|
697
|
+
cursor: import_design_system.RESIZE_EDGE_CURSOR[edge],
|
|
698
|
+
onStart: () => setIsInteracting(true),
|
|
699
|
+
onMove: ({ dx, dy }) => {
|
|
700
|
+
const rect2 = (0, import_design_system.resizeRect)(origin, edge, dx, dy, { minWidth, minHeight, maxWidth, maxHeight });
|
|
701
|
+
dispatch((0, import_summon.updateWindowRect)({ id, rect: { x: rect2.x, y: rect2.y, width: rect2.width, height: rect2.height } }));
|
|
702
|
+
},
|
|
703
|
+
onEnd: () => {
|
|
704
|
+
gestureRef.current = null;
|
|
705
|
+
setIsInteracting(false);
|
|
786
706
|
}
|
|
787
|
-
|
|
788
|
-
(0, import_summon.updateWindowRect)({
|
|
789
|
-
id,
|
|
790
|
-
rect: { x: nx, y: ny, width: nw, height: nh }
|
|
791
|
-
})
|
|
792
|
-
);
|
|
793
|
-
};
|
|
794
|
-
const onUp = () => {
|
|
795
|
-
setIsInteracting(false);
|
|
796
|
-
releaseCursor();
|
|
797
|
-
document.removeEventListener("pointermove", onMove);
|
|
798
|
-
document.removeEventListener("pointerup", onUp);
|
|
799
|
-
document.removeEventListener("pointercancel", onUp);
|
|
800
|
-
};
|
|
801
|
-
document.addEventListener("pointermove", onMove);
|
|
802
|
-
document.addEventListener("pointerup", onUp);
|
|
803
|
-
document.addEventListener("pointercancel", onUp);
|
|
707
|
+
});
|
|
804
708
|
},
|
|
805
709
|
[dispatch, id, entry, minWidth, minHeight, maxWidth, maxHeight]
|
|
806
710
|
);
|
|
@@ -845,20 +749,15 @@ function useWindowPanel(opts = {}) {
|
|
|
845
749
|
};
|
|
846
750
|
}
|
|
847
751
|
|
|
848
|
-
// src/window/
|
|
849
|
-
var
|
|
850
|
-
var subscribe = () => () => {
|
|
851
|
-
};
|
|
852
|
-
function useIsClient() {
|
|
853
|
-
return (0, import_react3.useSyncExternalStore)(subscribe, () => true, () => false);
|
|
854
|
-
}
|
|
752
|
+
// src/window/WindowPanel.tsx
|
|
753
|
+
var import_client_lazy = require("@ai-matrx/kit/client-lazy");
|
|
855
754
|
|
|
856
755
|
// src/window/utils/useDebugFlag.ts
|
|
857
|
-
var
|
|
756
|
+
var import_react3 = require("react");
|
|
858
757
|
var noSubscribe = () => () => {
|
|
859
758
|
};
|
|
860
759
|
function useDebugFlag(debug) {
|
|
861
|
-
return (0,
|
|
760
|
+
return (0, import_react3.useSyncExternalStore)(
|
|
862
761
|
debug.subscribe ? (listener) => debug.subscribe?.(listener) ?? (() => {
|
|
863
762
|
}) : noSubscribe,
|
|
864
763
|
() => debug.enabled(),
|
|
@@ -867,7 +766,7 @@ function useDebugFlag(debug) {
|
|
|
867
766
|
}
|
|
868
767
|
|
|
869
768
|
// src/window/WindowPanel.tsx
|
|
870
|
-
var
|
|
769
|
+
var import_react19 = require("@ai-matrx/summon/react");
|
|
871
770
|
|
|
872
771
|
// src/window/utils/urlSyncIdentity.ts
|
|
873
772
|
function resolveWindowUrlSyncKey(registryKey, explicitKey) {
|
|
@@ -925,10 +824,11 @@ function sanitizeWindowData(value, allowedKeys) {
|
|
|
925
824
|
var import_window_host3 = require("@ai-matrx/summon/window-host");
|
|
926
825
|
|
|
927
826
|
// src/window/mobile/MobileDrawerSurface.tsx
|
|
928
|
-
var
|
|
827
|
+
var import_react4 = require("react");
|
|
929
828
|
var import_design_system2 = require("@ai-matrx/design-system");
|
|
930
829
|
var import_design_system3 = require("@ai-matrx/design-system");
|
|
931
830
|
var import_cn3 = require("@ai-matrx/design-system/cn");
|
|
831
|
+
var import_icons = require("@ai-matrx/design-system/icons");
|
|
932
832
|
|
|
933
833
|
// src/window/chrome/MobileTitleRow.tsx
|
|
934
834
|
var import_cn2 = require("@ai-matrx/design-system/cn");
|
|
@@ -1002,7 +902,7 @@ function MobileDrawerSurface({
|
|
|
1002
902
|
hideClose = false,
|
|
1003
903
|
sidebarAs = "drawer"
|
|
1004
904
|
}) {
|
|
1005
|
-
const [sidebarOpen, setSidebarOpen] = (0,
|
|
905
|
+
const [sidebarOpen, setSidebarOpen] = (0, import_react4.useState)(false);
|
|
1006
906
|
const hasSidebar = !!sidebar;
|
|
1007
907
|
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
1008
908
|
import_design_system2.Drawer,
|
|
@@ -1034,7 +934,7 @@ function MobileDrawerSurface({
|
|
|
1034
934
|
size: "icon",
|
|
1035
935
|
className: "h-8 w-8 shrink-0",
|
|
1036
936
|
"aria-label": "Close",
|
|
1037
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(XIcon, { className: "w-4 h-4" })
|
|
937
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_icons.XIcon, { className: "w-4 h-4" })
|
|
1038
938
|
}
|
|
1039
939
|
) }),
|
|
1040
940
|
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
@@ -1062,7 +962,7 @@ function MobileDrawerSurface({
|
|
|
1062
962
|
className: "h-8 w-8",
|
|
1063
963
|
"aria-label": sidebarOpen ? "Close sidebar" : "Open sidebar",
|
|
1064
964
|
onClick: () => setSidebarOpen((v) => !v),
|
|
1065
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(PanelLeftIcon, { className: "w-4 h-4" })
|
|
965
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_icons.PanelLeftIcon, { className: "w-4 h-4" })
|
|
1066
966
|
}
|
|
1067
967
|
)
|
|
1068
968
|
] }) : null
|
|
@@ -1104,7 +1004,7 @@ function MobileDrawerSurface({
|
|
|
1104
1004
|
size: "icon",
|
|
1105
1005
|
className: "h-8 w-8",
|
|
1106
1006
|
"aria-label": "Close sidebar",
|
|
1107
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(XIcon, { className: "w-4 h-4" })
|
|
1007
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_icons.XIcon, { className: "w-4 h-4" })
|
|
1108
1008
|
}
|
|
1109
1009
|
) })
|
|
1110
1010
|
] }),
|
|
@@ -1119,11 +1019,12 @@ function MobileDrawerSurface({
|
|
|
1119
1019
|
}
|
|
1120
1020
|
|
|
1121
1021
|
// src/window/mobile/MobileCardSurface.tsx
|
|
1122
|
-
var
|
|
1022
|
+
var import_react5 = require("react");
|
|
1123
1023
|
var import_react_dom = require("react-dom");
|
|
1124
1024
|
var import_design_system4 = require("@ai-matrx/design-system");
|
|
1125
1025
|
var import_design_system5 = require("@ai-matrx/design-system");
|
|
1126
1026
|
var import_cn4 = require("@ai-matrx/design-system/cn");
|
|
1027
|
+
var import_icons2 = require("@ai-matrx/design-system/icons");
|
|
1127
1028
|
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
1128
1029
|
function MobileCardSurface({
|
|
1129
1030
|
title,
|
|
@@ -1136,8 +1037,8 @@ function MobileCardSurface({
|
|
|
1136
1037
|
surfaceLayer,
|
|
1137
1038
|
maxHeight = "60dvh"
|
|
1138
1039
|
}) {
|
|
1139
|
-
const cardRef = (0,
|
|
1140
|
-
(0,
|
|
1040
|
+
const cardRef = (0, import_react5.useRef)(null);
|
|
1041
|
+
(0, import_react5.useEffect)(() => {
|
|
1141
1042
|
if (!isOpen) return void 0;
|
|
1142
1043
|
const onKey = (e) => {
|
|
1143
1044
|
if (e.key === "Escape" && !e.defaultPrevented) onClose();
|
|
@@ -1180,7 +1081,7 @@ function MobileCardSurface({
|
|
|
1180
1081
|
className: "h-11 w-11 shrink-0",
|
|
1181
1082
|
"aria-label": "Close",
|
|
1182
1083
|
onClick: onClose,
|
|
1183
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(XIcon, { className: "w-3.5 h-3.5" })
|
|
1084
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_icons2.XIcon, { className: "w-3.5 h-3.5" })
|
|
1184
1085
|
}
|
|
1185
1086
|
),
|
|
1186
1087
|
children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(MobileWindowTitle, { title })
|
|
@@ -1198,10 +1099,10 @@ function MobileCardSurface({
|
|
|
1198
1099
|
}
|
|
1199
1100
|
|
|
1200
1101
|
// src/window/chrome/DebugStrip.tsx
|
|
1201
|
-
var
|
|
1102
|
+
var import_react6 = require("react");
|
|
1202
1103
|
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
1203
1104
|
function DebugStrip({ rect, zIndex }) {
|
|
1204
|
-
const [vp, setVp] = (0,
|
|
1105
|
+
const [vp, setVp] = (0, import_react6.useState)(
|
|
1205
1106
|
() => typeof window === "undefined" ? { vw: 0, vh: 0, sw: 0, sh: 0, dpr: 1 } : {
|
|
1206
1107
|
vw: window.innerWidth,
|
|
1207
1108
|
vh: window.innerHeight,
|
|
@@ -1210,7 +1111,7 @@ function DebugStrip({ rect, zIndex }) {
|
|
|
1210
1111
|
dpr: window.devicePixelRatio ?? 1
|
|
1211
1112
|
}
|
|
1212
1113
|
);
|
|
1213
|
-
(0,
|
|
1114
|
+
(0, import_react6.useEffect)(() => {
|
|
1214
1115
|
const update = () => setVp({
|
|
1215
1116
|
vw: window.innerWidth,
|
|
1216
1117
|
vh: window.innerHeight,
|
|
@@ -1273,6 +1174,9 @@ function DebugStrip({ rect, zIndex }) {
|
|
|
1273
1174
|
] });
|
|
1274
1175
|
}
|
|
1275
1176
|
|
|
1177
|
+
// src/window/chrome/MobileHeader.tsx
|
|
1178
|
+
var import_icons4 = require("@ai-matrx/design-system/icons");
|
|
1179
|
+
|
|
1276
1180
|
// src/window/chrome/chromeClasses.ts
|
|
1277
1181
|
var import_cn5 = require("@ai-matrx/design-system/cn");
|
|
1278
1182
|
var WINDOW_CHROME_INTERACTIVE = "[&_button:not(:disabled)]:cursor-pointer [&_a]:cursor-pointer [&_[role=button]:not([aria-disabled=true])]:cursor-pointer [&_summary]:cursor-pointer [&_label:has(input,[role=checkbox],[role=radio])]:cursor-pointer";
|
|
@@ -1301,7 +1205,7 @@ function MobileWindowHeader({
|
|
|
1301
1205
|
className: "flex h-11 w-11 shrink-0 cursor-pointer items-center justify-center",
|
|
1302
1206
|
onClick: onClose,
|
|
1303
1207
|
"aria-label": "Close",
|
|
1304
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "flex h-6 w-6 items-center justify-center rounded-full matrx-window-light-close", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(XIcon, { className: "h-2.5 w-2.5 matrx-window-light-glyph" }) })
|
|
1208
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "flex h-6 w-6 items-center justify-center rounded-full matrx-window-light-close", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_icons4.XIcon, { className: "h-2.5 w-2.5 matrx-window-light-glyph" }) })
|
|
1305
1209
|
}
|
|
1306
1210
|
),
|
|
1307
1211
|
onMinimize && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
@@ -1334,7 +1238,8 @@ function MobileWindowHeader({
|
|
|
1334
1238
|
}
|
|
1335
1239
|
|
|
1336
1240
|
// src/window/chrome/DeprecationBanner.tsx
|
|
1337
|
-
var
|
|
1241
|
+
var import_react7 = require("react");
|
|
1242
|
+
var import_icons5 = require("@ai-matrx/design-system/icons");
|
|
1338
1243
|
var import_cn6 = require("@ai-matrx/design-system/cn");
|
|
1339
1244
|
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
1340
1245
|
function DeprecationBanner({
|
|
@@ -1342,7 +1247,7 @@ function DeprecationBanner({
|
|
|
1342
1247
|
note,
|
|
1343
1248
|
className
|
|
1344
1249
|
}) {
|
|
1345
|
-
const [dismissed, setDismissed] = (0,
|
|
1250
|
+
const [dismissed, setDismissed] = (0, import_react7.useState)(false);
|
|
1346
1251
|
if (dismissed) return null;
|
|
1347
1252
|
const message = note ?? (replacedBy ? `Deprecated \u2014 moved to "${replacedBy}". This window will be removed soon.` : "Deprecated \u2014 this window will be removed soon.");
|
|
1348
1253
|
return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
|
|
@@ -1353,7 +1258,7 @@ function DeprecationBanner({
|
|
|
1353
1258
|
className
|
|
1354
1259
|
),
|
|
1355
1260
|
children: [
|
|
1356
|
-
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
1261
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_icons5.AlertTriangleIcon, { className: "w-3.5 h-3.5 mt-[1px] shrink-0" }),
|
|
1357
1262
|
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "flex-1 break-words", children: message }),
|
|
1358
1263
|
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
1359
1264
|
"button",
|
|
@@ -1362,7 +1267,7 @@ function DeprecationBanner({
|
|
|
1362
1267
|
"aria-label": "Dismiss deprecation notice",
|
|
1363
1268
|
className: "shrink-0 rounded hover:bg-destructive/20 p-0.5 transition-colors",
|
|
1364
1269
|
onClick: () => setDismissed(true),
|
|
1365
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(XIcon, { className: "w-3 h-3" })
|
|
1270
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_icons5.XIcon, { className: "w-3 h-3" })
|
|
1366
1271
|
}
|
|
1367
1272
|
)
|
|
1368
1273
|
]
|
|
@@ -1429,12 +1334,12 @@ function supportsAnyPopout() {
|
|
|
1429
1334
|
}
|
|
1430
1335
|
|
|
1431
1336
|
// src/window/popout/usePopoutWindow.ts
|
|
1432
|
-
var
|
|
1433
|
-
var
|
|
1337
|
+
var import_react9 = require("react");
|
|
1338
|
+
var import_react10 = require("@ai-matrx/summon/react");
|
|
1434
1339
|
var import_summon3 = require("@ai-matrx/summon");
|
|
1435
1340
|
|
|
1436
1341
|
// src/window/popout/popoutWindowMap.ts
|
|
1437
|
-
var
|
|
1342
|
+
var import_react8 = require("react");
|
|
1438
1343
|
var import_global_slot3 = require("@ai-matrx/kit/global-slot");
|
|
1439
1344
|
var slot = () => (0, import_global_slot3.globalSlot)("ai-matrx.summon.window.popoutWindows", () => ({ map: /* @__PURE__ */ new Map(), listeners: /* @__PURE__ */ new Set() }));
|
|
1440
1345
|
function notify() {
|
|
@@ -1467,7 +1372,7 @@ function subscribePopoutWindowMap(listener) {
|
|
|
1467
1372
|
};
|
|
1468
1373
|
}
|
|
1469
1374
|
function usePopoutWindowRef(id) {
|
|
1470
|
-
return (0,
|
|
1375
|
+
return (0, import_react8.useSyncExternalStore)(
|
|
1471
1376
|
subscribePopoutWindowMap,
|
|
1472
1377
|
() => getPopoutWindow(id),
|
|
1473
1378
|
// SSR snapshot — popouts are never present during SSR.
|
|
@@ -1721,12 +1626,12 @@ function clearAllPopoutPending() {
|
|
|
1721
1626
|
var import_summon4 = require("@ai-matrx/summon");
|
|
1722
1627
|
var import_outbound = require("@ai-matrx/kit/outbound");
|
|
1723
1628
|
function usePopoutWindow(windowId) {
|
|
1724
|
-
const dispatch = (0,
|
|
1725
|
-
const { notify: notify3 } = (0,
|
|
1726
|
-
const popoutMode = (0,
|
|
1727
|
-
const activePipWindowId = (0,
|
|
1728
|
-
const stylesDisposeRef = (0,
|
|
1729
|
-
const handleClose = (0,
|
|
1629
|
+
const dispatch = (0, import_react10.useSummonDispatch)();
|
|
1630
|
+
const { notify: notify3 } = (0, import_react10.useSummonPorts)();
|
|
1631
|
+
const popoutMode = (0, import_react10.useSummonSelector)((0, import_summon3.selectPopoutMode)(windowId));
|
|
1632
|
+
const activePipWindowId = (0, import_react10.useSummonSelector)(import_summon3.selectActivePipWindowId);
|
|
1633
|
+
const stylesDisposeRef = (0, import_react9.useRef)(null);
|
|
1634
|
+
const handleClose = (0, import_react9.useCallback)(() => {
|
|
1730
1635
|
const win = getPopoutWindow(windowId);
|
|
1731
1636
|
if (!win && process.env.NODE_ENV !== "production") {
|
|
1732
1637
|
}
|
|
@@ -1743,7 +1648,7 @@ function usePopoutWindow(windowId) {
|
|
|
1743
1648
|
console.info(`[popout] closed window for "${windowId}"`);
|
|
1744
1649
|
}
|
|
1745
1650
|
}, [dispatch, windowId]);
|
|
1746
|
-
const openPopout = (0,
|
|
1651
|
+
const openPopout = (0, import_react9.useCallback)(
|
|
1747
1652
|
async (opts) => {
|
|
1748
1653
|
const capability = detectPopoutCapability();
|
|
1749
1654
|
if (capability === "none") {
|
|
@@ -1812,7 +1717,7 @@ function usePopoutWindow(windowId) {
|
|
|
1812
1717
|
},
|
|
1813
1718
|
[activePipWindowId, dispatch, handleClose, notify3, windowId]
|
|
1814
1719
|
);
|
|
1815
|
-
const close = (0,
|
|
1720
|
+
const close = (0, import_react9.useCallback)(() => {
|
|
1816
1721
|
const win = getPopoutWindow(windowId);
|
|
1817
1722
|
if (!win) {
|
|
1818
1723
|
dispatch((0, import_summon3.dockWindow)((0, import_summon4.buildDockWindowPayload)(windowId)));
|
|
@@ -1824,7 +1729,7 @@ function usePopoutWindow(windowId) {
|
|
|
1824
1729
|
handleClose();
|
|
1825
1730
|
}
|
|
1826
1731
|
}, [dispatch, handleClose, windowId]);
|
|
1827
|
-
(0,
|
|
1732
|
+
(0, import_react9.useEffect)(() => {
|
|
1828
1733
|
if (popoutMode === null && getPopoutWindow(windowId) !== null) {
|
|
1829
1734
|
try {
|
|
1830
1735
|
getPopoutWindow(windowId)?.close();
|
|
@@ -1833,7 +1738,7 @@ function usePopoutWindow(windowId) {
|
|
|
1833
1738
|
}
|
|
1834
1739
|
}
|
|
1835
1740
|
}, [popoutMode, windowId, handleClose]);
|
|
1836
|
-
(0,
|
|
1741
|
+
(0, import_react9.useEffect)(() => {
|
|
1837
1742
|
const onBeforeUnload = () => {
|
|
1838
1743
|
try {
|
|
1839
1744
|
getPopoutWindow(windowId)?.close();
|
|
@@ -1849,8 +1754,8 @@ function usePopoutWindow(windowId) {
|
|
|
1849
1754
|
}
|
|
1850
1755
|
|
|
1851
1756
|
// src/window/popout/usePopoutControl.ts
|
|
1852
|
-
var
|
|
1853
|
-
var
|
|
1757
|
+
var import_react11 = require("react");
|
|
1758
|
+
var import_react12 = require("@ai-matrx/summon/react");
|
|
1854
1759
|
var import_summon5 = require("@ai-matrx/summon");
|
|
1855
1760
|
var import_summon6 = require("@ai-matrx/summon");
|
|
1856
1761
|
var import_global_slot4 = require("@ai-matrx/kit/global-slot");
|
|
@@ -1867,8 +1772,8 @@ function getPopoutOpener(windowId) {
|
|
|
1867
1772
|
return openers().get(windowId) ?? null;
|
|
1868
1773
|
}
|
|
1869
1774
|
function usePopoutControl() {
|
|
1870
|
-
const dispatch = (0,
|
|
1871
|
-
const popOut = (0,
|
|
1775
|
+
const dispatch = (0, import_react12.useSummonDispatch)();
|
|
1776
|
+
const popOut = (0, import_react11.useCallback)(
|
|
1872
1777
|
async (windowId, opts) => {
|
|
1873
1778
|
const opener = getPopoutOpener(windowId);
|
|
1874
1779
|
if (!opener) {
|
|
@@ -1878,7 +1783,7 @@ function usePopoutControl() {
|
|
|
1878
1783
|
},
|
|
1879
1784
|
[]
|
|
1880
1785
|
);
|
|
1881
|
-
const dock = (0,
|
|
1786
|
+
const dock = (0, import_react11.useCallback)(
|
|
1882
1787
|
(windowId) => {
|
|
1883
1788
|
const payload = (0, import_summon6.buildDockWindowPayload)(windowId);
|
|
1884
1789
|
dispatch((0, import_summon5.dockWindow)(payload));
|
|
@@ -1897,11 +1802,11 @@ function buildPopoutOpts(rect, opts) {
|
|
|
1897
1802
|
|
|
1898
1803
|
// src/window/popout/PopoutPortal.tsx
|
|
1899
1804
|
var import_react_dom2 = require("react-dom");
|
|
1900
|
-
var
|
|
1805
|
+
var import_react14 = require("@ai-matrx/summon/react");
|
|
1901
1806
|
var import_summon7 = require("@ai-matrx/summon");
|
|
1902
1807
|
|
|
1903
1808
|
// src/window/popout/PopoutShell.tsx
|
|
1904
|
-
var
|
|
1809
|
+
var import_react13 = require("react");
|
|
1905
1810
|
var import_design_system6 = require("@ai-matrx/design-system");
|
|
1906
1811
|
var import_window_host = require("@ai-matrx/summon/window-host");
|
|
1907
1812
|
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
@@ -1910,7 +1815,7 @@ function PopoutShell({
|
|
|
1910
1815
|
mode,
|
|
1911
1816
|
children
|
|
1912
1817
|
}) {
|
|
1913
|
-
const value = (0,
|
|
1818
|
+
const value = (0, import_react13.useMemo)(
|
|
1914
1819
|
() => ({
|
|
1915
1820
|
popoutDocument: popoutWindow.document,
|
|
1916
1821
|
popoutWindow,
|
|
@@ -1926,7 +1831,7 @@ function PopoutShell({
|
|
|
1926
1831
|
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
1927
1832
|
function PopoutPortal({ windowId, children }) {
|
|
1928
1833
|
const popoutWin = usePopoutWindowRef(windowId);
|
|
1929
|
-
const popoutMode = (0,
|
|
1834
|
+
const popoutMode = (0, import_react14.useSummonSelector)((0, import_summon7.selectPopoutMode)(windowId));
|
|
1930
1835
|
if (!popoutWin || popoutMode === null) return null;
|
|
1931
1836
|
return (0, import_react_dom2.createPortal)(
|
|
1932
1837
|
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(PopoutShell, { popoutWindow: popoutWin, mode: popoutMode, children }),
|
|
@@ -2052,16 +1957,16 @@ async function isFlatImage(blob) {
|
|
|
2052
1957
|
var import_summon9 = require("@ai-matrx/summon");
|
|
2053
1958
|
|
|
2054
1959
|
// src/window/tray/TrayChipPreview.tsx
|
|
2055
|
-
var
|
|
1960
|
+
var import_react15 = require("react");
|
|
2056
1961
|
var import_cn8 = require("@ai-matrx/design-system/cn");
|
|
2057
1962
|
var import_summon8 = require("@ai-matrx/summon");
|
|
2058
|
-
var
|
|
1963
|
+
var import_react16 = require("@ai-matrx/summon/react");
|
|
2059
1964
|
var import_window_host2 = require("@ai-matrx/summon/window-host");
|
|
2060
1965
|
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
2061
1966
|
function isPlainRecord(value) {
|
|
2062
1967
|
return typeof value === "object" && value !== null && !Array.isArray(value);
|
|
2063
1968
|
}
|
|
2064
|
-
var TrayChipPreview = (0,
|
|
1969
|
+
var TrayChipPreview = (0, import_react15.memo)(function TrayChipPreview2({
|
|
2065
1970
|
registryKey,
|
|
2066
1971
|
snapshotKey,
|
|
2067
1972
|
overlayInstanceId = import_summon8.DEFAULT_INSTANCE_ID,
|
|
@@ -2070,9 +1975,9 @@ var TrayChipPreview = (0, import_react16.memo)(function TrayChipPreview2({
|
|
|
2070
1975
|
}) {
|
|
2071
1976
|
const meta = (0, import_summon8.getOverlayMeta)(registryKey);
|
|
2072
1977
|
const { Preview } = (0, import_window_host2.getTrayPreviewEntry)(registryKey);
|
|
2073
|
-
const ports = (0,
|
|
2074
|
-
const overlayData = (0,
|
|
2075
|
-
const collectedData = (0,
|
|
1978
|
+
const ports = (0, import_react16.useSummonPorts)();
|
|
1979
|
+
const overlayData = (0, import_react16.useSummonSelector)((state2) => meta ? (0, import_summon8.selectOverlayData)(state2, meta.id, overlayInstanceId) : null);
|
|
1980
|
+
const collectedData = (0, import_react16.useSummonSelector)((state2) => state2.windowManager.windows[snapshotKey]?.persistence?.data);
|
|
2076
1981
|
const registryLabel = meta?.label ?? null;
|
|
2077
1982
|
const fallback = /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(TraySnapshotImage, { snapshotKey, registryLabel, title });
|
|
2078
1983
|
if (Preview) {
|
|
@@ -2093,7 +1998,7 @@ var TrayChipPreview = (0, import_react16.memo)(function TrayChipPreview2({
|
|
|
2093
1998
|
}
|
|
2094
1999
|
return fallback;
|
|
2095
2000
|
});
|
|
2096
|
-
var PreviewBoundary = class extends
|
|
2001
|
+
var PreviewBoundary = class extends import_react15.Component {
|
|
2097
2002
|
state = { failed: false };
|
|
2098
2003
|
static getDerivedStateFromError() {
|
|
2099
2004
|
return { failed: true };
|
|
@@ -2105,7 +2010,7 @@ var PreviewBoundary = class extends import_react16.Component {
|
|
|
2105
2010
|
return this.state.failed ? this.props.fallback : this.props.children;
|
|
2106
2011
|
}
|
|
2107
2012
|
};
|
|
2108
|
-
var DefaultTrayChipBody = (0,
|
|
2013
|
+
var DefaultTrayChipBody = (0, import_react15.memo)(function DefaultTrayChipBody2({ label }) {
|
|
2109
2014
|
return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex flex-1 flex-col justify-between overflow-hidden bg-gradient-to-br from-muted/45 via-background to-primary/5 px-3 py-2.5", children: [
|
|
2110
2015
|
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex min-w-0 items-center gap-2.5", children: [
|
|
2111
2016
|
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
|
|
@@ -2128,12 +2033,12 @@ var DefaultTrayChipBody = (0, import_react16.memo)(function DefaultTrayChipBody2
|
|
|
2128
2033
|
] })
|
|
2129
2034
|
] });
|
|
2130
2035
|
});
|
|
2131
|
-
var TraySnapshotImage = (0,
|
|
2036
|
+
var TraySnapshotImage = (0, import_react15.memo)(function TraySnapshotImage2({
|
|
2132
2037
|
snapshotKey,
|
|
2133
2038
|
registryLabel,
|
|
2134
2039
|
title
|
|
2135
2040
|
}) {
|
|
2136
|
-
const snapshot = (0,
|
|
2041
|
+
const snapshot = (0, import_react15.useSyncExternalStore)(
|
|
2137
2042
|
subscribeTraySnapshotMap,
|
|
2138
2043
|
() => getTraySnapshot(snapshotKey),
|
|
2139
2044
|
() => null
|
|
@@ -2305,25 +2210,25 @@ function WindowPanel({
|
|
|
2305
2210
|
hidePopOutButton = false,
|
|
2306
2211
|
...hookOpts
|
|
2307
2212
|
}) {
|
|
2308
|
-
const instance = (0,
|
|
2213
|
+
const instance = (0, import_react18.useOptionalOverlayInstance)();
|
|
2309
2214
|
const instanceMatches = instance !== null && (boundToOverlay === true || instance.overlayId === overlayIdProp);
|
|
2310
2215
|
const overlayId = overlayIdProp ?? (boundToOverlay && instance ? instance.overlayId : void 0);
|
|
2311
2216
|
const overlayInstanceId = overlayInstanceIdProp ?? (instanceMatches ? instance.instanceId : void 0);
|
|
2312
|
-
const ports = (0,
|
|
2217
|
+
const ports = (0, import_react18.useSummonPorts)();
|
|
2313
2218
|
const windowConfig = (0, import_window_host3.useWindowConfig)();
|
|
2314
|
-
const reactId = (0,
|
|
2219
|
+
const reactId = (0, import_react17.useId)();
|
|
2315
2220
|
const id = hookOpts.id ?? reactId;
|
|
2316
2221
|
const trayRegistryKey = overlayId ?? id;
|
|
2317
2222
|
const isMobile = (0, import_media_query.useIsMobile)();
|
|
2318
2223
|
const surfaceLayerAttrs = surfaceLayer ? { "data-surface-layer": surfaceLayer } : void 0;
|
|
2319
|
-
const isMounted = useIsClient();
|
|
2224
|
+
const isMounted = (0, import_client_lazy.useIsClient)();
|
|
2320
2225
|
const registryMeta = overlayId ? (0, import_summon10.getOverlayMeta)(overlayId) : void 0;
|
|
2321
2226
|
const registryEntry = registryMeta?.window;
|
|
2322
2227
|
const effectiveInstanceId = overlayInstanceId ?? import_summon10.DEFAULT_INSTANCE_ID;
|
|
2323
|
-
const [autoOpened] = (0,
|
|
2228
|
+
const [autoOpened] = (0, import_react17.useState)(
|
|
2324
2229
|
() => Boolean(overlayId) && isAutoOpened(overlayId, effectiveInstanceId)
|
|
2325
2230
|
);
|
|
2326
|
-
(0,
|
|
2231
|
+
(0, import_react17.useEffect)(() => {
|
|
2327
2232
|
if (!overlayId) return void 0;
|
|
2328
2233
|
let timer;
|
|
2329
2234
|
return () => {
|
|
@@ -2337,16 +2242,16 @@ function WindowPanel({
|
|
|
2337
2242
|
const preservationEnabled = Boolean(
|
|
2338
2243
|
overlayId && registryEntry?.preservation && !registryEntry.ephemeral && (registryMeta?.instance !== "multi" || overlayInstanceId)
|
|
2339
2244
|
);
|
|
2340
|
-
const overlayLaunchData = (0,
|
|
2245
|
+
const overlayLaunchData = (0, import_react18.useSummonSelector)(
|
|
2341
2246
|
(state2) => overlayId ? (0, import_summon10.selectOverlayData)(state2, overlayId, effectiveInstanceId) : null
|
|
2342
2247
|
);
|
|
2343
2248
|
const initialPreservationData = registryEntry?.preservation ? sanitizeWindowData(overlayLaunchData, registryEntry.preservation.dataKeys) : {};
|
|
2344
2249
|
const popoutCapability = isMounted ? detectPopoutCapability() : null;
|
|
2345
2250
|
const popout = usePopoutWindow(id);
|
|
2346
|
-
(0,
|
|
2251
|
+
(0, import_react17.useEffect)(() => {
|
|
2347
2252
|
return registerPopoutOpener(id, popout.openPopout);
|
|
2348
2253
|
}, [id, popout.openPopout]);
|
|
2349
|
-
const handleDragOutPopout = (0,
|
|
2254
|
+
const handleDragOutPopout = (0, import_react17.useCallback)(
|
|
2350
2255
|
(draggedRect) => {
|
|
2351
2256
|
void popout.openPopout({
|
|
2352
2257
|
width: draggedRect.width,
|
|
@@ -2357,7 +2262,7 @@ function WindowPanel({
|
|
|
2357
2262
|
[popout, title]
|
|
2358
2263
|
);
|
|
2359
2264
|
const onTriggerPopout = !isMobile && popoutCapability !== "none" ? handleDragOutPopout : void 0;
|
|
2360
|
-
const autoDispatch = (0,
|
|
2265
|
+
const autoDispatch = (0, import_react18.useSummonDispatch)();
|
|
2361
2266
|
const {
|
|
2362
2267
|
windowState,
|
|
2363
2268
|
rect,
|
|
@@ -2395,10 +2300,10 @@ function WindowPanel({
|
|
|
2395
2300
|
});
|
|
2396
2301
|
const liftedZIndex = (0, import_design_system7.useFloatingLayerZIndex)(managerZIndex);
|
|
2397
2302
|
const zIndex = windowState === "minimized" ? Math.max(liftedZIndex, MINIMIZED_TILE_Z_FLOOR + managerZIndex) : liftedZIndex;
|
|
2398
|
-
const dispatch = (0,
|
|
2399
|
-
const windowsHidden = (0,
|
|
2303
|
+
const dispatch = (0, import_react18.useSummonDispatch)();
|
|
2304
|
+
const windowsHidden = (0, import_react18.useSummonSelector)(import_summon10.selectWindowsHidden);
|
|
2400
2305
|
const isDebugMode = useDebugFlag(ports.debug);
|
|
2401
|
-
(0,
|
|
2306
|
+
(0, import_react17.useEffect)(() => {
|
|
2402
2307
|
(0, import_design_system7.announceLayerFront)(
|
|
2403
2308
|
document.querySelector(`[data-window-id="${CSS.escape(id)}"]`)
|
|
2404
2309
|
);
|
|
@@ -2406,26 +2311,26 @@ function WindowPanel({
|
|
|
2406
2311
|
const claimFront = (event) => {
|
|
2407
2312
|
(0, import_design_system7.announceLayerFront)(event.currentTarget.closest("[data-window-id]") ?? event.currentTarget);
|
|
2408
2313
|
};
|
|
2409
|
-
const allWindows = (0,
|
|
2314
|
+
const allWindows = (0, import_react18.useSummonSelector)(import_summon10.selectAllWindows);
|
|
2410
2315
|
const isTopWindow = !isMobile ? true : allWindows.find((w) => w.state !== "minimized")?.id === id;
|
|
2411
|
-
const [activePaneMobile, setActivePaneMobile] = (0,
|
|
2316
|
+
const [activePaneMobile, setActivePaneMobile] = (0, import_react17.useState)(
|
|
2412
2317
|
"main"
|
|
2413
2318
|
);
|
|
2414
2319
|
const effectiveUrlSyncKey = resolveWindowUrlSyncKey(registryMeta?.link?.key, urlSyncKey);
|
|
2415
2320
|
const effectiveUrlSyncId = urlSyncId ?? (effectiveUrlSyncKey ? overlayId : void 0);
|
|
2416
|
-
(0,
|
|
2321
|
+
(0, import_react19.useOverlayLink)(effectiveUrlSyncKey, effectiveUrlSyncId, urlSyncArgs);
|
|
2417
2322
|
const deprecation = registryEntry?.deprecated;
|
|
2418
2323
|
const isDeprecated = !!deprecation;
|
|
2419
2324
|
const deprecatedRingClass = isDeprecated ? "ring-2 ring-destructive ring-offset-2 ring-offset-background" : "";
|
|
2420
2325
|
const hasSidebar = !!sidebar;
|
|
2421
|
-
const [sidebarOpen, setSidebarOpen] = (0,
|
|
2422
|
-
const [sidebarSize, setSidebarSize] = (0,
|
|
2326
|
+
const [sidebarOpen, setSidebarOpen] = (0, import_react17.useState)(defaultSidebarOpen);
|
|
2327
|
+
const [sidebarSize, setSidebarSize] = (0, import_react17.useState)(
|
|
2423
2328
|
sidebarDefaultSize
|
|
2424
2329
|
);
|
|
2425
|
-
const restoredPersistence = (0,
|
|
2426
|
-
const sidebarPanelRef = (0,
|
|
2427
|
-
const restoredChromeAppliedRef = (0,
|
|
2428
|
-
const handleSaveWindowState = (0,
|
|
2330
|
+
const restoredPersistence = (0, import_react18.useSummonSelector)((0, import_summon10.selectWindowPersistence)(id));
|
|
2331
|
+
const sidebarPanelRef = (0, import_react17.useRef)(null);
|
|
2332
|
+
const restoredChromeAppliedRef = (0, import_react17.useRef)(false);
|
|
2333
|
+
const handleSaveWindowState = (0, import_react17.useCallback)(() => {
|
|
2429
2334
|
if (!overlayId || !preservationEnabled || !registryEntry?.preservation) {
|
|
2430
2335
|
return;
|
|
2431
2336
|
}
|
|
@@ -2457,15 +2362,15 @@ function WindowPanel({
|
|
|
2457
2362
|
ports,
|
|
2458
2363
|
dispatch
|
|
2459
2364
|
]);
|
|
2460
|
-
const saveRef = (0,
|
|
2461
|
-
(0,
|
|
2365
|
+
const saveRef = (0, import_react17.useRef)(handleSaveWindowState);
|
|
2366
|
+
(0, import_react17.useEffect)(() => {
|
|
2462
2367
|
saveRef.current = handleSaveWindowState;
|
|
2463
2368
|
}, [handleSaveWindowState]);
|
|
2464
|
-
(0,
|
|
2369
|
+
(0, import_react17.useEffect)(() => {
|
|
2465
2370
|
if (!preservationEnabled) return;
|
|
2466
2371
|
saveRef.current();
|
|
2467
2372
|
}, [preservationEnabled, overlayLaunchData, onCollectData]);
|
|
2468
|
-
const handleClose = (0,
|
|
2373
|
+
const handleClose = (0, import_react17.useCallback)(() => {
|
|
2469
2374
|
if (instanceMatches && instance && instance.overlayId === overlayId) {
|
|
2470
2375
|
instance.close();
|
|
2471
2376
|
} else if (boundToOverlay) {
|
|
@@ -2480,7 +2385,7 @@ function WindowPanel({
|
|
|
2480
2385
|
}
|
|
2481
2386
|
onClose?.();
|
|
2482
2387
|
}, [boundToOverlay, dispatch, effectiveInstanceId, id, instance, instanceMatches, onClose, overlayId, overlayInstanceId, ports, registryMeta?.instance]);
|
|
2483
|
-
(0,
|
|
2388
|
+
(0, import_react17.useEffect)(() => {
|
|
2484
2389
|
if (!closeOnEscape || isMobile) return void 0;
|
|
2485
2390
|
const onKey = (e) => {
|
|
2486
2391
|
if (e.key !== "Escape" || e.defaultPrevented) return;
|
|
@@ -2507,7 +2412,7 @@ function WindowPanel({
|
|
|
2507
2412
|
document.addEventListener("keydown", onKey);
|
|
2508
2413
|
return () => document.removeEventListener("keydown", onKey);
|
|
2509
2414
|
}, [closeOnEscape, isMobile, id, handleClose, windowConfig.escapeYieldSelector]);
|
|
2510
|
-
(0,
|
|
2415
|
+
(0, import_react17.useEffect)(() => {
|
|
2511
2416
|
if (!restoredPersistence || restoredChromeAppliedRef.current) return;
|
|
2512
2417
|
restoredChromeAppliedRef.current = true;
|
|
2513
2418
|
setSidebarOpen(restoredPersistence.sidebarOpen);
|
|
@@ -2518,20 +2423,20 @@ function WindowPanel({
|
|
|
2518
2423
|
sidebarPanelRef.current?.resize(restoredPersistence.sidebarSize);
|
|
2519
2424
|
}
|
|
2520
2425
|
}, [restoredPersistence]);
|
|
2521
|
-
const [fitContentEl, fitContentRef] = (0,
|
|
2522
|
-
const fitContentStore = (0,
|
|
2523
|
-
const fitPlacedRef = (0,
|
|
2524
|
-
const [glideReady, setGlideReady] = (0,
|
|
2525
|
-
(0,
|
|
2426
|
+
const [fitContentEl, fitContentRef] = (0, import_react17.useState)(null);
|
|
2427
|
+
const fitContentStore = (0, import_react18.useSummonStore)();
|
|
2428
|
+
const fitPlacedRef = (0, import_react17.useRef)(false);
|
|
2429
|
+
const [glideReady, setGlideReady] = (0, import_react17.useState)(false);
|
|
2430
|
+
(0, import_react17.useEffect)(() => {
|
|
2526
2431
|
const timer = window.setTimeout(() => setGlideReady(true), GLIDE_SETTLE_MS);
|
|
2527
2432
|
return () => window.clearTimeout(timer);
|
|
2528
2433
|
}, []);
|
|
2529
|
-
(0,
|
|
2434
|
+
(0, import_react17.useEffect)(() => {
|
|
2530
2435
|
if (isInteracting) fitPlacedRef.current = true;
|
|
2531
2436
|
}, [isInteracting]);
|
|
2532
2437
|
const fitPresetPosition = hookOpts.position;
|
|
2533
2438
|
const fitMayReplace = hookOpts.initialRect?.x === void 0 && hookOpts.initialRect?.y === void 0;
|
|
2534
|
-
(0,
|
|
2439
|
+
(0, import_react17.useEffect)(() => {
|
|
2535
2440
|
if (!fitContent || isMobile || windowState !== "windowed") return void 0;
|
|
2536
2441
|
const el2 = fitContentEl;
|
|
2537
2442
|
if (!el2) return void 0;
|
|
@@ -2563,7 +2468,7 @@ function WindowPanel({
|
|
|
2563
2468
|
ro.disconnect();
|
|
2564
2469
|
};
|
|
2565
2470
|
}, [fitContent, fitContentEl, isMobile, windowState, id, dispatch, fitContentStore, fitPresetPosition, fitMayReplace]);
|
|
2566
|
-
const toggleSidebar = (0,
|
|
2471
|
+
const toggleSidebar = (0, import_react17.useCallback)(() => {
|
|
2567
2472
|
const panel = sidebarPanelRef.current;
|
|
2568
2473
|
if (!panel) return;
|
|
2569
2474
|
if (sidebarOpen) {
|
|
@@ -2599,7 +2504,7 @@ function WindowPanel({
|
|
|
2599
2504
|
id,
|
|
2600
2505
|
rect.width
|
|
2601
2506
|
]);
|
|
2602
|
-
const handleSidebarResize = (0,
|
|
2507
|
+
const handleSidebarResize = (0, import_react17.useCallback)(
|
|
2603
2508
|
(panelSize) => {
|
|
2604
2509
|
setSidebarOpen(panelSize.asPercentage > 0);
|
|
2605
2510
|
if (panelSize.inPixels > 0) setSidebarSize(panelSize.inPixels);
|
|
@@ -2616,20 +2521,20 @@ function WindowPanel({
|
|
|
2616
2521
|
[dispatch, id, preservationEnabled, sidebarSize]
|
|
2617
2522
|
);
|
|
2618
2523
|
const portalTarget = isMounted ? document.body : null;
|
|
2619
|
-
const [bodyHost] = (0,
|
|
2524
|
+
const [bodyHost] = (0, import_react17.useState)(() => {
|
|
2620
2525
|
if (typeof document === "undefined") return null;
|
|
2621
2526
|
const host = document.createElement("div");
|
|
2622
2527
|
host.className = "matrx-window-body-host";
|
|
2623
2528
|
host.setAttribute("data-window-body-host", "");
|
|
2624
2529
|
return host;
|
|
2625
2530
|
});
|
|
2626
|
-
(0,
|
|
2531
|
+
(0, import_react17.useEffect)(() => {
|
|
2627
2532
|
if (!overlayId) return void 0;
|
|
2628
2533
|
(0, import_summon10.ackOverlayRender)(overlayId, id);
|
|
2629
2534
|
return () => (0, import_summon10.clearOverlayRender)(overlayId, id);
|
|
2630
2535
|
}, [overlayId, id]);
|
|
2631
2536
|
const resolvedActionsRight = actionsRight ?? actions ?? null;
|
|
2632
|
-
const snapLeft = (0,
|
|
2537
|
+
const snapLeft = (0, import_react17.useCallback)(() => {
|
|
2633
2538
|
const { vw, vh } = (0, import_summon10.safeViewportDims)();
|
|
2634
2539
|
dispatch(
|
|
2635
2540
|
(0, import_summon10.updateWindowRect)({
|
|
@@ -2638,7 +2543,7 @@ function WindowPanel({
|
|
|
2638
2543
|
})
|
|
2639
2544
|
);
|
|
2640
2545
|
}, [dispatch, id]);
|
|
2641
|
-
const snapRight = (0,
|
|
2546
|
+
const snapRight = (0, import_react17.useCallback)(() => {
|
|
2642
2547
|
const { vw, vh } = (0, import_summon10.safeViewportDims)();
|
|
2643
2548
|
const half = Math.round(vw / 2);
|
|
2644
2549
|
dispatch(
|
|
@@ -2648,7 +2553,7 @@ function WindowPanel({
|
|
|
2648
2553
|
})
|
|
2649
2554
|
);
|
|
2650
2555
|
}, [dispatch, id]);
|
|
2651
|
-
const snapTop = (0,
|
|
2556
|
+
const snapTop = (0, import_react17.useCallback)(() => {
|
|
2652
2557
|
const { vw, vh } = (0, import_summon10.safeViewportDims)();
|
|
2653
2558
|
dispatch(
|
|
2654
2559
|
(0, import_summon10.updateWindowRect)({
|
|
@@ -2657,7 +2562,7 @@ function WindowPanel({
|
|
|
2657
2562
|
})
|
|
2658
2563
|
);
|
|
2659
2564
|
}, [dispatch, id]);
|
|
2660
|
-
const snapBottom = (0,
|
|
2565
|
+
const snapBottom = (0, import_react17.useCallback)(() => {
|
|
2661
2566
|
const { vw, vh } = (0, import_summon10.safeViewportDims)();
|
|
2662
2567
|
const half = Math.round(vh / 2);
|
|
2663
2568
|
dispatch(
|
|
@@ -2667,7 +2572,7 @@ function WindowPanel({
|
|
|
2667
2572
|
})
|
|
2668
2573
|
);
|
|
2669
2574
|
}, [dispatch, id]);
|
|
2670
|
-
const snapCentre = (0,
|
|
2575
|
+
const snapCentre = (0, import_react17.useCallback)(() => {
|
|
2671
2576
|
const { vw, vh } = (0, import_summon10.safeViewportDims)();
|
|
2672
2577
|
const w = Math.min(rect.width, vw);
|
|
2673
2578
|
const h = Math.min(rect.height, vh);
|
|
@@ -2683,7 +2588,7 @@ function WindowPanel({
|
|
|
2683
2588
|
})
|
|
2684
2589
|
);
|
|
2685
2590
|
}, [dispatch, id, rect.width, rect.height]);
|
|
2686
|
-
const arrangeAll = (0,
|
|
2591
|
+
const arrangeAll = (0, import_react17.useCallback)(
|
|
2687
2592
|
(layout) => {
|
|
2688
2593
|
const { vw, vh } = (0, import_summon10.safeViewportDims)();
|
|
2689
2594
|
dispatch(
|
|
@@ -2696,36 +2601,36 @@ function WindowPanel({
|
|
|
2696
2601
|
},
|
|
2697
2602
|
[dispatch]
|
|
2698
2603
|
);
|
|
2699
|
-
const popoutMode = (0,
|
|
2604
|
+
const popoutMode = (0, import_react18.useSummonSelector)((0, import_summon10.selectPopoutMode)(id));
|
|
2700
2605
|
const outerPopout = (0, import_window_host4.usePopout)();
|
|
2701
2606
|
const outerPortalContainer = (0, import_design_system7.usePortalContainer)();
|
|
2702
2607
|
const popoutWin = usePopoutWindowRef(id);
|
|
2703
2608
|
const ownPopout = popoutMode !== null && popoutWin !== null;
|
|
2704
|
-
const bodyPopoutValue =
|
|
2609
|
+
const bodyPopoutValue = import_react17.default.useMemo(
|
|
2705
2610
|
() => ownPopout && popoutWin ? { popoutDocument: popoutWin.document, popoutWindow: popoutWin, popoutContainer: popoutWin.document.body, mode: popoutMode } : outerPopout,
|
|
2706
2611
|
[ownPopout, popoutWin, popoutMode, outerPopout]
|
|
2707
2612
|
);
|
|
2708
2613
|
const bodyPortalContainer = ownPopout && popoutWin ? popoutWin.document.body : outerPortalContainer;
|
|
2709
|
-
const popoutCandidateId = (0,
|
|
2614
|
+
const popoutCandidateId = (0, import_react18.useSummonSelector)(import_summon10.selectPopoutCandidateId);
|
|
2710
2615
|
const canShowPopOut = !hidePopOutButton && !isMobile && popoutCapability !== "none" && windowState !== "minimized" && popoutMode === null;
|
|
2711
|
-
const handlePopOut = (0,
|
|
2616
|
+
const handlePopOut = (0, import_react17.useCallback)(() => {
|
|
2712
2617
|
void popout.openPopout({
|
|
2713
2618
|
width: rect.width,
|
|
2714
2619
|
height: rect.height,
|
|
2715
2620
|
title: typeof title === "string" ? title : "Window"
|
|
2716
2621
|
});
|
|
2717
2622
|
}, [popout, rect.width, rect.height, title]);
|
|
2718
|
-
const handleDockBack = (0,
|
|
2623
|
+
const handleDockBack = (0, import_react17.useCallback)(() => {
|
|
2719
2624
|
dispatch((0, import_summon10.dockWindow)((0, import_summon10.buildDockWindowPayload)(id)));
|
|
2720
2625
|
}, [dispatch, id]);
|
|
2721
|
-
const bodyRef = (0,
|
|
2722
|
-
const retainedBodyDimensionsRef = (0,
|
|
2723
|
-
const captureGenerationRef = (0,
|
|
2626
|
+
const bodyRef = (0, import_react17.useRef)(null);
|
|
2627
|
+
const retainedBodyDimensionsRef = (0, import_react17.useRef)(null);
|
|
2628
|
+
const captureGenerationRef = (0, import_react17.useRef)(0);
|
|
2724
2629
|
const trayPreviewEntry = (0, import_window_host5.getTrayPreviewEntry)(trayRegistryKey);
|
|
2725
2630
|
const effectiveTrayCapture = captureTraySnapshot ?? trayPreviewEntry.captureTraySnapshot ?? (trayPreviewEntry.Preview ? void 0 : defaultTraySnapshotCapture);
|
|
2726
|
-
const [pendingTrayCapture, setPendingTrayCapture] = (0,
|
|
2727
|
-
const [trayPreviewData, setTrayPreviewData] = (0,
|
|
2728
|
-
const handleMinimize = (0,
|
|
2631
|
+
const [pendingTrayCapture, setPendingTrayCapture] = (0, import_react17.useState)(null);
|
|
2632
|
+
const [trayPreviewData, setTrayPreviewData] = (0, import_react17.useState)(void 0);
|
|
2633
|
+
const handleMinimize = (0, import_react17.useCallback)(() => {
|
|
2729
2634
|
let collected;
|
|
2730
2635
|
try {
|
|
2731
2636
|
collected = onCollectData?.();
|
|
@@ -2765,7 +2670,7 @@ function WindowPanel({
|
|
|
2765
2670
|
preservationEnabled,
|
|
2766
2671
|
trayRegistryKey
|
|
2767
2672
|
]);
|
|
2768
|
-
(0,
|
|
2673
|
+
(0, import_react17.useEffect)(() => {
|
|
2769
2674
|
if (windowState !== "minimized" || !pendingTrayCapture) return void 0;
|
|
2770
2675
|
const bodyEl = bodyRef.current;
|
|
2771
2676
|
if (!bodyEl) {
|
|
@@ -2797,20 +2702,20 @@ function WindowPanel({
|
|
|
2797
2702
|
if (timeoutId) clearTimeout(timeoutId);
|
|
2798
2703
|
};
|
|
2799
2704
|
}, [id, pendingTrayCapture, ports, windowState]);
|
|
2800
|
-
const handleRestoreClearingSnapshot = (0,
|
|
2705
|
+
const handleRestoreClearingSnapshot = (0, import_react17.useCallback)(() => {
|
|
2801
2706
|
captureGenerationRef.current += 1;
|
|
2802
2707
|
setPendingTrayCapture(null);
|
|
2803
2708
|
clearTraySnapshot(id);
|
|
2804
2709
|
onRestore();
|
|
2805
2710
|
}, [id, onRestore]);
|
|
2806
|
-
(0,
|
|
2711
|
+
(0, import_react17.useEffect)(() => {
|
|
2807
2712
|
return () => {
|
|
2808
2713
|
captureGenerationRef.current += 1;
|
|
2809
2714
|
clearTraySnapshot(id);
|
|
2810
2715
|
};
|
|
2811
2716
|
}, [id]);
|
|
2812
|
-
const previousTrayStateRef = (0,
|
|
2813
|
-
(0,
|
|
2717
|
+
const previousTrayStateRef = (0, import_react17.useRef)(windowState);
|
|
2718
|
+
(0, import_react17.useEffect)(() => {
|
|
2814
2719
|
const wasMinimized = previousTrayStateRef.current === "minimized";
|
|
2815
2720
|
previousTrayStateRef.current = windowState;
|
|
2816
2721
|
if (!wasMinimized || windowState === "minimized") return;
|
|
@@ -2822,9 +2727,9 @@ function WindowPanel({
|
|
|
2822
2727
|
);
|
|
2823
2728
|
});
|
|
2824
2729
|
}, [id, windowState]);
|
|
2825
|
-
const prevStateRef = (0,
|
|
2826
|
-
const prevPopoutModeRef = (0,
|
|
2827
|
-
(0,
|
|
2730
|
+
const prevStateRef = (0, import_react17.useRef)(windowState);
|
|
2731
|
+
const prevPopoutModeRef = (0, import_react17.useRef)(popoutMode);
|
|
2732
|
+
(0, import_react17.useEffect)(() => {
|
|
2828
2733
|
const wasNonWindowed = prevStateRef.current !== "windowed" || prevPopoutModeRef.current !== null;
|
|
2829
2734
|
const isNowWindowed = windowState === "windowed" && popoutMode === null;
|
|
2830
2735
|
prevStateRef.current = windowState;
|
|
@@ -2838,7 +2743,7 @@ function WindowPanel({
|
|
|
2838
2743
|
const isMinimized = windowState === "minimized";
|
|
2839
2744
|
const isMaximized = windowState === "maximized";
|
|
2840
2745
|
const isPopoutCandidate = popoutCandidateId === id;
|
|
2841
|
-
(0,
|
|
2746
|
+
(0, import_react17.useEffect)(() => {
|
|
2842
2747
|
if (!isMobile || !isMinimized) return;
|
|
2843
2748
|
let cancelled = false;
|
|
2844
2749
|
queueMicrotask(() => {
|
|
@@ -3190,8 +3095,8 @@ function WindowPanel({
|
|
|
3190
3095
|
] });
|
|
3191
3096
|
}
|
|
3192
3097
|
function BodyMount({ host }) {
|
|
3193
|
-
const slotRef = (0,
|
|
3194
|
-
(0,
|
|
3098
|
+
const slotRef = (0, import_react17.useRef)(null);
|
|
3099
|
+
(0, import_react17.useLayoutEffect)(() => {
|
|
3195
3100
|
const slot2 = slotRef.current;
|
|
3196
3101
|
if (!slot2 || !host) return void 0;
|
|
3197
3102
|
slot2.appendChild(host);
|
|
@@ -3211,7 +3116,7 @@ function PopOutHeaderButton({ onClick }) {
|
|
|
3211
3116
|
onPointerDown: (e) => e.stopPropagation(),
|
|
3212
3117
|
title: "Pop out into a separate window",
|
|
3213
3118
|
"aria-label": "Pop out into a separate window",
|
|
3214
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(AppWindowIcon, { className: "w-3.5 h-3.5" })
|
|
3119
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_icons8.AppWindowIcon, { className: "w-3.5 h-3.5" })
|
|
3215
3120
|
}
|
|
3216
3121
|
);
|
|
3217
3122
|
}
|
|
@@ -3369,7 +3274,7 @@ function TrafficLightGroup({
|
|
|
3369
3274
|
TrafficLight,
|
|
3370
3275
|
{
|
|
3371
3276
|
color: "red",
|
|
3372
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(XIcon, { className: "w-2 h-2 matrx-window-light-glyph" }),
|
|
3277
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_icons8.XIcon, { className: "w-2 h-2 matrx-window-light-glyph" }),
|
|
3373
3278
|
onClick: onClose ?? void 0,
|
|
3374
3279
|
disabled: !onClose,
|
|
3375
3280
|
"aria-label": "Close"
|
|
@@ -3380,7 +3285,7 @@ function TrafficLightGroup({
|
|
|
3380
3285
|
{
|
|
3381
3286
|
color: "yellow",
|
|
3382
3287
|
icon: isMinimized ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
3383
|
-
Maximize2Icon,
|
|
3288
|
+
import_icons8.Maximize2Icon,
|
|
3384
3289
|
{
|
|
3385
3290
|
className: "w-2 h-2 matrx-window-light-glyph"
|
|
3386
3291
|
}
|
|
@@ -3418,7 +3323,7 @@ function TrafficLightGroup({
|
|
|
3418
3323
|
onClick: onToggleSidebar,
|
|
3419
3324
|
title: sidebarOpen ? "Hide sidebar" : "Show sidebar",
|
|
3420
3325
|
"aria-label": sidebarOpen ? "Hide sidebar" : "Show sidebar",
|
|
3421
|
-
children: sidebarOpen ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(PanelLeftCloseIcon, { className: "w-3.5 h-3.5" }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(PanelLeftIcon, { className: "w-3.5 h-3.5" })
|
|
3326
|
+
children: sidebarOpen ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(PanelLeftCloseIcon, { className: "w-3.5 h-3.5" }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_icons8.PanelLeftIcon, { className: "w-3.5 h-3.5" })
|
|
3422
3327
|
}
|
|
3423
3328
|
)
|
|
3424
3329
|
] });
|
|
@@ -3467,9 +3372,9 @@ function GreenTrafficLight({
|
|
|
3467
3372
|
onSaveWindowState,
|
|
3468
3373
|
onPopOut
|
|
3469
3374
|
}) {
|
|
3470
|
-
const [dropdownOpen, setDropdownOpen] = (0,
|
|
3471
|
-
const leaveTimer = (0,
|
|
3472
|
-
const containerRef = (0,
|
|
3375
|
+
const [dropdownOpen, setDropdownOpen] = (0, import_react17.useState)(false);
|
|
3376
|
+
const leaveTimer = (0, import_react17.useRef)(null);
|
|
3377
|
+
const containerRef = (0, import_react17.useRef)(null);
|
|
3473
3378
|
const openDropdown = () => {
|
|
3474
3379
|
if (leaveTimer.current) clearTimeout(leaveTimer.current);
|
|
3475
3380
|
setDropdownOpen(true);
|
|
@@ -3483,7 +3388,7 @@ function GreenTrafficLight({
|
|
|
3483
3388
|
fn();
|
|
3484
3389
|
setDropdownOpen(false);
|
|
3485
3390
|
};
|
|
3486
|
-
(0,
|
|
3391
|
+
(0, import_react17.useEffect)(() => {
|
|
3487
3392
|
if (!dropdownOpen) return void 0;
|
|
3488
3393
|
const onPointerOutside = (e) => {
|
|
3489
3394
|
const target = e.target;
|
|
@@ -3521,12 +3426,12 @@ function GreenTrafficLight({
|
|
|
3521
3426
|
onPointerDown: (e) => e.stopPropagation(),
|
|
3522
3427
|
"aria-label": isMaximized ? "Restore" : "Maximize",
|
|
3523
3428
|
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "opacity-0 group-hover/tl:opacity-100 transition-opacity duration-100 flex items-center justify-center relative w-full h-full", children: isMaximized ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
3524
|
-
Minimize2Icon,
|
|
3429
|
+
import_icons8.Minimize2Icon,
|
|
3525
3430
|
{
|
|
3526
3431
|
className: "w-2 h-2 matrx-window-light-glyph absolute"
|
|
3527
3432
|
}
|
|
3528
3433
|
) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
3529
|
-
Maximize2Icon,
|
|
3434
|
+
import_icons8.Maximize2Icon,
|
|
3530
3435
|
{
|
|
3531
3436
|
className: "w-2 h-2 matrx-window-light-glyph absolute"
|
|
3532
3437
|
}
|
|
@@ -3706,7 +3611,7 @@ function GreenTrafficLight({
|
|
|
3706
3611
|
onClick: () => handleAction(onToggleMaximize),
|
|
3707
3612
|
onPointerDown: (e) => e.stopPropagation(),
|
|
3708
3613
|
children: isMaximized ? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
|
|
3709
|
-
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Minimize2Icon, { className: "w-3.5 h-3.5 shrink-0" }),
|
|
3614
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_icons8.Minimize2Icon, { className: "w-3.5 h-3.5 shrink-0" }),
|
|
3710
3615
|
" Exit Full Screen"
|
|
3711
3616
|
] }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
|
|
3712
3617
|
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(RectangleVerticalIcon, { className: "w-3.5 h-3.5 shrink-0" }),
|
|
@@ -3722,7 +3627,7 @@ function GreenTrafficLight({
|
|
|
3722
3627
|
onClick: () => handleAction(onRestore),
|
|
3723
3628
|
onPointerDown: (e) => e.stopPropagation(),
|
|
3724
3629
|
children: [
|
|
3725
|
-
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Maximize2Icon, { className: "w-3.5 h-3.5 shrink-0" }),
|
|
3630
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_icons8.Maximize2Icon, { className: "w-3.5 h-3.5 shrink-0" }),
|
|
3726
3631
|
"Restore window"
|
|
3727
3632
|
]
|
|
3728
3633
|
}
|
|
@@ -3738,7 +3643,7 @@ function GreenTrafficLight({
|
|
|
3738
3643
|
onPointerDown: (e) => e.stopPropagation(),
|
|
3739
3644
|
title: "Pop out into a separate window",
|
|
3740
3645
|
children: [
|
|
3741
|
-
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(AppWindowIcon, { className: "w-3.5 h-3.5 shrink-0" }),
|
|
3646
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_icons8.AppWindowIcon, { className: "w-3.5 h-3.5 shrink-0" }),
|
|
3742
3647
|
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "flex-1 text-left", children: "Pop out" })
|
|
3743
3648
|
]
|
|
3744
3649
|
}
|