@ssml-builder-js/ssml-editor-react 2.7.0 → 2.8.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ssml-builder-js/ssml-editor-react",
-  "version": "2.7.0",
+  "version": "2.8.1",
   "description": "React-based SSML editor component",
   "license": "MIT",
   "repository": {
@@ -52,6 +52,6 @@
     }
   },
   "dependencies": {
-    "@ssml-builder-js/ssml-core": "^2.7.0"
+    "@ssml-builder-js/ssml-core": "^2.8.1"
   }
 }

package/src/SsmlEditor.tsx

@@ -6,6 +6,8 @@ import { isSsmlEditorButtonVisible, type SsmlEditorButton, type SsmlEditorButton
 import {
   BREAK_TIME_DESCRIPTIONS,
   BREAK_TIME_PRESETS,
+  AUDIO_DURATION_DESCRIPTIONS,
+  AUDIO_DURATION_PRESETS,
   EMPHASIS_LEVEL_DESCRIPTIONS,
   EMPHASIS_LEVEL_PRESETS,
   EXPRESS_AS_STYLE_DESCRIPTIONS,
@@ -39,7 +41,7 @@ import { useSsmlEditorState } from "./hooks/useSsmlEditorState";
 import { useSsmlMonaco } from "./hooks/useSsmlMonaco";
 import { editorStyles as styles } from "./styles/editorStyles";
 const UNGROUPED_TOOLBAR_GROUP = "__ssml-editor-ungrouped__";
-const TIMING_POPOVER_TAGS = new Set(["break", "mstts:silence"]);
+const TIMING_POPOVER_TAGS = new Set(["break", "mstts:silence", "mstts:audioduration"]);
 const PROSODY_POPOVER_TAGS = new Set(["prosody", "mstts:express-as", "voice", "emphasis"]);
 const TEXT_POPOVER_TAGS = new Set(["sub", "say-as", "phoneme", "w", "lang"]);
 
@@ -365,13 +367,34 @@ export const SSML_INSERTIONS = [
       mode: "insert",
     }),
   },
