refactor: components/global内の型エラーが出ている箇所を修正

This commit is contained in:
yukineko 2024-01-04 00:01:49 +09:00
parent 02b9c7aecc
commit 1a464eb0af
6 changed files with 32 additions and 23 deletions

View File

@ -73,7 +73,7 @@ const props = withDefaults(defineProps<{
leaveFromClass?: string;
} | null;
src?: string | null;
hash?: string;
hash?: string | null;
alt?: string | null;
title?: string | null;
height?: number;

View File

@ -81,9 +81,11 @@ const bound = computed(() => props.link
? { to: userPage(props.user), target: props.target }
: {});
const url = computed(() => (defaultStore.state.disableShowingAnimatedImages || defaultStore.state.dataSaver.avatar)
? getStaticImageUrl(props.user.avatarUrl)
: props.user.avatarUrl);
const url = computed(() => {
if (!props.user.avatarUrl) return null;
if (defaultStore.state.disableShowingAnimatedImages || defaultStore.state.dataSaver.avatar) return getStaticImageUrl(props.user.avatarUrl);
return props.user.avatarUrl;
});
function onClick(ev: MouseEvent): void {
if (props.link) return;
@ -109,6 +111,7 @@ function getDecorationOffset(decoration: Omit<Misskey.entities.UserDetailed['ava
const color = ref<string | undefined>();
watch(() => props.user.avatarBlurhash, () => {
if (!props.user.avatarBlurhash) return;
color.value = extractAvgColorFromBlurhash(props.user.avatarBlurhash);
}, {
immediate: true,

View File

@ -55,7 +55,7 @@ const rawUrl = computed(() => {
});
const url = computed(() => {
if (rawUrl.value == null) return null;
if (rawUrl.value == null) return undefined;
const proxied =
(rawUrl.value.startsWith('/emoji/') || (props.useOriginalSize && isLocal.value))

View File

@ -19,6 +19,7 @@ import MkA from '@/components/global/MkA.vue';
import { host } from '@/config.js';
import { defaultStore } from '@/store.js';
import { nyaize as doNyaize } from '@/scripts/nyaize.js';
import { safeParseFloat } from '@/scripts/safe-parse.js';
const QUOTE_STYLE = `
display: block;
@ -35,7 +36,7 @@ type MfmProps = {
nowrap?: boolean;
author?: Misskey.entities.UserLite;
isNote?: boolean;
emojiUrls?: string[];
emojiUrls?: Record<string, string>;
rootScale?: number;
nyaize?: boolean | 'respect';
parsedNodes?: mfm.MfmNode[] | null;
@ -57,8 +58,9 @@ export default function(props: MfmProps, context: SetupContext<MfmEvents>) {
const rootAst = props.parsedNodes ?? (props.plain ? mfm.parseSimple : mfm.parse)(props.text);
const validTime = (t: string | null | undefined) => {
const validTime = (t: string | boolean | null | undefined) => {
if (t == null) return null;
if (typeof t === 'boolean') return null;
return t.match(/^[0-9.]+s$/) ? t : null;
};
@ -217,14 +219,14 @@ export default function(props: MfmProps, context: SetupContext<MfmEvents>) {
return h(MkSparkle, {}, genEl(token.children, scale));
}
case 'rotate': {
const degrees = parseFloat(token.props.args.deg ?? '90');
const degrees = safeParseFloat(token.props.args.deg) ?? 90;
style = `transform: rotate(${degrees}deg); transform-origin: center center;`;
break;
}
case 'position': {
if (!defaultStore.state.advancedMfm) break;
const x = parseFloat(token.props.args.x ?? '0');
const y = parseFloat(token.props.args.y ?? '0');
const x = safeParseFloat(token.props.args.x) ?? 0;
const y = safeParseFloat(token.props.args.y) ?? 0;
style = `transform: translateX(${x}em) translateY(${y}em);`;
break;
}
@ -233,21 +235,21 @@ export default function(props: MfmProps, context: SetupContext<MfmEvents>) {
style = '';
break;
}
const x = Math.min(parseFloat(token.props.args.x ?? '1'), 5);
const y = Math.min(parseFloat(token.props.args.y ?? '1'), 5);
const x = Math.min(safeParseFloat(token.props.args.x) ?? 1, 5);
const y = Math.min(safeParseFloat(token.props.args.y) ?? 1, 5);
style = `transform: scale(${x}, ${y});`;
scale = scale * Math.max(x, y);
break;
}
case 'fg': {
let color = token.props.args.color;
if (!/^[0-9a-f]{3,6}$/i.test(color)) color = 'f00';
if (typeof color !== 'string' || !/^[0-9a-f]{3,6}$/i.test(color)) color = 'f00';
style = `color: #${color}; overflow-wrap: anywhere;`;
break;
}
case 'bg': {
let color = token.props.args.color;
if (!/^[0-9a-f]{3,6}$/i.test(color)) color = 'f00';
if (typeof color !== 'string' || !/^[0-9a-f]{3,6}$/i.test(color)) color = 'f00';
style = `background-color: #${color}; overflow-wrap: anywhere;`;
break;
}
@ -289,7 +291,8 @@ export default function(props: MfmProps, context: SetupContext<MfmEvents>) {
return h('span', { onClick(ev: MouseEvent): void {
ev.stopPropagation();
ev.preventDefault();
context.emit('clickEv', token.props.args.ev ?? '');
const clickEv = typeof token.props.args.ev === 'string' ? token.props.args.ev : '';
context.emit('clickEv', clickEv);
} }, genEl(token.children, scale));
}
}
@ -350,7 +353,7 @@ export default function(props: MfmProps, context: SetupContext<MfmEvents>) {
return [h(MkCode, {
key: Math.random(),
code: token.props.code,
lang: token.props.lang,
lang: token.props.lang ?? undefined,
})];
}
@ -394,8 +397,7 @@ export default function(props: MfmProps, context: SetupContext<MfmEvents>) {
return [h(MkCustomEmoji, {
key: Math.random(),
name: token.props.name,
// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
url: props.emojiUrls ? props.emojiUrls[token.props.name] : null,
url: props.emojiUrls && props.emojiUrls[token.props.name],
normal: props.plain,
host: props.author.host,
useOriginalSize: scale >= 2.5,

View File

@ -38,6 +38,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<script lang="ts">
export type Tab = {
key: string;
title: string;
onClick?: (ev: MouseEvent) => void;
} & (
| {
@ -120,8 +121,9 @@ function onTabWheel(ev: WheelEvent) {
let entering = false;
async function enter(el: HTMLElement) {
async function enter(element: Element) {
entering = true;
const el = element as HTMLElement;
const elementWidth = el.getBoundingClientRect().width;
el.style.width = '0';
el.style.paddingLeft = '0';
@ -135,11 +137,12 @@ async function enter(el: HTMLElement) {
setTimeout(renderTab, 170);
}
function afterEnter(el: HTMLElement) {
function afterEnter(element: Element) {
//el.style.width = '';
}
async function leave(el: HTMLElement) {
async function leave(element: Element) {
const el = element as HTMLElement;
const elementWidth = el.getBoundingClientRect().width;
el.style.width = elementWidth + 'px';
el.style.paddingLeft = '';
@ -148,7 +151,8 @@ async function leave(el: HTMLElement) {
el.style.paddingLeft = '0';
}
function afterLeave(el: HTMLElement) {
function afterLeave(element: Element) {
const el = element as HTMLElement;
el.style.width = '';
}

View File

@ -24,7 +24,7 @@ const props = withDefaults(defineProps<{
mode?: 'relative' | 'absolute' | 'detail';
colored?: boolean;
}>(), {
origin: isChromatic() ? new Date('2023-04-01T00:00:00Z') : null,
origin: isChromatic() ? () => new Date('2023-04-01T00:00:00Z') : null,
mode: 'relative',
});