<commit_before>import { CarouselItem } from "./CarouselItem";
import { DOM, createElement } from "react";

import "../ui/Carousel.css";
import { CarouselControl } from "./CarouselControl";

export interface Image {
    url: string;
}

export interface CarouselProps {
    images?: Image[];
}

const carouselItems = (images: Image[] = []) =>
    images.map((image, index) => createElement(CarouselItem, {
        active: index === 0,
        key: index,
        url: image.url
    }));

export const Carousel = (props: CarouselProps) =>
    DOM.div({ className: "widget-carousel" },
        DOM.div({ className: "widget-carousel-item-wrapper" },
            carouselItems(props.images)
        ),
        createElement(CarouselControl, { direction: "left" }),
        createElement(CarouselControl, { direction: "right" })
    );<commit_msg>Convert stateless Carousel component to react class<commit_after>import { CarouselItem } from "./CarouselItem";
import { Component, DOM, createElement } from "react";

import "../ui/Carousel.css";
import { CarouselControl } from "./CarouselControl";

export interface Image {
    url: string;
}

export interface CarouselProps {
    images?: Image[];
}

export class Carousel extends Component<CarouselProps, any> {
    render() {
        return (
            DOM.div({ className: "carousel" },
                DOM.div({ className: "carousel-inner" },
                    this.createCarouselItems(this.props.images)
                ),
                createElement(CarouselControl, { direction: "left" }),
                createElement(CarouselControl, { direction: "right" })
            )
        );
    }

    private createCarouselItems(images: Image[] = []) {
        return images.map((image, index) => createElement(CarouselItem, {
            active: index === 0,
            key: index,
            url: image.url
        }));
    }
}
{'fraction_non_alphanumeric': 0.13595326606479022, 'fraction_numerical': 0.0010621348911311736, 'mean_word_length': 2.623076923076923, 'pattern_counts': {'":': 0, '<': 4, '<?xml version=': 0, '>': 8, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '411645', 'n_tokens_mistral': 524, 'n_tokens_neox': 517, 'n_words': 124}