mirror of
https://codeberg.org/Sevichecc/Seigwai.git
synced 2025-04-30 07:49:30 +08:00
chore: add husky
This commit is contained in:
parent
3ae0fc76a7
commit
deb6fa9702
GPG key ID:
C577000000000000
5 changed files with 0 additions and 333 deletions
|
|
@ -1,60 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { BlockProvider } from '@milkdown/plugin-block'
|
|
||||||
import { useInstance } from '@milkdown/vue'
|
|
||||||
import { usePluginViewContext } from '@prosemirror-adapter/vue'
|
|
||||||
import { onUnmounted, ref, watch } from 'vue'
|
|
||||||
|
|
||||||
import type { VNodeRef } from 'vue'
|
|
||||||
const { view } = usePluginViewContext()
|
|
||||||
const [loading, get] = useInstance()
|
|
||||||
|
|
||||||
const divRef = ref<VNodeRef>()
|
|
||||||
|
|
||||||
let tooltipProvider: BlockProvider | undefined
|
|
||||||
|
|
||||||
watch([loading], () => {
|
|
||||||
const editor = get()
|
|
||||||
// eslint-disable-next-line antfu/if-newline
|
|
||||||
if (loading.value || !editor || tooltipProvider) return
|
|
||||||
|
|
||||||
editor.action((ctx) => {
|
|
||||||
tooltipProvider = new BlockProvider({
|
|
||||||
ctx,
|
|
||||||
content: divRef.value as any,
|
|
||||||
})
|
|
||||||
|
|
||||||
tooltipProvider.update(view.value)
|
|
||||||
})
|
|
||||||
})
|
|
||||||
|
|
||||||
watch([view], () => {
|
|
||||||
tooltipProvider?.update(view.value)
|
|
||||||
})
|
|
||||||
|
|
||||||
onUnmounted(() => {
|
|
||||||
tooltipProvider?.destroy()
|
|
||||||
tooltipProvider = undefined
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div
|
|
||||||
ref="divRef"
|
|
||||||
className="w-6 bg-slate-200 rounded hover:bg-slate-300 cursor-grab"
|
|
||||||
>
|
|
||||||
<svg
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
fill="none"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
strokeWidth="{1.5}"
|
|
||||||
stroke="currentColor"
|
|
||||||
className="w-6 h-6"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
strokeLinecap="round"
|
|
||||||
strokeLinejoin="round"
|
|
||||||
d="M12 6.75a.75.75 0 110-1.5.75.75 0 010 1.5zM12 12.75a.75.75 0 110-1.5.75.75 0 010 1.5zM12 18.75a.75.75 0 110-1.5.75.75 0 010 1.5z"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
@ -1,67 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { Editor, defaultValueCtx, rootCtx } from '@milkdown/core'
|
|
||||||
import { commonmark } from '@milkdown/preset-commonmark'
|
|
||||||
import { nord } from '@milkdown/theme-nord'
|
|
||||||
import { history } from '@milkdown/plugin-history'
|
|
||||||
import { math } from '@milkdown/plugin-math'
|
|
||||||
import { Milkdown, useEditor } from '@milkdown/vue'
|
|
||||||
import { tooltipFactory } from '@milkdown/plugin-tooltip'
|
|
||||||
import { usePluginViewFactory } from '@prosemirror-adapter/vue'
|
|
||||||
import { gfm } from '@milkdown/preset-gfm'
|
|
||||||
import { clipboard } from '@milkdown/plugin-clipboard'
|
|
||||||
import { emoji } from '@milkdown/plugin-emoji'
|
|
||||||
import { block } from '@milkdown/plugin-block'
|
|
||||||
import { cursor } from '@milkdown/plugin-cursor'
|
|
||||||
|
|
||||||
import Tooltip from './Tooltip.vue'
|
|
||||||
import Slash from './Slash.vue'
|
|
||||||
import Block from './Block.vue'
|
|
||||||
|
|
||||||
const tooltip = tooltipFactory('Text')
|
|
||||||
const slash = tooltipFactory('Text')
|
|
||||||
|
|
||||||
const markdown = `# Milkdown Vue Commonmark
|
|
||||||
> You're scared of a world where you're needed.
|
|
||||||
|
|
||||||
This is a demo for using Milkdown with **Vue**.`
|
|
||||||
|
|
||||||
const pluginViewFactory = usePluginViewFactory()
|
|
||||||
|
|
||||||
useEditor((root) => {
|
|
||||||
return Editor.make()
|
|
||||||
.config(nord)
|
|
||||||
.config((ctx) => {
|
|
||||||
ctx.set(rootCtx, root)
|
|
||||||
ctx.set(defaultValueCtx, markdown)
|
|
||||||
ctx.set(tooltip.key, {
|
|
||||||
view: pluginViewFactory({
|
|
||||||
component: Tooltip,
|
|
||||||
}),
|
|
||||||
})
|
|
||||||
ctx.set(slash.key, {
|
|
||||||
view: pluginViewFactory({
|
|
||||||
component: Slash,
|
|
||||||
}),
|
|
||||||
})
|
|
||||||
ctx.set(block.key, {
|
|
||||||
view: pluginViewFactory({
|
|
||||||
component: Block,
|
|
||||||
}),
|
|
||||||
})
|
|
||||||
})
|
|
||||||
.use(commonmark)
|
|
||||||
.use(tooltip)
|
|
||||||
.use(slash)
|
|
||||||
.use(history)
|
|
||||||
.use(math)
|
|
||||||
.use(gfm)
|
|
||||||
.use(clipboard)
|
|
||||||
.use(emoji)
|
|
||||||
.use(block)
|
|
||||||
.use(cursor)
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<Milkdown />
|
|
||||||
</template>
|
|
||||||
|
|
@ -1,13 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { MilkdownProvider } from '@milkdown/vue'
|
|
||||||
import { ProsemirrorAdapterProvider } from '@prosemirror-adapter/vue'
|
|
||||||
import Editor from './Editor.vue'
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<MilkdownProvider>
|
|
||||||
<ProsemirrorAdapterProvider>
|
|
||||||
<Editor />
|
|
||||||
</ProsemirrorAdapterProvider>
|
|
||||||
</MilkdownProvider>
|
|
||||||
</template>
|
|
||||||
|
|
@ -1,106 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { onMounted, onUnmounted, ref, watch } from 'vue'
|
|
||||||
import { useInstance } from '@milkdown/vue'
|
|
||||||
import { usePluginViewContext } from '@prosemirror-adapter/vue'
|
|
||||||
import { editorViewCtx } from '@milkdown/core'
|
|
||||||
import { SlashProvider } from '@milkdown/plugin-slash'
|
|
||||||
import { callCommand } from '@milkdown/utils'
|
|
||||||
|
|
||||||
import type { VNodeRef } from 'vue'
|
|
||||||
import type { CmdKey } from '@milkdown/core'
|
|
||||||
import {
|
|
||||||
createCodeBlockCommand,
|
|
||||||
insertHrCommand,
|
|
||||||
wrapInBlockquoteCommand,
|
|
||||||
wrapInBulletListCommand,
|
|
||||||
wrapInHeadingCommand,
|
|
||||||
wrapInOrderedListCommand,
|
|
||||||
} from '@milkdown/preset-commonmark'
|
|
||||||
|
|
||||||
const [loading, get] = useInstance()
|
|
||||||
|
|
||||||
const call = <T>(command: CmdKey<T>, payload?: T) => {
|
|
||||||
return get()!.action((ctx) => {
|
|
||||||
const view = ctx.get(editorViewCtx)
|
|
||||||
const { dispatch, state } = view
|
|
||||||
const { tr, selection } = state
|
|
||||||
const { from } = selection
|
|
||||||
dispatch(tr.deleteRange(from - 1, from))
|
|
||||||
return callCommand(command, payload)(ctx)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
let tooltipProvider: SlashProvider
|
|
||||||
|
|
||||||
const { view, prevState } = usePluginViewContext()
|
|
||||||
const divRef = ref<VNodeRef>()
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
tooltipProvider = new SlashProvider({
|
|
||||||
content: divRef.value as any,
|
|
||||||
})
|
|
||||||
|
|
||||||
tooltipProvider.update(view.value, prevState.value)
|
|
||||||
})
|
|
||||||
|
|
||||||
watch([view, prevState], () => {
|
|
||||||
tooltipProvider?.update(view.value, prevState.value)
|
|
||||||
})
|
|
||||||
|
|
||||||
onUnmounted(() => {
|
|
||||||
tooltipProvider.destroy()
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div v-if="loading" ref="divRef">
|
|
||||||
<button
|
|
||||||
class="text-gray-600 bg-slate-200 px-2 py-1 rounded-lg hover:bg-slate-300 border hover:text-gray-900"
|
|
||||||
@click.prevent="call(createCodeBlockCommand.key)"
|
|
||||||
>
|
|
||||||
Code Block
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
class="text-gray-600 bg-slate-200 px-2 py-1 rounded-lg hover:bg-slate-300 border hover:text-gray-900"
|
|
||||||
@click.prevent="call(wrapInHeadingCommand.key, 1)"
|
|
||||||
>
|
|
||||||
Heading1
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
class="text-gray-600 bg-slate-200 px-2 py-1 rounded-lg hover:bg-slate-300 border hover:text-gray-900"
|
|
||||||
@click.prevent="call(wrapInHeadingCommand.key, 2)"
|
|
||||||
>
|
|
||||||
Heading2
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
class="text-gray-600 bg-slate-200 px-2 py-1 rounded-lg hover:bg-slate-300 border hover:text-gray-900"
|
|
||||||
@click.prevent="call(wrapInHeadingCommand.key, 3)"
|
|
||||||
>
|
|
||||||
Heading3
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
class="text-gray-600 bg-slate-200 px-2 py-1 rounded-lg hover:bg-slate-300 border hover:text-gray-900"
|
|
||||||
@click.prevent="call(wrapInBulletListCommand.key)"
|
|
||||||
>
|
|
||||||
BulletList
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
class="text-gray-600 bg-slate-200 px-2 py-1 rounded-lg hover:bg-slate-300 border hover:text-gray-900"
|
|
||||||
@click.prevent="call(wrapInOrderedListCommand.key)"
|
|
||||||
>
|
|
||||||
OrderList
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
class="text-gray-600 bg-slate-200 px-2 py-1 rounded-lg hover:bg-slate-300 border hover:text-gray-900"
|
|
||||||
@click.prevent="call(wrapInBlockquoteCommand.key)"
|
|
||||||
>
|
|
||||||
Quote
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
class="text-gray-600 bg-slate-200 px-2 py-1 rounded-lg hover:bg-slate-300 border hover:text-gray-900"
|
|
||||||
@click.prevent="call(insertHrCommand.key)"
|
|
||||||
>
|
|
||||||
Hr
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
@ -1,87 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { useInstance } from '@milkdown/vue'
|
|
||||||
import { TooltipProvider } from '@milkdown/plugin-tooltip'
|
|
||||||
import { usePluginViewContext } from '@prosemirror-adapter/vue'
|
|
||||||
import { onMounted, onUnmounted, ref, watch } from 'vue'
|
|
||||||
import type { CmdKey } from '@milkdown/core'
|
|
||||||
import type { VNodeRef } from 'vue'
|
|
||||||
import { callCommand } from '@milkdown/utils'
|
|
||||||
import {
|
|
||||||
toggleEmphasisCommand,
|
|
||||||
toggleInlineCodeCommand,
|
|
||||||
toggleStrongCommand,
|
|
||||||
wrapInBlockquoteCommand,
|
|
||||||
} from '@milkdown/preset-commonmark'
|
|
||||||
|
|
||||||
import { toggleStrikethroughCommand } from '@milkdown/preset-gfm'
|
|
||||||
import LinkWidge from './LinkWidge.vue'
|
|
||||||
|
|
||||||
const [loading, get] = useInstance()
|
|
||||||
|
|
||||||
const call = <T>(command: CmdKey<T>, payload?: T) => {
|
|
||||||
return get()?.action(callCommand(command, payload))
|
|
||||||
}
|
|
||||||
|
|
||||||
const { view, prevState } = usePluginViewContext()
|
|
||||||
|
|
||||||
const divRef = ref<VNodeRef>()
|
|
||||||
|
|
||||||
let tooltipProvider: TooltipProvider
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
tooltipProvider = new TooltipProvider({
|
|
||||||
content: divRef.value as any,
|
|
||||||
})
|
|
||||||
|
|
||||||
tooltipProvider.update(view.value, prevState.value)
|
|
||||||
})
|
|
||||||
|
|
||||||
watch([view, prevState], () => {
|
|
||||||
tooltipProvider?.update(view.value, prevState.value)
|
|
||||||
})
|
|
||||||
|
|
||||||
onUnmounted(() => {
|
|
||||||
tooltipProvider.destroy()
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div v-if="loading" ref="divRef">
|
|
||||||
<div class="flex text-gray-700 bg-slate-50 border rounded-md grass">
|
|
||||||
<button
|
|
||||||
class="btn btn-sm btn-ghost"
|
|
||||||
@click.prevent="call(toggleStrongCommand.key)"
|
|
||||||
>
|
|
||||||
B
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
class="btn btn-sm btn-ghost i-mingcute-code-line"
|
|
||||||
@click.prevent="call(toggleInlineCodeCommand.key)"
|
|
||||||
></button>
|
|
||||||
<button
|
|
||||||
class="btn btn-sm btn-ghost"
|
|
||||||
@click.prevent="call(toggleEmphasisCommand.key)"
|
|
||||||
>
|
|
||||||
Italic
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
class="btn btn-sm btn-ghost"
|
|
||||||
@click.prevent="call(wrapInBlockquoteCommand.key)"
|
|
||||||
>
|
|
||||||
Quote
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
class="btn btn-sm btn-ghost"
|
|
||||||
@click.prevent="call(toggleStrikethroughCommand.key)"
|
|
||||||
>
|
|
||||||
StrikeThrough
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
class="btn btn-sm btn-ghost"
|
|
||||||
@click.prevent="call(toggleStrikethroughCommand.key)"
|
|
||||||
>
|
|
||||||
Link
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
Loading…
Reference in a new issue