@pie-lib/math-input 8.1.2-next.88 → 9.0.0-next.7

package/dist/mq/common-mq-styles.d.ts

@@ -0,0 +1,231 @@
+/**
+ * @synced-from pie-lib/packages/math-input/src/mq/common-mq-styles.js
+ * @auto-generated
+ *
+ * This file is automatically synced from pie-elements and converted to TypeScript.
+ * Manual edits will be overwritten on next sync.
+ * To make changes, edit the upstream JavaScript file and run sync again.
+ */
+export declare const commonMqFontStyles: {
+    fontFamily: string;
+    '-webkit-font-smoothing': string;
+    '& .mq-math-mode > span > var': {
+        fontFamily: string;
+    };
+    '& .mq-math-mode span var': {
+        fontFamily: string;
+    };
+    '& .mq-math-mode .mq-nonSymbola': {
+        fontFamily: string;
+    };
+    '& .mq-math-mode > span > var.mq-operator-name': {
+        fontFamily: string;
+    };
+};
+export declare const longdivStyles: {
+    '& .mq-longdiv-inner': {
+        marginTop: string;
+        marginLeft: string;
+        '& > .mq-empty': {
+            padding: string;
+            marginLeft: string;
+            marginTop: string;
+        };
+    };
+    '& .mq-math-mode .mq-longdiv': {
+        display: string;
+    };
+};
+export declare const supsubStyles: {
+    '& .mq-math-mode sup.mq-nthroot': {
+        fontSize: string;
+        verticalAlign: string;
+        paddingRight: string;
+    };
+    '& .mq-math-mode .mq-supsub': {
+        fontSize: string;
+    };
+    '& .mq-supsub ': {
+        fontSize: string;
+    };
+    '& .mq-math-mode .mq-supsub.mq-sup-only': {
+        verticalAlign: string;
+        '& .mq-sup': {
+            marginBottom: string;
+        };
+    };
+    '& .mq-math-mode .mq-fraction + .mq-supsub.mq-sup-only': {
+        verticalAlign: string;
+    };
+    '& .mq-math-mode .mq-supsub.mq-sup-only.mq-after-fraction-group': {
+        verticalAlign: string;
+    };
+};
+export declare const commonMqKeyboardStyles: {
+    '& *': {
+        '& .mq-math-mode .mq-sqrt-prefix': {
+            top: string;
+        };
+        '& .mq-math-mode .mq-empty': {
+            padding: string;
+        };
+        '& .mq-math-mode .mq-longdiv-inner .mq-empty': {
+            padding: string;
+        };
+        '& .mq-math-mode .mq-supsub': {
+            fontSize: string;
+        };
+        '& .mq-math-mode .mq-sqrt-stem': {
+            marginTop: string;
+            paddingTop: string;
+        };
+        '& .mq-math-mode .mq-paren': {
+            verticalAlign: string;
+        };
+        '& .mq-math-mode .mq-overarrow .mq-overarrow-inner .mq-empty': {
+            padding: string;
+        };
+        '& .mq-math-mode .mq-overline .mq-overline-inner .mq-empty ': {
+            padding: string;
+        };
+        '& .mq-longdiv-inner': {
+            marginTop: string;
+            marginLeft: string;
+            '& > .mq-empty': {
+                padding: string;
+                marginLeft: string;
+                marginTop: string;
+            };
+        };
+        '& .mq-math-mode .mq-longdiv': {
+            display: string;
+        };
+        fontFamily: string;
+        '-webkit-font-smoothing': string;
+        '& .mq-math-mode > span > var': {
+            fontFamily: string;
+        };
+        '& .mq-math-mode span var': {
+            fontFamily: string;
+        };
+        '& .mq-math-mode .mq-nonSymbola': {
+            fontFamily: string;
+        };
+        '& .mq-math-mode > span > var.mq-operator-name': {
+            fontFamily: string;
+        };
+    };
+};
+declare const _default: {
+    commonMqFontStyles: {
+        fontFamily: string;
+        '-webkit-font-smoothing': string;
+        '& .mq-math-mode > span > var': {
+            fontFamily: string;
+        };
+        '& .mq-math-mode span var': {
+            fontFamily: string;
+        };
+        '& .mq-math-mode .mq-nonSymbola': {
+            fontFamily: string;
+        };
+        '& .mq-math-mode > span > var.mq-operator-name': {
+            fontFamily: string;
+        };
+    };
+    longdivStyles: {
+        '& .mq-longdiv-inner': {
+            marginTop: string;
+            marginLeft: string;
+            '& > .mq-empty': {
+                padding: string;
+                marginLeft: string;
+                marginTop: string;
+            };
+        };
+        '& .mq-math-mode .mq-longdiv': {
+            display: string;
+        };
+    };
+    supsubStyles: {
+        '& .mq-math-mode sup.mq-nthroot': {
+            fontSize: string;
+            verticalAlign: string;
+            paddingRight: string;
+        };
+        '& .mq-math-mode .mq-supsub': {
+            fontSize: string;
+        };
+        '& .mq-supsub ': {
+            fontSize: string;
+        };
+        '& .mq-math-mode .mq-supsub.mq-sup-only': {
+            verticalAlign: string;
+            '& .mq-sup': {
+                marginBottom: string;
+            };
+        };
+        '& .mq-math-mode .mq-fraction + .mq-supsub.mq-sup-only': {
+            verticalAlign: string;
+        };
+        '& .mq-math-mode .mq-supsub.mq-sup-only.mq-after-fraction-group': {
+            verticalAlign: string;
+        };
+    };
+    commonMqKeyboardStyles: {
+        '& *': {
+            '& .mq-math-mode .mq-sqrt-prefix': {
+                top: string;
+            };
+            '& .mq-math-mode .mq-empty': {
+                padding: string;
+            };
+            '& .mq-math-mode .mq-longdiv-inner .mq-empty': {
+                padding: string;
+            };
+            '& .mq-math-mode .mq-supsub': {
+                fontSize: string;
+            };
+            '& .mq-math-mode .mq-sqrt-stem': {
+                marginTop: string;
+                paddingTop: string;
+            };
+            '& .mq-math-mode .mq-paren': {
+                verticalAlign: string;
+            };
+            '& .mq-math-mode .mq-overarrow .mq-overarrow-inner .mq-empty': {
+                padding: string;
+            };
+            '& .mq-math-mode .mq-overline .mq-overline-inner .mq-empty ': {
+                padding: string;
+            };
+            '& .mq-longdiv-inner': {
+                marginTop: string;
+                marginLeft: string;
+                '& > .mq-empty': {
+                    padding: string;
+                    marginLeft: string;
+                    marginTop: string;
+                };
+            };
+            '& .mq-math-mode .mq-longdiv': {
+                display: string;
+            };
+            fontFamily: string;
+            '-webkit-font-smoothing': string;
+            '& .mq-math-mode > span > var': {
+                fontFamily: string;
+            };
+            '& .mq-math-mode span var': {
+                fontFamily: string;
+            };
+            '& .mq-math-mode .mq-nonSymbola': {
+                fontFamily: string;
+            };
+            '& .mq-math-mode > span > var.mq-operator-name': {
+                fontFamily: string;
+            };
+        };
+    };
+};
+export default _default;

