@pie-players/pie-section-player-tools-shared 0.3.43 → 0.3.44
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/dist/floating-panel.d.ts +0 -1
- package/dist/index.d.ts +0 -1
- package/dist/index.types.d.ts +7 -0
- package/dist/section-controller.d.ts +0 -1
- package/dist/vite.config.d.ts +0 -1
- package/package.json +5 -28
- package/DebugPanelToggles.svelte +0 -84
- package/PanelResizeHandle.svelte +0 -52
- package/PanelWindowControls.svelte +0 -97
- package/SessionDbPanel.svelte +0 -546
- package/SharedFloatingPanel.svelte +0 -304
- package/dist/floating-panel.d.ts.map +0 -1
- package/dist/index.d.ts.map +0 -1
- package/dist/section-controller.d.ts.map +0 -1
- package/dist/vite.config.d.ts.map +0 -1
- package/floating-panel.ts +0 -187
- package/index.ts +0 -21
- package/section-controller.ts +0 -51
- package/vite.config.ts +0 -36
package/dist/floating-panel.d.ts
CHANGED
package/dist/index.d.ts
CHANGED
|
@@ -5,4 +5,3 @@ export { default as SessionDbPanel } from './SessionDbPanel.svelte';
|
|
|
5
5
|
export { default as DebugPanelToggles } from './DebugPanelToggles.svelte';
|
|
6
6
|
export { createFloatingPanelPointerController, computePanelSizeFromViewport, claimNextFloatingPanelZIndex, type FloatingPanelPointerController, type FloatingPanelState, type FloatingPanelViewportSizing, } from './floating-panel.js';
|
|
7
7
|
export { getSectionControllerFromCoordinator, isMatchingSectionControllerLifecycleEvent, optionalIdsEqual, type SectionControllerLifecycleEventLike, type SectionControllerKeyLike, type ToolkitCoordinatorWithSectionController, } from './section-controller.js';
|
|
8
|
-
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export declare const PanelWindowControls: any;
|
|
2
|
+
export declare const PanelResizeHandle: any;
|
|
3
|
+
export declare const SharedFloatingPanel: any;
|
|
4
|
+
export declare const SessionDbPanel: any;
|
|
5
|
+
export declare const DebugPanelToggles: any;
|
|
6
|
+
export { createFloatingPanelPointerController, computePanelSizeFromViewport, claimNextFloatingPanelZIndex, type FloatingPanelPointerController, type FloatingPanelState, type FloatingPanelViewportSizing, } from './floating-panel.js';
|
|
7
|
+
export { getSectionControllerFromCoordinator, isMatchingSectionControllerLifecycleEvent, optionalIdsEqual, type SectionControllerLifecycleEventLike, type SectionControllerKeyLike, type ToolkitCoordinatorWithSectionController, } from './section-controller.js';
|
|
@@ -16,4 +16,3 @@ export type ToolkitCoordinatorWithSectionController<TController> = {
|
|
|
16
16
|
export declare function optionalIdsEqual(left?: string, right?: string): boolean;
|
|
17
17
|
export declare function isMatchingSectionControllerLifecycleEvent(event: SectionControllerLifecycleEventLike, sectionId: string, attemptId?: string): boolean;
|
|
18
18
|
export declare function getSectionControllerFromCoordinator<TController>(coordinator: ToolkitCoordinatorWithSectionController<TController> | null | undefined, sectionId: string, attemptId?: string): TController | null;
|
|
19
|
-
//# sourceMappingURL=section-controller.d.ts.map
|
package/dist/vite.config.d.ts
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pie-players/pie-section-player-tools-shared",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.44",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "Shared UI and helpers for PIE section-player debug tools",
|
|
6
6
|
"repository": {
|
|
@@ -22,42 +22,19 @@
|
|
|
22
22
|
"module": "./dist/index.js",
|
|
23
23
|
"exports": {
|
|
24
24
|
".": {
|
|
25
|
-
"types": "./dist/index.d.ts",
|
|
26
|
-
"import": "./dist/index.js"
|
|
27
|
-
"svelte": "./index.ts"
|
|
28
|
-
},
|
|
29
|
-
"./PanelWindowControls.svelte": {
|
|
30
|
-
"types": "./dist/PanelWindowControls.svelte.d.ts",
|
|
31
|
-
"svelte": "./PanelWindowControls.svelte"
|
|
32
|
-
},
|
|
33
|
-
"./PanelResizeHandle.svelte": {
|
|
34
|
-
"types": "./dist/PanelResizeHandle.svelte.d.ts",
|
|
35
|
-
"svelte": "./PanelResizeHandle.svelte"
|
|
36
|
-
},
|
|
37
|
-
"./SharedFloatingPanel.svelte": {
|
|
38
|
-
"types": "./dist/SharedFloatingPanel.svelte.d.ts",
|
|
39
|
-
"svelte": "./SharedFloatingPanel.svelte"
|
|
40
|
-
},
|
|
41
|
-
"./SessionDbPanel.svelte": {
|
|
42
|
-
"types": "./dist/SessionDbPanel.svelte.d.ts",
|
|
43
|
-
"svelte": "./SessionDbPanel.svelte"
|
|
44
|
-
},
|
|
45
|
-
"./DebugPanelToggles.svelte": {
|
|
46
|
-
"types": "./dist/DebugPanelToggles.svelte.d.ts",
|
|
47
|
-
"svelte": "./DebugPanelToggles.svelte"
|
|
25
|
+
"types": "./dist/index.types.d.ts",
|
|
26
|
+
"import": "./dist/index.js"
|
|
48
27
|
}
|
|
49
28
|
},
|
|
50
29
|
"files": [
|
|
51
30
|
"dist",
|
|
52
|
-
"*.svelte",
|
|
53
|
-
"*.ts",
|
|
54
31
|
"package.json"
|
|
55
32
|
],
|
|
56
33
|
"license": "MIT",
|
|
57
34
|
"dependencies": {
|
|
58
|
-
"@pie-players/pie-theme": "0.3.
|
|
35
|
+
"@pie-players/pie-theme": "0.3.44"
|
|
59
36
|
},
|
|
60
|
-
"types": "./dist/index.d.ts",
|
|
37
|
+
"types": "./dist/index.types.d.ts",
|
|
61
38
|
"scripts": {
|
|
62
39
|
"build": "vite build",
|
|
63
40
|
"dev": "vite build --watch",
|
package/DebugPanelToggles.svelte
DELETED
|
@@ -1,84 +0,0 @@
|
|
|
1
|
-
<script lang="ts">
|
|
2
|
-
interface Props {
|
|
3
|
-
showSessionPanel: boolean;
|
|
4
|
-
showEventPanel: boolean;
|
|
5
|
-
showDbPanel?: boolean;
|
|
6
|
-
showInstrumentationPanel?: boolean;
|
|
7
|
-
onToggleSessionPanel: () => void;
|
|
8
|
-
onToggleEventPanel: () => void;
|
|
9
|
-
onToggleDbPanel?: () => void;
|
|
10
|
-
onToggleInstrumentationPanel?: () => void;
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
let {
|
|
14
|
-
showSessionPanel,
|
|
15
|
-
showEventPanel,
|
|
16
|
-
showDbPanel = false,
|
|
17
|
-
showInstrumentationPanel = false,
|
|
18
|
-
onToggleSessionPanel,
|
|
19
|
-
onToggleEventPanel,
|
|
20
|
-
onToggleDbPanel,
|
|
21
|
-
onToggleInstrumentationPanel,
|
|
22
|
-
}: Props = $props();
|
|
23
|
-
</script>
|
|
24
|
-
|
|
25
|
-
<button
|
|
26
|
-
type="button"
|
|
27
|
-
class="btn btn-sm btn-outline btn-square"
|
|
28
|
-
class:btn-active={showSessionPanel}
|
|
29
|
-
onclick={onToggleSessionPanel}
|
|
30
|
-
title="Session"
|
|
31
|
-
aria-label="Toggle session panel"
|
|
32
|
-
aria-pressed={showSessionPanel}
|
|
33
|
-
>
|
|
34
|
-
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
35
|
-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
|
|
36
|
-
</svg>
|
|
37
|
-
</button>
|
|
38
|
-
|
|
39
|
-
<button
|
|
40
|
-
type="button"
|
|
41
|
-
class="btn btn-sm btn-outline btn-square"
|
|
42
|
-
class:btn-active={showEventPanel}
|
|
43
|
-
onclick={onToggleEventPanel}
|
|
44
|
-
title="Events"
|
|
45
|
-
aria-label="Toggle event broadcast panel"
|
|
46
|
-
aria-pressed={showEventPanel}
|
|
47
|
-
>
|
|
48
|
-
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
49
|
-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7h8m0 0l-3-3m3 3l-3 3M3 17h8m0 0l-3-3m3 3l-3 3M3 7h5m8 10h5" />
|
|
50
|
-
</svg>
|
|
51
|
-
</button>
|
|
52
|
-
|
|
53
|
-
{#if onToggleDbPanel}
|
|
54
|
-
<button
|
|
55
|
-
type="button"
|
|
56
|
-
class="btn btn-sm btn-outline btn-square"
|
|
57
|
-
class:btn-active={showDbPanel}
|
|
58
|
-
onclick={onToggleDbPanel}
|
|
59
|
-
title="Database state"
|
|
60
|
-
aria-label="Toggle database state panel"
|
|
61
|
-
aria-pressed={showDbPanel}
|
|
62
|
-
>
|
|
63
|
-
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
64
|
-
<ellipse cx="12" cy="5" rx="7" ry="3" stroke-width="2"></ellipse>
|
|
65
|
-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 5v7c0 1.66 3.13 3 7 3s7-1.34 7-3V5M5 12v7c0 1.66 3.13 3 7 3s7-1.34 7-3v-7"></path>
|
|
66
|
-
</svg>
|
|
67
|
-
</button>
|
|
68
|
-
{/if}
|
|
69
|
-
|
|
70
|
-
{#if onToggleInstrumentationPanel}
|
|
71
|
-
<button
|
|
72
|
-
type="button"
|
|
73
|
-
class="btn btn-sm btn-outline btn-square"
|
|
74
|
-
class:btn-active={showInstrumentationPanel}
|
|
75
|
-
onclick={onToggleInstrumentationPanel}
|
|
76
|
-
title="Instrumentation"
|
|
77
|
-
aria-label="Toggle instrumentation panel"
|
|
78
|
-
aria-pressed={showInstrumentationPanel}
|
|
79
|
-
>
|
|
80
|
-
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
81
|
-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 13h4l2 6 4-14 2 8h4" />
|
|
82
|
-
</svg>
|
|
83
|
-
</button>
|
|
84
|
-
{/if}
|
package/PanelResizeHandle.svelte
DELETED
|
@@ -1,52 +0,0 @@
|
|
|
1
|
-
<script lang="ts">
|
|
2
|
-
let {
|
|
3
|
-
onPointerDown,
|
|
4
|
-
handleClass = "pie-panel-resize-handle",
|
|
5
|
-
iconClass = "pie-panel-resize-icon",
|
|
6
|
-
} = $props<{
|
|
7
|
-
onPointerDown?: (event: MouseEvent) => void;
|
|
8
|
-
handleClass?: string;
|
|
9
|
-
iconClass?: string;
|
|
10
|
-
}>();
|
|
11
|
-
</script>
|
|
12
|
-
|
|
13
|
-
<div
|
|
14
|
-
class={handleClass}
|
|
15
|
-
onmousedown={onPointerDown}
|
|
16
|
-
role="button"
|
|
17
|
-
tabindex="0"
|
|
18
|
-
title="Resize window"
|
|
19
|
-
aria-label="Resize window"
|
|
20
|
-
>
|
|
21
|
-
<svg class={iconClass} viewBox="0 0 16 16" fill="currentColor">
|
|
22
|
-
<path d="M16 16V14H14V16H16Z" />
|
|
23
|
-
<path d="M16 11V9H14V11H16Z" />
|
|
24
|
-
<path d="M13 16V14H11V16H13Z" />
|
|
25
|
-
</svg>
|
|
26
|
-
</div>
|
|
27
|
-
|
|
28
|
-
<style>
|
|
29
|
-
.pie-panel-resize-handle {
|
|
30
|
-
position: absolute;
|
|
31
|
-
right: 0;
|
|
32
|
-
bottom: 0;
|
|
33
|
-
width: 12px;
|
|
34
|
-
height: 12px;
|
|
35
|
-
display: inline-flex;
|
|
36
|
-
align-items: center;
|
|
37
|
-
justify-content: center;
|
|
38
|
-
cursor: nwse-resize;
|
|
39
|
-
opacity: 0.82;
|
|
40
|
-
z-index: 2;
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
.pie-panel-resize-handle:hover {
|
|
44
|
-
opacity: 1;
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
.pie-panel-resize-icon {
|
|
48
|
-
width: 100%;
|
|
49
|
-
height: 100%;
|
|
50
|
-
color: color-mix(in srgb, var(--color-base-content, #334155) 30%, transparent);
|
|
51
|
-
}
|
|
52
|
-
</style>
|
|
@@ -1,97 +0,0 @@
|
|
|
1
|
-
<script lang="ts">
|
|
2
|
-
let {
|
|
3
|
-
minimized = false,
|
|
4
|
-
onToggle,
|
|
5
|
-
onClose,
|
|
6
|
-
buttonClass = "",
|
|
7
|
-
} = $props<{
|
|
8
|
-
minimized?: boolean;
|
|
9
|
-
onToggle?: () => void;
|
|
10
|
-
onClose?: () => void;
|
|
11
|
-
buttonClass?: string;
|
|
12
|
-
}>();
|
|
13
|
-
|
|
14
|
-
const resolvedButtonClass = $derived.by(
|
|
15
|
-
() => (buttonClass || "").trim() || "pie-window-controls__button",
|
|
16
|
-
);
|
|
17
|
-
</script>
|
|
18
|
-
|
|
19
|
-
<button
|
|
20
|
-
class={resolvedButtonClass}
|
|
21
|
-
onclick={onToggle}
|
|
22
|
-
title={minimized ? "Maximize" : "Minimize"}
|
|
23
|
-
aria-label={minimized ? "Maximize panel" : "Minimize panel"}
|
|
24
|
-
>
|
|
25
|
-
{#if minimized}
|
|
26
|
-
<svg
|
|
27
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
28
|
-
class="pie-window-controls__icon"
|
|
29
|
-
width="12"
|
|
30
|
-
height="12"
|
|
31
|
-
fill="none"
|
|
32
|
-
viewBox="0 0 24 24"
|
|
33
|
-
stroke="currentColor"
|
|
34
|
-
>
|
|
35
|
-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 15l7-7 7 7" />
|
|
36
|
-
</svg>
|
|
37
|
-
{:else}
|
|
38
|
-
<svg
|
|
39
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
40
|
-
class="pie-window-controls__icon"
|
|
41
|
-
width="12"
|
|
42
|
-
height="12"
|
|
43
|
-
fill="none"
|
|
44
|
-
viewBox="0 0 24 24"
|
|
45
|
-
stroke="currentColor"
|
|
46
|
-
>
|
|
47
|
-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
|
|
48
|
-
</svg>
|
|
49
|
-
{/if}
|
|
50
|
-
</button>
|
|
51
|
-
<button
|
|
52
|
-
class={resolvedButtonClass}
|
|
53
|
-
onclick={onClose}
|
|
54
|
-
title="Close"
|
|
55
|
-
aria-label="Close panel"
|
|
56
|
-
>
|
|
57
|
-
<svg
|
|
58
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
59
|
-
class="pie-window-controls__icon"
|
|
60
|
-
width="12"
|
|
61
|
-
height="12"
|
|
62
|
-
fill="none"
|
|
63
|
-
viewBox="0 0 24 24"
|
|
64
|
-
stroke="currentColor"
|
|
65
|
-
>
|
|
66
|
-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
|
|
67
|
-
</svg>
|
|
68
|
-
</button>
|
|
69
|
-
|
|
70
|
-
<style>
|
|
71
|
-
.pie-window-controls__button {
|
|
72
|
-
display: inline-flex;
|
|
73
|
-
align-items: center;
|
|
74
|
-
justify-content: center;
|
|
75
|
-
width: 1.35rem;
|
|
76
|
-
height: 1.35rem;
|
|
77
|
-
padding: 0;
|
|
78
|
-
border: 1px solid rgba(148, 163, 184, 0.7);
|
|
79
|
-
border-radius: 9999px;
|
|
80
|
-
background: rgba(255, 255, 255, 0.65);
|
|
81
|
-
color: #334155;
|
|
82
|
-
cursor: pointer;
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
.pie-window-controls__button:hover {
|
|
86
|
-
background: rgba(241, 245, 249, 0.95);
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
.pie-window-controls__button:focus-visible {
|
|
90
|
-
outline: 2px solid #3b82f6;
|
|
91
|
-
outline-offset: 1px;
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
.pie-window-controls__icon {
|
|
95
|
-
display: block;
|
|
96
|
-
}
|
|
97
|
-
</style>
|