本文整理汇总了TypeScript中draft-js.EditorState类的典型用法代码示例。如果您正苦于以下问题:TypeScript EditorState类的具体用法?TypeScript EditorState怎么用?TypeScript EditorState使用的例子?那么恭喜您, 这里精选的类代码示例或许可以为您提供帮助。
在下文中一共展示了EditorState类的20个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。
示例1: toggleBlockStyle
return function toggleBlockStyle(styleName: string) {
const { getEditorState, setEditorState } = callbacks;
const editorState = getEditorState();
const currentBlock = getSelectedBlock(editorState);
const blockTypedContent = Modifier.setBlockType(
editorState.getCurrentContent(),
editorState.getSelection(),
styleName
);
setEditorState(
EditorState.push(editorState, blockTypedContent, 'apply-block-type')
);
}
开发者ID:react-component,项目名称:editor-utils,代码行数:15,代码来源:getToggleBlockStyleFunc.ts
示例2: onSelect
onSelect(query: string, text: string) {
const selection = this.core.getSelection();
const offset = selection.getAnchorOffset() - 1;
const content = this.core.getCurrentContent();
const block_text = content.getBlockForKey(selection.getAnchorKey()).getText();
const idx = block_text.lastIndexOf(query, offset);
if (idx === -1 || (idx + query.length < offset)) {
log.error('Invalid selection:', selection);
return this;
}
const next_selection = selection.merge({
anchorOffset: idx,
focusOffset: idx + query.length,
}) as SelectionState;
const next_content = Modifier.replaceText(content, next_selection, text);
const next_editor = EditorState.forceSelection(
EditorState.push(
this.core,
next_content,
'insert-characters'
),
next_content.getSelectionAfter()
);
return new TweetEditorState(
next_editor,
this.is_open,
this.keymaps,
this.in_reply_to_status
);
}
开发者ID:DevenLu,项目名称:YourFukurou,代码行数:33,代码来源:tweet_editor.ts
示例3:
export const getSelectionDetails = (editorState: EditorState) => {
// Returns some commonly used selection attrs
const selection = editorState.getSelection()
const content = editorState.getCurrentContent()
const anchorKey = selection.getAnchorKey()
const anchorOffset = selection.getAnchorOffset()
const anchorBlock = content.getBlockForKey(anchorKey)
const anchorType = anchorBlock.getType()
const beforeKey = content.getKeyBefore(anchorKey)
const blockBefore = content.getBlockForKey(beforeKey)
const isFirstBlock = !blockBefore
const isFirstCharacter = selection.getStartOffset() === 0
const isLastBlock = content.getLastBlock().getKey() === anchorKey
const isLastCharacter = selection.getStartOffset() === anchorBlock.getLength()
return {
anchorKey,
anchorOffset,
anchorType,
isFirstBlock,
isFirstCharacter,
isLastBlock,
isLastCharacter,
}
}
开发者ID:artsy,项目名称:positron,代码行数:28,代码来源:selection.ts
示例4: removeHighlight
export function removeHighlight(editorState, styleName) {
const highlightsState = getHighlightsState(editorState);
if (highlightsState.highlightsData[styleName] === undefined) {
return editorState;
}
const nextHighlightsStyleMap = {...highlightsState.highlightsStyleMap};
delete nextHighlightsStyleMap[styleName];
const nextHighlightsData = {...highlightsState.highlightsData};
delete nextHighlightsData[styleName];
const newHighlightsState = {
lastHighlightIds: highlightsState.lastHighlightIds,
highlightsStyleMap: nextHighlightsStyleMap,
highlightsData: nextHighlightsData,
};
let newEditorState = clearInlineStyles(
editorState,
getDraftSelectionForEntireContent(editorState),
[styleName],
);
// prevent recording the changes to undo stack so user doesn't have to undo twice
// for the highlight deletion to be completelly(both inline styles and related data) undone
newEditorState = EditorState.set(newEditorState, {allowUndo: false});
newEditorState = setHighlightsState(newEditorState, newHighlightsState);
newEditorState = EditorState.set(newEditorState, {allowUndo: true});
return newEditorState;
}
开发者ID:jerome-poisson,项目名称:superdesk-client-core,代码行数:35,代码来源:highlights.ts
示例5: changeEditorSelection
export function changeEditorSelection(editorState, startOffset, endOffset, force) {
const selection = editorState.getSelection();
const {block: startBlock, newOffset: newStartOffset} = getBlockAndOffset(
editorState, selection, startOffset, false);
const {block: endBlock, newOffset: newEndOffset} = getBlockAndOffset(
editorState, selection, endOffset, true);
if (startBlock == null || endBlock == null) {
return editorState;
}
const newSelection = selection.merge({
anchorOffset: newStartOffset,
anchorKey: startBlock.getKey(),
focusOffset: newEndOffset,
focusKey: endBlock.getKey(),
isBackward: false,
});
if (force) {
return EditorState.forceSelection(editorState, newSelection);
}
return EditorState.acceptSelection(editorState, newSelection);
}
开发者ID:jerome-poisson,项目名称:superdesk-client-core,代码行数:25,代码来源:highlights.ts
示例6:
export const removeBlocks = (editorState: EditorState) => {
return Modifier.setBlockType(
editorState.getCurrentContent(),
editorState.getSelection(),
"unstyled"
)
}
开发者ID:joeyAghion,项目名称:positron,代码行数:7,代码来源:utils.ts
示例7: setTextToEditor
setTextToEditor(text: string) {
return EditorState.moveSelectionToEnd(
EditorState.push(
this.core,
ContentState.createFromText(text),
'insert-characters'
)
);
}
开发者ID:DevenLu,项目名称:YourFukurou,代码行数:9,代码来源:tweet_editor.ts
示例8: addHighlight
(start, end) => {
editorState = EditorState.acceptSelection(editorState, selection.merge({
isBackward: false,
anchorOffset: start,
focusOffset: end,
}));
editorState = addHighlight(editorState, type, data, single);
editorState = EditorState.push(editorState, editorState.getCurrentContent(), 'change-block-data');
editorState = EditorState.acceptSelection(editorState, selection);
});
开发者ID:jerome-poisson,项目名称:superdesk-client-core,代码行数:10,代码来源:highlights.ts
示例9: initEditorState
export function initEditorState(trystup='') {
const {contentState} = renderDraftJS(trystup.trim())
const specs = [
{ strategy: findLinkEntities, component: Link },
{ strategy: findFieldEntities, component: Field }
]
const decorators = new CompositeDecorator(specs)
let editorState = EditorState.createWithContent(contentState, decorators)
editorState = EditorState.moveSelectionToEnd(editorState)
return editorState
}
开发者ID:TrystalNet,项目名称:draftjs,代码行数:11,代码来源:editor.ts
示例10: modifyInlineStyle
export function modifyInlineStyle(
editor: EditorState, selection: SelectionState, {apply, remove}: {apply?: string, remove?: string}
) {
let content = editor.getCurrentContent()
if (remove) {
content = Modifier.removeInlineStyle(content, selection, remove)
}
if (apply) {
content = Modifier.applyInlineStyle(content, selection, apply)
}
return EditorState.push(editor, content, 'change-inline-style')
}
开发者ID:Pajn,项目名称:meltdown,代码行数:13,代码来源:editor-syntax-highlighting.ts
示例11:
export const insertPastedState = (
pastedState: EditorState,
editorState: EditorState
) => {
const blockMap = pastedState.getCurrentContent().getBlockMap()
// Merge blockMap from pasted text into existing content
const modifiedContent = Modifier.replaceWithFragment(
editorState.getCurrentContent(),
editorState.getSelection(),
blockMap
)
// Create a new editorState from merged content
return EditorState.push(editorState, modifiedContent, "insert-fragment")
}
开发者ID:artsy,项目名称:positron,代码行数:15,代码来源:shared.ts
示例12: getCurrentEntity
export default function getCurrentEntity(editorState: EditorState) {
let entity;
const selection = editorState.getSelection();
let start = selection.getStartOffset();
let end = selection.getEndOffset();
if (start === end && start === 0) {
end = -1;
} else if (start === end) {
start = start - 1;
}
const block = getSelectedBlock(editorState);
for (let i = start; i < end; i++) {
const currentEntity = block.getEntityAt(i);
if (!currentEntity) {
entity = undefined;
break;
}
if (i === start) {
entity = currentEntity;
} else {
if (entity !== currentEntity) {
entity = undefined;
break;
}
}
}
return entity;
}
开发者ID:react-component,项目名称:editor-utils,代码行数:28,代码来源:getCurrentEntity.ts
示例13: flipIfBackwards
.when(createComment, (state: DocumentState, {text}) => {
const selection = flipIfBackwards(state.editor.getSelection())
const id = state.comments.length
const entityKey = Entity.create('Comment', 'MUTABLE', {id})
let content = state.editor.getCurrentContent()
if (selection.getAnchorKey() === selection.getFocusKey()) {
const start = selection.getAnchorOffset()
const end = selection.getFocusOffset()
let block = content.getBlockForKey(selection.getAnchorKey())
let chars = block.getCharacterList()
for (let i = start; i < end; i++) {
let metadata = chars.get(i)
metadata = CharacterMetadata.applyEntity(metadata, entityKey)
metadata = CharacterMetadata.applyStyle(metadata, 'comment')
chars = chars.set(i, metadata)
}
block = block.set('characterList', chars)
content = content.set('blockMap', content.getBlockMap().set(block.getKey(), block))
}
const comment = {id, entityKey, selection, text}
return Object.assign({}, state, {
editor: EditorState.push(state.editor, content, 'apply-entity'),
creatingComment: null,
comments: [...state.comments, comment],
})
})
开发者ID:Pajn,项目名称:meltdown,代码行数:30,代码来源:document.ts
示例14: getCurrentInlineStyle
export default function getCurrentInlineStyle(editorState: EditorState) {
if (editorState === inlineStyleCache.editorState) {
return inlineStyleCache.value;
}
inlineStyleCache.editorState = editorState;
inlineStyleCache.value = editorState.getCurrentInlineStyle();
return inlineStyleCache.value;
}
开发者ID:react-component,项目名称:editor-utils,代码行数:8,代码来源:getCurrentInlineStyle.ts
示例15: addEditorStateToObject
export function addEditorStateToObject(shape: PubShape) {
const contentState = stateFromHTML(shape.text, {
customInlineFn: importTextStyle,
});
shape.editorState = EditorState.createWithContent(contentState);
shape.isEditing = false;
return shape;
}
开发者ID:carlospaelinck,项目名称:publications-js,代码行数:8,代码来源:documents.ts
示例16: getContentState
export const getEditorState = (
html,
hasLinks = true,
blockMap = richTextBlockRenderMap
) => {
const contentState = getContentState(html, hasLinks, blockMap)
return EditorState.createWithContent(contentState, decorators(hasLinks))
}
开发者ID:joeyAghion,项目名称:positron,代码行数:8,代码来源:test_helpers.ts
示例17: clearEditor
clearEditor() {
return new TweetEditorState(
EditorState.createEmpty(editorDecolator),
this.is_open,
this.keymaps,
null
);
}
开发者ID:DevenLu,项目名称:YourFukurou,代码行数:8,代码来源:tweet_editor.ts
示例18:
const getEditorState = html => {
const blocks = Draft.convertFromHTML(html)
const content = Draft.ContentState.createFromBlockArray(
blocks.contentBlocks,
blocks.entityMap
)
return Draft.EditorState.createWithContent(content)
}
开发者ID:artsy,项目名称:positron,代码行数:9,代码来源:shared.test.ts
示例19: updateStyles
export function updateStyles(editor: EditorState) {
const key = editor.getSelection().getFocusKey()
const content = editor.getCurrentContent()
const block = content.getBlockForKey(key)
const ast = parser.parse(block.getText())
let updatedBlock: ContentBlock
let updatedContent: ContentState
if (ast.firstChild === ast.lastChild && ast.firstChild) {
const node = ast.firstChild
if (node.type === 'Heading') {
const type = headerType[ast.firstChild.level] || 'unstyled'
updatedBlock = maybeSet(block, type)
} else if (node.type === 'BlockQuote') {
updatedBlock = maybeSet(block, 'blockquote')
// } else if (node.type === 'Paragraph' && node.firstChild !== node.lastChild) {
// updatedContent = updateInlineStyles(content, block.getKey(), node)
} else {
updatedBlock = maybeSet(block, 'unstyled')
}
/// goal question metiric, victor basili
/// Program slicing, component based systems
} else {
updatedBlock = maybeSet(block, 'unstyled')
}
if (updatedBlock) {
updatedContent = content.setIn(['blockMap', key], updatedBlock)
}
if (updatedContent) {
const selection = editor.getSelection()
updatedContent = updatedContent.merge({
selectionBefore: selection,
selectionAfter: selection,
})
return EditorState.push(editor, updatedContent, 'change-block-type')
}
return editor
}
开发者ID:Pajn,项目名称:meltdown,代码行数:43,代码来源:editor-syntax-highlighting.ts
示例20: describe
describe("#getSelectionDetails", () => {
const { sections } = StandardArticle
const sectionBody: string = sections ? (sections[0].body as string) : ""
const editorContent = convertHtmlToDraft(sectionBody, false, [] as StyleMap)
let editorState = Draft.EditorState.createWithContent(editorContent)
lastBlock = editorState.getCurrentContent().getLastBlock()
it("Knows if selection focus is in first block", () => {
const selection = getSelectionDetails(editorState)
expect(selection.isFirstBlock).toBe(true)
expect(selection.isLastBlock).toBe(false)
})
it("Knows if selection focus is in first character of block", () => {
const selection = getSelectionDetails(editorState)
expect(selection.isFirstCharacter).toBe(true)
expect(selection.isLastCharacter).toBe(false)
expect(selection.anchorOffset).toBe(0)
})
it("Knows if selection focus is in last block", () => {
// Set the selection to last block
const newSelection = editorState.getSelection().merge({
anchorKey: lastBlock.key,
anchorOffset: lastBlock.getLength() - 3,
focusKey: lastBlock.key,
focusOffset: lastBlock.getLength(),
})
editorState = Draft.EditorState.acceptSelection(
editorState,
newSelection as any
)
const selection = getSelectionDetails(editorState)
expect(selection.isLastBlock).toBe(true)
expect(selection.isFirstBlock).toBe(false)
})
it("Knows if selection focus is in last character of block", () => {
// Set the selection to end of last block
const newSelection = editorState.getSelection().merge({
anchorOffset: lastBlock.getLength(),
})
editorState = Draft.EditorState.acceptSelection(
editorState,
newSelection as any
)
const selection = getSelectionDetails(editorState)
expect(selection.isLastCharacter).toBe(true)
expect(selection.isFirstCharacter).toBe(false)
expect(selection.anchorOffset).toBe(lastBlock.getLength())
})
})
开发者ID:artsy,项目名称:positron,代码行数:54,代码来源:selection.test.ts
注:本文中的draft-js.EditorState类示例由纯净天空整理自Github/MSDocs等源码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。 |
请发表评论