@acorex/platform 19.3.0-next.5 → 19.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (67) hide show
  1. package/common/lib/app/index.d.ts +0 -1
  2. package/common/lib/common.module.d.ts +1 -1
  3. package/common/lib/configs/app.config.d.ts +12 -3
  4. package/common/lib/home-page/home-page.service.d.ts +6 -0
  5. package/common/lib/layout/logo/logo.component.d.ts +4 -0
  6. package/common/lib/settings/settings.service.d.ts +4 -1
  7. package/common/lib/utils/regional-util.service.d.ts +2 -2
  8. package/common/lib/utils/regional.types.d.ts +6 -16
  9. package/core/lib/index.d.ts +1 -0
  10. package/{common/lib/app → core/lib/startup}/app-startup.service.d.ts +1 -5
  11. package/core/lib/startup/app-startup.types.d.ts +6 -0
  12. package/core/lib/startup/index.d.ts +2 -0
  13. package/core/lib/types/logo.types.d.ts +5 -9
  14. package/fesm2022/acorex-platform-auth.mjs +5 -1
  15. package/fesm2022/acorex-platform-auth.mjs.map +1 -1
  16. package/fesm2022/acorex-platform-common.mjs +130 -85
  17. package/fesm2022/acorex-platform-common.mjs.map +1 -1
  18. package/fesm2022/acorex-platform-core.mjs +42 -13
  19. package/fesm2022/acorex-platform-core.mjs.map +1 -1
  20. package/fesm2022/acorex-platform-layout-builder.mjs +17 -0
  21. package/fesm2022/acorex-platform-layout-builder.mjs.map +1 -1
  22. package/fesm2022/acorex-platform-layout-designer.mjs +2 -2
  23. package/fesm2022/acorex-platform-layout-designer.mjs.map +1 -1
  24. package/fesm2022/acorex-platform-layout-entity.mjs +44 -20
  25. package/fesm2022/acorex-platform-layout-entity.mjs.map +1 -1
  26. package/fesm2022/acorex-platform-layout-search.mjs +4 -3
  27. package/fesm2022/acorex-platform-layout-search.mjs.map +1 -1
  28. package/fesm2022/acorex-platform-layout-setting.mjs +5 -4
  29. package/fesm2022/acorex-platform-layout-setting.mjs.map +1 -1
  30. package/fesm2022/{acorex-platform-themes-default-entity-master-list-view.component-CuyWAi6X.mjs → acorex-platform-themes-default-entity-master-list-view.component-Ol8haGqF.mjs} +5 -4
  31. package/fesm2022/acorex-platform-themes-default-entity-master-list-view.component-Ol8haGqF.mjs.map +1 -0
  32. package/fesm2022/acorex-platform-themes-default.mjs +18 -20
  33. package/fesm2022/acorex-platform-themes-default.mjs.map +1 -1
  34. package/fesm2022/acorex-platform-themes-shared.mjs +22 -18
  35. package/fesm2022/acorex-platform-themes-shared.mjs.map +1 -1
  36. package/fesm2022/acorex-platform-widgets.mjs +770 -123
  37. package/fesm2022/acorex-platform-widgets.mjs.map +1 -1
  38. package/layout/builder/lib/builder/context-store.service.d.ts +2 -1
  39. package/layout/builder/lib/builder/widget-base.component.d.ts +1 -0
  40. package/layout/builder/lib/builder/widget-container.component.d.ts +1 -0
  41. package/layout/builder/lib/builder/widget-map.d.ts +1 -0
  42. package/layout/builder/lib/builder/widget-renderer.directive.d.ts +1 -0
  43. package/layout/entity/lib/entity-master-single.viewmodel.d.ts +1 -0
  44. package/layout/entity/lib/entity.module.d.ts +1 -1
  45. package/layout/entity/lib/widgets/lookup-widget/lookup-widget-column.component.d.ts +1 -1
  46. package/layout/entity/lib/widgets/lookup-widget/lookup-widget-edit.component.d.ts +1 -0
  47. package/layout/entity/lib/widgets/lookup-widget/lookup-widget.config.d.ts +0 -5
  48. package/layout/search/lib/search.module.d.ts +1 -1
  49. package/layout/setting/lib/settings.module.d.ts +1 -1
  50. package/package.json +4 -2
  51. package/themes/default/lib/layouts/root-layout/components/header/header.component.d.ts +12 -3
  52. package/themes/default/lib/layouts/root-layout/horizontal/horizontal-layout.component.d.ts +12 -6
  53. package/themes/default/lib/layouts/root-layout/root-layout.component.d.ts +2 -1
  54. package/themes/default/lib/layouts/root-layout/vertical/vertical-layout.component.d.ts +14 -5
  55. package/themes/shared/lib/shared.module.d.ts +1 -1
  56. package/widgets/lib/widgets/charts/bar-chart/bar-chart-widget.component.d.ts +31 -0
  57. package/widgets/lib/widgets/charts/gauge-chart/gauge-chart-widget.component.d.ts +18 -12
  58. package/widgets/lib/widgets/charts/index.d.ts +11 -0
  59. package/widgets/lib/widgets/charts/line-chart/index.d.ts +3 -0
  60. package/widgets/lib/widgets/charts/line-chart/line-chart-widget.component.d.ts +76 -0
  61. package/widgets/lib/widgets/charts/line-chart/line-chart-widget.config.d.ts +7 -0
  62. package/widgets/lib/widgets/charts/line-chart/line-chart.type.d.ts +41 -0
  63. package/widgets/lib/widgets/charts/shared/index.d.ts +3 -0
  64. package/widgets/lib/widgets/charts/weather/index.d.ts +0 -1
  65. package/widgets/lib/widgets/index.d.ts +3 -1
  66. package/fesm2022/acorex-platform-themes-default-entity-master-list-view.component-CuyWAi6X.mjs.map +0 -1
  67. package/widgets/lib/widgets/charts/weather/weather.module.d.ts +0 -11
