Merge branch 'develop' into settings-search

packages/frontend/package.json

@@ -59,7 +59,7 @@
 		"rollup": "4.34.7",
 		"sanitize-html": "2.14.0",
 		"sass": "1.85.0",
-		"shiki": "2.3.2",
+		"shiki": "2.4.1",
 		"strict-event-emitter-types": "2.0.0",
 		"textarea-caret": "3.1.0",
 		"three": "0.173.0",
@@ -132,8 +132,8 @@
 		"vite-plugin-turbosnap": "1.0.3",
 		"vitest": "3.0.5",
 		"vitest-fetch-mock": "0.4.3",
-		"vue-component-type-helpers": "2.2.0",
+		"vue-component-type-helpers": "2.2.2",
 		"vue-eslint-parser": "9.4.3",
-		"vue-tsc": "2.2.0"
+		"vue-tsc": "2.2.2"
 	}
 }

packages/frontend/src/components/MkPostForm.vue

@@ -65,7 +65,10 @@ SPDX-License-Identifier: AGPL-3.0-only
 		</div>
 	</div>
 	<MkInfo v-if="hasNotSpecifiedMentions" warn :class="$style.hasNotSpecifiedMentions">{{ i18n.ts.notSpecifiedMentionWarning }} - <button class="_textButton" @click="addMissingMention()">{{ i18n.ts.add }}</button></MkInfo>
-	<input v-show="useCw" ref="cwInputEl" v-model="cw" :class="$style.cw" :placeholder="i18n.ts.annotation" @keydown="onKeydown" @keyup="onKeyup" @compositionend="onCompositionEnd">
+	<div v-show="useCw" :class="$style.cwOuter">
+		<input ref="cwInputEl" v-model="cw" :class="$style.cw" :placeholder="i18n.ts.annotation" @keydown="onKeydown" @keyup="onKeyup" @compositionend="onCompositionEnd">
+		<div v-if="maxCwTextLength - cwTextLength < 20" :class="['_acrylic', $style.cwTextCount, { [$style.cwTextOver]: cwTextLength > maxCwTextLength }]">{{ maxCwTextLength - cwTextLength }}</div>		
+	</div>
 	<div :class="[$style.textOuter, { [$style.withCw]: useCw }]">
 		<div v-if="channel" :class="$style.colorBar" :style="{ background: channel.color }"></div>
 		<textarea ref="textareaEl" v-model="text" :class="[$style.text]" :disabled="posting || posted" :readonly="textAreaReadOnly" :placeholder="placeholder" data-cy-post-form-text @keydown="onKeydown" @keyup="onKeyup" @paste="onPaste" @compositionupdate="onCompositionUpdate" @compositionend="onCompositionEnd"/>
@@ -244,6 +247,12 @@ const maxTextLength = computed((): number => {
 	return instance ? instance.maxNoteTextLength : 1000;
 });
 
+const cwTextLength = computed((): number => {
+	return cw.value?.length ?? 0;
+});
+
+const maxCwTextLength = 100;
+
 const canPost = computed((): boolean => {
 	return !props.mock && !posting.value && !posted.value &&
 		(
@@ -254,6 +263,7 @@ const canPost = computed((): boolean => {
 			quoteId.value != null
 		) &&
 		(textLength.value <= maxTextLength.value) &&
+		(cwTextLength.value <= maxCwTextLength) &&
 		(files.value.length <= 16) &&
 		(!poll.value || poll.value.choices.length >= 2);
 });
@@ -1273,12 +1283,34 @@ html[data-color-scheme=light] .preview {
 	}
 }
 
+.cwOuter {
+	width: 100%;
+	position: relative;
+}
+
 .cw {
 	z-index: 1;
 	padding-bottom: 8px;
 	border-bottom: solid 0.5px var(--MI_THEME-divider);
 }
 
+.cwTextCount {
+	position: absolute;
+	top: 0;
+	right: 2px;
+	padding: 2px 6px;
+	font-size: .9em;
+	color: var(--MI_THEME-warn);
+	border-radius: 6px;
+	max-width: 100%;
+	min-width: 1.6em;
+	text-align: center;
+
+	&.cwTextOver {
+		color: #ff2a2a;
+	}
+}
+
 .hashtags {
 	z-index: 1;
 	padding-top: 8px;

packages/frontend/src/components/global/MkA.vue

@@ -15,9 +15,9 @@ export type MkABehavior = 'window' | 'browser' | null;
 
 <script lang="ts" setup>
 import { computed, inject, shallowRef } from 'vue';
+import { url } from '@@/js/config.js';
 import * as os from '@/os.js';
 import { copyToClipboard } from '@/scripts/copy-to-clipboard.js';
-import { url } from '@@/js/config.js';
 import { i18n } from '@/i18n.js';
 import { useRouter } from '@/router/supplier.js';
 

packages/frontend/src/nirax.ts

@@ -6,8 +6,8 @@
 // NIRAX --- A lightweight router
 
 import { onMounted, shallowRef } from 'vue';
-import type { Component, ShallowRef } from 'vue';
 import { EventEmitter } from 'eventemitter3';
+import type { Component, ShallowRef } from 'vue';
 
 function safeURIDecode(str: string): string {
 	try {
@@ -242,8 +242,6 @@ export class Router extends EventEmitter<RouterEvent> implements IRouter {
 			hash,
 		};
 
-		if (_DEV_) console.log('Routing: ', path, queryString);
-
 		function check(routes: RouteDef[], _parts: string[]): Resolved | null {
 			forEachRouteLoop:
 			for (const route of routes) {

packages/frontend/src/pizzax.ts

@@ -6,8 +6,8 @@
 // PIZZAX --- A lightweight store
 
 import { onUnmounted, ref, watch } from 'vue';
-import type { Ref } from 'vue';
 import { BroadcastChannel } from 'broadcast-channel';
+import type { Ref } from 'vue';
 import { $i } from '@/account.js';
 import { misskeyApi } from '@/scripts/misskey-api.js';
 import { get, set } from '@/scripts/idb-proxy.js';
@@ -113,7 +113,6 @@ export class Storage<T extends StateDef> {
 				this.reactiveState[k].value = this.state[k] = this.mergeState<T[keyof T]['default']>(deviceAccountState[k], v.default);
 			} else {
 				this.reactiveState[k].value = this.state[k] = v.default;
-				if (_DEV_) console.log('Use default value', k, v.default);
 			}
 		}
 
@@ -180,12 +179,9 @@ export class Storage<T extends StateDef> {
 		// (JSON.parse(JSON.stringify(value))の代わり)
 		const rawValue = deepClone(value);
 
-		if (_DEV_) console.log('set', key, rawValue, value);
-
 		this.reactiveState[key].value = this.state[key] = rawValue;
 
 		return this.addIdbSetJob(async () => {
-			if (_DEV_) console.log(`set ${String(key)} start`);
 			switch (this.def[key].where) {
 				case 'device': {
 					this.pizzaxChannel.postMessage({
@@ -224,7 +220,6 @@ export class Storage<T extends StateDef> {
 					break;
 				}
 			}
-			if (_DEV_) console.log(`set ${String(key)} complete`);
 		});
 	}
 
@@ -247,9 +242,9 @@ export class Storage<T extends StateDef> {
 		getter?: (v: T[K]['default']) => R,
 		setter?: (v: R) => T[K]['default'],
 	): {
-		get: () => R;
-		set: (value: R) => void;
-	} {
+			get: () => R;
+			set: (value: R) => void;
+		} {
 		const valueRef = ref(this.state[key]);
 
 		const stop = watch(this.reactiveState[key], val => {