Skip to content

Commit dbbb811

Browse files
m-kawafujim-kawafuji
authored
🤖 Merge PR DefinitelyTyped#72227 [focus-group] add definitions for focus-group by @m-kawafuji 
1 parent 6686111 commit dbbb811

File tree

5 files changed

+262
-0
lines changed

5 files changed

+262
-0
lines changed

‎types/focus-group/.npmignore‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
*
2+
!**/*.d.ts
3+
!**/*.d.cts
4+
!**/*.d.mts
5+
!**/*.d.*.ts

‎types/focus-group/focus-group-tests.ts‎

Lines changed: 98 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,98 @@
1+
import createFocusGroup from "focus-group";
2+
3+
// $ExpectType FocusGroup
4+
const focusGroup = createFocusGroup({ members: [document.createElement("button")] });
5+
6+
// $ExpectType FocusGroup
7+
createFocusGroup({ members: document.querySelectorAll("button") });
8+
9+
// $ExpectType FocusGroup
10+
createFocusGroup({
11+
members: [{ node: document.createElement("button"), text: "string" }],
12+
keybindings: {
13+
next: [{
14+
altKey: true,
15+
charCode: 104,
16+
code: "ArrowDown",
17+
ctrlKey: true,
18+
isComposing: true,
19+
key: "ArrowRight",
20+
keyCode: 40,
21+
location: 0,
22+
metaKey: true,
23+
repeat: true,
24+
shiftKey: true,
25+
DOM_KEY_LOCATION_STANDARD: KeyboardEvent.DOM_KEY_LOCATION_STANDARD,
26+
DOM_KEY_LOCATION_LEFT: KeyboardEvent.DOM_KEY_LOCATION_LEFT,
27+
DOM_KEY_LOCATION_RIGHT: KeyboardEvent.DOM_KEY_LOCATION_RIGHT,
28+
DOM_KEY_LOCATION_NUMPAD: KeyboardEvent.DOM_KEY_LOCATION_NUMPAD,
29+
}],
30+
prev: [{ key: "ArrowUp" }, { key: "ArrowLeft" }],
31+
first: {
32+
altKey: true,
33+
charCode: 103,
34+
code: "Home",
35+
ctrlKey: true,
36+
isComposing: true,
37+
key: "Home",
38+
keyCode: 36,
39+
location: 0,
40+
metaKey: true,
41+
repeat: true,
42+
shiftKey: true,
43+
DOM_KEY_LOCATION_STANDARD: KeyboardEvent.DOM_KEY_LOCATION_STANDARD,
44+
DOM_KEY_LOCATION_LEFT: KeyboardEvent.DOM_KEY_LOCATION_LEFT,
45+
DOM_KEY_LOCATION_RIGHT: KeyboardEvent.DOM_KEY_LOCATION_RIGHT,
46+
DOM_KEY_LOCATION_NUMPAD: KeyboardEvent.DOM_KEY_LOCATION_NUMPAD,
47+
},
48+
last: { keyCode: 75, metaKey: true },
49+
},
50+
wrap: true,
51+
stringSearch: true,
52+
stringSearchDelay: 800,
53+
});
54+
55+
// $ExpectType FocusGroup
56+
focusGroup.activate();
57+
58+
// $ExpectType FocusGroup
59+
focusGroup.deactivate();
60+
61+
// $ExpectType FocusGroup
62+
focusGroup.addMember(
63+
document.createElement("button"),
64+
0,
65+
);
66+
67+
// $ExpectType FocusGroup
68+
focusGroup.addMember(
69+
{ node: document.createElement("button"), text: "string" },
70+
0,
71+
);
72+
73+
// $ExpectType FocusGroup
74+
focusGroup.removeMember(0);
75+
76+
// $ExpectType FocusGroup
77+
focusGroup.clearMembers();
78+
79+
// $ExpectType FocusGroup
80+
focusGroup.setMembers([document.createElement("button")]);
81+
82+
// $ExpectType FocusGroup
83+
focusGroup.setMembers(document.querySelectorAll("button"));
84+
85+
// $ExpectType FocusGroup
86+
focusGroup.setMembers([{ node: document.createElement("button"), text: "string" }]);
87+
88+
// $ExpectType FocusGroupMember[]
89+
focusGroup.getMembers();
90+
91+
// $ExpectType FocusGroup
92+
focusGroup.focusNodeAtIndex(0);
93+
94+
// $ExpectType number
95+
focusGroup.moveFocusForward();
96+
97+
// $ExpectType number
98+
focusGroup.moveFocusBack();

‎types/focus-group/index.d.ts‎

