Merge remote-tracking branch 'origin/release' into danieljgeiger-mathjax

src/packages/excalidraw/CHANGELOG.md

@@ -15,6 +15,8 @@ Please add the latest change on the top under the correct section.
 
 ### Features
 
+- Expose `useI18n()` hook return an object containing `t()` i18n helper and current `langCode`. You can use this in components you render as `<Excalidraw>` children to render any of our i18n locale strings. [#6224](https://github.com/excalidraw/excalidraw/pull/6224)
+
 - [`restoreElements`](https://docs.excalidraw.com/docs/@excalidraw/excalidraw/api/utils/restore#restoreelements) API now takes an optional parameter `opts` which currently supports the below attributes
 
 ```js

src/packages/excalidraw/index.tsx

@@ -87,8 +87,8 @@ const ExcalidrawBase = (props: ExcalidrawProps) => {
   }, []);
 
   return (
-    <InitializeApp langCode={langCode} theme={theme}>
-      <Provider unstable_createStore={() => jotaiStore} scope={jotaiScope}>
+    <Provider unstable_createStore={() => jotaiStore} scope={jotaiScope}>
+      <InitializeApp langCode={langCode} theme={theme}>
         <App
           onChange={onChange}
           initialData={initialData}
@@ -118,8 +118,8 @@ const ExcalidrawBase = (props: ExcalidrawProps) => {
         >
           {children}
         </App>
-      </Provider>
-    </InitializeApp>
+      </InitializeApp>
+    </Provider>
   );
 };
 
@@ -198,7 +198,7 @@ export {
   isInvisiblySmallElement,
   getNonDeletedElements,
 } from "../../element";
-export { defaultLang, languages } from "../../i18n";
+export { defaultLang, useI18n, languages } from "../../i18n";
 export {
   restore,
   restoreAppState,

src/packages/extensions/ts/mathjax/implementation.tsx

@@ -6,6 +6,7 @@ import {
   getApproxLineHeight,
   getBoundTextElement,
   getContainerElement,
+  getMaxContainerWidth,
   getTextWidth,
   measureText,
   wrapText,
@@ -46,7 +47,6 @@ import {
 import { mathSubtypeIcon } from "./icon";
 import { getMathSubtypeRecord } from "./types";
 import { SubtypeButton } from "../../../../components/Subtypes";
-import { getMaxContainerWidth } from "../../../../element/newElement";
 
 const mathSubtype = getMathSubtypeRecord().subtype;
 const FONT_FAMILY_MATH = FONT_FAMILY.Helvetica;
@@ -607,7 +607,10 @@ const measureMarkup = (
       const grandchild = child as Text;
       const text = grandchild.textContent ?? "";
       if (text !== "") {
-        const textMetrics = measureText(text, font, maxWidth);
+        const constrainedText = maxWidth
+          ? wrapText(text, font, maxWidth)
+          : text;
+        const textMetrics = measureText(constrainedText, font);
         childMetrics.push({
           x: nextX,
           y: baseline,
@@ -834,25 +837,16 @@ const cleanMathElementUpdate = function (updates) {
   return oldUpdates;
 } as SubtypeMethods["clean"];
 
-const measureMathElement = function (element, next, maxWidth) {
+const measureMathElement = function (element, next) {
   ensureMathElement(element);
   const isMathJaxLoaded = mathJaxLoaded;
   const fontSize = next?.fontSize ?? element.fontSize;
   const text = next?.text ?? element.text;
   const customData = next?.customData ?? element.customData;
   const mathProps = getMathProps.ensureMathProps(customData);
-  const noMaxWidth = mathProps.mathOnly;
-  const cWidth = noMaxWidth ? undefined : maxWidth;
-  const metrics = getImageMetrics(
-    text,
-    fontSize,
-    mathProps,
-    isMathJaxLoaded,
-    cWidth,
-  );
-  const { height, baseline } = metrics;
-  const width = noMaxWidth ? maxWidth ?? metrics.width : metrics.width;
-  return { width, height, baseline };
+  const metrics = getImageMetrics(text, fontSize, mathProps, isMathJaxLoaded);
+  const { width, height } = metrics;
+  return { width, height };
 } as SubtypeMethods["measureText"];
 
 const renderMathElement = function (element, context, renderCb) {