@surdeddd/wmkit 0.7.2 → 0.8.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 +37 -2
- package/README.ru.md +37 -2
- package/dist/angular.cjs +4 -3
- package/dist/angular.cjs.map +1 -1
- package/dist/angular.d.cts +2 -1
- package/dist/angular.d.ts +2 -1
- package/dist/angular.js +2 -1
- package/dist/angular.js.map +1 -1
- package/dist/binder-B625OrjD.d.cts +13 -0
- package/dist/binder-CpGY8Wye.d.ts +13 -0
- package/dist/chunk-5XVIC5LH.js +140 -0
- package/dist/chunk-5XVIC5LH.js.map +1 -0
- package/dist/chunk-BDHFXEJN.cjs +149 -0
- package/dist/chunk-BDHFXEJN.cjs.map +1 -0
- package/dist/{chunk-NJAI5R4J.cjs → chunk-DINVOL6Z.cjs} +48 -170
- package/dist/chunk-DINVOL6Z.cjs.map +1 -0
- package/dist/{chunk-FOWW4LXS.js → chunk-MGWCKHTZ.js} +29 -143
- package/dist/chunk-MGWCKHTZ.js.map +1 -0
- package/dist/devtools.cjs +330 -0
- package/dist/devtools.cjs.map +1 -0
- package/dist/devtools.d.cts +43 -0
- package/dist/devtools.d.ts +43 -0
- package/dist/devtools.js +326 -0
- package/dist/devtools.js.map +1 -0
- package/dist/gestures.cjs +219 -0
- package/dist/gestures.cjs.map +1 -0
- package/dist/gestures.d.cts +19 -0
- package/dist/gestures.d.ts +19 -0
- package/dist/gestures.js +215 -0
- package/dist/gestures.js.map +1 -0
- package/dist/index.cjs +35 -34
- package/dist/index.d.cts +3 -2
- package/dist/index.d.ts +3 -2
- package/dist/index.js +2 -1
- package/dist/react.cjs +4 -3
- package/dist/react.cjs.map +1 -1
- package/dist/react.d.cts +2 -1
- package/dist/react.d.ts +2 -1
- package/dist/react.js +2 -1
- package/dist/react.js.map +1 -1
- package/dist/{binder-DvQFmO3K.d.ts → shared-BBXgEeIa.d.ts} +22 -8
- package/dist/{binder-_L3Iww0u.d.cts → shared-DU_87nY9.d.cts} +22 -8
- package/dist/solid.cjs +4 -3
- package/dist/solid.cjs.map +1 -1
- package/dist/solid.d.cts +2 -1
- package/dist/solid.d.ts +2 -1
- package/dist/solid.js +2 -1
- package/dist/solid.js.map +1 -1
- package/dist/svelte.cjs +4 -3
- package/dist/svelte.cjs.map +1 -1
- package/dist/svelte.d.cts +2 -1
- package/dist/svelte.d.ts +2 -1
- package/dist/svelte.js +2 -1
- package/dist/svelte.js.map +1 -1
- package/dist/themes/amber.css +316 -0
- package/dist/themes/aqua.css +285 -0
- package/dist/themes/blueprint.css +303 -0
- package/dist/themes/brutalist.css +307 -0
- package/dist/themes/candy.css +277 -0
- package/dist/themes/carbon.css +297 -0
- package/dist/themes/forest.css +278 -0
- package/dist/themes/frost.css +279 -0
- package/dist/themes/glass.css +2 -1
- package/dist/themes/light.css +2 -1
- package/dist/themes/neon.css +289 -0
- package/dist/themes/noir.css +282 -0
- package/dist/themes/paper.css +258 -0
- package/dist/themes/synth.css +283 -0
- package/dist/themes/terminal.css +273 -0
- package/dist/vue.cjs +4 -3
- package/dist/vue.cjs.map +1 -1
- package/dist/vue.d.cts +2 -1
- package/dist/vue.d.ts +2 -1
- package/dist/vue.js +2 -1
- package/dist/vue.js.map +1 -1
- package/package.json +37 -1
- package/dist/chunk-FOWW4LXS.js.map +0 -1
- package/dist/chunk-NJAI5R4J.cjs.map +0 -1
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import { clampToViewport, boundsEqual, clampSize, applyAspect, clamp, zoneBounds, magnetize, detectSnapZone } from './chunk-5XVIC5LH.js';
|
|
2
|
+
|
|
1
3
|
// src/core/emitter.ts
|
|
2
4
|
function createEmitter() {
|
|
3
5
|
const listeners = /* @__PURE__ */ new Map();
|
|
@@ -26,143 +28,6 @@ function createEmitter() {
|
|
|
26
28
|
};
|
|
27
29
|
}
|
|
28
30
|
|
|
29
|
-
// src/core/geometry.ts
|
|
30
|
-
function clamp(value, min, max) {
|
|
31
|
-
return Math.min(Math.max(value, min), max);
|
|
32
|
-
}
|
|
33
|
-
function clampSize(size, min, max) {
|
|
34
|
-
return {
|
|
35
|
-
width: clamp(size.width, min.width, max ? max.width : Number.POSITIVE_INFINITY),
|
|
36
|
-
height: clamp(size.height, min.height, max ? max.height : Number.POSITIVE_INFINITY)
|
|
37
|
-
};
|
|
38
|
-
}
|
|
39
|
-
function clampToViewport(bounds, viewport, minVisible) {
|
|
40
|
-
if (viewport.width <= 0 || viewport.height <= 0) return bounds;
|
|
41
|
-
const visibleX = Math.min(minVisible, bounds.width);
|
|
42
|
-
const visibleY = Math.min(minVisible, bounds.height);
|
|
43
|
-
const x = clamp(bounds.x, visibleX - bounds.width, Math.max(0, viewport.width - visibleX));
|
|
44
|
-
const y = clamp(bounds.y, 0, Math.max(0, viewport.height - visibleY));
|
|
45
|
-
return x === bounds.x && y === bounds.y ? bounds : { ...bounds, x, y };
|
|
46
|
-
}
|
|
47
|
-
function boundsEqual(a, b) {
|
|
48
|
-
return a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height;
|
|
49
|
-
}
|
|
50
|
-
function applyAspect(size, ratio, min, max, drive) {
|
|
51
|
-
if (!Number.isFinite(ratio) || ratio <= 0) return clampSize(size, min, max);
|
|
52
|
-
const maxWidth = max ? max.width : Number.POSITIVE_INFINITY;
|
|
53
|
-
const maxHeight = max ? max.height : Number.POSITIVE_INFINITY;
|
|
54
|
-
if (drive === "height") {
|
|
55
|
-
const height = clamp(
|
|
56
|
-
size.height,
|
|
57
|
-
Math.max(min.height, min.width / ratio),
|
|
58
|
-
Math.min(maxHeight, maxWidth / ratio)
|
|
59
|
-
);
|
|
60
|
-
return { width: height * ratio, height };
|
|
61
|
-
}
|
|
62
|
-
const width = clamp(
|
|
63
|
-
size.width,
|
|
64
|
-
Math.max(min.width, min.height * ratio),
|
|
65
|
-
Math.min(maxWidth, maxHeight * ratio)
|
|
66
|
-
);
|
|
67
|
-
return { width, height: width / ratio };
|
|
68
|
-
}
|
|
69
|
-
function zoneBounds(zone, viewport) {
|
|
70
|
-
const w = viewport.width;
|
|
71
|
-
const h = viewport.height;
|
|
72
|
-
const halfW = Math.round(w / 2);
|
|
73
|
-
const halfH = Math.round(h / 2);
|
|
74
|
-
const oneThird = Math.round(w / 3);
|
|
75
|
-
const twoThirds = Math.round(w * 2 / 3);
|
|
76
|
-
switch (zone) {
|
|
77
|
-
case "left-third":
|
|
78
|
-
return { x: 0, y: 0, width: oneThird, height: h };
|
|
79
|
-
case "center-third":
|
|
80
|
-
return { x: oneThird, y: 0, width: twoThirds - oneThird, height: h };
|
|
81
|
-
case "right-third":
|
|
82
|
-
return { x: twoThirds, y: 0, width: w - twoThirds, height: h };
|
|
83
|
-
case "left":
|
|
84
|
-
return { x: 0, y: 0, width: halfW, height: h };
|
|
85
|
-
case "right":
|
|
86
|
-
return { x: halfW, y: 0, width: w - halfW, height: h };
|
|
87
|
-
case "top":
|
|
88
|
-
return { x: 0, y: 0, width: w, height: halfH };
|
|
89
|
-
case "bottom":
|
|
90
|
-
return { x: 0, y: halfH, width: w, height: h - halfH };
|
|
91
|
-
case "top-left":
|
|
92
|
-
return { x: 0, y: 0, width: halfW, height: halfH };
|
|
93
|
-
case "top-right":
|
|
94
|
-
return { x: halfW, y: 0, width: w - halfW, height: halfH };
|
|
95
|
-
case "bottom-left":
|
|
96
|
-
return { x: 0, y: halfH, width: halfW, height: h - halfH };
|
|
97
|
-
case "bottom-right":
|
|
98
|
-
return { x: halfW, y: halfH, width: w - halfW, height: h - halfH };
|
|
99
|
-
}
|
|
100
|
-
}
|
|
101
|
-
function detectSnapZone(x, y, viewport, options = {}) {
|
|
102
|
-
const threshold = options.threshold ?? 12;
|
|
103
|
-
const cornerSize = options.cornerSize ?? 64;
|
|
104
|
-
const w = viewport.width;
|
|
105
|
-
const h = viewport.height;
|
|
106
|
-
if (w <= 0 || h <= 0) return null;
|
|
107
|
-
const nearLeft = x <= threshold;
|
|
108
|
-
const nearRight = x >= w - threshold;
|
|
109
|
-
const nearTop = y <= threshold;
|
|
110
|
-
const nearBottom = y >= h - threshold;
|
|
111
|
-
if (nearLeft || nearRight) {
|
|
112
|
-
const side = nearLeft ? "left" : "right";
|
|
113
|
-
if (y <= cornerSize) return `top-${side}`;
|
|
114
|
-
if (y >= h - cornerSize) return `bottom-${side}`;
|
|
115
|
-
return side;
|
|
116
|
-
}
|
|
117
|
-
if (nearTop) {
|
|
118
|
-
if (x <= cornerSize) return "top-left";
|
|
119
|
-
if (x >= w - cornerSize) return "top-right";
|
|
120
|
-
return "top";
|
|
121
|
-
}
|
|
122
|
-
if (nearBottom) {
|
|
123
|
-
if (x <= cornerSize) return "bottom-left";
|
|
124
|
-
if (x >= w - cornerSize) return "bottom-right";
|
|
125
|
-
return "bottom";
|
|
126
|
-
}
|
|
127
|
-
return null;
|
|
128
|
-
}
|
|
129
|
-
function nearestEdge(low, high, targetLow, targetHigh) {
|
|
130
|
-
return [targetLow - low, targetHigh - low, targetLow - high, targetHigh - high];
|
|
131
|
-
}
|
|
132
|
-
function magnetize(bounds, targets, threshold) {
|
|
133
|
-
const result = { x: bounds.x, y: bounds.y, snappedX: false, snappedY: false };
|
|
134
|
-
if (threshold <= 0 || targets.length === 0) return result;
|
|
135
|
-
let bestX = threshold + 1;
|
|
136
|
-
let bestY = threshold + 1;
|
|
137
|
-
for (const target of targets) {
|
|
138
|
-
for (const delta of nearestEdge(
|
|
139
|
-
bounds.x,
|
|
140
|
-
bounds.x + bounds.width,
|
|
141
|
-
target.x,
|
|
142
|
-
target.x + target.width
|
|
143
|
-
)) {
|
|
144
|
-
if (Math.abs(delta) <= threshold && Math.abs(delta) < Math.abs(bestX)) bestX = delta;
|
|
145
|
-
}
|
|
146
|
-
for (const delta of nearestEdge(
|
|
147
|
-
bounds.y,
|
|
148
|
-
bounds.y + bounds.height,
|
|
149
|
-
target.y,
|
|
150
|
-
target.y + target.height
|
|
151
|
-
)) {
|
|
152
|
-
if (Math.abs(delta) <= threshold && Math.abs(delta) < Math.abs(bestY)) bestY = delta;
|
|
153
|
-
}
|
|
154
|
-
}
|
|
155
|
-
if (Math.abs(bestX) <= threshold) {
|
|
156
|
-
result.x = bounds.x + bestX;
|
|
157
|
-
result.snappedX = true;
|
|
158
|
-
}
|
|
159
|
-
if (Math.abs(bestY) <= threshold) {
|
|
160
|
-
result.y = bounds.y + bestY;
|
|
161
|
-
result.snappedY = true;
|
|
162
|
-
}
|
|
163
|
-
return result;
|
|
164
|
-
}
|
|
165
|
-
|
|
166
31
|
// src/core/manager.ts
|
|
167
32
|
var LAYER_RANK = { normal: 0, floating: 1, modal: 2 };
|
|
168
33
|
var STAGES = ["normal", "minimized", "maximized", "snapped"];
|
|
@@ -1536,8 +1401,7 @@ function createDragStarter(ctx) {
|
|
|
1536
1401
|
pendingX: 0,
|
|
1537
1402
|
pendingY: 0,
|
|
1538
1403
|
hasPending: false,
|
|
1539
|
-
finish: () =>
|
|
1540
|
-
}
|
|
1404
|
+
finish: (cancelled) => finish(cancelled)
|
|
1541
1405
|
};
|
|
1542
1406
|
const el = ctx.windowElement(id);
|
|
1543
1407
|
function armGroup(target2) {
|
|
@@ -1710,7 +1574,6 @@ function createDragStarter(ctx) {
|
|
|
1710
1574
|
else wm.endInteraction();
|
|
1711
1575
|
}
|
|
1712
1576
|
}
|
|
1713
|
-
session.finish = finish;
|
|
1714
1577
|
wm.beginInteraction();
|
|
1715
1578
|
ctx.claimDrag(session);
|
|
1716
1579
|
handle.setPointerCapture(event.pointerId);
|
|
@@ -1964,6 +1827,10 @@ var SNAP_SHORTCUTS = {
|
|
|
1964
1827
|
};
|
|
1965
1828
|
var LANDMARK_TAGS = /* @__PURE__ */ new Set(["header", "footer", "aside", "nav"]);
|
|
1966
1829
|
var FOCUSABLE_SELECTOR = 'button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';
|
|
1830
|
+
function defaultVariant(win) {
|
|
1831
|
+
const variant = win.meta.variant;
|
|
1832
|
+
return typeof variant === "string" && variant !== "" ? variant : null;
|
|
1833
|
+
}
|
|
1967
1834
|
function attachDesktop(wm, element, options = {}) {
|
|
1968
1835
|
const doc = element.ownerDocument;
|
|
1969
1836
|
const view = windowOf(element);
|
|
@@ -1988,6 +1855,7 @@ function attachDesktop(wm, element, options = {}) {
|
|
|
1988
1855
|
const interactiveSelector = options.interactiveSelector ?? INTERACTIVE_SELECTOR;
|
|
1989
1856
|
const animationEnabled = options.animation !== false;
|
|
1990
1857
|
const animationOptions = typeof options.animation === "object" ? options.animation : {};
|
|
1858
|
+
const windowVariant = options.windowVariant ?? defaultVariant;
|
|
1991
1859
|
element.dataset.wmDesktop = "";
|
|
1992
1860
|
element.tabIndex = -1;
|
|
1993
1861
|
if (view.getComputedStyle(element).position === "static") {
|
|
@@ -2101,6 +1969,21 @@ function attachDesktop(wm, element, options = {}) {
|
|
|
2101
1969
|
};
|
|
2102
1970
|
const startDrag = createDragStarter(ctx);
|
|
2103
1971
|
const startResize = createResizeStarter(ctx);
|
|
1972
|
+
if (options.gestures) {
|
|
1973
|
+
const gestureContext = {
|
|
1974
|
+
wm,
|
|
1975
|
+
doc,
|
|
1976
|
+
view,
|
|
1977
|
+
desktop: element,
|
|
1978
|
+
toLocal: (event) => ctx.toLocal(event),
|
|
1979
|
+
trackRect: () => ctx.trackRect(),
|
|
1980
|
+
windowElement: (id) => ctx.windowElement(id),
|
|
1981
|
+
busy: () => drag !== null,
|
|
1982
|
+
claim: (gesture) => ctx.claimDrag(gesture),
|
|
1983
|
+
release: (gesture) => ctx.releaseDrag(gesture)
|
|
1984
|
+
};
|
|
1985
|
+
for (const gesture of options.gestures) cleanup.push(gesture(gestureContext));
|
|
1986
|
+
}
|
|
2104
1987
|
if (options.autoViewport !== false) {
|
|
2105
1988
|
const applyViewport = () => wm.setViewport({ width: element.clientWidth, height: element.clientHeight });
|
|
2106
1989
|
applyViewport();
|
|
@@ -2119,6 +2002,9 @@ function attachDesktop(wm, element, options = {}) {
|
|
|
2119
2002
|
el.dataset.wmStage = win.stage;
|
|
2120
2003
|
el.dataset.wmLayer = win.layer;
|
|
2121
2004
|
el.dataset.wmWorkspace = String(win.workspace);
|
|
2005
|
+
const variant = windowVariant(win);
|
|
2006
|
+
if (variant === null) delete el.dataset.wmVariant;
|
|
2007
|
+
else el.dataset.wmVariant = variant;
|
|
2122
2008
|
if (win.groupId === null) {
|
|
2123
2009
|
delete el.dataset.wmGroup;
|
|
2124
2010
|
delete el.dataset.wmTab;
|
|
@@ -2522,6 +2408,6 @@ function createDesktopBinder(wm, options = {}) {
|
|
|
2522
2408
|
};
|
|
2523
2409
|
}
|
|
2524
2410
|
|
|
2525
|
-
export {
|
|
2526
|
-
//# sourceMappingURL=chunk-
|
|
2527
|
-
//# sourceMappingURL=chunk-
|
|
2411
|
+
export { attachDesktop, createAnnouncer, createDesktopBinder, createEmitter, createWindowManager, defaultMessages, flipFromTarget, flipToTarget, prefersReducedMotion };
|
|
2412
|
+
//# sourceMappingURL=chunk-MGWCKHTZ.js.map
|
|
2413
|
+
//# sourceMappingURL=chunk-MGWCKHTZ.js.map
|