@rimelight/cms 0.0.4 → 0.0.5

package/src/client/components/editors/DialogueEditor.tsx

@@ -11,10 +11,10 @@ export const DialogueEditor: Component<DialogueEditorProps> = (componentProps) =
   const saveProps = (character?: string, parenthetical?: string, line?: string) => {
     componentProps.onPropsChange({
       ...componentProps.props,
-      character: character !== undefined ? character : componentProps.props.character || "",
+      character: character !== undefined ? character : componentProps.props["character"] || "",
       parenthetical:
-        parenthetical !== undefined ? parenthetical : componentProps.props.parenthetical || "",
-      line: line !== undefined ? line : componentProps.props.line || ""
+        parenthetical !== undefined ? parenthetical : componentProps.props["parenthetical"] || "",
+      line: line !== undefined ? line : componentProps.props["line"] || ""
     })
   }
 
@@ -23,7 +23,7 @@ export const DialogueEditor: Component<DialogueEditorProps> = (componentProps) =
       <div class="w-48 mx-auto">
         <RLSInput
           data-field="character"
-          value={componentProps.props.character || ""}
+          value={componentProps.props["character"] || ""}
           onBlur={(e) => saveProps(e.currentTarget.value)}
           class="text-center font-bold text-sm uppercase"
           placeholder="CHARACTER"
@@ -33,7 +33,7 @@ export const DialogueEditor: Component<DialogueEditorProps> = (componentProps) =
       <div class="w-64 mx-auto">
         <RLSInput
           data-field="parenthetical"
-          value={componentProps.props.parenthetical || ""}
+          value={componentProps.props["parenthetical"] || ""}
           onBlur={(e) => saveProps(undefined, e.currentTarget.value)}
           class="text-center italic text-sm"
           placeholder="(parenthetical)"
@@ -42,7 +42,7 @@ export const DialogueEditor: Component<DialogueEditorProps> = (componentProps) =
       </div>
       <RLSTextarea
         data-field="line"
-        value={componentProps.props.line || ""}
+        value={componentProps.props["line"] || ""}
         onBlur={(e) => saveProps(undefined, undefined, e.currentTarget.value)}
         placeholder="Dialogue line..."
         rows={2}

package/src/client/components/editors/FileTreeEditor.tsx

@@ -10,7 +10,7 @@ export const FileTreeEditor: Component<FileTreeEditorProps> = (componentProps) =
   let jsonTextarea: HTMLTextAreaElement | undefined
 
   const tree = (): FileTreeNode[] =>
