react-filerobot-video-editor/lib/components/common/AnnotationOptions/PositionFields.js

React component version of filerobot video editor (FVE).

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";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 React.createElement(Fragment,{key:a},React.createElement(StyledIconWrapper,{onClick:function(){return j(a)},active:f===a,secondaryIconColor:!0,addThinBorder:!0},a===POSITIONS.MIDDLE_CENTER?React.createElement(Point,null):React.createElement(ArrowRight,{style:{transform:"rotate(".concat(posCssRotateDegFromRightSide[a],"deg)")}})),0==(b+1)%3&&b+1!==k&&React.createElement("div",null))})};export default PositionFields;