<form autocomplete="off" onsubmit="event.preventDefault();">
    <h2>
        <i class="fas fa-flask"></i> {{localize "ENHANCED_CONDITIONS.Lab.Title"}}
        {{#if unsavedMap}} <strong> {{localize "ENHANCED_CONDITIONS.Lab.MappingType.Unsaved"}}</strong>{{/if}}
    </h2>
    <div class="flexrow">
        {{!-- List Controls --}}
        <div class="flexrow condition-list-controls">
            <div class="sort">
                <a class="sort-list" title="{{sortTitle}}">
                    <span class="fa-stack fa-1x">
                        {{#unless sortDirection}}<i class="fas fa-slash fa-stack-1x"></i>{{/unless}}
                        {{#if (eq sortDirection "desc")}}<i class="fas fa-sort-alpha-down-alt fa-stack-1x"></i>
                        {{else}}<i class="fas fa-sort-alpha-down fa-stack-1x"></i>
                        {{/if}}
                    </span>
                </a>
            </div>
            <div class="filter">
                <div class="input-wrapper">
                    <i class="fas fa-filter"></i>
                    <input type="text" name="filter-list" title="{{filterTitle}}" placeholder="{{filterTitle}}" value="{{filterValue}}" data-dtype="String">
                </div>
            </div>
        </div>
        <div class="form-group">
            <label>{{localize "ENHANCED_CONDITIONS.Lab.MappingType.Label"}}</label>
            <select name="map-type" class="map-type" title="">
                {{#select mapType}}
                {{#each mapTypeChoices as |label name|}}
                    <option value="{{name}}">{{label}}</option>
                {{/each}}
                {{/select}}
            </select>
        </div>
        {{!-- <hr>     --}}
    </div>
    
    <ol class="condition-lab list">
        {{#each displayedMap as |condition key|}}
        {{> "modules/combat-utility-belt/templates/partials/condition-lab-row.hbs" condition=condition key=key isDefault=../isDefault conditionMapLength=../displayedMap.length sortDirection=../sortDirection}}
        {{/each}}
        <div class="flexrow add-row">
            <a name="add-row" title="Add Row">
                <i class="fas fa-plus"></i> {{#if isDefault}}Add Row (switch to System - Custom){{else}}Add Row{{/if}}
            </a>
        </div>
    </ol>
    <footer class="flexrow">
        <button type="submit" name="submit" title="Save mapping form values" {{#if unsavedMap}}class="highlight"{{/if}}>
            <i class="far fa-save"></i> Save Mapping
        </button>
        <button type="button" name="reset" title="Reset unsaved changes">
            <i class="fas fa-undo"></i> Reset Mapping
        </button>
    
        <button type="button" name="restore" class="restore-defaults" title="Restore mappings back to system defaults">
            <i class="fas fa-history"></i> Restore Defaults
        </button>
    </footer>
    

</form>