diff options
| author | syuilo <4439005+syuilo@users.noreply.github.com> | 2025-08-25 13:46:22 +0900 |
|---|---|---|
| committer | syuilo <4439005+syuilo@users.noreply.github.com> | 2025-08-25 13:46:22 +0900 |
| commit | 7924daf7f8913e196e10dcd467b66ad68146b185 (patch) | |
| tree | 6a4330bd78bbc2afaa29046dc26fafd3884b6397 /packages/frontend/src | |
| parent | refactor (diff) | |
| download | misskey-7924daf7f8913e196e10dcd467b66ad68146b185.tar.gz misskey-7924daf7f8913e196e10dcd467b66ad68146b185.tar.bz2 misskey-7924daf7f8913e196e10dcd467b66ad68146b185.zip | |
refactor
Diffstat (limited to 'packages/frontend/src')
17 files changed, 31 insertions, 31 deletions
diff --git a/packages/frontend/src/components/MkLink.vue b/packages/frontend/src/components/MkLink.vue index a8545f9445..1959f97565 100644 --- a/packages/frontend/src/components/MkLink.vue +++ b/packages/frontend/src/components/MkLink.vue @@ -42,7 +42,7 @@ if (isEnabledUrlPreview.value) { const { dispose } = os.popup(defineAsyncComponent(() => import('@/components/MkUrlPreviewPopup.vue')), { showing, url: props.url, - anchorEl: el.value instanceof HTMLElement ? el.value : el.value?.$el, + anchorElement: el.value instanceof HTMLElement ? el.value : el.value?.$el, }, { closed: () => dispose(), }); diff --git a/packages/frontend/src/components/MkMenu.child.vue b/packages/frontend/src/components/MkMenu.child.vue index f7cd72b6c6..37c3a3f5e3 100644 --- a/packages/frontend/src/components/MkMenu.child.vue +++ b/packages/frontend/src/components/MkMenu.child.vue @@ -16,7 +16,7 @@ import type { MenuItem } from '@/types/menu.js'; const props = defineProps<{ items: MenuItem[]; - targetElement: HTMLElement; + anchorElement: HTMLElement; rootElement: HTMLElement; width?: number; }>(); @@ -36,10 +36,10 @@ const SCROLLBAR_THICKNESS = 16; function setPosition() { if (el.value == null) return; const rootRect = props.rootElement.getBoundingClientRect(); - const parentRect = props.targetElement.getBoundingClientRect(); + const parentRect = props.anchorElement.getBoundingClientRect(); const myRect = el.value.getBoundingClientRect(); - let left = props.targetElement.offsetWidth; + let left = props.anchorElement.offsetWidth; let top = (parentRect.top - rootRect.top) - 8; if (rootRect.left + left + myRect.width >= (window.innerWidth - SCROLLBAR_THICKNESS)) { left = -myRect.width; @@ -59,7 +59,7 @@ function onChildClosed(actioned?: boolean) { } } -watch(() => props.targetElement, () => { +watch(() => props.anchorElement, () => { setPosition(); }); diff --git a/packages/frontend/src/components/MkMenu.vue b/packages/frontend/src/components/MkMenu.vue index fbae4f0d8a..6c8fac934c 100644 --- a/packages/frontend/src/components/MkMenu.vue +++ b/packages/frontend/src/components/MkMenu.vue @@ -208,7 +208,7 @@ SPDX-License-Identifier: AGPL-3.0-only </span> </div> <div v-if="childMenu"> - <XChild ref="child" :items="childMenu" :targetElement="childTarget!" :rootElement="itemsEl!" @actioned="childActioned" @closed="closeChild"/> + <XChild ref="child" :items="childMenu" :anchorElement="childTarget!" :rootElement="itemsEl!" @actioned="childActioned" @closed="closeChild"/> </div> </div> </template> diff --git a/packages/frontend/src/components/MkNote.vue b/packages/frontend/src/components/MkNote.vue index d0b7059b34..17d4c70bfc 100644 --- a/packages/frontend/src/components/MkNote.vue +++ b/packages/frontend/src/components/MkNote.vue @@ -429,7 +429,7 @@ if (!props.mock) { showing, users, count: appearNote.renoteCount, - targetElement: renoteButton.value, + anchorElement: renoteButton.value, }, { closed: () => dispose(), }); @@ -452,7 +452,7 @@ if (!props.mock) { reaction: '❤️', users, count: $appearNote.reactionCount, - targetElement: reactButton.value!, + anchorElement: reactButton.value!, }, { closed: () => dispose(), }); diff --git a/packages/frontend/src/components/MkNoteDetailed.vue b/packages/frontend/src/components/MkNoteDetailed.vue index f3e990e65a..fea796e8b1 100644 --- a/packages/frontend/src/components/MkNoteDetailed.vue +++ b/packages/frontend/src/components/MkNoteDetailed.vue @@ -405,7 +405,7 @@ useTooltip(renoteButton, async (showing) => { showing, users, count: appearNote.renoteCount, - targetElement: renoteButton.value, + anchorElement: renoteButton.value, }, { closed: () => dispose(), }); @@ -428,7 +428,7 @@ if (appearNote.reactionAcceptance === 'likeOnly') { reaction: '❤️', users, count: $appearNote.reactionCount, - targetElement: reactButton.value!, + anchorElement: reactButton.value!, }, { closed: () => dispose(), }); diff --git a/packages/frontend/src/components/MkRange.vue b/packages/frontend/src/components/MkRange.vue index 67a9094cad..c0acfa8c60 100644 --- a/packages/frontend/src/components/MkRange.vue +++ b/packages/frontend/src/components/MkRange.vue @@ -167,7 +167,7 @@ function onMouseenter() { text: computed(() => { return props.textConverter(finalValue.value); }), - targetElement: thumbEl.value ?? undefined, + anchorElement: thumbEl.value ?? undefined, }, { closed: () => dispose(), }); @@ -191,7 +191,7 @@ function onMousedown(ev: MouseEvent | TouchEvent) { text: computed(() => { return props.textConverter(finalValue.value); }), - targetElement: thumbEl.value ?? undefined, + anchorElement: thumbEl.value ?? undefined, }, { closed: () => dispose(), }); diff --git a/packages/frontend/src/components/MkReactionIcon.vue b/packages/frontend/src/components/MkReactionIcon.vue index 7d62456e03..2bfdfa7599 100644 --- a/packages/frontend/src/components/MkReactionIcon.vue +++ b/packages/frontend/src/components/MkReactionIcon.vue @@ -28,7 +28,7 @@ if (props.withTooltip) { const { dispose } = os.popup(defineAsyncComponent(() => import('@/components/MkReactionTooltip.vue')), { showing, reaction: props.reaction.replace(/^:(\w+):$/, ':$1@.:'), - targetElement: elRef.value.$el, + anchorElement: elRef.value.$el, }, { closed: () => dispose(), }); diff --git a/packages/frontend/src/components/MkReactionTooltip.vue b/packages/frontend/src/components/MkReactionTooltip.vue index 77ca841ad0..971ebc060b 100644 --- a/packages/frontend/src/components/MkReactionTooltip.vue +++ b/packages/frontend/src/components/MkReactionTooltip.vue @@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only --> <template> -<MkTooltip ref="tooltip" :showing="showing" :targetElement="targetElement" :maxWidth="340" @closed="emit('closed')"> +<MkTooltip ref="tooltip" :showing="showing" :anchorElement="anchorElement" :maxWidth="340" @closed="emit('closed')"> <div :class="$style.root"> <MkReactionIcon :reaction="reaction" :class="$style.icon" :noStyle="true"/> <div :class="$style.name">{{ reaction.replace('@.', '') }}</div> @@ -20,7 +20,7 @@ import MkReactionIcon from '@/components/MkReactionIcon.vue'; defineProps<{ showing: boolean; reaction: string; - targetElement: HTMLElement; + anchorElement: HTMLElement; }>(); const emit = defineEmits<{ diff --git a/packages/frontend/src/components/MkReactionsViewer.details.vue b/packages/frontend/src/components/MkReactionsViewer.details.vue index d24e0b15bf..1c785f0fd1 100644 --- a/packages/frontend/src/components/MkReactionsViewer.details.vue +++ b/packages/frontend/src/components/MkReactionsViewer.details.vue @@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only --> <template> -<MkTooltip ref="tooltip" :showing="showing" :targetElement="targetElement" :maxWidth="340" @closed="emit('closed')"> +<MkTooltip ref="tooltip" :showing="showing" :anchorElement="anchorElement" :maxWidth="340" @closed="emit('closed')"> <div :class="$style.root"> <div :class="$style.reaction"> <MkReactionIcon :reaction="reaction" :class="$style.reactionIcon" :noStyle="true"/> @@ -33,7 +33,7 @@ defineProps<{ reaction: string; users: Misskey.entities.UserLite[]; count: number; - targetElement: HTMLElement; + anchorElement: HTMLElement; }>(); const emit = defineEmits<{ diff --git a/packages/frontend/src/components/MkReactionsViewer.reaction.vue b/packages/frontend/src/components/MkReactionsViewer.reaction.vue index e02d0ec21d..e0490404ac 100644 --- a/packages/frontend/src/components/MkReactionsViewer.reaction.vue +++ b/packages/frontend/src/components/MkReactionsViewer.reaction.vue @@ -231,7 +231,7 @@ if (!mock) { reaction: props.reaction, users, count: props.count, - targetElement: buttonEl.value, + anchorElement: buttonEl.value, }, { closed: () => dispose(), }); diff --git a/packages/frontend/src/components/MkTooltip.vue b/packages/frontend/src/components/MkTooltip.vue index 3fe80f4ab4..aa041c88e5 100644 --- a/packages/frontend/src/components/MkTooltip.vue +++ b/packages/frontend/src/components/MkTooltip.vue @@ -31,7 +31,7 @@ import { prefer } from '@/preferences.js'; const props = withDefaults(defineProps<{ showing: boolean; - targetElement?: HTMLElement; + anchorElement?: HTMLElement; x?: number; y?: number; text?: string; @@ -58,7 +58,7 @@ const zIndex = os.claimZIndex('high'); function setPosition() { if (el.value == null) return; const data = calcPopupPosition(el.value, { - anchorElement: props.targetElement, + anchorElement: props.anchorElement, direction: props.direction, align: 'center', innerMargin: props.innerMargin, diff --git a/packages/frontend/src/components/MkUrlPreviewPopup.vue b/packages/frontend/src/components/MkUrlPreviewPopup.vue index 1981676fdb..09558b0319 100644 --- a/packages/frontend/src/components/MkUrlPreviewPopup.vue +++ b/packages/frontend/src/components/MkUrlPreviewPopup.vue @@ -20,7 +20,7 @@ import { prefer } from '@/preferences.js'; const props = defineProps<{ showing: boolean; url: string; - anchorEl: HTMLElement; + anchorElement: HTMLElement; }>(); const emit = defineEmits<{ @@ -32,9 +32,9 @@ const top = ref(0); const left = ref(0); onMounted(() => { - const rect = props.anchorEl.getBoundingClientRect(); - const x = Math.max((rect.left + (props.anchorEl.offsetWidth / 2)) - (300 / 2), 6) + window.scrollX; - const y = rect.top + props.anchorEl.offsetHeight + window.scrollY; + const rect = props.anchorElement.getBoundingClientRect(); + const x = Math.max((rect.left + (props.anchorElement.offsetWidth / 2)) - (300 / 2), 6) + window.scrollX; + const y = rect.top + props.anchorElement.offsetHeight + window.scrollY; top.value = y; left.value = x; diff --git a/packages/frontend/src/components/MkUsersTooltip.vue b/packages/frontend/src/components/MkUsersTooltip.vue index 0cb7f22e93..d0bfebc463 100644 --- a/packages/frontend/src/components/MkUsersTooltip.vue +++ b/packages/frontend/src/components/MkUsersTooltip.vue @@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only --> <template> -<MkTooltip ref="tooltip" :showing="showing" :targetElement="targetElement" :maxWidth="250" @closed="emit('closed')"> +<MkTooltip ref="tooltip" :showing="showing" :anchorElement="anchorElement" :maxWidth="250" @closed="emit('closed')"> <div :class="$style.root"> <div v-for="u in users" :key="u.id" :class="$style.user"> <MkAvatar :class="$style.avatar" :user="u"/> @@ -23,7 +23,7 @@ defineProps<{ showing: boolean; users: Misskey.entities.UserLite[]; count: number; - targetElement: HTMLElement; + anchorElement: HTMLElement; }>(); const emit = defineEmits<{ diff --git a/packages/frontend/src/components/global/MkUrl.vue b/packages/frontend/src/components/global/MkUrl.vue index a360cb1d25..159af6f11e 100644 --- a/packages/frontend/src/components/global/MkUrl.vue +++ b/packages/frontend/src/components/global/MkUrl.vue @@ -62,7 +62,7 @@ if (props.showUrlPreview && isEnabledUrlPreview.value) { const { dispose } = os.popup(defineAsyncComponent(() => import('@/components/MkUrlPreviewPopup.vue')), { showing, url: props.url, - anchorEl: el.value instanceof HTMLElement ? el.value : el.value?.$el, + anchorElement: el.value instanceof HTMLElement ? el.value : el.value?.$el, }, { closed: () => dispose(), }); diff --git a/packages/frontend/src/components/grid/MkCellTooltip.vue b/packages/frontend/src/components/grid/MkCellTooltip.vue index fd289c6cd9..6cd4f9ec1c 100644 --- a/packages/frontend/src/components/grid/MkCellTooltip.vue +++ b/packages/frontend/src/components/grid/MkCellTooltip.vue @@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only --> <template> -<MkTooltip ref="tooltip" :showing="showing" :targetElement="targetElement" :maxWidth="250" @closed="emit('closed')"> +<MkTooltip ref="tooltip" :showing="showing" :anchorElement="anchorElement" :maxWidth="250" @closed="emit('closed')"> <div :class="$style.root"> {{ content }} </div> @@ -18,7 +18,7 @@ import MkTooltip from '@/components/MkTooltip.vue'; defineProps<{ showing: boolean; content: string; - targetElement: HTMLElement; + anchorElement: HTMLElement; }>(); const emit = defineEmits<{ diff --git a/packages/frontend/src/components/grid/MkDataCell.vue b/packages/frontend/src/components/grid/MkDataCell.vue index 444509e6b3..0f326b14ca 100644 --- a/packages/frontend/src/components/grid/MkDataCell.vue +++ b/packages/frontend/src/components/grid/MkDataCell.vue @@ -300,7 +300,7 @@ useTooltip(rootEl, (showing) => { const result = os.popup(defineAsyncComponent(() => import('@/components/grid/MkCellTooltip.vue')), { showing, content, - targetElement: rootEl.value!, + anchorElement: rootEl.value!, }, { closed: () => { result.dispose(); diff --git a/packages/frontend/src/directives/tooltip.ts b/packages/frontend/src/directives/tooltip.ts index 750acd0588..62aecbc87c 100644 --- a/packages/frontend/src/directives/tooltip.ts +++ b/packages/frontend/src/directives/tooltip.ts @@ -57,7 +57,7 @@ export default { text: self.text, asMfm: binding.modifiers.mfm, direction: binding.modifiers.left ? 'left' : binding.modifiers.right ? 'right' : binding.modifiers.top ? 'top' : binding.modifiers.bottom ? 'bottom' : 'top', - targetElement: el, + anchorElement: el, }, { closed: () => dispose(), }); |