Refactor: e -> event or error, err -> error, p -> pointer (#831)

* Refactor: e -> event or error, err -> error, p -> pointer

* simplify
This commit is contained in:
Lipis 2020-02-28 23:03:53 +01:00 committed by GitHub
parent d2827aa40b
commit 097c5dfad7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 190 additions and 185 deletions

View file

@ -45,25 +45,25 @@ const Picker = function({
}
}, []);
const handleKeyDown = (e: React.KeyboardEvent) => {
if (e.key === KEYS.TAB) {
const handleKeyDown = (event: React.KeyboardEvent) => {
if (event.key === KEYS.TAB) {
const { activeElement } = document;
if (e.shiftKey) {
if (event.shiftKey) {
if (activeElement === firstItem.current) {
colorInput.current?.focus();
e.preventDefault();
event.preventDefault();
}
} else {
if (activeElement === colorInput.current) {
firstItem.current?.focus();
e.preventDefault();
event.preventDefault();
}
}
} else if (
e.key === KEYS.ARROW_RIGHT ||
e.key === KEYS.ARROW_LEFT ||
e.key === KEYS.ARROW_UP ||
e.key === KEYS.ARROW_DOWN
event.key === KEYS.ARROW_RIGHT ||
event.key === KEYS.ARROW_LEFT ||
event.key === KEYS.ARROW_UP ||
event.key === KEYS.ARROW_DOWN
) {
const { activeElement } = document;
const index = Array.prototype.indexOf.call(
@ -73,30 +73,30 @@ const Picker = function({
if (index !== -1) {
const length = gallery!.current!.children.length;
const nextIndex =
e.key === KEYS.ARROW_RIGHT
event.key === KEYS.ARROW_RIGHT
? (index + 1) % length
: e.key === KEYS.ARROW_LEFT
: event.key === KEYS.ARROW_LEFT
? (length + index - 1) % length
: e.key === KEYS.ARROW_DOWN
: event.key === KEYS.ARROW_DOWN
? (index + 5) % length
: e.key === KEYS.ARROW_UP
: event.key === KEYS.ARROW_UP
? (length + index - 5) % length
: index;
(gallery!.current!.children![nextIndex] as any).focus();
}
e.preventDefault();
event.preventDefault();
} else if (
keyBindings.includes(e.key.toLowerCase()) &&
!isWritableElement(e.target)
keyBindings.includes(event.key.toLowerCase()) &&
!isWritableElement(event.target)
) {
const index = keyBindings.indexOf(e.key.toLowerCase());
const index = keyBindings.indexOf(event.key.toLowerCase());
(gallery!.current!.children![index] as any).focus();
e.preventDefault();
} else if (e.key === KEYS.ESCAPE || e.key === KEYS.ENTER) {
e.preventDefault();
event.preventDefault();
} else if (event.key === KEYS.ESCAPE || event.key === KEYS.ENTER) {
event.preventDefault();
onClose();
}
e.nativeEvent.stopImmediatePropagation();
event.nativeEvent.stopImmediatePropagation();
};
return (
@ -193,15 +193,15 @@ const ColorInput = React.forwardRef(
spellCheck={false}
className="color-picker-input"
aria-label={label}
onChange={e => {
const value = e.target.value.toLowerCase();
onChange={event => {
const value = event.target.value.toLowerCase();
if (value.match(colorRegex)) {
onChange(value === "transparent" ? "transparent" : `#${value}`);
}
setInnerValue(value);
}}
value={(innerValue || "").replace(/^#/, "")}
onPaste={e => onChange(e.clipboardData.getData("text"))}
onPaste={event => onChange(event.clipboardData.getData("text"))}
onBlur={() => setInnerValue(color)}
ref={inputRef}
/>

View file

@ -24,7 +24,10 @@ function ContextMenu({ options, onCloseRequest, top, left }: Props) {
left={left}
fitInViewport={true}
>
<ul className="context-menu" onContextMenu={e => e.preventDefault()}>
<ul
className="context-menu"
onContextMenu={event => event.preventDefault()}
>
{options.map((option, idx) => (
<li key={idx} onClick={onCloseRequest}>
<ContextMenuOption {...option} />

View file

@ -89,22 +89,22 @@ function ExportModal({
pngButton.current?.focus();
}, []);
function handleKeyDown(e: React.KeyboardEvent) {
if (e.key === KEYS.TAB) {
function handleKeyDown(event: React.KeyboardEvent) {
if (event.key === KEYS.TAB) {
const { activeElement } = document;
if (e.shiftKey) {
if (event.shiftKey) {
if (activeElement === pngButton.current) {
closeButton.current?.focus();
e.preventDefault();
event.preventDefault();
}
} else {
if (activeElement === closeButton.current) {
pngButton.current?.focus();
e.preventDefault();
event.preventDefault();
}
if (activeElement === onlySelectedInput.current) {
closeButton.current?.focus();
e.preventDefault();
event.preventDefault();
}
}
}
@ -186,7 +186,9 @@ function ExportModal({
<input
type="checkbox"
checked={exportSelected}
onChange={e => setExportSelected(e.currentTarget.checked)}
onChange={event =>
setExportSelected(event.currentTarget.checked)
}
ref={onlySelectedInput}
/>{" "}
{t("labels.onlySelected")}

View file

@ -12,9 +12,9 @@ export function Modal(props: {
}) {
const modalRoot = useBodyRoot();
const handleKeydown = (e: React.KeyboardEvent) => {
if (e.key === KEYS.ESCAPE) {
e.nativeEvent.stopImmediatePropagation();
const handleKeydown = (event: React.KeyboardEvent) => {
if (event.key === KEYS.ESCAPE) {
event.nativeEvent.stopImmediatePropagation();
props.onCloseRequest();
}
};

View file

@ -40,8 +40,8 @@ export function Popover({
<div
className="cover"
onClick={onCloseRequest}
onContextMenu={e => {
e.preventDefault();
onContextMenu={event => {
event.preventDefault();
if (onCloseRequest) {
onCloseRequest();
}

View file

@ -10,25 +10,25 @@ type Props = {
};
export class ProjectName extends Component<Props> {
private handleFocus = (e: React.FocusEvent<HTMLElement>) => {
selectNode(e.currentTarget);
private handleFocus = (event: React.FocusEvent<HTMLElement>) => {
selectNode(event.currentTarget);
};
private handleBlur = (e: React.FocusEvent<HTMLElement>) => {
const value = e.currentTarget.innerText.trim();
private handleBlur = (event: React.FocusEvent<HTMLElement>) => {
const value = event.currentTarget.innerText.trim();
if (value !== this.props.value) {
this.props.onChange(value);
}
removeSelection();
};
private handleKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {
if (e.key === "Enter") {
e.preventDefault();
if (e.nativeEvent.isComposing || e.keyCode === 229) {
private handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {
if (event.key === "Enter") {
event.preventDefault();
if (event.nativeEvent.isComposing || event.keyCode === 229) {
return;
}
e.currentTarget.blur();
event.currentTarget.blur();
}
};
private makeEditable = (editable: HTMLSpanElement | null) => {