import React from 'react'

import Point from './Point';


const RichTextPoints = ({children, className, points, count = 3, textsize }) => {
    return (
        <div className='flex justify-between items-center'>
            <div className={['basis-1/2', className].join(' ')}>{children}</div>
            <div style={{'--pointsBasis': count * 220 + 'px'}} className="flex justify-center basis-[var(--pointsBasis)] flex-wrap">
                {points.map(point=>
                    <Point key={point.id} ico={point.ico} link={point.link} to={point.to} title={point.title} textsize={textsize}/>
                )}          
            </div>
        </div>
    )
}

export default RichTextPoints;