import * as React from "react";
import * as ClientModel from '../models/form.client.models'
import {InputElement} from "./input-element";

export interface IProps {
    definition: ClientModel.Section
}

export function Section(props: IProps) {
    const {definition} = props;
    const sectionTitle = definition.meta.title? <h3 className="section-title">{definition.meta.title}</h3>: '';

    const renderedLayout = definition.layout.map((item, idx) =>
        <InputElement key={idx} type={item.type} definition={item} />);

    return <div className="section">
        {sectionTitle}
        {renderedLayout}
        </ div>;
}