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
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