@tuki-io/tuki-widgets 0.0.200 → 0.0.202
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/di2mt/shared/components/stat-card/stat-card.component.mjs +4 -4
- package/esm2020/user-creation/src/app.constants.mjs +16 -2
- package/esm2020/user-creation/src/classes/notification.mjs +32 -0
- package/esm2020/user-creation/src/environments/environment.mjs +11 -0
- package/esm2020/user-creation/src/interfaces/user-creation-wizard.interfaces.mjs +199 -0
- package/esm2020/user-creation/src/shared/components/notification/notification.component.mjs +38 -0
- package/esm2020/user-creation/src/shared/material.module.mjs +35 -7
- package/esm2020/user-creation/src/shared/pipes/truncate.pipe.mjs +30 -0
- package/esm2020/user-creation/src/shared/services/notification.service.mjs +62 -0
- package/esm2020/user-creation/src/shared/services/user-creation-api.service.mjs +43 -19
- package/esm2020/user-creation/src/shared/shared.module.mjs +27 -4
- package/esm2020/user-creation/src/user-creation.module.mjs +40 -7
- package/esm2020/user-creation/src/utils/app-loader/app-loader.mjs +14 -0
- package/esm2020/user-creation/src/utils/build-savable-end-user.mjs +147 -0
- package/esm2020/user-creation/src/utils/device-default-prefix.mjs +13 -0
- package/esm2020/user-creation/src/utils/device-name-validation.mjs +23 -0
- package/esm2020/user-creation/src/utils/model.mjs +19 -0
- package/esm2020/user-creation/src/utils/parse-device-name-rule.mjs +26 -0
- package/esm2020/user-creation/src/widgets/user-creation-wizard/components/user-details-step/user-details-step.component.mjs +512 -20
- package/esm2020/user-creation/src/widgets/user-creation-wizard/components/user-overview-step/user-overview-step.component.mjs +3 -3
- package/esm2020/user-creation/src/widgets/user-creation-wizard/components/user-template-step/user-template-step.component.mjs +80 -34
- package/esm2020/user-creation/src/widgets/user-creation-wizard/user-creation-wizard.component.mjs +83 -19
- package/esm2020/user-creation/src/widgets/user-creation-wizard/user-creation-wizard.service.mjs +599 -124
- package/fesm2015/tuki-io-tuki-widgets-di2mt.mjs +3 -3
- package/fesm2015/tuki-io-tuki-widgets-di2mt.mjs.map +1 -1
- package/fesm2015/tuki-io-tuki-widgets-user-creation.mjs +2129 -325
- package/fesm2015/tuki-io-tuki-widgets-user-creation.mjs.map +1 -1
- package/fesm2020/tuki-io-tuki-widgets-di2mt.mjs +3 -3
- package/fesm2020/tuki-io-tuki-widgets-di2mt.mjs.map +1 -1
- package/fesm2020/tuki-io-tuki-widgets-user-creation.mjs +2084 -314
- package/fesm2020/tuki-io-tuki-widgets-user-creation.mjs.map +1 -1
- package/package.json +1 -1
- package/user-creation/src/app.constants.d.ts +10 -0
- package/user-creation/src/classes/notification.d.ts +18 -0
- package/user-creation/src/environments/environment.d.ts +9 -0
- package/user-creation/src/interfaces/user-creation-wizard.interfaces.d.ts +554 -0
- package/user-creation/src/shared/components/notification/notification.component.d.ts +19 -0
- package/user-creation/src/shared/material.module.d.ts +5 -1
- package/user-creation/src/shared/pipes/truncate.pipe.d.ts +7 -0
- package/user-creation/src/shared/services/notification.service.d.ts +18 -0
- package/user-creation/src/shared/services/user-creation-api.service.d.ts +8 -2
- package/user-creation/src/shared/shared.module.d.ts +3 -1
- package/user-creation/src/user-creation.module.d.ts +17 -10
- package/user-creation/src/utils/app-loader/app-loader.d.ts +6 -0
- package/user-creation/src/utils/build-savable-end-user.d.ts +23 -0
- package/user-creation/src/utils/device-default-prefix.d.ts +5 -0
- package/user-creation/src/utils/device-name-validation.d.ts +6 -0
- package/user-creation/src/utils/model.d.ts +1 -0
- package/user-creation/src/utils/parse-device-name-rule.d.ts +8 -0
- package/user-creation/src/widgets/user-creation-wizard/components/user-details-step/user-details-step.component.d.ts +83 -7
- package/user-creation/src/widgets/user-creation-wizard/components/user-template-step/user-template-step.component.d.ts +11 -4
- package/user-creation/src/widgets/user-creation-wizard/user-creation-wizard.component.d.ts +18 -0
- package/user-creation/src/widgets/user-creation-wizard/user-creation-wizard.service.d.ts +71 -56
|
@@ -877,14 +877,14 @@ class StatCardComponent {
|
|
|
877
877
|
return Math.ceil(this.stats?.totalUpgraded / this.stats?.total * 100);
|
|
878
878
|
}
|
|
879
879
|
get pendingActivationPercentage() {
|
|
880
|
-
return Math.ceil(this.stats?.pendingActivation / this.stats?.
|
|
880
|
+
return Math.ceil(this.stats?.pendingActivation / this.stats?.pendingActivation * 100);
|
|
881
881
|
}
|
|
882
882
|
}
|
|
883
883
|
StatCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: StatCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
884
|
-
StatCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: StatCardComponent, selector: "tk-stat-card", inputs: { title: "title", type: "type", readinessStats: "readinessStats", upgradeStatus: "upgradeStatus" }, ngImport: i0, template: "<tk-card [title]=\"title\">\r\n <ng-container ngProjectAs=\"card-content\">\r\n <div class=\"card__content-info\">\r\n <div class=\"card__content-wrapper\">\r\n <img width=\"42\" [src]=\"'assets/icons/' + type + '.png'\" alt=\"\" />\r\n <div class=\"card__content-text\">\r\n <ng-container *ngIf=\"upgradeStatus === 'ready' || upgradeStatus === 'already'\">\r\n <div class=\"card__content-label\">\r\n {{ upgradeStatus === 'ready' ? stats?.totalReady : stats?.totalUpgraded }}\r\n {{ type === 'user' ? 'Users' : 'Sites' }}</div>\r\n <div class=\"card__content-description\">{{ upgradeStatus === 'ready' ? 'Ready to Upgrade' : 'Already Upgraded' }}</div>\r\n </ng-container>\r\n <ng-container *ngIf=\"upgradeStatus === 'pending'\">\r\n <div class=\"card__content-label\">\r\n {{ stats?.pendingActivation }}\r\n {{ 'Users' }}</div>\r\n <div class=\"card__content-description\">{{ 'Ready to activate' }}</div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card__content-progress-wrapper\">\r\n <ng-container *ngIf=\"upgradeStatus === 'ready' || upgradeStatus === 'already'\">\r\n <div class=\"card__content-progress\">\r\n <div class=\"card__content-progress-label\">\r\n <span>{{ readyPercentage }}%</span>\r\n <span>From all {{ stats?.total }} {{ type === 'user' ? 'users' : 'sites' }}</span>\r\n </div>\r\n <div class=\"card__content-progress-bar\">\r\n <div\r\n class=\"card__content-progress-bar-fill ready\"\r\n [class.already]=\"upgradeStatus === 'already'\"\r\n [style.width.%]=\"readyPercentage\"\r\n ></div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"upgradeStatus === 'already'\" class=\"card__content-progress\">\r\n <div class=\"card__content-progress-label\">\r\n <span>{{ upgradedPercentage }}%</span>\r\n <span>From all {{ stats?.totalReady }} ready {{ type === 'user' ? 'users' : 'sites' }}</span>\r\n </div>\r\n <div class=\"card__content-progress-bar\">\r\n <div\r\n class=\"card__content-progress-bar-fill ready\"\r\n [class.already]=\"upgradeStatus === 'already'\"\r\n [style.width.%]=\"upgradedPercentage\"\r\n ></div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"upgradeStatus === 'pending'\">\r\n <div class=\"card__content-progress\">\r\n <div class=\"card__content-progress-label\">\r\n <span>{{ pendingActivationPercentage }}%</span>\r\n <span>From all {{ stats?.
|
|
884
|
+
StatCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: StatCardComponent, selector: "tk-stat-card", inputs: { title: "title", type: "type", readinessStats: "readinessStats", upgradeStatus: "upgradeStatus" }, ngImport: i0, template: "<tk-card [title]=\"title\">\r\n <ng-container ngProjectAs=\"card-content\">\r\n <div class=\"card__content-info\">\r\n <div class=\"card__content-wrapper\">\r\n <img width=\"42\" [src]=\"'assets/icons/' + type + '.png'\" alt=\"\" />\r\n <div class=\"card__content-text\">\r\n <ng-container *ngIf=\"upgradeStatus === 'ready' || upgradeStatus === 'already'\">\r\n <div class=\"card__content-label\">\r\n {{ upgradeStatus === 'ready' ? stats?.totalReady : stats?.totalUpgraded }}\r\n {{ type === 'user' ? 'Users' : 'Sites' }}</div>\r\n <div class=\"card__content-description\">{{ upgradeStatus === 'ready' ? 'Ready to Upgrade' : 'Already Upgraded' }}</div>\r\n </ng-container>\r\n <ng-container *ngIf=\"upgradeStatus === 'pending'\">\r\n <div class=\"card__content-label\">\r\n {{ stats?.pendingActivation }}\r\n {{ 'Users' }}</div>\r\n <div class=\"card__content-description\">{{ 'Ready to activate' }}</div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card__content-progress-wrapper\">\r\n <ng-container *ngIf=\"upgradeStatus === 'ready' || upgradeStatus === 'already'\">\r\n <div class=\"card__content-progress\">\r\n <div class=\"card__content-progress-label\">\r\n <span>{{ readyPercentage }}%</span>\r\n <span>From all {{ stats?.total }} {{ type === 'user' ? 'users' : 'sites' }}</span>\r\n </div>\r\n <div class=\"card__content-progress-bar\">\r\n <div\r\n class=\"card__content-progress-bar-fill ready\"\r\n [class.already]=\"upgradeStatus === 'already'\"\r\n [style.width.%]=\"readyPercentage\"\r\n ></div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"upgradeStatus === 'already'\" class=\"card__content-progress\">\r\n <div class=\"card__content-progress-label\">\r\n <span>{{ upgradedPercentage }}%</span>\r\n <span>From all {{ stats?.totalReady }} ready {{ type === 'user' ? 'users' : 'sites' }}</span>\r\n </div>\r\n <div class=\"card__content-progress-bar\">\r\n <div\r\n class=\"card__content-progress-bar-fill ready\"\r\n [class.already]=\"upgradeStatus === 'already'\"\r\n [style.width.%]=\"upgradedPercentage\"\r\n ></div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"upgradeStatus === 'pending'\">\r\n <div class=\"card__content-progress\">\r\n <div class=\"card__content-progress-label\">\r\n <span>{{ pendingActivationPercentage }}%</span>\r\n <span>From all {{ stats?.pendingActivation }} {{ 'upgraded users' }}</span>\r\n </div>\r\n <div class=\"card__content-progress-bar\" style=\"overflow: hidden;\">\r\n <div\r\n class=\"card__content-progress-bar-fill ready\"\r\n [class.pending-activation]=\"upgradeStatus === 'pending'\"\r\n [style.width.%]=\"pendingActivationPercentage\"\r\n ></div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n</tk-card>\r\n", styles: [":host{display:block;height:100%;box-sizing:border-box}.card__content-info{display:flex;align-items:center;justify-content:space-between}.card__content-text{display:flex;flex-direction:column;gap:.25rem}.card__content-text .card__content-label{font-size:20px}.card__content-text .card__content-description{font-size:12px}.card__content-wrapper{display:flex;align-items:center;justify-content:center;gap:1rem}.card__content-wrapper:first-child{display:flex;gap:.5rem}.card__content-progress-wrapper{display:flex;flex-direction:column;gap:1rem}.card__content-progress{display:flex;flex-direction:column;gap:.25rem;font-size:14px}.card__content-progress .card__content-progress-label{display:flex;align-items:center;justify-content:space-between;padding:.05rem}.card__content-progress .card__content-progress-bar{background-color:#ededed;border-radius:10rem}.card__content-progress .card__content-progress-bar .card__content-progress-bar-fill{height:10px;border-radius:inherit}.ready{background-color:#0a78cc}.already{background-color:#16a693}.pending-activation{background-color:#ddbf45}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CardComponent, selector: "tk-card", inputs: ["title"] }] });
|
|
885
885
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: StatCardComponent, decorators: [{
|
|
886
886
|
type: Component,
|
|
887
|
-
args: [{ selector: 'tk-stat-card', template: "<tk-card [title]=\"title\">\r\n <ng-container ngProjectAs=\"card-content\">\r\n <div class=\"card__content-info\">\r\n <div class=\"card__content-wrapper\">\r\n <img width=\"42\" [src]=\"'assets/icons/' + type + '.png'\" alt=\"\" />\r\n <div class=\"card__content-text\">\r\n <ng-container *ngIf=\"upgradeStatus === 'ready' || upgradeStatus === 'already'\">\r\n <div class=\"card__content-label\">\r\n {{ upgradeStatus === 'ready' ? stats?.totalReady : stats?.totalUpgraded }}\r\n {{ type === 'user' ? 'Users' : 'Sites' }}</div>\r\n <div class=\"card__content-description\">{{ upgradeStatus === 'ready' ? 'Ready to Upgrade' : 'Already Upgraded' }}</div>\r\n </ng-container>\r\n <ng-container *ngIf=\"upgradeStatus === 'pending'\">\r\n <div class=\"card__content-label\">\r\n {{ stats?.pendingActivation }}\r\n {{ 'Users' }}</div>\r\n <div class=\"card__content-description\">{{ 'Ready to activate' }}</div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card__content-progress-wrapper\">\r\n <ng-container *ngIf=\"upgradeStatus === 'ready' || upgradeStatus === 'already'\">\r\n <div class=\"card__content-progress\">\r\n <div class=\"card__content-progress-label\">\r\n <span>{{ readyPercentage }}%</span>\r\n <span>From all {{ stats?.total }} {{ type === 'user' ? 'users' : 'sites' }}</span>\r\n </div>\r\n <div class=\"card__content-progress-bar\">\r\n <div\r\n class=\"card__content-progress-bar-fill ready\"\r\n [class.already]=\"upgradeStatus === 'already'\"\r\n [style.width.%]=\"readyPercentage\"\r\n ></div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"upgradeStatus === 'already'\" class=\"card__content-progress\">\r\n <div class=\"card__content-progress-label\">\r\n <span>{{ upgradedPercentage }}%</span>\r\n <span>From all {{ stats?.totalReady }} ready {{ type === 'user' ? 'users' : 'sites' }}</span>\r\n </div>\r\n <div class=\"card__content-progress-bar\">\r\n <div\r\n class=\"card__content-progress-bar-fill ready\"\r\n [class.already]=\"upgradeStatus === 'already'\"\r\n [style.width.%]=\"upgradedPercentage\"\r\n ></div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"upgradeStatus === 'pending'\">\r\n <div class=\"card__content-progress\">\r\n <div class=\"card__content-progress-label\">\r\n <span>{{ pendingActivationPercentage }}%</span>\r\n <span>From all {{ stats?.
|
|
887
|
+
args: [{ selector: 'tk-stat-card', template: "<tk-card [title]=\"title\">\r\n <ng-container ngProjectAs=\"card-content\">\r\n <div class=\"card__content-info\">\r\n <div class=\"card__content-wrapper\">\r\n <img width=\"42\" [src]=\"'assets/icons/' + type + '.png'\" alt=\"\" />\r\n <div class=\"card__content-text\">\r\n <ng-container *ngIf=\"upgradeStatus === 'ready' || upgradeStatus === 'already'\">\r\n <div class=\"card__content-label\">\r\n {{ upgradeStatus === 'ready' ? stats?.totalReady : stats?.totalUpgraded }}\r\n {{ type === 'user' ? 'Users' : 'Sites' }}</div>\r\n <div class=\"card__content-description\">{{ upgradeStatus === 'ready' ? 'Ready to Upgrade' : 'Already Upgraded' }}</div>\r\n </ng-container>\r\n <ng-container *ngIf=\"upgradeStatus === 'pending'\">\r\n <div class=\"card__content-label\">\r\n {{ stats?.pendingActivation }}\r\n {{ 'Users' }}</div>\r\n <div class=\"card__content-description\">{{ 'Ready to activate' }}</div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card__content-progress-wrapper\">\r\n <ng-container *ngIf=\"upgradeStatus === 'ready' || upgradeStatus === 'already'\">\r\n <div class=\"card__content-progress\">\r\n <div class=\"card__content-progress-label\">\r\n <span>{{ readyPercentage }}%</span>\r\n <span>From all {{ stats?.total }} {{ type === 'user' ? 'users' : 'sites' }}</span>\r\n </div>\r\n <div class=\"card__content-progress-bar\">\r\n <div\r\n class=\"card__content-progress-bar-fill ready\"\r\n [class.already]=\"upgradeStatus === 'already'\"\r\n [style.width.%]=\"readyPercentage\"\r\n ></div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"upgradeStatus === 'already'\" class=\"card__content-progress\">\r\n <div class=\"card__content-progress-label\">\r\n <span>{{ upgradedPercentage }}%</span>\r\n <span>From all {{ stats?.totalReady }} ready {{ type === 'user' ? 'users' : 'sites' }}</span>\r\n </div>\r\n <div class=\"card__content-progress-bar\">\r\n <div\r\n class=\"card__content-progress-bar-fill ready\"\r\n [class.already]=\"upgradeStatus === 'already'\"\r\n [style.width.%]=\"upgradedPercentage\"\r\n ></div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"upgradeStatus === 'pending'\">\r\n <div class=\"card__content-progress\">\r\n <div class=\"card__content-progress-label\">\r\n <span>{{ pendingActivationPercentage }}%</span>\r\n <span>From all {{ stats?.pendingActivation }} {{ 'upgraded users' }}</span>\r\n </div>\r\n <div class=\"card__content-progress-bar\" style=\"overflow: hidden;\">\r\n <div\r\n class=\"card__content-progress-bar-fill ready\"\r\n [class.pending-activation]=\"upgradeStatus === 'pending'\"\r\n [style.width.%]=\"pendingActivationPercentage\"\r\n ></div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n</tk-card>\r\n", styles: [":host{display:block;height:100%;box-sizing:border-box}.card__content-info{display:flex;align-items:center;justify-content:space-between}.card__content-text{display:flex;flex-direction:column;gap:.25rem}.card__content-text .card__content-label{font-size:20px}.card__content-text .card__content-description{font-size:12px}.card__content-wrapper{display:flex;align-items:center;justify-content:center;gap:1rem}.card__content-wrapper:first-child{display:flex;gap:.5rem}.card__content-progress-wrapper{display:flex;flex-direction:column;gap:1rem}.card__content-progress{display:flex;flex-direction:column;gap:.25rem;font-size:14px}.card__content-progress .card__content-progress-label{display:flex;align-items:center;justify-content:space-between;padding:.05rem}.card__content-progress .card__content-progress-bar{background-color:#ededed;border-radius:10rem}.card__content-progress .card__content-progress-bar .card__content-progress-bar-fill{height:10px;border-radius:inherit}.ready{background-color:#0a78cc}.already{background-color:#16a693}.pending-activation{background-color:#ddbf45}\n"] }]
|
|
888
888
|
}], propDecorators: { title: [{
|
|
889
889
|
type: Input
|
|
890
890
|
}], type: [{
|