fix(dees-modal): theming

ts_web/elements/wysiwyg/wysiwyg.blockoperations.ts

@@ -24,7 +24,7 @@ export class WysiwygBlockOperations {
   /**
    * Inserts a block after the specified block
    */
-  insertBlockAfter(afterBlock: IBlock, newBlock: IBlock, focusNewBlock: boolean = true): void {
+  async insertBlockAfter(afterBlock: IBlock, newBlock: IBlock, focusNewBlock: boolean = true): Promise<void> {
     const blocks = this.component.blocks;
     const blockIndex = blocks.findIndex((b: IBlock) => b.id === afterBlock.id);
     
@@ -35,11 +35,14 @@ export class WysiwygBlockOperations {
     ];
     
     this.component.updateValue();
+    this.component.requestUpdate();
     
     if (focusNewBlock && newBlock.type !== 'divider') {
-      setTimeout(() => {
-        this.focusBlock(newBlock.id);
-      }, 50);
+      // Wait for the component to update
+      await this.component.updateComplete;
+      
+      // Focus the new block
+      await this.focusBlock(newBlock.id, 'start');
     }
   }
 
@@ -68,17 +71,19 @@ export class WysiwygBlockOperations {
   /**
    * Focuses a specific block
    */
-  focusBlock(blockId: string, cursorPosition: 'start' | 'end' = 'start'): void {
+  async focusBlock(blockId: string, cursorPosition: 'start' | 'end' | number = 'start'): Promise<void> {
+    // First ensure the component is updated
+    await this.component.updateComplete;
+    
     const wrapperElement = this.component.shadowRoot!.querySelector(`[data-block-id="${blockId}"]`);
     if (wrapperElement) {
-      const blockElement = wrapperElement.querySelector('.block') as HTMLDivElement;
-      if (blockElement) {
-        blockElement.focus();
-        if (cursorPosition === 'start') {
-          WysiwygBlocks.setCursorToStart(blockElement);
-        } else {
-          WysiwygBlocks.setCursorToEnd(blockElement);
-        }
+      const blockComponent = wrapperElement.querySelector('dees-wysiwyg-block') as any;
+      if (blockComponent) {
+        // Wait a frame to ensure the block is rendered
+        await new Promise(resolve => requestAnimationFrame(resolve));
+        
+        // Now focus with cursor position
+        blockComponent.focusWithCursor(cursorPosition);
       }
     }
   }