PortableTextEditor

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:33

Deprecated

Use useEditor() instead

import {useEditor} from '@portabletext/editor'

// Get the editor instance
const editor = useEditor()

// Send events to the editor
editor.send(...)

// Derive state from the editor
const state = useEditorSelector(editor, snapshot => ...)

Constructors

Constructor

new PortableTextEditor(config): PortableTextEditor

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:43

Parameters

config

editable

EditableAPI

editorActor

ActorRef

Returns

PortableTextEditor

Properties

schemaTypes

schemaTypes: Schema

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:37

A lookup table for all the relevant schema types for this portable text type.

Methods

setEditable()

setEditable(editable): void

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:48

Parameters

editable

EditableAPI

Returns

void

---

activeAnnotations()

static activeAnnotations(editor): PortableTextObject[]

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:65

Deprecated

Use built-in selectors or write your own: https://www.portabletext.org/reference/selectors/

import * as selectors from '@portabletext/editor/selectors'
const editor = useEditor()
const isActive = useEditorSelector(editor, selectors.getActiveAnnotations)

Parameters

editor

PortableTextEditor

Returns

PortableTextObject[]

---

addAnnotation()

static addAnnotation<TSchemaType>(editor, type, value?): AddedAnnotationPaths | undefined

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:105

Deprecated

Use editor.send(...) instead

const editor = useEditor()
editor.send({
 type: 'annotation.add',
 annotation: {
   name: '...',
   value: {...},
 }
})

Type Parameters

TSchemaType

TSchemaType extends object

Parameters

editor

PortableTextEditor

type

TSchemaType

value?

Returns

AddedAnnotationPaths | undefined

---

blur()

static blur(editor): void

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:123

Deprecated

Use editor.send(...) instead

const editor = useEditor()
editor.send({
 type: 'blur',
})

Parameters

editor

PortableTextEditor

Returns

void

---

delete()

static delete(editor, selection, options?): void

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:141

Deprecated

Use editor.send(...) instead

const editor = useEditor()
editor.send({
 type: 'delete',
 at: {...},
 direction: '...',
 unit: '...',
})

Parameters

editor

PortableTextEditor

selection

EditorSelection

options?

EditableAPIDeleteOptions

Returns

void

---

findByPath()

static findByPath(editor, path): [PortableTextObject | PortableTextSpan | PortableTextTextBlock<PortableTextObject | PortableTextSpan> | undefined, Path | undefined]

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:154

Parameters

editor

PortableTextEditor

path

Path

Returns

[PortableTextObject | PortableTextSpan | PortableTextTextBlock<PortableTextObject | PortableTextSpan> | undefined, Path | undefined]

---

findDOMNode()

static findDOMNode(editor, element): Node | undefined

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:147

Parameters

editor

PortableTextEditor

element

PortableTextObject | PortableTextSpan | PortableTextTextBlock<PortableTextObject | PortableTextSpan>

Returns

Node | undefined

---

focus()

static focus(editor): void

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:169

Deprecated

Use editor.send(...) instead

const editor = useEditor()
editor.send({
 type: 'focus',
})

Parameters

editor

PortableTextEditor

Returns

void

---

focusBlock()

static focusBlock(editor): PortableTextBlock | undefined

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:183

Deprecated

Use built-in selectors or write your own: https://www.portabletext.org/reference/selectors/

import * as selectors from '@portabletext/editor/selectors'
const editor = useEditor()
const focusBlock = useEditorSelector(editor, selectors.getFocusBlock)

Parameters

editor

PortableTextEditor

Returns

PortableTextBlock | undefined

---

focusChild()

static focusChild(editor): PortableTextChild | undefined

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:197

Deprecated

Use built-in selectors or write your own: https://www.portabletext.org/reference/selectors/

import * as selectors from '@portabletext/editor/selectors'
const editor = useEditor()
const focusChild = useEditorSelector(editor, selectors.getFocusChild)

Parameters

editor

PortableTextEditor

Returns

PortableTextChild | undefined

---

getFragment()

static getFragment(editor): PortableTextBlock[] | undefined

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:485

