@blackbaud/skyux/dist/modules/fileattachments/file-item.component.metadata.json

SKY UX built on Angular 2

[{"__symbolic":"module","version":3,"metadata":{"SkyFileItemComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"sky-file-item","template":"<div class=\"sky-file-item\">\n    <div class=\"sky-file-item-title\">\n        <div class=\"sky-file-item-name-container\">\n            <div class=\"sky-file-item-name\">\n                <strong *ngIf=\"isFile()\">{{fileItem.file.name || fileItem.url}}</strong>\n                <strong *ngIf=\"!isFile()\">{{fileItem.url}}</strong>\n            </div>\n            <div class=\"sky-file-item-size\" *ngIf=\"isFile()\">\n                ({{fileItem.file.size | skyFileSize}})\n            </div>\n        </div>\n        <div class=\"sky-pull-right\">\n          <button type=\"button\" class=\"sky-btn sky-btn-default sky-file-item-btn-delete\" [attr.aria-label]=\"'file_item_delete' | skyResources\" (click)=\"itemDelete()\">\n              <i class=\"fa fa-lg fa-trash-o\"></i>\n          </button>\n        </div>\n    </div>\n    <div class=\"sky-file-item-content\">\n        <div class=\"sky-file-item-preview\">\n            <div *ngIf=\"isImg()\" class=\"sky-file-item-preview-img-container\">\n              <img class=\"sky-file-item-preview-img\" [src]=\"fileItem.url\" />\n            </div>\n            <div *ngIf=\"!isImg()\" class=\"sky-file-item-preview-other\">\n                <i class=\"fa\" [ngClass]=\"otherCls\"></i>\n            </div>\n        </div>\n        <div class=\"sky-file-item-content-custom\">\n          <ng-content></ng-content>\n        </div>\n    </div>\n</div>\n","styles":[".sky-file-item{border-top:1px solid #e2e3e4;border-bottom:1px solid #e2e3e4;border-left:1px solid #e2e3e4;border-right:1px solid #e2e3e4;background-color:#eeeeef;padding:10px;margin-bottom:10px}.sky-file-item-name-container{display:inline-block;width:85%}.sky-file-item-name{white-space:nowrap;overflow:hidden;-ms-text-overflow:ellipsis;-o-text-overflow:ellipsis;text-overflow:ellipsis}.sky-file-item-title{margin-bottom:10px}.sky-file-item-content{display:flex}.sky-file-item-preview{flex-basis:25%}.sky-file-item-content-custom{flex-basis:75%}.sky-file-item-preview-img-container{text-align:center}.sky-file-item-preview-img{max-width:100%;height:auto;box-shadow:0 0 5px #666}.sky-file-item-preview-other{color:#686c73;font-size:100px;line-height:1;text-align:center;width:100%}\n"]}]}],"members":{"fileItem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"deleteFile":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"ngDoCheck":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"KeyValueDiffers"}]}],"itemDelete":[{"__symbolic":"method"}],"isFile":[{"__symbolic":"method"}],"isImg":[{"__symbolic":"method"}],"getFileExtensionUpper":[{"__symbolic":"method"}],"getFileTypeUpper":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"SkyFileItemComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"sky-file-item","template":"<div class=\"sky-file-item\">\n    <div class=\"sky-file-item-title\">\n        <div class=\"sky-file-item-name-container\">\n            <div class=\"sky-file-item-name\">\n                <strong *ngIf=\"isFile()\">{{fileItem.file.name || fileItem.url}}</strong>\n                <strong *ngIf=\"!isFile()\">{{fileItem.url}}</strong>\n            </div>\n            <div class=\"sky-file-item-size\" *ngIf=\"isFile()\">\n                ({{fileItem.file.size | skyFileSize}})\n            </div>\n        </div>\n        <div class=\"sky-pull-right\">\n          <button type=\"button\" class=\"sky-btn sky-btn-default sky-file-item-btn-delete\" [attr.aria-label]=\"'file_item_delete' | skyResources\" (click)=\"itemDelete()\">\n              <i class=\"fa fa-lg fa-trash-o\"></i>\n          </button>\n        </div>\n    </div>\n    <div class=\"sky-file-item-content\">\n        <div class=\"sky-file-item-preview\">\n            <div *ngIf=\"isImg()\" class=\"sky-file-item-preview-img-container\">\n              <img class=\"sky-file-item-preview-img\" [src]=\"fileItem.url\" />\n            </div>\n            <div *ngIf=\"!isImg()\" class=\"sky-file-item-preview-other\">\n                <i class=\"fa\" [ngClass]=\"otherCls\"></i>\n            </div>\n        </div>\n        <div class=\"sky-file-item-content-custom\">\n          <ng-content></ng-content>\n        </div>\n    </div>\n</div>\n","styles":[".sky-file-item{border-top:1px solid #e2e3e4;border-bottom:1px solid #e2e3e4;border-left:1px solid #e2e3e4;border-right:1px solid #e2e3e4;background-color:#eeeeef;padding:10px;margin-bottom:10px}.sky-file-item-name-container{display:inline-block;width:85%}.sky-file-item-name{white-space:nowrap;overflow:hidden;-ms-text-overflow:ellipsis;-o-text-overflow:ellipsis;text-overflow:ellipsis}.sky-file-item-title{margin-bottom:10px}.sky-file-item-content{display:flex}.sky-file-item-preview{flex-basis:25%}.sky-file-item-content-custom{flex-basis:75%}.sky-file-item-preview-img-container{text-align:center}.sky-file-item-preview-img{max-width:100%;height:auto;box-shadow:0 0 5px #666}.sky-file-item-preview-other{color:#686c73;font-size:100px;line-height:1;text-align:center;width:100%}\n"]}]}],"members":{"fileItem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"deleteFile":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"ngDoCheck":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"KeyValueDiffers"}]}],"itemDelete":[{"__symbolic":"method"}],"isFile":[{"__symbolic":"method"}],"isImg":[{"__symbolic":"method"}],"getFileExtensionUpper":[{"__symbolic":"method"}],"getFileTypeUpper":[{"__symbolic":"method"}]}}}}]