<LinkTo
  @route="permissions.index"
  class="uk-button uk-padding-remove uk-margin-small-bottom"
  data-test-back
>
  <UkIcon @icon="arrow-left" @ratio="1.5" />
  {{t "emeis.form.back"}}
</LinkTo>
<EditForm @model={{@model}} @updateModel={{this.updateModel}}>
  <EditForm::Element @label={{t "emeis.permissions.headings.slug"}}>
    <input
      class="uk-input"
      type="text"
      name="slug"
      pattern="^[-a-zA-Z0-9_]+$"
      required
      disabled={{not @model.isNew}}
      value={{@model.slug}}
    />
    <span class="uk-text-meta">
      {{t "emeis.form.slug-hint"}}
    </span>
  </EditForm::Element>

  <EditForm::Element @label={{t "emeis.permissions.headings.name"}}>
    <input
      class="uk-input"
      type="text"
      name="name"
      placeholder="{{t 'emeis.permissions.headings.name'}}..."
      required
      value={{@model.name}}
    />
  </EditForm::Element>

  <EditForm::Element @label={{t "emeis.permissions.headings.description"}}>
    <textarea
      class="uk-textarea"
      rows="5"
      name="description"
      placeholder="{{t 'emeis.permissions.headings.description'}}..."
      value={{@model.description}}
      required
    ></textarea>
  </EditForm::Element>

  <EditForm::Element @label={{t "emeis.permissions.headings.roles"}}>
    <RelationshipSelect
      @modelName="role"
      @selected={{@model.roles}}
      @placeholder="{{t 'emeis.permissions.headings.roles'}}..."
      @onChange={{this.setRoles}}
      @multiple="true"
      required
      as |role|
    >
      {{role.name}}
    </RelationshipSelect>
  </EditForm::Element>

  {{#each this.metaFields as |field|}}
    <MetaField
      @field={{field}}
      @model={{@model}}
      @optional={{unless field.required true}}
      data-test-meta-field={{field.slug}}
    />
  {{/each}}

</EditForm>