@ue-too/board 0.9.4 → 0.10.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.
Files changed (57) hide show
  1. package/README.md +66 -2
  2. package/boardify/index.d.ts +280 -9
  3. package/camera/base.d.ts +364 -68
  4. package/camera/camera-edge-auto-input.d.ts +105 -0
  5. package/camera/camera-mux/animation-and-lock/animation-and-lock.d.ts +316 -14
  6. package/camera/camera-mux/animation-and-lock/index.d.ts +27 -0
  7. package/camera/camera-mux/animation-and-lock/pan-control-state-machine.d.ts +143 -60
  8. package/camera/camera-mux/animation-and-lock/rotation-control-state-machine.d.ts +143 -55
  9. package/camera/camera-mux/animation-and-lock/zoom-control-state-machine.d.ts +205 -58
  10. package/camera/camera-mux/index.d.ts +26 -0
  11. package/camera/camera-mux/interface.d.ts +161 -5
  12. package/camera/camera-mux/relay.d.ts +79 -16
  13. package/camera/camera-rig/camera-rig.d.ts +536 -94
  14. package/camera/camera-rig/index.d.ts +26 -1
  15. package/camera/camera-rig/pan-handler.d.ts +508 -48
  16. package/camera/camera-rig/rotation-handler.d.ts +353 -31
  17. package/camera/camera-rig/zoom-handler.d.ts +369 -32
  18. package/camera/default-camera.d.ts +173 -26
  19. package/camera/index.d.ts +20 -0
  20. package/camera/interface.d.ts +202 -2
  21. package/camera/update-publisher.d.ts +128 -38
  22. package/camera/utils/coordinate-conversion.d.ts +323 -26
  23. package/camera/utils/index.d.ts +22 -0
  24. package/camera/utils/matrix.d.ts +217 -14
  25. package/camera/utils/position.d.ts +249 -11
  26. package/camera/utils/rotation.d.ts +139 -9
  27. package/camera/utils/zoom.d.ts +72 -4
  28. package/index.d.ts +37 -0
  29. package/index.js +2 -4796
  30. package/index.js.map +39 -38
  31. package/input-interpretation/index.d.ts +29 -0
  32. package/input-interpretation/input-orchestrator.d.ts +197 -0
  33. package/input-interpretation/input-state-machine/index.d.ts +18 -0
  34. package/input-interpretation/input-state-machine/kmt-input-context.d.ts +191 -38
  35. package/input-interpretation/input-state-machine/kmt-input-state-machine.d.ts +201 -85
  36. package/input-interpretation/input-state-machine/touch-input-context.d.ts +76 -10
  37. package/input-interpretation/input-state-machine/touch-input-state-machine.d.ts +138 -17
  38. package/input-interpretation/raw-input-parser/index.d.ts +19 -0
  39. package/input-interpretation/raw-input-parser/vanilla-kmt-event-parser.d.ts +107 -21
  40. package/input-interpretation/raw-input-parser/vanilla-touch-event-parser.d.ts +71 -8
  41. package/input-interpretation/raw-input-publisher/index.d.ts +18 -0
  42. package/input-interpretation/raw-input-publisher/raw-input-publisher.d.ts +133 -37
  43. package/package.json +3 -3
  44. package/utils/canvas-position-dimension.d.ts +282 -1
  45. package/utils/coordinate-conversions/canvas-viewport.d.ts +79 -0
  46. package/utils/coordinate-conversions/viewport-world.d.ts +101 -0
  47. package/utils/coordinate-conversions/window-canvas.d.ts +90 -0
  48. package/utils/coorindate-conversion.d.ts +91 -0
  49. package/utils/drawing.d.ts +151 -3
  50. package/utils/index.d.ts +21 -0
  51. package/utils/observable.d.ts +179 -0
  52. package/utils/ruler.d.ts +36 -0
  53. package/utils/zoomlevel-adjustment.d.ts +144 -8
  54. package/camera/camera-rig/update-batcher/index.d.ts +0 -3
  55. package/camera/camera-rig/update-batcher/position-update-batcher.d.ts +0 -58
  56. package/camera/camera-rig/update-batcher/rotation-update-batcher.d.ts +0 -54
  57. package/camera/camera-rig/update-batcher/zoom-udpate-batcher.d.ts +0 -60
