material-form-builder
Version:
A dynamic React form builder using Material UI
1 lines • 70.1 kB
JavaScript
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react/jsx-runtime"),e=require("react"),s=require("@mui/icons-material/ArrowDropDown"),i=require("@mui/icons-material/Clear"),h=require("@mui/material"),r=require("@mui/x-date-pickers/DatePicker/index.js"),a=require("@mui/x-date-pickers/DateTimePicker/index.js"),n=require("@mui/icons-material/Add"),o=require("@mui/icons-material/CopyAll"),l=require("@mui/icons-material/Delete"),u=require("@mui/icons-material/Remove"),p=require("@mui/icons-material/Visibility"),d=require("@mui/icons-material/VisibilityOff"),c=require("@mui/x-date-pickers/TimePicker/index.js");const v=t=>{for(var e="",s="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",i=0;i<t;i++)e+=s.charAt(Math.floor(62*Math.random()));return e},m=(t,e,s="")=>{let i=0,h=t.toString();return e.replace(/\./g,t=>h[i++]||s)},f=t=>null===t,z=t=>null!==t&&void 0!==t,g=t=>{let e=[],s=JSON.stringify(t,function(t,s){if("object"==typeof s&&null!==s){if(-1!==e.indexOf(s))return;e.push(s)}return s});return e=null,s};class V extends e.Component{constructor(){super(...arguments),this.state={value:this.getValuesFrom(this.props.defaultValue||null),error:!1},this.loadingComponent=()=>t.jsx(h.Grow,{in:!0,timeout:550,children:t.jsx(h.Box,{sx:{paddingRight:"8px",paddingTop:"4px"},children:t.jsx(h.CircularProgress,{size:18})})}),this.onChange=(t,e,s,i)=>{Array.isArray(e)?this.setValue(e.map(t=>"string"==typeof t?t:t.value)):this.setValue("string"==typeof e?e:e.value),this.props.onChange?.(t,e,s,i)},this.onClick=t=>{clearTimeout(this.validationTimeout),this.setState({...this.state,error:!1}),this.props.onClick?.(t)},this.click=()=>{this.inputRef?.click()},this.focus=()=>{this.inputRef?.focus()},this.blur=()=>{this.inputRef?.blur()},this.onInputBlur=t=>{!this.props.multiple&&this.props.freeSolo&&this.setValue(t.target.value),this.props.InputProps?.onBlur?.(t)},this.renderOption=(e,s)=>{const{key:i,...h}=e;return t.jsx("li",{...h,children:"object"==typeof s?s.label:s.toString()},i)},this.getOptionLabel=t=>"object"==typeof t?t.label:t.toString(),this.isOptionEqualToValue=(t,e)=>!!e&&("string"==typeof t?t===("string"==typeof e?e:e.value.toString()):t.value.toString()===("string"==typeof e?e:e.value.toString())),this.renderInput=t=>(t.inputRef=t=>this.inputRef=t,t.error=this.state.error,t.variant=this.props.variant||"standard",t.label=this.props.label,t.required=this.props.required,t.onClick=this.onClick,this.props.renderInput?.(t))}shouldComponentUpdate(t,e){switch(!0){case this.state.value!==e.value:case this.getValueForCheck(this.state.value||void 0)!==this.getValueForCheck(e.value||void 0):case this.state.error!==e.error:case g(t?.updateListener??{})!==g(this.props?.updateListener??{}):return!0;default:return!1}}getValuesFrom(t){if(!t)return null;if(this.props.multiple&&!Array.isArray(t))return null;if(!this.props.multiple&&Array.isArray(t))return null;if(this.props.freeSolo&&!this.props.multiple){return this.props.options.find(e=>("string"==typeof e?e:e.value)===t||("string"==typeof e?e:e.label)===t)||{label:t?.toString()||"",value:t?.toString()||""}}if(this.props.freeSolo&&this.props.multiple&&"object"==typeof t&&Array.isArray(t)){return t.map(t=>this.props.options.find(e=>("string"==typeof e?e:e.value)===t)||{label:t?.toString().trim()||"",value:t?.toString().trim()||""})}return"object"==typeof t&&Array.isArray(t)?this.props.options.filter(e=>t.indexOf("string"==typeof e?e:e.value)>-1):t?this.props.options.find(e=>("string"==typeof e?e:e.value)===t):void 0}componentDidUpdate(t){this.props.options?.map(t=>this.optionGetter(t,"value")).join("@")!==t.options?.map(t=>this.optionGetter(t,"value")).join("@")&&(this.props.disableClearOnChangeOptions||this.clear())}setValue(t,e){const s=this.getValuesFrom(t);return new Promise(i=>{this.setState({...this.state,value:s},()=>{e||this.props._call_parent_for_update?.(),this.props.onChangeValue?.(t),i(t)})})}getValue(){return(Array.isArray(this.state.value)?this.state.value.map(t=>"string"==typeof t?t:t.value):"string"==typeof this.state.value?this.state.value:this.state.value?.value)||(this.props.multiple?[]:null)}clear(t=!1){return this.setValue((t?null:this.props.defaultValue)||null)}validation(){return!(!this.getValueForCheck(this.state.value)&&this.props.required)||(clearTimeout(this.validationTimeout),this.setState({...this.state,error:!0}),this.validationTimeout=setTimeout(()=>{this.setState({...this.state,error:!1})},3e3),!1)}optionGetter(t,e="value"){return"string"==typeof t||"number"==typeof t||f(t)?t??"":t?.[e]??""}getValueForCheck(t){return!f(t)&&Array.isArray(t)?t.join("@"):t}render(){const{updateListener:e,defaultValue:r,onChangeValue:a,InputProps:n,renderInput:o,label:l,variant:u,required:p,visible:d,_call_parent_for_update:c,...v}=this.props;let m="207px";"outlined"===this.props.variant&&(m="235px"),"filled"===this.props.variant&&(m="231px");const f=this.props.fullWidth?"100%":m;return t.jsx(h.Autocomplete,{...v,sx:{width:f,display:"inline-flex",...this.props.sx},renderOption:this.props.renderOption??this.renderOption,getOptionLabel:this.props.getOptionLabel??this.getOptionLabel,onChange:this.onChange,disableClearable:this.props.disableClearable??!0,size:this.props.size||!u||"standard"===u?"small":"medium",value:this.state.value??(this.props.multiple?[]:this.props.freeSolo?"":null),disabled:this.props.disabled||this.props.loading,clearOnBlur:this.props.multiple||this.props.multiple&&this.props.freeSolo||!this.props.multiple&&!this.props.freeSolo,popupIcon:this.props.loading?this.loadingComponent():this.props.popupIcon||t.jsx(s,{}),isOptionEqualToValue:this.props.isOptionEqualToValue??this.isOptionEqualToValue,renderInput:o?this.renderInput:e=>t.jsx(h.TextField,{...e,...n,label:l,placeholder:n?.placeholder,variant:u||"standard",required:p,onClick:this.onClick,error:this.state.error,inputRef:t=>this.inputRef=t,slotProps:{input:{...n?.slotProps?.input,...e.InputProps,onBlur:this.onInputBlur,endAdornment:t.jsxs(h.InputAdornment,{position:"end",children:[e.InputProps.endAdornment,!this.props.disableClearable&&this.getValueForCheck(this.state.value)?t.jsx(h.IconButton,{size:"small",onClick:t=>{t.stopPropagation(),this.clear(!0)},children:t.jsx(i,{fontSize:"small"})}):null]})}}})})}}class C extends e.Component{constructor(){super(...arguments),this.state={value:this.props.defaultChecked||!1,error:!1},this.onChange=(t,e)=>{this.setValue(e||!1),this.props.onChange?.(t,e)},this.onClick=t=>{clearTimeout(this.validationTimeout),this.setState({...this.state,error:!1}),this.props.onClick?.(t)},this.click=()=>{this.inputRef?.click()},this.focus=()=>{this.inputRef?.focus()},this.blur=()=>{this.inputRef?.blur()}}shouldComponentUpdate(t,e){switch(!0){case this.state.value!==e.value:case this.state.error!==e.error:case g(t?.updateListener??{})!==g(this.props?.updateListener??{}):return!0;default:return!1}}setValue(t,e){return t===this.state.value?Promise.resolve(t):new Promise(s=>{this.setState({...this.state,value:t},()=>{e||this.props._call_parent_for_update?.(),this.props.onChangeValue?.(t),s(t)})})}getValue(){return this.state.value||!1}clear(){return this.setValue(this.props.checked||this.props.defaultChecked||!1)}validation(){return!(!this.state.value&&this.props.required)||(clearTimeout(this.validationTimeout),this.setState({...this.state,error:!0}),this.validationTimeout=setTimeout(()=>{this.setState({...this.state,error:!1})},3e3),!1)}render(){const{updateListener:e,defaultChecked:s,defaultValue:i,onChangeValue:r,visible:a,_call_parent_for_update:n,...o}=this.props,l=this.props.label+(this.props.required?" *":"");return t.jsx(h.FormControlLabel,{onClick:this.onClick,control:t.jsx(h.Checkbox,{...o,sx:{color:this.state.error?"#d32f2f":"#616161"},checked:this.state.value,onChange:this.onChange,inputRef:t=>this.inputRef=t}),style:{userSelect:"none"},label:l})}}class x extends e.Component{constructor(){super(...arguments),this.state={value:null,error:!1},this.click=()=>{this.elementRef?.click()},this.focus=()=>{this.elementRef?.focus()},this.blur=()=>{this.elementRef?.blur()}}setValue(t){return"function"==typeof this.elementRef?.setValue?this.elementRef?.setValue(t):Promise.resolve(null)}getValue(){return"function"==typeof this.elementRef?.getValue?this.elementRef?.getValue():null}clear(){return"function"==typeof this.elementRef?.clear?this.elementRef?.clear():Promise.resolve(null)}validation(){return"function"!=typeof this.elementRef?.validation||this.elementRef?.validation()}render(){const{element:s,...i}=this.props,h=e.createElement(s,{ref:t=>this.elementRef=t,...i});return t.jsxs(e.Fragment,{children:[" ",h," "]})}}class M extends e.Component{constructor(){super(...arguments),this.state={value:this.props.defaultValue||null,error:!1},this.onChange=(t,e)=>{this.setValue(t),this.props.onChange?.(t,e)},this.onClick=t=>{clearTimeout(this.validationTimeout),this.setState({...this.state,error:!1}),this.props.InputProps?.onClick?.(t)},this.click=()=>{this.inputRef?.click()},this.focus=()=>{this.inputRef?.focus()},this.blur=()=>{this.inputRef?.blur()}}shouldComponentUpdate(t,e){switch(!0){case this.state.value!==e.value:case this.state.error!==e.error:case g(t?.updateListener??{})!==g(this.props?.updateListener??{}):return!0;default:return!1}}setValue(t,e){return t===this.state.value?Promise.resolve(t):new Promise(s=>{this.setState({...this.state,value:t},()=>{e||this.props._call_parent_for_update?.(),this.props.onChangeValue?.(t),s(t)})})}getValue(){return this.state.value||null}clear(){return this.setValue(this.props.defaultValue||null)}validation(){return!(!this.state.value&&this.props.required)||(clearTimeout(this.validationTimeout),this.setState({...this.state,error:!0}),this.validationTimeout=setTimeout(()=>{this.setState({...this.state,error:!1})},3e3),!1)}render(){const{updateListener:e,slotProps:s,fullWidth:i,onChangeValue:h,defaultValue:a,variant:n,required:o,visible:l,_call_parent_for_update:u,...p}=this.props,{textField:d,...c}=s??{};return t.jsx(r.DatePicker,{...p,value:this.state.value,onChange:this.onChange,inputRef:t=>this.inputRef=t,slotProps:{...c,textField:{fullWidth:i??!1,variant:n??"standard",required:o??!1,...d,error:this.state.error,onClick:this.onClick}}})}}class y extends e.Component{constructor(){super(...arguments),this.state={value:this.props.defaultValue||null,error:!1},this.onChange=(t,e)=>{this.setValue(t||null),this.props.onChange?.(t,e)},this.onClick=t=>{clearTimeout(this.validationTimeout),this.setState({...this.state,error:!1}),this.props.InputProps?.onClick?.(t)},this.click=()=>{this.inputRef?.click()},this.focus=()=>{this.inputRef?.focus()},this.blur=()=>{this.inputRef?.blur()}}shouldComponentUpdate(t,e){switch(!0){case this.state.value!==e.value:case this.state.error!==e.error:case g(t?.updateListener??{})!==g(this.props?.updateListener??{}):return!0;default:return!1}}setValue(t,e){return t===this.state.value?Promise.resolve(t):new Promise(s=>{this.setState({...this.state,value:t},()=>{e||this.props._call_parent_for_update?.(),this.props.onChangeValue?.(t),s(t)})})}getValue(){return this.state.value||null}clear(){return this.setValue(this.props.defaultValue||null)}validation(){return!(!this.state.value&&this.props.required)||(clearTimeout(this.validationTimeout),this.setState({...this.state,error:!0}),this.validationTimeout=setTimeout(()=>{this.setState({...this.state,error:!1})},3e3),!1)}render(){const{slotProps:e,fullWidth:s,updateListener:i,onChangeValue:h,defaultValue:r,variant:n,required:o,visible:l,_call_parent_for_update:u,...p}=this.props,{textField:d,...c}=e??{};return t.jsx(a.DateTimePicker,{...p,ampm:this.props.ampm||!1,value:this.state.value,onChange:this.onChange,inputRef:t=>this.inputRef=t,slotProps:{...c,textField:{fullWidth:s??!1,variant:n??"standard",required:o??!1,...d,error:this.state.error,onClick:this.onClick}}})}}class _ extends e.Component{constructor(t){super(t),this.state={value:this.props.defaultValue||null,error:!1,inputKey:v(20)},this.inputIdentity="",this.textHelperIdentity="",this.onChange=t=>{let e=t.target.files;this.setValue(e||null),this.props.onChange?.(t)},this.onClick=t=>{clearTimeout(this.validationTimeout),this.setState({...this.state,error:!1}),this.props.onClick?.(t)},this.click=()=>{this.inputRef?.click()},this.focus=()=>{this.inputRef?.focus()},this.blur=()=>{this.inputRef?.blur()},this.inputIdentity=v(20),this.textHelperIdentity=v(20)}shouldComponentUpdate(t,e){switch(!0){case this.state.value!==e.value:case this.state.error!==e.error:case g(t?.updateListener??{})!==g(this.props?.updateListener??{}):return!0;default:return!1}}setValue(t,e){return t===this.state.value?Promise.resolve(t):new Promise(s=>{const i=t?this.state.inputKey:v(20);this.setState({...this.state,value:t,inputKey:i},()=>{this.inputRef&&t&&(this.inputRef.files=t),e||this.props._call_parent_for_update?.(),this.props.onChangeValue?.(t),s(t)})})}getValue(){return this.state.value||null}clear(){return this.setValue(this.props.defaultValue||null)}validation(){return!(!this.state.value&&this.props.required)||(clearTimeout(this.validationTimeout),this.setState({...this.state,error:!0}),this.validationTimeout=setTimeout(()=>{this.setState({...this.state,error:!1})},3e3),!1)}render(){const{updateListener:s,defaultValue:i,onChangeValue:r,label:a,helperText:n,FormControlProps:o,InputLabelProps:l,FormHelperTextProps:u,multiple:p,visible:d,_call_parent_for_update:c,...v}=this.props;return t.jsxs(h.FormControl,{...o,variant:o?.variant??"standard",children:[this.props.label?t.jsx(h.InputLabel,{...l,shrink:l?.shrink??!0,htmlFor:this.inputIdentity,children:this.props.label}):null,e.createElement(h.Input,{...v,id:this.inputIdentity,"aria-describedby":this.textHelperIdentity,type:"file",key:this.state.inputKey,slotProps:{input:{multiple:p??!1,...v.slotProps?.input}},error:this.state.error,onChange:this.onChange,onClick:this.onClick,inputRef:t=>this.inputRef=t}),n?t.jsx(h.FormHelperText,{...u,id:this.textHelperIdentity,children:n}):null]})}}class b extends e.Component{constructor(t){super(t),this.state={error:!1,value:null},this.onChangeValue=t=>{this.props._call_parent_for_update?.(),this.props.onChangeValue?.(t)},this.click=()=>{},this.focus=()=>{},this.blur=()=>{},this.builderRef=e.createRef()}setValue(t){return this.builderRef.current&&t?this.builderRef.current.setValues(t):Promise.reject(t)}getValue(t){return this.builderRef.current?.getValues(t).data}clear(){return this.builderRef.current?.clear()||Promise.resolve()}validation(){const t=this.builderRef.current?.getValues(!0)?.validation;return"boolean"!=typeof t?.status||t?.status}render(){return t.jsx(W,{inputs:this.props.inputs,ref:this.builderRef,onChange:this.onChangeValue})}}class w extends e.Component{constructor(){super(...arguments),this.state={error:!1,items:[]},this.formBuilderRef={},this.sleep=t=>new Promise(e=>setTimeout(e,t)),this.setItemValue=async(t,e)=>{const s=this.formBuilderRef[t];return s?s.setValues(e):(await this.sleep(5),await this.setItemValue(t,e))},this.exportFormBuilderData=()=>{const t=[];for(const e in this.formBuilderRef){const s=this.formBuilderRef[e];s&&t.push(s.getValues())}return t},this.getRandomKey=()=>{const t=v(8);return this.state.items.indexOf(t)>-1?this.getRandomKey():t},this.addItem=()=>{if("number"==typeof this.props.maxItems&&this.state.items.length>=this.props.maxItems)return Promise.resolve("");const t=this.getRandomKey();return new Promise(e=>{this.setState(e=>{let s={...e};return s.items=[...s.items,t],s},()=>{e(t)})})},this.copyItem=t=>async()=>{const e=await this.addItem(),s=this.formBuilderRef[t];if(s){const t=s.getValues(!1).data;this.formBuilderRef[e]?.setValues(t)}},this.removeItem=t=>async()=>{if("number"==typeof this.props.minItems&&this.state.items.length<=this.props.minItems)return Promise.resolve();const e=this.formBuilderRef[t];e&&(await e.clear(),this.setState(e=>{let s={...e};return s.items=s.items.filter(e=>e!==t),s},()=>{delete this.formBuilderRef[t]}))},this.removeAll=()=>{const t=[];return[...Array(this.props.minItems).keys()].forEach(()=>{const e=this.getRandomKey();t.push(e)}),this.setValue(t)},this.click=()=>{},this.focus=()=>{},this.blur=()=>{},this.renderItem=s=>this.props.disableDefaultItemWrapper?t.jsxs(e.Fragment,{children:[!1!==this.props.removeIcon?t.jsx(h.IconButton,{onClick:this.removeItem(s),children:this.props.removeIcon?this.props.removeIcon:t.jsx(u,{})}):null,t.jsx(W,{inputs:this.props.inputs,ref:t=>this.formBuilderRef={...this.formBuilderRef,[s]:t}}),!1!==this.props.copyIcon?t.jsx(h.IconButton,{onClick:this.copyItem(s),children:this.props.copyIcon?this.props.copyIcon:t.jsx(o,{})}):null]},s):t.jsxs(h.Box,{display:"flex",alignItems:"center",children:[!1!==this.props.removeIcon?t.jsx(h.IconButton,{onClick:this.removeItem(s),children:this.props.removeIcon?this.props.removeIcon:t.jsx(u,{})}):null,t.jsx(W,{inputs:this.props.inputs,ref:t=>this.formBuilderRef={...this.formBuilderRef,[s]:t}}),!1!==this.props.copyIcon?t.jsx(h.IconButton,{onClick:this.copyItem(s),children:this.props.copyIcon?this.props.copyIcon:t.jsx(o,{})}):null]},s)}shouldComponentUpdate(t,e){switch(!0){case g(this.state.items)!==g(e.items):case g(t?.updateListener??{})!==g(this.props?.updateListener??{}):return!0;default:return!1}}UNSAFE_componentWillMount(){if(this.props.minItems&&this.props.minItems>0){const t=[];[...Array(this.props.minItems).keys()].forEach(()=>{const e=this.getRandomKey();t.push(e)}),this.setState({...this.state,items:t})}}setValue(t){return t||(t=[]),new Promise(e=>{this.setState({...this.state,items:[]},async()=>{const s=await Promise.all(t.map(async t=>{const e=await this.addItem();return this.setItemValue(e,t)}));e(s)})})}getValue(){return this.exportFormBuilderData().map(t=>t.data)}clear(){return this.removeAll()}validation(){return!this.exportFormBuilderData().some(t=>!t?.validation.status)}render(){return t.jsxs(h.Box,{children:[this.props.renderHeader?this.props.renderHeader(this.addItem,this.removeAll):t.jsxs(h.Box,{children:[t.jsx(h.IconButton,{onClick:this.addItem,children:t.jsx(n,{})}),t.jsx(h.IconButton,{onClick:this.removeAll,children:t.jsx(l,{})})]}),this.state.items.map(t=>this.props.itemWrapper?this.props.itemWrapper(this.renderItem(t),t,{copyItem:this.copyItem(t),removeItem:this.removeItem(t)}):this.renderItem(t))]})}}class k extends e.Component{constructor(){super(...arguments),this.state={value:this.props.defaultValue||null,value_when_focus:this.props.defaultValue||null,error:!1},this.onChange=t=>{let e=t.target.value;if(this.props.formatter&&"function"==typeof this.props.formatter){const t=this.props.formatter(e);void 0!==t&&(e=t)}this.normalizeValue(e),this.props.onChange?.(t)},this.normalizeValue=async t=>{if(!t)return void this.setValue(null);const e=this.props.pattern,s=t.replace(/[^0-9]/g,""),i=m(s,e,this.props.char||"_");await this.setValue(s?i:null,!0);const h=i.match(/.*[0-9]/);this.inputRef&&h&&(this.inputRef.selectionStart=this.inputRef.selectionEnd=h[0].length)},this.onClick=t=>{clearTimeout(this.validationTimeout),this.state.error&&this.setState({...this.state,error:!1}),this.props.onClick?.(t)},this.onBlur=t=>{(t.target.value||null)!==this.state.value_when_focus&&this.props._call_parent_for_update?.(),this.props.onBlur?.(t)},this.onFocus=t=>{const e=t.target.value||null;this.state.value_when_focus!==e&&this.setState({...this.state,value_when_focus:e}),this.props.onFocus?.(t)},this.click=()=>{this.inputRef?.click()},this.focus=()=>{this.inputRef?.focus()},this.blur=()=>{this.inputRef?.blur()}}shouldComponentUpdate(t,e){switch(!0){case this.state.value!==e.value:case this.state.error!==e.error:case g(t?.updateListener??{})!==g(this.props?.updateListener??{}):return!0;default:return!1}}setValue(t,e){return t===this.state.value?Promise.resolve(t):new Promise(s=>{this.setState({...this.state,value:t},()=>{e||this.props._call_parent_for_update?.(),this.props.onChangeValue?.(t),s(t)})})}getValue(){return this.state.value||null}clear(){return this.setValue(this.props.defaultValue||null)}validation(){return!(!this.state.value&&this.props.required)||(clearTimeout(this.validationTimeout),this.setState({...this.state,error:!0}),this.validationTimeout=setTimeout(()=>{this.setState({...this.state,error:!1})},3e3),!1)}render(){const{updateListener:e,onChangeValue:s,formatter:i,visible:r,_call_parent_for_update:a,defaultValue:n,...o}=this.props;return t.jsx(h.TextField,{...o,variant:this.props.variant||"standard",error:this.state.error,onChange:this.onChange,onClick:this.onClick,onBlur:this.onBlur,onFocus:this.onFocus,value:this.state.value||"",inputRef:t=>this.inputRef=t})}}const R=[{title:"IR",dialCode:"98",mask:"(...) ... ....",flag:'<svg xmlns="http://www.w3.org/2000/svg" id="flag-icons-ir" viewBox="0 0 640 480">\n <defs>\n <clipPath id="a">\n <path fill-opacity=".7" d="M-85.3 0h682.7v512H-85.3z"/>\n </clipPath>\n </defs>\n <g fill-rule="evenodd" clip-path="url(#a)" transform="translate(80) scale(.9375)">\n <path fill="#fff" d="M-192 0h896v512h-896z"/>\n <path fill="#da0000" d="M-192 343.8h896V512h-896z"/>\n <g fill="#fff" stroke-width="1pt">\n <path d="M-21.6 351h49v3.3h-49zm7.3 16.8h3.4v3.3h-3.4zm41.9 0v3.3h-9.8v-3.4zm5.2-16.8h3.4v20h-3.4z"/>\n <path d="M52.4 367.7v3.4H33.8v-3.4zm-34.6-7.9H21v11.3h-3.3z"/>\n <path d="M49.6 351H53v20h-3.4zm-8.4 0h3.3v20h-3.3zm-44.8 8v3.4h-18V359zm39.3 0v3.4h-18V359z"/>\n <path d="M17.8 359.9H21V371h-3.3z"/>\n <path d="M17.8 359.9H21V371h-3.3z"/>\n <path d="M17.8 359.9H21V371h-3.3zm-39.3 0h3.3V371h-3.3zm28.8 0h3.4V371H7.3zm-14.3 0h3.4V371H-7z"/>\n <path d="M9.6 367.7v3.4H-5.5v-3.4zm1-8.7v3.4H1V359z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M-102.2 351h49v3.3h-49zm7.3 16.8h3.4v3.3H-95zm41.9 0v3.3h-9.8v-3.4zm5.2-16.8h3.4v20h-3.4z"/>\n <path d="M-28.2 367.7v3.4h-18.6v-3.4zm-34.6-7.9h3.3v11.3h-3.3z"/>\n <path d="M-31 351h3.4v20H-31zm-8.4 0h3.3v20h-3.3zm-44.8 8v3.4h-18V359zm39.3 0v3.4h-18V359z"/>\n <path d="M-62.8 359.9h3.3V371h-3.3z"/>\n <path d="M-62.8 359.9h3.3V371h-3.3z"/>\n <path d="M-62.8 359.9h3.3V371h-3.3zm-39.3 0h3.3V371h-3.3zm28.8 0h3.3V371h-3.3zm-14.3 0h3.4V371h-3.4z"/>\n <path d="M-71 367.7v3.4h-15v-3.4zm1-8.7v3.4h-9.6V359z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M58.3 351h49v3.3h-49zm7.3 16.8H69v3.3h-3.4zm41.9 0v3.3h-9.8v-3.4zm5.3-16.8h3.4v20h-3.4z"/>\n <path d="M132.3 367.7v3.4h-18.6v-3.4zm-34.6-7.9h3.4v11.3h-3.4z"/>\n <path d="M129.5 351h3.4v20h-3.4zm-8.4 0h3.4v20H121zm-44.8 8v3.4h-18V359zm39.3 0v3.4h-18V359z"/>\n <path d="M97.7 359.9h3.4V371h-3.4z"/>\n <path d="M97.7 359.9h3.4V371h-3.4z"/>\n <path d="M97.7 359.9h3.4V371h-3.4zm-39.3 0h3.4V371h-3.4zm28.8 0h3.4V371h-3.4zm-14.3 0h3.4V371h-3.4z"/>\n <path d="M89.6 367.7v3.4H74.4v-3.4zm1-8.7v3.4H81V359z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M622.7 351h49v3.3h-49zm7.3 16.8h3.4v3.3H630zm41.9 0v3.3H662v-3.4zm5.3-16.8h3.3v20h-3.4z"/>\n <path d="M696.7 367.7v3.4H678v-3.4zm-34.6-7.9h3.4v11.3H662z"/>\n <path d="M694 351h3.3v20h-3.4zm-8.5 0h3.4v20h-3.4zm-44.8 8v3.4h-18V359zm39.3 0v3.4h-18V359z"/>\n <path d="M662 359.9h3.5V371H662z"/>\n <path d="M662 359.9h3.5V371H662z"/>\n <path d="M662 359.9h3.5V371H662zm-39.2 0h3.4V371h-3.4zm28.8 0h3.4V371h-3.4zm-14.3 0h3.4V371h-3.4z"/>\n <path d="M654 367.7v3.4h-15.2v-3.4zm1-8.7v3.4h-9.6V359z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M138.7 351h49.1v3.3h-49zm7.4 16.8h3.3v3.3h-3.3zm41.8 0v3.3h-9.8v-3.4zm5.3-16.8h3.4v20h-3.4z"/>\n <path d="M212.8 367.7v3.4h-18.6v-3.4zm-34.7-7.9h3.4v11.3h-3.4z"/>\n <path d="M210 351h3.4v20H210zm-8.5 0h3.4v20h-3.4zm-44.8 8v3.4h-17.9V359zm39.3 0v3.4h-17.9V359z"/>\n <path d="M178.1 359.9h3.4V371h-3.4z"/>\n <path d="M178.1 359.9h3.4V371h-3.4z"/>\n <path d="M178.1 359.9h3.4V371h-3.4zm-39.3 0h3.4V371h-3.4zm28.8 0h3.4V371h-3.4zm-14.2 0h3.3V371h-3.3z"/>\n <path d="M170 367.7v3.4h-15.1v-3.4zm1-8.7v3.4h-9.6V359z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M219.5 351h49v3.3h-49zm7.3 16.8h3.4v3.3h-3.4zm41.9 0v3.3h-9.8v-3.4zM274 351h3.3v20H274z"/>\n <path d="M293.5 367.7v3.4h-18.6v-3.4zm-34.6-7.9h3.4v11.3h-3.4z"/>\n <path d="M290.7 351h3.4v20h-3.4zm-8.4 0h3.4v20h-3.4zm-44.8 8v3.4h-18V359zm39.3 0v3.4h-18V359z"/>\n <path d="M258.9 359.9h3.4V371h-3.4z"/>\n <path d="M258.9 359.9h3.4V371h-3.4z"/>\n <path d="M258.9 359.9h3.4V371h-3.4zm-39.3 0h3.3V371h-3.3zm28.8 0h3.4V371h-3.4zm-14.3 0h3.4V371H234z"/>\n <path d="M250.8 367.7v3.4h-15.2v-3.4zm1-8.7v3.4H242V359z"/>\n </g>\n <path fill="#239f40" d="M-192 0h896v168.2h-896z"/>\n <g fill="#fff" stroke-width="1pt">\n <path d="M300.7 351h49v3.3h-49zm7.3 16.8h3.4v3.3H308zm41.9 0v3.3H340v-3.4zm5.3-16.8h3.3v20h-3.3z"/>\n <path d="M374.7 367.7v3.4h-18.6v-3.4zm-34.6-7.9h3.4v11.3H340z"/>\n <path d="M372 351h3.3v20H372zm-8.5 0h3.4v20h-3.4zm-44.8 8v3.4h-18V359zm39.3 0v3.4h-18V359z"/>\n <path d="M340 359.9h3.5V371H340z"/>\n <path d="M340 359.9h3.5V371H340z"/>\n <path d="M340 359.9h3.5V371H340zm-39.2 0h3.4V371h-3.4zm28.8 0h3.4V371h-3.4zm-14.3 0h3.4V371h-3.4z"/>\n <path d="M332 367.7v3.4h-15.2v-3.4zm1-8.7v3.4h-9.6V359z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M381.4 351h49v3.3h-49zm7.3 16.8h3.4v3.3h-3.4zm42 0v3.3h-9.9v-3.4zm5.2-16.8h3.4v20h-3.4z"/>\n <path d="M455.4 367.7v3.4h-18.6v-3.4zm-34.6-7.9h3.4v11.3h-3.4z"/>\n <path d="M452.7 351h3.3v20h-3.3zm-8.5 0h3.4v20h-3.4zm-44.8 8v3.4h-17.9V359zm39.3 0v3.4h-17.9V359z"/>\n <path d="M420.8 359.9h3.4V371h-3.4z"/>\n <path d="M420.8 359.9h3.4V371h-3.4z"/>\n <path d="M420.8 359.9h3.4V371h-3.4zm-39.3 0h3.4V371h-3.4zm28.8 0h3.4V371h-3.4zm-14.3 0h3.4V371h-3.3z"/>\n <path d="M412.7 367.7v3.4h-15.1v-3.4zm1-8.7v3.4H404V359z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M462.2 351h49v3.3h-49zm7.3 16.8h3.4v3.3h-3.4zm41.9 0v3.3h-9.8v-3.4zm5.2-16.8h3.4v20h-3.4z"/>\n <path d="M536.2 367.7v3.4h-18.6v-3.4zm-34.7-7.9h3.4v11.3h-3.4z"/>\n <path d="M533.4 351h3.4v20h-3.4zm-8.4 0h3.3v20H525zm-44.8 8v3.4h-18V359zm39.3 0v3.4h-18V359z"/>\n <path d="M501.6 359.9h3.3V371h-3.3z"/>\n <path d="M501.6 359.9h3.3V371h-3.3z"/>\n <path d="M501.6 359.9h3.3V371h-3.3zm-39.4 0h3.4V371h-3.4zm28.9 0h3.3V371h-3.3zm-14.3 0h3.4V371h-3.4z"/>\n <path d="M493.4 367.7v3.4h-15.1v-3.4zm1-8.7v3.4h-9.6V359z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M543.4 351h49v3.3h-49zm7.3 16.8h3.4v3.3h-3.4zm41.9 0v3.3h-9.8v-3.4zm5.2-16.8h3.4v20h-3.4z"/>\n <path d="M617.4 367.7v3.4h-18.6v-3.4zm-34.6-7.9h3.3v11.3h-3.3z"/>\n <path d="M614.6 351h3.4v20h-3.4zm-8.4 0h3.3v20h-3.3zm-44.8 8v3.4h-18V359zm39.3 0v3.4h-18V359z"/>\n <path d="M582.8 359.9h3.3V371h-3.3z"/>\n <path d="M582.8 359.9h3.3V371h-3.3z"/>\n <path d="M582.8 359.9h3.3V371h-3.3zm-39.3 0h3.3V371h-3.3zm28.8 0h3.4V371h-3.4zm-14.3 0h3.4V371H558z"/>\n <path d="M574.6 367.7v3.4h-15.1v-3.4zm1-8.7v3.4H566V359z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M-183.8 351h49v3.3h-49zm7.3 16.8h3.4v3.3h-3.4zm42 0v3.3h-9.9v-3.4zm5.2-16.8h3.4v20h-3.4z"/>\n <path d="M-109.8 367.7v3.4h-18.6v-3.4zm-34.6-7.9h3.4v11.3h-3.4z"/>\n <path d="M-112.5 351h3.3v20h-3.3zm-8.5 0h3.4v20h-3.4zm-44.8 8v3.4h-17.9V359zm39.3 0v3.4h-17.9V359z"/>\n <path d="M-144.4 359.9h3.4V371h-3.4z"/>\n <path d="M-144.4 359.9h3.4V371h-3.4z"/>\n <path d="M-144.4 359.9h3.4V371h-3.4zm-39.3 0h3.4V371h-3.4zm28.8 0h3.4V371h-3.4zm-14.3 0h3.4V371h-3.4z"/>\n <path d="M-152.5 367.7v3.4h-15.2v-3.4zm1-8.7v3.4h-9.6V359z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M-21.6 143.4h49v3.4h-49zm7.3 17h3.4v3.2h-3.4zm41.9-.2v3.4h-9.8v-3.4zm5.2-16.8h3.4v20.2h-3.4z"/>\n <path d="M52.4 160.2v3.4H33.8v-3.4zm-34.6-7.9H21v11.3h-3.3z"/>\n <path d="M49.6 143.4H53v20.2h-3.4zm-8.4 0h3.3v20.2h-3.3zm-44.8 8v3.4h-18v-3.3zm39.3 0v3.4h-18v-3.3z"/>\n <path d="M17.8 152.3H21v11.3h-3.3z"/>\n <path d="M17.8 152.3H21v11.3h-3.3z"/>\n <path d="M17.8 152.3H21v11.3h-3.3zm-39.3 0h3.3v11.3h-3.3zm28.8 0h3.4v11.3H7.3zm-14.3 0h3.4v11.3H-7z"/>\n <path d="M9.6 160.2v3.4H-5.5v-3.4zm1-8.7v3.3H1v-3.3z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M-102.2 143.4h49v3.4h-49zm7.3 17h3.4v3.2H-95zm41.9-.2v3.4h-9.8v-3.4zm5.2-16.8h3.4v20.2h-3.4z"/>\n <path d="M-28.2 160.2v3.4h-18.6v-3.4zm-34.6-7.9h3.3v11.3h-3.3z"/>\n <path d="M-31 143.4h3.4v20.2H-31zm-8.4 0h3.3v20.2h-3.3zm-44.8 8v3.4h-18v-3.3zm39.3 0v3.4h-18v-3.3z"/>\n <path d="M-62.8 152.3h3.3v11.3h-3.3z"/>\n <path d="M-62.8 152.3h3.3v11.3h-3.3z"/>\n <path d="M-62.8 152.3h3.3v11.3h-3.3zm-39.3 0h3.3v11.3h-3.3zm28.8 0h3.3v11.3h-3.3zm-14.3 0h3.4v11.3h-3.4z"/>\n <path d="M-71 160.2v3.4h-15v-3.4zm1-8.7v3.3h-9.6v-3.3z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M58.3 143.4h49v3.4h-49zm7.3 17H69v3.2h-3.4zm41.9-.2v3.4h-9.8v-3.4zm5.3-16.8h3.4v20.2h-3.4z"/>\n <path d="M132.3 160.2v3.4h-18.6v-3.4zm-34.6-7.9h3.4v11.3h-3.4z"/>\n <path d="M129.5 143.4h3.4v20.2h-3.4zm-8.4 0h3.4v20.2H121zm-44.8 8v3.4h-18v-3.3zm39.3 0v3.4h-18v-3.3z"/>\n <path d="M97.7 152.3h3.4v11.3h-3.4z"/>\n <path d="M97.7 152.3h3.4v11.3h-3.4z"/>\n <path d="M97.7 152.3h3.4v11.3h-3.4zm-39.3 0h3.4v11.3h-3.4zm28.8 0h3.4v11.3h-3.4zm-14.3 0h3.4v11.3h-3.4z"/>\n <path d="M89.6 160.2v3.4H74.4v-3.4zm1-8.7v3.3H81v-3.3z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M622.7 143.4h49v3.4h-49zm7.3 17h3.4v3.2H630zm41.9-.2v3.4H662v-3.4zm5.3-16.8h3.3v20.2h-3.4z"/>\n <path d="M696.7 160.2v3.4H678v-3.4zm-34.6-7.9h3.4v11.3H662z"/>\n <path d="M694 143.4h3.3v20.2h-3.4zm-8.5 0h3.4v20.2h-3.4zm-44.8 8v3.4h-18v-3.3zm39.3 0v3.4h-18v-3.3z"/>\n <path d="M662 152.3h3.5v11.3H662z"/>\n <path d="M662 152.3h3.5v11.3H662z"/>\n <path d="M662 152.3h3.5v11.3H662zm-39.2 0h3.4v11.3h-3.4zm28.8 0h3.4v11.3h-3.4zm-14.3 0h3.4v11.3h-3.4z"/>\n <path d="M654 160.2v3.4h-15.2v-3.4zm1-8.7v3.3h-9.6v-3.3z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M138.7 143.4h49.1v3.4h-49zm7.4 17h3.3v3.2h-3.3zm41.8-.2v3.4h-9.8v-3.4zm5.3-16.8h3.4v20.2h-3.4z"/>\n <path d="M212.8 160.2v3.4h-18.6v-3.4zm-34.7-7.9h3.4v11.3h-3.4z"/>\n <path d="M210 143.4h3.4v20.2H210zm-8.5 0h3.4v20.2h-3.4zm-44.8 8v3.4h-17.9v-3.3zm39.3 0v3.4h-17.9v-3.3z"/>\n <path d="M178.1 152.3h3.4v11.3h-3.4z"/>\n <path d="M178.1 152.3h3.4v11.3h-3.4z"/>\n <path d="M178.1 152.3h3.4v11.3h-3.4zm-39.3 0h3.4v11.3h-3.4zm28.8 0h3.4v11.3h-3.4zm-14.2 0h3.3v11.3h-3.3z"/>\n <path d="M170 160.2v3.4h-15.1v-3.4zm1-8.7v3.3h-9.6v-3.3z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M219.5 143.4h49v3.4h-49zm7.3 17h3.4v3.2h-3.4zm41.9-.2v3.4h-9.8v-3.4zm5.3-16.8h3.3v20.2H274z"/>\n <path d="M293.5 160.2v3.4h-18.6v-3.4zm-34.6-7.9h3.4v11.3h-3.4z"/>\n <path d="M290.7 143.4h3.4v20.2h-3.4zm-8.4 0h3.4v20.2h-3.4zm-44.8 8v3.4h-18v-3.3zm39.3 0v3.4h-18v-3.3z"/>\n <path d="M258.9 152.3h3.4v11.3h-3.4z"/>\n <path d="M258.9 152.3h3.4v11.3h-3.4z"/>\n <path d="M258.9 152.3h3.4v11.3h-3.4zm-39.3 0h3.3v11.3h-3.3zm28.8 0h3.4v11.3h-3.4zm-14.3 0h3.4v11.3H234z"/>\n <path d="M250.8 160.2v3.4h-15.2v-3.4zm1-8.7v3.3H242v-3.3z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M300.7 143.4h49v3.4h-49zm7.3 17h3.4v3.2H308zm41.9-.2v3.4H340v-3.4zm5.3-16.8h3.3v20.2h-3.3z"/>\n <path d="M374.7 160.2v3.4h-18.6v-3.4zm-34.6-7.9h3.4v11.3H340z"/>\n <path d="M372 143.4h3.3v20.2H372zm-8.5 0h3.4v20.2h-3.4zm-44.8 8v3.4h-18v-3.3zm39.3 0v3.4h-18v-3.3z"/>\n <path d="M340 152.3h3.5v11.3H340z"/>\n <path d="M340 152.3h3.5v11.3H340z"/>\n <path d="M340 152.3h3.5v11.3H340zm-39.2 0h3.4v11.3h-3.4zm28.8 0h3.4v11.3h-3.4zm-14.3 0h3.4v11.3h-3.4z"/>\n <path d="M332 160.2v3.4h-15.2v-3.4zm1-8.7v3.3h-9.6v-3.3z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M381.4 143.4h49v3.4h-49zm7.3 17h3.4v3.2h-3.4zm42-.2v3.4h-9.9v-3.4zm5.2-16.8h3.4v20.2h-3.4z"/>\n <path d="M455.4 160.2v3.4h-18.6v-3.4zm-34.6-7.9h3.4v11.3h-3.4z"/>\n <path d="M452.7 143.4h3.3v20.2h-3.3zm-8.5 0h3.4v20.2h-3.4zm-44.8 8v3.4h-17.9v-3.3zm39.3 0v3.4h-17.9v-3.3z"/>\n <path d="M420.8 152.3h3.4v11.3h-3.4z"/>\n <path d="M420.8 152.3h3.4v11.3h-3.4z"/>\n <path d="M420.8 152.3h3.4v11.3h-3.4zm-39.3 0h3.4v11.3h-3.4zm28.8 0h3.4v11.3h-3.4zm-14.3 0h3.4v11.3h-3.3z"/>\n <path d="M412.7 160.2v3.4h-15.1v-3.4zm1-8.7v3.3H404v-3.3z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M462.2 143.4h49v3.4h-49zm7.3 17h3.4v3.2h-3.4zm41.9-.2v3.4h-9.8v-3.4zm5.2-16.8h3.4v20.2h-3.4z"/>\n <path d="M536.2 160.2v3.4h-18.6v-3.4zm-34.7-7.9h3.4v11.3h-3.4z"/>\n <path d="M533.4 143.4h3.4v20.2h-3.4zm-8.4 0h3.3v20.2H525zm-44.8 8v3.4h-18v-3.3zm39.3 0v3.4h-18v-3.3z"/>\n <path d="M501.6 152.3h3.3v11.3h-3.3z"/>\n <path d="M501.6 152.3h3.3v11.3h-3.3z"/>\n <path d="M501.6 152.3h3.3v11.3h-3.3zm-39.4 0h3.4v11.3h-3.4zm28.9 0h3.3v11.3h-3.3zm-14.3 0h3.4v11.3h-3.4z"/>\n <path d="M493.4 160.2v3.4h-15.1v-3.4zm1-8.7v3.3h-9.6v-3.3z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M543.4 143.4h49v3.4h-49zm7.3 17h3.4v3.2h-3.4zm41.9-.2v3.4h-9.8v-3.4zm5.2-16.8h3.4v20.2h-3.4z"/>\n <path d="M617.4 160.2v3.4h-18.6v-3.4zm-34.6-7.9h3.3v11.3h-3.3z"/>\n <path d="M614.6 143.4h3.4v20.2h-3.4zm-8.4 0h3.3v20.2h-3.3zm-44.8 8v3.4h-18v-3.3zm39.3 0v3.4h-18v-3.3z"/>\n <path d="M582.8 152.3h3.3v11.3h-3.3z"/>\n <path d="M582.8 152.3h3.3v11.3h-3.3z"/>\n <path d="M582.8 152.3h3.3v11.3h-3.3zm-39.3 0h3.3v11.3h-3.3zm28.8 0h3.4v11.3h-3.4zm-14.3 0h3.4v11.3H558z"/>\n <path d="M574.6 160.2v3.4h-15.1v-3.4zm1-8.7v3.3H566v-3.3z"/>\n </g>\n <g fill="#fff" stroke-width="1pt">\n <path d="M-183.8 143.4h49v3.4h-49zm7.3 17h3.4v3.2h-3.4zm42-.2v3.4h-9.9v-3.4zm5.2-16.8h3.4v20.2h-3.4z"/>\n <path d="M-109.8 160.2v3.4h-18.6v-3.4zm-34.6-7.9h3.4v11.3h-3.4z"/>\n <path d="M-112.5 143.4h3.3v20.2h-3.3zm-8.5 0h3.4v20.2h-3.4zm-44.8 8v3.4h-17.9v-3.3zm39.3 0v3.4h-17.9v-3.3z"/>\n <path d="M-144.4 152.3h3.4v11.3h-3.4z"/>\n <path d="M-144.4 152.3h3.4v11.3h-3.4z"/>\n <path d="M-144.4 152.3h3.4v11.3h-3.4zm-39.3 0h3.4v11.3h-3.4zm28.8 0h3.4v11.3h-3.4zm-14.3 0h3.4v11.3h-3.4z"/>\n <path d="M-152.5 160.2v3.4h-15.2v-3.4zm1-8.7v3.3h-9.6v-3.3z"/>\n </g>\n <path fill="#d90000" d="M-68.8 339.5h6V350h-6zm160.5 0h6V350h-6zm-283.7 0h6V350h-6zm81.5 0h6V350h-6zm80.9 0h6V350h-6zm40 0h6V350h-6zm40.9 0h6V350h-6zm80.4 0h6V350h-6zm203 0h6.1V350h-6zm-162.1 0h6V350h-6zm40 0h6V350h-6zm40.5 0h6V350h-6zm40.4 0h6V350h-6zm323.2 0h6V350h-6zm-242.7 0h6V350h-6zm40.8 0h6V350h-6zm41.3 0h6V350h-6zm38.8 0h6V350h-6zm41.3 0h6V350h-6zm40.4 0h6V350h-6zm119.7 0h6V350h-6zm-38.8 0h6V350h-6zm-808.9 0h6V350h-6z"/>\n <path fill="#239e3f" d="M-68.8 162.6h6v10.5h-6zm160.5 0h6v10.5h-6zm-283.7 0h6v10.5h-6zm81.5 0h6v10.5h-6zm80.9 0h6v10.5h-6zm40 0h6v10.5h-6zm40.9 0h6v10.5h-6zm80.4 0h6v10.5h-6zm203 0h6.1v10.5h-6zm-162.1 0h6v10.5h-6zm40 0h6v10.5h-6zm40.5 0h6v10.5h-6zm40.4 0h6v10.5h-6zm323.2 0h6v10.5h-6zm-242.7 0h6v10.5h-6zm40.8 0h6v10.5h-6zm41.3 0h6v10.5h-6zm38.8 0h6v10.5h-6zm41.3 0h6v10.5h-6zm40.4 0h6v10.5h-6zm119.7 0h6v10.5h-6zm-38.8 0h6v10.5h-6zm-808.9 0h6v10.5h-6z"/>\n <g fill="#da0000">\n <path d="M279.8 197.5c8.4 10.4 34.5 67.6-15.7 105.2-23.7 17.8-9 18.6-8.3 21.6 38-20.1 50.3-47.5 50-72-.2-24.4-13.2-46-26-54.8z"/>\n <path d="M284.8 194.8a73.3 73.3 0 0 1 15.7 112.4c27.2-6 62-86.4-15.7-112.4zm-57.6 0a73.3 73.3 0 0 0-15.6 112.4c-27.3-6-62-86.4 15.6-112.4z"/>\n <path d="M232.2 197.5c-8.4 10.4-34.5 67.6 15.7 105.2 23.6 17.8 9 18.6 8.3 21.6-38-20.1-50.3-47.5-50-72 .2-24.4 13.2-46 26-54.8z"/>\n <path d="M304.2 319.1c-14.9.2-33.6-2-47.5-9.3 2.3 4.5 4.2 7.3 6.5 11.7 13.2 1.3 31.5 2.8 41-2.4zm-95 0c14.9.2 33.6-2 47.5-9.3-2.3 4.5-4.2 7.3-6.5 11.7-13.2 1.3-31.5 2.8-41-2.4zm27.3-138.7c3 8 10.9 9.2 19.3 4.5 6.2 3.6 15.7 3.9 19-4.1 2.5 19.8-18.3 15-19 11.2-7.8 7.5-22.2 3.2-19.3-11.6z"/>\n <path d="m256.4 331.6 7.8-9 1.1-120.1-9.3-8.2-9.3 7.8 1.9 121 7.8 8.5z"/>\n </g>\n </g>\n</svg>'},{title:"AE",dialCode:"971",mask:". ... ....",flag:'<svg xmlns="http://www.w3.org/2000/svg" id="flag-icons-ae" viewBox="0 0 640 480">\n <path fill="#00732f" d="M0 0h640v160H0z"/>\n <path fill="#fff" d="M0 160h640v160H0z"/>\n <path d="M0 320h640v160H0z"/>\n <path fill="red" d="M0 0h220v480H0z"/>\n</svg>'},{title:"US",dialCode:"1",mask:"... ... ....",flag:'<svg xmlns="http://www.w3.org/2000/svg" id="flag-icons-us" viewBox="0 0 640 480">\n <g fill-rule="evenodd">\n <g stroke-width="1pt">\n <path fill="#bd3d44" d="M0 0h912v37H0zm0 73.9h912v37H0zm0 73.8h912v37H0zm0 73.8h912v37H0zm0 74h912v36.8H0zm0 73.7h912v37H0zM0 443h912V480H0z"/>\n <path fill="#fff" d="M0 37h912v36.9H0zm0 73.8h912v36.9H0zm0 73.8h912v37H0zm0 73.9h912v37H0zm0 73.8h912v37H0zm0 73.8h912v37H0z"/>\n </g>\n <path fill="#192f5d" d="M0 0h364.8v258.5H0z"/>\n <path fill="#fff" d="m30.4 11 3.4 10.3h10.6l-8.6 6.3 3.3 10.3-8.7-6.4-8.6 6.3L25 27.6l-8.7-6.3h10.9zm60.8 0 3.3 10.3h10.8l-8.7 6.3 3.2 10.3-8.6-6.4-8.7 6.3 3.3-10.2-8.6-6.3h10.6zm60.8 0 3.3 10.3H166l-8.6 6.3 3.3 10.3-8.7-6.4-8.7 6.3 3.3-10.2-8.7-6.3h10.8zm60.8 0 3.3 10.3h10.8l-8.7 6.3 3.3 10.3-8.7-6.4-8.7 6.3 3.4-10.2-8.8-6.3h10.7zm60.8 0 3.3 10.3h10.7l-8.6 6.3 3.3 10.3-8.7-6.4-8.7 6.3 3.3-10.2-8.6-6.3h10.7zm60.8 0 3.3 10.3h10.8l-8.8 6.3 3.4 10.3-8.7-6.4-8.7 6.3 3.4-10.2-8.8-6.3h10.8zM60.8 37l3.3 10.2H75l-8.7 6.2 3.2 10.3-8.5-6.3-8.7 6.3 3.1-10.3-8.4-6.2h10.7zm60.8 0 3.4 10.2h10.7l-8.8 6.2 3.4 10.3-8.7-6.3-8.7 6.3 3.3-10.3-8.7-6.2h10.8zm60.8 0 3.3 10.2h10.8l-8.7 6.2 3.3 10.3-8.7-6.3-8.7 6.3 3.3-10.3-8.6-6.2H179zm60.8 0 3.4 10.2h10.7l-8.8 6.2 3.4 10.3-8.7-6.3-8.6 6.3 3.2-10.3-8.7-6.2H240zm60.8 0 3.3 10.2h10.8l-8.7 6.2 3.3 10.3-8.7-6.3-8.7 6.3 3.3-10.3-8.6-6.2h10.7zM30.4 62.6l3.4 10.4h10.6l-8.6 6.3 3.3 10.2-8.7-6.3-8.6 6.3L25 79.3 16.3 73h10.9zm60.8 0L94.5 73h10.8l-8.7 6.3 3.2 10.2-8.6-6.3-8.7 6.3 3.3-10.3-8.6-6.3h10.6zm60.8 0 3.3 10.3H166l-8.6 6.3 3.3 10.2-8.7-6.3-8.7 6.3 3.3-10.3-8.7-6.3h10.8zm60.8 0 3.3 10.3h10.8l-8.7 6.3 3.3 10.2-8.7-6.3-8.7 6.3 3.4-10.3-8.8-6.3h10.7zm60.8 0 3.3 10.3h10.7l-8.6 6.3 3.3 10.2-8.7-6.3-8.7 6.3 3.3-10.3-8.6-6.3h10.7zm60.8 0 3.3 10.3h10.8l-8.8 6.3 3.4 10.2-8.7-6.3-8.7 6.3 3.4-10.3-8.8-6.3h10.8zM60.8 88.6l3.3 10.2H75l-8.7 6.3 3.3 10.3-8.7-6.4-8.7 6.3 3.3-10.2-8.6-6.3h10.7zm60.8 0 3.4 10.2h10.7l-8.8 6.3 3.4 10.3-8.7-6.4-8.7 6.3 3.3-10.2-8.7-6.3h10.8zm60.8 0 3.3 10.2h10.8l-8.7 6.3 3.3 10.3-8.7-6.4-8.7 6.3 3.3-10.2-8.6-6.3H179zm60.8 0 3.4 10.2h10.7l-8.7 6.3 3.3 10.3-8.7-6.4-8.6 6.3 3.2-10.2-8.7-6.3H240zm60.8 0 3.3 10.2h10.8l-8.7 6.3 3.3 10.3-8.7-6.4-8.7 6.3 3.3-10.2-8.6-6.3h10.7zM30.4 114.5l3.4 10.2h10.6l-8.6 6.3 3.3 10.3-8.7-6.4-8.6 6.3L25 131l-8.7-6.3h10.9zm60.8 0 3.3 10.2h10.8l-8.7 6.3 3.2 10.2-8.6-6.3-8.7 6.3 3.3-10.2-8.6-6.3h10.6zm60.8 0 3.3 10.2H166l-8.6 6.3 3.3 10.3-8.7-6.4-8.7 6.3 3.3-10.2-8.7-6.3h10.8zm60.8 0 3.3 10.2h10.8l-8.7 6.3 3.3 10.3-8.7-6.4-8.7 6.3 3.4-10.2-8.8-6.3h10.7zm60.8 0 3.3 10.2h10.7L279 131l3.3 10.3-8.7-6.4-8.7 6.3 3.3-10.2-8.6-6.3h10.7zm60.8 0 3.3 10.2h10.8l-8.8 6.3 3.4 10.3-8.7-6.4-8.7 6.3L329 131l-8.8-6.3h10.8zM60.8 140.3l3.3 10.3H75l-8.7 6.2 3.3 10.3-8.7-6.4-8.7 6.4 3.3-10.3-8.6-6.3h10.7zm60.8 0 3.4 10.3h10.7l-8.8 6.2 3.4 10.3-8.7-6.4-8.7 6.4 3.3-10.3-8.7-6.3h10.8zm60.8 0 3.3 10.3h10.8l-8.7 6.2 3.3 10.3-8.7-6.4-8.7 6.4 3.3-10.3-8.6-6.3H179zm60.8 0 3.4 10.3h10.7l-8.7 6.2 3.3 10.3-8.7-6.4-8.6 6.4 3.2-10.3-8.7-6.3H240zm60.8 0 3.3 10.3h10.8l-8.7 6.2 3.3 10.3-8.7-6.4-8.7 6.4 3.3-10.3-8.6-6.3h10.7zM30.4 166.1l3.4 10.3h10.6l-8.6 6.3 3.3 10.1-8.7-6.2-8.6 6.2 3.2-10.2-8.7-6.3h10.9zm60.8 0 3.3 10.3h10.8l-8.7 6.3 3.3 10.1-8.7-6.2-8.7 6.2 3.4-10.2-8.7-6.3h10.6zm60.8 0 3.3 10.3H166l-8.6 6.3 3.3 10.1-8.7-6.2-8.7 6.2 3.3-10.2-8.7-6.3h10.8zm60.8 0 3.3 10.3h10.8l-8.7 6.3 3.3 10.1-8.7-6.2-8.7 6.2 3.4-10.2-8.8-6.3h10.7zm60.8 0 3.3 10.3h10.7l-8.6 6.3 3.3 10.1-8.7-6.2-8.7 6.2 3.3-10.2-8.6-6.3h10.7zm60.8 0 3.3 10.3h10.8l-8.8 6.3 3.4 10.1-8.7-6.2-8.7 6.2 3.4-10.2-8.8-6.3h10.8zM60.8 192l3.3 10.2H75l-8.7 6.3 3.3 10.3-8.7-6.4-8.7 6.3 3.3-10.2-8.6-6.3h10.7zm60.8 0 3.4 10.2h10.7l-8.8 6.3 3.4 10.3-8.7-6.4-8.7 6.3 3.3-10.2-8.7-6.3h10.8zm60.8 0 3.3 10.2h10.8l-8.7 6.3 3.3 10.3-8.7-6.4-8.7 6.3 3.3-10.2-8.6-6.3H179zm60.8 0 3.4 10.2h10.7l-8.7 6.3 3.3 10.3-8.7-6.4-8.6 6.3 3.2-10.2-8.7-6.3H240zm60.8 0 3.3 10.2h10.8l-8.7 6.3 3.3 10.3-8.7-6.4-8.7 6.3 3.3-10.2-8.6-6.3h10.7zM30.4 217.9l3.4 10.2h10.6l-8.6 6.3 3.3 10.2-8.7-6.3-8.6 6.3 3.2-10.3-8.7-6.3h10.9zm60.8 0 3.3 10.2h10.8l-8.7 6.3 3.3 10.2-8.7-6.3-8.7 6.3 3.4-10.3-8.7-6.3h10.6zm60.8 0 3.3 10.2H166l-8.4 6.3 3.3 10.2-8.7-6.3-8.7 6.3 3.3-10.3-8.7-6.3h10.8zm60.8 0 3.3 10.2h10.8l-8.7 6.3 3.3 10.2-8.7-6.3-8.7 6.3 3.4-10.3-8.8-6.3h10.7zm60.8 0 3.3 10.2h10.7l-8.6 6.3 3.3 10.2-8.7-6.3-8.7 6.3 3.3-10.3-8.6-6.3h10.7zm60.8 0 3.3 10.2h10.8l-8.8 6.3 3.4 10.2-8.7-6.3-8.7 6.3 3.4-10.3-8.8-6.3h10.8z"/>\n </g>\n</svg>'}],S=h.styled("img")({borderRadius:4,height:22,width:28}),I=R[0];class T extends e.Component{constructor(){super(...arguments),this.state={value:this.props.defaultValue||null,value_when_focus:this.props.defaultValue||null,error:!1,country:I},this.onChange=t=>{this.normalizeValue(t.target.value,!0)},this.onClick=t=>{clearTimeout(this.validationTimeout),this.setState({...this.state,error:!1}),this.normalizeValue(this.state.value),this.props.onClick?.(t)},this.onBlur=t=>{(t.target.value||null)!==this.state.value_when_focus&&this.props._call_parent_for_update?.(),this.props.onBlur?.(t)},this.onFocus=t=>{const e=t.target.value||null;this.state.value_when_focus!==e&&this.setState({...this.state,value_when_focus:e}),this.props.onFocus?.(t)},this.normalizeValue=async(t,e)=>{if(!t)return void this.setValue(null,!0,e);t=t.replace(/^0/,"");const s=this.state.country.mask,i=t.replace(/[^0-9]/g,""),h=m(i,s,"_");await this.setValue(i?h:null,!0,e);const r=h.match(/.*[0-9]/);this.inputRef&&r&&(this.inputRef.selectionStart=this.inputRef.selectionEnd=r[0].length)},this.onChangeCountry=async t=>{const e=t.target.value,s=R.find(t=>t.dialCode===e);s&&await this.setState({...this.state,country:s}),this.state.value&&s&&this.normalizeValue(this.state.value)},this.click=()=>{this.inputRef?.click()},this.focus=()=>{this.inputRef?.focus()},this.blur=()=>{this.inputRef?.blur()}}shouldComponentUpdate(t,e){switch(!0){case this.state.value!==e.value:case this.state.error!==e.error:case this.state.country.dialCode!==e.country.dialCode:case g(t?.updateListener??{})!==g(this.props?.updateListener??{}):return!0;default:return!1}}setValue(t,e=!1,s){if(t===this.state.value)return Promise.resolve(t);if(t&&!e){const e=t.split("-");if(e.length>1){const t=e[0].replace(/[^0-9]/g,""),s=R.find(e=>e.dialCode===t);return s&&this.setState({...this.state,country:s}),this.normalizeValue(e[1]),Promise.resolve(e[1])}return this.normalizeValue(t),Promise.resolve(t)}return new Promise(e=>{this.setState({...this.state,value:t},()=>{s||this.props._call_parent_for_update?.(),this.props.onChangeValue?.(t),e(t)})})}getValue(){if(!this.state.value)return null;const t=this.state.value.replace(/[^0-9]/g,"");return"+"+this.state.country.dialCode+"-"+t}clear(){return this.setValue(this.props.defaultValue||null,!0)}validation(){const t=this.state.value?.match(/.*[0-9]/);return!((!t||t[0].length!==this.state.country.mask.length)&&this.props.required)||(clearTimeout(this.validationTimeout),this.setState({...this.state,error:!0}),this.validationTimeout=setTimeout(()=>{this.setState({...this.state,error:!1})},3e3),!1)}render(){const{updateListener:e,defaultValue:s,onChangeValue:i,visible:r,_call_parent_for_update:a,...n}=this.props,o="outlined"===this.props.variant;let l=207;switch(this.props.variant){case"outlined":l=235;break;case"filled":l=231}return t.jsxs(h.Box,{sx:{display:"inline-flex",alignItems:"flex-end",width:this.props.fullWidth?"100%":l,position:"relative"},children:[t.jsx(h.Select,{value:this.state.country.dialCode,onChange:this.onChangeCountry,variant:"standard",margin:"none",sx:{width:"65px",position:"absolute",zIndex:2,left:o?"8px":0,top:o?"5px":"18px",bottom:2},renderValue:e=>t.jsxs(h.Typography,{paddingLeft:"8px",children:["+",e]}),disableUnderline:!0,children:R.map((e,s)=>t.jsxs(h.MenuItem,{value:e.dialCode,sx:{display:"flex",alignItems:"center",justifyContent:"space-between",minWidth:"100px",paddingRight:"8px",paddingLeft:"8px"},children:[t.jsxs(h.Typography,{display:"inline",children:["+",e.dialCode]}),t.jsx(S,{src:e.flag})]},s))}),t.jsx(h.TextField,{...n,variant:this.props.variant||"standard",error:this.state.error,onChange:this.onChange,onClick:this.onClick,onBlur:this.onBlur,onFocus:this.onFocus,value:this.state.value||"",inputRef:t=>this.inputRef=t,slotProps:{input:{sx:{width:this.props.fullWidth?"100%":l},startAdornment:t.jsx(h.InputAdornment,{position:"start",children:t.jsx(h.Box,{ml:"56px"})})}}})]})}}class H extends e.Component{constructor(){super(...arguments),this.state={value:void 0!==this.props.defaultValue?this.props.defaultValue:null,value_when_focus:void 0!==this.props.defaultValue?this.props.defaultValue:null,error:!1},this.onChange=t=>{let e=isNaN(parseInt(t.target.value,10))?null:parseInt(t.target.value,10);if(this.props.formatter&&"function"==typeof this.props.formatter){const t=this.props.formatter(e);void 0!==t&&(e=t)}this.setValue(e,!0).then(()=>{this.props.onChange?.(t)})},this.onClick=t=>{clearTimeout(this.validationTimeout),this.setState({...this.state,error:!1}),this.props.onClick?.(t)},this.onBlur=t=>{(Number(t.target.value)||null)!==this.state.value_when_focus&&this.props._call_parent_for_update?.(),this.props.onBlur?.(t)},this.onFocus=t=>{const e=Number(t.target.value)||null;this.state.value_when_focus!==e&&this.setState({...this.state,value_when_focus:e}),this.props.onFocus?.(t)},this.click=()=>{this.inputRef?.click()},this.focus=()=>{this.inputRef?.focus()},this.blur=()=>{this.inputRef?.blur()}}shouldComponentUpdate(t,e){switch(!0){case this.state.value!==e.value:case this.state.error!==e.error:case g(t?.updateListener??{})!==g(this.props?.updateListener??{}):return!0;default:return!1}}setValue(t,e){return t===this.state.value?Promise.resolve(t):new Promise(s=>{this.setState({...this.state,value:t},()=>{e||this.props._call_parent_for_update?.(),this.props.onChangeValue?.(t),s(t)})})}getValue(){return z(this.state.value)?this.state.value:null}clear(){return this.setValue(this.props.defaultValue??null)}validation(){return!(!z(this.state.value)&&this.props.required)||(clearTimeout(this.validationTimeout),this.setState({...this.state,error:!0}),this.validationTimeout=setTimeout(()=>{this.setState({...this.state,error:!1})},3e3),!1)}render(){const{updateListener:e,onChangeValue:s,defaultValue:i,visible:r,_call_parent_for_update:a,...n}=this.props;return t.jsx(h.TextField,{...n,variant:this.props.variant||"standard",error:this.state.error,onChange:this.onChange,onClick:this.onClick,onBlur:this.onBlur,onFocus:this.onFocus,value:z(this.state.value)?this.state.value:"",inputRef:t=>this.inputRef=t})}}class j extends e.Component{constructor(){super(...arguments),this.state={value:this.props.defaultValue||null,value_when_focus:this.props.defaultValue||null,error:!1,isInputFocused:!1},this.onChange=t=>{let e=t.target.value.replace(/[^۰-۹0-9]/g,"");if(this.props.formatter&&"function"==typeof this.props.formatter){const t=this.props.formatter(e);void 0!==t&&(e=t)}this.setValue(e||null,!0).then(()=>{this.props.onChange?.(t)})},this.onClick=t=>{clearTimeout(this.validationTimeout),!0!==this.props.disabled&&this.setState({...this.state,error:!1,isInputFocused:!0},()=>{this.inputRef?.focus(),this.props.onClick?.(t)})},this.onBlur=t=>{this.setState({...this.state,isInputFocused:!1});(t.target.value||null)!==this.state.value_when_focus&&this.props._call_parent_for_update?.(),this.props.onBlur?.(t)},this.onFocus=t=>{this.setState({...this.state,isInputFocused:!0},()=>{const e=t.target.value||null;this.state.value_when_focus!==e&&this.setState({...this.state,value_when_focus:e}),this.props.onFocus?.(t)})},this.click=()=>{this.inputRef?.click()},this.focus=()=>{this.inputRef?.focus()},this.blur=()=>{this.inputRef?.blur()}}shouldComponentUpdate(t,e){switch(!0){case this.state.value!==e.value:case this.state.error!==e.error:case this.state.isInputFocused!==e.isInputFocused:case g(t?.updateListener??{})!==g(this.props?.updateListener??{}):return!0;default:return!1}}async setValue(t,e){return t===this.state.value?Promise.resolve(t):new Promise(s=>{this.setState({...this.state,value:t},()=>{e||this.props._call_parent_for_update?.(),this.props.onChangeValue?.(t),s(t)})})}getValue(){return this.state.value||null}clear(){return this.setValue(this.props.defaultValue||null)}validation(){return!(!this.state.value||this.state.value.length<(this.props.digits||4)&&this.props.required)||(clearTimeout(this.validationTimeout),this.setState({...this.state,error:!0}),this.validationTimeout=setTimeout(()=>{this.setState({...this.state,error:!1})},3e3),!1)}render(){const s={digits:this.props.digits||4,borderWidth:this.props.borderWidth||1,height:this.props.height||55,width:this.props.width||34.61,spaceBetween:this.props.spaceBetween||8,borderRadius:this.props.borderRadius||4,emptyColor:this.props.emptyColor||"#0000003b",focusColor:this.props.focusColor||"#1976d2",completeColor:this.props.completeColor||"#68b36b",fontWeight:this.props.fontWeight||400,fontSize:this.props.fontSize||23,color:this.props.color||"#323232"},i=Array.from(Array(s.digits).keys()),r=this.state.value?.split("")||[];return t.jsx(e.Fragment,{children:t.jsx(h.Box,{sx:{width:s.width*s.digits+2*s.borderWidth*s.digits+s.spaceBetween*(s.digits-1),display:"inline-block",verticalAlign:"top",position:"relative"},children:t.jsxs(h.Box,{onClick:this.onClick,sx:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[t.jsx("input",