public render()

in expanded_checklist/visual_interface/src/components/template_editor/TemplateEditor.tsx [62:101]


    public render(): JSX.Element {
        return <Row 
            style={{marginTop: 15}}
            key={templateStore.templates.map(t => t.key()).join("-")} gutter={30}>
            <Col span={17}>
                <List
                    itemLayout="horizontal"
                    dataSource={templateStore.templates}
                    renderItem={(template: Template, idx: number) => (
                        <List.Item key={idx}>
                            <List.Item.Meta
                            avatar={<Avatar style={{backgroundColor: "#f56a00", verticalAlign: "middle"}} size="small">
                                ></Avatar>}
                            title={<PerTemplateEditor
                                onChangeSelected={this.props.onChangeSelected}
                                template={template} /> }
                            />
                        </List.Item>
                    )}
                />
            </Col>
            <Col span={7}>
                <h4 className="header">Preview</h4>
                <div 
                key={templateStore.templates.map(t => t.key()).join("-")}
                style={{maxHeight: templateStore.templates.length * 200, overflow: "auto"}}>
                <List
                    itemLayout="horizontal"
                    size="small"
                    dataSource={templateStore.previewExample}
                    renderItem={(preview: TemplateExample, idx: number) => (
                        <ExampleView key={idx} example={preview} />
                    )}
                />
                </div>
            </Col>
            {/*this.confirmModal()*/}
        </Row>
        
    }