@zergo0/react-filerobot-image-editor/lib/components/common/AnnotationOptions/PositionFields.js

React component version of filerobot image editor (FIE).

import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import React,{Fragment,useState}from"react";import{ArrowRight,Point}from"@scaleflex/icons";import{POSITIONS}from"../../../utils/constants";import mapPositionStringToPoint from"../../../utils/mapPositionStringToPoint";import{useStore}from"../../../hooks";import{StyledIconWrapper}from"./AnnotationOptions.styled";import{AVAILABLE_POSITIONS,posCssRotateDegFromRightSide}from"./AnnotationOptions.constants";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";var PositionFields=function(a){var b=a.annotation,c=a.updateAnnotation,d=useState(null),e=_slicedToArray(d,2),f=e[0],g=e[1],h=useStore(),i=h.designLayer,j=function(a){c(mapPositionStringToPoint(b,i,a)),g(a)},k=AVAILABLE_POSITIONS.length;return AVAILABLE_POSITIONS.map(function(a,b){return _jsxs(Fragment,{children:[_jsx(StyledIconWrapper,{onClick:function onClick(){return j(a)},active:f===a,secondaryIconColor:!0,addThinBorder:!0,children:a===POSITIONS.MIDDLE_CENTER?_jsx(Point,{}):_jsx(ArrowRight,{style:{transform:"rotate(".concat(posCssRotateDegFromRightSide[a],"deg)")}})}),0==(b+1)%3&&b+1!==k&&_jsx("div",{})]},a)})};export default PositionFields;