@prosekit/react 0.6.7 → 0.6.9

package/src/components/drop-indicator/drop-indicator.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link DropIndicator} component.
  */
 export interface DropIndicatorProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const DropIndicator: ForwardRefExoticComponent<
   DropIndicatorProps &
   RefAttributes<DropIndicatorElement> &
   HTMLAttributes<DropIndicatorElement>
 > = createComponent<
-  DropIndicatorProps, 
+  DropIndicatorProps,
   DropIndicatorElement
 >(
   'prosekit-drop-indicator',

package/src/components/drop-indicator/index.gen.ts

@@ -1 +1 @@
-export { DropIndicator, type DropIndicatorProps } from './drop-indicator.gen'
+export { DropIndicator, type DropIndicatorProps } from './drop-indicator.gen.ts'

package/src/components/inline-popover/index.gen.ts

@@ -1 +1 @@
-export { InlinePopover, type InlinePopoverProps } from './inline-popover.gen'
+export { InlinePopover, type InlinePopoverProps } from './inline-popover.gen.ts'

package/src/components/inline-popover/inline-popover.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link InlinePopover} component.
  */
 export interface InlinePopoverProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const InlinePopover: ForwardRefExoticComponent<
   InlinePopoverProps &
   RefAttributes<InlinePopoverElement> &
   HTMLAttributes<InlinePopoverElement>
 > = createComponent<
-  InlinePopoverProps, 
+  InlinePopoverProps,
   InlinePopoverElement
 >(
   'prosekit-inline-popover',

package/src/components/popover/index.gen.ts

@@ -1,5 +1,5 @@
-export { PopoverContent, type PopoverContentProps } from './popover-content.gen'
+export { PopoverContent, type PopoverContentProps } from './popover-content.gen.ts'
 
-export { PopoverRoot, type PopoverRootProps } from './popover-root.gen'
+export { PopoverRoot, type PopoverRootProps } from './popover-root.gen.ts'
 
-export { PopoverTrigger, type PopoverTriggerProps } from './popover-trigger.gen'
+export { PopoverTrigger, type PopoverTriggerProps } from './popover-trigger.gen.ts'

package/src/components/popover/popover-content.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link PopoverContent} component.
  */
 export interface PopoverContentProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const PopoverContent: ForwardRefExoticComponent<
   PopoverContentProps &
   RefAttributes<PopoverContentElement> &
   HTMLAttributes<PopoverContentElement>
 > = createComponent<
-  PopoverContentProps, 
+  PopoverContentProps,
   PopoverContentElement
 >(
   'prosekit-popover-content',

package/src/components/popover/popover-root.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link PopoverRoot} component.
  */
 export interface PopoverRootProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const PopoverRoot: ForwardRefExoticComponent<
   PopoverRootProps &
   RefAttributes<PopoverRootElement> &
   HTMLAttributes<PopoverRootElement>
 > = createComponent<
-  PopoverRootProps, 
+  PopoverRootProps,
   PopoverRootElement
 >(
   'prosekit-popover-root',

package/src/components/popover/popover-trigger.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link PopoverTrigger} component.
  */
 export interface PopoverTriggerProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const PopoverTrigger: ForwardRefExoticComponent<
   PopoverTriggerProps &
   RefAttributes<PopoverTriggerElement> &
   HTMLAttributes<PopoverTriggerElement>
 > = createComponent<