Lines changed: 122 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,122 @@
1+
declare namespace createFocusGroup {
2+
type FocusGroupTriggers = Partial<
3+
Pick<
4+
KeyboardEvent,
5+
| "altKey"
6+
| "charCode"
7+
| "code"
8+
| "ctrlKey"
9+
| "isComposing"
10+
| "key"
11+
| "keyCode"
12+
| "location"
13+
| "metaKey"
14+
| "repeat"
15+
| "shiftKey"
16+
| "DOM_KEY_LOCATION_STANDARD"
17+
| "DOM_KEY_LOCATION_LEFT"
18+
| "DOM_KEY_LOCATION_RIGHT"
19+
| "DOM_KEY_LOCATION_NUMPAD"
20+
>
21+
>;
22+
23+
interface FocusGroupMember {
24+
/**
25+
* The DOM node.
26+
*/
27+
node: Element;
28+
/**
29+
* The text that should be associated with the node for letter-navigation.
30+
*/
31+
text?: string;
32+
}
33+
34+
interface FocusGroupOptions {
35+
/**
36+
* Designate initial members of the group.
37+
*
38+
* @defaultValue `[]`
39+
*/
40+
members?: ReadonlyArray<Element> | NodeListOf<Element> | FocusGroupMember[];
41+
/**
42+
* Specify which key events should move the focus forward, back, to the first member, or to the last member through the group.
43+
*
44+
* @defaultValue
45+
* ```
46+
* {
47+
* next: { keyCode: 40 }, // ArrowDown
48+
* prev: { keyCode: 38 }, // ArrowUp
49+
* }
50+
* ```
51+
*/
52+
keybindings?: Partial<Record<"next" | "prev" | "first" | "last", FocusGroupTriggers | FocusGroupTriggers[]>>;
53+
/**
54+
* If true, when the arrow keys are moving focus they will wrap around the group.
55+
*/
56+
wrap?: boolean;
57+
/**
58+
* If true, string searching is enabled.
59+
*
60+
* @defaultValue `false`
61+
*/
62+
stringSearch?: boolean;
63+
/**
64+
* The number of milliseconds that should elapse between the user's last letter entry (with the keyboard) and a refresh of the string search.
65+
* @defaultValue `800`
66+
*/
67+
stringSearchDelay?: number;
68+
}
69+
70+
interface FocusGroup {
71+
/**
72+
* Start this group listening to keyboard events and responding accordingly.
73+
*/
74+
activate(): FocusGroup;
75+
/**
76+
* Stop this group listening to keyboard events.
77+
*/
78+
deactivate(): FocusGroup;
79+
/**
80+
* Add a member to the group.
81+
*/
82+
addMember(member: Element | FocusGroupMember, index?: number): FocusGroup;
83+
/**
84+
* Remove a member from the group.
85+
*/
86+
removeMember(member: Element | number): FocusGroup;
87+
/**
88+
* Empty the focus group of members.
89+
*/
90+
clearMembers(): FocusGroup;
91+
/**
92+
* Set the focus group's members (clearing any that already exist).
93+
*/
94+
setMembers(members: ReadonlyArray<Element> | NodeListOf<Element> | FocusGroupMember[]): FocusGroup;
95+
/**
96+
* Returns the focus group's current array of members.
97+
*/
98+
getMembers(): FocusGroupMember[];
99+
/**
100+
* Focuses the node at a particular index in the focus group's member array.
101+
* If no member exists at that index, does nothing.
102+
*/
103+
focusNodeAtIndex(index: number): FocusGroup;
104+
/**
105+
* Moves the focus forward one member, if focus is already within the group.
106+
* If focus is not within the group, does nothing.
107+
*/
108+
moveFocusForward(): number;
109+
/**
110+
* Moves the focus back one member, if focus is already within the group.
111+
* If focus is not within the group, does nothing.
112+
*/
113+
moveFocusBack(): number;
114+
}
115+
}
116+
117+
/**
118+
* Returns a new focus group instance.
119+
*/
120+
declare function createFocusGroup(options: createFocusGroup.FocusGroupOptions): createFocusGroup.FocusGroup;
121+
122+
export = createFocusGroup;

‎types/focus-group/package.json‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{
2+
"private": true,
3+
"name": "@types/focus-group",
4+
"version": "0.3.9999",
5+
"projects": [
6+
"https://github.com/davidtheclark/focus-group#readme"
7+
],
8+
"devDependencies": {
9+
"@types/focus-group": "workspace:."
10+
},
11+
"owners": [
12+
{
13+
"name": "Masashi Kawafuji",
14+
"githubUsername": "m-kawafuji"
15+
}
16+
]
17+
}

‎types/focus-group/tsconfig.json‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"compilerOptions": {
3+
"module": "node16",
4+
"lib": [
5+
"es6",
6+
"dom"
7+
],
8+
"noImplicitAny": true,
9+
"noImplicitThis": true,
10+
"strictFunctionTypes": true,
11+
"strictNullChecks": true,
12+
"types": [],
13+
"noEmit": true,
14+
"forceConsistentCasingInFileNames": true
15+
},
16+
"files": [
17+
"index.d.ts",
18+
"focus-group-tests.ts"
19+
]
20+
}

0 commit comments

Comments
 (0)