ssml-builder-js 2.11.0 → 2.13.0

package/dist/react.js

@@ -33,6 +33,7 @@ var react_exports = {};
 __export(react_exports, {
   EDITOR_COPY: () => EDITOR_COPY,
   INLINE_BADGE_COPY: () => INLINE_BADGE_COPY,
+  SSML_ELEMENT_COPY: () => SSML_ELEMENT_COPY,
   SSML_HOVER_COPY: () => SSML_HOVER_COPY,
   SSML_INSERTIONS: () => SSML_INSERTIONS,
   SsmlEditor: () => SsmlEditor,
@@ -820,6 +821,152 @@ var SILENCE_VALUE_DESCRIPTIONS = {
 };
 
 // packages/ssml-editor-react/src/locales.ts
+var SSML_ELEMENT_COPY = {
+  ja: {
+    dialog: {
+      label: "\u30C0\u30A4\u30A2\u30ED\u30B0",
+      description: "\u8907\u6570\u306E\u8A71\u8005\u30BF\u30FC\u30F3\u3092\u307E\u3068\u3081\u307E\u3059\u3002",
+      validationErrors: { turn: "turn \u306F dialog \u306E\u76F4\u4E0B\u306B\u914D\u7F6E\u3057\u3066\u304F\u3060\u3055\u3044\u3002" }
+    },
+    "mstts:dialog": {
+      label: "\u30C0\u30A4\u30A2\u30ED\u30B0",
+      description: "\u8907\u6570\u306E\u8A71\u8005\u30BF\u30FC\u30F3\u3092\u307E\u3068\u3081\u307E\u3059\u3002",
+      validationErrors: { turn: "turn \u306F dialog \u306E\u76F4\u4E0B\u306B\u914D\u7F6E\u3057\u3066\u304F\u3060\u3055\u3044\u3002" }
+    },
+    turn: {
+      label: "\u8A71\u8005\u30BF\u30FC\u30F3",
+      description: "\u30C0\u30A4\u30A2\u30ED\u30B0\u5185\u306E\u8A71\u8005\u3068\u767A\u8A71\u5185\u5BB9\u3092\u6307\u5B9A\u3057\u307E\u3059\u3002",
+      validationErrors: { voice: "voice \u307E\u305F\u306F speaker \u3092\u6307\u5B9A\u3057\u3066\u304F\u3060\u3055\u3044\u3002" }
+    },
+    "mstts:turn": {
+      label: "\u8A71\u8005\u30BF\u30FC\u30F3",
+      description: "\u30C0\u30A4\u30A2\u30ED\u30B0\u5185\u306E\u8A71\u8005\u3068\u767A\u8A71\u5185\u5BB9\u3092\u6307\u5B9A\u3057\u307E\u3059\u3002",
+      validationErrors: { voice: "voice \u307E\u305F\u306F speaker \u3092\u6307\u5B9A\u3057\u3066\u304F\u3060\u3055\u3044\u3002" }
+    },
+    backgroundaudio: {
+      label: "\u80CC\u666F\u97F3\u58F0",
+      description: "\u5408\u6210\u97F3\u58F0\u306E\u80CC\u5F8C\u3067\u518D\u751F\u3059\u308B\u97F3\u58F0\u30D5\u30A1\u30A4\u30EB\u3092\u6307\u5B9A\u3057\u307E\u3059\u3002",
+      validationErrors: { src: "\u80CC\u666F\u97F3\u58F0\u306B\u306F URL \u3092\u6307\u5B9A\u3057\u3066\u304F\u3060\u3055\u3044\u3002" }
+    },
+    "mstts:backgroundaudio": {
+      label: "\u80CC\u666F\u97F3\u58F0",
+      description: "\u5408\u6210\u97F3\u58F0\u306E\u80CC\u5F8C\u3067\u518D\u751F\u3059\u308B\u97F3\u58F0\u30D5\u30A1\u30A4\u30EB\u3092\u6307\u5B9A\u3057\u307E\u3059\u3002",
+      validationErrors: { src: "\u80CC\u666F\u97F3\u58F0\u306B\u306F URL \u3092\u6307\u5B9A\u3057\u3066\u304F\u3060\u3055\u3044\u3002" }
+    },
+    ttsembedding: {
+      label: "\u97F3\u58F0\u57CB\u3081\u8FBC\u307F",
+      description: "\u30AB\u30B9\u30BF\u30E0\u97F3\u58F0\u307E\u305F\u306F\u8A71\u8005\u30D7\u30ED\u30D5\u30A1\u30A4\u30EB\u306E\u30E1\u30BF\u30C7\u30FC\u30BF\u3092\u57CB\u3081\u8FBC\u307F\u307E\u3059\u3002",
+      validationErrors: { speakerProfileId: "\u8A71\u8005\u30D7\u30ED\u30D5\u30A1\u30A4\u30EB ID \u3092\u6307\u5B9A\u3057\u3066\u304F\u3060\u3055\u3044\u3002" }
+    },
+    "mstts:ttsembedding": {
+      label: "\u97F3\u58F0\u57CB\u3081\u8FBC\u307F",
+      description: "\u30AB\u30B9\u30BF\u30E0\u97F3\u58F0\u307E\u305F\u306F\u8A71\u8005\u30D7\u30ED\u30D5\u30A1\u30A4\u30EB\u306E\u30E1\u30BF\u30C7\u30FC\u30BF\u3092\u57CB\u3081\u8FBC\u307F\u307E\u3059\u3002",
+      validationErrors: { speakerProfileId: "\u8A71\u8005\u30D7\u30ED\u30D5\u30A1\u30A4\u30EB ID \u3092\u6307\u5B9A\u3057\u3066\u304F\u3060\u3055\u3044\u3002" }
+    },
+    embedding: {
+      label: "\u57CB\u3081\u8FBC\u307F",
+      description: "\u8A71\u8005\u57CB\u3081\u8FBC\u307F\u306E\u30E1\u30BF\u30C7\u30FC\u30BF\u3092\u6307\u5B9A\u3057\u307E\u3059\u3002",
+      validationErrors: {}
+    },
+    "mstts:embedding": {
+      label: "\u57CB\u3081\u8FBC\u307F",
+      description: "\u8A71\u8005\u57CB\u3081\u8FBC\u307F\u306E\u30E1\u30BF\u30C7\u30FC\u30BF\u3092\u6307\u5B9A\u3057\u307E\u3059\u3002",
+      validationErrors: {}
+    },
+    silence: {
+      label: "\u7121\u97F3",
+      description: "\u767A\u8A71\u524D\u5F8C\u307E\u305F\u306F\u53E5\u8AAD\u70B9\u306E\u5883\u754C\u306B\u7121\u97F3\u3092\u8FFD\u52A0\u3057\u307E\u3059\u3002",
+      validationErrors: { value: "\u7121\u97F3\u306E\u9577\u3055\u3092\u6307\u5B9A\u3057\u3066\u304F\u3060\u3055\u3044\u3002" }
+    },
+    "mstts:silence": {
+      label: "\u7121\u97F3",
+      description: "\u767A\u8A71\u524D\u5F8C\u307E\u305F\u306F\u53E5\u8AAD\u70B9\u306E\u5883\u754C\u306B\u7121\u97F3\u3092\u8FFD\u52A0\u3057\u307E\u3059\u3002",
+      validationErrors: { value: "\u7121\u97F3\u306E\u9577\u3055\u3092\u6307\u5B9A\u3057\u3066\u304F\u3060\u3055\u3044\u3002" }
+    },
+    voiceconversion: {
+      label: "\u97F3\u58F0\u5909\u63DB",
+      description: "\u30AB\u30B9\u30BF\u30E0\u97F3\u58F0\u306E\u5909\u63DB\u30E1\u30BF\u30C7\u30FC\u30BF\u3092\u6307\u5B9A\u3057\u307E\u3059\u3002",
+      validationErrors: {}
+    },
+    "mstts:voiceconversion": {
+      label: "\u97F3\u58F0\u5909\u63DB",
+      description: "\u30AB\u30B9\u30BF\u30E0\u97F3\u58F0\u306E\u5909\u63DB\u30E1\u30BF\u30C7\u30FC\u30BF\u3092\u6307\u5B9A\u3057\u307E\u3059\u3002",
+      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: {}
+    }
+  }
+};
 var EDITOR_COPY = {
   ja: {
     editorAriaLabel: "SSML\u30A8\u30C7\u30A3\u30BF\u30FC",
@@ -1037,6 +1184,42 @@ var SSML_HOVER_COPY = {
         parameters: {
           value: { title: "value", description: "\u76EE\u6A19\u6642\u9593\u3002\u4F8B: `10s`\u3001`5000ms`\u3001`00:00:10`\u3002" }
         }
+      },
+      "mstts:dialog": { title: "\u30C0\u30A4\u30A2\u30ED\u30B0", description: "\u8907\u6570\u306E\u8A71\u8005\u30BF\u30FC\u30F3\u3092\u307E\u3068\u3081\u307E\u3059\u3002", parameters: {} },
+      "mstts:turn": {
+        title: "\u8A71\u8005\u30BF\u30FC\u30F3",
+        description: "\u30C0\u30A4\u30A2\u30ED\u30B0\u5185\u306E\u8A71\u8005\u3068\u767A\u8A71\u5185\u5BB9\u3092\u6307\u5B9A\u3057\u307E\u3059\u3002",
+        parameters: {
+          voice: { title: "voice", description: "\u3053\u306E\u30BF\u30FC\u30F3\u3067\u4F7F\u7528\u3059\u308B Azure \u97F3\u58F0\u540D\u3002" },
+          speaker: { title: "speaker", description: "\u8A71\u8005\u8B58\u5225\u5B50\u3002" }
+        }
+      },
+      "mstts:backgroundaudio": {
+        title: "\u80CC\u666F\u97F3\u58F0",
+        description: "\u5408\u6210\u97F3\u58F0\u306E\u80CC\u5F8C\u3067\u518D\u751F\u3059\u308B\u97F3\u58F0\u30D5\u30A1\u30A4\u30EB\u3092\u6307\u5B9A\u3057\u307E\u3059\u3002",
+        parameters: { src: { title: "src", description: "\u97F3\u58F0\u30D5\u30A1\u30A4\u30EB\u306E HTTPS URL\u3002" } }
+      },
+      "mstts:ttsembedding": {
+        title: "\u97F3\u58F0\u57CB\u3081\u8FBC\u307F",
+        description: "\u30AB\u30B9\u30BF\u30E0\u97F3\u58F0\u307E\u305F\u306F\u8A71\u8005\u30D7\u30ED\u30D5\u30A1\u30A4\u30EB\u306E\u30E1\u30BF\u30C7\u30FC\u30BF\u3092\u57CB\u3081\u8FBC\u307F\u307E\u3059\u3002",
+        parameters: { speakerProfileId: { title: "speakerProfileId", description: "\u8A71\u8005\u30D7\u30ED\u30D5\u30A1\u30A4\u30EB ID\u3002" } }
+      },
+      "mstts:embedding": {
+        title: "\u57CB\u3081\u8FBC\u307F",
+        description: "\u8A71\u8005\u57CB\u3081\u8FBC\u307F\u306E\u30E1\u30BF\u30C7\u30FC\u30BF\u3092\u6307\u5B9A\u3057\u307E\u3059\u3002",
+        parameters: {
+          id: { title: "id", description: "\u57CB\u3081\u8FBC\u307F ID\u3002" },
+          speakerProfileId: { title: "speakerProfileId", description: "\u8A71\u8005\u30D7\u30ED\u30D5\u30A1\u30A4\u30EB ID\u3002" }
+        }
+      },
+      "mstts:voiceconversion": {
+        title: "\u97F3\u58F0\u5909\u63DB",
+        description: "\u30AB\u30B9\u30BF\u30E0\u97F3\u58F0\u306E\u5909\u63DB\u30E1\u30BF\u30C7\u30FC\u30BF\u3092\u6307\u5B9A\u3057\u307E\u3059\u3002",
+        parameters: {
+          url: { title: "url", description: "\u97F3\u58F0\u5909\u63DB\u30D7\u30ED\u30D5\u30A1\u30A4\u30EB URL\u3002" },
+          profile: { title: "profile", description: "\u5909\u63DB\u30D7\u30ED\u30D5\u30A1\u30A4\u30EB\u3002" },
+          speakerProfileId: { title: "speakerProfileId", description: "\u8A71\u8005\u30D7\u30ED\u30D5\u30A1\u30A4\u30EB ID\u3002" }
+        }
       }
     }
   },
@@ -1201,6 +1384,42 @@ var SSML_HOVER_COPY = {
         parameters: {
           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." }
+        }
       }
     }
   }
