0.61.1

app/components/ContentEditable.tsx

@@ -42,7 +42,7 @@ const ContentEditable = React.forwardRef(
   ) => {
     const innerRef = React.useRef<HTMLSpanElement>(null);
     const ref = forwardedRef || innerRef;
-    const [innerHTML, setInnerHTML] = React.useState<string>(value);
+    const [innerValue, setInnerValue] = React.useState<string>(value);
     const lastValue = React.useRef("");
 
     const wrappedEvent = (
@@ -75,7 +75,7 @@ const ContentEditable = React.forwardRef(
 
     React.useEffect(() => {
       if (value !== ref.current?.innerText) {
-        setInnerHTML(value);
+        setInnerValue(value);
       }
     }, [value, ref]);
 
@@ -88,12 +88,12 @@ const ContentEditable = React.forwardRef(
           onBlur={wrappedEvent(onBlur)}
           onKeyDown={wrappedEvent(onKeyDown)}
           data-placeholder={placeholder}
+          suppressContentEditableWarning
           role="textbox"
-          dangerouslySetInnerHTML={{
-            __html: innerHTML,
-          }}
           {...rest}
-        />
+        >
+          {innerValue}
+        </Content>
         {children}
       </div>
     );

app/models/Document.ts

@@ -109,7 +109,7 @@ export default class Document extends BaseModel {
   @computed
   get dir(): "rtl" | "ltr" {
     const element = document.createElement("p");
-    element.innerHTML = this.title;
+    element.innerText = this.title;
     element.style.visibility = "hidden";
     element.dir = "auto";
 

package.json

@@ -288,5 +288,5 @@
     "dot-prop": "^5.2.0",
     "js-yaml": "^3.14.1"
   },
-  "version": "0.61.0"
+  "version": "0.61.1"
 }