@@ -1,12 +1,168 @@
1
1
  import type { Point } from "@ue-too/math";
2
2
  /**
3
- * @description The interface for the input flow control.
4
- * It should at least have user input handlers for pan, zoom and rotation.
3
+ * Discriminated union type for pan input results.
4
+ * Indicates whether camera panning is allowed and provides the delta if accepted.
5
+ *
6
+ * @remarks
7
+ * This type uses discriminated unions for type-safe flow control:
8
+ * - When `allowPassThrough` is `true`, the `delta` property is available
9
+ * - When `allowPassThrough` is `false`, no delta is provided
10
+ *
11
+ * Use this to implement input gating, animation systems, or input arbitration.
12
+ *
13
+ * @example
14
+ * ```typescript
15
+ * const output = cameraMux.notifyPanInput({ x: 10, y: 5 });
16
+ * if (output.allowPassThrough) {
17
+ * // TypeScript knows output.delta exists here
18
+ * camera.setPosition(
19
+ * PointCal.addVector(camera.position, output.delta)
20
+ * );
21
+ * } else {
22
+ * // Input was blocked (e.g., during animation)
23
+ * console.log('Pan input blocked');
24
+ * }
25
+ * ```
26
+ *
27
+ * @category Input Flow Control
28
+ */
29
+ export type CameraMuxPanOutput = {
30
+ allowPassThrough: true;
31
+ delta: Point;
32
+ } | {
33
+ allowPassThrough: false;
34
+ };
35
+ /**
36
+ * Discriminated union type for zoom input results.
37
+ * Indicates whether camera zooming is allowed and provides zoom parameters if accepted.
38
+ *
39
+ * @remarks
40
+ * This type uses discriminated unions for type-safe flow control:
41
+ * - When `allowPassThrough` is `true`, both `delta` and `anchorPoint` are available
42
+ * - When `allowPassThrough` is `false`, zoom is blocked
43
+ *
44
+ * The `anchorPoint` ensures zoom focuses on a specific viewport location (e.g., cursor position).
45
+ *
46
+ * @example
47
+ * ```typescript
48
+ * const output = cameraMux.notifyZoomInput(0.1, mousePosition);
49
+ * if (output.allowPassThrough) {
50
+ * // Calculate new camera position to keep anchor point stationary
51
+ * const newZoom = camera.zoomLevel + output.delta;
52
+ * const newPosition = cameraPositionToGet(
53
+ * worldAtAnchor,
54
+ * output.anchorPoint,
55
+ * newZoom,
56
+ * camera.rotation
57
+ * );
58
+ * camera.setZoomLevel(newZoom);
59
+ * camera.setPosition(newPosition);
60
+ * }
61
+ * ```
62
+ *
63
+ * @category Input Flow Control
64
+ */
65
+ export type CameraMuxZoomOutput = {
66
+ allowPassThrough: true;
67
+ delta: number;
68
+ anchorPoint: Point;
69
+ } | {
70
+ allowPassThrough: false;
71
+ };
72
+ /**
73
+ * Discriminated union type for rotation input results.
74
+ * Indicates whether camera rotation is allowed and provides the delta if accepted.
75
+ *
76
+ * @remarks
77
+ * This type uses discriminated unions for type-safe flow control:
78
+ * - When `allowPassThrough` is `true`, the `delta` property is available
79
+ * - When `allowPassThrough` is `false`, rotation is blocked
80
+ *
81
+ * @example
82
+ * ```typescript
83
+ * const output = cameraMux.notifyRotationInput(0.1); // 0.1 radians
84
+ * if (output.allowPassThrough) {
85
+ * camera.setRotation(camera.rotation + output.delta);
86
+ * }
87
+ * ```
88
+ *
89
+ * @category Input Flow Control
90
+ */
91
+ export type CameraMuxRotationOutput = {
92
+ allowPassThrough: true;
93
+ delta: number;
94
+ } | {
95
+ allowPassThrough: false;
96
+ };
97
+ /**
98
+ * Input multiplexer interface for camera control flow management.
99
+ * Acts as a gatekeeper that can allow or block camera inputs based on state.
100
+ *
101
+ * @remarks
102
+ * The CameraMux pattern enables:
103
+ * - **Input arbitration**: Decide which inputs should affect the camera
104
+ * - **Animation systems**: Block user input during camera animations
105
+ * - **State management**: Control camera behavior based on application state
106
+ * - **Input filtering**: Modify or clamp inputs before applying to camera
107
+ *
108
+ * Implementations can be:
109
+ * - **Stateless**: Always pass through (e.g., {@link Relay})
110
+ * - **Stateful**: Block inputs during animations or specific states
111
+ * - **Smart**: Modify inputs based on context (e.g., smooth damping)
112
+ *
113
+ * @example
114
+ * ```typescript
115
+ * // Simple relay implementation
116
+ * class SimpleMux implements CameraMux {
117
+ * notifyPanInput(diff: Point): CameraMuxPanOutput {
118
+ * return { allowPassThrough: true, delta: diff };
119
+ * }
120
+ * notifyZoomInput(delta: number, anchor: Point): CameraMuxZoomOutput {
121
+ * return { allowPassThrough: true, delta, anchorPoint: anchor };
122
+ * }
123
+ * notifyRotationInput(delta: number): CameraMuxRotationOutput {
124
+ * return { allowPassThrough: true, delta };
125
+ * }
126
+ * }
127
+ *
128
+ * // Animation-blocking implementation
129
+ * class AnimatedMux implements CameraMux {
130
+ * private isAnimating = false;
131
+ *
132
+ * notifyPanInput(diff: Point): CameraMuxPanOutput {
133
+ * if (this.isAnimating) {
134
+ * return { allowPassThrough: false };
135
+ * }
136
+ * return { allowPassThrough: true, delta: diff };
137
+ * }
138
+ * // ... similar for zoom and rotation
139
+ * }
140
+ * ```
5
141
  *
6
142
  * @category Input Flow Control
143
+ * @see {@link Relay} for a simple passthrough implementation
7
144
  */
