<form class="pure-form roster-filter-form input-button-group">
    <input value="{{filter_text}}" class="roster-filter roster-filter-{{filter_type}}"
           placeholder="{{placeholder}}">
    <select class="state-type state-type-{{filter_type}}">
        <option value="">{{label_any}}</option>
        <option {[ if (chat_state === 'unread_messages') { ]} selected="selected" {[ } ]}
            value="unread_messages">{{label_unread_messages}}</option>
        <option {[ if (chat_state === 'online') { ]} selected="selected" {[ } ]}
            value="online">{{label_online}}</option>
        <option {[ if (chat_state === 'chat') { ]} selected="selected" {[ } ]}
            value="chat">{{label_chatty}}</option>
        <option {[ if (chat_state === 'dnd') { ]} selected="selected" {[ } ]}
            value="dnd">{{label_busy}}</option>
        <option {[ if (chat_state === 'away') { ]} selected="selected" {[ } ]}
            value="away">{{label_away}}</option>
        <option {[ if (chat_state === 'xa') { ]} selected="selected" {[ } ]}
            value="xa">{{label_xa}}</option>
        <option {[ if (chat_state === 'offline') { ]} selected="selected" {[ } ]}
            value="offline">{{label_offline}}</option>
    </select>
    <select class="filter-type">
        <option {[ if (filter_type === 'contacts') { ]} selected="selected" {[ } ]}
                value="contacts">{{label_contacts}}</option>
        <option {[ if (filter_type === 'groups') { ]} selected="selected" {[ } ]}
                value="groups">{{label_groups}}</option>
        <option {[ if (filter_type === 'state') { ]} selected="selected" {[ } ]}
                value="state">{{label_state}}</option>
    </select>
</form>