-  PopoverTriggerProps, 
+  PopoverTriggerProps,
   PopoverTriggerElement
 >(
   'prosekit-popover-trigger',

package/src/components/prosekit.ts

@@ -1,10 +1,9 @@
 import type { Editor } from '@prosekit/core'
-import { ProsemirrorAdapterProvider } from '@prosemirror-adapter/react'
 import { createElement, type ComponentType, type ReactNode } from 'react'
 
-import { EditorContextProvider } from '../contexts/editor-context'
-import { ReactMarkViewConsumer } from '../extensions/react-mark-view'
-import { ReactNodeViewConsumer } from '../extensions/react-node-view'
+import { EditorContextProvider } from '../contexts/editor-context.ts'
+
+import { ViewRenderer } from './view-renderer.ts'
 
 export interface ProseKitProps {
   editor: Editor
@@ -23,11 +22,8 @@ export const ProseKit: ComponentType<ProseKitProps> = (props) => {
     EditorContextProvider,
     { value: editor },
     createElement(
-      ProsemirrorAdapterProvider,
-      null,
-      createElement(ReactNodeViewConsumer),
-      createElement(ReactMarkViewConsumer),
-      children,
+      ViewRenderer,
+      { editor, children },
     ),
   )
 }

package/src/components/resizable/index.gen.ts

@@ -1,3 +1,3 @@
-export { ResizableHandle, type ResizableHandleProps } from './resizable-handle.gen'
+export { ResizableHandle, type ResizableHandleProps } from './resizable-handle.gen.ts'
 
-export { ResizableRoot, type ResizableRootProps } from './resizable-root.gen'
+export { ResizableRoot, type ResizableRootProps } from './resizable-root.gen.ts'

package/src/components/resizable/resizable-handle.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link ResizableHandle} component.
  */
 export interface ResizableHandleProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const ResizableHandle: ForwardRefExoticComponent<
   ResizableHandleProps &
   RefAttributes<ResizableHandleElement> &
   HTMLAttributes<ResizableHandleElement>
 > = createComponent<
-  ResizableHandleProps, 
+  ResizableHandleProps,
   ResizableHandleElement
 >(
   'prosekit-resizable-handle',

package/src/components/resizable/resizable-root.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link ResizableRoot} component.
  */
 export interface ResizableRootProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const ResizableRoot: ForwardRefExoticComponent<
   ResizableRootProps &
   RefAttributes<ResizableRootElement> &
   HTMLAttributes<ResizableRootElement>
 > = createComponent<
-  ResizableRootProps, 
+  ResizableRootProps,
   ResizableRootElement
 >(
   'prosekit-resizable-root',

package/src/components/table-handle/index.gen.ts

@@ -1,17 +1,17 @@
-export { TableHandleColumnRoot, type TableHandleColumnRootProps } from './table-handle-column-root.gen'
+export { TableHandleColumnRoot, type TableHandleColumnRootProps } from './table-handle-column-root.gen.ts'
 
-export { TableHandleColumnTrigger, type TableHandleColumnTriggerProps } from './table-handle-column-trigger.gen'
+export { TableHandleColumnTrigger, type TableHandleColumnTriggerProps } from './table-handle-column-trigger.gen.ts'
 
-export { TableHandleDragPreview, type TableHandleDragPreviewProps } from './table-handle-drag-preview.gen'
+export { TableHandleDragPreview, type TableHandleDragPreviewProps } from './table-handle-drag-preview.gen.ts'
 
-export { TableHandleDropIndicator, type TableHandleDropIndicatorProps } from './table-handle-drop-indicator.gen'
+export { TableHandleDropIndicator, type TableHandleDropIndicatorProps } from './table-handle-drop-indicator.gen.ts'
 
-export { TableHandlePopoverContent, type TableHandlePopoverContentProps } from './table-handle-popover-content.gen'
+export { TableHandlePopoverContent, type TableHandlePopoverContentProps } from './table-handle-popover-content.gen.ts'
 
-export { TableHandlePopoverItem, type TableHandlePopoverItemProps } from './table-handle-popover-item.gen'
+export { TableHandlePopoverItem, type TableHandlePopoverItemProps } from './table-handle-popover-item.gen.ts'
 
-export { TableHandleRoot, type TableHandleRootProps } from './table-handle-root.gen'
+export { TableHandleRoot, type TableHandleRootProps } from './table-handle-root.gen.ts'
 
-export { TableHandleRowRoot, type TableHandleRowRootProps } from './table-handle-row-root.gen'
+export { TableHandleRowRoot, type TableHandleRowRootProps } from './table-handle-row-root.gen.ts'
 
-export { TableHandleRowTrigger, type TableHandleRowTriggerProps } from './table-handle-row-trigger.gen'
+export { TableHandleRowTrigger, type TableHandleRowTriggerProps } from './table-handle-row-trigger.gen.ts'

package/src/components/table-handle/table-handle-column-root.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link TableHandleColumnRoot} component.
  */
 export interface TableHandleColumnRootProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const TableHandleColumnRoot: ForwardRefExoticComponent<
   TableHandleColumnRootProps &
   RefAttributes<TableHandleColumnRootElement> &
   HTMLAttributes<TableHandleColumnRootElement>
 > = createComponent<
