import { createVuetify } from 'vuetify'
import { VBtn, VDialog, VExpansionPanel, VExpansionPanels, VExpansionPanelText, VExpansionPanelTitle, VOtpInput, VProgressCircular, VProgressLinear, VRadio, VRadioGroup, VRangeSlider } from 'vuetify/components'
// Only import directives you actually use instead of all directives
import { Ripple, ClickOutside } from 'vuetify/directives'

export default defineNuxtPlugin(nuxtApp => {
  const vuetify = createVuetify({
    components: {
      VProgressCircular,
      VBtn,
      VDialog,
      VRadioGroup,
      VRadio,
      VOtpInput,
      VRangeSlider,
      VProgressLinear,
      VExpansionPanels,
      VExpansionPanel,
      VExpansionPanelTitle,
      VExpansionPanelText,
    },
    directives: {
      Ripple,
      ClickOutside,
    },
  })
  nuxtApp.vueApp.use(vuetify)
})