From e312283ea016630521c972cd42439655759a48a7 Mon Sep 17 00:00:00 2001
From: syuilo <4439005+syuilo@users.noreply.github.com>
Date: Fri, 7 Nov 2025 11:03:33 +0900
Subject: enhance(frontend): 投稿フォームのヒントを追加 (#16712)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* wip

* wip

* Update MkSpot.vue

* Update MkPostForm.vue

* wip

* wip

* Update CHANGELOG.md
---
 packages/frontend/src/utility/tour.ts | 49 +++++++++++++++++++++++++++++++++++
 1 file changed, 49 insertions(+)
 create mode 100644 packages/frontend/src/utility/tour.ts

(limited to 'packages/frontend/src/utility')

diff --git a/packages/frontend/src/utility/tour.ts b/packages/frontend/src/utility/tour.ts
new file mode 100644
index 0000000000..8ab3474ddc
--- /dev/null
+++ b/packages/frontend/src/utility/tour.ts
@@ -0,0 +1,49 @@
+/*
+ * SPDX-FileCopyrightText: syuilo and misskey-project
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import { computed, ref, shallowRef, watch } from 'vue';
+import * as os from '@/os.js';
+
+type TourStep = {
+	title: string;
+	description: string;
+	element: HTMLElement;
+};
+
+export function startTour(steps: TourStep[]) {
+	return new Promise<void>(async (resolve) => {
+		const currentStepIndex = ref(0);
+		const titleRef = ref(steps[0].title);
+		const descriptionRef = ref(steps[0].description);
+		const anchorElementRef = shallowRef<HTMLElement>(steps[0].element);
+
+		watch(currentStepIndex, (newIndex) => {
+			const step = steps[newIndex];
+			titleRef.value = step.title;
+			descriptionRef.value = step.description;
+			anchorElementRef.value = step.element;
+		});
+
+		const { dispose } = os.popup(await import('@/components/MkSpot.vue').then(x => x.default), {
+			title: titleRef,
+			description: descriptionRef,
+			anchorElement: anchorElementRef,
+			hasPrev: computed(() => currentStepIndex.value > 0),
+			hasNext: computed(() => currentStepIndex.value < steps.length - 1),
+		}, {
+			next: () => {
+				if (currentStepIndex.value >= steps.length - 1) {
+					dispose();
+					resolve();
+					return;
+				}
+				currentStepIndex.value++;
+			},
+			prev: () => {
+				currentStepIndex.value--;
+			},
+		});
+	});
+}
-- 
cgit v1.2.3-freya