@applicaster/zapp-react-native-utils 15.0.0-alpha.3242245332 → 15.0.0-alpha.3248453012

package/appUtils/accessibilityManager/hooks.ts

@@ -17,6 +17,9 @@ export const useAccessibilityManager = (
     return AccessibilityManager.getInstance();
   }, []);
 
+  const [accessibilityManagerState, setAccessibilityManagerState] =
+    useState<AccessibilityState>(accessibilityManager.getState());
+
   useEffect(() => {
     if (pluginConfiguration) {
       accessibilityManager.updateLocalizations(pluginConfiguration);
@@ -25,18 +28,17 @@ export const useAccessibilityManager = (
 
   useEffect(() => {
     const subscription = accessibilityManager.getStateAsObservable().subscribe({
-      next: () => {
-        // TODO: handle accessibility states
-        // screenReaderEnabled: false
-        // reduceMotionEnabled: false
-        // boldTextEnabled: false
+      next: (newState) => {
+        setAccessibilityManagerState(newState);
       },
     });
 
     return () => subscription.unsubscribe();
   }, [accessibilityManager]);
 
-  return accessibilityManager;
+  return Object.assign(accessibilityManager, {
+    accessibilityManagerState,
+  });
 };
 
 export const useInitialAnnouncementReady = (

package/appUtils/accessibilityManager/index.ts

@@ -36,7 +36,20 @@ export class AccessibilityManager {
     false
   );
 
-  private constructor() {}
+  private constructor() {
+    this.ttsManager
+      .getScreenReaderEnabledAsObservable()
+      .subscribe((enabled) => {
+        const state = this.state$.getValue();
+
+        if (state.screenReaderEnabled !== enabled) {
+          this.state$.next({
+            ...state,
+            screenReaderEnabled: enabled,
+          });
+        }
+      });
+  }
 
   public static getInstance(): AccessibilityManager {
     if (!AccessibilityManager._instance) {
@@ -92,8 +105,15 @@ export class AccessibilityManager {
   /**
    * Adds a heading to the queue, headings will be read before the next text
    * Each heading will be read once and removed from the queue
+   * Does nothing if screen reader is not enabled
    */
   public addHeading(heading: string) {
+    const state = this.state$.getValue();
+
+    if (!state.screenReaderEnabled) {
+      return;
+    }
+
     if (!this.pendingFocusId) {
       this.pendingFocusId = Date.now().toString();
     }
@@ -108,6 +128,7 @@ export class AccessibilityManager {
    *
    * Implements a delay mechanism to reduce noise during rapid navigation.
    * Only the most recent announcement will be read after the delay period.
+   * Does nothing if screen reader is not enabled
    */
   public readText({
     text,
@@ -116,6 +137,12 @@ export class AccessibilityManager {
     text: string;
     keyOfLocalizedText?: string;
   }) {
+    const state = this.state$.getValue();
+
+    if (!state.screenReaderEnabled) {
+      return;
+    }
+
     let textToRead = text;
 
     if (keyOfLocalizedText) {

package/appUtils/accessibilityManager/utils.ts

@@ -12,13 +12,44 @@ export function calculateReadingTime(
   minimumPause: number = 500,
   announcementDelay: number = 700
 ): number {
-  const words = text
-    .trim()
+  const trimmed = text.trim();
+
+  // Count words (split on whitespace and punctuation, keep alnum boundaries)
+  const words = trimmed
     .split(/(?<=\d)(?=[a-zA-Z])|(?<=[a-zA-Z])(?=\d)|[^\w\s]+|\s+/)
     .filter(Boolean).length;
 
-  return (
-    Math.max(minimumPause, (words / wordsPerMinute) * 60 * 1000) +
-    announcementDelay
+  // Count spaces - multiple consecutive spaces add extra pause time
+  const spaceMatches: string[] = trimmed.match(/\s+/g) || [];
+
+  const totalSpaces = spaceMatches.reduce(
+    (sum: number, match: string) => sum + match.length,
+    0
   );
+
+  const extraSpaces = Math.max(0, totalSpaces - (words - 1)); // words-1 is normal spacing
+
+  // Heuristic: punctuation increases TTS duration beyond word-based WPM.
+  // Commas typically introduce short pauses, sentence terminators longer ones.
+  const commaCount = (trimmed.match(/,/g) || []).length;
+  const semicolonCount = (trimmed.match(/;/g) || []).length;
+  const colonCount = (trimmed.match(/:/g) || []).length;
+  const dashCount = (trimmed.match(/\u2013|\u2014|-/g) || []).length; // – — -
+  const sentenceEndCount = (trimmed.match(/[.!?](?!\d)/g) || []).length;
+
+  const commaPauseMs = 220; // short prosody pause for ","
+  const midPauseMs = 260; // for ";", ":", dashes
+  const sentenceEndPauseMs = 420; // for ".", "!", "?"
+  const extraSpacePauseMs = 50; // per extra space beyond normal spacing
+
+  const punctuationPause =
+    commaCount * commaPauseMs +
+    (semicolonCount + colonCount + dashCount) * midPauseMs +
+    sentenceEndCount * sentenceEndPauseMs +
+    extraSpaces * extraSpacePauseMs;
+
+  const baseByWordsMs = (words / wordsPerMinute) * 60 * 1000;
+  const estimatedMs = Math.max(minimumPause, baseByWordsMs + punctuationPause);
+
+  return estimatedMs + announcementDelay;
 }

package/appUtils/platform/platformUtils.ts

@@ -170,7 +170,9 @@ export const getClosedCaptionState = () => {
  */
 export class TTSManager {
   private ttsState$ = new BehaviorSubject<boolean>(false);
+  private screenReaderEnabled$ = new BehaviorSubject<boolean>(false);
   private static ttsManagerInstance: TTSManager;
+  private samsungListenerId: number | null = null;
 
   private constructor() {
     this.initialize();
@@ -185,23 +187,114 @@ export class TTSManager {
   }
 
   async initialize() {
-    if (!isVizioPlatform()) return;
+    if (isVizioPlatform()) {
+      document.addEventListener(
+        "VIZIO_TTS_ENABLED",
+        () => {
+          log_debug("Vizio screen reader enabled");
+          this.screenReaderEnabled$.next(true);
+        },
+        false
+      );
 
-    document.addEventListener(
-      "VIZIO_TTS_ENABLED",
-      () => {
-        this.ttsState$.next(true);
-      },
-      false
-    );
+      document.addEventListener(
+        "VIZIO_TTS_DISABLED",
+        () => {
+          log_debug("Vizio screen reader disabled");
+          this.screenReaderEnabled$.next(false);
+        },
+        false
+      );
+    }
 
-    document.addEventListener(
-      "VIZIO_TTS_DISABLED",
-      () => {
-        this.ttsState$.next(false);
-      },
-      false
-    );
+    if (isLgPlatform() && window.webOS?.service) {
+      try {
+        // https://webostv.developer.lge.com/develop/references/settings-service
+        window.webOS.service.request("luna://com.webos.settingsservice", {
+          method: "getSystemSettings",
+          parameters: {
+            category: "option",
+            keys: ["audioGuidance"],
+            subscribe: true, // Request a subscription to changes
+          },
+          onSuccess: (response: any) => {
+            const isEnabled = response?.settings?.audioGuidance === "on";
+
+            log_debug("LG Audio Guidance status changed", {
+              isEnabled,
+              response,
+            });
+
+            this.screenReaderEnabled$.next(isEnabled);
+          },
+          onFailure: (error: any) => {
+            log_debug("webOS settings subscription failed", { error });
+            this.screenReaderEnabled$.next(false);
+          },
+        });
+      } catch (error) {
+        log_debug("webOS settings service request error", { error });
+        this.screenReaderEnabled$.next(false);
+      }
+    }
+
+    if (isSamsungPlatform() && typeof window.webapis !== "undefined") {
+      try {
+        if (
+          window.webapis?.tvinfo &&
+          typeof window.webapis.tvinfo.getMenuValue === "function" &&
+          typeof window.webapis.tvinfo.addCaptionChangeListener === "function"
+        ) {
+          // Get initial Voice Guide status
+          const initialStatus = window.webapis.tvinfo.getMenuValue(
+            window.webapis.tvinfo.TvInfoMenuKey.VOICE_GUIDE_KEY
+          );
+
+          const isEnabled =
+            initialStatus === window.webapis.tvinfo.TvInfoMenuValue.ON;
+
+          log_debug("Samsung Voice Guide initial status", {
+            isEnabled,
+            initialStatus,
+          });
+
+          this.screenReaderEnabled$.next(isEnabled);
+
+          // Listen for Voice Guide status changes
+          const onChange = () => {
+            const currentStatus = window.webapis.tvinfo.getMenuValue(
+              window.webapis.tvinfo.TvInfoMenuKey.VOICE_GUIDE_KEY
+            );
+
+            const enabled =
+              currentStatus === window.webapis.tvinfo.TvInfoMenuValue.ON;
+
+            log_debug("Samsung Voice Guide status changed", {
+              enabled,
+              currentStatus,
+            });
+
+            this.screenReaderEnabled$.next(enabled);
+          };
+
+          this.samsungListenerId =
+            window.webapis.tvinfo.addCaptionChangeListener(
+              window.webapis.tvinfo.TvInfoMenuKey.VOICE_GUIDE_KEY,
+              onChange
+            );
+
+          log_debug("Samsung Voice Guide listener registered", {
+            listenerId: this.samsungListenerId,
+          });
+        } else {
+          log_debug("Samsung TvInfo API not available");
+          this.screenReaderEnabled$.next(false);
+        }
+      } catch (error) {
+        log_debug("Samsung Voice Guide listener error", { error });
+        this.screenReaderEnabled$.next(false);
+      }
+    }
   }
 
   getCurrentState(): boolean {
@@ -212,6 +305,10 @@ export class TTSManager {
     return this.ttsState$.asObservable();
   }
 
+  getScreenReaderEnabledAsObservable() {
+    return this.screenReaderEnabled$.asObservable();
+  }
+
   readText(text: string) {
     this.ttsState$.next(true);
 

package/cellUtils/index.ts

@@ -9,7 +9,10 @@ import {
 } from "@applicaster/zapp-react-native-utils/stringUtils";
 import { cellUtilsLogger } from "@applicaster/zapp-react-native-utils/cellUtils/logger";
 import { isWeb } from "@applicaster/zapp-react-native-utils/reactUtils";
-import { isNotNil } from "@applicaster/zapp-react-native-utils/reactUtils/helpers";
+import {
+  isNotNil,
+  isNilOrEmpty,
+} from "@applicaster/zapp-react-native-utils/reactUtils/helpers";
 
 import { toNumberWithDefault, toNumberWithDefaultZero } from "../numberUtils";
 
@@ -505,3 +508,39 @@ export const getImageContainerMarginStyles = ({ value }: { value: any }) => {
     marginRight: value("image_margin_right"),
   };
 };
+
+export const withoutNilOrEmpty = (arr: string[]): string[] =>
+  arr.filter((item) => !isNilOrEmpty(item));
+
+export const isTextLabel = (key: string): boolean =>
+  key.includes("text_label_") && key.endsWith("_switch");
+
+export const hasTextLabelsEnabled = (
+  configuration: Record<string, any>
+): boolean => {
+  const textLabelsKeys = Object.keys(configuration).filter(isTextLabel);
+
+  const picked = textLabelsKeys.reduce(
+    (acc, key) => {
+      acc[key] = configuration[key];
+
+      return acc;
+    },
+    {} as Record<string, any>
+  );
+
+  const pickedValues = Object.values(picked);
+
+  // Check if any switch value is truthy (true, "true", "1", etc.)
+  return pickedValues.some((value) => {
+    if (typeof value === "boolean") {
+      return value === true;
+    }
+
+    if (typeof value === "string") {
+      return value !== "" && value.toLowerCase() !== "false";
+    }
+
+    return Boolean(value);
+  });
+};

package/manifestUtils/keys.js

@@ -959,6 +959,27 @@ const TV_CELL_LABEL_FIELDS = [
     rules: "conditional",
     conditions: [{ key: "switch", section: "styles", value: true }],
   },
+  {
+    type: ZAPPIFEST_FIELDS.font_selector.roku,
+    suffix: "roku font family",
+    tooltip: "",
+    rules: "conditional",
+    conditions: [{ key: "switch", section: "styles", value: true }],
+  },
+  {
+    type: ZAPPIFEST_FIELDS.number_input,
+    suffix: "roku font size",
+    tooltip: "",
+    rules: "conditional",
+    conditions: [{ key: "switch", section: "styles", value: true }],
+  },
+  {
+    type: ZAPPIFEST_FIELDS.number_input,
+    suffix: "roku line height",
+    tooltip: "",
+    rules: "conditional",
+    conditions: [{ key: "switch", section: "styles", value: true }],
+  },
   {
     type: ZAPPIFEST_FIELDS.select,
     suffix: "text alignment",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-utils",
-  "version": "15.0.0-alpha.3242245332",
+  "version": "15.0.0-alpha.3248453012",
   "description": "Applicaster Zapp React Native utilities package",
   "main": "index.js",
   "types": "index.d.ts",
@@ -27,7 +27,7 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/applicaster-types": "15.0.0-alpha.3242245332",
+    "@applicaster/applicaster-types": "15.0.0-alpha.3248453012",
     "buffer": "^5.2.1",
     "camelize": "^1.0.0",
     "dayjs": "^1.11.10",

package/playerUtils/usePlayerTTS.ts

@@ -7,8 +7,11 @@ export const usePlayerTTS = () => {
   const player = usePlayer();
   const accessibilityManager = useAccessibilityManager({});
 
+  const isScreenReaderEnabled =
+    accessibilityManager.accessibilityManagerState.screenReaderEnabled;
+
   React.useEffect(() => {
-    if (player && accessibilityManager) {
+    if (player && accessibilityManager && isScreenReaderEnabled) {
       const playerTTS = new PlayerTTS(player, accessibilityManager);
       const unsubscribe = playerTTS.init();
 
@@ -17,5 +20,5 @@ export const usePlayerTTS = () => {
         playerTTS.destroy();
       };
     }
-  }, [player, accessibilityManager]);
+  }, [player, accessibilityManager, isScreenReaderEnabled]);
 };