Blocks are not draggable to canvas

GrapesJS version

• I confirm to use the latest version of GrapesJS

What browser are you using?

Tauri

Reproducible demo link

**

Describe the bug

How to reproduce the bug? 1. 2. ...

What is the expected behavior? ...

What is the current behavior? ...

If is necessary to execute some code in order to reproduce the bug, paste it here below:

"use client"

import { useEffect, useRef, useState } from "react"
import { usePathname, useSearchParams } from "next/navigation"
import { Project, ProjectsAtom } from "@/atoms/projects"
import { useAtom } from "jotai"
import grapesjs, { Editor } from 'grapesjs'
import 'grapesjs/dist/css/grapes.min.css'
export default function Project() {
  const ref = useRef(null)
  const i = useSearchParams()
  const [projects, setProjects] = useAtom(ProjectsAtom)
  const [project,setProj]= useState<Project>()
  const [editor,setEditor]= useState<any>()

  useEffect(() => {
    setProj(projects.find((el) => el.id == i.get("id")))
  }, [projects])
  useEffect(() => {
    const e = grapesjs.init({
      container:"#co",
      fromElement: true,
      blockManager: {
        appendTo: '#blocks',
      },
      
})
setEditor(e)
editor.BlockManager.add('my-first-block', {
  label: 'Simple block',
  content: `<div class="my-block margin-only" 
  style="box-sizing: border-box; height: 100px; margin: 10vh 0 0 0; text-align: center;">
  This is a simple block 2</div>`,
});
console.log("================================")
  }, [])
  return (
    <>
    <div id="blocks"></div>
    <div id={"co"}>

    </div>
    </>
  )
}

Code of Conduct

• I agree to follow this project's Code of Conduct