@speechly/react-ui - npm Package Compare versions

Comparing version 2.0.0-beta.1 to 2.0.0-beta.2

components/BigTranscript.d.ts

@@ -17,2 +17,6 @@ import React from 'react';
     /**
+     * Optional boolean. If true, transcript is formatted with detected entities, e.g. numbers. Default: true
+     */
+    formatText?: boolean;
+    /**
      * Optional CSS string for text size. Default: "1.5rem"
@@ -19,0 +23,0 @@ */

components/BigTranscript.js

@@ -35,3 +35,3 @@ "use strict";
 var BigTranscript = function (_a) {
-    var fontSize = _a.fontSize, color = _a.color, highlightColor = _a.highlightColor, backgroundColor = _a.backgroundColor, _b = _a.marginBottom, marginBottom = _b === void 0 ? '2rem' : _b;
+    var formatText = _a.formatText, fontSize = _a.fontSize, color = _a.color, highlightColor = _a.highlightColor, backgroundColor = _a.backgroundColor, _b = _a.marginBottom, marginBottom = _b === void 0 ? '2rem' : _b;
     var _c = react_client_1.useSpeechContext(), segment = _c.segment, speechState = _c.speechState;
@@ -50,5 +50,5 @@ var refElement = react_1.useRef();
     }, [segment]);
-    return (react_1.default.createElement("big-transcript", { ref: refElement, fontsize: fontSize, color: color, highlightcolor: highlightColor, backgroundcolor: backgroundColor, marginbottom: marginBottom }));
+    return (react_1.default.createElement("big-transcript", { ref: refElement, formattext: (formatText !== null && formatText === false) ? 'true' : 'false', fontsize: fontSize, color: color, highlightcolor: highlightColor, backgroundcolor: backgroundColor, marginbottom: marginBottom }));
 };
 exports.BigTranscript = BigTranscript;
 //# sourceMappingURL=BigTranscript.js.map

components/PushToTalkButton.d.ts

@@ -59,2 +59,6 @@ import React from 'react';
     /**
+     * Optional string (CSS color) for hint text. Default: "#ffffff"
+     */
+    textColor?: string;
+    /**
      * Optional string (CSS color) for hint text background. Default: "#202020"
@@ -61,0 +65,0 @@ */

components/PushToTalkButton.js

@@ -40,3 +40,3 @@ "use strict";
 var PushToTalkButton = function (_a) {
-    var _b = _a.powerOn, powerOn = _b === void 0 ? false : _b, _c = _a.hide, hide = _c === void 0 ? false : _c, captureKey = _a.captureKey, _d = _a.size, size = _d === void 0 ? '6.0rem' : _d, _e = _a.gradientStops, gradientStops = _e === void 0 ? ['#15e8b5', '#4fa1f9'] : _e, _f = _a.intro, intro = _f === void 0 ? 'Hold to talk' : _f, _g = _a.hint, hint = _g === void 0 ? 'Hold to talk' : _g, fontSize = _a.fontSize, showTime = _a.showTime, backgroundColor = _a.backgroundColor;
+    var _b = _a.powerOn, powerOn = _b === void 0 ? false : _b, _c = _a.hide, hide = _c === void 0 ? false : _c, captureKey = _a.captureKey, _d = _a.size, size = _d === void 0 ? '6.0rem' : _d, _e = _a.gradientStops, gradientStops = _e === void 0 ? ['#15e8b5', '#4fa1f9'] : _e, _f = _a.intro, intro = _f === void 0 ? 'Hold to talk' : _f, _g = _a.hint, hint = _g === void 0 ? 'Hold to talk' : _g, fontSize = _a.fontSize, showTime = _a.showTime, textColor = _a.textColor, backgroundColor = _a.backgroundColor;
     var _h = react_client_1.useSpeechContext(), speechState = _h.speechState, toggleRecording = _h.toggleRecording, initialise = _h.initialise;
@@ -120,6 +120,6 @@ var _j = react_1.useState((powerOn ? react_client_1.SpeechState.Idle : react_client_1.SpeechState.Ready)), icon = _j[0], setIcon = _j[1];
     return (react_1.default.createElement("div", null,
-        react_1.default.createElement("holdable-button", { ref: buttonRef, poweron: powerOn, capturekey: captureKey, icon: icon, size: size, gradientstop1: gradientStops[0], gradientstop2: gradientStops[1], hide: hide ? 'true' : 'false', intro: intro, hint: hint, showtime: showTime, fontsize: fontSize, backgroundColor: backgroundColor }),
-        react_1.default.createElement("call-out", { fontsize: "1.2rem", show: showHint && hintText !== '', backgroundcolor: "#202020", showtime: showTime }, hintText)));
+        react_1.default.createElement("holdable-button", { ref: buttonRef, poweron: powerOn, capturekey: captureKey, icon: icon, size: size, gradientstop1: gradientStops[0], gradientstop2: gradientStops[1], hide: hide ? 'true' : 'false' }),
+        react_1.default.createElement("call-out", { show: showHint && hintText !== '', fontsize: fontSize, textcolor: textColor, backgroundcolor: backgroundColor, showtime: showTime }, hintText)));
 };
 exports.PushToTalkButton = PushToTalkButton;
 //# sourceMappingURL=PushToTalkButton.js.map

components/TranscriptDrawer.js

@@ -47,5 +47,5 @@ "use strict";
     }, [segment]);
-    return (react_1.default.createElement("transcript-drawer", { ref: refElement, fontsize: props.fontSize, color: props.color, highlightcolor: props.highlightColor, backgroundcolor: props.backgroundColor, marginbottom: props.marginBottom, hint: props.hint, height: props.height }));
+    return (react_1.default.createElement("transcript-drawer", { ref: refElement, formattext: props.formatText === false ? 'false' : 'true', fontsize: props.fontSize, color: props.color, highlightcolor: props.highlightColor, backgroundcolor: props.backgroundColor, marginbottom: props.marginBottom, hint: props.hint, height: props.height }));
 };
 exports.TranscriptDrawer = TranscriptDrawer;
 //# sourceMappingURL=TranscriptDrawer.js.map

package.json

 {
   "name": "@speechly/react-ui",
   "private": false,
-  "version": "2.0.0-beta.1",
+  "version": "2.0.0-beta.2",
   "description": "Speechly UI Components",
@@ -57,3 +57,3 @@ "main": "./index.js",
   "dependencies": {
-    "@speechly/browser-ui": "^1.3.9",
+    "@speechly/browser-ui": "^1.3.10",
     "pubsub-js": "^1.9.2",
@@ -60,0 +60,0 @@ "react-spring": "^8.0.27",

No alert changes

Improved metrics

Total package byte prevSize

81492

0.63%

Lines of code

1042

0.77%

Dependency changes

• Updated

  @speechly/browser-ui@^1.3.10