@@ -2224,7 +2224,7 @@ class AXPLayoutDesignerComponent {
2224
2224
  return styles;
2225
2225
  }
2226
2226
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXPLayoutDesignerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2227
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.0.3", type: AXPLayoutDesignerComponent, isStandalone: true, selector: "axp-layout-designer", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, strategy: { classPropertyName: "strategy", publicName: "strategy", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style": "this.__styles" } }, 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 ax-overflow-hidden\">\n <ax-content class=\"ax-contents\">\n <!-- Toolbar Side -->\n <div class=\"ax-min-w-10 ax-bg-lightest ax-border-e ax-sm ax-flex ax-flex-col ax-items-center ax-dark\">\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 look=\"blank\">\n <ax-icon class=\"fa-solid fa-puzzle ax-text-sm\"> </ax-icon>\n </ax-button> -->\n <ax-button look=\"blank\" (onClick)=\"pages.toggle()\" title=\"Pages\">\n <ax-icon class=\"fa-solid fa-page ax-text-sm\"> </ax-icon>\n </ax-button>\n <ax-button look=\"blank\" (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 look=\"blank\" (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 look=\"blank\" (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 look=\"blank\" 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-h-10 ax-bg-lightest ax-border-b ax-flex ax-justify-between ax-px-2 ax-dark\">\n <div class=\"ax-flex ax-flex-1 ax-items-center ax-text-white ax-justify-start\">\n <axp-designer-header-menu></axp-designer-header-menu>\n </div>\n <div class=\"ax-flex ax-flex-1 ax-flex-row ax-gap-2 ax-sm ax-items-center ax-justify-center\">\n <axp-designer-view-sizes [(size)]=\"service.size\"></axp-designer-view-sizes>\n </div>\n <div class=\"ax-flex ax-flex-1 ax-flex-row ax-gap-2 ax-sm ax-items-center ax-justify-end\">\n <ax-dropdown-button mode=\"split\" look=\"solid\" text=\"Preview\" class=\"ax-sm\"\n (onClick)=\"service.openPreviewDialog()\">\n <ax-button-item-list>\n <ax-button-item text=\"Open in new window\" (onClick)=\"service.openPreviewWindow()\">\n <ax-prefix>\n <ax-icon icon=\"fa-regular fa-window-restore\"></ax-icon>\n </ax-prefix>\n </ax-button-item>\n </ax-button-item-list>\n </ax-dropdown-button>\n </div>\n </div>\n <!-- Board -->\n <ax-drawer-container class=\"ax-w-full ax-flex-1\">\n <!-- Pages -->\n <ax-drawer #pages location=\"start\" mode=\"push\" class=\"ax-dark ax-bg-lightest\">\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\" class=\"ax-dark ax-bg-lightest\">\n <ax-content>\n <axp-designer-data-sources></axp-designer-data-sources>\n </ax-content>\n </ax-drawer>\n <!-- Outline Pnael -->\n <ax-drawer #outline location=\"start\" mode=\"push\" class=\"ax-dark ax-bg-lightest\">\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\" class=\"ax-dark ax-bg-lightest\">\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 ax-bg-lighter ax-flex ax-justify-center ax-p-10\">\n <axp-designer-board class=\"ax-rounded-lg ax-bg-lightest ax-shadow-md\"> </axp-designer-board>\n </ax-content>\n </ax-drawer-container>\n <!-- Footer -->\n <div class=\"ax-h-10 ax-bg-lightest ax-border-t ax-flex ax-items-center ax-dark\">\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-dark axp-designer-prop-side\" 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-px-4 ax-border-b ax-h-10\">\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()!\" style=\"--ax-sys-size-base: 1.875rem;\"\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-layout-designer .axp-designer-board{background-color:#fff;background-image:linear-gradient(45deg,#f0f0f0 25%,transparent 25%,transparent 75%,#f0f0f0 75%,#f0f0f0),linear-gradient(45deg,#f0f0f0 25%,#fff 25%,#fff 75%,#f0f0f0 75%,#f0f0f0);background-size:20px 20px;background-position:0 0,10px 10px;display:block;height:100%;width:100%;overflow:auto;--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-surface),var(--tw-bg-opacity, 1));padding:.75rem}axp-layout-designer .axp-designer-board ax-drawer{--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-lightest-surface),var(--tw-bg-opacity, 1))}axp-layout-designer .axp-designer-board.axp-state-design .ax-widget-outline{outline-style:dashed;outline-width:1px;outline-offset:2px;outline-color:#d1d5db}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host{cursor:pointer;position:relative}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-selected{outline-style:solid;outline-width:2px;outline-offset:1px;outline-color:rgba(var(--ax-sys-color-lightest-surface),1);outline-color:#60a5fa}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-selected.ax-widget-container{outline-offset:2px}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover{outline-style:dashed;outline-width:2px;outline-offset:2px;outline-color:#d946ef}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover.axp-state-selected{outline-color:#60a5fa}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover.ax-widget-container{outline-offset:4px}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host .axp-widget-overlay{position:absolute;left:0;top:0;right:0;bottom:0;z-index:2000;height:100%;width:100%}axp-layout-designer .axp-designer-board .axp-empty-space{display:flex;flex:1 1 0%;cursor:default;align-items:center;justify-content:center;background-color:rgba(var(--ax-sys-color-primary-300),10%);background-image:linear-gradient(135deg,rgba(var(--ax-sys-color-primary-300),50%) 10%,transparent 0,transparent 50%,rgba(var(--ax-sys-color-primary-300),50%) 0,rgba(var(--ax-sys-color-primary-300),50%) 60%,transparent 0,transparent);background-size:7.5px 7.5px;height:100%}axp-layout-designer .axp-designer-board .axp-page-widget-header,axp-layout-designer .axp-designer-board .axp-page-widget-footer{filter:grayscale(100%);opacity:.5}axp-layout-designer .axp-designer-board .axp-page-widget-header:hover,axp-layout-designer .axp-designer-board .axp-page-widget-footer:hover{filter:grayscale(0);opacity:1}axp-layout-designer .axp-designer-board .axp-page-widget-header{margin-bottom:.5rem}axp-layout-designer .axp-designer-board .axp-page-widget-footer{margin-top:.5rem}axp-layout-designer .axp-designer-prop-side{width:20rem;border-inline-start-width:1px;--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-lightest-surface),var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-on-lightest-surface),var(--tw-text-opacity, 1))}axp-designer-drawer-content ul.axp-designer-drawer-list>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}axp-designer-drawer-content ul.axp-designer-drawer-list{padding:.25rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}axp-designer-drawer-content ul.axp-designer-drawer-list li{cursor:pointer;border-radius:.125rem;padding:.25rem .5rem;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1);animation-duration:.15s;animation-timing-function:cubic-bezier(.4,0,.2,1)}axp-designer-drawer-content ul.axp-designer-drawer-list li:hover:not(.axp-designer-drawer-list){--tw-bg-opacity: 1;background-color:rgb(55 65 81 / var(--tw-bg-opacity, 1))}axp-designer-drawer-content ul.axp-designer-drawer-list li.ax-state-selected{--tw-bg-opacity: 1;background-color:rgb(64 64 64 / var(--tw-bg-opacity, 1))}axp-designer-drawer-content .axp-designer-drawer-empty{display:flex;align-items:center;justify-content:center;padding:1rem;--tw-text-opacity: 1;color:rgb(209 213 219 / var(--tw-text-opacity, 1))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.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", "mode"], 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: AXPDesignerDataSourcesComponent, selector: "axp-designer-data-sources" }, { kind: "component", type: AXPDesignerPagesComponent, selector: "axp-designer-pages" }, { kind: "component", type: AXPDesignerViewSizeToolbarComponent, selector: "axp-designer-view-sizes", inputs: ["size"], outputs: ["sizeChange"] }, { 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", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "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$1.AXDrawerComponent, selector: "ax-drawer", inputs: ["location", "showBackdrop", "mode", "closeOthers", "collapsed"], outputs: ["locationChange", "modeChange", "collapsedChange"] }, { kind: "component", type: i3$1.AXDrawerContainerComponent, selector: "ax-drawer-container" }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXMenuModule }, { kind: "ngmodule", type: AXButtonGroupModule }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "component", type: i5.AXDropdownButtonComponent, selector: "ax-dropdown-button", inputs: ["disabled", "size", "color", "look", "text", "type", "mode"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "lookChange", "colorChange", "disabledChange"] }], encapsulation: i0.ViewEncapsulation.None }); }
2227
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.0.3", type: AXPLayoutDesignerComponent, isStandalone: true, selector: "axp-layout-designer", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, strategy: { classPropertyName: "strategy", publicName: "strategy", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style": "this.__styles" } }, 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 ax-overflow-hidden\">\n <ax-content class=\"ax-contents\">\n <!-- Toolbar Side -->\n <div class=\"ax-min-w-10 ax-bg-lightest ax-border-e ax-sm ax-flex ax-flex-col ax-items-center ax-dark\">\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-light.svg\" 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 look=\"blank\">\n <ax-icon class=\"fa-solid fa-puzzle ax-text-sm\"> </ax-icon>\n </ax-button> -->\n <ax-button look=\"blank\" (onClick)=\"pages.toggle()\" title=\"Pages\">\n <ax-icon class=\"fa-solid fa-page ax-text-sm\"> </ax-icon>\n </ax-button>\n <ax-button look=\"blank\" (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 look=\"blank\" (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 look=\"blank\" (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 look=\"blank\" 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-h-10 ax-bg-lightest ax-border-b ax-flex ax-justify-between ax-px-2 ax-dark\">\n <div class=\"ax-flex ax-flex-1 ax-items-center ax-text-white ax-justify-start\">\n <axp-designer-header-menu></axp-designer-header-menu>\n </div>\n <div class=\"ax-flex ax-flex-1 ax-flex-row ax-gap-2 ax-sm ax-items-center ax-justify-center\">\n <axp-designer-view-sizes [(size)]=\"service.size\"></axp-designer-view-sizes>\n </div>\n <div class=\"ax-flex ax-flex-1 ax-flex-row ax-gap-2 ax-sm ax-items-center ax-justify-end\">\n <ax-dropdown-button\n mode=\"split\"\n look=\"solid\"\n text=\"Preview\"\n class=\"ax-sm\"\n (onClick)=\"service.openPreviewDialog()\"\n >\n <ax-button-item-list>\n <ax-button-item text=\"Open in new window\" (onClick)=\"service.openPreviewWindow()\">\n <ax-prefix>\n <ax-icon icon=\"fa-regular fa-window-restore\"></ax-icon>\n </ax-prefix>\n </ax-button-item>\n </ax-button-item-list>\n </ax-dropdown-button>\n </div>\n </div>\n <!-- Board -->\n <ax-drawer-container class=\"ax-w-full ax-flex-1\">\n <!-- Pages -->\n <ax-drawer #pages location=\"start\" mode=\"push\" class=\"ax-dark ax-bg-lightest\">\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\" class=\"ax-dark ax-bg-lightest\">\n <ax-content>\n <axp-designer-data-sources></axp-designer-data-sources>\n </ax-content>\n </ax-drawer>\n <!-- Outline Pnael -->\n <ax-drawer #outline location=\"start\" mode=\"push\" class=\"ax-dark ax-bg-lightest\">\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\" class=\"ax-dark ax-bg-lightest\">\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 ax-bg-lighter ax-flex ax-justify-center ax-p-10\">\n <axp-designer-board class=\"ax-rounded-lg ax-bg-lightest ax-shadow-md\"> </axp-designer-board>\n </ax-content>\n </ax-drawer-container>\n <!-- Footer -->\n <div class=\"ax-h-10 ax-bg-lightest ax-border-t ax-flex ax-items-center ax-dark\">\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-dark axp-designer-prop-side\" 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-px-4 ax-border-b ax-h-10\">\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\n [widget]=\"service.selectedNode()!\"\n style=\"--ax-sys-size-base: 1.875rem\"\n (onChanged)=\"service.update({ values: $event.values, mode: $event.mode })\"\n class=\"ax-w-1/4\"\n >\n </axp-widget-property-viewer>\n </ax-content>\n </ax-drawer>\n</ax-drawer-container>\n", styles: ["axp-layout-designer .axp-designer-board{background-color:#fff;background-image:linear-gradient(45deg,#f0f0f0 25%,transparent 25%,transparent 75%,#f0f0f0 75%,#f0f0f0),linear-gradient(45deg,#f0f0f0 25%,#fff 25%,#fff 75%,#f0f0f0 75%,#f0f0f0);background-size:20px 20px;background-position:0 0,10px 10px;display:block;height:100%;width:100%;overflow:auto;--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-surface),var(--tw-bg-opacity, 1));padding:.75rem}axp-layout-designer .axp-designer-board ax-drawer{--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-lightest-surface),var(--tw-bg-opacity, 1))}axp-layout-designer .axp-designer-board.axp-state-design .ax-widget-outline{outline-style:dashed;outline-width:1px;outline-offset:2px;outline-color:#d1d5db}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host{cursor:pointer;position:relative}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-selected{outline-style:solid;outline-width:2px;outline-offset:1px;outline-color:rgba(var(--ax-sys-color-lightest-surface),1);outline-color:#60a5fa}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-selected.ax-widget-container{outline-offset:2px}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover{outline-style:dashed;outline-width:2px;outline-offset:2px;outline-color:#d946ef}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover.axp-state-selected{outline-color:#60a5fa}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover.ax-widget-container{outline-offset:4px}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host .axp-widget-overlay{position:absolute;left:0;top:0;right:0;bottom:0;z-index:2000;height:100%;width:100%}axp-layout-designer .axp-designer-board .axp-empty-space{display:flex;flex:1 1 0%;cursor:default;align-items:center;justify-content:center;background-color:rgba(var(--ax-sys-color-primary-300),10%);background-image:linear-gradient(135deg,rgba(var(--ax-sys-color-primary-300),50%) 10%,transparent 0,transparent 50%,rgba(var(--ax-sys-color-primary-300),50%) 0,rgba(var(--ax-sys-color-primary-300),50%) 60%,transparent 0,transparent);background-size:7.5px 7.5px;height:100%}axp-layout-designer .axp-designer-board .axp-page-widget-header,axp-layout-designer .axp-designer-board .axp-page-widget-footer{filter:grayscale(100%);opacity:.5}axp-layout-designer .axp-designer-board .axp-page-widget-header:hover,axp-layout-designer .axp-designer-board .axp-page-widget-footer:hover{filter:grayscale(0);opacity:1}axp-layout-designer .axp-designer-board .axp-page-widget-header{margin-bottom:.5rem}axp-layout-designer .axp-designer-board .axp-page-widget-footer{margin-top:.5rem}axp-layout-designer .axp-designer-prop-side{width:20rem;border-inline-start-width:1px;--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-lightest-surface),var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-on-lightest-surface),var(--tw-text-opacity, 1))}axp-designer-drawer-content ul.axp-designer-drawer-list>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}axp-designer-drawer-content ul.axp-designer-drawer-list{padding:.25rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}axp-designer-drawer-content ul.axp-designer-drawer-list li{cursor:pointer;border-radius:.125rem;padding:.25rem .5rem;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1);animation-duration:.15s;animation-timing-function:cubic-bezier(.4,0,.2,1)}axp-designer-drawer-content ul.axp-designer-drawer-list li:hover:not(.axp-designer-drawer-list){--tw-bg-opacity: 1;background-color:rgb(55 65 81 / var(--tw-bg-opacity, 1))}axp-designer-drawer-content ul.axp-designer-drawer-list li.ax-state-selected{--tw-bg-opacity: 1;background-color:rgb(64 64 64 / var(--tw-bg-opacity, 1))}axp-designer-drawer-content .axp-designer-drawer-empty{display:flex;align-items:center;justify-content:center;padding:1rem;--tw-text-opacity: 1;color:rgb(209 213 219 / var(--tw-text-opacity, 1))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.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", "mode"], 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: AXPDesignerDataSourcesComponent, selector: "axp-designer-data-sources" }, { kind: "component", type: AXPDesignerPagesComponent, selector: "axp-designer-pages" }, { kind: "component", type: AXPDesignerViewSizeToolbarComponent, selector: "axp-designer-view-sizes", inputs: ["size"], outputs: ["sizeChange"] }, { 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", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "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$1.AXDrawerComponent, selector: "ax-drawer", inputs: ["location", "showBackdrop", "mode", "closeOthers", "collapsed"], outputs: ["locationChange", "modeChange", "collapsedChange"] }, { kind: "component", type: i3$1.AXDrawerContainerComponent, selector: "ax-drawer-container" }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXMenuModule }, { kind: "ngmodule", type: AXButtonGroupModule }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "component", type: i5.AXDropdownButtonComponent, selector: "ax-dropdown-button", inputs: ["disabled", "size", "color", "look", "text", "type", "mode"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "lookChange", "colorChange", "disabledChange"] }], encapsulation: i0.ViewEncapsulation.None }); }
2228
2228
  }
