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

React component version of filerobot image editor (FIE).

import React from"react";import{usePhoneScreen,useStore}from"../../hooks";import{Menu}from"@scaleflex/icons";import CloseButton from"./CloseButton";import SaveButton from"./SaveButton";import ResetButton from"./ResetButton";import UndoButton from"./UndoButton";import RedoButton from"./RedoButton";import ImageDimensionsAndDisplayToggle from"./ImageDimensionsAndDisplayToggle";import{StyledTopbar,StyledFlexCenterAlignedContainer,StyledMainButtonsWrapper,StyledControlButtonsWrapper,StyledHistoryButtons,StyledMenuIconButton}from"./Topbar.styled";import BackButton from"./BackButton";var Topbar=function(a){var b=a.toggleMainMenu,c=useStore(),d=c.config.showBackButton,e=usePhoneScreen(320);return React.createElement(StyledTopbar,{className:"FIE_topbar",isPhoneScreen:e},React.createElement(StyledMainButtonsWrapper,{className:"FIE_topbar-buttons-wrapper"},React.createElement(StyledMenuIconButton,{className:"FIE_tabs_toggle_btn",size:e?"sm":"lg",color:"basic",onClick:function(){return b(!0)}},function(a){return React.createElement(Menu,a)}),d?React.createElement(BackButton,null):React.createElement(SaveButton,null)),React.createElement(StyledFlexCenterAlignedContainer,{className:"FIE_topbar-center-options",showBackButton:d},React.createElement(ImageDimensionsAndDisplayToggle,{showBackButton:d,isPhoneScreen:e})),React.createElement(StyledControlButtonsWrapper,null,React.createElement(StyledHistoryButtons,{className:"FIE_topbar-history-buttons"},React.createElement(ResetButton,{margin:"0",showBackButton:d}),React.createElement(UndoButton,{margin:"0",showBackButton:d}),React.createElement(RedoButton,{margin:"0",showBackButton:d})),d?React.createElement(SaveButton,null):React.createElement(CloseButton,null)))};Topbar.defaultProps={toggleMainMenu:function(){}};export default Topbar;