feat(icons): support Material Symbols

[J-Sek]

Description

TODO:

• resolve missing symbols:
  • filled star
  • carousel delimiter

resolves #20053

Markup:

Playground

• compare with same example for MD
• compare with same example for MDI

pnpm i -D @material-symbols/font-400

import '@material-symbols/font-400/outlined.css'
import { aliases, mat } from 'vuetify/iconsets/mat'

import { createVuetify } from 'vuetify'

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

// vue.use(vuetify)

<template>
  <v-container class="d-flex flex-wrap ga-3" width="600">
    <v-btn variant='outlined' v-for='ic in Object.values(aliases)' :key='ic' :icon='ic' />
  </v-container>
</template>

<script lang="ts" setup>
import { aliases } from 'vuetify/iconsets/mat'
</script>