@shopgate/engage/locations/components/StoreList/StoreListSearchRadius.js

Shopgate's ENGAGE library.

function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance");}function _iterableToArrayLimit(arr,i){var _arr=[];var _n=true;var _d=false;var _e=undefined;try{for(var _i=arr[Symbol.iterator](),_s;!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}import React,{useState,useCallback,useMemo}from'react';import PropTypes from'prop-types';import{i18n}from'@shopgate/engage/core';import{option}from"./StoreListSearchRadius.style";import{selectContainer,select}from"./StoreListSearch.style";import connector from"./StoreListSearchRadius.connector";/**
 * @param {Object} props The component props
 * @returns {JSX}
 */var StoreListSearchRadius=function StoreListSearchRadius(_ref){var radius=_ref.radius,unitSystem=_ref.unitSystem,setRadius=_ref.setRadius;var _useState=useState(radius),_useState2=_slicedToArray(_useState,2),searchRadius=_useState2[0],setSearchRadius=_useState2[1];var handleRadiusChange=useCallback(function(event){var value=parseInt(event.target.value,10)||null;setSearchRadius(value);setRadius(value);},[setRadius]);var options=useMemo(function(){var values;var placeholder;if(unitSystem==='metric'){values=[5,10,25,50,100];placeholder='locations.radius_km';}else{values=[10,25,50,100];placeholder='locations.radius_mi';}var result=values.map(function(value){return{value:value,label:i18n.text(placeholder,{radius:value})};});return[{value:'',label:i18n.text('locations.radius')}].concat(result);},[unitSystem]);return React.createElement("div",{className:selectContainer},React.createElement("select",{name:"store_list_search_radius",value:searchRadius||'',className:select,onChange:handleRadiusChange},options.map(function(_ref2){var value=_ref2.value,label=_ref2.label;return React.createElement("option",{className:option,value:value,key:label},label);})));};StoreListSearchRadius.defaultProps={radius:null,unitSystem:null};export default connector(StoreListSearchRadius);