text-editor-studio-ts/dist/image-resizer-B_I9lFMZ.cjs

A powerful mobile-responsive rich text editor built with Lexical and React

"use strict";const e=require("react/jsx-runtime"),t=require("react"),r=require("@lexical/utils"),i=require("./index-BLOj1UA2.cjs");function n(e,t,r){return Math.min(Math.max(e,t),r)}const s=1,o=8,a=2,c=4;exports.ImageResizer=function({onResizeStart:u,onResizeEnd:l,buttonRef:d,imageRef:g,maxWidth:m,editor:h,showCaption:p,setShowCaption:b,captionsEnabled:y}){const w=t.useRef(null),z=t.useRef({priority:"",value:"default"}),f=t.useRef({currentHeight:0,currentWidth:0,direction:0,isResizing:!1,ratio:0,startHeight:0,startWidth:0,startX:0,startY:0}),x=h.getRootElement(),v=m||(null!==x?x.getBoundingClientRect().width-20:100),P=null!==x?x.getBoundingClientRect().height-20:100,R=(e,t)=>{if(!h.isEditable())return;const i=g.current,n=w.current;if(null!==i&&null!==n){e.preventDefault();const{width:l,height:d}=i.getBoundingClientRect(),g=r.calculateZoomLevel(i),m=f.current;m.startWidth=l,m.startHeight=d,m.ratio=l/d,m.currentWidth=l,m.currentHeight=d,m.startX=e.clientX/g,m.startY=e.clientY/g,m.isResizing=!0,m.direction=t,(e=>{const t=e===s||e===c?"ew":e===o||e===a?"ns":e&o&&e&c||e&a&&e&s?"nwse":"nesw";null!==x&&x.style.setProperty("cursor",`${t}-resize`,"important"),null!==document.body&&(document.body.style.setProperty("cursor",`${t}-resize`,"important"),z.current.value=document.body.style.getPropertyValue("-webkit-user-select"),z.current.priority=document.body.style.getPropertyPriority("-webkit-user-select"),document.body.style.setProperty("-webkit-user-select","none","important"))})(t),u(),n.classList.add("touch-action-none"),i.style.height=`${d}px`,i.style.width=`${l}px`,document.addEventListener("pointermove",k),document.addEventListener("pointerup",j)}},k=e=>{const t=g.current,i=f.current,u=i.direction&(s|c),l=i.direction&(a|o);if(null!==t&&i.isResizing){const o=r.calculateZoomLevel(t);if(u&&l){let r=Math.floor(i.startX-e.clientX/o);r=i.direction&s?-r:r;const a=n(i.startWidth+r,100,v),c=a/i.ratio;t.style.width=`${a}px`,t.style.height=`${c}px`,i.currentHeight=c,i.currentWidth=a}else if(l){let r=Math.floor(i.startY-e.clientY/o);r=i.direction&a?-r:r;const s=n(i.startHeight+r,100,P);t.style.height=`${s}px`,i.currentHeight=s}else{let r=Math.floor(i.startX-e.clientX/o);r=i.direction&s?-r:r;const a=n(i.startWidth+r,100,v);t.style.width=`${a}px`,i.currentWidth=a}}},j=()=>{const e=g.current,t=f.current,r=w.current;if(null!==e&&null!==r&&t.isResizing){const e=t.currentWidth,i=t.currentHeight;t.startWidth=0,t.startHeight=0,t.ratio=0,t.startX=0,t.startY=0,t.currentWidth=0,t.currentHeight=0,t.isResizing=!1,r.classList.remove("touch-action-none"),null!==x&&x.style.setProperty("cursor","text"),null!==document.body&&(document.body.style.setProperty("cursor","default"),document.body.style.setProperty("-webkit-user-select",z.current.value,z.current.priority)),l(e,i),document.removeEventListener("pointermove",k),document.removeEventListener("pointerup",j)}};return e.jsxs("div",{ref:w,children:[!p&&y&&e.jsx(i.Button,{className:"image-caption-button absolute bottom-1 left-1/2 -translate-x-1/2",ref:d,variant:"BorderStyle",onClick:()=>{b(!p)},children:"Add Caption"}),e.jsx("div",{className:"image-resizer image-resizer-n absolute -top-2.5 left-1/2 h-3 w-3 -translate-x-1/2 cursor-ns-resize bg-background-presentation-action-primary",onPointerDown:e=>{R(e,o)}}),e.jsx("div",{className:"image-resizer image-resizer-ne absolute -right-2.5 -top-2.5 h-3 w-3 cursor-nesw-resize bg-background-presentation-action-primary",onPointerDown:e=>{R(e,o|s)}}),e.jsx("div",{className:"image-resizer image-resizer-e absolute -right-2.5 top-1/2 h-3 w-3 -translate-y-1/2 cursor-ew-resize bg-background-presentation-action-primary",onPointerDown:e=>{R(e,s)}}),e.jsx("div",{className:"image-resizer image-resizer-se absolute -bottom-2.5 -right-2.5 h-3 w-3 cursor-nwse-resize bg-background-presentation-action-primary",onPointerDown:e=>{R(e,a|s)}}),e.jsx("div",{className:"image-resizer image-resizer-s absolute -bottom-2.5 left-1/2 h-3 w-3 -translate-x-1/2 cursor-ns-resize bg-background-presentation-action-primary",onPointerDown:e=>{R(e,a)}}),e.jsx("div",{className:"image-resizer image-resizer-sw absolute -bottom-2.5 -left-2.5 h-3 w-3 cursor-nesw-resize bg-background-presentation-action-primary",onPointerDown:e=>{R(e,a|c)}}),e.jsx("div",{className:"image-resizer image-resizer-w absolute -left-2.5 top-1/2 h-3 w-3 -translate-y-1/2 cursor-ew-resize bg-background-presentation-action-primary",onPointerDown:e=>{R(e,c)}}),e.jsx("div",{className:"image-resizer image-resizer-nw absolute -left-2.5 -top-2.5 h-3 w-3 cursor-nwse-resize bg-background-presentation-action-primary",onPointerDown:e=>{R(e,o|c)}})]})};
//# sourceMappingURL=image-resizer-B_I9lFMZ.cjs.map