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

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
@@ -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>
@@ -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)"
@@ -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;
},
},
@@ -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 {