@concord-consortium/lara-interactive-api 1.9.3-pre.3 → 1.9.3-pre.5

package/hooks.d.ts

@@ -23,9 +23,10 @@ export interface IUseReportItemOptions<InteractiveState, AuthoredState> {
 export declare const useReportItem: <InteractiveState, AuthoredState>({ metadata, handler }: IUseReportItemOptions<InteractiveState, AuthoredState>) => void;
 export declare const DefaultAccessibilitySettings: IAccessibilitySettings;
 export interface IUseAccessibilityProps {
-    updateHtmlFontSize?: boolean;
-    updateBodyFontFamily?: boolean;
-    addBodyClass?: boolean;
+    updateDOM?: {
+        enabled: boolean;
+        fontFamilySelector?: string;
+    };
 }
 export declare const useAccessibility: (props?: IUseAccessibilityProps | undefined) => IAccessibilitySettings;
 export {};

package/index-bundle.d.ts

@@ -675,9 +675,10 @@ interface IUseReportItemOptions<InteractiveState, AuthoredState> {
 declare const useReportItem: <InteractiveState, AuthoredState>({ metadata, handler }: IUseReportItemOptions<InteractiveState, AuthoredState>) => void;
 declare const DefaultAccessibilitySettings: IAccessibilitySettings;
 interface IUseAccessibilityProps {
-    updateHtmlFontSize?: boolean;
-    updateBodyFontFamily?: boolean;
-    addBodyClass?: boolean;
+    updateDOM?: {
+        enabled: boolean;
+        fontFamilySelector?: string;
+    };
 }
 declare const useAccessibility: (props?: IUseAccessibilityProps | undefined) => IAccessibilitySettings;
 

package/index.js

@@ -5589,29 +5589,35 @@ exports.DefaultAccessibilitySettings = {
     fontFamilyForType: (0, accessibility_1.getFamilyForFontType)("normal"),
 };
 var useAccessibility = function (props) {
-    var _a = props || {}, updateHtmlFontSize = _a.updateHtmlFontSize, updateBodyFontFamily = _a.updateBodyFontFamily, addBodyClass = _a.addBodyClass;
+    var updateDOM = (props || {}).updateDOM;
     var initMessage = (0, exports.useInitMessage)();
-    var _b = (0, react_1.useState)(exports.DefaultAccessibilitySettings), accessibility = _b[0], setAccessibility = _b[1];
+    var _a = (0, react_1.useState)(exports.DefaultAccessibilitySettings), accessibility = _a[0], setAccessibility = _a[1];
     var normalizeClass = function (text) { return text.toLowerCase().replace(/\s/, "-"); };
     (0, react_1.useEffect)(function () {
+        var _a;
         if (initMessage && initMessage.mode === "runtime") {
             var _accessibility = initMessage.accessibility || exports.DefaultAccessibilitySettings;
             var fontSize = _accessibility.fontSize, fontSizeInPx = _accessibility.fontSizeInPx, fontType = _accessibility.fontType, fontFamilyForType = _accessibility.fontFamilyForType;
             setAccessibility(_accessibility);
-            var html = document.getElementsByTagName("html").item(0);
-            var body = document.getElementsByTagName("body").item(0);
-            if (updateHtmlFontSize && (fontSize !== exports.DefaultAccessibilitySettings.fontSize) && html) {
-                html.style.fontSize = fontSizeInPx + "px";
-            }
-            if (updateBodyFontFamily && (fontType !== exports.DefaultAccessibilitySettings.fontType) && body) {
-                body.style.fontFamily = fontFamilyForType;
-            }
-            if (addBodyClass && body) {
-                body.classList.add("font-size-" + normalizeClass(fontSize));
-                body.classList.add("font-type-" + normalizeClass(fontType));
+            if (updateDOM) {
+                var fontFamilySelector = updateDOM.fontFamilySelector;
+                var html = document.getElementsByTagName("html").item(0);
+                var body = document.getElementsByTagName("body").item(0);
+                if (html) {
+                    html.style.fontSize = fontSizeInPx + "px";
+                }
+                if (body) {
+                    body.classList.add("font-size-" + normalizeClass(fontSize));
+                    body.classList.add("font-type-" + normalizeClass(fontType));
+                }
+                if (fontFamilySelector) {
+                    var style = document.createElement("style");
+                    document.head.appendChild(style);
+                    (_a = style.sheet) === null || _a === void 0 ? void 0 : _a.insertRule(fontFamilySelector + " { font-family: " + fontFamilyForType + "; }", 0);
+                }
             }
         }
-    }, [initMessage, updateHtmlFontSize]);
+    }, [initMessage, updateDOM]);
     return accessibility;
 };
 exports.useAccessibility = useAccessibility;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@concord-consortium/lara-interactive-api",
-  "version": "1.9.3-pre.3",
+  "version": "1.9.3-pre.5",
   "description": "LARA Interactive API client and types",
   "main": "./index.js",
   "types": "./index-bundle.d.ts",