[{"__symbolic":"module","version":3,"metadata":{"SkyFileDropComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"sky-file-drop","template":"<div\n  class=\"sky-file-drop-row\" [ngClass]=\"{ 'sky-file-drop-allow-links': allowLinks }\">\n  <div\n    class=\"sky-file-drop-col\"\n    [ngClass]=\"{ 'sky-file-drop-accept': acceptedOver, 'sky-file-drop-reject': rejectedOver }\">\n\n    <button\n      class=\"sky-file-drop sky-file-drop-target\"\n      type=\"button\"\n      (click)=\"dropClicked()\"\n      (dragover)=\"fileDragOver($event)\"\n      (dragenter)=\"fileDragEnter($event)\"\n      (dragleave)=\"fileDragLeave($event)\"\n      (drop)=\"fileDrop($event)\"\n      [attr.aria-label]=\"'file_upload_drag_or_click' | skyResources\">\n    </button>\n\n    <input\n      tabindex=\"-1\"\n      aria-hidden=\"true\"\n      type=\"file\"\n      class=\"sky-file-input-hidden\"\n      [attr.multiple]=\"multiple ? multiple: null\"\n      [attr.accept]=\"acceptedTypes ? acceptedTypes: null\"\n      (change)=\"fileChangeEvent($event)\"\n      #fileInput>\n\n    <div class=\"sky-file-drop-contents\" *ngIf=\"customEl.children.length === 0\">\n      <div class=\"sky-file-drop-contents-not-over\">\n        <div class=\"sky-file-drop-text-header\">\n          {{ 'file_upload_drag_file_here' | skyResources }}\n        </div>\n        <div class=\"sky-file-drop-text\">\n          {{ 'file_upload_or_click_to_browse' | skyResources }}\n        </div>\n        <i class=\"fa fa-cloud-upload sky-file-upload-icon\"></i>\n      </div>\n\n      <!-- This will appear when file is dragged over and is valid -->\n      <div class=\"sky-file-drop-contents-accept\" >\n        <div class=\"sky-file-drop-text-header\">\n          {{ 'file_upload_drop_files_here' | skyResources }}\n        </div>\n        <i class=\"fa fa-bullseye sky-file-upload-icon\"></i>\n      </div>\n\n      <!-- This will appear when file is dragged over and is invalid -->\n      <div class=\"sky-file-drop-contents-reject\" >\n        <div class=\"sky-file-drop-text-header\">\n          {{ 'file_upload_invalid_file' | skyResources }}\n        </div>\n        <i class=\"fa fa-times-circle sky-file-upload-icon\"></i>\n      </div>\n    </div>\n\n    <div class=\"sky-file-drop-contents-custom\" #customEl>\n      <ng-content></ng-content>\n    </div>\n  </div>\n  <div class=\"sky-file-drop-col\" *ngIf=\"allowLinks\">\n    <div class=\"sky-file-drop-contents\">\n      <div class=\"sky-file-drop-link\">\n        <div class=\"sky-file-drop-link-header\">\n          <div class=\"sky-file-drop-text-header\">\n            {{ 'file_upload_paste_link' | skyResources }}\n          </div>\n        </div>\n        <div class=\"sky-form-group\">\n          <input\n            type=\"text\"\n            class=\"sky-form-control\"\n            [attr.placeholder]=\"'file_upload_link_placeholder' | skyResources\"\n            [(ngModel)]=\"linkUrl\"\n            (keyup)=\"addLinkEnter($event)\"\n            [attr.aria-label]=\"'file_upload_link_input' | skyResources\">\n        </div>\n        <button\n          type=\"button\"\n          class=\"sky-btn sky-btn-primary\"\n          [disabled]=\"!linkUrl\"\n          (click)=\"addLink($event)\">\n          {{ 'file_upload_paste_link_done' | skyResources }}\n        </button>\n      </div>\n    </div>\n  </div>\n</div>\n","styles":[".sky-file-drop-col {\n  margin-bottom: 10px;\n  padding-left: 5px;\n  padding-right: 5px;\n  position: relative;\n}\n\n@media (min-width: 768px) {\n  .sky-file-drop-row {\n    display: flex;\n  }\n  .sky-file-drop-col {\n    flex-basis: 100%;\n  }\n  .sky-file-drop-allow-links.sky-file-drop-col {\n    flex-basis: 50%;\n  }\n}\n\nbutton.sky-file-drop {\n  height: 100%;\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 1;\n}\n\nbutton.sky-file-drop:hover {\n  cursor: pointer;\n}\n\n.sky-file-drop-contents {\n  border-top: 1px solid #cdcfd2;\n  border-bottom: 1px solid #cdcfd2;\n  border-left: 1px solid #cdcfd2;\n  border-right: 1px solid #cdcfd2;\n  background-color: #eeeeef;\n  padding: 10px;\n  color: #282b31;\n  cursor: pointer;\n  width: 100%;\n  text-align: center;\n  height: 100%;\n}\n\n.sky-file-drop-contents .sky-file-drop-link-header {\n  margin-bottom: 5px;\n}\n\n.sky-file-drop-noclick .sky-file-drop-contents {\n  cursor: default;\n}\n\n.sky-file-drop-accept .sky-file-drop-contents,\n.sky-file-drop-reject .sky-file-drop-contents {\n  border-style: dashed;\n  border-width: 1px;\n}\n\n.sky-file-drop-accept .sky-file-drop-contents-not-over,\n.sky-file-drop-reject .sky-file-drop-contents-not-over {\n  display: none;\n}\n\n.sky-file-drop-accept .sky-file-drop-contents {\n  border-color: #71bf43;\n  color: #282b31;\n}\n\n.sky-file-drop-accept .sky-file-drop-contents-accept {\n  display: block;\n}\n\n.sky-file-drop-reject .sky-file-drop-contents {\n  border-color: #ef4044;\n  color: #282b31;\n}\n\n.sky-file-drop-reject .sky-file-drop-contents-reject {\n  display: block;\n}\n\n.sky-file-drop-contents-accept,\n.sky-file-drop-contents-reject {\n  display: none;\n}\n\n.sky-file-upload-icon {\n  display: block;\n  font-size: 40px;\n  margin-top: 10px;\n}\n\n.sky-file-drop-link {\n  cursor: default;\n}\n\n.sky-file-drop-text-header {\n  font-family: \"Blackbaud Sans Condensed\", \"Helvetica Neue Condensed\", \"Arial Narrow\";\n  color: #282b31;\n  font-weight: 500;\n  font-size: 22px;\n  margin: 0;\n}\n\n.sky-file-drop-text {\n  font-size: 15px;\n  margin-top: 5px;\n  margin-bottom: 20px;\n}\n\n.sky-file-drop-text,\n.sky-file-drop-text-header {\n  line-height: 1.1;\n  display: block;\n}\n\n.sky-file-upload-icon {\n  color: #686c73;\n}\n\n.sky-file-drop {\n  background-color: transparent;\n  border: none;\n  display: block;\n  -webkit-appearance: none;\n  width: 100%;\n  padding: 0;\n}\n\n.sky-file-input-hidden {\n  display: none;\n}\n"]}]}],"members":{"filesChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"linkChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"minFileSize":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"maxFileSize":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"multiple":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"validateFn":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"acceptedTypes":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"noClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"allowLinks":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputEl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["fileInput"]}]}],"dropClicked":[{"__symbolic":"method"}],"fileChangeEvent":[{"__symbolic":"method"}],"fileDragEnter":[{"__symbolic":"method"}],"fileDragOver":[{"__symbolic":"method"}],"fileDrop":[{"__symbolic":"method"}],"fileDragLeave":[{"__symbolic":"method"}],"addLinkEnter":[{"__symbolic":"method"}],"addLink":[{"__symbolic":"method"}],"emitFileChangeEvent":[{"__symbolic":"method"}],"filesRejected":[{"__symbolic":"method"}],"loadFile":[{"__symbolic":"method"}],"getMimeSubtype":[{"__symbolic":"method"}],"getMimeMainType":[{"__symbolic":"method"}],"fileTypeInArray":[{"__symbolic":"method"}],"fileTypeRejected":[{"__symbolic":"method"}],"handleFiles":[{"__symbolic":"method"}],"verifyDropFiles":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"SkyFileDropComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"sky-file-drop","template":"<div\n  class=\"sky-file-drop-row\" [ngClass]=\"{ 'sky-file-drop-allow-links': allowLinks }\">\n  <div\n    class=\"sky-file-drop-col\"\n    [ngClass]=\"{ 'sky-file-drop-accept': acceptedOver, 'sky-file-drop-reject': rejectedOver }\">\n\n    <button\n      class=\"sky-file-drop sky-file-drop-target\"\n      type=\"button\"\n      (click)=\"dropClicked()\"\n      (dragover)=\"fileDragOver($event)\"\n      (dragenter)=\"fileDragEnter($event)\"\n      (dragleave)=\"fileDragLeave($event)\"\n      (drop)=\"fileDrop($event)\"\n      [attr.aria-label]=\"'file_upload_drag_or_click' | skyResources\">\n    </button>\n\n    <input\n      tabindex=\"-1\"\n      aria-hidden=\"true\"\n      type=\"file\"\n      class=\"sky-file-input-hidden\"\n      [attr.multiple]=\"multiple ? multiple: null\"\n      [attr.accept]=\"acceptedTypes ? acceptedTypes: null\"\n      (change)=\"fileChangeEvent($event)\"\n      #fileInput>\n\n    <div class=\"sky-file-drop-contents\" *ngIf=\"customEl.children.length === 0\">\n      <div class=\"sky-file-drop-contents-not-over\">\n        <div class=\"sky-file-drop-text-header\">\n          {{ 'file_upload_drag_file_here' | skyResources }}\n        </div>\n        <div class=\"sky-file-drop-text\">\n          {{ 'file_upload_or_click_to_browse' | skyResources }}\n        </div>\n        <i class=\"fa fa-cloud-upload sky-file-upload-icon\"></i>\n      </div>\n\n      <!-- This will appear when file is dragged over and is valid -->\n      <div class=\"sky-file-drop-contents-accept\" >\n        <div class=\"sky-file-drop-text-header\">\n          {{ 'file_upload_drop_files_here' | skyResources }}\n        </div>\n        <i class=\"fa fa-bullseye sky-file-upload-icon\"></i>\n      </div>\n\n      <!-- This will appear when file is dragged over and is invalid -->\n      <div class=\"sky-file-drop-contents-reject\" >\n        <div class=\"sky-file-drop-text-header\">\n          {{ 'file_upload_invalid_file' | skyResources }}\n        </div>\n        <i class=\"fa fa-times-circle sky-file-upload-icon\"></i>\n      </div>\n    </div>\n\n    <div class=\"sky-file-drop-contents-custom\" #customEl>\n      <ng-content></ng-content>\n    </div>\n  </div>\n  <div class=\"sky-file-drop-col\" *ngIf=\"allowLinks\">\n    <div class=\"sky-file-drop-contents\">\n      <div class=\"sky-file-drop-link\">\n        <div class=\"sky-file-drop-link-header\">\n          <div class=\"sky-file-drop-text-header\">\n            {{ 'file_upload_paste_link' | skyResources }}\n          </div>\n        </div>\n        <div class=\"sky-form-group\">\n          <input\n            type=\"text\"\n            class=\"sky-form-control\"\n            [attr.placeholder]=\"'file_upload_link_placeholder' | skyResources\"\n            [(ngModel)]=\"linkUrl\"\n            (keyup)=\"addLinkEnter($event)\"\n            [attr.aria-label]=\"'file_upload_link_input' | skyResources\">\n        </div>\n        <button\n          type=\"button\"\n          class=\"sky-btn sky-btn-primary\"\n          [disabled]=\"!linkUrl\"\n          (click)=\"addLink($event)\">\n          {{ 'file_upload_paste_link_done' | skyResources }}\n        </button>\n      </div>\n    </div>\n  </div>\n</div>\n","styles":[".sky-file-drop-col {\n  margin-bottom: 10px;\n  padding-left: 5px;\n  padding-right: 5px;\n  position: relative;\n}\n\n@media (min-width: 768px) {\n  .sky-file-drop-row {\n    display: flex;\n  }\n  .sky-file-drop-col {\n    flex-basis: 100%;\n  }\n  .sky-file-drop-allow-links.sky-file-drop-col {\n    flex-basis: 50%;\n  }\n}\n\nbutton.sky-file-drop {\n  height: 100%;\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 1;\n}\n\nbutton.sky-file-drop:hover {\n  cursor: pointer;\n}\n\n.sky-file-drop-contents {\n  border-top: 1px solid #cdcfd2;\n  border-bottom: 1px solid #cdcfd2;\n  border-left: 1px solid #cdcfd2;\n  border-right: 1px solid #cdcfd2;\n  background-color: #eeeeef;\n  padding: 10px;\n  color: #282b31;\n  cursor: pointer;\n  width: 100%;\n  text-align: center;\n  height: 100%;\n}\n\n.sky-file-drop-contents .sky-file-drop-link-header {\n  margin-bottom: 5px;\n}\n\n.sky-file-drop-noclick .sky-file-drop-contents {\n  cursor: default;\n}\n\n.sky-file-drop-accept .sky-file-drop-contents,\n.sky-file-drop-reject .sky-file-drop-contents {\n  border-style: dashed;\n  border-width: 1px;\n}\n\n.sky-file-drop-accept .sky-file-drop-contents-not-over,\n.sky-file-drop-reject .sky-file-drop-contents-not-over {\n  display: none;\n}\n\n.sky-file-drop-accept .sky-file-drop-contents {\n  border-color: #71bf43;\n  color: #282b31;\n}\n\n.sky-file-drop-accept .sky-file-drop-contents-accept {\n  display: block;\n}\n\n.sky-file-drop-reject .sky-file-drop-contents {\n  border-color: #ef4044;\n  color: #282b31;\n}\n\n.sky-file-drop-reject .sky-file-drop-contents-reject {\n  display: block;\n}\n\n.sky-file-drop-contents-accept,\n.sky-file-drop-contents-reject {\n  display: none;\n}\n\n.sky-file-upload-icon {\n  display: block;\n  font-size: 40px;\n  margin-top: 10px;\n}\n\n.sky-file-drop-link {\n  cursor: default;\n}\n\n.sky-file-drop-text-header {\n  font-family: \"Blackbaud Sans Condensed\", \"Helvetica Neue Condensed\", \"Arial Narrow\";\n  color: #282b31;\n  font-weight: 500;\n  font-size: 22px;\n  margin: 0;\n}\n\n.sky-file-drop-text {\n  font-size: 15px;\n  margin-top: 5px;\n  margin-bottom: 20px;\n}\n\n.sky-file-drop-text,\n.sky-file-drop-text-header {\n  line-height: 1.1;\n  display: block;\n}\n\n.sky-file-upload-icon {\n  color: #686c73;\n}\n\n.sky-file-drop {\n  background-color: transparent;\n  border: none;\n  display: block;\n  -webkit-appearance: none;\n  width: 100%;\n  padding: 0;\n}\n\n.sky-file-input-hidden {\n  display: none;\n}\n"]}]}],"members":{"filesChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"linkChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"minFileSize":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"maxFileSize":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"multiple":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"validateFn":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"acceptedTypes":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"noClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"allowLinks":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"inputEl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["fileInput"]}]}],"dropClicked":[{"__symbolic":"method"}],"fileChangeEvent":[{"__symbolic":"method"}],"fileDragEnter":[{"__symbolic":"method"}],"fileDragOver":[{"__symbolic":"method"}],"fileDrop":[{"__symbolic":"method"}],"fileDragLeave":[{"__symbolic":"method"}],"addLinkEnter":[{"__symbolic":"method"}],"addLink":[{"__symbolic":"method"}],"emitFileChangeEvent":[{"__symbolic":"method"}],"filesRejected":[{"__symbolic":"method"}],"loadFile":[{"__symbolic":"method"}],"getMimeSubtype":[{"__symbolic":"method"}],"getMimeMainType":[{"__symbolic":"method"}],"fileTypeInArray":[{"__symbolic":"method"}],"fileTypeRejected":[{"__symbolic":"method"}],"handleFiles":[{"__symbolic":"method"}],"verifyDropFiles":[{"__symbolic":"method"}]}}}}]