package/dist/mq/common-mq-styles.js

@@ -0,0 +1,55 @@
+//#region src/mq/common-mq-styles.ts
+var e = {
+	fontFamily: "MJXZERO, MJXTEX !important",
+	"-webkit-font-smoothing": "antialiased !important",
+	"& .mq-math-mode > span > var": { fontFamily: "MJXZERO, MJXTEX-I !important" },
+	"& .mq-math-mode span var": { fontFamily: "MJXZERO, MJXTEX-I !important" },
+	"& .mq-math-mode .mq-nonSymbola": { fontFamily: "MJXZERO, MJXTEX-I !important" },
+	"& .mq-math-mode > span > var.mq-operator-name": { fontFamily: "MJXZERO, MJXTEX !important" }
+}, t = {
+	"& .mq-longdiv-inner": {
+		marginTop: "-1px",
+		marginLeft: "5px !important;",
+		"& > .mq-empty": {
+			padding: "0 !important",
+			marginLeft: "0px !important",
+			marginTop: "2px"
+		}
+	},
+	"& .mq-math-mode .mq-longdiv": { display: "inline-flex !important" }
+}, n = {
+	"& .mq-math-mode sup.mq-nthroot": {
+		fontSize: "70% !important",
+		verticalAlign: "0.5em !important",
+		paddingRight: "0.15em"
+	},
+	"& .mq-math-mode .mq-supsub": { fontSize: "70.7% !important" },
+	"& .mq-supsub ": { fontSize: "70.7%" },
+	"& .mq-math-mode .mq-supsub.mq-sup-only": {
+		verticalAlign: "-0.1em !important",
+		"& .mq-sup": { marginBottom: "0px !important" }
+	},
+	"& .mq-math-mode .mq-fraction + .mq-supsub.mq-sup-only": { verticalAlign: "0.4em !important" },
+	"& .mq-math-mode .mq-supsub.mq-sup-only.mq-after-fraction-group": { verticalAlign: "0.4em !important" }
+}, r = { "& *": {
+	...e,
+	...t,
+	"& .mq-math-mode .mq-sqrt-prefix": { top: "0 !important" },
+	"& .mq-math-mode .mq-empty": { padding: "9px 1px !important" },
+	"& .mq-math-mode .mq-longdiv-inner .mq-empty": { padding: "0 !important" },
+	"& .mq-math-mode .mq-supsub": { fontSize: "70.7% !important" },
+	"& .mq-math-mode .mq-sqrt-stem": {
+		marginTop: "-5px",
+		paddingTop: "4px"
+	},
+	"& .mq-math-mode .mq-paren": { verticalAlign: "middle !important" },
+	"& .mq-math-mode .mq-overarrow .mq-overarrow-inner .mq-empty": { padding: "0 !important" },
+	"& .mq-math-mode .mq-overline .mq-overline-inner .mq-empty ": { padding: "0 !important" }
+} }, i = {
+	commonMqFontStyles: e,
+	longdivStyles: t,
+	supsubStyles: n,
+	commonMqKeyboardStyles: r
+};
+//#endregion
+export { e as commonMqFontStyles, r as commonMqKeyboardStyles, i as default, t as longdivStyles, n as supsubStyles };

