<fieldset class="repeat-fieldset {{#if repeating}}active{{/if}}">
    <legend >Repeating <input class="repeat" type="checkbox" name="{{root}}repeating" {{#if repeating}}checked{{/if}}></legend>
    
    <div class="content" {{#unless repeating}}style="display: none;"{{/unless}}>
        <div class="form-group">
            <label>Value</label>
            <div class="form-fields">
                <input name="{{root}}repeat.value" type="text" value="{{repeat.value}}"></input>
            </div>
            <p class="notes">Value that will be divided by the increment to determine the number of repeats.</p>
        </div>

        <div class="form-group slim">
            <label>Increment</label>
            <div class="form-fields">
                <label>Value</label>
                <input name="{{root}}repeat.increment"type="text" value="{{repeat.increment}}"></input>
                <label>Percentage</label>
                <input type="checkbox" data-dtype="Boolean" name="{{root}}repeat.isPercentage" {{#if repeat.isPercentage}}checked{{/if}}></input>
            </div>
        </div>

        <div class="form-group">
            <label>Max Value (optional)</label>
            <div class="form-fields">
                <input name="{{root}}repeat.maxValue" type="text" value="{{repeat.maxValue}}"></input>
            </div>
            <p class="notes">Max value only required if increment is a percentage.</p>
        </div>

        <div class="form-group">
            <label>Repeats per row (optional)</label>
            <div class="form-fields">
                <input name="{{root}}repeat.perRow" type="text" value="{{repeat.perRow}}"></input>
            </div>
            <p class="notes">How many repeats should be rendered before proceeding to the next row.</p>
        </div>

        <div class="form-group">
            <label>Max Rows (optional)</label>
            <div class="form-fields">
                <input name="{{root}}repeat.maxRows" type="text" value="{{repeat.maxRows}}"></input>
            </div>
            <p class="notes">Limit repeats to this number of rows.</p>
        </div>

        {{#if padding}}
        <div class="form-group slim">
            <label>Padding (optional)</label>
            <div class="form-fields">
                <label>Horizontal</label>
                <input name="{{root}}repeat.paddingX" type="text" value="{{repeat.paddingX}}"></input>
                <label>Vertical</label>
                <input name="{{root}}repeat.paddingY" type="text" value="{{repeat.paddingY}}"></input>
            </div>
            <p class="notes">Insert empty pixels in-between the repeating shapes.</p>
        </div>
        {{/if}}
    </div>
</fieldset>