@khanacademy/perseus 17.1.1 → 17.3.0

package/dist/perseus-types.d.ts

@@ -30,14 +30,8 @@ export type PerseusImageDetail = {
     width: number;
     height: number;
 };
-export type PerseusAnswerArea = {
-    zTable: boolean;
-    chi2Table: boolean;
-    tTable: boolean;
-    calculator: boolean;
-    periodicTable: boolean;
-    periodicTableWithKey?: boolean;
-};
+export declare const ItemExtras: readonly ["calculator", "chi2Table", "financialCalculatorMonthlyPayment", "financialCalculatorTotalAmount", "financialCalculatorTimeToPayOff", "periodicTable", "periodicTableWithKey", "tTable", "zTable"];
+export type PerseusAnswerArea = Record<typeof ItemExtras[number], boolean>;
 type Widget<Type extends string, Options> = {
     type: Type;
     static?: boolean;

package/package.json

@@ -3,7 +3,7 @@
     "description": "Core Perseus API (includes renderers and widgets)",
     "author": "Khan Academy",
     "license": "MIT",
-    "version": "17.1.1",
+    "version": "17.3.0",
     "publishConfig": {
         "access": "public"
     },
@@ -24,7 +24,7 @@
     "dependencies": {
         "@khanacademy/kas": "^0.3.7",
         "@khanacademy/kmath": "^0.1.8",
-        "@khanacademy/math-input": "^16.2.0",
+        "@khanacademy/math-input": "^16.3.0",
         "@khanacademy/perseus-core": "1.4.1",
         "@khanacademy/perseus-linter": "^0.3.10",
         "@khanacademy/pure-markdown": "^0.2.13",

package/src/__testdata__/graphie.testdata.ts

@@ -1,13 +1,13 @@
-import type {PerseusItem} from "../perseus-types";
+import {
+    ItemExtras,
+    type PerseusAnswerArea,
+    type PerseusItem,
+} from "../perseus-types";
 
 export const itemWithPieChart: PerseusItem = {
-    answerArea: {
-        calculator: false,
-        chi2Table: false,
-        periodicTable: false,
-        tTable: false,
-        zTable: false,
-    },
+    answerArea: Object.fromEntries(
+        ItemExtras.map((extra) => [extra, false]),
+    ) as PerseusAnswerArea,
     hints: [],
     itemDataVersion: {
         major: 0,

package/src/__testdata__/server-item-renderer.testdata.ts

@@ -1,8 +1,10 @@
-import type {
-    InputNumberWidget,
-    LabelImageWidget,
-    PerseusItem,
-    PerseusRenderer,
+import {
+    ItemExtras,
+    type InputNumberWidget,
+    type LabelImageWidget,
+    type PerseusItem,
+    type PerseusRenderer,
+    type PerseusAnswerArea,
 } from "../perseus-types";
 
 export const itemWithInput: PerseusItem = {
@@ -37,13 +39,9 @@ export const itemWithInput: PerseusItem = {
 };
 
 export const labelImageItem: PerseusItem = {
-    answerArea: {
-        calculator: false,
-        chi2Table: false,
-        periodicTable: false,
-        tTable: false,
-        zTable: false,
-    },
+    answerArea: Object.fromEntries(
+        ItemExtras.map((extra) => [extra, false]),
+    ) as PerseusAnswerArea,
     _multi: null,
     answer: null,
     hints: [],

package/src/__tests__/mock-asset-loading-widget.tsx

@@ -1,8 +1,9 @@
 import * as React from "react";
 
 import AssetContext from "../asset-context";
+import {ItemExtras} from "../perseus-types";
 
-import type {PerseusItem} from "../perseus-types";
+import type {PerseusAnswerArea, PerseusItem} from "../perseus-types";
 import type {WidgetExports} from "../types";
 
 export const mockedAssetItem: PerseusItem = {
@@ -20,13 +21,9 @@ export const mockedAssetItem: PerseusItem = {
             },
         },
     },
-    answerArea: {
-        calculator: false,
-        chi2Table: false,
-        periodicTable: false,
-        tTable: false,
-        zTable: false,
-    },
+    answerArea: Object.fromEntries(
+        ItemExtras.map((extra) => [extra, false]),
+    ) as PerseusAnswerArea,
     itemDataVersion: {major: 0, minor: 1},
     hints: [],
     _multi: null,

package/src/components/math-input.tsx

@@ -6,6 +6,7 @@ import {
     mathQuillInstance,
     CursorContext,
     getCursorContext,
+    convertDotToTimesByLocale,
 } from "@khanacademy/math-input";
 import Clickable from "@khanacademy/wonder-blocks-clickable";
 import Color, {fade} from "@khanacademy/wonder-blocks-color";
@@ -170,7 +171,11 @@ class MathInput extends React.Component<Props, State> {
                             // Use the specified symbol to represent multiplication
                             // TODO(alex): Add an option to disallow variables, in
                             // which case 'x' should get converted to '\\times'
-                            if (this.props.convertDotToTimes) {
+                            if (
+                                convertDotToTimesByLocale(
+                                    this.props.convertDotToTimes,
+                                )
+                            ) {
                                 value = value.replace(/\\cdot/g, "\\times");
 
                                 // Preserve cursor position in the common case:

package/src/index.ts

@@ -64,6 +64,7 @@ export {default as PerseusMarkdown} from "./perseus-markdown";
 export {
     PerseusExpressionAnswerFormConsidered,
     plotterPlotTypes,
+    ItemExtras,
 } from "./perseus-types";
 export {traverse} from "./traversal";
 export {isItemRenderableByVersion} from "./renderability";
@@ -127,6 +128,7 @@ export type {
     PerseusExpressionWidgetOptions,
     PerseusPlotterWidgetOptions,
     PerseusRenderer,
+    PerseusAnswerArea,
 } from "./perseus-types";
 export type {Coord} from "./interactive2/types";
 export type {MarkerType} from "./widgets/label-image/types";

package/src/perseus-types.ts

@@ -62,20 +62,27 @@ export type PerseusImageDetail = {
     height: number;
 };
 
-export type PerseusAnswerArea = {
-    // The user might benefit from using a statistics Z Table like https://www.ztable.net/
-    zTable: boolean;
-    // The user might benefit from using a statistics Chi Squared Table like https://people.richland.edu/james/lecture/m170/tbl-chi.html
-    chi2Table: boolean;
-    // The user might benefit from using a statistics T Table like https://www.statisticshowto.com/tables/t-distribution-table/
-    tTable: boolean;
+export const ItemExtras = [
     // The user might benefit from using a Scientific Calculator.  Provided on Khan Academy when true
-    calculator: boolean;
+    "calculator",
+    // The user might benefit from using a statistics Chi Squared Table like https://people.richland.edu/james/lecture/m170/tbl-chi.html
+    "chi2Table",
+    // The user might benefit from a monthly payments calculator.  Provided on Khan Academy when true
+    "financialCalculatorMonthlyPayment",
+    // The user might benefit from a total amount calculator.  Provided on Khan Academy when true
+    "financialCalculatorTotalAmount",
+    // The user might benefit from a time to pay off calculator.  Provided on Khan Academy when true
+    "financialCalculatorTimeToPayOff",
     // The user might benefit from using a Periodic Table of Elements.  Provided on Khan Academy when true
-    periodicTable: boolean;
+    "periodicTable",
     // The user might benefit from using a Periodic Table of Elements with key.  Provided on Khan Academy when true
-    periodicTableWithKey?: boolean;
-};
+    "periodicTableWithKey",
+    // The user might benefit from using a statistics T Table like https://www.statisticshowto.com/tables/t-distribution-table/
+    "tTable",
+    // The user might benefit from using a statistics Z Table like https://www.ztable.net/
+    "zTable",
+] as const;
+export type PerseusAnswerArea = Record<typeof ItemExtras[number], boolean>;
 
 type Widget<Type extends string, Options> = {
     // The "type" of widget which will define what the Options field looks like

package/src/widgets/__testdata__/expression.testdata.ts

@@ -1,3 +1,13 @@
+import {
+    ItemExtras,
+    type PerseusExpressionWidgetOptions,
+    type Version,
+    type PerseusItem,
+    type PerseusRenderer,
+    type ExpressionWidget,
+    type PerseusAnswerArea,
+} from "../../perseus-types";
+
 import {
     arrayOfLength,
     randomBoolean,
@@ -8,14 +18,6 @@ import {
     randomWord,
 } from "./randomizers";
 
-import type {
-    PerseusExpressionWidgetOptions,
-    Version,
-    PerseusItem,
-    PerseusRenderer,
-    ExpressionWidget,
-} from "../../perseus-types";
-
 const createItemJson = (
     widgetOptions: PerseusExpressionWidgetOptions,
     version: Version,
@@ -35,13 +37,9 @@ const createItemJson = (
         },
         _multi: null,
         answer: null,
-        answerArea: {
-            zTable: false,
-            chi2Table: false,
-            tTable: false,
-            calculator: false,
-            periodicTable: false,
-        },
+        answerArea: Object.fromEntries(
+            ItemExtras.map((extra) => [extra, false]),
+        ) as PerseusAnswerArea,
         itemDataVersion: {
             major: 0,
             minor: 1,

package/src/widgets/label-image/hide-answers-toggle.tsx

@@ -21,7 +21,7 @@ export const HideAnswersToggle = (props: {
                 onChange={props.onChange}
                 aria-labelledby={labelId}
             />
-            <LabelMedium id={labelId} htmlFor={switchId}>
+            <LabelMedium id={labelId} htmlFor={switchId} tag="label">
                 {strings.hideAnswersToggleLabel}
             </LabelMedium>
         </View>