ngx-histaff-alpha 5.1.3 → 5.1.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.
|
@@ -20260,13 +20260,15 @@ class CoreTopicPickerComponent extends CoreFormControlBaseComponent {
|
|
|
20260
20260
|
this.alertService = alertService;
|
|
20261
20261
|
this.mls = mls;
|
|
20262
20262
|
this.subscriptions = [];
|
|
20263
|
+
this.expandState = signal(false);
|
|
20264
|
+
this.loading = signal(false);
|
|
20263
20265
|
}
|
|
20264
20266
|
ngOnInit() {
|
|
20265
20267
|
this.subscriptions.push(this.mls.lang$.subscribe(x => this.lang = x));
|
|
20266
20268
|
}
|
|
20267
20269
|
toggleExpanded() {
|
|
20268
20270
|
if (!this.disabled) {
|
|
20269
|
-
this.expandState
|
|
20271
|
+
this.expandState.update(v => !v);
|
|
20270
20272
|
}
|
|
20271
20273
|
}
|
|
20272
20274
|
onTreeItemClick(event) {
|
|
@@ -20283,9 +20285,9 @@ class CoreTopicPickerComponent extends CoreFormControlBaseComponent {
|
|
|
20283
20285
|
this.shownText = "";
|
|
20284
20286
|
}
|
|
20285
20287
|
else {
|
|
20286
|
-
this.loading
|
|
20288
|
+
this.loading.set(true);
|
|
20287
20289
|
this.subscriptions.push(this.appService.get(this.getByIdApi + "?id=" + obj.toString()).subscribe(x => {
|
|
20288
|
-
this.loading
|
|
20290
|
+
this.loading.set(false);
|
|
20289
20291
|
if (x.ok && x.status === 200) {
|
|
20290
20292
|
const body = x.body;
|
|
20291
20293
|
//this.responseService.resolve(body);
|
|
@@ -20316,7 +20318,7 @@ class CoreTopicPickerComponent extends CoreFormControlBaseComponent {
|
|
|
20316
20318
|
* handle click outside
|
|
20317
20319
|
*/
|
|
20318
20320
|
if (this.container && !!!this.container.nativeElement.contains(e.target)) {
|
|
20319
|
-
this.expandState
|
|
20321
|
+
this.expandState.set(false);
|
|
20320
20322
|
}
|
|
20321
20323
|
});
|
|
20322
20324
|
const maxZIndex = this.domService.getMaxZIndex();
|
|
@@ -20336,7 +20338,7 @@ class CoreTopicPickerComponent extends CoreFormControlBaseComponent {
|
|
|
20336
20338
|
multi: true,
|
|
20337
20339
|
useExisting: CoreTopicPickerComponent
|
|
20338
20340
|
}
|
|
20339
|
-
], viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (loading) {\n <app-threedots></app-threedots>\n}\n<div #container class=\"core-topic-picker-container\" [class.d-none]=\"loading\">\n <input type=\"checkbox\" class=\"expand-state\" [(ngModel)]=\"expandState\">\n <input class=\"value\" [value]=\"value\">\n <label type=\"text\" class=\"text form-control\" [class.form-control-disabled]=\"disabled\">\n <span [appTooltip]=\"shownText\">{{ !!loading ? \"...\" : shownText }}</span>\n <div class=\"icon\" (click)=\"toggleExpanded()\">\n <i class=\"feather-chevrons-down\"></i>\n </div>\n\n <div class=\"clear-icon-wrapper\" [class.d-none]=\"!!disabled || !!!value\" (click)=\"onClickClear()\">\n <div class=\"flex-wrapper\" [appTooltip]=\"'UI.CORE_CONTOL_COMMON_CLEAR' | translate: lang\">\n <i class=\"feather-x\"></i>\n </div>\n </div>\n \n </label>\n @if (!!expandState) {\n <div class=\"dropdown\" [class.form-control-disabled]=\"disabled\">\n <core-topic-tree [translateText]=\"true\" (itemClick)=\"onTreeItemClick($event)\"></core-topic-tree>\n </div>\n }\n\n</div>", styles: [".core-topic-picker-container{position:relative;display:block;--indicator-height: 0px;--search-bg-color: white;--search-border-color: #D1D1D1;--search-item-hover-bg: #358ccb;--search-item-hover-color: white;--dropdown-bg: lightyellow;--arrow-color: #358ccb;--height: var(--size-form-control-height);--item-height: 50px;--max-z-index: 0;--search-height: 38px;--popup-height: 460px}.core-topic-picker-container input.expand-state,.core-topic-picker-container .value{display:none}.core-topic-picker-container label.text{width:100%;height:var(--height);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:flex;align-items:center;justify-content:space-between}.core-topic-picker-container label.text .clear-icon-wrapper{display:none;position:absolute;background-color:transparent;right:45px;top:2px;width:44px;height:44px;border-radius:.375rem;cursor:pointer}.core-topic-picker-container label.text .clear-icon-wrapper>.flex-wrapper{width:44px;height:44px;display:flex;align-items:center;justify-content:center}.core-topic-picker-container label.text .clear-icon-wrapper>.flex-wrapper>i{color:#848484;font-size:20px}.core-topic-picker-container label.text:hover>.clear-icon-wrapper{display:block}.core-topic-picker-container label.text span{width:calc(100% - var(--height));overflow-x:hidden;text-overflow:ellipsis;color:inherit}.core-topic-picker-container label.text div.icon{display:flex;align-items:center;justify-content:center;position:absolute;right:3px;top:3px;width:calc(var(--height) - 6px);height:calc(var(--height) - 6px);background-color:#e9e9e9;border-radius:3px;cursor:pointer}.core-topic-picker-container label.text div.icon i{width:28px;height:28px;font-size:28px;color:#848484}.core-topic-picker-container .dropdown{display:block;position:absolute;width:800px;min-width:100%;max-height:0px;overflow-x:auto;overflow-y:hidden;background-color:#fff;font-size:15px;box-shadow:0 1rem 3rem #0000002e;transition:.25s linear;z-index:calc(var(--max-z-index) + 1)}.core-topic-picker-container .dropdown ul{padding-left:6px}.core-topic-picker-container .dropdown ul>li{display:flex;align-items:center;cursor:pointer;padding:0px var(--size-scrollbar-width);transition:.25s linear}.core-topic-picker-container .dropdown ul>li>label{width:100%}.core-topic-picker-container .dropdown ul>li:hover{background-color:var(--search-item-hover-bg);color:var(--search-item-hover-color);transition:.25s linear}.core-topic-picker-container input.expand-state:checked~.dropdown{border:1px solid #ced4da;margin-top:2px;max-height:var(--popup-height);border-bottom-left-radius:.375rem;border-bottom-right-radius:.375rem;transition:.25s linear}.core-topic-picker-container input.search{margin:0;width:100%;border:0;border-bottom:1px solid var(--search-border-color);background-color:var(--search-bg-color);position:sticky;top:0;height:38px;padding:6px 12px;font-size:15px}.core-topic-picker-container input.search:focus{outline:none}\n"], dependencies: [{ kind: "directive", type: TooltipDirective, selector: "[appTooltip]", inputs: ["color", "backgroundColor", "appTooltip", "showAnyway", "position"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ThreedotsComponent, selector: "app-threedots" }, { kind: "component", type: CoreTopicTreeComponent, selector: "core-topic-tree", inputs: ["lineColor", "translateText", "fullWidthMode", "accessorMode", "fullRendering", "height", "disabledLoopExpand", "showCheckInheritance", "inlineExtraTemplateRef"], outputs: ["itemDoubleClick", "itemClick"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
|
|
20341
|
+
], viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (loading()) {\n <app-threedots></app-threedots>\n}\n\n<div #container class=\"core-topic-picker-container\" [class.d-none]=\"loading()\">\n <input type=\"checkbox\" class=\"expand-state\" [(ngModel)]=\"expandState\">\n <input class=\"value\" [value]=\"value\">\n <label type=\"text\" class=\"text form-control\" [class.form-control-disabled]=\"disabled\">\n <span [appTooltip]=\"shownText\">{{ !!loading() ? \"...\" : shownText }}</span>\n <div class=\"icon\" (click)=\"toggleExpanded()\">\n <i class=\"feather-chevrons-down\"></i>\n </div>\n\n <div class=\"clear-icon-wrapper\" [class.d-none]=\"!!disabled || !!!value\" (click)=\"onClickClear()\">\n <div class=\"flex-wrapper\" [appTooltip]=\"'UI.CORE_CONTOL_COMMON_CLEAR' | translate: lang\">\n <i class=\"feather-x\"></i>\n </div>\n </div>\n \n </label>\n @if (!!expandState()) {\n <div class=\"dropdown\" [class.form-control-disabled]=\"disabled\">\n <core-topic-tree [translateText]=\"true\" (itemClick)=\"onTreeItemClick($event)\"></core-topic-tree>\n </div>\n }\n\n</div>", styles: [".core-topic-picker-container{position:relative;display:block;--indicator-height: 0px;--search-bg-color: white;--search-border-color: #D1D1D1;--search-item-hover-bg: #358ccb;--search-item-hover-color: white;--dropdown-bg: lightyellow;--arrow-color: #358ccb;--height: var(--size-form-control-height);--item-height: 50px;--max-z-index: 0;--search-height: 38px;--popup-height: 460px}.core-topic-picker-container input.expand-state,.core-topic-picker-container .value{display:none}.core-topic-picker-container label.text{width:100%;height:var(--height);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:flex;align-items:center;justify-content:space-between}.core-topic-picker-container label.text .clear-icon-wrapper{display:none;position:absolute;background-color:transparent;right:45px;top:2px;width:44px;height:44px;border-radius:.375rem;cursor:pointer}.core-topic-picker-container label.text .clear-icon-wrapper>.flex-wrapper{width:44px;height:44px;display:flex;align-items:center;justify-content:center}.core-topic-picker-container label.text .clear-icon-wrapper>.flex-wrapper>i{color:#848484;font-size:20px}.core-topic-picker-container label.text:hover>.clear-icon-wrapper{display:block}.core-topic-picker-container label.text span{width:calc(100% - var(--height));overflow-x:hidden;text-overflow:ellipsis;color:inherit}.core-topic-picker-container label.text div.icon{display:flex;align-items:center;justify-content:center;position:absolute;right:3px;top:3px;width:calc(var(--height) - 6px);height:calc(var(--height) - 6px);background-color:#e9e9e9;border-radius:3px;cursor:pointer}.core-topic-picker-container label.text div.icon i{width:28px;height:28px;font-size:28px;color:#848484}.core-topic-picker-container .dropdown{display:block;position:absolute;width:800px;min-width:100%;max-height:0px;overflow-x:auto;overflow-y:hidden;background-color:#fff;font-size:15px;box-shadow:0 1rem 3rem #0000002e;transition:.25s linear;z-index:calc(var(--max-z-index) + 1)}.core-topic-picker-container .dropdown ul{padding-left:6px}.core-topic-picker-container .dropdown ul>li{display:flex;align-items:center;cursor:pointer;padding:0px var(--size-scrollbar-width);transition:.25s linear}.core-topic-picker-container .dropdown ul>li>label{width:100%}.core-topic-picker-container .dropdown ul>li:hover{background-color:var(--search-item-hover-bg);color:var(--search-item-hover-color);transition:.25s linear}.core-topic-picker-container input.expand-state:checked~.dropdown{border:1px solid #ced4da;margin-top:2px;max-height:var(--popup-height);border-bottom-left-radius:.375rem;border-bottom-right-radius:.375rem;transition:.25s linear}.core-topic-picker-container input.search{margin:0;width:100%;border:0;border-bottom:1px solid var(--search-border-color);background-color:var(--search-bg-color);position:sticky;top:0;height:38px;padding:6px 12px;font-size:15px}.core-topic-picker-container input.search:focus{outline:none}\n"], dependencies: [{ kind: "directive", type: TooltipDirective, selector: "[appTooltip]", inputs: ["color", "backgroundColor", "appTooltip", "showAnyway", "position"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ThreedotsComponent, selector: "app-threedots" }, { kind: "component", type: CoreTopicTreeComponent, selector: "core-topic-tree", inputs: ["lineColor", "translateText", "fullWidthMode", "accessorMode", "fullRendering", "height", "disabledLoopExpand", "showCheckInheritance", "inlineExtraTemplateRef"], outputs: ["itemDoubleClick", "itemClick"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
20340
20342
|
}
|
|
20341
20343
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: CoreTopicPickerComponent, decorators: [{
|
|
20342
20344
|
type: Component,
|
|
@@ -20346,13 +20348,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.1", ngImpor
|
|
|
20346
20348
|
ThreedotsComponent,
|
|
20347
20349
|
CoreTopicTreeComponent,
|
|
20348
20350
|
TranslatePipe,
|
|
20349
|
-
], providers: [
|
|
20351
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
20350
20352
|
{
|
|
20351
20353
|
provide: NG_VALUE_ACCESSOR,
|
|
20352
20354
|
multi: true,
|
|
20353
20355
|
useExisting: CoreTopicPickerComponent
|
|
20354
20356
|
}
|
|
20355
|
-
], template: "@if (loading) {\n <app-threedots></app-threedots>\n}\n<div #container class=\"core-topic-picker-container\" [class.d-none]=\"loading\">\n <input type=\"checkbox\" class=\"expand-state\" [(ngModel)]=\"expandState\">\n <input class=\"value\" [value]=\"value\">\n <label type=\"text\" class=\"text form-control\" [class.form-control-disabled]=\"disabled\">\n <span [appTooltip]=\"shownText\">{{ !!loading ? \"...\" : shownText }}</span>\n <div class=\"icon\" (click)=\"toggleExpanded()\">\n <i class=\"feather-chevrons-down\"></i>\n </div>\n\n <div class=\"clear-icon-wrapper\" [class.d-none]=\"!!disabled || !!!value\" (click)=\"onClickClear()\">\n <div class=\"flex-wrapper\" [appTooltip]=\"'UI.CORE_CONTOL_COMMON_CLEAR' | translate: lang\">\n <i class=\"feather-x\"></i>\n </div>\n </div>\n \n </label>\n @if (!!expandState) {\n <div class=\"dropdown\" [class.form-control-disabled]=\"disabled\">\n <core-topic-tree [translateText]=\"true\" (itemClick)=\"onTreeItemClick($event)\"></core-topic-tree>\n </div>\n }\n\n</div>", styles: [".core-topic-picker-container{position:relative;display:block;--indicator-height: 0px;--search-bg-color: white;--search-border-color: #D1D1D1;--search-item-hover-bg: #358ccb;--search-item-hover-color: white;--dropdown-bg: lightyellow;--arrow-color: #358ccb;--height: var(--size-form-control-height);--item-height: 50px;--max-z-index: 0;--search-height: 38px;--popup-height: 460px}.core-topic-picker-container input.expand-state,.core-topic-picker-container .value{display:none}.core-topic-picker-container label.text{width:100%;height:var(--height);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:flex;align-items:center;justify-content:space-between}.core-topic-picker-container label.text .clear-icon-wrapper{display:none;position:absolute;background-color:transparent;right:45px;top:2px;width:44px;height:44px;border-radius:.375rem;cursor:pointer}.core-topic-picker-container label.text .clear-icon-wrapper>.flex-wrapper{width:44px;height:44px;display:flex;align-items:center;justify-content:center}.core-topic-picker-container label.text .clear-icon-wrapper>.flex-wrapper>i{color:#848484;font-size:20px}.core-topic-picker-container label.text:hover>.clear-icon-wrapper{display:block}.core-topic-picker-container label.text span{width:calc(100% - var(--height));overflow-x:hidden;text-overflow:ellipsis;color:inherit}.core-topic-picker-container label.text div.icon{display:flex;align-items:center;justify-content:center;position:absolute;right:3px;top:3px;width:calc(var(--height) - 6px);height:calc(var(--height) - 6px);background-color:#e9e9e9;border-radius:3px;cursor:pointer}.core-topic-picker-container label.text div.icon i{width:28px;height:28px;font-size:28px;color:#848484}.core-topic-picker-container .dropdown{display:block;position:absolute;width:800px;min-width:100%;max-height:0px;overflow-x:auto;overflow-y:hidden;background-color:#fff;font-size:15px;box-shadow:0 1rem 3rem #0000002e;transition:.25s linear;z-index:calc(var(--max-z-index) + 1)}.core-topic-picker-container .dropdown ul{padding-left:6px}.core-topic-picker-container .dropdown ul>li{display:flex;align-items:center;cursor:pointer;padding:0px var(--size-scrollbar-width);transition:.25s linear}.core-topic-picker-container .dropdown ul>li>label{width:100%}.core-topic-picker-container .dropdown ul>li:hover{background-color:var(--search-item-hover-bg);color:var(--search-item-hover-color);transition:.25s linear}.core-topic-picker-container input.expand-state:checked~.dropdown{border:1px solid #ced4da;margin-top:2px;max-height:var(--popup-height);border-bottom-left-radius:.375rem;border-bottom-right-radius:.375rem;transition:.25s linear}.core-topic-picker-container input.search{margin:0;width:100%;border:0;border-bottom:1px solid var(--search-border-color);background-color:var(--search-bg-color);position:sticky;top:0;height:38px;padding:6px 12px;font-size:15px}.core-topic-picker-container input.search:focus{outline:none}\n"] }]
|
|
20357
|
+
], template: "@if (loading()) {\n <app-threedots></app-threedots>\n}\n\n<div #container class=\"core-topic-picker-container\" [class.d-none]=\"loading()\">\n <input type=\"checkbox\" class=\"expand-state\" [(ngModel)]=\"expandState\">\n <input class=\"value\" [value]=\"value\">\n <label type=\"text\" class=\"text form-control\" [class.form-control-disabled]=\"disabled\">\n <span [appTooltip]=\"shownText\">{{ !!loading() ? \"...\" : shownText }}</span>\n <div class=\"icon\" (click)=\"toggleExpanded()\">\n <i class=\"feather-chevrons-down\"></i>\n </div>\n\n <div class=\"clear-icon-wrapper\" [class.d-none]=\"!!disabled || !!!value\" (click)=\"onClickClear()\">\n <div class=\"flex-wrapper\" [appTooltip]=\"'UI.CORE_CONTOL_COMMON_CLEAR' | translate: lang\">\n <i class=\"feather-x\"></i>\n </div>\n </div>\n \n </label>\n @if (!!expandState()) {\n <div class=\"dropdown\" [class.form-control-disabled]=\"disabled\">\n <core-topic-tree [translateText]=\"true\" (itemClick)=\"onTreeItemClick($event)\"></core-topic-tree>\n </div>\n }\n\n</div>", styles: [".core-topic-picker-container{position:relative;display:block;--indicator-height: 0px;--search-bg-color: white;--search-border-color: #D1D1D1;--search-item-hover-bg: #358ccb;--search-item-hover-color: white;--dropdown-bg: lightyellow;--arrow-color: #358ccb;--height: var(--size-form-control-height);--item-height: 50px;--max-z-index: 0;--search-height: 38px;--popup-height: 460px}.core-topic-picker-container input.expand-state,.core-topic-picker-container .value{display:none}.core-topic-picker-container label.text{width:100%;height:var(--height);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:flex;align-items:center;justify-content:space-between}.core-topic-picker-container label.text .clear-icon-wrapper{display:none;position:absolute;background-color:transparent;right:45px;top:2px;width:44px;height:44px;border-radius:.375rem;cursor:pointer}.core-topic-picker-container label.text .clear-icon-wrapper>.flex-wrapper{width:44px;height:44px;display:flex;align-items:center;justify-content:center}.core-topic-picker-container label.text .clear-icon-wrapper>.flex-wrapper>i{color:#848484;font-size:20px}.core-topic-picker-container label.text:hover>.clear-icon-wrapper{display:block}.core-topic-picker-container label.text span{width:calc(100% - var(--height));overflow-x:hidden;text-overflow:ellipsis;color:inherit}.core-topic-picker-container label.text div.icon{display:flex;align-items:center;justify-content:center;position:absolute;right:3px;top:3px;width:calc(var(--height) - 6px);height:calc(var(--height) - 6px);background-color:#e9e9e9;border-radius:3px;cursor:pointer}.core-topic-picker-container label.text div.icon i{width:28px;height:28px;font-size:28px;color:#848484}.core-topic-picker-container .dropdown{display:block;position:absolute;width:800px;min-width:100%;max-height:0px;overflow-x:auto;overflow-y:hidden;background-color:#fff;font-size:15px;box-shadow:0 1rem 3rem #0000002e;transition:.25s linear;z-index:calc(var(--max-z-index) + 1)}.core-topic-picker-container .dropdown ul{padding-left:6px}.core-topic-picker-container .dropdown ul>li{display:flex;align-items:center;cursor:pointer;padding:0px var(--size-scrollbar-width);transition:.25s linear}.core-topic-picker-container .dropdown ul>li>label{width:100%}.core-topic-picker-container .dropdown ul>li:hover{background-color:var(--search-item-hover-bg);color:var(--search-item-hover-color);transition:.25s linear}.core-topic-picker-container input.expand-state:checked~.dropdown{border:1px solid #ced4da;margin-top:2px;max-height:var(--popup-height);border-bottom-left-radius:.375rem;border-bottom-right-radius:.375rem;transition:.25s linear}.core-topic-picker-container input.search{margin:0;width:100%;border:0;border-bottom:1px solid var(--search-border-color);background-color:var(--search-bg-color);position:sticky;top:0;height:38px;padding:6px 12px;font-size:15px}.core-topic-picker-container input.search:focus{outline:none}\n"] }]
|
|
20356
20358
|
}], ctorParameters: () => [{ type: DomService }, { type: i0.Renderer2 }, { type: AppService }, { type: ResponseService }, { type: AlertService }, { type: MultiLanguageService }], propDecorators: { popupHeight: [{
|
|
20357
20359
|
type: Input
|
|
20358
20360
|
}], getByIdApi: [{
|