fork/Graphite
1
0
Fork 0
mirror of https://github.com/GraphiteEditor/Graphite.git synced 2026-09-22 06:38:12 +08:00
Code Issues Packages Projects Releases Wiki Activity

Remove usage of 'null' in favor of 'undefined'

Browse Source
This commit is contained in:
Keavon Chambers
2022-08-25 21:32:27 -07:00
parent 1e74ccb4f8
commit 33cb6fcb00
21 changed files with 45 additions and 323 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/floating-menus/DialogModal.vue
+2 -2
View File
@@ -84,8 +84,8 @@ export default defineComponent({
},
mounted() {
// Focus the first button in the popup
const element = this.$el as Element | null;
const emphasizedOrFirstButton = (element?.querySelector("[data-emphasized]") as HTMLButtonElement | null) || element?.querySelector("[data-text-button]");
const element = this.$el as Element | undefined;
const emphasizedOrFirstButton = (element?.querySelector("[data-emphasized]") || element?.querySelector("[data-text-button]") || undefined) as HTMLButtonElement | undefined;
emphasizedOrFirstButton?.focus();
},
components: {
frontend/src/components/layout/LayoutCol.vue
+1 -1
View File
@@ -1,5 +1,5 @@
<template>
<div class="layout-col" :class="{ 'scrollable-x': scrollableX, 'scrollable-y': scrollableY }" :data-scrollable-x="scrollableX || null" :data-scrollable-y="scrollableY || null">
<div class="layout-col" :class="{ 'scrollable-x': scrollableX, 'scrollable-y': scrollableY }" :data-scrollable-x="scrollableX || undefined" :data-scrollable-y="scrollableY || undefined">
<slot></slot>
</div>
</template>
frontend/src/components/layout/LayoutRow.vue
+1 -1
View File
@@ -1,5 +1,5 @@
<template>
<div class="layout-row" :class="{ 'scrollable-x': scrollableX, 'scrollable-y': scrollableY }" :data-scrollable-x="scrollableX || null" :data-scrollable-y="scrollableY || null">
<div class="layout-row" :class="{ 'scrollable-x': scrollableX, 'scrollable-y': scrollableY }" :data-scrollable-x="scrollableX || undefined" :data-scrollable-y="scrollableY || undefined">
<slot></slot>
</div>
</template>
frontend/src/components/panels/LayerTree.vue
+3 -3
View File
@@ -59,8 +59,8 @@
:disabled="!listing.editingName"
@blur="() => onEditLayerNameDeselect(listing)"
@keydown.esc="onEditLayerNameDeselect(listing)"
@keydown.enter="(e) => onEditLayerNameChange(listing, e.target)"
@change="(e) => onEditLayerNameChange(listing, e.target)"
@keydown.enter="(e) => onEditLayerNameChange(listing, e.target || undefined)"
@change="(e) => onEditLayerNameChange(listing, e.target || undefined)"
/>
</LayoutRow>
<div class="thumbnail" v-html="listing.entry.thumbnail"></div>
@@ -328,7 +328,7 @@ export default defineComponent({
await nextTick();
(tree.querySelector("[data-text-input]:not([disabled])") as HTMLInputElement).select();
},
onEditLayerNameChange(listing: LayerListingInfo, inputElement: EventTarget | null) {
onEditLayerNameChange(listing: LayerListingInfo, inputElement: EventTarget | undefined) {
// Eliminate duplicate events
if (!listing.editingName) return;
frontend/src/components/widgets/WidgetRow.vue
+2 -2
View File
@@ -13,7 +13,7 @@
@update:selectedIndex="(value: number) => updateLayout(component.widgetId, value)"
/>
<FontInput v-if="component.props.kind === 'FontInput'" v-bind="component.props" v-model:open="open" @changeFont="(value: unknown) => updateLayout(component.widgetId, value)" />
<IconButton v-if="component.props.kind === 'IconButton'" v-bind="component.props" :action="() => updateLayout(component.widgetId, null)" />
<IconButton v-if="component.props.kind === 'IconButton'" v-bind="component.props" :action="() => updateLayout(component.widgetId, undefined)" />
<IconLabel v-if="component.props.kind === 'IconLabel'" v-bind="component.props" />
<NumberInput
v-if="component.props.kind === 'NumberInput'"
@@ -31,7 +31,7 @@
<Separator v-if="component.props.kind === 'Separator'" v-bind="component.props" />
<SwatchPairInput v-if="component.props.kind === 'SwatchPairInput'" v-bind="component.props" />
<TextAreaInput v-if="component.props.kind === 'TextAreaInput'" v-bind="component.props" @commitText="(value: string) => updateLayout(component.widgetId, value)" />
<TextButton v-if="component.props.kind === 'TextButton'" v-bind="component.props" :action="() => updateLayout(component.widgetId, null)" />
<TextButton v-if="component.props.kind === 'TextButton'" v-bind="component.props" :action="() => updateLayout(component.widgetId, undefined)" />
<TextInput v-if="component.props.kind === 'TextInput'" v-bind="component.props" @commitText="(value: string) => updateLayout(component.widgetId, value)" />
<TextLabel v-if="component.props.kind === 'TextLabel'" v-bind="withoutValue(component.props)">{{ (component.props as any).value }}</TextLabel>
</template>
frontend/src/components/widgets/buttons/TextButton.vue
+2 -2
View File
@@ -2,8 +2,8 @@
<button
class="text-button"
:class="{ emphasized, disabled }"
:data-emphasized="emphasized || null"
:data-disabled="disabled || null"
:data-emphasized="emphasized || undefined"
:data-disabled="disabled || undefined"
data-text-button
:style="minWidth > 0 ? `min-width: ${minWidth}px` : ''"
@click="(e: MouseEvent) => action(e)"
frontend/src/components/widgets/inputs/MenuBarInput.vue
+4 -4
View File
@@ -2,8 +2,8 @@
<div class="menu-bar-input" data-menu-bar-input>
<div class="entry-container" v-for="(entry, index) in entries" :key="index">
<div
@click="(e: MouseEvent) => onClick(entry, e.target)"
@blur="(e: FocusEvent) => blur(entry, e.target)"
@click="(e: MouseEvent) => onClick(entry, e.target || undefined)"
@blur="(e: FocusEvent) => blur(entry, e.target || undefined)"
@keydown="(e: KeyboardEvent) => entry.ref?.keydown(e, false)"
class="entry"
:class="{ open: entry.ref?.isOpen }"
@@ -118,7 +118,7 @@ export default defineComponent({
});
},
methods: {
onClick(menuListEntry: MenuListEntry, target: EventTarget | null) {
onClick(menuListEntry: MenuListEntry, target: EventTarget | undefined) {
// If there's no menu to open, trigger the action but don't try to open its non-existant children
if (!menuListEntry.children || menuListEntry.children.length === 0) {
if (menuListEntry.action && !menuListEntry.disabled) menuListEntry.action();
@@ -132,7 +132,7 @@ export default defineComponent({
if (menuListEntry.ref) menuListEntry.ref.isOpen = true;
else throw new Error("The menu bar floating menu has no associated ref");
},
blur(menuListEntry: MenuListEntry, target: EventTarget | null) {
blur(menuListEntry: MenuListEntry, target: EventTarget | undefined) {
if ((target as HTMLElement)?.closest("[data-menu-bar-input]") !== this.$el && menuListEntry.ref) menuListEntry.ref.isOpen = false;
},
},
frontend/src/components/widgets/labels/UserInputLabel.vue
+2 -2
View File
@@ -164,7 +164,7 @@ export default defineComponent({
inject: ["fullscreen"],
props: {
keysWithLabelsGroups: { type: Array as PropType<KeysGroup[]>, default: () => [] },
mouseMotion: { type: String as PropType<MouseMotion | null>, default: null },
mouseMotion: { type: String as PropType<MouseMotion | undefined>, required: false },
requiresLock: { type: Boolean as PropType<boolean>, default: false },
},
computed: {
@@ -210,7 +210,7 @@ export default defineComponent({
// ...or display text
return { label, width: `width-${label.length}` };
},
mouseHintIcon(input: MouseMotion | null): IconName {
mouseHintIcon(input?: MouseMotion): IconName {
return `MouseHint${input}` as IconName;
},
keyboardHintIcon(input: KeyRaw): IconName | undefined {
frontend/src/io-managers/input.ts
+5 -5
View File
@@ -73,7 +73,7 @@ export function createInputManager(editor: Editor, container: HTMLElement, dialo
const accelKey = platformIsMac() ? e.metaKey : e.ctrlKey;
// Don't redirect user input from text entry into HTML elements
if (targetIsTextField(e.target) && key !== "Escape" && !(key === "Enter" && accelKey)) return false;
if (targetIsTextField(e.target || undefined) && key !== "Escape" && !(key === "Enter" && accelKey)) return false;
// Don't redirect paste
if (key === "KeyV" && accelKey) return false;
@@ -94,7 +94,7 @@ export function createInputManager(editor: Editor, container: HTMLElement, dialo
if (["KeyC", "KeyI", "KeyJ"].includes(key) && accelKey && e.shiftKey) return false;
// Don't redirect tab or enter if not in canvas (to allow navigating elements)
if (!canvasFocused && !targetIsTextField(e.target) && ["Tab", "Enter", "Space", "ArrowDown", "ArrowLeft", "ArrowRight", "ArrowUp"].includes(key)) return false;
if (!canvasFocused && !targetIsTextField(e.target || undefined) && ["Tab", "Enter", "Space", "ArrowDown", "ArrowLeft", "ArrowRight", "ArrowUp"].includes(key)) return false;
// Redirect to the backend
return true;
@@ -139,7 +139,7 @@ export function createInputManager(editor: Editor, container: HTMLElement, dialo
if (!viewportPointerInteractionOngoing && inFloatingMenu) return;
const { target } = e;
const newInCanvas = (target instanceof Element && target.closest("[data-canvas]")) instanceof Element && !targetIsTextField(window.document.activeElement);
const newInCanvas = (target instanceof Element && target.closest("[data-canvas]")) instanceof Element && !targetIsTextField(window.document.activeElement || undefined);
if (newInCanvas && !canvasFocused) {
canvasFocused = true;
app?.focus();
@@ -255,7 +255,7 @@ export function createInputManager(editor: Editor, container: HTMLElement, dialo
function onPaste(e: ClipboardEvent): void {
const dataTransfer = e.clipboardData;
if (!dataTransfer || targetIsTextField(e.target)) return;
if (!dataTransfer || targetIsTextField(e.target || undefined)) return;
e.preventDefault();
Array.from(dataTransfer.items).forEach((item) => {
@@ -358,6 +358,6 @@ export function createInputManager(editor: Editor, container: HTMLElement, dialo
return unbindListeners;
}
function targetIsTextField(target: EventTarget | HTMLElement | null): boolean {
function targetIsTextField(target: EventTarget | HTMLElement | undefined): boolean {
return target instanceof HTMLElement && (target.nodeName === "INPUT" || target.nodeName === "TEXTAREA" || target.isContentEditable);
}
frontend/src/io-managers/panic.ts
+1 -1
View File
@@ -28,7 +28,7 @@ function preparePanicDialog(header: string, details: string, panicDetails: strin
{ rowWidgets: [new Widget({ kind: "TextLabel", value: header, bold: true, italic: false, tableAlign: false, multiline: false }, 0n)] },
{ rowWidgets: [new Widget({ kind: "TextLabel", value: details, bold: false, italic: false, tableAlign: false, multiline: true }, 1n)] },
],
layoutTarget: null,
layoutTarget: undefined,
};
const reloadButton: TextButtonWidget = {
frontend/src/utility-functions/icons.ts
+2 -2
View File
@@ -4,7 +4,7 @@
import GraphiteLogotypeSolid from "@/../assets/graphics/graphite-logotype-solid.svg";
const GRAPHICS = {
GraphiteLogotypeSolid: { component: GraphiteLogotypeSolid, size: null },
GraphiteLogotypeSolid: { component: GraphiteLogotypeSolid, size: undefined },
} as const;
// 12px Solid
@@ -255,7 +255,7 @@ export const ICONS: IconDefinitionType<typeof ICON_LIST> = ICON_LIST;
export const ICON_COMPONENTS = Object.fromEntries(Object.entries(ICONS).map(([name, data]) => [name, data.component]));
export type IconName = keyof typeof ICONS;
export type IconSize = null | 12 | 16 | 24 | 32;
export type IconSize = undefined | 12 | 16 | 24 | 32;
export type IconStyle = "Normal" | "Node";
// The following helper type declarations allow us to avoid manually maintaining the `IconName` type declaration as a string union paralleling the keys of the
frontend/src/utility-functions/platform.ts
+6 -6
View File
@@ -8,17 +8,17 @@ export function browserVersion(): string {
}
if (match[1] === "Chrome") {
let browser = agent.match(/\bEdg\/(\d+)/);
if (browser !== null) return `Edge (Chromium) ${browser[1]}`;
let browser = agent.match(/\bEdg\/(\d+)/) || undefined;
if (browser !== undefined) return `Edge (Chromium) ${browser[1]}`;
browser = agent.match(/\bOPR\/(\d+)/);
if (browser !== null) return `Opera ${browser[1]}`;
browser = agent.match(/\bOPR\/(\d+)/) || undefined;
if (browser !== undefined) return `Opera ${browser[1]}`;
}
match = match[2] ? [match[1], match[2]] : [navigator.appName, navigator.appVersion, "-?"];
const browser = agent.match(/version\/(\d+)/i);
if (browser !== null) match.splice(1, 1, browser[1]);
const browser = agent.match(/version\/(\d+)/i) || undefined;
if (browser !== undefined) match.splice(1, 1, browser[1]);
return `${match[0]} ${match[1]}`;
}
frontend/src/wasm-communication/editor.ts
+2 -2
View File
@@ -8,12 +8,12 @@ export type WasmEditorInstance = InstanceType<WasmRawInstance["JsEditorHandle"]>
export type Editor = Readonly<ReturnType<typeof createEditor>>;
// `wasmImport` starts uninitialized because its initialization needs to occur asynchronously, and thus needs to occur by manually calling and awaiting `initWasm()`
let wasmImport: WasmRawInstance | null = null;
let wasmImport: WasmRawInstance | undefined;
// Should be called asynchronously before `createEditor()`
export async function initWasm(): Promise<void> {
// Skip if the WASM module is already initialized
if (wasmImport !== null) return;
if (wasmImport !== undefined) return;
// Import the WASM module JS bindings and wrap them in the panic proxy
wasmImport = await import("@/../wasm/pkg").then(panicProxy);
frontend/src/wasm-communication/messages.ts
+3 -3
View File
@@ -82,9 +82,9 @@ export type HintGroup = HintInfo[];
export class HintInfo {
readonly keyGroups!: KeysGroup[];
readonly keyGroupsMac!: KeysGroup[] | null;
readonly keyGroupsMac!: KeysGroup[] | undefined;
readonly mouse!: MouseMotion | null;
readonly mouse!: MouseMotion | undefined;
readonly label!: string;
@@ -669,7 +669,7 @@ export type WidgetLayout = {
export function defaultWidgetLayout(): WidgetLayout {
return {
layoutTarget: null,
layoutTarget: undefined,
layout: [],
};
}