ssml-builder-js 2.9.0 → 2.11.0

package/dist/react.mjs

@@ -45,7 +45,7 @@ import {
   updateTagAttribute,
   validateAzureSsml,
   validateSsml
-} from "./chunk-JNJVTEL6.mjs";
+} from "./chunk-FWWMWI2C.mjs";
 import "./chunk-6S5ODO6A.mjs";
 
 // packages/ssml-editor-react/src/SsmlEditor.tsx
@@ -1840,6 +1840,46 @@ function updateNodesAtPath(nodes, path, update) {
 function updateTextAtPath(document2, path, value) {
   return { ...document2, children: updateNodesAtPath(document2.children ?? [], path, () => value) };
 }
+function getNodeAtPath(nodes, path) {
+  let current;
+  let currentNodes = nodes;
+  for (const index of path) {
+    current = currentNodes[index];
+    if (current === void 0) return void 0;
+    if (!isElement(current)) {
+      currentNodes = [];
+    } else {
+      currentNodes = current.children ?? [];
+    }
+  }
+  return current;
+}
+function updateElementAtPath(document2, path, update) {
+  return {
+    ...document2,
+    children: updateNodesAtPath(document2.children ?? [], path, (node) => isElement(node) ? update(node) : node)
+  };
+}
+function updateElementText(element, value) {
+  return { ...element, children: [value] };
+}
+function updateOptionalElementProperty(document2, path, property, value) {
+  return updateElementAtPath(document2, path, (element) => {
+    const next = { ...element };
+    if (value.trim()) next[property] = value;
+    else delete next[property];
+    return next;
+  });
+}
+function addDialogTurn(document2, path) {
+  return updateElementAtPath(document2, path, (element) => ({
+    ...element,
+    children: [
+      ...element.children ?? [],
+      { type: "mstts:turn", voice: "en-US-JennyNeural", children: ["New dialog turn"] }
+    ]
+  }));
+}
 function wrapTextAtPath(document2, path, start, end, tag, attributes) {
   return {
     ...document2,
@@ -1891,6 +1931,7 @@ function VisualSsmlEditor({
   const [selection, setSelection] = useState2({ start: 0, end: 0 });
   const textLeaves = 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 diagnostics = useMemo(() => validateAzureSsml(buildSsml(document2)), [document2]);
   const commit = (nextDocument) => onChange?.(nextDocument);
   const applyWrapper = (tag, attributes) => {
@@ -1908,7 +1949,70 @@ function VisualSsmlEditor({
       selectedPath,
       onSelect: setSelectedPath
     }
-  )))), /* @__PURE__ */ React.createElement("div", { className: "ssml-editor-visual-form" }, selectedLeaf ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("label", null, "Text", /* @__PURE__ */ React.createElement(
+  )))), /* @__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(
+    "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(
+    "input",
+    {
+      value: selectedElement.voice ?? "",
+      readOnly,
+      onChange: (event) => commit(updateOptionalElementProperty(document2, selectedPath ?? [], "voice", event.target.value))
+    }
+  )), /* @__PURE__ */ React.createElement("label", null, "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(
+    "textarea",
+    {
+      value: selectedElement.children?.filter((child) => typeof child === "string").join("") ?? "",
+      readOnly,
+      onChange: (event) => commit(
+        updateElementAtPath(
+          document2,
+          selectedPath ?? [],
+          (element) => updateElementText(element, event.target.value)
+        )
+      )
+    }
+  ))) : 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(
+    "input",
+    {
+      value: selectedElement.src ?? "",
+      readOnly,
+      onChange: (event) => commit(updateOptionalElementProperty(document2, selectedPath ?? [], "src", event.target.value))
+    }
+  )), /* @__PURE__ */ React.createElement("label", null, "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(
+    "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(
+    "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(
     "textarea",
     {
       value: selectedLeaf.value,