@tuki-io/tuki-widgets 0.0.150 → 0.0.151

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.
@@ -455,6 +455,7 @@ class SimplifiedUser {
455
455
  this.homeNumber = user.homeNumber;
456
456
  this.pagerNumber = user.pagerNumber;
457
457
  this.displayName = user.displayName;
458
+ this.cucmId = user.cucmId;
458
459
  if (user.devices && user.devices.length) {
459
460
  this.devices = user.devices.map((device) => new Device(device));
460
461
  if (user.lines && user.lines.length) {
@@ -1120,10 +1121,10 @@ class UserInfoComponent {
1120
1121
  }
1121
1122
  }
1122
1123
  UserInfoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: UserInfoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1123
- UserInfoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: UserInfoComponent, selector: "app-user-info", inputs: { name: "name", active: "active", email: "email", position: "position", cucmid: "cucmid" }, ngImport: i0, template: "<div style=\"display: flex; align-items: center; justify-content: space-between; background-color: white;\">\r\n <!-- <div class=\"content-box\"> -->\r\n <div class=\"info-holder\">\r\n <div class=\"info-holder__user-image\">\r\n <i class=\"icon-people-regular\"></i>\r\n </div>\r\n <div class=\"info-holder__user-information\">\r\n <div class=\"info-holder__user-name\">\r\n {{name}}\r\n <ng-container *ngIf=\"webexUUID\">\r\n <span [matTooltip]=\"'Multi-Tenant'\" matTooltipPosition=\"right\" style=\"margin-left: 8px; vertical-align: middle;\">\r\n <img src=\"assets/icons/webex.svg\" width=\"20\" alt=\"\" />\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"!webexUUID\">\r\n <span *ngIf=\"cucmid === '2549'\" [matTooltip]=\"'Dedicated Instance'\" matTooltipPosition=\"right\" style=\"margin-left: 8px; vertical-align: middle;\">\r\n <img src=\"assets/icons/onprem_ucm.svg\" width=\"25\" alt=\"\" />\r\n </span>\r\n <span *ngIf=\"cucmid !== '2549'\" [matTooltip]=\"'Dedicated Instance'\" matTooltipPosition=\"right\" style=\"margin-left: 8px; vertical-align: middle;\">\r\n <img src=\"assets/icons/di.svg\" width=\"25\" alt=\"\" />\r\n </span>\r\n </ng-container>\r\n </div>\r\n <div class=\"info-holder__user-breadcrumbs\">\r\n <div class=\"is-active\" *ngIf=\"active; else notActive\">\r\n <span class=\"icon-user-status icon-user-status-active\"></span>Active\r\n </div>\r\n <div class=\"icon-text-wrapper\">\r\n <div class=\"icon-separator\"></div>\r\n <div class=\"email\">{{email}}</div>\r\n </div>\r\n <div class=\"icon-text-wrapper\">\r\n <div class=\"icon-separator\"></div>\r\n <div class=\"position\">{{position}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"action-btn-wrapper\">\r\n <button><span>Actions</span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"14\" viewBox=\"0 0 32 32\" style=\"vertical-align:middle;\"><path d=\"M28.708 9.293a1 1 0 0 0-1.415 0L16 20.586 4.707 9.293a1 1 0 0 0-1.414 1.414l12 12a1 1 0 0 0 1.414 0l12-12a1 1 0 0 0 0-1.414\" fill=\"currentColor\"/></svg></button>\r\n </div>\r\n </div>\r\n <!-- </div> -->\r\n</div>\r\n\r\n<ng-template #notActive>\r\n <div class=\"is-active\">\r\n <svg width=\"8\" height=\"9\" viewBox=\"0 0 8 9\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 8.5C6.20914 8.5 8 6.70914 8 4.5C8 2.29086 6.20914 0.5 4 0.5C1.79086 0.5 0 2.29086 0 4.5C0 6.70914 1.79086 8.5 4 8.5Z\" fill=\"grey\"/>\r\n </svg>\r\n <div>Not active</div>\r\n </div>\r\n</ng-template>\r\n", styles: [".info-holder{display:flex;gap:.75rem;align-items:center;font-family:Inter,sans-serif;height:102px;width:100%;background:white;padding:0 4.375rem;font-family:poppins,sans-serif}.info-holder__user-image img{width:40px;border-radius:120px;margin:20px 0 0}.info-holder__user-information{gap:10px;display:flex;flex-direction:column}.info-holder__user-name{font-size:20px;font-weight:600}.info-holder__user-breadcrumbs{display:flex;gap:8px;font-weight:400;font-size:14px;color:#000000b3;align-items:center}.info-holder .is-active,.info-holder .icon-text-wrapper{display:flex;gap:.5rem;align-items:center}.info-holder .icon-text-wrapper .icon-separator{flex-shrink:0;border-radius:50%;background-color:#000000bf;inline-size:.25rem;block-size:.25rem;margin-inline-end:.25rem}.info-holder .info-holder__user-image{width:40px;height:40px}.info-holder .info-holder__user-image .icon-people-regular{background-image:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2232%22 height%3D%2232%22 viewBox%3D%220 0 32 32%22%3E%3Cpath d%3D%22M23.23 16.757a5.746 5.746 0 1 0-7.041-9.048 5 5 0 0 0 .071-.705 4.75 4.75 0 1 0-7.705 3.689 8.43 8.43 0 0 0-6.305 7.84c0 1.052.543 2.521 3.13 3.55 1.643.595 3.371.92 5.118.965a7.8 7.8 0 0 0-.248 1.926c0 1.1.57 2.636 3.285 3.716a18.1 18.1 0 0 0 6.463 1.06c4.853 0 9.75-1.476 9.75-4.776a8.86 8.86 0 0 0-6.517-8.217M20 7.755a4.25 4.25 0 0 1 .006 8.499h-.013a4.25 4.25 0 0 1 .007-8.5M8.26 7.004a3.25 3.25 0 1 1 6.5 0 3.25 3.25 0 0 1-6.5 0m2.76 14.574c-4.177-.093-7.27-1.368-7.27-3.045 0-3.737 3.478-6.778 7.752-6.778a8.7 8.7 0 0 1 2.757.45 5.75 5.75 0 0 0 2.508 4.552 9.43 9.43 0 0 0-5.747 4.82m8.978 6.672c-4.703 0-8.249-1.408-8.249-3.276 0-3.982 3.7-7.22 8.25-7.22s8.248 3.238 8.248 7.22c0 1.868-3.546 3.276-8.25 3.276%22%2F%3E%3C%2Fsvg%3E\");background-repeat:no-repeat;background-position:center;height:40px;width:40px;display:block;background-size:contain}.icon-user-status{width:.5rem;height:.5rem;border-radius:50%;background-color:#707070}.icon-user-status.icon-user-status-active{background-color:#1d805f;display:inline-block}.action-btn-wrapper{flex:1;display:flex;align-items:center;justify-content:flex-end}.action-btn-wrapper button{background-color:#000000f2;color:#fffffff2;position:relative;display:inline-flex;gap:6px;align-items:center;justify-content:center;overflow:hidden!important;padding:8px .75rem;border:1px solid transparent;border-radius:6.25rem;font-weight:500;font-size:14px;text-overflow:ellipsis;white-space:nowrap;transition:all .1s cubic-bezier(.25,.1,.25,1);inline-size:min-content;max-inline-size:100%}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
1124
+ UserInfoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: UserInfoComponent, selector: "app-user-info", inputs: { name: "name", active: "active", email: "email", position: "position", cucmid: "cucmid" }, ngImport: i0, template: "<div style=\"display: flex; align-items: center; justify-content: space-between; background-color: white;\">\r\n <!-- <div class=\"content-box\"> -->\r\n <div class=\"info-holder\">\r\n <div class=\"info-holder__user-image\">\r\n <i class=\"icon-people-regular\"></i>\r\n </div>\r\n <div class=\"info-holder__user-information\">\r\n <div class=\"info-holder__user-name\">\r\n {{name}}\r\n <ng-container *ngIf=\"webexUUID\">\r\n <span [matTooltip]=\"'Multi-Tenant'\" matTooltipPosition=\"right\" style=\"display: inline-flex; margin-left: 8px; vertical-align: middle;\">\r\n <img src=\"assets/icons/webex.svg\" width=\"20\" alt=\"\" />\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"!webexUUID\">\r\n <span *ngIf=\"cucmid == 2542\" [matTooltip]=\"'On Prem Instance'\" matTooltipPosition=\"right\" style=\"display: inline-flex; margin-left: 8px; vertical-align: middle;\">\r\n <img src=\"assets/icons/onprem_ucm.svg\" width=\"25\" alt=\"\" />\r\n </span>\r\n <span *ngIf=\"cucmid != 2542\" [matTooltip]=\"'Dedicated Instance'\" matTooltipPosition=\"right\" style=\"display: inline-flex; margin-left: 8px; vertical-align: middle;\">\r\n <img src=\"assets/icons/di.svg\" width=\"25\" alt=\"\" />\r\n </span>\r\n </ng-container>\r\n </div>\r\n <div class=\"info-holder__user-breadcrumbs\">\r\n <div class=\"is-active\" *ngIf=\"active; else notActive\">\r\n <span class=\"icon-user-status icon-user-status-active\"></span>Active\r\n </div>\r\n <div class=\"icon-text-wrapper\">\r\n <div class=\"icon-separator\"></div>\r\n <div class=\"email\">{{email}}</div>\r\n </div>\r\n <div class=\"icon-text-wrapper\">\r\n <div class=\"icon-separator\"></div>\r\n <div class=\"position\">{{position}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"action-btn-wrapper\">\r\n <button><span>Actions</span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"14\" viewBox=\"0 0 32 32\" style=\"vertical-align:middle;\"><path d=\"M28.708 9.293a1 1 0 0 0-1.415 0L16 20.586 4.707 9.293a1 1 0 0 0-1.414 1.414l12 12a1 1 0 0 0 1.414 0l12-12a1 1 0 0 0 0-1.414\" fill=\"currentColor\"/></svg></button>\r\n </div>\r\n </div>\r\n <!-- </div> -->\r\n</div>\r\n\r\n<ng-template #notActive>\r\n <div class=\"is-active\">\r\n <svg width=\"8\" height=\"9\" viewBox=\"0 0 8 9\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 8.5C6.20914 8.5 8 6.70914 8 4.5C8 2.29086 6.20914 0.5 4 0.5C1.79086 0.5 0 2.29086 0 4.5C0 6.70914 1.79086 8.5 4 8.5Z\" fill=\"grey\"/>\r\n </svg>\r\n <div>Not active</div>\r\n </div>\r\n</ng-template>\r\n", styles: [".info-holder{display:flex;gap:.75rem;align-items:center;font-family:Inter,sans-serif;height:102px;width:100%;background:white;padding:0 4.375rem;font-family:poppins,sans-serif}.info-holder__user-image img{width:40px;border-radius:120px;margin:20px 0 0}.info-holder__user-information{gap:10px;display:flex;flex-direction:column}.info-holder__user-name{font-size:20px;font-weight:600}.info-holder__user-breadcrumbs{display:flex;gap:8px;font-weight:400;font-size:14px;color:#000000b3;align-items:center}.info-holder .is-active,.info-holder .icon-text-wrapper{display:flex;gap:.5rem;align-items:center}.info-holder .icon-text-wrapper .icon-separator{flex-shrink:0;border-radius:50%;background-color:#000000bf;inline-size:.25rem;block-size:.25rem;margin-inline-end:.25rem}.info-holder .info-holder__user-image{width:40px;height:40px}.info-holder .info-holder__user-image .icon-people-regular{background-image:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2232%22 height%3D%2232%22 viewBox%3D%220 0 32 32%22%3E%3Cpath d%3D%22M23.23 16.757a5.746 5.746 0 1 0-7.041-9.048 5 5 0 0 0 .071-.705 4.75 4.75 0 1 0-7.705 3.689 8.43 8.43 0 0 0-6.305 7.84c0 1.052.543 2.521 3.13 3.55 1.643.595 3.371.92 5.118.965a7.8 7.8 0 0 0-.248 1.926c0 1.1.57 2.636 3.285 3.716a18.1 18.1 0 0 0 6.463 1.06c4.853 0 9.75-1.476 9.75-4.776a8.86 8.86 0 0 0-6.517-8.217M20 7.755a4.25 4.25 0 0 1 .006 8.499h-.013a4.25 4.25 0 0 1 .007-8.5M8.26 7.004a3.25 3.25 0 1 1 6.5 0 3.25 3.25 0 0 1-6.5 0m2.76 14.574c-4.177-.093-7.27-1.368-7.27-3.045 0-3.737 3.478-6.778 7.752-6.778a8.7 8.7 0 0 1 2.757.45 5.75 5.75 0 0 0 2.508 4.552 9.43 9.43 0 0 0-5.747 4.82m8.978 6.672c-4.703 0-8.249-1.408-8.249-3.276 0-3.982 3.7-7.22 8.25-7.22s8.248 3.238 8.248 7.22c0 1.868-3.546 3.276-8.25 3.276%22%2F%3E%3C%2Fsvg%3E\");background-repeat:no-repeat;background-position:center;height:40px;width:40px;display:block;background-size:contain}.icon-user-status{width:.5rem;height:.5rem;border-radius:50%;background-color:#707070}.icon-user-status.icon-user-status-active{background-color:#1d805f;display:inline-block}.action-btn-wrapper{flex:1;display:flex;align-items:center;justify-content:flex-end}.action-btn-wrapper button{background-color:#000000f2;color:#fffffff2;position:relative;display:inline-flex;gap:6px;align-items:center;justify-content:center;overflow:hidden!important;padding:8px .75rem;border:1px solid transparent;border-radius:6.25rem;font-weight:500;font-size:14px;text-overflow:ellipsis;white-space:nowrap;transition:all .1s cubic-bezier(.25,.1,.25,1);inline-size:min-content;max-inline-size:100%}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
1124
1125
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: UserInfoComponent, decorators: [{
1125
1126
  type: Component,
1126
- args: [{ selector: 'app-user-info', template: "<div style=\"display: flex; align-items: center; justify-content: space-between; background-color: white;\">\r\n <!-- <div class=\"content-box\"> -->\r\n <div class=\"info-holder\">\r\n <div class=\"info-holder__user-image\">\r\n <i class=\"icon-people-regular\"></i>\r\n </div>\r\n <div class=\"info-holder__user-information\">\r\n <div class=\"info-holder__user-name\">\r\n {{name}}\r\n <ng-container *ngIf=\"webexUUID\">\r\n <span [matTooltip]=\"'Multi-Tenant'\" matTooltipPosition=\"right\" style=\"margin-left: 8px; vertical-align: middle;\">\r\n <img src=\"assets/icons/webex.svg\" width=\"20\" alt=\"\" />\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"!webexUUID\">\r\n <span *ngIf=\"cucmid === '2549'\" [matTooltip]=\"'Dedicated Instance'\" matTooltipPosition=\"right\" style=\"margin-left: 8px; vertical-align: middle;\">\r\n <img src=\"assets/icons/onprem_ucm.svg\" width=\"25\" alt=\"\" />\r\n </span>\r\n <span *ngIf=\"cucmid !== '2549'\" [matTooltip]=\"'Dedicated Instance'\" matTooltipPosition=\"right\" style=\"margin-left: 8px; vertical-align: middle;\">\r\n <img src=\"assets/icons/di.svg\" width=\"25\" alt=\"\" />\r\n </span>\r\n </ng-container>\r\n </div>\r\n <div class=\"info-holder__user-breadcrumbs\">\r\n <div class=\"is-active\" *ngIf=\"active; else notActive\">\r\n <span class=\"icon-user-status icon-user-status-active\"></span>Active\r\n </div>\r\n <div class=\"icon-text-wrapper\">\r\n <div class=\"icon-separator\"></div>\r\n <div class=\"email\">{{email}}</div>\r\n </div>\r\n <div class=\"icon-text-wrapper\">\r\n <div class=\"icon-separator\"></div>\r\n <div class=\"position\">{{position}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"action-btn-wrapper\">\r\n <button><span>Actions</span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"14\" viewBox=\"0 0 32 32\" style=\"vertical-align:middle;\"><path d=\"M28.708 9.293a1 1 0 0 0-1.415 0L16 20.586 4.707 9.293a1 1 0 0 0-1.414 1.414l12 12a1 1 0 0 0 1.414 0l12-12a1 1 0 0 0 0-1.414\" fill=\"currentColor\"/></svg></button>\r\n </div>\r\n </div>\r\n <!-- </div> -->\r\n</div>\r\n\r\n<ng-template #notActive>\r\n <div class=\"is-active\">\r\n <svg width=\"8\" height=\"9\" viewBox=\"0 0 8 9\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 8.5C6.20914 8.5 8 6.70914 8 4.5C8 2.29086 6.20914 0.5 4 0.5C1.79086 0.5 0 2.29086 0 4.5C0 6.70914 1.79086 8.5 4 8.5Z\" fill=\"grey\"/>\r\n </svg>\r\n <div>Not active</div>\r\n </div>\r\n</ng-template>\r\n", styles: [".info-holder{display:flex;gap:.75rem;align-items:center;font-family:Inter,sans-serif;height:102px;width:100%;background:white;padding:0 4.375rem;font-family:poppins,sans-serif}.info-holder__user-image img{width:40px;border-radius:120px;margin:20px 0 0}.info-holder__user-information{gap:10px;display:flex;flex-direction:column}.info-holder__user-name{font-size:20px;font-weight:600}.info-holder__user-breadcrumbs{display:flex;gap:8px;font-weight:400;font-size:14px;color:#000000b3;align-items:center}.info-holder .is-active,.info-holder .icon-text-wrapper{display:flex;gap:.5rem;align-items:center}.info-holder .icon-text-wrapper .icon-separator{flex-shrink:0;border-radius:50%;background-color:#000000bf;inline-size:.25rem;block-size:.25rem;margin-inline-end:.25rem}.info-holder .info-holder__user-image{width:40px;height:40px}.info-holder .info-holder__user-image .icon-people-regular{background-image:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2232%22 height%3D%2232%22 viewBox%3D%220 0 32 32%22%3E%3Cpath d%3D%22M23.23 16.757a5.746 5.746 0 1 0-7.041-9.048 5 5 0 0 0 .071-.705 4.75 4.75 0 1 0-7.705 3.689 8.43 8.43 0 0 0-6.305 7.84c0 1.052.543 2.521 3.13 3.55 1.643.595 3.371.92 5.118.965a7.8 7.8 0 0 0-.248 1.926c0 1.1.57 2.636 3.285 3.716a18.1 18.1 0 0 0 6.463 1.06c4.853 0 9.75-1.476 9.75-4.776a8.86 8.86 0 0 0-6.517-8.217M20 7.755a4.25 4.25 0 0 1 .006 8.499h-.013a4.25 4.25 0 0 1 .007-8.5M8.26 7.004a3.25 3.25 0 1 1 6.5 0 3.25 3.25 0 0 1-6.5 0m2.76 14.574c-4.177-.093-7.27-1.368-7.27-3.045 0-3.737 3.478-6.778 7.752-6.778a8.7 8.7 0 0 1 2.757.45 5.75 5.75 0 0 0 2.508 4.552 9.43 9.43 0 0 0-5.747 4.82m8.978 6.672c-4.703 0-8.249-1.408-8.249-3.276 0-3.982 3.7-7.22 8.25-7.22s8.248 3.238 8.248 7.22c0 1.868-3.546 3.276-8.25 3.276%22%2F%3E%3C%2Fsvg%3E\");background-repeat:no-repeat;background-position:center;height:40px;width:40px;display:block;background-size:contain}.icon-user-status{width:.5rem;height:.5rem;border-radius:50%;background-color:#707070}.icon-user-status.icon-user-status-active{background-color:#1d805f;display:inline-block}.action-btn-wrapper{flex:1;display:flex;align-items:center;justify-content:flex-end}.action-btn-wrapper button{background-color:#000000f2;color:#fffffff2;position:relative;display:inline-flex;gap:6px;align-items:center;justify-content:center;overflow:hidden!important;padding:8px .75rem;border:1px solid transparent;border-radius:6.25rem;font-weight:500;font-size:14px;text-overflow:ellipsis;white-space:nowrap;transition:all .1s cubic-bezier(.25,.1,.25,1);inline-size:min-content;max-inline-size:100%}\n"] }]
1127
+ args: [{ selector: 'app-user-info', template: "<div style=\"display: flex; align-items: center; justify-content: space-between; background-color: white;\">\r\n <!-- <div class=\"content-box\"> -->\r\n <div class=\"info-holder\">\r\n <div class=\"info-holder__user-image\">\r\n <i class=\"icon-people-regular\"></i>\r\n </div>\r\n <div class=\"info-holder__user-information\">\r\n <div class=\"info-holder__user-name\">\r\n {{name}}\r\n <ng-container *ngIf=\"webexUUID\">\r\n <span [matTooltip]=\"'Multi-Tenant'\" matTooltipPosition=\"right\" style=\"display: inline-flex; margin-left: 8px; vertical-align: middle;\">\r\n <img src=\"assets/icons/webex.svg\" width=\"20\" alt=\"\" />\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"!webexUUID\">\r\n <span *ngIf=\"cucmid == 2542\" [matTooltip]=\"'On Prem Instance'\" matTooltipPosition=\"right\" style=\"display: inline-flex; margin-left: 8px; vertical-align: middle;\">\r\n <img src=\"assets/icons/onprem_ucm.svg\" width=\"25\" alt=\"\" />\r\n </span>\r\n <span *ngIf=\"cucmid != 2542\" [matTooltip]=\"'Dedicated Instance'\" matTooltipPosition=\"right\" style=\"display: inline-flex; margin-left: 8px; vertical-align: middle;\">\r\n <img src=\"assets/icons/di.svg\" width=\"25\" alt=\"\" />\r\n </span>\r\n </ng-container>\r\n </div>\r\n <div class=\"info-holder__user-breadcrumbs\">\r\n <div class=\"is-active\" *ngIf=\"active; else notActive\">\r\n <span class=\"icon-user-status icon-user-status-active\"></span>Active\r\n </div>\r\n <div class=\"icon-text-wrapper\">\r\n <div class=\"icon-separator\"></div>\r\n <div class=\"email\">{{email}}</div>\r\n </div>\r\n <div class=\"icon-text-wrapper\">\r\n <div class=\"icon-separator\"></div>\r\n <div class=\"position\">{{position}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"action-btn-wrapper\">\r\n <button><span>Actions</span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"14\" viewBox=\"0 0 32 32\" style=\"vertical-align:middle;\"><path d=\"M28.708 9.293a1 1 0 0 0-1.415 0L16 20.586 4.707 9.293a1 1 0 0 0-1.414 1.414l12 12a1 1 0 0 0 1.414 0l12-12a1 1 0 0 0 0-1.414\" fill=\"currentColor\"/></svg></button>\r\n </div>\r\n </div>\r\n <!-- </div> -->\r\n</div>\r\n\r\n<ng-template #notActive>\r\n <div class=\"is-active\">\r\n <svg width=\"8\" height=\"9\" viewBox=\"0 0 8 9\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 8.5C6.20914 8.5 8 6.70914 8 4.5C8 2.29086 6.20914 0.5 4 0.5C1.79086 0.5 0 2.29086 0 4.5C0 6.70914 1.79086 8.5 4 8.5Z\" fill=\"grey\"/>\r\n </svg>\r\n <div>Not active</div>\r\n </div>\r\n</ng-template>\r\n", styles: [".info-holder{display:flex;gap:.75rem;align-items:center;font-family:Inter,sans-serif;height:102px;width:100%;background:white;padding:0 4.375rem;font-family:poppins,sans-serif}.info-holder__user-image img{width:40px;border-radius:120px;margin:20px 0 0}.info-holder__user-information{gap:10px;display:flex;flex-direction:column}.info-holder__user-name{font-size:20px;font-weight:600}.info-holder__user-breadcrumbs{display:flex;gap:8px;font-weight:400;font-size:14px;color:#000000b3;align-items:center}.info-holder .is-active,.info-holder .icon-text-wrapper{display:flex;gap:.5rem;align-items:center}.info-holder .icon-text-wrapper .icon-separator{flex-shrink:0;border-radius:50%;background-color:#000000bf;inline-size:.25rem;block-size:.25rem;margin-inline-end:.25rem}.info-holder .info-holder__user-image{width:40px;height:40px}.info-holder .info-holder__user-image .icon-people-regular{background-image:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2232%22 height%3D%2232%22 viewBox%3D%220 0 32 32%22%3E%3Cpath d%3D%22M23.23 16.757a5.746 5.746 0 1 0-7.041-9.048 5 5 0 0 0 .071-.705 4.75 4.75 0 1 0-7.705 3.689 8.43 8.43 0 0 0-6.305 7.84c0 1.052.543 2.521 3.13 3.55 1.643.595 3.371.92 5.118.965a7.8 7.8 0 0 0-.248 1.926c0 1.1.57 2.636 3.285 3.716a18.1 18.1 0 0 0 6.463 1.06c4.853 0 9.75-1.476 9.75-4.776a8.86 8.86 0 0 0-6.517-8.217M20 7.755a4.25 4.25 0 0 1 .006 8.499h-.013a4.25 4.25 0 0 1 .007-8.5M8.26 7.004a3.25 3.25 0 1 1 6.5 0 3.25 3.25 0 0 1-6.5 0m2.76 14.574c-4.177-.093-7.27-1.368-7.27-3.045 0-3.737 3.478-6.778 7.752-6.778a8.7 8.7 0 0 1 2.757.45 5.75 5.75 0 0 0 2.508 4.552 9.43 9.43 0 0 0-5.747 4.82m8.978 6.672c-4.703 0-8.249-1.408-8.249-3.276 0-3.982 3.7-7.22 8.25-7.22s8.248 3.238 8.248 7.22c0 1.868-3.546 3.276-8.25 3.276%22%2F%3E%3C%2Fsvg%3E\");background-repeat:no-repeat;background-position:center;height:40px;width:40px;display:block;background-size:contain}.icon-user-status{width:.5rem;height:.5rem;border-radius:50%;background-color:#707070}.icon-user-status.icon-user-status-active{background-color:#1d805f;display:inline-block}.action-btn-wrapper{flex:1;display:flex;align-items:center;justify-content:flex-end}.action-btn-wrapper button{background-color:#000000f2;color:#fffffff2;position:relative;display:inline-flex;gap:6px;align-items:center;justify-content:center;overflow:hidden!important;padding:8px .75rem;border:1px solid transparent;border-radius:6.25rem;font-weight:500;font-size:14px;text-overflow:ellipsis;white-space:nowrap;transition:all .1s cubic-bezier(.25,.1,.25,1);inline-size:min-content;max-inline-size:100%}\n"] }]
1127
1128
  }], propDecorators: { name: [{
1128
1129
  type: Input
1129
1130
  }], active: [{