refactor(bem): replace Block/Elem with cn() in RichText/view.jsx

Migrated RichText tag component from Block/Elem to cn() helper.
- Removed Block/Elem from imports (cn was already imported)
- Replaced <Block name="richtext" tag={ObjectTag}> with <ObjectTag className={cn("richtext")...}>
- Replaced <Elem name="container"> with <div className={cn("richtext").elem("container")...}>
- Replaced <Elem name="loading"> with <div className={cn("richtext").elem("loading")...}>
- Replaced <Elem name="iframe" tag="iframe"> with <iframe className={cn("richtext").elem("iframe")...}>
- Preserved refs, mods, className="htx-richtext" via .mix(), dangerouslySetInnerHTML, and all props
- Added type assertion for loading ref
- Handles both inline and iframe rendering modes
- No behavior change, equivalent class strings

Author: luarmr

web/libs/editor/src/tags/object/RichText/view.jsx

@@ -9,7 +9,7 @@ import * as xpath from "xpath-range";
 import ObjectTag from "../../../components/Tags/Object";
 import { STATE_CLASS_MODS } from "../../../mixins/HighlightMixin";
 import Utils from "../../../utils";
-import { Block, cn, Elem } from "../../../utils/bem";
+import { cn } from "../../../utils/bem";
 import { htmlEscape, matchesSelector } from "../../../utils/html";
 import {
   applyTextGranularity,
@@ -558,44 +558,40 @@ class RichTextPieceView extends Component {
       };
 
       return (
-        <Block name="richtext" tag={ObjectTag} item={item}>
-          <Elem
+        <ObjectTag item={item} className={cn("richtext").toClassName()}>
+          <div
             key="root"
-            name="container"
-            mod={{ canResizeSpans: ff.isActive(ff.FF_ADJUSTABLE_SPANS) }}
+            className={cn("richtext").elem("container").mod({ canResizeSpans: ff.isActive(ff.FF_ADJUSTABLE_SPANS) }).mix("htx-richtext").toClassName()}
             ref={(el) => {
               item.mountNodeRef.current = el;
               el && this.markObjectAsLoaded();
             }}
             data-linenumbers={isText && settings.showLineNumbers ? "enabled" : "disabled"}
-            className="htx-richtext"
             dangerouslySetInnerHTML={{ __html: val }}
             {...eventHandlers}
           />
-        </Block>
+        </ObjectTag>
       );
     }
     return (
-      <Block name="richtext" tag={ObjectTag} item={item}>
-        <Elem name="loading" ref={this.loadingRef}>
+      <ObjectTag item={item} className={cn("richtext").toClassName()}>
+        <div className={cn("richtext").elem("loading").toClassName()} ref={this.loadingRef as any}>
           <LoadingOutlined />
-        </Elem>
+        </div>
 
-        <Elem
+        <iframe
           key="root"
-          name="iframe"
-          tag="iframe"
+          className={cn("richtext").elem("iframe").mix("htx-richtext").toClassName()}
           referrerPolicy="no-referrer"
           sandbox="allow-same-origin allow-scripts"
           ref={(el) => {
             item.setReady(false);
             item.mountNodeRef.current = el;
           }}
-          className="htx-richtext"
           srcDoc={val}
           onLoad={this.onIFrameLoad}
         />
-      </Block>
+      </ObjectTag>
     );
   }
 }