2229
2229
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXPLayoutDesignerComponent, decorators: [{
2230
2230
  type: Component,
@@ -2248,7 +2248,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
2248
2248
  AXButtonGroupModule,
2249
2249
  AXDropdownModule,
2250
2250
  AXDropdownButtonModule,
2251
- ], providers: [AXPDesignerService], template: "<ax-drawer-container class=\"ax-h-full ax-w-full ax-flex ax-relative ax-overflow-hidden\">\n <ax-content class=\"ax-contents\">\n <!-- Toolbar Side -->\n <div class=\"ax-min-w-10 ax-bg-lightest ax-border-e ax-sm ax-flex ax-flex-col ax-items-center ax-dark\">\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 look=\"blank\">\n <ax-icon class=\"fa-solid fa-puzzle ax-text-sm\"> </ax-icon>\n </ax-button> -->\n <ax-button look=\"blank\" (onClick)=\"pages.toggle()\" title=\"Pages\">\n <ax-icon class=\"fa-solid fa-page ax-text-sm\"> </ax-icon>\n </ax-button>\n <ax-button look=\"blank\" (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 look=\"blank\" (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 look=\"blank\" (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 look=\"blank\" 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-h-10 ax-bg-lightest ax-border-b ax-flex ax-justify-between ax-px-2 ax-dark\">\n <div class=\"ax-flex ax-flex-1 ax-items-center ax-text-white ax-justify-start\">\n <axp-designer-header-menu></axp-designer-header-menu>\n </div>\n <div class=\"ax-flex ax-flex-1 ax-flex-row ax-gap-2 ax-sm ax-items-center ax-justify-center\">\n <axp-designer-view-sizes [(size)]=\"service.size\"></axp-designer-view-sizes>\n </div>\n <div class=\"ax-flex ax-flex-1 ax-flex-row ax-gap-2 ax-sm ax-items-center ax-justify-end\">\n <ax-dropdown-button mode=\"split\" look=\"solid\" text=\"Preview\" class=\"ax-sm\"\n (onClick)=\"service.openPreviewDialog()\">\n <ax-button-item-list>\n <ax-button-item text=\"Open in new window\" (onClick)=\"service.openPreviewWindow()\">\n <ax-prefix>\n <ax-icon icon=\"fa-regular fa-window-restore\"></ax-icon>\n </ax-prefix>\n </ax-button-item>\n </ax-button-item-list>\n </ax-dropdown-button>\n </div>\n </div>\n <!-- Board -->\n <ax-drawer-container class=\"ax-w-full ax-flex-1\">\n <!-- Pages -->\n <ax-drawer #pages location=\"start\" mode=\"push\" class=\"ax-dark ax-bg-lightest\">\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\" class=\"ax-dark ax-bg-lightest\">\n <ax-content>\n <axp-designer-data-sources></axp-designer-data-sources>\n </ax-content>\n </ax-drawer>\n <!-- Outline Pnael -->\n <ax-drawer #outline location=\"start\" mode=\"push\" class=\"ax-dark ax-bg-lightest\">\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\" class=\"ax-dark ax-bg-lightest\">\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 ax-bg-lighter ax-flex ax-justify-center ax-p-10\">\n <axp-designer-board class=\"ax-rounded-lg ax-bg-lightest ax-shadow-md\"> </axp-designer-board>\n </ax-content>\n </ax-drawer-container>\n <!-- Footer -->\n <div class=\"ax-h-10 ax-bg-lightest ax-border-t ax-flex ax-items-center ax-dark\">\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-dark axp-designer-prop-side\" 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-px-4 ax-border-b ax-h-10\">\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()!\" style=\"--ax-sys-size-base: 1.875rem;\"\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-layout-designer .axp-designer-board{background-color:#fff;background-image:linear-gradient(45deg,#f0f0f0 25%,transparent 25%,transparent 75%,#f0f0f0 75%,#f0f0f0),linear-gradient(45deg,#f0f0f0 25%,#fff 25%,#fff 75%,#f0f0f0 75%,#f0f0f0);background-size:20px 20px;background-position:0 0,10px 10px;display:block;height:100%;width:100%;overflow:auto;--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-surface),var(--tw-bg-opacity, 1));padding:.75rem}axp-layout-designer .axp-designer-board ax-drawer{--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-lightest-surface),var(--tw-bg-opacity, 1))}axp-layout-designer .axp-designer-board.axp-state-design .ax-widget-outline{outline-style:dashed;outline-width:1px;outline-offset:2px;outline-color:#d1d5db}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host{cursor:pointer;position:relative}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-selected{outline-style:solid;outline-width:2px;outline-offset:1px;outline-color:rgba(var(--ax-sys-color-lightest-surface),1);outline-color:#60a5fa}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-selected.ax-widget-container{outline-offset:2px}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover{outline-style:dashed;outline-width:2px;outline-offset:2px;outline-color:#d946ef}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover.axp-state-selected{outline-color:#60a5fa}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover.ax-widget-container{outline-offset:4px}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host .axp-widget-overlay{position:absolute;left:0;top:0;right:0;bottom:0;z-index:2000;height:100%;width:100%}axp-layout-designer .axp-designer-board .axp-empty-space{display:flex;flex:1 1 0%;cursor:default;align-items:center;justify-content:center;background-color:rgba(var(--ax-sys-color-primary-300),10%);background-image:linear-gradient(135deg,rgba(var(--ax-sys-color-primary-300),50%) 10%,transparent 0,transparent 50%,rgba(var(--ax-sys-color-primary-300),50%) 0,rgba(var(--ax-sys-color-primary-300),50%) 60%,transparent 0,transparent);background-size:7.5px 7.5px;height:100%}axp-layout-designer .axp-designer-board .axp-page-widget-header,axp-layout-designer .axp-designer-board .axp-page-widget-footer{filter:grayscale(100%);opacity:.5}axp-layout-designer .axp-designer-board .axp-page-widget-header:hover,axp-layout-designer .axp-designer-board .axp-page-widget-footer:hover{filter:grayscale(0);opacity:1}axp-layout-designer .axp-designer-board .axp-page-widget-header{margin-bottom:.5rem}axp-layout-designer .axp-designer-board .axp-page-widget-footer{margin-top:.5rem}axp-layout-designer .axp-designer-prop-side{width:20rem;border-inline-start-width:1px;--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-lightest-surface),var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-on-lightest-surface),var(--tw-text-opacity, 1))}axp-designer-drawer-content ul.axp-designer-drawer-list>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}axp-designer-drawer-content ul.axp-designer-drawer-list{padding:.25rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}axp-designer-drawer-content ul.axp-designer-drawer-list li{cursor:pointer;border-radius:.125rem;padding:.25rem .5rem;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1);animation-duration:.15s;animation-timing-function:cubic-bezier(.4,0,.2,1)}axp-designer-drawer-content ul.axp-designer-drawer-list li:hover:not(.axp-designer-drawer-list){--tw-bg-opacity: 1;background-color:rgb(55 65 81 / var(--tw-bg-opacity, 1))}axp-designer-drawer-content ul.axp-designer-drawer-list li.ax-state-selected{--tw-bg-opacity: 1;background-color:rgb(64 64 64 / var(--tw-bg-opacity, 1))}axp-designer-drawer-content .axp-designer-drawer-empty{display:flex;align-items:center;justify-content:center;padding:1rem;--tw-text-opacity: 1;color:rgb(209 213 219 / var(--tw-text-opacity, 1))}\n"] }]
2251
+ ], providers: [AXPDesignerService], template: "<ax-drawer-container class=\"ax-h-full ax-w-full ax-flex ax-relative ax-overflow-hidden\">\n <ax-content class=\"ax-contents\">\n <!-- Toolbar Side -->\n <div class=\"ax-min-w-10 ax-bg-lightest ax-border-e ax-sm ax-flex ax-flex-col ax-items-center ax-dark\">\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-light.svg\" 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 look=\"blank\">\n <ax-icon class=\"fa-solid fa-puzzle ax-text-sm\"> </ax-icon>\n </ax-button> -->\n <ax-button look=\"blank\" (onClick)=\"pages.toggle()\" title=\"Pages\">\n <ax-icon class=\"fa-solid fa-page ax-text-sm\"> </ax-icon>\n </ax-button>\n <ax-button look=\"blank\" (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 look=\"blank\" (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 look=\"blank\" (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 look=\"blank\" 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-h-10 ax-bg-lightest ax-border-b ax-flex ax-justify-between ax-px-2 ax-dark\">\n <div class=\"ax-flex ax-flex-1 ax-items-center ax-text-white ax-justify-start\">\n <axp-designer-header-menu></axp-designer-header-menu>\n </div>\n <div class=\"ax-flex ax-flex-1 ax-flex-row ax-gap-2 ax-sm ax-items-center ax-justify-center\">\n <axp-designer-view-sizes [(size)]=\"service.size\"></axp-designer-view-sizes>\n </div>\n <div class=\"ax-flex ax-flex-1 ax-flex-row ax-gap-2 ax-sm ax-items-center ax-justify-end\">\n <ax-dropdown-button\n mode=\"split\"\n look=\"solid\"\n text=\"Preview\"\n class=\"ax-sm\"\n (onClick)=\"service.openPreviewDialog()\"\n >\n <ax-button-item-list>\n <ax-button-item text=\"Open in new window\" (onClick)=\"service.openPreviewWindow()\">\n <ax-prefix>\n <ax-icon icon=\"fa-regular fa-window-restore\"></ax-icon>\n </ax-prefix>\n </ax-button-item>\n </ax-button-item-list>\n </ax-dropdown-button>\n </div>\n </div>\n <!-- Board -->\n <ax-drawer-container class=\"ax-w-full ax-flex-1\">\n <!-- Pages -->\n <ax-drawer #pages location=\"start\" mode=\"push\" class=\"ax-dark ax-bg-lightest\">\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\" class=\"ax-dark ax-bg-lightest\">\n <ax-content>\n <axp-designer-data-sources></axp-designer-data-sources>\n </ax-content>\n </ax-drawer>\n <!-- Outline Pnael -->\n <ax-drawer #outline location=\"start\" mode=\"push\" class=\"ax-dark ax-bg-lightest\">\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\" class=\"ax-dark ax-bg-lightest\">\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 ax-bg-lighter ax-flex ax-justify-center ax-p-10\">\n <axp-designer-board class=\"ax-rounded-lg ax-bg-lightest ax-shadow-md\"> </axp-designer-board>\n </ax-content>\n </ax-drawer-container>\n <!-- Footer -->\n <div class=\"ax-h-10 ax-bg-lightest ax-border-t ax-flex ax-items-center ax-dark\">\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-dark axp-designer-prop-side\" 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-px-4 ax-border-b ax-h-10\">\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\n [widget]=\"service.selectedNode()!\"\n style=\"--ax-sys-size-base: 1.875rem\"\n (onChanged)=\"service.update({ values: $event.values, mode: $event.mode })\"\n class=\"ax-w-1/4\"\n >\n </axp-widget-property-viewer>\n </ax-content>\n </ax-drawer>\n</ax-drawer-container>\n", styles: ["axp-layout-designer .axp-designer-board{background-color:#fff;background-image:linear-gradient(45deg,#f0f0f0 25%,transparent 25%,transparent 75%,#f0f0f0 75%,#f0f0f0),linear-gradient(45deg,#f0f0f0 25%,#fff 25%,#fff 75%,#f0f0f0 75%,#f0f0f0);background-size:20px 20px;background-position:0 0,10px 10px;display:block;height:100%;width:100%;overflow:auto;--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-surface),var(--tw-bg-opacity, 1));padding:.75rem}axp-layout-designer .axp-designer-board ax-drawer{--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-lightest-surface),var(--tw-bg-opacity, 1))}axp-layout-designer .axp-designer-board.axp-state-design .ax-widget-outline{outline-style:dashed;outline-width:1px;outline-offset:2px;outline-color:#d1d5db}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host{cursor:pointer;position:relative}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-selected{outline-style:solid;outline-width:2px;outline-offset:1px;outline-color:rgba(var(--ax-sys-color-lightest-surface),1);outline-color:#60a5fa}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-selected.ax-widget-container{outline-offset:2px}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover{outline-style:dashed;outline-width:2px;outline-offset:2px;outline-color:#d946ef}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover.axp-state-selected{outline-color:#60a5fa}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host.axp-state-hover.ax-widget-container{outline-offset:4px}axp-layout-designer .axp-designer-board.axp-state-design .axp-widget-host .axp-widget-overlay{position:absolute;left:0;top:0;right:0;bottom:0;z-index:2000;height:100%;width:100%}axp-layout-designer .axp-designer-board .axp-empty-space{display:flex;flex:1 1 0%;cursor:default;align-items:center;justify-content:center;background-color:rgba(var(--ax-sys-color-primary-300),10%);background-image:linear-gradient(135deg,rgba(var(--ax-sys-color-primary-300),50%) 10%,transparent 0,transparent 50%,rgba(var(--ax-sys-color-primary-300),50%) 0,rgba(var(--ax-sys-color-primary-300),50%) 60%,transparent 0,transparent);background-size:7.5px 7.5px;height:100%}axp-layout-designer .axp-designer-board .axp-page-widget-header,axp-layout-designer .axp-designer-board .axp-page-widget-footer{filter:grayscale(100%);opacity:.5}axp-layout-designer .axp-designer-board .axp-page-widget-header:hover,axp-layout-designer .axp-designer-board .axp-page-widget-footer:hover{filter:grayscale(0);opacity:1}axp-layout-designer .axp-designer-board .axp-page-widget-header{margin-bottom:.5rem}axp-layout-designer .axp-designer-board .axp-page-widget-footer{margin-top:.5rem}axp-layout-designer .axp-designer-prop-side{width:20rem;border-inline-start-width:1px;--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-lightest-surface),var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-on-lightest-surface),var(--tw-text-opacity, 1))}axp-designer-drawer-content ul.axp-designer-drawer-list>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}axp-designer-drawer-content ul.axp-designer-drawer-list{padding:.25rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}axp-designer-drawer-content ul.axp-designer-drawer-list li{cursor:pointer;border-radius:.125rem;padding:.25rem .5rem;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1);animation-duration:.15s;animation-timing-function:cubic-bezier(.4,0,.2,1)}axp-designer-drawer-content ul.axp-designer-drawer-list li:hover:not(.axp-designer-drawer-list){--tw-bg-opacity: 1;background-color:rgb(55 65 81 / var(--tw-bg-opacity, 1))}axp-designer-drawer-content ul.axp-designer-drawer-list li.ax-state-selected{--tw-bg-opacity: 1;background-color:rgb(64 64 64 / var(--tw-bg-opacity, 1))}axp-designer-drawer-content .axp-designer-drawer-empty{display:flex;align-items:center;justify-content:center;padding:1rem;--tw-text-opacity: 1;color:rgb(209 213 219 / var(--tw-text-opacity, 1))}\n"] }]
2252
2252
  }], ctorParameters: () => [], propDecorators: { propertyViewer: [{
2253
2253
  type: ViewChild,
2254
2254
  args: [AXPWidgetPropertyViewerComponent, { static: true }]