vue-material-adapter/src/icon-button/icon-toggle.js

Vue 3 wrapper arround Material Components for the Web

import { h } from 'vue';

export default {
  name: 'mcw-icon-toggle',
  props: {
    isOn: Boolean,
  },

  setup(props, { slots }) {
    return () => {
      return h(
        'i',
        {
          class: {
            'material-icons': 1,
            'mdc-icon-button__icon': true,
            'mdc-icon-button__icon--on': props.isOn,
          },
        },
        slots.default?.(),
      );
    };
  },
};