@@ -2850,6 +3069,7 @@ function tokenizeElements(source) {
       attributes,
       childElementIndex,
       end,
+      depth: openElements.length + 1,
       name: tokenName,
       parentName: parent?.name,
       parentVoiceName,
@@ -3030,13 +3250,18 @@ function validateAudioSource(token, source, diagnostics, options, elementName2)
     addDiagnostic(diagnostics, source, token.start, `<${elementName2} src> must be an absolute HTTP(S) URL.`);
     return;
   }
+  if (parsed.username || parsed.password)
+    addDiagnostic(diagnostics, source, token.start, `<${elementName2} src> must not contain URL credentials.`);
   if (parsed.protocol !== "https:" && !(options.allowHttpAudio && parsed.protocol === "http:"))
     addDiagnostic(diagnostics, source, token.start, `<${elementName2} src> must use HTTPS.`);
   const isAllowedOrigin = options.allowedAudioOrigins?.some((allowedOrigin) => {
     try {
-      return new URL(allowedOrigin).origin === parsed.origin;
+      const configured = new URL(allowedOrigin);
+      if (configured.protocol !== "https:" && configured.protocol !== "http:" || configured.username || configured.password || configured.pathname !== "/" || configured.search || configured.hash)
+        return false;
+      return configured.origin === parsed.origin;
     } catch {
-      return allowedOrigin === parsed.origin;
+      return false;
     }
   }) ?? false;
   if (options.allowedAudioOrigins && !isAllowedOrigin)
