@ssml-builder-js/ssml-editor-react 2.11.0 → 2.13.0

package/src/locales.ts

@@ -60,6 +60,160 @@ export interface SsmlHoverLocale {
   tags: Readonly<Record<string, SsmlHoverTagCopy>>;
 }
 
+export interface SsmlElementLocaleCopy {
+  label: string;
+  description: string;
+  validationErrors: Readonly<Record<string, string>>;
+}
+
+/** Localized labels and validation copy for Azure extension elements. */
+export const SSML_ELEMENT_COPY: Readonly<Record<SsmlEditorLocale, Readonly<Record<string, SsmlElementLocaleCopy>>>> = {
+  ja: {
+    dialog: {
+      label: "ダイアログ",
+      description: "複数の話者ターンをまとめます。",
+      validationErrors: { turn: "turn は dialog の直下に配置してください。" },
+    },
+    "mstts:dialog": {
+      label: "ダイアログ",
+      description: "複数の話者ターンをまとめます。",
+      validationErrors: { turn: "turn は dialog の直下に配置してください。" },
+    },
+    turn: {
+      label: "話者ターン",
+      description: "ダイアログ内の話者と発話内容を指定します。",
+      validationErrors: { voice: "voice または speaker を指定してください。" },
+    },
+    "mstts:turn": {
+      label: "話者ターン",
+      description: "ダイアログ内の話者と発話内容を指定します。",
+      validationErrors: { voice: "voice または speaker を指定してください。" },
+    },
+    backgroundaudio: {
+      label: "背景音声",
+      description: "合成音声の背後で再生する音声ファイルを指定します。",
+      validationErrors: { src: "背景音声には URL を指定してください。" },
+    },
+    "mstts:backgroundaudio": {
+      label: "背景音声",
+      description: "合成音声の背後で再生する音声ファイルを指定します。",
+      validationErrors: { src: "背景音声には URL を指定してください。" },
+    },
+    ttsembedding: {
+      label: "音声埋め込み",
+      description: "カスタム音声または話者プロファイルのメタデータを埋め込みます。",
+      validationErrors: { speakerProfileId: "話者プロファイル ID を指定してください。" },
+    },
+    "mstts:ttsembedding": {
+      label: "音声埋め込み",
+      description: "カスタム音声または話者プロファイルのメタデータを埋め込みます。",
+      validationErrors: { speakerProfileId: "話者プロファイル ID を指定してください。" },
+    },
+    embedding: {
+      label: "埋め込み",
+      description: "話者埋め込みのメタデータを指定します。",
+      validationErrors: {},
+    },
+    "mstts:embedding": {
+      label: "埋め込み",
+      description: "話者埋め込みのメタデータを指定します。",
+      validationErrors: {},
+    },
+    silence: {
+      label: "無音",
+      description: "発話前後または句読点の境界に無音を追加します。",
+      validationErrors: { value: "無音の長さを指定してください。" },
+    },
+    "mstts:silence": {
+      label: "無音",
+      description: "発話前後または句読点の境界に無音を追加します。",
+      validationErrors: { value: "無音の長さを指定してください。" },
+    },
+    voiceconversion: {
+      label: "音声変換",
+      description: "カスタム音声の変換メタデータを指定します。",
+      validationErrors: {},
+    },
+    "mstts:voiceconversion": {
+      label: "音声変換",
+      description: "カスタム音声の変換メタデータを指定します。",
+      validationErrors: {},
+    },
+  },
+  en: {
+    dialog: {
+      label: "Dialog",
+      description: "Groups multiple speaker turns.",
+      validationErrors: { turn: "Place turns directly inside a dialog." },
+    },
+    "mstts:dialog": {
+      label: "Dialog",
+      description: "Groups multiple speaker turns.",
+      validationErrors: { turn: "Place turns directly inside a dialog." },
+    },
+    turn: {
+      label: "Dialog turn",
+      description: "Specifies a speaker and utterance within a dialog.",
+      validationErrors: { voice: "Provide a voice or speaker." },
+    },
+    "mstts:turn": {
+      label: "Dialog turn",
+      description: "Specifies a speaker and utterance within a dialog.",
+      validationErrors: { voice: "Provide a voice or speaker." },
+    },
+    backgroundaudio: {
+      label: "Background audio",
+      description: "Specifies an audio file played behind synthesized speech.",
+      validationErrors: { src: "Provide a background audio URL." },
+    },
+    "mstts:backgroundaudio": {
+      label: "Background audio",
+      description: "Specifies an audio file played behind synthesized speech.",
+      validationErrors: { src: "Provide a background audio URL." },
+    },
+    ttsembedding: {
+      label: "TTS embedding",
+      description: "Embeds custom voice or speaker profile metadata.",
+      validationErrors: { speakerProfileId: "Provide a speaker profile ID." },
+    },
+    "mstts:ttsembedding": {
+      label: "TTS embedding",
+      description: "Embeds custom voice or speaker profile metadata.",
+      validationErrors: { speakerProfileId: "Provide a speaker profile ID." },
+    },
+    embedding: {
+      label: "Embedding",
+      description: "Specifies speaker embedding metadata.",
+      validationErrors: {},
+    },
+    "mstts:embedding": {
+      label: "Embedding",
+      description: "Specifies speaker embedding metadata.",
+      validationErrors: {},
+    },
+    silence: {
+      label: "Silence",
+      description: "Adds silence before, after, or around punctuation.",
+      validationErrors: { value: "Provide a silence duration." },
+    },
+    "mstts:silence": {
+      label: "Silence",
+      description: "Adds silence before, after, or around punctuation.",
+      validationErrors: { value: "Provide a silence duration." },
+    },
+    voiceconversion: {
+      label: "Voice conversion",
+      description: "Specifies custom voice conversion metadata.",
+      validationErrors: {},
+    },
+    "mstts:voiceconversion": {
+      label: "Voice conversion",
+      description: "Specifies custom voice conversion metadata.",
+      validationErrors: {},
+    },
+  },
+};
+
 export const EDITOR_COPY: Readonly<Record<SsmlEditorLocale, EditorCopy>> = {
   ja: {
     editorAriaLabel: "SSMLエディター",
@@ -280,6 +434,42 @@ export const SSML_HOVER_COPY: Readonly<Record<SsmlEditorLocale, SsmlHoverLocale>
           value: { title: "value", description: "目標時間。例: `10s`、`5000ms`、`00:00:10`。" },
         },
       },
