in expanded_checklist/visual_interface/src/components/template_editor/TokenSpan.tsx [90:135]
public SuggestChecklist(): JSX.Element {
if (this.options.length === 0) {
return null;
}
$('.checklist').scroll(function(){
$('.checklist').scrollTop($(this).scrollTop());
})
return <div
key={this.props.token.displayTag() + this.props.token.key()}
className="full-width">
<div><b className='info-header'>Fill in with...</b></div>
<div style={{ borderBottom: '1px solid #E9E9E9' }}>
<Checkbox
indeterminate={
templateStore.selectedSuggestIdxes.length &&
templateStore.selectedSuggestIdxes.length < this.options.length}
onChange={this.onCheckAllChange}
checked={this.options.length &&
templateStore.selectedSuggestIdxes.length === this.options.length}>
<i>Check All</i>
</Checkbox>
</div>
<div
onScroll={() => {
$('.checklist').scroll(function(){
$('.checklist').scrollTop($(this).scrollTop());
})
}}
style={{height: 100}} className="checklist full-width overflow-y">
<Checkbox.Group
value={templateStore.selectedSuggestIdxes}
onChange={this.onSelectSuggests}>
<Row>
{this.options.map((s, idx: number) =>
<Row key={`${s}${idx}`}><Checkbox value={idx}>
<span className="ellipsis mask-token">
{this.token.needArticle ?
<span className="article-token">{`${utils.genArticle(s)} `}</span> : null}
{s}
</span>
</Checkbox></Row>)}
</Row>
</Checkbox.Group>
</div>
</div>
}