+  {
+    id: "mstts:audioduration",
+    icon: "◷",
+    tagName: "mstts:audioduration",
+    selfClosing: true,
+    labels: { ja: "音声長", en: "Audio duration" },
+    descriptions: {
+      ja: "合成音声の目標時間を指定します。",
+      en: "Sets the target duration of synthesized audio.",
+    },
+    parameterDescription: {
+      ja: "目標時間を選択します。",
+      en: "Selects the target duration.",
+    },
+    options: createInsertionOptions(AUDIO_DURATION_PRESETS, AUDIO_DURATION_DESCRIPTIONS),
+    createTemplate: (value) => ({
+      prefix: `<mstts:audioduration value="${value}"/>`,
+      suffix: "",
+      mode: "insert",
+    }),
+  },
 ] satisfies readonly SsmlInsertionDefinition[];
 
 const DEFAULT_INSERTION_GROUPS = [
   {
     id: "pauses",
     labels: { ja: "間・無音", en: "Pauses" },
-    insertionIds: ["break", "mstts:silence"],
+    insertionIds: ["break", "mstts:silence", "mstts:audioduration"],
   },
   {
     id: "prosody",

package/src/buttonVisibility.ts

@@ -13,6 +13,7 @@ export type SsmlEditorInsertionButton =
   | "mark"
   | "bookmark"
   | "mstts:silence"
+  | "mstts:audioduration"
   | "mstts:viseme"
   | (string & {});
 

package/src/constants/azureVoiceStyleMap.generated.ts

@@ -0,0 +1,94 @@
+/** Generated by scripts/sync-azure-voices.ts. */
+export const AZURE_VOICE_STYLE_MAP = {
+  "de-DE-ConradNeural": ["cheerful", "sad"],
+  "de-DE-KatjaNeural": ["cheerful", "sad"],
+  "en-US-AndrewNeural": ["empathetic", "relieved"],
+  "en-US-GuyNeural": [
+    "angry",
+    "cheerful",
+    "excited",
+    "friendly",
+    "hopeful",
+    "newscast",
+    "sad",
+    "shouting",
+    "terrified",
+    "unfriendly",
+    "whispering",
+  ],
+  "en-US-JennyMultilingualNeural": [
+    "cheerful",
+    "empathetic",
+    "excited",
+    "friendly",
+    "hopeful",
+    "sad",
+    "shouting",
+    "terrified",
+    "unfriendly",
+    "whispering",
+  ],
+  "en-US-JennyNeural": [
+    "assistant",
+    "chat",
+    "customerservice",
+    "newscast",
+    "cheerful",
+    "empathetic",
+    "excited",
+    "friendly",
+    "hopeful",
+    "sad",
+    "shouting",
+    "terrified",
+    "unfriendly",
+    "whispering",
+  ],
+  "es-ES-ElviraNeural": [],
+  "fil-PH-AngeloNeural": [],
+  "fr-FR-DeniseNeural": ["cheerful", "sad"],
+  "fr-FR-HenriNeural": ["cheerful", "sad"],
+  "id-ID-GadisNeural": [],
+  "it-IT-ElsaNeural": ["cheerful", "sad"],
+  "ja-JP-KeitaNeural": ["chat"],
+  "ja-JP-MayuNeural": ["calm", "cheerful", "sad"],
+  "ja-JP-NanamiNeural": ["chat", "customerservice", "cheerful", "whispering", "sad"],
+  "ko-KR-SunHiNeural": ["cheerful", "sad"],
+  "ms-MY-YasminNeural": [],
+  "pt-BR-FranciscaNeural": ["calm"],
+  "ru-RU-SvetlanaNeural": ["cheerful", "sad", "angry", "disgruntled", "embarrassed", "fearful"],
+  "th-TH-PremwadeeNeural": [],
+  "vi-VN-HoaiMyNeural": [],
+  "zh-CN-XiaoxiaoNeural": [
+    "assistant",
+    "chat",
+    "customerservice",
+    "newscast",
+    "cheerful",
+    "empathetic",
+    "excited",
+    "friendly",
+    "hopeful",
+    "sad",
+    "terrified",
+    "whispering",
+    "poetry-reading",
+    "sports_commentary",
+    "sports_commentary_excited",
+    "story",
+  ],
+  "zh-CN-YunxiNeural": [
+    "narration-relaxed",
+    "embarrassed",
+    "fearful",
+    "sad",
+    "disgruntled",
+    "serious",
+    "angry",
+    "depressed",
+    "chat",
+    "cheerful",
+    "assistant",
+  ],
+  "zh-TW-HsiaoChenNeural": [],
+} as const satisfies Readonly<Record<string, readonly string[]>>;

package/src/constants/ssmlPresets.ts

@@ -1,5 +1,8 @@
 type SsmlPresetDescription = Readonly<Record<"ja" | "en", string>>;
 
+// @ts-expect-error The Node strip-types test runner requires the explicit TypeScript extension.
+import { AZURE_VOICE_STYLE_MAP } from "./azureVoiceStyleMap.generated.ts";
+
 export interface SsmlPreset {
   id: string;
   label: string;
@@ -119,7 +122,7 @@ export function getExpressAsStyleCategory(style: string): ExpressAsStyleCategory
   return "other";
 }
 
-export const VOICE_STYLE_MAP = {
+const LEGACY_VOICE_STYLE_MAP = {
   "ja-JP-MayuNeural": ["calm", "cheerful", "sad"],
   "ja-JP-KeitaNeural": ["chat"],
   "ja-JP-NanamiNeural": ["chat", "customerservice", "cheerful", "whispering", "sad"],
@@ -206,7 +209,11 @@ export const VOICE_STYLE_MAP = {
   "ru-RU-SvetlanaNeural": ["cheerful", "sad", "angry", "disgruntled", "embarrassed", "fearful"],
 } as const satisfies Readonly<Record<string, readonly ExpressAsStyle[]>>;
 
-const VOICE_STYLE_MAP_BY_NORMALIZED_NAME = new Map<string, readonly ExpressAsStyle[]>(
+/** Snapshot generated from Azure's List Voices API. The legacy map is only a safety fallback for an empty generated file. */
+export const VOICE_STYLE_MAP =
+  Object.keys(AZURE_VOICE_STYLE_MAP).length > 0 ? AZURE_VOICE_STYLE_MAP : LEGACY_VOICE_STYLE_MAP;
+
+const VOICE_STYLE_MAP_BY_NORMALIZED_NAME = new Map<string, readonly string[]>(
   Object.entries(VOICE_STYLE_MAP).map(([voiceName, styles]) => [voiceName.toLowerCase(), styles]),
 );
 
@@ -254,6 +261,7 @@ export const SAY_AS_PRESETS = [
 ] as const;
 export const LANGUAGE_PRESETS = ["ja-JP", "en-US", "de-DE", "fr-FR"] as const;
 export const SILENCE_VALUE_PRESETS = ["300ms", "500ms", "1s"] as const;
+export const AUDIO_DURATION_PRESETS = ["5s", "10s", "30s"] as const;
 export const SILENCE_TYPE_PRESETS = [
   "Leading",
   "Tailing",
@@ -262,6 +270,11 @@ export const SILENCE_TYPE_PRESETS = [
   "Semicolon",
   "Enumerationcomma",
 ] as const;
+export const AUDIO_DURATION_DESCRIPTIONS = {
+  "5s": { ja: "5秒", en: "5 seconds" },
+  "10s": { ja: "10秒", en: "10 seconds" },
+  "30s": { ja: "30秒", en: "30 seconds" },
+} as const;
 export const PHONEME_ALPHABET_PRESETS = ["ipa", "sapi", "ups", "x-sampa"] as const;
 export const VISEME_TYPE_PRESETS = ["redlips_front", "FacialExpression"] as const;
 
@@ -306,6 +319,9 @@ export const SSML_ATTRIBUTE_PRESETS = {
     type: SILENCE_TYPE_PRESETS,
     value: SILENCE_VALUE_PRESETS,
   },
+  "mstts:audioduration": {
+    value: AUDIO_DURATION_PRESETS,
+  },
   silence: {
     type: SILENCE_TYPE_PRESETS,
     value: SILENCE_VALUE_PRESETS,

package/src/formatXml.ts

@@ -7,6 +7,7 @@ export const INTRINSICALLY_EMPTY_ELEMENTS = new Set([
   "lexicon",
   "mark",
   "mstts:silence",
+  "mstts:audioduration",
   "mstts:viseme",
   "silence",
   "viseme",

package/src/hooks/useSsmlEditorState.ts

@@ -24,7 +24,7 @@ import type { MonacoEditor, SsmlSyntaxError } from "../ssmlDiagnostics";
 import type { SsmlCodeLensAction } from "../ssmlCodeLens";
 import { SELECTION_OVERLAY_ABOVE_THRESHOLD_LINES } from "../constants/ui";
 
-const TIMING_INSERTION_TAGS = new Set(["break", "mstts:silence"]);
+const TIMING_INSERTION_TAGS = new Set(["break", "mstts:silence", "mstts:audioduration"]);
 const PROSODY_INSERTION_TAGS = new Set(["prosody", "mstts:express-as", "voice", "emphasis"]);
 const TEXT_INSERTION_TAGS = new Set(["sub", "say-as", "phoneme", "w", "lang"]);
 
@@ -53,8 +53,8 @@ export interface UseSsmlEditorStateOptions {
 }
 
 interface PendingCodeLensAttribute {
-  insertionId: "rate" | "pitch" | "break";
-  attributeName: "rate" | "pitch" | "time";
+  insertionId: "rate" | "pitch" | "break" | "mstts:audioduration";
+  attributeName: "rate" | "pitch" | "time" | "value";
   tagRange: { start: number; end: number };
   modelVersionId: number;
 }

package/src/locales.ts

@@ -273,6 +273,13 @@ export const SSML_HOVER_COPY: Readonly<Record<SsmlEditorLocale, SsmlHoverLocale>
           type: { title: "type", description: "ビゼームイベントの形式。" },
         },
       },
+      "mstts:audioduration": {
+        title: "音声長",
+        description: "合成音声の目標時間を指定します。",
+        parameters: {
+          value: { title: "value", description: "目標時間。例: `10s`、`5000ms`、`00:00:10`。" },
+        },
+      },
     },
   },
   en: {
@@ -430,6 +437,13 @@ export const SSML_HOVER_COPY: Readonly<Record<SsmlEditorLocale, SsmlHoverLocale>
           type: { title: "type", description: "The viseme event format." },
         },
       },
+      "mstts:audioduration": {
+        title: "Audio duration",
+        description: "Sets the target duration of synthesized audio.",
+        parameters: {
+          value: { title: "value", description: "The target duration, such as `10s`, `5000ms`, or `00:00:10`." },
+        },
+      },
     },
   },
 };

package/src/ssmlCodeLens.ts

@@ -5,8 +5,8 @@ import type { SsmlTagRange } from "./ssmlContext";
 export type SsmlCodeLensAction =
   | {
       type: "attribute";
-      insertionId: "rate" | "pitch" | "break";
-      attributeName: "rate" | "pitch" | "time";
+      insertionId: "rate" | "pitch" | "break" | "mstts:audioduration";
+      attributeName: "rate" | "pitch" | "time" | "value";
       tagRange: SsmlTagRange;
     }
   | {
@@ -139,7 +139,7 @@ export function registerSsmlCodeLens(
           break;
         }
         const tag = source.slice(tagStart, tagEnd + 1);
-        const tagName = tag.match(/^<\s*(prosody|break)\b/i)?.[1]?.toLowerCase();
+        const tagName = tag.match(/^<\s*(prosody|break|mstts:audioduration)\b/i)?.[1]?.toLowerCase();
         index = tagEnd + 1;
         if (!tagName) {
           continue;
@@ -171,7 +171,22 @@ export function registerSsmlCodeLens(
               elementRange,
             }),
           );
-        } else if (/\/\s*>$/.test(tag)) {
+        } else if (tagName === "mstts:audioduration" && /\/\s*>$/.test(tag)) {
+          lenses.push(
+            createLens(
+              model,
+              tagStart,
+              tagEnd + 1,
+              `⚡ Duration: ${getAttributeValue(tag, "value") ?? "default"} (Click to edit)`,
+              { type: "attribute", insertionId: "mstts:audioduration", attributeName: "value", tagRange },
+            ),
+            createLens(model, tagStart, tagEnd + 1, "Delete", {
+              type: "delete",
+              tagRange,
+              elementRange,
+            }),
+          );
+        } else if (tagName === "break" && /\/\s*>$/.test(tag)) {
           lenses.push(
             createLens(
               model,

package/src/ssmlCompletion.ts

@@ -42,6 +42,10 @@ const SSML_COMPLETION_SNIPPETS = [
     label: "mstts:express-as",
     insertText: `<mstts:express-as style="cheerful">\${1:text}</mstts:express-as>`,
   },
+  {
+    label: "mstts:audioduration",
+    insertText: '<mstts:audioduration value="10s" />',
+  },
   {
     label: "sub",
     insertText: `<sub alias="\${1:読み}">\${2:漢字}</sub>`,

package/src/ssmlHover.ts

@@ -328,6 +328,17 @@ const SSML_TAG_DEFINITIONS: readonly SsmlTagDefinition[] = [
       },
     ],
   },
+  {
+    name: "mstts:audioduration",
+    description: "Sets the target duration of synthesized audio.",
+    parameters: [
+      {
+        name: "value",
+        description: "The target duration, such as `10s`, `5000ms`, or `00:00:10`.",
+        example: "10s",
+      },
+    ],
+  },
 ] as const;
 
 export { SSML_TAG_DEFINITIONS };

package/src/ssmlInsertions.ts

@@ -2,6 +2,8 @@ import type { SsmlEditorLocalizedText } from "./locales";
 import {
   BREAK_TIME_DESCRIPTIONS,
   BREAK_TIME_PRESETS,
+  AUDIO_DURATION_DESCRIPTIONS,
+  AUDIO_DURATION_PRESETS,
   EMPHASIS_LEVEL_DESCRIPTIONS,
   EMPHASIS_LEVEL_PRESETS,
   EXPRESS_AS_STYLE_DESCRIPTIONS,
@@ -320,13 +322,34 @@ export const SSML_INSERTIONS = [
       mode: "insert",
     }),
   },