-  TableHandleColumnRootProps, 
+  TableHandleColumnRootProps,
   TableHandleColumnRootElement
 >(
   'prosekit-table-handle-column-root',

package/src/components/table-handle/table-handle-column-trigger.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link TableHandleColumnTrigger} component.
  */
 export interface TableHandleColumnTriggerProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const TableHandleColumnTrigger: ForwardRefExoticComponent<
   TableHandleColumnTriggerProps &
   RefAttributes<TableHandleColumnTriggerElement> &
   HTMLAttributes<TableHandleColumnTriggerElement>
 > = createComponent<
-  TableHandleColumnTriggerProps, 
+  TableHandleColumnTriggerProps,
   TableHandleColumnTriggerElement
 >(
   'prosekit-table-handle-column-trigger',

package/src/components/table-handle/table-handle-drag-preview.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link TableHandleDragPreview} component.
  */
 export interface TableHandleDragPreviewProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const TableHandleDragPreview: ForwardRefExoticComponent<
   TableHandleDragPreviewProps &
   RefAttributes<TableHandleDragPreviewElement> &
   HTMLAttributes<TableHandleDragPreviewElement>
 > = createComponent<
-  TableHandleDragPreviewProps, 
+  TableHandleDragPreviewProps,
   TableHandleDragPreviewElement
 >(
   'prosekit-table-handle-drag-preview',

package/src/components/table-handle/table-handle-drop-indicator.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link TableHandleDropIndicator} component.
  */
 export interface TableHandleDropIndicatorProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const TableHandleDropIndicator: ForwardRefExoticComponent<
   TableHandleDropIndicatorProps &
   RefAttributes<TableHandleDropIndicatorElement> &
   HTMLAttributes<TableHandleDropIndicatorElement>
 > = createComponent<
-  TableHandleDropIndicatorProps, 
+  TableHandleDropIndicatorProps,
   TableHandleDropIndicatorElement
 >(
   'prosekit-table-handle-drop-indicator',

package/src/components/table-handle/table-handle-popover-content.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link TableHandlePopoverContent} component.
  */
 export interface TableHandlePopoverContentProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const TableHandlePopoverContent: ForwardRefExoticComponent<
   TableHandlePopoverContentProps &
   RefAttributes<TableHandlePopoverContentElement> &
   HTMLAttributes<TableHandlePopoverContentElement>
 > = createComponent<
-  TableHandlePopoverContentProps, 
+  TableHandlePopoverContentProps,
   TableHandlePopoverContentElement
 >(
   'prosekit-table-handle-popover-content',

package/src/components/table-handle/table-handle-popover-item.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link TableHandlePopoverItem} component.
  */
 export interface TableHandlePopoverItemProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const TableHandlePopoverItem: ForwardRefExoticComponent<
   TableHandlePopoverItemProps &
   RefAttributes<TableHandlePopoverItemElement> &
   HTMLAttributes<TableHandlePopoverItemElement>
 > = createComponent<
-  TableHandlePopoverItemProps, 
+  TableHandlePopoverItemProps,
   TableHandlePopoverItemElement
 >(
   'prosekit-table-handle-popover-item',

package/src/components/table-handle/table-handle-root.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link TableHandleRoot} component.
  */
 export interface TableHandleRootProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const TableHandleRoot: ForwardRefExoticComponent<
   TableHandleRootProps &
   RefAttributes<TableHandleRootElement> &
   HTMLAttributes<TableHandleRootElement>
 > = createComponent<
-  TableHandleRootProps, 
+  TableHandleRootProps,
   TableHandleRootElement
 >(
   'prosekit-table-handle-root',

package/src/components/table-handle/table-handle-row-root.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link TableHandleRowRoot} component.
  */
 export interface TableHandleRowRootProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const TableHandleRowRoot: ForwardRefExoticComponent<
   TableHandleRowRootProps &
   RefAttributes<TableHandleRowRootElement> &
   HTMLAttributes<TableHandleRowRootElement>
 > = createComponent<