package/dist/mq/custom-elements.d.ts

@@ -0,0 +1,10 @@
+/**
+ * @synced-from pie-lib/packages/math-input/src/mq/custom-elements.js
+ * @auto-generated
+ *
+ * This file is automatically synced from pie-elements and converted to TypeScript.
+ * Manual edits will be overwritten on next sync.
+ * To make changes, edit the upstream JavaScript file and run sync again.
+ */
+declare const registerLineBreak: (MQ: any) => void;
+export { registerLineBreak };

package/dist/mq/custom-elements.js

@@ -0,0 +1,10 @@
+//#region src/mq/custom-elements.tsx
+var e = function(e) {
+	e.registerEmbed("newLine", () => ({
+		htmlString: "<div class=\"newLine\"></div>",
+		text: () => "testText",
+		latex: () => "\\embed{newLine}[]"
+	}));
+};
+//#endregion
+export { e as registerLineBreak };

package/dist/mq/index.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @synced-from pie-lib/packages/math-input/src/mq/index.js
+ * @auto-generated
+ *
+ * This file is automatically synced from pie-elements and converted to TypeScript.
+ * Manual edits will be overwritten on next sync.
+ * To make changes, edit the upstream JavaScript file and run sync again.
+ */
+import Input from './input.js';
+import Static from './static.js';
+import CommonMqStyles from './common-mq-styles.js';
+export { Input, Static, CommonMqStyles };

package/dist/mq/index.js

@@ -0,0 +1,12 @@
+import { __exportAll as e } from "../_virtual/_rolldown/runtime.js";
+import { Input as t } from "./input.js";
+import n from "./static.js";
+import r from "./common-mq-styles.js";
+//#region src/mq/index.ts
+var i = /* @__PURE__ */ e({
+	CommonMqStyles: () => r,
+	Input: () => t,
+	Static: () => n
+});
+//#endregion
+export { r as CommonMqStyles, t as Input, n as Static, i as mq_exports };

package/dist/mq/input.d.ts

