@surdeddd/wmkit 0.1.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/LICENSE +21 -0
- package/README.md +308 -0
- package/README.ru.md +120 -0
- package/dist/chunk-7HHDQEBI.js +1334 -0
- package/dist/chunk-7HHDQEBI.js.map +1 -0
- package/dist/chunk-KWLI7JIY.cjs +1349 -0
- package/dist/chunk-KWLI7JIY.cjs.map +1 -0
- package/dist/controller-B0bogK9N.d.cts +65 -0
- package/dist/controller-D5zIriLg.d.ts +65 -0
- package/dist/index.cjs +64 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +22 -0
- package/dist/index.d.ts +22 -0
- package/dist/index.js +3 -0
- package/dist/index.js.map +1 -0
- package/dist/persist.cjs +74 -0
- package/dist/persist.cjs.map +1 -0
- package/dist/persist.d.cts +22 -0
- package/dist/persist.d.ts +22 -0
- package/dist/persist.js +72 -0
- package/dist/persist.js.map +1 -0
- package/dist/popout.cjs +66 -0
- package/dist/popout.cjs.map +1 -0
- package/dist/popout.d.cts +28 -0
- package/dist/popout.d.ts +28 -0
- package/dist/popout.js +63 -0
- package/dist/popout.js.map +1 -0
- package/dist/react.cjs +57 -0
- package/dist/react.cjs.map +1 -0
- package/dist/react.d.cts +16 -0
- package/dist/react.d.ts +16 -0
- package/dist/react.js +51 -0
- package/dist/react.js.map +1 -0
- package/dist/solid.cjs +45 -0
- package/dist/solid.cjs.map +1 -0
- package/dist/solid.d.cts +15 -0
- package/dist/solid.d.ts +15 -0
- package/dist/solid.js +40 -0
- package/dist/solid.js.map +1 -0
- package/dist/svelte.cjs +60 -0
- package/dist/svelte.cjs.map +1 -0
- package/dist/svelte.d.cts +24 -0
- package/dist/svelte.d.ts +24 -0
- package/dist/svelte.js +55 -0
- package/dist/svelte.js.map +1 -0
- package/dist/themes/glass.css +203 -0
- package/dist/types-CtFzL_oA.d.cts +151 -0
- package/dist/types-CtFzL_oA.d.ts +151 -0
- package/dist/vue.cjs +54 -0
- package/dist/vue.cjs.map +1 -0
- package/dist/vue.d.cts +11 -0
- package/dist/vue.d.ts +11 -0
- package/dist/vue.js +48 -0
- package/dist/vue.js.map +1 -0
- package/package.json +257 -0
package/dist/svelte.cjs
ADDED
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var chunkKWLI7JIY_cjs = require('./chunk-KWLI7JIY.cjs');
|
|
4
|
+
|
|
5
|
+
// src/svelte.ts
|
|
6
|
+
function createManager(options) {
|
|
7
|
+
return chunkKWLI7JIY_cjs.createWindowManager(options);
|
|
8
|
+
}
|
|
9
|
+
function wmStore(wm) {
|
|
10
|
+
return {
|
|
11
|
+
subscribe(run) {
|
|
12
|
+
run(wm.getState());
|
|
13
|
+
return wm.subscribe(run);
|
|
14
|
+
}
|
|
15
|
+
};
|
|
16
|
+
}
|
|
17
|
+
function wmWindowStore(wm, id) {
|
|
18
|
+
return {
|
|
19
|
+
subscribe(run) {
|
|
20
|
+
run(wm.get(id));
|
|
21
|
+
let last = wm.get(id);
|
|
22
|
+
return wm.subscribe(() => {
|
|
23
|
+
const next = wm.get(id);
|
|
24
|
+
if (next !== last) {
|
|
25
|
+
last = next;
|
|
26
|
+
run(next);
|
|
27
|
+
}
|
|
28
|
+
});
|
|
29
|
+
}
|
|
30
|
+
};
|
|
31
|
+
}
|
|
32
|
+
function createDesktop(wm, options) {
|
|
33
|
+
const binder = chunkKWLI7JIY_cjs.createDesktopBinder(wm, options);
|
|
34
|
+
return {
|
|
35
|
+
binder,
|
|
36
|
+
desktop(node) {
|
|
37
|
+
const unbind = binder.bindDesktop(node);
|
|
38
|
+
return { destroy: unbind };
|
|
39
|
+
},
|
|
40
|
+
window(node, params) {
|
|
41
|
+
let unbind = binder.bindWindow(params.id, node, params);
|
|
42
|
+
return {
|
|
43
|
+
update(next) {
|
|
44
|
+
unbind();
|
|
45
|
+
unbind = binder.bindWindow(next.id, node, next);
|
|
46
|
+
},
|
|
47
|
+
destroy() {
|
|
48
|
+
unbind();
|
|
49
|
+
}
|
|
50
|
+
};
|
|
51
|
+
}
|
|
52
|
+
};
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
exports.createDesktop = createDesktop;
|
|
56
|
+
exports.createManager = createManager;
|
|
57
|
+
exports.wmStore = wmStore;
|
|
58
|
+
exports.wmWindowStore = wmWindowStore;
|
|
59
|
+
//# sourceMappingURL=svelte.cjs.map
|
|
60
|
+
//# sourceMappingURL=svelte.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/svelte.ts"],"names":["createWindowManager","createDesktopBinder"],"mappings":";;;;;AAsBO,SAAS,cAAc,OAAA,EAAyC;AACrE,EAAA,OAAOA,sCAAoB,OAAO,CAAA;AACpC;AAEO,SAAS,QAAQ,EAAA,EAAgD;AACtE,EAAA,OAAO;AAAA,IACL,UAAU,GAAA,EAAK;AACb,MAAA,GAAA,CAAI,EAAA,CAAG,UAAU,CAAA;AACjB,MAAA,OAAO,EAAA,CAAG,UAAU,GAAG,CAAA;AAAA,IACzB;AAAA,GACF;AACF;AAEO,SAAS,aAAA,CACd,IACA,EAAA,EACwC;AACxC,EAAA,OAAO;AAAA,IACL,UAAU,GAAA,EAAK;AACb,MAAA,GAAA,CAAI,EAAA,CAAG,GAAA,CAAI,EAAE,CAAC,CAAA;AACd,MAAA,IAAI,IAAA,GAAO,EAAA,CAAG,GAAA,CAAI,EAAE,CAAA;AACpB,MAAA,OAAO,EAAA,CAAG,UAAU,MAAM;AACxB,QAAA,MAAM,IAAA,GAAO,EAAA,CAAG,GAAA,CAAI,EAAE,CAAA;AACtB,QAAA,IAAI,SAAS,IAAA,EAAM;AACjB,UAAA,IAAA,GAAO,IAAA;AACP,UAAA,GAAA,CAAI,IAAI,CAAA;AAAA,QACV;AAAA,MACF,CAAC,CAAA;AAAA,IACH;AAAA,GACF;AACF;AAQO,SAAS,aAAA,CAAc,IAAmB,OAAA,EAAyC;AACxF,EAAA,MAAM,MAAA,GAASC,qCAAA,CAAoB,EAAA,EAAI,OAAO,CAAA;AAC9C,EAAA,OAAO;AAAA,IACL,MAAA;AAAA,IACA,QAAQ,IAAA,EAAM;AACZ,MAAA,MAAM,MAAA,GAAS,MAAA,CAAO,WAAA,CAAY,IAAI,CAAA;AACtC,MAAA,OAAO,EAAE,SAAS,MAAA,EAAO;AAAA,IAC3B,CAAA;AAAA,IACA,MAAA,CAAO,MAAM,MAAA,EAAQ;AACnB,MAAA,IAAI,SAAS,MAAA,CAAO,UAAA,CAAW,MAAA,CAAO,EAAA,EAAI,MAAM,MAAM,CAAA;AACtD,MAAA,OAAO;AAAA,QACL,OAAO,IAAA,EAAM;AACX,UAAA,MAAA,EAAO;AACP,UAAA,MAAA,GAAS,MAAA,CAAO,UAAA,CAAW,IAAA,CAAK,EAAA,EAAI,MAAM,IAAI,CAAA;AAAA,QAChD,CAAA;AAAA,QACA,OAAA,GAAU;AACR,UAAA,MAAA,EAAO;AAAA,QACT;AAAA,OACF;AAAA,IACF;AAAA,GACF;AACF","file":"svelte.cjs","sourcesContent":["import { createWindowManager } from './core/manager'\nimport type { ManagerOptions, ManagerState, WindowManager, WindowState } from './core/types'\nimport {\n createDesktopBinder,\n type DesktopBinder,\n type DesktopOptions,\n type WindowAttachOptions,\n} from './dom/controller'\n\nexport interface ReadableStore<T> {\n subscribe(run: (value: T) => void): () => void\n}\n\nexport interface ActionResult {\n update?(params: WindowActionParams): void\n destroy(): void\n}\n\nexport interface WindowActionParams extends WindowAttachOptions {\n id: string\n}\n\nexport function createManager(options?: ManagerOptions): WindowManager {\n return createWindowManager(options)\n}\n\nexport function wmStore(wm: WindowManager): ReadableStore<ManagerState> {\n return {\n subscribe(run) {\n run(wm.getState())\n return wm.subscribe(run)\n },\n }\n}\n\nexport function wmWindowStore(\n wm: WindowManager,\n id: string,\n): ReadableStore<WindowState | undefined> {\n return {\n subscribe(run) {\n run(wm.get(id))\n let last = wm.get(id)\n return wm.subscribe(() => {\n const next = wm.get(id)\n if (next !== last) {\n last = next\n run(next)\n }\n })\n },\n }\n}\n\nexport interface SvelteDesktop {\n binder: DesktopBinder\n desktop(node: HTMLElement): ActionResult\n window(node: HTMLElement, params: WindowActionParams): ActionResult\n}\n\nexport function createDesktop(wm: WindowManager, options?: DesktopOptions): SvelteDesktop {\n const binder = createDesktopBinder(wm, options)\n return {\n binder,\n desktop(node) {\n const unbind = binder.bindDesktop(node)\n return { destroy: unbind }\n },\n window(node, params) {\n let unbind = binder.bindWindow(params.id, node, params)\n return {\n update(next) {\n unbind()\n unbind = binder.bindWindow(next.id, node, next)\n },\n destroy() {\n unbind()\n },\n }\n },\n }\n}\n"]}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { W as WindowManager, M as ManagerOptions, b as ManagerState, i as WindowState } from './types-CtFzL_oA.cjs';
|
|
2
|
+
import { W as WindowAttachOptions, D as DesktopBinder, d as DesktopOptions } from './controller-B0bogK9N.cjs';
|
|
3
|
+
|
|
4
|
+
interface ReadableStore<T> {
|
|
5
|
+
subscribe(run: (value: T) => void): () => void;
|
|
6
|
+
}
|
|
7
|
+
interface ActionResult {
|
|
8
|
+
update?(params: WindowActionParams): void;
|
|
9
|
+
destroy(): void;
|
|
10
|
+
}
|
|
11
|
+
interface WindowActionParams extends WindowAttachOptions {
|
|
12
|
+
id: string;
|
|
13
|
+
}
|
|
14
|
+
declare function createManager(options?: ManagerOptions): WindowManager;
|
|
15
|
+
declare function wmStore(wm: WindowManager): ReadableStore<ManagerState>;
|
|
16
|
+
declare function wmWindowStore(wm: WindowManager, id: string): ReadableStore<WindowState | undefined>;
|
|
17
|
+
interface SvelteDesktop {
|
|
18
|
+
binder: DesktopBinder;
|
|
19
|
+
desktop(node: HTMLElement): ActionResult;
|
|
20
|
+
window(node: HTMLElement, params: WindowActionParams): ActionResult;
|
|
21
|
+
}
|
|
22
|
+
declare function createDesktop(wm: WindowManager, options?: DesktopOptions): SvelteDesktop;
|
|
23
|
+
|
|
24
|
+
export { type ActionResult, type ReadableStore, type SvelteDesktop, type WindowActionParams, createDesktop, createManager, wmStore, wmWindowStore };
|
package/dist/svelte.d.ts
ADDED
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { W as WindowManager, M as ManagerOptions, b as ManagerState, i as WindowState } from './types-CtFzL_oA.js';
|
|
2
|
+
import { W as WindowAttachOptions, D as DesktopBinder, d as DesktopOptions } from './controller-D5zIriLg.js';
|
|
3
|
+
|
|
4
|
+
interface ReadableStore<T> {
|
|
5
|
+
subscribe(run: (value: T) => void): () => void;
|
|
6
|
+
}
|
|
7
|
+
interface ActionResult {
|
|
8
|
+
update?(params: WindowActionParams): void;
|
|
9
|
+
destroy(): void;
|
|
10
|
+
}
|
|
11
|
+
interface WindowActionParams extends WindowAttachOptions {
|
|
12
|
+
id: string;
|
|
13
|
+
}
|
|
14
|
+
declare function createManager(options?: ManagerOptions): WindowManager;
|
|
15
|
+
declare function wmStore(wm: WindowManager): ReadableStore<ManagerState>;
|
|
16
|
+
declare function wmWindowStore(wm: WindowManager, id: string): ReadableStore<WindowState | undefined>;
|
|
17
|
+
interface SvelteDesktop {
|
|
18
|
+
binder: DesktopBinder;
|
|
19
|
+
desktop(node: HTMLElement): ActionResult;
|
|
20
|
+
window(node: HTMLElement, params: WindowActionParams): ActionResult;
|
|
21
|
+
}
|
|
22
|
+
declare function createDesktop(wm: WindowManager, options?: DesktopOptions): SvelteDesktop;
|
|
23
|
+
|
|
24
|
+
export { type ActionResult, type ReadableStore, type SvelteDesktop, type WindowActionParams, createDesktop, createManager, wmStore, wmWindowStore };
|
package/dist/svelte.js
ADDED
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { createWindowManager, createDesktopBinder } from './chunk-7HHDQEBI.js';
|
|
2
|
+
|
|
3
|
+
// src/svelte.ts
|
|
4
|
+
function createManager(options) {
|
|
5
|
+
return createWindowManager(options);
|
|
6
|
+
}
|
|
7
|
+
function wmStore(wm) {
|
|
8
|
+
return {
|
|
9
|
+
subscribe(run) {
|
|
10
|
+
run(wm.getState());
|
|
11
|
+
return wm.subscribe(run);
|
|
12
|
+
}
|
|
13
|
+
};
|
|
14
|
+
}
|
|
15
|
+
function wmWindowStore(wm, id) {
|
|
16
|
+
return {
|
|
17
|
+
subscribe(run) {
|
|
18
|
+
run(wm.get(id));
|
|
19
|
+
let last = wm.get(id);
|
|
20
|
+
return wm.subscribe(() => {
|
|
21
|
+
const next = wm.get(id);
|
|
22
|
+
if (next !== last) {
|
|
23
|
+
last = next;
|
|
24
|
+
run(next);
|
|
25
|
+
}
|
|
26
|
+
});
|
|
27
|
+
}
|
|
28
|
+
};
|
|
29
|
+
}
|
|
30
|
+
function createDesktop(wm, options) {
|
|
31
|
+
const binder = createDesktopBinder(wm, options);
|
|
32
|
+
return {
|
|
33
|
+
binder,
|
|
34
|
+
desktop(node) {
|
|
35
|
+
const unbind = binder.bindDesktop(node);
|
|
36
|
+
return { destroy: unbind };
|
|
37
|
+
},
|
|
38
|
+
window(node, params) {
|
|
39
|
+
let unbind = binder.bindWindow(params.id, node, params);
|
|
40
|
+
return {
|
|
41
|
+
update(next) {
|
|
42
|
+
unbind();
|
|
43
|
+
unbind = binder.bindWindow(next.id, node, next);
|
|
44
|
+
},
|
|
45
|
+
destroy() {
|
|
46
|
+
unbind();
|
|
47
|
+
}
|
|
48
|
+
};
|
|
49
|
+
}
|
|
50
|
+
};
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
export { createDesktop, createManager, wmStore, wmWindowStore };
|
|
54
|
+
//# sourceMappingURL=svelte.js.map
|
|
55
|
+
//# sourceMappingURL=svelte.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/svelte.ts"],"names":[],"mappings":";;;AAsBO,SAAS,cAAc,OAAA,EAAyC;AACrE,EAAA,OAAO,oBAAoB,OAAO,CAAA;AACpC;AAEO,SAAS,QAAQ,EAAA,EAAgD;AACtE,EAAA,OAAO;AAAA,IACL,UAAU,GAAA,EAAK;AACb,MAAA,GAAA,CAAI,EAAA,CAAG,UAAU,CAAA;AACjB,MAAA,OAAO,EAAA,CAAG,UAAU,GAAG,CAAA;AAAA,IACzB;AAAA,GACF;AACF;AAEO,SAAS,aAAA,CACd,IACA,EAAA,EACwC;AACxC,EAAA,OAAO;AAAA,IACL,UAAU,GAAA,EAAK;AACb,MAAA,GAAA,CAAI,EAAA,CAAG,GAAA,CAAI,EAAE,CAAC,CAAA;AACd,MAAA,IAAI,IAAA,GAAO,EAAA,CAAG,GAAA,CAAI,EAAE,CAAA;AACpB,MAAA,OAAO,EAAA,CAAG,UAAU,MAAM;AACxB,QAAA,MAAM,IAAA,GAAO,EAAA,CAAG,GAAA,CAAI,EAAE,CAAA;AACtB,QAAA,IAAI,SAAS,IAAA,EAAM;AACjB,UAAA,IAAA,GAAO,IAAA;AACP,UAAA,GAAA,CAAI,IAAI,CAAA;AAAA,QACV;AAAA,MACF,CAAC,CAAA;AAAA,IACH;AAAA,GACF;AACF;AAQO,SAAS,aAAA,CAAc,IAAmB,OAAA,EAAyC;AACxF,EAAA,MAAM,MAAA,GAAS,mBAAA,CAAoB,EAAA,EAAI,OAAO,CAAA;AAC9C,EAAA,OAAO;AAAA,IACL,MAAA;AAAA,IACA,QAAQ,IAAA,EAAM;AACZ,MAAA,MAAM,MAAA,GAAS,MAAA,CAAO,WAAA,CAAY,IAAI,CAAA;AACtC,MAAA,OAAO,EAAE,SAAS,MAAA,EAAO;AAAA,IAC3B,CAAA;AAAA,IACA,MAAA,CAAO,MAAM,MAAA,EAAQ;AACnB,MAAA,IAAI,SAAS,MAAA,CAAO,UAAA,CAAW,MAAA,CAAO,EAAA,EAAI,MAAM,MAAM,CAAA;AACtD,MAAA,OAAO;AAAA,QACL,OAAO,IAAA,EAAM;AACX,UAAA,MAAA,EAAO;AACP,UAAA,MAAA,GAAS,MAAA,CAAO,UAAA,CAAW,IAAA,CAAK,EAAA,EAAI,MAAM,IAAI,CAAA;AAAA,QAChD,CAAA;AAAA,QACA,OAAA,GAAU;AACR,UAAA,MAAA,EAAO;AAAA,QACT;AAAA,OACF;AAAA,IACF;AAAA,GACF;AACF","file":"svelte.js","sourcesContent":["import { createWindowManager } from './core/manager'\nimport type { ManagerOptions, ManagerState, WindowManager, WindowState } from './core/types'\nimport {\n createDesktopBinder,\n type DesktopBinder,\n type DesktopOptions,\n type WindowAttachOptions,\n} from './dom/controller'\n\nexport interface ReadableStore<T> {\n subscribe(run: (value: T) => void): () => void\n}\n\nexport interface ActionResult {\n update?(params: WindowActionParams): void\n destroy(): void\n}\n\nexport interface WindowActionParams extends WindowAttachOptions {\n id: string\n}\n\nexport function createManager(options?: ManagerOptions): WindowManager {\n return createWindowManager(options)\n}\n\nexport function wmStore(wm: WindowManager): ReadableStore<ManagerState> {\n return {\n subscribe(run) {\n run(wm.getState())\n return wm.subscribe(run)\n },\n }\n}\n\nexport function wmWindowStore(\n wm: WindowManager,\n id: string,\n): ReadableStore<WindowState | undefined> {\n return {\n subscribe(run) {\n run(wm.get(id))\n let last = wm.get(id)\n return wm.subscribe(() => {\n const next = wm.get(id)\n if (next !== last) {\n last = next\n run(next)\n }\n })\n },\n }\n}\n\nexport interface SvelteDesktop {\n binder: DesktopBinder\n desktop(node: HTMLElement): ActionResult\n window(node: HTMLElement, params: WindowActionParams): ActionResult\n}\n\nexport function createDesktop(wm: WindowManager, options?: DesktopOptions): SvelteDesktop {\n const binder = createDesktopBinder(wm, options)\n return {\n binder,\n desktop(node) {\n const unbind = binder.bindDesktop(node)\n return { destroy: unbind }\n },\n window(node, params) {\n let unbind = binder.bindWindow(params.id, node, params)\n return {\n update(next) {\n unbind()\n unbind = binder.bindWindow(next.id, node, next)\n },\n destroy() {\n unbind()\n },\n }\n },\n }\n}\n"]}
|
|
@@ -0,0 +1,203 @@
|
|
|
1
|
+
[data-wm-desktop] {
|
|
2
|
+
--wm-radius: 14px;
|
|
3
|
+
--wm-bg: rgba(22, 24, 34, 0.55);
|
|
4
|
+
--wm-bg-focused: rgba(26, 28, 40, 0.68);
|
|
5
|
+
--wm-border: rgba(255, 255, 255, 0.09);
|
|
6
|
+
--wm-border-focused: rgba(255, 255, 255, 0.22);
|
|
7
|
+
--wm-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
|
|
8
|
+
--wm-shadow-focused: 0 18px 48px rgba(0, 0, 0, 0.5);
|
|
9
|
+
--wm-titlebar-bg: rgba(255, 255, 255, 0.04);
|
|
10
|
+
--wm-text: rgba(240, 242, 250, 0.92);
|
|
11
|
+
--wm-text-dim: rgba(240, 242, 250, 0.55);
|
|
12
|
+
--wm-accent: #7c6cff;
|
|
13
|
+
--wm-blur: 22px;
|
|
14
|
+
--wm-transition: 240ms cubic-bezier(0.32, 0.72, 0, 1);
|
|
15
|
+
position: relative;
|
|
16
|
+
overflow: hidden;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
[data-wm-window] {
|
|
20
|
+
display: flex;
|
|
21
|
+
flex-direction: column;
|
|
22
|
+
box-sizing: border-box;
|
|
23
|
+
color: var(--wm-text);
|
|
24
|
+
background: var(--wm-bg);
|
|
25
|
+
-webkit-backdrop-filter: blur(var(--wm-blur)) saturate(1.4);
|
|
26
|
+
backdrop-filter: blur(var(--wm-blur)) saturate(1.4);
|
|
27
|
+
border: 1px solid var(--wm-border);
|
|
28
|
+
border-radius: var(--wm-radius);
|
|
29
|
+
box-shadow: var(--wm-shadow);
|
|
30
|
+
outline: none;
|
|
31
|
+
contain: layout style;
|
|
32
|
+
will-change: transform;
|
|
33
|
+
transition:
|
|
34
|
+
transform var(--wm-transition),
|
|
35
|
+
width var(--wm-transition),
|
|
36
|
+
height var(--wm-transition),
|
|
37
|
+
box-shadow 180ms ease,
|
|
38
|
+
border-color 180ms ease,
|
|
39
|
+
opacity 180ms ease;
|
|
40
|
+
animation: wm-window-in 220ms cubic-bezier(0.32, 0.72, 0, 1);
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
[data-wm-window][hidden] {
|
|
44
|
+
display: none;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
[data-wm-window][data-wm-focused] {
|
|
48
|
+
background: var(--wm-bg-focused);
|
|
49
|
+
border-color: var(--wm-border-focused);
|
|
50
|
+
box-shadow: var(--wm-shadow-focused);
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
[data-wm-window][data-wm-dragging],
|
|
54
|
+
[data-wm-window][data-wm-resizing] {
|
|
55
|
+
transition:
|
|
56
|
+
box-shadow 180ms ease,
|
|
57
|
+
border-color 180ms ease;
|
|
58
|
+
user-select: none;
|
|
59
|
+
-webkit-user-select: none;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
[data-wm-window][data-wm-stage="maximized"],
|
|
63
|
+
[data-wm-window][data-wm-stage="snapped"] {
|
|
64
|
+
border-radius: 0;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
[data-wm-window][data-wm-flash] {
|
|
68
|
+
animation: wm-flash 320ms ease;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
[data-wm-window] [data-wm-drag] {
|
|
72
|
+
display: flex;
|
|
73
|
+
align-items: center;
|
|
74
|
+
gap: 8px;
|
|
75
|
+
padding: 10px 14px;
|
|
76
|
+
background: var(--wm-titlebar-bg);
|
|
77
|
+
border-bottom: 1px solid var(--wm-border);
|
|
78
|
+
border-radius: var(--wm-radius) var(--wm-radius) 0 0;
|
|
79
|
+
cursor: default;
|
|
80
|
+
user-select: none;
|
|
81
|
+
-webkit-user-select: none;
|
|
82
|
+
flex-shrink: 0;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
[data-wm-window][data-wm-stage="maximized"] [data-wm-drag],
|
|
86
|
+
[data-wm-window][data-wm-stage="snapped"] [data-wm-drag] {
|
|
87
|
+
border-radius: 0;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
[data-wm-window] [data-wm-title] {
|
|
91
|
+
flex: 1;
|
|
92
|
+
font-size: 13px;
|
|
93
|
+
font-weight: 600;
|
|
94
|
+
letter-spacing: 0.01em;
|
|
95
|
+
color: var(--wm-text);
|
|
96
|
+
white-space: nowrap;
|
|
97
|
+
overflow: hidden;
|
|
98
|
+
text-overflow: ellipsis;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
[data-wm-window] [data-wm-controls] {
|
|
102
|
+
display: flex;
|
|
103
|
+
gap: 8px;
|
|
104
|
+
align-items: center;
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
[data-wm-window] [data-wm-close],
|
|
108
|
+
[data-wm-window] [data-wm-minimize],
|
|
109
|
+
[data-wm-window] [data-wm-maximize] {
|
|
110
|
+
width: 13px;
|
|
111
|
+
height: 13px;
|
|
112
|
+
border-radius: 50%;
|
|
113
|
+
border: none;
|
|
114
|
+
padding: 0;
|
|
115
|
+
cursor: pointer;
|
|
116
|
+
transition:
|
|
117
|
+
filter 120ms ease,
|
|
118
|
+
transform 120ms ease;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
[data-wm-window] [data-wm-close]:hover,
|
|
122
|
+
[data-wm-window] [data-wm-minimize]:hover,
|
|
123
|
+
[data-wm-window] [data-wm-maximize]:hover {
|
|
124
|
+
filter: brightness(1.25);
|
|
125
|
+
transform: scale(1.12);
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
[data-wm-window] [data-wm-close]:focus-visible,
|
|
129
|
+
[data-wm-window] [data-wm-minimize]:focus-visible,
|
|
130
|
+
[data-wm-window] [data-wm-maximize]:focus-visible {
|
|
131
|
+
outline: 2px solid var(--wm-accent);
|
|
132
|
+
outline-offset: 2px;
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
[data-wm-window] [data-wm-close] {
|
|
136
|
+
background: #ff5f57;
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
[data-wm-window] [data-wm-minimize] {
|
|
140
|
+
background: #febc2e;
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
[data-wm-window] [data-wm-maximize] {
|
|
144
|
+
background: #28c840;
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
[data-wm-window] [data-wm-content] {
|
|
148
|
+
flex: 1;
|
|
149
|
+
overflow: auto;
|
|
150
|
+
padding: 14px;
|
|
151
|
+
font-size: 14px;
|
|
152
|
+
line-height: 1.55;
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
[data-wm-snap-preview] {
|
|
156
|
+
background: color-mix(in srgb, var(--wm-accent) 18%, transparent);
|
|
157
|
+
border: 1.5px solid color-mix(in srgb, var(--wm-accent) 55%, transparent);
|
|
158
|
+
border-radius: var(--wm-radius);
|
|
159
|
+
-webkit-backdrop-filter: blur(4px);
|
|
160
|
+
backdrop-filter: blur(4px);
|
|
161
|
+
transition:
|
|
162
|
+
transform 140ms cubic-bezier(0.32, 0.72, 0, 1),
|
|
163
|
+
width 140ms ease,
|
|
164
|
+
height 140ms ease;
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
@keyframes wm-window-in {
|
|
168
|
+
from {
|
|
169
|
+
opacity: 0;
|
|
170
|
+
scale: 0.96;
|
|
171
|
+
}
|
|
172
|
+
to {
|
|
173
|
+
opacity: 1;
|
|
174
|
+
scale: 1;
|
|
175
|
+
}
|
|
176
|
+
}
|
|
177
|
+
|
|
178
|
+
@keyframes wm-flash {
|
|
179
|
+
0%,
|
|
180
|
+
100% {
|
|
181
|
+
translate: 0 0;
|
|
182
|
+
}
|
|
183
|
+
20% {
|
|
184
|
+
translate: -6px 0;
|
|
185
|
+
}
|
|
186
|
+
45% {
|
|
187
|
+
translate: 5px 0;
|
|
188
|
+
}
|
|
189
|
+
70% {
|
|
190
|
+
translate: -3px 0;
|
|
191
|
+
}
|
|
192
|
+
90% {
|
|
193
|
+
translate: 2px 0;
|
|
194
|
+
}
|
|
195
|
+
}
|
|
196
|
+
|
|
197
|
+
@media (prefers-reduced-motion: reduce) {
|
|
198
|
+
[data-wm-window],
|
|
199
|
+
[data-wm-snap-preview] {
|
|
200
|
+
transition: none;
|
|
201
|
+
animation: none;
|
|
202
|
+
}
|
|
203
|
+
}
|
|
@@ -0,0 +1,151 @@
|
|
|
1
|
+
interface Size {
|
|
2
|
+
width: number;
|
|
3
|
+
height: number;
|
|
4
|
+
}
|
|
5
|
+
interface Bounds {
|
|
6
|
+
x: number;
|
|
7
|
+
y: number;
|
|
8
|
+
width: number;
|
|
9
|
+
height: number;
|
|
10
|
+
}
|
|
11
|
+
type WindowStage = 'normal' | 'minimized' | 'maximized' | 'snapped';
|
|
12
|
+
type WindowLayer = 'normal' | 'floating' | 'modal';
|
|
13
|
+
type SnapZone = 'left' | 'right' | 'top' | 'bottom' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
|
|
14
|
+
interface WindowFlags {
|
|
15
|
+
draggable: boolean;
|
|
16
|
+
resizable: boolean;
|
|
17
|
+
closable: boolean;
|
|
18
|
+
minimizable: boolean;
|
|
19
|
+
maximizable: boolean;
|
|
20
|
+
snappable: boolean;
|
|
21
|
+
}
|
|
22
|
+
interface WindowState extends WindowFlags {
|
|
23
|
+
id: string;
|
|
24
|
+
title: string;
|
|
25
|
+
bounds: Bounds;
|
|
26
|
+
restoreBounds: Bounds | null;
|
|
27
|
+
restoreStage: WindowStage | null;
|
|
28
|
+
stage: WindowStage;
|
|
29
|
+
snapZone: SnapZone | null;
|
|
30
|
+
layer: WindowLayer;
|
|
31
|
+
minSize: Size;
|
|
32
|
+
maxSize: Size | null;
|
|
33
|
+
openedSeq: number;
|
|
34
|
+
meta: Record<string, unknown>;
|
|
35
|
+
}
|
|
36
|
+
interface WindowInit extends Partial<WindowFlags> {
|
|
37
|
+
id?: string;
|
|
38
|
+
title?: string;
|
|
39
|
+
x?: number;
|
|
40
|
+
y?: number;
|
|
41
|
+
width?: number;
|
|
42
|
+
height?: number;
|
|
43
|
+
minWidth?: number;
|
|
44
|
+
minHeight?: number;
|
|
45
|
+
maxWidth?: number;
|
|
46
|
+
maxHeight?: number;
|
|
47
|
+
stage?: WindowStage;
|
|
48
|
+
layer?: WindowLayer;
|
|
49
|
+
meta?: Record<string, unknown>;
|
|
50
|
+
}
|
|
51
|
+
interface ManagerState {
|
|
52
|
+
windows: Readonly<Record<string, WindowState>>;
|
|
53
|
+
order: readonly string[];
|
|
54
|
+
focusedId: string | null;
|
|
55
|
+
viewport: Size;
|
|
56
|
+
}
|
|
57
|
+
interface SerializedState {
|
|
58
|
+
version: 1;
|
|
59
|
+
windows: WindowState[];
|
|
60
|
+
order: string[];
|
|
61
|
+
focusedId: string | null;
|
|
62
|
+
}
|
|
63
|
+
interface ManagerEvents {
|
|
64
|
+
open: {
|
|
65
|
+
window: WindowState;
|
|
66
|
+
};
|
|
67
|
+
close: {
|
|
68
|
+
window: WindowState;
|
|
69
|
+
};
|
|
70
|
+
focus: {
|
|
71
|
+
window: WindowState;
|
|
72
|
+
previous: string | null;
|
|
73
|
+
};
|
|
74
|
+
move: {
|
|
75
|
+
window: WindowState;
|
|
76
|
+
};
|
|
77
|
+
resize: {
|
|
78
|
+
window: WindowState;
|
|
79
|
+
};
|
|
80
|
+
stage: {
|
|
81
|
+
window: WindowState;
|
|
82
|
+
previous: WindowStage;
|
|
83
|
+
};
|
|
84
|
+
update: {
|
|
85
|
+
window: WindowState;
|
|
86
|
+
};
|
|
87
|
+
order: {
|
|
88
|
+
order: readonly string[];
|
|
89
|
+
};
|
|
90
|
+
modalblocked: {
|
|
91
|
+
window: WindowState;
|
|
92
|
+
};
|
|
93
|
+
change: {
|
|
94
|
+
state: ManagerState;
|
|
95
|
+
};
|
|
96
|
+
}
|
|
97
|
+
interface ManagerOptions {
|
|
98
|
+
viewport?: Size;
|
|
99
|
+
keepInViewport?: boolean;
|
|
100
|
+
minVisible?: number;
|
|
101
|
+
defaultSize?: Size;
|
|
102
|
+
cascadeOffset?: number;
|
|
103
|
+
cascadeOrigin?: {
|
|
104
|
+
x: number;
|
|
105
|
+
y: number;
|
|
106
|
+
};
|
|
107
|
+
idPrefix?: string;
|
|
108
|
+
}
|
|
109
|
+
interface WindowUpdate {
|
|
110
|
+
title?: string;
|
|
111
|
+
layer?: WindowLayer;
|
|
112
|
+
minSize?: Size;
|
|
113
|
+
maxSize?: Size | null;
|
|
114
|
+
meta?: Record<string, unknown>;
|
|
115
|
+
draggable?: boolean;
|
|
116
|
+
resizable?: boolean;
|
|
117
|
+
closable?: boolean;
|
|
118
|
+
minimizable?: boolean;
|
|
119
|
+
maximizable?: boolean;
|
|
120
|
+
snappable?: boolean;
|
|
121
|
+
}
|
|
122
|
+
interface WindowManager {
|
|
123
|
+
open(init?: WindowInit): WindowState;
|
|
124
|
+
close(id: string): boolean;
|
|
125
|
+
closeAll(): void;
|
|
126
|
+
focus(id: string): boolean;
|
|
127
|
+
blur(): void;
|
|
128
|
+
cycleFocus(direction?: 1 | -1): string | null;
|
|
129
|
+
minimize(id: string): boolean;
|
|
130
|
+
maximize(id: string): boolean;
|
|
131
|
+
toggleMaximize(id: string): boolean;
|
|
132
|
+
restore(id: string): boolean;
|
|
133
|
+
restoreTo(id: string, bounds: Bounds): boolean;
|
|
134
|
+
snap(id: string, zone: SnapZone): boolean;
|
|
135
|
+
move(id: string, x: number, y: number): boolean;
|
|
136
|
+
moveBy(id: string, dx: number, dy: number): boolean;
|
|
137
|
+
resize(id: string, patch: Partial<Bounds>): boolean;
|
|
138
|
+
update(id: string, patch: WindowUpdate): boolean;
|
|
139
|
+
get(id: string): WindowState | undefined;
|
|
140
|
+
getState(): ManagerState;
|
|
141
|
+
minimized(): readonly WindowState[];
|
|
142
|
+
setViewport(viewport: Size): void;
|
|
143
|
+
batch(run: () => void): void;
|
|
144
|
+
serialize(): SerializedState;
|
|
145
|
+
hydrate(data: SerializedState): boolean;
|
|
146
|
+
subscribe(listener: (state: ManagerState) => void): () => void;
|
|
147
|
+
on<K extends keyof ManagerEvents>(event: K, listener: (payload: ManagerEvents[K]) => void): () => void;
|
|
148
|
+
destroy(): void;
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
export type { Bounds as B, ManagerOptions as M, SerializedState as S, WindowManager as W, ManagerEvents as a, ManagerState as b, Size as c, SnapZone as d, WindowFlags as e, WindowInit as f, WindowLayer as g, WindowStage as h, WindowState as i, WindowUpdate as j };
|
|
@@ -0,0 +1,151 @@
|
|
|
1
|
+
interface Size {
|
|
2
|
+
width: number;
|
|
3
|
+
height: number;
|
|
4
|
+
}
|
|
5
|
+
interface Bounds {
|
|
6
|
+
x: number;
|
|
7
|
+
y: number;
|
|
8
|
+
width: number;
|
|
9
|
+
height: number;
|
|
10
|
+
}
|
|
11
|
+
type WindowStage = 'normal' | 'minimized' | 'maximized' | 'snapped';
|
|
12
|
+
type WindowLayer = 'normal' | 'floating' | 'modal';
|
|
13
|
+
type SnapZone = 'left' | 'right' | 'top' | 'bottom' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
|
|
14
|
+
interface WindowFlags {
|
|
15
|
+
draggable: boolean;
|
|
16
|
+
resizable: boolean;
|
|
17
|
+
closable: boolean;
|
|
18
|
+
minimizable: boolean;
|
|
19
|
+
maximizable: boolean;
|
|
20
|
+
snappable: boolean;
|
|
21
|
+
}
|
|
22
|
+
interface WindowState extends WindowFlags {
|
|
23
|
+
id: string;
|
|
24
|
+
title: string;
|
|
25
|
+
bounds: Bounds;
|
|
26
|
+
restoreBounds: Bounds | null;
|
|
27
|
+
restoreStage: WindowStage | null;
|
|
28
|
+
stage: WindowStage;
|
|
29
|
+
snapZone: SnapZone | null;
|
|
30
|
+
layer: WindowLayer;
|
|
31
|
+
minSize: Size;
|
|
32
|
+
maxSize: Size | null;
|
|
33
|
+
openedSeq: number;
|
|
34
|
+
meta: Record<string, unknown>;
|
|
35
|
+
}
|
|
36
|
+
interface WindowInit extends Partial<WindowFlags> {
|
|
37
|
+
id?: string;
|
|
38
|
+
title?: string;
|
|
39
|
+
x?: number;
|
|
40
|
+
y?: number;
|
|
41
|
+
width?: number;
|
|
42
|
+
height?: number;
|
|
43
|
+
minWidth?: number;
|
|
44
|
+
minHeight?: number;
|
|
45
|
+
maxWidth?: number;
|
|
46
|
+
maxHeight?: number;
|
|
47
|
+
stage?: WindowStage;
|
|
48
|
+
layer?: WindowLayer;
|
|
49
|
+
meta?: Record<string, unknown>;
|
|
50
|
+
}
|
|
51
|
+
interface ManagerState {
|
|
52
|
+
windows: Readonly<Record<string, WindowState>>;
|
|
53
|
+
order: readonly string[];
|
|
54
|
+
focusedId: string | null;
|
|
55
|
+
viewport: Size;
|
|
56
|
+
}
|
|
57
|
+
interface SerializedState {
|
|
58
|
+
version: 1;
|
|
59
|
+
windows: WindowState[];
|
|
60
|
+
order: string[];
|
|
61
|
+
focusedId: string | null;
|
|
62
|
+
}
|
|
63
|
+
interface ManagerEvents {
|
|
64
|
+
open: {
|
|
65
|
+
window: WindowState;
|
|
66
|
+
};
|
|
67
|
+
close: {
|
|
68
|
+
window: WindowState;
|
|
69
|
+
};
|
|
70
|
+
focus: {
|
|
71
|
+
window: WindowState;
|
|
72
|
+
previous: string | null;
|
|
73
|
+
};
|
|
74
|
+
move: {
|
|
75
|
+
window: WindowState;
|
|
76
|
+
};
|
|
77
|
+
resize: {
|
|
78
|
+
window: WindowState;
|
|
79
|
+
};
|
|
80
|
+
stage: {
|
|
81
|
+
window: WindowState;
|
|
82
|
+
previous: WindowStage;
|
|
83
|
+
};
|
|
84
|
+
update: {
|
|
85
|
+
window: WindowState;
|
|
86
|
+
};
|
|
87
|
+
order: {
|
|
88
|
+
order: readonly string[];
|
|
89
|
+
};
|
|
90
|
+
modalblocked: {
|
|
91
|
+
window: WindowState;
|
|
92
|
+
};
|
|
93
|
+
change: {
|
|
94
|
+
state: ManagerState;
|
|
95
|
+
};
|
|
96
|
+
}
|
|
97
|
+
interface ManagerOptions {
|
|
98
|
+
viewport?: Size;
|
|
99
|
+
keepInViewport?: boolean;
|
|
100
|
+
minVisible?: number;
|
|
101
|
+
defaultSize?: Size;
|
|
102
|
+
cascadeOffset?: number;
|
|
103
|
+
cascadeOrigin?: {
|
|
104
|
+
x: number;
|
|
105
|
+
y: number;
|
|
106
|
+
};
|
|
107
|
+
idPrefix?: string;
|
|
108
|
+
}
|
|
109
|
+
interface WindowUpdate {
|
|
110
|
+
title?: string;
|
|
111
|
+
layer?: WindowLayer;
|
|
112
|
+
minSize?: Size;
|
|
113
|
+
maxSize?: Size | null;
|
|
114
|
+
meta?: Record<string, unknown>;
|
|
115
|
+
draggable?: boolean;
|
|
116
|
+
resizable?: boolean;
|
|
117
|
+
closable?: boolean;
|
|
118
|
+
minimizable?: boolean;
|
|
119
|
+
maximizable?: boolean;
|
|
120
|
+
snappable?: boolean;
|
|
121
|
+
}
|
|
122
|
+
interface WindowManager {
|
|
123
|
+
open(init?: WindowInit): WindowState;
|
|
124
|
+
close(id: string): boolean;
|
|
125
|
+
closeAll(): void;
|
|
126
|
+
focus(id: string): boolean;
|
|
127
|
+
blur(): void;
|
|
128
|
+
cycleFocus(direction?: 1 | -1): string | null;
|
|
129
|
+
minimize(id: string): boolean;
|
|
130
|
+
maximize(id: string): boolean;
|
|
131
|
+
toggleMaximize(id: string): boolean;
|
|
132
|
+
restore(id: string): boolean;
|
|
133
|
+
restoreTo(id: string, bounds: Bounds): boolean;
|
|
134
|
+
snap(id: string, zone: SnapZone): boolean;
|
|
135
|
+
move(id: string, x: number, y: number): boolean;
|
|
136
|
+
moveBy(id: string, dx: number, dy: number): boolean;
|
|
137
|
+
resize(id: string, patch: Partial<Bounds>): boolean;
|
|
138
|
+
update(id: string, patch: WindowUpdate): boolean;
|
|
139
|
+
get(id: string): WindowState | undefined;
|
|
140
|
+
getState(): ManagerState;
|
|
141
|
+
minimized(): readonly WindowState[];
|
|
142
|
+
setViewport(viewport: Size): void;
|
|
143
|
+
batch(run: () => void): void;
|
|
144
|
+
serialize(): SerializedState;
|
|
145
|
+
hydrate(data: SerializedState): boolean;
|
|
146
|
+
subscribe(listener: (state: ManagerState) => void): () => void;
|
|
147
|
+
on<K extends keyof ManagerEvents>(event: K, listener: (payload: ManagerEvents[K]) => void): () => void;
|
|
148
|
+
destroy(): void;
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
export type { Bounds as B, ManagerOptions as M, SerializedState as S, WindowManager as W, ManagerEvents as a, ManagerState as b, Size as c, SnapZone as d, WindowFlags as e, WindowInit as f, WindowLayer as g, WindowStage as h, WindowState as i, WindowUpdate as j };
|