<script type="text/x-template" class="lifecycle-inspector-template" data-type="line">
    <div class="line">
        <table>
         <tr>
           <td><&|/l&>Label</&>:</td>
           <td><input type="text" name="label" value="{{line.label}}" /></td>
         </tr>

         <tr>
           <td><&|/l&>Start Marker</&>:</td>
           <td><select name="startMarker">
             {{#select line.startMarker}}
               <option value="none"><&|/l&>none</&></option>
               <option value="arrowhead"><&|/l&>arrowhead</&></option>
               <option value="diamond"><&|/l&>diamond</&></option>
             {{/select}}
           </select><td>
         </tr>

         <tr>
           <td><&|/l&>End Marker</&>:</td>
           <td><select name="endMarker">
             {{#select line.endMarker}}
               <option value="none"><&|/l&>none</&></option>
               <option value="arrowhead"><&|/l&>arrowhead</&></option>
               <option value="diamond"><&|/l&>diamond</&></option>
             {{/select}}
           </select></td>
         </tr>

         <tr>
           <td><&|/l&>Style</&>:</td>
           <td><select name="style">
             {{#select line.style}}
               <option value="solid"><&|/l&>solid</&></option>
               <option value="dashed"><&|/l&>dashed</&></option>
               <option value="dotted"><&|/l&>dotted</&></option>
             {{/select}}
           </select></td>
          </tr>
        </table>

        <button class="clone"><&|/l&>Clone Line</&></button><br>
        <button class="delete"><&|/l&>Delete Line</&></button>
    </div>
</script>
