@acorex/platform 20.2.4-next.1 → 20.2.4-next.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/common/index.d.ts +9 -1
- package/fesm2022/acorex-platform-common.mjs.map +1 -1
- package/fesm2022/acorex-platform-layout-builder.mjs +1 -0
- package/fesm2022/acorex-platform-layout-builder.mjs.map +1 -1
- package/fesm2022/acorex-platform-layout-components.mjs +26 -36
- package/fesm2022/acorex-platform-layout-components.mjs.map +1 -1
- package/fesm2022/acorex-platform-layout-entity.mjs +509 -230
- package/fesm2022/acorex-platform-layout-entity.mjs.map +1 -1
- package/fesm2022/acorex-platform-layout-views.mjs +106 -24
- package/fesm2022/acorex-platform-layout-views.mjs.map +1 -1
- package/fesm2022/{acorex-platform-themes-default-entity-master-list-view.component-DXGLsVis.mjs → acorex-platform-themes-default-entity-master-list-view.component-e3Lxk5ZT.mjs} +3 -3
- package/fesm2022/acorex-platform-themes-default-entity-master-list-view.component-e3Lxk5ZT.mjs.map +1 -0
- package/fesm2022/acorex-platform-themes-default.mjs +3 -3
- package/fesm2022/acorex-platform-themes-default.mjs.map +1 -1
- package/fesm2022/{acorex-platform-widgets-file-list-popup.component-B601gPsW.mjs → acorex-platform-widgets-file-list-popup.component-BafU5Lfl.mjs} +4 -2
- package/fesm2022/acorex-platform-widgets-file-list-popup.component-BafU5Lfl.mjs.map +1 -0
- package/fesm2022/acorex-platform-widgets.mjs +84 -14
- package/fesm2022/acorex-platform-widgets.mjs.map +1 -1
- package/layout/builder/index.d.ts +1 -0
- package/layout/components/index.d.ts +1 -5
- package/layout/entity/index.d.ts +2 -2
- package/layout/views/index.d.ts +34 -0
- package/package.json +5 -5
- package/widgets/index.d.ts +8 -0
- package/fesm2022/acorex-platform-themes-default-entity-master-list-view.component-DXGLsVis.mjs.map +0 -1
- package/fesm2022/acorex-platform-widgets-file-list-popup.component-B601gPsW.mjs.map +0 -1
|
@@ -27,7 +27,7 @@ import { moveItemInArray, CdkDropList, CdkDrag, CdkDragHandle, DragDropModule }
|
|
|
27
27
|
import * as i1 from '@angular/forms';
|
|
28
28
|
import { FormsModule } from '@angular/forms';
|
|
29
29
|
import { cloneDeep, sortBy, isEqual, camelCase, merge, capitalize, unionBy, isArray, isNil, isEmpty, set } from 'lodash-es';
|
|
30
|
-
import * as
|
|
30
|
+
import * as i2$1 from '@acorex/components/form';
|
|
31
31
|
import { AXFormModule, AXFormComponent } from '@acorex/components/form';
|
|
32
32
|
import * as i4$1 from '@acorex/components/text-box';
|
|
33
33
|
import { AXTextBoxModule } from '@acorex/components/text-box';
|
|
@@ -41,9 +41,9 @@ import { AXValidationModule } from '@acorex/core/validation';
|
|
|
41
41
|
import { AXPGridLayoutDirective, AXPFilterOperatorMiddlewareService, ALL_DEFAULT_OPERATORS } from '@acorex/platform/common';
|
|
42
42
|
import * as i5$2 from '@acorex/components/select-box';
|
|
43
43
|
import { AXSelectBoxModule } from '@acorex/components/select-box';
|
|
44
|
-
import * as i1$
|
|
44
|
+
import * as i1$1 from '@acorex/components/collapse';
|
|
45
45
|
import { AXCollapseModule } from '@acorex/components/collapse';
|
|
46
|
-
import * as i2$
|
|
46
|
+
import * as i2$2 from '@acorex/components/tabs';
|
|
47
47
|
import { AXTabsModule } from '@acorex/components/tabs';
|
|
48
48
|
import * as i7$1 from '@acorex/cdk/list-navigation';
|
|
49
49
|
import { AXListNavigationModule } from '@acorex/cdk/list-navigation';
|
|
@@ -55,7 +55,7 @@ import { AXTagBoxModule } from '@acorex/components/tag-box';
|
|
|
55
55
|
import { AXCalendarService } from '@acorex/core/date-time';
|
|
56
56
|
import { BehaviorSubject, timer, Subject, takeUntil } from 'rxjs';
|
|
57
57
|
import { tap } from 'rxjs/operators';
|
|
58
|
-
import * as i1$
|
|
58
|
+
import * as i1$2 from '@acorex/components/avatar';
|
|
59
59
|
import { AXAvatarModule } from '@acorex/components/avatar';
|
|
60
60
|
import * as i3$4 from '@acorex/components/image';
|
|
61
61
|
import { AXImageModule } from '@acorex/components/image';
|
|
@@ -1132,10 +1132,6 @@ class AXPDynamicFormComponent {
|
|
|
1132
1132
|
* Computed layout configuration
|
|
1133
1133
|
*/
|
|
1134
1134
|
this.computedLayout = computed(() => this.layoutConfig(), ...(ngDevMode ? [{ debugName: "computedLayout" }] : []));
|
|
1135
|
-
/**
|
|
1136
|
-
* Computed form definition
|
|
1137
|
-
*/
|
|
1138
|
-
this.computedFormDefinition = computed(() => this.formDefinition(), ...(ngDevMode ? [{ debugName: "computedFormDefinition" }] : []));
|
|
1139
1135
|
/**
|
|
1140
1136
|
* Host classes based on layout style
|
|
1141
1137
|
*/
|
|
@@ -1230,9 +1226,9 @@ class AXPDynamicFormComponent {
|
|
|
1230
1226
|
return false;
|
|
1231
1227
|
}
|
|
1232
1228
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPDynamicFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1233
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AXPDynamicFormComponent, isStandalone: true, selector: "axp-dynamic-form", inputs: { formDefinition: { classPropertyName: "formDefinition", publicName: "formDefinition", isSignal: true, isRequired: true, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: true, transformFunction: null }, layoutStyle: { classPropertyName: "layoutStyle", publicName: "layoutStyle", isSignal: true, isRequired: false, transformFunction: null }, layoutConfig: { classPropertyName: "layoutConfig", publicName: "layoutConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { contextChange: "contextChange", contextInitiated: "contextInitiated", validityChange: "validityChange" }, host: { properties: { "class": "hostClasses()" }, classAttribute: "axp-dynamic-form" }, viewQueries: [{ propertyName: "form", first: true, predicate: AXFormComponent, descendants: true, isSignal: true }, { propertyName: "container", first: true, predicate: AXPWidgetContainerComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ax-form>\n <axp-widgets-container [context]=\"internalContext()\" (onContextChanged)=\"handleContextChanged($event)\">\n <axp-layout-sections>\n
|
|
1229
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AXPDynamicFormComponent, isStandalone: true, selector: "axp-dynamic-form", inputs: { formDefinition: { classPropertyName: "formDefinition", publicName: "formDefinition", isSignal: true, isRequired: true, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: true, transformFunction: null }, layoutStyle: { classPropertyName: "layoutStyle", publicName: "layoutStyle", isSignal: true, isRequired: false, transformFunction: null }, layoutConfig: { classPropertyName: "layoutConfig", publicName: "layoutConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { contextChange: "contextChange", contextInitiated: "contextInitiated", validityChange: "validityChange" }, host: { properties: { "class": "hostClasses()" }, classAttribute: "axp-dynamic-form" }, viewQueries: [{ propertyName: "form", first: true, predicate: AXFormComponent, descendants: true, isSignal: true }, { propertyName: "container", first: true, predicate: AXPWidgetContainerComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ax-form>\n <axp-widgets-container [context]=\"internalContext()\" (onContextChanged)=\"handleContextChanged($event)\">\n <axp-layout-sections>\n @for (group of formDefinition().groups; track group.name) {\n <axp-layout-section>\n <axp-layout-header>\n <axp-layout-title>{{ group.title }}</axp-layout-title>\n @if (group.description) {\n <axp-layout-description>{{ group.description }}</axp-layout-description>\n }\n </axp-layout-header>\n <axp-layout-content>\n @for (param of group.parameters; track param.path) {\n <div class=\"__field-container\">\n <ax-form-field class=\"__field-input\" [gridLayout]=\"computedLayout()\">\n <ax-label>{{ param.title }}</ax-label>\n <ng-container axp-widget-renderer [node]=\"param.widget\" [mode]=\"'edit'\"></ng-container>\n <!-- @if (param.description) {\n <axp-layout-description>{{ param.description }}</axp-layout-description>\n } -->\n </ax-form-field>\n </div>\n }\n </axp-layout-content>\n </axp-layout-section>\n }\n @empty {\n <axp-layout-section>\n <axp-layout-content>\n <div class=\"__empty-state\">\n <axp-layout-description>No form definition provided</axp-layout-description>\n </div>\n </axp-layout-content>\n </axp-layout-section>\n }\n </axp-layout-sections>\n </axp-widgets-container>\n</ax-form>\n", styles: [".axp-dynamic-form{width:100%}.axp-dynamic-form axp-layout-section axp-layout-content{display:flex;width:100%;flex-direction:column}.axp-dynamic-form axp-layout-section axp-layout-content>:not([hidden])~:not([hidden]){--tw-divide-y-reverse: 0;border-top-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px * var(--tw-divide-y-reverse));border-style:dashed;--tw-divide-opacity: 1;border-color:rgba(var(--ax-sys-color-border-lightest-surface),var(--tw-divide-opacity, 1))}.axp-dynamic-form axp-layout-section axp-layout-content .__field-container{align-items:center;gap:1rem;padding:1rem}@media (min-width: 1024px){.axp-dynamic-form axp-layout-section axp-layout-content .__field-container{padding-left:1.5rem;padding-right:1.5rem}}@media (min-width: 1280px){.axp-dynamic-form axp-layout-section axp-layout-content .__field-container{padding-left:2rem;padding-right:2rem}}@media (min-width: 1536px){.axp-dynamic-form axp-layout-section axp-layout-content .__field-container{padding-left:2.5rem;padding-right:2.5rem}}.axp-dynamic-form axp-layout-section axp-layout-content .__field-container{display:grid;grid-template-columns:repeat(12,minmax(0,1fr))}.axp-dynamic-form axp-layout-section axp-layout-content .__field-container .__field-info{grid-column:span 12 / span 12}@media (min-width: 768px){.axp-dynamic-form axp-layout-section axp-layout-content .__field-container .__field-info{grid-column:span 4 / span 4}}@media (min-width: 1024px){.axp-dynamic-form axp-layout-section axp-layout-content .__field-container .__field-info{grid-column:span 4 / span 4}}@media (min-width: 1536px){.axp-dynamic-form axp-layout-section axp-layout-content .__field-container .__field-info{grid-column:span 3 / span 3}}.axp-dynamic-form axp-layout-section axp-layout-content .__field-container axp-layout-description{margin-top:.5rem!important;font-size:.75rem!important;line-height:1rem!important}.axp-dynamic-form.--compact axp-layout-section axp-layout-content>:not([hidden])~:not([hidden]){border-style:none}.axp-dynamic-form.--compact axp-layout-section axp-layout-content .__field-container{display:flex;flex-direction:column;gap:.25rem;padding:.25rem .5rem;margin-bottom:.5rem;border-width:0px}.axp-dynamic-form.--compact axp-layout-section axp-layout-content .__field-container .__field-info{margin-bottom:.125rem;width:100%}.axp-dynamic-form.--compact axp-layout-section axp-layout-content .__field-container .__field-info axp-layout-title{font-size:.875rem;line-height:1.25rem;font-weight:500}.axp-dynamic-form.--compact axp-layout-section axp-layout-content .__field-container .__field-input{width:100%}.axp-dynamic-form.--compact axp-layout-section axp-layout-content .__field-container axp-layout-description{margin-top:.125rem!important;font-size:.75rem!important;line-height:1rem!important;opacity:.75!important}.axp-dynamic-form.--compact axp-layout-section{margin-bottom:.75rem}.axp-dynamic-form.--compact axp-layout-section axp-layout-header{margin-bottom:.5rem;gap:0px;padding:.5rem}.axp-dynamic-form.--compact axp-layout-section axp-layout-header axp-layout-title{font-size:1rem;line-height:1.5rem;font-weight:600}.axp-dynamic-form.--compact axp-layout-section axp-layout-header axp-layout-description{margin-top:.25rem;font-size:.75rem;line-height:1rem;opacity:.75}.axp-dynamic-form.--vertical axp-layout-section axp-layout-content .__field-container{display:flex;flex-direction:column;align-items:flex-start;gap:.75rem}.axp-dynamic-form.--vertical axp-layout-section axp-layout-content .__field-container .__field-info{grid-column:span 12 / span 12;width:100%}.axp-dynamic-form.--vertical axp-layout-section axp-layout-content .__field-container .__field-input{grid-column:span 12 / span 12;width:100%}.axp-dynamic-form.--vertical axp-layout-section axp-layout-content .__field-container axp-layout-description{margin-top:.25rem!important;font-size:.875rem!important;line-height:1.25rem!important}.axp-dynamic-form.--horizontal axp-layout-section axp-layout-content>:not([hidden])~:not([hidden]){border-style:none}.axp-dynamic-form.--horizontal axp-layout-section axp-layout-content .__field-container{display:flex;flex-direction:row;align-items:center;gap:1rem;padding-top:.75rem;padding-bottom:.75rem}.axp-dynamic-form.--horizontal axp-layout-section axp-layout-content .__field-container .__field-info{width:12rem;flex-shrink:0}.axp-dynamic-form.--horizontal axp-layout-section axp-layout-content .__field-container .__field-info axp-layout-title{margin-bottom:.25rem;font-size:.875rem;line-height:1.25rem;font-weight:500}.axp-dynamic-form.--horizontal axp-layout-section axp-layout-content .__field-container .__field-input{flex:1 1 0%}.axp-dynamic-form.--horizontal axp-layout-section axp-layout-content .__field-container axp-layout-description{margin-top:.25rem!important;font-size:.75rem!important;line-height:1rem!important;opacity:.75!important}.axp-dynamic-form .__empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:2rem;padding-bottom:2rem;text-align:center}.axp-dynamic-form .__empty-state .__message{font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type:
|
|
1234
1230
|
// ACoreX
|
|
1235
|
-
AXFormModule }, { kind: "component", type:
|
|
1231
|
+
AXFormModule }, { kind: "component", type: i2$1.AXFormFieldComponent, selector: "ax-form-field", inputs: ["labelMode"] }, { kind: "component", type: i2$1.AXFormComponent, selector: "ax-form", inputs: ["labelMode", "look", "messageStyle", "updateOn"], outputs: ["onValidate", "updateOnChange"] }, { kind: "ngmodule", type: AXValidationModule }, { kind: "ngmodule", type:
|
|
1236
1232
|
// Platform
|
|
1237
1233
|
AXPLayoutBuilderModule }, { kind: "component", type: i3$3.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i3$3.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], outputs: ["onOptionsChanged", "onValueChanged"], exportAs: ["widgetRenderer"] }, { kind: "component", type: AXPThemeLayoutBlockComponent, selector: "\n\n axp-page-content, \n axp-page-footer-container,\n axp-page-footer,\n axp-page-header,\n axp-page-header-container,\n axp-page-toolbar,\n\n axp-layout-content, \n axp-layout-page-content, \n\n axp-layout-sections,\n axp-layout-body,\n axp-layout-page-body,\n axp-layout-prefix,\n axp-layout-suffix,\n axp-layout-title-bar,\n axp-layout-title, \n axp-layout-title-actions, \n axp-layout-nav-button, \n axp-layout-description, \n axp-layout-breadcrumbs,\n axp-layout-list-action,\n " }, { kind: "component", type: AXPThemeLayoutHeaderComponent, selector: "axp-layout-header" }, { kind: "component", type: AXPThemeLayoutSectionComponent, selector: "axp-layout-section" }, { kind: "directive", type: AXPGridLayoutDirective, selector: "[gridLayout]", inputs: ["gridLayout"] }, { kind: "component", type: AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1238
1234
|
}
|
|
@@ -1254,7 +1250,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImpor
|
|
|
1254
1250
|
], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
1255
1251
|
class: 'axp-dynamic-form',
|
|
1256
1252
|
'[class]': 'hostClasses()',
|
|
1257
|
-
}, template: "<ax-form>\n <axp-widgets-container [context]=\"internalContext()\" (onContextChanged)=\"handleContextChanged($event)\">\n <axp-layout-sections>\n
|
|
1253
|
+
}, template: "<ax-form>\n <axp-widgets-container [context]=\"internalContext()\" (onContextChanged)=\"handleContextChanged($event)\">\n <axp-layout-sections>\n @for (group of formDefinition().groups; track group.name) {\n <axp-layout-section>\n <axp-layout-header>\n <axp-layout-title>{{ group.title }}</axp-layout-title>\n @if (group.description) {\n <axp-layout-description>{{ group.description }}</axp-layout-description>\n }\n </axp-layout-header>\n <axp-layout-content>\n @for (param of group.parameters; track param.path) {\n <div class=\"__field-container\">\n <ax-form-field class=\"__field-input\" [gridLayout]=\"computedLayout()\">\n <ax-label>{{ param.title }}</ax-label>\n <ng-container axp-widget-renderer [node]=\"param.widget\" [mode]=\"'edit'\"></ng-container>\n <!-- @if (param.description) {\n <axp-layout-description>{{ param.description }}</axp-layout-description>\n } -->\n </ax-form-field>\n </div>\n }\n </axp-layout-content>\n </axp-layout-section>\n }\n @empty {\n <axp-layout-section>\n <axp-layout-content>\n <div class=\"__empty-state\">\n <axp-layout-description>No form definition provided</axp-layout-description>\n </div>\n </axp-layout-content>\n </axp-layout-section>\n }\n </axp-layout-sections>\n </axp-widgets-container>\n</ax-form>\n", styles: [".axp-dynamic-form{width:100%}.axp-dynamic-form axp-layout-section axp-layout-content{display:flex;width:100%;flex-direction:column}.axp-dynamic-form axp-layout-section axp-layout-content>:not([hidden])~:not([hidden]){--tw-divide-y-reverse: 0;border-top-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px * var(--tw-divide-y-reverse));border-style:dashed;--tw-divide-opacity: 1;border-color:rgba(var(--ax-sys-color-border-lightest-surface),var(--tw-divide-opacity, 1))}.axp-dynamic-form axp-layout-section axp-layout-content .__field-container{align-items:center;gap:1rem;padding:1rem}@media (min-width: 1024px){.axp-dynamic-form axp-layout-section axp-layout-content .__field-container{padding-left:1.5rem;padding-right:1.5rem}}@media (min-width: 1280px){.axp-dynamic-form axp-layout-section axp-layout-content .__field-container{padding-left:2rem;padding-right:2rem}}@media (min-width: 1536px){.axp-dynamic-form axp-layout-section axp-layout-content .__field-container{padding-left:2.5rem;padding-right:2.5rem}}.axp-dynamic-form axp-layout-section axp-layout-content .__field-container{display:grid;grid-template-columns:repeat(12,minmax(0,1fr))}.axp-dynamic-form axp-layout-section axp-layout-content .__field-container .__field-info{grid-column:span 12 / span 12}@media (min-width: 768px){.axp-dynamic-form axp-layout-section axp-layout-content .__field-container .__field-info{grid-column:span 4 / span 4}}@media (min-width: 1024px){.axp-dynamic-form axp-layout-section axp-layout-content .__field-container .__field-info{grid-column:span 4 / span 4}}@media (min-width: 1536px){.axp-dynamic-form axp-layout-section axp-layout-content .__field-container .__field-info{grid-column:span 3 / span 3}}.axp-dynamic-form axp-layout-section axp-layout-content .__field-container axp-layout-description{margin-top:.5rem!important;font-size:.75rem!important;line-height:1rem!important}.axp-dynamic-form.--compact axp-layout-section axp-layout-content>:not([hidden])~:not([hidden]){border-style:none}.axp-dynamic-form.--compact axp-layout-section axp-layout-content .__field-container{display:flex;flex-direction:column;gap:.25rem;padding:.25rem .5rem;margin-bottom:.5rem;border-width:0px}.axp-dynamic-form.--compact axp-layout-section axp-layout-content .__field-container .__field-info{margin-bottom:.125rem;width:100%}.axp-dynamic-form.--compact axp-layout-section axp-layout-content .__field-container .__field-info axp-layout-title{font-size:.875rem;line-height:1.25rem;font-weight:500}.axp-dynamic-form.--compact axp-layout-section axp-layout-content .__field-container .__field-input{width:100%}.axp-dynamic-form.--compact axp-layout-section axp-layout-content .__field-container axp-layout-description{margin-top:.125rem!important;font-size:.75rem!important;line-height:1rem!important;opacity:.75!important}.axp-dynamic-form.--compact axp-layout-section{margin-bottom:.75rem}.axp-dynamic-form.--compact axp-layout-section axp-layout-header{margin-bottom:.5rem;gap:0px;padding:.5rem}.axp-dynamic-form.--compact axp-layout-section axp-layout-header axp-layout-title{font-size:1rem;line-height:1.5rem;font-weight:600}.axp-dynamic-form.--compact axp-layout-section axp-layout-header axp-layout-description{margin-top:.25rem;font-size:.75rem;line-height:1rem;opacity:.75}.axp-dynamic-form.--vertical axp-layout-section axp-layout-content .__field-container{display:flex;flex-direction:column;align-items:flex-start;gap:.75rem}.axp-dynamic-form.--vertical axp-layout-section axp-layout-content .__field-container .__field-info{grid-column:span 12 / span 12;width:100%}.axp-dynamic-form.--vertical axp-layout-section axp-layout-content .__field-container .__field-input{grid-column:span 12 / span 12;width:100%}.axp-dynamic-form.--vertical axp-layout-section axp-layout-content .__field-container axp-layout-description{margin-top:.25rem!important;font-size:.875rem!important;line-height:1.25rem!important}.axp-dynamic-form.--horizontal axp-layout-section axp-layout-content>:not([hidden])~:not([hidden]){border-style:none}.axp-dynamic-form.--horizontal axp-layout-section axp-layout-content .__field-container{display:flex;flex-direction:row;align-items:center;gap:1rem;padding-top:.75rem;padding-bottom:.75rem}.axp-dynamic-form.--horizontal axp-layout-section axp-layout-content .__field-container .__field-info{width:12rem;flex-shrink:0}.axp-dynamic-form.--horizontal axp-layout-section axp-layout-content .__field-container .__field-info axp-layout-title{margin-bottom:.25rem;font-size:.875rem;line-height:1.25rem;font-weight:500}.axp-dynamic-form.--horizontal axp-layout-section axp-layout-content .__field-container .__field-input{flex:1 1 0%}.axp-dynamic-form.--horizontal axp-layout-section axp-layout-content .__field-container axp-layout-description{margin-top:.25rem!important;font-size:.75rem!important;line-height:1rem!important;opacity:.75!important}.axp-dynamic-form .__empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:2rem;padding-bottom:2rem;text-align:center}.axp-dynamic-form .__empty-state .__message{font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}\n"] }]
|
|
1258
1254
|
}] });
|
|
1259
1255
|
|
|
1260
1256
|
//#endregion
|
|
@@ -1598,7 +1594,7 @@ class AXPExtraPropertiesComponent {
|
|
|
1598
1594
|
</axp-widgets-container>
|
|
1599
1595
|
</div>
|
|
1600
1596
|
|
|
1601
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type:
|
|
1597
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type: i2$1.AXFormFieldComponent, selector: "ax-form-field", inputs: ["labelMode"] }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i3$2.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXTextBoxModule }, { kind: "component", type: i4$1.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "mask-options", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i5$2.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i6.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: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i7.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i7.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: AXPLayoutBuilderModule }, { kind: "component", type: i3$3.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i3$3.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], outputs: ["onOptionsChanged", "onValueChanged"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i9.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i9.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i9.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1602
1598
|
}
|
|
1603
1599
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPExtraPropertiesComponent, decorators: [{
|
|
1604
1600
|
type: Component,
|
|
@@ -1812,7 +1808,7 @@ class AXPWidgetPropertyViewerComponent {
|
|
|
1812
1808
|
this.groupCollapsedStates.set(group, collapsed);
|
|
1813
1809
|
}
|
|
1814
1810
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPWidgetPropertyViewerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1815
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AXPWidgetPropertyViewerComponent, isStandalone: true, selector: "axp-widget-property-viewer", inputs: { widget: { classPropertyName: "widget", publicName: "widget", isSignal: true, isRequired: true, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onChanged: "onChanged" }, ngImport: i0, template: "<axp-widgets-container [context]=\"context()\" (onContextChanged)=\"handleContextChange($event)\">\n @if (mode()=='advanced') {\n <div class=\"ax-flex ax-flex-col\">\n @if(tabs().length > 1){\n <div class=\"ax-pb-2\">\n <ax-tabs look=\"default\" (onActiveTabChanged)=\"handleTabChange($event)\" [look]=\"'with-line'\">\n @for( tab of tabs();track $index){\n <ax-tab-item [text]=\"tab.title\" [key]=\"$index.toString()\" [active]=\"currentTabIndex() === $index\">\n </ax-tab-item>\n }\n </ax-tabs>\n </div>\n }\n <div class=\"ax-flex-1 ax-overflow-auto\">\n <ax-collapse-group class=\"ax-h-fit\" [look]=\"'flat'\">\n @for( group of groups();track $index){\n <ax-collapse class=\"!ax-mb-0\" [caption]=\"group.title\" [(isCollapsed)]=\"group.isCollapsed\"\n (isCollapsedChange)=\"handleCollapsedChange(group.name, $event)\">\n <div class=\"ax-flex ax-flex-col\">\n @for( p of group.props;track $index){\n <div class=\"ax-flex ax-flex-col ax-gap-1 ax-py-2\">\n <span class=\"ax-font-semibold\">{{ p.title }}</span>\n @if(p.schema.interface) {\n <ng-container axp-widget-renderer [node]=\"p.schema.interface\" [mode]=\"'edit'\"> </ng-container>\n }\n </div>\n }\n </div>\n </ax-collapse>\n }\n </ax-collapse-group>\n </div>\n </div>\n }\n <!-- Simple-->\n @else {\n <div class=\"ax-flex ax-flex-col ax-p-4 ax-gap-4\">\n <!-- groups -->\n @for( group of groups();track $index){\n <!-- props -->\n @for( p of group.props;track $index){\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <span class=\"ax-font-semibold\">{{ p.title | translate | async }}</span>\n @if(p.schema.interface) {\n <ng-container axp-widget-renderer [node]=\"p.schema.interface\" [mode]=\"'edit'\"> </ng-container>\n }\n </div>\n }\n }\n </div>\n }\n\n</axp-widgets-container>", styles: [":host ax-collapse .ax-collapse-header{font-weight:600}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXCollapseModule }, { kind: "component", type: i1$
|
|
1811
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AXPWidgetPropertyViewerComponent, isStandalone: true, selector: "axp-widget-property-viewer", inputs: { widget: { classPropertyName: "widget", publicName: "widget", isSignal: true, isRequired: true, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onChanged: "onChanged" }, ngImport: i0, template: "<axp-widgets-container [context]=\"context()\" (onContextChanged)=\"handleContextChange($event)\">\n @if (mode()=='advanced') {\n <div class=\"ax-flex ax-flex-col\">\n @if(tabs().length > 1){\n <div class=\"ax-pb-2\">\n <ax-tabs look=\"default\" (onActiveTabChanged)=\"handleTabChange($event)\" [look]=\"'with-line'\">\n @for( tab of tabs();track $index){\n <ax-tab-item [text]=\"tab.title\" [key]=\"$index.toString()\" [active]=\"currentTabIndex() === $index\">\n </ax-tab-item>\n }\n </ax-tabs>\n </div>\n }\n <div class=\"ax-flex-1 ax-overflow-auto\">\n <ax-collapse-group class=\"ax-h-fit\" [look]=\"'flat'\">\n @for( group of groups();track $index){\n <ax-collapse class=\"!ax-mb-0\" [caption]=\"group.title\" [(isCollapsed)]=\"group.isCollapsed\"\n (isCollapsedChange)=\"handleCollapsedChange(group.name, $event)\">\n <div class=\"ax-flex ax-flex-col\">\n @for( p of group.props;track $index){\n <div class=\"ax-flex ax-flex-col ax-gap-1 ax-py-2\">\n <span class=\"ax-font-semibold\">{{ p.title }}</span>\n @if(p.schema.interface) {\n <ng-container axp-widget-renderer [node]=\"p.schema.interface\" [mode]=\"'edit'\"> </ng-container>\n }\n </div>\n }\n </div>\n </ax-collapse>\n }\n </ax-collapse-group>\n </div>\n </div>\n }\n <!-- Simple-->\n @else {\n <div class=\"ax-flex ax-flex-col ax-p-4 ax-gap-4\">\n <!-- groups -->\n @for( group of groups();track $index){\n <!-- props -->\n @for( p of group.props;track $index){\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <span class=\"ax-font-semibold\">{{ p.title | translate | async }}</span>\n @if(p.schema.interface) {\n <ng-container axp-widget-renderer [node]=\"p.schema.interface\" [mode]=\"'edit'\"> </ng-container>\n }\n </div>\n }\n }\n </div>\n }\n\n</axp-widgets-container>", styles: [":host ax-collapse .ax-collapse-header{font-weight:600}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXCollapseModule }, { kind: "component", type: i1$1.AXCollapseComponent, selector: "ax-collapse", inputs: ["disabled", "look", "isCollapsed", "showHeader", "caption", "icon", "isLoading", "headerTemplate"], outputs: ["onClick", "isCollapsedChange"] }, { kind: "component", type: i1$1.AXCollapseGroupComponent, selector: "ax-collapse-group", inputs: ["look", "accordion", "activeIndex"], outputs: ["accordionChange", "activeIndexChange"] }, { kind: "ngmodule", type: AXTabsModule }, { kind: "component", type: i2$2.AXTabsComponent, selector: "ax-tabs", inputs: ["look", "location", "fitParent", "minWidth", "content"], outputs: ["onActiveTabChanged"] }, { kind: "component", type: i2$2.AXTabItemComponent, selector: "ax-tab-item", inputs: ["disabled", "text", "key", "headerTemplate", "active"], outputs: ["disabledChange", "onClick", "onBlur", "onFocus", "activeChange"] }, { kind: "ngmodule", type: AXPLayoutBuilderModule }, { kind: "component", type: i3$3.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i3$3.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], outputs: ["onOptionsChanged", "onValueChanged"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1816
1812
|
}
|
|
1817
1813
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPWidgetPropertyViewerComponent, decorators: [{
|
|
1818
1814
|
type: Component,
|
|
@@ -1947,7 +1943,7 @@ class AXPExtraPropertiesSchemaComponent {
|
|
|
1947
1943
|
return `${k}${i}`;
|
|
1948
1944
|
}
|
|
1949
1945
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPExtraPropertiesSchemaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1950
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AXPExtraPropertiesSchemaComponent, isStandalone: true, selector: "axp-extra-properties-schema", inputs: { schema: { classPropertyName: "schema", publicName: "schema", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { schemaChange: "schemaChange" }, host: { classAttribute: "ax-flex ax-flex-1 ax-h-full ax-gap-4 ax-p-4" }, ngImport: i0, template: "<!-- Left Panel: list/manage properties -->\n<div class=\"ax-flex ax-flex-col ax-gap-3 ax-min-h-0 ax-h-full ax-w-2/3\">\n <div class=\"ax-overflow-y-auto ax-min-h-0 ax-h-full ax-pe-2 -ax-me-2\">\n <div cdkDropList (cdkDropListDropped)=\"handleDrop($event)\" class=\"ax-flex ax-flex-col ax-gap-3\">\n @for (item of schema(); track item.key) {\n @if (mode() === 'edit') {\n <div class=\"ax-grid ax-grid-cols-12 ax-gap-4 ax-items-center ax-rounded ax-border ax-p-3 ax-cursor-pointer ax-lightest-surface \"\n [class.!ax-lighter-surface]=\"item.key === selectedKey()\" (click)=\"handleSelect(item.key)\" cdkDrag\n [cdkDragDisabled]=\"false\">\n <div class=\"ax-col-span-12 md:ax-col-span-4 ax-flex ax-items-center ax-gap-3\">\n <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move ax-text-neutral-500\"\n cdkDragHandle></ax-icon>\n <div>\n <div class=\"ax-font-semibold\">{{ item.title }}</div>\n </div>\n </div>\n <div class=\"ax-col-span-12 md:ax-col-span-7 ax-grid ax-grid-cols-12 ax-gap-4 ax-items-center\">\n <ax-form-field class=\"ax-col-span-12 md:ax-col-span-6\">\n <ax-select-box [value]=\"item.type\" [dataSource]=\"typeOptions()\" valueField=\"id\"\n textField=\"title\"\n (onValueChanged)=\"handleUpdateType(item.key, $event.value)\"></ax-select-box>\n </ax-form-field>\n <ax-form-field class=\"ax-col-span-12 md:ax-col-span-6\">\n <ax-text-box [ngModel]=\"item.title\"\n (onValueChanged)=\"handleUpdateTitle(item.key, $event.value)\"></ax-text-box>\n </ax-form-field>\n </div>\n <div class=\"ax-hidden md:ax-block md:ax-col-span-1 md:ax-justify-self-end\">\n <ax-button look=\"blank\" color=\"danger\" (onClick)=\"handleRemove(item.key)\">\n <ax-prefix><ax-icon class=\"fa-light fa-trash-can\"></ax-icon></ax-prefix>\n </ax-button>\n </div>\n </div>\n } @else {\n <div class=\"ax-grid ax-grid-cols-12 ax-gap-1 ax-rounded ax-border ax-p-3\">\n <div class=\"ax-font-semibold\">{{ item.title }}</div>\n <div class=\"ax-col-span-12 ax-text-xs ax-text-muted\">{{ item.key }}</div>\n </div>\n }\n } @empty {\n <div class=\"ax-text-sm ax-text-gray-400\">{{ '@extra-properties:messages.no-schema-fields' | translate |\n async\n }}</div>\n }\n\n @if (mode() === 'edit') {\n <div class=\"ax-grid ax-grid-cols-12 ax-gap-4 ax-items-end ax-mt-4 ax-border-t ax-border-dashed ax-pt-4\">\n <!-- Type -->\n <ax-form-field class=\"ax-col-span-12 md:ax-col-span-6 lg:ax-col-span-6\">\n <ax-label>{{ '@extra-properties:labels.type' | translate | async }}</ax-label>\n <ax-select-box [ngModel]=\"newTypeId()\" [dataSource]=\"typeOptions()\" valueField=\"id\"\n textField=\"title\" (onValueChanged)=\"newTypeChanged($event.value)\"></ax-select-box>\n </ax-form-field>\n <!-- Title -->\n <ax-form-field class=\"ax-col-span-12 md:ax-col-span-6 lg:ax-col-span-6\">\n <ax-label>{{ '@extra-properties:labels.title' | translate | async }}</ax-label>\n <ax-text-box [ngModel]=\"newTitle()\"\n (onValueChanged)=\"handleTitleChange($event.value)\"></ax-text-box>\n </ax-form-field>\n <!-- Add -->\n <div class=\"ax-col-span-12 ax-flex ax-justify-end\">\n <ax-button look=\"solid\" (onClick)=\"handleAdd()\" [disabled]=\"!canAdd()\"\n text=\"{{ '@extra-properties:actions.add-field' | translate | async }}\">\n <ax-prefix><ax-icon class=\"fa-solid fa-add\"></ax-icon></ax-prefix>\n </ax-button>\n </div>\n </div>\n }\n </div>\n </div>\n</div>\n\n<!-- Right Panel: widget property viewer for selected item -->\n<div class=\"ax-w-1/3 ax-border ax-rounded ax-h-full ax-flex ax-flex-col ax-lightest-surface\">\n @if (mode() === 'edit' && selectedItem()) {\n <div class=\"ax-p-4 ax-font-semibold ax-border-b ax-lighter-surface\">\n {{selectedItem()?.title}}\n </div>\n <div class=\"ax-overflow-y-auto ax-flex-1\">\n <axp-widget-property-viewer [widget]=\"{ type: selectedItem()!.type, options: selectedItem()!.options }\"\n [mode]=\"'advanced'\" (onChanged)=\"handleViewerChanged($event)\" />\n </div>\n }\n @else {\n <div class=\"ax-text-sm ax-text-muted ax-p-4 ax-text-center\">{{ '@extra-properties:messages.select-field-to-edit' |\n translate | async }}</div>\n }\n</div>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type:
|
|
1946
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AXPExtraPropertiesSchemaComponent, isStandalone: true, selector: "axp-extra-properties-schema", inputs: { schema: { classPropertyName: "schema", publicName: "schema", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { schemaChange: "schemaChange" }, host: { classAttribute: "ax-flex ax-flex-1 ax-h-full ax-gap-4 ax-p-4" }, ngImport: i0, template: "<!-- Left Panel: list/manage properties -->\n<div class=\"ax-flex ax-flex-col ax-gap-3 ax-min-h-0 ax-h-full ax-w-2/3\">\n <div class=\"ax-overflow-y-auto ax-min-h-0 ax-h-full ax-pe-2 -ax-me-2\">\n <div cdkDropList (cdkDropListDropped)=\"handleDrop($event)\" class=\"ax-flex ax-flex-col ax-gap-3\">\n @for (item of schema(); track item.key) {\n @if (mode() === 'edit') {\n <div class=\"ax-grid ax-grid-cols-12 ax-gap-4 ax-items-center ax-rounded ax-border ax-p-3 ax-cursor-pointer ax-lightest-surface \"\n [class.!ax-lighter-surface]=\"item.key === selectedKey()\" (click)=\"handleSelect(item.key)\" cdkDrag\n [cdkDragDisabled]=\"false\">\n <div class=\"ax-col-span-12 md:ax-col-span-4 ax-flex ax-items-center ax-gap-3\">\n <ax-icon class=\"fa-solid fa-grip-dots-vertical ax-cursor-move ax-text-neutral-500\"\n cdkDragHandle></ax-icon>\n <div>\n <div class=\"ax-font-semibold\">{{ item.title }}</div>\n </div>\n </div>\n <div class=\"ax-col-span-12 md:ax-col-span-7 ax-grid ax-grid-cols-12 ax-gap-4 ax-items-center\">\n <ax-form-field class=\"ax-col-span-12 md:ax-col-span-6\">\n <ax-select-box [value]=\"item.type\" [dataSource]=\"typeOptions()\" valueField=\"id\"\n textField=\"title\"\n (onValueChanged)=\"handleUpdateType(item.key, $event.value)\"></ax-select-box>\n </ax-form-field>\n <ax-form-field class=\"ax-col-span-12 md:ax-col-span-6\">\n <ax-text-box [ngModel]=\"item.title\"\n (onValueChanged)=\"handleUpdateTitle(item.key, $event.value)\"></ax-text-box>\n </ax-form-field>\n </div>\n <div class=\"ax-hidden md:ax-block md:ax-col-span-1 md:ax-justify-self-end\">\n <ax-button look=\"blank\" color=\"danger\" (onClick)=\"handleRemove(item.key)\">\n <ax-prefix><ax-icon class=\"fa-light fa-trash-can\"></ax-icon></ax-prefix>\n </ax-button>\n </div>\n </div>\n } @else {\n <div class=\"ax-grid ax-grid-cols-12 ax-gap-1 ax-rounded ax-border ax-p-3\">\n <div class=\"ax-font-semibold\">{{ item.title }}</div>\n <div class=\"ax-col-span-12 ax-text-xs ax-text-muted\">{{ item.key }}</div>\n </div>\n }\n } @empty {\n <div class=\"ax-text-sm ax-text-gray-400\">{{ '@extra-properties:messages.no-schema-fields' | translate |\n async\n }}</div>\n }\n\n @if (mode() === 'edit') {\n <div class=\"ax-grid ax-grid-cols-12 ax-gap-4 ax-items-end ax-mt-4 ax-border-t ax-border-dashed ax-pt-4\">\n <!-- Type -->\n <ax-form-field class=\"ax-col-span-12 md:ax-col-span-6 lg:ax-col-span-6\">\n <ax-label>{{ '@extra-properties:labels.type' | translate | async }}</ax-label>\n <ax-select-box [ngModel]=\"newTypeId()\" [dataSource]=\"typeOptions()\" valueField=\"id\"\n textField=\"title\" (onValueChanged)=\"newTypeChanged($event.value)\"></ax-select-box>\n </ax-form-field>\n <!-- Title -->\n <ax-form-field class=\"ax-col-span-12 md:ax-col-span-6 lg:ax-col-span-6\">\n <ax-label>{{ '@extra-properties:labels.title' | translate | async }}</ax-label>\n <ax-text-box [ngModel]=\"newTitle()\"\n (onValueChanged)=\"handleTitleChange($event.value)\"></ax-text-box>\n </ax-form-field>\n <!-- Add -->\n <div class=\"ax-col-span-12 ax-flex ax-justify-end\">\n <ax-button look=\"solid\" (onClick)=\"handleAdd()\" [disabled]=\"!canAdd()\"\n text=\"{{ '@extra-properties:actions.add-field' | translate | async }}\">\n <ax-prefix><ax-icon class=\"fa-solid fa-add\"></ax-icon></ax-prefix>\n </ax-button>\n </div>\n </div>\n }\n </div>\n </div>\n</div>\n\n<!-- Right Panel: widget property viewer for selected item -->\n<div class=\"ax-w-1/3 ax-border ax-rounded ax-h-full ax-flex ax-flex-col ax-lightest-surface\">\n @if (mode() === 'edit' && selectedItem()) {\n <div class=\"ax-p-4 ax-font-semibold ax-border-b ax-lighter-surface\">\n {{selectedItem()?.title}}\n </div>\n <div class=\"ax-overflow-y-auto ax-flex-1\">\n <axp-widget-property-viewer [widget]=\"{ type: selectedItem()!.type, options: selectedItem()!.options }\"\n [mode]=\"'advanced'\" (onChanged)=\"handleViewerChanged($event)\" />\n </div>\n }\n @else {\n <div class=\"ax-text-sm ax-text-muted ax-p-4 ax-text-center\">{{ '@extra-properties:messages.select-field-to-edit' |\n translate | async }}</div>\n }\n</div>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type: i2$1.AXFormFieldComponent, selector: "ax-form-field", inputs: ["labelMode"] }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i3$2.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXTextBoxModule }, { kind: "component", type: i4$1.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "mask-options", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i5$2.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i6.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: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i7.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i7.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: DragDropModule }, { kind: "directive", type: i9.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i9.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i9.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXPWidgetPropertyViewerComponent, selector: "axp-widget-property-viewer", inputs: ["widget", "mode"], outputs: ["onChanged"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1951
1947
|
}
|
|
1952
1948
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPExtraPropertiesSchemaComponent, decorators: [{
|
|
1953
1949
|
type: Component,
|
|
@@ -1978,8 +1974,10 @@ class AXPExtraPropertiesValuesComponent {
|
|
|
1978
1974
|
//#region ---- Outputs ----
|
|
1979
1975
|
this.valuesChange = output();
|
|
1980
1976
|
//#endregion
|
|
1981
|
-
//#region ----
|
|
1982
|
-
this.
|
|
1977
|
+
//#region ---- Outputs ----
|
|
1978
|
+
this.isRequired = (item) => {
|
|
1979
|
+
return item.options?.['validations']?.['required'] ?? false;
|
|
1980
|
+
};
|
|
1983
1981
|
//#endregion
|
|
1984
1982
|
//#region ---- Class Properties ----
|
|
1985
1983
|
this.internalContext = signal({}, ...(ngDevMode ? [{ debugName: "internalContext" }] : []));
|
|
@@ -2072,18 +2070,14 @@ class AXPExtraPropertiesValuesComponent {
|
|
|
2072
2070
|
<div class="ax-col-span-12 ax-flex ax-flex-col ax-gap-3">
|
|
2073
2071
|
@for(item of schema(); track item.key){
|
|
2074
2072
|
@if(mode()==='edit'){
|
|
2075
|
-
<
|
|
2076
|
-
<
|
|
2077
|
-
|
|
2078
|
-
</div>
|
|
2079
|
-
<div class="ax-col-span-12 md:ax-col-span-9">
|
|
2080
|
-
<ng-container
|
|
2073
|
+
<ax-form-field>
|
|
2074
|
+
<ax-label [required]="isRequired(item)">{{item.title}}</ax-label>
|
|
2075
|
+
<ng-container
|
|
2081
2076
|
axp-widget-renderer
|
|
2082
2077
|
[node]="getNode(item)"
|
|
2083
2078
|
[mode]="'edit'"
|
|
2084
2079
|
></ng-container>
|
|
2085
|
-
|
|
2086
|
-
</div>
|
|
2080
|
+
</ax-form-field>
|
|
2087
2081
|
} @else {
|
|
2088
2082
|
<div class="ax-grid ax-grid-cols-12 ax-gap-1">
|
|
2089
2083
|
<div class="ax-font-semibold">{{item.title}}</div>
|
|
@@ -2100,7 +2094,7 @@ class AXPExtraPropertiesValuesComponent {
|
|
|
2100
2094
|
</div>
|
|
2101
2095
|
</axp-widgets-container>
|
|
2102
2096
|
</div>
|
|
2103
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXPLayoutBuilderModule }, { kind: "component", type: i3$3.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i3$3.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], outputs: ["onOptionsChanged", "onValueChanged"], exportAs: ["widgetRenderer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2097
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXPLayoutBuilderModule }, { kind: "component", type: i3$3.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i3$3.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], outputs: ["onOptionsChanged", "onValueChanged"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type: i2$1.AXFormFieldComponent, selector: "ax-form-field", inputs: ["labelMode"] }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i3$2.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2104
2098
|
}
|
|
2105
2099
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPExtraPropertiesValuesComponent, decorators: [{
|
|
2106
2100
|
type: Component,
|
|
@@ -2112,18 +2106,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImpor
|
|
|
2112
2106
|
<div class="ax-col-span-12 ax-flex ax-flex-col ax-gap-3">
|
|
2113
2107
|
@for(item of schema(); track item.key){
|
|
2114
2108
|
@if(mode()==='edit'){
|
|
2115
|
-
<
|
|
2116
|
-
<
|
|
2117
|
-
|
|
2118
|
-
</div>
|
|
2119
|
-
<div class="ax-col-span-12 md:ax-col-span-9">
|
|
2120
|
-
<ng-container
|
|
2109
|
+
<ax-form-field>
|
|
2110
|
+
<ax-label [required]="isRequired(item)">{{item.title}}</ax-label>
|
|
2111
|
+
<ng-container
|
|
2121
2112
|
axp-widget-renderer
|
|
2122
2113
|
[node]="getNode(item)"
|
|
2123
2114
|
[mode]="'edit'"
|
|
2124
2115
|
></ng-container>
|
|
2125
|
-
|
|
2126
|
-
</div>
|
|
2116
|
+
</ax-form-field>
|
|
2127
2117
|
} @else {
|
|
2128
2118
|
<div class="ax-grid ax-grid-cols-12 ax-gap-1">
|
|
2129
2119
|
<div class="ax-font-semibold">{{item.title}}</div>
|
|
@@ -2142,7 +2132,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImpor
|
|
|
2142
2132
|
</div>
|
|
2143
2133
|
`,
|
|
2144
2134
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
2145
|
-
imports: [CommonModule, AXPLayoutBuilderModule],
|
|
2135
|
+
imports: [CommonModule, AXPLayoutBuilderModule, AXFormModule, AXLabelModule],
|
|
2146
2136
|
standalone: true,
|
|
2147
2137
|
host: {
|
|
2148
2138
|
class: 'ax-block ax-flex-1',
|
|
@@ -2692,7 +2682,7 @@ class AXPUserAvatarComponent {
|
|
|
2692
2682
|
return colors[idx];
|
|
2693
2683
|
}
|
|
2694
2684
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPUserAvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2695
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AXPUserAvatarComponent, isStandalone: true, selector: "axp-user-avatar", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, userId: { classPropertyName: "userId", publicName: "userId", isSignal: true, isRequired: false, transformFunction: null } }, providers: [], ngImport: i0, template: "<ax-avatar #avatar [size]=\"size()\" class=\"ax-cursor-pointer\">\n @if(hasPicture()){\n <ax-image (onError)=\"onImageError($event)\" (onLoad)=\"onImageLoad($event)\" [src]=\"src()\"></ax-image>\n }@else{\n <ax-text class=\"ax-{{ avatarColor() }}-lightest \">\n <small class=\"ax-text-xs ax-font-semibold\">{{ avatarText() }}</small>\n </ax-text>\n }\n</ax-avatar>\n\n<!--\n\nax-primary-lightest\nax-warning-lightest\nax-success-lightest\nax-danger-lightest\nax-secondary-lightest\nax-accent1-lightest\nax-accent2-lightest\nax-accent3-lightest\n\n-->\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AXAvatarModule }, { kind: "component", type: i1$
|
|
2685
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AXPUserAvatarComponent, isStandalone: true, selector: "axp-user-avatar", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, userId: { classPropertyName: "userId", publicName: "userId", isSignal: true, isRequired: false, transformFunction: null } }, providers: [], ngImport: i0, template: "<ax-avatar #avatar [size]=\"size()\" class=\"ax-cursor-pointer\">\n @if(hasPicture()){\n <ax-image (onError)=\"onImageError($event)\" (onLoad)=\"onImageLoad($event)\" [src]=\"src()\"></ax-image>\n }@else{\n <ax-text class=\"ax-{{ avatarColor() }}-lightest \">\n <small class=\"ax-text-xs ax-font-semibold\">{{ avatarText() }}</small>\n </ax-text>\n }\n</ax-avatar>\n\n<!--\n\nax-primary-lightest\nax-warning-lightest\nax-success-lightest\nax-danger-lightest\nax-secondary-lightest\nax-accent1-lightest\nax-accent2-lightest\nax-accent3-lightest\n\n-->\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AXAvatarModule }, { kind: "component", type: i1$2.AXAvatarComponent, selector: "ax-avatar", inputs: ["color", "size", "shape", "look"], outputs: ["sizeChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i7.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: AXImageModule }, { kind: "component", type: i3$4.AXImageComponent, selector: "ax-image", inputs: ["width", "height", "overlayMode", "src", "alt", "priority", "lazy"], outputs: ["onLoad", "onError"] }, { kind: "ngmodule", type: AXBadgeModule }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
2696
2686
|
}
|
|
2697
2687
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPUserAvatarComponent, decorators: [{
|
|
2698
2688
|
type: Component,
|
|
@@ -2737,7 +2727,7 @@ class AXPQueryViewsComponent {
|
|
|
2737
2727
|
console.log(e);
|
|
2738
2728
|
}
|
|
2739
2729
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPQueryViewsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2740
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AXPQueryViewsComponent, isStandalone: true, selector: "axp-query-views", inputs: { views: { classPropertyName: "views", publicName: "views", isSignal: true, isRequired: false, transformFunction: null }, selectedView: { classPropertyName: "selectedView", publicName: "selectedView", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { views: "viewsChange", selectedView: "selectedViewChange" }, viewQueries: [{ propertyName: "tabs", first: true, predicate: ["tabs"], descendants: true, isSignal: true }], ngImport: i0, template: "<ax-tabs #tabs [look]=\"'with-line'\" class=\"ax-font-semibold\">\n @for (item of views(); track item.name) {\n <ax-tab-item (onClick)=\"setView(item)\" [key]=\"item.name\" [text]=\"(item.title | translate | async) || 'item.title'\">\n </ax-tab-item>\n }\n <!-- <ax-tab-item\n (onClick)=\"createNew()\"\n [key]=\"'create-new'\"\n [text]=\"('view.createNew' | translate | async) || 'Create New'\"\n >\n </ax-tab-item> -->\n</ax-tabs>\n", dependencies: [{ kind: "ngmodule", type: AXTabsModule }, { kind: "component", type: i2$
|
|
2730
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AXPQueryViewsComponent, isStandalone: true, selector: "axp-query-views", inputs: { views: { classPropertyName: "views", publicName: "views", isSignal: true, isRequired: false, transformFunction: null }, selectedView: { classPropertyName: "selectedView", publicName: "selectedView", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { views: "viewsChange", selectedView: "selectedViewChange" }, viewQueries: [{ propertyName: "tabs", first: true, predicate: ["tabs"], descendants: true, isSignal: true }], ngImport: i0, template: "<ax-tabs #tabs [look]=\"'with-line'\" class=\"ax-font-semibold\">\n @for (item of views(); track item.name) {\n <ax-tab-item (onClick)=\"setView(item)\" [key]=\"item.name\" [text]=\"(item.title | translate | async) || 'item.title'\">\n </ax-tab-item>\n }\n <!-- <ax-tab-item\n (onClick)=\"createNew()\"\n [key]=\"'create-new'\"\n [text]=\"('view.createNew' | translate | async) || 'Create New'\"\n >\n </ax-tab-item> -->\n</ax-tabs>\n", dependencies: [{ kind: "ngmodule", type: AXTabsModule }, { kind: "component", type: i2$2.AXTabsComponent, selector: "ax-tabs", inputs: ["look", "location", "fitParent", "minWidth", "content"], outputs: ["onActiveTabChanged"] }, { kind: "component", type: i2$2.AXTabItemComponent, selector: "ax-tab-item", inputs: ["disabled", "text", "key", "headerTemplate", "active"], outputs: ["disabledChange", "onClick", "onBlur", "onFocus", "activeChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i5.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
2741
2731
|
}
|
|
2742
2732
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPQueryViewsComponent, decorators: [{
|
|
2743
2733
|
type: Component,
|