@@ -3228,7 +3453,7 @@ function validateElement(token, source, diagnostics, voiceName, options, voiceCa
       addDiagnostic(diagnostics, source, token.start, "<mstts:backgroundaudio> must be self-closing.");
   }
 }
-function validateAzureSsml(ssml, options = {}) {
+function validateAzureSsmlStatic(ssml, options = {}) {
   const diagnostics = [];
   if (typeof ssml !== "string") {
     return [
@@ -3244,6 +3469,9 @@ function validateAzureSsml(ssml, options = {}) {
   const maxLength = options.maxLength ?? 1e4;
   if (ssml.length > maxLength)
     addDiagnostic(diagnostics, ssml, maxLength, `SSML exceeds the maximum length of ${maxLength} characters.`);
+  if (options.maxXmlDepth !== void 0 && (!Number.isInteger(options.maxXmlDepth) || options.maxXmlDepth <= 0)) {
+    addDiagnostic(diagnostics, ssml, 0, "maxXmlDepth must be a positive integer.");
+  }
   try {
     parseSsml(ssml);
   } catch (error) {
@@ -3253,6 +3481,18 @@ function validateAzureSsml(ssml, options = {}) {
     return diagnostics;
   }
   const tokens = tokenizeElements(ssml);
+  if (options.maxXmlDepth !== void 0) {
+    for (const token of tokens) {
+      if (token.depth > options.maxXmlDepth) {
+        addDiagnostic(
+          diagnostics,
+          ssml,
+          token.start,
+          `XML nesting depth ${token.depth} exceeds the configured maximum of ${options.maxXmlDepth}.`
+        );
+      }
+    }
+  }
   const speak = tokens.find((token) => token.name.toLowerCase() === "speak");
   const voices = tokens.filter((token) => token.name.toLowerCase() === "voice");
   const backgroundAudioTokens = tokens.filter((token) => token.name.toLowerCase() === "mstts:backgroundaudio");
@@ -3337,6 +3577,51 @@ function validateAzureSsml(ssml, options = {}) {
   }
   return diagnostics;
 }
+function urlAttributes(token) {
+  const tag = canonicalTagName(token.name);
+  const attributes = tag === "audio" || tag === "mstts:backgroundaudio" ? ["src"] : tag === "lexicon" ? ["uri"] : tag === "mstts:voiceconversion" ? ["url"] : [];
+  return attributes.flatMap((attribute) => {
+    const value = attr(token, attribute);
+    return value === void 0 ? [] : [{ attribute, value }];
+  });
+}
+function validateAzureSsml(ssml, options = {}) {
+  const diagnostics = validateAzureSsmlStatic(ssml, options);
+  const validator = options.urlValidator ?? options.customUrlValidator;
+  if (!validator || typeof ssml !== "string") return diagnostics;
+  let tokens;
+  try {
+    tokens = tokenizeElements(ssml);
+  } catch {
+    return diagnostics;
+  }
+  const checks = tokens.flatMap(
+    (token) => urlAttributes(token).map(async ({ attribute, value }) => {
+      try {
+        const result = await validator(value, { tag: token.name, attribute });
+        const valid = typeof result === "boolean" ? result : result.valid;
+        if (!valid) {
+          const reason = typeof result === "boolean" ? void 0 : result.reason;
+          addDiagnostic(
+            diagnostics,
+            ssml,
+            token.start,
+            `<${token.name} ${attribute}> was rejected by the custom URL validator${reason ? `: ${reason}` : "."}`
+          );
+        }
+      } catch (error) {
+        const reason = error instanceof Error ? error.message : String(error);
+        addDiagnostic(
+          diagnostics,
+          ssml,
+          token.start,
+          `<${token.name} ${attribute}> could not be validated by the custom URL validator: ${reason}`
+        );
+      }
+    })
+  );
+  return Promise.all(checks).then(() => diagnostics);
+}
 var AZURE_VOICE_CATALOG_METADATA = {
   apiVersion: "2025-10-01",
   generatedAt: "2026-08-28T00:00:00.000Z",
@@ -6383,6 +6668,210 @@ function updateOptionalElementProperty(document2, path, property, value) {
     return next;
   });
 }
+var VISUAL_ELEMENT_FIELDS = {
+  voice: [
+    { key: "name", label: "Voice name" },
+    { key: "effect", label: "Effect" }
+  ],
+  prosody: [
+    { key: "rate", label: "Rate" },
+    { key: "pitch", label: "Pitch" },
+    { key: "volume", label: "Volume" },
+    { key: "contour", label: "Contour" },
+    { key: "range", label: "Range" }
+  ],
+  "express-as": [
+    { key: "style", label: "Style" },
+    { key: "styleDegree", label: "Style degree" },
+    { key: "role", label: "Role" }
+  ],
+  expressAs: [
+    { key: "style", label: "Style" },
+    { key: "styleDegree", label: "Style degree" },
+    { key: "role", label: "Role" }
+  ],
+  "mstts:express-as": [
+    { key: "style", label: "Style" },
+    { key: "styleDegree", label: "Style degree" },
+    { key: "role", label: "Role" }
+  ],
+  "say-as": [
+    { key: "interpretAs", label: "Interpret as" },
+    { key: "format", label: "Format" },
+    { key: "detail", label: "Detail" }
+  ],
+  sayAs: [
+    { key: "interpretAs", label: "Interpret as" },
+    { key: "format", label: "Format" },
+    { key: "detail", label: "Detail" }
+  ],
+  phoneme: [
+    { key: "alphabet", label: "Alphabet" },
+    { key: "ph", label: "Pronunciation" }
+  ],
+  emphasis: [{ key: "level", label: "Level" }],
+  audio: [
+    { key: "src", label: "Source URL" },
+    { key: "desc", label: "Description" },
+    { key: "clipBegin", label: "Clip begin" },
+    { key: "clipEnd", label: "Clip end" },
+    { key: "speed", label: "Speed" },
+    { key: "repeatCount", label: "Repeat count" },
+    { key: "repeatDuration", label: "Repeat duration" },
+    { key: "soundLevel", label: "Sound level" }
+  ],
+  mark: [{ key: "name", label: "Mark name" }],
+  bookmark: [{ key: "mark", label: "Bookmark name" }],
+  sub: [{ key: "alias", label: "Alias" }],
+  lang: [{ key: "lang", label: "Language" }],
+  lexicon: [{ key: "uri", label: "Lexicon URI" }],
+  "mstts:silence": [
+    { key: "typeValue", label: "Silence type" },
+    { key: "value", label: "Value" }
+  ],
+  silence: [
+    { key: "typeValue", label: "Silence type" },
+    { key: "value", label: "Value" }
+  ],
+  "mstts:audioduration": [{ key: "value", label: "Duration" }],
+  "mstts:ttsembedding": [{ key: "speakerProfileId", label: "Speaker profile ID" }],
+  "mstts:embedding": [
+    { key: "id", label: "Embedding ID" },
+    { key: "speakerProfileId", label: "Speaker profile ID" }
+  ],
+  "mstts:voiceconversion": [
+    { key: "url", label: "Source URL" },
+    { key: "profile", label: "Profile" },
+    { key: "speakerProfileId", label: "Speaker profile ID" }
+  ]
+};
+function getElementFields(element) {
+  return VISUAL_ELEMENT_FIELDS[elementLabel(element)] ?? [];
+}
+function localizedElementLabel(element, locale) {
+  return SSML_ELEMENT_COPY[locale][elementLabel(element)]?.label ?? elementLabel(element);
+}
+function filteredVoices(voiceCatalog, locale, region, style) {
+  return (voiceCatalog ?? []).filter((voice) => {
+    if (locale && voice.locale.toLowerCase() !== locale.toLowerCase()) return false;
+    if (region && voice.region && voice.region.toLowerCase() !== region.toLowerCase()) return false;
+    if (style && !voice.styles?.some((candidate) => candidate.toLowerCase() === style.toLowerCase())) return false;
+    return true;
+  });
+}
+function DefaultVoiceSelector({ value, voices, readOnly, locale, onChange }) {
+  return /* @__PURE__ */ React.createElement(
+    "select",
+    {
+      "aria-label": locale === "ja" ? "\u97F3\u58F0" : "Voice",
+      value,
+      disabled: readOnly,
+      onChange: (event) => onChange(event.target.value)
+    },
+    /* @__PURE__ */ React.createElement("option", { value: "" }, locale === "ja" ? "\u97F3\u58F0\u3092\u9078\u629E" : "Select a voice"),
+    voices.map((voice) => /* @__PURE__ */ React.createElement("option", { key: voice.name, value: voice.name }, voice.name, voice.preview || voice.status === "preview" ? " (preview)" : ""))
+  );
+}
+function VisualElementInspector({
+  document: document2,
+  element,
+  path,
+  readOnly,
+  commit,
+  locale,
+  customInspector,
+  renderVoiceSelector,
+  voiceCatalog,
+  voiceLocale,
+  voiceRegion,
+  voiceStyle
+}) {
+  if (customInspector) {
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, customInspector({ document: document2, element, path, readOnly, onChange: commit, locale }));
+  }
+  const fields = getElementFields(element);
+  const availableVoices = filteredVoices(voiceCatalog, voiceLocale, voiceRegion, voiceStyle);
+  const renderSelector = renderVoiceSelector ?? DefaultVoiceSelector;
+  return /* @__PURE__ */ React.createElement("fieldset", null, /* @__PURE__ */ React.createElement("legend", null, `<${elementLabel(element)}>`), fields.length === 0 ? /* @__PURE__ */ React.createElement("p", null, "This element is preserved in the visual tree. Edit its attributes in Code mode.") : fields.map((field) => {
+    const value = element[field.key];
+    const inputValue = value === void 0 ? "" : String(value);
+    const inputId = `ssml-visual-${field.key}`;
+    return /* @__PURE__ */ React.createElement("label", { key: field.key, htmlFor: inputId }, locale === "ja" ? {
+      name: "\u540D\u524D",
+      effect: "\u52B9\u679C",
+      rate: "\u901F\u5EA6",
+      pitch: "\u30D4\u30C3\u30C1",
+      volume: "\u97F3\u91CF",
+      contour: "\u30D4\u30C3\u30C1\u66F2\u7DDA",
+      range: "\u7BC4\u56F2",
+      style: "\u30B9\u30BF\u30A4\u30EB",
+      styleDegree: "\u30B9\u30BF\u30A4\u30EB\u5F37\u5EA6",
+      role: "\u5F79\u5272",
+      interpretAs: "\u89E3\u91C8",
+      alphabet: "\u30A2\u30EB\u30D5\u30A1\u30D9\u30C3\u30C8",
+      ph: "\u767A\u97F3",
+      level: "\u5F37\u8ABF\u30EC\u30D9\u30EB",
+      src: "\u97F3\u58F0 URL",
+      desc: "\u8AAC\u660E",
+      clipBegin: "\u958B\u59CB\u4F4D\u7F6E",
+      clipEnd: "\u7D42\u4E86\u4F4D\u7F6E",
+      speed: "\u901F\u5EA6",
+      repeatCount: "\u7E70\u308A\u8FD4\u3057\u56DE\u6570",
+      repeatDuration: "\u7E70\u308A\u8FD4\u3057\u6642\u9593",
+      soundLevel: "\u97F3\u91CF\u30EC\u30D9\u30EB",
+      mark: "\u30D6\u30C3\u30AF\u30DE\u30FC\u30AF\u540D",
+      alias: "\u5225\u540D",
+      lang: "\u8A00\u8A9E",
+      uri: "\u8F9E\u66F8 URI",
+      typeValue: "\u7121\u97F3\u306E\u7A2E\u985E",
+      value: "\u5024",
+      id: "\u57CB\u3081\u8FBC\u307F ID",
+      speakerProfileId: "\u8A71\u8005\u30D7\u30ED\u30D5\u30A1\u30A4\u30EB ID",
+      url: "\u97F3\u58F0\u5909\u63DB URL",
+      profile: "\u30D7\u30ED\u30D5\u30A1\u30A4\u30EB"
+    }[field.key] ?? field.label : field.label, field.key === "name" && elementLabel(element) === "voice" && voiceCatalog ? renderSelector({
+      value: inputValue,
+      voices: availableVoices,
+      readOnly,
+      locale,
+      onChange: (value2) => commit(updateOptionalElementProperty(document2, path, field.key, value2))
+    }) : field.multiline ? /* @__PURE__ */ React.createElement(
+      "textarea",
+      {
+        id: inputId,
+        value: inputValue,
+        readOnly,
+        onChange: (event) => commit(updateOptionalElementProperty(document2, path, field.key, event.target.value))
+      }
+    ) : /* @__PURE__ */ React.createElement(
+      "input",
+      {
+        id: inputId,
+        value: inputValue,
+        readOnly,
+        onChange: (event) => commit(updateOptionalElementProperty(document2, path, field.key, event.target.value))
+      }
+    ));
+  }));
+}
+function getElementAncestors(nodes, path, ancestors = []) {
+  const [index, ...rest] = path;
+  const node = nodes[index];
+  if (!node || !isElement(node)) return ancestors;
+  if (rest.length === 0) return ancestors;
+  return getElementAncestors(node.children ?? [], rest, [...ancestors, node]);
+}
+function buildVisualPreview(document2, leaf, selection) {
+  const start = Math.max(0, Math.min(selection.start, leaf.value.length));
+  const end = Math.max(start, Math.min(selection.end, leaf.value.length));
+  const value = start === end ? leaf.value : leaf.value.slice(start, end);
+  const ancestors = getElementAncestors(document2.children ?? [], leaf.path);
+  const children = ancestors.reduceRight(
+    (current, ancestor) => [{ ...ancestor, children: current }],
+    [value]
+  );
+  return buildSsml({ ...document2, children });
+}
 function addDialogTurn(document2, path) {
   return updateElementAtPath(document2, path, (element) => ({
     ...element,
@@ -6437,13 +6926,21 @@ function VisualSsmlEditor({
   document: document2,
   readOnly = false,
   onChange,
-  onPreviewSelection
+  onPreviewSelection,
+  locale = "en",
+  customInspectors,
+  renderVoiceSelector,
+  voiceCatalog,
+  voiceLocale,
+  voiceRegion,
+  voiceStyle
 }) {
   const [selectedPath, setSelectedPath] = (0, import_react3.useState)(null);
   const [selection, setSelection] = (0, import_react3.useState)({ start: 0, end: 0 });
   const textLeaves = (0, import_react3.useMemo)(() => collectTextLeaves(document2.children ?? []), [document2]);
   const selectedLeaf = textLeaves.find((leaf) => leaf.path.join(".") === selectedPath?.join(".")) ?? textLeaves[0];
   const selectedElement = selectedPath ? getNodeAtPath(document2.children ?? [], selectedPath) : void 0;
+  const selectedCustomInspector = selectedElement && isElement(selectedElement) ? customInspectors?.[elementLabel(selectedElement)] ?? customInspectors?.[selectedElement.type] : void 0;
   const diagnostics = (0, import_react3.useMemo)(() => validateAzureSsml(buildSsml(document2)), [document2]);
   const commit = (nextDocument) => onChange?.(nextDocument);
   const applyWrapper = (tag, attributes) => {
@@ -6461,29 +6958,43 @@ function VisualSsmlEditor({
       selectedPath,
       onSelect: setSelectedPath
     }
-  )))), /* @__PURE__ */ React.createElement("div", { className: "ssml-editor-visual-form" }, selectedElement && isElement(selectedElement) && selectedElement.type === "mstts:dialog" ? /* @__PURE__ */ React.createElement("fieldset", null, /* @__PURE__ */ React.createElement("legend", null, "Dialog"), /* @__PURE__ */ React.createElement("p", null, "Add and edit speaker turns in this dialog."), /* @__PURE__ */ React.createElement(
+  )))), /* @__PURE__ */ React.createElement("div", { className: "ssml-editor-visual-form" }, selectedCustomInspector && selectedElement && isElement(selectedElement) ? selectedCustomInspector({
+    document: document2,
+    element: selectedElement,
+    path: selectedPath ?? [],
+    readOnly,
+    onChange: commit,
+    locale
+  }) : selectedElement && isElement(selectedElement) && selectedElement.type === "mstts:dialog" ? /* @__PURE__ */ React.createElement("fieldset", null, /* @__PURE__ */ React.createElement("legend", null, localizedElementLabel(selectedElement, locale)), /* @__PURE__ */ React.createElement("p", null, SSML_ELEMENT_COPY[locale][elementLabel(selectedElement)]?.description), /* @__PURE__ */ React.createElement(
     "button",
     {
       type: "button",
       disabled: readOnly,
       onClick: () => commit(addDialogTurn(document2, selectedPath ?? []))
     },
-    "Add turn"
-  )) : selectedElement && isElement(selectedElement) && selectedElement.type === "mstts:turn" ? /* @__PURE__ */ React.createElement("fieldset", null, /* @__PURE__ */ React.createElement("legend", null, "Dialog turn"), /* @__PURE__ */ React.createElement("label", null, "Voice", /* @__PURE__ */ React.createElement(
+    locale === "ja" ? "\u30BF\u30FC\u30F3\u3092\u8FFD\u52A0" : "Add turn"
+  )) : selectedElement && isElement(selectedElement) && selectedElement.type === "mstts:turn" ? /* @__PURE__ */ React.createElement("fieldset", null, /* @__PURE__ */ React.createElement("legend", null, localizedElementLabel(selectedElement, locale)), /* @__PURE__ */ React.createElement("label", { htmlFor: "ssml-visual-turn-voice" }, locale === "ja" ? "\u97F3\u58F0" : "Voice", voiceCatalog ? (renderVoiceSelector ?? DefaultVoiceSelector)({
+    value: selectedElement.voice ?? "",
+    voices: filteredVoices(voiceCatalog, voiceLocale, voiceRegion, voiceStyle),
+    readOnly,
+    locale,
+    onChange: (value) => commit(updateOptionalElementProperty(document2, selectedPath ?? [], "voice", value))
+  }) : /* @__PURE__ */ React.createElement(
     "input",
     {
+      id: "ssml-visual-turn-voice",
       value: selectedElement.voice ?? "",
       readOnly,
       onChange: (event) => commit(updateOptionalElementProperty(document2, selectedPath ?? [], "voice", event.target.value))
     }
-  )), /* @__PURE__ */ React.createElement("label", null, "Speaker", /* @__PURE__ */ React.createElement(
+  )), /* @__PURE__ */ React.createElement("label", null, locale === "ja" ? "\u8A71\u8005" : "Speaker", /* @__PURE__ */ React.createElement(
     "input",
     {
       value: selectedElement.speaker ?? "",
       readOnly,
       onChange: (event) => commit(updateOptionalElementProperty(document2, selectedPath ?? [], "speaker", event.target.value))
     }
-  )), /* @__PURE__ */ React.createElement("label", null, "Turn text", /* @__PURE__ */ React.createElement(
+  )), /* @__PURE__ */ React.createElement("label", null, locale === "ja" ? "\u767A\u8A71\u30C6\u30AD\u30B9\u30C8" : "Turn text", /* @__PURE__ */ React.createElement(
     "textarea",
     {
       value: selectedElement.children?.filter((child) => typeof child === "string").join("") ?? "",
@@ -6496,35 +7007,51 @@ function VisualSsmlEditor({
         )
       )
     }
-  ))) : selectedElement && isElement(selectedElement) && selectedElement.type === "mstts:backgroundaudio" ? /* @__PURE__ */ React.createElement("fieldset", null, /* @__PURE__ */ React.createElement("legend", null, "Background audio"), /* @__PURE__ */ React.createElement("label", null, "Source URL", /* @__PURE__ */ React.createElement(
+  ))) : selectedElement && isElement(selectedElement) && selectedElement.type === "mstts:backgroundaudio" ? /* @__PURE__ */ React.createElement("fieldset", null, /* @__PURE__ */ React.createElement("legend", null, localizedElementLabel(selectedElement, locale)), /* @__PURE__ */ React.createElement("label", null, locale === "ja" ? "\u97F3\u58F0 URL" : "Source URL", /* @__PURE__ */ React.createElement(
     "input",
     {
       value: selectedElement.src ?? "",
       readOnly,
       onChange: (event) => commit(updateOptionalElementProperty(document2, selectedPath ?? [], "src", event.target.value))
     }
-  )), /* @__PURE__ */ React.createElement("label", null, "Volume", /* @__PURE__ */ React.createElement(
+  )), /* @__PURE__ */ React.createElement("label", null, locale === "ja" ? "\u97F3\u91CF" : "Volume", /* @__PURE__ */ React.createElement(
     "input",
     {
       value: selectedElement.volume === void 0 ? "" : String(selectedElement.volume),
       readOnly,
       onChange: (event) => commit(updateOptionalElementProperty(document2, selectedPath ?? [], "volume", event.target.value))
     }
-  )), /* @__PURE__ */ React.createElement("label", null, "Fade in", /* @__PURE__ */ React.createElement(
+  )), /* @__PURE__ */ React.createElement("label", null, locale === "ja" ? "\u30D5\u30A7\u30FC\u30C9\u30A4\u30F3" : "Fade in", /* @__PURE__ */ React.createElement(
     "input",
     {
       value: selectedElement.fadeIn === void 0 ? "" : String(selectedElement.fadeIn),
       readOnly,
       onChange: (event) => commit(updateOptionalElementProperty(document2, selectedPath ?? [], "fadeIn", event.target.value))
     }
-  )), /* @__PURE__ */ React.createElement("label", null, "Fade out", /* @__PURE__ */ React.createElement(
+  )), /* @__PURE__ */ React.createElement("label", null, locale === "ja" ? "\u30D5\u30A7\u30FC\u30C9\u30A2\u30A6\u30C8" : "Fade out", /* @__PURE__ */ React.createElement(
     "input",
     {
       value: selectedElement.fadeOut === void 0 ? "" : String(selectedElement.fadeOut),
       readOnly,
       onChange: (event) => commit(updateOptionalElementProperty(document2, selectedPath ?? [], "fadeOut", event.target.value))
     }
-  ))) : selectedLeaf ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("label", null, "Text", /* @__PURE__ */ React.createElement(
+  ))) : selectedElement && isElement(selectedElement) ? /* @__PURE__ */ React.createElement(
+    VisualElementInspector,
+    {
+      document: document2,
+      element: selectedElement,
+      path: selectedPath ?? [],
+      readOnly,
+      commit,
+      locale,
+      customInspector: customInspectors?.[elementLabel(selectedElement)] ?? customInspectors?.[selectedElement.type],
+      renderVoiceSelector,
+      voiceCatalog,
+      voiceLocale,
+      voiceRegion,
+      voiceStyle
+    }
+  ) : selectedLeaf ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("label", null, "Text", /* @__PURE__ */ React.createElement(
     "textarea",
     {
       value: selectedLeaf.value,
@@ -6552,7 +7079,7 @@ function VisualSsmlEditor({
     "button",
     {
       type: "button",
-      onClick: () => onPreviewSelection(buildSsml({ ...document2, children: [selectedLeaf.value] }))
+      onClick: () => onPreviewSelection(buildVisualPreview(document2, selectedLeaf, selection))
     },
     "Preview selection"
   ))) : /* @__PURE__ */ React.createElement("p", null, "Select an element or text node to edit it."))));
@@ -7140,6 +7667,12 @@ var SsmlEditor = (0, import_react4.forwardRef)(function SsmlEditor2({
   insertionGroups,
   customInsertions,
   additionalInsertions,
+  customInspectors,
+  renderVoiceSelector,
+  voiceCatalog,
+  voiceLocale,
+  voiceRegion,
+  voiceStyle,
   emotionStyles,
   className,
   style,
@@ -7531,7 +8064,14 @@ var SsmlEditor = (0, import_react4.forwardRef)(function SsmlEditor2({
         document: draftDocument,
         readOnly: isReadOnly,
         onChange: commit,
-        onPreviewSelection
+        onPreviewSelection,
+        locale: localeProp ?? languageProp,
+        customInspectors,
+        renderVoiceSelector,
+        voiceCatalog,
+        voiceLocale,
+        voiceRegion,
+        voiceStyle
       }
     )) : /* @__PURE__ */ React.createElement("div", { style: { ...editorStyles.editor, minHeight: editorMinHeight } }, /* @__PURE__ */ React.createElement(
       import_react5.default,
@@ -7592,6 +8132,7 @@ var SsmlEditor = (0, import_react4.forwardRef)(function SsmlEditor2({
 0 && (module.exports = {
   EDITOR_COPY,
   INLINE_BADGE_COPY,
+  SSML_ELEMENT_COPY,
   SSML_HOVER_COPY,
   SSML_INSERTIONS,
   SsmlEditor,