@skyux/avatar 6.0.0-beta.3 → 6.0.0-beta.4
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/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 @@ export class SkyAvatarAdapterService {
|
|
|
43
43
|
}
|
|
44
44
|
}
|
|
45
45
|
}
|
|
46
|
-
SkyAvatarAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
|
47
|
-
SkyAvatarAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2
|
|
48
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
|
46
|
+
SkyAvatarAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarAdapterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
47
|
+
SkyAvatarAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarAdapterService });
|
|
48
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarAdapterService, decorators: [{
|
|
49
49
|
type: Injectable
|
|
50
50
|
}] });
|
|
51
51
|
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXZhdGFyLWFkYXB0ZXIuc2VydmljZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy9hdmF0YXIvc3JjL2xpYi9tb2R1bGVzL2F2YXRhci9hdmF0YXItYWRhcHRlci5zZXJ2aWNlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBYyxVQUFVLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBSXZEOztHQUVHO0FBRUgsTUFBTSxPQUFPLHVCQUF1QjtJQUczQixXQUFXLENBQUMsVUFBc0IsRUFBRSxHQUFpQjtRQUMxRCxJQUFJLENBQUMsYUFBYSxFQUFFLENBQUM7UUFFckIsTUFBTSxFQUFFLEdBQUcsVUFBVSxDQUFDLGFBQWEsQ0FBQztRQUVwQyx5QkFBeUI7UUFDekIsSUFBSSxFQUFFLEVBQUU7WUFDTixNQUFNLE9BQU8sR0FBRyxFQUFFLENBQUMsYUFBYSxDQUFDLG1CQUFtQixDQUFDLENBQUM7WUFFdEQseUJBQXlCO1lBQ3pCLElBQUksT0FBTyxFQUFFO2dCQUNYLElBQUksR0FBVyxDQUFDO2dCQUVoQixJQUFJLEdBQUcsRUFBRTtvQkFDUCxJQUFJLEdBQUcsWUFBWSxJQUFJLElBQUksR0FBRyxZQUFZLElBQUksRUFBRTt3QkFDOUMsR0FBRyxHQUFHLElBQUksQ0FBQyxhQUFhLENBQUMsR0FBRyxDQUFDLENBQUM7cUJBQy9CO3lCQUFNO3dCQUNMLEdBQUcsR0FBRyxHQUFHLENBQUM7cUJBQ1g7aUJBQ0Y7Z0JBRUQsaUZBQWlGO2dCQUNqRixPQUFPLENBQUMsS0FBSyxDQUFDLGVBQWUsR0FBRyxHQUFHLENBQUMsQ0FBQyxDQUFDLE9BQU8sR0FBRyxHQUFHLEdBQUcsSUFBSSxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUM7YUFDakU7U0FDRjtJQUNILENBQUM7SUFFTSxPQUFPO1FBQ1osSUFBSSxDQUFDLGFBQWEsRUFBRSxDQUFDO0lBQ3ZCLENBQUM7SUFFTyxhQUFhLENBQUMsR0FBZ0I7UUFDcEMsTUFBTSxHQUFHLEdBQUcsR0FBRyxDQUFDLGVBQWUsQ0FBQyxHQUFHLENBQUMsQ0FBQztRQUVyQywyREFBMkQ7UUFDM0QsdUVBQXVFO1FBQ3ZFLElBQUksQ0FBQyxPQUFPLEdBQUcsR0FBRyxDQUFDO1FBQ25CLE9BQU8sR0FBRyxDQUFDO0lBQ2IsQ0FBQztJQUVPLGFBQWE7UUFDbkIsSUFBSSxJQUFJLENBQUMsT0FBTyxFQUFFO1lBQ2hCLEdBQUcsQ0FBQyxlQUFlLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDO1lBQ2xDLElBQUksQ0FBQyxPQUFPLEdBQUcsU0FBUyxDQUFDO1NBQzFCO0lBQ0gsQ0FBQzs7b0hBaERVLHVCQUF1Qjt3SEFBdkIsdUJBQXVCOzJGQUF2Qix1QkFBdUI7a0JBRG5DLFVBQVUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBFbGVtZW50UmVmLCBJbmplY3RhYmxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmltcG9ydCB7IFNreUF2YXRhclNyYyB9IGZyb20gJy4vYXZhdGFyLXNyYyc7XG5cbi8qKlxuICogQGludGVybmFsXG4gKi9cbkBJbmplY3RhYmxlKClcbmV4cG9ydCBjbGFzcyBTa3lBdmF0YXJBZGFwdGVyU2VydmljZSB7XG4gIHByaXZhdGUgYmxvYlVybDogc3RyaW5nO1xuXG4gIHB1YmxpYyB1cGRhdGVJbWFnZShlbGVtZW50UmVmOiBFbGVtZW50UmVmLCBzcmM6IFNreUF2YXRhclNyYykge1xuICAgIHRoaXMucmV2b2tlQmxvYlVybCgpO1xuXG4gICAgY29uc3QgZWwgPSBlbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQ7XG5cbiAgICAvKmlzdGFuYnVsIGlnbm9yZSBlbHNlICovXG4gICAgaWYgKGVsKSB7XG4gICAgICBjb25zdCBpbWFnZUVsID0gZWwucXVlcnlTZWxlY3RvcignLnNreS1hdmF0YXItaW1hZ2UnKTtcblxuICAgICAgLyppc3RhbmJ1bCBpZ25vcmUgZWxzZSAqL1xuICAgICAgaWYgKGltYWdlRWwpIHtcbiAgICAgICAgbGV0IHVybDogc3RyaW5nO1xuXG4gICAgICAgIGlmIChzcmMpIHtcbiAgICAgICAgICBpZiAoc3JjIGluc3RhbmNlb2YgRmlsZSB8fCBzcmMgaW5zdGFuY2VvZiBCbG9iKSB7XG4gICAgICAgICAgICB1cmwgPSB0aGlzLmNyZWF0ZUJsb2JVcmwoc3JjKTtcbiAgICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgdXJsID0gc3JjO1xuICAgICAgICAgIH1cbiAgICAgICAgfVxuXG4gICAgICAgIC8vIE5vdGljZSB0aGUgcXVvdGVzIGluc2lkZSB0aGUgYHVybGAgZnVuY3Rpb24uIFRoaXMgZW5zdXJlcyBwcm9wZXIgdXJsIGVzY2FwaW5nLlxuICAgICAgICBpbWFnZUVsLnN0eWxlLmJhY2tncm91bmRJbWFnZSA9IHVybCA/ICd1cmwoXCInICsgdXJsICsgJ1wiKScgOiAnJztcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICBwdWJsaWMgZGVzdHJveSgpIHtcbiAgICB0aGlzLnJldm9rZUJsb2JVcmwoKTtcbiAgfVxuXG4gIHByaXZhdGUgY3JlYXRlQmxvYlVybChzcmM6IEJsb2IgfCBGaWxlKSB7XG4gICAgY29uc3QgdXJsID0gVVJMLmNyZWF0ZU9iamVjdFVSTChzcmMpO1xuXG4gICAgLy8gS2VlcCB0aGUgbGFzdCBibG9iIFVSTCBhcm91bmQgc28gd2UgY2FuIHJldm9rZSBpdCBsYXRlci5cbiAgICAvLyBodHRwczovL2RldmVsb3Blci5tb3ppbGxhLm9yZy9lbi1VUy9kb2NzL1dlYi9BUEkvVVJML3Jldm9rZU9iamVjdFVSTFxuICAgIHRoaXMuYmxvYlVybCA9IHVybDtcbiAgICByZXR1cm4gdXJsO1xuICB9XG5cbiAgcHJpdmF0ZSByZXZva2VCbG9iVXJsKCkge1xuICAgIGlmICh0aGlzLmJsb2JVcmwpIHtcbiAgICAgIFVSTC5yZXZva2VPYmplY3RVUkwodGhpcy5ibG9iVXJsKTtcbiAgICAgIHRoaXMuYmxvYlVybCA9IHVuZGVmaW5lZDtcbiAgICB9XG4gIH1cbn1cbiJdfQ==
|
|
@@ -104,9 +104,9 @@ export class SkyAvatarComponent {
|
|
|
104
104
|
return this.resourcesService.getStringForLocale({ locale: 'en-US' }, key, ...args);
|
|
105
105
|
}
|
|
106
106
|
}
|
|
107
|
-
SkyAvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
|
108
|
-
SkyAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
|
109
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
|
107
|
+
SkyAvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarComponent, deps: [{ token: i1.SkyErrorModalService }, { token: i2.SkyFileSizePipe }, { token: i3.SkyLibResourcesService }], target: i0.ɵɵFactoryTarget.Component });
|
|
108
|
+
SkyAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", 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"], components: [{ type: i2.λ8, selector: "sky-file-drop", inputs: ["fileUploadAriaLabel", "linkUploadAriaLabel", "minFileSize", "maxFileSize", "multiple", "validateFn", "acceptedTypes", "noClick", "allowLinks"], outputs: ["filesChanged", "linkInputBlur", "linkChanged"] }, { type: i4.SkyAvatarInnerComponent, selector: "sky-avatar-inner", inputs: ["src", "name", "size"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "skyLibResources": i3.SkyLibResourcesPipe }, encapsulation: i0.ViewEncapsulation.None });
|
|
109
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarComponent, decorators: [{
|
|
110
110
|
type: Component,
|
|
111
111
|
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"] }]
|
|
112
112
|
}], ctorParameters: function () { return [{ type: i1.SkyErrorModalService }, { type: i2.SkyFileSizePipe }, { type: i3.SkyLibResourcesService }]; }, propDecorators: { canChange: [{
|
|
@@ -64,9 +64,9 @@ export class SkyAvatarInnerComponent {
|
|
|
64
64
|
}
|
|
65
65
|
}
|
|
66
66
|
}
|
|
67
|
-
SkyAvatarInnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
|
68
|
-
SkyAvatarInnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
|
69
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
|
67
|
+
SkyAvatarInnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarInnerComponent, deps: [{ token: i0.ElementRef }, { token: i1.SkyAvatarAdapterService }], target: i0.ɵɵFactoryTarget.Component });
|
|
68
|
+
SkyAvatarInnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", 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 || 'large')\"\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 !== 'small' && size !== 'medium'\"\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"], directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }], pipes: { "skyLibResources": i4.SkyLibResourcesPipe }, encapsulation: i0.ViewEncapsulation.None });
|
|
69
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarInnerComponent, decorators: [{
|
|
70
70
|
type: Component,
|
|
71
71
|
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 || 'large')\"\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 !== 'small' && size !== 'medium'\"\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"] }]
|
|
72
72
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.SkyAvatarAdapterService }]; }, propDecorators: { src: [{
|
|
@@ -10,14 +10,14 @@ 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: "13.2
|
|
14
|
-
SkyAvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2
|
|
13
|
+
SkyAvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
14
|
+
SkyAvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", 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: "13.2
|
|
20
|
+
SkyAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarModule, providers: [SkyFileSizePipe], imports: [[
|
|
21
21
|
CommonModule,
|
|
22
22
|
SkyAvatarResourcesModule,
|
|
23
23
|
SkyErrorModule,
|
|
@@ -25,7 +25,7 @@ SkyAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version
|
|
|
25
25
|
SkyI18nModule,
|
|
26
26
|
SkyThemeModule,
|
|
27
27
|
]] });
|
|
28
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
|
28
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarModule, decorators: [{
|
|
29
29
|
type: NgModule,
|
|
30
30
|
args: [{
|
|
31
31
|
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: "13.2
|
|
41
|
-
SkyAvatarResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2
|
|
42
|
-
SkyAvatarResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2
|
|
40
|
+
SkyAvatarResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
41
|
+
SkyAvatarResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarResourcesModule, exports: [SkyI18nModule] });
|
|
42
|
+
SkyAvatarResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", 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: "13.2
|
|
49
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarResourcesModule, decorators: [{
|
|
50
50
|
type: NgModule,
|
|
51
51
|
args: [{
|
|
52
52
|
exports: [SkyI18nModule],
|
|
@@ -47,16 +47,16 @@ class SkyAvatarResourcesProvider {
|
|
|
47
47
|
*/
|
|
48
48
|
class SkyAvatarResourcesModule {
|
|
49
49
|
}
|
|
50
|
-
SkyAvatarResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
|
51
|
-
SkyAvatarResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2
|
|
52
|
-
SkyAvatarResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2
|
|
50
|
+
SkyAvatarResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
51
|
+
SkyAvatarResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarResourcesModule, exports: [SkyI18nModule] });
|
|
52
|
+
SkyAvatarResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarResourcesModule, providers: [
|
|
53
53
|
{
|
|
54
54
|
provide: SKY_LIB_RESOURCES_PROVIDERS,
|
|
55
55
|
useClass: SkyAvatarResourcesProvider,
|
|
56
56
|
multi: true,
|
|
57
57
|
},
|
|
58
58
|
], imports: [SkyI18nModule] });
|
|
59
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
|
59
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarResourcesModule, decorators: [{
|
|
60
60
|
type: NgModule,
|
|
61
61
|
args: [{
|
|
62
62
|
exports: [SkyI18nModule],
|
|
@@ -113,9 +113,9 @@ class SkyAvatarAdapterService {
|
|
|
113
113
|
}
|
|
114
114
|
}
|
|
115
115
|
}
|
|
116
|
-
SkyAvatarAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
|
117
|
-
SkyAvatarAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2
|
|
118
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
|
116
|
+
SkyAvatarAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarAdapterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
117
|
+
SkyAvatarAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarAdapterService });
|
|
118
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarAdapterService, decorators: [{
|
|
119
119
|
type: Injectable
|
|
120
120
|
}] });
|
|
121
121
|
|
|
@@ -178,9 +178,9 @@ class SkyAvatarInnerComponent {
|
|
|
178
178
|
}
|
|
179
179
|
}
|
|
180
180
|
}
|
|
181
|
-
SkyAvatarInnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
|
182
|
-
SkyAvatarInnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
|
183
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
|
181
|
+
SkyAvatarInnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarInnerComponent, deps: [{ token: i0.ElementRef }, { token: SkyAvatarAdapterService }], target: i0.ɵɵFactoryTarget.Component });
|
|
182
|
+
SkyAvatarInnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", 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 || 'large')\"\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 !== 'small' && size !== 'medium'\"\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"], directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }], pipes: { "skyLibResources": i3$1.SkyLibResourcesPipe }, encapsulation: i0.ViewEncapsulation.None });
|
|
183
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarInnerComponent, decorators: [{
|
|
184
184
|
type: Component,
|
|
185
185
|
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 || 'large')\"\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 !== 'small' && size !== 'medium'\"\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"] }]
|
|
186
186
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: SkyAvatarAdapterService }]; }, propDecorators: { src: [{
|
|
@@ -290,9 +290,9 @@ class SkyAvatarComponent {
|
|
|
290
290
|
return this.resourcesService.getStringForLocale({ locale: 'en-US' }, key, ...args);
|
|
291
291
|
}
|
|
292
292
|
}
|
|
293
|
-
SkyAvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
|
294
|
-
SkyAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
|
295
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
|
293
|
+
SkyAvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarComponent, deps: [{ token: i1.SkyErrorModalService }, { token: i2$1.SkyFileSizePipe }, { token: i3$1.SkyLibResourcesService }], target: i0.ɵɵFactoryTarget.Component });
|
|
294
|
+
SkyAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", 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"], components: [{ type: i2$1.λ8, selector: "sky-file-drop", inputs: ["fileUploadAriaLabel", "linkUploadAriaLabel", "minFileSize", "maxFileSize", "multiple", "validateFn", "acceptedTypes", "noClick", "allowLinks"], outputs: ["filesChanged", "linkInputBlur", "linkChanged"] }, { type: SkyAvatarInnerComponent, selector: "sky-avatar-inner", inputs: ["src", "name", "size"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "skyLibResources": i3$1.SkyLibResourcesPipe }, encapsulation: i0.ViewEncapsulation.None });
|
|
295
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarComponent, decorators: [{
|
|
296
296
|
type: Component,
|
|
297
297
|
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"] }]
|
|
298
298
|
}], ctorParameters: function () { return [{ type: i1.SkyErrorModalService }, { type: i2$1.SkyFileSizePipe }, { type: i3$1.SkyLibResourcesService }]; }, propDecorators: { canChange: [{
|
|
@@ -311,14 +311,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImpor
|
|
|
311
311
|
|
|
312
312
|
class SkyAvatarModule {
|
|
313
313
|
}
|
|
314
|
-
SkyAvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
|
315
|
-
SkyAvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2
|
|
314
|
+
SkyAvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
315
|
+
SkyAvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarModule, declarations: [SkyAvatarInnerComponent, SkyAvatarComponent], imports: [CommonModule,
|
|
316
316
|
SkyAvatarResourcesModule,
|
|
317
317
|
SkyErrorModule,
|
|
318
318
|
SkyFileAttachmentsModule,
|
|
319
319
|
SkyI18nModule,
|
|
320
320
|
SkyThemeModule], exports: [SkyAvatarComponent] });
|
|
321
|
-
SkyAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2
|
|
321
|
+
SkyAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarModule, providers: [SkyFileSizePipe], imports: [[
|
|
322
322
|
CommonModule,
|
|
323
323
|
SkyAvatarResourcesModule,
|
|
324
324
|
SkyErrorModule,
|
|
@@ -326,7 +326,7 @@ SkyAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version
|
|
|
326
326
|
SkyI18nModule,
|
|
327
327
|
SkyThemeModule,
|
|
328
328
|
]] });
|
|
329
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
|
329
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarModule, decorators: [{
|
|
330
330
|
type: NgModule,
|
|
331
331
|
args: [{
|
|
332
332
|
declarations: [SkyAvatarInnerComponent, SkyAvatarComponent],
|
|
@@ -47,16 +47,16 @@ class SkyAvatarResourcesProvider {
|
|
|
47
47
|
*/
|
|
48
48
|
class SkyAvatarResourcesModule {
|
|
49
49
|
}
|
|
50
|
-
SkyAvatarResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
|
51
|
-
SkyAvatarResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2
|
|
52
|
-
SkyAvatarResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2
|
|
50
|
+
SkyAvatarResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
51
|
+
SkyAvatarResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarResourcesModule, exports: [SkyI18nModule] });
|
|
52
|
+
SkyAvatarResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarResourcesModule, providers: [
|
|
53
53
|
{
|
|
54
54
|
provide: SKY_LIB_RESOURCES_PROVIDERS,
|
|
55
55
|
useClass: SkyAvatarResourcesProvider,
|
|
56
56
|
multi: true,
|
|
57
57
|
},
|
|
58
58
|
], imports: [SkyI18nModule] });
|
|
59
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
|
59
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarResourcesModule, decorators: [{
|
|
60
60
|
type: NgModule,
|
|
61
61
|
args: [{
|
|
62
62
|
exports: [SkyI18nModule],
|
|
@@ -113,9 +113,9 @@ class SkyAvatarAdapterService {
|
|
|
113
113
|
}
|
|
114
114
|
}
|
|
115
115
|
}
|
|
116
|
-
SkyAvatarAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
|
117
|
-
SkyAvatarAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2
|
|
118
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
|
116
|
+
SkyAvatarAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarAdapterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
117
|
+
SkyAvatarAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarAdapterService });
|
|
118
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarAdapterService, decorators: [{
|
|
119
119
|
type: Injectable
|
|
120
120
|
}] });
|
|
121
121
|
|
|
@@ -178,9 +178,9 @@ class SkyAvatarInnerComponent {
|
|
|
178
178
|
}
|
|
179
179
|
}
|
|
180
180
|
}
|
|
181
|
-
SkyAvatarInnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
|
182
|
-
SkyAvatarInnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
|
183
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
|
181
|
+
SkyAvatarInnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarInnerComponent, deps: [{ token: i0.ElementRef }, { token: SkyAvatarAdapterService }], target: i0.ɵɵFactoryTarget.Component });
|
|
182
|
+
SkyAvatarInnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", 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 || 'large')\"\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 !== 'small' && size !== 'medium'\"\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"], directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }], pipes: { "skyLibResources": i3$1.SkyLibResourcesPipe }, encapsulation: i0.ViewEncapsulation.None });
|
|
183
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarInnerComponent, decorators: [{
|
|
184
184
|
type: Component,
|
|
185
185
|
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 || 'large')\"\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 !== 'small' && size !== 'medium'\"\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"] }]
|
|
186
186
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: SkyAvatarAdapterService }]; }, propDecorators: { src: [{
|
|
@@ -290,9 +290,9 @@ class SkyAvatarComponent {
|
|
|
290
290
|
return this.resourcesService.getStringForLocale({ locale: 'en-US' }, key, ...args);
|
|
291
291
|
}
|
|
292
292
|
}
|
|
293
|
-
SkyAvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
|
294
|
-
SkyAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
|
295
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
|
293
|
+
SkyAvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarComponent, deps: [{ token: i1.SkyErrorModalService }, { token: i2$1.SkyFileSizePipe }, { token: i3$1.SkyLibResourcesService }], target: i0.ɵɵFactoryTarget.Component });
|
|
294
|
+
SkyAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", 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"], components: [{ type: i2$1.λ8, selector: "sky-file-drop", inputs: ["fileUploadAriaLabel", "linkUploadAriaLabel", "minFileSize", "maxFileSize", "multiple", "validateFn", "acceptedTypes", "noClick", "allowLinks"], outputs: ["filesChanged", "linkInputBlur", "linkChanged"] }, { type: SkyAvatarInnerComponent, selector: "sky-avatar-inner", inputs: ["src", "name", "size"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "skyLibResources": i3$1.SkyLibResourcesPipe }, encapsulation: i0.ViewEncapsulation.None });
|
|
295
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarComponent, decorators: [{
|
|
296
296
|
type: Component,
|
|
297
297
|
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"] }]
|
|
298
298
|
}], ctorParameters: function () { return [{ type: i1.SkyErrorModalService }, { type: i2$1.SkyFileSizePipe }, { type: i3$1.SkyLibResourcesService }]; }, propDecorators: { canChange: [{
|
|
@@ -311,14 +311,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImpor
|
|
|
311
311
|
|
|
312
312
|
class SkyAvatarModule {
|
|
313
313
|
}
|
|
314
|
-
SkyAvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
|
315
|
-
SkyAvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2
|
|
314
|
+
SkyAvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
315
|
+
SkyAvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarModule, declarations: [SkyAvatarInnerComponent, SkyAvatarComponent], imports: [CommonModule,
|
|
316
316
|
SkyAvatarResourcesModule,
|
|
317
317
|
SkyErrorModule,
|
|
318
318
|
SkyFileAttachmentsModule,
|
|
319
319
|
SkyI18nModule,
|
|
320
320
|
SkyThemeModule], exports: [SkyAvatarComponent] });
|
|
321
|
-
SkyAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2
|
|
321
|
+
SkyAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarModule, providers: [SkyFileSizePipe], imports: [[
|
|
322
322
|
CommonModule,
|
|
323
323
|
SkyAvatarResourcesModule,
|
|
324
324
|
SkyErrorModule,
|
|
@@ -326,7 +326,7 @@ SkyAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version
|
|
|
326
326
|
SkyI18nModule,
|
|
327
327
|
SkyThemeModule,
|
|
328
328
|
]] });
|
|
329
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
|
329
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAvatarModule, decorators: [{
|
|
330
330
|
type: NgModule,
|
|
331
331
|
args: [{
|
|
332
332
|
declarations: [SkyAvatarInnerComponent, SkyAvatarComponent],
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@skyux/avatar",
|
|
3
|
-
"version": "6.0.0-beta.
|
|
3
|
+
"version": "6.0.0-beta.4",
|
|
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": "^13.2
|
|
44
|
-
"@angular/core": "^13.2
|
|
45
|
-
"@angular/platform-browser": "^13.2
|
|
46
|
-
"@skyux-sdk/testing": "6.0.0-beta.
|
|
47
|
-
"@skyux/errors": "6.0.0-beta.
|
|
48
|
-
"@skyux/forms": "6.0.0-beta.
|
|
49
|
-
"@skyux/i18n": "6.0.0-beta.
|
|
50
|
-
"@skyux/theme": "6.0.0-beta.
|
|
43
|
+
"@angular/common": "^13.3.2",
|
|
44
|
+
"@angular/core": "^13.3.2",
|
|
45
|
+
"@angular/platform-browser": "^13.3.2",
|
|
46
|
+
"@skyux-sdk/testing": "6.0.0-beta.4",
|
|
47
|
+
"@skyux/errors": "6.0.0-beta.4",
|
|
48
|
+
"@skyux/forms": "6.0.0-beta.4",
|
|
49
|
+
"@skyux/i18n": "6.0.0-beta.4",
|
|
50
|
+
"@skyux/theme": "6.0.0-beta.4"
|
|
51
51
|
},
|
|
52
52
|
"dependencies": {
|
|
53
53
|
"tslib": "^2.3.1"
|