@igo2/integration 1.13.4 → 1.14.1

package/fesm2020/igo2-integration.mjs

@@ -4532,36 +4532,38 @@ function SearchResultsToolComponent_igo_flexible_2_igo_panel_8_button_4_Template
 } }
 function SearchResultsToolComponent_igo_flexible_2_igo_panel_8_Template(rf, ctx) { if (rf & 1) {
     const _r11 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "igo-panel", 13)(1, "button", 14);
-    i0.ɵɵlistener("click", function SearchResultsToolComponent_igo_flexible_2_igo_panel_8_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r11); const ctx_r10 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r10.toggleTopPanel()); });
+    i0.ɵɵelementStart(0, "igo-panel", 13);
+    i0.ɵɵlistener("click", function SearchResultsToolComponent_igo_flexible_2_igo_panel_8_Template_igo_panel_click_0_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r10 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r10.toggleTopPanel($event)); });
+    i0.ɵɵelementStart(1, "button", 14);
+    i0.ɵɵlistener("click", function SearchResultsToolComponent_igo_flexible_2_igo_panel_8_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r11); const ctx_r12 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r12.toggleTopPanel()); });
     i0.ɵɵelement(2, "mat-icon", 15);
     i0.ɵɵpipe(3, "async");
     i0.ɵɵelementEnd();
     i0.ɵɵtemplate(4, SearchResultsToolComponent_igo_flexible_2_igo_panel_8_button_4_Template, 6, 11, "button", 16);
     i0.ɵɵelementStart(5, "igo-feature-details", 17);
-    i0.ɵɵlistener("routingEvent", function SearchResultsToolComponent_igo_flexible_2_igo_panel_8_Template_igo_feature_details_routingEvent_5_listener() { i0.ɵɵrestoreView(_r11); const ctx_r12 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r12.getRoute()); });
+    i0.ɵɵlistener("routingEvent", function SearchResultsToolComponent_igo_flexible_2_igo_panel_8_Template_igo_feature_details_routingEvent_5_listener() { i0.ɵɵrestoreView(_r11); const ctx_r13 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r13.getRoute()); });
     i0.ɵɵpipe(6, "async");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r5 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("title", ctx_r5.featureTitle);
+    i0.ɵɵproperty("title", ctx_r5.featureTitle)("cursorPointer", true);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("svgIcon", i0.ɵɵpipeBind1(3, 6, ctx_r5.topPanelState$) === "collapsed" ? "arrow-up" : "arrow-down");
+    i0.ɵɵproperty("svgIcon", i0.ɵɵpipeBind1(3, 7, ctx_r5.topPanelState$) === "collapsed" ? "arrow-up" : "arrow-down");
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("ngIf", ctx_r5.feature.geometry);
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("feature", i0.ɵɵpipeBind1(6, 8, ctx_r5.feature$))("map", ctx_r5.map)("toolbox", ctx_r5.toolState.toolbox);
+    i0.ɵɵproperty("feature", i0.ɵɵpipeBind1(6, 9, ctx_r5.feature$))("map", ctx_r5.map)("toolbox", ctx_r5.toolState.toolbox);
 } }
 function SearchResultsToolComponent_igo_flexible_2_Template(rf, ctx) { if (rf & 1) {
-    const _r14 = i0.ɵɵgetCurrentView();
+    const _r15 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "igo-flexible", 5, 6);
     i0.ɵɵpipe(2, "async");
     i0.ɵɵelementStart(3, "div", 7)(4, "igo-search-results", 8);
-    i0.ɵɵlistener("resultFocus", function SearchResultsToolComponent_igo_flexible_2_Template_igo_search_results_resultFocus_4_listener($event) { i0.ɵɵrestoreView(_r14); const ctx_r13 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r13.onResultFocus($event)); })("resultSelect", function SearchResultsToolComponent_igo_flexible_2_Template_igo_search_results_resultSelect_4_listener($event) { i0.ɵɵrestoreView(_r14); const ctx_r15 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r15.onResultSelect($event)); })("resultUnfocus", function SearchResultsToolComponent_igo_flexible_2_Template_igo_search_results_resultUnfocus_4_listener($event) { i0.ɵɵrestoreView(_r14); const ctx_r16 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r16.onResultUnfocus($event)); })("resultMouseenter", function SearchResultsToolComponent_igo_flexible_2_Template_igo_search_results_resultMouseenter_4_listener($event) { i0.ɵɵrestoreView(_r14); const ctx_r17 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r17.onResultFocus($event)); })("resultMouseleave", function SearchResultsToolComponent_igo_flexible_2_Template_igo_search_results_resultMouseleave_4_listener($event) { i0.ɵɵrestoreView(_r14); const ctx_r18 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r18.onResultUnfocus($event)); })("moreResults", function SearchResultsToolComponent_igo_flexible_2_Template_igo_search_results_moreResults_4_listener($event) { i0.ɵɵrestoreView(_r14); const ctx_r19 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r19.onSearch($event)); });
+    i0.ɵɵlistener("resultFocus", function SearchResultsToolComponent_igo_flexible_2_Template_igo_search_results_resultFocus_4_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r14 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r14.onResultFocus($event)); })("resultSelect", function SearchResultsToolComponent_igo_flexible_2_Template_igo_search_results_resultSelect_4_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r16 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r16.onResultSelect($event)); })("resultUnfocus", function SearchResultsToolComponent_igo_flexible_2_Template_igo_search_results_resultUnfocus_4_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r17 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r17.onResultUnfocus($event)); })("resultMouseenter", function SearchResultsToolComponent_igo_flexible_2_Template_igo_search_results_resultMouseenter_4_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r18 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r18.onResultFocus($event)); })("resultMouseleave", function SearchResultsToolComponent_igo_flexible_2_Template_igo_search_results_resultMouseleave_4_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r19 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r19.onResultUnfocus($event)); })("moreResults", function SearchResultsToolComponent_igo_flexible_2_Template_igo_search_results_moreResults_4_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r20 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r20.onSearch($event)); });
     i0.ɵɵtemplate(5, SearchResultsToolComponent_igo_flexible_2_ng_template_5_Template, 1, 2, "ng-template", null, 9, i0.ɵɵtemplateRefExtractor);
     i0.ɵɵelementEnd()();
     i0.ɵɵelementStart(7, "div", 10);