8
145
  export interface CameraMux {
9
- notifyPanInput(diff: Point): void;
10
- notifyZoomInput(deltaZoomAmount: number, anchorPoint: Point): void;
11
- notifyRotationInput(deltaRotation: number): void;
146
+ /**
147
+ * Processes a pan input request.
148
+ *
149
+ * @param diff - Pan displacement in viewport space (CSS pixels)
150
+ * @returns Output indicating if pan is allowed and the delta to apply
151
+ */
152
+ notifyPanInput(diff: Point): CameraMuxPanOutput;
153
+ /**
154
+ * Processes a zoom input request.
155
+ *
156
+ * @param deltaZoomAmount - Change in zoom level (positive = zoom in, negative = zoom out)
157
+ * @param anchorPoint - Point to zoom towards in viewport coordinates (typically cursor position)
158
+ * @returns Output indicating if zoom is allowed and the parameters to apply
159
+ */
160
+ notifyZoomInput(deltaZoomAmount: number, anchorPoint: Point): CameraMuxZoomOutput;
161
+ /**
162
+ * Processes a rotation input request.
163
+ *
164
+ * @param deltaRotation - Change in rotation in radians
165
+ * @returns Output indicating if rotation is allowed and the delta to apply
166
+ */
167
+ notifyRotationInput(deltaRotation: number): CameraMuxRotationOutput;
12
168
  }
@@ -1,27 +1,90 @@
1
- import { ObservableBoardCamera } from "../interface";
2
- import { CameraRig } from "../camera-rig";
3
- import { CameraMux } from "./interface";
1
+ import { CameraMux, CameraMuxPanOutput, CameraMuxZoomOutput, CameraMuxRotationOutput } from "./interface";
4
2
  import { Point } from "@ue-too/math";
