<div
    selectable="1"
    ngfDrop
    [(validDrag)]    = "baseDropValid"
    (fileOver)       = "hasBaseDropZoneOver=$event"
    [(files)]        = "files"
    [accept]         = "accept"
    [maxSize]        = "maxSize"
    [(dragFiles)]    = "dragFiles"
    [(lastInvalids)] = "lastInvalids"
    class            = "documentUpload my-drop-zone"
    [class.invalid-drag] = "baseDropValid===false"
    [class.valid-drag]   = "baseDropValid"
    (filesChange) = "lastFileAt=getDate()">
    <div class="row defaultLayout">
            <div class="col-4 documentUpload_left">
                <img src="{{data.image}}" alt=""/>
                <b>{{data?.title}}</b>
                <span>{{data?.text}}</span>
              </div>
              <div class="col-8 documentUpload_right">
                    <div class="documentUpload_right--dropzone-table row">
                        <app-data-table class="dataTable"
                        (actionMenuDisplay)="actionMenuClick($event)"
                        ></app-data-table>
                    </div>
                    <div class="documentUpload_right--dropzone row">
                          <input type="file" id="fileLoader" name="files" title="Load File" #tref />
                          <button type="button" (click)="openfileDialog();">+ Upload File</button>
                            <div class="documentUpload_right--dropbox" >
                                <b>Or drop them within this section.</b><small>(10mb size limit per uploaded file)</small>
                            </div>
                      </div>
        </div>
</div>