+  {
+    id: "mstts:audioduration",
+    icon: "◷",
+    tagName: "mstts:audioduration",
+    selfClosing: true,
+    labels: { ja: "音声長", en: "Audio duration" },
+    descriptions: {
+      ja: "合成音声の目標時間を指定します。",
+      en: "Sets the target duration of synthesized audio.",
+    },
+    parameterDescription: {
+      ja: "目標時間を選択します。",
+      en: "Selects the target duration.",
+    },
+    options: createInsertionOptions(AUDIO_DURATION_PRESETS, AUDIO_DURATION_DESCRIPTIONS),
+    createTemplate: (value) => ({
+      prefix: `<mstts:audioduration value="${value}"/>`,
+      suffix: "",
+      mode: "insert",
+    }),
+  },
 ] satisfies readonly SsmlEditorInsertionDefinition[];
 
 export const DEFAULT_INSERTION_GROUPS = [
   {
     id: "pauses",
     labels: { ja: "間・無音", en: "Pauses" },
-    insertionIds: ["break", "mstts:silence"],
+    insertionIds: ["break", "mstts:silence", "mstts:audioduration"],
   },
   {
     id: "prosody",

package/test/index.test.ts

@@ -80,7 +80,23 @@ test("provides attribute values from the active SSML tag and attribute", () => {
   );
 });
 
-test("generates CodeLens actions for prosody and break tags", () => {
+test("provides the audioduration snippet and value completions", () => {
+  const tagSuggestions = getSuggestions("<");
+  assert.equal(
+    tagSuggestions.some(
+      (suggestion) =>
+        suggestion.label === "mstts:audioduration" && suggestion.insertText === '<mstts:audioduration value="10s" />',
+    ),
+    true,
+  );
+  const valueSuggestions = getSuggestions('<mstts:audioduration value="');
+  assert.equal(
+    valueSuggestions.some((suggestion) => suggestion.label === "10s"),
+    true,
+  );
+});
+
+test("generates CodeLens actions for prosody, break, and audioduration tags", () => {
   let provider: Parameters<Monaco["languages"]["registerCodeLensProvider"]>[1] | undefined;
   let commandId: string | undefined;
   let commandHandler: ((accessor: unknown, ...args: unknown[]) => void) | undefined;
@@ -102,7 +118,8 @@ test("generates CodeLens actions for prosody and break tags", () => {
   const editor = {
     addAction: () => ({ dispose() {} }),
   } as never;
-  const source = '<prosody rate="+10%" pitch="high">Hello</prosody><break time="500ms"/>';
+  const source =
+    '<prosody rate="+10%" pitch="high">Hello</prosody><break time="500ms"/><mstts:audioduration value="10s"/>';
   registerSsmlCodeLens(monaco, editor, () => undefined);
   const model = {
     getValue: () => source,
@@ -118,6 +135,8 @@ test("generates CodeLens actions for prosody and break tags", () => {
       "Unwrap",
       "⚡ Time: 500ms (Click to edit)",
       "Delete",
+      "⚡ Duration: 10s (Click to edit)",
+      "Delete",
     ],
   );
   assert.equal(commandId, "ssml-editor.codeLens");