@@ -0,0 +1,39 @@
+/**
+ * @synced-from pie-lib/packages/math-input/src/mq/input.jsx
+ * @auto-generated
+ *
+ * This file is automatically synced from pie-elements and converted to TypeScript.
+ * Manual edits will be overwritten on next sync.
+ * To make changes, edit the upstream JavaScript file and run sync again.
+ */
+import React from 'react';
+import PropTypes from 'prop-types';
+/**
+ * Wrapper for MathQuill MQ.MathField.
+ */
+export declare class Input extends React.Component {
+    static propTypes: {
+        className: PropTypes.Requireable<string>;
+        onClick: PropTypes.Requireable<(...args: any[]) => any>;
+        onChange: PropTypes.Requireable<(...args: any[]) => any>;
+        latex: PropTypes.Requireable<string>;
+        onFocus: PropTypes.Requireable<(...args: any[]) => any>;
+        onBlur: PropTypes.Requireable<(...args: any[]) => any>;
+    };
+    componentDidMount(): void;
+    componentDidUpdate(): void;
+    updateLatex(): void;
+    clear(): string;
+    blur(): void;
+    focus(): void;
+    command(v: any): any;
+    keystroke(v: any): any;
+    write(v: any): any;
+    onInputEdit: any;
+    refresh: any;
+    onKeyPress: any;
+    onClick: any;
+    shouldComponentUpdate(nextProps: any): boolean;
+    render(): React.JSX.Element;
+}
+export default Input;

package/dist/mq/input.js

@@ -0,0 +1,83 @@
+import { MQ as e } from "./mathquill-instance.js";
+import t from "react";
+import n from "prop-types";
+import { styled as r } from "@mui/material/styles";
+import i from "debug";
+import { jsx as a } from "react/jsx-runtime";
+//#region src/mq/input.tsx
+var o = i("math-input:mq:input"), s = r("span")({}), c = class extends t.Component {
+	static propTypes = {
+		className: n.string,
+		onClick: n.func,
+		onChange: n.func,
+		latex: n.string,
+		onFocus: n.func,
+		onBlur: n.func
+	};
+	componentDidMount() {
+		if (!e) throw Error("MQ is not defined - but component has mounted?");
+		this.mathField = e.MathField(this.input, { handlers: { edit: this.onInputEdit.bind(this) } }), this.updateLatex();
+	}
+	componentDidUpdate() {
+		this.updateLatex();
+	}
+	updateLatex() {
+		if (!this.mathField) return;
+		let { latex: e } = this.props;
+		e != null && this.mathField.latex(e);
+	}
+	clear() {
+		return this.mathField.latex(""), "";
+	}
+	blur() {
+		o("blur mathfield"), this.mathField.blur();
+	}
+	focus() {
+		o("focus mathfield..."), this.mathField.focus();
+	}
+	command(e) {
+		return o("command: ", e), Array.isArray(e) ? e.forEach((e) => {
+			this.mathField.cmd(e);
+		}) : this.mathField.cmd(e), this.mathField.focus(), this.mathField.latex();
+	}
+	keystroke(e) {
+		return this.mathField.keystroke(e), this.mathField.focus(), this.mathField.latex();
+	}
+	write(e) {
+		return o("write: ", e), this.mathField.write(e), this.mathField.focus(), this.mathField.latex();
+	}
+	onInputEdit = () => {
+		o("[onInputEdit] ...");
+		let { onChange: e } = this.props;
+		this.mathField && e && e(this.mathField.latex());
+	};
+	refresh = () => {
+		this.blur(), this.focus();
+	};
+	onKeyPress = (e) => {
+		if (Object.keys(this.mathField.__controller.options).indexOf("ignoreNextMousedown") < 0 && this.refresh(), e.charCode === 13) {
+			e.preventDefault();
+			return;
+		}
+	};
+	onClick = (e) => {
+		let { onClick: t } = this.props;
+		this.refresh(), t && t(e);
+	};
+	shouldComponentUpdate(e) {
+		return o("next: ", e.latex), o("current: ", this.mathField.latex()), e.latex !== this.mathField.latex();
+	}
+	render() {
+		let { onFocus: e, onBlur: t, className: n } = this.props;
+		return /* @__PURE__ */ a(s, {
+			className: n,
+			onKeyDown: this.onKeyPress,
+			onClick: this.onClick,
+			onFocus: e,
+			onBlur: t,
+			ref: (e) => this.input = e
+		});
+	}
+};
+//#endregion
+export { c as Input, c as default };

package/{src/mq/mathquill-instance.js → dist/mq/mathquill-instance.d.ts}

