{"size": 1750, "ext": "js", "max_stars_repo_path": "includes/Admin/Settings/app/components/type/Number.js", "max_stars_repo_name": "ARCommunications/WP-Scheduled-Posts", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "includes/Admin/Settings/app/components/type/Number.js", "max_issues_repo_name": "ARCommunications/WP-Scheduled-Posts", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "includes/Admin/Settings/app/components/type/Number.js", "max_forks_repo_name": "ARCommunications/WP-Scheduled-Posts", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 29.6610169492, "max_line_length": 77, "alphanum_fraction": 0.3371428571}
import React from 'react'
import { Field } from 'formik'

const Number = ({
    id,
    title,
    subtitle,
    desc,
    arrayHelpers,
    index,
    setFieldValue,
    groupName,
    value,
    ...props
}) => {
    return (
        <div className='form-group'>
            <div className='form-info'>
                <label htmlFor={id}>{title}</label>
                <span className='sub-title'>{subtitle}</span>
            </div>
            <div className='form-body'>
                {arrayHelpers !== undefined ? (
                    <Field
                        className='number-field'
                        type='number'
                        name={`${groupName}.${id}`}
                        max={props?.max}
                        min={props?.min}
                        value={
                            value !== undefined && value[index] !== undefined
                                ? value[index][id]
                                : ''
                        }
                        onChange={(e) =>
                            arrayHelpers.replace(index, {
                                [id]: e.target.value,
                            })
                        }
                    />
                ) : (
                    <Field
                        className='number-field'
                        type='number'
                        id={id}
                        name={id}
                        max={props?.max}
                        min={props?.min}
                        onChange={(e) => setFieldValue(id, e.target.value)}
                    />
                )}
                <span className='desc'>{desc}</span>
            </div>
        </div>
    )
}

export default Number