Deprecated

Use built-in selectors or write your own: https://www.portabletext.org/reference/selectors/

import * as selectors from '@portabletext/editor/selectors'
const editor = useEditor()
const selectedValue = useEditorSelector(editor, selectors.getSelectedValue)

Parameters

editor

PortableTextEditor

Returns

PortableTextBlock[] | undefined

---

getSelection()

static getSelection(editor): EditorSelection

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:213

Deprecated

Use built-in selectors or write your own: https://www.portabletext.org/reference/selectors/

import * as selectors from '@portabletext/editor/selectors'
const editor = useEditor()
const selection = useEditorSelector(editor, selectors.getSelection)

Parameters

editor

PortableTextEditor

Returns

EditorSelection

---

getValue()

static getValue(editor): PortableTextBlock[] | undefined

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:227

Deprecated

Use built-in selectors or write your own: https://www.portabletext.org/reference/selectors/

import * as selectors from '@portabletext/editor/selectors'
const editor = useEditor()
const value = useEditorSelector(editor, selectors.getValue)

Parameters

editor

PortableTextEditor

Returns

PortableTextBlock[] | undefined

---

hasBlockStyle()

static hasBlockStyle(editor, blockStyle): boolean

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:241

Deprecated

Use built-in selectors or write your own: https://www.portabletext.org/reference/selectors/

import * as selectors from '@portabletext/editor/selectors'
const editor = useEditor()
const isActive = useEditorSelector(editor, selectors.isActiveStyle(...))

Parameters

editor

PortableTextEditor

blockStyle

string

Returns

boolean

---

hasListStyle()

static hasListStyle(editor, listStyle): boolean

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:255

Deprecated

Use built-in selectors or write your own: https://www.portabletext.org/reference/selectors/

import * as selectors from '@portabletext/editor/selectors'
const editor = useEditor()
const isActive = useEditorSelector(editor, selectors.isActiveListItem(...))

Parameters

editor

PortableTextEditor

listStyle

string

Returns

boolean

---

insertBlock()

static insertBlock<TSchemaType>(editor, type, value?): Path | undefined

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:343

Deprecated

Use editor.send(...) instead

const editor = useEditor()
editor.send({
 type: 'insert.block object',
 blockObject: {
   name: '...',
   value: {...},
 },
 placement: 'auto' | 'after' | 'before',
})

Type Parameters

TSchemaType

TSchemaType extends object

Parameters

editor

PortableTextEditor

type

TSchemaType

value?

Returns

Path | undefined

---

insertBreak()

static insertBreak(editor): void

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:362

Deprecated

Use editor.send(...) instead

const editor = useEditor()
editor.send({
 type: 'insert.break',
})

Parameters

editor

PortableTextEditor

Returns

void

---

insertChild()

static insertChild<TSchemaType>(editor, type, value?): Path | undefined

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:319

Deprecated

Use editor.send(...) instead

const editor = useEditor()
editor.send({
 type: 'insert.span',
 text: '...',
 annotations: [{name: '...', value: {...}}],
 decorators: ['...'],
})
editor.send({
 type: 'insert.inline object',
 inlineObject: {
   name: '...',
   value: {...},
 },
})

Type Parameters

TSchemaType

TSchemaType extends object

Parameters

editor

PortableTextEditor

type

TSchemaType

value?

Returns

Path | undefined

---

isAnnotationActive()

static isAnnotationActive(editor, annotationType): boolean

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:81

Deprecated

Use built-in selectors or write your own: https://www.portabletext.org/reference/selectors/

import * as selectors from '@portabletext/editor/selectors'
const editor = useEditor()
const isActive = useEditorSelector(editor, selectors.isActiveAnnotation(...))

Parameters

editor

PortableTextEditor

annotationType

string

Returns

boolean

---

isCollapsedSelection()

static isCollapsedSelection(editor): boolean

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:269

Deprecated

Use built-in selectors or write your own: https://www.portabletext.org/reference/selectors/

import * as selectors from '@portabletext/editor/selectors'
const editor = useEditor()
const isSelectionCollapsed = useEditorSelector(editor, selectors.isSelectionCollapsed)

