// import this after install `@mdi/font` package
import '@mdi/font/css/materialdesignicons.css'

import 'vuetify/styles'
import { createVuetify } from 'vuetify'
import {
  BaseKit,
  Bold,
  Clear,
  Heading,
  History,
  Indent,
  Table,
  TextAlign,
  VuetifyTiptap,
  createVuetifyProTipTap, FontSize, FontFamily,
} from 'vuetify-pro-tiptap'

import 'vuetify/styles'
import 'vuetify-pro-tiptap/styles/editor.css'
import 'vuetify-pro-tiptap/styles/markdown.css'

const vuetifyProTipTap = createVuetifyProTipTap({
  lang: 'de',
  markdownTheme: 'github',
  components: {
    VuetifyTiptap,
  },
  extensions: [
    BaseKit.configure({
      placeholder: {
        placeholder: 'Enter some text...'
      },
    }),
    Bold,
    Heading,
    TextAlign,
    FontSize,
    FontFamily,
    Clear.configure({ divider: true }),
    Indent.configure({ divider: true }),
    Table.configure({ divider: true }),
    History.configure({ divider: true }),
  ]
})

export default defineNuxtPlugin((app) => {
  const vuetify = createVuetify({
    // ... your configuration
  })
  app.vueApp.use(vuetify)
  app.vueApp.use(vuetifyProTipTap)
})