@cs-open/react-fabric/dist/cjs/hooks/useReactFabric.cjs

React Fabric

"use strict";var d=require("zustand/vanilla/shallow"),r=require("react"),u=require("./useStore.cjs");const S=e=>({draggable:e.draggable,selection:e.selection,isDragging:e.isDragging,width:e.width,height:e.height,canvas:e.canvas,setDraggable:e.setDraggable,setIsDragging:e.setIsDragging,lastPosX:e.lastPosX,lastPosY:e.lastPosY,setSelection:e.setSelection,zoomable:e.zoomable,setZoomable:e.setZoomable,scale:e.scale,zoom:e.zoom,fitZoom:e.fitZoom,defaultCentered:e.defaultCentered,manualZoom:e.manualZoom,maxManualZoom:e.maxManualZoom,minManualZoom:e.minManualZoom,loading:e.loading});function f(){const e=u.useStoreApi(),i=u.useStore(S,d.shallow),l=r.useMemo(()=>({getCanvas:()=>e.getState().canvas,getNodes:()=>e.getState().nodes.map(o=>({...o})),getState:()=>e.getState,zoomIn:()=>{let{manualZoom:o,canvas:a,fitZoom:m}=e.getState();o+=.2;const n=e.getState().maxManualZoom,t=e.getState().minManualZoom;o>n&&(o=n),o<t&&(o=t);const s=o*m;if(a?.backgroundImage&&a){const g=a.getCenterPoint();a.zoomToPoint(g,s)}e.setState({manualZoom:o,zoom:s})},zoomOut:()=>{let{manualZoom:o,canvas:a,fitZoom:m}=e.getState();o-=.2;const n=e.getState().maxManualZoom,t=e.getState().minManualZoom;o>n&&(o=n),o<t&&(o=t);const s=o*m;if(a?.backgroundImage&&a){const g=a.getCenterPoint();a.zoomToPoint(g,s)}e.setState({manualZoom:o,zoom:s})},getZoom:()=>e.getState().zoom,resetViewport:(o=1)=>{const{canvas:a,fitZoom:m=1,defaultCentered:n}=e.getState(),t=o*m;if(a){if(n&&a.backgroundImage){const s=a.backgroundImage.width||0,g=a.backgroundImage.height||0,c=(a.width-s*t)/2,Z=(a.height-g*t)/2;a.setViewportTransform([t,0,0,t,c,Z])}else a.setViewportTransform([t,0,0,t,0,0]);a.requestRenderAll()}e.setState({manualZoom:o,zoom:t})}}),[e]);return r.useMemo(()=>({...l,...i}),[l,i])}exports.useReactFabric=f;
//# sourceMappingURL=useReactFabric.cjs.map