@acorex/platform 18.0.12 → 18.0.14

package/esm2022/layout/designer/lib/designer/designer.component.mjs

@@ -7,7 +7,7 @@ import { AXMenuModule } from '@acorex/components/menu';
 import { AXTabsModule } from '@acorex/components/tabs';
 import { AXPLayoutBuilderModule } from '@acorex/platform/layout/builder';
 import { CommonModule } from '@angular/common';
-import { Component, computed, inject, ViewEncapsulation } from '@angular/core';
+import { Component, computed, HostListener, inject, ViewChild, ViewEncapsulation } from '@angular/core';
 import { get } from 'lodash-es';
 import { AXPDesignerBoardComponent } from '../board/board.component';
 import { AXPDesignerBreadcrumbsComponent } from '../breadcrumbs/breadcrumbs.component';
@@ -16,6 +16,7 @@ import { AXPDesignerHeaderMenuComponent } from '../header-menu/header-menu.compo
 import { AXPDesignerOutlineComponent } from '../outline/outline.component';
 import { AXPWidgetPropertyViewerComponent } from '../property-viewer/widget-property-viewer.component';
 import { AXPDesignerHistoryComponent } from '../history/history.component';
+import { AXPDesignerPagesComponent } from '../pages/pages.component';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/common";
 import * as i2 from "@acorex/components/button";
