{"size": 2456, "ext": "js", "max_stars_repo_path": "src/components/MainSlides/index.js", "max_stars_repo_name": "cefafortaleza/website", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/components/MainSlides/index.js", "max_issues_repo_name": "cefafortaleza/website", "max_issues_repo_issues_event_min_datetime": "2020-05-25T20:00:37.000Z", "max_issues_repo_issues_event_max_datetime": "2022-02-27T20:48:39.000Z", "max_forks_repo_path": "src/components/MainSlides/index.js", "max_forks_repo_name": "cefafortaleza/website", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": 4, "max_forks_count": null, "avg_line_length": 30.3209876543, "max_line_length": 75, "alphanum_fraction": 0.4910423453}
import React from 'react';
import Flicking from '@egjs/react-flicking';
import Button from '../Button';

const MainSlides = ({ slides }) => {

  return (
    <Flicking
      tag="div"
      viewportTag="div"
      cameraTag="div"
      onNeedPanel={(e) => (NeedPanelEvent) => {}}
      onMoveStart={(e) => (FlickingEvent) => {}}
      onMove={(e) => (FlickingEvent) => {}}
      onMoveEnd={(e) => (FlickingEvent) => {}}
      onHoldStart={(e) => (FlickingEvent) => {}}
      onHoldEnd={(e) => (FlickingEvent) => {}}
      onRestore={(e) => (FlickingEvent) => {}}
      onSelect={(e) => (SelectEvent) => {}}
      onChange={(e) => (ChangeEvent) => {}}
      classPrefix="eg-flick"
      deceleration={0.0075}
      horizontal={true}
      circular={true}
      infinite={false}
      infiniteThreshold={0}
      lastIndex={Infinity}
      threshold={40}
      duration={100}
      panelEffect={(x) => 1 - Math.pow(1 - x, 3)}
      defaultIndex={3}
      inputType={['touch', 'mouse']}
      thresholdAngle={45}
      bounce={10}
      autoResize={false}
      adaptive={false}
      zIndex={2000}
      bound={false}
      overflow={false}
      hanger={'50%'}
      anchor={'50%'}
      gap={0}
      moveType={{ type: 'snap', count: 1 }}
      collectStatistics={true}
    >
      {slides.map((slide, index) => (
        <div className={`main-slide-item item-${index}`} key={index}>
          <div
            className="slide-wrapper"
            style={{
              background: `url(../img/${slide.background})`,
              backgroundSize: 'cover',
              backgroundRepeat: 'no-repeat',
              textAlign: `${slide.align}`,
            }}
          >
            <div className={`slide-content ${slide.align} ${slide.color}`}>
              <p className="frase">{slide.frase}</p>
              <p className="autor">{slide.autor}</p>
              <div className="buttons-wrapper">
                {slide.primeiro_botao_link !== '' && (
                  <Button href={slide.primeiro_botao_link}>
                    {slide.primeiro_botao_texto}
                  </Button>
                )}
                {slide.segundo_botao_link !== '' && (
                  <Button href={slide.segundo_botao_link}>
                    {slide.segundo_botao_texto}
                  </Button>
                )}
              </div>
            </div>
          </div>
        </div>
      ))}
    </Flicking>
  );
};

export default MainSlides;
