mathlean-canvas 0.3.3 → 0.3.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/InlineMathLiveField.d.ts +4 -1
- package/dist/MathCanvas/components/ShortcutMenu.d.ts +10 -0
- package/dist/MathCanvas/components/Toolbar.d.ts +3 -1
- package/dist/MathCanvas/components/icons.d.ts +8 -1
- package/dist/MathCanvas/core/hooks/useCanvasSnapshot.d.ts +4 -2
- package/dist/MathCanvas/core/hooks/useCanvasStageInteractions.d.ts +2 -1
- package/dist/MathCanvas/features/plot/components/PlotControls.d.ts +29 -0
- package/dist/MathCanvas/features/plot/components/PlotLayer.d.ts +31 -0
- package/dist/MathCanvas/features/plot/index.d.ts +2 -0
- package/dist/MathCanvas/features/plot/utils/plotCompiler.d.ts +22 -0
- package/dist/MathCanvas/features/plot/utils/plotModel.d.ts +18 -0
- package/dist/MathCanvas/features/text/components/InlineMathBubble.d.ts +2 -1
- package/dist/MathCanvas/features/text/components/TextBlockEditor.d.ts +3 -6
- package/dist/MathCanvas/features/text/components/TextBlockView.d.ts +1 -5
- package/dist/MathCanvas/features/text/hooks/useTextBlockEditingActions.d.ts +1 -5
- package/dist/MathCanvas/features/text/hooks/useTextBlockLayoutEffects.d.ts +1 -5
- package/dist/MathCanvas/features/text/hooks/useTextBlockRenderHelpers.d.ts +2 -5
- package/dist/MathCanvas/features/text/hooks/useTextboxResize.d.ts +1 -5
- package/dist/MathCanvas/shortcuts.d.ts +20 -0
- package/dist/MathCanvas/types.d.ts +45 -1
- package/dist/MathCanvas/utils/latex.d.ts +1 -0
- package/dist/index.js +59589 -7769
- package/dist/useInlineMathSession.d.ts +3 -1
- package/package.json +2 -1
|
@@ -4,14 +4,17 @@ type InlineMathLiveFieldProps = {
|
|
|
4
4
|
fieldRef: RefObject<MathfieldElement | null>;
|
|
5
5
|
bubbleRef: RefObject<HTMLDivElement | null>;
|
|
6
6
|
initialLatex: string;
|
|
7
|
+
initialPosition?: "start" | "end";
|
|
7
8
|
style: CSSProperties;
|
|
9
|
+
inlineShortcuts?: Record<string, string>;
|
|
8
10
|
onReady: () => void;
|
|
9
11
|
onLatexChange: (latex: string) => void;
|
|
10
12
|
onCommit: () => void;
|
|
11
13
|
onCancel: () => void;
|
|
12
14
|
onArrowExit: (direction: "before" | "after") => void;
|
|
15
|
+
onStableEnter?: () => boolean;
|
|
13
16
|
onError: () => void;
|
|
14
17
|
onContextMenu?: (event: MouseEvent<MathfieldElement>) => void;
|
|
15
18
|
};
|
|
16
|
-
export default function InlineMathLiveField({ fieldRef, bubbleRef, initialLatex, style, onReady, onLatexChange, onCommit, onCancel, onArrowExit, onError, onContextMenu, }: InlineMathLiveFieldProps): import("react/jsx-runtime").JSX.Element;
|
|
19
|
+
export default function InlineMathLiveField({ fieldRef, bubbleRef, initialLatex, initialPosition, style, inlineShortcuts, onReady, onLatexChange, onCommit, onCancel, onArrowExit, onStableEnter, onError, onContextMenu, }: InlineMathLiveFieldProps): import("react/jsx-runtime").JSX.Element;
|
|
17
20
|
export {};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import type { MathCanvasTheme, ShortcutSettings } from "../types";
|
|
2
|
+
type ShortcutMenuProps = {
|
|
3
|
+
colors: MathCanvasTheme;
|
|
4
|
+
darkMode: boolean;
|
|
5
|
+
open: boolean;
|
|
6
|
+
shortcutSettings: ShortcutSettings;
|
|
7
|
+
updateShortcutSettings: (updater: (settings: ShortcutSettings) => ShortcutSettings) => void;
|
|
8
|
+
};
|
|
9
|
+
export default function ShortcutMenu({ colors, darkMode, open, shortcutSettings, updateShortcutSettings, }: ShortcutMenuProps): import("react/jsx-runtime").JSX.Element | null;
|
|
10
|
+
export {};
|
|
@@ -29,6 +29,8 @@ type ToolbarProps = {
|
|
|
29
29
|
setCoordinatePlaneMode: Dispatch<SetStateAction<CoordinatePlaneMode>>;
|
|
30
30
|
pushHistoryState: () => void;
|
|
31
31
|
clearCanvas: () => void;
|
|
32
|
+
shortcutMenuOpen: boolean;
|
|
33
|
+
setShortcutMenuOpen: Dispatch<SetStateAction<boolean>>;
|
|
32
34
|
};
|
|
33
|
-
export default function Toolbar({ colors, darkMode, tool, setTool, renderMode, toggleLatexMode, pastStateCount, futureStateCount, handleUndo, handleRedo, showPenSizes, setShowPenSizes, penWidth, setPenWidth, penColor, setPenColor, penColorOptions, geometryMode, setGeometryMode, clearGeometryDraft, clearGeometryLabelEditing, regularPolygonSides, setRegularPolygonSides, coordinatePlaneMode, setCoordinatePlaneMode, pushHistoryState, clearCanvas, }: ToolbarProps): import("react/jsx-runtime").JSX.Element;
|
|
35
|
+
export default function Toolbar({ colors, darkMode, tool, setTool, renderMode, toggleLatexMode, pastStateCount, futureStateCount, handleUndo, handleRedo, showPenSizes, setShowPenSizes, penWidth, setPenWidth, penColor, setPenColor, penColorOptions, geometryMode, setGeometryMode, clearGeometryDraft, clearGeometryLabelEditing, regularPolygonSides, setRegularPolygonSides, coordinatePlaneMode, setCoordinatePlaneMode, pushHistoryState, clearCanvas, shortcutMenuOpen, setShortcutMenuOpen, }: ToolbarProps): import("react/jsx-runtime").JSX.Element;
|
|
34
36
|
export {};
|
|
@@ -33,6 +33,9 @@ export declare function RenderKatexExpression({ expression, fallback, displayMod
|
|
|
33
33
|
export declare function GraphIcon({ active }: {
|
|
34
34
|
active: boolean;
|
|
35
35
|
}): import("react/jsx-runtime").JSX.Element;
|
|
36
|
+
export declare function PlotIcon({ active }: {
|
|
37
|
+
active: boolean;
|
|
38
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
36
39
|
export declare function MatrixIcon({ active }: {
|
|
37
40
|
active: boolean;
|
|
38
41
|
}): import("react/jsx-runtime").JSX.Element;
|
|
@@ -42,16 +45,20 @@ export declare function TableIcon({ active }: {
|
|
|
42
45
|
export declare function LatexToggleIcon({ active }: {
|
|
43
46
|
active: boolean;
|
|
44
47
|
}): import("react/jsx-runtime").JSX.Element;
|
|
48
|
+
export declare function ShortcutIcon({ active }: {
|
|
49
|
+
active: boolean;
|
|
50
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
45
51
|
export declare function UndoIcon({ active }: {
|
|
46
52
|
active: boolean;
|
|
47
53
|
}): import("react/jsx-runtime").JSX.Element;
|
|
48
54
|
export declare function RedoIcon({ active }: {
|
|
49
55
|
active: boolean;
|
|
50
56
|
}): import("react/jsx-runtime").JSX.Element;
|
|
51
|
-
export declare function ToolButton({ active, disabled, label, onClick, children, colors, }: {
|
|
57
|
+
export declare function ToolButton({ active, disabled, label, onMouseDown, onClick, children, colors, }: {
|
|
52
58
|
active: boolean;
|
|
53
59
|
disabled?: boolean;
|
|
54
60
|
label: string;
|
|
61
|
+
onMouseDown?: React.MouseEventHandler<HTMLButtonElement>;
|
|
55
62
|
onClick: () => void;
|
|
56
63
|
children: React.ReactNode;
|
|
57
64
|
colors: MathCanvasTheme;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { CanvasState, CoordinatePlaneMode, GeoAngle, GeoCircle, GeoHelperSegment, GeoPoint, GeoPolygon, GeoRightAngleMarker, GeoSegment, GraphEdge, GraphNode, MatrixObject, RenderMode, Stroke, TableObject, TextBlock } from "../../types";
|
|
1
|
+
import type { CanvasState, CoordinatePlaneMode, GeoAngle, GeoCircle, GeoHelperSegment, GeoPoint, GeoPolygon, GeoRightAngleMarker, GeoSegment, GraphEdge, GraphNode, MatrixObject, PlotFunction, RenderMode, ShortcutSettings, Stroke, TableObject, TextBlock } from "../../types";
|
|
2
2
|
type UseCanvasSnapshotOptions = {
|
|
3
3
|
blocks: TextBlock[];
|
|
4
4
|
coordinatePlaneMode: CoordinatePlaneMode;
|
|
@@ -13,11 +13,13 @@ type UseCanvasSnapshotOptions = {
|
|
|
13
13
|
graphNodes: GraphNode[];
|
|
14
14
|
matrices: MatrixObject[];
|
|
15
15
|
onStateChange?: (state: CanvasState) => void;
|
|
16
|
+
plots: PlotFunction[];
|
|
16
17
|
renderMode: RenderMode;
|
|
18
|
+
shortcutSettings: ShortcutSettings;
|
|
17
19
|
strokes: Stroke[];
|
|
18
20
|
tables: TableObject[];
|
|
19
21
|
};
|
|
20
|
-
export declare function useCanvasSnapshot({ blocks, coordinatePlaneMode, geoAngles, geoCircles, geoHelperSegments, geoPoints, geoPolygons, geoRightAngleMarkers, geoSegments, graphEdges, graphNodes, matrices, onStateChange, renderMode, strokes, tables, }: UseCanvasSnapshotOptions): {
|
|
22
|
+
export declare function useCanvasSnapshot({ blocks, coordinatePlaneMode, geoAngles, geoCircles, geoHelperSegments, geoPoints, geoPolygons, geoRightAngleMarkers, geoSegments, graphEdges, graphNodes, matrices, onStateChange, plots, renderMode, shortcutSettings, strokes, tables, }: UseCanvasSnapshotOptions): {
|
|
21
23
|
getCanvasState: () => CanvasState;
|
|
22
24
|
};
|
|
23
25
|
export {};
|
|
@@ -40,6 +40,7 @@ type UseCanvasStageInteractionsOptions = {
|
|
|
40
40
|
findMatrixAtPoint: (x: number, y: number) => MatrixObject | null;
|
|
41
41
|
findTableAtPoint: (x: number, y: number) => TableObject | null;
|
|
42
42
|
findTextBlockBlockingCreation: (x: number, y: number) => TextBlock | null;
|
|
43
|
+
findTextBlockNearPoint: (x: number, y: number) => TextBlock | null;
|
|
43
44
|
finishGraphSelectionDrag: () => boolean;
|
|
44
45
|
getDefaultMatrixPosition: (x: number, y: number) => ScenePoint;
|
|
45
46
|
getDefaultTablePosition: (x: number, y: number) => ScenePoint;
|
|
@@ -94,7 +95,7 @@ type UseCanvasStageInteractionsOptions = {
|
|
|
94
95
|
updateEraserPreview: (x: number, y: number) => number;
|
|
95
96
|
updateGraphSelectionDrag: (point: ScenePoint) => boolean;
|
|
96
97
|
};
|
|
97
|
-
export declare function useCanvasStageInteractions({ beginGraphSelectionDrag, clearEraserPreview, clearGeometryDraft, clearGeometrySelection, clearGraphSelection, clearMatrixSelection, clearTableSelection, commitEditing, commitGeometryLabelEditing, commitGraphEditing, commitMatrixEditing, commitTableEditing, createGraphNode, createId, createMatrix, createTable, createTextBlock, editingBlockId, editingGeometryLabel, editingGraphNodeId, editingMatrixId, editingTableId, eraseAtPointState, extendStroke, findGeoPointNear, findGeoSegmentNear, findGeometryLabelTargetNear, findGraphNodeAtPoint, findMatrixAtPoint, findTableAtPoint, findTextBlockBlockingCreation, finishGraphSelectionDrag, getDefaultMatrixPosition, getDefaultTablePosition, getGeoSnap, getScenePoint, geometryMode, handleGeometryCanvasPoint, handleGeometryPointChoice, isDrawing, isErasing, isPanning, lastPanPoint, penColor, penWidth, pushHistoryState, selectedGraphNodeId, selectedMatrixId, selectedPointId, selectedTableId, selectOnlyGeoSegment, selectOnlyGraphNode, setArmedSourceNodeId, setGeometryDraftPointIds, setGeometryPointer, setMatrixLatexPopover, setRenderMode, setSelectedBlockId, setSelectedGraphEdgeId, setSelectedMatrixId, setSelectedTableId, setSnapPreview, setTextBlockMenu, setViewport, skipNextMatrixCreationRef, skipNextTextCreationRef, skipNextTextCreationResetRef, startGeometryLabelEditing, startGraphEditing, startMatrixEditing, startStrokeState, startTableEditing, suppressNextGraphActivationRef, toggleEqualSideMarker, tool, updateEraserPreview, updateGraphSelectionDrag, }: UseCanvasStageInteractionsOptions): {
|
|
98
|
+
export declare function useCanvasStageInteractions({ beginGraphSelectionDrag, clearEraserPreview, clearGeometryDraft, clearGeometrySelection, clearGraphSelection, clearMatrixSelection, clearTableSelection, commitEditing, commitGeometryLabelEditing, commitGraphEditing, commitMatrixEditing, commitTableEditing, createGraphNode, createId, createMatrix, createTable, createTextBlock, editingBlockId, editingGeometryLabel, editingGraphNodeId, editingMatrixId, editingTableId, eraseAtPointState, extendStroke, findGeoPointNear, findGeoSegmentNear, findGeometryLabelTargetNear, findGraphNodeAtPoint, findMatrixAtPoint, findTableAtPoint, findTextBlockBlockingCreation, findTextBlockNearPoint, finishGraphSelectionDrag, getDefaultMatrixPosition, getDefaultTablePosition, getGeoSnap, getScenePoint, geometryMode, handleGeometryCanvasPoint, handleGeometryPointChoice, isDrawing, isErasing, isPanning, lastPanPoint, penColor, penWidth, pushHistoryState, selectedGraphNodeId, selectedMatrixId, selectedPointId, selectedTableId, selectOnlyGeoSegment, selectOnlyGraphNode, setArmedSourceNodeId, setGeometryDraftPointIds, setGeometryPointer, setMatrixLatexPopover, setRenderMode, setSelectedBlockId, setSelectedGraphEdgeId, setSelectedMatrixId, setSelectedTableId, setSnapPreview, setTextBlockMenu, setViewport, skipNextMatrixCreationRef, skipNextTextCreationRef, skipNextTextCreationResetRef, startGeometryLabelEditing, startGraphEditing, startMatrixEditing, startStrokeState, startTableEditing, suppressNextGraphActivationRef, toggleEqualSideMarker, tool, updateEraserPreview, updateGraphSelectionDrag, }: UseCanvasStageInteractionsOptions): {
|
|
98
99
|
handleCanvasActivation: (e: StageActivationEvent) => void;
|
|
99
100
|
handlePointerDown: (e: StagePointerEvent) => void;
|
|
100
101
|
handlePointerMove: (e: StagePointerEvent) => void;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { type Dispatch, type SetStateAction } from "react";
|
|
2
|
+
import type { MathCanvasTheme, PlotFunction } from "../../../types";
|
|
3
|
+
type PlotControlsProps = {
|
|
4
|
+
colors: MathCanvasTheme;
|
|
5
|
+
editingPlot: PlotFunction | null;
|
|
6
|
+
editingPlotEquationId: string | null;
|
|
7
|
+
editingPlotLatex: string;
|
|
8
|
+
inlineShortcuts: Record<string, string>;
|
|
9
|
+
plotColorOptions: readonly string[];
|
|
10
|
+
plotMenuPanel: "actions" | "color" | null;
|
|
11
|
+
copySelectedPlot: (plot: PlotFunction) => Promise<void>;
|
|
12
|
+
createPlotEquation: (plotId: string) => void;
|
|
13
|
+
deletePlotEquation: (plotId: string, equationId: string) => void;
|
|
14
|
+
deleteSelectedPlot: () => void;
|
|
15
|
+
commitPlotEditing: () => boolean;
|
|
16
|
+
pushHistoryState: () => void;
|
|
17
|
+
setEditingPlotEquationId: Dispatch<SetStateAction<string | null>>;
|
|
18
|
+
setEditingPlotId: Dispatch<SetStateAction<string | null>>;
|
|
19
|
+
setEditingPlotLatex: Dispatch<SetStateAction<string>>;
|
|
20
|
+
setPlotMenuPanel: (panel: "actions" | "color" | null) => void;
|
|
21
|
+
setPlots: Dispatch<SetStateAction<PlotFunction[]>>;
|
|
22
|
+
updatePlotEquationColor: (plotId: string, equationId: string, color: string) => void;
|
|
23
|
+
viewport: {
|
|
24
|
+
x: number;
|
|
25
|
+
y: number;
|
|
26
|
+
};
|
|
27
|
+
};
|
|
28
|
+
export default function PlotControls({ colors, editingPlot, editingPlotEquationId, editingPlotLatex, inlineShortcuts, plotColorOptions, plotMenuPanel, copySelectedPlot, createPlotEquation, deletePlotEquation, deleteSelectedPlot, commitPlotEditing, pushHistoryState, setEditingPlotEquationId, setEditingPlotId, setEditingPlotLatex, setPlotMenuPanel, setPlots, updatePlotEquationColor, viewport, }: PlotControlsProps): import("react/jsx-runtime").JSX.Element | null;
|
|
29
|
+
export {};
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import type Konva from "konva";
|
|
2
|
+
import type { MutableRefObject } from "react";
|
|
3
|
+
import type { MathCanvasTheme, PlotFunction, Tool } from "../../../types";
|
|
4
|
+
type PlotLayerProps = {
|
|
5
|
+
plots: PlotFunction[];
|
|
6
|
+
colors: MathCanvasTheme;
|
|
7
|
+
darkMode: boolean;
|
|
8
|
+
size: {
|
|
9
|
+
width: number;
|
|
10
|
+
height: number;
|
|
11
|
+
};
|
|
12
|
+
viewport: {
|
|
13
|
+
x: number;
|
|
14
|
+
y: number;
|
|
15
|
+
};
|
|
16
|
+
plotNodeRefs: MutableRefObject<Record<string, Konva.Group | null>>;
|
|
17
|
+
selectedPlotId: string | null;
|
|
18
|
+
tool: Tool;
|
|
19
|
+
clearGraphSelection: () => void;
|
|
20
|
+
clearMatrixSelection: () => void;
|
|
21
|
+
clearTableSelection: () => void;
|
|
22
|
+
pushHistoryState: () => void;
|
|
23
|
+
setSelectedBlockId: (id: string | null) => void;
|
|
24
|
+
setSelectedPlotId: (id: string | null) => void;
|
|
25
|
+
openPlotActions: (id: string) => void;
|
|
26
|
+
startPlotEditing: (id: string) => void;
|
|
27
|
+
updatePlot: (id: string, updater: (plot: PlotFunction) => PlotFunction) => void;
|
|
28
|
+
};
|
|
29
|
+
declare function PlotLayer({ plots, colors, darkMode, size, viewport, plotNodeRefs, selectedPlotId, tool, clearGraphSelection, clearMatrixSelection, clearTableSelection, pushHistoryState, setSelectedBlockId, setSelectedPlotId, openPlotActions, startPlotEditing, updatePlot, }: PlotLayerProps): import("react/jsx-runtime").JSX.Element;
|
|
30
|
+
declare const _default: import("react").MemoExoticComponent<typeof PlotLayer>;
|
|
31
|
+
export default _default;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import type { MathJsonExpression } from "@cortex-js/compute-engine/math-json";
|
|
2
|
+
export type PlotCompileResult = {
|
|
3
|
+
ok: true;
|
|
4
|
+
latex: string;
|
|
5
|
+
mathJson: MathJsonExpression;
|
|
6
|
+
} | {
|
|
7
|
+
ok: false;
|
|
8
|
+
error: string;
|
|
9
|
+
};
|
|
10
|
+
export type CompiledPlotFunction = {
|
|
11
|
+
kind: "explicit";
|
|
12
|
+
evaluate: (x: number, variables?: Record<string, number>) => number;
|
|
13
|
+
} | {
|
|
14
|
+
kind: "implicit";
|
|
15
|
+
evaluate: (x: number, y: number, variables?: Record<string, number>) => number;
|
|
16
|
+
} | {
|
|
17
|
+
kind: "inequality";
|
|
18
|
+
evaluate: (x: number, y: number, variables?: Record<string, number>) => boolean;
|
|
19
|
+
};
|
|
20
|
+
export declare function getPlotVariableNames(mathJson: MathJsonExpression | null): string[];
|
|
21
|
+
export declare function compilePlotLatex(latex: string): PlotCompileResult;
|
|
22
|
+
export declare function compilePlotMathJson(mathJson: MathJsonExpression | null): CompiledPlotFunction | null;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import type { PlotEquation, PlotFunction, PlotParameter } from "../../../types";
|
|
2
|
+
export declare const PLOT_EQUATION_ROW_HEIGHT = 42;
|
|
3
|
+
export declare const PLOT_EQUATION_TOP_PADDING = 8;
|
|
4
|
+
export declare const PLOT_EQUATION_BOTTOM_PADDING = 8;
|
|
5
|
+
export declare const PLOT_EQUATION_MIN_HEIGHT = 52;
|
|
6
|
+
export declare const PLOT_EQUATION_PANEL_WIDTH = 190;
|
|
7
|
+
export declare const PLOT_EQUATION_PANEL_MAX_WIDTH = 440;
|
|
8
|
+
export declare const PLOT_EQUATION_PANEL_GAP = 8;
|
|
9
|
+
export declare const PLOT_EQUATION_PANEL_DEFAULT_TOP = 10;
|
|
10
|
+
export declare const PLOT_PARAMETER_ROW_HEIGHT = 38;
|
|
11
|
+
export declare function getPlotEquations(plot: PlotFunction): PlotEquation[];
|
|
12
|
+
export declare function getPlotParameters(plot: PlotFunction): PlotParameter[];
|
|
13
|
+
export declare function getPlotEquationAreaHeight(plot: PlotFunction): number;
|
|
14
|
+
export declare function getPlotEquationPanelWidth(plot: PlotFunction): number;
|
|
15
|
+
export declare function getPlotEquationTextWidth(panelWidth: number): number;
|
|
16
|
+
export declare function getPlotEquationRowHeight(equation: PlotEquation, panelWidth: number): number;
|
|
17
|
+
export declare function getPlotEquationRowTop(plot: PlotFunction, index: number): number;
|
|
18
|
+
export declare function normalizePlot(plot: PlotFunction): PlotFunction;
|
|
@@ -22,6 +22,7 @@ type InlineMathBubbleProps = {
|
|
|
22
22
|
exitActiveInlineMathDraft: (direction: "before" | "after") => void;
|
|
23
23
|
handleInlineMathLatexChange: (latex: string) => void;
|
|
24
24
|
inlineMathBubbleRef: RefObject<HTMLDivElement | null>;
|
|
25
|
+
inlineShortcuts: Record<string, string>;
|
|
25
26
|
inlineMathEditorMode: "mathlive" | "fallback";
|
|
26
27
|
inlineMathEditorRect: InlineMathEditorRect;
|
|
27
28
|
inlineMathFieldRef: RefObject<MathfieldElement | null>;
|
|
@@ -32,5 +33,5 @@ type InlineMathBubbleProps = {
|
|
|
32
33
|
setRenderMode: Dispatch<SetStateAction<"plain" | "latex">>;
|
|
33
34
|
setSelectedBlockId: Dispatch<SetStateAction<string | null>>;
|
|
34
35
|
};
|
|
35
|
-
export default function InlineMathBubble({ activeInlineMathAtomId, activeInlineMathDraft, activeInlineMathSession, activateInlineMathFallback, cancelActiveInlineMathDraft, colors, commitActiveInlineMathDraft, darkMode, editingBlock, editingBlockId, exitActiveInlineMathDraft, handleInlineMathLatexChange, inlineMathBubbleRef, inlineMathEditorMode, inlineMathEditorRect, inlineMathFieldRef, latexPreview, markInlineMathEditorReady, openTextBlockMenu, setActiveInlineMathDraft, setRenderMode, setSelectedBlockId, }: InlineMathBubbleProps): import("react/jsx-runtime").JSX.Element | null;
|
|
36
|
+
export default function InlineMathBubble({ activeInlineMathAtomId, activeInlineMathDraft, activeInlineMathSession, activateInlineMathFallback, cancelActiveInlineMathDraft, colors, commitActiveInlineMathDraft, darkMode, editingBlock, editingBlockId, exitActiveInlineMathDraft, handleInlineMathLatexChange, inlineMathBubbleRef, inlineShortcuts, inlineMathEditorMode, inlineMathEditorRect, inlineMathFieldRef, latexPreview, markInlineMathEditorReady, openTextBlockMenu, setActiveInlineMathDraft, setRenderMode, setSelectedBlockId, }: InlineMathBubbleProps): import("react/jsx-runtime").JSX.Element | null;
|
|
36
37
|
export {};
|
|
@@ -26,21 +26,18 @@ type TextBlockEditorProps = {
|
|
|
26
26
|
inlineMathBubbleRef: RefObject<HTMLDivElement | null>;
|
|
27
27
|
inlineMathFieldRef: RefObject<MathfieldElement | null>;
|
|
28
28
|
insertInlineMathAtSelection: (start: number, end: number) => void;
|
|
29
|
+
isOpeningInlineMathSession: boolean;
|
|
29
30
|
isOpeningInlineMathSessionRef: MutableRefObject<boolean>;
|
|
30
31
|
latexPreviewStart: number | null;
|
|
31
32
|
mathOverlayCaret: MathOverlayCaret;
|
|
32
33
|
openTextBlockMenu: (block: TextBlock) => void;
|
|
33
34
|
rememberEditingSelection: (target: HTMLTextAreaElement) => void;
|
|
34
|
-
reopenInlineMathSessionAtBoundary: (direction: "before" | "after") => boolean;
|
|
35
|
+
reopenInlineMathSessionAtBoundary: (direction: "before" | "after", selection?: number) => boolean;
|
|
35
36
|
setEditingValue: Dispatch<SetStateAction<string>>;
|
|
36
37
|
setRenderMode: Dispatch<SetStateAction<RenderMode>>;
|
|
37
38
|
setSelectedBlockId: Dispatch<SetStateAction<string | null>>;
|
|
38
|
-
size: {
|
|
39
|
-
width: number;
|
|
40
|
-
height: number;
|
|
41
|
-
};
|
|
42
39
|
textareaRef: RefObject<HTMLTextAreaElement | null>;
|
|
43
40
|
toggleLatexMode: () => void;
|
|
44
41
|
};
|
|
45
|
-
export default function TextBlockEditor({ activeInlineMathSession, activeInlineMathSessionRef, beginTextboxResize, clearEditing, colors, commitActiveInlineMathDraft, commitEditing, editableMirrorContentRef, editableMirrorRef, editingBlock, editingDisplayValue, editingHeight, editingSelection, editingValue, editingWidth, inlineMathBubbleRef, inlineMathFieldRef, insertInlineMathAtSelection, isOpeningInlineMathSessionRef, latexPreviewStart, mathOverlayCaret, openTextBlockMenu, rememberEditingSelection, reopenInlineMathSessionAtBoundary, setEditingValue, setRenderMode, setSelectedBlockId,
|
|
42
|
+
export default function TextBlockEditor({ activeInlineMathSession, activeInlineMathSessionRef, beginTextboxResize, clearEditing, colors, commitActiveInlineMathDraft, commitEditing, editableMirrorContentRef, editableMirrorRef, editingBlock, editingDisplayValue, editingHeight, editingSelection, editingValue, editingWidth, inlineMathBubbleRef, inlineMathFieldRef, insertInlineMathAtSelection, isOpeningInlineMathSession, isOpeningInlineMathSessionRef, latexPreviewStart, mathOverlayCaret, openTextBlockMenu, rememberEditingSelection, reopenInlineMathSessionAtBoundary, setEditingValue, setRenderMode, setSelectedBlockId, textareaRef, toggleLatexMode, }: TextBlockEditorProps): import("react/jsx-runtime").JSX.Element | null;
|
|
46
43
|
export {};
|
|
@@ -11,12 +11,8 @@ type TextBlockViewProps = {
|
|
|
11
11
|
selectedBlockId: string | null;
|
|
12
12
|
setRenderMode: Dispatch<SetStateAction<RenderMode>>;
|
|
13
13
|
setSelectedBlockId: Dispatch<SetStateAction<string | null>>;
|
|
14
|
-
size: {
|
|
15
|
-
width: number;
|
|
16
|
-
height: number;
|
|
17
|
-
};
|
|
18
14
|
startEditing: (id: string, selectionOverride?: number | null) => void;
|
|
19
15
|
tool: Tool;
|
|
20
16
|
};
|
|
21
|
-
export default function TextBlockView({ block, blockWidths, clearGraphSelection, clearMatrixSelection, colors, openTextBlockMenu, overlayRefs, selectedBlockId, setRenderMode, setSelectedBlockId,
|
|
17
|
+
export default function TextBlockView({ block, blockWidths, clearGraphSelection, clearMatrixSelection, colors, openTextBlockMenu, overlayRefs, selectedBlockId, setRenderMode, setSelectedBlockId, startEditing, tool, }: TextBlockViewProps): import("react/jsx-runtime").JSX.Element;
|
|
22
18
|
export {};
|
|
@@ -42,12 +42,8 @@ type UseTextBlockEditingActionsOptions = {
|
|
|
42
42
|
} | null>>;
|
|
43
43
|
setRenderMode: Dispatch<SetStateAction<RenderMode>>;
|
|
44
44
|
setSelectedBlockId: Dispatch<SetStateAction<string | null>>;
|
|
45
|
-
size: {
|
|
46
|
-
width: number;
|
|
47
|
-
height: number;
|
|
48
|
-
};
|
|
49
45
|
};
|
|
50
|
-
export declare function useTextBlockEditingActions({ blocks, clearGraphEditing, clearGraphSelection, clearMatrixEditing, clearMatrixSelection, createId, editingBlockId, editingHeight, editingWidth, getResolvedEditingValue, lastEditingSelectionRangeRef, pushHistoryState, renderMode, resetInlineMathState, selectedBlockId, setBlocks, setEditingBlockId, setEditingHeight, setEditingInlineMathAtoms, setEditingSelection, setEditingSelectionEnd, setEditingValue, setEditingWidth, setInlineMathEditorRect, setMathOverlayCaret, setRenderMode, setSelectedBlockId,
|
|
46
|
+
export declare function useTextBlockEditingActions({ blocks, clearGraphEditing, clearGraphSelection, clearMatrixEditing, clearMatrixSelection, createId, editingBlockId, editingHeight, editingWidth, getResolvedEditingValue, lastEditingSelectionRangeRef, pushHistoryState, renderMode, resetInlineMathState, selectedBlockId, setBlocks, setEditingBlockId, setEditingHeight, setEditingInlineMathAtoms, setEditingSelection, setEditingSelectionEnd, setEditingValue, setEditingWidth, setInlineMathEditorRect, setMathOverlayCaret, setRenderMode, setSelectedBlockId, }: UseTextBlockEditingActionsOptions): {
|
|
51
47
|
clearEditing: () => void;
|
|
52
48
|
commitEditing: () => void;
|
|
53
49
|
createTextBlock: (x: number, y: number) => void;
|
|
@@ -52,11 +52,7 @@ type UseTextBlockLayoutEffectsOptions = {
|
|
|
52
52
|
top: number;
|
|
53
53
|
height: number;
|
|
54
54
|
} | null>>;
|
|
55
|
-
size: {
|
|
56
|
-
width: number;
|
|
57
|
-
height: number;
|
|
58
|
-
};
|
|
59
55
|
textareaRef: MutableRefObject<HTMLTextAreaElement | null>;
|
|
60
56
|
};
|
|
61
|
-
export declare function useTextBlockLayoutEffects({ activeInlineMathDraft, activeInlineMathSession, blocks, containerRef, editableMirrorContentRef, editableMirrorRef, editingBlockId, editingDisplayValue, editingHeight, editingSelection, editingValue, editingWidth, inlineMathEditorRect, inlineMathBubbleRef, inlineMathFieldRef, latexPreview, overlayRefs, renderMode, resetInlineMathState, setBlockHeights, setBlockWidths, setEditingHeight, setEditingInlineMathAtoms, setEditingWidth, setInlineMathEditorRect, setMathOverlayCaret,
|
|
57
|
+
export declare function useTextBlockLayoutEffects({ activeInlineMathDraft, activeInlineMathSession, blocks, containerRef, editableMirrorContentRef, editableMirrorRef, editingBlockId, editingDisplayValue, editingHeight, editingSelection, editingValue, editingWidth, inlineMathEditorRect, inlineMathBubbleRef, inlineMathFieldRef, latexPreview, overlayRefs, renderMode, resetInlineMathState, setBlockHeights, setBlockWidths, setEditingHeight, setEditingInlineMathAtoms, setEditingWidth, setInlineMathEditorRect, setMathOverlayCaret, textareaRef, }: UseTextBlockLayoutEffectsOptions): void;
|
|
62
58
|
export {};
|
|
@@ -3,13 +3,10 @@ type UseTextBlockRenderHelpersOptions = {
|
|
|
3
3
|
blockHeights: Record<string, number>;
|
|
4
4
|
blockWidths: Record<string, number>;
|
|
5
5
|
blocks: TextBlock[];
|
|
6
|
-
size: {
|
|
7
|
-
width: number;
|
|
8
|
-
height: number;
|
|
9
|
-
};
|
|
10
6
|
};
|
|
11
|
-
export declare function useTextBlockRenderHelpers({ blockHeights, blockWidths, blocks,
|
|
7
|
+
export declare function useTextBlockRenderHelpers({ blockHeights, blockWidths, blocks, }: UseTextBlockRenderHelpersOptions): {
|
|
12
8
|
findTextBlockBlockingCreation: (x: number, y: number) => TextBlock | null;
|
|
9
|
+
findTextBlockNearPoint: (x: number, y: number) => TextBlock | null;
|
|
13
10
|
getTextMathAxisY: (block: TextBlock) => number | null;
|
|
14
11
|
};
|
|
15
12
|
export {};
|
|
@@ -7,13 +7,9 @@ type UseTextboxResizeOptions = {
|
|
|
7
7
|
pushHistoryState: () => void;
|
|
8
8
|
setEditingHeight: Dispatch<SetStateAction<number>>;
|
|
9
9
|
setEditingWidth: Dispatch<SetStateAction<number>>;
|
|
10
|
-
size: {
|
|
11
|
-
width: number;
|
|
12
|
-
height: number;
|
|
13
|
-
};
|
|
14
10
|
updateBlock: (id: string, updater: (block: TextBlock) => TextBlock) => void;
|
|
15
11
|
};
|
|
16
|
-
export declare function useTextboxResize({ editingHeight, editingWidth, getBlockById, pushHistoryState, setEditingHeight, setEditingWidth,
|
|
12
|
+
export declare function useTextboxResize({ editingHeight, editingWidth, getBlockById, pushHistoryState, setEditingHeight, setEditingWidth, updateBlock, }: UseTextboxResizeOptions): {
|
|
17
13
|
beginTextboxResize: (block: TextBlock, anchor: TextboxResizeAnchor, event: React.MouseEvent<HTMLDivElement>) => void;
|
|
18
14
|
};
|
|
19
15
|
export {};
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import type { ShortcutSettings } from "./types";
|
|
2
|
+
export type ShortcutCategory = "arrows" | "greek" | "styles" | "functions" | "calculus" | "algebra" | "sets" | "relations" | "geometry" | "operators" | "physics" | "probability" | "custom";
|
|
3
|
+
export type ShortcutEntry = {
|
|
4
|
+
id: string;
|
|
5
|
+
trigger: string;
|
|
6
|
+
latex: string;
|
|
7
|
+
category: ShortcutCategory;
|
|
8
|
+
source: "built-in" | "custom";
|
|
9
|
+
plotSafe: boolean;
|
|
10
|
+
};
|
|
11
|
+
export declare const shortcutCategoryLabels: Record<ShortcutCategory, string>;
|
|
12
|
+
export declare const shortcutCategorySymbols: Record<ShortcutCategory, string>;
|
|
13
|
+
export declare const shortcutCategoryOrder: ShortcutCategory[];
|
|
14
|
+
export declare const builtInShortcutEntries: ShortcutEntry[];
|
|
15
|
+
export declare function normalizeShortcutSettings(settings?: ShortcutSettings): ShortcutSettings;
|
|
16
|
+
export declare function getShortcutEntries(settings?: ShortcutSettings): ShortcutEntry[];
|
|
17
|
+
export declare function getEnabledShortcutEntries(settings?: ShortcutSettings, scope?: "math" | "plot"): ShortcutEntry[];
|
|
18
|
+
export declare function getInlineShortcuts(settings?: ShortcutSettings, scope?: "math" | "plot"): {
|
|
19
|
+
[k: string]: string;
|
|
20
|
+
};
|
|
@@ -1,7 +1,18 @@
|
|
|
1
1
|
import type { Stage } from "react-konva";
|
|
2
|
-
|
|
2
|
+
import type { MathJsonExpression } from "@cortex-js/compute-engine/math-json";
|
|
3
|
+
export type Tool = "select" | "pan" | "pen" | "eraser" | "text" | "graph" | "plot" | "matrix" | "table" | "geometry";
|
|
3
4
|
export type DrawingTool = "pen" | "eraser";
|
|
4
5
|
export type RenderMode = "plain" | "latex";
|
|
6
|
+
export type CustomShortcut = {
|
|
7
|
+
id: string;
|
|
8
|
+
trigger: string;
|
|
9
|
+
latex: string;
|
|
10
|
+
};
|
|
11
|
+
export type ShortcutSettings = {
|
|
12
|
+
disabledShortcutIds?: string[];
|
|
13
|
+
disabledShortcutCategories?: string[];
|
|
14
|
+
customShortcuts?: CustomShortcut[];
|
|
15
|
+
};
|
|
5
16
|
export type GeometryMode = "point" | "segment" | "angle" | "circle" | "label" | "midpoint" | "perpendicular" | "parallel" | "fixed" | "regular" | "rightAngle" | "equalSide";
|
|
6
17
|
export type GeometryObjectKind = "point" | "segment" | "polygon" | "angle" | "circle";
|
|
7
18
|
export type GeometryDirection = "left" | "right" | "up" | "down";
|
|
@@ -58,6 +69,37 @@ export type GraphEdge = {
|
|
|
58
69
|
targetId: string;
|
|
59
70
|
directed?: boolean;
|
|
60
71
|
};
|
|
72
|
+
export type PlotEquation = {
|
|
73
|
+
id: string;
|
|
74
|
+
latex: string;
|
|
75
|
+
mathJson: MathJsonExpression | null;
|
|
76
|
+
color: string;
|
|
77
|
+
};
|
|
78
|
+
export type PlotParameter = {
|
|
79
|
+
name: string;
|
|
80
|
+
value: number;
|
|
81
|
+
min: number;
|
|
82
|
+
max: number;
|
|
83
|
+
step?: number;
|
|
84
|
+
};
|
|
85
|
+
export type PlotFunction = {
|
|
86
|
+
id: string;
|
|
87
|
+
x: number;
|
|
88
|
+
y: number;
|
|
89
|
+
width: number;
|
|
90
|
+
height: number;
|
|
91
|
+
latex: string;
|
|
92
|
+
mathJson: MathJsonExpression | null;
|
|
93
|
+
color: string;
|
|
94
|
+
scale?: number;
|
|
95
|
+
viewCenterX?: number;
|
|
96
|
+
viewCenterY?: number;
|
|
97
|
+
parameters?: PlotParameter[];
|
|
98
|
+
dismissedParameterNames?: string[];
|
|
99
|
+
equations?: PlotEquation[];
|
|
100
|
+
equationPanelX?: number;
|
|
101
|
+
equationPanelY?: number;
|
|
102
|
+
};
|
|
61
103
|
export type GraphClipboard = {
|
|
62
104
|
nodes: Array<GraphNode & {
|
|
63
105
|
offsetX: number;
|
|
@@ -174,6 +216,7 @@ export type CanvasState = {
|
|
|
174
216
|
blocks: TextBlock[];
|
|
175
217
|
graphNodes: GraphNode[];
|
|
176
218
|
graphEdges: GraphEdge[];
|
|
219
|
+
plots: PlotFunction[];
|
|
177
220
|
matrices: MatrixObject[];
|
|
178
221
|
tables: TableObject[];
|
|
179
222
|
geoPoints: GeoPoint[];
|
|
@@ -185,6 +228,7 @@ export type CanvasState = {
|
|
|
185
228
|
geoRightAngleMarkers: GeoRightAngleMarker[];
|
|
186
229
|
coordinatePlaneMode: CoordinatePlaneMode;
|
|
187
230
|
renderMode: RenderMode;
|
|
231
|
+
shortcutSettings?: ShortcutSettings;
|
|
188
232
|
};
|
|
189
233
|
export type StageMouseEvent = Parameters<NonNullable<React.ComponentProps<typeof Stage>["onMouseDown"]>>[0];
|
|
190
234
|
export type StageTouchEvent = Parameters<NonNullable<React.ComponentProps<typeof Stage>["onTouchStart"]>>[0];
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export declare function shouldPreferDisplayStyle(expression: string, displayMode: boolean): boolean;
|
|
2
|
+
export declare function getRenderableLatex(expression: string): string;
|
|
2
3
|
export declare function getPreferredRenderedLatex(expression: string, displayMode: boolean): string;
|
|
3
4
|
export declare function canRenderLatex(value: string): boolean;
|
|
4
5
|
export declare function parseLatexSegments(content: string): ({
|