<template functional>
  <span :aria-hidden="props.decorative"
        :aria-label="props.title"
        :class="[data.class, data.staticClass]"
        class="material-design-icon alarm-note-off-icon"
        role="img"
        @click="listeners.click ? listeners.click : () => true">
    <svg :fill="props.fillColor"
         class="material-design-icon__svg"
         :width="props.size"
         :height="props.size"
         viewBox="0 0 24 24">
      <path d="M19,13V15.8L20,16.8V15H23V13H19M2.38,1.73L1.11,3L3,4.88L2,5.71L3.29,7.24L4.41,6.3L5.21,7.1C1.95,10.85 2.35,16.54 6.11,19.8C7.74,21.22 9.83,22 12,22C12.33,22 12.67,22 13,21.94V19.94C12.67,20 12.33,20 12,20C8.13,20 5,16.87 5,13C5,11.36 5.57,9.77 6.63,8.5L11.41,13.3L7.5,15.62L8.25,16.85L12.44,14.33L16.38,18.27C15.14,18.88 14.64,20.38 15.25,21.62C15.86,22.86 17.36,23.36 18.6,22.75C19.09,22.5 19.5,22.11 19.73,21.62L20.84,22.73L22.11,21.46L2.38,1.73M12,6C15.1,6 17.83,8.03 18.71,11H20.78C19.85,6.9 16.2,4 12,4C10.65,4 9.31,4.3 8.1,4.9L9.62,6.42C10.38,6.14 11.19,6 12,6M11.5,8.3L13,9.8V8H11.5V8.3M7.88,3.39L6.6,1.86L5.76,2.56L7.18,4L7.88,3.39M17.4,1.86L16.11,3.39L20.71,7.25L22,5.72L17.4,1.86Z">
        <title>{{ props.title }}</title>
      </path>
    </svg>
  </span>
</template>

<script>
export default {
  name: "AlarmNoteOffIcon",
  props: {
    title: {
      type: String,
      default: "Alarm Note Off icon"
    },
    decorative: {
      type: Boolean,
      default: false
    },
    fillColor: {
      type: String,
      default: "currentColor"
    },
    size: {
      type: Number,
      default: 24
    }
  }
}
</script>