import '@material-symbols/font-400/outlined.css'
import { aliases } from 'vuetify/iconsets/md' // aliases are the same
import { VLigatureIcon } from 'vuetify/lib/composables/icons.mjs'
import { h } from 'vue'
const mat = { component: (props: any) => h(VLigatureIcon, { ...props, class: 'material-symbols-outlined' }) }

import { createVuetify } from 'vuetify'

const vuetify = createVuetify({
  icons: {
    defaultSet: 'mat',
    aliases,
    sets: { mat },
  },
})

import { h } from 'vue'
import type { IconSet, IconAliases, IconProps } from 'vuetify'
const aliases: IconAliases = {
  collapse: 'keyboard_arrow_up',
  complete: 'check',
  cancel: 'cancel',
  close: 'close',
  delete: 'cancel',
  // delete (e.g. v-chip close)
  clear: 'cancel',
  success: 'check_circle',
  info: 'info',
  warning: 'priority_high',
  error: 'warning',
  prev: 'chevron_left',
  next: 'chevron_right',
  checkboxOn: 'check_box',
  checkboxOff: 'check_box_outline_blank',
  checkboxIndeterminate: 'indeterminate_check_box',
  delimiter: 'fiber_manual_record',
  // for carousel
  sortAsc: 'arrow_upward',
  sortDesc: 'arrow_downward',
  expand: 'keyboard_arrow_down',
  menu: 'menu',
  subgroup: 'arrow_drop_down',
  dropdown: 'arrow_drop_down',
  radioOn: 'radio_button_checked',
  radioOff: 'radio_button_unchecked',
  edit: 'edit',
  ratingEmpty: 'star_border',
  ratingFull: 'star',
  ratingHalf: 'star_half',
  loading: 'cached',
  first: 'first_page',
  last: 'last_page',
  unfold: 'unfold_more',
  file: 'attach_file',
  plus: 'add',
  minus: 'remove',
  calendar: 'event',
  treeviewCollapse: 'arrow_drop_down',
  treeviewExpand: 'arrow_right',
  eyeDropper: 'colorize'
}

interface ExtendedIconProps extends IconProps {
  variant?: 'outlined' | 'sharp' | 'rounded'
}

const mds: IconSet = {
  component: (props: ExtendedIconProps) => {
    const iconClass = props.variant
      ? `material-symbols-${props.variant}`
      : 'material-symbols-outlined'
    return h(props.tag, {
      ...props,
      class: iconClass,
      innerHTML: props.icon
    })
  }
}

export { aliases, mds }

import '@mdi/font/css/materialdesignicons.css'
import 'material-symbols'
import 'vuetify/styles'

import { aliases, mds } from './iconsets/mds'
import { mdi } from 'vuetify/iconsets/mdi'

import { createVuetify } from 'vuetify'
import * as components from 'vuetify/components'
import * as directives from 'vuetify/directives'
import * as labsComponents from 'vuetify/labs/components'

export default createVuetify({
  components: {
    ...components,
    ...labsComponents,
  },
  directives,
  icons: {
    defaultSet: 'mds',
    aliases,
    sets: {
      mds,
      mdi
    },
  },
})