+      "mstts:dialog": { title: "ダイアログ", description: "複数の話者ターンをまとめます。", parameters: {} },
+      "mstts:turn": {
+        title: "話者ターン",
+        description: "ダイアログ内の話者と発話内容を指定します。",
+        parameters: {
+          voice: { title: "voice", description: "このターンで使用する Azure 音声名。" },
+          speaker: { title: "speaker", description: "話者識別子。" },
+        },
+      },
+      "mstts:backgroundaudio": {
+        title: "背景音声",
+        description: "合成音声の背後で再生する音声ファイルを指定します。",
+        parameters: { src: { title: "src", description: "音声ファイルの HTTPS URL。" } },
+      },
+      "mstts:ttsembedding": {
+        title: "音声埋め込み",
+        description: "カスタム音声または話者プロファイルのメタデータを埋め込みます。",
+        parameters: { speakerProfileId: { title: "speakerProfileId", description: "話者プロファイル ID。" } },
+      },
+      "mstts:embedding": {
+        title: "埋め込み",
+        description: "話者埋め込みのメタデータを指定します。",
+        parameters: {
+          id: { title: "id", description: "埋め込み ID。" },
+          speakerProfileId: { title: "speakerProfileId", description: "話者プロファイル ID。" },
+        },
+      },
+      "mstts:voiceconversion": {
+        title: "音声変換",
+        description: "カスタム音声の変換メタデータを指定します。",
+        parameters: {
+          url: { title: "url", description: "音声変換プロファイル URL。" },
+          profile: { title: "profile", description: "変換プロファイル。" },
+          speakerProfileId: { title: "speakerProfileId", description: "話者プロファイル ID。" },
+        },
+      },
     },
   },
   en: {
@@ -444,6 +634,42 @@ export const SSML_HOVER_COPY: Readonly<Record<SsmlEditorLocale, SsmlHoverLocale>
           value: { title: "value", description: "The target duration, such as `10s`, `5000ms`, or `00:00:10`." },
         },
       },
