// selector rows
truncate(name,model) ::= <%
<name; format={truncate-width:<model.terminalWidth>-prefix:2}>
%>

select_item(item,model) ::= <%
<if(item.selected)>
<({<figures.rightPointingQuotation> }); format="style-item-selector"><({<truncate(item.name,model)>}); format="style-item-selector">
<else>
<("  ")><truncate(item.name,model)>
<endif>
%>

// start '? xxx' shows both running and result
question_name(model) ::= <<
<({<figures.questionMark>}); format="style-list-value"> <model.name; format="style-title">
>>

// within info section, dedicated instructions for user
info_filter(model) ::= <%
<if(model.input)>
, filtering '<model.input>'
<else>
, type to filter
<endif>
%>

// info section after '? xxx'
info(model) ::= <<
[Use arrows to move]<info_filter(model)>
>>

// component result
result(model) ::= <<
<question_name(model)> <model.value; format="style-value">
>>

// component is running
running(model) ::= <<
<question_name(model)> <info(model)>
<model.rows:{x|<select_item(x,model)>}; separator="\n">
>>

// main - hardcoded name
// model - model built by SingleItemSelectorContext
main(model) ::= <<
<if(model.isResult)><result(model)><else><running(model)><endif>
>>
