@itwin/core-react 4.10.0-dev.1 → 4.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.
- package/CHANGELOG.md +9 -1
- package/lib/cjs/core-react/autosuggest/AutoSuggest.js +3 -3
- package/lib/cjs/core-react/autosuggest/AutoSuggest.js.map +1 -1
- package/lib/cjs/core-react/button/UnderlinedButton.js +1 -1
- package/lib/cjs/core-react/button/UnderlinedButton.js.map +1 -1
- package/lib/cjs/core-react/contextmenu/ContextMenu.d.ts.map +1 -1
- package/lib/cjs/core-react/contextmenu/ContextMenu.js +9 -7
- package/lib/cjs/core-react/contextmenu/ContextMenu.js.map +1 -1
- package/lib/cjs/core-react/contextmenu/ContextMenuItem.js +1 -1
- package/lib/cjs/core-react/contextmenu/ContextMenuItem.js.map +1 -1
- package/lib/cjs/core-react/dialog/Dialog.d.ts.map +1 -1
- package/lib/cjs/core-react/dialog/Dialog.js +3 -1
- package/lib/cjs/core-react/dialog/Dialog.js.map +1 -1
- package/lib/cjs/core-react/focus/ItemKeyboardNavigator.d.ts.map +1 -1
- package/lib/cjs/core-react/focus/ItemKeyboardNavigator.js +22 -21
- package/lib/cjs/core-react/focus/ItemKeyboardNavigator.js.map +1 -1
- package/lib/cjs/core-react/inputs/numberinput/NumberInput.js +4 -4
- package/lib/cjs/core-react/inputs/numberinput/NumberInput.js.map +1 -1
- package/lib/cjs/core-react/listbox/Listbox.js +4 -4
- package/lib/cjs/core-react/listbox/Listbox.js.map +1 -1
- package/lib/cjs/core-react/popup/Popup.d.ts.map +1 -1
- package/lib/cjs/core-react/popup/Popup.js +3 -2
- package/lib/cjs/core-react/popup/Popup.js.map +1 -1
- package/lib/cjs/core-react/radialmenu/RadialMenu.d.ts.map +1 -1
- package/lib/cjs/core-react/radialmenu/RadialMenu.js +1 -1
- package/lib/cjs/core-react/radialmenu/RadialMenu.js.map +1 -1
- package/lib/cjs/core-react/searchbox/SearchBox.js +2 -2
- package/lib/cjs/core-react/searchbox/SearchBox.js.map +1 -1
- package/lib/cjs/core-react/utils/hooks/useResizeObserver.d.ts.map +1 -1
- package/lib/cjs/core-react/utils/hooks/useResizeObserver.js +10 -8
- package/lib/cjs/core-react/utils/hooks/useResizeObserver.js.map +1 -1
- package/lib/esm/core-react/autosuggest/AutoSuggest.js +3 -3
- package/lib/esm/core-react/autosuggest/AutoSuggest.js.map +1 -1
- package/lib/esm/core-react/button/UnderlinedButton.js +1 -1
- package/lib/esm/core-react/button/UnderlinedButton.js.map +1 -1
- package/lib/esm/core-react/contextmenu/ContextMenu.d.ts.map +1 -1
- package/lib/esm/core-react/contextmenu/ContextMenu.js +9 -7
- package/lib/esm/core-react/contextmenu/ContextMenu.js.map +1 -1
- package/lib/esm/core-react/contextmenu/ContextMenuItem.js +1 -1
- package/lib/esm/core-react/contextmenu/ContextMenuItem.js.map +1 -1
- package/lib/esm/core-react/dialog/Dialog.d.ts.map +1 -1
- package/lib/esm/core-react/dialog/Dialog.js +3 -1
- package/lib/esm/core-react/dialog/Dialog.js.map +1 -1
- package/lib/esm/core-react/focus/ItemKeyboardNavigator.d.ts.map +1 -1
- package/lib/esm/core-react/focus/ItemKeyboardNavigator.js +22 -21
- package/lib/esm/core-react/focus/ItemKeyboardNavigator.js.map +1 -1
- package/lib/esm/core-react/inputs/numberinput/NumberInput.js +4 -4
- package/lib/esm/core-react/inputs/numberinput/NumberInput.js.map +1 -1
- package/lib/esm/core-react/listbox/Listbox.js +4 -4
- package/lib/esm/core-react/listbox/Listbox.js.map +1 -1
- package/lib/esm/core-react/popup/Popup.d.ts.map +1 -1
- package/lib/esm/core-react/popup/Popup.js +3 -2
- package/lib/esm/core-react/popup/Popup.js.map +1 -1
- package/lib/esm/core-react/radialmenu/RadialMenu.d.ts.map +1 -1
- package/lib/esm/core-react/radialmenu/RadialMenu.js +1 -1
- package/lib/esm/core-react/radialmenu/RadialMenu.js.map +1 -1
- package/lib/esm/core-react/searchbox/SearchBox.js +2 -2
- package/lib/esm/core-react/searchbox/SearchBox.js.map +1 -1
- package/lib/esm/core-react/utils/hooks/useResizeObserver.d.ts.map +1 -1
- package/lib/esm/core-react/utils/hooks/useResizeObserver.js +10 -8
- package/lib/esm/core-react/utils/hooks/useResizeObserver.js.map +1 -1
- package/package.json +7 -7
|
@@ -56,23 +56,23 @@ export class ItemKeyboardNavigator {
|
|
|
56
56
|
handleKeyDownEvent(event, index) {
|
|
57
57
|
const key = event.key;
|
|
58
58
|
switch (key) {
|
|
59
|
-
case Key.Home:
|
|
59
|
+
case Key.Home.valueOf():
|
|
60
60
|
event.preventDefault();
|
|
61
61
|
// Activate first item
|
|
62
62
|
this.focusFirstItem();
|
|
63
63
|
break;
|
|
64
|
-
case Key.End:
|
|
64
|
+
case Key.End.valueOf():
|
|
65
65
|
event.preventDefault();
|
|
66
66
|
// Activate last item
|
|
67
67
|
this.focusLastItem();
|
|
68
68
|
break;
|
|
69
69
|
// Up and down are in keydown
|
|
70
70
|
// because we need to prevent page scroll >:)
|
|
71
|
-
case Key.ArrowUp:
|
|
72
|
-
case Key.ArrowDown:
|
|
71
|
+
case Key.ArrowUp.valueOf():
|
|
72
|
+
case Key.ArrowDown.valueOf():
|
|
73
73
|
this.determineOrientation(event, index);
|
|
74
74
|
break;
|
|
75
|
-
case Key.Enter:
|
|
75
|
+
case Key.Enter.valueOf():
|
|
76
76
|
case " ":
|
|
77
77
|
this.activateItem(index);
|
|
78
78
|
break;
|
|
@@ -82,8 +82,8 @@ export class ItemKeyboardNavigator {
|
|
|
82
82
|
handleKeyUpEvent(event, index) {
|
|
83
83
|
const key = event.key;
|
|
84
84
|
switch (key) {
|
|
85
|
-
case Key.ArrowLeft:
|
|
86
|
-
case Key.ArrowRight:
|
|
85
|
+
case Key.ArrowLeft.valueOf():
|
|
86
|
+
case Key.ArrowRight.valueOf():
|
|
87
87
|
this.determineOrientation(event, index);
|
|
88
88
|
break;
|
|
89
89
|
}
|
|
@@ -104,22 +104,22 @@ export class ItemKeyboardNavigator {
|
|
|
104
104
|
const vertical = this._orientation === Orientation.Vertical;
|
|
105
105
|
let proceed = false;
|
|
106
106
|
if (vertical) {
|
|
107
|
-
if (key === Key.ArrowUp || key === Key.ArrowDown) {
|
|
107
|
+
if (key === Key.ArrowUp.valueOf() || key === Key.ArrowDown.valueOf()) {
|
|
108
108
|
event.preventDefault();
|
|
109
109
|
proceed = true;
|
|
110
110
|
}
|
|
111
111
|
else if (this.crossAxisArrowKeyHandler &&
|
|
112
|
-
(key === Key.ArrowLeft || key === Key.ArrowRight)) {
|
|
113
|
-
this.crossAxisArrowKeyHandler(key === Key.ArrowRight);
|
|
112
|
+
(key === Key.ArrowLeft.valueOf() || key === Key.ArrowRight.valueOf())) {
|
|
113
|
+
this.crossAxisArrowKeyHandler(key === Key.ArrowRight.valueOf());
|
|
114
114
|
}
|
|
115
115
|
}
|
|
116
116
|
else {
|
|
117
|
-
if (key === Key.ArrowLeft || key === Key.ArrowRight) {
|
|
117
|
+
if (key === Key.ArrowLeft.valueOf() || key === Key.ArrowRight.valueOf()) {
|
|
118
118
|
proceed = true;
|
|
119
119
|
}
|
|
120
120
|
else if (this.crossAxisArrowKeyHandler &&
|
|
121
|
-
(key === Key.ArrowUp || key === Key.ArrowDown)) {
|
|
122
|
-
this.crossAxisArrowKeyHandler(key === Key.ArrowDown);
|
|
121
|
+
(key === Key.ArrowUp.valueOf() || key === Key.ArrowDown.valueOf())) {
|
|
122
|
+
this.crossAxisArrowKeyHandler(key === Key.ArrowDown.valueOf());
|
|
123
123
|
}
|
|
124
124
|
}
|
|
125
125
|
if (proceed) {
|
|
@@ -141,7 +141,8 @@ export class ItemKeyboardNavigator {
|
|
|
141
141
|
else {
|
|
142
142
|
// istanbul ignore else
|
|
143
143
|
if (this._allowWrap) {
|
|
144
|
-
if (pressed === Key.ArrowLeft
|
|
144
|
+
if (pressed === Key.ArrowLeft.valueOf() ||
|
|
145
|
+
pressed === Key.ArrowUp.valueOf()) {
|
|
145
146
|
this.focusLastItem();
|
|
146
147
|
}
|
|
147
148
|
else {
|
|
@@ -160,15 +161,15 @@ export class ItemKeyboardNavigator {
|
|
|
160
161
|
*/
|
|
161
162
|
export function isNavigationKey(key) {
|
|
162
163
|
return (isArrowKey(key) ||
|
|
163
|
-
key === Key.Home ||
|
|
164
|
-
key === Key.End ||
|
|
164
|
+
key === Key.Home.valueOf() ||
|
|
165
|
+
key === Key.End.valueOf() ||
|
|
165
166
|
key === " " ||
|
|
166
|
-
key === Key.Enter);
|
|
167
|
+
key === Key.Enter.valueOf());
|
|
167
168
|
}
|
|
168
169
|
function isArrowKey(key) {
|
|
169
|
-
return (key === Key.ArrowLeft ||
|
|
170
|
-
key === Key.ArrowRight ||
|
|
171
|
-
key === Key.ArrowUp ||
|
|
172
|
-
key === Key.ArrowDown);
|
|
170
|
+
return (key === Key.ArrowLeft.valueOf() ||
|
|
171
|
+
key === Key.ArrowRight.valueOf() ||
|
|
172
|
+
key === Key.ArrowUp.valueOf() ||
|
|
173
|
+
key === Key.ArrowDown.valueOf());
|
|
173
174
|
}
|
|
174
175
|
//# sourceMappingURL=ItemKeyboardNavigator.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ItemKeyboardNavigator.js","sourceRoot":"","sources":["../../../../src/core-react/focus/ItemKeyboardNavigator.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Focus\n */\n\nimport { Key } from \"ts-key-enum\";\nimport { Orientation } from \"../enums/Orientation\";\n\n/** Cross-Axis Arrow Key Callback\n * @internal\n */\nexport type CrossAxisArrowKeyFunc = (forward: boolean) => void;\n\n/** Keyboard Navigator for parent components\n * @internal\n */\nexport class ItemKeyboardNavigator {\n private _direction: Map<string, number>;\n private _itemCount = 0;\n private _orientation = Orientation.Horizontal;\n private _allowWrap = true;\n private _crossAxisArrowKeyHandler?: CrossAxisArrowKeyFunc;\n\n constructor(\n public onFocusItem: (index: number) => void,\n public onActivateItem: (index: number) => void\n ) {\n this._direction = new Map<string, number>([\n [Key.ArrowLeft, -1],\n [Key.ArrowUp, -1],\n [Key.ArrowRight, 1],\n [Key.ArrowDown, 1],\n ]);\n }\n\n /** The item count */\n public get itemCount(): number {\n return this._itemCount;\n }\n public set itemCount(count: number) {\n this._itemCount = count;\n }\n\n /** The primary orientation */\n public get orientation(): Orientation {\n return this._orientation;\n }\n public set orientation(orientation: Orientation) {\n this._orientation = orientation;\n }\n\n /** The allow wrap property controls whether the movement will stop at the first and last items or wrap */\n public get allowWrap(): boolean {\n return this._allowWrap;\n }\n public set allowWrap(v: boolean) {\n this._allowWrap = v;\n }\n\n /** Called when the arrow keys that run perpendicular to the primary orientation are pressed */\n public get crossAxisArrowKeyHandler(): CrossAxisArrowKeyFunc | undefined {\n return this._crossAxisArrowKeyHandler;\n }\n public set crossAxisArrowKeyHandler(v: CrossAxisArrowKeyFunc | undefined) {\n this._crossAxisArrowKeyHandler = v;\n }\n\n /** Handle KeyDown on items */\n public handleKeyDownEvent(event: React.KeyboardEvent, index: number): void {\n const key = event.key;\n\n switch (key) {\n case Key.Home:\n event.preventDefault();\n // Activate first item\n this.focusFirstItem();\n break;\n case Key.End:\n event.preventDefault();\n // Activate last item\n this.focusLastItem();\n break;\n\n // Up and down are in keydown\n // because we need to prevent page scroll >:)\n case Key.ArrowUp:\n case Key.ArrowDown:\n this.determineOrientation(event, index);\n break;\n\n case Key.Enter:\n case \" \":\n this.activateItem(index);\n break;\n }\n }\n\n /** Handle KeyUp on items */\n public handleKeyUpEvent(event: React.KeyboardEvent, index: number): void {\n const key = event.key;\n\n switch (key) {\n case Key.ArrowLeft:\n case Key.ArrowRight:\n this.determineOrientation(event, index);\n break;\n }\n }\n\n private focusFirstItem(): void {\n this.onFocusItem(0);\n }\n\n private focusLastItem(): void {\n const index = this._itemCount - 1;\n this.onFocusItem(index);\n }\n\n /** When an item list's orientation is set to vertical,\n * only up and down arrow should function.\n * In all other cases only left and right arrow function.\n */\n private determineOrientation(\n event: React.KeyboardEvent,\n index: number\n ): void {\n const key = event.key;\n const vertical = this._orientation === Orientation.Vertical;\n let proceed = false;\n\n if (vertical) {\n if (key === Key.ArrowUp || key === Key.ArrowDown) {\n event.preventDefault();\n proceed = true;\n } else if (\n this.crossAxisArrowKeyHandler &&\n (key === Key.ArrowLeft || key === Key.ArrowRight)\n ) {\n this.crossAxisArrowKeyHandler(key === Key.ArrowRight);\n }\n } else {\n if (key === Key.ArrowLeft || key === Key.ArrowRight) {\n proceed = true;\n } else if (\n this.crossAxisArrowKeyHandler &&\n (key === Key.ArrowUp || key === Key.ArrowDown)\n ) {\n this.crossAxisArrowKeyHandler(key === Key.ArrowDown);\n }\n }\n\n if (proceed) {\n this.switchItemOnArrowPress(event, index);\n }\n }\n\n /** Either focus the next, previous, first, or last item depending on key pressed\n */\n private switchItemOnArrowPress(\n event: React.KeyboardEvent,\n index: number\n ): void {\n // Add or subtract depending on key pressed\n const pressed = event.key;\n const targetDirection = this._direction.get(pressed);\n\n // istanbul ignore else\n if (targetDirection) {\n const newIndex = index + targetDirection;\n\n if (0 <= newIndex && newIndex < this._itemCount) {\n this.onFocusItem(newIndex);\n } else {\n // istanbul ignore else\n if (this._allowWrap) {\n if (pressed === Key.ArrowLeft || pressed === Key.ArrowUp) {\n this.focusLastItem();\n } else {\n this.focusFirstItem();\n }\n }\n }\n }\n }\n\n private activateItem(index: number): void {\n this.onActivateItem(index);\n }\n}\n\n/** Determines if a KeyboardEvent.key is an Item Navigation key\n * @internal\n */\nexport function isNavigationKey(key: string): boolean {\n return (\n isArrowKey(key) ||\n key === Key.Home ||\n key === Key.End ||\n key === \" \" ||\n key === Key.Enter\n );\n}\n\nfunction isArrowKey(key: string): boolean {\n return (\n key === Key.ArrowLeft ||\n key === Key.ArrowRight ||\n key === Key.ArrowUp ||\n key === Key.ArrowDown\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"ItemKeyboardNavigator.js","sourceRoot":"","sources":["../../../../src/core-react/focus/ItemKeyboardNavigator.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Focus\n */\n\nimport { Key } from \"ts-key-enum\";\nimport { Orientation } from \"../enums/Orientation\";\n\n/** Cross-Axis Arrow Key Callback\n * @internal\n */\nexport type CrossAxisArrowKeyFunc = (forward: boolean) => void;\n\n/** Keyboard Navigator for parent components\n * @internal\n */\nexport class ItemKeyboardNavigator {\n private _direction: Map<string, number>;\n private _itemCount = 0;\n private _orientation = Orientation.Horizontal;\n private _allowWrap = true;\n private _crossAxisArrowKeyHandler?: CrossAxisArrowKeyFunc;\n\n constructor(\n public onFocusItem: (index: number) => void,\n public onActivateItem: (index: number) => void\n ) {\n this._direction = new Map<string, number>([\n [Key.ArrowLeft, -1],\n [Key.ArrowUp, -1],\n [Key.ArrowRight, 1],\n [Key.ArrowDown, 1],\n ]);\n }\n\n /** The item count */\n public get itemCount(): number {\n return this._itemCount;\n }\n public set itemCount(count: number) {\n this._itemCount = count;\n }\n\n /** The primary orientation */\n public get orientation(): Orientation {\n return this._orientation;\n }\n public set orientation(orientation: Orientation) {\n this._orientation = orientation;\n }\n\n /** The allow wrap property controls whether the movement will stop at the first and last items or wrap */\n public get allowWrap(): boolean {\n return this._allowWrap;\n }\n public set allowWrap(v: boolean) {\n this._allowWrap = v;\n }\n\n /** Called when the arrow keys that run perpendicular to the primary orientation are pressed */\n public get crossAxisArrowKeyHandler(): CrossAxisArrowKeyFunc | undefined {\n return this._crossAxisArrowKeyHandler;\n }\n public set crossAxisArrowKeyHandler(v: CrossAxisArrowKeyFunc | undefined) {\n this._crossAxisArrowKeyHandler = v;\n }\n\n /** Handle KeyDown on items */\n public handleKeyDownEvent(event: React.KeyboardEvent, index: number): void {\n const key = event.key;\n\n switch (key) {\n case Key.Home.valueOf():\n event.preventDefault();\n // Activate first item\n this.focusFirstItem();\n break;\n case Key.End.valueOf():\n event.preventDefault();\n // Activate last item\n this.focusLastItem();\n break;\n\n // Up and down are in keydown\n // because we need to prevent page scroll >:)\n case Key.ArrowUp.valueOf():\n case Key.ArrowDown.valueOf():\n this.determineOrientation(event, index);\n break;\n\n case Key.Enter.valueOf():\n case \" \":\n this.activateItem(index);\n break;\n }\n }\n\n /** Handle KeyUp on items */\n public handleKeyUpEvent(event: React.KeyboardEvent, index: number): void {\n const key = event.key;\n\n switch (key) {\n case Key.ArrowLeft.valueOf():\n case Key.ArrowRight.valueOf():\n this.determineOrientation(event, index);\n break;\n }\n }\n\n private focusFirstItem(): void {\n this.onFocusItem(0);\n }\n\n private focusLastItem(): void {\n const index = this._itemCount - 1;\n this.onFocusItem(index);\n }\n\n /** When an item list's orientation is set to vertical,\n * only up and down arrow should function.\n * In all other cases only left and right arrow function.\n */\n private determineOrientation(\n event: React.KeyboardEvent,\n index: number\n ): void {\n const key = event.key;\n const vertical = this._orientation === Orientation.Vertical;\n let proceed = false;\n\n if (vertical) {\n if (key === Key.ArrowUp.valueOf() || key === Key.ArrowDown.valueOf()) {\n event.preventDefault();\n proceed = true;\n } else if (\n this.crossAxisArrowKeyHandler &&\n (key === Key.ArrowLeft.valueOf() || key === Key.ArrowRight.valueOf())\n ) {\n this.crossAxisArrowKeyHandler(key === Key.ArrowRight.valueOf());\n }\n } else {\n if (key === Key.ArrowLeft.valueOf() || key === Key.ArrowRight.valueOf()) {\n proceed = true;\n } else if (\n this.crossAxisArrowKeyHandler &&\n (key === Key.ArrowUp.valueOf() || key === Key.ArrowDown.valueOf())\n ) {\n this.crossAxisArrowKeyHandler(key === Key.ArrowDown.valueOf());\n }\n }\n\n if (proceed) {\n this.switchItemOnArrowPress(event, index);\n }\n }\n\n /** Either focus the next, previous, first, or last item depending on key pressed\n */\n private switchItemOnArrowPress(\n event: React.KeyboardEvent,\n index: number\n ): void {\n // Add or subtract depending on key pressed\n const pressed = event.key;\n const targetDirection = this._direction.get(pressed);\n\n // istanbul ignore else\n if (targetDirection) {\n const newIndex = index + targetDirection;\n\n if (0 <= newIndex && newIndex < this._itemCount) {\n this.onFocusItem(newIndex);\n } else {\n // istanbul ignore else\n if (this._allowWrap) {\n if (\n pressed === Key.ArrowLeft.valueOf() ||\n pressed === Key.ArrowUp.valueOf()\n ) {\n this.focusLastItem();\n } else {\n this.focusFirstItem();\n }\n }\n }\n }\n }\n\n private activateItem(index: number): void {\n this.onActivateItem(index);\n }\n}\n\n/** Determines if a KeyboardEvent.key is an Item Navigation key\n * @internal\n */\nexport function isNavigationKey(key: string): boolean {\n return (\n isArrowKey(key) ||\n key === Key.Home.valueOf() ||\n key === Key.End.valueOf() ||\n key === \" \" ||\n key === Key.Enter.valueOf()\n );\n}\n\nfunction isArrowKey(key: string): boolean {\n return (\n key === Key.ArrowLeft.valueOf() ||\n key === Key.ArrowRight.valueOf() ||\n key === Key.ArrowUp.valueOf() ||\n key === Key.ArrowDown.valueOf()\n );\n}\n"]}
|
|
@@ -109,21 +109,21 @@ const ForwardRefNumberInput = React.forwardRef(function ForwardRefNumberInput(pr
|
|
|
109
109
|
]);
|
|
110
110
|
const handleKeyDown = React.useCallback((event) => {
|
|
111
111
|
// istanbul ignore else
|
|
112
|
-
if (event.key === Key.Enter) {
|
|
112
|
+
if (event.key === Key.Enter.valueOf()) {
|
|
113
113
|
updateValueFromString(event.currentTarget.value);
|
|
114
114
|
event.preventDefault();
|
|
115
115
|
event.stopPropagation();
|
|
116
116
|
}
|
|
117
|
-
else if (event.key === Key.Escape) {
|
|
117
|
+
else if (event.key === Key.Escape.valueOf()) {
|
|
118
118
|
setFormattedValue(formatInternal(currentValueRef.current));
|
|
119
119
|
event.preventDefault();
|
|
120
120
|
}
|
|
121
|
-
else if (event.key === Key.ArrowDown) {
|
|
121
|
+
else if (event.key === Key.ArrowDown.valueOf()) {
|
|
122
122
|
applyStep(false);
|
|
123
123
|
event.preventDefault();
|
|
124
124
|
event.stopPropagation();
|
|
125
125
|
}
|
|
126
|
-
else if (event.key === Key.ArrowUp) {
|
|
126
|
+
else if (event.key === Key.ArrowUp.valueOf()) {
|
|
127
127
|
applyStep(true);
|
|
128
128
|
event.preventDefault();
|
|
129
129
|
event.stopPropagation();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NumberInput.js","sourceRoot":"","sources":["../../../../../src/core-react/inputs/numberinput/NumberInput.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Inputs\n */\n\nimport \"./NumberInput.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { Key } from \"ts-key-enum\";\nimport { Input } from \"@itwin/itwinui-react\";\nimport { Icon } from \"../../icons/IconComponent\";\nimport {\n SvgCaretDown,\n SvgCaretDownSmall,\n SvgCaretUp,\n SvgCaretUpSmall,\n} from \"@itwin/itwinui-icons-react\";\n\ntype InputProps = React.ComponentPropsWithoutRef<typeof Input>;\n\n/** Step function prototype for [[NumberInput]] component\n * @public\n */\nexport type StepFunctionProp =\n | number\n | ((direction: string) => number | undefined);\n\n/** Properties for the [[NumberInput]] component\n * @public\n */\nexport interface NumberInputProps\n extends Omit<InputProps, \"min\" | \"max\" | \"step\" | \"onChange\"> {\n /** Numeric value, set to `undefined` to show placeholder text */\n value?: number;\n /** CSS class name for the NumberInput component container div */\n containerClassName?: string;\n /** Style for component container div. */\n containerStyle?: React.CSSProperties;\n /** number or function\tNumber.MIN_SAFE_INTEGER */\n min?: number;\n /** number or function\tdefaults to Number.MAX_SAFE_INTEGER */\n max?: number;\n /** increment step value used while incrementing or decrementing (up/down buttons or arrow keys) defaults to 1. */\n step?: StepFunctionProp;\n /** number of decimal places, defaults to 0 */\n precision?: number;\n /** function parseFloat */\n parse?: (value: string) => number | null | undefined;\n /** function optional formatting function that takes the number value and the internal formatted value in case function just adds prefix or suffix. */\n format?: (num: number | null | undefined, formattedValue: string) => string;\n /** Set to true to \"snap\" to the closest step value while incrementing or decrementing (up/down buttons or arrow keys). */\n snap?: boolean;\n /** Function to call when value is changed. */\n onChange?: (value: number | undefined, stringValue: string) => void;\n /** if true up/down buttons are shown larger and side by side */\n showTouchButtons?: boolean;\n /** Provides ability to return reference to HTMLInputElement */\n ref?: React.Ref<HTMLInputElement>;\n /**\n * Makes this component behave as controlled component.\n * @internal\n */\n isControlled?: boolean;\n}\n\nconst ForwardRefNumberInput = React.forwardRef<\n HTMLInputElement,\n NumberInputProps\n>(function ForwardRefNumberInput(props, ref) {\n const {\n containerClassName,\n className,\n value,\n min,\n max,\n precision,\n format,\n parse,\n onChange,\n onBlur,\n onKeyDown,\n step,\n snap,\n showTouchButtons,\n containerStyle,\n isControlled,\n ...otherProps\n } = props;\n const currentValueRef = React.useRef(value);\n\n /**\n * Used internally to parse the argument x to it's numeric representation.\n * If the argument cannot be converted to finite number returns 0; If a\n * \"precision\" prop is specified uses it round the number with that\n * precision (no fixed precision here because the return value is float, not\n * string).\n */\n const parseInternal = React.useCallback(\n (x: string) => {\n let n: number | undefined | null;\n\n if (parse) n = parse(x);\n if (undefined === n || null === n) {\n n = parseFloat(x);\n if (isNaN(n) || !isFinite(n)) {\n n = 0;\n }\n }\n\n const localPrecision = undefined === precision ? 10 : precision;\n const q = Math.pow(10, localPrecision);\n const localMin = undefined === min ? Number.MIN_SAFE_INTEGER : min;\n const localMax = undefined === max ? Number.MAX_SAFE_INTEGER : max;\n n = Math.min(Math.max(n, localMin), localMax);\n n = Math.round(n * q) / q;\n\n return n;\n },\n [parse, precision, min, max]\n );\n\n /**\n * This is used internally to format a number to its display representation.\n * It will invoke the format function if one is provided.\n */\n const formatInternal = React.useCallback(\n (num: number | undefined | null) => {\n const localPrecision =\n undefined === precision || null === precision ? 0 : precision;\n const str =\n undefined === num || null === num ? \"\" : num.toFixed(localPrecision);\n\n if (format) return format(num, str);\n\n return str;\n },\n [format, precision]\n );\n\n const [formattedValue, setFormattedValue] = React.useState(() =>\n formatInternal(value)\n );\n\n // See if new initialValue props have changed since component mounted\n React.useEffect(() => {\n currentValueRef.current = value;\n const currentFormattedValue = formatInternal(currentValueRef.current);\n setFormattedValue(currentFormattedValue);\n }, [formatInternal, value]);\n\n const handleChange = React.useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const newVal = event.currentTarget.value;\n setFormattedValue(newVal);\n isControlled && onChange && onChange(parseInternal(newVal), newVal);\n },\n [isControlled, onChange, parseInternal]\n );\n\n const updateValue = React.useCallback(\n (newVal: number) => {\n const newFormattedVal = formatInternal(newVal);\n onChange && onChange(newVal, newFormattedVal);\n setFormattedValue(newFormattedVal);\n },\n [onChange, formatInternal]\n );\n\n const updateValueFromString = React.useCallback(\n (strValue: string) => {\n const newVal = parseInternal(strValue);\n updateValue(newVal);\n },\n [parseInternal, updateValue]\n );\n\n const handleBlur = React.useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n const newVal = parseInternal(event.target.value);\n onBlur && onBlur(event);\n updateValue(newVal);\n },\n [parseInternal, updateValue, onBlur]\n );\n\n const getIncrementValue = React.useCallback(\n (increment: boolean) => {\n if (typeof step === \"function\") {\n const stepVal = step(increment ? \"up\" : \"down\");\n return stepVal ? stepVal : 1;\n }\n\n return !step ? 1 : step;\n },\n [step]\n );\n\n /**\n * The internal method that actually sets the new value on the input\n */\n const applyStep = React.useCallback(\n (increment: boolean) => {\n const incrementValue = getIncrementValue(increment);\n\n let num =\n parseInternal(formattedValue) +\n (increment ? incrementValue : -incrementValue);\n if (snap) {\n num = Math.round(num / incrementValue) * incrementValue;\n }\n\n const localMin = undefined === min ? Number.MIN_SAFE_INTEGER : min;\n const localMax = undefined === max ? Number.MAX_SAFE_INTEGER : max;\n num = Math.min(Math.max(num, localMin), localMax);\n\n updateValue(num);\n },\n [\n formattedValue,\n getIncrementValue,\n max,\n min,\n parseInternal,\n snap,\n updateValue,\n ]\n );\n\n const handleKeyDown = React.useCallback(\n (event: React.KeyboardEvent<HTMLInputElement>) => {\n // istanbul ignore else\n if (event.key === Key.Enter) {\n updateValueFromString(event.currentTarget.value);\n event.preventDefault();\n event.stopPropagation();\n } else if (event.key === Key.Escape) {\n setFormattedValue(formatInternal(currentValueRef.current));\n event.preventDefault();\n } else if (event.key === Key.ArrowDown) {\n applyStep(false);\n event.preventDefault();\n event.stopPropagation();\n } else if (event.key === Key.ArrowUp) {\n applyStep(true);\n event.preventDefault();\n event.stopPropagation();\n }\n onKeyDown && onKeyDown(event);\n },\n [applyStep, formatInternal, updateValueFromString, onKeyDown]\n );\n\n const handleDownClick = React.useCallback(\n (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n applyStep(false);\n event.preventDefault();\n },\n [applyStep]\n );\n\n const handleUpClick = React.useCallback(\n (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n applyStep(true);\n event.preventDefault();\n },\n [applyStep]\n );\n\n const handleFocus = React.useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n event.currentTarget.select();\n },\n []\n );\n\n const isDisabled = !!otherProps.disabled;\n const containerClasses = classnames(\n \"core-number-input-container\",\n containerClassName,\n showTouchButtons && \"core-number-buttons-for-touch\",\n isDisabled && \"core-number-input-disabled\"\n );\n\n const caretUp = showTouchButtons ? <SvgCaretUp /> : <SvgCaretUpSmall />;\n const caretDown = showTouchButtons ? <SvgCaretDown /> : <SvgCaretDownSmall />;\n\n return (\n <div className={containerClasses} style={containerStyle}>\n <Input\n ref={ref}\n value={formattedValue}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n onFocus={handleFocus}\n onBlur={handleBlur}\n size=\"small\"\n className={classnames(\"core-input\", className)}\n {...otherProps}\n />\n <div\n className={classnames(\n \"core-number-input-buttons-container\",\n showTouchButtons && \"core-number-buttons-for-touch\"\n )}\n >\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */}\n <div\n className=\"core-number-input-button core-number-input-button-up\"\n tabIndex={-1}\n onClick={handleUpClick}\n role=\"presentation\"\n >\n <Icon iconSpec={caretUp} />\n </div>\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */}\n <div\n className=\"core-number-input-button core-number-input-button-down\"\n tabIndex={-1}\n onClick={handleDownClick}\n role=\"presentation\"\n >\n <Icon iconSpec={caretDown} />\n </div>\n </div>\n </div>\n );\n});\n\n/** Input component for numbers with up and down buttons to increment and decrement the value.\n * @public\n */\nexport const NumberInput: (\n props: NumberInputProps\n) => React.ReactElement | null = ForwardRefNumberInput;\n"]}
|
|
1
|
+
{"version":3,"file":"NumberInput.js","sourceRoot":"","sources":["../../../../../src/core-react/inputs/numberinput/NumberInput.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Inputs\n */\n\nimport \"./NumberInput.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { Key } from \"ts-key-enum\";\nimport { Input } from \"@itwin/itwinui-react\";\nimport { Icon } from \"../../icons/IconComponent\";\nimport {\n SvgCaretDown,\n SvgCaretDownSmall,\n SvgCaretUp,\n SvgCaretUpSmall,\n} from \"@itwin/itwinui-icons-react\";\n\ntype InputProps = React.ComponentPropsWithoutRef<typeof Input>;\n\n/** Step function prototype for [[NumberInput]] component\n * @public\n */\nexport type StepFunctionProp =\n | number\n | ((direction: string) => number | undefined);\n\n/** Properties for the [[NumberInput]] component\n * @public\n */\nexport interface NumberInputProps\n extends Omit<InputProps, \"min\" | \"max\" | \"step\" | \"onChange\"> {\n /** Numeric value, set to `undefined` to show placeholder text */\n value?: number;\n /** CSS class name for the NumberInput component container div */\n containerClassName?: string;\n /** Style for component container div. */\n containerStyle?: React.CSSProperties;\n /** number or function\tNumber.MIN_SAFE_INTEGER */\n min?: number;\n /** number or function\tdefaults to Number.MAX_SAFE_INTEGER */\n max?: number;\n /** increment step value used while incrementing or decrementing (up/down buttons or arrow keys) defaults to 1. */\n step?: StepFunctionProp;\n /** number of decimal places, defaults to 0 */\n precision?: number;\n /** function parseFloat */\n parse?: (value: string) => number | null | undefined;\n /** function optional formatting function that takes the number value and the internal formatted value in case function just adds prefix or suffix. */\n format?: (num: number | null | undefined, formattedValue: string) => string;\n /** Set to true to \"snap\" to the closest step value while incrementing or decrementing (up/down buttons or arrow keys). */\n snap?: boolean;\n /** Function to call when value is changed. */\n onChange?: (value: number | undefined, stringValue: string) => void;\n /** if true up/down buttons are shown larger and side by side */\n showTouchButtons?: boolean;\n /** Provides ability to return reference to HTMLInputElement */\n ref?: React.Ref<HTMLInputElement>;\n /**\n * Makes this component behave as controlled component.\n * @internal\n */\n isControlled?: boolean;\n}\n\nconst ForwardRefNumberInput = React.forwardRef<\n HTMLInputElement,\n NumberInputProps\n>(function ForwardRefNumberInput(props, ref) {\n const {\n containerClassName,\n className,\n value,\n min,\n max,\n precision,\n format,\n parse,\n onChange,\n onBlur,\n onKeyDown,\n step,\n snap,\n showTouchButtons,\n containerStyle,\n isControlled,\n ...otherProps\n } = props;\n const currentValueRef = React.useRef(value);\n\n /**\n * Used internally to parse the argument x to it's numeric representation.\n * If the argument cannot be converted to finite number returns 0; If a\n * \"precision\" prop is specified uses it round the number with that\n * precision (no fixed precision here because the return value is float, not\n * string).\n */\n const parseInternal = React.useCallback(\n (x: string) => {\n let n: number | undefined | null;\n\n if (parse) n = parse(x);\n if (undefined === n || null === n) {\n n = parseFloat(x);\n if (isNaN(n) || !isFinite(n)) {\n n = 0;\n }\n }\n\n const localPrecision = undefined === precision ? 10 : precision;\n const q = Math.pow(10, localPrecision);\n const localMin = undefined === min ? Number.MIN_SAFE_INTEGER : min;\n const localMax = undefined === max ? Number.MAX_SAFE_INTEGER : max;\n n = Math.min(Math.max(n, localMin), localMax);\n n = Math.round(n * q) / q;\n\n return n;\n },\n [parse, precision, min, max]\n );\n\n /**\n * This is used internally to format a number to its display representation.\n * It will invoke the format function if one is provided.\n */\n const formatInternal = React.useCallback(\n (num: number | undefined | null) => {\n const localPrecision =\n undefined === precision || null === precision ? 0 : precision;\n const str =\n undefined === num || null === num ? \"\" : num.toFixed(localPrecision);\n\n if (format) return format(num, str);\n\n return str;\n },\n [format, precision]\n );\n\n const [formattedValue, setFormattedValue] = React.useState(() =>\n formatInternal(value)\n );\n\n // See if new initialValue props have changed since component mounted\n React.useEffect(() => {\n currentValueRef.current = value;\n const currentFormattedValue = formatInternal(currentValueRef.current);\n setFormattedValue(currentFormattedValue);\n }, [formatInternal, value]);\n\n const handleChange = React.useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const newVal = event.currentTarget.value;\n setFormattedValue(newVal);\n isControlled && onChange && onChange(parseInternal(newVal), newVal);\n },\n [isControlled, onChange, parseInternal]\n );\n\n const updateValue = React.useCallback(\n (newVal: number) => {\n const newFormattedVal = formatInternal(newVal);\n onChange && onChange(newVal, newFormattedVal);\n setFormattedValue(newFormattedVal);\n },\n [onChange, formatInternal]\n );\n\n const updateValueFromString = React.useCallback(\n (strValue: string) => {\n const newVal = parseInternal(strValue);\n updateValue(newVal);\n },\n [parseInternal, updateValue]\n );\n\n const handleBlur = React.useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n const newVal = parseInternal(event.target.value);\n onBlur && onBlur(event);\n updateValue(newVal);\n },\n [parseInternal, updateValue, onBlur]\n );\n\n const getIncrementValue = React.useCallback(\n (increment: boolean) => {\n if (typeof step === \"function\") {\n const stepVal = step(increment ? \"up\" : \"down\");\n return stepVal ? stepVal : 1;\n }\n\n return !step ? 1 : step;\n },\n [step]\n );\n\n /**\n * The internal method that actually sets the new value on the input\n */\n const applyStep = React.useCallback(\n (increment: boolean) => {\n const incrementValue = getIncrementValue(increment);\n\n let num =\n parseInternal(formattedValue) +\n (increment ? incrementValue : -incrementValue);\n if (snap) {\n num = Math.round(num / incrementValue) * incrementValue;\n }\n\n const localMin = undefined === min ? Number.MIN_SAFE_INTEGER : min;\n const localMax = undefined === max ? Number.MAX_SAFE_INTEGER : max;\n num = Math.min(Math.max(num, localMin), localMax);\n\n updateValue(num);\n },\n [\n formattedValue,\n getIncrementValue,\n max,\n min,\n parseInternal,\n snap,\n updateValue,\n ]\n );\n\n const handleKeyDown = React.useCallback(\n (event: React.KeyboardEvent<HTMLInputElement>) => {\n // istanbul ignore else\n if (event.key === Key.Enter.valueOf()) {\n updateValueFromString(event.currentTarget.value);\n event.preventDefault();\n event.stopPropagation();\n } else if (event.key === Key.Escape.valueOf()) {\n setFormattedValue(formatInternal(currentValueRef.current));\n event.preventDefault();\n } else if (event.key === Key.ArrowDown.valueOf()) {\n applyStep(false);\n event.preventDefault();\n event.stopPropagation();\n } else if (event.key === Key.ArrowUp.valueOf()) {\n applyStep(true);\n event.preventDefault();\n event.stopPropagation();\n }\n onKeyDown && onKeyDown(event);\n },\n [applyStep, formatInternal, updateValueFromString, onKeyDown]\n );\n\n const handleDownClick = React.useCallback(\n (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n applyStep(false);\n event.preventDefault();\n },\n [applyStep]\n );\n\n const handleUpClick = React.useCallback(\n (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n applyStep(true);\n event.preventDefault();\n },\n [applyStep]\n );\n\n const handleFocus = React.useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n event.currentTarget.select();\n },\n []\n );\n\n const isDisabled = !!otherProps.disabled;\n const containerClasses = classnames(\n \"core-number-input-container\",\n containerClassName,\n showTouchButtons && \"core-number-buttons-for-touch\",\n isDisabled && \"core-number-input-disabled\"\n );\n\n const caretUp = showTouchButtons ? <SvgCaretUp /> : <SvgCaretUpSmall />;\n const caretDown = showTouchButtons ? <SvgCaretDown /> : <SvgCaretDownSmall />;\n\n return (\n <div className={containerClasses} style={containerStyle}>\n <Input\n ref={ref}\n value={formattedValue}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n onFocus={handleFocus}\n onBlur={handleBlur}\n size=\"small\"\n className={classnames(\"core-input\", className)}\n {...otherProps}\n />\n <div\n className={classnames(\n \"core-number-input-buttons-container\",\n showTouchButtons && \"core-number-buttons-for-touch\"\n )}\n >\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */}\n <div\n className=\"core-number-input-button core-number-input-button-up\"\n tabIndex={-1}\n onClick={handleUpClick}\n role=\"presentation\"\n >\n <Icon iconSpec={caretUp} />\n </div>\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */}\n <div\n className=\"core-number-input-button core-number-input-button-down\"\n tabIndex={-1}\n onClick={handleDownClick}\n role=\"presentation\"\n >\n <Icon iconSpec={caretDown} />\n </div>\n </div>\n </div>\n );\n});\n\n/** Input component for numbers with up and down buttons to increment and decrement the value.\n * @public\n */\nexport const NumberInput: (\n props: NumberInputProps\n) => React.ReactElement | null = ForwardRefNumberInput;\n"]}
|
|
@@ -27,7 +27,7 @@ function processKeyboardNavigation(optionValues, itemIndex, key) {
|
|
|
27
27
|
let keyProcessed = false;
|
|
28
28
|
let newIndex = itemIndex >= 0 ? itemIndex : 0;
|
|
29
29
|
// Note: In aria example Page Up/Down just moves up or down by one item. See https://www.w3.org/TR/wai-aria-practices-1.1/examples/listbox/js/listbox.js
|
|
30
|
-
if (key === Key.ArrowDown || key === Key.PageDown) {
|
|
30
|
+
if (key === Key.ArrowDown.valueOf() || key === Key.PageDown.valueOf()) {
|
|
31
31
|
for (let i = itemIndex + 1; i < optionValues.length; i++) {
|
|
32
32
|
if (!optionValues[i].disabled) {
|
|
33
33
|
newIndex = i;
|
|
@@ -36,7 +36,7 @@ function processKeyboardNavigation(optionValues, itemIndex, key) {
|
|
|
36
36
|
}
|
|
37
37
|
keyProcessed = true;
|
|
38
38
|
}
|
|
39
|
-
else if (key === Key.ArrowUp || key === Key.PageUp) {
|
|
39
|
+
else if (key === Key.ArrowUp.valueOf() || key === Key.PageUp.valueOf()) {
|
|
40
40
|
for (let i = itemIndex - 1; i >= 0; i--) {
|
|
41
41
|
if (!optionValues[i].disabled) {
|
|
42
42
|
newIndex = i;
|
|
@@ -45,7 +45,7 @@ function processKeyboardNavigation(optionValues, itemIndex, key) {
|
|
|
45
45
|
}
|
|
46
46
|
keyProcessed = true;
|
|
47
47
|
}
|
|
48
|
-
else if (key === Key.Home) {
|
|
48
|
+
else if (key === Key.Home.valueOf()) {
|
|
49
49
|
for (let i = 0; i < optionValues.length; i++) {
|
|
50
50
|
if (!optionValues[i].disabled) {
|
|
51
51
|
newIndex = i;
|
|
@@ -54,7 +54,7 @@ function processKeyboardNavigation(optionValues, itemIndex, key) {
|
|
|
54
54
|
}
|
|
55
55
|
keyProcessed = true;
|
|
56
56
|
}
|
|
57
|
-
else if (key === Key.End) {
|
|
57
|
+
else if (key === Key.End.valueOf()) {
|
|
58
58
|
for (let i = optionValues.length - 1; i >= 0; i--) {
|
|
59
59
|
if (!optionValues[i].disabled) {
|
|
60
60
|
newIndex = i;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Listbox.js","sourceRoot":"","sources":["../../../../src/core-react/listbox/Listbox.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\nimport * as React from \"react\";\nimport classnames from \"classnames\";\nimport { Key } from \"ts-key-enum\";\n\nimport \"./Listbox.scss\";\nimport { Guid } from \"@itwin/core-bentley\";\n\n/** Ideas borrowed from https://reacttraining.com/reach-ui/listbox */\n\n/**\n * `Listbox` value.\n * @alpha\n */\nexport type ListboxValue = string;\n\n/**\n * `Listbox` Props.\n * @alpha\n */\nexport interface ListboxProps\n extends React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLUListElement>,\n HTMLUListElement\n > {\n id?: string;\n selectedValue?: ListboxValue;\n ariaLabel?: any;\n ariaLabelledBy?: any;\n onListboxValueChange?: (\n newValue: ListboxValue,\n isControlOrCommandPressed?: boolean\n ) => void;\n}\n\n/**\n * `ListboxItem` Props.\n * @alpha\n */\nexport interface ListboxItemProps\n extends React.DetailedHTMLProps<\n React.LiHTMLAttributes<HTMLLIElement>,\n HTMLLIElement\n > {\n /** The unique item's value. */\n value: ListboxValue;\n /** set if item is disabled. */\n disabled?: boolean;\n}\n\n/**\n * `Listbox` Context.\n * @alpha\n */\nexport interface ListboxContextProps {\n listboxId?: string;\n listboxValue?: ListboxValue;\n focusValue?: ListboxValue;\n onListboxValueChange: (\n newValue: ListboxValue,\n isControlOrCommandPressed?: boolean\n ) => void;\n listboxRef?: React.RefObject<HTMLUListElement>;\n}\n\n/**\n * Context set up by listbox for use by `ListboxItems` .\n * @alpha\n */\n// istanbul ignore next\nexport const ListboxContext = React.createContext<ListboxContextProps>({\n onListboxValueChange: (_newValue: ListboxValue | undefined) => {},\n});\n\nfunction makeId(...args: Array<string | number | null | undefined>) {\n return args.filter((val) => val != null).join(\"--\");\n}\n\nfunction getOptionValueArray(childNodes: React.ReactNode): ListboxItemProps[] {\n return React.Children.toArray(childNodes)\n .filter((node) => React.isValidElement(node) && node.props.value)\n .map(\n (optionNode) =>\n (optionNode as React.ReactElement).props as ListboxItemProps\n );\n}\n\nfunction processKeyboardNavigation(\n optionValues: ListboxItemProps[],\n itemIndex: number,\n key: string\n): [number, boolean] {\n let keyProcessed = false;\n let newIndex = itemIndex >= 0 ? itemIndex : 0;\n\n // Note: In aria example Page Up/Down just moves up or down by one item. See https://www.w3.org/TR/wai-aria-practices-1.1/examples/listbox/js/listbox.js\n if (key === Key.ArrowDown || key === Key.PageDown) {\n for (let i = itemIndex + 1; i < optionValues.length; i++) {\n if (!optionValues[i].disabled) {\n newIndex = i;\n break;\n }\n }\n keyProcessed = true;\n } else if (key === Key.ArrowUp || key === Key.PageUp) {\n for (let i = itemIndex - 1; i >= 0; i--) {\n if (!optionValues[i].disabled) {\n newIndex = i;\n break;\n }\n }\n keyProcessed = true;\n } else if (key === Key.Home) {\n for (let i = 0; i < optionValues.length; i++) {\n if (!optionValues[i].disabled) {\n newIndex = i;\n break;\n }\n }\n keyProcessed = true;\n } else if (key === Key.End) {\n for (let i = optionValues.length - 1; i >= 0; i--) {\n if (!optionValues[i].disabled) {\n newIndex = i;\n break;\n }\n }\n keyProcessed = true;\n }\n return [newIndex, keyProcessed];\n}\n\n/**\n * Single select `Listbox` component\n * @alpha\n */\nexport function Listbox(props: ListboxProps) {\n const {\n ariaLabel,\n ariaLabelledBy,\n id,\n children,\n selectedValue,\n className,\n onListboxValueChange,\n onKeyDown,\n ...otherProps\n } = props;\n const listRef = React.useRef<HTMLUListElement>(null);\n const [listId] = React.useState(() => {\n return id ?? Guid.createValue();\n });\n const optionValues = React.useMemo(\n () => getOptionValueArray(children),\n [children]\n );\n const classes = React.useMemo(\n () => classnames(\"core-listbox\", className),\n [className]\n );\n const [currentValue, setCurrentValue] = React.useState<\n ListboxValue | undefined\n >(selectedValue);\n const [focusValue, setFocusValue] = React.useState<ListboxValue | undefined>(\n currentValue\n );\n\n React.useEffect(() => {\n setCurrentValue(selectedValue);\n setFocusValue(selectedValue);\n }, [selectedValue]);\n\n const scrollTopRef = React.useRef(0);\n const handleValueChange = React.useCallback(\n (newValue: ListboxValue, isControlOrCommandPressed?: boolean) => {\n // istanbul ignore else\n if (newValue !== currentValue) {\n setCurrentValue(newValue);\n setFocusValue(newValue);\n if (onListboxValueChange)\n onListboxValueChange(newValue, isControlOrCommandPressed);\n }\n },\n [setCurrentValue, currentValue, onListboxValueChange]\n );\n\n const focusOption = React.useCallback(\n (itemIndex: number) => {\n // istanbul ignore else\n if (itemIndex >= 0 && itemIndex < optionValues.length) {\n const newSelection = optionValues[itemIndex];\n const listElement = listRef.current as HTMLUListElement;\n const optionToFocus = listElement.querySelector<HTMLLIElement>(\n `li[data-value=\"${newSelection.value}\"]`\n );\n // istanbul ignore else\n if (optionToFocus && listElement) {\n let newScrollTop = listElement.scrollTop;\n\n // istanbul ignore next\n if (listElement.scrollHeight > listElement.clientHeight) {\n const scrollBottom =\n listElement.clientHeight + listElement.scrollTop;\n const elementBottom =\n optionToFocus.offsetTop + optionToFocus.offsetHeight;\n if (elementBottom > scrollBottom) {\n newScrollTop = elementBottom - listElement.clientHeight;\n } else if (optionToFocus.offsetTop < listElement.scrollTop) {\n newScrollTop = optionToFocus.offsetTop;\n }\n scrollTopRef.current = newScrollTop;\n }\n setFocusValue(newSelection.value);\n }\n }\n },\n [optionValues]\n );\n\n const handleKeyDown = React.useCallback(\n (event: React.KeyboardEvent<HTMLUListElement>) => {\n if (optionValues.length < 1) return;\n\n const itemIndex =\n undefined === focusValue\n ? -1\n : optionValues.findIndex(\n (optionValue) => optionValue.value === focusValue\n );\n\n if (event.key === \" \") {\n event.preventDefault();\n // istanbul ignore else\n if (focusValue)\n handleValueChange(\n focusValue,\n event.getModifierState(\"Control\") || event.getModifierState(\"Meta\")\n ); // Control or Command\n return;\n } else {\n const [newItemIndex, keyProcessed] = processKeyboardNavigation(\n optionValues,\n itemIndex,\n event.key\n );\n // istanbul ignore else\n if (keyProcessed) {\n event.preventDefault();\n focusOption(newItemIndex);\n return;\n }\n }\n\n // istanbul ignore else\n if (onKeyDown) onKeyDown(event);\n },\n [focusValue, optionValues, focusOption, onKeyDown, handleValueChange]\n );\n\n const isInitialMount = React.useRef(true);\n\n React.useEffect(() => {\n const list = listRef.current as HTMLUListElement;\n\n if (isInitialMount.current) {\n isInitialMount.current = false;\n\n if (undefined !== focusValue) {\n const itemIndex = optionValues.findIndex(\n (optionValue) => optionValue.value === focusValue\n );\n focusOption(itemIndex);\n }\n } else {\n list.scrollTop = scrollTopRef.current;\n }\n }, [focusValue, focusOption, optionValues]);\n\n // istanbul ignore next\n const handleOnScroll = React.useCallback(\n (_event: React.UIEvent<HTMLUListElement, UIEvent>) => {\n if (listRef.current) scrollTopRef.current = listRef.current.scrollTop;\n },\n []\n );\n\n // istanbul ignore next\n const handleOnFocus = React.useCallback(\n (_event: React.FocusEvent<HTMLUListElement>) => {\n if (!focusValue || 0 === focusValue.length) {\n if (currentValue) {\n setFocusValue(currentValue);\n } else {\n if (optionValues.length > 0) setFocusValue(optionValues[0].value);\n }\n }\n },\n [currentValue, focusValue, optionValues]\n );\n\n return (\n <ul\n className={classes}\n // If the listbox is not part of another widget, then it has a visible\n // label referenced by `aria-labelledby` on the element with role\n // `listbox`.\n // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\n // If an `aria-label` is passed, we should skip `aria-labelledby` to\n // avoid confusion.\n aria-labelledby={ariaLabel ? undefined : ariaLabelledBy}\n aria-label={ariaLabel}\n // An element that contains or owns all the listbox options has role\n // listbox.\n // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\n role=\"listbox\"\n // https://www.w3.org/TR/wai-aria-practices-1.2/examples/listbox/listbox-collapsible.html\n tabIndex={0}\n // https://www.w3.org/TR/wai-aria-practices-1.2/examples/listbox/listbox-scrollable.html\n aria-activedescendant={makeId(currentValue, listId)}\n {...otherProps}\n ref={listRef}\n id={listId}\n onKeyDown={handleKeyDown}\n onScroll={handleOnScroll}\n data-value={currentValue}\n data-focusvalue={focusValue}\n onFocus={handleOnFocus}\n >\n <ListboxContext.Provider\n value={{\n listboxValue: currentValue,\n focusValue,\n listboxId: listId,\n onListboxValueChange: handleValueChange,\n listboxRef: listRef,\n }}\n >\n {children}\n </ListboxContext.Provider>\n </ul>\n );\n}\n\n/**\n * `ListboxItem` component.\n * @alpha\n */\nexport function ListboxItem(props: ListboxItemProps) {\n const { children, value, className, disabled, ...otherProps } = props;\n\n const { listboxValue, focusValue, listboxId, onListboxValueChange } =\n React.useContext(ListboxContext);\n\n const hasFocus = focusValue === value;\n\n const classes = React.useMemo(\n () => classnames(\"core-listbox-item\", hasFocus && \"focused\", className),\n [className, hasFocus]\n );\n const itemRef = React.useRef<HTMLLIElement>(null);\n const isSelected = listboxValue === value;\n\n const handleClick = React.useCallback(\n (event: React.MouseEvent<HTMLLIElement, MouseEvent>) => {\n event.preventDefault();\n // istanbul ignore next\n const selectedValue = event.currentTarget?.dataset?.value;\n // istanbul ignore else\n if (undefined !== selectedValue) {\n onListboxValueChange(selectedValue, event.ctrlKey);\n }\n },\n [onListboxValueChange]\n );\n\n const getItemId = React.useCallback(() => {\n return makeId(value, listboxId);\n }, [listboxId, value]);\n\n return (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events\n <li\n // In a single-select listbox, the selected option has `aria-selected`\n // set to `true`.\n // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\n aria-selected={isSelected}\n // Applicable to all host language elements regardless of whether a\n // `role` is applied.\n // https://www.w3.org/WAI/PF/aria/states_and_properties#global_states_header\n aria-disabled={disabled || undefined}\n // Each option in the listbox has role `option` and is a DOM descendant\n // of the element with role `listbox`.\n // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\n role=\"option\"\n className={classes}\n {...otherProps}\n ref={itemRef}\n id={getItemId()}\n // used for css styling\n data-value={value}\n onClick={handleClick}\n >\n {children}\n </li>\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"Listbox.js","sourceRoot":"","sources":["../../../../src/core-react/listbox/Listbox.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\nimport * as React from \"react\";\nimport classnames from \"classnames\";\nimport { Key } from \"ts-key-enum\";\n\nimport \"./Listbox.scss\";\nimport { Guid } from \"@itwin/core-bentley\";\n\n/** Ideas borrowed from https://reacttraining.com/reach-ui/listbox */\n\n/**\n * `Listbox` value.\n * @alpha\n */\nexport type ListboxValue = string;\n\n/**\n * `Listbox` Props.\n * @alpha\n */\nexport interface ListboxProps\n extends React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLUListElement>,\n HTMLUListElement\n > {\n id?: string;\n selectedValue?: ListboxValue;\n ariaLabel?: any;\n ariaLabelledBy?: any;\n onListboxValueChange?: (\n newValue: ListboxValue,\n isControlOrCommandPressed?: boolean\n ) => void;\n}\n\n/**\n * `ListboxItem` Props.\n * @alpha\n */\nexport interface ListboxItemProps\n extends React.DetailedHTMLProps<\n React.LiHTMLAttributes<HTMLLIElement>,\n HTMLLIElement\n > {\n /** The unique item's value. */\n value: ListboxValue;\n /** set if item is disabled. */\n disabled?: boolean;\n}\n\n/**\n * `Listbox` Context.\n * @alpha\n */\nexport interface ListboxContextProps {\n listboxId?: string;\n listboxValue?: ListboxValue;\n focusValue?: ListboxValue;\n onListboxValueChange: (\n newValue: ListboxValue,\n isControlOrCommandPressed?: boolean\n ) => void;\n listboxRef?: React.RefObject<HTMLUListElement>;\n}\n\n/**\n * Context set up by listbox for use by `ListboxItems` .\n * @alpha\n */\n// istanbul ignore next\nexport const ListboxContext = React.createContext<ListboxContextProps>({\n onListboxValueChange: (_newValue: ListboxValue | undefined) => {},\n});\n\nfunction makeId(...args: Array<string | number | null | undefined>) {\n return args.filter((val) => val != null).join(\"--\");\n}\n\nfunction getOptionValueArray(childNodes: React.ReactNode): ListboxItemProps[] {\n return React.Children.toArray(childNodes)\n .filter((node) => React.isValidElement(node) && node.props.value)\n .map(\n (optionNode) =>\n (optionNode as React.ReactElement).props as ListboxItemProps\n );\n}\n\nfunction processKeyboardNavigation(\n optionValues: ListboxItemProps[],\n itemIndex: number,\n key: string\n): [number, boolean] {\n let keyProcessed = false;\n let newIndex = itemIndex >= 0 ? itemIndex : 0;\n\n // Note: In aria example Page Up/Down just moves up or down by one item. See https://www.w3.org/TR/wai-aria-practices-1.1/examples/listbox/js/listbox.js\n if (key === Key.ArrowDown.valueOf() || key === Key.PageDown.valueOf()) {\n for (let i = itemIndex + 1; i < optionValues.length; i++) {\n if (!optionValues[i].disabled) {\n newIndex = i;\n break;\n }\n }\n keyProcessed = true;\n } else if (key === Key.ArrowUp.valueOf() || key === Key.PageUp.valueOf()) {\n for (let i = itemIndex - 1; i >= 0; i--) {\n if (!optionValues[i].disabled) {\n newIndex = i;\n break;\n }\n }\n keyProcessed = true;\n } else if (key === Key.Home.valueOf()) {\n for (let i = 0; i < optionValues.length; i++) {\n if (!optionValues[i].disabled) {\n newIndex = i;\n break;\n }\n }\n keyProcessed = true;\n } else if (key === Key.End.valueOf()) {\n for (let i = optionValues.length - 1; i >= 0; i--) {\n if (!optionValues[i].disabled) {\n newIndex = i;\n break;\n }\n }\n keyProcessed = true;\n }\n return [newIndex, keyProcessed];\n}\n\n/**\n * Single select `Listbox` component\n * @alpha\n */\nexport function Listbox(props: ListboxProps) {\n const {\n ariaLabel,\n ariaLabelledBy,\n id,\n children,\n selectedValue,\n className,\n onListboxValueChange,\n onKeyDown,\n ...otherProps\n } = props;\n const listRef = React.useRef<HTMLUListElement>(null);\n const [listId] = React.useState(() => {\n return id ?? Guid.createValue();\n });\n const optionValues = React.useMemo(\n () => getOptionValueArray(children),\n [children]\n );\n const classes = React.useMemo(\n () => classnames(\"core-listbox\", className),\n [className]\n );\n const [currentValue, setCurrentValue] = React.useState<\n ListboxValue | undefined\n >(selectedValue);\n const [focusValue, setFocusValue] = React.useState<ListboxValue | undefined>(\n currentValue\n );\n\n React.useEffect(() => {\n setCurrentValue(selectedValue);\n setFocusValue(selectedValue);\n }, [selectedValue]);\n\n const scrollTopRef = React.useRef(0);\n const handleValueChange = React.useCallback(\n (newValue: ListboxValue, isControlOrCommandPressed?: boolean) => {\n // istanbul ignore else\n if (newValue !== currentValue) {\n setCurrentValue(newValue);\n setFocusValue(newValue);\n if (onListboxValueChange)\n onListboxValueChange(newValue, isControlOrCommandPressed);\n }\n },\n [setCurrentValue, currentValue, onListboxValueChange]\n );\n\n const focusOption = React.useCallback(\n (itemIndex: number) => {\n // istanbul ignore else\n if (itemIndex >= 0 && itemIndex < optionValues.length) {\n const newSelection = optionValues[itemIndex];\n const listElement = listRef.current as HTMLUListElement;\n const optionToFocus = listElement.querySelector<HTMLLIElement>(\n `li[data-value=\"${newSelection.value}\"]`\n );\n // istanbul ignore else\n if (optionToFocus && listElement) {\n let newScrollTop = listElement.scrollTop;\n\n // istanbul ignore next\n if (listElement.scrollHeight > listElement.clientHeight) {\n const scrollBottom =\n listElement.clientHeight + listElement.scrollTop;\n const elementBottom =\n optionToFocus.offsetTop + optionToFocus.offsetHeight;\n if (elementBottom > scrollBottom) {\n newScrollTop = elementBottom - listElement.clientHeight;\n } else if (optionToFocus.offsetTop < listElement.scrollTop) {\n newScrollTop = optionToFocus.offsetTop;\n }\n scrollTopRef.current = newScrollTop;\n }\n setFocusValue(newSelection.value);\n }\n }\n },\n [optionValues]\n );\n\n const handleKeyDown = React.useCallback(\n (event: React.KeyboardEvent<HTMLUListElement>) => {\n if (optionValues.length < 1) return;\n\n const itemIndex =\n undefined === focusValue\n ? -1\n : optionValues.findIndex(\n (optionValue) => optionValue.value === focusValue\n );\n\n if (event.key === \" \") {\n event.preventDefault();\n // istanbul ignore else\n if (focusValue)\n handleValueChange(\n focusValue,\n event.getModifierState(\"Control\") || event.getModifierState(\"Meta\")\n ); // Control or Command\n return;\n } else {\n const [newItemIndex, keyProcessed] = processKeyboardNavigation(\n optionValues,\n itemIndex,\n event.key\n );\n // istanbul ignore else\n if (keyProcessed) {\n event.preventDefault();\n focusOption(newItemIndex);\n return;\n }\n }\n\n // istanbul ignore else\n if (onKeyDown) onKeyDown(event);\n },\n [focusValue, optionValues, focusOption, onKeyDown, handleValueChange]\n );\n\n const isInitialMount = React.useRef(true);\n\n React.useEffect(() => {\n const list = listRef.current as HTMLUListElement;\n\n if (isInitialMount.current) {\n isInitialMount.current = false;\n\n if (undefined !== focusValue) {\n const itemIndex = optionValues.findIndex(\n (optionValue) => optionValue.value === focusValue\n );\n focusOption(itemIndex);\n }\n } else {\n list.scrollTop = scrollTopRef.current;\n }\n }, [focusValue, focusOption, optionValues]);\n\n // istanbul ignore next\n const handleOnScroll = React.useCallback(\n (_event: React.UIEvent<HTMLUListElement, UIEvent>) => {\n if (listRef.current) scrollTopRef.current = listRef.current.scrollTop;\n },\n []\n );\n\n // istanbul ignore next\n const handleOnFocus = React.useCallback(\n (_event: React.FocusEvent<HTMLUListElement>) => {\n if (!focusValue || 0 === focusValue.length) {\n if (currentValue) {\n setFocusValue(currentValue);\n } else {\n if (optionValues.length > 0) setFocusValue(optionValues[0].value);\n }\n }\n },\n [currentValue, focusValue, optionValues]\n );\n\n return (\n <ul\n className={classes}\n // If the listbox is not part of another widget, then it has a visible\n // label referenced by `aria-labelledby` on the element with role\n // `listbox`.\n // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\n // If an `aria-label` is passed, we should skip `aria-labelledby` to\n // avoid confusion.\n aria-labelledby={ariaLabel ? undefined : ariaLabelledBy}\n aria-label={ariaLabel}\n // An element that contains or owns all the listbox options has role\n // listbox.\n // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\n role=\"listbox\"\n // https://www.w3.org/TR/wai-aria-practices-1.2/examples/listbox/listbox-collapsible.html\n tabIndex={0}\n // https://www.w3.org/TR/wai-aria-practices-1.2/examples/listbox/listbox-scrollable.html\n aria-activedescendant={makeId(currentValue, listId)}\n {...otherProps}\n ref={listRef}\n id={listId}\n onKeyDown={handleKeyDown}\n onScroll={handleOnScroll}\n data-value={currentValue}\n data-focusvalue={focusValue}\n onFocus={handleOnFocus}\n >\n <ListboxContext.Provider\n value={{\n listboxValue: currentValue,\n focusValue,\n listboxId: listId,\n onListboxValueChange: handleValueChange,\n listboxRef: listRef,\n }}\n >\n {children}\n </ListboxContext.Provider>\n </ul>\n );\n}\n\n/**\n * `ListboxItem` component.\n * @alpha\n */\nexport function ListboxItem(props: ListboxItemProps) {\n const { children, value, className, disabled, ...otherProps } = props;\n\n const { listboxValue, focusValue, listboxId, onListboxValueChange } =\n React.useContext(ListboxContext);\n\n const hasFocus = focusValue === value;\n\n const classes = React.useMemo(\n () => classnames(\"core-listbox-item\", hasFocus && \"focused\", className),\n [className, hasFocus]\n );\n const itemRef = React.useRef<HTMLLIElement>(null);\n const isSelected = listboxValue === value;\n\n const handleClick = React.useCallback(\n (event: React.MouseEvent<HTMLLIElement, MouseEvent>) => {\n event.preventDefault();\n // istanbul ignore next\n const selectedValue = event.currentTarget?.dataset?.value;\n // istanbul ignore else\n if (undefined !== selectedValue) {\n onListboxValueChange(selectedValue, event.ctrlKey);\n }\n },\n [onListboxValueChange]\n );\n\n const getItemId = React.useCallback(() => {\n return makeId(value, listboxId);\n }, [listboxId, value]);\n\n return (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events\n <li\n // In a single-select listbox, the selected option has `aria-selected`\n // set to `true`.\n // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\n aria-selected={isSelected}\n // Applicable to all host language elements regardless of whether a\n // `role` is applied.\n // https://www.w3.org/WAI/PF/aria/states_and_properties#global_states_header\n aria-disabled={disabled || undefined}\n // Each option in the listbox has role `option` and is a DOM descendant\n // of the element with role `listbox`.\n // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\n role=\"option\"\n className={classes}\n {...otherProps}\n ref={itemRef}\n id={getItemId()}\n // used for css styling\n data-value={value}\n onClick={handleClick}\n >\n {children}\n </li>\n );\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Popup.d.ts","sourceRoot":"","sources":["../../../../src/core-react/popup/Popup.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"Popup.d.ts","sourceRoot":"","sources":["../../../../src/core-react/popup/Popup.tsx"],"names":[],"mappings":"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"}
|
|
@@ -75,9 +75,10 @@ class Popup extends React.Component {
|
|
|
75
75
|
this._handleKeyboard = (event) => {
|
|
76
76
|
if (this.props.isPinned)
|
|
77
77
|
return;
|
|
78
|
-
if (event.key === Key.Escape
|
|
78
|
+
if (event.key === Key.Escape.valueOf() ||
|
|
79
|
+
event.key === Key.Enter.valueOf()) {
|
|
79
80
|
const closeOnEnter = this.props.closeOnEnter !== undefined ? this.props.closeOnEnter : true;
|
|
80
|
-
if (event.key === Key.Enter) {
|
|
81
|
+
if (event.key === Key.Enter.valueOf()) {
|
|
81
82
|
if (closeOnEnter)
|
|
82
83
|
this._onClose(true);
|
|
83
84
|
else
|