Parameters

editor

PortableTextEditor

Returns

boolean

---

isExpandedSelection()

static isExpandedSelection(editor): boolean

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:282

Deprecated

Use built-in selectors or write your own: https://www.portabletext.org/reference/selectors/

import * as selectors from '@portabletext/editor/selectors'
const editor = useEditor()
const isSelectionExpanded = useEditorSelector(editor, selectors.isSelectionExpanded)

Parameters

editor

PortableTextEditor

Returns

boolean

---

isMarkActive()

static isMarkActive(editor, mark): boolean

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:295

Deprecated

Use built-in selectors or write your own: https://www.portabletext.org/reference/selectors/

import * as selectors from '@portabletext/editor/selectors'
const editor = useEditor()
const isActive = useEditorSelector(editor, selectors.isActiveDecorator(...))

Parameters

editor

PortableTextEditor

mark

string

Returns

boolean

---

isObjectPath()

static isObjectPath(_editor, path): boolean

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:373

Parameters

_editor

PortableTextEditor

path

Path

Returns

boolean

---

isSelectionsOverlapping()

static isSelectionsOverlapping(editor, selectionA, selectionB): boolean

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:531

Deprecated

Use built-in selectors or write your own: https://www.portabletext.org/reference/selectors/

import * as selectors from '@portabletext/editor/selectors'
const editor = useEditor()
const isOverlapping = useEditorSelector(editor, selectors.isOverlappingSelection(selectionB))

Parameters

editor

PortableTextEditor

selectionA

EditorSelection

selectionB

EditorSelection

Returns

boolean

---

isVoid()

static isVoid(editor, element): boolean

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:366

Parameters

editor

PortableTextEditor

element

PortableTextObject | PortableTextSpan | PortableTextTextBlock<PortableTextObject | PortableTextSpan>

Returns

boolean

---

marks()

static marks(editor): string[]

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:382

Parameters

editor

PortableTextEditor

Returns

string[]

---

redo()

static redo(editor): void

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:517

Deprecated

Use editor.send(...) instead

const editor = useEditor()
editor.send({
  type: 'history.redo',
})

Parameters

editor

PortableTextEditor

Returns

void

---

removeAnnotation()

static removeAnnotation<TSchemaType>(editor, type): void

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:419

Deprecated

Use editor.send(...) instead

const editor = useEditor()
editor.send({
 type: 'annotation.remove',
 annotation: {
   name: '...',
 },
})

Type Parameters

TSchemaType

TSchemaType extends object

Parameters

editor

PortableTextEditor

type

TSchemaType

Returns

void

---

select()

static select(editor, selection): void

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:398

Deprecated

Use editor.send(...) instead

const editor = useEditor()
editor.send({
 type: 'select',
 selection: {...},
})

Parameters

editor

PortableTextEditor

selection

EditorSelection

Returns

void

---

toggleBlockStyle()

static toggleBlockStyle(editor, blockStyle): void

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:436

Deprecated

Use editor.send(...) instead

const editor = useEditor()
editor.send({
 type: 'style.toggle',
 style: '...',
})

Parameters

editor

PortableTextEditor

blockStyle

string

Returns

void

---

toggleList()

static toggleList(editor, listStyle): void

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:455

Deprecated

Use editor.send(...) instead

const editor = useEditor()
editor.send({
 type: 'list item.toggle',
 listItem: '...',
})

Parameters

editor

PortableTextEditor

listStyle

string

Returns

void

---

toggleMark()

static toggleMark(editor, mark): void

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:471

Deprecated

Use editor.send(...) instead

const editor = useEditor()
editor.send({
 type: 'decorator.toggle',
 decorator: '...',
})

Parameters

editor

PortableTextEditor

mark

string

Returns

void

---

undo()

static undo(editor): void

Defined in: packages/editor/src/editor/PortableTextEditor.tsx:502

Deprecated

Use editor.send(...) instead

const editor = useEditor()
editor.send({
  type: 'history.undo',
})

Parameters

editor

PortableTextEditor

Returns

void