ts-spatial-navigation 1.0.0-beta.1
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 +362 -0
- package/README.md +284 -0
- package/dist/constants.d.ts +101 -0
- package/dist/constants.d.ts.map +1 -0
- package/dist/constants.js +98 -0
- package/dist/constants.js.map +1 -0
- package/dist/core.d.ts +40 -0
- package/dist/core.d.ts.map +1 -0
- package/dist/core.js +245 -0
- package/dist/core.js.map +1 -0
- package/dist/factory.d.ts +87 -0
- package/dist/factory.d.ts.map +1 -0
- package/dist/factory.js +44 -0
- package/dist/factory.js.map +1 -0
- package/dist/geometry.d.ts +43 -0
- package/dist/geometry.d.ts.map +1 -0
- package/dist/geometry.js +161 -0
- package/dist/geometry.js.map +1 -0
- package/dist/spatial-navigation.d.ts +84 -0
- package/dist/spatial-navigation.d.ts.map +1 -0
- package/dist/spatial-navigation.js +683 -0
- package/dist/spatial-navigation.js.map +1 -0
- package/dist/state.d.ts +82 -0
- package/dist/state.d.ts.map +1 -0
- package/dist/state.js +179 -0
- package/dist/state.js.map +1 -0
- package/dist/strategies.d.ts +70 -0
- package/dist/strategies.d.ts.map +1 -0
- package/dist/strategies.js +147 -0
- package/dist/strategies.js.map +1 -0
- package/dist/types.d.ts +298 -0
- package/dist/types.d.ts.map +1 -0
- package/dist/types.js +6 -0
- package/dist/types.js.map +1 -0
- package/package.json +85 -0
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Geometry Module
|
|
3
|
+
* Pure functions for spatial calculations and partitioning.
|
|
4
|
+
* No side effects, no DOM dependencies beyond getBoundingClientRect.
|
|
5
|
+
*/
|
|
6
|
+
import type { DistanceFunctions, Rect } from './types';
|
|
7
|
+
/**
|
|
8
|
+
* Gets the bounding rectangle of an element with center point calculations.
|
|
9
|
+
*
|
|
10
|
+
* @param elem - HTML element to measure
|
|
11
|
+
* @returns Rect object with position, dimensions, and center points, or null if unavailable
|
|
12
|
+
*/
|
|
13
|
+
export declare const getRect: (elem: HTMLElement) => Rect | null;
|
|
14
|
+
/**
|
|
15
|
+
* Partitions rectangles into a 3x3 grid relative to a target rectangle.
|
|
16
|
+
*
|
|
17
|
+
* The grid layout:
|
|
18
|
+
* 0 | 1 | 2 (top-left, top-center, top-right)
|
|
19
|
+
* ---------
|
|
20
|
+
* 3 | 4 | 5 (middle-left, middle-center, middle-right)
|
|
21
|
+
* ---------
|
|
22
|
+
* 6 | 7 | 8 (bottom-left, bottom-center, bottom-right)
|
|
23
|
+
*
|
|
24
|
+
* Elements in corners may also be added to edge groups based on
|
|
25
|
+
* straightOverlapThreshold for diagonal navigation support.
|
|
26
|
+
*
|
|
27
|
+
* @param rects - Array of rectangles to partition
|
|
28
|
+
* @param targetRect - Reference rectangle (usually the currently focused element)
|
|
29
|
+
* @param straightOverlapThreshold - Threshold (0-1) for including corner elements in edge groups
|
|
30
|
+
* @returns 9-element array of rectangle arrays, one per grid position
|
|
31
|
+
*/
|
|
32
|
+
export declare const partition: (rects: Rect[], targetRect: Rect, straightOverlapThreshold: number) => Rect[][];
|
|
33
|
+
/**
|
|
34
|
+
* Creates distance calculation functions for prioritizing navigation candidates.
|
|
35
|
+
*
|
|
36
|
+
* These functions measure different aspects of distance from a target rectangle
|
|
37
|
+
* to help determine the best navigation target in each direction.
|
|
38
|
+
*
|
|
39
|
+
* @param targetRect - Reference rectangle to measure distances from
|
|
40
|
+
* @returns Object containing distance functions for various criteria
|
|
41
|
+
*/
|
|
42
|
+
export declare const distanceBuilder: (targetRect: Rect) => DistanceFunctions;
|
|
43
|
+
//# sourceMappingURL=geometry.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"geometry.d.ts","sourceRoot":"","sources":["../src/geometry.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,iBAAiB,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAGvD;;;;;GAKG;AACH,eAAO,MAAM,OAAO,SAAU,WAAW,KAAG,IAAI,GAAG,IA0BlD,CAAC;AAEF;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,SAAS,UACb,IAAI,EAAE,cACD,IAAI,4BACU,MAAM,KAC/B,IAAI,EAAE,EAsCR,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,eAAe,eAAgB,IAAI,KAAG,iBA8DlD,CAAC"}
|
package/dist/geometry.js
ADDED
|
@@ -0,0 +1,161 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Geometry Module
|
|
3
|
+
* Pure functions for spatial calculations and partitioning.
|
|
4
|
+
* No side effects, no DOM dependencies beyond getBoundingClientRect.
|
|
5
|
+
*/
|
|
6
|
+
import { Grid } from './constants';
|
|
7
|
+
/**
|
|
8
|
+
* Gets the bounding rectangle of an element with center point calculations.
|
|
9
|
+
*
|
|
10
|
+
* @param elem - HTML element to measure
|
|
11
|
+
* @returns Rect object with position, dimensions, and center points, or null if unavailable
|
|
12
|
+
*/
|
|
13
|
+
export const getRect = (elem) => {
|
|
14
|
+
const cr = elem.getBoundingClientRect();
|
|
15
|
+
if (!cr) {
|
|
16
|
+
return null;
|
|
17
|
+
}
|
|
18
|
+
const { left, top, right, bottom, width, height } = cr;
|
|
19
|
+
const x = left + Math.floor(width / 2);
|
|
20
|
+
const y = top + Math.floor(height / 2);
|
|
21
|
+
const rect = {
|
|
22
|
+
left,
|
|
23
|
+
top,
|
|
24
|
+
right,
|
|
25
|
+
bottom,
|
|
26
|
+
width,
|
|
27
|
+
height,
|
|
28
|
+
element: elem,
|
|
29
|
+
center: {
|
|
30
|
+
x,
|
|
31
|
+
y,
|
|
32
|
+
left: x,
|
|
33
|
+
right: x,
|
|
34
|
+
top: y,
|
|
35
|
+
bottom: y
|
|
36
|
+
}
|
|
37
|
+
};
|
|
38
|
+
return rect;
|
|
39
|
+
};
|
|
40
|
+
/**
|
|
41
|
+
* Partitions rectangles into a 3x3 grid relative to a target rectangle.
|
|
42
|
+
*
|
|
43
|
+
* The grid layout:
|
|
44
|
+
* 0 | 1 | 2 (top-left, top-center, top-right)
|
|
45
|
+
* ---------
|
|
46
|
+
* 3 | 4 | 5 (middle-left, middle-center, middle-right)
|
|
47
|
+
* ---------
|
|
48
|
+
* 6 | 7 | 8 (bottom-left, bottom-center, bottom-right)
|
|
49
|
+
*
|
|
50
|
+
* Elements in corners may also be added to edge groups based on
|
|
51
|
+
* straightOverlapThreshold for diagonal navigation support.
|
|
52
|
+
*
|
|
53
|
+
* @param rects - Array of rectangles to partition
|
|
54
|
+
* @param targetRect - Reference rectangle (usually the currently focused element)
|
|
55
|
+
* @param straightOverlapThreshold - Threshold (0-1) for including corner elements in edge groups
|
|
56
|
+
* @returns 9-element array of rectangle arrays, one per grid position
|
|
57
|
+
*/
|
|
58
|
+
export const partition = (rects, targetRect, straightOverlapThreshold) => {
|
|
59
|
+
const groups = [[], [], [], [], [], [], [], [], []];
|
|
60
|
+
for (let i = 0; i < rects.length; i++) {
|
|
61
|
+
const rect = rects[i];
|
|
62
|
+
const { center } = rect;
|
|
63
|
+
// Determine grid position (0-8)
|
|
64
|
+
const x = center.x < targetRect.left ? 0 : center.x <= targetRect.right ? 1 : 2;
|
|
65
|
+
const y = center.y < targetRect.top ? 0 : center.y <= targetRect.bottom ? 1 : 2;
|
|
66
|
+
const groupId = y * Grid.SIZE + x;
|
|
67
|
+
groups[groupId].push(rect);
|
|
68
|
+
// For corner elements, check if they overlap enough to be included in edge groups
|
|
69
|
+
if (Grid.CORNERS.includes(groupId)) {
|
|
70
|
+
// Check horizontal overlap for top/bottom edges
|
|
71
|
+
if (rect.left <= targetRect.right - targetRect.width * straightOverlapThreshold) {
|
|
72
|
+
if (groupId === Grid.TOP_RIGHT)
|
|
73
|
+
groups[Grid.TOP_CENTER].push(rect);
|
|
74
|
+
else if (groupId === Grid.BOTTOM_RIGHT)
|
|
75
|
+
groups[Grid.BOTTOM_CENTER].push(rect);
|
|
76
|
+
}
|
|
77
|
+
if (rect.right >= targetRect.left + targetRect.width * straightOverlapThreshold) {
|
|
78
|
+
if (groupId === Grid.TOP_LEFT)
|
|
79
|
+
groups[Grid.TOP_CENTER].push(rect);
|
|
80
|
+
else if (groupId === Grid.BOTTOM_LEFT)
|
|
81
|
+
groups[Grid.BOTTOM_CENTER].push(rect);
|
|
82
|
+
}
|
|
83
|
+
// Check vertical overlap for left/right edges
|
|
84
|
+
if (rect.top <= targetRect.bottom - targetRect.height * straightOverlapThreshold) {
|
|
85
|
+
if (groupId === Grid.BOTTOM_LEFT)
|
|
86
|
+
groups[Grid.MIDDLE_LEFT].push(rect);
|
|
87
|
+
else if (groupId === Grid.BOTTOM_RIGHT)
|
|
88
|
+
groups[Grid.MIDDLE_RIGHT].push(rect);
|
|
89
|
+
}
|
|
90
|
+
if (rect.bottom >= targetRect.top + targetRect.height * straightOverlapThreshold) {
|
|
91
|
+
if (groupId === Grid.TOP_LEFT)
|
|
92
|
+
groups[Grid.MIDDLE_LEFT].push(rect);
|
|
93
|
+
else if (groupId === Grid.TOP_RIGHT)
|
|
94
|
+
groups[Grid.MIDDLE_RIGHT].push(rect);
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
}
|
|
98
|
+
return groups;
|
|
99
|
+
};
|
|
100
|
+
/**
|
|
101
|
+
* Creates distance calculation functions for prioritizing navigation candidates.
|
|
102
|
+
*
|
|
103
|
+
* These functions measure different aspects of distance from a target rectangle
|
|
104
|
+
* to help determine the best navigation target in each direction.
|
|
105
|
+
*
|
|
106
|
+
* @param targetRect - Reference rectangle to measure distances from
|
|
107
|
+
* @returns Object containing distance functions for various criteria
|
|
108
|
+
*/
|
|
109
|
+
export const distanceBuilder = (targetRect) => {
|
|
110
|
+
return {
|
|
111
|
+
/**
|
|
112
|
+
* Distance from center vertical line (plumb line).
|
|
113
|
+
* Prefers elements aligned vertically with the target.
|
|
114
|
+
*/
|
|
115
|
+
nearPlumbLineIsBetter: (rect) => {
|
|
116
|
+
const d = rect.center.x < targetRect.center.x
|
|
117
|
+
? targetRect.center.x - rect.right
|
|
118
|
+
: rect.left - targetRect.center.x;
|
|
119
|
+
return d < 0 ? 0 : d;
|
|
120
|
+
},
|
|
121
|
+
/**
|
|
122
|
+
* Distance from center horizontal line (horizon).
|
|
123
|
+
* Prefers elements aligned horizontally with the target.
|
|
124
|
+
*/
|
|
125
|
+
nearHorizonIsBetter: (rect) => {
|
|
126
|
+
const d = rect.center.y < targetRect.center.y
|
|
127
|
+
? targetRect.center.y - rect.bottom
|
|
128
|
+
: rect.top - targetRect.center.y;
|
|
129
|
+
return d < 0 ? 0 : d;
|
|
130
|
+
},
|
|
131
|
+
/**
|
|
132
|
+
* Distance from target's left edge.
|
|
133
|
+
* Used for horizontal navigation alignment.
|
|
134
|
+
*/
|
|
135
|
+
nearTargetLeftIsBetter: (rect) => {
|
|
136
|
+
const d = rect.center.x < targetRect.center.x
|
|
137
|
+
? targetRect.left - rect.right
|
|
138
|
+
: rect.left - targetRect.left;
|
|
139
|
+
return d < 0 ? 0 : d;
|
|
140
|
+
},
|
|
141
|
+
/**
|
|
142
|
+
* Distance from target's top edge.
|
|
143
|
+
* Used for vertical navigation alignment.
|
|
144
|
+
*/
|
|
145
|
+
nearTargetTopIsBetter: (rect) => {
|
|
146
|
+
const d = rect.center.y < targetRect.center.y
|
|
147
|
+
? targetRect.top - rect.bottom
|
|
148
|
+
: rect.top - targetRect.top;
|
|
149
|
+
return d < 0 ? 0 : d;
|
|
150
|
+
},
|
|
151
|
+
/** Prefers elements with smaller top values (higher on screen) */
|
|
152
|
+
topIsBetter: (rect) => rect.top,
|
|
153
|
+
/** Prefers elements with larger bottom values (lower on screen) */
|
|
154
|
+
bottomIsBetter: (rect) => -1 * rect.bottom,
|
|
155
|
+
/** Prefers elements with smaller left values (more to the left) */
|
|
156
|
+
leftIsBetter: (rect) => rect.left,
|
|
157
|
+
/** Prefers elements with larger right values (more to the right) */
|
|
158
|
+
rightIsBetter: (rect) => -1 * rect.right
|
|
159
|
+
};
|
|
160
|
+
};
|
|
161
|
+
//# sourceMappingURL=geometry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"geometry.js","sourceRoot":"","sources":["../src/geometry.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
import type { Config, Direction } from './types';
|
|
2
|
+
export type { Config, Direction, GlobalConfig, SpatialEventDetail } from './types';
|
|
3
|
+
export type { SectionConfig, AddSectionConfig, SectionIdentity, NavigationBehavior, SectionTransition, FilterConfig, Rect, Point, Priority, Priorities, DistanceFunctions, NavigationState, SectionStore, } from './types';
|
|
4
|
+
export { KeyCode, Grid, Defaults, EventName, RestrictMode, EnterTo } from './constants';
|
|
5
|
+
export type { KeyCodeValue, GridPosition, EventNameValue, RestrictModeValue, EnterToValue } from './constants';
|
|
6
|
+
export { getRect, partition, distanceBuilder } from './geometry';
|
|
7
|
+
export { StateManager, createDefaultGlobalConfig, createInitialState } from './state';
|
|
8
|
+
export type { SpatialNavigationAPI, CreateSpatialNavigationOptions } from './factory';
|
|
9
|
+
export { navigationStrategies, getStrategy, buildPrioritiesForDirection, leftStrategy, rightStrategy, upStrategy, downStrategy, } from './strategies';
|
|
10
|
+
export type { NavigationStrategy } from './strategies';
|
|
11
|
+
/*******************/
|
|
12
|
+
/*******************/
|
|
13
|
+
declare const SpatialNavigation: {
|
|
14
|
+
/**
|
|
15
|
+
* Initializes SpatialNavigation and binds event listeners to the global object. It is a synchronous function, so you don't need to await ready state. Calling init() more than once is possible since SpatialNavigation internally prevents it from reiterating the initialization.
|
|
16
|
+
*
|
|
17
|
+
* Note: It should be called before using any other methods of SpatialNavigation!
|
|
18
|
+
*/
|
|
19
|
+
init: () => void;
|
|
20
|
+
/**
|
|
21
|
+
* Uninitializes SpatialNavigation, resets the variable state and unbinds the event listeners.
|
|
22
|
+
*/
|
|
23
|
+
uninit: () => void;
|
|
24
|
+
/**
|
|
25
|
+
* Resets the variable state without unbinding the event listeners.
|
|
26
|
+
*/
|
|
27
|
+
clear: () => void;
|
|
28
|
+
/**
|
|
29
|
+
* Updates the config of the section with the specified `id`. If `id` is omitted, the global configuration will be updated.
|
|
30
|
+
*
|
|
31
|
+
* Omitted properties in config will not affect the original one, which was set by `add()`, so only properties that you want to update need to be listed. In other words, if you want to delete any previously added properties, you have to explicitly assign undefined to those properties in the config.
|
|
32
|
+
*/
|
|
33
|
+
set: (config: Config) => void;
|
|
34
|
+
/**
|
|
35
|
+
*
|
|
36
|
+
* Adds a section to SpatialNavigation with its own configuration. The config doesn't have to contain all the properties. Those omitted will inherit global ones automatically.
|
|
37
|
+
*
|
|
38
|
+
* A section is a conceptual scope to define a set of elements no matter where they are in DOM structure. You can group elements based on their functions or behaviors (e.g. main, menu, dialog, etc.) into a section.
|
|
39
|
+
*/
|
|
40
|
+
add: (config: Config) => string;
|
|
41
|
+
/**
|
|
42
|
+
* Removes the section with the specified `id` from SpatialNavigation.
|
|
43
|
+
*
|
|
44
|
+
* Elements defined in this section will not be navigated anymore.
|
|
45
|
+
*/
|
|
46
|
+
remove: (id: Config['id']) => boolean;
|
|
47
|
+
/**
|
|
48
|
+
*
|
|
49
|
+
* Disables the section with the specified `id` temporarily. Elements defined in this section will become unnavigable until enable() is called.
|
|
50
|
+
*/
|
|
51
|
+
disable: (id: Config['id']) => boolean;
|
|
52
|
+
/**
|
|
53
|
+
* Enables the section with the specified `id`.
|
|
54
|
+
*
|
|
55
|
+
* Elements defined in this section, on which if `disable()` was called earlier, will become navigable again.
|
|
56
|
+
*/
|
|
57
|
+
enable: (id: string) => boolean;
|
|
58
|
+
pause: () => void;
|
|
59
|
+
resume: () => void;
|
|
60
|
+
/**
|
|
61
|
+
* Focuses the section with the specified `id` or the first element that matches selector.
|
|
62
|
+
*
|
|
63
|
+
* If the first argument matches any of the existing `id`, it will be regarded as a `id`. Otherwise, it will be treated as selector instead. If omitted, the default section, which is set by `setDefaultSection()`, will be the substitution.
|
|
64
|
+
*/
|
|
65
|
+
focus: (elem: HTMLElement | string, silent?: boolean) => boolean;
|
|
66
|
+
/**
|
|
67
|
+
* Moves the focus to the given direction based on the rule of SpatialNavigation. The first element matching selector is regarded as the origin. If selector is omitted, SpatialNavigation will move the focus based on the currently focused element.
|
|
68
|
+
*/
|
|
69
|
+
move: (direction: Direction, selector: Config['selector']) => boolean;
|
|
70
|
+
/**
|
|
71
|
+
* A helper to add `tabindex="-1"` to elements defined in the specified section to make them focusable. If `id` is omitted, it applies to all sections.
|
|
72
|
+
*
|
|
73
|
+
* **Note:** It won't affect elements which have been focusable already or have not been appended to DOM tree yet.
|
|
74
|
+
*/
|
|
75
|
+
makeFocusable: (id?: Config['id']) => void;
|
|
76
|
+
/**
|
|
77
|
+
* Assigns the specified section to be the default section. It will be used as a substitution in certain methods, of which if sectionId is omitted.
|
|
78
|
+
*
|
|
79
|
+
* Calling this method without the argument can reset the default section to undefined.
|
|
80
|
+
*/
|
|
81
|
+
setDefaultSection: (id: string) => void;
|
|
82
|
+
};
|
|
83
|
+
export default SpatialNavigation;
|
|
84
|
+
//# sourceMappingURL=spatial-navigation.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"spatial-navigation.d.ts","sourceRoot":"","sources":["../src/spatial-navigation.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,SAAS,EAAoC,MAAM,SAAS,CAAC;AACnF,YAAY,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAGnF,YAAY,EACV,aAAa,EACb,gBAAgB,EAChB,eAAe,EACf,kBAAkB,EAClB,iBAAiB,EACjB,YAAY,EACZ,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,UAAU,EACV,iBAAiB,EACjB,eAAe,EACf,YAAY,GACb,MAAM,SAAS,CAAC;AAEjB,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACxF,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,cAAc,EAAE,iBAAiB,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE/G,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,yBAAyB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AACtF,YAAY,EAAE,oBAAoB,EAAE,8BAA8B,EAAE,MAAM,WAAW,CAAC;AAGtF,OAAO,EACL,oBAAoB,EACpB,WAAW,EACX,2BAA2B,EAC3B,YAAY,EACZ,aAAa,EACb,UAAU,EACV,YAAY,GACb,MAAM,cAAc,CAAC;AACtB,YAAY,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAyfvD,qBAAqB;AAErB,qBAAqB;AACrB,QAAA,MAAM,iBAAiB;IACrB;;;;OAIG;;IAUH;;OAEG;;IAUH;;OAEG;;IAQH;;;;OAIG;kBACW,MAAM;IAwBpB;;;;;OAKG;kBACW,MAAM;IAgBpB;;;;OAIG;iBACU,MAAM,CAAC,IAAI,CAAC;IAgBzB;;;OAGG;kBACoB,MAAM,CAAC,IAAI,CAAC;IAOnC;;;;OAIG;iBACmB,MAAM;;;IAgB5B;;;;OAIG;kBACW,WAAW,GAAG,MAAM,WAAW,OAAO;IAsCpD;;OAEG;sBACe,SAAS,YAAY,MAAM,CAAC,UAAU,CAAC;IA4BzD;;;;OAIG;yBACkB,MAAM,CAAC,IAAI,CAAC;IA6BjC;;;;OAIG;4BACqB,MAAM;CAS/B,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
|