-    componentProps.props.tree || [
+    componentProps.props["tree"] || [
       { name: "src", isDir: true, children: [{ name: "index.ts", isDir: false }] },
       { name: "package.json", isDir: false }
     ]

package/src/client/components/editors/ImageEditor.tsx

@@ -10,9 +10,9 @@ export const ImageEditor: Component<ImageEditorProps> = (componentProps) => {
   const saveProps = (src?: string, alt?: string, caption?: string) => {
     componentProps.onPropsChange({
       ...componentProps.props,
-      src: src !== undefined ? src : componentProps.props.src || "",
-      alt: alt !== undefined ? alt : componentProps.props.alt || "",
-      caption: caption !== undefined ? caption : componentProps.props.caption || ""
+      src: src !== undefined ? src : componentProps.props["src"] || "",
+      alt: alt !== undefined ? alt : componentProps.props["alt"] || "",
+      caption: caption !== undefined ? caption : componentProps.props["caption"] || ""
     })
   }
 
@@ -23,7 +23,7 @@ export const ImageEditor: Component<ImageEditorProps> = (componentProps) => {
         <RLSInput
           id="image-src-input"
           type="text"
-          value={componentProps.props.src || ""}
+          value={componentProps.props["src"] || ""}
           onBlur={(e) => saveProps(e.currentTarget.value)}
           placeholder="https://..."
           leadingIcon="image"
@@ -36,7 +36,7 @@ export const ImageEditor: Component<ImageEditorProps> = (componentProps) => {
           <RLSInput
             id="image-alt-input"
             type="text"
-            value={componentProps.props.alt || ""}
+            value={componentProps.props["alt"] || ""}
             onBlur={(e) => saveProps(undefined, e.currentTarget.value)}
             placeholder="Alt description"
             size="sm"
@@ -48,7 +48,7 @@ export const ImageEditor: Component<ImageEditorProps> = (componentProps) => {
           <RLSInput
             id="image-caption-input"
             type="text"
-            value={componentProps.props.caption || ""}
+            value={componentProps.props["caption"] || ""}
             onBlur={(e) => saveProps(undefined, undefined, e.currentTarget.value)}
             placeholder="Image caption"
             size="sm"
@@ -56,11 +56,11 @@ export const ImageEditor: Component<ImageEditorProps> = (componentProps) => {
         </div>
       </div>
 
-      {componentProps.props.src && (
+      {componentProps.props["src"] && (
         <div class="mt-2 flex justify-center p-2 rounded-lg border border-default">
           <img
-            src={componentProps.props.src}
-            alt={componentProps.props.alt || "Image preview"}
+            src={componentProps.props["src"]}
+            alt={componentProps.props["alt"] || "Image preview"}
             class="max-h-48 object-cover rounded shadow-sm"
           />
         </div>

package/src/client/components/editors/ParagraphEditor.tsx

@@ -155,7 +155,7 @@ export const ParagraphEditor: Component<ParagraphEditorProps> = (componentProps)
 
   onMount(() => {
     if (!editableDiv) return
-    const text = componentProps.props.text
+    const text = componentProps.props["text"]
     if (!text) {
       editableDiv.innerHTML = ""
     } else if (Array.isArray(text)) {

package/src/client/components/editors/SceneEditor.tsx

@@ -41,13 +41,13 @@ export const SceneEditor: Component<SceneEditorProps> = (componentProps) => {
     if (typeof componentProps.children === "function") {
       return componentProps.children() || []
     }
-    return componentProps.children || componentProps.props.children || []
+    return componentProps.children || componentProps.props["children"] || []
   }
 
   const slugText = () => {
-    const setting = componentProps.props.setting || "INT."
-    const loc = (componentProps.props.location || "LOCATION").toUpperCase()
-    const time = componentProps.props.timeOfDay || "MORNING"
+    const setting = componentProps.props["setting"] || "INT."
+    const loc = (componentProps.props["location"] || "LOCATION").toUpperCase()
+    const time = componentProps.props["timeOfDay"] || "MORNING"
     return `${setting} ${loc} - ${time}`
   }
 
@@ -114,7 +114,7 @@ export const SceneEditor: Component<SceneEditorProps> = (componentProps) => {
           <RLSInput
             id="scene-location-input"
             data-field="location"
-            value={componentProps.props.location || ""}
+            value={componentProps.props["location"] || ""}
             onBlur={(e) => saveProps({ location: e.currentTarget.value })}
             placeholder="E.g. LIVING ROOM"
             size="sm"
@@ -125,7 +125,7 @@ export const SceneEditor: Component<SceneEditorProps> = (componentProps) => {
           <span class="text-xs font-semibold text-muted uppercase tracking-wide">Setting</span>
           <RLSSelect
             items={SETTINGS}
-            value={componentProps.props.setting || "INT."}
+            value={componentProps.props["setting"] || "INT."}
             onChange={(e) => saveProps({ setting: e.currentTarget.value })}
             size="sm"
           />
@@ -135,7 +135,7 @@ export const SceneEditor: Component<SceneEditorProps> = (componentProps) => {
           <span class="text-xs font-semibold text-muted uppercase tracking-wide">Time of Day</span>
           <RLSSelect
             items={TIMES_OF_DAY}
-            value={componentProps.props.timeOfDay || "MORNING"}
+            value={componentProps.props["timeOfDay"] || "MORNING"}
             onChange={(e) => saveProps({ timeOfDay: e.currentTarget.value })}
             size="sm"
           />
@@ -149,7 +149,7 @@ export const SceneEditor: Component<SceneEditorProps> = (componentProps) => {
         <RLSTextarea
           id="scene-description-textarea"
           data-field="description"
-          value={componentProps.props.description || ""}
+          value={componentProps.props["description"] || ""}
           onBlur={(e) => saveProps({ description: e.currentTarget.value })}
           placeholder="Action lines..."
           rows={3}
@@ -163,7 +163,7 @@ export const SceneEditor: Component<SceneEditorProps> = (componentProps) => {
         <div class="w-48">
           <RLSSelect
             items={TRANSITIONS}
-            value={componentProps.props.transition || "NONE"}
+            value={componentProps.props["transition"] || "NONE"}
             onChange={(e) => saveProps({ transition: e.currentTarget.value })}
             size="sm"
           />

package/src/client/components/editors/ScriptEditor.tsx

@@ -22,12 +22,12 @@ export const ScriptEditor: Component<ScriptEditorProps> = (componentProps) => {
   let childrenContainer: HTMLDivElement | null = null as HTMLDivElement | null
   let sortableInstance: any = null
 
-  const characters = (): string[] => componentProps.props.characters || []
+  const characters = (): string[] => componentProps.props["characters"] || []
   const childrenBlocks = (): BaseBlock[] => {
     if (typeof componentProps.children === "function") {
       return componentProps.children() || []
     }
-    return componentProps.children || componentProps.props.children || []
+    return componentProps.children || componentProps.props["children"] || []
   }
 
   onMount(() => {
@@ -96,7 +96,7 @@ export const ScriptEditor: Component<ScriptEditorProps> = (componentProps) => {
         <span class="text-xs font-bold text-muted uppercase tracking-widest">Script Title</span>
         <RLSInput
           data-field="title"
-          value={componentProps.props.title || ""}
+          value={componentProps.props["title"] || ""}
           onInput={(e) => saveProps({ title: e.currentTarget.value })}
           placeholder="Script Title"
           size="sm"
@@ -107,7 +107,7 @@ export const ScriptEditor: Component<ScriptEditorProps> = (componentProps) => {
         <span class="text-xs font-bold text-muted uppercase tracking-widest">Synopsis</span>
         <RLSTextarea
           data-field="synopsis"
-          value={componentProps.props.synopsis || ""}
+          value={componentProps.props["synopsis"] || ""}
           onInput={(e) => saveProps({ synopsis: e.currentTarget.value })}
           placeholder="Synopsis..."
           rows={2}
@@ -167,21 +167,21 @@ export const ScriptEditor: Component<ScriptEditorProps> = (componentProps) => {
         <div class="grid grid-cols-3 gap-2">
           <RLSInput
             data-field="aPlot"
-            value={componentProps.props.aPlot || ""}
+            value={componentProps.props["aPlot"] || ""}
             onInput={(e) => saveProps({ aPlot: e.currentTarget.value })}
             placeholder="A-Plot"
             size="sm"
           />
           <RLSInput
             data-field="bPlot"
-            value={componentProps.props.bPlot || ""}
+            value={componentProps.props["bPlot"] || ""}
             onInput={(e) => saveProps({ bPlot: e.currentTarget.value })}
             placeholder="B-Plot"
             size="sm"
           />
           <RLSInput
             data-field="cPlot"
-            value={componentProps.props.cPlot || ""}
+            value={componentProps.props["cPlot"] || ""}
             onInput={(e) => saveProps({ cPlot: e.currentTarget.value })}
             placeholder="C-Plot"
             size="sm"
@@ -193,7 +193,7 @@ export const ScriptEditor: Component<ScriptEditorProps> = (componentProps) => {
         <span class="text-xs font-bold text-muted uppercase tracking-widest">Stinger</span>
         <RLSInput
           data-field="stinger"
-          value={componentProps.props.stinger || ""}
+          value={componentProps.props["stinger"] || ""}
           onInput={(e) => saveProps({ stinger: e.currentTarget.value })}
           placeholder="Stinger (post-credits etc)"
           size="sm"

package/src/client/components/editors/SectionEditor.tsx

@@ -26,7 +26,7 @@ export const SectionEditor: Component<SectionEditorProps> = (componentProps) =>
     if (typeof componentProps.children === "function") {
       return componentProps.children() || []
     }
-    return componentProps.children || componentProps.props.children || []
+    return componentProps.children || componentProps.props["children"] || []
   }
 
   onMount(() => {
@@ -84,7 +84,7 @@ export const SectionEditor: Component<SectionEditorProps> = (componentProps) =>
         <input
           ref={(el) => (titleInput = el)}
           type="text"
-          value={componentProps.props.title || ""}
+          value={componentProps.props["title"] || ""}
           onInput={saveProps}
           placeholder="Section Title"
           class="flex-1 font-bold text-lg bg-transparent border-0 focus:outline-none text-highlighted placeholder:text-muted/60 py-0.5"
@@ -94,7 +94,7 @@ export const SectionEditor: Component<SectionEditorProps> = (componentProps) =>
       <input
         ref={(el) => (descInput = el)}
         type="text"
-        value={componentProps.props.description || ""}
+        value={componentProps.props["description"] || ""}
         onInput={saveProps}
         placeholder="Section description (optional)..."
         class="text-sm text-muted bg-transparent border-0 focus:outline-none placeholder:text-muted/50 py-0.5"

package/src/client/components/editors/StepItemEditor.tsx

@@ -23,7 +23,7 @@ export const StepItemEditor: Component<StepItemEditorProps> = (componentProps) =
     if (typeof componentProps.children === "function") {
       return componentProps.children() || []
     }
-    return componentProps.children || componentProps.props.children || []
+    return componentProps.children || componentProps.props["children"] || []
   }
 
   onMount(() => {
@@ -65,8 +65,9 @@ export const StepItemEditor: Component<StepItemEditorProps> = (componentProps) =
   const saveMeta = (title?: string, description?: string) => {
     componentProps.onPropsChange({
       ...componentProps.props,
-      title: title !== undefined ? title : componentProps.props.title || "",
-      description: description !== undefined ? description : componentProps.props.description || ""
+      title: title !== undefined ? title : componentProps.props["title"] || "",
+      description:
+        description !== undefined ? description : componentProps.props["description"] || ""
     })
   }
 
@@ -76,14 +77,14 @@ export const StepItemEditor: Component<StepItemEditorProps> = (componentProps) =
         <RLSInput
           type="text"
           placeholder="Step title (e.g. Install Dependencies)"
-          value={componentProps.props.title || ""}
+          value={componentProps.props["title"] || ""}
           onBlur={(e) => saveMeta(e.currentTarget.value, undefined)}
           size="sm"
         />
         <RLSInput
           type="text"
           placeholder="Step description (optional)"
-          value={componentProps.props.description || ""}
+          value={componentProps.props["description"] || ""}
           onBlur={(e) => saveMeta(undefined, e.currentTarget.value)}
           size="sm"
         />

package/src/client/components/editors/StepsEditor.tsx

@@ -22,7 +22,7 @@ export const StepsEditor: Component<StepsEditorProps> = (componentProps) => {
     if (typeof componentProps.children === "function") {
       return componentProps.children() || []
     }
-    return componentProps.children || componentProps.props.children || []
+    return componentProps.children || componentProps.props["children"] || []
   }
 
   onMount(() => {

package/src/client/components/editors/TabItemEditor.tsx

@@ -23,7 +23,7 @@ export const TabItemEditor: Component<TabItemEditorProps> = (componentProps) =>
     if (typeof componentProps.children === "function") {
       return componentProps.children() || []
     }
-    return componentProps.children || componentProps.props.children || []
+    return componentProps.children || componentProps.props["children"] || []
   }
 
   onMount(() => {
@@ -66,7 +66,7 @@ export const TabItemEditor: Component<TabItemEditorProps> = (componentProps) =>
     componentProps.onPropsChange({
       ...componentProps.props,
       label,
-      value: componentProps.props.value || label.toLowerCase().replace(/\s+/g, "-")
+      value: componentProps.props["value"] || label.toLowerCase().replace(/\s+/g, "-")
     })
   }
 
@@ -78,7 +78,7 @@ export const TabItemEditor: Component<TabItemEditorProps> = (componentProps) =>
           <RLSInput
             type="text"
             placeholder="e.g. pnpm, Astro, TypeScript"
-            value={componentProps.props.label || ""}
+            value={componentProps.props["label"] || ""}
             onBlur={(e) => saveLabel(e.currentTarget.value)}
             size="sm"
           />

package/src/client/components/editors/TableEditor.tsx

@@ -10,20 +10,20 @@ export interface TableEditorProps {
 
 export const TableEditor: Component<TableEditorProps> = (componentProps) => {
   const columns = (): TableColumnDef[] =>
-    componentProps.props.columns || [
+    componentProps.props["columns"] || [
       { key: "col1", header: "Header 1", align: "left" },
       { key: "col2", header: "Header 2", align: "left" }
     ]
 
   const rows = (): Record<string, string>[] =>
-    componentProps.props.rows || [{ col1: "Cell 1", col2: "Cell 2" }]
+    componentProps.props["rows"] || [{ col1: "Cell 1", col2: "Cell 2" }]
 
   const save = (newCols: TableColumnDef[], newRows: Record<string, string>[], caption?: string) => {
     componentProps.onPropsChange({
       ...componentProps.props,
       columns: newCols,
       rows: newRows,
-      caption: caption !== undefined ? caption : componentProps.props.caption || ""
+      caption: caption !== undefined ? caption : componentProps.props["caption"] || ""
     })
   }
 
@@ -172,7 +172,7 @@ export const TableEditor: Component<TableEditorProps> = (componentProps) => {
       <RLSInput
         type="text"
         placeholder="Table caption (optional)"
-        value={componentProps.props.caption || ""}
+        value={componentProps.props["caption"] || ""}
         onBlur={(e) => save(columns(), rows(), e.currentTarget.value)}
         size="sm"
       />

package/src/client/components/editors/TabsEditor.tsx

@@ -22,7 +22,7 @@ export const TabsEditor: Component<TabsEditorProps> = (componentProps) => {
     if (typeof componentProps.children === "function") {
       return componentProps.children() || []
     }
-    return componentProps.children || componentProps.props.children || []
+    return componentProps.children || componentProps.props["children"] || []
   }
 
   onMount(() => {

package/src/client/state/editor-store.ts

@@ -20,7 +20,7 @@ function findBlockInfo(
     }
     const isSec = b.type === "SectionBlock"
     const nextDepth = isSec ? currentDepth + 1 : currentDepth
-    const children = b.children || b.props?.children
+    const children = b.children || b.props?.["children"]
     if (Array.isArray(children)) {
       const found = findBlockInfo(children, targetId, nextDepth)
       if (found) {
@@ -37,7 +37,7 @@ function findBlockInfo(
 function getMaxSubtreeSectionHeight(b: BaseBlock | null): number {
   if (!b) return 0
   const isSec = b.type === "SectionBlock"
-  const children = b.children || b.props?.children
+  const children = b.children || b.props?.["children"]
   let maxChildHeight = 0
   if (Array.isArray(children)) {
     for (const c of children) {
@@ -106,13 +106,13 @@ export function createEditorState(
         if (!item) continue
         if (item.id === id) {
           item.props = { ...item.props, ...newProps }
-          if (newProps.children !== undefined) {
-            item.children = newProps.children
-            item.props.children = newProps.children
+          if (newProps["children"] !== undefined) {
+            item.children = newProps["children"]
+            item.props["children"] = newProps["children"]
           }
           return true
         }
-        const childrenList = item.children || item.props?.children
+        const childrenList = item.children || item.props?.["children"]
         if (childrenList && findAndUpdate(childrenList)) {
           return true
         }
@@ -148,8 +148,8 @@ export function createEditorState(
         if (b.children) {
           b.children = removeFromList(b.children)
         }
-        if (b.props?.children) {
-          b.props.children = removeFromList(b.props.children)
+        if (b.props?.["children"]) {
+          b.props["children"] = removeFromList(b.props["children"])
         }
         return true
       })
@@ -172,10 +172,10 @@ export function createEditorState(
         }
       }
       for (const item of list) {
-        const children = item.children || item.props?.children
+        const children = item.children || item.props?.["children"]
         if (children && findAndMove(children)) {
           item.children = children
-          item.props.children = children
+          item.props["children"] = children
           return true
         }
       }
@@ -200,10 +200,10 @@ export function createEditorState(
         return true
       }
       for (const item of list) {
-        const children = item.children || item.props?.children
+        const children = item.children || item.props?.["children"]
         if (children && findAndDup(children)) {
           item.children = children
-          item.props.children = children
+          item.props["children"] = children
           return true
         }
       }
@@ -259,23 +259,23 @@ export function createEditorState(
       if (parentId) {
         for (const item of list) {
           if (item.id === parentId) {
-            const children = item.children || item.props?.children || []
+            const children = item.children || item.props?.["children"] || []
             if (position === "after") {
               children.push(newBlock)
             } else {
               children.unshift(newBlock)
             }
             item.children = children
-            item.props.children = children
+            item.props["children"] = children
             return true
           }
         }
       }
       for (const item of list) {
-        const children = item.children || item.props?.children
+        const children = item.children || item.props?.["children"]
         if (children && insertIntoList(children)) {
           item.children = children
-          item.props.children = children
+          item.props["children"] = children
           return true
         }
       }
@@ -319,10 +319,10 @@ export function createEditorState(
         }
         if (b.children) {
           b.children = remove(b.children)
-          if (b.props) b.props.children = b.children
-        } else if (b.props?.children) {
-          b.props.children = remove(b.props.children)
-          b.children = b.props.children
+          if (b.props) b.props["children"] = b.children
+        } else if (b.props?.["children"]) {
+          b.props["children"] = remove(b.props["children"])
+          b.children = b.props["children"]
         }
         return true
       })
@@ -361,14 +361,14 @@ export function createEditorState(
       const insertIntoTarget = (list: BaseBlock[]): boolean => {
         for (const item of list) {
           if (item.id === targetParentId) {
-            const children = item.children || item.props?.children || []
+            const children = item.children || item.props?.["children"] || []
             const idx = Math.min(Math.max(0, newIndex), children.length)
             children.splice(idx, 0, extractedBlock!)
             item.children = children
-            item.props.children = children
+            item.props["children"] = children
             return true
           }
-          const sub = item.children || item.props?.children
+          const sub = item.children || item.props?.["children"]
           if (sub && insertIntoTarget(sub)) return true
         }
         return false

package/src/client/utils/sortable.ts

@@ -2,8 +2,8 @@ import Sortable from "sortablejs"
 
 const sortableProto: Record<string, any> | undefined = Sortable?.prototype
 
-if (typeof window !== "undefined" && sortableProto && !sortableProto.patchedParentNodeGuard) {
-  sortableProto.patchedParentNodeGuard = true
+if (typeof window !== "undefined" && sortableProto && !sortableProto["patchedParentNodeGuard"]) {
+  sortableProto["patchedParentNodeGuard"] = true
   const originalOnDragOver = sortableProto["_onDragOver"]
   if (typeof originalOnDragOver === "function") {
     sortableProto["_onDragOver"] = function (evt: Event) {
@@ -109,10 +109,11 @@ export function initBlockSortable(container: HTMLElement, options: SortableOptio
     onAdd: (evt) => {
       runCleanup(evt.item)
       const itemEl = evt.item
-      const blockId = itemEl.dataset.id || itemEl.getAttribute("data-id")
+      const blockId = itemEl.dataset["id"] || itemEl.getAttribute("data-id")
       if (blockId && evt.newIndex !== undefined && options.onAdd) {
         const target = evt.from.closest("[data-block-id]")
-        const containerBlockId = target instanceof HTMLElement ? target.dataset.blockId : undefined
+        const containerBlockId =
+          target instanceof HTMLElement ? target.dataset["blockId"] : undefined
         // Remove the physically-moved DOM node before calling the callback.
         // The reactive framework (SolidJS) will re-render the authoritative element
         // from state, so leaving the SortableJS-placed node causes a visual duplicate.
@@ -123,7 +124,7 @@ export function initBlockSortable(container: HTMLElement, options: SortableOptio
     onRemove: (evt) => {
       runCleanup(evt.item)
       const itemEl = evt.item
-      const blockId = itemEl.dataset.id || itemEl.getAttribute("data-id")
+      const blockId = itemEl.dataset["id"] || itemEl.getAttribute("data-id")
       if (blockId && evt.oldIndex !== undefined && options.onRemove) {
         options.onRemove(blockId, evt.oldIndex)
       }
@@ -167,8 +168,8 @@ export function cleanAllSortableClasses(specificItem?: HTMLElement | Element) {
 }
 
 const customWin: Record<string, any> | null = typeof window !== "undefined" ? window : null
-if (customWin && !customWin.cmsSortableGlobalListenersAttached) {
-  customWin.cmsSortableGlobalListenersAttached = true
+if (customWin && !customWin["cmsSortableGlobalListenersAttached"]) {
+  customWin["cmsSortableGlobalListenersAttached"] = true
   const globalClean = () => {
     const doClean = () => cleanAllSortableClasses()
     doClean()
@@ -176,9 +177,9 @@ if (customWin && !customWin.cmsSortableGlobalListenersAttached) {
     setTimeout(doClean, 150)
     setTimeout(doClean, 300)
   }
-  customWin.addEventListener("mouseup", globalClean, { capture: true })
-  customWin.addEventListener("pointerup", globalClean, { capture: true })
-  customWin.addEventListener("touchend", globalClean, { capture: true })
-  customWin.addEventListener("dragend", globalClean, { capture: true })
-  customWin.addEventListener("drop", globalClean, { capture: true })
+  customWin["addEventListener"]("mouseup", globalClean, { capture: true })
+  customWin["addEventListener"]("pointerup", globalClean, { capture: true })
+  customWin["addEventListener"]("touchend", globalClean, { capture: true })
+  customWin["addEventListener"]("dragend", globalClean, { capture: true })
+  customWin["addEventListener"]("drop", globalClean, { capture: true })
 }

package/src/client/utils/tree-sanitizer.ts

@@ -2,7 +2,7 @@ import type { BaseBlock } from "../../core/types/blocks"
 
 export function getBlockChildren(b: BaseBlock): BaseBlock[] {
   if (!b) return []
-  if (Array.isArray(b.props?.children)) return b.props.children
+  if (Array.isArray(b.props?.["children"])) return b.props["children"]
   if (Array.isArray(b.children)) return b.children
   return []
 }