open-vault/ui/app/templates/partials/tools/wrap.hbs

<PageHeader as |p|>
  <p.levelLeft>
    <h1 class="title is-3">
      Wrap data
    </h1>
  </p.levelLeft>
</PageHeader>

{{#if token}}
  <div class="box is-sideless is-fullwidth is-marginless">
    <div class="field">
      <label for="wrap-info" class="is-label">Wrapping token</label>
      <div class="control">
        <Textarea @value={{token}} @readonly={{true}} class="textarea" @id="wrap-info" @name="wrap-info" data-test-tools-input="wrapping-token" />
      </div>
    </div>
  </div>
  <div class="field is-grouped box is-fullwidth is-bottomless">
     <div class="control">
      <CopyButton @clipboardText={{token}} @class="button is-primary" @buttonType="button" @success={{action (set-flash-message "Token copied!")}}>
        Copy
      </CopyButton>
    </div>
    <div class="control">
      <button {{action 'onClear'}} type="button" class="button">
        Back
      </button>
    </div>
  </div>
{{else}}
  <div class="box is-sideless is-fullwidth is-marginless">
    <NamespaceReminder @mode="perform" @noun={{selectedAction}} />
    <MessageError @errors={{errors}} />
    <div class="field">
      <div class="control">
        <JsonEditor @title="Data to wrap" 
          @subTitle="json-formatted"
          @value={{data}} 
          @valueUpdated={{action "codemirrorUpdated"}} />
      </div>
    </div>
    <TtlPicker2
      @label="Wrap TTL"
      @initialValue="30m"
      @onChange={{action 'updateTtl'}}
      @helperTextDisabled="Vault will use the default (30m)"
      @helperTextEnabled="Wrap will expire after"
      @changeOnInit={{true}}
    />
  </div>
  <div class="field is-grouped box is-fullwidth is-bottomless">
    <div class="control">
      <button type="submit" class="button is-primary" data-test-tools-submit="true" disabled={{buttonDisabled}}>
        Wrap data
      </button>
    </div>
  </div>
{{/if}}