@skyux/avatar 8.0.0-beta.4 → 8.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/documentation.json +315 -330
- package/esm2020/lib/modules/avatar/avatar-adapter.service.mjs +3 -3
- package/esm2020/lib/modules/avatar/avatar.component.mjs +3 -3
- package/esm2020/lib/modules/avatar/avatar.inner.component.mjs +3 -3
- package/esm2020/lib/modules/avatar/avatar.module.mjs +4 -4
- package/esm2020/lib/modules/shared/sky-avatar-resources.module.mjs +4 -4
- package/fesm2015/skyux-avatar.mjs +17 -17
- package/fesm2020/skyux-avatar.mjs +17 -17
- package/package.json +9 -9
|
@@ -43,9 +43,9 @@ _SkyAvatarAdapterService_blobUrl = new WeakMap(), _SkyAvatarAdapterService_insta
|
|
|
43
43
|
__classPrivateFieldSet(this, _SkyAvatarAdapterService_blobUrl, undefined, "f");
|
|
44
44
|
}
|
|
45
45
|
};
|
|
46
|
-
SkyAvatarAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.
|
|
47
|
-
SkyAvatarAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.
|
|
48
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.
|
|
46
|
+
SkyAvatarAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarAdapterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
47
|
+
SkyAvatarAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarAdapterService });
|
|
48
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarAdapterService, decorators: [{
|
|
49
49
|
type: Injectable
|
|
50
50
|
}] });
|
|
51
51
|
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXZhdGFyLWFkYXB0ZXIuc2VydmljZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy9hdmF0YXIvc3JjL2xpYi9tb2R1bGVzL2F2YXRhci9hdmF0YXItYWRhcHRlci5zZXJ2aWNlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7O0FBQUEsT0FBTyxFQUFjLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFJdkQ7O0dBRUc7QUFFSCxNQUFNLE9BQU8sdUJBQXVCO0lBRHBDOztRQUVFLG1EQUE2QjtLQTRDOUI7SUExQ1EsV0FBVyxDQUFDLFVBQXNCLEVBQUUsR0FBaUI7UUFDMUQsdUJBQUEsSUFBSSxrRkFBZSxNQUFuQixJQUFJLENBQWlCLENBQUM7UUFFdEIsTUFBTSxFQUFFLEdBQUcsVUFBVSxDQUFDLGFBQWEsQ0FBQztRQUVwQyx5QkFBeUI7UUFDekIsSUFBSSxFQUFFLEVBQUU7WUFDTixNQUFNLE9BQU8sR0FBRyxFQUFFLENBQUMsYUFBYSxDQUFDLG1CQUFtQixDQUFDLENBQUM7WUFFdEQseUJBQXlCO1lBQ3pCLElBQUksT0FBTyxFQUFFO2dCQUNYLElBQUksR0FBRyxHQUFHLEdBQUcsQ0FBQztnQkFFZCxJQUFJLEdBQUcsWUFBWSxJQUFJLElBQUksR0FBRyxZQUFZLElBQUksRUFBRTtvQkFDOUMsR0FBRyxHQUFHLHVCQUFBLElBQUksa0ZBQWUsTUFBbkIsSUFBSSxFQUFnQixHQUFHLENBQUMsQ0FBQztpQkFDaEM7Z0JBRUQsaUZBQWlGO2dCQUNqRixPQUFPLENBQUMsS0FBSyxDQUFDLGVBQWUsR0FBRyxPQUFPLEdBQUcsR0FBRyxHQUFHLElBQUksQ0FBQzthQUN0RDtTQUNGO0lBQ0gsQ0FBQztJQUVNLE9BQU87UUFDWix1QkFBQSxJQUFJLGtGQUFlLE1BQW5CLElBQUksQ0FBaUIsQ0FBQztJQUN4QixDQUFDOzsrTEFFYyxHQUFnQjtJQUM3QixNQUFNLEdBQUcsR0FBRyxHQUFHLENBQUMsZUFBZSxDQUFDLEdBQUcsQ0FBQyxDQUFDO0lBRXJDLDJEQUEyRDtJQUMzRCx1RUFBdUU7SUFDdkUsdUJBQUEsSUFBSSxvQ0FBWSxHQUFHLE1BQUEsQ0FBQztJQUNwQixPQUFPLEdBQUcsQ0FBQztBQUNiLENBQUM7SUFHQyxJQUFJLHVCQUFBLElBQUksd0NBQVMsRUFBRTtRQUNqQixHQUFHLENBQUMsZUFBZSxDQUFDLHVCQUFBLElBQUksd0NBQVMsQ0FBQyxDQUFDO1FBQ25DLHVCQUFBLElBQUksb0NBQVksU0FBUyxNQUFBLENBQUM7S0FDM0I7QUFDSCxDQUFDO29IQTVDVSx1QkFBdUI7d0hBQXZCLHVCQUF1QjsyRkFBdkIsdUJBQXVCO2tCQURuQyxVQUFVIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRWxlbWVudFJlZiwgSW5qZWN0YWJsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5pbXBvcnQgeyBTa3lBdmF0YXJTcmMgfSBmcm9tICcuL2F2YXRhci1zcmMnO1xuXG4vKipcbiAqIEBpbnRlcm5hbFxuICovXG5ASW5qZWN0YWJsZSgpXG5leHBvcnQgY2xhc3MgU2t5QXZhdGFyQWRhcHRlclNlcnZpY2Uge1xuICAjYmxvYlVybDogc3RyaW5nIHwgdW5kZWZpbmVkO1xuXG4gIHB1YmxpYyB1cGRhdGVJbWFnZShlbGVtZW50UmVmOiBFbGVtZW50UmVmLCBzcmM6IFNreUF2YXRhclNyYykge1xuICAgIHRoaXMuI3Jldm9rZUJsb2JVcmwoKTtcblxuICAgIGNvbnN0IGVsID0gZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50O1xuXG4gICAgLyppc3RhbmJ1bCBpZ25vcmUgZWxzZSAqL1xuICAgIGlmIChlbCkge1xuICAgICAgY29uc3QgaW1hZ2VFbCA9IGVsLnF1ZXJ5U2VsZWN0b3IoJy5za3ktYXZhdGFyLWltYWdlJyk7XG5cbiAgICAgIC8qaXN0YW5idWwgaWdub3JlIGVsc2UgKi9cbiAgICAgIGlmIChpbWFnZUVsKSB7XG4gICAgICAgIGxldCB1cmwgPSBzcmM7XG5cbiAgICAgICAgaWYgKHNyYyBpbnN0YW5jZW9mIEZpbGUgfHwgc3JjIGluc3RhbmNlb2YgQmxvYikge1xuICAgICAgICAgIHVybCA9IHRoaXMuI2NyZWF0ZUJsb2JVcmwoc3JjKTtcbiAgICAgICAgfVxuXG4gICAgICAgIC8vIE5vdGljZSB0aGUgcXVvdGVzIGluc2lkZSB0aGUgYHVybGAgZnVuY3Rpb24uIFRoaXMgZW5zdXJlcyBwcm9wZXIgdXJsIGVzY2FwaW5nLlxuICAgICAgICBpbWFnZUVsLnN0eWxlLmJhY2tncm91bmRJbWFnZSA9ICd1cmwoXCInICsgdXJsICsgJ1wiKSc7XG4gICAgICB9XG4gICAgfVxuICB9XG5cbiAgcHVibGljIGRlc3Ryb3koKSB7XG4gICAgdGhpcy4jcmV2b2tlQmxvYlVybCgpO1xuICB9XG5cbiAgI2NyZWF0ZUJsb2JVcmwoc3JjOiBCbG9iIHwgRmlsZSkge1xuICAgIGNvbnN0IHVybCA9IFVSTC5jcmVhdGVPYmplY3RVUkwoc3JjKTtcblxuICAgIC8vIEtlZXAgdGhlIGxhc3QgYmxvYiBVUkwgYXJvdW5kIHNvIHdlIGNhbiByZXZva2UgaXQgbGF0ZXIuXG4gICAgLy8gaHR0cHM6Ly9kZXZlbG9wZXIubW96aWxsYS5vcmcvZW4tVVMvZG9jcy9XZWIvQVBJL1VSTC9yZXZva2VPYmplY3RVUkxcbiAgICB0aGlzLiNibG9iVXJsID0gdXJsO1xuICAgIHJldHVybiB1cmw7XG4gIH1cblxuICAjcmV2b2tlQmxvYlVybCgpIHtcbiAgICBpZiAodGhpcy4jYmxvYlVybCkge1xuICAgICAgVVJMLnJldm9rZU9iamVjdFVSTCh0aGlzLiNibG9iVXJsKTtcbiAgICAgIHRoaXMuI2Jsb2JVcmwgPSB1bmRlZmluZWQ7XG4gICAgfVxuICB9XG59XG4iXX0=
|
|
@@ -115,9 +115,9 @@ _SkyAvatarComponent__canChange = new WeakMap(), _SkyAvatarComponent__name = new
|
|
|
115
115
|
// TODO: Need to implement the async `getString` method in a breaking change.
|
|
116
116
|
return __classPrivateFieldGet(this, _SkyAvatarComponent_resourcesService, "f").getStringForLocale({ locale: 'en-US' }, key, ...args);
|
|
117
117
|
};
|
|
118
|
-
SkyAvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.
|
|
119
|
-
SkyAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.
|
|
120
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.
|
|
118
|
+
SkyAvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarComponent, deps: [{ token: i1.SkyErrorModalService }, { token: i2.SkyFileSizePipe }, { token: i3.SkyLibResourcesService }], target: i0.ɵɵFactoryTarget.Component });
|
|
119
|
+
SkyAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyAvatarComponent, selector: "sky-avatar", inputs: { canChange: "canChange", name: "name", src: "src", maxFileSize: "maxFileSize", size: "size" }, outputs: { avatarChanged: "avatarChanged" }, ngImport: i0, template: "<div class=\"sky-avatar\">\n <div *ngIf=\"canChange\">\n <div class=\"sky-avatar-file-drop\">\n <sky-file-drop\n [acceptedTypes]=\"'image/*'\"\n [fileUploadAriaLabel]=\"\n src\n ? ('skyux_avatar_upload_change_aria_label' | skyLibResources : name)\n : ('skyux_avatar_upload_new_aria_label' | skyLibResources : name)\n \"\n [multiple]=\"false\"\n [maxFileSize]=\"maxFileSize\"\n [multiple]=\"false\"\n (filesChanged)=\"photoDrop($event)\"\n >\n <ng-container *ngTemplateOutlet=\"innerTemplate\"></ng-container>\n </sky-file-drop>\n </div>\n </div>\n <div *ngIf=\"!canChange\">\n <ng-container *ngTemplateOutlet=\"innerTemplate\"></ng-container>\n </div>\n</div>\n\n<ng-template #innerTemplate>\n <sky-avatar-inner [name]=\"name\" [size]=\"size\" [src]=\"src\"></sky-avatar-inner>\n</ng-template>\n", styles: [".sky-avatar .sky-file-drop-col{flex-basis:initial}.sky-theme-modern .sky-file-drop:focus{outline:none}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.λ8, selector: "sky-file-drop", inputs: ["fileUploadAriaLabel", "linkUploadAriaLabel", "minFileSize", "maxFileSize", "multiple", "validateFn", "acceptedTypes", "noClick", "allowLinks"], outputs: ["filesChanged", "linkInputBlur", "linkChanged"] }, { kind: "component", type: i5.SkyAvatarInnerComponent, selector: "sky-avatar-inner", inputs: ["src", "name", "size"] }, { kind: "pipe", type: i3.SkyLibResourcesPipe, name: "skyLibResources" }], encapsulation: i0.ViewEncapsulation.None });
|
|
120
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarComponent, decorators: [{
|
|
121
121
|
type: Component,
|
|
122
122
|
args: [{ selector: 'sky-avatar', encapsulation: ViewEncapsulation.None, template: "<div class=\"sky-avatar\">\n <div *ngIf=\"canChange\">\n <div class=\"sky-avatar-file-drop\">\n <sky-file-drop\n [acceptedTypes]=\"'image/*'\"\n [fileUploadAriaLabel]=\"\n src\n ? ('skyux_avatar_upload_change_aria_label' | skyLibResources : name)\n : ('skyux_avatar_upload_new_aria_label' | skyLibResources : name)\n \"\n [multiple]=\"false\"\n [maxFileSize]=\"maxFileSize\"\n [multiple]=\"false\"\n (filesChanged)=\"photoDrop($event)\"\n >\n <ng-container *ngTemplateOutlet=\"innerTemplate\"></ng-container>\n </sky-file-drop>\n </div>\n </div>\n <div *ngIf=\"!canChange\">\n <ng-container *ngTemplateOutlet=\"innerTemplate\"></ng-container>\n </div>\n</div>\n\n<ng-template #innerTemplate>\n <sky-avatar-inner [name]=\"name\" [size]=\"size\" [src]=\"src\"></sky-avatar-inner>\n</ng-template>\n", styles: [".sky-avatar .sky-file-drop-col{flex-basis:initial}.sky-theme-modern .sky-file-drop:focus{outline:none}\n"] }]
|
|
123
123
|
}], ctorParameters: function () { return [{ type: i1.SkyErrorModalService }, { type: i2.SkyFileSizePipe }, { type: i3.SkyLibResourcesService }]; }, propDecorators: { canChange: [{
|
|
@@ -73,9 +73,9 @@ _SkyAvatarInnerComponent_viewInitialized = new WeakMap(), _SkyAvatarInnerCompone
|
|
|
73
73
|
__classPrivateFieldGet(this, _SkyAvatarInnerComponent_adapter, "f").updateImage(__classPrivateFieldGet(this, _SkyAvatarInnerComponent_elementRef, "f"), this.src);
|
|
74
74
|
}
|
|
75
75
|
};
|
|
76
|
-
SkyAvatarInnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.
|
|
77
|
-
SkyAvatarInnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.
|
|
78
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.
|
|
76
|
+
SkyAvatarInnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarInnerComponent, deps: [{ token: i0.ElementRef }, { token: i1.SkyAvatarAdapterService }], target: i0.ɵɵFactoryTarget.Component });
|
|
77
|
+
SkyAvatarInnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyAvatarInnerComponent, selector: "sky-avatar-inner", inputs: { src: "src", name: "name", size: "size" }, providers: [SkyAvatarAdapterService], ngImport: i0, template: "<div\n class=\"sky-elevation-1 sky-avatar-wrapper\"\n [ngClass]=\"'sky-avatar-wrapper-size-' + size\"\n>\n <div class=\"sky-avatar-image\" [hidden]=\"!src\"></div>\n <div *ngIf=\"src\" class=\"sky-screen-reader-only\">\n {{ 'skyux_avatar_inner_description' | skyLibResources : name }}\n </div>\n <div\n class=\"sky-avatar-initials\"\n [hidden]=\"src || !name\"\n [ngClass]=\"'sky-palette-multi-' + (colorIndex + 1)\"\n >\n <div\n *ngIf=\"size === 'small'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-body-sm': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n <div\n *ngIf=\"size === 'medium'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-display-3': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n <div\n *ngIf=\"size === 'large'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-display-2': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n </div>\n</div>\n", styles: [".sky-avatar-wrapper{height:104px;width:104px;border:solid 2px transparent;border-radius:50%;overflow:hidden;position:relative;top:-2px;left:-2px}.sky-avatar-image,.sky-avatar-initials{height:100px;width:100px;background-position:50%;background-size:cover;display:flex;align-items:center;justify-content:center}.sky-avatar-initials{font-size:50px}.sky-avatar-initials-inner{color:#fff;cursor:default;-webkit-user-select:none;user-select:none}.sky-avatar-wrapper-size-medium{height:69px;width:69px}.sky-avatar-wrapper-size-medium .sky-avatar-image,.sky-avatar-wrapper-size-medium .sky-avatar-initials{height:65px;width:65px}.sky-avatar-wrapper-size-medium .sky-avatar-initials{font-size:32.5px}.sky-avatar-wrapper-size-small{height:36px;width:36px}.sky-avatar-wrapper-size-small .sky-avatar-image,.sky-avatar-wrapper-size-small .sky-avatar-initials{height:32px;width:32px}.sky-avatar-wrapper-size-small .sky-avatar-initials{font-size:16px}.sky-file-drop .sky-avatar-wrapper{cursor:pointer}.sky-file-drop-accept .sky-avatar-wrapper{border-color:#72bf44;border-style:dashed}.sky-file-drop-reject .sky-avatar-wrapper{border-color:#ef4044;border-style:dashed}.sky-theme-modern .sky-avatar-wrapper{height:100px;width:100px;background-color:#fff;border-width:0;padding:5px;top:0;left:0}.sky-theme-modern .sky-avatar-image,.sky-theme-modern .sky-avatar-initials{border-radius:50%;height:90px;width:90px}.sky-theme-modern .sky-avatar-initials-inner{color:#212327}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper{border-width:2px;padding:3px}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper-size-medium,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper-size-medium{padding:1px}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper-size-small,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper-size-small{padding:0}.sky-theme-modern .sky-avatar-wrapper-size-medium{padding:3px;height:65px;width:65px}.sky-theme-modern .sky-avatar-wrapper-size-medium .sky-avatar-image,.sky-theme-modern .sky-avatar-wrapper-size-medium .sky-avatar-initials{height:59px;width:59px}.sky-theme-modern .sky-avatar-wrapper-size-small{padding:2px;height:32px;width:32px}.sky-theme-modern .sky-avatar-wrapper-size-small .sky-avatar-image,.sky-theme-modern .sky-avatar-wrapper-size-small .sky-avatar-initials{height:28px;width:28px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper{border:solid 1px #1870B8;padding:4px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper.sky-avatar-wrapper-size-medium{padding:2px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper.sky-avatar-wrapper-size-small{padding:1px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper{border:solid 2px #1870B8;padding:3px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper.sky-avatar-wrapper-size-medium,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper.sky-avatar-wrapper-size-medium{padding:1px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper.sky-avatar-wrapper-size-small,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper.sky-avatar-wrapper-size-small{padding:0}.sky-theme-modern sky-file-drop:focus-within:not(:active) .sky-avatar-wrapper{box-shadow:0 1px 8px #0000004d}.sky-theme-modern.sky-theme-mode-dark .sky-avatar-wrapper{background-color:transparent}.sky-theme-modern.sky-theme-mode-dark .sky-avatar-initials-inner{color:#212327}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "pipe", type: i4.SkyLibResourcesPipe, name: "skyLibResources" }], encapsulation: i0.ViewEncapsulation.None });
|
|
78
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarInnerComponent, decorators: [{
|
|
79
79
|
type: Component,
|
|
80
80
|
args: [{ selector: 'sky-avatar-inner', providers: [SkyAvatarAdapterService], encapsulation: ViewEncapsulation.None, template: "<div\n class=\"sky-elevation-1 sky-avatar-wrapper\"\n [ngClass]=\"'sky-avatar-wrapper-size-' + size\"\n>\n <div class=\"sky-avatar-image\" [hidden]=\"!src\"></div>\n <div *ngIf=\"src\" class=\"sky-screen-reader-only\">\n {{ 'skyux_avatar_inner_description' | skyLibResources : name }}\n </div>\n <div\n class=\"sky-avatar-initials\"\n [hidden]=\"src || !name\"\n [ngClass]=\"'sky-palette-multi-' + (colorIndex + 1)\"\n >\n <div\n *ngIf=\"size === 'small'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-body-sm': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n <div\n *ngIf=\"size === 'medium'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-display-3': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n <div\n *ngIf=\"size === 'large'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-display-2': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n </div>\n</div>\n", styles: [".sky-avatar-wrapper{height:104px;width:104px;border:solid 2px transparent;border-radius:50%;overflow:hidden;position:relative;top:-2px;left:-2px}.sky-avatar-image,.sky-avatar-initials{height:100px;width:100px;background-position:50%;background-size:cover;display:flex;align-items:center;justify-content:center}.sky-avatar-initials{font-size:50px}.sky-avatar-initials-inner{color:#fff;cursor:default;-webkit-user-select:none;user-select:none}.sky-avatar-wrapper-size-medium{height:69px;width:69px}.sky-avatar-wrapper-size-medium .sky-avatar-image,.sky-avatar-wrapper-size-medium .sky-avatar-initials{height:65px;width:65px}.sky-avatar-wrapper-size-medium .sky-avatar-initials{font-size:32.5px}.sky-avatar-wrapper-size-small{height:36px;width:36px}.sky-avatar-wrapper-size-small .sky-avatar-image,.sky-avatar-wrapper-size-small .sky-avatar-initials{height:32px;width:32px}.sky-avatar-wrapper-size-small .sky-avatar-initials{font-size:16px}.sky-file-drop .sky-avatar-wrapper{cursor:pointer}.sky-file-drop-accept .sky-avatar-wrapper{border-color:#72bf44;border-style:dashed}.sky-file-drop-reject .sky-avatar-wrapper{border-color:#ef4044;border-style:dashed}.sky-theme-modern .sky-avatar-wrapper{height:100px;width:100px;background-color:#fff;border-width:0;padding:5px;top:0;left:0}.sky-theme-modern .sky-avatar-image,.sky-theme-modern .sky-avatar-initials{border-radius:50%;height:90px;width:90px}.sky-theme-modern .sky-avatar-initials-inner{color:#212327}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper{border-width:2px;padding:3px}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper-size-medium,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper-size-medium{padding:1px}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper-size-small,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper-size-small{padding:0}.sky-theme-modern .sky-avatar-wrapper-size-medium{padding:3px;height:65px;width:65px}.sky-theme-modern .sky-avatar-wrapper-size-medium .sky-avatar-image,.sky-theme-modern .sky-avatar-wrapper-size-medium .sky-avatar-initials{height:59px;width:59px}.sky-theme-modern .sky-avatar-wrapper-size-small{padding:2px;height:32px;width:32px}.sky-theme-modern .sky-avatar-wrapper-size-small .sky-avatar-image,.sky-theme-modern .sky-avatar-wrapper-size-small .sky-avatar-initials{height:28px;width:28px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper{border:solid 1px #1870B8;padding:4px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper.sky-avatar-wrapper-size-medium{padding:2px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper.sky-avatar-wrapper-size-small{padding:1px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper{border:solid 2px #1870B8;padding:3px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper.sky-avatar-wrapper-size-medium,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper.sky-avatar-wrapper-size-medium{padding:1px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper.sky-avatar-wrapper-size-small,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper.sky-avatar-wrapper-size-small{padding:0}.sky-theme-modern sky-file-drop:focus-within:not(:active) .sky-avatar-wrapper{box-shadow:0 1px 8px #0000004d}.sky-theme-modern.sky-theme-mode-dark .sky-avatar-wrapper{background-color:transparent}.sky-theme-modern.sky-theme-mode-dark .sky-avatar-initials-inner{color:#212327}\n"] }]
|
|
81
81
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.SkyAvatarAdapterService }]; }, propDecorators: { src: [{
|
|
@@ -10,20 +10,20 @@ import { SkyAvatarInnerComponent } from './avatar.inner.component';
|
|
|
10
10
|
import * as i0 from "@angular/core";
|
|
11
11
|
export class SkyAvatarModule {
|
|
12
12
|
}
|
|
13
|
-
SkyAvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.
|
|
14
|
-
SkyAvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.
|
|
13
|
+
SkyAvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
14
|
+
SkyAvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarModule, declarations: [SkyAvatarInnerComponent, SkyAvatarComponent], imports: [CommonModule,
|
|
15
15
|
SkyAvatarResourcesModule,
|
|
16
16
|
SkyErrorModule,
|
|
17
17
|
SkyFileAttachmentsModule,
|
|
18
18
|
SkyI18nModule,
|
|
19
19
|
SkyThemeModule], exports: [SkyAvatarComponent] });
|
|
20
|
-
SkyAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.
|
|
20
|
+
SkyAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarModule, providers: [SkyFileSizePipe], imports: [CommonModule,
|
|
21
21
|
SkyAvatarResourcesModule,
|
|
22
22
|
SkyErrorModule,
|
|
23
23
|
SkyFileAttachmentsModule,
|
|
24
24
|
SkyI18nModule,
|
|
25
25
|
SkyThemeModule] });
|
|
26
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.
|
|
26
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarModule, decorators: [{
|
|
27
27
|
type: NgModule,
|
|
28
28
|
args: [{
|
|
29
29
|
declarations: [SkyAvatarInnerComponent, SkyAvatarComponent],
|
|
@@ -37,16 +37,16 @@ export class SkyAvatarResourcesProvider {
|
|
|
37
37
|
*/
|
|
38
38
|
export class SkyAvatarResourcesModule {
|
|
39
39
|
}
|
|
40
|
-
SkyAvatarResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.
|
|
41
|
-
SkyAvatarResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.
|
|
42
|
-
SkyAvatarResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.
|
|
40
|
+
SkyAvatarResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
41
|
+
SkyAvatarResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarResourcesModule, exports: [SkyI18nModule] });
|
|
42
|
+
SkyAvatarResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarResourcesModule, providers: [
|
|
43
43
|
{
|
|
44
44
|
provide: SKY_LIB_RESOURCES_PROVIDERS,
|
|
45
45
|
useClass: SkyAvatarResourcesProvider,
|
|
46
46
|
multi: true,
|
|
47
47
|
},
|
|
48
48
|
], imports: [SkyI18nModule] });
|
|
49
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.
|
|
49
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarResourcesModule, decorators: [{
|
|
50
50
|
type: NgModule,
|
|
51
51
|
args: [{
|
|
52
52
|
exports: [SkyI18nModule],
|
|
@@ -48,16 +48,16 @@ class SkyAvatarResourcesProvider {
|
|
|
48
48
|
*/
|
|
49
49
|
class SkyAvatarResourcesModule {
|
|
50
50
|
}
|
|
51
|
-
SkyAvatarResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.
|
|
52
|
-
SkyAvatarResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.
|
|
53
|
-
SkyAvatarResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.
|
|
51
|
+
SkyAvatarResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
52
|
+
SkyAvatarResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarResourcesModule, exports: [SkyI18nModule] });
|
|
53
|
+
SkyAvatarResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarResourcesModule, providers: [
|
|
54
54
|
{
|
|
55
55
|
provide: SKY_LIB_RESOURCES_PROVIDERS,
|
|
56
56
|
useClass: SkyAvatarResourcesProvider,
|
|
57
57
|
multi: true,
|
|
58
58
|
},
|
|
59
59
|
], imports: [SkyI18nModule] });
|
|
60
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.
|
|
60
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarResourcesModule, decorators: [{
|
|
61
61
|
type: NgModule,
|
|
62
62
|
args: [{
|
|
63
63
|
exports: [SkyI18nModule],
|
|
@@ -113,9 +113,9 @@ _SkyAvatarAdapterService_blobUrl = new WeakMap(), _SkyAvatarAdapterService_insta
|
|
|
113
113
|
__classPrivateFieldSet(this, _SkyAvatarAdapterService_blobUrl, undefined, "f");
|
|
114
114
|
}
|
|
115
115
|
};
|
|
116
|
-
SkyAvatarAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.
|
|
117
|
-
SkyAvatarAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.
|
|
118
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.
|
|
116
|
+
SkyAvatarAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarAdapterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
117
|
+
SkyAvatarAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarAdapterService });
|
|
118
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarAdapterService, decorators: [{
|
|
119
119
|
type: Injectable
|
|
120
120
|
}] });
|
|
121
121
|
|
|
@@ -186,9 +186,9 @@ _SkyAvatarInnerComponent_viewInitialized = new WeakMap(), _SkyAvatarInnerCompone
|
|
|
186
186
|
__classPrivateFieldGet(this, _SkyAvatarInnerComponent_adapter, "f").updateImage(__classPrivateFieldGet(this, _SkyAvatarInnerComponent_elementRef, "f"), this.src);
|
|
187
187
|
}
|
|
188
188
|
};
|
|
189
|
-
SkyAvatarInnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.
|
|
190
|
-
SkyAvatarInnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.
|
|
191
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.
|
|
189
|
+
SkyAvatarInnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarInnerComponent, deps: [{ token: i0.ElementRef }, { token: SkyAvatarAdapterService }], target: i0.ɵɵFactoryTarget.Component });
|
|
190
|
+
SkyAvatarInnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyAvatarInnerComponent, selector: "sky-avatar-inner", inputs: { src: "src", name: "name", size: "size" }, providers: [SkyAvatarAdapterService], ngImport: i0, template: "<div\n class=\"sky-elevation-1 sky-avatar-wrapper\"\n [ngClass]=\"'sky-avatar-wrapper-size-' + size\"\n>\n <div class=\"sky-avatar-image\" [hidden]=\"!src\"></div>\n <div *ngIf=\"src\" class=\"sky-screen-reader-only\">\n {{ 'skyux_avatar_inner_description' | skyLibResources : name }}\n </div>\n <div\n class=\"sky-avatar-initials\"\n [hidden]=\"src || !name\"\n [ngClass]=\"'sky-palette-multi-' + (colorIndex + 1)\"\n >\n <div\n *ngIf=\"size === 'small'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-body-sm': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n <div\n *ngIf=\"size === 'medium'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-display-3': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n <div\n *ngIf=\"size === 'large'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-display-2': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n </div>\n</div>\n", styles: [".sky-avatar-wrapper{height:104px;width:104px;border:solid 2px transparent;border-radius:50%;overflow:hidden;position:relative;top:-2px;left:-2px}.sky-avatar-image,.sky-avatar-initials{height:100px;width:100px;background-position:50%;background-size:cover;display:flex;align-items:center;justify-content:center}.sky-avatar-initials{font-size:50px}.sky-avatar-initials-inner{color:#fff;cursor:default;-webkit-user-select:none;user-select:none}.sky-avatar-wrapper-size-medium{height:69px;width:69px}.sky-avatar-wrapper-size-medium .sky-avatar-image,.sky-avatar-wrapper-size-medium .sky-avatar-initials{height:65px;width:65px}.sky-avatar-wrapper-size-medium .sky-avatar-initials{font-size:32.5px}.sky-avatar-wrapper-size-small{height:36px;width:36px}.sky-avatar-wrapper-size-small .sky-avatar-image,.sky-avatar-wrapper-size-small .sky-avatar-initials{height:32px;width:32px}.sky-avatar-wrapper-size-small .sky-avatar-initials{font-size:16px}.sky-file-drop .sky-avatar-wrapper{cursor:pointer}.sky-file-drop-accept .sky-avatar-wrapper{border-color:#72bf44;border-style:dashed}.sky-file-drop-reject .sky-avatar-wrapper{border-color:#ef4044;border-style:dashed}.sky-theme-modern .sky-avatar-wrapper{height:100px;width:100px;background-color:#fff;border-width:0;padding:5px;top:0;left:0}.sky-theme-modern .sky-avatar-image,.sky-theme-modern .sky-avatar-initials{border-radius:50%;height:90px;width:90px}.sky-theme-modern .sky-avatar-initials-inner{color:#212327}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper{border-width:2px;padding:3px}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper-size-medium,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper-size-medium{padding:1px}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper-size-small,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper-size-small{padding:0}.sky-theme-modern .sky-avatar-wrapper-size-medium{padding:3px;height:65px;width:65px}.sky-theme-modern .sky-avatar-wrapper-size-medium .sky-avatar-image,.sky-theme-modern .sky-avatar-wrapper-size-medium .sky-avatar-initials{height:59px;width:59px}.sky-theme-modern .sky-avatar-wrapper-size-small{padding:2px;height:32px;width:32px}.sky-theme-modern .sky-avatar-wrapper-size-small .sky-avatar-image,.sky-theme-modern .sky-avatar-wrapper-size-small .sky-avatar-initials{height:28px;width:28px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper{border:solid 1px #1870B8;padding:4px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper.sky-avatar-wrapper-size-medium{padding:2px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper.sky-avatar-wrapper-size-small{padding:1px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper{border:solid 2px #1870B8;padding:3px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper.sky-avatar-wrapper-size-medium,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper.sky-avatar-wrapper-size-medium{padding:1px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper.sky-avatar-wrapper-size-small,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper.sky-avatar-wrapper-size-small{padding:0}.sky-theme-modern sky-file-drop:focus-within:not(:active) .sky-avatar-wrapper{box-shadow:0 1px 8px #0000004d}.sky-theme-modern.sky-theme-mode-dark .sky-avatar-wrapper{background-color:transparent}.sky-theme-modern.sky-theme-mode-dark .sky-avatar-initials-inner{color:#212327}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "pipe", type: i3$1.SkyLibResourcesPipe, name: "skyLibResources" }], encapsulation: i0.ViewEncapsulation.None });
|
|
191
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarInnerComponent, decorators: [{
|
|
192
192
|
type: Component,
|
|
193
193
|
args: [{ selector: 'sky-avatar-inner', providers: [SkyAvatarAdapterService], encapsulation: ViewEncapsulation.None, template: "<div\n class=\"sky-elevation-1 sky-avatar-wrapper\"\n [ngClass]=\"'sky-avatar-wrapper-size-' + size\"\n>\n <div class=\"sky-avatar-image\" [hidden]=\"!src\"></div>\n <div *ngIf=\"src\" class=\"sky-screen-reader-only\">\n {{ 'skyux_avatar_inner_description' | skyLibResources : name }}\n </div>\n <div\n class=\"sky-avatar-initials\"\n [hidden]=\"src || !name\"\n [ngClass]=\"'sky-palette-multi-' + (colorIndex + 1)\"\n >\n <div\n *ngIf=\"size === 'small'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-body-sm': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n <div\n *ngIf=\"size === 'medium'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-display-3': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n <div\n *ngIf=\"size === 'large'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-display-2': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n </div>\n</div>\n", styles: [".sky-avatar-wrapper{height:104px;width:104px;border:solid 2px transparent;border-radius:50%;overflow:hidden;position:relative;top:-2px;left:-2px}.sky-avatar-image,.sky-avatar-initials{height:100px;width:100px;background-position:50%;background-size:cover;display:flex;align-items:center;justify-content:center}.sky-avatar-initials{font-size:50px}.sky-avatar-initials-inner{color:#fff;cursor:default;-webkit-user-select:none;user-select:none}.sky-avatar-wrapper-size-medium{height:69px;width:69px}.sky-avatar-wrapper-size-medium .sky-avatar-image,.sky-avatar-wrapper-size-medium .sky-avatar-initials{height:65px;width:65px}.sky-avatar-wrapper-size-medium .sky-avatar-initials{font-size:32.5px}.sky-avatar-wrapper-size-small{height:36px;width:36px}.sky-avatar-wrapper-size-small .sky-avatar-image,.sky-avatar-wrapper-size-small .sky-avatar-initials{height:32px;width:32px}.sky-avatar-wrapper-size-small .sky-avatar-initials{font-size:16px}.sky-file-drop .sky-avatar-wrapper{cursor:pointer}.sky-file-drop-accept .sky-avatar-wrapper{border-color:#72bf44;border-style:dashed}.sky-file-drop-reject .sky-avatar-wrapper{border-color:#ef4044;border-style:dashed}.sky-theme-modern .sky-avatar-wrapper{height:100px;width:100px;background-color:#fff;border-width:0;padding:5px;top:0;left:0}.sky-theme-modern .sky-avatar-image,.sky-theme-modern .sky-avatar-initials{border-radius:50%;height:90px;width:90px}.sky-theme-modern .sky-avatar-initials-inner{color:#212327}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper{border-width:2px;padding:3px}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper-size-medium,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper-size-medium{padding:1px}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper-size-small,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper-size-small{padding:0}.sky-theme-modern .sky-avatar-wrapper-size-medium{padding:3px;height:65px;width:65px}.sky-theme-modern .sky-avatar-wrapper-size-medium .sky-avatar-image,.sky-theme-modern .sky-avatar-wrapper-size-medium .sky-avatar-initials{height:59px;width:59px}.sky-theme-modern .sky-avatar-wrapper-size-small{padding:2px;height:32px;width:32px}.sky-theme-modern .sky-avatar-wrapper-size-small .sky-avatar-image,.sky-theme-modern .sky-avatar-wrapper-size-small .sky-avatar-initials{height:28px;width:28px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper{border:solid 1px #1870B8;padding:4px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper.sky-avatar-wrapper-size-medium{padding:2px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper.sky-avatar-wrapper-size-small{padding:1px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper{border:solid 2px #1870B8;padding:3px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper.sky-avatar-wrapper-size-medium,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper.sky-avatar-wrapper-size-medium{padding:1px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper.sky-avatar-wrapper-size-small,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper.sky-avatar-wrapper-size-small{padding:0}.sky-theme-modern sky-file-drop:focus-within:not(:active) .sky-avatar-wrapper{box-shadow:0 1px 8px #0000004d}.sky-theme-modern.sky-theme-mode-dark .sky-avatar-wrapper{background-color:transparent}.sky-theme-modern.sky-theme-mode-dark .sky-avatar-initials-inner{color:#212327}\n"] }]
|
|
194
194
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: SkyAvatarAdapterService }]; }, propDecorators: { src: [{
|
|
@@ -311,9 +311,9 @@ _SkyAvatarComponent__canChange = new WeakMap(), _SkyAvatarComponent__name = new
|
|
|
311
311
|
// TODO: Need to implement the async `getString` method in a breaking change.
|
|
312
312
|
return __classPrivateFieldGet(this, _SkyAvatarComponent_resourcesService, "f").getStringForLocale({ locale: 'en-US' }, key, ...args);
|
|
313
313
|
};
|
|
314
|
-
SkyAvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.
|
|
315
|
-
SkyAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.
|
|
316
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.
|
|
314
|
+
SkyAvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarComponent, deps: [{ token: i1.SkyErrorModalService }, { token: i2$1.SkyFileSizePipe }, { token: i3$1.SkyLibResourcesService }], target: i0.ɵɵFactoryTarget.Component });
|
|
315
|
+
SkyAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyAvatarComponent, selector: "sky-avatar", inputs: { canChange: "canChange", name: "name", src: "src", maxFileSize: "maxFileSize", size: "size" }, outputs: { avatarChanged: "avatarChanged" }, ngImport: i0, template: "<div class=\"sky-avatar\">\n <div *ngIf=\"canChange\">\n <div class=\"sky-avatar-file-drop\">\n <sky-file-drop\n [acceptedTypes]=\"'image/*'\"\n [fileUploadAriaLabel]=\"\n src\n ? ('skyux_avatar_upload_change_aria_label' | skyLibResources : name)\n : ('skyux_avatar_upload_new_aria_label' | skyLibResources : name)\n \"\n [multiple]=\"false\"\n [maxFileSize]=\"maxFileSize\"\n [multiple]=\"false\"\n (filesChanged)=\"photoDrop($event)\"\n >\n <ng-container *ngTemplateOutlet=\"innerTemplate\"></ng-container>\n </sky-file-drop>\n </div>\n </div>\n <div *ngIf=\"!canChange\">\n <ng-container *ngTemplateOutlet=\"innerTemplate\"></ng-container>\n </div>\n</div>\n\n<ng-template #innerTemplate>\n <sky-avatar-inner [name]=\"name\" [size]=\"size\" [src]=\"src\"></sky-avatar-inner>\n</ng-template>\n", styles: [".sky-avatar .sky-file-drop-col{flex-basis:initial}.sky-theme-modern .sky-file-drop:focus{outline:none}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.λ8, selector: "sky-file-drop", inputs: ["fileUploadAriaLabel", "linkUploadAriaLabel", "minFileSize", "maxFileSize", "multiple", "validateFn", "acceptedTypes", "noClick", "allowLinks"], outputs: ["filesChanged", "linkInputBlur", "linkChanged"] }, { kind: "component", type: SkyAvatarInnerComponent, selector: "sky-avatar-inner", inputs: ["src", "name", "size"] }, { kind: "pipe", type: i3$1.SkyLibResourcesPipe, name: "skyLibResources" }], encapsulation: i0.ViewEncapsulation.None });
|
|
316
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarComponent, decorators: [{
|
|
317
317
|
type: Component,
|
|
318
318
|
args: [{ selector: 'sky-avatar', encapsulation: ViewEncapsulation.None, template: "<div class=\"sky-avatar\">\n <div *ngIf=\"canChange\">\n <div class=\"sky-avatar-file-drop\">\n <sky-file-drop\n [acceptedTypes]=\"'image/*'\"\n [fileUploadAriaLabel]=\"\n src\n ? ('skyux_avatar_upload_change_aria_label' | skyLibResources : name)\n : ('skyux_avatar_upload_new_aria_label' | skyLibResources : name)\n \"\n [multiple]=\"false\"\n [maxFileSize]=\"maxFileSize\"\n [multiple]=\"false\"\n (filesChanged)=\"photoDrop($event)\"\n >\n <ng-container *ngTemplateOutlet=\"innerTemplate\"></ng-container>\n </sky-file-drop>\n </div>\n </div>\n <div *ngIf=\"!canChange\">\n <ng-container *ngTemplateOutlet=\"innerTemplate\"></ng-container>\n </div>\n</div>\n\n<ng-template #innerTemplate>\n <sky-avatar-inner [name]=\"name\" [size]=\"size\" [src]=\"src\"></sky-avatar-inner>\n</ng-template>\n", styles: [".sky-avatar .sky-file-drop-col{flex-basis:initial}.sky-theme-modern .sky-file-drop:focus{outline:none}\n"] }]
|
|
319
319
|
}], ctorParameters: function () { return [{ type: i1.SkyErrorModalService }, { type: i2$1.SkyFileSizePipe }, { type: i3$1.SkyLibResourcesService }]; }, propDecorators: { canChange: [{
|
|
@@ -332,20 +332,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImpor
|
|
|
332
332
|
|
|
333
333
|
class SkyAvatarModule {
|
|
334
334
|
}
|
|
335
|
-
SkyAvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.
|
|
336
|
-
SkyAvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.
|
|
335
|
+
SkyAvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
336
|
+
SkyAvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarModule, declarations: [SkyAvatarInnerComponent, SkyAvatarComponent], imports: [CommonModule,
|
|
337
337
|
SkyAvatarResourcesModule,
|
|
338
338
|
SkyErrorModule,
|
|
339
339
|
SkyFileAttachmentsModule,
|
|
340
340
|
SkyI18nModule,
|
|
341
341
|
SkyThemeModule], exports: [SkyAvatarComponent] });
|
|
342
|
-
SkyAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.
|
|
342
|
+
SkyAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarModule, providers: [SkyFileSizePipe], imports: [CommonModule,
|
|
343
343
|
SkyAvatarResourcesModule,
|
|
344
344
|
SkyErrorModule,
|
|
345
345
|
SkyFileAttachmentsModule,
|
|
346
346
|
SkyI18nModule,
|
|
347
347
|
SkyThemeModule] });
|
|
348
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.
|
|
348
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarModule, decorators: [{
|
|
349
349
|
type: NgModule,
|
|
350
350
|
args: [{
|
|
351
351
|
declarations: [SkyAvatarInnerComponent, SkyAvatarComponent],
|
|
@@ -48,16 +48,16 @@ class SkyAvatarResourcesProvider {
|
|
|
48
48
|
*/
|
|
49
49
|
class SkyAvatarResourcesModule {
|
|
50
50
|
}
|
|
51
|
-
SkyAvatarResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.
|
|
52
|
-
SkyAvatarResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.
|
|
53
|
-
SkyAvatarResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.
|
|
51
|
+
SkyAvatarResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
52
|
+
SkyAvatarResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarResourcesModule, exports: [SkyI18nModule] });
|
|
53
|
+
SkyAvatarResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarResourcesModule, providers: [
|
|
54
54
|
{
|
|
55
55
|
provide: SKY_LIB_RESOURCES_PROVIDERS,
|
|
56
56
|
useClass: SkyAvatarResourcesProvider,
|
|
57
57
|
multi: true,
|
|
58
58
|
},
|
|
59
59
|
], imports: [SkyI18nModule] });
|
|
60
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.
|
|
60
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarResourcesModule, decorators: [{
|
|
61
61
|
type: NgModule,
|
|
62
62
|
args: [{
|
|
63
63
|
exports: [SkyI18nModule],
|
|
@@ -113,9 +113,9 @@ _SkyAvatarAdapterService_blobUrl = new WeakMap(), _SkyAvatarAdapterService_insta
|
|
|
113
113
|
__classPrivateFieldSet(this, _SkyAvatarAdapterService_blobUrl, undefined, "f");
|
|
114
114
|
}
|
|
115
115
|
};
|
|
116
|
-
SkyAvatarAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.
|
|
117
|
-
SkyAvatarAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.
|
|
118
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.
|
|
116
|
+
SkyAvatarAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarAdapterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
117
|
+
SkyAvatarAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarAdapterService });
|
|
118
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarAdapterService, decorators: [{
|
|
119
119
|
type: Injectable
|
|
120
120
|
}] });
|
|
121
121
|
|
|
@@ -186,9 +186,9 @@ _SkyAvatarInnerComponent_viewInitialized = new WeakMap(), _SkyAvatarInnerCompone
|
|
|
186
186
|
__classPrivateFieldGet(this, _SkyAvatarInnerComponent_adapter, "f").updateImage(__classPrivateFieldGet(this, _SkyAvatarInnerComponent_elementRef, "f"), this.src);
|
|
187
187
|
}
|
|
188
188
|
};
|
|
189
|
-
SkyAvatarInnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.
|
|
190
|
-
SkyAvatarInnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.
|
|
191
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.
|
|
189
|
+
SkyAvatarInnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarInnerComponent, deps: [{ token: i0.ElementRef }, { token: SkyAvatarAdapterService }], target: i0.ɵɵFactoryTarget.Component });
|
|
190
|
+
SkyAvatarInnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyAvatarInnerComponent, selector: "sky-avatar-inner", inputs: { src: "src", name: "name", size: "size" }, providers: [SkyAvatarAdapterService], ngImport: i0, template: "<div\n class=\"sky-elevation-1 sky-avatar-wrapper\"\n [ngClass]=\"'sky-avatar-wrapper-size-' + size\"\n>\n <div class=\"sky-avatar-image\" [hidden]=\"!src\"></div>\n <div *ngIf=\"src\" class=\"sky-screen-reader-only\">\n {{ 'skyux_avatar_inner_description' | skyLibResources : name }}\n </div>\n <div\n class=\"sky-avatar-initials\"\n [hidden]=\"src || !name\"\n [ngClass]=\"'sky-palette-multi-' + (colorIndex + 1)\"\n >\n <div\n *ngIf=\"size === 'small'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-body-sm': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n <div\n *ngIf=\"size === 'medium'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-display-3': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n <div\n *ngIf=\"size === 'large'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-display-2': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n </div>\n</div>\n", styles: [".sky-avatar-wrapper{height:104px;width:104px;border:solid 2px transparent;border-radius:50%;overflow:hidden;position:relative;top:-2px;left:-2px}.sky-avatar-image,.sky-avatar-initials{height:100px;width:100px;background-position:50%;background-size:cover;display:flex;align-items:center;justify-content:center}.sky-avatar-initials{font-size:50px}.sky-avatar-initials-inner{color:#fff;cursor:default;-webkit-user-select:none;user-select:none}.sky-avatar-wrapper-size-medium{height:69px;width:69px}.sky-avatar-wrapper-size-medium .sky-avatar-image,.sky-avatar-wrapper-size-medium .sky-avatar-initials{height:65px;width:65px}.sky-avatar-wrapper-size-medium .sky-avatar-initials{font-size:32.5px}.sky-avatar-wrapper-size-small{height:36px;width:36px}.sky-avatar-wrapper-size-small .sky-avatar-image,.sky-avatar-wrapper-size-small .sky-avatar-initials{height:32px;width:32px}.sky-avatar-wrapper-size-small .sky-avatar-initials{font-size:16px}.sky-file-drop .sky-avatar-wrapper{cursor:pointer}.sky-file-drop-accept .sky-avatar-wrapper{border-color:#72bf44;border-style:dashed}.sky-file-drop-reject .sky-avatar-wrapper{border-color:#ef4044;border-style:dashed}.sky-theme-modern .sky-avatar-wrapper{height:100px;width:100px;background-color:#fff;border-width:0;padding:5px;top:0;left:0}.sky-theme-modern .sky-avatar-image,.sky-theme-modern .sky-avatar-initials{border-radius:50%;height:90px;width:90px}.sky-theme-modern .sky-avatar-initials-inner{color:#212327}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper{border-width:2px;padding:3px}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper-size-medium,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper-size-medium{padding:1px}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper-size-small,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper-size-small{padding:0}.sky-theme-modern .sky-avatar-wrapper-size-medium{padding:3px;height:65px;width:65px}.sky-theme-modern .sky-avatar-wrapper-size-medium .sky-avatar-image,.sky-theme-modern .sky-avatar-wrapper-size-medium .sky-avatar-initials{height:59px;width:59px}.sky-theme-modern .sky-avatar-wrapper-size-small{padding:2px;height:32px;width:32px}.sky-theme-modern .sky-avatar-wrapper-size-small .sky-avatar-image,.sky-theme-modern .sky-avatar-wrapper-size-small .sky-avatar-initials{height:28px;width:28px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper{border:solid 1px #1870B8;padding:4px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper.sky-avatar-wrapper-size-medium{padding:2px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper.sky-avatar-wrapper-size-small{padding:1px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper{border:solid 2px #1870B8;padding:3px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper.sky-avatar-wrapper-size-medium,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper.sky-avatar-wrapper-size-medium{padding:1px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper.sky-avatar-wrapper-size-small,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper.sky-avatar-wrapper-size-small{padding:0}.sky-theme-modern sky-file-drop:focus-within:not(:active) .sky-avatar-wrapper{box-shadow:0 1px 8px #0000004d}.sky-theme-modern.sky-theme-mode-dark .sky-avatar-wrapper{background-color:transparent}.sky-theme-modern.sky-theme-mode-dark .sky-avatar-initials-inner{color:#212327}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "pipe", type: i3$1.SkyLibResourcesPipe, name: "skyLibResources" }], encapsulation: i0.ViewEncapsulation.None });
|
|
191
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarInnerComponent, decorators: [{
|
|
192
192
|
type: Component,
|
|
193
193
|
args: [{ selector: 'sky-avatar-inner', providers: [SkyAvatarAdapterService], encapsulation: ViewEncapsulation.None, template: "<div\n class=\"sky-elevation-1 sky-avatar-wrapper\"\n [ngClass]=\"'sky-avatar-wrapper-size-' + size\"\n>\n <div class=\"sky-avatar-image\" [hidden]=\"!src\"></div>\n <div *ngIf=\"src\" class=\"sky-screen-reader-only\">\n {{ 'skyux_avatar_inner_description' | skyLibResources : name }}\n </div>\n <div\n class=\"sky-avatar-initials\"\n [hidden]=\"src || !name\"\n [ngClass]=\"'sky-palette-multi-' + (colorIndex + 1)\"\n >\n <div\n *ngIf=\"size === 'small'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-body-sm': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n <div\n *ngIf=\"size === 'medium'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-display-3': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n <div\n *ngIf=\"size === 'large'\"\n class=\"sky-avatar-initials-inner\"\n [skyThemeClass]=\"{\n 'sky-font-display-2': 'modern'\n }\"\n >\n {{ initials }}\n </div>\n </div>\n</div>\n", styles: [".sky-avatar-wrapper{height:104px;width:104px;border:solid 2px transparent;border-radius:50%;overflow:hidden;position:relative;top:-2px;left:-2px}.sky-avatar-image,.sky-avatar-initials{height:100px;width:100px;background-position:50%;background-size:cover;display:flex;align-items:center;justify-content:center}.sky-avatar-initials{font-size:50px}.sky-avatar-initials-inner{color:#fff;cursor:default;-webkit-user-select:none;user-select:none}.sky-avatar-wrapper-size-medium{height:69px;width:69px}.sky-avatar-wrapper-size-medium .sky-avatar-image,.sky-avatar-wrapper-size-medium .sky-avatar-initials{height:65px;width:65px}.sky-avatar-wrapper-size-medium .sky-avatar-initials{font-size:32.5px}.sky-avatar-wrapper-size-small{height:36px;width:36px}.sky-avatar-wrapper-size-small .sky-avatar-image,.sky-avatar-wrapper-size-small .sky-avatar-initials{height:32px;width:32px}.sky-avatar-wrapper-size-small .sky-avatar-initials{font-size:16px}.sky-file-drop .sky-avatar-wrapper{cursor:pointer}.sky-file-drop-accept .sky-avatar-wrapper{border-color:#72bf44;border-style:dashed}.sky-file-drop-reject .sky-avatar-wrapper{border-color:#ef4044;border-style:dashed}.sky-theme-modern .sky-avatar-wrapper{height:100px;width:100px;background-color:#fff;border-width:0;padding:5px;top:0;left:0}.sky-theme-modern .sky-avatar-image,.sky-theme-modern .sky-avatar-initials{border-radius:50%;height:90px;width:90px}.sky-theme-modern .sky-avatar-initials-inner{color:#212327}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper{border-width:2px;padding:3px}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper-size-medium,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper-size-medium{padding:1px}.sky-theme-modern .sky-file-drop-accept .sky-avatar-wrapper-size-small,.sky-theme-modern .sky-file-drop-reject .sky-avatar-wrapper-size-small{padding:0}.sky-theme-modern .sky-avatar-wrapper-size-medium{padding:3px;height:65px;width:65px}.sky-theme-modern .sky-avatar-wrapper-size-medium .sky-avatar-image,.sky-theme-modern .sky-avatar-wrapper-size-medium .sky-avatar-initials{height:59px;width:59px}.sky-theme-modern .sky-avatar-wrapper-size-small{padding:2px;height:32px;width:32px}.sky-theme-modern .sky-avatar-wrapper-size-small .sky-avatar-image,.sky-theme-modern .sky-avatar-wrapper-size-small .sky-avatar-initials{height:28px;width:28px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper{border:solid 1px #1870B8;padding:4px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper.sky-avatar-wrapper-size-medium{padding:2px}.sky-theme-modern sky-file-drop:hover .sky-avatar-wrapper.sky-avatar-wrapper-size-small{padding:1px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper{border:solid 2px #1870B8;padding:3px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper.sky-avatar-wrapper-size-medium,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper.sky-avatar-wrapper-size-medium{padding:1px}.sky-theme-modern sky-file-drop:active .sky-avatar-wrapper.sky-avatar-wrapper-size-small,.sky-theme-modern sky-file-drop:focus-within .sky-avatar-wrapper.sky-avatar-wrapper-size-small{padding:0}.sky-theme-modern sky-file-drop:focus-within:not(:active) .sky-avatar-wrapper{box-shadow:0 1px 8px #0000004d}.sky-theme-modern.sky-theme-mode-dark .sky-avatar-wrapper{background-color:transparent}.sky-theme-modern.sky-theme-mode-dark .sky-avatar-initials-inner{color:#212327}\n"] }]
|
|
194
194
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: SkyAvatarAdapterService }]; }, propDecorators: { src: [{
|
|
@@ -311,9 +311,9 @@ _SkyAvatarComponent__canChange = new WeakMap(), _SkyAvatarComponent__name = new
|
|
|
311
311
|
// TODO: Need to implement the async `getString` method in a breaking change.
|
|
312
312
|
return __classPrivateFieldGet(this, _SkyAvatarComponent_resourcesService, "f").getStringForLocale({ locale: 'en-US' }, key, ...args);
|
|
313
313
|
};
|
|
314
|
-
SkyAvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.
|
|
315
|
-
SkyAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.
|
|
316
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.
|
|
314
|
+
SkyAvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarComponent, deps: [{ token: i1.SkyErrorModalService }, { token: i2$1.SkyFileSizePipe }, { token: i3$1.SkyLibResourcesService }], target: i0.ɵɵFactoryTarget.Component });
|
|
315
|
+
SkyAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyAvatarComponent, selector: "sky-avatar", inputs: { canChange: "canChange", name: "name", src: "src", maxFileSize: "maxFileSize", size: "size" }, outputs: { avatarChanged: "avatarChanged" }, ngImport: i0, template: "<div class=\"sky-avatar\">\n <div *ngIf=\"canChange\">\n <div class=\"sky-avatar-file-drop\">\n <sky-file-drop\n [acceptedTypes]=\"'image/*'\"\n [fileUploadAriaLabel]=\"\n src\n ? ('skyux_avatar_upload_change_aria_label' | skyLibResources : name)\n : ('skyux_avatar_upload_new_aria_label' | skyLibResources : name)\n \"\n [multiple]=\"false\"\n [maxFileSize]=\"maxFileSize\"\n [multiple]=\"false\"\n (filesChanged)=\"photoDrop($event)\"\n >\n <ng-container *ngTemplateOutlet=\"innerTemplate\"></ng-container>\n </sky-file-drop>\n </div>\n </div>\n <div *ngIf=\"!canChange\">\n <ng-container *ngTemplateOutlet=\"innerTemplate\"></ng-container>\n </div>\n</div>\n\n<ng-template #innerTemplate>\n <sky-avatar-inner [name]=\"name\" [size]=\"size\" [src]=\"src\"></sky-avatar-inner>\n</ng-template>\n", styles: [".sky-avatar .sky-file-drop-col{flex-basis:initial}.sky-theme-modern .sky-file-drop:focus{outline:none}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.λ8, selector: "sky-file-drop", inputs: ["fileUploadAriaLabel", "linkUploadAriaLabel", "minFileSize", "maxFileSize", "multiple", "validateFn", "acceptedTypes", "noClick", "allowLinks"], outputs: ["filesChanged", "linkInputBlur", "linkChanged"] }, { kind: "component", type: SkyAvatarInnerComponent, selector: "sky-avatar-inner", inputs: ["src", "name", "size"] }, { kind: "pipe", type: i3$1.SkyLibResourcesPipe, name: "skyLibResources" }], encapsulation: i0.ViewEncapsulation.None });
|
|
316
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarComponent, decorators: [{
|
|
317
317
|
type: Component,
|
|
318
318
|
args: [{ selector: 'sky-avatar', encapsulation: ViewEncapsulation.None, template: "<div class=\"sky-avatar\">\n <div *ngIf=\"canChange\">\n <div class=\"sky-avatar-file-drop\">\n <sky-file-drop\n [acceptedTypes]=\"'image/*'\"\n [fileUploadAriaLabel]=\"\n src\n ? ('skyux_avatar_upload_change_aria_label' | skyLibResources : name)\n : ('skyux_avatar_upload_new_aria_label' | skyLibResources : name)\n \"\n [multiple]=\"false\"\n [maxFileSize]=\"maxFileSize\"\n [multiple]=\"false\"\n (filesChanged)=\"photoDrop($event)\"\n >\n <ng-container *ngTemplateOutlet=\"innerTemplate\"></ng-container>\n </sky-file-drop>\n </div>\n </div>\n <div *ngIf=\"!canChange\">\n <ng-container *ngTemplateOutlet=\"innerTemplate\"></ng-container>\n </div>\n</div>\n\n<ng-template #innerTemplate>\n <sky-avatar-inner [name]=\"name\" [size]=\"size\" [src]=\"src\"></sky-avatar-inner>\n</ng-template>\n", styles: [".sky-avatar .sky-file-drop-col{flex-basis:initial}.sky-theme-modern .sky-file-drop:focus{outline:none}\n"] }]
|
|
319
319
|
}], ctorParameters: function () { return [{ type: i1.SkyErrorModalService }, { type: i2$1.SkyFileSizePipe }, { type: i3$1.SkyLibResourcesService }]; }, propDecorators: { canChange: [{
|
|
@@ -332,20 +332,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImpor
|
|
|
332
332
|
|
|
333
333
|
class SkyAvatarModule {
|
|
334
334
|
}
|
|
335
|
-
SkyAvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.
|
|
336
|
-
SkyAvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.
|
|
335
|
+
SkyAvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
336
|
+
SkyAvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarModule, declarations: [SkyAvatarInnerComponent, SkyAvatarComponent], imports: [CommonModule,
|
|
337
337
|
SkyAvatarResourcesModule,
|
|
338
338
|
SkyErrorModule,
|
|
339
339
|
SkyFileAttachmentsModule,
|
|
340
340
|
SkyI18nModule,
|
|
341
341
|
SkyThemeModule], exports: [SkyAvatarComponent] });
|
|
342
|
-
SkyAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.
|
|
342
|
+
SkyAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarModule, providers: [SkyFileSizePipe], imports: [CommonModule,
|
|
343
343
|
SkyAvatarResourcesModule,
|
|
344
344
|
SkyErrorModule,
|
|
345
345
|
SkyFileAttachmentsModule,
|
|
346
346
|
SkyI18nModule,
|
|
347
347
|
SkyThemeModule] });
|
|
348
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.
|
|
348
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyAvatarModule, decorators: [{
|
|
349
349
|
type: NgModule,
|
|
350
350
|
args: [{
|
|
351
351
|
declarations: [SkyAvatarInnerComponent, SkyAvatarComponent],
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@skyux/avatar",
|
|
3
|
-
"version": "8.0.
|
|
3
|
+
"version": "8.0.1",
|
|
4
4
|
"author": "Blackbaud, Inc.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"blackbaud",
|
|
@@ -40,14 +40,14 @@
|
|
|
40
40
|
}
|
|
41
41
|
},
|
|
42
42
|
"peerDependencies": {
|
|
43
|
-
"@angular/common": "^15.2.
|
|
44
|
-
"@angular/core": "^15.2.
|
|
45
|
-
"@angular/platform-browser": "^15.2.
|
|
46
|
-
"@skyux-sdk/testing": "8.0.
|
|
47
|
-
"@skyux/errors": "8.0.
|
|
48
|
-
"@skyux/forms": "8.0.
|
|
49
|
-
"@skyux/i18n": "8.0.
|
|
50
|
-
"@skyux/theme": "8.0.
|
|
43
|
+
"@angular/common": "^15.2.9",
|
|
44
|
+
"@angular/core": "^15.2.9",
|
|
45
|
+
"@angular/platform-browser": "^15.2.9",
|
|
46
|
+
"@skyux-sdk/testing": "8.0.1",
|
|
47
|
+
"@skyux/errors": "8.0.1",
|
|
48
|
+
"@skyux/forms": "8.0.1",
|
|
49
|
+
"@skyux/i18n": "8.0.1",
|
|
50
|
+
"@skyux/theme": "8.0.1"
|
|
51
51
|
},
|
|
52
52
|
"dependencies": {
|
|
53
53
|
"tslib": "^2.5.0"
|