-  TableHandleRowRootProps, 
+  TableHandleRowRootProps,
   TableHandleRowRootElement
 >(
   'prosekit-table-handle-row-root',

package/src/components/table-handle/table-handle-row-trigger.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link TableHandleRowTrigger} component.
  */
 export interface TableHandleRowTriggerProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const TableHandleRowTrigger: ForwardRefExoticComponent<
   TableHandleRowTriggerProps &
   RefAttributes<TableHandleRowTriggerElement> &
   HTMLAttributes<TableHandleRowTriggerElement>
 > = createComponent<
-  TableHandleRowTriggerProps, 
+  TableHandleRowTriggerProps,
   TableHandleRowTriggerElement
 >(
   'prosekit-table-handle-row-trigger',

package/src/components/tooltip/index.gen.ts

@@ -1,5 +1,5 @@
-export { TooltipContent, type TooltipContentProps } from './tooltip-content.gen'
+export { TooltipContent, type TooltipContentProps } from './tooltip-content.gen.ts'
 
-export { TooltipRoot, type TooltipRootProps } from './tooltip-root.gen'
+export { TooltipRoot, type TooltipRootProps } from './tooltip-root.gen.ts'
 
-export { TooltipTrigger, type TooltipTriggerProps } from './tooltip-trigger.gen'
+export { TooltipTrigger, type TooltipTriggerProps } from './tooltip-trigger.gen.ts'

package/src/components/tooltip/tooltip-content.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link TooltipContent} component.
  */
 export interface TooltipContentProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const TooltipContent: ForwardRefExoticComponent<
   TooltipContentProps &
   RefAttributes<TooltipContentElement> &
   HTMLAttributes<TooltipContentElement>
 > = createComponent<
-  TooltipContentProps, 
+  TooltipContentProps,
   TooltipContentElement
 >(
   'prosekit-tooltip-content',

package/src/components/tooltip/tooltip-root.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link TooltipRoot} component.
  */
 export interface TooltipRootProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const TooltipRoot: ForwardRefExoticComponent<
   TooltipRootProps &
   RefAttributes<TooltipRootElement> &
   HTMLAttributes<TooltipRootElement>
 > = createComponent<
-  TooltipRootProps, 
+  TooltipRootProps,
   TooltipRootElement
 >(
   'prosekit-tooltip-root',

package/src/components/tooltip/tooltip-trigger.gen.ts

@@ -11,20 +11,20 @@ import type {
   RefAttributes,
 } from 'react'
 
-import { createComponent } from '../create-component'
-import type { CreateProps } from '../create-props'
+import { createComponent } from '../create-component.ts'
+import type { CreateProps } from '../create-props.ts'
 
 /**
  * Props for the {@link TooltipTrigger} component.
  */
 export interface TooltipTriggerProps extends Partial<CreateProps<Props, Events>> {}
- 
+
 export const TooltipTrigger: ForwardRefExoticComponent<
   TooltipTriggerProps &
   RefAttributes<TooltipTriggerElement> &
   HTMLAttributes<TooltipTriggerElement>
 > = createComponent<
-  TooltipTriggerProps, 
+  TooltipTriggerProps,
   TooltipTriggerElement
 >(
   'prosekit-tooltip-trigger',

package/src/components/view-renderer.ts

@@ -0,0 +1,27 @@
+import { union, type Editor } from '@prosekit/core'
+import { useReactRenderer } from '@prosemirror-adapter/react'
+import { createElement, Fragment, useMemo, type ComponentType, type ReactNode } from 'react'
+
+import { defineReactMarkViewFactory } from '../extensions/react-mark-view.ts'
+import { defineReactNodeViewFactory } from '../extensions/react-node-view.ts'
+import { useEditorExtension } from '../hooks/use-editor-extension.ts'
+
+interface ViewRendererProps {
+  editor: Editor
+  children: ReactNode
+}
+
+export const ViewRenderer: ComponentType<ViewRendererProps> = ({ editor, children }): ReactNode => {
+  const { renderReactRenderer, removeReactRenderer, render } = useReactRenderer()
+
+  const extension = useMemo(() => {
+    return union([
+      defineReactMarkViewFactory(renderReactRenderer, removeReactRenderer),
+      defineReactNodeViewFactory(renderReactRenderer, removeReactRenderer),
+    ])
+  }, [renderReactRenderer, removeReactRenderer])
+
+  useEditorExtension(editor, extension)
+
+  return createElement(Fragment, null, createElement(Fragment, null, children), createElement(Fragment, null, render()))
+}