当前位置: 首页>>代码示例>>TypeScript>>正文


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;未经允许,请勿转载。