@hanzo/ui 5.3.35 → 5.3.36
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/bin/create-registry.js +0 -0
- package/bin/npx-registry-mcp.js +0 -0
- package/bin/registry-mcp-wrapper.sh +0 -0
- package/bin/registry-mcp.js +0 -0
- package/bin/start-mcp-server.sh +0 -0
- package/bin/test-mcp.sh +0 -0
- package/dist/3d/button.js +1 -297
- package/dist/3d/button.mjs +1 -272
- package/dist/3d/card.js +1 -233
- package/dist/3d/card.mjs +1 -206
- package/dist/3d/carousel.js +1 -370
- package/dist/3d/carousel.mjs +1 -343
- package/dist/3d/grid.js +1 -361
- package/dist/3d/grid.mjs +1 -336
- package/dist/3d/index.js +1 -1517
- package/dist/3d/index.mjs +1 -1471
- package/dist/3d/marquee.js +1 -351
- package/dist/3d/marquee.mjs +1 -326
- package/dist/3d/pin.js +1 -45
- package/dist/3d/pin.mjs +1 -23
- package/dist/accordion.js +1 -79
- package/dist/accordion.mjs +1 -54
- package/dist/alert-dialog.js +1 -224
- package/dist/alert-dialog.mjs +1 -191
- package/dist/alert.js +1 -97
- package/dist/alert.mjs +1 -91
- package/dist/animation/animated-background.js +1 -423
- package/dist/animation/animated-background.mjs +1 -417
- package/dist/animation/animated-beam.js +1 -118
- package/dist/animation/animated-beam.mjs +1 -96
- package/dist/animation/animated-cursor.js +1 -274
- package/dist/animation/animated-cursor.mjs +1 -269
- package/dist/animation/animated-icon.js +2 -356
- package/dist/animation/animated-icon.mjs +2 -350
- package/dist/animation/animated-list.js +1 -338
- package/dist/animation/animated-list.mjs +1 -332
- package/dist/animation/animated-number.js +1 -282
- package/dist/animation/animated-number.mjs +1 -276
- package/dist/animation/animated-testimonials.js +1 -96
- package/dist/animation/animated-testimonials.mjs +1 -74
- package/dist/animation/animated-tooltip.js +1 -66
- package/dist/animation/animated-tooltip.mjs +1 -44
- package/dist/animation/apple-cards-carousel.js +1 -307
- package/dist/animation/apple-cards-carousel.mjs +1 -284
- package/dist/animation/apple-hello-effect.js +1 -59
- package/dist/animation/apple-hello-effect.mjs +1 -37
- package/dist/animation/index.js +2 -1951
- package/dist/animation/index.mjs +2 -1920
- package/dist/avatar.js +1 -70
- package/dist/avatar.mjs +1 -46
- package/dist/badge.js +1 -60
- package/dist/badge.mjs +1 -54
- package/dist/blocks/index.js +2 -1684
- package/dist/blocks/index.mjs +2 -1645
- package/dist/breadcrumb.js +1 -106
- package/dist/breadcrumb.mjs +1 -98
- package/dist/calendar-ext/index.js +1 -207
- package/dist/calendar-ext/index.mjs +1 -169
- package/dist/calendar.js +1 -193
- package/dist/calendar.mjs +1 -168
- package/dist/carousel.js +1 -282
- package/dist/carousel.mjs +1 -253
- package/dist/charts/index.js +6 -5840
- package/dist/charts/index.mjs +6 -5749
- package/dist/checkbox.js +1 -59
- package/dist/checkbox.mjs +1 -34
- package/dist/code/block.js +2 -225
- package/dist/code/block.mjs +2 -202
- package/dist/code/compare.js +5 -444
- package/dist/code/compare.mjs +5 -421
- package/dist/code/diff.js +12 -429
- package/dist/code/diff.mjs +11 -405
- package/dist/code/editor.js +1 -242
- package/dist/code/editor.mjs +1 -217
- package/dist/code/explorer.js +1 -290
- package/dist/code/explorer.mjs +1 -267
- package/dist/code/index.js +26 -2514
- package/dist/code/index.mjs +24 -2471
- package/dist/code/preview.js +6 -363
- package/dist/code/preview.mjs +6 -340
- package/dist/code/snippet.js +2 -273
- package/dist/code/snippet.mjs +2 -249
- package/dist/code/tabs.js +1 -74
- package/dist/code/tabs.mjs +1 -52
- package/dist/code/terminal.js +3 -436
- package/dist/code/terminal.mjs +3 -413
- package/dist/collapsible.js +1 -32
- package/dist/collapsible.mjs +1 -8
- package/dist/command.js +1 -282
- package/dist/command.mjs +1 -251
- package/dist/context-menu.js +1 -206
- package/dist/context-menu.mjs +1 -170
- package/dist/desktop/hooks.js +1 -223
- package/dist/desktop/hooks.mjs +1 -198
- package/dist/desktop/index.js +1 -685
- package/dist/desktop/index.mjs +1 -657
- package/dist/desktop/spotlight.js +1 -260
- package/dist/desktop/spotlight.mjs +1 -235
- package/dist/desktop/window.js +1 -273
- package/dist/desktop/window.mjs +1 -247
- package/dist/device/index.js +1 -2
- package/dist/device/index.mjs +0 -1
- package/dist/dialog.js +1 -245
- package/dist/dialog.mjs +1 -213
- package/dist/dock/basic.js +1 -173
- package/dist/dock/basic.mjs +1 -150
- package/dist/dock/index.js +1 -647
- package/dist/dock/index.mjs +1 -620
- package/dist/dock/limelight-nav.js +1 -314
- package/dist/dock/limelight-nav.mjs +1 -293
- package/dist/dock/macos.js +1 -140
- package/dist/dock/macos.mjs +1 -117
- package/dist/dock/menu.js +1 -69
- package/dist/dock/menu.mjs +1 -47
- package/dist/dock/message.js +1 -148
- package/dist/dock/message.mjs +1 -126
- package/dist/drawer.js +1 -114
- package/dist/drawer.mjs +1 -102
- package/dist/dropdown-menu.js +1 -201
- package/dist/dropdown-menu.mjs +1 -165
- package/dist/finance/AdvancedChart.js +2 -47
- package/dist/finance/AdvancedChart.mjs +2 -45
- package/dist/finance/CompanyProfile.js +2 -47
- package/dist/finance/CompanyProfile.mjs +2 -45
- package/dist/finance/CryptoScreener.js +2 -44
- package/dist/finance/CryptoScreener.mjs +2 -42
- package/dist/finance/Financials.js +2 -51
- package/dist/finance/Financials.mjs +2 -49
- package/dist/finance/ForexScreener.js +2 -45
- package/dist/finance/ForexScreener.mjs +2 -43
- package/dist/finance/MarketOverview.js +2 -103
- package/dist/finance/MarketOverview.mjs +2 -101
- package/dist/finance/NewsTimeline.js +2 -43
- package/dist/finance/NewsTimeline.mjs +2 -41
- package/dist/finance/OrderEntry.js +1 -130
- package/dist/finance/OrderEntry.mjs +1 -128
- package/dist/finance/OrdersHistory.js +1 -63
- package/dist/finance/OrdersHistory.mjs +1 -61
- package/dist/finance/PositionsList.js +1 -79
- package/dist/finance/PositionsList.mjs +1 -77
- package/dist/finance/StockScreener.js +2 -45
- package/dist/finance/StockScreener.mjs +2 -43
- package/dist/finance/SymbolInfo.js +2 -45
- package/dist/finance/SymbolInfo.mjs +2 -43
- package/dist/finance/TechnicalAnalysis.js +2 -53
- package/dist/finance/TechnicalAnalysis.mjs +2 -51
- package/dist/finance/TickerTape.js +2 -55
- package/dist/finance/TickerTape.mjs +2 -53
- package/dist/finance/TradingPanel.js +1 -190
- package/dist/finance/TradingPanel.mjs +1 -188
- package/dist/finance/index.js +2 -929
- package/dist/finance/index.mjs +2 -913
- package/dist/form/index.js +1 -153
- package/dist/form/index.mjs +1 -123
- package/dist/form.js +1 -171
- package/dist/form.mjs +1 -141
- package/dist/hover-card.js +1 -57
- package/dist/hover-card.mjs +1 -33
- package/dist/index.js +192 -9618
- package/dist/index.mjs +192 -9202
- package/dist/input-otp.js +1 -78
- package/dist/input-otp.mjs +1 -53
- package/dist/kanban/index.js +1 -593
- package/dist/kanban/index.mjs +1 -571
- package/dist/lib/utils.js +1 -28
- package/dist/lib/utils.mjs +1 -24
- package/dist/mermaid/index.js +1 -280
- package/dist/mermaid/index.mjs +1 -253
- package/dist/navigation/index.js +1 -97
- package/dist/navigation/index.mjs +1 -78
- package/dist/navigation-menu.js +1 -148
- package/dist/navigation-menu.mjs +1 -115
- package/dist/pattern/grid-pattern.js +3 -325
- package/dist/pattern/grid-pattern.mjs +3 -302
- package/dist/pattern/index.js +3 -325
- package/dist/pattern/index.mjs +3 -302
- package/dist/popover.js +1 -62
- package/dist/popover.mjs +1 -36
- package/dist/progress.js +1 -61
- package/dist/progress.mjs +1 -36
- package/dist/project/gantt.js +1 -64
- package/dist/project/gantt.mjs +1 -42
- package/dist/project/index.js +1 -635
- package/dist/project/index.mjs +1 -610
- package/dist/project/kanban.js +1 -596
- package/dist/project/kanban.mjs +1 -571
- package/dist/project/list.js +1 -34
- package/dist/project/list.mjs +1 -11
- package/dist/radio-group.js +1 -67
- package/dist/radio-group.mjs +1 -44
- package/dist/resizable.js +1 -71
- package/dist/resizable.mjs +1 -47
- package/dist/scroll-area.js +1 -88
- package/dist/scroll-area.mjs +1 -65
- package/dist/select.js +1 -139
- package/dist/select.mjs +1 -110
- package/dist/separator.js +1 -58
- package/dist/separator.mjs +1 -33
- package/dist/sheet.js +1 -147
- package/dist/sheet.mjs +1 -116
- package/dist/skeleton.js +1 -31
- package/dist/skeleton.mjs +1 -26
- package/dist/slider.js +1 -98
- package/dist/slider.mjs +1 -72
- package/dist/sonner.js +1 -33
- package/dist/sonner.mjs +1 -28
- package/dist/spline/index.js +1 -210
- package/dist/spline/index.mjs +1 -201
- package/dist/spline/media-stack.js +1 -192
- package/dist/spline/media-stack.mjs +1 -184
- package/dist/spline/player.js +1 -36
- package/dist/spline/player.mjs +1 -30
- package/dist/switch.js +1 -61
- package/dist/switch.mjs +1 -36
- package/dist/table.js +1 -109
- package/dist/table.mjs +1 -100
- package/dist/tabs.js +1 -127
- package/dist/tabs.mjs +1 -101
- package/dist/tailwind/index.mjs +1 -2011
- package/dist/textarea.js +1 -77
- package/dist/textarea.mjs +1 -55
- package/dist/toggle-group.js +1 -117
- package/dist/toggle-group.mjs +1 -92
- package/dist/toggle.js +1 -70
- package/dist/toggle.mjs +1 -47
- package/dist/tooltip.js +1 -66
- package/dist/tooltip.mjs +1 -39
- package/dist/types/index.mjs +1 -51
- package/dist/ui/announcement.js +1 -133
- package/dist/ui/announcement.mjs +1 -111
- package/dist/ui/avatar-group.js +1 -87
- package/dist/ui/avatar-group.mjs +1 -64
- package/dist/ui/banner.js +1 -84
- package/dist/ui/banner.mjs +1 -61
- package/dist/ui/cursor.js +1 -77
- package/dist/ui/cursor.mjs +1 -55
- package/dist/ui/index.js +1 -494
- package/dist/ui/index.mjs +1 -461
- package/dist/ui/marquee.js +1 -73
- package/dist/ui/marquee.mjs +1 -51
- package/dist/ui/pill.js +1 -84
- package/dist/ui/pill.mjs +1 -61
- package/dist/ui/spinner.js +1 -27
- package/dist/ui/spinner.mjs +1 -25
- package/dist/ui/tags.js +1 -116
- package/dist/ui/tags.mjs +1 -94
- package/dist/ui/ticker.js +1 -72
- package/dist/ui/ticker.mjs +1 -50
- package/dist/util/index.mjs +1 -404
- package/package.json +28 -27
- package/dist/primitives/index.js +0 -9619
- package/dist/primitives/index.mjs +0 -9203
- package/dist/primitives-export.js +0 -9619
- package/dist/primitives-export.mjs +0 -9203
package/dist/desktop/window.js
CHANGED
|
@@ -1,274 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
'use strict';
|
|
3
|
-
|
|
4
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
5
|
-
|
|
6
|
-
var React = require('react');
|
|
7
|
-
var framerMotion = require('framer-motion');
|
|
8
|
-
var lucideReact = require('lucide-react');
|
|
9
|
-
var clsx = require('clsx');
|
|
10
|
-
var tailwindMerge = require('tailwind-merge');
|
|
11
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
12
|
-
|
|
13
|
-
function _interopNamespace(e) {
|
|
14
|
-
if (e && e.__esModule) return e;
|
|
15
|
-
var n = Object.create(null);
|
|
16
|
-
if (e) {
|
|
17
|
-
Object.keys(e).forEach(function (k) {
|
|
18
|
-
if (k !== 'default') {
|
|
19
|
-
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
20
|
-
Object.defineProperty(n, k, d.get ? d : {
|
|
21
|
-
enumerable: true,
|
|
22
|
-
get: function () { return e[k]; }
|
|
23
|
-
});
|
|
24
|
-
}
|
|
25
|
-
});
|
|
26
|
-
}
|
|
27
|
-
n.default = e;
|
|
28
|
-
return Object.freeze(n);
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
32
|
-
|
|
33
|
-
var __defProp = Object.defineProperty;
|
|
34
|
-
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
35
|
-
function cn(...inputs) {
|
|
36
|
-
return tailwindMerge.twMerge(clsx.clsx(inputs));
|
|
37
|
-
}
|
|
38
|
-
__name(cn, "cn");
|
|
39
|
-
var WindowControls = /* @__PURE__ */ __name(({
|
|
40
|
-
onClose,
|
|
41
|
-
onMinimize,
|
|
42
|
-
onMaximize,
|
|
43
|
-
isMaximized = false
|
|
44
|
-
}) => {
|
|
45
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 group", children: [
|
|
46
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
47
|
-
"button",
|
|
48
|
-
{
|
|
49
|
-
onClick: onClose,
|
|
50
|
-
className: "w-3 h-3 rounded-full bg-red-500 hover:bg-red-600 transition-colors flex items-center justify-center group-hover:shadow-sm",
|
|
51
|
-
title: "Close",
|
|
52
|
-
"aria-label": "Close window",
|
|
53
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "w-2 h-2 text-red-900 opacity-0 group-hover:opacity-100 transition-opacity" })
|
|
54
|
-
}
|
|
55
|
-
),
|
|
56
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
57
|
-
"button",
|
|
58
|
-
{
|
|
59
|
-
onClick: onMinimize,
|
|
60
|
-
className: "w-3 h-3 rounded-full bg-yellow-500 hover:bg-yellow-600 transition-colors flex items-center justify-center group-hover:shadow-sm",
|
|
61
|
-
title: "Minimize",
|
|
62
|
-
"aria-label": "Minimize window",
|
|
63
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Minus, { className: "w-2 h-2 text-yellow-900 opacity-0 group-hover:opacity-100 transition-opacity" })
|
|
64
|
-
}
|
|
65
|
-
),
|
|
66
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
67
|
-
"button",
|
|
68
|
-
{
|
|
69
|
-
onClick: onMaximize,
|
|
70
|
-
className: "w-3 h-3 rounded-full bg-green-500 hover:bg-green-600 transition-colors flex items-center justify-center group-hover:shadow-sm",
|
|
71
|
-
title: isMaximized ? "Restore" : "Maximize",
|
|
72
|
-
"aria-label": isMaximized ? "Restore window" : "Maximize window",
|
|
73
|
-
children: isMaximized ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Minimize2, { className: "w-2 h-2 text-green-900 opacity-0 group-hover:opacity-100 transition-opacity" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Maximize2, { className: "w-2 h-2 text-green-900 opacity-0 group-hover:opacity-100 transition-opacity" })
|
|
74
|
-
}
|
|
75
|
-
)
|
|
76
|
-
] });
|
|
77
|
-
}, "WindowControls");
|
|
78
|
-
var variantStyles = {
|
|
79
|
-
default: "bg-gray-900/95 border-white/10",
|
|
80
|
-
dark: "bg-black/95 border-white/5",
|
|
81
|
-
light: "bg-white/95 border-gray-200 text-gray-900",
|
|
82
|
-
transparent: "bg-gray-900/80 border-white/10"
|
|
83
|
-
};
|
|
84
|
-
var Window = React__namespace.forwardRef(
|
|
85
|
-
({
|
|
86
|
-
title,
|
|
87
|
-
icon,
|
|
88
|
-
children,
|
|
89
|
-
className,
|
|
90
|
-
onClose,
|
|
91
|
-
onMinimize,
|
|
92
|
-
onMaximize,
|
|
93
|
-
onFocus,
|
|
94
|
-
defaultWidth = 600,
|
|
95
|
-
defaultHeight = 400,
|
|
96
|
-
defaultX,
|
|
97
|
-
defaultY,
|
|
98
|
-
minWidth = 200,
|
|
99
|
-
minHeight = 100,
|
|
100
|
-
maxWidth,
|
|
101
|
-
maxHeight,
|
|
102
|
-
resizable = true,
|
|
103
|
-
draggable = true,
|
|
104
|
-
centered = true,
|
|
105
|
-
hideControls = false,
|
|
106
|
-
variant = "default"
|
|
107
|
-
}, ref) => {
|
|
108
|
-
const dragControls = framerMotion.useDragControls();
|
|
109
|
-
const [isMaximized, setIsMaximized] = React__namespace.useState(false);
|
|
110
|
-
const [position, setPosition] = React__namespace.useState(() => {
|
|
111
|
-
if (typeof window !== "undefined") {
|
|
112
|
-
const x = defaultX ?? (centered ? (window.innerWidth - defaultWidth) / 2 : 100);
|
|
113
|
-
const y = defaultY ?? (centered ? (window.innerHeight - defaultHeight) / 2 : 100);
|
|
114
|
-
return { x, y };
|
|
115
|
-
}
|
|
116
|
-
return { x: 100, y: 100 };
|
|
117
|
-
});
|
|
118
|
-
const [size, setSize] = React__namespace.useState({ width: defaultWidth, height: defaultHeight });
|
|
119
|
-
const [preMaximizeState, setPreMaximizeState] = React__namespace.useState(null);
|
|
120
|
-
const [initialMount, setInitialMount] = React__namespace.useState(true);
|
|
121
|
-
React__namespace.useEffect(() => {
|
|
122
|
-
if (initialMount) {
|
|
123
|
-
setInitialMount(false);
|
|
124
|
-
return;
|
|
125
|
-
}
|
|
126
|
-
if (typeof window !== "undefined") {
|
|
127
|
-
const x = defaultX ?? (centered ? (window.innerWidth - defaultWidth) / 2 : 100);
|
|
128
|
-
const y = defaultY ?? (centered ? (window.innerHeight - defaultHeight) / 2 : 100);
|
|
129
|
-
setPosition({ x, y });
|
|
130
|
-
}
|
|
131
|
-
}, [defaultX, defaultY, defaultWidth, defaultHeight, centered]);
|
|
132
|
-
const handleMaximize = /* @__PURE__ */ __name(() => {
|
|
133
|
-
if (isMaximized) {
|
|
134
|
-
if (preMaximizeState) {
|
|
135
|
-
setPosition(preMaximizeState.position);
|
|
136
|
-
setSize(preMaximizeState.size);
|
|
137
|
-
}
|
|
138
|
-
setIsMaximized(false);
|
|
139
|
-
} else {
|
|
140
|
-
setPreMaximizeState({ position, size });
|
|
141
|
-
setPosition({ x: 0, y: 28 });
|
|
142
|
-
setSize({
|
|
143
|
-
width: typeof window !== "undefined" ? window.innerWidth : defaultWidth,
|
|
144
|
-
height: typeof window !== "undefined" ? window.innerHeight - 28 : defaultHeight
|
|
145
|
-
});
|
|
146
|
-
setIsMaximized(true);
|
|
147
|
-
}
|
|
148
|
-
onMaximize?.();
|
|
149
|
-
}, "handleMaximize");
|
|
150
|
-
const handleDragEnd = /* @__PURE__ */ __name((_, info) => {
|
|
151
|
-
setPosition((prev) => ({
|
|
152
|
-
x: prev.x + info.offset.x,
|
|
153
|
-
y: prev.y + info.offset.y
|
|
154
|
-
}));
|
|
155
|
-
}, "handleDragEnd");
|
|
156
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
157
|
-
framerMotion.motion.div,
|
|
158
|
-
{
|
|
159
|
-
ref,
|
|
160
|
-
role: "dialog",
|
|
161
|
-
"aria-labelledby": `window-title-${title.replace(/\s+/g, "-").toLowerCase()}`,
|
|
162
|
-
drag: draggable && !isMaximized,
|
|
163
|
-
dragControls,
|
|
164
|
-
dragMomentum: false,
|
|
165
|
-
dragListener: false,
|
|
166
|
-
onDragEnd: handleDragEnd,
|
|
167
|
-
initial: { opacity: 0, scale: 0.95, y: 10 },
|
|
168
|
-
animate: {
|
|
169
|
-
opacity: 1,
|
|
170
|
-
scale: 1,
|
|
171
|
-
y: 0,
|
|
172
|
-
x: position.x,
|
|
173
|
-
width: size.width,
|
|
174
|
-
height: size.height
|
|
175
|
-
},
|
|
176
|
-
exit: { opacity: 0, scale: 0.95, y: 10 },
|
|
177
|
-
transition: { type: "spring", damping: 25, stiffness: 300 },
|
|
178
|
-
style: {
|
|
179
|
-
position: "fixed",
|
|
180
|
-
left: 0,
|
|
181
|
-
top: 0,
|
|
182
|
-
minWidth,
|
|
183
|
-
minHeight,
|
|
184
|
-
maxWidth: isMaximized ? void 0 : maxWidth,
|
|
185
|
-
maxHeight: isMaximized ? void 0 : maxHeight,
|
|
186
|
-
zIndex: 1e3
|
|
187
|
-
},
|
|
188
|
-
onClick: onFocus,
|
|
189
|
-
className: cn(
|
|
190
|
-
"flex flex-col rounded-xl border shadow-2xl backdrop-blur-xl overflow-hidden",
|
|
191
|
-
variantStyles[variant],
|
|
192
|
-
className
|
|
193
|
-
),
|
|
194
|
-
children: [
|
|
195
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
196
|
-
"div",
|
|
197
|
-
{
|
|
198
|
-
onPointerDown: (e) => {
|
|
199
|
-
if (draggable && !isMaximized) {
|
|
200
|
-
dragControls.start(e);
|
|
201
|
-
}
|
|
202
|
-
},
|
|
203
|
-
onDoubleClick: handleMaximize,
|
|
204
|
-
className: cn(
|
|
205
|
-
"flex items-center justify-between h-10 px-3 select-none cursor-default shrink-0",
|
|
206
|
-
"border-b border-white/5 bg-gradient-to-b from-white/5 to-transparent"
|
|
207
|
-
),
|
|
208
|
-
children: [
|
|
209
|
-
!hideControls && /* @__PURE__ */ jsxRuntime.jsx(
|
|
210
|
-
WindowControls,
|
|
211
|
-
{
|
|
212
|
-
onClose,
|
|
213
|
-
onMinimize,
|
|
214
|
-
onMaximize: handleMaximize,
|
|
215
|
-
isMaximized
|
|
216
|
-
}
|
|
217
|
-
),
|
|
218
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 absolute left-1/2 -translate-x-1/2", children: [
|
|
219
|
-
icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-4 h-4", children: icon }),
|
|
220
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
221
|
-
"span",
|
|
222
|
-
{
|
|
223
|
-
id: `window-title-${title.replace(/\s+/g, "-").toLowerCase()}`,
|
|
224
|
-
className: "text-sm font-medium text-white/90 truncate max-w-[200px]",
|
|
225
|
-
children: title
|
|
226
|
-
}
|
|
227
|
-
)
|
|
228
|
-
] }),
|
|
229
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-14" })
|
|
230
|
-
]
|
|
231
|
-
}
|
|
232
|
-
),
|
|
233
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 overflow-auto", children }),
|
|
234
|
-
resizable && !isMaximized && /* @__PURE__ */ jsxRuntime.jsx(
|
|
235
|
-
"div",
|
|
236
|
-
{
|
|
237
|
-
className: "absolute bottom-0 right-0 w-4 h-4 cursor-se-resize opacity-0 hover:opacity-100 transition-opacity",
|
|
238
|
-
style: {
|
|
239
|
-
background: "linear-gradient(135deg, transparent 50%, rgba(255,255,255,0.3) 50%)"
|
|
240
|
-
},
|
|
241
|
-
onPointerDown: (e) => {
|
|
242
|
-
e.preventDefault();
|
|
243
|
-
e.stopPropagation();
|
|
244
|
-
const startX = e.clientX;
|
|
245
|
-
const startY = e.clientY;
|
|
246
|
-
const startWidth = size.width;
|
|
247
|
-
const startHeight = size.height;
|
|
248
|
-
const handleMove = /* @__PURE__ */ __name((moveEvent) => {
|
|
249
|
-
const deltaX = moveEvent.clientX - startX;
|
|
250
|
-
const deltaY = moveEvent.clientY - startY;
|
|
251
|
-
const newWidth = Math.max(minWidth, Math.min(startWidth + deltaX, maxWidth ?? Infinity));
|
|
252
|
-
const newHeight = Math.max(minHeight, Math.min(startHeight + deltaY, maxHeight ?? Infinity));
|
|
253
|
-
setSize({ width: newWidth, height: newHeight });
|
|
254
|
-
}, "handleMove");
|
|
255
|
-
const handleUp = /* @__PURE__ */ __name(() => {
|
|
256
|
-
document.removeEventListener("pointermove", handleMove);
|
|
257
|
-
document.removeEventListener("pointerup", handleUp);
|
|
258
|
-
}, "handleUp");
|
|
259
|
-
document.addEventListener("pointermove", handleMove);
|
|
260
|
-
document.addEventListener("pointerup", handleUp);
|
|
261
|
-
}
|
|
262
|
-
}
|
|
263
|
-
)
|
|
264
|
-
]
|
|
265
|
-
}
|
|
266
|
-
);
|
|
267
|
-
}
|
|
268
|
-
);
|
|
269
|
-
Window.displayName = "Window";
|
|
270
|
-
var window_default = Window;
|
|
271
|
-
|
|
272
|
-
exports.Window = Window;
|
|
273
|
-
exports.WindowControls = WindowControls;
|
|
274
|
-
exports.default = window_default;
|
|
2
|
+
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var o=require('react'),framerMotion=require('framer-motion'),lucideReact=require('lucide-react'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),jsxRuntime=require('react/jsx-runtime');function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var o__namespace=/*#__PURE__*/_interopNamespace(o);var Z=Object.defineProperty;var r=(n,s)=>Z(n,"name",{value:s,configurable:true});function v(...n){return tailwindMerge.twMerge(clsx.clsx(n))}r(v,"cn");var le=r(({onClose:n,onMinimize:s,onMaximize:f,isMaximized:l=false})=>jsxRuntime.jsxs("div",{className:"flex items-center gap-2 group",children:[jsxRuntime.jsx("button",{onClick:n,className:"w-3 h-3 rounded-full bg-red-500 hover:bg-red-600 transition-colors flex items-center justify-center group-hover:shadow-sm",title:"Close","aria-label":"Close window",children:jsxRuntime.jsx(lucideReact.X,{className:"w-2 h-2 text-red-900 opacity-0 group-hover:opacity-100 transition-opacity"})}),jsxRuntime.jsx("button",{onClick:s,className:"w-3 h-3 rounded-full bg-yellow-500 hover:bg-yellow-600 transition-colors flex items-center justify-center group-hover:shadow-sm",title:"Minimize","aria-label":"Minimize window",children:jsxRuntime.jsx(lucideReact.Minus,{className:"w-2 h-2 text-yellow-900 opacity-0 group-hover:opacity-100 transition-opacity"})}),jsxRuntime.jsx("button",{onClick:f,className:"w-3 h-3 rounded-full bg-green-500 hover:bg-green-600 transition-colors flex items-center justify-center group-hover:shadow-sm",title:l?"Restore":"Maximize","aria-label":l?"Restore window":"Maximize window",children:l?jsxRuntime.jsx(lucideReact.Minimize2,{className:"w-2 h-2 text-green-900 opacity-0 group-hover:opacity-100 transition-opacity"}):jsxRuntime.jsx(lucideReact.Maximize2,{className:"w-2 h-2 text-green-900 opacity-0 group-hover:opacity-100 transition-opacity"})})]}),"WindowControls"),de={default:"bg-gray-900/95 border-white/10",dark:"bg-black/95 border-white/5",light:"bg-white/95 border-gray-200 text-gray-900",transparent:"bg-gray-900/80 border-white/10"},I=o__namespace.forwardRef(({title:n,icon:s,children:f,className:l,onClose:U,onMinimize:X,onMaximize:H,onFocus:_,defaultWidth:d=600,defaultHeight:c=400,defaultX:g,defaultY:b,minWidth:M=200,minHeight:z=100,maxWidth:C,maxHeight:N,resizable:$=true,draggable:R=true,centered:m=true,hideControls:j=false,variant:T="default"},Y)=>{let P=framerMotion.useDragControls(),[a,E]=o__namespace.useState(false),[k,p]=o__namespace.useState(()=>{if(typeof window<"u"){let t=g??(m?(window.innerWidth-d)/2:100),i=b??(m?(window.innerHeight-c)/2:100);return {x:t,y:i}}return {x:100,y:100}}),[u,x]=o__namespace.useState({width:d,height:c}),[y,F]=o__namespace.useState(null),[V,A]=o__namespace.useState(true);o__namespace.useEffect(()=>{if(V){A(false);return}if(typeof window<"u"){let t=g??(m?(window.innerWidth-d)/2:100),i=b??(m?(window.innerHeight-c)/2:100);p({x:t,y:i});}},[g,b,d,c,m]);let D=r(()=>{a?(y&&(p(y.position),x(y.size)),E(false)):(F({position:k,size:u}),p({x:0,y:28}),x({width:typeof window<"u"?window.innerWidth:d,height:typeof window<"u"?window.innerHeight-28:c}),E(true)),H?.();},"handleMaximize"),B=r((t,i)=>{p(w=>({x:w.x+i.offset.x,y:w.y+i.offset.y}));},"handleDragEnd");return jsxRuntime.jsxs(framerMotion.motion.div,{ref:Y,role:"dialog","aria-labelledby":`window-title-${n.replace(/\s+/g,"-").toLowerCase()}`,drag:R&&!a,dragControls:P,dragMomentum:false,dragListener:false,onDragEnd:B,initial:{opacity:0,scale:.95,y:10},animate:{opacity:1,scale:1,y:0,x:k.x,width:u.width,height:u.height},exit:{opacity:0,scale:.95,y:10},transition:{type:"spring",damping:25,stiffness:300},style:{position:"fixed",left:0,top:0,minWidth:M,minHeight:z,maxWidth:a?void 0:C,maxHeight:a?void 0:N,zIndex:1e3},onClick:_,className:v("flex flex-col rounded-xl border shadow-2xl backdrop-blur-xl overflow-hidden",de[T],l),children:[jsxRuntime.jsxs("div",{onPointerDown:t=>{R&&!a&&P.start(t);},onDoubleClick:D,className:v("flex items-center justify-between h-10 px-3 select-none cursor-default shrink-0","border-b border-white/5 bg-gradient-to-b from-white/5 to-transparent"),children:[!j&&jsxRuntime.jsx(le,{onClose:U,onMinimize:X,onMaximize:D,isMaximized:a}),jsxRuntime.jsxs("div",{className:"flex items-center gap-2 absolute left-1/2 -translate-x-1/2",children:[s&&jsxRuntime.jsx("span",{className:"w-4 h-4",children:s}),jsxRuntime.jsx("span",{id:`window-title-${n.replace(/\s+/g,"-").toLowerCase()}`,className:"text-sm font-medium text-white/90 truncate max-w-[200px]",children:n})]}),jsxRuntime.jsx("div",{className:"w-14"})]}),jsxRuntime.jsx("div",{className:"flex-1 overflow-auto",children:f}),$&&!a&&jsxRuntime.jsx("div",{className:"absolute bottom-0 right-0 w-4 h-4 cursor-se-resize opacity-0 hover:opacity-100 transition-opacity",style:{background:"linear-gradient(135deg, transparent 50%, rgba(255,255,255,0.3) 50%)"},onPointerDown:t=>{t.preventDefault(),t.stopPropagation();let i=t.clientX,w=t.clientY,q=u.width,G=u.height,L=r(W=>{let J=W.clientX-i,K=W.clientY-w,O=Math.max(M,Math.min(q+J,C??1/0)),Q=Math.max(z,Math.min(G+K,N??1/0));x({width:O,height:Q});},"handleMove"),S=r(()=>{document.removeEventListener("pointermove",L),document.removeEventListener("pointerup",S);},"handleUp");document.addEventListener("pointermove",L),document.addEventListener("pointerup",S);}})]})});I.displayName="Window";var xe=I;exports.Window=I;exports.WindowControls=le;exports.default=xe;
|
package/dist/desktop/window.mjs
CHANGED
|
@@ -1,248 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
3
|
-
import { useDragControls, motion } from 'framer-motion';
|
|
4
|
-
import { X, Minus, Minimize2, Maximize2 } from 'lucide-react';
|
|
5
|
-
import { clsx } from 'clsx';
|
|
6
|
-
import { twMerge } from 'tailwind-merge';
|
|
7
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
8
|
-
|
|
9
|
-
var __defProp = Object.defineProperty;
|
|
10
|
-
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
11
|
-
function cn(...inputs) {
|
|
12
|
-
return twMerge(clsx(inputs));
|
|
13
|
-
}
|
|
14
|
-
__name(cn, "cn");
|
|
15
|
-
var WindowControls = /* @__PURE__ */ __name(({
|
|
16
|
-
onClose,
|
|
17
|
-
onMinimize,
|
|
18
|
-
onMaximize,
|
|
19
|
-
isMaximized = false
|
|
20
|
-
}) => {
|
|
21
|
-
return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 group", children: [
|
|
22
|
-
/* @__PURE__ */ jsx(
|
|
23
|
-
"button",
|
|
24
|
-
{
|
|
25
|
-
onClick: onClose,
|
|
26
|
-
className: "w-3 h-3 rounded-full bg-red-500 hover:bg-red-600 transition-colors flex items-center justify-center group-hover:shadow-sm",
|
|
27
|
-
title: "Close",
|
|
28
|
-
"aria-label": "Close window",
|
|
29
|
-
children: /* @__PURE__ */ jsx(X, { className: "w-2 h-2 text-red-900 opacity-0 group-hover:opacity-100 transition-opacity" })
|
|
30
|
-
}
|
|
31
|
-
),
|
|
32
|
-
/* @__PURE__ */ jsx(
|
|
33
|
-
"button",
|
|
34
|
-
{
|
|
35
|
-
onClick: onMinimize,
|
|
36
|
-
className: "w-3 h-3 rounded-full bg-yellow-500 hover:bg-yellow-600 transition-colors flex items-center justify-center group-hover:shadow-sm",
|
|
37
|
-
title: "Minimize",
|
|
38
|
-
"aria-label": "Minimize window",
|
|
39
|
-
children: /* @__PURE__ */ jsx(Minus, { className: "w-2 h-2 text-yellow-900 opacity-0 group-hover:opacity-100 transition-opacity" })
|
|
40
|
-
}
|
|
41
|
-
),
|
|
42
|
-
/* @__PURE__ */ jsx(
|
|
43
|
-
"button",
|
|
44
|
-
{
|
|
45
|
-
onClick: onMaximize,
|
|
46
|
-
className: "w-3 h-3 rounded-full bg-green-500 hover:bg-green-600 transition-colors flex items-center justify-center group-hover:shadow-sm",
|
|
47
|
-
title: isMaximized ? "Restore" : "Maximize",
|
|
48
|
-
"aria-label": isMaximized ? "Restore window" : "Maximize window",
|
|
49
|
-
children: isMaximized ? /* @__PURE__ */ jsx(Minimize2, { className: "w-2 h-2 text-green-900 opacity-0 group-hover:opacity-100 transition-opacity" }) : /* @__PURE__ */ jsx(Maximize2, { className: "w-2 h-2 text-green-900 opacity-0 group-hover:opacity-100 transition-opacity" })
|
|
50
|
-
}
|
|
51
|
-
)
|
|
52
|
-
] });
|
|
53
|
-
}, "WindowControls");
|
|
54
|
-
var variantStyles = {
|
|
55
|
-
default: "bg-gray-900/95 border-white/10",
|
|
56
|
-
dark: "bg-black/95 border-white/5",
|
|
57
|
-
light: "bg-white/95 border-gray-200 text-gray-900",
|
|
58
|
-
transparent: "bg-gray-900/80 border-white/10"
|
|
59
|
-
};
|
|
60
|
-
var Window = React.forwardRef(
|
|
61
|
-
({
|
|
62
|
-
title,
|
|
63
|
-
icon,
|
|
64
|
-
children,
|
|
65
|
-
className,
|
|
66
|
-
onClose,
|
|
67
|
-
onMinimize,
|
|
68
|
-
onMaximize,
|
|
69
|
-
onFocus,
|
|
70
|
-
defaultWidth = 600,
|
|
71
|
-
defaultHeight = 400,
|
|
72
|
-
defaultX,
|
|
73
|
-
defaultY,
|
|
74
|
-
minWidth = 200,
|
|
75
|
-
minHeight = 100,
|
|
76
|
-
maxWidth,
|
|
77
|
-
maxHeight,
|
|
78
|
-
resizable = true,
|
|
79
|
-
draggable = true,
|
|
80
|
-
centered = true,
|
|
81
|
-
hideControls = false,
|
|
82
|
-
variant = "default"
|
|
83
|
-
}, ref) => {
|
|
84
|
-
const dragControls = useDragControls();
|
|
85
|
-
const [isMaximized, setIsMaximized] = React.useState(false);
|
|
86
|
-
const [position, setPosition] = React.useState(() => {
|
|
87
|
-
if (typeof window !== "undefined") {
|
|
88
|
-
const x = defaultX ?? (centered ? (window.innerWidth - defaultWidth) / 2 : 100);
|
|
89
|
-
const y = defaultY ?? (centered ? (window.innerHeight - defaultHeight) / 2 : 100);
|
|
90
|
-
return { x, y };
|
|
91
|
-
}
|
|
92
|
-
return { x: 100, y: 100 };
|
|
93
|
-
});
|
|
94
|
-
const [size, setSize] = React.useState({ width: defaultWidth, height: defaultHeight });
|
|
95
|
-
const [preMaximizeState, setPreMaximizeState] = React.useState(null);
|
|
96
|
-
const [initialMount, setInitialMount] = React.useState(true);
|
|
97
|
-
React.useEffect(() => {
|
|
98
|
-
if (initialMount) {
|
|
99
|
-
setInitialMount(false);
|
|
100
|
-
return;
|
|
101
|
-
}
|
|
102
|
-
if (typeof window !== "undefined") {
|
|
103
|
-
const x = defaultX ?? (centered ? (window.innerWidth - defaultWidth) / 2 : 100);
|
|
104
|
-
const y = defaultY ?? (centered ? (window.innerHeight - defaultHeight) / 2 : 100);
|
|
105
|
-
setPosition({ x, y });
|
|
106
|
-
}
|
|
107
|
-
}, [defaultX, defaultY, defaultWidth, defaultHeight, centered]);
|
|
108
|
-
const handleMaximize = /* @__PURE__ */ __name(() => {
|
|
109
|
-
if (isMaximized) {
|
|
110
|
-
if (preMaximizeState) {
|
|
111
|
-
setPosition(preMaximizeState.position);
|
|
112
|
-
setSize(preMaximizeState.size);
|
|
113
|
-
}
|
|
114
|
-
setIsMaximized(false);
|
|
115
|
-
} else {
|
|
116
|
-
setPreMaximizeState({ position, size });
|
|
117
|
-
setPosition({ x: 0, y: 28 });
|
|
118
|
-
setSize({
|
|
119
|
-
width: typeof window !== "undefined" ? window.innerWidth : defaultWidth,
|
|
120
|
-
height: typeof window !== "undefined" ? window.innerHeight - 28 : defaultHeight
|
|
121
|
-
});
|
|
122
|
-
setIsMaximized(true);
|
|
123
|
-
}
|
|
124
|
-
onMaximize?.();
|
|
125
|
-
}, "handleMaximize");
|
|
126
|
-
const handleDragEnd = /* @__PURE__ */ __name((_, info) => {
|
|
127
|
-
setPosition((prev) => ({
|
|
128
|
-
x: prev.x + info.offset.x,
|
|
129
|
-
y: prev.y + info.offset.y
|
|
130
|
-
}));
|
|
131
|
-
}, "handleDragEnd");
|
|
132
|
-
return /* @__PURE__ */ jsxs(
|
|
133
|
-
motion.div,
|
|
134
|
-
{
|
|
135
|
-
ref,
|
|
136
|
-
role: "dialog",
|
|
137
|
-
"aria-labelledby": `window-title-${title.replace(/\s+/g, "-").toLowerCase()}`,
|
|
138
|
-
drag: draggable && !isMaximized,
|
|
139
|
-
dragControls,
|
|
140
|
-
dragMomentum: false,
|
|
141
|
-
dragListener: false,
|
|
142
|
-
onDragEnd: handleDragEnd,
|
|
143
|
-
initial: { opacity: 0, scale: 0.95, y: 10 },
|
|
144
|
-
animate: {
|
|
145
|
-
opacity: 1,
|
|
146
|
-
scale: 1,
|
|
147
|
-
y: 0,
|
|
148
|
-
x: position.x,
|
|
149
|
-
width: size.width,
|
|
150
|
-
height: size.height
|
|
151
|
-
},
|
|
152
|
-
exit: { opacity: 0, scale: 0.95, y: 10 },
|
|
153
|
-
transition: { type: "spring", damping: 25, stiffness: 300 },
|
|
154
|
-
style: {
|
|
155
|
-
position: "fixed",
|
|
156
|
-
left: 0,
|
|
157
|
-
top: 0,
|
|
158
|
-
minWidth,
|
|
159
|
-
minHeight,
|
|
160
|
-
maxWidth: isMaximized ? void 0 : maxWidth,
|
|
161
|
-
maxHeight: isMaximized ? void 0 : maxHeight,
|
|
162
|
-
zIndex: 1e3
|
|
163
|
-
},
|
|
164
|
-
onClick: onFocus,
|
|
165
|
-
className: cn(
|
|
166
|
-
"flex flex-col rounded-xl border shadow-2xl backdrop-blur-xl overflow-hidden",
|
|
167
|
-
variantStyles[variant],
|
|
168
|
-
className
|
|
169
|
-
),
|
|
170
|
-
children: [
|
|
171
|
-
/* @__PURE__ */ jsxs(
|
|
172
|
-
"div",
|
|
173
|
-
{
|
|
174
|
-
onPointerDown: (e) => {
|
|
175
|
-
if (draggable && !isMaximized) {
|
|
176
|
-
dragControls.start(e);
|
|
177
|
-
}
|
|
178
|
-
},
|
|
179
|
-
onDoubleClick: handleMaximize,
|
|
180
|
-
className: cn(
|
|
181
|
-
"flex items-center justify-between h-10 px-3 select-none cursor-default shrink-0",
|
|
182
|
-
"border-b border-white/5 bg-gradient-to-b from-white/5 to-transparent"
|
|
183
|
-
),
|
|
184
|
-
children: [
|
|
185
|
-
!hideControls && /* @__PURE__ */ jsx(
|
|
186
|
-
WindowControls,
|
|
187
|
-
{
|
|
188
|
-
onClose,
|
|
189
|
-
onMinimize,
|
|
190
|
-
onMaximize: handleMaximize,
|
|
191
|
-
isMaximized
|
|
192
|
-
}
|
|
193
|
-
),
|
|
194
|
-
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 absolute left-1/2 -translate-x-1/2", children: [
|
|
195
|
-
icon && /* @__PURE__ */ jsx("span", { className: "w-4 h-4", children: icon }),
|
|
196
|
-
/* @__PURE__ */ jsx(
|
|
197
|
-
"span",
|
|
198
|
-
{
|
|
199
|
-
id: `window-title-${title.replace(/\s+/g, "-").toLowerCase()}`,
|
|
200
|
-
className: "text-sm font-medium text-white/90 truncate max-w-[200px]",
|
|
201
|
-
children: title
|
|
202
|
-
}
|
|
203
|
-
)
|
|
204
|
-
] }),
|
|
205
|
-
/* @__PURE__ */ jsx("div", { className: "w-14" })
|
|
206
|
-
]
|
|
207
|
-
}
|
|
208
|
-
),
|
|
209
|
-
/* @__PURE__ */ jsx("div", { className: "flex-1 overflow-auto", children }),
|
|
210
|
-
resizable && !isMaximized && /* @__PURE__ */ jsx(
|
|
211
|
-
"div",
|
|
212
|
-
{
|
|
213
|
-
className: "absolute bottom-0 right-0 w-4 h-4 cursor-se-resize opacity-0 hover:opacity-100 transition-opacity",
|
|
214
|
-
style: {
|
|
215
|
-
background: "linear-gradient(135deg, transparent 50%, rgba(255,255,255,0.3) 50%)"
|
|
216
|
-
},
|
|
217
|
-
onPointerDown: (e) => {
|
|
218
|
-
e.preventDefault();
|
|
219
|
-
e.stopPropagation();
|
|
220
|
-
const startX = e.clientX;
|
|
221
|
-
const startY = e.clientY;
|
|
222
|
-
const startWidth = size.width;
|
|
223
|
-
const startHeight = size.height;
|
|
224
|
-
const handleMove = /* @__PURE__ */ __name((moveEvent) => {
|
|
225
|
-
const deltaX = moveEvent.clientX - startX;
|
|
226
|
-
const deltaY = moveEvent.clientY - startY;
|
|
227
|
-
const newWidth = Math.max(minWidth, Math.min(startWidth + deltaX, maxWidth ?? Infinity));
|
|
228
|
-
const newHeight = Math.max(minHeight, Math.min(startHeight + deltaY, maxHeight ?? Infinity));
|
|
229
|
-
setSize({ width: newWidth, height: newHeight });
|
|
230
|
-
}, "handleMove");
|
|
231
|
-
const handleUp = /* @__PURE__ */ __name(() => {
|
|
232
|
-
document.removeEventListener("pointermove", handleMove);
|
|
233
|
-
document.removeEventListener("pointerup", handleUp);
|
|
234
|
-
}, "handleUp");
|
|
235
|
-
document.addEventListener("pointermove", handleMove);
|
|
236
|
-
document.addEventListener("pointerup", handleUp);
|
|
237
|
-
}
|
|
238
|
-
}
|
|
239
|
-
)
|
|
240
|
-
]
|
|
241
|
-
}
|
|
242
|
-
);
|
|
243
|
-
}
|
|
244
|
-
);
|
|
245
|
-
Window.displayName = "Window";
|
|
246
|
-
var window_default = Window;
|
|
247
|
-
|
|
248
|
-
export { Window, WindowControls, window_default as default };
|
|
2
|
+
import*as o from'react';import {useDragControls,motion}from'framer-motion';import {X,Minus,Minimize2,Maximize2}from'lucide-react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import {jsxs,jsx}from'react/jsx-runtime';var Z=Object.defineProperty;var r=(n,s)=>Z(n,"name",{value:s,configurable:true});function v(...n){return twMerge(clsx(n))}r(v,"cn");var le=r(({onClose:n,onMinimize:s,onMaximize:f,isMaximized:l=false})=>jsxs("div",{className:"flex items-center gap-2 group",children:[jsx("button",{onClick:n,className:"w-3 h-3 rounded-full bg-red-500 hover:bg-red-600 transition-colors flex items-center justify-center group-hover:shadow-sm",title:"Close","aria-label":"Close window",children:jsx(X,{className:"w-2 h-2 text-red-900 opacity-0 group-hover:opacity-100 transition-opacity"})}),jsx("button",{onClick:s,className:"w-3 h-3 rounded-full bg-yellow-500 hover:bg-yellow-600 transition-colors flex items-center justify-center group-hover:shadow-sm",title:"Minimize","aria-label":"Minimize window",children:jsx(Minus,{className:"w-2 h-2 text-yellow-900 opacity-0 group-hover:opacity-100 transition-opacity"})}),jsx("button",{onClick:f,className:"w-3 h-3 rounded-full bg-green-500 hover:bg-green-600 transition-colors flex items-center justify-center group-hover:shadow-sm",title:l?"Restore":"Maximize","aria-label":l?"Restore window":"Maximize window",children:l?jsx(Minimize2,{className:"w-2 h-2 text-green-900 opacity-0 group-hover:opacity-100 transition-opacity"}):jsx(Maximize2,{className:"w-2 h-2 text-green-900 opacity-0 group-hover:opacity-100 transition-opacity"})})]}),"WindowControls"),de={default:"bg-gray-900/95 border-white/10",dark:"bg-black/95 border-white/5",light:"bg-white/95 border-gray-200 text-gray-900",transparent:"bg-gray-900/80 border-white/10"},I=o.forwardRef(({title:n,icon:s,children:f,className:l,onClose:U,onMinimize:X,onMaximize:H,onFocus:_,defaultWidth:d=600,defaultHeight:c=400,defaultX:g,defaultY:b,minWidth:M=200,minHeight:z=100,maxWidth:C,maxHeight:N,resizable:$=true,draggable:R=true,centered:m=true,hideControls:j=false,variant:T="default"},Y)=>{let P=useDragControls(),[a,E]=o.useState(false),[k,p]=o.useState(()=>{if(typeof window<"u"){let t=g??(m?(window.innerWidth-d)/2:100),i=b??(m?(window.innerHeight-c)/2:100);return {x:t,y:i}}return {x:100,y:100}}),[u,x]=o.useState({width:d,height:c}),[y,F]=o.useState(null),[V,A]=o.useState(true);o.useEffect(()=>{if(V){A(false);return}if(typeof window<"u"){let t=g??(m?(window.innerWidth-d)/2:100),i=b??(m?(window.innerHeight-c)/2:100);p({x:t,y:i});}},[g,b,d,c,m]);let D=r(()=>{a?(y&&(p(y.position),x(y.size)),E(false)):(F({position:k,size:u}),p({x:0,y:28}),x({width:typeof window<"u"?window.innerWidth:d,height:typeof window<"u"?window.innerHeight-28:c}),E(true)),H?.();},"handleMaximize"),B=r((t,i)=>{p(w=>({x:w.x+i.offset.x,y:w.y+i.offset.y}));},"handleDragEnd");return jsxs(motion.div,{ref:Y,role:"dialog","aria-labelledby":`window-title-${n.replace(/\s+/g,"-").toLowerCase()}`,drag:R&&!a,dragControls:P,dragMomentum:false,dragListener:false,onDragEnd:B,initial:{opacity:0,scale:.95,y:10},animate:{opacity:1,scale:1,y:0,x:k.x,width:u.width,height:u.height},exit:{opacity:0,scale:.95,y:10},transition:{type:"spring",damping:25,stiffness:300},style:{position:"fixed",left:0,top:0,minWidth:M,minHeight:z,maxWidth:a?void 0:C,maxHeight:a?void 0:N,zIndex:1e3},onClick:_,className:v("flex flex-col rounded-xl border shadow-2xl backdrop-blur-xl overflow-hidden",de[T],l),children:[jsxs("div",{onPointerDown:t=>{R&&!a&&P.start(t);},onDoubleClick:D,className:v("flex items-center justify-between h-10 px-3 select-none cursor-default shrink-0","border-b border-white/5 bg-gradient-to-b from-white/5 to-transparent"),children:[!j&&jsx(le,{onClose:U,onMinimize:X,onMaximize:D,isMaximized:a}),jsxs("div",{className:"flex items-center gap-2 absolute left-1/2 -translate-x-1/2",children:[s&&jsx("span",{className:"w-4 h-4",children:s}),jsx("span",{id:`window-title-${n.replace(/\s+/g,"-").toLowerCase()}`,className:"text-sm font-medium text-white/90 truncate max-w-[200px]",children:n})]}),jsx("div",{className:"w-14"})]}),jsx("div",{className:"flex-1 overflow-auto",children:f}),$&&!a&&jsx("div",{className:"absolute bottom-0 right-0 w-4 h-4 cursor-se-resize opacity-0 hover:opacity-100 transition-opacity",style:{background:"linear-gradient(135deg, transparent 50%, rgba(255,255,255,0.3) 50%)"},onPointerDown:t=>{t.preventDefault(),t.stopPropagation();let i=t.clientX,w=t.clientY,q=u.width,G=u.height,L=r(W=>{let J=W.clientX-i,K=W.clientY-w,O=Math.max(M,Math.min(q+J,C??1/0)),Q=Math.max(z,Math.min(G+K,N??1/0));x({width:O,height:Q});},"handleMove"),S=r(()=>{document.removeEventListener("pointermove",L),document.removeEventListener("pointerup",S);},"handleUp");document.addEventListener("pointermove",L),document.addEventListener("pointerup",S);}})]})});I.displayName="Window";var xe=I;export{I as Window,le as WindowControls,xe as default};
|
package/dist/device/index.js
CHANGED
package/dist/device/index.mjs
CHANGED