Changes

Co-authored-by: renee-png <262607627+renee-png@users.noreply.github.com>

src/components/forms/custom-form-builder.tsx

@@ -473,6 +473,44 @@ export function CustomFormBuilder() {
     tmp.innerHTML = html;
     const out: Segment[] = [];
 
+    const LIST_INDENT = 24; // px per nesting level
+
+    const pushListItems = (
+      listEl: HTMLElement,
+      ordered: boolean,
+      depth: number,
+    ) => {
+      const items = Array.from(listEl.children).filter(
+        (c) => (c as HTMLElement).tagName.toLowerCase() === "li",
+      ) as HTMLElement[];
+      let n = 1;
+      for (const li of items) {
+        // Collect inline runs from this li, excluding nested lists.
+        const inlineNodes = Array.from(li.childNodes).filter((c) => {
+          if (c.nodeType !== Node.ELEMENT_NODE) return true;
+          const t = (c as HTMLElement).tagName.toLowerCase();
+          return t !== "ol" && t !== "ul";
+        });
+        const runs: InlineRun[] = [];
+        inlineNodes.forEach((n) => runs.push(...collectRuns(n)));
+        const merged = mergeRuns(runs);
+        out.push({
+          kind: "text",
+          runs: merged,
+          align: "left",
+          indent: depth * LIST_INDENT,
+          marker: ordered ? `${n}.` : "•",
+        });
+        n += 1;
+        // Recurse into any nested lists.
+        Array.from(li.children).forEach((child) => {
+          const tag = (child as HTMLElement).tagName.toLowerCase();
+          if (tag === "ol") pushListItems(child as HTMLElement, true, depth + 1);
+          else if (tag === "ul") pushListItems(child as HTMLElement, false, depth + 1);
+        });
+      }
+    };
+
     const pushBlock = (el: HTMLElement) => {
       const tag = el.tagName.toLowerCase();
       if (tag === "table") {
@@ -490,7 +528,9 @@ export function CustomFormBuilder() {
         out.push({ kind: "table", rows });
         return;
       }
-      if (["p", "h1", "h2", "h3", "li"].includes(tag)) {
+      if (tag === "ol") return pushListItems(el, true, 0);
+      if (tag === "ul") return pushListItems(el, false, 0);
+      if (["p", "h1", "h2", "h3"].includes(tag)) {
         const align = (el.style.textAlign as any) || "left";
         const indentPx = parseInt(el.style.paddingLeft || "0", 10) || 0;
         const caption = el.getAttribute("data-caption") === "true";
@@ -505,7 +545,7 @@ export function CustomFormBuilder() {
         });
         return;
       }
-      // Recurse into wrappers (lists, etc.)
+      // Recurse into wrappers we don't recognize.
       Array.from(el.children).forEach((child) => pushBlock(child as HTMLElement));
     };