add dynamic tags

packages/react/src/NodeViewContent.tsx

@@ -1,13 +1,19 @@
 import React from 'react'
 import { useReactNodeView } from './useReactNodeView'
 
-export const NodeViewContent: React.FC = props => {
+export interface NodeViewContentProps {
+  as: React.ElementType
+}
+
+export const NodeViewContent: React.FC<NodeViewContentProps> = props => {
   // TODO
   // @ts-ignore
   const { isEditable } = useReactNodeView()
 
+  const Tag = props.as || 'div'
+
   return (
-    <div
+    <Tag
       data-node-view-content=""
       contentEditable={isEditable}
       style={{
@@ -15,5 +21,4 @@ export const NodeViewContent: React.FC = props => {
       }}
     />
   )
-
 }

packages/react/src/NodeViewWrapper.tsx

@@ -1,13 +1,19 @@
 import React from 'react'
 import { useReactNodeView } from './useReactNodeView'
 
-export const NodeViewWrapper: React.FC = props => {
+export interface NodeViewWrapperProps {
+  as: React.ElementType
+}
+
+export const NodeViewWrapper: React.FC<NodeViewWrapperProps> = props => {
   // TODO
   // @ts-ignore
   const { onDragStart } = useReactNodeView()
 
+  const Tag = props.as || 'div'
+
   return (
-    <div
+    <Tag
       data-node-view-wrapper=""
       style={{
         whiteSpace: 'normal'
@@ -15,7 +21,6 @@ export const NodeViewWrapper: React.FC = props => {
       onDragStart={onDragStart}
     >
      {props.children}
-    </div>
+    </Tag>
   )
-
 }