@cs-open/react-fabric
Version:
3 lines (2 loc) • 1.22 kB
JavaScript
;Object.defineProperty(exports,"__esModule",{value:!0});var g=require("zustand/shallow"),s=require("react"),d=require("./useStore.cjs");const b=r=>({canvas:r.canvas,draggable:r.draggable}),h=r=>{const e=r.get("selectable");return r.set("selectable",!1),()=>{r.set("selectable",e)}},p=r=>{if(!r)return()=>{};const e=r.getObjects().map(n=>h(n));return()=>{e.forEach(n=>n())}},w=()=>{const r=d.useStoreApi(),{canvas:e,draggable:n}=d.useStore(b,g.shallow),o=s.useRef(0),l=s.useRef(0),a=s.useRef(!1);return s.useEffect(()=>{if(!n)return;const v=p(e),i=({e:t})=>{const c=t.changedTouches?.[0];a.current=!0,o.current=t.clientX??c?.clientX,l.current=t.clientY??c?.clientY},f=({e:t})=>{if(a.current&&e){var c=e.viewportTransform;const u=t.changedTouches?.[0];c[4]+=(t.clientX??u?.clientX)-o.current,c[5]+=(t.clientY??u?.clientY)-l.current,e.requestRenderAll(),o.current=t.clientX??u?.clientX,l.current=t.clientY??u?.clientY}},m=t=>{e&&(e.setViewportTransform(e.viewportTransform),a.current=!1)};return e?.on("mouse:down",i),e?.on("mouse:move",f),e?.on("mouse:up",m),()=>{v(),e?.off("mouse:down",i),e?.off("mouse:move",f),e?.off("mouse:up",m)}},[e,n,r]),null};exports.default=w;
//# sourceMappingURL=useDraggable.cjs.map