@progress/kendo-react-buttons 14.5.0-develop.9 → 15.0.0-develop.2

package/ListButton/SplitButton.mjs

@@ -7,16 +7,18 @@
  */
 import * as p from "react";
 import s from "prop-types";
-import { Button as m } from "../Button.mjs";
-import { Keys as a, dispatchEvent as l, getActiveElement as c, validatePackage as k, getLicenseMessage as b, svgIconPropType as y, classNames as d, kendoThemeMaps as f, WatermarkOverlay as D } from "@progress/kendo-react-common";
-import { ButtonItem as I } from "./ButtonItem.mjs";
-import { SplitButtonItem as w } from "./SplitButtonItem.mjs";
-import { navigate as v } from "./utils/navigation.mjs";
-import { Popup as O } from "@progress/kendo-react-popup";
-import { getPopupAlign as S, getAnchorAlign as E } from "./utils/popup.mjs";
-import { packageMetadata as g } from "../package-metadata.mjs";
-import { chevronDownIcon as P } from "@progress/kendo-svg-icons";
-const u = class u extends p.Component {
+import { Button as g } from "../Button.mjs";
+import { Keys as a, dispatchEvent as h, getActiveElement as m, validatePackage as D, getLicenseMessage as w, svgIconPropType as I, classNames as l, kendoThemeMaps as C, WatermarkOverlay as v } from "@progress/kendo-react-common";
+import { ButtonItem as S } from "./ButtonItem.mjs";
+import { SplitButtonItem as O } from "./SplitButtonItem.mjs";
+import { navigate as E } from "./utils/navigation.mjs";
+import { Popup as F } from "@progress/kendo-react-popup";
+import { provideLocalizationService as P, registerForLocalization as x } from "@progress/kendo-react-intl";
+import { getPopupAlign as M, getAnchorAlign as z } from "./utils/popup.mjs";
+import { packageMetadata as k } from "../package-metadata.mjs";
+import { splitButtonToggleDropdown as b, messages as B } from "../messages/index.mjs";
+import { chevronDownIcon as A } from "@progress/kendo-svg-icons";
+const d = class d extends p.Component {
   constructor(i) {
     super(i), this.state = {
       focused: !1,
@@ -42,16 +44,16 @@ const u = class u extends p.Component {
         return;
       }
       if (this.opened) {
-        const n = v(e, t.keyCode, t.altKey, this.buttonsData.length);
+        const n = E(e, t.keyCode, t.altKey, this.buttonsData.length);
         n !== e && (o = o || {}, o.focusedIndex = n);
-        const h = t.keyCode === a.up || t.keyCode === a.down || t.keyCode === a.left || t.keyCode === a.right;
-        !t.altKey && (h || t.keyCode === a.home || t.keyCode === a.end) && t.preventDefault();
+        const u = t.keyCode === a.up || t.keyCode === a.down || t.keyCode === a.left || t.keyCode === a.right;
+        !t.altKey && (u || t.keyCode === a.home || t.keyCode === a.end) && t.preventDefault();
       }
       o && this.setState(o);
     }, this.switchFocus = (t) => {
       this.skipFocus = !0, t(), window.setTimeout(() => this.skipFocus = !1, 0);
     }, this.onFocus = (t) => {
-      this.skipFocus || (l(this.props.onFocus, t, this, void 0), this.setState({ focused: !0 }));
+      this.skipFocus || (h(this.props.onFocus, t, this, void 0), this.setState({ focused: !0 }));
     }, this.setOpen = (t, e) => {
       this.opened !== t && (this.openedDuringOnChange = t, this.setState({ opened: t }), e ? this.dispatchPopupEvent(e, t) : this.openedDuringOnChange = void 0);
     }, this.onItemClick = (t, e) => {
@@ -60,12 +62,12 @@ const u = class u extends p.Component {
       this.skipFocus || (this.setState({
         focused: !1,
         focusedIndex: -1
-      }), l(this.props.onBlur, t, this, void 0), setTimeout(() => {
+      }), h(this.props.onBlur, t, this, void 0), setTimeout(() => {
         this.setOpen(!1, t);
       }, 0));
     }, this.onPopupClose = (t) => {
       var o;
-      const e = c(document);
+      const e = m(document);
       this.element && this.element.removeAttribute("tabindex"), (e === this.list || (o = this.list) != null && o.contains(e)) && this.switchFocus(() => {
         this.element && this.element.focus({ preventScroll: !0 });
       }), this.props.popupSettings && this.props.popupSettings.onClose && this.props.popupSettings.onClose.call(void 0, t);
@@ -83,13 +85,13 @@ const u = class u extends p.Component {
       }
     }, this.onDownSplitPart = (t) => {
       t.preventDefault();
-      const e = c(document);
+      const e = m(document);
       this.element && e !== this.element && e !== this.list && this.element.focus();
     }, this.onItemDown = (t) => {
-      c(document) === this.list && t.preventDefault();
+      m(document) === this.list && t.preventDefault();
     }, this.dispatchPopupEvent = (t, e) => {
-      l(e ? this.props.onOpen : this.props.onClose, t, this, void 0), this.openedDuringOnChange = void 0;
-    }, this.showLicenseWatermark = !k(g, { component: "SplitButton" }), this.licenseMessage = b(g);
+      h(e ? this.props.onOpen : this.props.onClose, t, this, void 0), this.openedDuringOnChange = void 0;
+    }, this.showLicenseWatermark = !D(k, { component: "SplitButton" }), this.licenseMessage = w(k);
   }
   get guid() {
     return this.props.id ? this.props.id + "-accessibility-id" : this.props.id;
@@ -101,20 +103,23 @@ const u = class u extends p.Component {
    * @hidden
    */
   render() {
-    this.buttonsData = this.props.items || p.Children.toArray(this.props.children).filter((r) => r && r.type === w).map((r) => r.props);
-    const i = this.isRtl(), t = i ? "rtl" : void 0, { id: e, style: o, tabIndex: n, disabled: h } = this.props;
+    this.buttonsData = this.props.items || p.Children.toArray(this.props.children).filter((r) => r && r.type === O).map((r) => r.props);
+    const i = this.isRtl(), t = i ? "rtl" : void 0, o = P(this).toLanguageString(
+      b,
+      B[b]
+    ), { id: n, style: u, tabIndex: y, disabled: c } = this.props;
     return /* @__PURE__ */ p.createElement(p.Fragment, null, /* @__PURE__ */ p.createElement(
       "div",
       {
-        id: e,
-        style: o,
-        className: d(
+        id: n,
+        style: u,
+        className: l(
           "k-split-button",
           "k-button-group",
           {
             "k-focus": this.state.focused
           },
-          this.props.rounded && `k-rounded-${f.roundedMap[this.props.rounded]}`,
+          this.props.rounded && `k-rounded-${C.roundedMap[this.props.rounded]}`,
           this.props.className
         ),
         onKeyDown: this.onKeyDown,
@@ -126,7 +131,7 @@ const u = class u extends p.Component {
         }
       },
       /* @__PURE__ */ p.createElement(
-        m,
+        g,
         {
           ref: (r) => {
             this.mainButton = r && r.element;
@@ -137,8 +142,8 @@ const u = class u extends p.Component {
           fillMode: this.props.fillMode,
           themeColor: this.props.themeColor,
           onClick: (r) => this.onItemClick(r, -1),
-          disabled: h || void 0,
-          tabIndex: n,
+          disabled: c || void 0,
+          tabIndex: y,
           accessKey: this.props.accessKey,
           className: this.props.buttonClass,
           icon: this.props.icon,
@@ -148,18 +153,15 @@ const u = class u extends p.Component {
           endIcon: this.props.endIcon,
           imageUrl: this.props.imageUrl,
           dir: t,
-          "aria-disabled": h,
-          "aria-haspopup": !0,
-          "aria-expanded": this.opened || void 0,
+          "aria-disabled": c,
           "aria-label": this.props.ariaLabel,
-          "aria-controls": this.opened ? this.guid : void 0,
           id: "button-" + this.guid,
           title: this.props.title
         },
         this.props.text
       ),
       /* @__PURE__ */ p.createElement(
-        m,
+        g,
         {
           type: "button",
           size: this.props.size,
@@ -167,19 +169,21 @@ const u = class u extends p.Component {
           fillMode: this.props.fillMode,
           themeColor: this.props.themeColor,
           icon: "chevron-down",
-          svgIcon: P,
+          svgIcon: A,
           className: "k-split-button-arrow",
-          disabled: h || void 0,
+          disabled: c || void 0,
           tabIndex: -1,
           onClick: this.onSplitPartClick,
           onMouseDown: this.onDownSplitPart,
           onPointerDown: this.onDownSplitPart,
           dir: t,
-          "aria-label": "menu toggling button"
+          "aria-label": o,
+          "aria-expanded": this.opened ? "true" : "false",
+          "aria-controls": this.opened ? this.guid : void 0
         }
       ),
       this.renderPopup(i)
-    ), this.showLicenseWatermark && /* @__PURE__ */ p.createElement(D, { message: this.licenseMessage }));
+    ), this.showLicenseWatermark && /* @__PURE__ */ p.createElement(v, { message: this.licenseMessage }));
   }
   /**
    * @hidden
@@ -194,7 +198,7 @@ const u = class u extends p.Component {
     return this.mainButton;
   }
   dispatchClickEvent(i, t) {
-    this.isItemDisabled(t) || (t === -1 ? l(this.props.onButtonClick, i, this, void 0) : l(this.props.onItemClick, i, this, {
+    this.isItemDisabled(t) || (t === -1 ? h(this.props.onButtonClick, i, this, void 0) : h(this.props.onItemClick, i, this, {
       item: this.buttonsData[t],
       itemIndex: t
     }));
@@ -202,14 +206,14 @@ const u = class u extends p.Component {
   renderPopup(i) {
     const { popupSettings: t = {} } = this.props, { focusedIndex: e } = this.state;
     return /* @__PURE__ */ p.createElement(
-      O,
+      F,
       {
         anchor: this.wrapper,
         show: this.opened,
         animate: t.animate,
-        popupClass: d("k-menu-popup", t.popupClass),
-        anchorAlign: t.anchorAlign || E(i),
-        popupAlign: t.popupAlign || S(i),
+        popupClass: l("k-menu-popup", t.popupClass),
+        anchorAlign: t.anchorAlign || z(i),
+        popupAlign: t.popupAlign || M(i),
         style: i ? { direction: "rtl" } : void 0,
         onClose: this.onPopupClose
       },
@@ -218,12 +222,11 @@ const u = class u extends p.Component {
         {
           role: "menu",
           id: this.guid,
-          "aria-labelledby": "button-" + this.guid,
           tabIndex: -1,
           ref: this.listRef,
           "aria-activedescendant": e >= 0 ? `${this.guid}-${e}` : void 0,
-          className: d("k-menu-group", {
-            [`k-menu-group-${f.sizeMap[this.props.size] || this.props.size}`]: this.props.size
+          className: l("k-menu-group", {
+            [`k-menu-group-${C.sizeMap[this.props.size] || this.props.size}`]: this.props.size
           })
         },
         this.renderChildItems()
@@ -233,9 +236,9 @@ const u = class u extends p.Component {
   renderChildItems() {
     const { item: i, itemRender: t, textField: e } = this.props;
     return this.buttonsData.length > 0 ? this.buttonsData.map((o, n) => /* @__PURE__ */ p.createElement(
-      I,
+      S,
       {
-        className: d(
+        className: l(
           "k-menu-item",
           { "k-first": n === 0 },
           { "k-last": n === this.buttonsData.length - 1 }
@@ -260,7 +263,7 @@ const u = class u extends p.Component {
     return this.props.dir !== void 0 ? this.props.dir === "rtl" : !!this.wrapper && getComputedStyle(this.wrapper).direction === "rtl";
   }
 };
-u.propTypes = {
+d.propTypes = {
   accessKey: s.string,
   ariaLabel: s.string,
   title: s.string,
@@ -276,7 +279,7 @@ u.propTypes = {
   tabIndex: s.number,
   disabled: s.bool,
   icon: s.string,
-  svgIcon: y,
+  svgIcon: I,
   imageUrl: s.string,
   popupSettings: s.object,
   itemRender: s.any,
@@ -298,13 +301,14 @@ u.propTypes = {
     "error",
     "inverse"
   ])
-}, u.defaultProps = {
+}, d.defaultProps = {
   size: void 0,
   rounded: void 0,
   fillMode: void 0,
   themeColor: void 0
 };
-let C = u;
+let f = d;
+x(f);
 export {
-  C as SplitButton
+  f as SplitButton
 };

package/README.md

@@ -1,4 +1,4 @@
-[![KendoReact NPM Banner](https://raw.githubusercontent.com/telerik/kendo-react/master/images/kendoreact-github-banner.png)](https://www.telerik.com/kendo-react-ui/components/free?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-buttons&utm_content=banner)
+[![KendoReact NPM Banner](https://raw.githubusercontent.com/telerik/kendo-react/master/images/kendoreact-github-banner.png)](https://www.telerik.com/kendo-react-ui/components/getting-started/free-vs-premium?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-buttons&utm_content=banner)
 
 # KendoReact Buttons Library for React
 
@@ -6,7 +6,7 @@
 >
 > -   This package is а part of [KendoReact](https://www.telerik.com/kendo-react-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-buttons)—an enterprise-grade UI library with 120+ free and premium components.
 > -   It contains both free and premium KendoReact components and tools. To use the premium components, you must install a license key file, whether you are on a paid license or a 30-day free trial. To receive a license key, either [purchase a license](https://www.telerik.com/kendo-react-ui/pricing) or start a [free trial](https://www.telerik.com/download-login-v2-kendo-react-ui). You can use the free components without having to sign up or get a license key.
-> -   If you're looking for free React components, check out [Get Started with KendoReact Free](https://www.telerik.com/kendo-react-ui/components/free).
+> -   If you're looking for free React components, check out [Get Started with KendoReact Free](https://www.telerik.com/kendo-react-ui/components/getting-started).
 > -   If you have an active license, visit the [KendoReact My License page](https://www.telerik.com/kendo-react-ui/components/my-license/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-buttons) to learn how to configure your KendoReact licensing.
 > -   Installing and working with this package indicates that you [accept the KendoReact License Agreement](https://www.telerik.com/purchase/license-agreement/progress-kendoreact?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-buttons).
 > -   The 30-day free trial gives you access to all KendoReact components and their full functionality. Additionally, for the period of your trial, you can use our legendary technical support provided directly by the KendoReact dev team!
@@ -279,7 +279,7 @@ import { Toolbar, Button, ButtonGroup } from '@progress/kendo-react-buttons'; //
 
 The following table outlines the key resources available with KendoReact and KendoReact Free.
 
-|                                  | [KendoReact Free](https://www.telerik.com/kendo-react-ui/components/free)                                                                                                                                | [KendoReact](https://www.telerik.com/kendo-react-ui)                                                                                                                                                     |
+|                                  | [KendoReact Free](https://www.telerik.com/kendo-react-ui/components/getting-started/free-vs-premium)                                                                                                     | [KendoReact](https://www.telerik.com/kendo-react-ui)                                                                                                                                                     |
 | -------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
 | React components                 | 50+                                                                                                                                                                                                      | 120+                                                                                                                                                                                                     |
 | Four professional themes         | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> |
@@ -302,7 +302,7 @@ For any issues you might encounter while working with the KendoReact Buttons, us
 ## Resources
 
 -   [Getting Started with KendoReact](https://www.telerik.com/kendo-react-ui/components/getting-started/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-buttons)
--   [Get Started with KendoReact Free](https://www.telerik.com/kendo-react-ui/components/free)
+-   [Get Started with KendoReact Free](https://www.telerik.com/kendo-react-ui/components/getting-started)
 -   [Getting Started with the KendoReact Buttons](https://www.telerik.com/kendo-react-ui/components/buttons/get-started/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-buttons)
 -   [API Reference of the KendoReact Buttons](https://www.telerik.com/kendo-react-ui/components/buttons/api/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-buttons)
 -   [KendoReact Roadmap](https://www.telerik.com/support/whats-new/kendo-react-ui/roadmap?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-buttons)

package/SpeechToTextButton/SpeechToTextButton.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ee=require("react"),te=require("@progress/kendo-webspeech-common"),ne=require("../Button.js"),g=require("@progress/kendo-react-common"),A=require("@progress/kendo-svg-icons"),a=require("../messages/index.js"),se=require("@progress/kendo-react-intl"),q=require("../package-metadata.js");function oe(n){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const o in n)if(o!=="default"){const u=Object.getOwnPropertyDescriptor(n,o);Object.defineProperty(i,o,u.get?u:{enumerable:!0,get:()=>n[o]})}}return i.default=n,Object.freeze(i)}const e=oe(ee),O=e.forwardRef((n,i)=>{const o=!g.validatePackage(q.packageMetadata,{component:"SpeechToTextButton"}),u=g.getLicenseMessage(q.packageMetadata),k=se.useLocalization(),{fillMode:z,rounded:B,size:E,themeColor:L,ariaLabel:p,svgIcon:v,disabled:j,iconSize:H,title:m,className:N,id:P,style:F,lang:T="en-US",continuous:R=!1,interimResults:w=!1,maxAlternatives:C=1,integrationMode:W="webSpeech",onStart:h,onResult:d,onEnd:b,onError:r,..._}=n,c=e.useRef(null),s=e.useRef(!1),[l,f]=e.useState(!1),D=e.useCallback(async()=>{s.current=!0,f(!0),h&&await h()},[h]),K=e.useCallback(async()=>{s.current=!1,f(!1),b&&await b()},[b]),U=e.useCallback(t=>{const M=t.results,x=M[M.length-1],$=Array.from(x).map(I=>({transcript:I.transcript,confidence:I.confidence}));d==null||d({isFinal:x.isFinal,alternatives:$})},[d]),G=e.useCallback(t=>{f(!1),s.current=!1,r==null||r({errorMessage:t.error})},[r]),J=()=>{var t;if(typeof window!="undefined"&&!("webkitSpeechRecognition"in window||"SpeechRecognition"in window)){r&&r({errorMessage:"Speech Recognition API is not supported in this browser."});return}(t=c.current)!=null&&t.isActive()&&c.current.stop(),c.current=new te.KendoSpeechRecognition({lang:T,continuous:R,interimResults:w,maxAlternatives:C,events:{start:D,end:K,result:U,error:G}})},y=e.useCallback(()=>{var t;s.current||(t=c.current)==null||t.start()},[]),S=e.useCallback(()=>{var t;s.current&&((t=c.current)==null||t.stop())},[]),Q=e.useCallback(()=>{var t;s.current&&((t=c.current)==null||t.abort(),s.current=!1,f(!1))},[]),V=()=>s.current;e.useImperativeHandle(i,()=>({start:y,stop:S,abort:Q,isActive:V})),e.useEffect(()=>(J(),()=>{s.current&&S()}),[T,R,w,C,W]);const X=()=>{l?S():y()},Y=n.icon!==void 0||n.iconClass!==void 0,Z=e.useMemo(()=>l?A.stopIcon:v||A.microphoneIcon,[l,v]);return e.createElement(e.Fragment,null,e.createElement(ne.Button,{id:P,className:g.classNames({"k-speech-to-text-button":!0,"k-listening":l},N),style:F,svgIcon:Y?void 0:Z,iconSize:H,fillMode:z,rounded:B,size:E,themeColor:L,"aria-label":p!=null?p:k.toLanguageString(a.speechToTextAriaLabel,a.messages[a.speechToTextAriaLabel]),"aria-pressed":l,disabled:j,title:m!=null?m:k.toLanguageString(a.speechToTextTitle,a.messages[a.speechToTextTitle]),onClick:X,..._},n.children),o&&e.createElement(g.WatermarkOverlay,{message:u}))});O.displayName="KendoSpeechToTextButton";exports.SpeechToTextButton=O;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ee=require("react"),te=require("@progress/kendo-webspeech-common"),ne=require("../Button.js"),g=require("@progress/kendo-react-common"),A=require("@progress/kendo-svg-icons"),a=require("../messages/index.js"),se=require("@progress/kendo-react-intl"),q=require("../package-metadata.js");function oe(n){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const o in n)if(o!=="default"){const u=Object.getOwnPropertyDescriptor(n,o);Object.defineProperty(i,o,u.get?u:{enumerable:!0,get:()=>n[o]})}}return i.default=n,Object.freeze(i)}const e=oe(ee),O=e.forwardRef((n,i)=>{const o=!g.validatePackage(q.packageMetadata,{component:"SpeechToTextButton"}),u=g.getLicenseMessage(q.packageMetadata),k=se.useLocalization(),{fillMode:z,rounded:B,size:E,themeColor:L,ariaLabel:p,svgIcon:v,disabled:j,iconSize:H,title:m,className:N,id:P,style:F,lang:T="en-US",continuous:R=!1,interimResults:w=!1,maxAlternatives:C=1,integrationMode:W="webSpeech",onStart:h,onResult:d,onEnd:b,onError:r,..._}=n,c=e.useRef(null),s=e.useRef(!1),[l,f]=e.useState(!1),D=e.useCallback(async()=>{s.current=!0,f(!0),h&&await h()},[h]),K=e.useCallback(async()=>{s.current=!1,f(!1),b&&await b()},[b]),U=e.useCallback(t=>{const M=t.results,x=M[M.length-1],$=Array.from(x).map(I=>({transcript:I.transcript,confidence:I.confidence}));d==null||d({isFinal:x.isFinal,alternatives:$})},[d]),G=e.useCallback(t=>{f(!1),s.current=!1,r==null||r({errorMessage:t.error})},[r]),J=()=>{var t;if(typeof window!="undefined"&&!("webkitSpeechRecognition"in window||"SpeechRecognition"in window)){r&&r({errorMessage:"Speech Recognition API is not supported in this browser."});return}(t=c.current)!=null&&t.isActive()&&c.current.stop(),c.current=new te.KendoSpeechRecognition({lang:T,continuous:R,interimResults:w,maxAlternatives:C,events:{start:D,end:K,result:U,error:G}})},y=e.useCallback(()=>{var t;s.current||(t=c.current)==null||t.start()},[]),S=e.useCallback(()=>{var t;s.current&&((t=c.current)==null||t.stop())},[]),Q=e.useCallback(()=>{var t;s.current&&((t=c.current)==null||t.abort(),s.current=!1,f(!1))},[]),V=()=>s.current;e.useImperativeHandle(i,()=>({start:y,stop:S,abort:Q,isActive:V})),e.useEffect(()=>(J(),()=>{s.current&&S()}),[T,R,w,C,W]);const X=()=>{l?S():y()},Y=n.icon!==void 0||n.iconClass!==void 0,Z=e.useMemo(()=>l?A.stopIcon:v||A.microphoneIcon,[l,v]);return e.createElement(e.Fragment,null,e.createElement(ne.Button,{id:P,className:g.classNames({"k-speech-to-text-button":!0,"k-listening":l},N),style:F,svgIcon:Y?void 0:Z,iconSize:H,fillMode:z,rounded:B,size:E,themeColor:L,"aria-label":p!=null?p:k.toLanguageString(a.speechToTextAriaLabel,a.messages[a.speechToTextAriaLabel]),"aria-pressed":l||void 0,disabled:j,title:m!=null?m:k.toLanguageString(a.speechToTextTitle,a.messages[a.speechToTextTitle]),onClick:X,..._},n.children),o&&e.createElement(g.WatermarkOverlay,{message:u}))});O.displayName="KendoSpeechToTextButton";exports.SpeechToTextButton=O;

package/SpeechToTextButton/SpeechToTextButton.mjs

@@ -8,8 +8,8 @@
 import * as e from "react";
 import { KendoSpeechRecognition as $ } from "@progress/kendo-webspeech-common";
 import { Button as ee } from "../Button.mjs";
-import { validatePackage as te, getLicenseMessage as ne, classNames as re, WatermarkOverlay as se } from "@progress/kendo-react-common";
-import { stopIcon as oe, microphoneIcon as ae } from "@progress/kendo-svg-icons";
+import { validatePackage as te, getLicenseMessage as ne, classNames as re, WatermarkOverlay as oe } from "@progress/kendo-react-common";
+import { stopIcon as se, microphoneIcon as ae } from "@progress/kendo-svg-icons";
 import { speechToTextTitle as T, messages as x, speechToTextAriaLabel as A } from "../messages/index.mjs";
 import { useLocalization as ce } from "@progress/kendo-react-intl";
 import { packageMetadata as I } from "../package-metadata.mjs";
@@ -34,14 +34,14 @@ const ie = e.forwardRef((a, M) => {
     integrationMode: W = "webSpeech",
     onStart: f,
     onResult: c,
-    onEnd: m,
+    onEnd: d,
     onError: r,
     ...U
-  } = a, s = e.useRef(null), n = e.useRef(!1), [o, i] = e.useState(!1), j = e.useCallback(async () => {
+  } = a, o = e.useRef(null), n = e.useRef(!1), [s, i] = e.useState(!1), j = e.useCallback(async () => {
     n.current = !0, i(!0), f && await f();
   }, [f]), q = e.useCallback(async () => {
-    n.current = !1, i(!1), m && await m();
-  }, [m]), D = e.useCallback(
+    n.current = !1, i(!1), d && await d();
+  }, [d]), D = e.useCallback(
     (t) => {
       const w = t.results, R = w[w.length - 1], _ = Array.from(R).map((C) => ({
         transcript: C.transcript,
@@ -66,7 +66,7 @@ const ie = e.forwardRef((a, M) => {
       r && r({ errorMessage: "Speech Recognition API is not supported in this browser." });
       return;
     }
-    (t = s.current) != null && t.isActive() && s.current.stop(), s.current = new $({
+    (t = o.current) != null && t.isActive() && o.current.stop(), o.current = new $({
       lang: h,
       continuous: v,
       interimResults: S,
@@ -80,25 +80,25 @@ const ie = e.forwardRef((a, M) => {
     });
   }, b = e.useCallback(() => {
     var t;
-    n.current || (t = s.current) == null || t.start();
-  }, []), d = e.useCallback(() => {
+    n.current || (t = o.current) == null || t.start();
+  }, []), m = e.useCallback(() => {
     var t;
-    n.current && ((t = s.current) == null || t.stop());
+    n.current && ((t = o.current) == null || t.stop());
   }, []), Q = e.useCallback(() => {
     var t;
-    n.current && ((t = s.current) == null || t.abort(), n.current = !1, i(!1));
+    n.current && ((t = o.current) == null || t.abort(), n.current = !1, i(!1));
   }, []), V = () => n.current;
   e.useImperativeHandle(M, () => ({
     start: b,
-    stop: d,
+    stop: m,
     abort: Q,
     isActive: V
   })), e.useEffect(() => (J(), () => {
-    n.current && d();
+    n.current && m();
   }), [h, v, S, k, W]);
   const X = () => {
-    o ? d() : b();
-  }, Y = a.icon !== void 0 || a.iconClass !== void 0, Z = e.useMemo(() => o ? oe : g || ae, [o, g]);
+    s ? m() : b();
+  }, Y = a.icon !== void 0 || a.iconClass !== void 0, Z = e.useMemo(() => s ? se : g || ae, [s, g]);
   return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
     ee,
     {
@@ -106,7 +106,7 @@ const ie = e.forwardRef((a, M) => {
       className: re(
         {
           "k-speech-to-text-button": !0,
-          "k-listening": o
+          "k-listening": s
         },
         K
       ),
@@ -118,14 +118,14 @@ const ie = e.forwardRef((a, M) => {
       size: L,
       themeColor: B,
       "aria-label": l != null ? l : p.toLanguageString(A, x[A]),
-      "aria-pressed": o,
+      "aria-pressed": s || void 0,
       disabled: N,
       title: u != null ? u : p.toLanguageString(T, x[T]),
       onClick: X,
       ...U
     },
     a.children
-  ), y && /* @__PURE__ */ e.createElement(se, { message: E }));
+  ), y && /* @__PURE__ */ e.createElement(oe, { message: E }));
 });
 ie.displayName = "KendoSpeechToTextButton";
 export {