-    i0.ɵɵtemplate(8, SearchResultsToolComponent_igo_flexible_2_igo_panel_8_Template, 7, 10, "igo-panel", 11);
+    i0.ɵɵtemplate(8, SearchResultsToolComponent_igo_flexible_2_igo_panel_8_Template, 7, 11, "igo-panel", 11);
     i0.ɵɵpipe(9, "async");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -4637,8 +4639,12 @@ let SearchResultsToolComponent = class SearchResultsToolComponent {
     }
     ngOnInit() {
         this.searchTerm$$ = this.searchState.searchTerm$.subscribe((searchTerm) => {
-            if (searchTerm !== undefined && searchTerm !== null) {
+            if (searchTerm !== undefined && searchTerm !== null && searchTerm !== '') {
                 this.term = searchTerm;
+                this.debouncedEmpty$.next(false);
+            }
+            else if (searchTerm === '') {
+                this.debouncedEmpty$.next(true);
             }
         });
         for (const res of this.store.stateView.all$().value) {
@@ -4928,12 +4934,17 @@ let SearchResultsToolComponent = class SearchResultsToolComponent {
                     elemSource.clientHeight;
         }
     }
-    toggleTopPanel() {
-        if (this.topPanelState === 'expanded') {
-            this.topPanelState = 'collapsed';
+    toggleTopPanel(event) {
+        if (event && (event.target?.className !== 'igo-panel-title')) {
+            return;
         }
         else {
-            this.topPanelState = 'expanded';
+            if (this.topPanelState === 'expanded') {
+                this.topPanelState = 'collapsed';
+            }
+            else {
+                this.topPanelState = 'expanded';
+            }
         }
     }
     zoomToFeatureExtent() {
@@ -5009,7 +5020,7 @@ let SearchResultsToolComponent = class SearchResultsToolComponent {
     }
 };
 SearchResultsToolComponent.ɵfac = function SearchResultsToolComponent_Factory(t) { return new (t || SearchResultsToolComponent)(i0.ɵɵdirectiveInject(MapState), i0.ɵɵdirectiveInject(SearchState), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(ToolState), i0.ɵɵdirectiveInject(DirectionState), i0.ɵɵdirectiveInject(i2.ConfigService)); };
-SearchResultsToolComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SearchResultsToolComponent, selectors: [["igo-search-results-tool"]], inputs: { showIcons: "showIcons", topPanelStateDefault: "topPanelStateDefault", topPanelState: "topPanelState" }, decls: 4, vars: 6, consts: [["style", "margin: 10px;", 4, "ngIf"], ["initial", "100%", "initialMobile", "100%", "collapsed", "calc(100% - 58px)", "collapsedMobile", "calc(100% - 58px)", "expanded", "60%", "expandedMobile", "60%", 3, "state", 4, "ngIf"], [2, "margin", "10px"], [1, "mat-typography"], [3, "innerHTML"], ["initial", "100%", "initialMobile", "100%", "collapsed", "calc(100% - 58px)", "collapsedMobile", "calc(100% - 58px)", "expanded", "60%", "expandedMobile", "60%", 3, "state"], ["topPanel", ""], [1, "igo-content"], ["placeholder", "false", 3, "store", "showIcons", "term", "termSplitter", "settingsChange$", "resultFocus", "resultSelect", "resultUnfocus", "resultMouseenter", "resultMouseleave", "moreResults"], ["igoSearchItemToolbar", ""], ["igoFlexibleFill", "", 1, "igo-content"], [3, "title", 4, "ngIf"], [3, "map", "layer"], [3, "title"], ["mat-icon-button", "", "panelLeftButton", "", 1, "igo-icon-button", 3, "click"], [3, "svgIcon"], ["mat-icon-button", "", "panelRightButton", "", "class", "igo-icon-button", "matTooltipShowDelay", "500", 3, "matTooltip", "click", 4, "ngIf"], ["igoFeatureDetailsDirective", "", 3, "feature", "map", "toolbox", "routingEvent"], ["mat-icon-button", "", "panelRightButton", "", "matTooltipShowDelay", "500", 1, "igo-icon-button", 3, "matTooltip", "click"], ["matBadgeColor", "accent", "matBadgeSize", "small", "svgIcon", "magnify-plus-outline", 3, "matBadge", "matBadgeHidden"]], template: function SearchResultsToolComponent_Template(rf, ctx) { if (rf & 1) {
+SearchResultsToolComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SearchResultsToolComponent, selectors: [["igo-search-results-tool"]], inputs: { showIcons: "showIcons", topPanelStateDefault: "topPanelStateDefault", topPanelState: "topPanelState" }, decls: 4, vars: 6, consts: [["style", "margin: 10px;", 4, "ngIf"], ["initial", "100%", "initialMobile", "100%", "collapsed", "calc(100% - 58px)", "collapsedMobile", "calc(100% - 58px)", "expanded", "60%", "expandedMobile", "60%", 3, "state", 4, "ngIf"], [2, "margin", "10px"], [1, "mat-typography"], [3, "innerHTML"], ["initial", "100%", "initialMobile", "100%", "collapsed", "calc(100% - 58px)", "collapsedMobile", "calc(100% - 58px)", "expanded", "60%", "expandedMobile", "60%", 3, "state"], ["topPanel", ""], [1, "igo-content"], ["placeholder", "false", 3, "store", "showIcons", "term", "termSplitter", "settingsChange$", "resultFocus", "resultSelect", "resultUnfocus", "resultMouseenter", "resultMouseleave", "moreResults"], ["igoSearchItemToolbar", ""], ["igoFlexibleFill", "", 1, "igo-content"], [3, "title", "cursorPointer", "click", 4, "ngIf"], [3, "map", "layer"], [3, "title", "cursorPointer", "click"], ["mat-icon-button", "", "panelLeftButton", "", 1, "igo-icon-button", 3, "click"], [3, "svgIcon"], ["mat-icon-button", "", "panelRightButton", "", "class", "igo-icon-button", "matTooltipShowDelay", "500", 3, "matTooltip", "click", 4, "ngIf"], ["igoFeatureDetailsDirective", "", 3, "feature", "map", "toolbox", "routingEvent"], ["mat-icon-button", "", "panelRightButton", "", "matTooltipShowDelay", "500", 1, "igo-icon-button", 3, "matTooltip", "click"], ["matBadgeColor", "accent", "matBadgeSize", "small", "svgIcon", "magnify-plus-outline", 3, "matBadge", "matBadgeHidden"]], template: function SearchResultsToolComponent_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵtemplate(0, SearchResultsToolComponent_div_0_Template, 13, 11, "div", 0);
         i0.ɵɵpipe(1, "async");
         i0.ɵɵtemplate(2, SearchResultsToolComponent_igo_flexible_2_Template, 10, 11, "igo-flexible", 1);
@@ -5017,7 +5028,7 @@ SearchResultsToolComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
     } if (rf & 2) {
         i0.ɵɵproperty("ngIf", (!ctx.store || ctx.store.stateView.empty) && i0.ɵɵpipeBind1(1, 2, ctx.debouncedEmpty$));
         i0.ɵɵadvance(2);
-        i0.ɵɵproperty("ngIf", ctx.store && i0.ɵɵpipeBind1(3, 4, ctx.store.stateView.empty$) === false);
+        i0.ɵɵproperty("ngIf", i0.ɵɵpipeBind1(3, 4, ctx.debouncedEmpty$) === false);
     } }, dependencies: [i6.NgIf, i7.MatIcon, i8$2.MatBadge, i5.MatTooltip, i10.MatButton, i1$1.FeatureDetailsComponent, i1$1.FeatureDetailsDirective, i1$1.SearchResultsComponent, i1$1.SearchResultAddButtonComponent, i4.FlexibleComponent, i4.PanelComponent, i6.AsyncPipe, i8.TranslatePipe, i4.SanitizeHtmlPipe], encapsulation: 2, changeDetection: 0 });
 SearchResultsToolComponent = __decorate([
     ToolComponent({
@@ -5028,7 +5039,7 @@ SearchResultsToolComponent = __decorate([
 ], SearchResultsToolComponent);
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SearchResultsToolComponent, [{
         type: Component,
-        args: [{ selector: 'igo-search-results-tool', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"(!store || store.stateView.empty) && (debouncedEmpty$ | async) \" style=\"margin: 10px;\">\n  <section class=\"mat-typography\">\n    <h4><strong>{{ 'igo.integration.searchResultsTool.noResults' | translate }}</strong></h4>\n    <p><strong>{{ 'igo.integration.searchResultsTool.doSearch' | translate }}</strong></p>\n    <div [innerHTML]=\"'igo.integration.searchResultsTool.examples' | translate | sanitizeHtml\"></div>\n</section>\n</div>\n\n<igo-flexible\n  *ngIf=\"store && (store.stateView.empty$ | async)===false\"\n  #topPanel\n  initial=\"100%\"\n  initialMobile=\"100%\"\n  collapsed=\"calc(100% - 58px)\"\n  collapsedMobile=\"calc(100% - 58px)\"\n  expanded=\"60%\"\n  expandedMobile=\"60%\"\n  [state]=\"(feature$ |\u00A0async) ? topPanelState : 'initial'\">\n\n  <div class=\"igo-content\">\n    <igo-search-results\n      [store]=\"store\"\n      [showIcons]=\"showIcons\"\n      [term]=\"term\"\n      [termSplitter]=\"termSplitter\"\n      [settingsChange$]=\"settingsChange$\"\n      placeholder=\"false\"\n      (resultFocus)=\"onResultFocus($event)\"\n      (resultSelect)=\"onResultSelect($event)\"\n      (resultUnfocus)=\"onResultUnfocus($event)\"\n      (resultMouseenter)=\"onResultFocus($event)\"\n      (resultMouseleave)=\"onResultUnfocus($event)\"\n      (moreResults)=\"onSearch($event)\">\n      <ng-template #igoSearchItemToolbar let-result=\"result\">\n        <igo-search-add-button\n          [map]=\"map\"\n          [layer]=\"result\">\n        </igo-search-add-button>\n      </ng-template>\n    </igo-search-results>\n  </div>\n\n  <div igoFlexibleFill class=\"igo-content\">\n    <igo-panel [title]=\"featureTitle\" *ngIf=\"feature$ |\u00A0async\">\n\n      <button\n        mat-icon-button\n        panelLeftButton\n        class=\"igo-icon-button\"\n        (click)=\"toggleTopPanel()\">\n        <mat-icon [svgIcon]=\"(topPanelState$ | async) === 'collapsed' ? 'arrow-up' : 'arrow-down'\"></mat-icon>\n      </button>\n\n      <button\n        *ngIf=\"feature.geometry\"\n        mat-icon-button\n        panelRightButton\n        class=\"igo-icon-button\"\n        [matTooltip]=\"((isSelectedResultOutOfView$ | async) ? 'igo.integration.searchResultsTool.zoomOnFeatureTooltipOutOfView' : 'igo.integration.searchResultsTool.zoomOnFeatureTooltip') | translate\"\n        matTooltipShowDelay=\"500\"\n        (click)=\"zoomToFeatureExtent()\">\n        <mat-icon\n        [matBadge]=\"(isSelectedResultOutOfView$ | async) ? '!' : ''\"\n        matBadgeColor=\"accent\"\n        matBadgeSize=\"small\"\n        [matBadgeHidden]=\"(isSelectedResultOutOfView$ | async)===false\"     \n        svgIcon=\"magnify-plus-outline\"></mat-icon>\n      </button>\n\n      <igo-feature-details\n        igoFeatureDetailsDirective\n        [feature]=\"feature$ | async\"\n        [map]=\"map\"\n        [toolbox]=\"toolState.toolbox\"\n        (routingEvent)=\"getRoute()\">\n      </igo-feature-details>\n    </igo-panel>\n  </div>\n\n</igo-flexible>\n" }]
+        args: [{ selector: 'igo-search-results-tool', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"(!store || store.stateView.empty) && (debouncedEmpty$ | async)\" style=\"margin: 10px;\">\n  <section class=\"mat-typography\">\n    <h4><strong>{{ 'igo.integration.searchResultsTool.noResults' | translate }}</strong></h4>\n    <p><strong>{{ 'igo.integration.searchResultsTool.doSearch' | translate }}</strong></p>\n    <div [innerHTML]=\"'igo.integration.searchResultsTool.examples' | translate | sanitizeHtml\"></div>\n</section>\n</div>\n\n<igo-flexible\n  *ngIf=\"(debouncedEmpty$ | async) === false\"\n  #topPanel\n  initial=\"100%\"\n  initialMobile=\"100%\"\n  collapsed=\"calc(100% - 58px)\"\n  collapsedMobile=\"calc(100% - 58px)\"\n  expanded=\"60%\"\n  expandedMobile=\"60%\"\n  [state]=\"(feature$ |\u00A0async) ? topPanelState : 'initial'\">\n\n  <div class=\"igo-content\">\n    <igo-search-results\n      [store]=\"store\"\n      [showIcons]=\"showIcons\"\n      [term]=\"term\"\n      [termSplitter]=\"termSplitter\"\n      [settingsChange$]=\"settingsChange$\"\n      placeholder=\"false\"\n      (resultFocus)=\"onResultFocus($event)\"\n      (resultSelect)=\"onResultSelect($event)\"\n      (resultUnfocus)=\"onResultUnfocus($event)\"\n      (resultMouseenter)=\"onResultFocus($event)\"\n      (resultMouseleave)=\"onResultUnfocus($event)\"\n      (moreResults)=\"onSearch($event)\">\n      <ng-template #igoSearchItemToolbar let-result=\"result\">\n        <igo-search-add-button\n          [map]=\"map\"\n          [layer]=\"result\">\n        </igo-search-add-button>\n      </ng-template>\n    </igo-search-results>\n  </div>\n\n  <div igoFlexibleFill class=\"igo-content\">\n    <igo-panel [title]=\"featureTitle\" *ngIf=\"feature$ |\u00A0async\" (click)=\"toggleTopPanel($event)\" [cursorPointer]=\"true\">\n\n      <button\n        mat-icon-button\n        panelLeftButton\n        class=\"igo-icon-button\"\n        (click)=\"toggleTopPanel()\">\n        <mat-icon [svgIcon]=\"(topPanelState$ | async) === 'collapsed' ? 'arrow-up' : 'arrow-down'\"></mat-icon>\n      </button>\n\n      <button\n        *ngIf=\"feature.geometry\"\n        mat-icon-button\n        panelRightButton\n        class=\"igo-icon-button\"\n        [matTooltip]=\"((isSelectedResultOutOfView$ | async) ? 'igo.integration.searchResultsTool.zoomOnFeatureTooltipOutOfView' : 'igo.integration.searchResultsTool.zoomOnFeatureTooltip') | translate\"\n        matTooltipShowDelay=\"500\"\n        (click)=\"zoomToFeatureExtent()\">\n        <mat-icon\n        [matBadge]=\"(isSelectedResultOutOfView$ | async) ? '!' : ''\"\n        matBadgeColor=\"accent\"\n        matBadgeSize=\"small\"\n        [matBadgeHidden]=\"(isSelectedResultOutOfView$ | async)===false\"     \n        svgIcon=\"magnify-plus-outline\"></mat-icon>\n      </button>\n\n      <igo-feature-details\n        igoFeatureDetailsDirective\n        [feature]=\"feature$ | async\"\n        [map]=\"map\"\n        [toolbox]=\"toolState.toolbox\"\n        (routingEvent)=\"getRoute()\">\n      </igo-feature-details>\n    </igo-panel>\n  </div>\n\n</igo-flexible>\n" }]
     }], function () { return [{ type: MapState }, { type: SearchState }, { type: i0.ElementRef }, { type: ToolState }, { type: DirectionState }, { type: i2.ConfigService }]; }, { showIcons: [{
             type: Input
         }], topPanelStateDefault: [{