<form class='{{cssClass}}' autocomplete='off'>
  <header class='sheet-header'>
    <img
      class='profile-img'
      src='{{item.img}}'
      data-edit='img'
      title='{{item.name}}'
    />
    <div class='header-fields'>
      <h1 class='charname'><input
          name='name'
          type='text'
          value='{{item.name}}'
          placeholder='Name'
        /></h1>
    </div>
  </header>

  {{! Sheet Tab Navigation }}
  <nav class='sheet-tabs tabs' data-group='primary'>
    <a class='item' data-tab='description'>Description</a>
    <a class='item' data-tab='attributes'>Attributes</a>
  </nav>

  {{! Sheet Body }}
  <section class='sheet-body'>

    {{! Description Tab }}
    <div class='tab' data-group='primary' data-tab='description'>
      {{! Editors must receive enriched text data from getData to properly handle rolls }}
      {{editor
        enrichedDescription
        target='system.description'
        engine='prosemirror'
        button=true
        editable=editable
      }}
    </div>

    {{! Attributes Tab }}
    <div class='tab attributes' data-group='primary' data-tab='attributes'>
      {{! As you add new fields, add them in here! }}
      <div class='resource'>
        <label class='resource-label'>Spell Level</label>
        <input
          type='text'
          name='system.spellLevel'
          value='{{system.spellLevel}}'
          data-dtype='Number'
        />
      </div>
    </div>
  </section>
</form>