@@ -27,9 +28,51 @@ export class AXPLayoutDesignerComponent {
     constructor() {
         this.service = inject(AXPDesignerService);
         this.nodeConfig = computed(() => this.service.selectedNode() ? get(this.service.selectedNode(), '__meta__.config') : null);
+        this.service.onUpdate.subscribe((e) => {
+            this.propertyViewer.update(e.values);
+        });
+    }
+    handleKeyboardEvent(event) {
+        if (event.ctrlKey && event.target == document.body) {
+            switch (event.key.toLowerCase()) { // Convert the key to lowercase to ensure case insensitivity
+                case 'z':
+                    event.preventDefault(); // Prevent the browser's default undo action
+                    this.service.undo();
+                    break;
+                case 'y':
+                    event.preventDefault(); // Prevent the browser's default redo action
+                    this.service.redo();
+                    break;
+                case 'c':
+                    if (this.service.canCutCopy()) {
+                        event.preventDefault(); // Prevent the browser's default copy action
+                        this.service.copy();
+                    }
+                    break;
+                case 'd':
+                    if (this.service.canCutCopy()) {
+                        event.preventDefault(); // Prevent the browser's default copy action
+                        this.service.clone();
+                    }
+                    break;
+                case 'x':
+                    if (this.service.canCutCopy()) {
+                        debugger;
+                        event.preventDefault(); // Prevent the browser's default cut action
+                        this.service.cut();
+                    }
+                    break;
+                case 'v':
+                    if (this.service.canPaste()) {
+                        event.preventDefault(); // Prevent the browser's default paste action
+                        this.service.paste();
+                    }
+                    break;
+            }
+        }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPLayoutDesignerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: AXPLayoutDesignerComponent, isStandalone: true, selector: "axp-layout-designer", providers: [AXPDesignerService], ngImport: i0, template: "<ax-drawer-container class=\"ax-h-full ax-w-full ax-flex ax-relative child:ax-h-full ax-overflow-hidden ax-dark\">\n  <ax-content class=\"ax-contents\">\n    <!-- Toolbar Side -->\n    <div class=\"ax-min-w-10 ax-bg-surface ax-border-e ax-xs ax-flex ax-flex-col ax-items-center \">\n      <div class=\"ax-min-w-10 ax-h-10 ax-flex ax-items-center ax-justify-center ax-border-b\">\n        <img src=\"assets/logos/logo.png\" class=\"ax-w-6\" />\n      </div>\n      <div class=\"ax-py-1\"></div>\n      <div class=\"ax-flex ax-flex-col ax-gap-2\">\n        <ax-button color=\"ghost\" look=\"twotone\">\n          <ax-icon class=\"fa-solid fa-puzzle ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <ax-button color=\"ghost\" look=\"twotone\">\n          <ax-icon class=\"fa-solid fa-plus ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <ax-button color=\"ghost\" look=\"twotone\">\n          <ax-icon class=\"fa-solid fa-database ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <ax-button color=\"ghost\" look=\"twotone\" (onClick)=\"outline.toggle()\" title=\"Outline\">\n          <ax-icon class=\"fa-solid fa-list-tree ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <ax-button color=\"ghost\" look=\"twotone\" (onClick)=\"history.toggle()\" title=\"History\">\n          <ax-icon class=\"fa-solid fa-clock-rotate-left ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <ax-button color=\"ghost\" look=\"twotone\" title=\"Timeline\">\n          <ax-icon class=\"fa-solid fa-diagram-sankey ax-text-sm\"> </ax-icon>\n        </ax-button>\n      </div>\n    </div>\n    <!-- Main Side -->\n    <div class=\"ax-col-span-10 ax-flex ax-flex-col ax-flex-1\">\n      <!-- Header Toolbar -->\n      <div class=\"ax-min-h-10 ax-bg-surface ax-border-b  ax-flex ax-flex-grow ax-justify-between ax-px-2\">\n        <div class=\"ax-flex ax-items-center ax-justify-center ax-text-white\">\n          <axp-designer-header-menu></axp-designer-header-menu>\n        </div>\n        <div class=\"ax-flex ax-flex-row ax-gap-2 ax-xs ax-items-center\">\n          <ax-button-group color=\"ghost\" look=\"twotone\" [selection]=\"'single'\">\n            <ax-button-item [selected]=\"service.size() == 'xl'\" [data]=\"'xl'\" (onClick)=\"service.size.set('xl')\">\n              <ax-icon class=\"fa-light fa-desktop\"></ax-icon>\n            </ax-button-item>\n            <ax-button-item [selected]=\"service.size() == 'lg'\" [data]=\"'lg'\" (onClick)=\"service.size.set('lg')\">\n              <ax-icon class=\"fa-light fa-tablet\"></ax-icon>\n            </ax-button-item>\n            <ax-button-item [selected]=\"service.size() == 'sm'\" [data]=\"'sm'\" (onClick)=\"service.size.set('sm')\">\n              <ax-icon class=\"fa-light fa-mobile\"></ax-icon>\n            </ax-button-item>\n          </ax-button-group>\n        </div>\n        <div class=\"ax-flex ax-flex-row ax-gap-2 ax-xs ax-items-center\">\n          <ax-button text=\"Design\" look=\"outline\" class=\"ax-xs\">\n            <ax-suffix>\n              <ax-icon class=\"fa-light fa-chevron-down\"></ax-icon>\n            </ax-suffix>\n            <ax-dropdown-panel>\n              <ax-button-item-list>\n                <ax-button-item text=\"Print\" name=\"print\"> </ax-button-item>\n                <ax-button-item text=\"View\" name=\"view\"> </ax-button-item>\n              </ax-button-item-list>\n            </ax-dropdown-panel>\n          </ax-button>\n          <ax-button color=\"success\" look=\"outline\" text=\"Preview\" class=\"ax-xs\">\n            <ax-suffix>\n              <ax-icon class=\"fa-solid fa-play\"></ax-icon>\n            </ax-suffix>\n          </ax-button>\n        </div>\n      </div>\n      <!-- Board -->\n      <div class=\"ax-h-full \">\n        <ax-drawer-container class=\"ax-w-full ax-h-full\">\n          <ax-drawer #bd location=\"start\" mode=\"push\">\n            <ax-content>\n              <div class=\"ax-min-w-80 ax-h-full ax-overflow-auto ax-border-e\"></div>\n            </ax-content>\n          </ax-drawer>\n          <!-- Outline Pnael -->\n          <ax-drawer #outline location=\"start\" mode=\"push\">\n            <ax-content>\n              <axp-designer-outline></axp-designer-outline>\n            </ax-content>\n          </ax-drawer>\n          <!-- History Pnael -->\n          <ax-drawer #history location=\"start\" mode=\"push\">\n            <ax-content>\n              <axp-designer-history></axp-designer-history>\n            </ax-content>\n          </ax-drawer>\n          <!-- Content of board -->\n          <ax-content class=\"ax-light\">\n            <axp-designer-board class=\"ax-h-full ax-bg-on-surface ax-flex ax-justify-center\"> </axp-designer-board>\n          </ax-content>\n        </ax-drawer-container>\n      </div>\n      <!-- Footer -->\n      <div class=\"ax-min-h-10 ax-bg-surface ax-border-t  ax-flex ax-items-center\">\n        <axp-designer-breadcrumbs class=\"ax-border-default ax-border-t ax-p-2 ax-font-normal\">\n        </axp-designer-breadcrumbs>\n      </div>\n    </div>\n  </ax-content>\n  <!-- Property Side -->\n  <ax-drawer class=\"ax-w-80 ax-border-s\" location=\"end\" mode=\"push\" [collapsed]=\"false\" #pd>\n    <ax-content>\n      <div class=\"ax-flex ax-flex-row ax-w-full ax-justify-between ax-text-white ax-py-2 ax-px-4 ax-border-b\">\n        <div class=\"ax-flex ax-flex-row ax-gap-2 ax-items-center\">\n          <i [ngClass]=\"nodeConfig()?.icon\"></i>\n          <span class=\"ax-font-semibold\">{{ nodeConfig()?.title }}</span>\n        </div>\n      </div>\n      <axp-widget-property-viewer [widget]=\"service.selectedNode()!\"\n        (onChanged)=\"service.update({ values: $event.values, mode: $event.mode })\" class=\"ax-w-1/4\">\n      </axp-widget-property-viewer>\n    </ax-content>\n  </ax-drawer>\n</ax-drawer-container>", styles: [".axp-designer-board{display:block;height:100%;width:100%;overflow:auto;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));padding:.75rem}.axp-designer-board.axp-state-design .axp-widget-host{position:relative;display:block;cursor:pointer;padding:.25rem}.axp-designer-board.axp-state-design .axp-widget-host.axp-state-selected{outline-style:solid;outline-width:1px;outline-offset:1px;outline-color:rgba(var(--ax-color-primary-500),1);position:relative}.axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover{outline-style:dashed;outline-width:1px;outline-offset:1px;outline-color:rgba(var(--ax-color-primary-500),1)}.axp-designer-board.axp-state-design .axp-widget-host .axp-widget-overlay{position:absolute;left:0;top:0;right:0;bottom:0;z-index:10;height:100%;width:100%;background:rgba(202,123,123,.39)}@keyframes moveLight{0%{background-position:0% 50%}to{background-position:100% 50%}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: AXPLayoutBuilderModule }, { kind: "component", type: AXPDesignerBoardComponent, selector: "axp-designer-board" }, { kind: "component", type: AXPWidgetPropertyViewerComponent, selector: "axp-widget-property-viewer", inputs: ["widget"], outputs: ["onChanged"] }, { kind: "component", type: AXPDesignerBreadcrumbsComponent, selector: "axp-designer-breadcrumbs" }, { kind: "component", type: AXPDesignerOutlineComponent, selector: "axp-designer-outline" }, { kind: "component", type: AXPDesignerHeaderMenuComponent, selector: "axp-designer-header-menu" }, { kind: "component", type: AXPDesignerHistoryComponent, selector: "axp-designer-history" }, { kind: "ngmodule", type: AXTabsModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "responsiveOn", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "responsiveOnChange", "loadingTextChange"] }, { kind: "component", type: i2.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i2.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDrawerModule }, { kind: "component", type: i3.AXDrawerComponent, selector: "ax-drawer", inputs: ["location", "showBackdrop", "mode", "collapsed"], outputs: ["locationChange", "modeChange", "collapsedChange"] }, { kind: "component", type: i3.AXDrawerContainerComponent, selector: "ax-drawer-container" }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXMenuModule }, { kind: "ngmodule", type: AXButtonGroupModule }, { kind: "component", type: i5.AXButtonGroupComponent, selector: "ax-button-group", inputs: ["disabled", "color", "look", "selection"], outputs: ["onBlur", "onFocus", "lookChange", "colorChange", "disabledChange", "selectionChange"] }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i6.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: AXPLayoutDesignerComponent, isStandalone: true, selector: "axp-layout-designer", host: { listeners: { "document:keydown": "handleKeyboardEvent($event)" } }, providers: [AXPDesignerService], viewQueries: [{ propertyName: "propertyViewer", first: true, predicate: AXPWidgetPropertyViewerComponent, descendants: true, static: true }], ngImport: i0, template: "<ax-drawer-container class=\"ax-h-full ax-w-full ax-flex ax-relative child:ax-h-full ax-overflow-hidden ax-dark\">\n  <ax-content class=\"ax-contents\">\n    <!-- Toolbar Side -->\n    <div class=\"ax-min-w-10 ax-bg-surface ax-border-e ax-xs ax-flex ax-flex-col ax-items-center \">\n      <div class=\"ax-min-w-10 ax-h-10 ax-flex ax-items-center ax-justify-center ax-border-b\">\n        <img src=\"assets/logos/logo.png\" class=\"ax-w-6\" />\n      </div>\n      <div class=\"ax-py-1\"></div>\n      <div class=\"ax-flex ax-flex-col ax-gap-2\">\n        <!-- <ax-button color=\"ghost\" look=\"twotone\">\n          <ax-icon class=\"fa-solid fa-puzzle ax-text-sm\"> </ax-icon>\n        </ax-button> -->\n        <ax-button color=\"ghost\" look=\"twotone\" (onClick)=\"pages.toggle()\" title=\"Pages\">\n          <ax-icon class=\"fa-solid fa-page ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <ax-button color=\"ghost\" look=\"twotone\" (onClick)=\"datasources.toggle()\" title=\"Data Sources\">\n          <ax-icon class=\"fa-solid fa-database ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <ax-button color=\"ghost\" look=\"twotone\" (onClick)=\"outline.toggle()\" title=\"Outline\">\n          <ax-icon class=\"fa-solid fa-list-tree ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <ax-button color=\"ghost\" look=\"twotone\" (onClick)=\"history.toggle()\" title=\"History\">\n          <ax-icon class=\"fa-solid fa-clock-rotate-left ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <!-- <ax-button color=\"ghost\" look=\"twotone\" title=\"Timeline\">\n          <ax-icon class=\"fa-solid fa-diagram-sankey ax-text-sm\"> </ax-icon>\n        </ax-button> -->\n      </div>\n    </div>\n    <!-- Main Side -->\n    <div class=\"ax-col-span-10 ax-flex ax-flex-col ax-flex-1\">\n      <!-- Header Toolbar -->\n      <div class=\"ax-min-h-10 ax-bg-surface ax-border-b  ax-flex ax-flex-grow ax-justify-between ax-px-2\">\n        <div class=\"ax-flex ax-items-center ax-justify-center ax-text-white\">\n          <axp-designer-header-menu></axp-designer-header-menu>\n        </div>\n        <div class=\"ax-flex ax-flex-row ax-gap-2 ax-xs ax-items-center\">\n          <ax-button-group color=\"ghost\" look=\"twotone\" [selection]=\"'single'\">\n            <ax-button-item [selected]=\"service.size() == 'xl'\" [data]=\"'xl'\" (onClick)=\"service.size.set('xl')\">\n              <ax-icon class=\"fa-light fa-desktop\"></ax-icon>\n            </ax-button-item>\n            <ax-button-item [selected]=\"service.size() == 'lg'\" [data]=\"'lg'\" (onClick)=\"service.size.set('lg')\">\n              <ax-icon class=\"fa-light fa-tablet\"></ax-icon>\n            </ax-button-item>\n            <ax-button-item [selected]=\"service.size() == 'sm'\" [data]=\"'sm'\" (onClick)=\"service.size.set('sm')\">\n              <ax-icon class=\"fa-light fa-mobile\"></ax-icon>\n            </ax-button-item>\n          </ax-button-group>\n        </div>\n        <div class=\"ax-flex ax-flex-row ax-gap-2 ax-xs ax-items-center\">\n          <ax-button text=\"Design\" look=\"outline\" class=\"ax-xs\">\n            <ax-suffix>\n              <ax-icon class=\"fa-light fa-chevron-down\"></ax-icon>\n            </ax-suffix>\n            <ax-dropdown-panel>\n              <ax-button-item-list>\n                <ax-button-item text=\"Print\" name=\"print\"> </ax-button-item>\n                <ax-button-item text=\"View\" name=\"view\"> </ax-button-item>\n              </ax-button-item-list>\n            </ax-dropdown-panel>\n          </ax-button>\n          <ax-button color=\"success\" look=\"outline\" text=\"Preview\" class=\"ax-xs\" (onClick)=\"service.openPreview()\">\n            <ax-suffix>\n              <ax-icon class=\"fa-solid fa-play\"></ax-icon>\n            </ax-suffix>\n          </ax-button>\n        </div>\n      </div>\n      <!-- Board -->\n      <div class=\"ax-h-full \">\n        <ax-drawer-container class=\"ax-w-full ax-h-full\">\n          <!-- Pages -->\n          <ax-drawer #pages location=\"start\" mode=\"push\">\n            <ax-content>\n              <axp-designer-pages></axp-designer-pages>\n            </ax-content>\n          </ax-drawer>\n          <!-- Datasources -->\n          <ax-drawer #datasources location=\"start\" mode=\"push\">\n            <ax-content>\n              Datasources\n            </ax-content>\n          </ax-drawer>\n          <!-- Outline Pnael -->\n          <ax-drawer #outline location=\"start\" mode=\"push\">\n            <ax-content>\n              <axp-designer-outline></axp-designer-outline>\n            </ax-content>\n          </ax-drawer>\n          <!-- History Pnael -->\n          <ax-drawer #history location=\"start\" mode=\"push\">\n            <ax-content>\n              <axp-designer-history></axp-designer-history>\n            </ax-content>\n          </ax-drawer>\n          <!-- Content of board -->\n          <ax-content class=\"ax-light\">\n            <axp-designer-board class=\"ax-h-full ax-bg-on-surface ax-flex ax-justify-center\"> </axp-designer-board>\n          </ax-content>\n        </ax-drawer-container>\n      </div>\n      <!-- Footer -->\n      <div class=\"ax-min-h-10 ax-bg-surface ax-border-t  ax-flex ax-items-center\">\n        <axp-designer-breadcrumbs class=\"ax-border-default ax-border-t ax-p-2 ax-font-normal\">\n        </axp-designer-breadcrumbs>\n      </div>\n    </div>\n  </ax-content>\n  <!-- Property Side -->\n  <ax-drawer class=\"ax-w-80 ax-border-s\" location=\"end\" mode=\"push\" [collapsed]=\"false\" #pd>\n    <ax-content>\n      <div class=\"ax-flex ax-flex-row ax-w-full ax-justify-between ax-text-white ax-py-2 ax-px-4 ax-border-b\">\n        <div class=\"ax-flex ax-flex-row ax-gap-2 ax-items-center\">\n          <i [ngClass]=\"nodeConfig()?.icon\"></i>\n          <span class=\"ax-font-semibold\">{{ nodeConfig()?.title }}</span>\n        </div>\n      </div>\n      <axp-widget-property-viewer [widget]=\"service.selectedNode()!\"\n        (onChanged)=\"service.update({ values: $event.values, mode: $event.mode })\" class=\"ax-w-1/4\">\n      </axp-widget-property-viewer>\n    </ax-content>\n  </ax-drawer>\n</ax-drawer-container>", styles: [".axp-designer-board{display:block;height:100%;width:100%;overflow:auto;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));padding:.75rem}.axp-designer-board.axp-state-design .axp-widget-host{position:relative;display:block;cursor:pointer}.axp-designer-board.axp-state-design .axp-widget-host.axp-state-selected{outline-style:solid;outline-width:2px;outline-offset:1px;outline-color:#60a5fa;position:relative}.axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover:not(.axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover.axp-state-selected){outline-style:solid;outline-width:1px;outline-offset:1px;outline-color:#60a5fa}.axp-designer-board.axp-state-design .axp-widget-host .axp-widget-overlay{position:absolute;left:0;top:0;right:0;bottom:0;z-index:10;height:100%;width:100%}@keyframes moveLight{0%{background-position:0% 50%}to{background-position:100% 50%}}.axp-designer-board .axp-empty-space{background-color:rgba(var(--ax-color-primary-300),10%);background-image:linear-gradient(135deg,rgba(var(--ax-color-primary-300),50%) 10%,transparent 0,transparent 50%,rgba(var(--ax-color-primary-300),50%) 0,rgba(var(--ax-color-primary-300),50%) 60%,transparent 0,transparent);background-size:7.5px 7.5px}.axp-designer-board .grid-stack-item-content{color:#2c3e50;text-align:center;background-color:#18bc9c}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: AXPLayoutBuilderModule }, { kind: "component", type: AXPDesignerBoardComponent, selector: "axp-designer-board" }, { kind: "component", type: AXPWidgetPropertyViewerComponent, selector: "axp-widget-property-viewer", inputs: ["widget"], outputs: ["onChanged"] }, { kind: "component", type: AXPDesignerBreadcrumbsComponent, selector: "axp-designer-breadcrumbs" }, { kind: "component", type: AXPDesignerOutlineComponent, selector: "axp-designer-outline" }, { kind: "component", type: AXPDesignerHeaderMenuComponent, selector: "axp-designer-header-menu" }, { kind: "component", type: AXPDesignerHistoryComponent, selector: "axp-designer-history" }, { kind: "component", type: AXPDesignerPagesComponent, selector: "axp-designer-pages" }, { kind: "ngmodule", type: AXTabsModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "responsiveOn", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "responsiveOnChange", "loadingTextChange"] }, { kind: "component", type: i2.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i2.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDrawerModule }, { kind: "component", type: i3.AXDrawerComponent, selector: "ax-drawer", inputs: ["location", "showBackdrop", "mode", "collapsed", "closeOthers"], outputs: ["locationChange", "modeChange", "collapsedChange"] }, { kind: "component", type: i3.AXDrawerContainerComponent, selector: "ax-drawer-container" }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXMenuModule }, { kind: "ngmodule", type: AXButtonGroupModule }, { kind: "component", type: i5.AXButtonGroupComponent, selector: "ax-button-group", inputs: ["disabled", "color", "look", "selection"], outputs: ["onBlur", "onFocus", "lookChange", "colorChange", "disabledChange", "selectionChange"] }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i6.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXPLayoutDesignerComponent, decorators: [{
             type: Component,
@@ -42,6 +85,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
                         AXPDesignerOutlineComponent,
                         AXPDesignerHeaderMenuComponent,
                         AXPDesignerHistoryComponent,
+                        AXPDesignerPagesComponent,
                         AXTabsModule,
                         AXButtonModule,
                         AXDrawerModule,
@@ -49,6 +93,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
                         AXMenuModule,
                         AXButtonGroupModule,
                         AXDropdownModule,
-                    ], providers: [AXPDesignerService], template: "<ax-drawer-container class=\"ax-h-full ax-w-full ax-flex ax-relative child:ax-h-full ax-overflow-hidden ax-dark\">\n  <ax-content class=\"ax-contents\">\n    <!-- Toolbar Side -->\n    <div class=\"ax-min-w-10 ax-bg-surface ax-border-e ax-xs ax-flex ax-flex-col ax-items-center \">\n      <div class=\"ax-min-w-10 ax-h-10 ax-flex ax-items-center ax-justify-center ax-border-b\">\n        <img src=\"assets/logos/logo.png\" class=\"ax-w-6\" />\n      </div>\n      <div class=\"ax-py-1\"></div>\n      <div class=\"ax-flex ax-flex-col ax-gap-2\">\n        <ax-button color=\"ghost\" look=\"twotone\">\n          <ax-icon class=\"fa-solid fa-puzzle ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <ax-button color=\"ghost\" look=\"twotone\">\n          <ax-icon class=\"fa-solid fa-plus ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <ax-button color=\"ghost\" look=\"twotone\">\n          <ax-icon class=\"fa-solid fa-database ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <ax-button color=\"ghost\" look=\"twotone\" (onClick)=\"outline.toggle()\" title=\"Outline\">\n          <ax-icon class=\"fa-solid fa-list-tree ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <ax-button color=\"ghost\" look=\"twotone\" (onClick)=\"history.toggle()\" title=\"History\">\n          <ax-icon class=\"fa-solid fa-clock-rotate-left ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <ax-button color=\"ghost\" look=\"twotone\" title=\"Timeline\">\n          <ax-icon class=\"fa-solid fa-diagram-sankey ax-text-sm\"> </ax-icon>\n        </ax-button>\n      </div>\n    </div>\n    <!-- Main Side -->\n    <div class=\"ax-col-span-10 ax-flex ax-flex-col ax-flex-1\">\n      <!-- Header Toolbar -->\n      <div class=\"ax-min-h-10 ax-bg-surface ax-border-b  ax-flex ax-flex-grow ax-justify-between ax-px-2\">\n        <div class=\"ax-flex ax-items-center ax-justify-center ax-text-white\">\n          <axp-designer-header-menu></axp-designer-header-menu>\n        </div>\n        <div class=\"ax-flex ax-flex-row ax-gap-2 ax-xs ax-items-center\">\n          <ax-button-group color=\"ghost\" look=\"twotone\" [selection]=\"'single'\">\n            <ax-button-item [selected]=\"service.size() == 'xl'\" [data]=\"'xl'\" (onClick)=\"service.size.set('xl')\">\n              <ax-icon class=\"fa-light fa-desktop\"></ax-icon>\n            </ax-button-item>\n            <ax-button-item [selected]=\"service.size() == 'lg'\" [data]=\"'lg'\" (onClick)=\"service.size.set('lg')\">\n              <ax-icon class=\"fa-light fa-tablet\"></ax-icon>\n            </ax-button-item>\n            <ax-button-item [selected]=\"service.size() == 'sm'\" [data]=\"'sm'\" (onClick)=\"service.size.set('sm')\">\n              <ax-icon class=\"fa-light fa-mobile\"></ax-icon>\n            </ax-button-item>\n          </ax-button-group>\n        </div>\n        <div class=\"ax-flex ax-flex-row ax-gap-2 ax-xs ax-items-center\">\n          <ax-button text=\"Design\" look=\"outline\" class=\"ax-xs\">\n            <ax-suffix>\n              <ax-icon class=\"fa-light fa-chevron-down\"></ax-icon>\n            </ax-suffix>\n            <ax-dropdown-panel>\n              <ax-button-item-list>\n                <ax-button-item text=\"Print\" name=\"print\"> </ax-button-item>\n                <ax-button-item text=\"View\" name=\"view\"> </ax-button-item>\n              </ax-button-item-list>\n            </ax-dropdown-panel>\n          </ax-button>\n          <ax-button color=\"success\" look=\"outline\" text=\"Preview\" class=\"ax-xs\">\n            <ax-suffix>\n              <ax-icon class=\"fa-solid fa-play\"></ax-icon>\n            </ax-suffix>\n          </ax-button>\n        </div>\n      </div>\n      <!-- Board -->\n      <div class=\"ax-h-full \">\n        <ax-drawer-container class=\"ax-w-full ax-h-full\">\n          <ax-drawer #bd location=\"start\" mode=\"push\">\n            <ax-content>\n              <div class=\"ax-min-w-80 ax-h-full ax-overflow-auto ax-border-e\"></div>\n            </ax-content>\n          </ax-drawer>\n          <!-- Outline Pnael -->\n          <ax-drawer #outline location=\"start\" mode=\"push\">\n            <ax-content>\n              <axp-designer-outline></axp-designer-outline>\n            </ax-content>\n          </ax-drawer>\n          <!-- History Pnael -->\n          <ax-drawer #history location=\"start\" mode=\"push\">\n            <ax-content>\n              <axp-designer-history></axp-designer-history>\n            </ax-content>\n          </ax-drawer>\n          <!-- Content of board -->\n          <ax-content class=\"ax-light\">\n            <axp-designer-board class=\"ax-h-full ax-bg-on-surface ax-flex ax-justify-center\"> </axp-designer-board>\n          </ax-content>\n        </ax-drawer-container>\n      </div>\n      <!-- Footer -->\n      <div class=\"ax-min-h-10 ax-bg-surface ax-border-t  ax-flex ax-items-center\">\n        <axp-designer-breadcrumbs class=\"ax-border-default ax-border-t ax-p-2 ax-font-normal\">\n        </axp-designer-breadcrumbs>\n      </div>\n    </div>\n  </ax-content>\n  <!-- Property Side -->\n  <ax-drawer class=\"ax-w-80 ax-border-s\" location=\"end\" mode=\"push\" [collapsed]=\"false\" #pd>\n    <ax-content>\n      <div class=\"ax-flex ax-flex-row ax-w-full ax-justify-between ax-text-white ax-py-2 ax-px-4 ax-border-b\">\n        <div class=\"ax-flex ax-flex-row ax-gap-2 ax-items-center\">\n          <i [ngClass]=\"nodeConfig()?.icon\"></i>\n          <span class=\"ax-font-semibold\">{{ nodeConfig()?.title }}</span>\n        </div>\n      </div>\n      <axp-widget-property-viewer [widget]=\"service.selectedNode()!\"\n        (onChanged)=\"service.update({ values: $event.values, mode: $event.mode })\" class=\"ax-w-1/4\">\n      </axp-widget-property-viewer>\n    </ax-content>\n  </ax-drawer>\n</ax-drawer-container>", styles: [".axp-designer-board{display:block;height:100%;width:100%;overflow:auto;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));padding:.75rem}.axp-designer-board.axp-state-design .axp-widget-host{position:relative;display:block;cursor:pointer;padding:.25rem}.axp-designer-board.axp-state-design .axp-widget-host.axp-state-selected{outline-style:solid;outline-width:1px;outline-offset:1px;outline-color:rgba(var(--ax-color-primary-500),1);position:relative}.axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover{outline-style:dashed;outline-width:1px;outline-offset:1px;outline-color:rgba(var(--ax-color-primary-500),1)}.axp-designer-board.axp-state-design .axp-widget-host .axp-widget-overlay{position:absolute;left:0;top:0;right:0;bottom:0;z-index:10;height:100%;width:100%;background:rgba(202,123,123,.39)}@keyframes moveLight{0%{background-position:0% 50%}to{background-position:100% 50%}}\n"] }]
-        }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVzaWduZXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9wbGF0Zm9ybS9sYXlvdXQvZGVzaWduZXIvc3JjL2xpYi9kZXNpZ25lci9kZXNpZ25lci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3BsYXRmb3JtL2xheW91dC9kZXNpZ25lci9zcmMvbGliL2Rlc2lnbmVyL2Rlc2lnbmVyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUMzRCxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSxpQ0FBaUMsQ0FBQztBQUN0RSxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQztBQUNsRSxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFDM0QsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDL0QsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBQ3ZELE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQztBQUN2RCxPQUFPLEVBQUUsc0JBQXNCLEVBQW1CLE1BQU0saUNBQWlDLENBQUM7QUFDMUYsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFlLE1BQU0sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUM1RixPQUFPLEVBQUUsR0FBRyxFQUFFLE1BQU0sV0FBVyxDQUFDO0FBQ2hDLE9BQU8sRUFBRSx5QkFBeUIsRUFBRSxNQUFNLDBCQUEwQixDQUFDO0FBQ3JFLE9BQU8sRUFBRSwrQkFBK0IsRUFBRSxNQUFNLHNDQUFzQyxDQUFDO0FBQ3ZGLE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxNQUFNLHFCQUFxQixDQUFDO0FBQ3pELE9BQU8sRUFBRSw4QkFBOEIsRUFBRSxNQUFNLHNDQUFzQyxDQUFDO0FBQ3RGLE9BQU8sRUFBRSwyQkFBMkIsRUFBRSxNQUFNLDhCQUE4QixDQUFDO0FBQzNFLE9BQU8sRUFBRSxnQ0FBZ0MsRUFBRSxNQUFNLHFEQUFxRCxDQUFDO0FBQ3ZHLE9BQU8sRUFBRSwyQkFBMkIsRUFBRSxNQUFNLDhCQUE4QixDQUFDOzs7Ozs7OztBQTJCM0UsTUFBTSxPQUFPLDBCQUEwQjtJQXpCdkM7UUEyQlksWUFBTyxHQUFHLE1BQU0sQ0FBQyxrQkFBa0IsQ0FBQyxDQUFDO1FBRXJDLGVBQVUsR0FBRyxRQUFRLENBQXlCLEdBQUcsRUFBRSxDQUMzRCxJQUFJLENBQUMsT0FBTyxDQUFDLFlBQVksRUFBRSxDQUFDLENBQUMsQ0FBRSxHQUFHLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxZQUFZLEVBQUUsRUFBRSxpQkFBaUIsQ0FBNEIsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUNySCxDQUFDO0tBRUg7OEdBUlksMEJBQTBCO2tHQUExQiwwQkFBMEIsa0VBRjFCLENBQUMsa0JBQWtCLENBQUMsMEJDMUNqQyxrdExBbUhzQixxK0JEekZsQixZQUFZLDRIQUNaLHNCQUFzQiwrQkFDdEIseUJBQXlCLCtEQUN6QixnQ0FBZ0MsbUhBQ2hDLCtCQUErQixxRUFDL0IsMkJBQTJCLGlFQUMzQiw4QkFBOEIscUVBQzlCLDJCQUEyQixnRUFDM0IsWUFBWSw4QkFDWixjQUFjLDh2QkFDZCxjQUFjLDhUQUNkLGlCQUFpQix1VkFDakIsWUFBWSw4QkFDWixtQkFBbUIseVFBQ25CLGdCQUFnQjs7MkZBSVAsMEJBQTBCO2tCQXpCdEMsU0FBUzsrQkFDRSxxQkFBcUIsaUJBR2hCLGlCQUFpQixDQUFDLElBQUksY0FDekIsSUFBSSxXQUNQO3dCQUNQLFlBQVk7d0JBQ1osc0JBQXNCO3dCQUN0Qix5QkFBeUI7d0JBQ3pCLGdDQUFnQzt3QkFDaEMsK0JBQStCO3dCQUMvQiwyQkFBMkI7d0JBQzNCLDhCQUE4Qjt3QkFDOUIsMkJBQTJCO3dCQUMzQixZQUFZO3dCQUNaLGNBQWM7d0JBQ2QsY0FBYzt3QkFDZCxpQkFBaUI7d0JBQ2pCLFlBQVk7d0JBQ1osbUJBQW1CO3dCQUNuQixnQkFBZ0I7cUJBQ2pCLGFBQ1UsQ0FBQyxrQkFBa0IsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEFYQnV0dG9uTW9kdWxlIH0gZnJvbSAnQGFjb3JleC9jb21wb25lbnRzL2J1dHRvbic7XG5pbXBvcnQgeyBBWEJ1dHRvbkdyb3VwTW9kdWxlIH0gZnJvbSAnQGFjb3JleC9jb21wb25lbnRzL2J1dHRvbi1ncm91cCc7XG5pbXBvcnQgeyBBWERlY29yYXRvck1vZHVsZSB9IGZyb20gJ0BhY29yZXgvY29tcG9uZW50cy9kZWNvcmF0b3JzJztcbmltcG9ydCB7IEFYRHJhd2VyTW9kdWxlIH0gZnJvbSAnQGFjb3JleC9jb21wb25lbnRzL2RyYXdlcic7XG5pbXBvcnQgeyBBWERyb3Bkb3duTW9kdWxlIH0gZnJvbSAnQGFjb3JleC9jb21wb25lbnRzL2Ryb3Bkb3duJztcbmltcG9ydCB7IEFYTWVudU1vZHVsZSB9IGZyb20gJ0BhY29yZXgvY29tcG9uZW50cy9tZW51JztcbmltcG9ydCB7IEFYVGFic01vZHVsZSB9IGZyb20gJ0BhY29yZXgvY29tcG9uZW50cy90YWJzJztcbmltcG9ydCB7IEFYUExheW91dEJ1aWxkZXJNb2R1bGUsIEFYUFdpZGdldENvbmZpZyB9IGZyb20gJ0BhY29yZXgvcGxhdGZvcm0vbGF5b3V0L2J1aWxkZXInO1xuaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IENvbXBvbmVudCwgY29tcHV0ZWQsIEhvc3RCaW5kaW5nLCBpbmplY3QsIFZpZXdFbmNhcHN1bGF0aW9uIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBnZXQgfSBmcm9tICdsb2Rhc2gtZXMnO1xuaW1wb3J0IHsgQVhQRGVzaWduZXJCb2FyZENvbXBvbmVudCB9IGZyb20gJy4uL2JvYXJkL2JvYXJkLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBBWFBEZXNpZ25lckJyZWFkY3J1bWJzQ29tcG9uZW50IH0gZnJvbSAnLi4vYnJlYWRjcnVtYnMvYnJlYWRjcnVtYnMuY29tcG9uZW50JztcbmltcG9ydCB7IEFYUERlc2lnbmVyU2VydmljZSB9IGZyb20gJy4uL2Rlc2lnbmVyLnNlcnZpY2UnO1xuaW1wb3J0IHsgQVhQRGVzaWduZXJIZWFkZXJNZW51Q29tcG9uZW50IH0gZnJvbSAnLi4vaGVhZGVyLW1lbnUvaGVhZGVyLW1lbnUuY29tcG9uZW50JztcbmltcG9ydCB7IEFYUERlc2lnbmVyT3V0bGluZUNvbXBvbmVudCB9IGZyb20gJy4uL291dGxpbmUvb3V0bGluZS5jb21wb25lbnQnO1xuaW1wb3J0IHsgQVhQV2lkZ2V0UHJvcGVydHlWaWV3ZXJDb21wb25lbnQgfSBmcm9tICcuLi9wcm9wZXJ0eS12aWV3ZXIvd2lkZ2V0LXByb3BlcnR5LXZpZXdlci5jb21wb25lbnQnO1xuaW1wb3J0IHsgQVhQRGVzaWduZXJIaXN0b3J5Q29tcG9uZW50IH0gZnJvbSAnLi4vaGlzdG9yeS9oaXN0b3J5LmNvbXBvbmVudCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2F4cC1sYXlvdXQtZGVzaWduZXInLFxuICB0ZW1wbGF0ZVVybDogJy4vZGVzaWduZXIuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9kZXNpZ25lci5jb21wb25lbnQuc2NzcyddLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbXG4gICAgQ29tbW9uTW9kdWxlLFxuICAgIEFYUExheW91dEJ1aWxkZXJNb2R1bGUsXG4gICAgQVhQRGVzaWduZXJCb2FyZENvbXBvbmVudCxcbiAgICBBWFBXaWRnZXRQcm9wZXJ0eVZpZXdlckNvbXBvbmVudCxcbiAgICBBWFBEZXNpZ25lckJyZWFkY3J1bWJzQ29tcG9uZW50LFxuICAgIEFYUERlc2lnbmVyT3V0bGluZUNvbXBvbmVudCxcbiAgICBBWFBEZXNpZ25lckhlYWRlck1lbnVDb21wb25lbnQsXG4gICAgQVhQRGVzaWduZXJIaXN0b3J5Q29tcG9uZW50LFxuICAgIEFYVGFic01vZHVsZSxcbiAgICBBWEJ1dHRvbk1vZHVsZSxcbiAgICBBWERyYXdlck1vZHVsZSxcbiAgICBBWERlY29yYXRvck1vZHVsZSxcbiAgICBBWE1lbnVNb2R1bGUsXG4gICAgQVhCdXR0b25Hcm91cE1vZHVsZSxcbiAgICBBWERyb3Bkb3duTW9kdWxlLFxuICBdLFxuICBwcm92aWRlcnM6IFtBWFBEZXNpZ25lclNlcnZpY2VdLFxufSlcbmV4cG9ydCBjbGFzcyBBWFBMYXlvdXREZXNpZ25lckNvbXBvbmVudCB7XG5cbiAgcHJvdGVjdGVkIHNlcnZpY2UgPSBpbmplY3QoQVhQRGVzaWduZXJTZXJ2aWNlKTtcblxuICBwcm90ZWN0ZWQgbm9kZUNvbmZpZyA9IGNvbXB1dGVkPEFYUFdpZGdldENvbmZpZyB8IG51bGw+KCgpID0+XG4gICAgdGhpcy5zZXJ2aWNlLnNlbGVjdGVkTm9kZSgpID8gKGdldCh0aGlzLnNlcnZpY2Uuc2VsZWN0ZWROb2RlKCksICdfX21ldGFfXy5jb25maWcnKSBhcyBhbnkgYXMgQVhQV2lkZ2V0Q29uZmlnKSA6IG51bGxcbiAgKTtcblxufVxuIiwiPGF4LWRyYXdlci1jb250YWluZXIgY2xhc3M9XCJheC1oLWZ1bGwgYXgtdy1mdWxsIGF4LWZsZXggYXgtcmVsYXRpdmUgY2hpbGQ6YXgtaC1mdWxsIGF4LW92ZXJmbG93LWhpZGRlbiBheC1kYXJrXCI+XG4gIDxheC1jb250ZW50IGNsYXNzPVwiYXgtY29udGVudHNcIj5cbiAgICA8IS0tIFRvb2xiYXIgU2lkZSAtLT5cbiAgICA8ZGl2IGNsYXNzPVwiYXgtbWluLXctMTAgYXgtYmctc3VyZmFjZSBheC1ib3JkZXItZSBheC14cyBheC1mbGV4IGF4LWZsZXgtY29sIGF4LWl0ZW1zLWNlbnRlciBcIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJheC1taW4tdy0xMCBheC1oLTEwIGF4LWZsZXggYXgtaXRlbXMtY2VudGVyIGF4LWp1c3RpZnktY2VudGVyIGF4LWJvcmRlci1iXCI+XG4gICAgICAgIDxpbWcgc3JjPVwiYXNzZXRzL2xvZ29zL2xvZ28ucG5nXCIgY2xhc3M9XCJheC13LTZcIiAvPlxuICAgICAgPC9kaXY+XG4gICAgICA8ZGl2IGNsYXNzPVwiYXgtcHktMVwiPjwvZGl2PlxuICAgICAgPGRpdiBjbGFzcz1cImF4LWZsZXggYXgtZmxleC1jb2wgYXgtZ2FwLTJcIj5cbiAgICAgICAgPGF4LWJ1dHRvbiBjb2xvcj1cImdob3N0XCIgbG9vaz1cInR3b3RvbmVcIj5cbiAgICAgICAgICA8YXgtaWNvbiBjbGFzcz1cImZhLXNvbGlkIGZhLXB1enpsZSBheC10ZXh0LXNtXCI+IDwvYXgtaWNvbj5cbiAgICAgICAgPC9heC1idXR0b24+XG4gICAgICAgIDxheC1idXR0b24gY29sb3I9XCJnaG9zdFwiIGxvb2s9XCJ0d290b25lXCI+XG4gICAgICAgICAgPGF4LWljb24gY2xhc3M9XCJmYS1zb2xpZCBmYS1wbHVzIGF4LXRleHQtc21cIj4gPC9heC1pY29uPlxuICAgICAgICA8L2F4LWJ1dHRvbj5cbiAgICAgICAgPGF4LWJ1dHRvbiBjb2xvcj1cImdob3N0XCIgbG9vaz1cInR3b3RvbmVcIj5cbiAgICAgICAgICA8YXgtaWNvbiBjbGFzcz1cImZhLXNvbGlkIGZhLWRhdGFiYXNlIGF4LXRleHQtc21cIj4gPC9heC1pY29uPlxuICAgICAgICA8L2F4LWJ1dHRvbj5cbiAgICAgICAgPGF4LWJ1dHRvbiBjb2xvcj1cImdob3N0XCIgbG9vaz1cInR3b3RvbmVcIiAob25DbGljayk9XCJvdXRsaW5lLnRvZ2dsZSgpXCIgdGl0bGU9XCJPdXRsaW5lXCI+XG4gICAgICAgICAgPGF4LWljb24gY2xhc3M9XCJmYS1zb2xpZCBmYS1saXN0LXRyZWUgYXgtdGV4dC1zbVwiPiA8L2F4LWljb24+XG4gICAgICAgIDwvYXgtYnV0dG9uPlxuICAgICAgICA8YXgtYnV0dG9uIGNvbG9yPVwiZ2hvc3RcIiBsb29rPVwidHdvdG9uZVwiIChvbkNsaWNrKT1cImhpc3RvcnkudG9nZ2xlKClcIiB0aXRsZT1cIkhpc3RvcnlcIj5cbiAgICAgICAgICA8YXgtaWNvbiBjbGFzcz1cImZhLXNvbGlkIGZhLWNsb2NrLXJvdGF0ZS1sZWZ0IGF4LXRleHQtc21cIj4gPC9heC1pY29uPlxuICAgICAgICA8L2F4LWJ1dHRvbj5cbiAgICAgICAgPGF4LWJ1dHRvbiBjb2xvcj1cImdob3N0XCIgbG9vaz1cInR3b3RvbmVcIiB0aXRsZT1cIlRpbWVsaW5lXCI+XG4gICAgICAgICAgPGF4LWljb24gY2xhc3M9XCJmYS1zb2xpZCBmYS1kaWFncmFtLXNhbmtleSBheC10ZXh0LXNtXCI+IDwvYXgtaWNvbj5cbiAgICAgICAgPC9heC1idXR0b24+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbiAgICA8IS0tIE1haW4gU2lkZSAtLT5cbiAgICA8ZGl2IGNsYXNzPVwiYXgtY29sLXNwYW4tMTAgYXgtZmxleCBheC1mbGV4LWNvbCBheC1mbGV4LTFcIj5cbiAgICAgIDwhLS0gSGVhZGVyIFRvb2xiYXIgLS0+XG4gICAgICA8ZGl2IGNsYXNzPVwiYXgtbWluLWgtMTAgYXgtYmctc3VyZmFjZSBheC1ib3JkZXItYiAgYXgtZmxleCBheC1mbGV4LWdyb3cgYXgtanVzdGlmeS1iZXR3ZWVuIGF4LXB4LTJcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cImF4LWZsZXggYXgtaXRlbXMtY2VudGVyIGF4LWp1c3RpZnktY2VudGVyIGF4LXRleHQtd2hpdGVcIj5cbiAgICAgICAgICA8YXhwLWRlc2lnbmVyLWhlYWRlci1tZW51PjwvYXhwLWRlc2lnbmVyLWhlYWRlci1tZW51PlxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPGRpdiBjbGFzcz1cImF4LWZsZXggYXgtZmxleC1yb3cgYXgtZ2FwLTIgYXgteHMgYXgtaXRlbXMtY2VudGVyXCI+XG4gICAgICAgICAgPGF4LWJ1dHRvbi1ncm91cCBjb2xvcj1cImdob3N0XCIgbG9vaz1cInR3b3RvbmVcIiBbc2VsZWN0aW9uXT1cIidzaW5nbGUnXCI+XG4gICAgICAgICAgICA8YXgtYnV0dG9uLWl0ZW0gW3NlbGVjdGVkXT1cInNlcnZpY2Uuc2l6ZSgpID09ICd4bCdcIiBbZGF0YV09XCIneGwnXCIgKG9uQ2xpY2spPVwic2VydmljZS5zaXplLnNldCgneGwnKVwiPlxuICAgICAgICAgICAgICA8YXgtaWNvbiBjbGFzcz1cImZhLWxpZ2h0IGZhLWRlc2t0b3BcIj48L2F4LWljb24+XG4gICAgICAgICAgICA8L2F4LWJ1dHRvbi1pdGVtPlxuICAgICAgICAgICAgPGF4LWJ1dHRvbi1pdGVtIFtzZWxlY3RlZF09XCJzZXJ2aWNlLnNpemUoKSA9PSAnbGcnXCIgW2RhdGFdPVwiJ2xnJ1wiIChvbkNsaWNrKT1cInNlcnZpY2Uuc2l6ZS5zZXQoJ2xnJylcIj5cbiAgICAgICAgICAgICAgPGF4LWljb24gY2xhc3M9XCJmYS1saWdodCBmYS10YWJsZXRcIj48L2F4LWljb24+XG4gICAgICAgICAgICA8L2F4LWJ1dHRvbi1pdGVtPlxuICAgICAgICAgICAgPGF4LWJ1dHRvbi1pdGVtIFtzZWxlY3RlZF09XCJzZXJ2aWNlLnNpemUoKSA9PSAnc20nXCIgW2RhdGFdPVwiJ3NtJ1wiIChvbkNsaWNrKT1cInNlcnZpY2Uuc2l6ZS5zZXQoJ3NtJylcIj5cbiAgICAgICAgICAgICAgPGF4LWljb24gY2xhc3M9XCJmYS1saWdodCBmYS1tb2JpbGVcIj48L2F4LWljb24+XG4gICAgICAgICAgICA8L2F4LWJ1dHRvbi1pdGVtPlxuICAgICAgICAgIDwvYXgtYnV0dG9uLWdyb3VwPlxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPGRpdiBjbGFzcz1cImF4LWZsZXggYXgtZmxleC1yb3cgYXgtZ2FwLTIgYXgteHMgYXgtaXRlbXMtY2VudGVyXCI+XG4gICAgICAgICAgPGF4LWJ1dHRvbiB0ZXh0PVwiRGVzaWduXCIgbG9vaz1cIm91dGxpbmVcIiBjbGFzcz1cImF4LXhzXCI+XG4gICAgICAgICAgICA8YXgtc3VmZml4PlxuICAgICAgICAgICAgICA8YXgtaWNvbiBjbGFzcz1cImZhLWxpZ2h0IGZhLWNoZXZyb24tZG93blwiPjwvYXgtaWNvbj5cbiAgICAgICAgICAgIDwvYXgtc3VmZml4PlxuICAgICAgICAgICAgPGF4LWRyb3Bkb3duLXBhbmVsPlxuICAgICAgICAgICAgICA8YXgtYnV0dG9uLWl0ZW0tbGlzdD5cbiAgICAgICAgICAgICAgICA8YXgtYnV0dG9uLWl0ZW0gdGV4dD1cIlByaW50XCIgbmFtZT1cInByaW50XCI+IDwvYXgtYnV0dG9uLWl0ZW0+XG4gICAgICAgICAgICAgICAgPGF4LWJ1dHRvbi1pdGVtIHRleHQ9XCJWaWV3XCIgbmFtZT1cInZpZXdcIj4gPC9heC1idXR0b24taXRlbT5cbiAgICAgICAgICAgICAgPC9heC1idXR0b24taXRlbS1saXN0PlxuICAgICAgICAgICAgPC9heC1kcm9wZG93bi1wYW5lbD5cbiAgICAgICAgICA8L2F4LWJ1dHRvbj5cbiAgICAgICAgICA8YXgtYnV0dG9uIGNvbG9yPVwic3VjY2Vzc1wiIGxvb2s9XCJvdXRsaW5lXCIgdGV4dD1cIlByZXZpZXdcIiBjbGFzcz1cImF4LXhzXCI+XG4gICAgICAgICAgICA8YXgtc3VmZml4PlxuICAgICAgICAgICAgICA8YXgtaWNvbiBjbGFzcz1cImZhLXNvbGlkIGZhLXBsYXlcIj48L2F4LWljb24+XG4gICAgICAgICAgICA8L2F4LXN1ZmZpeD5cbiAgICAgICAgICA8L2F4LWJ1dHRvbj5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L2Rpdj5cbiAgICAgIDwhLS0gQm9hcmQgLS0+XG4gICAgICA8ZGl2IGNsYXNzPVwiYXgtaC1mdWxsIFwiPlxuICAgICAgICA8YXgtZHJhd2VyLWNvbnRhaW5lciBjbGFzcz1cImF4LXctZnVsbCBheC1oLWZ1bGxcIj5cbiAgICAgICAgICA8YXgtZHJhd2VyICNiZCBsb2NhdGlvbj1cInN0YXJ0XCIgbW9kZT1cInB1c2hcIj5cbiAgICAgICAgICAgIDxheC1jb250ZW50PlxuICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwiYXgtbWluLXctODAgYXgtaC1mdWxsIGF4LW92ZXJmbG93LWF1dG8gYXgtYm9yZGVyLWVcIj48L2Rpdj5cbiAgICAgICAgICAgIDwvYXgtY29udGVudD5cbiAgICAgICAgICA8L2F4LWRyYXdlcj5cbiAgICAgICAgICA8IS0tIE91dGxpbmUgUG5hZWwgLS0+XG4gICAgICAgICAgPGF4LWRyYXdlciAjb3V0bGluZSBsb2NhdGlvbj1cInN0YXJ0XCIgbW9kZT1cInB1c2hcIj5cbiAgICAgICAgICAgIDxheC1jb250ZW50PlxuICAgICAgICAgICAgICA8YXhwLWRlc2lnbmVyLW91dGxpbmU+PC9heHAtZGVzaWduZXItb3V0bGluZT5cbiAgICAgICAgICAgIDwvYXgtY29udGVudD5cbiAgICAgICAgICA8L2F4LWRyYXdlcj5cbiAgICAgICAgICA8IS0tIEhpc3RvcnkgUG5hZWwgLS0+XG4gICAgICAgICAgPGF4LWRyYXdlciAjaGlzdG9yeSBsb2NhdGlvbj1cInN0YXJ0XCIgbW9kZT1cInB1c2hcIj5cbiAgICAgICAgICAgIDxheC1jb250ZW50PlxuICAgICAgICAgICAgICA8YXhwLWRlc2lnbmVyLWhpc3Rvcnk+PC9heHAtZGVzaWduZXItaGlzdG9yeT5cbiAgICAgICAgICAgIDwvYXgtY29udGVudD5cbiAgICAgICAgICA8L2F4LWRyYXdlcj5cbiAgICAgICAgICA8IS0tIENvbnRlbnQgb2YgYm9hcmQgLS0+XG4gICAgICAgICAgPGF4LWNvbnRlbnQgY2xhc3M9XCJheC1saWdodFwiPlxuICAgICAgICAgICAgPGF4cC1kZXNpZ25lci1ib2FyZCBjbGFzcz1cImF4LWgtZnVsbCBheC1iZy1vbi1zdXJmYWNlIGF4LWZsZXggYXgtanVzdGlmeS1jZW50ZXJcIj4gPC9heHAtZGVzaWduZXItYm9hcmQ+XG4gICAgICAgICAgPC9heC1jb250ZW50PlxuICAgICAgICA8L2F4LWRyYXdlci1jb250YWluZXI+XG4gICAgICA8L2Rpdj5cbiAgICAgIDwhLS0gRm9vdGVyIC0tPlxuICAgICAgPGRpdiBjbGFzcz1cImF4LW1pbi1oLTEwIGF4LWJnLXN1cmZhY2UgYXgtYm9yZGVyLXQgIGF4LWZsZXggYXgtaXRlbXMtY2VudGVyXCI+XG4gICAgICAgIDxheHAtZGVzaWduZXItYnJlYWRjcnVtYnMgY2xhc3M9XCJheC1ib3JkZXItZGVmYXVsdCBheC1ib3JkZXItdCBheC1wLTIgYXgtZm9udC1ub3JtYWxcIj5cbiAgICAgICAgPC9heHAtZGVzaWduZXItYnJlYWRjcnVtYnM+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbiAgPC9heC1jb250ZW50PlxuICA8IS0tIFByb3BlcnR5IFNpZGUgLS0+XG4gIDxheC1kcmF3ZXIgY2xhc3M9XCJheC13LTgwIGF4LWJvcmRlci1zXCIgbG9jYXRpb249XCJlbmRcIiBtb2RlPVwicHVzaFwiIFtjb2xsYXBzZWRdPVwiZmFsc2VcIiAjcGQ+XG4gICAgPGF4LWNvbnRlbnQ+XG4gICAgICA8ZGl2IGNsYXNzPVwiYXgtZmxleCBheC1mbGV4LXJvdyBheC13LWZ1bGwgYXgtanVzdGlmeS1iZXR3ZWVuIGF4LXRleHQtd2hpdGUgYXgtcHktMiBheC1weC00IGF4LWJvcmRlci1iXCI+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJheC1mbGV4IGF4LWZsZXgtcm93IGF4LWdhcC0yIGF4LWl0ZW1zLWNlbnRlclwiPlxuICAgICAgICAgIDxpIFtuZ0NsYXNzXT1cIm5vZGVDb25maWcoKT8uaWNvblwiPjwvaT5cbiAgICAgICAgICA8c3BhbiBjbGFzcz1cImF4LWZvbnQtc2VtaWJvbGRcIj57eyBub2RlQ29uZmlnKCk/LnRpdGxlIH19PC9zcGFuPlxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvZGl2PlxuICAgICAgPGF4cC13aWRnZXQtcHJvcGVydHktdmlld2VyIFt3aWRnZXRdPVwic2VydmljZS5zZWxlY3RlZE5vZGUoKSFcIlxuICAgICAgICAob25DaGFuZ2VkKT1cInNlcnZpY2UudXBkYXRlKHsgdmFsdWVzOiAkZXZlbnQudmFsdWVzLCBtb2RlOiAkZXZlbnQubW9kZSB9KVwiIGNsYXNzPVwiYXgtdy0xLzRcIj5cbiAgICAgIDwvYXhwLXdpZGdldC1wcm9wZXJ0eS12aWV3ZXI+XG4gICAgPC9heC1jb250ZW50PlxuICA8L2F4LWRyYXdlcj5cbjwvYXgtZHJhd2VyLWNvbnRhaW5lcj4iXX0=
+                    ], providers: [AXPDesignerService], template: "<ax-drawer-container class=\"ax-h-full ax-w-full ax-flex ax-relative child:ax-h-full ax-overflow-hidden ax-dark\">\n  <ax-content class=\"ax-contents\">\n    <!-- Toolbar Side -->\n    <div class=\"ax-min-w-10 ax-bg-surface ax-border-e ax-xs ax-flex ax-flex-col ax-items-center \">\n      <div class=\"ax-min-w-10 ax-h-10 ax-flex ax-items-center ax-justify-center ax-border-b\">\n        <img src=\"assets/logos/logo.png\" class=\"ax-w-6\" />\n      </div>\n      <div class=\"ax-py-1\"></div>\n      <div class=\"ax-flex ax-flex-col ax-gap-2\">\n        <!-- <ax-button color=\"ghost\" look=\"twotone\">\n          <ax-icon class=\"fa-solid fa-puzzle ax-text-sm\"> </ax-icon>\n        </ax-button> -->\n        <ax-button color=\"ghost\" look=\"twotone\" (onClick)=\"pages.toggle()\" title=\"Pages\">\n          <ax-icon class=\"fa-solid fa-page ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <ax-button color=\"ghost\" look=\"twotone\" (onClick)=\"datasources.toggle()\" title=\"Data Sources\">\n          <ax-icon class=\"fa-solid fa-database ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <ax-button color=\"ghost\" look=\"twotone\" (onClick)=\"outline.toggle()\" title=\"Outline\">\n          <ax-icon class=\"fa-solid fa-list-tree ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <ax-button color=\"ghost\" look=\"twotone\" (onClick)=\"history.toggle()\" title=\"History\">\n          <ax-icon class=\"fa-solid fa-clock-rotate-left ax-text-sm\"> </ax-icon>\n        </ax-button>\n        <!-- <ax-button color=\"ghost\" look=\"twotone\" title=\"Timeline\">\n          <ax-icon class=\"fa-solid fa-diagram-sankey ax-text-sm\"> </ax-icon>\n        </ax-button> -->\n      </div>\n    </div>\n    <!-- Main Side -->\n    <div class=\"ax-col-span-10 ax-flex ax-flex-col ax-flex-1\">\n      <!-- Header Toolbar -->\n      <div class=\"ax-min-h-10 ax-bg-surface ax-border-b  ax-flex ax-flex-grow ax-justify-between ax-px-2\">\n        <div class=\"ax-flex ax-items-center ax-justify-center ax-text-white\">\n          <axp-designer-header-menu></axp-designer-header-menu>\n        </div>\n        <div class=\"ax-flex ax-flex-row ax-gap-2 ax-xs ax-items-center\">\n          <ax-button-group color=\"ghost\" look=\"twotone\" [selection]=\"'single'\">\n            <ax-button-item [selected]=\"service.size() == 'xl'\" [data]=\"'xl'\" (onClick)=\"service.size.set('xl')\">\n              <ax-icon class=\"fa-light fa-desktop\"></ax-icon>\n            </ax-button-item>\n            <ax-button-item [selected]=\"service.size() == 'lg'\" [data]=\"'lg'\" (onClick)=\"service.size.set('lg')\">\n              <ax-icon class=\"fa-light fa-tablet\"></ax-icon>\n            </ax-button-item>\n            <ax-button-item [selected]=\"service.size() == 'sm'\" [data]=\"'sm'\" (onClick)=\"service.size.set('sm')\">\n              <ax-icon class=\"fa-light fa-mobile\"></ax-icon>\n            </ax-button-item>\n          </ax-button-group>\n        </div>\n        <div class=\"ax-flex ax-flex-row ax-gap-2 ax-xs ax-items-center\">\n          <ax-button text=\"Design\" look=\"outline\" class=\"ax-xs\">\n            <ax-suffix>\n              <ax-icon class=\"fa-light fa-chevron-down\"></ax-icon>\n            </ax-suffix>\n            <ax-dropdown-panel>\n              <ax-button-item-list>\n                <ax-button-item text=\"Print\" name=\"print\"> </ax-button-item>\n                <ax-button-item text=\"View\" name=\"view\"> </ax-button-item>\n              </ax-button-item-list>\n            </ax-dropdown-panel>\n          </ax-button>\n          <ax-button color=\"success\" look=\"outline\" text=\"Preview\" class=\"ax-xs\" (onClick)=\"service.openPreview()\">\n            <ax-suffix>\n              <ax-icon class=\"fa-solid fa-play\"></ax-icon>\n            </ax-suffix>\n          </ax-button>\n        </div>\n      </div>\n      <!-- Board -->\n      <div class=\"ax-h-full \">\n        <ax-drawer-container class=\"ax-w-full ax-h-full\">\n          <!-- Pages -->\n          <ax-drawer #pages location=\"start\" mode=\"push\">\n            <ax-content>\n              <axp-designer-pages></axp-designer-pages>\n            </ax-content>\n          </ax-drawer>\n          <!-- Datasources -->\n          <ax-drawer #datasources location=\"start\" mode=\"push\">\n            <ax-content>\n              Datasources\n            </ax-content>\n          </ax-drawer>\n          <!-- Outline Pnael -->\n          <ax-drawer #outline location=\"start\" mode=\"push\">\n            <ax-content>\n              <axp-designer-outline></axp-designer-outline>\n            </ax-content>\n          </ax-drawer>\n          <!-- History Pnael -->\n          <ax-drawer #history location=\"start\" mode=\"push\">\n            <ax-content>\n              <axp-designer-history></axp-designer-history>\n            </ax-content>\n          </ax-drawer>\n          <!-- Content of board -->\n          <ax-content class=\"ax-light\">\n            <axp-designer-board class=\"ax-h-full ax-bg-on-surface ax-flex ax-justify-center\"> </axp-designer-board>\n          </ax-content>\n        </ax-drawer-container>\n      </div>\n      <!-- Footer -->\n      <div class=\"ax-min-h-10 ax-bg-surface ax-border-t  ax-flex ax-items-center\">\n        <axp-designer-breadcrumbs class=\"ax-border-default ax-border-t ax-p-2 ax-font-normal\">\n        </axp-designer-breadcrumbs>\n      </div>\n    </div>\n  </ax-content>\n  <!-- Property Side -->\n  <ax-drawer class=\"ax-w-80 ax-border-s\" location=\"end\" mode=\"push\" [collapsed]=\"false\" #pd>\n    <ax-content>\n      <div class=\"ax-flex ax-flex-row ax-w-full ax-justify-between ax-text-white ax-py-2 ax-px-4 ax-border-b\">\n        <div class=\"ax-flex ax-flex-row ax-gap-2 ax-items-center\">\n          <i [ngClass]=\"nodeConfig()?.icon\"></i>\n          <span class=\"ax-font-semibold\">{{ nodeConfig()?.title }}</span>\n        </div>\n      </div>\n      <axp-widget-property-viewer [widget]=\"service.selectedNode()!\"\n        (onChanged)=\"service.update({ values: $event.values, mode: $event.mode })\" class=\"ax-w-1/4\">\n      </axp-widget-property-viewer>\n    </ax-content>\n  </ax-drawer>\n</ax-drawer-container>", styles: [".axp-designer-board{display:block;height:100%;width:100%;overflow:auto;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));padding:.75rem}.axp-designer-board.axp-state-design .axp-widget-host{position:relative;display:block;cursor:pointer}.axp-designer-board.axp-state-design .axp-widget-host.axp-state-selected{outline-style:solid;outline-width:2px;outline-offset:1px;outline-color:#60a5fa;position:relative}.axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover:not(.axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover.axp-state-selected){outline-style:solid;outline-width:1px;outline-offset:1px;outline-color:#60a5fa}.axp-designer-board.axp-state-design .axp-widget-host .axp-widget-overlay{position:absolute;left:0;top:0;right:0;bottom:0;z-index:10;height:100%;width:100%}@keyframes moveLight{0%{background-position:0% 50%}to{background-position:100% 50%}}.axp-designer-board .axp-empty-space{background-color:rgba(var(--ax-color-primary-300),10%);background-image:linear-gradient(135deg,rgba(var(--ax-color-primary-300),50%) 10%,transparent 0,transparent 50%,rgba(var(--ax-color-primary-300),50%) 0,rgba(var(--ax-color-primary-300),50%) 60%,transparent 0,transparent);background-size:7.5px 7.5px}.axp-designer-board .grid-stack-item-content{color:#2c3e50;text-align:center;background-color:#18bc9c}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { propertyViewer: [{
+                type: ViewChild,
+                args: [AXPWidgetPropertyViewerComponent, { static: true }]
+            }], handleKeyboardEvent: [{
+                type: HostListener,
+                args: ['document:keydown', ['$event']]
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVzaWduZXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9wbGF0Zm9ybS9sYXlvdXQvZGVzaWduZXIvc3JjL2xpYi9kZXNpZ25lci9kZXNpZ25lci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3BsYXRmb3JtL2xheW91dC9kZXNpZ25lci9zcmMvbGliL2Rlc2lnbmVyL2Rlc2lnbmVyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUMzRCxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSxpQ0FBaUMsQ0FBQztBQUN0RSxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQztBQUNsRSxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFDM0QsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDL0QsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBQ3ZELE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQztBQUN2RCxPQUFPLEVBQUUsc0JBQXNCLEVBQW1CLE1BQU0saUNBQWlDLENBQUM7QUFDMUYsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFlLFlBQVksRUFBRSxNQUFNLEVBQUUsU0FBUyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3JILE9BQU8sRUFBRSxHQUFHLEVBQUUsTUFBTSxXQUFXLENBQUM7QUFDaEMsT0FBTyxFQUFFLHlCQUF5QixFQUFFLE1BQU0sMEJBQTBCLENBQUM7QUFDckUsT0FBTyxFQUFFLCtCQUErQixFQUFFLE1BQU0sc0NBQXNDLENBQUM7QUFDdkYsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0scUJBQXFCLENBQUM7QUFDekQsT0FBTyxFQUFFLDhCQUE4QixFQUFFLE1BQU0sc0NBQXNDLENBQUM7QUFDdEYsT0FBTyxFQUFFLDJCQUEyQixFQUFFLE1BQU0sOEJBQThCLENBQUM7QUFDM0UsT0FBTyxFQUFFLGdDQUFnQyxFQUFFLE1BQU0scURBQXFELENBQUM7QUFDdkcsT0FBTyxFQUFFLDJCQUEyQixFQUFFLE1BQU0sOEJBQThCLENBQUM7QUFDM0UsT0FBTyxFQUFFLHlCQUF5QixFQUFFLE1BQU0sMEJBQTBCLENBQUM7Ozs7Ozs7O0FBNEJyRSxNQUFNLE9BQU8sMEJBQTBCO0lBWXJDO1FBVlUsWUFBTyxHQUFHLE1BQU0sQ0FBQyxrQkFBa0IsQ0FBQyxDQUFDO1FBS3JDLGVBQVUsR0FBRyxRQUFRLENBQXlCLEdBQUcsRUFBRSxDQUMzRCxJQUFJLENBQUMsT0FBTyxDQUFDLFlBQVksRUFBRSxDQUFDLENBQUMsQ0FBRSxHQUFHLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxZQUFZLEVBQUUsRUFBRSxpQkFBaUIsQ0FBNEIsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUNySCxDQUFDO1FBSUEsSUFBSSxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxFQUFFLEVBQUU7WUFDcEMsSUFBSSxDQUFDLGNBQWMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDO1FBQ3ZDLENBQUMsQ0FBQyxDQUFBO0lBQ0osQ0FBQztJQUdPLG1CQUFtQixDQUFDLEtBQW9CO1FBQzlDLElBQUksS0FBSyxDQUFDLE9BQU8sSUFBSSxLQUFLLENBQUMsTUFBTSxJQUFJLFFBQVEsQ0FBQyxJQUFJLEVBQUUsQ0FBQztZQUVuRCxRQUFRLEtBQUssQ0FBQyxHQUFHLENBQUMsV0FBVyxFQUFFLEVBQUUsQ0FBQyxDQUFDLDREQUE0RDtnQkFDN0YsS0FBSyxHQUFHO29CQUNOLEtBQUssQ0FBQyxjQUFjLEVBQUUsQ0FBQyxDQUFFLDRDQUE0QztvQkFDckUsSUFBSSxDQUFDLE9BQU8sQ0FBQyxJQUFJLEVBQUUsQ0FBQztvQkFDcEIsTUFBTTtnQkFDUixLQUFLLEdBQUc7b0JBQ04sS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDLENBQUUsNENBQTRDO29CQUNyRSxJQUFJLENBQUMsT0FBTyxDQUFDLElBQUksRUFBRSxDQUFDO29CQUNwQixNQUFNO2dCQUNSLEtBQUssR0FBRztvQkFDTixJQUFJLElBQUksQ0FBQyxPQUFPLENBQUMsVUFBVSxFQUFFLEVBQUUsQ0FBQzt3QkFDOUIsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDLENBQUUsNENBQTRDO3dCQUNyRSxJQUFJLENBQUMsT0FBTyxDQUFDLElBQUksRUFBRSxDQUFDO29CQUN0QixDQUFDO29CQUNELE1BQU07Z0JBQ1IsS0FBSyxHQUFHO29CQUNOLElBQUksSUFBSSxDQUFDLE9BQU8sQ0FBQyxVQUFVLEVBQUUsRUFBRSxDQUFDO3dCQUM5QixLQUFLLENBQUMsY0FBYyxFQUFFLENBQUMsQ0FBRSw0Q0FBNEM7d0JBQ3JFLElBQUksQ0FBQyxPQUFPLENBQUMsS0FBSyxFQUFFLENBQUM7b0JBQ3ZCLENBQUM7b0JBQ0QsTUFBTTtnQkFDUixLQUFLLEdBQUc7b0JBQ04sSUFBSSxJQUFJLENBQUMsT0FBTyxDQUFDLFVBQVUsRUFBRSxFQUFFLENBQUM7d0JBQzlCLFFBQVEsQ0FBQTt3QkFDUixLQUFLLENBQUMsY0FBYyxFQUFFLENBQUMsQ0FBRSwyQ0FBMkM7d0JBQ3BFLElBQUksQ0FBQyxPQUFPLENBQUMsR0FBRyxFQUFFLENBQUM7b0JBQ3JCLENBQUM7b0JBQ0QsTUFBTTtnQkFDUixLQUFLLEdBQUc7b0JBQ04sSUFBSSxJQUFJLENBQUMsT0FBTyxDQUFDLFFBQVEsRUFBRSxFQUFFLENBQUM7d0JBQzVCLEtBQUssQ0FBQyxjQUFjLEVBQUUsQ0FBQyxDQUFFLDZDQUE2Qzt3QkFDdEUsSUFBSSxDQUFDLE9BQU8sQ0FBQyxLQUFLLEVBQUUsQ0FBQztvQkFDdkIsQ0FBQztvQkFDRCxNQUFNO1lBQ1YsQ0FBQztRQUNILENBQUM7SUFDSCxDQUFDOzhHQTFEVSwwQkFBMEI7a0dBQTFCLDBCQUEwQiw4SUFGMUIsQ0FBQyxrQkFBa0IsQ0FBQywwRUFNcEIsZ0NBQWdDLDhEQ2xEN0MsMGpNQTBIc0IscTVDRC9GbEIsWUFBWSw0SEFDWixzQkFBc0IsK0JBQ3RCLHlCQUF5QiwrREFDekIsZ0NBQWdDLG1IQUNoQywrQkFBK0IscUVBQy9CLDJCQUEyQixpRUFDM0IsOEJBQThCLHFFQUM5QiwyQkFBMkIsaUVBQzNCLHlCQUF5Qiw4REFDekIsWUFBWSw4QkFDWixjQUFjLDh2QkFDZCxjQUFjLDZVQUNkLGlCQUFpQix1VkFDakIsWUFBWSw4QkFDWixtQkFBbUIseVFBQ25CLGdCQUFnQjs7MkZBSVAsMEJBQTBCO2tCQTFCdEMsU0FBUzsrQkFDRSxxQkFBcUIsaUJBR2hCLGlCQUFpQixDQUFDLElBQUksY0FDekIsSUFBSSxXQUNQO3dCQUNQLFlBQVk7d0JBQ1osc0JBQXNCO3dCQUN0Qix5QkFBeUI7d0JBQ3pCLGdDQUFnQzt3QkFDaEMsK0JBQStCO3dCQUMvQiwyQkFBMkI7d0JBQzNCLDhCQUE4Qjt3QkFDOUIsMkJBQTJCO3dCQUMzQix5QkFBeUI7d0JBQ3pCLFlBQVk7d0JBQ1osY0FBYzt3QkFDZCxjQUFjO3dCQUNkLGlCQUFpQjt3QkFDakIsWUFBWTt3QkFDWixtQkFBbUI7d0JBQ25CLGdCQUFnQjtxQkFDakIsYUFDVSxDQUFDLGtCQUFrQixDQUFDO3dEQU92QixjQUFjO3NCQURyQixTQUFTO3VCQUFDLGdDQUFnQyxFQUFFLEVBQUUsTUFBTSxFQUFFLElBQUksRUFBRTtnQkFlckQsbUJBQW1CO3NCQUQxQixZQUFZO3VCQUFDLGtCQUFrQixFQUFFLENBQUMsUUFBUSxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQVhCdXR0b25Nb2R1bGUgfSBmcm9tICdAYWNvcmV4L2NvbXBvbmVudHMvYnV0dG9uJztcbmltcG9ydCB7IEFYQnV0dG9uR3JvdXBNb2R1bGUgfSBmcm9tICdAYWNvcmV4L2NvbXBvbmVudHMvYnV0dG9uLWdyb3VwJztcbmltcG9ydCB7IEFYRGVjb3JhdG9yTW9kdWxlIH0gZnJvbSAnQGFjb3JleC9jb21wb25lbnRzL2RlY29yYXRvcnMnO1xuaW1wb3J0IHsgQVhEcmF3ZXJNb2R1bGUgfSBmcm9tICdAYWNvcmV4L2NvbXBvbmVudHMvZHJhd2VyJztcbmltcG9ydCB7IEFYRHJvcGRvd25Nb2R1bGUgfSBmcm9tICdAYWNvcmV4L2NvbXBvbmVudHMvZHJvcGRvd24nO1xuaW1wb3J0IHsgQVhNZW51TW9kdWxlIH0gZnJvbSAnQGFjb3JleC9jb21wb25lbnRzL21lbnUnO1xuaW1wb3J0IHsgQVhUYWJzTW9kdWxlIH0gZnJvbSAnQGFjb3JleC9jb21wb25lbnRzL3RhYnMnO1xuaW1wb3J0IHsgQVhQTGF5b3V0QnVpbGRlck1vZHVsZSwgQVhQV2lkZ2V0Q29uZmlnIH0gZnJvbSAnQGFjb3JleC9wbGF0Zm9ybS9sYXlvdXQvYnVpbGRlcic7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQ29tcG9uZW50LCBjb21wdXRlZCwgSG9zdEJpbmRpbmcsIEhvc3RMaXN0ZW5lciwgaW5qZWN0LCBWaWV3Q2hpbGQsIFZpZXdFbmNhcHN1bGF0aW9uIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBnZXQgfSBmcm9tICdsb2Rhc2gtZXMnO1xuaW1wb3J0IHsgQVhQRGVzaWduZXJCb2FyZENvbXBvbmVudCB9IGZyb20gJy4uL2JvYXJkL2JvYXJkLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBBWFBEZXNpZ25lckJyZWFkY3J1bWJzQ29tcG9uZW50IH0gZnJvbSAnLi4vYnJlYWRjcnVtYnMvYnJlYWRjcnVtYnMuY29tcG9uZW50JztcbmltcG9ydCB7IEFYUERlc2lnbmVyU2VydmljZSB9IGZyb20gJy4uL2Rlc2lnbmVyLnNlcnZpY2UnO1xuaW1wb3J0IHsgQVhQRGVzaWduZXJIZWFkZXJNZW51Q29tcG9uZW50IH0gZnJvbSAnLi4vaGVhZGVyLW1lbnUvaGVhZGVyLW1lbnUuY29tcG9uZW50JztcbmltcG9ydCB7IEFYUERlc2lnbmVyT3V0bGluZUNvbXBvbmVudCB9IGZyb20gJy4uL291dGxpbmUvb3V0bGluZS5jb21wb25lbnQnO1xuaW1wb3J0IHsgQVhQV2lkZ2V0UHJvcGVydHlWaWV3ZXJDb21wb25lbnQgfSBmcm9tICcuLi9wcm9wZXJ0eS12aWV3ZXIvd2lkZ2V0LXByb3BlcnR5LXZpZXdlci5jb21wb25lbnQnO1xuaW1wb3J0IHsgQVhQRGVzaWduZXJIaXN0b3J5Q29tcG9uZW50IH0gZnJvbSAnLi4vaGlzdG9yeS9oaXN0b3J5LmNvbXBvbmVudCc7XG5pbXBvcnQgeyBBWFBEZXNpZ25lclBhZ2VzQ29tcG9uZW50IH0gZnJvbSAnLi4vcGFnZXMvcGFnZXMuY29tcG9uZW50JztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYXhwLWxheW91dC1kZXNpZ25lcicsXG4gIHRlbXBsYXRlVXJsOiAnLi9kZXNpZ25lci5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2Rlc2lnbmVyLmNvbXBvbmVudC5zY3NzJ10sXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtcbiAgICBDb21tb25Nb2R1bGUsXG4gICAgQVhQTGF5b3V0QnVpbGRlck1vZHVsZSxcbiAgICBBWFBEZXNpZ25lckJvYXJkQ29tcG9uZW50LFxuICAgIEFYUFdpZGdldFByb3BlcnR5Vmlld2VyQ29tcG9uZW50LFxuICAgIEFYUERlc2lnbmVyQnJlYWRjcnVtYnNDb21wb25lbnQsXG4gICAgQVhQRGVzaWduZXJPdXRsaW5lQ29tcG9uZW50LFxuICAgIEFYUERlc2lnbmVySGVhZGVyTWVudUNvbXBvbmVudCxcbiAgICBBWFBEZXNpZ25lckhpc3RvcnlDb21wb25lbnQsXG4gICAgQVhQRGVzaWduZXJQYWdlc0NvbXBvbmVudCxcbiAgICBBWFRhYnNNb2R1bGUsXG4gICAgQVhCdXR0b25Nb2R1bGUsXG4gICAgQVhEcmF3ZXJNb2R1bGUsXG4gICAgQVhEZWNvcmF0b3JNb2R1bGUsXG4gICAgQVhNZW51TW9kdWxlLFxuICAgIEFYQnV0dG9uR3JvdXBNb2R1bGUsXG4gICAgQVhEcm9wZG93bk1vZHVsZSxcbiAgXSxcbiAgcHJvdmlkZXJzOiBbQVhQRGVzaWduZXJTZXJ2aWNlXSxcbn0pXG5leHBvcnQgY2xhc3MgQVhQTGF5b3V0RGVzaWduZXJDb21wb25lbnQge1xuXG4gIHByb3RlY3RlZCBzZXJ2aWNlID0gaW5qZWN0KEFYUERlc2lnbmVyU2VydmljZSk7XG5cbiAgQFZpZXdDaGlsZChBWFBXaWRnZXRQcm9wZXJ0eVZpZXdlckNvbXBvbmVudCwgeyBzdGF0aWM6IHRydWUgfSlcbiAgcHJpdmF0ZSBwcm9wZXJ0eVZpZXdlcjogQVhQV2lkZ2V0UHJvcGVydHlWaWV3ZXJDb21wb25lbnQ7XG5cbiAgcHJvdGVjdGVkIG5vZGVDb25maWcgPSBjb21wdXRlZDxBWFBXaWRnZXRDb25maWcgfCBudWxsPigoKSA9PlxuICAgIHRoaXMuc2VydmljZS5zZWxlY3RlZE5vZGUoKSA/IChnZXQodGhpcy5zZXJ2aWNlLnNlbGVjdGVkTm9kZSgpLCAnX19tZXRhX18uY29uZmlnJykgYXMgYW55IGFzIEFYUFdpZGdldENvbmZpZykgOiBudWxsXG4gICk7XG5cblxuICBjb25zdHJ1Y3RvcigpIHtcbiAgICB0aGlzLnNlcnZpY2Uub25VcGRhdGUuc3Vic2NyaWJlKChlKSA9PiB7XG4gICAgICB0aGlzLnByb3BlcnR5Vmlld2VyLnVwZGF0ZShlLnZhbHVlcyk7XG4gICAgfSlcbiAgfVxuXG4gIEBIb3N0TGlzdGVuZXIoJ2RvY3VtZW50OmtleWRvd24nLCBbJyRldmVudCddKVxuICBwcml2YXRlIGhhbmRsZUtleWJvYXJkRXZlbnQoZXZlbnQ6IEtleWJvYXJkRXZlbnQpIHtcbiAgICBpZiAoZXZlbnQuY3RybEtleSAmJiBldmVudC50YXJnZXQgPT0gZG9jdW1lbnQuYm9keSkge1xuXG4gICAgICBzd2l0Y2ggKGV2ZW50LmtleS50b0xvd2VyQ2FzZSgpKSB7IC8vIENvbnZlcnQgdGhlIGtleSB0byBsb3dlcmNhc2UgdG8gZW5zdXJlIGNhc2UgaW5zZW5zaXRpdml0eVxuICAgICAgICBjYXNlICd6JzpcbiAgICAgICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpOyAgLy8gUHJldmVudCB0aGUgYnJvd3NlcidzIGRlZmF1bHQgdW5kbyBhY3Rpb25cbiAgICAgICAgICB0aGlzLnNlcnZpY2UudW5kbygpO1xuICAgICAgICAgIGJyZWFrO1xuICAgICAgICBjYXNlICd5JzpcbiAgICAgICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpOyAgLy8gUHJldmVudCB0aGUgYnJvd3NlcidzIGRlZmF1bHQgcmVkbyBhY3Rpb25cbiAgICAgICAgICB0aGlzLnNlcnZpY2UucmVkbygpO1xuICAgICAgICAgIGJyZWFrO1xuICAgICAgICBjYXNlICdjJzpcbiAgICAgICAgICBpZiAodGhpcy5zZXJ2aWNlLmNhbkN1dENvcHkoKSkge1xuICAgICAgICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTsgIC8vIFByZXZlbnQgdGhlIGJyb3dzZXIncyBkZWZhdWx0IGNvcHkgYWN0aW9uXG4gICAgICAgICAgICB0aGlzLnNlcnZpY2UuY29weSgpO1xuICAgICAgICAgIH1cbiAgICAgICAgICBicmVhaztcbiAgICAgICAgY2FzZSAnZCc6XG4gICAgICAgICAgaWYgKHRoaXMuc2VydmljZS5jYW5DdXRDb3B5KCkpIHtcbiAgICAgICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7ICAvLyBQcmV2ZW50IHRoZSBicm93c2VyJ3MgZGVmYXVsdCBjb3B5IGFjdGlvblxuICAgICAgICAgICAgdGhpcy5zZXJ2aWNlLmNsb25lKCk7XG4gICAgICAgICAgfVxuICAgICAgICAgIGJyZWFrO1xuICAgICAgICBjYXNlICd4JzpcbiAgICAgICAgICBpZiAodGhpcy5zZXJ2aWNlLmNhbkN1dENvcHkoKSkge1xuICAgICAgICAgICAgZGVidWdnZXJcbiAgICAgICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7ICAvLyBQcmV2ZW50IHRoZSBicm93c2VyJ3MgZGVmYXVsdCBjdXQgYWN0aW9uXG4gICAgICAgICAgICB0aGlzLnNlcnZpY2UuY3V0KCk7XG4gICAgICAgICAgfVxuICAgICAgICAgIGJyZWFrO1xuICAgICAgICBjYXNlICd2JzpcbiAgICAgICAgICBpZiAodGhpcy5zZXJ2aWNlLmNhblBhc3RlKCkpIHtcbiAgICAgICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7ICAvLyBQcmV2ZW50IHRoZSBicm93c2VyJ3MgZGVmYXVsdCBwYXN0ZSBhY3Rpb25cbiAgICAgICAgICAgIHRoaXMuc2VydmljZS5wYXN0ZSgpO1xuICAgICAgICAgIH1cbiAgICAgICAgICBicmVhaztcbiAgICAgIH1cbiAgICB9XG4gIH1cblxufVxuIiwiPGF4LWRyYXdlci1jb250YWluZXIgY2xhc3M9XCJheC1oLWZ1bGwgYXgtdy1mdWxsIGF4LWZsZXggYXgtcmVsYXRpdmUgY2hpbGQ6YXgtaC1mdWxsIGF4LW92ZXJmbG93LWhpZGRlbiBheC1kYXJrXCI+XG4gIDxheC1jb250ZW50IGNsYXNzPVwiYXgtY29udGVudHNcIj5cbiAgICA8IS0tIFRvb2xiYXIgU2lkZSAtLT5cbiAgICA8ZGl2IGNsYXNzPVwiYXgtbWluLXctMTAgYXgtYmctc3VyZmFjZSBheC1ib3JkZXItZSBheC14cyBheC1mbGV4IGF4LWZsZXgtY29sIGF4LWl0ZW1zLWNlbnRlciBcIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJheC1taW4tdy0xMCBheC1oLTEwIGF4LWZsZXggYXgtaXRlbXMtY2VudGVyIGF4LWp1c3RpZnktY2VudGVyIGF4LWJvcmRlci1iXCI+XG4gICAgICAgIDxpbWcgc3JjPVwiYXNzZXRzL2xvZ29zL2xvZ28ucG5nXCIgY2xhc3M9XCJheC13LTZcIiAvPlxuICAgICAgPC9kaXY+XG4gICAgICA8ZGl2IGNsYXNzPVwiYXgtcHktMVwiPjwvZGl2PlxuICAgICAgPGRpdiBjbGFzcz1cImF4LWZsZXggYXgtZmxleC1jb2wgYXgtZ2FwLTJcIj5cbiAgICAgICAgPCEtLSA8YXgtYnV0dG9uIGNvbG9yPVwiZ2hvc3RcIiBsb29rPVwidHdvdG9uZVwiPlxuICAgICAgICAgIDxheC1pY29uIGNsYXNzPVwiZmEtc29saWQgZmEtcHV6emxlIGF4LXRleHQtc21cIj4gPC9heC1pY29uPlxuICAgICAgICA8L2F4LWJ1dHRvbj4gLS0+XG4gICAgICAgIDxheC1idXR0b24gY29sb3I9XCJnaG9zdFwiIGxvb2s9XCJ0d290b25lXCIgKG9uQ2xpY2spPVwicGFnZXMudG9nZ2xlKClcIiB0aXRsZT1cIlBhZ2VzXCI+XG4gICAgICAgICAgPGF4LWljb24gY2xhc3M9XCJmYS1zb2xpZCBmYS1wYWdlIGF4LXRleHQtc21cIj4gPC9heC1pY29uPlxuICAgICAgICA8L2F4LWJ1dHRvbj5cbiAgICAgICAgPGF4LWJ1dHRvbiBjb2xvcj1cImdob3N0XCIgbG9vaz1cInR3b3RvbmVcIiAob25DbGljayk9XCJkYXRhc291cmNlcy50b2dnbGUoKVwiIHRpdGxlPVwiRGF0YSBTb3VyY2VzXCI+XG4gICAgICAgICAgPGF4LWljb24gY2xhc3M9XCJmYS1zb2xpZCBmYS1kYXRhYmFzZSBheC10ZXh0LXNtXCI+IDwvYXgtaWNvbj5cbiAgICAgICAgPC9heC1idXR0b24+XG4gICAgICAgIDxheC1idXR0b24gY29sb3I9XCJnaG9zdFwiIGxvb2s9XCJ0d290b25lXCIgKG9uQ2xpY2spPVwib3V0bGluZS50b2dnbGUoKVwiIHRpdGxlPVwiT3V0bGluZVwiPlxuICAgICAgICAgIDxheC1pY29uIGNsYXNzPVwiZmEtc29saWQgZmEtbGlzdC10cmVlIGF4LXRleHQtc21cIj4gPC9heC1pY29uPlxuICAgICAgICA8L2F4LWJ1dHRvbj5cbiAgICAgICAgPGF4LWJ1dHRvbiBjb2xvcj1cImdob3N0XCIgbG9vaz1cInR3b3RvbmVcIiAob25DbGljayk9XCJoaXN0b3J5LnRvZ2dsZSgpXCIgdGl0bGU9XCJIaXN0b3J5XCI+XG4gICAgICAgICAgPGF4LWljb24gY2xhc3M9XCJmYS1zb2xpZCBmYS1jbG9jay1yb3RhdGUtbGVmdCBheC10ZXh0LXNtXCI+IDwvYXgtaWNvbj5cbiAgICAgICAgPC9heC1idXR0b24+XG4gICAgICAgIDwhLS0gPGF4LWJ1dHRvbiBjb2xvcj1cImdob3N0XCIgbG9vaz1cInR3b3RvbmVcIiB0aXRsZT1cIlRpbWVsaW5lXCI+XG4gICAgICAgICAgPGF4LWljb24gY2xhc3M9XCJmYS1zb2xpZCBmYS1kaWFncmFtLXNhbmtleSBheC10ZXh0LXNtXCI+IDwvYXgtaWNvbj5cbiAgICAgICAgPC9heC1idXR0b24+IC0tPlxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gICAgPCEtLSBNYWluIFNpZGUgLS0+XG4gICAgPGRpdiBjbGFzcz1cImF4LWNvbC1zcGFuLTEwIGF4LWZsZXggYXgtZmxleC1jb2wgYXgtZmxleC0xXCI+XG4gICAgICA8IS0tIEhlYWRlciBUb29sYmFyIC0tPlxuICAgICAgPGRpdiBjbGFzcz1cImF4LW1pbi1oLTEwIGF4LWJnLXN1cmZhY2UgYXgtYm9yZGVyLWIgIGF4LWZsZXggYXgtZmxleC1ncm93IGF4LWp1c3RpZnktYmV0d2VlbiBheC1weC0yXCI+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJheC1mbGV4IGF4LWl0ZW1zLWNlbnRlciBheC1qdXN0aWZ5LWNlbnRlciBheC10ZXh0LXdoaXRlXCI+XG4gICAgICAgICAgPGF4cC1kZXNpZ25lci1oZWFkZXItbWVudT48L2F4cC1kZXNpZ25lci1oZWFkZXItbWVudT5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJheC1mbGV4IGF4LWZsZXgtcm93IGF4LWdhcC0yIGF4LXhzIGF4LWl0ZW1zLWNlbnRlclwiPlxuICAgICAgICAgIDxheC1idXR0b24tZ3JvdXAgY29sb3I9XCJnaG9zdFwiIGxvb2s9XCJ0d290b25lXCIgW3NlbGVjdGlvbl09XCInc2luZ2xlJ1wiPlxuICAgICAgICAgICAgPGF4LWJ1dHRvbi1pdGVtIFtzZWxlY3RlZF09XCJzZXJ2aWNlLnNpemUoKSA9PSAneGwnXCIgW2RhdGFdPVwiJ3hsJ1wiIChvbkNsaWNrKT1cInNlcnZpY2Uuc2l6ZS5zZXQoJ3hsJylcIj5cbiAgICAgICAgICAgICAgPGF4LWljb24gY2xhc3M9XCJmYS1saWdodCBmYS1kZXNrdG9wXCI+PC9heC1pY29uPlxuICAgICAgICAgICAgPC9heC1idXR0b24taXRlbT5cbiAgICAgICAgICAgIDxheC1idXR0b24taXRlbSBbc2VsZWN0ZWRdPVwic2VydmljZS5zaXplKCkgPT0gJ2xnJ1wiIFtkYXRhXT1cIidsZydcIiAob25DbGljayk9XCJzZXJ2aWNlLnNpemUuc2V0KCdsZycpXCI+XG4gICAgICAgICAgICAgIDxheC1pY29uIGNsYXNzPVwiZmEtbGlnaHQgZmEtdGFibGV0XCI+PC9heC1pY29uPlxuICAgICAgICAgICAgPC9heC1idXR0b24taXRlbT5cbiAgICAgICAgICAgIDxheC1idXR0b24taXRlbSBbc2VsZWN0ZWRdPVwic2VydmljZS5zaXplKCkgPT0gJ3NtJ1wiIFtkYXRhXT1cIidzbSdcIiAob25DbGljayk9XCJzZXJ2aWNlLnNpemUuc2V0KCdzbScpXCI+XG4gICAgICAgICAgICAgIDxheC1pY29uIGNsYXNzPVwiZmEtbGlnaHQgZmEtbW9iaWxlXCI+PC9heC1pY29uPlxuICAgICAgICAgICAgPC9heC1idXR0b24taXRlbT5cbiAgICAgICAgICA8L2F4LWJ1dHRvbi1ncm91cD5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJheC1mbGV4IGF4LWZsZXgtcm93IGF4LWdhcC0yIGF4LXhzIGF4LWl0ZW1zLWNlbnRlclwiPlxuICAgICAgICAgIDxheC1idXR0b24gdGV4dD1cIkRlc2lnblwiIGxvb2s9XCJvdXRsaW5lXCIgY2xhc3M9XCJheC14c1wiPlxuICAgICAgICAgICAgPGF4LXN1ZmZpeD5cbiAgICAgICAgICAgICAgPGF4LWljb24gY2xhc3M9XCJmYS1saWdodCBmYS1jaGV2cm9uLWRvd25cIj48L2F4LWljb24+XG4gICAgICAgICAgICA8L2F4LXN1ZmZpeD5cbiAgICAgICAgICAgIDxheC1kcm9wZG93bi1wYW5lbD5cbiAgICAgICAgICAgICAgPGF4LWJ1dHRvbi1pdGVtLWxpc3Q+XG4gICAgICAgICAgICAgICAgPGF4LWJ1dHRvbi1pdGVtIHRleHQ9XCJQcmludFwiIG5hbWU9XCJwcmludFwiPiA8L2F4LWJ1dHRvbi1pdGVtPlxuICAgICAgICAgICAgICAgIDxheC1idXR0b24taXRlbSB0ZXh0PVwiVmlld1wiIG5hbWU9XCJ2aWV3XCI+IDwvYXgtYnV0dG9uLWl0ZW0+XG4gICAgICAgICAgICAgIDwvYXgtYnV0dG9uLWl0ZW0tbGlzdD5cbiAgICAgICAgICAgIDwvYXgtZHJvcGRvd24tcGFuZWw+XG4gICAgICAgICAgPC9heC1idXR0b24+XG4gICAgICAgICAgPGF4LWJ1dHRvbiBjb2xvcj1cInN1Y2Nlc3NcIiBsb29rPVwib3V0bGluZVwiIHRleHQ9XCJQcmV2aWV3XCIgY2xhc3M9XCJheC14c1wiIChvbkNsaWNrKT1cInNlcnZpY2Uub3BlblByZXZpZXcoKVwiPlxuICAgICAgICAgICAgPGF4LXN1ZmZpeD5cbiAgICAgICAgICAgICAgPGF4LWljb24gY2xhc3M9XCJmYS1zb2xpZCBmYS1wbGF5XCI+PC9heC1pY29uPlxuICAgICAgICAgICAgPC9heC1zdWZmaXg+XG4gICAgICAgICAgPC9heC1idXR0b24+XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9kaXY+XG4gICAgICA8IS0tIEJvYXJkIC0tPlxuICAgICAgPGRpdiBjbGFzcz1cImF4LWgtZnVsbCBcIj5cbiAgICAgICAgPGF4LWRyYXdlci1jb250YWluZXIgY2xhc3M9XCJheC13LWZ1bGwgYXgtaC1mdWxsXCI+XG4gICAgICAgICAgPCEtLSBQYWdlcyAtLT5cbiAgICAgICAgICA8YXgtZHJhd2VyICNwYWdlcyBsb2NhdGlvbj1cInN0YXJ0XCIgbW9kZT1cInB1c2hcIj5cbiAgICAgICAgICAgIDxheC1jb250ZW50PlxuICAgICAgICAgICAgICA8YXhwLWRlc2lnbmVyLXBhZ2VzPjwvYXhwLWRlc2lnbmVyLXBhZ2VzPlxuICAgICAgICAgICAgPC9heC1jb250ZW50PlxuICAgICAgICAgIDwvYXgtZHJhd2VyPlxuICAgICAgICAgIDwhLS0gRGF0YXNvdXJjZXMgLS0+XG4gICAgICAgICAgPGF4LWRyYXdlciAjZGF0YXNvdXJjZXMgbG9jYXRpb249XCJzdGFydFwiIG1vZGU9XCJwdXNoXCI+XG4gICAgICAgICAgICA8YXgtY29udGVudD5cbiAgICAgICAgICAgICAgRGF0YXNvdXJjZXNcbiAgICAgICAgICAgIDwvYXgtY29udGVudD5cbiAgICAgICAgICA8L2F4LWRyYXdlcj5cbiAgICAgICAgICA8IS0tIE91dGxpbmUgUG5hZWwgLS0+XG4gICAgICAgICAgPGF4LWRyYXdlciAjb3V0bGluZSBsb2NhdGlvbj1cInN0YXJ0XCIgbW9kZT1cInB1c2hcIj5cbiAgICAgICAgICAgIDxheC1jb250ZW50PlxuICAgICAgICAgICAgICA8YXhwLWRlc2lnbmVyLW91dGxpbmU+PC9heHAtZGVzaWduZXItb3V0bGluZT5cbiAgICAgICAgICAgIDwvYXgtY29udGVudD5cbiAgICAgICAgICA8L2F4LWRyYXdlcj5cbiAgICAgICAgICA8IS0tIEhpc3RvcnkgUG5hZWwgLS0+XG4gICAgICAgICAgPGF4LWRyYXdlciAjaGlzdG9yeSBsb2NhdGlvbj1cInN0YXJ0XCIgbW9kZT1cInB1c2hcIj5cbiAgICAgICAgICAgIDxheC1jb250ZW50PlxuICAgICAgICAgICAgICA8YXhwLWRlc2lnbmVyLWhpc3Rvcnk+PC9heHAtZGVzaWduZXItaGlzdG9yeT5cbiAgICAgICAgICAgIDwvYXgtY29udGVudD5cbiAgICAgICAgICA8L2F4LWRyYXdlcj5cbiAgICAgICAgICA8IS0tIENvbnRlbnQgb2YgYm9hcmQgLS0+XG4gICAgICAgICAgPGF4LWNvbnRlbnQgY2xhc3M9XCJheC1saWdodFwiPlxuICAgICAgICAgICAgPGF4cC1kZXNpZ25lci1ib2FyZCBjbGFzcz1cImF4LWgtZnVsbCBheC1iZy1vbi1zdXJmYWNlIGF4LWZsZXggYXgtanVzdGlmeS1jZW50ZXJcIj4gPC9heHAtZGVzaWduZXItYm9hcmQ+XG4gICAgICAgICAgPC9heC1jb250ZW50PlxuICAgICAgICA8L2F4LWRyYXdlci1jb250YWluZXI+XG4gICAgICA8L2Rpdj5cbiAgICAgIDwhLS0gRm9vdGVyIC0tPlxuICAgICAgPGRpdiBjbGFzcz1cImF4LW1pbi1oLTEwIGF4LWJnLXN1cmZhY2UgYXgtYm9yZGVyLXQgIGF4LWZsZXggYXgtaXRlbXMtY2VudGVyXCI+XG4gICAgICAgIDxheHAtZGVzaWduZXItYnJlYWRjcnVtYnMgY2xhc3M9XCJheC1ib3JkZXItZGVmYXVsdCBheC1ib3JkZXItdCBheC1wLTIgYXgtZm9udC1ub3JtYWxcIj5cbiAgICAgICAgPC9heHAtZGVzaWduZXItYnJlYWRjcnVtYnM+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbiAgPC9heC1jb250ZW50PlxuICA8IS0tIFByb3BlcnR5IFNpZGUgLS0+XG4gIDxheC1kcmF3ZXIgY2xhc3M9XCJheC13LTgwIGF4LWJvcmRlci1zXCIgbG9jYXRpb249XCJlbmRcIiBtb2RlPVwicHVzaFwiIFtjb2xsYXBzZWRdPVwiZmFsc2VcIiAjcGQ+XG4gICAgPGF4LWNvbnRlbnQ+XG4gICAgICA8ZGl2IGNsYXNzPVwiYXgtZmxleCBheC1mbGV4LXJvdyBheC13LWZ1bGwgYXgtanVzdGlmeS1iZXR3ZWVuIGF4LXRleHQtd2hpdGUgYXgtcHktMiBheC1weC00IGF4LWJvcmRlci1iXCI+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJheC1mbGV4IGF4LWZsZXgtcm93IGF4LWdhcC0yIGF4LWl0ZW1zLWNlbnRlclwiPlxuICAgICAgICAgIDxpIFtuZ0NsYXNzXT1cIm5vZGVDb25maWcoKT8uaWNvblwiPjwvaT5cbiAgICAgICAgICA8c3BhbiBjbGFzcz1cImF4LWZvbnQtc2VtaWJvbGRcIj57eyBub2RlQ29uZmlnKCk/LnRpdGxlIH19PC9zcGFuPlxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvZGl2PlxuICAgICAgPGF4cC13aWRnZXQtcHJvcGVydHktdmlld2VyIFt3aWRnZXRdPVwic2VydmljZS5zZWxlY3RlZE5vZGUoKSFcIlxuICAgICAgICAob25DaGFuZ2VkKT1cInNlcnZpY2UudXBkYXRlKHsgdmFsdWVzOiAkZXZlbnQudmFsdWVzLCBtb2RlOiAkZXZlbnQubW9kZSB9KVwiIGNsYXNzPVwiYXgtdy0xLzRcIj5cbiAgICAgIDwvYXhwLXdpZGdldC1wcm9wZXJ0eS12aWV3ZXI+XG4gICAgPC9heC1jb250ZW50PlxuICA8L2F4LWRyYXdlcj5cbjwvYXgtZHJhd2VyLWNvbnRhaW5lcj4iXX0=