@gfazioli/mantine-window 1.2.1 → 2.0.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.
- package/README.md +22 -11
- package/dist/cjs/LayoutIcons.cjs +118 -0
- package/dist/cjs/LayoutIcons.cjs.map +1 -0
- package/dist/cjs/Window.cjs +112 -7
- package/dist/cjs/Window.cjs.map +1 -1
- package/dist/cjs/Window.module.css.cjs +1 -1
- package/dist/cjs/WindowGroup.cjs +195 -0
- package/dist/cjs/WindowGroup.cjs.map +1 -0
- package/dist/cjs/WindowGroup.context.cjs +10 -0
- package/dist/cjs/WindowGroup.context.cjs.map +1 -0
- package/dist/cjs/hooks/use-mantine-window.cjs +181 -36
- package/dist/cjs/hooks/use-mantine-window.cjs.map +1 -1
- package/dist/cjs/hooks/use-responsive-value.cjs +21 -0
- package/dist/cjs/hooks/use-responsive-value.cjs.map +1 -0
- package/dist/cjs/hooks/use-window-state.cjs +142 -64
- package/dist/cjs/hooks/use-window-state.cjs.map +1 -1
- package/dist/cjs/index.cjs +4 -0
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/esm/LayoutIcons.mjs +109 -0
- package/dist/esm/LayoutIcons.mjs.map +1 -0
- package/dist/esm/Window.mjs +113 -8
- package/dist/esm/Window.mjs.map +1 -1
- package/dist/esm/Window.module.css.mjs +1 -1
- package/dist/esm/WindowGroup.context.mjs +7 -0
- package/dist/esm/WindowGroup.context.mjs.map +1 -0
- package/dist/esm/WindowGroup.mjs +193 -0
- package/dist/esm/WindowGroup.mjs.map +1 -0
- package/dist/esm/hooks/use-mantine-window.mjs +183 -38
- package/dist/esm/hooks/use-mantine-window.mjs.map +1 -1
- package/dist/esm/hooks/use-responsive-value.mjs +19 -0
- package/dist/esm/hooks/use-responsive-value.mjs.map +1 -0
- package/dist/esm/hooks/use-window-state.mjs +143 -65
- package/dist/esm/hooks/use-window-state.mjs.map +1 -1
- package/dist/esm/index.mjs +2 -0
- package/dist/esm/index.mjs.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/styles.layer.css +1 -1
- package/dist/types/LayoutIcons.d.ts +21 -0
- package/dist/types/Window.d.ts +59 -30
- package/dist/types/WindowGroup.context.d.ts +59 -0
- package/dist/types/WindowGroup.d.ts +30 -0
- package/dist/types/hooks/use-mantine-window.d.ts +3 -0
- package/dist/types/hooks/use-responsive-value.d.ts +3 -0
- package/dist/types/hooks/use-window-state.d.ts +17 -5
- package/dist/types/index.d.mts +5 -0
- package/dist/types/index.d.ts +5 -0
- package/package.json +11 -5
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Mantine Window Component
|
|
2
2
|
|
|
3
|
-
<img alt="Mantine Window" src="https://github.com/gfazioli/mantine-window/blob/master/logo.
|
|
3
|
+
<img alt="Mantine Window" src="https://github.com/gfazioli/mantine-window/blob/master/logo.jpeg" />
|
|
4
4
|
|
|
5
5
|
<div align="center">
|
|
6
6
|
|
|
@@ -19,11 +19,24 @@
|
|
|
19
19
|
|
|
20
20
|
This component is created on top of the [Mantine](https://mantine.dev/) library.
|
|
21
21
|
|
|
22
|
-
[Mantine Window](https://gfazioli.github.io/mantine-window/) is a versatile UI container that brings a familiar desktop‑like window experience to React applications built with Mantine.
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
22
|
+
[Mantine Window](https://gfazioli.github.io/mantine-window/) is a versatile UI container that brings a familiar desktop‑like window experience to React applications built with Mantine.
|
|
23
|
+
|
|
24
|
+
## Features
|
|
25
|
+
|
|
26
|
+
- Draggable and resizable floating windows with 8-direction resize handles
|
|
27
|
+
- Portal or container-relative positioning (`withinPortal`)
|
|
28
|
+
- Controlled and uncontrolled position/size with mixed unit support (px, vw/vh, %)
|
|
29
|
+
- Responsive values via Mantine breakpoints for all dimension props
|
|
30
|
+
- Persistent state via localStorage (position, size, collapse state)
|
|
31
|
+
- Configurable drag boundaries to constrain movement
|
|
32
|
+
- Min/max size constraints with multi-unit support
|
|
33
|
+
- Collapsible content with double-click header toggle
|
|
34
|
+
- Z-index management with bring-to-front on interaction
|
|
35
|
+
- `Window.Group` compound component for coordinated multi-window management
|
|
36
|
+
- Layout presets: snap, tile, columns, rows, fill
|
|
37
|
+
- Full Mantine Styles API support with fine-grained classNames
|
|
38
|
+
- SSR-safe with hydration-compatible viewport unit resolution
|
|
39
|
+
- `onPositionChange` and `onSizeChange` callbacks
|
|
27
40
|
|
|
28
41
|
> [!note]
|
|
29
42
|
>
|
|
@@ -54,11 +67,9 @@ import { Title } from '@mantine/core';
|
|
|
54
67
|
|
|
55
68
|
function Demo() {
|
|
56
69
|
return (
|
|
57
|
-
<
|
|
58
|
-
<
|
|
59
|
-
|
|
60
|
-
</Window>
|
|
61
|
-
</Stack>
|
|
70
|
+
<Window title="Hello World" opened defaultX={50} defaultY={50} defaultWidth={400} defaultHeight={300}>
|
|
71
|
+
<Title order={4}>This is a window</Title>
|
|
72
|
+
</Window>
|
|
62
73
|
);
|
|
63
74
|
}
|
|
64
75
|
```
|
|
@@ -0,0 +1,118 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
var React = require('react');
|
|
5
|
+
|
|
6
|
+
const VW = 36;
|
|
7
|
+
const VH = 28;
|
|
8
|
+
const R = 4;
|
|
9
|
+
const IR = 2;
|
|
10
|
+
const BX = 3;
|
|
11
|
+
const BY = 3;
|
|
12
|
+
const BW = VW - BX * 2;
|
|
13
|
+
const BH = VH - BY * 2;
|
|
14
|
+
const PAD = 3;
|
|
15
|
+
const GAP = 2;
|
|
16
|
+
const IX = BX + PAD;
|
|
17
|
+
const IY = BY + PAD;
|
|
18
|
+
const FULL_W = BW - PAD * 2;
|
|
19
|
+
const FULL_H = BH - PAD * 2;
|
|
20
|
+
const HALF_W = (FULL_W - GAP) / 2;
|
|
21
|
+
const HALF_H = (FULL_H - GAP) / 2;
|
|
22
|
+
function getRects(layout) {
|
|
23
|
+
switch (layout) {
|
|
24
|
+
case "snap-left":
|
|
25
|
+
return [{ x: IX, y: IY, width: HALF_W, height: FULL_H }];
|
|
26
|
+
case "snap-right":
|
|
27
|
+
return [{ x: IX + HALF_W + GAP, y: IY, width: HALF_W, height: FULL_H }];
|
|
28
|
+
case "snap-top":
|
|
29
|
+
return [{ x: IX, y: IY, width: FULL_W, height: HALF_H }];
|
|
30
|
+
case "snap-bottom":
|
|
31
|
+
return [{ x: IX, y: IY + HALF_H + GAP, width: FULL_W, height: HALF_H }];
|
|
32
|
+
case "fill":
|
|
33
|
+
return [{ x: IX, y: IY, width: FULL_W, height: FULL_H }];
|
|
34
|
+
case "columns":
|
|
35
|
+
return [
|
|
36
|
+
{ x: IX, y: IY, width: HALF_W, height: FULL_H },
|
|
37
|
+
{ x: IX + HALF_W + GAP, y: IY, width: HALF_W, height: FULL_H }
|
|
38
|
+
];
|
|
39
|
+
case "rows":
|
|
40
|
+
return [
|
|
41
|
+
{ x: IX, y: IY, width: FULL_W, height: HALF_H },
|
|
42
|
+
{ x: IX, y: IY + HALF_H + GAP, width: FULL_W, height: HALF_H }
|
|
43
|
+
];
|
|
44
|
+
case "tile":
|
|
45
|
+
return [
|
|
46
|
+
{ x: IX, y: IY, width: HALF_W, height: HALF_H },
|
|
47
|
+
{ x: IX + HALF_W + GAP, y: IY, width: HALF_W, height: HALF_H },
|
|
48
|
+
{ x: IX, y: IY + HALF_H + GAP, width: HALF_W, height: HALF_H },
|
|
49
|
+
{ x: IX + HALF_W + GAP, y: IY + HALF_H + GAP, width: HALF_W, height: HALF_H }
|
|
50
|
+
];
|
|
51
|
+
default:
|
|
52
|
+
return [];
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
function LayoutIconBase({ layout, size = 28 }) {
|
|
56
|
+
const w = size;
|
|
57
|
+
const h = size * (VH / VW);
|
|
58
|
+
const rects = getRects(layout);
|
|
59
|
+
return /* @__PURE__ */ React.createElement("svg", { viewBox: `0 0 ${VW} ${VH}`, width: w, height: h }, /* @__PURE__ */ React.createElement(
|
|
60
|
+
"rect",
|
|
61
|
+
{
|
|
62
|
+
x: BX,
|
|
63
|
+
y: BY,
|
|
64
|
+
width: BW,
|
|
65
|
+
height: BH,
|
|
66
|
+
rx: R,
|
|
67
|
+
fill: "none",
|
|
68
|
+
stroke: "currentColor",
|
|
69
|
+
strokeWidth: 1.4
|
|
70
|
+
}
|
|
71
|
+
), rects.map((r, i) => /* @__PURE__ */ React.createElement(
|
|
72
|
+
"rect",
|
|
73
|
+
{
|
|
74
|
+
key: i,
|
|
75
|
+
x: r.x,
|
|
76
|
+
y: r.y,
|
|
77
|
+
width: r.width,
|
|
78
|
+
height: r.height,
|
|
79
|
+
rx: IR,
|
|
80
|
+
fill: "currentColor",
|
|
81
|
+
opacity: 0.45
|
|
82
|
+
}
|
|
83
|
+
)));
|
|
84
|
+
}
|
|
85
|
+
function SnapLeftIcon({ size }) {
|
|
86
|
+
return /* @__PURE__ */ React.createElement(LayoutIconBase, { layout: "snap-left", size });
|
|
87
|
+
}
|
|
88
|
+
function SnapRightIcon({ size }) {
|
|
89
|
+
return /* @__PURE__ */ React.createElement(LayoutIconBase, { layout: "snap-right", size });
|
|
90
|
+
}
|
|
91
|
+
function SnapTopIcon({ size }) {
|
|
92
|
+
return /* @__PURE__ */ React.createElement(LayoutIconBase, { layout: "snap-top", size });
|
|
93
|
+
}
|
|
94
|
+
function SnapBottomIcon({ size }) {
|
|
95
|
+
return /* @__PURE__ */ React.createElement(LayoutIconBase, { layout: "snap-bottom", size });
|
|
96
|
+
}
|
|
97
|
+
function FillIcon({ size }) {
|
|
98
|
+
return /* @__PURE__ */ React.createElement(LayoutIconBase, { layout: "fill", size });
|
|
99
|
+
}
|
|
100
|
+
function ArrangeColumnsIcon({ size }) {
|
|
101
|
+
return /* @__PURE__ */ React.createElement(LayoutIconBase, { layout: "columns", size });
|
|
102
|
+
}
|
|
103
|
+
function ArrangeRowsIcon({ size }) {
|
|
104
|
+
return /* @__PURE__ */ React.createElement(LayoutIconBase, { layout: "rows", size });
|
|
105
|
+
}
|
|
106
|
+
function TileIcon({ size }) {
|
|
107
|
+
return /* @__PURE__ */ React.createElement(LayoutIconBase, { layout: "tile", size });
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
exports.ArrangeColumnsIcon = ArrangeColumnsIcon;
|
|
111
|
+
exports.ArrangeRowsIcon = ArrangeRowsIcon;
|
|
112
|
+
exports.FillIcon = FillIcon;
|
|
113
|
+
exports.SnapBottomIcon = SnapBottomIcon;
|
|
114
|
+
exports.SnapLeftIcon = SnapLeftIcon;
|
|
115
|
+
exports.SnapRightIcon = SnapRightIcon;
|
|
116
|
+
exports.SnapTopIcon = SnapTopIcon;
|
|
117
|
+
exports.TileIcon = TileIcon;
|
|
118
|
+
//# sourceMappingURL=LayoutIcons.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LayoutIcons.cjs","sources":["../../src/LayoutIcons.tsx"],"sourcesContent":["import React from 'react';\n\ninterface LayoutIconProps {\n size?: number;\n}\n\n// 16:9 aspect ratio viewBox — generous padding for rounded border\nconst VW = 36;\nconst VH = 28;\nconst R = 4; // outer border radius\nconst IR = 2; // inner rect radius\nconst BX = 3; // border x\nconst BY = 3; // border y\nconst BW = VW - BX * 2; // border width\nconst BH = VH - BY * 2; // border height\nconst PAD = 3; // padding between border and highlighted area\nconst GAP = 2; // gap between split areas\n\n// Derived layout constants\nconst IX = BX + PAD;\nconst IY = BY + PAD;\nconst FULL_W = BW - PAD * 2;\nconst FULL_H = BH - PAD * 2;\nconst HALF_W = (FULL_W - GAP) / 2;\nconst HALF_H = (FULL_H - GAP) / 2;\n\ninterface RectDef {\n x: number;\n y: number;\n width: number;\n height: number;\n}\n\nfunction getRects(layout: string): RectDef[] {\n switch (layout) {\n case 'snap-left':\n return [{ x: IX, y: IY, width: HALF_W, height: FULL_H }];\n case 'snap-right':\n return [{ x: IX + HALF_W + GAP, y: IY, width: HALF_W, height: FULL_H }];\n case 'snap-top':\n return [{ x: IX, y: IY, width: FULL_W, height: HALF_H }];\n case 'snap-bottom':\n return [{ x: IX, y: IY + HALF_H + GAP, width: FULL_W, height: HALF_H }];\n case 'fill':\n return [{ x: IX, y: IY, width: FULL_W, height: FULL_H }];\n case 'columns':\n return [\n { x: IX, y: IY, width: HALF_W, height: FULL_H },\n { x: IX + HALF_W + GAP, y: IY, width: HALF_W, height: FULL_H },\n ];\n case 'rows':\n return [\n { x: IX, y: IY, width: FULL_W, height: HALF_H },\n { x: IX, y: IY + HALF_H + GAP, width: FULL_W, height: HALF_H },\n ];\n case 'tile':\n return [\n { x: IX, y: IY, width: HALF_W, height: HALF_H },\n { x: IX + HALF_W + GAP, y: IY, width: HALF_W, height: HALF_H },\n { x: IX, y: IY + HALF_H + GAP, width: HALF_W, height: HALF_H },\n { x: IX + HALF_W + GAP, y: IY + HALF_H + GAP, width: HALF_W, height: HALF_H },\n ];\n default:\n return [];\n }\n}\n\nfunction LayoutIconBase({ layout, size = 28 }: { layout: string } & LayoutIconProps) {\n const w = size;\n const h = size * (VH / VW);\n const rects = getRects(layout);\n return (\n <svg viewBox={`0 0 ${VW} ${VH}`} width={w} height={h}>\n <rect\n x={BX}\n y={BY}\n width={BW}\n height={BH}\n rx={R}\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth={1.4}\n />\n {rects.map((r, i) => (\n <rect\n key={i}\n x={r.x}\n y={r.y}\n width={r.width}\n height={r.height}\n rx={IR}\n fill=\"currentColor\"\n opacity={0.45}\n />\n ))}\n </svg>\n );\n}\n\n/** Snap left — left half highlighted */\nexport function SnapLeftIcon({ size }: LayoutIconProps) {\n return <LayoutIconBase layout=\"snap-left\" size={size} />;\n}\n\n/** Snap right — right half highlighted */\nexport function SnapRightIcon({ size }: LayoutIconProps) {\n return <LayoutIconBase layout=\"snap-right\" size={size} />;\n}\n\n/** Snap top — top half highlighted */\nexport function SnapTopIcon({ size }: LayoutIconProps) {\n return <LayoutIconBase layout=\"snap-top\" size={size} />;\n}\n\n/** Snap bottom — bottom half highlighted */\nexport function SnapBottomIcon({ size }: LayoutIconProps) {\n return <LayoutIconBase layout=\"snap-bottom\" size={size} />;\n}\n\n/** Fill — entire area highlighted */\nexport function FillIcon({ size }: LayoutIconProps) {\n return <LayoutIconBase layout=\"fill\" size={size} />;\n}\n\n/** Arrange columns — two vertical columns */\nexport function ArrangeColumnsIcon({ size }: LayoutIconProps) {\n return <LayoutIconBase layout=\"columns\" size={size} />;\n}\n\n/** Arrange rows — two horizontal rows */\nexport function ArrangeRowsIcon({ size }: LayoutIconProps) {\n return <LayoutIconBase layout=\"rows\" size={size} />;\n}\n\n/** Tile — 2x2 grid */\nexport function TileIcon({ size }: LayoutIconProps) {\n return <LayoutIconBase layout=\"tile\" size={size} />;\n}\n"],"names":[],"mappings":"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"}
|
package/dist/cjs/Window.cjs
CHANGED
|
@@ -5,8 +5,12 @@ var React = require('react');
|
|
|
5
5
|
var iconsReact = require('@tabler/icons-react');
|
|
6
6
|
var core = require('@mantine/core');
|
|
7
7
|
var useMantineWindow = require('./hooks/use-mantine-window.cjs');
|
|
8
|
+
var useResponsiveValue = require('./hooks/use-responsive-value.cjs');
|
|
9
|
+
var LayoutIcons = require('./LayoutIcons.cjs');
|
|
10
|
+
var WindowGroup = require('./WindowGroup.cjs');
|
|
8
11
|
var Window_module = require('./Window.module.css.cjs');
|
|
9
12
|
|
|
13
|
+
const HEADER_HEIGHT = 40;
|
|
10
14
|
const defaultProps = {
|
|
11
15
|
withBorder: true,
|
|
12
16
|
shadow: "md",
|
|
@@ -15,6 +19,7 @@ const defaultProps = {
|
|
|
15
19
|
withCloseButton: true,
|
|
16
20
|
withCollapseButton: true,
|
|
17
21
|
collapsable: true,
|
|
22
|
+
withToolsButton: true,
|
|
18
23
|
persistState: false,
|
|
19
24
|
withinPortal: true,
|
|
20
25
|
minWidth: 250,
|
|
@@ -58,8 +63,10 @@ const Window = core.factory((_props, _) => {
|
|
|
58
63
|
withCollapseButton,
|
|
59
64
|
collapsable,
|
|
60
65
|
withCloseButton,
|
|
66
|
+
withToolsButton,
|
|
61
67
|
onClose,
|
|
62
68
|
radius,
|
|
69
|
+
shadow,
|
|
63
70
|
withinPortal,
|
|
64
71
|
persistState,
|
|
65
72
|
minWidth,
|
|
@@ -67,8 +74,14 @@ const Window = core.factory((_props, _) => {
|
|
|
67
74
|
maxWidth,
|
|
68
75
|
maxHeight,
|
|
69
76
|
dragBounds,
|
|
70
|
-
|
|
71
|
-
|
|
77
|
+
x,
|
|
78
|
+
y,
|
|
79
|
+
defaultX,
|
|
80
|
+
defaultY,
|
|
81
|
+
width,
|
|
82
|
+
height,
|
|
83
|
+
defaultWidth,
|
|
84
|
+
defaultHeight,
|
|
72
85
|
onPositionChange,
|
|
73
86
|
onSizeChange,
|
|
74
87
|
withBorder,
|
|
@@ -82,9 +95,12 @@ const Window = core.factory((_props, _) => {
|
|
|
82
95
|
className,
|
|
83
96
|
...others
|
|
84
97
|
} = props;
|
|
98
|
+
const resolvedRadius = useResponsiveValue.useResponsiveValue(radius, void 0);
|
|
99
|
+
const resolvedShadow = useResponsiveValue.useResponsiveValue(shadow, "md");
|
|
100
|
+
const resolvedProps = { ...props, radius: resolvedRadius, shadow: resolvedShadow };
|
|
85
101
|
const getStyles = core.useStyles({
|
|
86
102
|
name: "Window",
|
|
87
|
-
props,
|
|
103
|
+
props: resolvedProps,
|
|
88
104
|
classes: Window_module,
|
|
89
105
|
className,
|
|
90
106
|
style,
|
|
@@ -103,10 +119,13 @@ const Window = core.factory((_props, _) => {
|
|
|
103
119
|
setIsCollapsed,
|
|
104
120
|
isVisible,
|
|
105
121
|
zIndex,
|
|
122
|
+
withinPortal: resolvedWithinPortal,
|
|
106
123
|
handleMouseDownDrag,
|
|
107
124
|
handleTouchStartDrag,
|
|
108
125
|
resizeHandlers,
|
|
109
|
-
handleClose
|
|
126
|
+
handleClose,
|
|
127
|
+
groupCtx,
|
|
128
|
+
applySingleLayout
|
|
110
129
|
} = useMantineWindow.useMantineWindow(props);
|
|
111
130
|
const draggableHeader = draggable === "header" || draggable === "both";
|
|
112
131
|
const draggableWindow = draggable === "window" || draggable === "both";
|
|
@@ -122,11 +141,13 @@ const Window = core.factory((_props, _) => {
|
|
|
122
141
|
onMouseDown: draggableWindow ? handleMouseDownDrag : void 0,
|
|
123
142
|
onTouchStart: draggableWindow ? handleTouchStartDrag : void 0,
|
|
124
143
|
bg: color,
|
|
144
|
+
role: "dialog",
|
|
145
|
+
"aria-label": title || props.id || "Window",
|
|
125
146
|
"data-mantine-window": true,
|
|
126
147
|
...others,
|
|
127
148
|
...getStyles("root", {
|
|
128
149
|
style: {
|
|
129
|
-
position:
|
|
150
|
+
position: resolvedWithinPortal ? "fixed" : "absolute",
|
|
130
151
|
left: position.x,
|
|
131
152
|
top: position.y,
|
|
132
153
|
width: size.width,
|
|
@@ -151,6 +172,7 @@ const Window = core.factory((_props, _) => {
|
|
|
151
172
|
radius: 256,
|
|
152
173
|
color: "red",
|
|
153
174
|
onClick: handleClose,
|
|
175
|
+
"aria-label": "Close window",
|
|
154
176
|
...getStyles("closeButton")
|
|
155
177
|
},
|
|
156
178
|
/* @__PURE__ */ React.createElement(iconsReact.IconX, { size: 14 })
|
|
@@ -160,16 +182,98 @@ const Window = core.factory((_props, _) => {
|
|
|
160
182
|
radius: 256,
|
|
161
183
|
color: "yellow",
|
|
162
184
|
onClick: () => setIsCollapsed(!isCollapsed),
|
|
185
|
+
"aria-label": isCollapsed ? "Expand window" : "Collapse window",
|
|
163
186
|
...getStyles("collapseButton")
|
|
164
187
|
},
|
|
165
188
|
isCollapsed ? /* @__PURE__ */ React.createElement(iconsReact.IconPlus, { size: 14 }) : /* @__PURE__ */ React.createElement(iconsReact.IconMinus, { size: 14 })
|
|
166
|
-
)
|
|
189
|
+
), withToolsButton && (groupCtx?.showToolsButton ?? true) && /* @__PURE__ */ React.createElement(core.Menu, { shadow: "md", width: 220, position: "bottom-start", withArrow: true }, /* @__PURE__ */ React.createElement(core.Menu.Target, null, /* @__PURE__ */ React.createElement(
|
|
190
|
+
core.ActionIcon,
|
|
191
|
+
{
|
|
192
|
+
radius: 256,
|
|
193
|
+
color: "green",
|
|
194
|
+
"aria-label": "Window layout options",
|
|
195
|
+
...getStyles("windowToolsButton")
|
|
196
|
+
},
|
|
197
|
+
/* @__PURE__ */ React.createElement(LayoutIcons.FillIcon, { size: 14 })
|
|
198
|
+
)), /* @__PURE__ */ React.createElement(core.Menu.Dropdown, null, /* @__PURE__ */ React.createElement(core.Menu.Label, null, "Move & Resize"), /* @__PURE__ */ React.createElement(core.Flex, { justify: "space-between", pb: "xs", px: "sm" }, /* @__PURE__ */ React.createElement(
|
|
199
|
+
core.ActionIcon,
|
|
200
|
+
{
|
|
201
|
+
variant: "subtle",
|
|
202
|
+
size: "lg",
|
|
203
|
+
"aria-label": "Snap left",
|
|
204
|
+
onClick: () => applySingleLayout("snap-left")
|
|
205
|
+
},
|
|
206
|
+
/* @__PURE__ */ React.createElement(LayoutIcons.SnapLeftIcon, null)
|
|
207
|
+
), /* @__PURE__ */ React.createElement(
|
|
208
|
+
core.ActionIcon,
|
|
209
|
+
{
|
|
210
|
+
variant: "subtle",
|
|
211
|
+
size: "lg",
|
|
212
|
+
"aria-label": "Snap right",
|
|
213
|
+
onClick: () => applySingleLayout("snap-right")
|
|
214
|
+
},
|
|
215
|
+
/* @__PURE__ */ React.createElement(LayoutIcons.SnapRightIcon, null)
|
|
216
|
+
), /* @__PURE__ */ React.createElement(
|
|
217
|
+
core.ActionIcon,
|
|
218
|
+
{
|
|
219
|
+
variant: "subtle",
|
|
220
|
+
size: "lg",
|
|
221
|
+
"aria-label": "Snap top",
|
|
222
|
+
onClick: () => applySingleLayout("snap-top")
|
|
223
|
+
},
|
|
224
|
+
/* @__PURE__ */ React.createElement(LayoutIcons.SnapTopIcon, null)
|
|
225
|
+
), /* @__PURE__ */ React.createElement(
|
|
226
|
+
core.ActionIcon,
|
|
227
|
+
{
|
|
228
|
+
variant: "subtle",
|
|
229
|
+
size: "lg",
|
|
230
|
+
"aria-label": "Snap bottom",
|
|
231
|
+
onClick: () => applySingleLayout("snap-bottom")
|
|
232
|
+
},
|
|
233
|
+
/* @__PURE__ */ React.createElement(LayoutIcons.SnapBottomIcon, null)
|
|
234
|
+
)), /* @__PURE__ */ React.createElement(core.Menu.Divider, null), /* @__PURE__ */ React.createElement(core.Menu.Label, null, "Fill & Arrange"), /* @__PURE__ */ React.createElement(core.Flex, { justify: "space-between", pb: "xs", px: "sm" }, /* @__PURE__ */ React.createElement(
|
|
235
|
+
core.ActionIcon,
|
|
236
|
+
{
|
|
237
|
+
variant: "subtle",
|
|
238
|
+
size: "lg",
|
|
239
|
+
"aria-label": "Fill",
|
|
240
|
+
onClick: () => applySingleLayout("fill")
|
|
241
|
+
},
|
|
242
|
+
/* @__PURE__ */ React.createElement(LayoutIcons.FillIcon, null)
|
|
243
|
+
), groupCtx && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
|
|
244
|
+
core.ActionIcon,
|
|
245
|
+
{
|
|
246
|
+
variant: "subtle",
|
|
247
|
+
size: "lg",
|
|
248
|
+
"aria-label": "Arrange columns",
|
|
249
|
+
onClick: () => groupCtx.applyLayout("arrange-columns")
|
|
250
|
+
},
|
|
251
|
+
/* @__PURE__ */ React.createElement(LayoutIcons.ArrangeColumnsIcon, null)
|
|
252
|
+
), /* @__PURE__ */ React.createElement(
|
|
253
|
+
core.ActionIcon,
|
|
254
|
+
{
|
|
255
|
+
variant: "subtle",
|
|
256
|
+
size: "lg",
|
|
257
|
+
"aria-label": "Arrange rows",
|
|
258
|
+
onClick: () => groupCtx.applyLayout("arrange-rows")
|
|
259
|
+
},
|
|
260
|
+
/* @__PURE__ */ React.createElement(LayoutIcons.ArrangeRowsIcon, null)
|
|
261
|
+
), /* @__PURE__ */ React.createElement(
|
|
262
|
+
core.ActionIcon,
|
|
263
|
+
{
|
|
264
|
+
variant: "subtle",
|
|
265
|
+
size: "lg",
|
|
266
|
+
"aria-label": "Tile",
|
|
267
|
+
onClick: () => groupCtx.applyLayout("tile")
|
|
268
|
+
},
|
|
269
|
+
/* @__PURE__ */ React.createElement(LayoutIcons.TileIcon, null)
|
|
270
|
+
))), groupCtx && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(core.Menu.Divider, null), /* @__PURE__ */ React.createElement(core.Menu.Item, { onClick: () => groupCtx.collapseAll() }, "Collapse all"), /* @__PURE__ */ React.createElement(core.Menu.Item, { onClick: () => groupCtx.expandAll() }, "Expand all"), /* @__PURE__ */ React.createElement(core.Menu.Item, { color: "red", onClick: () => groupCtx.closeAll() }, "Close all"))))), /* @__PURE__ */ React.createElement(core.Flex, { align: "center", gap: "xs", miw: 0 }, /* @__PURE__ */ React.createElement(core.Text, { truncate: true, ...getStyles("title") }, title)))
|
|
167
271
|
), !isCollapsed && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
|
|
168
272
|
core.ScrollArea,
|
|
169
273
|
{
|
|
170
274
|
...getStyles("content", {
|
|
171
275
|
style: {
|
|
172
|
-
height: size.height -
|
|
276
|
+
height: Math.max(0, size.height - HEADER_HEIGHT)
|
|
173
277
|
}
|
|
174
278
|
})
|
|
175
279
|
},
|
|
@@ -239,6 +343,7 @@ const Window = core.factory((_props, _) => {
|
|
|
239
343
|
});
|
|
240
344
|
Window.classes = Window_module;
|
|
241
345
|
Window.displayName = "Window";
|
|
346
|
+
Window.Group = WindowGroup.WindowGroup;
|
|
242
347
|
|
|
243
348
|
exports.Window = Window;
|
|
244
349
|
exports.defaultProps = defaultProps;
|