sp-image-editor/lib/components/Topbar/ImageDimensionsAndDisplayToggle.js

React component version of filerobot image editor (FIE).

import React from"react";import Compare from"@scaleflex/icons/compare";import{TOGGLE_ORIGINAL_IMAGE_DISPLAY}from"../../actions";import{useStore}from"../../hooks";import getProperDimensions from"../../utils/getProperDimensions";import Separator from"../common/Separator";import{StyledSmallButton,StyledDimensionsLabel,StyledImageOptionsButtons,StyledDimensionsButtons}from"./Topbar.styled";import CanvasZooming from"./CanvasZooming";var ImageDimensionsAndDisplayToggle=function(a){var b=a.showBackButton,c=a.isPhoneScreen,d=useStore(),e=d.dispatch,f=d.isResetted,g=!(void 0!==f)||f,h=d.originalImage,i=d.resize,j=void 0===i?{}:i,k=d.adjustments,l=k.crop,m=k.rotation,n=void 0===m?0:m,o=d.shownImageDimensions,p=d.config.disableZooming,q=d.t,r=function(){e({type:TOGGLE_ORIGINAL_IMAGE_DISPLAY,payload:{isShow:!1}}),document.removeEventListener("mouseup",r),document.removeEventListener("mouseleave",r),document.removeEventListener("touchcancel",r),document.removeEventListener("touchend",r)},s=function(){e({type:TOGGLE_ORIGINAL_IMAGE_DISPLAY,payload:{isShow:!0}}),document.addEventListener("mouseup",r),document.addEventListener("mouseleave",r),document.addEventListener("touchcancel",r),document.addEventListener("touchend",r)};if(!h)return null;var t=getProperDimensions(j,l,o,h,n);return React.createElement(StyledImageOptionsButtons,{isPhoneScreen:c},React.createElement(StyledDimensionsLabel,{title:q("imageDimensionsHoverTitle")},"".concat(t.width," x ").concat(t.height," px")),React.createElement(StyledDimensionsButtons,null,React.createElement(StyledSmallButton,{color:"basic",onMouseDown:g?void 0:s,onTouchStart:g?void 0:s,disabled:g,showBackButton:b,title:q("showImageTitle")},React.createElement(Compare,null)),!p&&React.createElement(React.Fragment,null,React.createElement(Separator,null),React.createElement(CanvasZooming,{showBackButton:b}))))};ImageDimensionsAndDisplayToggle.defaultProps={showBackButton:!1,isPhoneScreen:!1};export default ImageDimensionsAndDisplayToggle;