5
3
  /**
6
- * @description The simple relay flow control.
7
- * This would be the default flow control for {@link Board}.
4
+ * Stateless camera input multiplexer that always allows inputs to pass through.
5
+ * This is the simplest {@link CameraMux} implementation with no filtering or state management.
6
+ *
7
+ * @remarks
8
+ * The Relay class provides a "transparent" mux that:
9
+ * - Never blocks inputs
10
+ * - Passes all inputs unchanged
11
+ * - Has no internal state
12
+ * - Acts as a simple conduit between input sources and camera control
13
+ *
14
+ * Use this when you want:
15
+ * - Direct, unfiltered camera control
16
+ * - No animation system or input blocking
17
+ * - Maximum simplicity with minimal overhead
18
+ *
19
+ * For more advanced use cases (animations, input blocking, state management),
20
+ * implement a custom {@link CameraMux} or use a stateful implementation.
21
+ *
22
+ * @example
23
+ * ```typescript
24
+ * const relay = new Relay();
25
+ *
26
+ * // All inputs pass through unchanged
27
+ * const panResult = relay.notifyPanInput({ x: 10, y: 5 });
28
+ * // panResult = { allowPassThrough: true, delta: { x: 10, y: 5 } }
29
+ *
30
+ * const zoomResult = relay.notifyZoomInput(0.5, { x: 100, y: 200 });
31
+ * // zoomResult = { allowPassThrough: true, delta: 0.5, anchorPoint: { x: 100, y: 200 } }
32
+ *
33
+ * const rotateResult = relay.notifyRotationInput(0.1);
34
+ * // rotateResult = { allowPassThrough: true, delta: 0.1 }
35
+ * ```
8
36
  *
9
37
  * @category Input Flow Control
38
+ * @see {@link CameraMux} for the interface specification
39
+ * @see {@link createDefaultCameraMux} for a factory function
10
40
  */
11
41
  export declare class Relay implements CameraMux {
12
- private _cameraRig;
13
- constructor(cameraRig?: CameraRig);
14
- notifyPanInput(diff: Point): void;
15
- notifyZoomInput(deltaZoomAmount: number, anchorPoint: Point): void;
16
- notifyRotationInput(deltaRotation: number): void;
42
+ /**
43
+ * Creates a new stateless relay multiplexer.
44
+ */
45
+ constructor();
46
+ /**
47
+ * Processes pan input by always allowing it through unchanged.
48
+ *
49
+ * @param diff - Pan displacement in viewport space
50
+ * @returns Output allowing passthrough with the original delta
51
+ */
52
+ notifyPanInput(diff: Point): CameraMuxPanOutput;
53
+ /**
54
+ * Processes zoom input by always allowing it through unchanged.
55
+ *
56
+ * @param deltaZoomAmount - Change in zoom level
57
+ * @param anchorPoint - Point to zoom towards in viewport coordinates
58
+ * @returns Output allowing passthrough with the original parameters
59
+ */
60
+ notifyZoomInput(deltaZoomAmount: number, anchorPoint: Point): CameraMuxZoomOutput;
61
+ /**
62
+ * Processes rotation input by always allowing it through unchanged.
63
+ *
64
+ * @param deltaRotation - Change in rotation in radians
65
+ * @returns Output allowing passthrough with the original delta
66
+ */
67
+ notifyRotationInput(deltaRotation: number): CameraMuxRotationOutput;
17
68
  }
18
69
  /**
19
- * @description Create a default relay control center.
70
+ * Factory function to create a default camera input multiplexer.
71
+ * Returns a {@link Relay} instance that allows all inputs to pass through.
20
72
  *
21
- * @category Input Flow Control
22
- */
23
- export declare function createDefaultCameraMux(camera: ObservableBoardCamera): CameraMux;
24
- /**
73
+ * @returns A new stateless relay multiplexer
74
+ *
75
+ * @remarks
76
+ * This is a convenience function for creating the simplest possible camera mux.
77
+ * The returned instance has no state and never blocks inputs.
25
78
  *
79
+ * @example
80
+ * ```typescript
81
+ * const cameraMux = createDefaultCameraMux();
82
+ *
83
+ * // Use with camera rig or input handlers
84
+ * const cameraRig = new CameraRig(camera, cameraMux);
85
+ * ```
86
+ *
87
+ * @category Input Flow Control
88
+ * @see {@link Relay} for implementation details
26
89
  */
27
- export declare function createDefaultCameraMuxWithCameraRig(cameraRig: CameraRig): CameraMux;
90
+ export declare function createDefaultCameraMux(): CameraMux;