@zergo0/react-filerobot-image-editor/lib/components/tools/BlurAnnotation/BlurAnnotationOptions.js

React component version of filerobot image editor (FIE).

import _defineProperty from"@babel/runtime/helpers/defineProperty";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import AnnotationOptions from"../../common/AnnotationOptions";import Slider from"../../common/Slider";import{useAnnotation}from"../../../hooks";import{TOOLS_IDS}from"../../../utils/constants";import restrictNumber from"../../../utils/restrictNumber";import{StyledSliderContainer,StyledSliderInput,StyledSliderLabel,StyledSliderWrapper}from"../tools.styled";import{BLUR_ANNOTATION_POPPABLE_OPTIONS,blurAnnotationOptionsPopupComponents}from"./BlurAnnotation.constants";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";var MIN_VALUE=0,MAX_VALUE=100,DEFAULT_VALUE=50,BlurAnnotationOptions=function(a){var b,c,d=a.t,e=useAnnotation({name:TOOLS_IDS.BLUR_ANNOTATION,defaultAnnotationProps:{blurRadius:DEFAULT_VALUE}}),f=_slicedToArray(e,2),g=f[0],h=f[1],i=function(a){var b=restrictNumber(a,MIN_VALUE,MAX_VALUE);h({blurRadius:b,name:TOOLS_IDS.BLUR_ANNOTATION})};return _jsx(AnnotationOptions,{className:"FIE_blur-annotation-tool-options",moreOptionsPopupComponentsObj:blurAnnotationOptionsPopupComponents,morePoppableOptionsPrepended:BLUR_ANNOTATION_POPPABLE_OPTIONS,annotation:g,updateAnnotation:function updateAnnotation(a){return h(_objectSpread(_objectSpread({},a),{},{name:TOOLS_IDS.BLUR_ANNOTATION}))},t:d,overrideOptions:[],hideFillOption:!0,children:_jsxs(StyledSliderContainer,{className:"FIE_blur-annotation-radius-wrapper",children:[_jsx(StyledSliderLabel,{className:"FIE_blur-annotation-radius-label",children:d("blurRadius")}),_jsxs(StyledSliderWrapper,{children:[_jsx(Slider,{className:"FIE_blur-annotation-radius",min:MIN_VALUE,max:MAX_VALUE,width:"124px",value:null!==(b=null===g||void 0===g?void 0:g.blurRadius)&&void 0!==b?b:DEFAULT_VALUE,onChange:i}),_jsx(StyledSliderInput,{value:null!==(c=null===g||void 0===g?void 0:g.blurRadius)&&void 0!==c?c:DEFAULT_VALUE,onChange:function onChange(a){var b=a.target.value;return i(b)}})]})]})})};export default BlurAnnotationOptions;