math-notation 0.1.0 → 0.1.1

package/dist/formulize.cjs.js

@@ -3615,7 +3615,7 @@ async function create$1(config) {
   const computationStore = createComputationStore();
   return initializeInstance(config, computationStore);
 }
-const Formulize = {
+const Store = {
   create: create$1
 };
 const CanvasContextMenu = React.memo(({
@@ -17457,9 +17457,9 @@ const ExpressionNode = mobxReactLite.observer(({
     transform: "translateX(-50%)"
   } }) });
 });
-const FormulizeContext = React.createContext(null);
-const useFormulize = () => {
-  return React.useContext(FormulizeContext);
+const StoreContext = React.createContext(null);
+const useStore = () => {
+  return React.useContext(StoreContext);
 };
 const getOrCreateStyleElement = () => {
   let styleElement = document.getElementById("custom-var-styles");
@@ -19229,10 +19229,13 @@ const SCALE_OUT_CLASS = "scale-out";
 const setupScaleWrappers = (container, selector, draggingVarIds) => {
   const elements = container.querySelectorAll(selector);
   elements.forEach((element) => {
-    var _a2;
+    var _a2, _b;
+    if ((_a2 = element.parentElement) == null ? void 0 : _a2.classList.contains(WRAPPER_CLASS)) {
+      return;
+    }
     const wrapper = document.createElement("span");
     wrapper.className = WRAPPER_CLASS;
-    (_a2 = element.parentNode) == null ? void 0 : _a2.insertBefore(wrapper, element);
+    (_b = element.parentNode) == null ? void 0 : _b.insertBefore(wrapper, element);
     wrapper.appendChild(element);
   });
 };
@@ -19261,7 +19264,7 @@ const deactivateScaleWrapper = (element) => {
 };
 function updateVariableHoverState(container, highlightedVarIds, useScaleWrappers = false) {
   const highlightedSet = new Set(highlightedVarIds);
-  const currentlyHovered = container.querySelectorAll(".hovered");
+  const currentlyHovered = container.querySelectorAll(".var-scale-wrapper .hovered");
   currentlyHovered.forEach((element) => {
     const htmlEl = element;
     if (!highlightedSet.has(htmlEl.id)) {
@@ -19290,7 +19293,7 @@ const FormulaNode = mobxReactLite.observer(({
 }) => {
   var _a2;
   const nodeRef = React.useRef(null);
-  const context = useFormulize();
+  const context = useStore();
   const computationStore = context == null ? void 0 : context.computationStore;
   const [isInitialized, setIsInitialized] = React.useState(false);
   React.useEffect(() => {
@@ -19315,7 +19318,11 @@ const FormulaNode = mobxReactLite.observer(({
     };
     await renderFormulaWithMathJax(nodeRef.current, dataWithStores, isInitialized);
     if (nodeRef.current && computationStore) {
-      setupScaleWrappers(nodeRef.current, ".var-input, .var-base");
+      setupScaleWrappers(
+        nodeRef.current,
+        ".var-input, .var-base"
+        // computationStore.highlightedVarIds
+      );
     }
   }, [data, computationStore, isInitialized]);
   React.useEffect(() => {
@@ -19430,8 +19437,8 @@ const LatexLabel = mobxReactLite.observer(({
 }) => {
   var _a2, _b;
   const labelRef = React.useRef(null);
-  const formulizeContext = useFormulize();
-  const labelFontSize = (_b = (_a2 = formulizeContext == null ? void 0 : formulizeContext.computationStore) == null ? void 0 : _a2.environment) == null ? void 0 : _b.labelFontSize;
+  const coreContext = useStore();
+  const labelFontSize = (_b = (_a2 = coreContext == null ? void 0 : coreContext.computationStore) == null ? void 0 : _a2.environment) == null ? void 0 : _b.labelFontSize;
   const fontSize = customFontSize ?? labelFontSize ?? 1;
   React.useEffect(() => {
     let isMounted = true;
@@ -19467,8 +19474,8 @@ const SVGLabel = mobxReactLite.observer(({
   const [svgData, setSvgData] = React.useState(null);
   const [error, setError] = React.useState(null);
   const [isLoading, setIsLoading] = React.useState(false);
-  const formulizeContext = useFormulize();
-  const computationStore = formulizeContext == null ? void 0 : formulizeContext.computationStore;
+  const coreContext = useStore();
+  const computationStore = coreContext == null ? void 0 : coreContext.computationStore;
   const fontSize = ((_a2 = computationStore == null ? void 0 : computationStore.environment) == null ? void 0 : _a2.fontSize) || 1;
   React.useEffect(() => {
     const loadSVG = async () => {
@@ -19571,7 +19578,7 @@ const InlineInput = mobxReactLite.observer(({
   variable,
   fontSize
 }) => {
-  const context = useFormulize();
+  const context = useStore();
   const computationStore = context == null ? void 0 : context.computationStore;
   const currentValue = typeof variable.value === "number" ? variable.value : 0;
   const displayPrecision = variable.precision ?? INPUT_VARIABLE_DEFAULT.PRECISION;
@@ -19630,7 +19637,7 @@ const LabelNode = mobxReactLite.observer(({
     varId,
     formulaId
   } = data;
-  const context = useFormulize();
+  const context = useStore();
   const computationStore = context == null ? void 0 : context.computationStore;
   const labelFontSize = (_a2 = computationStore == null ? void 0 : computationStore.environment) == null ? void 0 : _a2.labelFontSize;
   const variable = computationStore == null ? void 0 : computationStore.variables.get(varId);
@@ -19760,7 +19767,7 @@ const VariableNode = mobxReactLite.observer(({
     width,
     height
   } = data;
-  const context = useFormulize();
+  const context = useStore();
   const computationStore = context == null ? void 0 : context.computationStore;
   if (!computationStore) {
     return null;
@@ -21190,7 +21197,7 @@ const Formula$1 = mobxReactLite.observer(({
   className = "",
   style = {}
 }) => {
-  const context = useFormulize();
+  const context = useStore();
   const instance = context == null ? void 0 : context.instance;
   const isLoading = (context == null ? void 0 : context.isLoading) ?? true;
   const config = context == null ? void 0 : context.config;
@@ -21259,7 +21266,7 @@ const MathJaxLoader = ({
               window.MathJax.startup.defaultReady();
               window.MathJax.startup.promise.then(() => {
                 var _a2;
-                console.log("MathJax loaded and ready by formulize-math with scale 2.0");
+                console.log("MathJax loaded and ready by math-notation with scale 2.0");
                 console.log("MathJax chtml config:", (_a2 = window.MathJax.config) == null ? void 0 : _a2.chtml);
               });
             }
@@ -21333,7 +21340,7 @@ const MathJaxLoader = ({
   }, children });
 };
 const useMathJax = () => React.useContext(MathJaxContext);
-const FormulizeProviderInner = mobxReactLite.observer(({
+const ProviderInner = mobxReactLite.observer(({
   config,
   children,
   onError,
@@ -21356,7 +21363,7 @@ const FormulizeProviderInner = mobxReactLite.observer(({
       setIsLoading(false);
       return;
     }
-    const initializeFormulize = async () => {
+    const initialize = async () => {
       setIsLoading(true);
       setError(null);
       try {
@@ -21367,7 +21374,7 @@ const FormulizeProviderInner = mobxReactLite.observer(({
         if (!window.MathJax || !window.MathJax.tex2chtml) {
           throw new Error("MathJax is not properly loaded");
         }
-        const newInstance = await Formulize.create(config);
+        const newInstance = await Store.create(config);
         instanceRef.current = newInstance;
         if (config.stepping && newInstance.computationStore) {
           newInstance.computationStore.setStepping(true);
@@ -21388,7 +21395,7 @@ const FormulizeProviderInner = mobxReactLite.observer(({
         setIsLoading(false);
       }
     };
-    initializeFormulize();
+    initialize();
     return () => {
       if (instanceRef.current) {
         instanceRef.current.destroy();
@@ -21410,10 +21417,10 @@ const FormulizeProviderInner = mobxReactLite.observer(({
     computationStore: (instance == null ? void 0 : instance.computationStore) ?? null,
     reinitialize
   }), [instance, config, isLoading, error, reinitialize]);
-  return /* @__PURE__ */ jsxRuntime.jsx(FormulizeContext.Provider, { value: contextValue, children });
+  return /* @__PURE__ */ jsxRuntime.jsx(StoreContext.Provider, { value: contextValue, children });
 });
-const FormulizeProvider = (props) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(MathJaxLoader, { children: /* @__PURE__ */ jsxRuntime.jsx(FormulizeProviderInner, { ...props }) });
+const Provider = (props) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(MathJaxLoader, { children: /* @__PURE__ */ jsxRuntime.jsx(ProviderInner, { ...props }) });
 };
 const InlineFormulaInner = mobxReactLite.observer(({
   id,
@@ -21559,7 +21566,7 @@ const InlineFormula = mobxReactLite.observer(({
   style = {},
   scale = 1
 }) => {
-  const context = useFormulize();
+  const context = useStore();
   const instance = context == null ? void 0 : context.instance;
   const isLoading = (context == null ? void 0 : context.isLoading) ?? true;
   const computationStore = context == null ? void 0 : context.computationStore;
@@ -21590,7 +21597,7 @@ const InlineVariableInner = mobxReactLite.observer(({
   const {
     isLoaded: mathJaxLoaded
   } = useMathJax();
-  const context = useFormulize();
+  const context = useStore();
   const config = context == null ? void 0 : context.config;
   const getVariable2 = React.useCallback(() => {
     return computationStore.variables.get(id);
@@ -21742,7 +21749,7 @@ const InlineVariable = mobxReactLite.observer(({
   style = {},
   scale = 1
 }) => {
-  const context = useFormulize();
+  const context = useStore();
   const instance = context == null ? void 0 : context.instance;
   const isLoading = (context == null ? void 0 : context.isLoading) ?? true;
   const computationStore = context == null ? void 0 : context.computationStore;
@@ -21960,7 +21967,7 @@ const EmbeddedFormula = mobxReactLite.observer(({
   className = "",
   style = {}
 }) => {
-  const context = useFormulize();
+  const context = useStore();
   const isLoading = (context == null ? void 0 : context.isLoading) ?? true;
   const computationStore = context == null ? void 0 : context.computationStore;
   if (isLoading || !computationStore) {
@@ -22349,7 +22356,7 @@ const ErrorDisplay = ({
 const Canvas = ({
   config
 }) => {
-  const context = useFormulize();
+  const context = useStore();
   const computationStore = context == null ? void 0 : context.computationStore;
   const [variables, setVariables] = React.useState({});
   const {
@@ -22577,7 +22584,7 @@ const AxisLabels = mobxReactLite.observer(({
   yAxisHovered = false
 }) => {
   var _a2;
-  const context = useFormulize();
+  const context = useStore();
   const computationStore = context == null ? void 0 : context.computationStore;
   if (!computationStore) {
     return null;
@@ -23021,7 +23028,7 @@ const Plot2D = mobxReactLite.observer(({
   config
 }) => {
   var _a2, _b;
-  const context = useFormulize();
+  const context = useStore();
   const computationStore = context == null ? void 0 : context.computationStore;
   const svgRef = React.useRef(null);
   const tooltipRef = React.useRef(null);
@@ -23643,7 +23650,7 @@ const Plot2D = mobxReactLite.observer(({
   if (!computationStore) {
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "plot2d-loading", children: "Loading plot..." });
   }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "formulize-plot2d", style: {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mn-plot2d", style: {
     position: "relative"
   }, children: [
     /* @__PURE__ */ jsxRuntime.jsx("svg", { ref: svgRef, style: {
@@ -24229,7 +24236,7 @@ const Plot3DInner = mobxReactLite.observer(({
 const Plot3D = mobxReactLite.observer(({
   config
 }) => {
-  const context = useFormulize();
+  const context = useStore();
   const computationStore = context == null ? void 0 : context.computationStore;
   if (!computationStore) {
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "plot3d-loading", children: "Loading plot..." });
@@ -24274,7 +24281,7 @@ const VisualizationComponent = mobxReactLite.observer(({
 }) => {
   const containerRef = React.useRef(null);
   const [isReady, setIsReady] = React.useState(false);
-  const context = useFormulize();
+  const context = useStore();
   const computationStore = context == null ? void 0 : context.computationStore;
   const isLoading = (context == null ? void 0 : context.isLoading) ?? true;
   const instance = context == null ? void 0 : context.instance;
@@ -24325,7 +24332,7 @@ const Button = ({
 const StepControl = mobxReactLite.observer(({
   className = ""
 }) => {
-  const context = useFormulize();
+  const context = useStore();
   const computationStore = (context == null ? void 0 : context.computationStore) ?? null;
   const isLoading = (context == null ? void 0 : context.isLoading) ?? true;
   const containerStyle = {
@@ -24567,11 +24574,11 @@ exports.ComputationStore = ComputationStore;
 exports.EmbeddedFormula = EmbeddedFormula;
 exports.Formula = Formula$1;
 exports.FormulaGenerator = Formula;
-exports.Formulize = Formulize;
-exports.FormulizeProvider = FormulizeProvider;
 exports.InlineFormula = InlineFormula;
 exports.InlineVariable = InlineVariable;
+exports.Provider = Provider;
 exports.StepControl = StepControl;
+exports.Store = Store;
 exports.Variable = Variable2;
 exports.VisualizationComponent = VisualizationComponent;
 exports.createComputationStore = createComputationStore;
@@ -24583,5 +24590,5 @@ exports.mergeVariables = mergeVariables;
 exports.register = register;
 exports.registerBuiltInComponents = registerBuiltInComponents;
 exports.unRegister = unRegister;
-exports.useFormulize = useFormulize;
+exports.useStore = useStore;
 //# sourceMappingURL=formulize.cjs.js.map