fix(frontend): MkRange/MkSelectでdisabledが効かなくなっている問題を修正 (#16263)

* fix(frontend): MkRange/MkSelectでdisabledが効かなくなっている問題を修正

* Update Changelog

* 誤字

CHANGELOG.md

@@ -19,6 +19,7 @@
 - Fix: プラグインをアンインストールしてもセーブデータが残る問題を修正
 - Fix: 数時間後Misskeyのタブに戻った際に、タブがスロットリングされている間の更新アニメーションを延々見せ続けられる問題を修正
 - Fix: 非ログイン時のハイライトノートの画像がCWの有無を考慮せず表示される問題を修正
+- Fix: レンジ選択・ドロップダウンにて、操作を無効にすべきところで無効にならない問題を修正
 
 ### Server
 - Enhance: sinceId/untilIdが指定可能なエンドポイントにおいて、sinceDate/untilDateも指定可能に

packages/frontend/src/components/MkRange.vue

@@ -8,7 +8,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 	<div class="label">
 		<slot name="label"></slot>
 	</div>
-	<div v-adaptive-border class="body">
+	<div v-adaptive-border class="body" :class="{ 'disabled': disabled }">
 		<slot name="prefix"></slot>
 		<div ref="containerEl" class="container">
 			<div class="track">
@@ -180,6 +180,8 @@ function onMouseenter() {
 let lastClickTime: number | null = null;
 
 function onMousedown(ev: MouseEvent | TouchEvent) {
+	if (props.disabled) return; // Prevent interaction if disabled
+
 	ev.preventDefault();
 
 	tooltipForDragShowing.value = true;
@@ -292,6 +294,11 @@ function onMousedown(ev: MouseEvent | TouchEvent) {
 		border: solid 1px var(--MI_THEME-panel);
 		border-radius: 6px;
 
+		&.disabled {
+			pointer-events: none;
+			opacity: 0.6;
+		}
+
 		> .container {
 			flex: 1;
 			position: relative;

packages/frontend/src/components/MkSelect.vue

@@ -174,7 +174,7 @@ watch([modelValue, () => props.items], () => {
 }, { immediate: true, deep: true });
 
 function show() {
-	if (opening.value) return;
+	if (opening.value || props.disabled || props.readonly) return;
 	focus();
 
 	opening.value = true;