@@ -1,14 +1,12 @@
-import MathQuill from '@pie-framework/mathquill';
-import { registerLineBreak } from './custom-elements';
-
-let MQ;
-if (typeof window !== 'undefined') {
-  MQ = MathQuill.getInterface(3);
-  if (MQ && MQ.registerEmbed) {
-    registerLineBreak(MQ);
-  }
-}
-
+/**
+ * @synced-from pie-lib/packages/math-input/src/mq/mathquill-instance.js
+ * @auto-generated
+ *
+ * This file is automatically synced from pie-elements and converted to TypeScript.
+ * Manual edits will be overwritten on next sync.
+ * To make changes, edit the upstream JavaScript file and run sync again.
+ */
+declare let MQ: any;
 /**
  * Register a MathQuill embed (e.g. answer blocks in pie-elements).
  * No-op in SSR or if the interface is unavailable.
@@ -16,13 +14,7 @@ if (typeof window !== 'undefined') {
  * @param {string} name
  * @param {Function} factory
  */
-export function registerEmbed(name, factory) {
-  if (!MQ || !MQ.registerEmbed) {
-    return;
-  }
-  MQ.registerEmbed(name, factory);
-}
-
+export declare function registerEmbed(name: any, factory: any): void;
 /**
  * Apply MathQuill static math to a DOM element.
  * Optionally sets element text to `latex` before enhancing (typical pie-elements usage).
@@ -32,14 +24,5 @@ export function registerEmbed(name, factory) {
  * @param {object} [options] Optional MathQuill StaticMath options (e.g. handlers).
  * @returns {object|undefined} MathQuill static math instance, if any.
  */
-export function applyStaticMath(element, latex, options) {
-  if (!MQ || !element) {
-    return undefined;
-  }
-  if (latex !== undefined && latex !== null) {
-    element.textContent = latex;
-  }
-  return MQ.StaticMath(element, options);
-}
-
+export declare function applyStaticMath(element: any, latex: any, options: any): any;
 export { MQ };

package/dist/mq/mathquill-instance.js

@@ -0,0 +1,13 @@
+import { registerLineBreak as e } from "./custom-elements.js";
+import t from "@pie-framework/mathquill";
+//#region src/mq/mathquill-instance.ts
+var n;
+typeof window < "u" && (n = t.getInterface(3), n && n.registerEmbed && e(n));
+function r(e, t) {
+	!n || !n.registerEmbed || n.registerEmbed(e, t);
+}
+function i(e, t, r) {
+	if (!(!n || !e)) return t != null && (e.textContent = t), n.StaticMath(e, r);
+}
+//#endregion
+export { n as MQ, i as applyStaticMath, r as registerEmbed };

package/dist/mq/static.d.ts

@@ -0,0 +1,47 @@
+/**
+ * @synced-from pie-lib/packages/math-input/src/mq/static.jsx
+ * @auto-generated
+ *
+ * This file is automatically synced from pie-elements and converted to TypeScript.
+ * Manual edits will be overwritten on next sync.
+ * To make changes, edit the upstream JavaScript file and run sync again.
+ */
+import PropTypes from 'prop-types';
+import React from 'react';
+/**
+ * Wrapper for MathQuill MQ.MathField.
+ */
+export default class Static extends React.Component {
+    static propTypes: {
+        latex: PropTypes.Validator<string>;
+        onFocus: PropTypes.Requireable<(...args: any[]) => any>;
+        onBlur: PropTypes.Requireable<(...args: any[]) => any>;
+        className: PropTypes.Requireable<string>;
+        getFieldName: PropTypes.Requireable<(...args: any[]) => any>;
+        onSubFieldChange: PropTypes.Requireable<(...args: any[]) => any>;
+        onSubFieldFocus: PropTypes.Requireable<(...args: any[]) => any>;
+        setInput: PropTypes.Requireable<(...args: any[]) => any>;
+    };
+    static defaultProps: {
+        getFieldName: () => void;
+    };
+    constructor(props: any);
+    componentDidMount(): void;
+    componentDidUpdate(): void;
+    componentWillUnmount(): void;
+    createLiveRegion: any;
+    addEventListeners: any;
+    removeEventListeners: any;
+    removeLiveRegion: any;
+    handleKeyDown: any;
+    handleMathKeyboardClick: any;
+    onInputEdit: any;
+    announceLatexConversion: any;
+    announceMessage: any;
+    update: any;
+    blur: any;
+    focus: any;
+    shouldComponentUpdate(nextProps: any): boolean;
+    onFocus: any;
+    render(): React.JSX.Element;
+}