+      "mstts:dialog": { title: "Dialog", description: "Groups multiple speaker turns.", parameters: {} },
+      "mstts:turn": {
+        title: "Dialog turn",
+        description: "Specifies a speaker and utterance within a dialog.",
+        parameters: {
+          voice: { title: "voice", description: "The Azure voice used by this turn." },
+          speaker: { title: "speaker", description: "The speaker identifier." },
+        },
+      },
+      "mstts:backgroundaudio": {
+        title: "Background audio",
+        description: "Specifies an audio file played behind synthesized speech.",
+        parameters: { src: { title: "src", description: "The HTTPS URL of the audio file." } },
+      },
+      "mstts:ttsembedding": {
+        title: "TTS embedding",
+        description: "Embeds custom voice or speaker profile metadata.",
+        parameters: { speakerProfileId: { title: "speakerProfileId", description: "The speaker profile ID." } },
+      },
+      "mstts:embedding": {
+        title: "Embedding",
+        description: "Specifies speaker embedding metadata.",
+        parameters: {
+          id: { title: "id", description: "The embedding ID." },
+          speakerProfileId: { title: "speakerProfileId", description: "The speaker profile ID." },
+        },
+      },
+      "mstts:voiceconversion": {
+        title: "Voice conversion",
+        description: "Specifies custom voice conversion metadata.",
+        parameters: {
+          url: { title: "url", description: "The voice conversion profile URL." },
+          profile: { title: "profile", description: "The conversion profile." },
+          speakerProfileId: { title: "speakerProfileId", description: "The speaker profile ID." },
+        },
+      },
     },
   },
 };

package/test/ui-components.test.tsx

@@ -621,6 +621,84 @@ describe("SsmlEditor props", () => {
     );
   });
 
+  it("provides forms for every supported Azure element", async () => {
+    const user = userEvent.setup();
+    const onChange = vi.fn();
+    renderEditor({
+      editMode: "visual",
+      onChange,
+      document: {
+        ...editorDocument,
+        children: [
+          { type: "voice", name: "en-US-JennyNeural", children: ["Hello"] },
+          { type: "prosody", rate: "slow", children: ["Hello"] },
+          { type: "say-as", interpretAs: "cardinal", children: ["1"] },
+          { type: "phoneme", alphabet: "ipa", ph: "həˈloʊ", children: ["Hello"] },
+          { type: "audio", src: "https://allowed.test/a.mp3" },
+          { type: "mark", name: "chapter-1" },
+          { type: "bookmark", mark: "chapter-1" },
+          { type: "mstts:silence", typeValue: "Comma", value: "100ms" },
+          { type: "mstts:audioduration", value: "10s" },
+          { type: "mstts:embedding", id: "speaker-1" },
+          { type: "mstts:voiceconversion", url: "https://allowed.test/profile" },
+        ],
+      },
+    });
+
+    const tree = screen.getByRole("navigation", { name: "SSML structure tree" });
+    const expectedFields = [
+      ["<voice>", "Voice name"],
+      ["<prosody>", "Rate"],
+      ["<say-as>", "Interpret as"],
+      ["<phoneme>", "Alphabet"],
+      ["<audio>", "Source URL"],
+      ["<mark>", "Mark name"],
+      ["<bookmark>", "Bookmark name"],
+      ["<mstts:silence>", "Silence type"],
+      ["<mstts:audioduration>", "Duration"],
+      ["<mstts:embedding>", "Embedding ID"],
+      ["<mstts:voiceconversion>", "Source URL"],
+    ];
+
+    for (const [element, field] of expectedFields) {
+      await user.click(within(tree).getByRole("button", { name: element }));
+      expect(screen.getByLabelText(field)).toBeTruthy();
+    }
+
+    await user.click(within(tree).getByRole("button", { name: "<mstts:embedding>" }));
+    await user.clear(screen.getByLabelText("Embedding ID"));
+    await user.type(screen.getByLabelText("Embedding ID"), "speaker-2");
+    expect(onChange).toHaveBeenLastCalledWith(
+      expect.objectContaining({
+        children: expect.arrayContaining([expect.objectContaining({ type: "mstts:embedding", id: "speaker-2" })]),
+      }),
+    );
+  });
+
+  it("retains voice and prosody context for visual selection preview", async () => {
+    const user = userEvent.setup();
+    const onPreviewSelection = vi.fn();
+    renderEditor({
+      editMode: "visual",
+      onPreviewSelection,
+      document: {
+        ...editorDocument,
+        children: [
+          {
+            type: "voice",
+            name: "en-US-JennyNeural",
+            children: [{ type: "prosody", rate: "slow", children: ["Hello world"] }],
+          },
+        ],
+      },
+    });
+
+    await user.click(screen.getByRole("button", { name: "Preview selection" }));
+    expect(onPreviewSelection).toHaveBeenCalledWith(
+      '<speak version="1.0" xmlns="http://www.w3.org/2001/10/synthesis" xml:lang="en-US"><voice name="en-US-JennyNeural"><prosody rate="slow">Hello world</prosody></voice></speak>',
+    );
+  });
+
   it("edits Azure background audio settings in the visual editor", async () => {
     const user = userEvent.setup();
     const onChange = vi.fn();