Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 3 additions & 2 deletions lib/src/date-input/DateInput.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -46,8 +46,9 @@ const DxcDateInput = React.forwardRef<RefType, DateInputPropsType>(
const refDate = ref || useRef(null);

const handleCalendarOnKeyDown = (event) => {
switch (event.keyCode) {
case 27: // Esc
switch (event.key) {
case "Esc":
case "Escape":
event.preventDefault();
setIsOpen(false);
break;
Expand Down
18 changes: 11 additions & 7 deletions lib/src/radio-group/RadioGroup.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -96,19 +96,23 @@ const DxcRadioGroup = React.forwardRef<RefType, RadioGroupPropsType>(
});
};
const handleOnKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {
switch (event.keyCode) {
case 37: // arrow left
case 38: // arrow up
switch (event.key) {
case "Left":
case "ArrowLeft":
case "Up":
case "ArrowUp":
event.preventDefault();
setPreviousRadioChecked();
break;
case 39: // arrow right
case 40: // arrow down
case "Right":
case "ArrowRight":
case "Down":
case "ArrowDown":
event.preventDefault();
setNextRadioChecked();
break;
case 13: // enter
case 32: // space
case "Enter":
case "Space":
event.preventDefault();
handleOnChange(innerOptions[currentFocusIndex].value);
break;
Expand Down
8 changes: 5 additions & 3 deletions lib/src/tabs-nav/NavTabs.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -61,12 +61,14 @@ const DxcNavTabs = ({ iconPosition = "top", tabIndex = 0, children }: NavTabsPro
const activeTab = React.Children.toArray(children).findIndex((child: ReactElement) =>
getPropInChild(child, "active")
);
switch (event.keyCode) {
case 37: // arrow left
switch (event.key) {
case "Left":
case "ArrowLeft":
event.preventDefault();
setInnerFocus(getPreviousTabIndex(children, innerFocus === null ? activeTab : innerFocus));
break;
case 39: // arrow right
case "Right":
case "ArrowRight":
event.preventDefault();
setInnerFocus(getNextTabIndex(children, innerFocus === null ? activeTab : innerFocus));
break;
Expand Down
16 changes: 4 additions & 12 deletions lib/src/tabs-nav/Tab.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,15 +6,7 @@ import { TabProps } from "./types";

const DxcTab = forwardRef(
(
{
href,
active = false,
icon,
disabled = false,
notificationNumber = false,
children,
...otherProps
}: TabProps,
{ href, active = false, icon, disabled = false, notificationNumber = false, children, ...otherProps }: TabProps,
ref: Ref<HTMLAnchorElement>
): JSX.Element => {
const tabRef: React.MutableRefObject<HTMLAnchorElement> = createRef();
Expand All @@ -26,9 +18,9 @@ const DxcTab = forwardRef(
}, [focusedLabel]);

const handleOnKeyDown = (event: React.KeyboardEvent<HTMLAnchorElement>) => {
switch (event.keyCode) {
case 13: // enter
case 32: // space
switch (event.key) {
case "Enter":
case "Space":
tabRef?.current?.click();
event.preventDefault();
break;
Expand Down
23 changes: 10 additions & 13 deletions lib/src/text-input/TextInput.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -52,10 +52,6 @@ const makeCancelable = (promise) => {
};
};

const getNotOptionalErrorMessage = () => `This field is required. Please, enter a value.`;

const getPatternErrorMessage = () => `Please match the format requested.`;

const patternMatch = (pattern, value) => new RegExp(pattern).test(value);

const getLastOptionIndex = (filteredSuggestions) => {
Expand Down Expand Up @@ -200,13 +196,13 @@ const DxcTextInput = React.forwardRef<RefType, TextInputPropsType>(
else onBlur?.({ value: event.target.value });
};
const handleIOnKeyDown = (event) => {
switch (event.keyCode) {
case 40: // Arrow Down
switch (event.key) {
case "Down":
case "ArrowDown":
event.preventDefault();
if (numberInputContext?.typeNumber === "number") {
decrementNumber();
event.preventDefault();
} else {
event.preventDefault();
openSuggestions();
if (!isAutosuggestError && !isSearching && filteredSuggestions.length > 0) {
changeVisualFocusedSuggIndex((visualFocusedSuggIndex) => {
Expand All @@ -216,12 +212,12 @@ const DxcTextInput = React.forwardRef<RefType, TextInputPropsType>(
}
}
break;
case 38: // Arrow Up
case "Up":
case "ArrowUp":
event.preventDefault();
if (numberInputContext?.typeNumber === "number") {
incrementNumber();
event.preventDefault();
} else {
event.preventDefault();
openSuggestions();
if (!isAutosuggestError && !isSearching && filteredSuggestions.length > 0) {
changeVisualFocusedSuggIndex((visualFocusedSuggIndex) => {
Expand All @@ -232,14 +228,15 @@ const DxcTextInput = React.forwardRef<RefType, TextInputPropsType>(
}
}
break;
case 27: // Esc
case "Esc":
case "Escape":
event.preventDefault();
if (hasSuggestions()) {
changeValue("");
isOpen && closeSuggestions();
}
break;
case 13: // Enter
case "Enter":
if (hasSuggestions() && !isSearching) {
const validFocusedSuggestion =
filteredSuggestions.length > 0 &&
Expand Down