@tsdraw/react 0.9.2 → 0.9.4

package/dist/index.cjs

@@ -911,6 +911,11 @@ function getHandlePagePoint(bounds, handle) {
       return { x: bounds.maxX, y: bounds.maxY };
   }
 }
+function resolveAutoShapeOption(input) {
+  if (input === false) return { enabled: false };
+  if (input === true || input == null) return { enabled: true };
+  return { enabled: input.enabled ?? true, ...input };
+}
 var ZOOM_WHEEL_CAP = 10;
 var VIEW_ONLY_TOOLS = /* @__PURE__ */ new Set(["select", "hand"]);
 function useTsdrawCanvasController(options = {}) {
@@ -922,6 +927,7 @@ function useTsdrawCanvasController(options = {}) {
   const touchOptionsRef = react.useRef(options.touchOptions);
   const keyboardShortcutsRef = react.useRef(options.keyboardShortcuts);
   const penOptionsRef = react.useRef(options.penOptions);
+  const autoShapeRef = react.useRef(options.autoShape);
   const backgroundRef = react.useRef(options.background);
   const readOnlyRef = react.useRef(options.readOnly ?? false);
   const containerRef = react.useRef(null);
@@ -1004,6 +1010,11 @@ function useTsdrawCanvasController(options = {}) {
   react.useEffect(() => {
     penOptionsRef.current = options.penOptions;
   }, [options.penOptions]);
+  react.useEffect(() => {
+    autoShapeRef.current = options.autoShape;
+    const editor = editorRef.current;
+    if (editor) editor.setAutoShape(resolveAutoShapeOption(options.autoShape));
+  }, [options.autoShape]);
   react.useEffect(() => {
     backgroundRef.current = options.background;
   }, [options.background]);
@@ -1142,7 +1153,8 @@ function useTsdrawCanvasController(options = {}) {
     const editor = new core.Editor({
       toolDefinitions: options.toolDefinitions,
       initialToolId: initialTool,
-      zoomRange: cameraOpts?.zoomRange
+      zoomRange: cameraOpts?.zoomRange,
+      autoShape: resolveAutoShapeOption(autoShapeRef.current)
     });
     editor.renderer.setTheme(options.theme ?? "light");
     if (!editor.tools.hasTool(initialTool)) {
@@ -1775,6 +1787,10 @@ function useTsdrawCanvasController(options = {}) {
       if (ignorePersistenceChanges) return;
       schedulePersist();
     });
+    const cleanupRenderRequest = editor.onRequestRender(() => {
+      render();
+      refreshSelectionBounds(editor);
+    });
     resize();
     const ro = new ResizeObserver(resize);
     ro.observe(container);
@@ -1843,6 +1859,7 @@ function useTsdrawCanvasController(options = {}) {
       schedulePersistRef.current = null;
       cleanupEditorListener();
       cleanupHistoryListener();
+      cleanupRenderRequest();
       disposeMount?.();
       ro.disconnect();
       canvas.removeEventListener("pointerdown", handlePointerDown);
@@ -2112,6 +2129,7 @@ function Tsdraw(props) {
     touchOptions: props.touchOptions,
     keyboardShortcuts: props.keyboardShortcuts,
     penOptions: props.penOptions,
+    autoShape: props.autoShape,
     background: props.background,
     readOnly: props.readOnly,
     autoFocus: props.autoFocus,