TypeScript prosemirror-view.Decoration類代碼示例

本文整理匯總了TypeScript中prosemirror-view.Decoration類的典型用法代碼示例。如果您正苦於以下問題：TypeScript Decoration類的具體用法？TypeScript Decoration怎麽用？TypeScript Decoration使用的例子？那麽, 這裏精選的類代碼示例或許可以為您提供幫助。

在下文中一共展示了Decoration類的3個代碼示例，這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚，您的評價將有助於係統推薦出更棒的TypeScript代碼示例。

示例1:

 const decorations = positions.map(position => {
     const node = document.createElement("span")
     node.appendChild(document.createTextNode(ZWSP))
     return Decoration.widget(position, node, {
         raw: true,
         side: -1,
     } as any)
 })

開發者ID:zodiac-team，項目名稱:zodiac-ui，代碼行數:8，代碼來源:inline-cursor-target.ts

示例2:

const createTextSelection = (from: number, to: number): Decoration =>
    Decoration.inline(from, to, { class: "ProseMirror-fake-text-selection" })

開發者ID:zodiac-team，項目名稱:zodiac-ui，代碼行數:2，代碼來源:fake-cursor-for-toolbar.ts

示例3: Plugin

import { Plugin, EditorState } from "prosemirror-state"
import { DecorationSet, Decoration } from "prosemirror-view"
import { HyperlinkState, InsertStatus, pluginKey } from "./hyperlink"

const createTextCursor = (pos: number): Decoration => {
    const node = document.createElement("div")
    node.className = "ProseMirror-fake-text-cursor"
    return Decoration.widget(pos, node)
}

const createTextSelection = (from: number, to: number): Decoration =>
    Decoration.inline(from, to, { class: "ProseMirror-fake-text-selection" })

const getInsertLinkToolbarState = (editorState: EditorState) => {
    const state = pluginKey.getState(editorState) as HyperlinkState
    if (state && state.activeLinkMark) {
        if (state.activeLinkMark.type === InsertStatus.INSERT_LINK_TOOLBAR) {
            return state.activeLinkMark
        }
    }
    return undefined
}

export const fakeCursorToolbarPlugin: Plugin = new Plugin({
    state: {
        init() {
            return DecorationSet.empty
        },
        apply(tr, pluginState: DecorationSet, oldState, newState) {
            const oldInsertToolbarState = getInsertLinkToolbarState(oldState)
            const insertToolbarState = getInsertLinkToolbarState(newState)

開發者ID:zodiac-team，項目名稱:zodiac-ui，代碼行數:31，代碼來源:fake-cursor-for-toolbar.ts

注：本文中的prosemirror-view.Decoration類示例由純淨天空整理自Github/MSDocs等開源代碼及文檔管理平台，相關代碼片段篩選自各路編程大神貢獻的開源項目，源碼版權歸原作者所有，傳播和使用請參考對應項目的License；未經允許，請勿轉載。