@progress/kendo-vue-buttons/SpeechToText/SpeechToTextButton.mjs

TODO

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2026 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
import { defineComponent as k, computed as w, createVNode as z, ref as A, watch as C, onMounted as F, onUnmounted as H } from "vue";
import { KendoSpeechRecognition as N } from "@progress/kendo-webspeech-common";
import { Button as T } from "../Button.mjs";
import { microphoneIcon as I, stopIcon as W } from "@progress/kendo-svg-icons";
function U(e) {
  return new N(e);
}
let S = /* @__PURE__ */ (function(e) {
  return e.WebSpeech = "WebSpeech", e.None = "None", e;
})({});
const O = /* @__PURE__ */ k({
  name: "KendoSpeechToTextButton",
  props: {
    lang: {
      type: String,
      default: "en-US"
    },
    continuous: {
      type: Boolean,
      default: !1
    },
    interimResults: {
      type: Boolean,
      default: !1
    },
    maxAlternatives: {
      type: Number,
      default: 1
    },
    integrationMode: {
      type: String,
      default: S.WebSpeech
    },
    onStart: {
      type: Function
    },
    onResult: {
      type: Function
    },
    onEnd: {
      type: Function
    },
    onError: {
      type: Function
    },
    svgIcon: {
      type: Object,
      default: I
    },
    iconSize: {
      type: String
    },
    disabled: {
      type: Boolean,
      default: void 0
    },
    size: String,
    rounded: String,
    fillMode: String,
    themeColor: String,
    title: {
      type: String,
      default: "Speech to Text Button"
    },
    ariaLabel: {
      type: String,
      default: "Start speech recognition"
    }
  },
  setup(e, {
    emit: s,
    expose: d
  }) {
    const o = A(null), n = A(!1), f = () => {
      var t;
      return (t = o.value) == null ? void 0 : t.isActive();
    }, r = () => e.integrationMode !== S.None, l = typeof window != "undefined" && !("webkitSpeechRecognition" in window || "SpeechRecognition" in window) ? (e.onError && e.onError({
      errorMessage: "Speech Recognition API is not supported in this browser."
    }), !1) : !0, c = () => {
      var t;
      n.value || (r() && ((t = o.value) == null || t.start()), n.value = !0);
    }, i = () => {
      var t;
      n.value && (r() && ((t = o.value) == null || t.stop()), n.value = !1);
    }, g = () => {
      var t;
      n.value && r() && ((t = o.value) == null || t.abort(), n.value = !1);
    }, v = () => {
      l && (n.value ? h() : u());
    }, u = async () => {
      n.value || (e.onStart && await e.onStart(), c());
    }, M = (t) => {
      const a = t.results, x = a.length - 1, p = a[x], B = Array.from(p).map((R) => ({
        transcript: R.transcript,
        confidence: R.confidence
      })), b = {
        isFinal: p.isFinal,
        alternatives: B
      };
      e.onResult && e.onResult(b), s("result", b);
    }, h = async () => {
      n.value && (e.onEnd && await e.onEnd(), i());
    }, E = (t) => {
      n.value = !1;
      const a = {
        errorMessage: t.error || t.errorMessage || "Unknown error"
      };
      e.onError && e.onError(a), s("error", a);
    }, y = () => {
      var t;
      l && e.integrationMode === S.WebSpeech && ((t = o.value) != null && t.isActive() && i(), o.value = U({
        lang: e.lang,
        continuous: e.continuous,
        interimResults: e.interimResults,
        integrationMode: e.integrationMode,
        maxAlternatives: e.maxAlternatives,
        events: {
          start: u,
          result: M,
          end: h,
          error: E
        }
      }));
    };
    return C(() => ({
      lang: e.lang,
      continuous: e.continuous,
      interimResults: e.interimResults,
      integrationMode: e.integrationMode,
      maxAlternatives: e.maxAlternatives
    }), () => {
      y();
    }, {
      deep: !0
    }), F(() => {
      y();
    }), H(() => {
      var t;
      (t = o.value) != null && t.isInActiveState && i();
    }), d({
      start: c,
      stop: i,
      abort: g,
      isActive: f
    }), {
      clickHandler: v,
      isInActiveState: n
    };
  },
  render() {
    const {
      ariaLabel: e,
      svgIcon: s,
      fillMode: d,
      rounded: o,
      size: n,
      disabled: f,
      themeColor: r,
      iconSize: m,
      title: l
    } = this.$props, {
      className: c,
      style: i,
      id: g
    } = this.$attrs, v = w(() => ["k-speech-to-text-button", c, {
      "k-listening": this.isInActiveState
    }]), u = w(() => this.isInActiveState ? W : s || I);
    return z(T, {
      id: g,
      style: i,
      class: v.value,
      onClick: this.clickHandler,
      svgIcon: u.value,
      iconSize: m,
      fillMode: d,
      rounded: o,
      size: n,
      themeColor: r,
      "aria-label": e,
      disabled: f,
      title: l
    }, null);
  }
});
export {
  O as SpeechToTextButton,
  S as SpeechToTextButtonMode
};