@acorex-platform/framework-client 0.0.14 → 0.0.18

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 (34) hide show
  1. package/fesm2022/acorex-platform-framework-client-auth.mjs.map +1 -1
  2. package/fesm2022/acorex-platform-framework-client-common.mjs +25 -211
  3. package/fesm2022/acorex-platform-framework-client-common.mjs.map +1 -1
  4. package/fesm2022/acorex-platform-framework-client-core.mjs +8 -104
  5. package/fesm2022/acorex-platform-framework-client-core.mjs.map +1 -1
  6. package/fesm2022/acorex-platform-framework-client-layout-builder.mjs +57 -12
  7. package/fesm2022/acorex-platform-framework-client-layout-builder.mjs.map +1 -1
  8. package/fesm2022/acorex-platform-framework-client-layout-components.mjs +494 -561
  9. package/fesm2022/acorex-platform-framework-client-layout-components.mjs.map +1 -1
  10. package/fesm2022/acorex-platform-framework-client-layout-designer.mjs +8 -8
  11. package/fesm2022/acorex-platform-framework-client-layout-designer.mjs.map +1 -1
  12. package/fesm2022/acorex-platform-framework-client-layout-entity.mjs +1333 -1023
  13. package/fesm2022/acorex-platform-framework-client-layout-entity.mjs.map +1 -1
  14. package/fesm2022/acorex-platform-framework-client-layout-views.mjs +51 -9
  15. package/fesm2022/acorex-platform-framework-client-layout-views.mjs.map +1 -1
  16. package/fesm2022/acorex-platform-framework-client-layout-widget-core.mjs +29 -9
  17. package/fesm2022/acorex-platform-framework-client-layout-widget-core.mjs.map +1 -1
  18. package/fesm2022/acorex-platform-framework-client-layout-widgets.mjs +48 -15
  19. package/fesm2022/acorex-platform-framework-client-layout-widgets.mjs.map +1 -1
  20. package/fesm2022/acorex-platform-framework-client-themes-default.mjs +41 -26
  21. package/fesm2022/acorex-platform-framework-client-themes-default.mjs.map +1 -1
  22. package/fesm2022/acorex-platform-framework-client-themes-shared.mjs +4 -4
  23. package/fesm2022/acorex-platform-framework-client-themes-shared.mjs.map +1 -1
  24. package/fesm2022/acorex-platform-framework-client-workflow.mjs.map +1 -1
  25. package/package.json +7 -7
  26. package/types/acorex-platform-framework-client-auth.d.ts +2 -2
  27. package/types/acorex-platform-framework-client-common.d.ts +12 -125
  28. package/types/acorex-platform-framework-client-core.d.ts +5 -22
  29. package/types/acorex-platform-framework-client-layout-builder.d.ts +10 -0
  30. package/types/acorex-platform-framework-client-layout-components.d.ts +17 -68
  31. package/types/acorex-platform-framework-client-layout-entity.d.ts +80 -7
  32. package/types/acorex-platform-framework-client-layout-views.d.ts +11 -6
  33. package/types/acorex-platform-framework-client-layout-widgets.d.ts +1 -1
  34. package/types/acorex-platform-framework-client-workflow.d.ts +1 -2
package/fesm2022/acorex-platform-framework-client-layout-components.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  import { getSystemActions, AXPFileStorageStatus, AXP_QUERY_QUICK_SEARCH_FIELD, AXPKeyboardShortcutPriority, compareMultiLanguageStrings, containsHtmlMarkup, isFormValueEqual, extractTextFromHtml, AXPWidgetsCatalog, AXP_PREVIEW_WIDGET_FIELD_COMMAND_KEY } from '@acorex-platform/framework-shared/core';
2
2
  import * as i1$2 from '@acorex/components/button';
3
3
  import { AXButtonModule } from '@acorex/components/button';
4
- import * as i1$5 from '@acorex/cdk/common';
4
+ import * as i1$6 from '@acorex/cdk/common';
5
5
  import { AXCommonModule } from '@acorex/cdk/common';
6
6
  import * as i2$1 from '@acorex/components/decorators';
7
7
  import { AXDecoratorModule } from '@acorex/components/decorators';
@@ -23,7 +23,7 @@ import { AXAvatarModule } from '@acorex/components/avatar';
23
23
  import * as i3$1 from '@acorex/components/image';
24
24
  import { AXImageModule } from '@acorex/components/image';
25
25
  import { isNil, isEmpty, cloneDeep, get, isEqual, orderBy, defaultTo, isString, unionBy, sortBy, isArray, set, merge, capitalize } from 'lodash-es';
26
- import * as i4$1 from '@acorex/components/badge';
26
+ import * as i1$3 from '@acorex/components/badge';
27
27
  import { AXBadgeComponent, AXBadgeModule } from '@acorex/components/badge';
28
28
  import { AXPLayoutThemeService } from '@acorex-platform/framework-client/themes/shared';
29
29
  import { SIGNAL, signalSetFn } from '@angular/core/primitives/signals';
@@ -32,21 +32,21 @@ import { AXDropdownModule } from '@acorex/components/dropdown';
32
32
  import * as i5 from '@acorex/components/search-box';
33
33
  import { AXSearchBoxModule } from '@acorex/components/search-box';
34
34
  import { AXTreeViewComponent } from '@acorex/components/tree-view';
35
- import * as i4$2 from '@acorex/components/popover';
36
- import { AXPopoverModule, AXPopoverComponent } from '@acorex/components/popover';
35
+ import * as i2$2 from '@acorex/components/popover';
36
+ import { AXPopoverModule } from '@acorex/components/popover';
37
37
  import * as i3$2 from '@acorex/components/switch';
38
38
  import { AXSwitchModule } from '@acorex/components/switch';
39
39
  import { moveItemInArray, CdkDropList, CdkDrag, CdkDragHandle, transferArrayItem } from '@angular/cdk/drag-drop';
40
- import * as i1$3 from '@angular/forms';
40
+ import * as i1$4 from '@angular/forms';
41
41
  import { FormsModule } from '@angular/forms';
42
- import * as i4$3 from '@acorex/components/data-table';
42
+ import * as i4$1 from '@acorex/components/data-table';
43
43
  import { AXDataTableColumnComponent, AXDataTableModule } from '@acorex/components/data-table';
44
- import * as i2$4 from '@acorex/components/form';
44
+ import * as i2$5 from '@acorex/components/form';
45
45
  import { AXFormModule, AXFormComponent } from '@acorex/components/form';
46
46
  import { AXTextBoxModule } from '@acorex/components/text-box';
47
- import * as i2$2 from '@acorex/components/check-box';
47
+ import * as i2$3 from '@acorex/components/check-box';
48
48
  import { AXCheckBoxModule } from '@acorex/components/check-box';
49
- import * as i1$4 from '@acorex/components/label';
49
+ import * as i1$5 from '@acorex/components/label';
50
50
  import { AXLabelModule } from '@acorex/components/label';
51
51
  import * as i3$3 from '@acorex-platform/framework-client/layout/widget-core';
52
52
  import { AXPWidgetCoreModule, AXPWidgetRegistryService } from '@acorex-platform/framework-client/layout/widget-core';
@@ -59,10 +59,10 @@ import * as i7 from '@acorex/components/loading';
59
59
  import { AXLoadingModule } from '@acorex/components/loading';
60
60
  import { AXPopupService } from '@acorex/components/popup';
61
61
  import { moveItemInArray as moveItemInArray$1, AXDragDirective, AXDragHandleDirective, AXDropListDirective } from '@acorex/cdk/drag-drop';
62
- import * as i2$3 from '@acorex/components/select-box';
62
+ import * as i2$4 from '@acorex/components/select-box';
63
63
  import { AXSelectBoxModule } from '@acorex/components/select-box';
64
64
  import { AXFileService } from '@acorex/core/file';
65
- import { AXPFileStorageService, AXPFilterOperatorMiddlewareService, AXPSettingsService, AXPCommonSettings, ALL_DEFAULT_OPERATORS, normalizeStoredImageRef, isStoredImageFileId, resolveStoredImageDisplayUrl, getInAppInboxPriorityClass, isInAppInboxUnread, AXPInAppInboxConnectorService, AXP_IN_APP_INBOX_I18N, AXP_IN_APP_INBOX_CONFIG, withDefaultMultiLanguageOnWidgetProperty, AXPDefaultMultiLanguageConfigService, resolveSearchableText } from '@acorex-platform/framework-client/common';
65
+ import { AXPFileStorageService, AXPFilterOperatorMiddlewareService, AXPSettingsService, AXPCommonSettings, ALL_DEFAULT_OPERATORS, withDefaultMultiLanguageOnWidgetProperty, AXPDefaultMultiLanguageConfigService, resolveSearchableText, normalizeStoredImageRef, isStoredImageFileId, resolveStoredImageDisplayUrl } from '@acorex-platform/framework-client/common';
66
66
  import * as i7$1 from '@acorex/cdk/list-navigation';
67
67
  import { AXListNavigationModule } from '@acorex/cdk/list-navigation';
68
68
  import { AXKBDComponent, AXKBDItemComponent } from '@acorex/components/kbd';
@@ -73,27 +73,26 @@ import { AXCalendarService } from '@acorex/core/date-time';
73
73
  import { resolveEntityListFilterQueryField, resolveEntityListFilterContextField } from '@acorex-platform/framework-shared/entity';
74
74
  import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
75
75
  import { Subject, filter, BehaviorSubject, timer } from 'rxjs';
76
- import * as i1$6 from '@acorex/components/image-editor';
76
+ import * as i1$7 from '@acorex/components/image-editor';
77
77
  import { AXImageEditorContainerComponent, AXImageEditorCropComponent, AXImageEditorModule } from '@acorex/components/image-editor';
78
78
  import { AXToolBarModule } from '@acorex/components/toolbar';
79
- import { tap } from 'rxjs/operators';
80
- import { AXPSessionService } from '@acorex-platform/framework-client/auth';
81
- import * as i2$5 from '@acorex/components/tabs';
82
- import { AXTabsModule } from '@acorex/components/tabs';
83
- import { AXToastService } from '@acorex/components/toast';
84
- import { Router } from '@angular/router';
85
79
  import { AXPCommandExecutor } from '@acorex-platform/framework-client/runtime';
86
80
  import * as i2$6 from '@acorex/components/accordion';
87
81
  import { AXAccordionModule } from '@acorex/components/accordion';
88
82
  import { AXButtonGroupModule } from '@acorex/components/button-group';
89
- import * as i4$4 from '@acorex/components/code-editor';
83
+ import * as i4$2 from '@acorex/components/code-editor';
90
84
  import { AXCodeEditorModule } from '@acorex/components/code-editor';
85
+ import * as i8 from '@acorex/components/tabs';
86
+ import { AXTabsModule } from '@acorex/components/tabs';
87
+ import { AXToastService } from '@acorex/components/toast';
91
88
  import { AXDialogService } from '@acorex/components/dialog';
92
- import * as i1$7 from '@acorex/components/menu';
89
+ import * as i1$8 from '@acorex/components/menu';
93
90
  import { AXMenuModule } from '@acorex/components/menu';
94
91
  import { AXSchedulerComponent } from '@acorex/components/scheduler';
95
92
  import { AXSafePipe } from '@acorex/core/pipes';
96
93
  import { createBooleanProperty, AXPWidgetGroupEnum } from '@acorex-platform/framework-shared/widget-core';
94
+ import { tap } from 'rxjs/operators';
95
+ import { AXPSessionService } from '@acorex-platform/framework-client/auth';
97
96
 
98
97
  //#endregion
99
98
  //#region ---- Component Definition ----
@@ -253,7 +252,7 @@ class AXPActivityLogComponent {
253
252
  return currentIndex > 0;
254
253
  }
255
254
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPActivityLogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
256
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPActivityLogComponent, isStandalone: true, selector: "axp-activity-log", inputs: { activities: { classPropertyName: "activities", publicName: "activities", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, enableCompare: { classPropertyName: "enableCompare", publicName: "enableCompare", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { compareRequested: "compareRequested" }, ngImport: i0, template: "<div class=\"axp-activity-log accent2\" *translate=\"let t\">\n <!-- Activity Log Content -->\n <div class=\"__content\">\n <!-- Loading State -->\n @if (loading()) {\n <div class=\"__loading\">\n @for (item of [1, 2, 3, 4]; track $index) {\n <div class=\"__item\">\n <ax-skeleton [animated]=\"true\" class=\"__avatar\"></ax-skeleton>\n <div class=\"__content\">\n <ax-skeleton [animated]=\"true\" class=\"__title\"></ax-skeleton>\n <ax-skeleton [animated]=\"true\" class=\"__subtitle\"></ax-skeleton>\n <ax-skeleton [animated]=\"true\" class=\"__description\"></ax-skeleton>\n <ax-skeleton [animated]=\"true\" class=\"__time\"></ax-skeleton>\n </div>\n </div>\n }\n </div>\n }\n\n <!-- Activity Feed -->\n @if (!loading() && activities().length > 0) {\n <div class=\"__feed\">\n @for (activity of activities(); track activity.id) {\n @let changeClasses = getChangeClasses(activity.changeType);\n @let isItemExpanded = isExpanded(activity.id);\n @let hasExpandableContentItem = hasExpandableContent(activity);\n <div class=\"__item\" [class.__collapsed]=\"!isItemExpanded\" [class.__expandable]=\"hasExpandableContentItem\">\n <div class=\"size-10 rounded-full border flex items-center justify-center lightest-surface\">\n <i class=\"{{ changeClasses.icon }} {{ changeClasses.text }} fa-solid\"></i>\n </div>\n\n <!-- Activity Content -->\n <div class=\"__content\">\n <!-- Main Activity Info -->\n <div class=\"__main-info\">\n <!-- User and Action with Toggle Button -->\n <div class=\"__action-line __header-line\" (click)=\"toggleExpanded(activity.id)\">\n <span class=\"__user-name\">{{ activity.user.title }}</span>\n <span class=\"__action-type\">\n {{ t(`@general:actions.${activity.changeType}.title`) | async }}\n </span>\n <span class=\"__action-text\">\n {{ activity.title | translate | async }}\n </span>\n\n <!-- Compare Button -->\n @if (canCompare(activity)) {\n <button type=\"button\" class=\"__compare-button\" (click)=\"handleCompare(activity, $event)\"\n [attr.aria-label]=\"t('compare.title', { scope: i18nScope }) | async\">\n <i class=\"fa-solid fa-code-compare\"></i>\n </button>\n }\n\n <!-- Toggle Button (only show if there's expandable content) -->\n @if (hasExpandableContentItem) {\n <button type=\"button\" class=\"__toggle-button\" [attr.aria-expanded]=\"isItemExpanded\"\n [attr.aria-label]=\"isItemExpanded ? 'Collapse details' : 'Expand details'\">\n <i class=\"fa-solid\" [class.fa-chevron-down]=\"!isItemExpanded\"\n [class.fa-chevron-up]=\"isItemExpanded\"></i>\n </button>\n }\n </div>\n\n <!-- Expandable Description/Changes -->\n @if (hasExpandableContentItem && isItemExpanded && activity.changes.length > 0) {\n <div class=\"__action-lines __expandable-content\" [class.__animated]=\"shouldAnimate(activity.id)\">\n @for (change of activity.changes; track $index) {\n @let changeClasses = getChangeClasses(change.type);\n <div class=\"__action-line\">\n @if (change.layout) {\n <axp-layout-renderer\n [layout]=\"$any(change.layout)\"\n [context]=\"{ change }\"\n mode=\"view\"\n class=\"__history-layout\"\n />\n } @else {\n <div class=\"rounded-full size-7 grid place-items-center\">\n <i class=\"{{ changeClasses.icon }} {{ changeClasses.text }}\"></i>\n </div>\n @if (change.summary) {\n <span class=\"__action-text\">{{ change.summary }}</span>\n } @else if (change.fieldKey && change.actionKey) {\n <span class=\"__action-text\">\n {{ change.fieldKey | translate:(change.fieldKeyParams ?? {}) | async }}: {{ change.actionKey | translate | async }}\n </span>\n } @else {\n <span class=\"__action-text\">{{ change.description | translate | async }}</span>\n }\n }\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Time -->\n <div class=\"__time\">\n {{ activity.date | format: 'datetime' : 'short' | async }}\n </div>\n </div>\n </div>\n }\n </div>\n }\n\n <!-- Empty State -->\n @if (!loading() && activities().length === 0) {\n <axp-state-message icon=\"fa-light fa-history\" [title]=\"'@activity-log:components.activity-log.empty-states.no-history.title'\"\n [description]=\"'@activity-log:components.activity-log.empty-states.no-history.description'\">\n </axp-state-message>\n }\n </div>\n</div>\n\n<!-- \n\nsuccess-surface\nprimary-surface\ndanger-surface\nwarning-surface\ninfo-surface\nmuted-surface\ntext-success\n\n -->", styles: ["@layer properties;.axp-activity-log{height:100%;width:100%}:where(.axp-activity-log .__content .__loading>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing, .25rem) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing, .25rem) * 4) * calc(1 - var(--tw-space-y-reverse)))}.axp-activity-log .__content .__loading .__item{display:flex;align-items:flex-start;gap:calc(var(--spacing, .25rem) * 4)}.axp-activity-log .__content .__loading .__item .__avatar{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);flex-shrink:0;border-radius:calc(infinity * 1px)}.axp-activity-log .__content .__loading .__item .__content{flex:1}:where(.axp-activity-log .__content .__loading .__item .__content>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing, .25rem) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing, .25rem) * 2) * calc(1 - var(--tw-space-y-reverse)))}.axp-activity-log .__content .__loading .__item .__content .__title{height:calc(var(--spacing, .25rem) * 4);width:75%;border-radius:.25rem}.axp-activity-log .__content .__loading .__item .__content .__subtitle{height:calc(var(--spacing, .25rem) * 3);width:50%;border-radius:.25rem}.axp-activity-log .__content .__loading .__item .__content .__description{height:calc(var(--spacing, .25rem) * 3);width:calc(5 / 6 * 100%);border-radius:.25rem}.axp-activity-log .__content .__loading .__item .__content .__time{height:calc(var(--spacing, .25rem) * 3);width:25%;border-radius:.25rem}.axp-activity-log .__content .__feed{position:relative}:where(.axp-activity-log .__content .__feed>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing, .25rem) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing, .25rem) * 6) * calc(1 - var(--tw-space-y-reverse)))}.axp-activity-log .__content .__feed:before{content:\"\";position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 5);top:calc(var(--spacing, .25rem) * 2);bottom:calc(var(--spacing, .25rem) * 2);width:0;border-left:1px solid rgba(var(--ax-sys-color-border-surface));z-index:0}.axp-activity-log .__content .__feed .__item{position:relative;display:flex;align-items:flex-start;gap:calc(var(--spacing, .25rem) * 4)}.axp-activity-log .__content .__feed .__item axp-user-avatar{position:relative;z-index:10}.axp-activity-log .__content .__feed .__item .__content{min-width:0;flex:1}.axp-activity-log .__content .__feed .__item .__content .__main-info{margin-bottom:var(--spacing, .25rem)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line{margin-top:var(--spacing, .25rem);display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing, .25rem);--tw-leading: var(--leading-normal, 1.5);line-height:var(--leading-normal, 1.5)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line .__user-name{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line .__action-type,.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line .__action-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:85%}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line{align-items:center;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line:hover{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button{margin-left:calc(var(--spacing, .25rem) * 2);border-radius:calc(infinity * 1px);padding:var(--spacing, .25rem);transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s;display:flex;width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6);align-items:center;justify-content:center;color:rgba(var(--ax-sys-color-primary-surface))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:hover{background-color:var(--color-primary);color:var(--color-on-primary);border-color:var(--color-border-primary)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:focus{--tw-ring-color: rgba(var(--ax-sys-color-primary-surface))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:focus{--tw-ring-offset-width: 1px;--tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:focus{--tw-outline-style: none;outline-style:none}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button{margin-left:auto;border-radius:calc(infinity * 1px);padding:var(--spacing, .25rem);transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s;display:flex;width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6);align-items:center;justify-content:center}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button:focus{--tw-ring-color: rgba(var(--ax-sys-color-primary-surface))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button:focus{--tw-ring-offset-width: 1px;--tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button:focus{--tw-outline-style: none;outline-style:none}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines{margin-block:calc(var(--spacing, .25rem) * 2);display:flex;flex-direction:column;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines.__expandable-content{overflow:hidden}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines.__expandable-content.__animated{transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .3s;transition-duration:.3s;--tw-ease: var(--ease-in-out, cubic-bezier(.4, 0, .2, 1));transition-timing-function:var(--ease-in-out, cubic-bezier(.4, 0, .2, 1));animation:slideDown .3s ease-out}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines .__action-line{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines .__action-line .__action-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:85%}.axp-activity-log .__content .__feed .__item .__content .__time{padding-inline:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:75%}.axp-activity-log .__content .__feed .__item.__collapsed .__expandable-content{display:none}.axp-activity-log .__content .__feed .__item.__expandable .__header-line{cursor:pointer}@media(min-width:640px){.axp-activity-log .__content .__feed .__item{gap:calc(var(--spacing, .25rem) * 2.5)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line{flex-wrap:nowrap}}@keyframes slideDown{0%{opacity:0;max-height:0;transform:translateY(-10px)}to{opacity:1;max-height:200px;transform:translateY(0)}}@property --tw-space-y-reverse{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ease{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse: 0;--tw-leading: initial;--tw-font-weight: initial;--tw-duration: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-ease: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXCommonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i3.AXTranslatorDirective, selector: "[translate]" }, { kind: "ngmodule", type: AXSkeletonModule }, { kind: "component", type: i2.AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }, { kind: "ngmodule", type: AXFormatModule }, { kind: "ngmodule", type: AXTagModule }, { kind: "ngmodule", type: AXAccordionCdkModule }, { kind: "component", type: AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "titleParams", "descriptionParams", "look"] }, { kind: "component", type: AXPLayoutRendererComponent, selector: "axp-layout-renderer", inputs: ["layout", "context", "look", "mode"], outputs: ["contextChange", "contextInitiated", "validityChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: i4.AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
255
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPActivityLogComponent, isStandalone: true, selector: "axp-activity-log", inputs: { activities: { classPropertyName: "activities", publicName: "activities", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, enableCompare: { classPropertyName: "enableCompare", publicName: "enableCompare", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { compareRequested: "compareRequested" }, ngImport: i0, template: "<div class=\"axp-activity-log accent2\" *translate=\"let t\">\n <!-- Activity Log Content -->\n <div class=\"__content\">\n <!-- Loading State -->\n @if (loading()) {\n <div class=\"__loading\">\n @for (item of [1, 2, 3, 4]; track $index) {\n <div class=\"__item\">\n <ax-skeleton [animated]=\"true\" class=\"__avatar\"></ax-skeleton>\n <div class=\"__content\">\n <ax-skeleton [animated]=\"true\" class=\"__title\"></ax-skeleton>\n <ax-skeleton [animated]=\"true\" class=\"__subtitle\"></ax-skeleton>\n <ax-skeleton [animated]=\"true\" class=\"__description\"></ax-skeleton>\n <ax-skeleton [animated]=\"true\" class=\"__time\"></ax-skeleton>\n </div>\n </div>\n }\n </div>\n }\n\n <!-- Activity Feed -->\n @if (!loading() && activities().length > 0) {\n <div class=\"__feed\">\n @for (activity of activities(); track activity.id) {\n @let changeClasses = getChangeClasses(activity.changeType);\n @let isItemExpanded = isExpanded(activity.id);\n @let hasExpandableContentItem = hasExpandableContent(activity);\n <div class=\"__item\" [class.__collapsed]=\"!isItemExpanded\" [class.__expandable]=\"hasExpandableContentItem\">\n <div class=\"size-10 rounded-full border flex items-center justify-center lightest-surface\">\n <i class=\"{{ changeClasses.icon }} {{ changeClasses.text }} fa-solid\"></i>\n </div>\n\n <!-- Activity Content -->\n <div class=\"__content\">\n <!-- Main Activity Info -->\n <div class=\"__main-info\">\n <!-- User and Action with Toggle Button -->\n <div class=\"__action-line __header-line\" (click)=\"toggleExpanded(activity.id)\">\n <span class=\"__user-name\">{{ activity.user.title }}</span>\n <span class=\"__action-type\">\n {{ t(`@general:actions.${activity.changeType}.title`) | async }}\n </span>\n <span class=\"__action-text\">\n {{ activity.title | translate | async }}\n </span>\n\n <!-- Compare Button -->\n @if (canCompare(activity)) {\n <button type=\"button\" class=\"__compare-button\" (click)=\"handleCompare(activity, $event)\"\n [attr.aria-label]=\"t('compare.title', { scope: i18nScope }) | async\">\n <i class=\"fa-solid fa-code-compare\"></i>\n </button>\n }\n\n <!-- Toggle Button (only show if there's expandable content) -->\n @if (hasExpandableContentItem) {\n <button type=\"button\" class=\"__toggle-button\" [attr.aria-expanded]=\"isItemExpanded\"\n [attr.aria-label]=\"isItemExpanded ? 'Collapse details' : 'Expand details'\">\n <i class=\"fa-solid\" [class.fa-chevron-down]=\"!isItemExpanded\"\n [class.fa-chevron-up]=\"isItemExpanded\"></i>\n </button>\n }\n </div>\n\n <!-- Expandable Description/Changes -->\n @if (hasExpandableContentItem && isItemExpanded && activity.changes.length > 0) {\n <div class=\"__action-lines __expandable-content\" [class.__animated]=\"shouldAnimate(activity.id)\">\n @for (change of activity.changes; track $index) {\n @let changeClasses = getChangeClasses(change.type);\n <div class=\"__action-line\">\n @if (change.layout) {\n <axp-layout-renderer\n [layout]=\"$any(change.layout)\"\n [context]=\"{ change }\"\n mode=\"view\"\n class=\"__history-layout\"\n />\n } @else {\n <div class=\"rounded-full size-7 grid place-items-center\">\n <i class=\"{{ changeClasses.icon }} {{ changeClasses.text }}\"></i>\n </div>\n @if (change.summary) {\n <span class=\"__action-text\">{{ change.summary }}</span>\n } @else if (change.fieldKey && change.actionKey) {\n <span class=\"__action-text\">\n {{ change.fieldKey | translate:(change.fieldKeyParams ?? {}) | async }}: {{ change.actionKey | translate | async }}\n </span>\n } @else {\n <span class=\"__action-text\">{{ change.description | translate | async }}</span>\n }\n }\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Time -->\n <div class=\"__time\">\n {{ activity.date | format: 'datetime' : 'short' | async }}\n </div>\n </div>\n </div>\n }\n </div>\n }\n\n <!-- Empty State -->\n @if (!loading() && activities().length === 0) {\n <axp-state-message icon=\"fa-light fa-history\" [title]=\"'@activity-log:components.activity-log.empty-states.no-history.title'\"\n [description]=\"'@activity-log:components.activity-log.empty-states.no-history.description'\">\n </axp-state-message>\n }\n </div>\n</div>\n\n<!-- \n\nsuccess-surface\nprimary-surface\ndanger-surface\nwarning-surface\ninfo-surface\nmuted-surface\ntext-success\n\n -->", styles: ["@layer properties;.axp-activity-log{height:100%;width:100%}:where(.axp-activity-log .__content .__loading>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing, .25rem) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing, .25rem) * 4) * calc(1 - var(--tw-space-y-reverse)))}.axp-activity-log .__content .__loading .__item{display:flex;align-items:flex-start;gap:calc(var(--spacing, .25rem) * 4)}.axp-activity-log .__content .__loading .__item .__avatar{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);flex-shrink:0;border-radius:calc(infinity * 1px)}.axp-activity-log .__content .__loading .__item .__content{flex:1}:where(.axp-activity-log .__content .__loading .__item .__content>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing, .25rem) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing, .25rem) * 2) * calc(1 - var(--tw-space-y-reverse)))}.axp-activity-log .__content .__loading .__item .__content .__title{height:calc(var(--spacing, .25rem) * 4);width:75%;border-radius:.25rem}.axp-activity-log .__content .__loading .__item .__content .__subtitle{height:calc(var(--spacing, .25rem) * 3);width:50%;border-radius:.25rem}.axp-activity-log .__content .__loading .__item .__content .__description{height:calc(var(--spacing, .25rem) * 3);width:calc(5 / 6 * 100%);border-radius:.25rem}.axp-activity-log .__content .__loading .__item .__content .__time{height:calc(var(--spacing, .25rem) * 3);width:25%;border-radius:.25rem}.axp-activity-log .__content .__feed{position:relative}:where(.axp-activity-log .__content .__feed>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing, .25rem) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing, .25rem) * 6) * calc(1 - var(--tw-space-y-reverse)))}.axp-activity-log .__content .__feed:before{content:\"\";position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 5);top:calc(var(--spacing, .25rem) * 2);bottom:calc(var(--spacing, .25rem) * 2);width:0;border-left:1px solid rgba(var(--ax-sys-color-border-surface));z-index:0}.axp-activity-log .__content .__feed .__item{position:relative;display:flex;align-items:flex-start;gap:calc(var(--spacing, .25rem) * 4)}.axp-activity-log .__content .__feed .__item axp-user-avatar{position:relative;z-index:10}.axp-activity-log .__content .__feed .__item .__content{min-width:0;flex:1}.axp-activity-log .__content .__feed .__item .__content .__main-info{margin-bottom:var(--spacing, .25rem)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line{margin-top:var(--spacing, .25rem);display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing, .25rem);--tw-leading: var(--leading-normal, 1.5);line-height:var(--leading-normal, 1.5)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line .__user-name{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line .__action-type,.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line .__action-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:85%}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line{align-items:center;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line:hover{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button{margin-left:calc(var(--spacing, .25rem) * 2);display:flex;width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6);align-items:center;justify-content:center;border-radius:calc(infinity * 1px);padding:var(--spacing, .25rem);color:rgba(var(--ax-sys-color-primary-surface));transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:hover{background-color:var(--color-primary);color:var(--color-on-primary);border-color:var(--color-border-primary)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:focus{--tw-ring-color: rgba(var(--ax-sys-color-primary-surface))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:focus{--tw-ring-offset-width: 1px;--tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:focus{--tw-outline-style: none;outline-style:none}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button{margin-left:auto;display:flex;width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6);align-items:center;justify-content:center;border-radius:calc(infinity * 1px);padding:var(--spacing, .25rem);transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button:focus{--tw-ring-color: rgba(var(--ax-sys-color-primary-surface))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button:focus{--tw-ring-offset-width: 1px;--tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button:focus{--tw-outline-style: none;outline-style:none}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines{margin-block:calc(var(--spacing, .25rem) * 2);display:flex;flex-direction:column;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines.__expandable-content{overflow:hidden}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines.__expandable-content.__animated{transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .3s;transition-duration:.3s;--tw-ease: var(--ease-in-out, cubic-bezier(.4, 0, .2, 1));transition-timing-function:var(--ease-in-out, cubic-bezier(.4, 0, .2, 1));animation:slideDown .3s ease-out}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines .__action-line{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines .__action-line .__action-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:85%}.axp-activity-log .__content .__feed .__item .__content .__time{padding-inline:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:75%}.axp-activity-log .__content .__feed .__item.__collapsed .__expandable-content{display:none}.axp-activity-log .__content .__feed .__item.__expandable .__header-line{cursor:pointer}@media(min-width:640px){.axp-activity-log .__content .__feed .__item{gap:calc(var(--spacing, .25rem) * 2.5)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line{flex-wrap:nowrap}}@keyframes slideDown{0%{opacity:0;max-height:0;transform:translateY(-10px)}to{opacity:1;max-height:200px;transform:translateY(0)}}@property --tw-space-y-reverse{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ease{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse: 0;--tw-leading: initial;--tw-font-weight: initial;--tw-duration: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-ease: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXCommonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i3.AXTranslatorDirective, selector: "[translate]" }, { kind: "ngmodule", type: AXSkeletonModule }, { kind: "component", type: i2.AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }, { kind: "ngmodule", type: AXFormatModule }, { kind: "ngmodule", type: AXTagModule }, { kind: "ngmodule", type: AXAccordionCdkModule }, { kind: "component", type: AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "titleParams", "descriptionParams", "look"] }, { kind: "component", type: AXPLayoutRendererComponent, selector: "axp-layout-renderer", inputs: ["layout", "context", "look", "mode"], outputs: ["contextChange", "contextInitiated", "validityChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: i4.AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
257
256
  }
258
257
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPActivityLogComponent, decorators: [{
259
258
  type: Component,
@@ -269,7 +268,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
269
268
  AXAccordionCdkModule,
270
269
  AXPStateMessageComponent,
271
270
  AXPLayoutRendererComponent,
272
- ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"axp-activity-log accent2\" *translate=\"let t\">\n <!-- Activity Log Content -->\n <div class=\"__content\">\n <!-- Loading State -->\n @if (loading()) {\n <div class=\"__loading\">\n @for (item of [1, 2, 3, 4]; track $index) {\n <div class=\"__item\">\n <ax-skeleton [animated]=\"true\" class=\"__avatar\"></ax-skeleton>\n <div class=\"__content\">\n <ax-skeleton [animated]=\"true\" class=\"__title\"></ax-skeleton>\n <ax-skeleton [animated]=\"true\" class=\"__subtitle\"></ax-skeleton>\n <ax-skeleton [animated]=\"true\" class=\"__description\"></ax-skeleton>\n <ax-skeleton [animated]=\"true\" class=\"__time\"></ax-skeleton>\n </div>\n </div>\n }\n </div>\n }\n\n <!-- Activity Feed -->\n @if (!loading() && activities().length > 0) {\n <div class=\"__feed\">\n @for (activity of activities(); track activity.id) {\n @let changeClasses = getChangeClasses(activity.changeType);\n @let isItemExpanded = isExpanded(activity.id);\n @let hasExpandableContentItem = hasExpandableContent(activity);\n <div class=\"__item\" [class.__collapsed]=\"!isItemExpanded\" [class.__expandable]=\"hasExpandableContentItem\">\n <div class=\"size-10 rounded-full border flex items-center justify-center lightest-surface\">\n <i class=\"{{ changeClasses.icon }} {{ changeClasses.text }} fa-solid\"></i>\n </div>\n\n <!-- Activity Content -->\n <div class=\"__content\">\n <!-- Main Activity Info -->\n <div class=\"__main-info\">\n <!-- User and Action with Toggle Button -->\n <div class=\"__action-line __header-line\" (click)=\"toggleExpanded(activity.id)\">\n <span class=\"__user-name\">{{ activity.user.title }}</span>\n <span class=\"__action-type\">\n {{ t(`@general:actions.${activity.changeType}.title`) | async }}\n </span>\n <span class=\"__action-text\">\n {{ activity.title | translate | async }}\n </span>\n\n <!-- Compare Button -->\n @if (canCompare(activity)) {\n <button type=\"button\" class=\"__compare-button\" (click)=\"handleCompare(activity, $event)\"\n [attr.aria-label]=\"t('compare.title', { scope: i18nScope }) | async\">\n <i class=\"fa-solid fa-code-compare\"></i>\n </button>\n }\n\n <!-- Toggle Button (only show if there's expandable content) -->\n @if (hasExpandableContentItem) {\n <button type=\"button\" class=\"__toggle-button\" [attr.aria-expanded]=\"isItemExpanded\"\n [attr.aria-label]=\"isItemExpanded ? 'Collapse details' : 'Expand details'\">\n <i class=\"fa-solid\" [class.fa-chevron-down]=\"!isItemExpanded\"\n [class.fa-chevron-up]=\"isItemExpanded\"></i>\n </button>\n }\n </div>\n\n <!-- Expandable Description/Changes -->\n @if (hasExpandableContentItem && isItemExpanded && activity.changes.length > 0) {\n <div class=\"__action-lines __expandable-content\" [class.__animated]=\"shouldAnimate(activity.id)\">\n @for (change of activity.changes; track $index) {\n @let changeClasses = getChangeClasses(change.type);\n <div class=\"__action-line\">\n @if (change.layout) {\n <axp-layout-renderer\n [layout]=\"$any(change.layout)\"\n [context]=\"{ change }\"\n mode=\"view\"\n class=\"__history-layout\"\n />\n } @else {\n <div class=\"rounded-full size-7 grid place-items-center\">\n <i class=\"{{ changeClasses.icon }} {{ changeClasses.text }}\"></i>\n </div>\n @if (change.summary) {\n <span class=\"__action-text\">{{ change.summary }}</span>\n } @else if (change.fieldKey && change.actionKey) {\n <span class=\"__action-text\">\n {{ change.fieldKey | translate:(change.fieldKeyParams ?? {}) | async }}: {{ change.actionKey | translate | async }}\n </span>\n } @else {\n <span class=\"__action-text\">{{ change.description | translate | async }}</span>\n }\n }\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Time -->\n <div class=\"__time\">\n {{ activity.date | format: 'datetime' : 'short' | async }}\n </div>\n </div>\n </div>\n }\n </div>\n }\n\n <!-- Empty State -->\n @if (!loading() && activities().length === 0) {\n <axp-state-message icon=\"fa-light fa-history\" [title]=\"'@activity-log:components.activity-log.empty-states.no-history.title'\"\n [description]=\"'@activity-log:components.activity-log.empty-states.no-history.description'\">\n </axp-state-message>\n }\n </div>\n</div>\n\n<!-- \n\nsuccess-surface\nprimary-surface\ndanger-surface\nwarning-surface\ninfo-surface\nmuted-surface\ntext-success\n\n -->", styles: ["@layer properties;.axp-activity-log{height:100%;width:100%}:where(.axp-activity-log .__content .__loading>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing, .25rem) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing, .25rem) * 4) * calc(1 - var(--tw-space-y-reverse)))}.axp-activity-log .__content .__loading .__item{display:flex;align-items:flex-start;gap:calc(var(--spacing, .25rem) * 4)}.axp-activity-log .__content .__loading .__item .__avatar{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);flex-shrink:0;border-radius:calc(infinity * 1px)}.axp-activity-log .__content .__loading .__item .__content{flex:1}:where(.axp-activity-log .__content .__loading .__item .__content>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing, .25rem) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing, .25rem) * 2) * calc(1 - var(--tw-space-y-reverse)))}.axp-activity-log .__content .__loading .__item .__content .__title{height:calc(var(--spacing, .25rem) * 4);width:75%;border-radius:.25rem}.axp-activity-log .__content .__loading .__item .__content .__subtitle{height:calc(var(--spacing, .25rem) * 3);width:50%;border-radius:.25rem}.axp-activity-log .__content .__loading .__item .__content .__description{height:calc(var(--spacing, .25rem) * 3);width:calc(5 / 6 * 100%);border-radius:.25rem}.axp-activity-log .__content .__loading .__item .__content .__time{height:calc(var(--spacing, .25rem) * 3);width:25%;border-radius:.25rem}.axp-activity-log .__content .__feed{position:relative}:where(.axp-activity-log .__content .__feed>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing, .25rem) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing, .25rem) * 6) * calc(1 - var(--tw-space-y-reverse)))}.axp-activity-log .__content .__feed:before{content:\"\";position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 5);top:calc(var(--spacing, .25rem) * 2);bottom:calc(var(--spacing, .25rem) * 2);width:0;border-left:1px solid rgba(var(--ax-sys-color-border-surface));z-index:0}.axp-activity-log .__content .__feed .__item{position:relative;display:flex;align-items:flex-start;gap:calc(var(--spacing, .25rem) * 4)}.axp-activity-log .__content .__feed .__item axp-user-avatar{position:relative;z-index:10}.axp-activity-log .__content .__feed .__item .__content{min-width:0;flex:1}.axp-activity-log .__content .__feed .__item .__content .__main-info{margin-bottom:var(--spacing, .25rem)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line{margin-top:var(--spacing, .25rem);display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing, .25rem);--tw-leading: var(--leading-normal, 1.5);line-height:var(--leading-normal, 1.5)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line .__user-name{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line .__action-type,.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line .__action-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:85%}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line{align-items:center;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line:hover{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button{margin-left:calc(var(--spacing, .25rem) * 2);border-radius:calc(infinity * 1px);padding:var(--spacing, .25rem);transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s;display:flex;width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6);align-items:center;justify-content:center;color:rgba(var(--ax-sys-color-primary-surface))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:hover{background-color:var(--color-primary);color:var(--color-on-primary);border-color:var(--color-border-primary)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:focus{--tw-ring-color: rgba(var(--ax-sys-color-primary-surface))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:focus{--tw-ring-offset-width: 1px;--tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:focus{--tw-outline-style: none;outline-style:none}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button{margin-left:auto;border-radius:calc(infinity * 1px);padding:var(--spacing, .25rem);transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s;display:flex;width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6);align-items:center;justify-content:center}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button:focus{--tw-ring-color: rgba(var(--ax-sys-color-primary-surface))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button:focus{--tw-ring-offset-width: 1px;--tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button:focus{--tw-outline-style: none;outline-style:none}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines{margin-block:calc(var(--spacing, .25rem) * 2);display:flex;flex-direction:column;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines.__expandable-content{overflow:hidden}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines.__expandable-content.__animated{transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .3s;transition-duration:.3s;--tw-ease: var(--ease-in-out, cubic-bezier(.4, 0, .2, 1));transition-timing-function:var(--ease-in-out, cubic-bezier(.4, 0, .2, 1));animation:slideDown .3s ease-out}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines .__action-line{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines .__action-line .__action-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:85%}.axp-activity-log .__content .__feed .__item .__content .__time{padding-inline:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:75%}.axp-activity-log .__content .__feed .__item.__collapsed .__expandable-content{display:none}.axp-activity-log .__content .__feed .__item.__expandable .__header-line{cursor:pointer}@media(min-width:640px){.axp-activity-log .__content .__feed .__item{gap:calc(var(--spacing, .25rem) * 2.5)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line{flex-wrap:nowrap}}@keyframes slideDown{0%{opacity:0;max-height:0;transform:translateY(-10px)}to{opacity:1;max-height:200px;transform:translateY(0)}}@property --tw-space-y-reverse{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ease{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse: 0;--tw-leading: initial;--tw-font-weight: initial;--tw-duration: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-ease: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
271
+ ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"axp-activity-log accent2\" *translate=\"let t\">\n <!-- Activity Log Content -->\n <div class=\"__content\">\n <!-- Loading State -->\n @if (loading()) {\n <div class=\"__loading\">\n @for (item of [1, 2, 3, 4]; track $index) {\n <div class=\"__item\">\n <ax-skeleton [animated]=\"true\" class=\"__avatar\"></ax-skeleton>\n <div class=\"__content\">\n <ax-skeleton [animated]=\"true\" class=\"__title\"></ax-skeleton>\n <ax-skeleton [animated]=\"true\" class=\"__subtitle\"></ax-skeleton>\n <ax-skeleton [animated]=\"true\" class=\"__description\"></ax-skeleton>\n <ax-skeleton [animated]=\"true\" class=\"__time\"></ax-skeleton>\n </div>\n </div>\n }\n </div>\n }\n\n <!-- Activity Feed -->\n @if (!loading() && activities().length > 0) {\n <div class=\"__feed\">\n @for (activity of activities(); track activity.id) {\n @let changeClasses = getChangeClasses(activity.changeType);\n @let isItemExpanded = isExpanded(activity.id);\n @let hasExpandableContentItem = hasExpandableContent(activity);\n <div class=\"__item\" [class.__collapsed]=\"!isItemExpanded\" [class.__expandable]=\"hasExpandableContentItem\">\n <div class=\"size-10 rounded-full border flex items-center justify-center lightest-surface\">\n <i class=\"{{ changeClasses.icon }} {{ changeClasses.text }} fa-solid\"></i>\n </div>\n\n <!-- Activity Content -->\n <div class=\"__content\">\n <!-- Main Activity Info -->\n <div class=\"__main-info\">\n <!-- User and Action with Toggle Button -->\n <div class=\"__action-line __header-line\" (click)=\"toggleExpanded(activity.id)\">\n <span class=\"__user-name\">{{ activity.user.title }}</span>\n <span class=\"__action-type\">\n {{ t(`@general:actions.${activity.changeType}.title`) | async }}\n </span>\n <span class=\"__action-text\">\n {{ activity.title | translate | async }}\n </span>\n\n <!-- Compare Button -->\n @if (canCompare(activity)) {\n <button type=\"button\" class=\"__compare-button\" (click)=\"handleCompare(activity, $event)\"\n [attr.aria-label]=\"t('compare.title', { scope: i18nScope }) | async\">\n <i class=\"fa-solid fa-code-compare\"></i>\n </button>\n }\n\n <!-- Toggle Button (only show if there's expandable content) -->\n @if (hasExpandableContentItem) {\n <button type=\"button\" class=\"__toggle-button\" [attr.aria-expanded]=\"isItemExpanded\"\n [attr.aria-label]=\"isItemExpanded ? 'Collapse details' : 'Expand details'\">\n <i class=\"fa-solid\" [class.fa-chevron-down]=\"!isItemExpanded\"\n [class.fa-chevron-up]=\"isItemExpanded\"></i>\n </button>\n }\n </div>\n\n <!-- Expandable Description/Changes -->\n @if (hasExpandableContentItem && isItemExpanded && activity.changes.length > 0) {\n <div class=\"__action-lines __expandable-content\" [class.__animated]=\"shouldAnimate(activity.id)\">\n @for (change of activity.changes; track $index) {\n @let changeClasses = getChangeClasses(change.type);\n <div class=\"__action-line\">\n @if (change.layout) {\n <axp-layout-renderer\n [layout]=\"$any(change.layout)\"\n [context]=\"{ change }\"\n mode=\"view\"\n class=\"__history-layout\"\n />\n } @else {\n <div class=\"rounded-full size-7 grid place-items-center\">\n <i class=\"{{ changeClasses.icon }} {{ changeClasses.text }}\"></i>\n </div>\n @if (change.summary) {\n <span class=\"__action-text\">{{ change.summary }}</span>\n } @else if (change.fieldKey && change.actionKey) {\n <span class=\"__action-text\">\n {{ change.fieldKey | translate:(change.fieldKeyParams ?? {}) | async }}: {{ change.actionKey | translate | async }}\n </span>\n } @else {\n <span class=\"__action-text\">{{ change.description | translate | async }}</span>\n }\n }\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Time -->\n <div class=\"__time\">\n {{ activity.date | format: 'datetime' : 'short' | async }}\n </div>\n </div>\n </div>\n }\n </div>\n }\n\n <!-- Empty State -->\n @if (!loading() && activities().length === 0) {\n <axp-state-message icon=\"fa-light fa-history\" [title]=\"'@activity-log:components.activity-log.empty-states.no-history.title'\"\n [description]=\"'@activity-log:components.activity-log.empty-states.no-history.description'\">\n </axp-state-message>\n }\n </div>\n</div>\n\n<!-- \n\nsuccess-surface\nprimary-surface\ndanger-surface\nwarning-surface\ninfo-surface\nmuted-surface\ntext-success\n\n -->", styles: ["@layer properties;.axp-activity-log{height:100%;width:100%}:where(.axp-activity-log .__content .__loading>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing, .25rem) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing, .25rem) * 4) * calc(1 - var(--tw-space-y-reverse)))}.axp-activity-log .__content .__loading .__item{display:flex;align-items:flex-start;gap:calc(var(--spacing, .25rem) * 4)}.axp-activity-log .__content .__loading .__item .__avatar{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);flex-shrink:0;border-radius:calc(infinity * 1px)}.axp-activity-log .__content .__loading .__item .__content{flex:1}:where(.axp-activity-log .__content .__loading .__item .__content>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing, .25rem) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing, .25rem) * 2) * calc(1 - var(--tw-space-y-reverse)))}.axp-activity-log .__content .__loading .__item .__content .__title{height:calc(var(--spacing, .25rem) * 4);width:75%;border-radius:.25rem}.axp-activity-log .__content .__loading .__item .__content .__subtitle{height:calc(var(--spacing, .25rem) * 3);width:50%;border-radius:.25rem}.axp-activity-log .__content .__loading .__item .__content .__description{height:calc(var(--spacing, .25rem) * 3);width:calc(5 / 6 * 100%);border-radius:.25rem}.axp-activity-log .__content .__loading .__item .__content .__time{height:calc(var(--spacing, .25rem) * 3);width:25%;border-radius:.25rem}.axp-activity-log .__content .__feed{position:relative}:where(.axp-activity-log .__content .__feed>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing, .25rem) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing, .25rem) * 6) * calc(1 - var(--tw-space-y-reverse)))}.axp-activity-log .__content .__feed:before{content:\"\";position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 5);top:calc(var(--spacing, .25rem) * 2);bottom:calc(var(--spacing, .25rem) * 2);width:0;border-left:1px solid rgba(var(--ax-sys-color-border-surface));z-index:0}.axp-activity-log .__content .__feed .__item{position:relative;display:flex;align-items:flex-start;gap:calc(var(--spacing, .25rem) * 4)}.axp-activity-log .__content .__feed .__item axp-user-avatar{position:relative;z-index:10}.axp-activity-log .__content .__feed .__item .__content{min-width:0;flex:1}.axp-activity-log .__content .__feed .__item .__content .__main-info{margin-bottom:var(--spacing, .25rem)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line{margin-top:var(--spacing, .25rem);display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing, .25rem);--tw-leading: var(--leading-normal, 1.5);line-height:var(--leading-normal, 1.5)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line .__user-name{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line .__action-type,.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line .__action-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:85%}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line{align-items:center;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line:hover{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button{margin-left:calc(var(--spacing, .25rem) * 2);display:flex;width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6);align-items:center;justify-content:center;border-radius:calc(infinity * 1px);padding:var(--spacing, .25rem);color:rgba(var(--ax-sys-color-primary-surface));transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:hover{background-color:var(--color-primary);color:var(--color-on-primary);border-color:var(--color-border-primary)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:focus{--tw-ring-color: rgba(var(--ax-sys-color-primary-surface))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:focus{--tw-ring-offset-width: 1px;--tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button:focus{--tw-outline-style: none;outline-style:none}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__compare-button i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button{margin-left:auto;display:flex;width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6);align-items:center;justify-content:center;border-radius:calc(infinity * 1px);padding:var(--spacing, .25rem);transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button:focus{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button:focus{--tw-ring-color: rgba(var(--ax-sys-color-primary-surface))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button:focus{--tw-ring-offset-width: 1px;--tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button:focus{--tw-outline-style: none;outline-style:none}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line.__header-line .__toggle-button i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines{margin-block:calc(var(--spacing, .25rem) * 2);display:flex;flex-direction:column;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines.__expandable-content{overflow:hidden}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines.__expandable-content.__animated{transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .3s;transition-duration:.3s;--tw-ease: var(--ease-in-out, cubic-bezier(.4, 0, .2, 1));transition-timing-function:var(--ease-in-out, cubic-bezier(.4, 0, .2, 1));animation:slideDown .3s ease-out}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines .__action-line{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-lines .__action-line .__action-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:85%}.axp-activity-log .__content .__feed .__item .__content .__time{padding-inline:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:75%}.axp-activity-log .__content .__feed .__item.__collapsed .__expandable-content{display:none}.axp-activity-log .__content .__feed .__item.__expandable .__header-line{cursor:pointer}@media(min-width:640px){.axp-activity-log .__content .__feed .__item{gap:calc(var(--spacing, .25rem) * 2.5)}.axp-activity-log .__content .__feed .__item .__content .__main-info .__action-line{flex-wrap:nowrap}}@keyframes slideDown{0%{opacity:0;max-height:0;transform:translateY(-10px)}to{opacity:1;max-height:200px;transform:translateY(0)}}@property --tw-space-y-reverse{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ease{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse: 0;--tw-leading: initial;--tw-font-weight: initial;--tw-duration: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-ease: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
273
272
  }], ctorParameters: () => [], propDecorators: { activities: [{ type: i0.Input, args: [{ isSignal: true, alias: "activities", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], enableCompare: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableCompare", required: false }] }], compareRequested: [{ type: i0.Output, args: ["compareRequested"] }] } });
274
273
 
275
274
  //#region ---- Imports ----
@@ -1201,7 +1200,7 @@ class AXPCategoryTreeComponent {
1201
1200
  this.isLoading.set(false);
1202
1201
  }
1203
1202
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPCategoryTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1204
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPCategoryTreeComponent, isStandalone: true, selector: "axp-category-tree", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, events: { classPropertyName: "events", publicName: "events", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { nodeClick: "nodeClick", nodeSelect: "nodeSelect", nodeCreate: "nodeCreate", nodeUpdate: "nodeUpdate", nodeDelete: "nodeDelete", searchChange: "searchChange", collapseChange: "collapseChange" }, viewQueries: [{ propertyName: "tree", first: true, predicate: ["tree"], descendants: true, isSignal: true }], ngImport: i0, template: "<axp-layout-header>\n <axp-layout-toolbar>\n @if (config().searchable) {\n <ax-search-box\n (onValueChanged)=\"handleSearchChange($event)\"\n [delayTime]=\"300\"\n [placeholder]=\"config().searchPlaceholder! | translate | async\"\n >\n </ax-search-box>\n }\n </axp-layout-toolbar>\n</axp-layout-header>\n\n<axp-layout-content>\n @if (isLoading()) {\n <div class=\"p-4 flex flex-col gap-3\" [class.pt-2]=\"config().searchable\">\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n </div>\n } @else if (treeItems()[0].children?.length) {\n <div\n class=\"px-4 flex-1 min-h-0 min-w-0 overflow-y-auto overflow-x-hidden\"\n [class.pt-2]=\"config().searchable\"\n >\n <ax-tree-view\n [datasource]=\"datasource\"\n [selectMode]=\"config().showCheckbox ? 'multiple' : 'none'\"\n [dragBehavior]=\"'none'\"\n [showIcons]=\"false\"\n [showChildrenBadge]=\"false\"\n (onNodeClick)=\"handleNodeClick($event)\"\n (onNodeToggle)=\"handleNodeToggle($event)\"\n [nodeTemplate]=\"itemTemplate\"\n [titleField]=\"config().textField || 'title'\"\n [idField]=\"config().valueField || 'id'\"\n [expandedField]=\"config().expandedField || 'expand'\"\n #tree\n >\n </ax-tree-view>\n </div>\n } @else {\n <axp-state-message\n [icon]=\"config().emptyStateIcon || 'fa-light fa-folder-open'\"\n [title]=\"emptyStateTitle()\"\n [titleParams]=\"emptyStateTitleParams()\"\n [description]=\"emptyStateDescription()\"\n >\n @if (actions().canCreate) {\n <ax-button\n slot=\"actions\"\n (onClick)=\"handleCreateRootClick($event)\"\n look=\"solid\"\n color=\"primary\"\n [text]=\"\n (actions().createLabel || '@general:actions.add-new.title'\n | translate\n | async)!\n \"\n >\n <ax-icon class=\"fas fa-plus\"></ax-icon>\n </ax-button>\n }\n </axp-state-message>\n }\n\n <ng-template #itemTemplate let-node=\"node\">\n @let item = node;\n @let textField = config().textField || 'title';\n @let rawTitle = item[textField] ?? item.title;\n <div class=\"flex items-center justify-between w-full gap-2 overflow-hidden\">\n <div class=\"flex items-center gap-2 min-w-0\">\n <ax-icon class=\"fas text-warning fa-folder\"></ax-icon>\n <span class=\"truncate\">\n @if (item.id === 'root') {\n {{ categoryTreeRootTitleI18nKey | translate | async }}\n } @else {\n {{ rawTitle | translate | async }}\n }\n </span>\n </div>\n @if (item.id && item.id !== 'root') {\n @if (\n actions().canCreateChild || actions().canUpdate || actions().canDelete\n ) {\n <div class=\"flex items-center gap-1\">\n <ax-button\n class=\"ax-sm\"\n color=\"default\"\n look=\"blank\"\n (onClick)=\"$event.nativeEvent.stopPropagation()\"\n >\n <ax-icon class=\"fas fa-ellipsis-v\"></ax-icon>\n <ax-dropdown-panel>\n <ax-button-item-list>\n @if (actions().canCreateChild) {\n <ax-button-item\n (onClick)=\"handleCreateChildClick(item, $event)\"\n look=\"blank\"\n color=\"default\"\n [text]=\"\n (actions().createChildLabel ||\n '@general:actions.add-new-child.title'\n | translate\n | async)!\n \"\n >\n <ax-icon class=\"fas fa-plus\"></ax-icon>\n </ax-button-item>\n }\n @if (actions().canUpdate) {\n <ax-button-item\n (onClick)=\"handleUpdateNodeClick(item, $event)\"\n look=\"blank\"\n [text]=\"\n (actions().updateLabel || '@general:actions.edit.title'\n | translate\n | async)!\n \"\n >\n <ax-icon class=\"fas fa-pen\"></ax-icon>\n </ax-button-item>\n }\n @if (actions().canDelete) {\n <ax-button-item\n (onClick)=\"handleDeleteNodeClick(item, $event)\"\n color=\"danger\"\n look=\"blank\"\n [text]=\"\n (actions().deleteLabel ||\n '@general:actions.delete.title'\n | translate\n | async)!\n \"\n >\n <ax-icon class=\"fas fa-trash\"></ax-icon>\n </ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-panel>\n </ax-button>\n </div>\n }\n } @else if (item.id === 'root' && actions().canCreate) {\n <div class=\"flex items-center gap-1\">\n <ax-button\n class=\"ax-sm\"\n (onClick)=\"handleCreateRootClick($event)\"\n look=\"blank\"\n color=\"default\"\n >\n <ax-icon class=\"fas fa-plus\"></ax-icon>\n </ax-button>\n </div>\n }\n </div>\n </ng-template>\n</axp-layout-content>\n", styles: [":host{display:flex;flex-direction:column;height:100%;min-height:0;min-width:0;overflow:hidden}axp-layout-content{display:flex;flex:1;flex-direction:column;min-height:0;min-width:0;overflow:hidden}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXTreeViewComponent, selector: "ax-tree-view", inputs: ["datasource", "selectMode", "selectionBehavior", "dragArea", "dragBehavior", "showIcons", "showChildrenBadge", "expandedIcon", "collapsedIcon", "indentSize", "look", "nodeTemplate", "idField", "titleField", "tooltipField", "iconField", "expandedField", "selectedField", "indeterminateField", "disabledField", "hiddenField", "childrenField", "childrenCountField", "dataField", "inheritDisabled", "expandOnDoubleClick", "doubleClickDuration", "tooltipDelay", "controlledSelection", "selectedIds"], outputs: ["datasourceChange", "selectedIdsChange", "onBeforeDrop", "onNodeToggle", "onNodeSelect", "onNodeDoubleClick", "onNodeClick", "onSelectionChange", "onOrderChange", "onMoveChange", "onItemsChange"] }, { kind: "ngmodule", type: AXSkeletonModule }, { kind: "component", type: i2.AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }, { 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: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i5.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "component", type: AXPThemeLayoutHeaderComponent, selector: "axp-layout-header" }, { kind: "component", type: AXPThemeLayoutToolbarComponent, selector: "axp-layout-toolbar" }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: i1$2.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1$2.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i5$1.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "placement", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "titleParams", "descriptionParams", "look"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
1203
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPCategoryTreeComponent, isStandalone: true, selector: "axp-category-tree", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, events: { classPropertyName: "events", publicName: "events", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { nodeClick: "nodeClick", nodeSelect: "nodeSelect", nodeCreate: "nodeCreate", nodeUpdate: "nodeUpdate", nodeDelete: "nodeDelete", searchChange: "searchChange", collapseChange: "collapseChange" }, viewQueries: [{ propertyName: "tree", first: true, predicate: ["tree"], descendants: true, isSignal: true }], ngImport: i0, template: "<axp-layout-header>\n <axp-layout-toolbar>\n @if (config().searchable) {\n <ax-search-box\n (onValueChanged)=\"handleSearchChange($event)\"\n [delayTime]=\"300\"\n [placeholder]=\"config().searchPlaceholder! | translate | async\"\n >\n </ax-search-box>\n }\n </axp-layout-toolbar>\n</axp-layout-header>\n\n<axp-layout-content>\n @if (isLoading()) {\n <div class=\"p-4 flex flex-col gap-3\" [class.pt-2]=\"config().searchable\">\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n </div>\n } @else if (treeItems()[0].children?.length) {\n <div\n class=\"px-4 flex-1 min-h-0 min-w-0 overflow-y-auto overflow-x-hidden\"\n [class.pt-2]=\"config().searchable\"\n >\n <ax-tree-view\n [datasource]=\"datasource\"\n [selectMode]=\"config().showCheckbox ? 'multiple' : 'none'\"\n [dragBehavior]=\"'none'\"\n [showIcons]=\"false\"\n [showChildrenBadge]=\"false\"\n (onNodeClick)=\"handleNodeClick($event)\"\n (onNodeToggle)=\"handleNodeToggle($event)\"\n [nodeTemplate]=\"itemTemplate\"\n [titleField]=\"config().textField || 'title'\"\n [idField]=\"config().valueField || 'id'\"\n [expandedField]=\"config().expandedField || 'expand'\"\n #tree\n >\n </ax-tree-view>\n </div>\n } @else {\n <axp-state-message\n [icon]=\"config().emptyStateIcon || 'fa-light fa-folder-open'\"\n [title]=\"emptyStateTitle()\"\n [titleParams]=\"emptyStateTitleParams()\"\n [description]=\"emptyStateDescription()\"\n >\n @if (actions().canCreate) {\n <ax-button\n slot=\"actions\"\n (onClick)=\"handleCreateRootClick($event)\"\n look=\"solid\"\n color=\"primary\"\n [text]=\"\n (actions().createLabel || '@general:actions.add-new.title'\n | translate\n | async)!\n \"\n >\n <ax-icon class=\"fas fa-plus\"></ax-icon>\n </ax-button>\n }\n </axp-state-message>\n }\n\n <ng-template #itemTemplate let-node=\"node\">\n @let item = node;\n @let textField = config().textField || 'title';\n @let rawTitle = item[textField] ?? item.title;\n <div class=\"flex items-center justify-between w-full gap-2 overflow-hidden\">\n <div class=\"flex items-center gap-2 min-w-0\">\n <ax-icon class=\"fas text-warning fa-folder\"></ax-icon>\n <span class=\"truncate\">\n @if (item.id === 'root') {\n {{ categoryTreeRootTitleI18nKey | translate | async }}\n } @else {\n {{ rawTitle | translate | async }}\n }\n </span>\n </div>\n @if (item.id && item.id !== 'root') {\n @if (\n actions().canCreateChild || actions().canUpdate || actions().canDelete\n ) {\n <div class=\"flex items-center gap-1\">\n <ax-button\n class=\"ax-xs\"\n color=\"default\"\n look=\"none\"\n (onClick)=\"$event.nativeEvent.stopPropagation()\"\n >\n <ax-icon class=\"fas fa-ellipsis-v\"></ax-icon>\n <ax-dropdown-panel>\n <ax-button-item-list>\n @if (actions().canCreateChild) {\n <ax-button-item\n (onClick)=\"handleCreateChildClick(item, $event)\"\n look=\"blank\"\n color=\"default\"\n [text]=\"\n (actions().createChildLabel ||\n '@general:actions.add-new-child.title'\n | translate\n | async)!\n \"\n >\n <ax-icon class=\"fas fa-plus\"></ax-icon>\n </ax-button-item>\n }\n @if (actions().canUpdate) {\n <ax-button-item\n (onClick)=\"handleUpdateNodeClick(item, $event)\"\n look=\"blank\"\n [text]=\"\n (actions().updateLabel || '@general:actions.edit.title'\n | translate\n | async)!\n \"\n >\n <ax-icon class=\"fas fa-pen\"></ax-icon>\n </ax-button-item>\n }\n @if (actions().canDelete) {\n <ax-button-item\n (onClick)=\"handleDeleteNodeClick(item, $event)\"\n color=\"danger\"\n look=\"blank\"\n [text]=\"\n (actions().deleteLabel ||\n '@general:actions.delete.title'\n | translate\n | async)!\n \"\n >\n <ax-icon class=\"fas fa-trash\"></ax-icon>\n </ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-panel>\n </ax-button>\n </div>\n }\n } @else if (item.id === 'root' && actions().canCreate) {\n <div class=\"flex items-center gap-1\">\n <ax-button\n class=\"ax-sm\"\n (onClick)=\"handleCreateRootClick($event)\"\n look=\"blank\"\n color=\"default\"\n >\n <ax-icon class=\"fas fa-plus\"></ax-icon>\n </ax-button>\n </div>\n }\n </div>\n </ng-template>\n</axp-layout-content>\n", styles: [":host{display:block;height:100%;width:100%}:host axp-layout-content{display:flex;min-height:0;min-width:0;flex:1;flex-direction:column;overflow:hidden}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXTreeViewComponent, selector: "ax-tree-view", inputs: ["datasource", "selectMode", "selectionBehavior", "dragArea", "dragBehavior", "showIcons", "showChildrenBadge", "expandedIcon", "collapsedIcon", "indentSize", "look", "nodeTemplate", "idField", "titleField", "tooltipField", "iconField", "expandedField", "selectedField", "indeterminateField", "disabledField", "hiddenField", "childrenField", "childrenCountField", "dataField", "inheritDisabled", "expandOnDoubleClick", "doubleClickDuration", "tooltipDelay", "controlledSelection", "selectedIds"], outputs: ["datasourceChange", "selectedIdsChange", "onBeforeDrop", "onNodeToggle", "onNodeSelect", "onNodeDoubleClick", "onNodeClick", "onSelectionChange", "onOrderChange", "onMoveChange", "onItemsChange"] }, { kind: "ngmodule", type: AXSkeletonModule }, { kind: "component", type: i2.AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }, { 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: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i5.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "component", type: AXPThemeLayoutHeaderComponent, selector: "axp-layout-header" }, { kind: "component", type: AXPThemeLayoutToolbarComponent, selector: "axp-layout-toolbar" }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: i1$2.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1$2.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i5$1.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "placement", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "titleParams", "descriptionParams", "look"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
1205
1204
  }
1206
1205
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPCategoryTreeComponent, decorators: [{
1207
1206
  type: Component,
@@ -1218,7 +1217,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
1218
1217
  AXButtonModule,
1219
1218
  AXDropdownModule,
1220
1219
  AXPStateMessageComponent,
1221
- ], template: "<axp-layout-header>\n <axp-layout-toolbar>\n @if (config().searchable) {\n <ax-search-box\n (onValueChanged)=\"handleSearchChange($event)\"\n [delayTime]=\"300\"\n [placeholder]=\"config().searchPlaceholder! | translate | async\"\n >\n </ax-search-box>\n }\n </axp-layout-toolbar>\n</axp-layout-header>\n\n<axp-layout-content>\n @if (isLoading()) {\n <div class=\"p-4 flex flex-col gap-3\" [class.pt-2]=\"config().searchable\">\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n </div>\n } @else if (treeItems()[0].children?.length) {\n <div\n class=\"px-4 flex-1 min-h-0 min-w-0 overflow-y-auto overflow-x-hidden\"\n [class.pt-2]=\"config().searchable\"\n >\n <ax-tree-view\n [datasource]=\"datasource\"\n [selectMode]=\"config().showCheckbox ? 'multiple' : 'none'\"\n [dragBehavior]=\"'none'\"\n [showIcons]=\"false\"\n [showChildrenBadge]=\"false\"\n (onNodeClick)=\"handleNodeClick($event)\"\n (onNodeToggle)=\"handleNodeToggle($event)\"\n [nodeTemplate]=\"itemTemplate\"\n [titleField]=\"config().textField || 'title'\"\n [idField]=\"config().valueField || 'id'\"\n [expandedField]=\"config().expandedField || 'expand'\"\n #tree\n >\n </ax-tree-view>\n </div>\n } @else {\n <axp-state-message\n [icon]=\"config().emptyStateIcon || 'fa-light fa-folder-open'\"\n [title]=\"emptyStateTitle()\"\n [titleParams]=\"emptyStateTitleParams()\"\n [description]=\"emptyStateDescription()\"\n >\n @if (actions().canCreate) {\n <ax-button\n slot=\"actions\"\n (onClick)=\"handleCreateRootClick($event)\"\n look=\"solid\"\n color=\"primary\"\n [text]=\"\n (actions().createLabel || '@general:actions.add-new.title'\n | translate\n | async)!\n \"\n >\n <ax-icon class=\"fas fa-plus\"></ax-icon>\n </ax-button>\n }\n </axp-state-message>\n }\n\n <ng-template #itemTemplate let-node=\"node\">\n @let item = node;\n @let textField = config().textField || 'title';\n @let rawTitle = item[textField] ?? item.title;\n <div class=\"flex items-center justify-between w-full gap-2 overflow-hidden\">\n <div class=\"flex items-center gap-2 min-w-0\">\n <ax-icon class=\"fas text-warning fa-folder\"></ax-icon>\n <span class=\"truncate\">\n @if (item.id === 'root') {\n {{ categoryTreeRootTitleI18nKey | translate | async }}\n } @else {\n {{ rawTitle | translate | async }}\n }\n </span>\n </div>\n @if (item.id && item.id !== 'root') {\n @if (\n actions().canCreateChild || actions().canUpdate || actions().canDelete\n ) {\n <div class=\"flex items-center gap-1\">\n <ax-button\n class=\"ax-sm\"\n color=\"default\"\n look=\"blank\"\n (onClick)=\"$event.nativeEvent.stopPropagation()\"\n >\n <ax-icon class=\"fas fa-ellipsis-v\"></ax-icon>\n <ax-dropdown-panel>\n <ax-button-item-list>\n @if (actions().canCreateChild) {\n <ax-button-item\n (onClick)=\"handleCreateChildClick(item, $event)\"\n look=\"blank\"\n color=\"default\"\n [text]=\"\n (actions().createChildLabel ||\n '@general:actions.add-new-child.title'\n | translate\n | async)!\n \"\n >\n <ax-icon class=\"fas fa-plus\"></ax-icon>\n </ax-button-item>\n }\n @if (actions().canUpdate) {\n <ax-button-item\n (onClick)=\"handleUpdateNodeClick(item, $event)\"\n look=\"blank\"\n [text]=\"\n (actions().updateLabel || '@general:actions.edit.title'\n | translate\n | async)!\n \"\n >\n <ax-icon class=\"fas fa-pen\"></ax-icon>\n </ax-button-item>\n }\n @if (actions().canDelete) {\n <ax-button-item\n (onClick)=\"handleDeleteNodeClick(item, $event)\"\n color=\"danger\"\n look=\"blank\"\n [text]=\"\n (actions().deleteLabel ||\n '@general:actions.delete.title'\n | translate\n | async)!\n \"\n >\n <ax-icon class=\"fas fa-trash\"></ax-icon>\n </ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-panel>\n </ax-button>\n </div>\n }\n } @else if (item.id === 'root' && actions().canCreate) {\n <div class=\"flex items-center gap-1\">\n <ax-button\n class=\"ax-sm\"\n (onClick)=\"handleCreateRootClick($event)\"\n look=\"blank\"\n color=\"default\"\n >\n <ax-icon class=\"fas fa-plus\"></ax-icon>\n </ax-button>\n </div>\n }\n </div>\n </ng-template>\n</axp-layout-content>\n", styles: [":host{display:flex;flex-direction:column;height:100%;min-height:0;min-width:0;overflow:hidden}axp-layout-content{display:flex;flex:1;flex-direction:column;min-height:0;min-width:0;overflow:hidden}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
1220
+ ], template: "<axp-layout-header>\n <axp-layout-toolbar>\n @if (config().searchable) {\n <ax-search-box\n (onValueChanged)=\"handleSearchChange($event)\"\n [delayTime]=\"300\"\n [placeholder]=\"config().searchPlaceholder! | translate | async\"\n >\n </ax-search-box>\n }\n </axp-layout-toolbar>\n</axp-layout-header>\n\n<axp-layout-content>\n @if (isLoading()) {\n <div class=\"p-4 flex flex-col gap-3\" [class.pt-2]=\"config().searchable\">\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n <ax-skeleton class=\"w-full h-6 rounded-md\"></ax-skeleton>\n </div>\n } @else if (treeItems()[0].children?.length) {\n <div\n class=\"px-4 flex-1 min-h-0 min-w-0 overflow-y-auto overflow-x-hidden\"\n [class.pt-2]=\"config().searchable\"\n >\n <ax-tree-view\n [datasource]=\"datasource\"\n [selectMode]=\"config().showCheckbox ? 'multiple' : 'none'\"\n [dragBehavior]=\"'none'\"\n [showIcons]=\"false\"\n [showChildrenBadge]=\"false\"\n (onNodeClick)=\"handleNodeClick($event)\"\n (onNodeToggle)=\"handleNodeToggle($event)\"\n [nodeTemplate]=\"itemTemplate\"\n [titleField]=\"config().textField || 'title'\"\n [idField]=\"config().valueField || 'id'\"\n [expandedField]=\"config().expandedField || 'expand'\"\n #tree\n >\n </ax-tree-view>\n </div>\n } @else {\n <axp-state-message\n [icon]=\"config().emptyStateIcon || 'fa-light fa-folder-open'\"\n [title]=\"emptyStateTitle()\"\n [titleParams]=\"emptyStateTitleParams()\"\n [description]=\"emptyStateDescription()\"\n >\n @if (actions().canCreate) {\n <ax-button\n slot=\"actions\"\n (onClick)=\"handleCreateRootClick($event)\"\n look=\"solid\"\n color=\"primary\"\n [text]=\"\n (actions().createLabel || '@general:actions.add-new.title'\n | translate\n | async)!\n \"\n >\n <ax-icon class=\"fas fa-plus\"></ax-icon>\n </ax-button>\n }\n </axp-state-message>\n }\n\n <ng-template #itemTemplate let-node=\"node\">\n @let item = node;\n @let textField = config().textField || 'title';\n @let rawTitle = item[textField] ?? item.title;\n <div class=\"flex items-center justify-between w-full gap-2 overflow-hidden\">\n <div class=\"flex items-center gap-2 min-w-0\">\n <ax-icon class=\"fas text-warning fa-folder\"></ax-icon>\n <span class=\"truncate\">\n @if (item.id === 'root') {\n {{ categoryTreeRootTitleI18nKey | translate | async }}\n } @else {\n {{ rawTitle | translate | async }}\n }\n </span>\n </div>\n @if (item.id && item.id !== 'root') {\n @if (\n actions().canCreateChild || actions().canUpdate || actions().canDelete\n ) {\n <div class=\"flex items-center gap-1\">\n <ax-button\n class=\"ax-xs\"\n color=\"default\"\n look=\"none\"\n (onClick)=\"$event.nativeEvent.stopPropagation()\"\n >\n <ax-icon class=\"fas fa-ellipsis-v\"></ax-icon>\n <ax-dropdown-panel>\n <ax-button-item-list>\n @if (actions().canCreateChild) {\n <ax-button-item\n (onClick)=\"handleCreateChildClick(item, $event)\"\n look=\"blank\"\n color=\"default\"\n [text]=\"\n (actions().createChildLabel ||\n '@general:actions.add-new-child.title'\n | translate\n | async)!\n \"\n >\n <ax-icon class=\"fas fa-plus\"></ax-icon>\n </ax-button-item>\n }\n @if (actions().canUpdate) {\n <ax-button-item\n (onClick)=\"handleUpdateNodeClick(item, $event)\"\n look=\"blank\"\n [text]=\"\n (actions().updateLabel || '@general:actions.edit.title'\n | translate\n | async)!\n \"\n >\n <ax-icon class=\"fas fa-pen\"></ax-icon>\n </ax-button-item>\n }\n @if (actions().canDelete) {\n <ax-button-item\n (onClick)=\"handleDeleteNodeClick(item, $event)\"\n color=\"danger\"\n look=\"blank\"\n [text]=\"\n (actions().deleteLabel ||\n '@general:actions.delete.title'\n | translate\n | async)!\n \"\n >\n <ax-icon class=\"fas fa-trash\"></ax-icon>\n </ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-panel>\n </ax-button>\n </div>\n }\n } @else if (item.id === 'root' && actions().canCreate) {\n <div class=\"flex items-center gap-1\">\n <ax-button\n class=\"ax-sm\"\n (onClick)=\"handleCreateRootClick($event)\"\n look=\"blank\"\n color=\"default\"\n >\n <ax-icon class=\"fas fa-plus\"></ax-icon>\n </ax-button>\n </div>\n }\n </div>\n </ng-template>\n</axp-layout-content>\n", styles: [":host{display:block;height:100%;width:100%}:host axp-layout-content{display:flex;min-height:0;min-width:0;flex:1;flex-direction:column;overflow:hidden}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
1222
1221
  }], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }], config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: false }] }], actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], events: [{ type: i0.Input, args: [{ isSignal: true, alias: "events", required: false }] }], nodeClick: [{ type: i0.Output, args: ["nodeClick"] }], nodeSelect: [{ type: i0.Output, args: ["nodeSelect"] }], nodeCreate: [{ type: i0.Output, args: ["nodeCreate"] }], nodeUpdate: [{ type: i0.Output, args: ["nodeUpdate"] }], nodeDelete: [{ type: i0.Output, args: ["nodeDelete"] }], searchChange: [{ type: i0.Output, args: ["searchChange"] }], collapseChange: [{ type: i0.Output, args: ["collapseChange"] }], tree: [{ type: i0.ViewChild, args: ['tree', { isSignal: true }] }] } });
1223
1222
 
1224
1223
  //#region ---- Tree Node Interface ----
@@ -1271,11 +1270,11 @@ class AXPColorPalettePickerComponent {
1271
1270
  this.colorSelected.emit(color);
1272
1271
  }
1273
1272
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPColorPalettePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1274
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPColorPalettePickerComponent, isStandalone: true, selector: "axp-color-palette-picker", inputs: { colors: { classPropertyName: "colors", publicName: "colors", isSignal: true, isRequired: false, transformFunction: null }, selectedColor: { classPropertyName: "selectedColor", publicName: "selectedColor", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, allowClear: { classPropertyName: "allowClear", publicName: "allowClear", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { colorSelected: "colorSelected" }, ngImport: i0, template: "<div class=\"axp-color-palette-picker\">\n <div class=\"__swatches\">\n @if (allowClear()) {\n <button type=\"button\" class=\"__swatch __empty\"\n [class.__selected]=\"selectedColor() === null || selectedColor() === undefined\"\n [class.__disabled]=\"disabled() || readonly()\" [disabled]=\"disabled() || readonly()\"\n (click)=\"handleColorSelect(null)\">\n @if (selectedColor() === null || selectedColor() === undefined) {\n <i class=\"fa-solid fa-check __checkmark\"></i>\n } @else {\n <i class=\"fa-solid fa-xmark __clear-icon\"></i>\n }\n </button>\n }\n @for (color of colors(); track color) {\n <button type=\"button\" class=\"__swatch\" [class.__selected]=\"selectedColor() === color\"\n [class.__disabled]=\"disabled() || readonly()\" [style.background-color]=\"color\"\n [disabled]=\"disabled() || readonly()\" (click)=\"handleColorSelect(color)\">\n @if (selectedColor() === color) {\n <i class=\"fa-solid fa-check __checkmark\"></i>\n }\n </button>\n }\n </div>\n</div>", styles: ["@layer properties;.axp-color-palette-picker{width:100%}.axp-color-palette-picker .__swatches{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--spacing, .25rem)}.axp-color-palette-picker .__swatches .__swatch{height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:2px;border-color:transparent;cursor:pointer;transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s;display:flex;align-items:center;justify-content:center;position:relative}.axp-color-palette-picker .__swatches .__swatch:hover:not(.__disabled):not(.__selected){--tw-scale-x: 110%;--tw-scale-y: 110%;--tw-scale-z: 110%;scale:var(--tw-scale-x) var(--tw-scale-y);--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);transform:scale(1.1);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.axp-color-palette-picker .__swatches .__swatch.__selected{border-style:var(--tw-border-style);border-width:2px;border-color:#0003;--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);box-shadow:0 0 0 2px #0000001a}.axp-color-palette-picker .__swatches .__swatch:focus-visible:not(.__disabled){outline:2px solid var(--ax-color-primary);outline-offset:2px;box-shadow:0 0 0 4px var(--ax-color-primary-alpha-20)}.axp-color-palette-picker .__swatches .__swatch.__disabled{cursor:not-allowed;opacity:50%}.axp-color-palette-picker .__swatches .__swatch .__checkmark{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-white, #fff);filter:drop-shadow(0 1px 2px rgba(0,0,0,.6)) drop-shadow(0 0 1px rgba(255,255,255,.3))}.axp-color-palette-picker .__swatches .__swatch.__empty{border-style:var(--tw-border-style);border-width:2px;background-color:rgba(var(--ax-sys-color-lightest-surface));border-color:var(--ax-color-border);background-image:repeating-linear-gradient(45deg,transparent,transparent 2px,var(--ax-color-border) 2px,var(--ax-color-border) 4px)}.axp-color-palette-picker .__swatches .__swatch.__empty:hover:not(.__disabled):not(.__selected){background-color:rgba(var(--ax-sys-color-lighter-surface));--tw-scale-x: 110%;--tw-scale-y: 110%;--tw-scale-z: 110%;scale:var(--tw-scale-x) var(--tw-scale-y);transform:scale(1.1)}.axp-color-palette-picker .__swatches .__swatch.__empty.__selected{border-color:#0000004d}.axp-color-palette-picker .__swatches .__swatch.__empty .__checkmark{color:var(--color-neutral-700, oklch(37.1% 0 0));filter:drop-shadow(0 1px 2px rgba(0,0,0,.3))}.axp-color-palette-picker .__swatches .__swatch.__empty .__clear-icon{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-600, oklch(43.9% 0 0))}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-scale-x{syntax: \"*\"; inherits: false; initial-value: 1;}@property --tw-scale-y{syntax: \"*\"; inherits: false; initial-value: 1;}@property --tw-scale-z{syntax: \"*\"; inherits: false; initial-value: 1;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-duration: initial;--tw-scale-x: 1;--tw-scale-y: 1;--tw-scale-z: 1;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1273
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPColorPalettePickerComponent, isStandalone: true, selector: "axp-color-palette-picker", inputs: { colors: { classPropertyName: "colors", publicName: "colors", isSignal: true, isRequired: false, transformFunction: null }, selectedColor: { classPropertyName: "selectedColor", publicName: "selectedColor", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, allowClear: { classPropertyName: "allowClear", publicName: "allowClear", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { colorSelected: "colorSelected" }, ngImport: i0, template: "<div class=\"axp-color-palette-picker\">\n <div class=\"__swatches\">\n @if (allowClear()) {\n <button type=\"button\" class=\"__swatch __empty\"\n [class.__selected]=\"selectedColor() === null || selectedColor() === undefined\"\n [class.__disabled]=\"disabled() || readonly()\" [disabled]=\"disabled() || readonly()\"\n (click)=\"handleColorSelect(null)\">\n @if (selectedColor() === null || selectedColor() === undefined) {\n <i class=\"fa-solid fa-check __checkmark\"></i>\n } @else {\n <i class=\"fa-solid fa-xmark __clear-icon\"></i>\n }\n </button>\n }\n @for (color of colors(); track color) {\n <button type=\"button\" class=\"__swatch\" [class.__selected]=\"selectedColor() === color\"\n [class.__disabled]=\"disabled() || readonly()\" [style.background-color]=\"color\"\n [disabled]=\"disabled() || readonly()\" (click)=\"handleColorSelect(color)\">\n @if (selectedColor() === color) {\n <i class=\"fa-solid fa-check __checkmark\"></i>\n }\n </button>\n }\n </div>\n</div>", styles: ["@layer properties;.axp-color-palette-picker{width:100%}.axp-color-palette-picker .__swatches{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--spacing, .25rem)}.axp-color-palette-picker .__swatches .__swatch{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);cursor:pointer;align-items:center;justify-content:center;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:2px;border-color:transparent;transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s}.axp-color-palette-picker .__swatches .__swatch:hover:not(.__disabled):not(.__selected){--tw-scale-x: 110%;--tw-scale-y: 110%;--tw-scale-z: 110%;scale:var(--tw-scale-x) var(--tw-scale-y);--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);transform:scale(1.1);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.axp-color-palette-picker .__swatches .__swatch.__selected{border-style:var(--tw-border-style);border-width:2px;--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-color:#0003;box-shadow:0 0 0 2px #0000001a}.axp-color-palette-picker .__swatches .__swatch:focus-visible:not(.__disabled){outline:2px solid var(--ax-color-primary);outline-offset:2px;box-shadow:0 0 0 4px var(--ax-color-primary-alpha-20)}.axp-color-palette-picker .__swatches .__swatch.__disabled{cursor:not-allowed;opacity:50%}.axp-color-palette-picker .__swatches .__swatch .__checkmark{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-white, #fff);filter:drop-shadow(0 1px 2px rgba(0,0,0,.6)) drop-shadow(0 0 1px rgba(255,255,255,.3))}.axp-color-palette-picker .__swatches .__swatch.__empty{border-style:var(--tw-border-style);border-width:2px;background-color:rgba(var(--ax-sys-color-lightest-surface));border-color:var(--ax-color-border);background-image:repeating-linear-gradient(45deg,transparent,transparent 2px,var(--ax-color-border) 2px,var(--ax-color-border) 4px)}.axp-color-palette-picker .__swatches .__swatch.__empty:hover:not(.__disabled):not(.__selected){--tw-scale-x: 110%;--tw-scale-y: 110%;--tw-scale-z: 110%;scale:var(--tw-scale-x) var(--tw-scale-y);background-color:rgba(var(--ax-sys-color-lighter-surface));transform:scale(1.1)}.axp-color-palette-picker .__swatches .__swatch.__empty.__selected{border-color:#0000004d}.axp-color-palette-picker .__swatches .__swatch.__empty .__checkmark{color:var(--color-neutral-700, oklch(37.1% 0 0));filter:drop-shadow(0 1px 2px rgba(0,0,0,.3))}.axp-color-palette-picker .__swatches .__swatch.__empty .__clear-icon{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-600, oklch(43.9% 0 0))}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-scale-x{syntax: \"*\"; inherits: false; initial-value: 1;}@property --tw-scale-y{syntax: \"*\"; inherits: false; initial-value: 1;}@property --tw-scale-z{syntax: \"*\"; inherits: false; initial-value: 1;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-duration: initial;--tw-scale-x: 1;--tw-scale-y: 1;--tw-scale-z: 1;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1275
1274
  }
1276
1275
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPColorPalettePickerComponent, decorators: [{
1277
1276
  type: Component,
1278
- args: [{ selector: 'axp-color-palette-picker', changeDetection: ChangeDetectionStrategy.OnPush, imports: [], template: "<div class=\"axp-color-palette-picker\">\n <div class=\"__swatches\">\n @if (allowClear()) {\n <button type=\"button\" class=\"__swatch __empty\"\n [class.__selected]=\"selectedColor() === null || selectedColor() === undefined\"\n [class.__disabled]=\"disabled() || readonly()\" [disabled]=\"disabled() || readonly()\"\n (click)=\"handleColorSelect(null)\">\n @if (selectedColor() === null || selectedColor() === undefined) {\n <i class=\"fa-solid fa-check __checkmark\"></i>\n } @else {\n <i class=\"fa-solid fa-xmark __clear-icon\"></i>\n }\n </button>\n }\n @for (color of colors(); track color) {\n <button type=\"button\" class=\"__swatch\" [class.__selected]=\"selectedColor() === color\"\n [class.__disabled]=\"disabled() || readonly()\" [style.background-color]=\"color\"\n [disabled]=\"disabled() || readonly()\" (click)=\"handleColorSelect(color)\">\n @if (selectedColor() === color) {\n <i class=\"fa-solid fa-check __checkmark\"></i>\n }\n </button>\n }\n </div>\n</div>", styles: ["@layer properties;.axp-color-palette-picker{width:100%}.axp-color-palette-picker .__swatches{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--spacing, .25rem)}.axp-color-palette-picker .__swatches .__swatch{height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:2px;border-color:transparent;cursor:pointer;transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s;display:flex;align-items:center;justify-content:center;position:relative}.axp-color-palette-picker .__swatches .__swatch:hover:not(.__disabled):not(.__selected){--tw-scale-x: 110%;--tw-scale-y: 110%;--tw-scale-z: 110%;scale:var(--tw-scale-x) var(--tw-scale-y);--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);transform:scale(1.1);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.axp-color-palette-picker .__swatches .__swatch.__selected{border-style:var(--tw-border-style);border-width:2px;border-color:#0003;--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);box-shadow:0 0 0 2px #0000001a}.axp-color-palette-picker .__swatches .__swatch:focus-visible:not(.__disabled){outline:2px solid var(--ax-color-primary);outline-offset:2px;box-shadow:0 0 0 4px var(--ax-color-primary-alpha-20)}.axp-color-palette-picker .__swatches .__swatch.__disabled{cursor:not-allowed;opacity:50%}.axp-color-palette-picker .__swatches .__swatch .__checkmark{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-white, #fff);filter:drop-shadow(0 1px 2px rgba(0,0,0,.6)) drop-shadow(0 0 1px rgba(255,255,255,.3))}.axp-color-palette-picker .__swatches .__swatch.__empty{border-style:var(--tw-border-style);border-width:2px;background-color:rgba(var(--ax-sys-color-lightest-surface));border-color:var(--ax-color-border);background-image:repeating-linear-gradient(45deg,transparent,transparent 2px,var(--ax-color-border) 2px,var(--ax-color-border) 4px)}.axp-color-palette-picker .__swatches .__swatch.__empty:hover:not(.__disabled):not(.__selected){background-color:rgba(var(--ax-sys-color-lighter-surface));--tw-scale-x: 110%;--tw-scale-y: 110%;--tw-scale-z: 110%;scale:var(--tw-scale-x) var(--tw-scale-y);transform:scale(1.1)}.axp-color-palette-picker .__swatches .__swatch.__empty.__selected{border-color:#0000004d}.axp-color-palette-picker .__swatches .__swatch.__empty .__checkmark{color:var(--color-neutral-700, oklch(37.1% 0 0));filter:drop-shadow(0 1px 2px rgba(0,0,0,.3))}.axp-color-palette-picker .__swatches .__swatch.__empty .__clear-icon{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-600, oklch(43.9% 0 0))}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-scale-x{syntax: \"*\"; inherits: false; initial-value: 1;}@property --tw-scale-y{syntax: \"*\"; inherits: false; initial-value: 1;}@property --tw-scale-z{syntax: \"*\"; inherits: false; initial-value: 1;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-duration: initial;--tw-scale-x: 1;--tw-scale-y: 1;--tw-scale-z: 1;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
1277
+ args: [{ selector: 'axp-color-palette-picker', changeDetection: ChangeDetectionStrategy.OnPush, imports: [], template: "<div class=\"axp-color-palette-picker\">\n <div class=\"__swatches\">\n @if (allowClear()) {\n <button type=\"button\" class=\"__swatch __empty\"\n [class.__selected]=\"selectedColor() === null || selectedColor() === undefined\"\n [class.__disabled]=\"disabled() || readonly()\" [disabled]=\"disabled() || readonly()\"\n (click)=\"handleColorSelect(null)\">\n @if (selectedColor() === null || selectedColor() === undefined) {\n <i class=\"fa-solid fa-check __checkmark\"></i>\n } @else {\n <i class=\"fa-solid fa-xmark __clear-icon\"></i>\n }\n </button>\n }\n @for (color of colors(); track color) {\n <button type=\"button\" class=\"__swatch\" [class.__selected]=\"selectedColor() === color\"\n [class.__disabled]=\"disabled() || readonly()\" [style.background-color]=\"color\"\n [disabled]=\"disabled() || readonly()\" (click)=\"handleColorSelect(color)\">\n @if (selectedColor() === color) {\n <i class=\"fa-solid fa-check __checkmark\"></i>\n }\n </button>\n }\n </div>\n</div>", styles: ["@layer properties;.axp-color-palette-picker{width:100%}.axp-color-palette-picker .__swatches{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--spacing, .25rem)}.axp-color-palette-picker .__swatches .__swatch{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);cursor:pointer;align-items:center;justify-content:center;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:2px;border-color:transparent;transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s}.axp-color-palette-picker .__swatches .__swatch:hover:not(.__disabled):not(.__selected){--tw-scale-x: 110%;--tw-scale-y: 110%;--tw-scale-z: 110%;scale:var(--tw-scale-x) var(--tw-scale-y);--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);transform:scale(1.1);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.axp-color-palette-picker .__swatches .__swatch.__selected{border-style:var(--tw-border-style);border-width:2px;--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-color:#0003;box-shadow:0 0 0 2px #0000001a}.axp-color-palette-picker .__swatches .__swatch:focus-visible:not(.__disabled){outline:2px solid var(--ax-color-primary);outline-offset:2px;box-shadow:0 0 0 4px var(--ax-color-primary-alpha-20)}.axp-color-palette-picker .__swatches .__swatch.__disabled{cursor:not-allowed;opacity:50%}.axp-color-palette-picker .__swatches .__swatch .__checkmark{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-white, #fff);filter:drop-shadow(0 1px 2px rgba(0,0,0,.6)) drop-shadow(0 0 1px rgba(255,255,255,.3))}.axp-color-palette-picker .__swatches .__swatch.__empty{border-style:var(--tw-border-style);border-width:2px;background-color:rgba(var(--ax-sys-color-lightest-surface));border-color:var(--ax-color-border);background-image:repeating-linear-gradient(45deg,transparent,transparent 2px,var(--ax-color-border) 2px,var(--ax-color-border) 4px)}.axp-color-palette-picker .__swatches .__swatch.__empty:hover:not(.__disabled):not(.__selected){--tw-scale-x: 110%;--tw-scale-y: 110%;--tw-scale-z: 110%;scale:var(--tw-scale-x) var(--tw-scale-y);background-color:rgba(var(--ax-sys-color-lighter-surface));transform:scale(1.1)}.axp-color-palette-picker .__swatches .__swatch.__empty.__selected{border-color:#0000004d}.axp-color-palette-picker .__swatches .__swatch.__empty .__checkmark{color:var(--color-neutral-700, oklch(37.1% 0 0));filter:drop-shadow(0 1px 2px rgba(0,0,0,.3))}.axp-color-palette-picker .__swatches .__swatch.__empty .__clear-icon{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-600, oklch(43.9% 0 0))}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-scale-x{syntax: \"*\"; inherits: false; initial-value: 1;}@property --tw-scale-y{syntax: \"*\"; inherits: false; initial-value: 1;}@property --tw-scale-z{syntax: \"*\"; inherits: false; initial-value: 1;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-duration: initial;--tw-scale-x: 1;--tw-scale-y: 1;--tw-scale-z: 1;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
1279
1278
  }], propDecorators: { colors: [{ type: i0.Input, args: [{ isSignal: true, alias: "colors", required: false }] }], selectedColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedColor", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], allowClear: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowClear", required: false }] }], colorSelected: [{ type: i0.Output, args: ["colorSelected"] }] } });
1280
1279
 
1281
1280
  class AXPColumnItemListComponent {
@@ -1405,7 +1404,7 @@ class AXPColumnItemListComponent {
1405
1404
  </div>
1406
1405
  </div>
1407
1406
  </ax-popover>
1408
- `, isInline: true, dependencies: [{ kind: "ngmodule", type: AXBadgeModule }, { kind: "component", type: i4$1.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i4$2.AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1407
+ `, isInline: true, dependencies: [{ kind: "ngmodule", type: AXBadgeModule }, { kind: "component", type: i1$3.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i2$2.AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1409
1408
  }
1410
1409
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPColumnItemListComponent, decorators: [{
1411
1410
  type: Component,
@@ -1487,7 +1486,7 @@ class AXPQueryColumnsComponent {
1487
1486
  this.columns.set(columns);
1488
1487
  }
1489
1488
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPQueryColumnsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1490
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPQueryColumnsComponent, isStandalone: true, selector: "axp-query-columns", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { columns: "columnsChange" }, ngImport: i0, template: "<div\n class=\"flex flex-col gap-4 select-none\"\n cdkDropList\n (cdkDropListDropped)=\"drop($event)\"\n>\n <div\n class=\"flex flex-col gap-3 w-full ax-sorted-list max-h-[calc(100vh-280px)] overflow-x-hidden overflow-y-auto\"\n >\n @for (item of columns(); track item.name) {\n <div\n class=\"flex py-1 items-center justify-between\"\n cdkDrag\n cdkDragBoundary=\".ax-sorted-list\"\n >\n <div class=\"flex items-center gap-3\" cdkDragHandle>\n <ax-icon class=\"fa-solid fa-grip-dots-vertical cursor-move\"></ax-icon>\n <p class=\"font-medium text-sm\">\n {{ item.title | translate | async }}\n </p>\n </div>\n <ax-switch\n class=\"ax-sm\"\n [ngModel]=\"item.visible\"\n (onValueChanged)=\"handleVisibilityChange($event, item.name)\"\n ></ax-switch>\n </div>\n }\n </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: 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: 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: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXSwitchModule }, { kind: "component", type: i3$2.AXSwitchComponent, selector: "ax-switch", inputs: ["disabled", "readonly", "color", "tabIndex", "value", "name", "isLoading"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }] }); }
1489
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPQueryColumnsComponent, isStandalone: true, selector: "axp-query-columns", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { columns: "columnsChange" }, ngImport: i0, template: "<div\n class=\"flex flex-col gap-4 select-none\"\n cdkDropList\n (cdkDropListDropped)=\"drop($event)\"\n>\n <div\n class=\"flex flex-col gap-3 w-full ax-sorted-list max-h-[calc(100vh-280px)] overflow-x-hidden overflow-y-auto\"\n >\n @for (item of columns(); track item.name) {\n <div\n class=\"flex py-1 items-center justify-between\"\n cdkDrag\n cdkDragBoundary=\".ax-sorted-list\"\n >\n <div class=\"flex items-center gap-3\" cdkDragHandle>\n <ax-icon class=\"fa-solid fa-grip-dots-vertical cursor-move\"></ax-icon>\n <p class=\"font-medium text-sm\">\n {{ item.title | translate | async }}\n </p>\n </div>\n <ax-switch\n class=\"ax-sm\"\n [ngModel]=\"item.visible\"\n (onValueChanged)=\"handleVisibilityChange($event, item.name)\"\n ></ax-switch>\n </div>\n }\n </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: 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: 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: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXSwitchModule }, { kind: "component", type: i3$2.AXSwitchComponent, selector: "ax-switch", inputs: ["disabled", "readonly", "color", "tabIndex", "value", "name", "isLoading"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }] }); }
1491
1490
  }
1492
1491
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPQueryColumnsComponent, decorators: [{
1493
1492
  type: Component,
@@ -1632,7 +1631,7 @@ class AXPTextCommandColumnComponent extends AXDataTableColumnComponent {
1632
1631
  }
1633
1632
  </ng-template>
1634
1633
  <ng-template #footer></ng-template>
1635
- `, isInline: true, styles: [".axp-widget-column-header--sortable{cursor:pointer}.axp-widget-column-header__caption{min-width:0}.axp-widget-column-header__caption--with-sort{flex:1 1 0}.axp-widget-column-header__sort{opacity:0;transition:opacity .15s ease}.axp-widget-column-header--sortable:hover .axp-widget-column-header__sort,.axp-widget-column-header--sortable:focus-within .axp-widget-column-header__sort,.axp-widget-column-header--sort-active .axp-widget-column-header__sort{opacity:1}.axp-widget-column-header__sort-priority{line-height:1}:host-context(.ax-data-table-head-cell.ax-interactive:hover) .axp-widget-column-header__sort,:host-context(.ax-data-table-head-cell.ax-interactive:focus-within) .axp-widget-column-header__sort,:host-context(.ax-data-table-head-cell) .axp-widget-column-header--sort-active .axp-widget-column-header__sort{opacity:1}\n"], dependencies: [{ kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1634
+ `, isInline: true, styles: ["@layer properties;.axp-widget-column-header--sortable{cursor:pointer}.axp-widget-column-header--sortable:hover .axp-widget-column-header__sort,.axp-widget-column-header--sortable:focus-within .axp-widget-column-header__sort,.axp-widget-column-header--sortable.axp-widget-column-header--sort-active .axp-widget-column-header__sort{opacity:1}.axp-widget-column-header__caption{min-width:0}.axp-widget-column-header__caption--with-sort{flex:1;flex:1 1 0}.axp-widget-column-header__sort{opacity:0;transition:opacity .15s ease}.axp-widget-column-header__sort-priority{--tw-leading: 1;line-height:1}:host-context(.ax-data-table-head-cell.ax-interactive:hover) .axp-widget-column-header__sort,:host-context(.ax-data-table-head-cell.ax-interactive:focus-within) .axp-widget-column-header__sort,:host-context(.ax-data-table-head-cell) .axp-widget-column-header--sort-active .axp-widget-column-header__sort{opacity:1}@property --tw-leading{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-leading: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1636
1635
  }
1637
1636
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPTextCommandColumnComponent, decorators: [{
1638
1637
  type: Component,
@@ -1693,7 +1692,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
1693
1692
  provide: AXDataTableColumnComponent,
1694
1693
  useExisting: forwardRef(() => AXPTextCommandColumnComponent),
1695
1694
  },
1696
- ], styles: [".axp-widget-column-header--sortable{cursor:pointer}.axp-widget-column-header__caption{min-width:0}.axp-widget-column-header__caption--with-sort{flex:1 1 0}.axp-widget-column-header__sort{opacity:0;transition:opacity .15s ease}.axp-widget-column-header--sortable:hover .axp-widget-column-header__sort,.axp-widget-column-header--sortable:focus-within .axp-widget-column-header__sort,.axp-widget-column-header--sort-active .axp-widget-column-header__sort{opacity:1}.axp-widget-column-header__sort-priority{line-height:1}:host-context(.ax-data-table-head-cell.ax-interactive:hover) .axp-widget-column-header__sort,:host-context(.ax-data-table-head-cell.ax-interactive:focus-within) .axp-widget-column-header__sort,:host-context(.ax-data-table-head-cell) .axp-widget-column-header--sort-active .axp-widget-column-header__sort{opacity:1}\n"] }]
1695
+ ], styles: ["@layer properties;.axp-widget-column-header--sortable{cursor:pointer}.axp-widget-column-header--sortable:hover .axp-widget-column-header__sort,.axp-widget-column-header--sortable:focus-within .axp-widget-column-header__sort,.axp-widget-column-header--sortable.axp-widget-column-header--sort-active .axp-widget-column-header__sort{opacity:1}.axp-widget-column-header__caption{min-width:0}.axp-widget-column-header__caption--with-sort{flex:1;flex:1 1 0}.axp-widget-column-header__sort{opacity:0;transition:opacity .15s ease}.axp-widget-column-header__sort-priority{--tw-leading: 1;line-height:1}:host-context(.ax-data-table-head-cell.ax-interactive:hover) .axp-widget-column-header__sort,:host-context(.ax-data-table-head-cell.ax-interactive:focus-within) .axp-widget-column-header__sort,:host-context(.ax-data-table-head-cell) .axp-widget-column-header--sort-active .axp-widget-column-header__sort{opacity:1}@property --tw-leading{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-leading: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
1697
1696
  }], propDecorators: { caption: [{
1698
1697
  type: Input,
1699
1698
  args: [{ required: true }]
@@ -1845,11 +1844,11 @@ class AXPCompareViewComponent {
1845
1844
  ngOnDestroy() {
1846
1845
  }
1847
1846
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPCompareViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1848
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPCompareViewComponent, isStandalone: true, selector: "axp-compare-view", inputs: { inputs: { classPropertyName: "inputs", publicName: "inputs", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, providers: [], ngImport: i0, template: "<!--\n #region ---- Compare View Table Layout ----\n-->\n<div class=\"axp-compare-view\">\n <div class=\"__table-container\">\n <table class=\"__table\">\n <thead class=\"__thead\">\n <tr class=\"__header-row\">\n <th class=\"__field-header\">\n <ax-check-box\n [value]=\"showOnlyChanges()\"\n (valueChange)=\"toggleShowOnlyChanges()\"\n class=\"__show-changes-toggle\"\n >\n <ax-label>\n {{ '@activity-log:components.compare-view.show-only-differences' | translate | async }}\n </ax-label>\n </ax-check-box>\n </th>\n @for (obj of remainingObjects(); track obj.id) {\n <th class=\"__object-header\" [attr.data-id]=\"obj.id\">\n <div class=\"__object-title\" [title]=\"obj.description\">\n <span>{{ obj.title | translate | async }}</span>\n @if (remainingObjects().length > 2) {\n <span class=\"__remove-object-button\" (click)=\"removeObject(obj.id)\">\n <i class=\"fa-light fa-times\"></i>\n </span>\n }\n </div>\n </th>\n }\n </tr>\n </thead>\n <tbody class=\"__tbody\">\n @for (field of filteredFields(); track field.path; let i = $index) {\n <tr\n class=\"__row\"\n [class.__row--odd]=\"i % 2 === 1\"\n [class.__row--has-differences]=\"hasUnequalValues(field.path)\"\n [class.__row--has-equal-values]=\"hasEqualValues(field.path)\"\n >\n <td class=\"__field-cell\">\n <div class=\"__field-content\">\n <div class=\"__field-title\">\n {{ field.title | translate | async }}\n </div>\n @if (field.description) {\n <div class=\"__field-description\">{{ field.description }}</div>\n }\n </div>\n </td>\n @for (obj of remainingObjects(); track obj.id; let objIndex = $index) {\n <td\n class=\"__object-cell\"\n [attr.data-id]=\"obj.id\"\n [class.__cell--changed]=\"hasValueChangedFromPrevious(field.path, objIndex) && isChangesMode()\"\n >\n @if (obj.context[field.path] !== undefined) {\n <div class=\"__object-content\">\n <axp-widgets-container [context]=\"obj.context\">\n <ng-container axp-widget-renderer [node]=\"field.widget\" [mode]=\"'view'\"></ng-container>\n </axp-widgets-container>\n </div>\n } @else {\n <div class=\"__object-placeholder\">---</div>\n }\n @if (hasValueChangingToNext(field.path, objIndex) && isChangesMode()) {\n <div class=\"__change-indicator\">\n <i class=\"fa-light fa-arrow-right\"></i>\n </div>\n }\n </td>\n }\n </tr>\n }\n </tbody>\n </table>\n </div>\n</div>\n<!--\n #endregion\n-->\n", styles: ["@layer properties;.axp-compare-view{display:flex;height:100%;width:100%;flex-direction:column;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);position:relative}.axp-compare-view .__filter-controls{flex-shrink:0;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-light);color:var(--color-on-light);border-color:var(--color-border-light);padding:calc(var(--spacing, .25rem) * 4)}.axp-compare-view .__filter-controls .__show-changes-toggle{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.axp-compare-view .__table-container{flex:1;overflow:auto;position:relative}.axp-compare-view .__table{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}.axp-compare-view .__table .__thead{position:sticky;top:0;z-index:20}.axp-compare-view .__table .__thead .__header-row .__field-header{width:calc(var(--spacing, .25rem) * 56);border-right-style:var(--tw-border-style);border-right-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);text-align:left;--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700);position:sticky;left:0;z-index:25}.axp-compare-view .__table .__thead .__header-row .__object-header{position:relative;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);text-align:center;min-width:250px;width:250px}.axp-compare-view .__table .__thead .__header-row .__object-header .__object-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-compare-view .__table .__thead .__header-row .__object-header .__object-description{margin-top:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:75%}.axp-compare-view .__table .__thead .__header-row .__object-header .__remove-object-button{display:flex;width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);background-color:rgba(var(--ax-sys-color-light-surface));font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 0);top:50%;--tw-translate-y: -50%;translate:var(--tw-translate-x) var(--tw-translate-y)}.axp-compare-view .__table .__thead .__header-row .__object-header .__remove-object-button:hover{background-color:rgba(var(--ax-sys-color-danger-100));color:rgba(var(--ax-sys-color-danger-600))}.axp-compare-view .__table .__tbody .__row{transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s}.axp-compare-view .__table .__tbody .__row.__row--odd{background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest)}.axp-compare-view .__table .__tbody .__row.__row--has-differences{border-left-style:var(--tw-border-style);border-left-width:4px;border-left-color:rgba(var(--ax-sys-color-warning-surface))}.axp-compare-view .__table .__tbody .__row.__row--has-differences .__field-cell{background-color:rgba(var(--ax-sys-color-warning-surface))}@supports (color: color-mix(in lab,red,red)){.axp-compare-view .__table .__tbody .__row.__row--has-differences .__field-cell{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-surface)) 5%,transparent)}}.axp-compare-view .__table .__tbody .__row.__row--has-equal-values{border-left-style:var(--tw-border-style);border-left-width:4px;border-left-color:rgba(var(--ax-sys-color-success-surface))}.axp-compare-view .__table .__tbody .__row.__row--has-equal-values .__field-cell{background-color:rgba(var(--ax-sys-color-success-surface))}@supports (color: color-mix(in lab,red,red)){.axp-compare-view .__table .__tbody .__row.__row--has-equal-values .__field-cell{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 5%,transparent)}}.axp-compare-view .__table .__tbody .__row .__field-cell{width:calc(var(--spacing, .25rem) * 56);border-right-style:var(--tw-border-style);border-right-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);vertical-align:top;position:sticky;left:0;z-index:15}.axp-compare-view .__table .__tbody .__row .__field-cell .__field-content{display:flex;flex-direction:column;gap:var(--spacing, .25rem)}.axp-compare-view .__table .__tbody .__row .__field-cell .__field-content .__field-title{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-compare-view .__table .__tbody .__row .__field-cell .__field-content .__field-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:75%}.axp-compare-view .__table .__tbody .__row .__object-cell{border-bottom-style:var(--tw-border-style);border-bottom-width:1px;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);text-align:center;vertical-align:middle;position:relative}.axp-compare-view .__table .__tbody .__row .__object-cell.__cell--changed .__object-content{border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-warning-200));padding:calc(var(--spacing, .25rem) * 2)}.axp-compare-view .__table .__tbody .__row .__object-cell .__object-content{position:relative;display:flex;align-items:center;justify-content:center}.axp-compare-view .__table .__tbody .__row .__object-cell .__change-indicator{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * -1);top:50%;--tw-translate-y: -50%;translate:var(--tw-translate-x) var(--tw-translate-y);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-warning-surface));font-size:.875rem}.axp-compare-view .__table .__tbody .__row .__object-cell .__object-placeholder{opacity:75%}.axp-compare-view .__table .__tbody .__row.__row--has-differences .__field-cell{border-inline-start-style:var(--tw-border-style);border-inline-start-width:4px;border-inline-start-color:rgba(var(--ax-sys-color-warning-surface));background-color:rgba(var(--ax-sys-color-warning-50))}.axp-compare-view .__table .__tbody .__row.__row--has-differences .__field-cell:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-warning-900))}.axp-compare-view .__table .__tbody .__row.__row--has-equal-values .__field-cell{border-inline-start-style:var(--tw-border-style);border-inline-start-width:4px;border-inline-start-color:rgba(var(--ax-sys-color-success-surface));background-color:rgba(var(--ax-sys-color-success-50))}.axp-compare-view .__table .__tbody .__row.__row--has-equal-values .__field-cell:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-success-900))}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-translate-x{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-y{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-z{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-duration{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-font-weight: initial;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0;--tw-duration: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type:
1847
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPCompareViewComponent, isStandalone: true, selector: "axp-compare-view", inputs: { inputs: { classPropertyName: "inputs", publicName: "inputs", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, providers: [], ngImport: i0, template: "<!--\n #region ---- Compare View Table Layout ----\n-->\n<div class=\"axp-compare-view\">\n <div class=\"__table-container\">\n <table class=\"__table\">\n <thead class=\"__thead\">\n <tr class=\"__header-row\">\n <th class=\"__field-header\">\n <ax-check-box\n [value]=\"showOnlyChanges()\"\n (valueChange)=\"toggleShowOnlyChanges()\"\n class=\"__show-changes-toggle\"\n >\n <ax-label>\n {{ '@activity-log:components.compare-view.show-only-differences' | translate | async }}\n </ax-label>\n </ax-check-box>\n </th>\n @for (obj of remainingObjects(); track obj.id) {\n <th class=\"__object-header\" [attr.data-id]=\"obj.id\">\n <div class=\"__object-title\" [title]=\"obj.description\">\n <span>{{ obj.title | translate | async }}</span>\n @if (remainingObjects().length > 2) {\n <span class=\"__remove-object-button\" (click)=\"removeObject(obj.id)\">\n <i class=\"fa-light fa-times\"></i>\n </span>\n }\n </div>\n </th>\n }\n </tr>\n </thead>\n <tbody class=\"__tbody\">\n @for (field of filteredFields(); track field.path; let i = $index) {\n <tr\n class=\"__row\"\n [class.__row--odd]=\"i % 2 === 1\"\n [class.__row--has-differences]=\"hasUnequalValues(field.path)\"\n [class.__row--has-equal-values]=\"hasEqualValues(field.path)\"\n >\n <td class=\"__field-cell\">\n <div class=\"__field-content\">\n <div class=\"__field-title\">\n {{ field.title | translate | async }}\n </div>\n @if (field.description) {\n <div class=\"__field-description\">{{ field.description }}</div>\n }\n </div>\n </td>\n @for (obj of remainingObjects(); track obj.id; let objIndex = $index) {\n <td\n class=\"__object-cell\"\n [attr.data-id]=\"obj.id\"\n [class.__cell--changed]=\"hasValueChangedFromPrevious(field.path, objIndex) && isChangesMode()\"\n >\n @if (obj.context[field.path] !== undefined) {\n <div class=\"__object-content\">\n <axp-widgets-container [context]=\"obj.context\">\n <ng-container axp-widget-renderer [node]=\"field.widget\" [mode]=\"'view'\"></ng-container>\n </axp-widgets-container>\n </div>\n } @else {\n <div class=\"__object-placeholder\">---</div>\n }\n @if (hasValueChangingToNext(field.path, objIndex) && isChangesMode()) {\n <div class=\"__change-indicator\">\n <i class=\"fa-light fa-arrow-right\"></i>\n </div>\n }\n </td>\n }\n </tr>\n }\n </tbody>\n </table>\n </div>\n</div>\n<!--\n #endregion\n-->\n", styles: ["@layer properties;.axp-compare-view{position:relative;display:flex;height:100%;width:100%;flex-direction:column;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-compare-view .__filter-controls{flex-shrink:0;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-light);color:var(--color-on-light);border-color:var(--color-border-light);padding:calc(var(--spacing, .25rem) * 4)}.axp-compare-view .__filter-controls .__show-changes-toggle{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.axp-compare-view .__table-container{flex:1;overflow:auto;position:relative}.axp-compare-view .__table{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}.axp-compare-view .__table .__thead{position:sticky;top:0;z-index:20}.axp-compare-view .__table .__thead .__header-row .__field-header{width:calc(var(--spacing, .25rem) * 56);border-right-style:var(--tw-border-style);border-right-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);text-align:left;--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700);position:sticky;left:0;z-index:25}.axp-compare-view .__table .__thead .__header-row .__object-header{position:relative;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);text-align:center;min-width:250px;width:250px}.axp-compare-view .__table .__thead .__header-row .__object-header .__object-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-compare-view .__table .__thead .__header-row .__object-header .__object-description{margin-top:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:75%}.axp-compare-view .__table .__thead .__header-row .__object-header .__remove-object-button{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 0);top:50%;display:flex;width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6);--tw-translate-y: -50%;translate:var(--tw-translate-x) var(--tw-translate-y);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);background-color:rgba(var(--ax-sys-color-light-surface));font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.axp-compare-view .__table .__thead .__header-row .__object-header .__remove-object-button:hover{background-color:rgba(var(--ax-sys-color-danger-100));color:rgba(var(--ax-sys-color-danger-600))}.axp-compare-view .__table .__tbody .__row{transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s}.axp-compare-view .__table .__tbody .__row.__row--odd{background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest)}.axp-compare-view .__table .__tbody .__row.__row--has-differences{border-left-style:var(--tw-border-style);border-left-width:4px;border-left-color:rgba(var(--ax-sys-color-warning-surface))}.axp-compare-view .__table .__tbody .__row.__row--has-differences .__field-cell{border-inline-start-style:var(--tw-border-style);border-inline-start-width:4px;border-inline-start-color:rgba(var(--ax-sys-color-warning-surface));background-color:rgba(var(--ax-sys-color-warning-50));background-color:rgba(var(--ax-sys-color-warning-surface))}@supports (color: color-mix(in lab,red,red)){.axp-compare-view .__table .__tbody .__row.__row--has-differences .__field-cell{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-surface)) 5%,transparent)}}.axp-compare-view .__table .__tbody .__row.__row--has-differences .__field-cell:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-warning-900))}.axp-compare-view .__table .__tbody .__row.__row--has-equal-values{border-left-style:var(--tw-border-style);border-left-width:4px;border-left-color:rgba(var(--ax-sys-color-success-surface))}.axp-compare-view .__table .__tbody .__row.__row--has-equal-values .__field-cell{border-inline-start-style:var(--tw-border-style);border-inline-start-width:4px;border-inline-start-color:rgba(var(--ax-sys-color-success-surface));background-color:rgba(var(--ax-sys-color-success-50));background-color:rgba(var(--ax-sys-color-success-surface))}@supports (color: color-mix(in lab,red,red)){.axp-compare-view .__table .__tbody .__row.__row--has-equal-values .__field-cell{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 5%,transparent)}}.axp-compare-view .__table .__tbody .__row.__row--has-equal-values .__field-cell:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-success-900))}.axp-compare-view .__table .__tbody .__row .__field-cell{width:calc(var(--spacing, .25rem) * 56);border-right-style:var(--tw-border-style);border-right-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);vertical-align:top;position:sticky;left:0;z-index:15}.axp-compare-view .__table .__tbody .__row .__field-cell .__field-content{display:flex;flex-direction:column;gap:var(--spacing, .25rem)}.axp-compare-view .__table .__tbody .__row .__field-cell .__field-content .__field-title{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-compare-view .__table .__tbody .__row .__field-cell .__field-content .__field-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:75%}.axp-compare-view .__table .__tbody .__row .__object-cell{position:relative;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);text-align:center;vertical-align:middle}.axp-compare-view .__table .__tbody .__row .__object-cell.__cell--changed .__object-content{border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-warning-200));padding:calc(var(--spacing, .25rem) * 2)}.axp-compare-view .__table .__tbody .__row .__object-cell .__object-content{position:relative;display:flex;align-items:center;justify-content:center}.axp-compare-view .__table .__tbody .__row .__object-cell .__change-indicator{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * -1);top:50%;--tw-translate-y: -50%;translate:var(--tw-translate-x) var(--tw-translate-y);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-warning-surface));font-size:.875rem}.axp-compare-view .__table .__tbody .__row .__object-cell .__object-placeholder{opacity:75%}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-translate-x{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-y{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-z{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-duration{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-font-weight: initial;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0;--tw-duration: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type:
1849
1848
  // Angular
1850
1849
  CommonModule }, { kind: "ngmodule", type:
1851
1850
  // ACoreX
1852
- AXFormModule }, { kind: "ngmodule", type: AXTextBoxModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i1$4.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXCheckBoxModule }, { kind: "component", type: i2$2.AXCheckBoxComponent, selector: "ax-check-box", inputs: ["disabled", "tabIndex", "readonly", "color", "value", "name", "id", "isLoading", "indeterminate"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type:
1851
+ AXFormModule }, { kind: "ngmodule", type: AXTextBoxModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i1$5.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXCheckBoxModule }, { kind: "component", type: i2$3.AXCheckBoxComponent, selector: "ax-check-box", inputs: ["disabled", "tabIndex", "readonly", "color", "value", "name", "id", "isLoading", "indeterminate"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type:
1853
1852
  // Platform
1854
1853
  AXPWidgetCoreModule }, { 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", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
1855
1854
  }
@@ -1867,7 +1866,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
1867
1866
  AXTranslationModule,
1868
1867
  // Platform
1869
1868
  AXPWidgetCoreModule
1870
- ], encapsulation: ViewEncapsulation.None, providers: [], template: "<!--\n #region ---- Compare View Table Layout ----\n-->\n<div class=\"axp-compare-view\">\n <div class=\"__table-container\">\n <table class=\"__table\">\n <thead class=\"__thead\">\n <tr class=\"__header-row\">\n <th class=\"__field-header\">\n <ax-check-box\n [value]=\"showOnlyChanges()\"\n (valueChange)=\"toggleShowOnlyChanges()\"\n class=\"__show-changes-toggle\"\n >\n <ax-label>\n {{ '@activity-log:components.compare-view.show-only-differences' | translate | async }}\n </ax-label>\n </ax-check-box>\n </th>\n @for (obj of remainingObjects(); track obj.id) {\n <th class=\"__object-header\" [attr.data-id]=\"obj.id\">\n <div class=\"__object-title\" [title]=\"obj.description\">\n <span>{{ obj.title | translate | async }}</span>\n @if (remainingObjects().length > 2) {\n <span class=\"__remove-object-button\" (click)=\"removeObject(obj.id)\">\n <i class=\"fa-light fa-times\"></i>\n </span>\n }\n </div>\n </th>\n }\n </tr>\n </thead>\n <tbody class=\"__tbody\">\n @for (field of filteredFields(); track field.path; let i = $index) {\n <tr\n class=\"__row\"\n [class.__row--odd]=\"i % 2 === 1\"\n [class.__row--has-differences]=\"hasUnequalValues(field.path)\"\n [class.__row--has-equal-values]=\"hasEqualValues(field.path)\"\n >\n <td class=\"__field-cell\">\n <div class=\"__field-content\">\n <div class=\"__field-title\">\n {{ field.title | translate | async }}\n </div>\n @if (field.description) {\n <div class=\"__field-description\">{{ field.description }}</div>\n }\n </div>\n </td>\n @for (obj of remainingObjects(); track obj.id; let objIndex = $index) {\n <td\n class=\"__object-cell\"\n [attr.data-id]=\"obj.id\"\n [class.__cell--changed]=\"hasValueChangedFromPrevious(field.path, objIndex) && isChangesMode()\"\n >\n @if (obj.context[field.path] !== undefined) {\n <div class=\"__object-content\">\n <axp-widgets-container [context]=\"obj.context\">\n <ng-container axp-widget-renderer [node]=\"field.widget\" [mode]=\"'view'\"></ng-container>\n </axp-widgets-container>\n </div>\n } @else {\n <div class=\"__object-placeholder\">---</div>\n }\n @if (hasValueChangingToNext(field.path, objIndex) && isChangesMode()) {\n <div class=\"__change-indicator\">\n <i class=\"fa-light fa-arrow-right\"></i>\n </div>\n }\n </td>\n }\n </tr>\n }\n </tbody>\n </table>\n </div>\n</div>\n<!--\n #endregion\n-->\n", styles: ["@layer properties;.axp-compare-view{display:flex;height:100%;width:100%;flex-direction:column;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);position:relative}.axp-compare-view .__filter-controls{flex-shrink:0;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-light);color:var(--color-on-light);border-color:var(--color-border-light);padding:calc(var(--spacing, .25rem) * 4)}.axp-compare-view .__filter-controls .__show-changes-toggle{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.axp-compare-view .__table-container{flex:1;overflow:auto;position:relative}.axp-compare-view .__table{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}.axp-compare-view .__table .__thead{position:sticky;top:0;z-index:20}.axp-compare-view .__table .__thead .__header-row .__field-header{width:calc(var(--spacing, .25rem) * 56);border-right-style:var(--tw-border-style);border-right-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);text-align:left;--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700);position:sticky;left:0;z-index:25}.axp-compare-view .__table .__thead .__header-row .__object-header{position:relative;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);text-align:center;min-width:250px;width:250px}.axp-compare-view .__table .__thead .__header-row .__object-header .__object-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-compare-view .__table .__thead .__header-row .__object-header .__object-description{margin-top:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:75%}.axp-compare-view .__table .__thead .__header-row .__object-header .__remove-object-button{display:flex;width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);background-color:rgba(var(--ax-sys-color-light-surface));font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 0);top:50%;--tw-translate-y: -50%;translate:var(--tw-translate-x) var(--tw-translate-y)}.axp-compare-view .__table .__thead .__header-row .__object-header .__remove-object-button:hover{background-color:rgba(var(--ax-sys-color-danger-100));color:rgba(var(--ax-sys-color-danger-600))}.axp-compare-view .__table .__tbody .__row{transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s}.axp-compare-view .__table .__tbody .__row.__row--odd{background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest)}.axp-compare-view .__table .__tbody .__row.__row--has-differences{border-left-style:var(--tw-border-style);border-left-width:4px;border-left-color:rgba(var(--ax-sys-color-warning-surface))}.axp-compare-view .__table .__tbody .__row.__row--has-differences .__field-cell{background-color:rgba(var(--ax-sys-color-warning-surface))}@supports (color: color-mix(in lab,red,red)){.axp-compare-view .__table .__tbody .__row.__row--has-differences .__field-cell{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-surface)) 5%,transparent)}}.axp-compare-view .__table .__tbody .__row.__row--has-equal-values{border-left-style:var(--tw-border-style);border-left-width:4px;border-left-color:rgba(var(--ax-sys-color-success-surface))}.axp-compare-view .__table .__tbody .__row.__row--has-equal-values .__field-cell{background-color:rgba(var(--ax-sys-color-success-surface))}@supports (color: color-mix(in lab,red,red)){.axp-compare-view .__table .__tbody .__row.__row--has-equal-values .__field-cell{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 5%,transparent)}}.axp-compare-view .__table .__tbody .__row .__field-cell{width:calc(var(--spacing, .25rem) * 56);border-right-style:var(--tw-border-style);border-right-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);vertical-align:top;position:sticky;left:0;z-index:15}.axp-compare-view .__table .__tbody .__row .__field-cell .__field-content{display:flex;flex-direction:column;gap:var(--spacing, .25rem)}.axp-compare-view .__table .__tbody .__row .__field-cell .__field-content .__field-title{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-compare-view .__table .__tbody .__row .__field-cell .__field-content .__field-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:75%}.axp-compare-view .__table .__tbody .__row .__object-cell{border-bottom-style:var(--tw-border-style);border-bottom-width:1px;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);text-align:center;vertical-align:middle;position:relative}.axp-compare-view .__table .__tbody .__row .__object-cell.__cell--changed .__object-content{border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-warning-200));padding:calc(var(--spacing, .25rem) * 2)}.axp-compare-view .__table .__tbody .__row .__object-cell .__object-content{position:relative;display:flex;align-items:center;justify-content:center}.axp-compare-view .__table .__tbody .__row .__object-cell .__change-indicator{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * -1);top:50%;--tw-translate-y: -50%;translate:var(--tw-translate-x) var(--tw-translate-y);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-warning-surface));font-size:.875rem}.axp-compare-view .__table .__tbody .__row .__object-cell .__object-placeholder{opacity:75%}.axp-compare-view .__table .__tbody .__row.__row--has-differences .__field-cell{border-inline-start-style:var(--tw-border-style);border-inline-start-width:4px;border-inline-start-color:rgba(var(--ax-sys-color-warning-surface));background-color:rgba(var(--ax-sys-color-warning-50))}.axp-compare-view .__table .__tbody .__row.__row--has-differences .__field-cell:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-warning-900))}.axp-compare-view .__table .__tbody .__row.__row--has-equal-values .__field-cell{border-inline-start-style:var(--tw-border-style);border-inline-start-width:4px;border-inline-start-color:rgba(var(--ax-sys-color-success-surface));background-color:rgba(var(--ax-sys-color-success-50))}.axp-compare-view .__table .__tbody .__row.__row--has-equal-values .__field-cell:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-success-900))}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-translate-x{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-y{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-z{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-duration{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-font-weight: initial;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0;--tw-duration: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
1869
+ ], encapsulation: ViewEncapsulation.None, providers: [], template: "<!--\n #region ---- Compare View Table Layout ----\n-->\n<div class=\"axp-compare-view\">\n <div class=\"__table-container\">\n <table class=\"__table\">\n <thead class=\"__thead\">\n <tr class=\"__header-row\">\n <th class=\"__field-header\">\n <ax-check-box\n [value]=\"showOnlyChanges()\"\n (valueChange)=\"toggleShowOnlyChanges()\"\n class=\"__show-changes-toggle\"\n >\n <ax-label>\n {{ '@activity-log:components.compare-view.show-only-differences' | translate | async }}\n </ax-label>\n </ax-check-box>\n </th>\n @for (obj of remainingObjects(); track obj.id) {\n <th class=\"__object-header\" [attr.data-id]=\"obj.id\">\n <div class=\"__object-title\" [title]=\"obj.description\">\n <span>{{ obj.title | translate | async }}</span>\n @if (remainingObjects().length > 2) {\n <span class=\"__remove-object-button\" (click)=\"removeObject(obj.id)\">\n <i class=\"fa-light fa-times\"></i>\n </span>\n }\n </div>\n </th>\n }\n </tr>\n </thead>\n <tbody class=\"__tbody\">\n @for (field of filteredFields(); track field.path; let i = $index) {\n <tr\n class=\"__row\"\n [class.__row--odd]=\"i % 2 === 1\"\n [class.__row--has-differences]=\"hasUnequalValues(field.path)\"\n [class.__row--has-equal-values]=\"hasEqualValues(field.path)\"\n >\n <td class=\"__field-cell\">\n <div class=\"__field-content\">\n <div class=\"__field-title\">\n {{ field.title | translate | async }}\n </div>\n @if (field.description) {\n <div class=\"__field-description\">{{ field.description }}</div>\n }\n </div>\n </td>\n @for (obj of remainingObjects(); track obj.id; let objIndex = $index) {\n <td\n class=\"__object-cell\"\n [attr.data-id]=\"obj.id\"\n [class.__cell--changed]=\"hasValueChangedFromPrevious(field.path, objIndex) && isChangesMode()\"\n >\n @if (obj.context[field.path] !== undefined) {\n <div class=\"__object-content\">\n <axp-widgets-container [context]=\"obj.context\">\n <ng-container axp-widget-renderer [node]=\"field.widget\" [mode]=\"'view'\"></ng-container>\n </axp-widgets-container>\n </div>\n } @else {\n <div class=\"__object-placeholder\">---</div>\n }\n @if (hasValueChangingToNext(field.path, objIndex) && isChangesMode()) {\n <div class=\"__change-indicator\">\n <i class=\"fa-light fa-arrow-right\"></i>\n </div>\n }\n </td>\n }\n </tr>\n }\n </tbody>\n </table>\n </div>\n</div>\n<!--\n #endregion\n-->\n", styles: ["@layer properties;.axp-compare-view{position:relative;display:flex;height:100%;width:100%;flex-direction:column;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-compare-view .__filter-controls{flex-shrink:0;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-light);color:var(--color-on-light);border-color:var(--color-border-light);padding:calc(var(--spacing, .25rem) * 4)}.axp-compare-view .__filter-controls .__show-changes-toggle{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.axp-compare-view .__table-container{flex:1;overflow:auto;position:relative}.axp-compare-view .__table{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}.axp-compare-view .__table .__thead{position:sticky;top:0;z-index:20}.axp-compare-view .__table .__thead .__header-row .__field-header{width:calc(var(--spacing, .25rem) * 56);border-right-style:var(--tw-border-style);border-right-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);text-align:left;--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700);position:sticky;left:0;z-index:25}.axp-compare-view .__table .__thead .__header-row .__object-header{position:relative;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);text-align:center;min-width:250px;width:250px}.axp-compare-view .__table .__thead .__header-row .__object-header .__object-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-compare-view .__table .__thead .__header-row .__object-header .__object-description{margin-top:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:75%}.axp-compare-view .__table .__thead .__header-row .__object-header .__remove-object-button{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 0);top:50%;display:flex;width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6);--tw-translate-y: -50%;translate:var(--tw-translate-x) var(--tw-translate-y);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);background-color:rgba(var(--ax-sys-color-light-surface));font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.axp-compare-view .__table .__thead .__header-row .__object-header .__remove-object-button:hover{background-color:rgba(var(--ax-sys-color-danger-100));color:rgba(var(--ax-sys-color-danger-600))}.axp-compare-view .__table .__tbody .__row{transition-property:all;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .2s;transition-duration:.2s}.axp-compare-view .__table .__tbody .__row.__row--odd{background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest)}.axp-compare-view .__table .__tbody .__row.__row--has-differences{border-left-style:var(--tw-border-style);border-left-width:4px;border-left-color:rgba(var(--ax-sys-color-warning-surface))}.axp-compare-view .__table .__tbody .__row.__row--has-differences .__field-cell{border-inline-start-style:var(--tw-border-style);border-inline-start-width:4px;border-inline-start-color:rgba(var(--ax-sys-color-warning-surface));background-color:rgba(var(--ax-sys-color-warning-50));background-color:rgba(var(--ax-sys-color-warning-surface))}@supports (color: color-mix(in lab,red,red)){.axp-compare-view .__table .__tbody .__row.__row--has-differences .__field-cell{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-surface)) 5%,transparent)}}.axp-compare-view .__table .__tbody .__row.__row--has-differences .__field-cell:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-warning-900))}.axp-compare-view .__table .__tbody .__row.__row--has-equal-values{border-left-style:var(--tw-border-style);border-left-width:4px;border-left-color:rgba(var(--ax-sys-color-success-surface))}.axp-compare-view .__table .__tbody .__row.__row--has-equal-values .__field-cell{border-inline-start-style:var(--tw-border-style);border-inline-start-width:4px;border-inline-start-color:rgba(var(--ax-sys-color-success-surface));background-color:rgba(var(--ax-sys-color-success-50));background-color:rgba(var(--ax-sys-color-success-surface))}@supports (color: color-mix(in lab,red,red)){.axp-compare-view .__table .__tbody .__row.__row--has-equal-values .__field-cell{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 5%,transparent)}}.axp-compare-view .__table .__tbody .__row.__row--has-equal-values .__field-cell:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-success-900))}.axp-compare-view .__table .__tbody .__row .__field-cell{width:calc(var(--spacing, .25rem) * 56);border-right-style:var(--tw-border-style);border-right-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);vertical-align:top;position:sticky;left:0;z-index:15}.axp-compare-view .__table .__tbody .__row .__field-cell .__field-content{display:flex;flex-direction:column;gap:var(--spacing, .25rem)}.axp-compare-view .__table .__tbody .__row .__field-cell .__field-content .__field-title{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-compare-view .__table .__tbody .__row .__field-cell .__field-content .__field-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:75%}.axp-compare-view .__table .__tbody .__row .__object-cell{position:relative;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);text-align:center;vertical-align:middle}.axp-compare-view .__table .__tbody .__row .__object-cell.__cell--changed .__object-content{border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-warning-200));padding:calc(var(--spacing, .25rem) * 2)}.axp-compare-view .__table .__tbody .__row .__object-cell .__object-content{position:relative;display:flex;align-items:center;justify-content:center}.axp-compare-view .__table .__tbody .__row .__object-cell .__change-indicator{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * -1);top:50%;--tw-translate-y: -50%;translate:var(--tw-translate-x) var(--tw-translate-y);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-warning-surface));font-size:.875rem}.axp-compare-view .__table .__tbody .__row .__object-cell .__object-placeholder{opacity:75%}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-translate-x{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-y{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-z{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-duration{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-font-weight: initial;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0;--tw-duration: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
1871
1870
  }], propDecorators: { inputs: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputs", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }] } });
1872
1871
 
1873
1872
  //#endregion
@@ -2432,7 +2431,7 @@ class AXPDataSelectorComponent extends AXBasePageComponent {
2432
2431
  }
2433
2432
  }
2434
2433
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPDataSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2435
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPDataSelectorComponent, isStandalone: true, selector: "axp-data-selector", viewQueries: [{ propertyName: "grid", first: true, predicate: ["grid"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"axp-data-selector\">\n <!-- Main Content Area -->\n <div class=\"axp-data-selector-content\" [class.with-category-filter]=\"categoryEnabled()\">\n <!-- Category Filter Side Panel -->\n @if (categoryEnabled()) {\n <div class=\"axp-category-filter-panel\" [style.width]=\"config().category?.width || '300px'\">\n <axp-category-tree [dataSource]=\"config().category!.dataSource\" [config]=\"categoryTreeConfig()\"\n [actions]=\"categoryTreeActions()\" (nodeClick)=\"handleCategoryFilterClick($event)\">\n </axp-category-tree>\n </div>\n }\n\n <!-- Main Data Area -->\n <div class=\"axp-main-data-area\">\n @if (hasSearch()) {\n <div class=\"w-full mb-2\">\n <ax-search-box [placeholder]=\"searchPlaceholderText()\" [value]=\"searchTerm\"\n (onValueChanged)=\"handleChangeSearchValue($event)\" [axAutoFocus]=\"true\">\n <ax-clear-button></ax-clear-button>\n </ax-search-box>\n </div>\n }\n <ax-data-table #grid [showFooter]=\"false\" class=\"flex-1 min-h-0\" [paging]=\"true\"\n [loading]=\"{ enabled: true, animation: true }\" [dataSource]=\"config().dataSource\"\n [parentField]=\"config().grid.parentField\" [selectedRows]=\"selectedItems()\"\n (selectedRowsChange)=\"handleSelectedRowsChange($event)\" (onRowClick)=\"handleRowClick($event)\"\n (onRowDbClick)=\"handleRowDbClick($event)\">\n <ax-select-column fixed=\"start\" [width]=\"'50px'\"></ax-select-column>\n\n @for (col of config().grid.columns; track col.name) {\n @if (col.visible) {\n <axp-widget-column-renderer [expandHandler]=\"$index === 0 && config().grid.parentField ? true : false\"\n [caption]=\"col.title | translate | async\" [customWidth]=\"col.width || ''\" [node]=\"{\n path: col.dataPath || col.name,\n type: col.widget.type,\n options: col.widget.options\n }\">\n </axp-widget-column-renderer>\n }\n }\n @if (hasRowActionPrimary()) {\n <ax-command-column fixed=\"end\" [width]=\"primaryRowActionColumnWidth()\" [items]=\"primaryRowActionItems()\"\n (onItemClick)=\"handleRowActionClick($event)\">\n </ax-command-column>\n }\n @if (hasRowActionDropdown()) {\n <ax-dropdown-command-column fixed=\"end\" [width]=\"'60px'\" [items]=\"getDropdownRowActionItems\"\n (onItemClick)=\"handleRowActionClick($event)\">\n </ax-dropdown-command-column>\n }\n </ax-data-table>\n </div>\n </div>\n</div>\n\n<ax-footer>\n <ax-prefix>\n @if (config().footerPrefixAction; as prefixAction) {\n <!-- ----- Optional footer prefix action (e.g. sync from remote provider) ----- -->\n <ax-button\n look=\"twotone\"\n color=\"primary\"\n type=\"button\"\n [disabled]=\"footerPrefixActionInProgress()\"\n [text]=\"prefixAction.text\"\n (onClick)=\"handleFooterPrefixActionClick()\"\n >\n <ax-prefix>\n @if (footerPrefixActionInProgress()) {\n <ax-loading></ax-loading>\n }\n <!-- ----- Footer prefix action icon when idle ----- -->\n @else if (prefixAction.icon) {\n <ax-icon [icon]=\"prefixAction.icon\"></ax-icon>\n }\n </ax-prefix>\n </ax-button>\n }\n @if ((config().create?.mode === 'full' || config().create?.mode === 'quick') && config().create?.onCreate) {\n <ax-button look=\"twotone\" color=\"primary\" [text]=\"'@general:actions.create.title' | translate | async\"\n (onClick)=\"handleCreateNewClick(config().create?.mode === 'quick' ? 'quick' : 'full')\">\n <ax-prefix>\n <ax-icon icon=\"far fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n }\n </ax-prefix>\n <ax-suffix>\n <ax-button look=\"solid\" [text]=\"('@general:actions.close.title' | translate | async)!\"\n (onClick)=\"handleCloseClick()\">\n </ax-button>\n <ax-button look=\"solid\" color=\"primary\" [text]=\"('@general:actions.select.title' | translate | async)!\"\n (onClick)=\"handleSelectClick()\" [disabled]=\"allowSelect() === false\">\n <!-- @if (selectionMode() === 'multiple' && selectedCount() > 0) {\n <ax-badge [text]=\"selectedCount().toString()\" color=\"accent1\"\n class=\"absolute end-[2px] top-[2px]\"></ax-badge>\n } -->\n </ax-button>\n </ax-suffix>\n</ax-footer>\n", styles: ["axp-data-selector{display:flex;flex-direction:column;flex:1;min-height:0;height:100%;overflow:hidden}.expand-handler{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;margin-right:8px}.expand-handler:hover{opacity:.8}.axp-data-selector{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}.axp-data-selector-content{display:flex;flex:1;min-height:0;overflow:hidden}.axp-data-selector-content.with-category-filter .axp-main-data-area{flex:1;min-width:0;min-height:0;overflow:hidden}.axp-data-selector .axp-category-filter-panel{display:flex;flex-direction:column;border-right:1px solid var(--border-color);padding:1rem;background:var(--surface-color);flex-shrink:0;min-height:0;min-width:0;overflow:hidden}.axp-data-selector .axp-category-filter-panel axp-category-tree{display:flex;flex:1;flex-direction:column;min-height:0;min-width:0;overflow:hidden}.axp-data-selector .axp-main-data-area{flex:1;min-width:0;min-height:0;overflow:hidden;padding:1rem;display:flex;flex-direction:column;gap:1rem}.axp-data-selector .axp-main-data-area ax-data-table{flex:1;min-height:0;height:100%;display:flex;flex-direction:column;overflow:hidden}.axp-data-selector .axp-main-data-area .search-box{width:100%;flex-shrink:0}.popup:has(axp-data-selector){display:flex;flex-direction:column;height:90vh;max-height:90vh;overflow:hidden}.popup:has(axp-data-selector) .popup-main-container{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;overflow:hidden}.popup:has(axp-data-selector) .popup-body-container{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;overflow:hidden!important}.popup:has(axp-data-selector) .popup-footer-container{flex-shrink:0}@media(min-width:320px)and (max-width:640px){.popup.ax-popup-sm:has(axp-data-selector),.popup.ax-popup-md:has(axp-data-selector),.popup.ax-popup-lg:has(axp-data-selector){height:90vh!important;max-height:90vh!important}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXCommonModule }, { kind: "directive", type: i1$5.AXAutoFocusDirective, selector: "[axAutoFocus]", inputs: ["axAutoFocus", "axAutoFocusTime"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: AXFormModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i2$1.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: AXDropdownButtonModule }, { kind: "ngmodule", type: AXDataTableModule }, { kind: "component", type: i4$3.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "hasChildrenField", "rowDetailsTemplate", "rowCssClass", "cellCssClass", "highlightText", "look", "rowTemplate", "emptyTemplate", "noDataTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: i4$3.AXRowSelectColumnComponent, selector: "ax-select-column", inputs: ["width", "caption", "fixed"] }, { kind: "component", type: i4$3.AXRowCommandColumnComponent, selector: "ax-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "items"], outputs: ["onItemClick"] }, { kind: "component", type: i4$3.AXRowDropdownCommandColumnComponent, selector: "ax-dropdown-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "emptyStateTemplate", "emptyStateText", "items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i5.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "component", type: i3$3.AXPWidgetColumnRendererComponent, selector: "axp-widget-column-renderer", inputs: ["caption", "customExpandIcon", "customCollapseIcon", "customWidth", "node", "footerTemplate", "expandHandler", "sortEnabled", "headerSortDirection", "headerSortPriority", "columnFixed", "cellTemplate", "headerTemplate"], outputs: ["sortToggle"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i7.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "component", type: AXPCategoryTreeComponent, selector: "axp-category-tree", inputs: ["dataSource", "config", "actions", "events"], outputs: ["nodeClick", "nodeSelect", "nodeCreate", "nodeUpdate", "nodeDelete", "searchChange", "collapseChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2434
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPDataSelectorComponent, isStandalone: true, selector: "axp-data-selector", viewQueries: [{ propertyName: "grid", first: true, predicate: ["grid"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"axp-data-selector\">\n <!-- Main Content Area -->\n <div class=\"axp-data-selector-content\" [class.with-category-filter]=\"categoryEnabled()\">\n <!-- Category Filter Side Panel -->\n @if (categoryEnabled()) {\n <div class=\"axp-category-filter-panel\" [style.width]=\"config().category?.width || '300px'\">\n <axp-category-tree [dataSource]=\"config().category!.dataSource\" [config]=\"categoryTreeConfig()\"\n [actions]=\"categoryTreeActions()\" (nodeClick)=\"handleCategoryFilterClick($event)\">\n </axp-category-tree>\n </div>\n }\n\n <!-- Main Data Area -->\n <div class=\"axp-main-data-area\">\n @if (hasSearch()) {\n <div class=\"w-full mb-2\">\n <ax-search-box [placeholder]=\"searchPlaceholderText()\" [value]=\"searchTerm\"\n (onValueChanged)=\"handleChangeSearchValue($event)\" [axAutoFocus]=\"true\">\n <ax-clear-button></ax-clear-button>\n </ax-search-box>\n </div>\n }\n <ax-data-table #grid [showFooter]=\"false\" class=\"flex-1 min-h-0\" [paging]=\"true\"\n [loading]=\"{ enabled: true, animation: true }\" [dataSource]=\"config().dataSource\"\n [parentField]=\"config().grid.parentField\" [selectedRows]=\"selectedItems()\"\n (selectedRowsChange)=\"handleSelectedRowsChange($event)\" (onRowClick)=\"handleRowClick($event)\"\n (onRowDbClick)=\"handleRowDbClick($event)\">\n <ax-select-column fixed=\"start\" [width]=\"'50px'\"></ax-select-column>\n\n @for (col of config().grid.columns; track col.name) {\n @if (col.visible) {\n <axp-widget-column-renderer [expandHandler]=\"$index === 0 && config().grid.parentField ? true : false\"\n [caption]=\"col.title | translate | async\" [customWidth]=\"col.width || ''\" [node]=\"{\n path: col.dataPath || col.name,\n type: col.widget.type,\n options: col.widget.options\n }\">\n </axp-widget-column-renderer>\n }\n }\n @if (hasRowActionPrimary()) {\n <ax-command-column fixed=\"end\" [width]=\"primaryRowActionColumnWidth()\" [items]=\"primaryRowActionItems()\"\n (onItemClick)=\"handleRowActionClick($event)\">\n </ax-command-column>\n }\n @if (hasRowActionDropdown()) {\n <ax-dropdown-command-column fixed=\"end\" [width]=\"'60px'\" [items]=\"getDropdownRowActionItems\"\n (onItemClick)=\"handleRowActionClick($event)\">\n </ax-dropdown-command-column>\n }\n </ax-data-table>\n </div>\n </div>\n</div>\n\n<ax-footer>\n <ax-prefix>\n @if (config().footerPrefixAction; as prefixAction) {\n <!-- ----- Optional footer prefix action (e.g. sync from remote provider) ----- -->\n <ax-button\n look=\"twotone\"\n color=\"primary\"\n type=\"button\"\n [disabled]=\"footerPrefixActionInProgress()\"\n [text]=\"prefixAction.text\"\n (onClick)=\"handleFooterPrefixActionClick()\"\n >\n <ax-prefix>\n @if (footerPrefixActionInProgress()) {\n <ax-loading></ax-loading>\n }\n <!-- ----- Footer prefix action icon when idle ----- -->\n @else if (prefixAction.icon) {\n <ax-icon [icon]=\"prefixAction.icon\"></ax-icon>\n }\n </ax-prefix>\n </ax-button>\n }\n @if ((config().create?.mode === 'full' || config().create?.mode === 'quick') && config().create?.onCreate) {\n <ax-button look=\"twotone\" color=\"primary\" [text]=\"'@general:actions.create.title' | translate | async\"\n (onClick)=\"handleCreateNewClick(config().create?.mode === 'quick' ? 'quick' : 'full')\">\n <ax-prefix>\n <ax-icon icon=\"far fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n }\n </ax-prefix>\n <ax-suffix>\n <ax-button look=\"solid\" [text]=\"('@general:actions.close.title' | translate | async)!\"\n (onClick)=\"handleCloseClick()\">\n </ax-button>\n <ax-button look=\"solid\" color=\"primary\" [text]=\"('@general:actions.select.title' | translate | async)!\"\n (onClick)=\"handleSelectClick()\" [disabled]=\"allowSelect() === false\">\n <!-- @if (selectionMode() === 'multiple' && selectedCount() > 0) {\n <ax-badge [text]=\"selectedCount().toString()\" color=\"accent1\"\n class=\"absolute end-[2px] top-[2px]\"></ax-badge>\n } -->\n </ax-button>\n </ax-suffix>\n</ax-footer>\n", styles: ["axp-data-selector{display:flex;height:100%;min-height:0;flex:1;flex-direction:column;overflow:hidden}.expand-handler{display:inline-flex;cursor:pointer;align-items:center;justify-content:center;width:20px;height:20px;margin-right:8px}.expand-handler:hover{opacity:.8}.axp-data-selector{display:flex;min-height:0;flex:1;flex-direction:column;overflow:hidden}.axp-data-selector .axp-data-selector-content{display:flex;min-height:0;flex:1;overflow:hidden}.axp-data-selector .axp-data-selector-content.with-category-filter .axp-main-data-area{min-height:0;min-width:0;flex:1;overflow:hidden}.axp-data-selector .axp-category-filter-panel{display:flex;min-height:0;min-width:0;flex-shrink:0;flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 4);border-right:1px solid var(--border-color);background:var(--surface-color)}.axp-data-selector .axp-category-filter-panel axp-category-tree{display:flex;min-height:0;min-width:0;flex:1;flex-direction:column;overflow:hidden}.axp-data-selector .axp-main-data-area{display:flex;min-height:0;min-width:0;flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4);overflow:hidden;padding:calc(var(--spacing, .25rem) * 4)}.axp-data-selector .axp-main-data-area ax-data-table{display:flex;height:100%;min-height:0;flex:1;flex-direction:column;overflow:hidden}.axp-data-selector .axp-main-data-area .search-box{width:100%;flex-shrink:0}.ax-popup:has(axp-data-selector){display:flex;flex-direction:column;overflow:hidden;height:90vh;max-height:90vh}.ax-popup:has(axp-data-selector) .ax-popup-main-container{display:flex;min-height:0;flex:1;flex-direction:column;overflow:hidden;flex:1 1 auto}.ax-popup:has(axp-data-selector) .ax-popup-body-container{display:flex;min-height:0;flex:1;flex-direction:column;overflow:hidden;flex:1 1 auto;overflow:hidden!important}.ax-popup:has(axp-data-selector) .ax-popup-footer-container{flex-shrink:0}@media(min-width:320px)and (max-width:640px){.ax-popup.ax-popup-sm:has(axp-data-selector),.ax-popup.ax-popup-md:has(axp-data-selector),.ax-popup.ax-popup-lg:has(axp-data-selector){height:90vh!important;max-height:90vh!important}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXCommonModule }, { kind: "directive", type: i1$6.AXAutoFocusDirective, selector: "[axAutoFocus]", inputs: ["axAutoFocus", "axAutoFocusTime"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: AXFormModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i2$1.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: AXDropdownButtonModule }, { kind: "ngmodule", type: AXDataTableModule }, { kind: "component", type: i4$1.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "hasChildrenField", "rowDetailsTemplate", "rowCssClass", "cellCssClass", "highlightText", "look", "rowTemplate", "emptyTemplate", "noDataTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: i4$1.AXRowSelectColumnComponent, selector: "ax-select-column", inputs: ["width", "caption", "fixed"] }, { kind: "component", type: i4$1.AXRowCommandColumnComponent, selector: "ax-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "items"], outputs: ["onItemClick"] }, { kind: "component", type: i4$1.AXRowDropdownCommandColumnComponent, selector: "ax-dropdown-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "emptyStateTemplate", "emptyStateText", "items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i5.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "component", type: i3$3.AXPWidgetColumnRendererComponent, selector: "axp-widget-column-renderer", inputs: ["caption", "customExpandIcon", "customCollapseIcon", "customWidth", "node", "footerTemplate", "expandHandler", "sortEnabled", "headerSortDirection", "headerSortPriority", "columnFixed", "cellTemplate", "headerTemplate"], outputs: ["sortToggle"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i7.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "component", type: AXPCategoryTreeComponent, selector: "axp-category-tree", inputs: ["dataSource", "config", "actions", "events"], outputs: ["nodeClick", "nodeSelect", "nodeCreate", "nodeUpdate", "nodeDelete", "searchChange", "collapseChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2436
2435
  }
2437
2436
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPDataSelectorComponent, decorators: [{
2438
2437
  type: Component,
@@ -2450,7 +2449,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
2450
2449
  AXBadgeModule,
2451
2450
  AXLoadingModule,
2452
2451
  AXPCategoryTreeComponent,
2453
- ], inputs: [], template: "<div class=\"axp-data-selector\">\n <!-- Main Content Area -->\n <div class=\"axp-data-selector-content\" [class.with-category-filter]=\"categoryEnabled()\">\n <!-- Category Filter Side Panel -->\n @if (categoryEnabled()) {\n <div class=\"axp-category-filter-panel\" [style.width]=\"config().category?.width || '300px'\">\n <axp-category-tree [dataSource]=\"config().category!.dataSource\" [config]=\"categoryTreeConfig()\"\n [actions]=\"categoryTreeActions()\" (nodeClick)=\"handleCategoryFilterClick($event)\">\n </axp-category-tree>\n </div>\n }\n\n <!-- Main Data Area -->\n <div class=\"axp-main-data-area\">\n @if (hasSearch()) {\n <div class=\"w-full mb-2\">\n <ax-search-box [placeholder]=\"searchPlaceholderText()\" [value]=\"searchTerm\"\n (onValueChanged)=\"handleChangeSearchValue($event)\" [axAutoFocus]=\"true\">\n <ax-clear-button></ax-clear-button>\n </ax-search-box>\n </div>\n }\n <ax-data-table #grid [showFooter]=\"false\" class=\"flex-1 min-h-0\" [paging]=\"true\"\n [loading]=\"{ enabled: true, animation: true }\" [dataSource]=\"config().dataSource\"\n [parentField]=\"config().grid.parentField\" [selectedRows]=\"selectedItems()\"\n (selectedRowsChange)=\"handleSelectedRowsChange($event)\" (onRowClick)=\"handleRowClick($event)\"\n (onRowDbClick)=\"handleRowDbClick($event)\">\n <ax-select-column fixed=\"start\" [width]=\"'50px'\"></ax-select-column>\n\n @for (col of config().grid.columns; track col.name) {\n @if (col.visible) {\n <axp-widget-column-renderer [expandHandler]=\"$index === 0 && config().grid.parentField ? true : false\"\n [caption]=\"col.title | translate | async\" [customWidth]=\"col.width || ''\" [node]=\"{\n path: col.dataPath || col.name,\n type: col.widget.type,\n options: col.widget.options\n }\">\n </axp-widget-column-renderer>\n }\n }\n @if (hasRowActionPrimary()) {\n <ax-command-column fixed=\"end\" [width]=\"primaryRowActionColumnWidth()\" [items]=\"primaryRowActionItems()\"\n (onItemClick)=\"handleRowActionClick($event)\">\n </ax-command-column>\n }\n @if (hasRowActionDropdown()) {\n <ax-dropdown-command-column fixed=\"end\" [width]=\"'60px'\" [items]=\"getDropdownRowActionItems\"\n (onItemClick)=\"handleRowActionClick($event)\">\n </ax-dropdown-command-column>\n }\n </ax-data-table>\n </div>\n </div>\n</div>\n\n<ax-footer>\n <ax-prefix>\n @if (config().footerPrefixAction; as prefixAction) {\n <!-- ----- Optional footer prefix action (e.g. sync from remote provider) ----- -->\n <ax-button\n look=\"twotone\"\n color=\"primary\"\n type=\"button\"\n [disabled]=\"footerPrefixActionInProgress()\"\n [text]=\"prefixAction.text\"\n (onClick)=\"handleFooterPrefixActionClick()\"\n >\n <ax-prefix>\n @if (footerPrefixActionInProgress()) {\n <ax-loading></ax-loading>\n }\n <!-- ----- Footer prefix action icon when idle ----- -->\n @else if (prefixAction.icon) {\n <ax-icon [icon]=\"prefixAction.icon\"></ax-icon>\n }\n </ax-prefix>\n </ax-button>\n }\n @if ((config().create?.mode === 'full' || config().create?.mode === 'quick') && config().create?.onCreate) {\n <ax-button look=\"twotone\" color=\"primary\" [text]=\"'@general:actions.create.title' | translate | async\"\n (onClick)=\"handleCreateNewClick(config().create?.mode === 'quick' ? 'quick' : 'full')\">\n <ax-prefix>\n <ax-icon icon=\"far fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n }\n </ax-prefix>\n <ax-suffix>\n <ax-button look=\"solid\" [text]=\"('@general:actions.close.title' | translate | async)!\"\n (onClick)=\"handleCloseClick()\">\n </ax-button>\n <ax-button look=\"solid\" color=\"primary\" [text]=\"('@general:actions.select.title' | translate | async)!\"\n (onClick)=\"handleSelectClick()\" [disabled]=\"allowSelect() === false\">\n <!-- @if (selectionMode() === 'multiple' && selectedCount() > 0) {\n <ax-badge [text]=\"selectedCount().toString()\" color=\"accent1\"\n class=\"absolute end-[2px] top-[2px]\"></ax-badge>\n } -->\n </ax-button>\n </ax-suffix>\n</ax-footer>\n", styles: ["axp-data-selector{display:flex;flex-direction:column;flex:1;min-height:0;height:100%;overflow:hidden}.expand-handler{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;margin-right:8px}.expand-handler:hover{opacity:.8}.axp-data-selector{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}.axp-data-selector-content{display:flex;flex:1;min-height:0;overflow:hidden}.axp-data-selector-content.with-category-filter .axp-main-data-area{flex:1;min-width:0;min-height:0;overflow:hidden}.axp-data-selector .axp-category-filter-panel{display:flex;flex-direction:column;border-right:1px solid var(--border-color);padding:1rem;background:var(--surface-color);flex-shrink:0;min-height:0;min-width:0;overflow:hidden}.axp-data-selector .axp-category-filter-panel axp-category-tree{display:flex;flex:1;flex-direction:column;min-height:0;min-width:0;overflow:hidden}.axp-data-selector .axp-main-data-area{flex:1;min-width:0;min-height:0;overflow:hidden;padding:1rem;display:flex;flex-direction:column;gap:1rem}.axp-data-selector .axp-main-data-area ax-data-table{flex:1;min-height:0;height:100%;display:flex;flex-direction:column;overflow:hidden}.axp-data-selector .axp-main-data-area .search-box{width:100%;flex-shrink:0}.popup:has(axp-data-selector){display:flex;flex-direction:column;height:90vh;max-height:90vh;overflow:hidden}.popup:has(axp-data-selector) .popup-main-container{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;overflow:hidden}.popup:has(axp-data-selector) .popup-body-container{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;overflow:hidden!important}.popup:has(axp-data-selector) .popup-footer-container{flex-shrink:0}@media(min-width:320px)and (max-width:640px){.popup.ax-popup-sm:has(axp-data-selector),.popup.ax-popup-md:has(axp-data-selector),.popup.ax-popup-lg:has(axp-data-selector){height:90vh!important;max-height:90vh!important}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
2452
+ ], inputs: [], template: "<div class=\"axp-data-selector\">\n <!-- Main Content Area -->\n <div class=\"axp-data-selector-content\" [class.with-category-filter]=\"categoryEnabled()\">\n <!-- Category Filter Side Panel -->\n @if (categoryEnabled()) {\n <div class=\"axp-category-filter-panel\" [style.width]=\"config().category?.width || '300px'\">\n <axp-category-tree [dataSource]=\"config().category!.dataSource\" [config]=\"categoryTreeConfig()\"\n [actions]=\"categoryTreeActions()\" (nodeClick)=\"handleCategoryFilterClick($event)\">\n </axp-category-tree>\n </div>\n }\n\n <!-- Main Data Area -->\n <div class=\"axp-main-data-area\">\n @if (hasSearch()) {\n <div class=\"w-full mb-2\">\n <ax-search-box [placeholder]=\"searchPlaceholderText()\" [value]=\"searchTerm\"\n (onValueChanged)=\"handleChangeSearchValue($event)\" [axAutoFocus]=\"true\">\n <ax-clear-button></ax-clear-button>\n </ax-search-box>\n </div>\n }\n <ax-data-table #grid [showFooter]=\"false\" class=\"flex-1 min-h-0\" [paging]=\"true\"\n [loading]=\"{ enabled: true, animation: true }\" [dataSource]=\"config().dataSource\"\n [parentField]=\"config().grid.parentField\" [selectedRows]=\"selectedItems()\"\n (selectedRowsChange)=\"handleSelectedRowsChange($event)\" (onRowClick)=\"handleRowClick($event)\"\n (onRowDbClick)=\"handleRowDbClick($event)\">\n <ax-select-column fixed=\"start\" [width]=\"'50px'\"></ax-select-column>\n\n @for (col of config().grid.columns; track col.name) {\n @if (col.visible) {\n <axp-widget-column-renderer [expandHandler]=\"$index === 0 && config().grid.parentField ? true : false\"\n [caption]=\"col.title | translate | async\" [customWidth]=\"col.width || ''\" [node]=\"{\n path: col.dataPath || col.name,\n type: col.widget.type,\n options: col.widget.options\n }\">\n </axp-widget-column-renderer>\n }\n }\n @if (hasRowActionPrimary()) {\n <ax-command-column fixed=\"end\" [width]=\"primaryRowActionColumnWidth()\" [items]=\"primaryRowActionItems()\"\n (onItemClick)=\"handleRowActionClick($event)\">\n </ax-command-column>\n }\n @if (hasRowActionDropdown()) {\n <ax-dropdown-command-column fixed=\"end\" [width]=\"'60px'\" [items]=\"getDropdownRowActionItems\"\n (onItemClick)=\"handleRowActionClick($event)\">\n </ax-dropdown-command-column>\n }\n </ax-data-table>\n </div>\n </div>\n</div>\n\n<ax-footer>\n <ax-prefix>\n @if (config().footerPrefixAction; as prefixAction) {\n <!-- ----- Optional footer prefix action (e.g. sync from remote provider) ----- -->\n <ax-button\n look=\"twotone\"\n color=\"primary\"\n type=\"button\"\n [disabled]=\"footerPrefixActionInProgress()\"\n [text]=\"prefixAction.text\"\n (onClick)=\"handleFooterPrefixActionClick()\"\n >\n <ax-prefix>\n @if (footerPrefixActionInProgress()) {\n <ax-loading></ax-loading>\n }\n <!-- ----- Footer prefix action icon when idle ----- -->\n @else if (prefixAction.icon) {\n <ax-icon [icon]=\"prefixAction.icon\"></ax-icon>\n }\n </ax-prefix>\n </ax-button>\n }\n @if ((config().create?.mode === 'full' || config().create?.mode === 'quick') && config().create?.onCreate) {\n <ax-button look=\"twotone\" color=\"primary\" [text]=\"'@general:actions.create.title' | translate | async\"\n (onClick)=\"handleCreateNewClick(config().create?.mode === 'quick' ? 'quick' : 'full')\">\n <ax-prefix>\n <ax-icon icon=\"far fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n }\n </ax-prefix>\n <ax-suffix>\n <ax-button look=\"solid\" [text]=\"('@general:actions.close.title' | translate | async)!\"\n (onClick)=\"handleCloseClick()\">\n </ax-button>\n <ax-button look=\"solid\" color=\"primary\" [text]=\"('@general:actions.select.title' | translate | async)!\"\n (onClick)=\"handleSelectClick()\" [disabled]=\"allowSelect() === false\">\n <!-- @if (selectionMode() === 'multiple' && selectedCount() > 0) {\n <ax-badge [text]=\"selectedCount().toString()\" color=\"accent1\"\n class=\"absolute end-[2px] top-[2px]\"></ax-badge>\n } -->\n </ax-button>\n </ax-suffix>\n</ax-footer>\n", styles: ["axp-data-selector{display:flex;height:100%;min-height:0;flex:1;flex-direction:column;overflow:hidden}.expand-handler{display:inline-flex;cursor:pointer;align-items:center;justify-content:center;width:20px;height:20px;margin-right:8px}.expand-handler:hover{opacity:.8}.axp-data-selector{display:flex;min-height:0;flex:1;flex-direction:column;overflow:hidden}.axp-data-selector .axp-data-selector-content{display:flex;min-height:0;flex:1;overflow:hidden}.axp-data-selector .axp-data-selector-content.with-category-filter .axp-main-data-area{min-height:0;min-width:0;flex:1;overflow:hidden}.axp-data-selector .axp-category-filter-panel{display:flex;min-height:0;min-width:0;flex-shrink:0;flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 4);border-right:1px solid var(--border-color);background:var(--surface-color)}.axp-data-selector .axp-category-filter-panel axp-category-tree{display:flex;min-height:0;min-width:0;flex:1;flex-direction:column;overflow:hidden}.axp-data-selector .axp-main-data-area{display:flex;min-height:0;min-width:0;flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4);overflow:hidden;padding:calc(var(--spacing, .25rem) * 4)}.axp-data-selector .axp-main-data-area ax-data-table{display:flex;height:100%;min-height:0;flex:1;flex-direction:column;overflow:hidden}.axp-data-selector .axp-main-data-area .search-box{width:100%;flex-shrink:0}.ax-popup:has(axp-data-selector){display:flex;flex-direction:column;overflow:hidden;height:90vh;max-height:90vh}.ax-popup:has(axp-data-selector) .ax-popup-main-container{display:flex;min-height:0;flex:1;flex-direction:column;overflow:hidden;flex:1 1 auto}.ax-popup:has(axp-data-selector) .ax-popup-body-container{display:flex;min-height:0;flex:1;flex-direction:column;overflow:hidden;flex:1 1 auto;overflow:hidden!important}.ax-popup:has(axp-data-selector) .ax-popup-footer-container{flex-shrink:0}@media(min-width:320px)and (max-width:640px){.ax-popup.ax-popup-sm:has(axp-data-selector),.ax-popup.ax-popup-md:has(axp-data-selector),.ax-popup.ax-popup-lg:has(axp-data-selector){height:90vh!important;max-height:90vh!important}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
2454
2453
  }], ctorParameters: () => [], propDecorators: { grid: [{ type: i0.ViewChild, args: ['grid', { isSignal: true }] }] } });
2455
2454
 
2456
2455
  var dataSelector_component = /*#__PURE__*/Object.freeze({
@@ -2563,13 +2562,13 @@ class AXPDragDropListComponent {
2563
2562
  }
2564
2563
  }
2565
2564
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPDragDropListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2566
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPDragDropListComponent, isStandalone: true, selector: "axp-drag-drop-list", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, listId: { classPropertyName: "listId", publicName: "listId", isSignal: true, isRequired: false, transformFunction: null }, dropListGroup: { classPropertyName: "dropListGroup", publicName: "dropListGroup", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { items: "itemsChange", itemClick: "itemClick", dropListDropped: "dropListDropped" }, host: { classAttribute: "axp-drag-drop-list" }, ngImport: i0, template: "<div\n class=\"axp-drag-drop-list-container divide-y\"\n [attr.id]=\"listId()\"\n [attr.data-orientation]=\"orientation()\"\n axDropList\n [dropListGroup]=\"dropListGroup()\"\n [dropListOrientation]=\"orientation()\"\n (dropListDropped)=\"onDrop($event)\"\n [sortingDisabled]=\"disable()\"\n>\n @if (items().length === 0) {\n <div class=\"axp-drag-drop-list-empty\">\n <span class=\"axp-drag-drop-list-empty-message\">{{ emptyMessage() }}</span>\n </div>\n }\n\n @for (item of items(); track item.id; let i = $index) {\n <div\n class=\"axp-drag-drop-list-item\"\n [class.axp-drag-drop-list-item-disabled]=\"item.disabled\"\n [class]=\"item.cssClass\"\n axDrag\n [dragDisabled]=\"item.disabled || false\"\n (click)=\"onItemClick(item)\"\n >\n <div class=\"axp-drag-drop-list-item-handle\" axDragHandle>\n <i class=\"fa-solid fa-bars\"></i>\n </div>\n\n <div class=\"axp-drag-drop-list-item-content\">\n {{ item.content }}\n </div>\n </div>\n }\n</div>\n", styles: [".axp-drag-drop-list{display:block;width:100%}.axp-drag-drop-list-container{display:flex;flex-direction:column;gap:.5rem;min-height:3rem;padding:.5rem;border-radius:.25rem;background-color:rgb(var(--ax-sys-color-lightest-surface));border-width:1px}.axp-drag-drop-list-container[data-orientation=horizontal]{flex-direction:row}.axp-drag-drop-list-container[data-orientation=vertical]{flex-direction:column}.axp-drag-drop-list-empty{display:flex;align-items:center;justify-content:center;width:100%;min-height:3rem;padding:1rem}.axp-drag-drop-list-empty-message{color:var(--ax-text-secondary-color, #9e9e9e);font-size:.875rem;font-style:italic}.axp-drag-drop-list-item{display:flex;align-items:center;gap:.5rem;padding:.5rem;background-color:rgb(var(--ax-sys-color-lightest-surface));cursor:move;transition:all .2s ease;-webkit-user-select:none;user-select:none}.axp-drag-drop-list-item.cdk-drag-preview{box-shadow:0 5px 10px #0003;opacity:.9}.axp-drag-drop-list-item.cdk-drag-placeholder{opacity:.3;border-style:dashed}.axp-drag-drop-list-item.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.axp-drag-drop-list-item-disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.axp-drag-drop-list-item-handle{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1.5rem;height:1.5rem;cursor:grab;transition:color .2s ease}.axp-drag-drop-list-item-handle:active{cursor:grabbing}.axp-drag-drop-list-item-handle svg{width:100%;height:100%}.axp-drag-drop-list-item-content{flex:1;padding-bottom:2px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem}.cdk-drop-list-dragging .axp-drag-drop-list-item:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.axp-drag-drop-list .cdk-drop-list-receiving{background-color:rgb(var(--ax-sys-color-primary-400))}.axp-drag-drop-list-item.cdk-drag-preview,.axp-drag-drop-list-item.ax-drag-preview{border:1px dashed rgb(var(--ax-sys-color-primary-400))!important;box-shadow:0 4px 12px #00000026;opacity:.9}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "directive", type: AXDragHandleDirective, selector: "[axDragHandle]" }, { kind: "directive", type: AXDropListDirective, selector: "[axDropList]", inputs: ["axDropList", "sortingDisabled", "dropListGroup", "dropListOrientation"], outputs: ["dropListDropped"], exportAs: ["axDropList"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2565
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPDragDropListComponent, isStandalone: true, selector: "axp-drag-drop-list", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, listId: { classPropertyName: "listId", publicName: "listId", isSignal: true, isRequired: false, transformFunction: null }, dropListGroup: { classPropertyName: "dropListGroup", publicName: "dropListGroup", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { items: "itemsChange", itemClick: "itemClick", dropListDropped: "dropListDropped" }, host: { classAttribute: "axp-drag-drop-list" }, ngImport: i0, template: "<div\n class=\"axp-drag-drop-list-container divide-y\"\n [attr.id]=\"listId()\"\n [attr.data-orientation]=\"orientation()\"\n axDropList\n [dropListGroup]=\"dropListGroup()\"\n [dropListOrientation]=\"orientation()\"\n (dropListDropped)=\"onDrop($event)\"\n [sortingDisabled]=\"disable()\"\n>\n @if (items().length === 0) {\n <div class=\"axp-drag-drop-list-empty\">\n <span class=\"axp-drag-drop-list-empty-message\">{{ emptyMessage() }}</span>\n </div>\n }\n\n @for (item of items(); track item.id; let i = $index) {\n <div\n class=\"axp-drag-drop-list-item\"\n [class.axp-drag-drop-list-item-disabled]=\"item.disabled\"\n [class]=\"item.cssClass\"\n axDrag\n [dragDisabled]=\"item.disabled || false\"\n (click)=\"onItemClick(item)\"\n >\n <div class=\"axp-drag-drop-list-item-handle\" axDragHandle>\n <i class=\"fa-solid fa-bars\"></i>\n </div>\n\n <div class=\"axp-drag-drop-list-item-content\">\n {{ item.content }}\n </div>\n </div>\n }\n</div>\n", styles: [".axp-drag-drop-list{display:block;width:100%}.axp-drag-drop-list .cdk-drop-list-receiving{background-color:rgb(var(--ax-sys-color-primary-400))}.axp-drag-drop-list-container{display:flex;min-height:calc(var(--spacing, .25rem) * 12);flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);border-radius:.25rem;padding:calc(var(--spacing, .25rem) * 2);background-color:rgb(var(--ax-sys-color-lightest-surface));border-width:1px}.axp-drag-drop-list-container[data-orientation=horizontal]{flex-direction:row}.axp-drag-drop-list-container[data-orientation=vertical]{flex-direction:column}.axp-drag-drop-list-empty{display:flex;min-height:calc(var(--spacing, .25rem) * 12);width:100%;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 4)}.axp-drag-drop-list-empty-message{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));font-style:italic;color:var(--ax-text-secondary-color, #9e9e9e)}.axp-drag-drop-list-item{display:flex;cursor:move;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding:calc(var(--spacing, .25rem) * 2);-webkit-user-select:none;user-select:none;background-color:rgb(var(--ax-sys-color-lightest-surface));transition:all .2s ease}.axp-drag-drop-list-item.cdk-drag-preview,.axp-drag-drop-list-item.ax-drag-preview{border:1px dashed rgb(var(--ax-sys-color-primary-400))!important;box-shadow:0 4px 12px #00000026;opacity:.9}.axp-drag-drop-list-item.cdk-drag-preview{box-shadow:0 5px 10px #0003;opacity:.9}.axp-drag-drop-list-item.cdk-drag-placeholder{--tw-border-style: dashed;border-style:dashed;opacity:30%}.axp-drag-drop-list-item.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.axp-drag-drop-list-item-disabled{pointer-events:none;cursor:not-allowed;opacity:50%}.axp-drag-drop-list-item-handle{display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);flex-shrink:0;cursor:grab;align-items:center;justify-content:center;transition:color .2s ease}.axp-drag-drop-list-item-handle:active{cursor:grabbing}.axp-drag-drop-list-item-handle svg{height:100%;width:100%}.axp-drag-drop-list-item-content{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-bottom:calc(var(--spacing, .25rem) * .5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.cdk-drop-list-dragging .axp-drag-drop-list-item:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "directive", type: AXDragHandleDirective, selector: "[axDragHandle]" }, { kind: "directive", type: AXDropListDirective, selector: "[axDropList]", inputs: ["axDropList", "sortingDisabled", "dropListGroup", "dropListOrientation"], outputs: ["dropListDropped"], exportAs: ["axDropList"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2567
2566
  }
2568
2567
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPDragDropListComponent, decorators: [{
2569
2568
  type: Component,
2570
2569
  args: [{ selector: 'axp-drag-drop-list', standalone: true, imports: [AXDragDirective, AXDragHandleDirective, AXDropListDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
2571
2570
  class: 'axp-drag-drop-list',
2572
- }, template: "<div\n class=\"axp-drag-drop-list-container divide-y\"\n [attr.id]=\"listId()\"\n [attr.data-orientation]=\"orientation()\"\n axDropList\n [dropListGroup]=\"dropListGroup()\"\n [dropListOrientation]=\"orientation()\"\n (dropListDropped)=\"onDrop($event)\"\n [sortingDisabled]=\"disable()\"\n>\n @if (items().length === 0) {\n <div class=\"axp-drag-drop-list-empty\">\n <span class=\"axp-drag-drop-list-empty-message\">{{ emptyMessage() }}</span>\n </div>\n }\n\n @for (item of items(); track item.id; let i = $index) {\n <div\n class=\"axp-drag-drop-list-item\"\n [class.axp-drag-drop-list-item-disabled]=\"item.disabled\"\n [class]=\"item.cssClass\"\n axDrag\n [dragDisabled]=\"item.disabled || false\"\n (click)=\"onItemClick(item)\"\n >\n <div class=\"axp-drag-drop-list-item-handle\" axDragHandle>\n <i class=\"fa-solid fa-bars\"></i>\n </div>\n\n <div class=\"axp-drag-drop-list-item-content\">\n {{ item.content }}\n </div>\n </div>\n }\n</div>\n", styles: [".axp-drag-drop-list{display:block;width:100%}.axp-drag-drop-list-container{display:flex;flex-direction:column;gap:.5rem;min-height:3rem;padding:.5rem;border-radius:.25rem;background-color:rgb(var(--ax-sys-color-lightest-surface));border-width:1px}.axp-drag-drop-list-container[data-orientation=horizontal]{flex-direction:row}.axp-drag-drop-list-container[data-orientation=vertical]{flex-direction:column}.axp-drag-drop-list-empty{display:flex;align-items:center;justify-content:center;width:100%;min-height:3rem;padding:1rem}.axp-drag-drop-list-empty-message{color:var(--ax-text-secondary-color, #9e9e9e);font-size:.875rem;font-style:italic}.axp-drag-drop-list-item{display:flex;align-items:center;gap:.5rem;padding:.5rem;background-color:rgb(var(--ax-sys-color-lightest-surface));cursor:move;transition:all .2s ease;-webkit-user-select:none;user-select:none}.axp-drag-drop-list-item.cdk-drag-preview{box-shadow:0 5px 10px #0003;opacity:.9}.axp-drag-drop-list-item.cdk-drag-placeholder{opacity:.3;border-style:dashed}.axp-drag-drop-list-item.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.axp-drag-drop-list-item-disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.axp-drag-drop-list-item-handle{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1.5rem;height:1.5rem;cursor:grab;transition:color .2s ease}.axp-drag-drop-list-item-handle:active{cursor:grabbing}.axp-drag-drop-list-item-handle svg{width:100%;height:100%}.axp-drag-drop-list-item-content{flex:1;padding-bottom:2px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem}.cdk-drop-list-dragging .axp-drag-drop-list-item:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.axp-drag-drop-list .cdk-drop-list-receiving{background-color:rgb(var(--ax-sys-color-primary-400))}.axp-drag-drop-list-item.cdk-drag-preview,.axp-drag-drop-list-item.ax-drag-preview{border:1px dashed rgb(var(--ax-sys-color-primary-400))!important;box-shadow:0 4px 12px #00000026;opacity:.9}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
2571
+ }, template: "<div\n class=\"axp-drag-drop-list-container divide-y\"\n [attr.id]=\"listId()\"\n [attr.data-orientation]=\"orientation()\"\n axDropList\n [dropListGroup]=\"dropListGroup()\"\n [dropListOrientation]=\"orientation()\"\n (dropListDropped)=\"onDrop($event)\"\n [sortingDisabled]=\"disable()\"\n>\n @if (items().length === 0) {\n <div class=\"axp-drag-drop-list-empty\">\n <span class=\"axp-drag-drop-list-empty-message\">{{ emptyMessage() }}</span>\n </div>\n }\n\n @for (item of items(); track item.id; let i = $index) {\n <div\n class=\"axp-drag-drop-list-item\"\n [class.axp-drag-drop-list-item-disabled]=\"item.disabled\"\n [class]=\"item.cssClass\"\n axDrag\n [dragDisabled]=\"item.disabled || false\"\n (click)=\"onItemClick(item)\"\n >\n <div class=\"axp-drag-drop-list-item-handle\" axDragHandle>\n <i class=\"fa-solid fa-bars\"></i>\n </div>\n\n <div class=\"axp-drag-drop-list-item-content\">\n {{ item.content }}\n </div>\n </div>\n }\n</div>\n", styles: [".axp-drag-drop-list{display:block;width:100%}.axp-drag-drop-list .cdk-drop-list-receiving{background-color:rgb(var(--ax-sys-color-primary-400))}.axp-drag-drop-list-container{display:flex;min-height:calc(var(--spacing, .25rem) * 12);flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);border-radius:.25rem;padding:calc(var(--spacing, .25rem) * 2);background-color:rgb(var(--ax-sys-color-lightest-surface));border-width:1px}.axp-drag-drop-list-container[data-orientation=horizontal]{flex-direction:row}.axp-drag-drop-list-container[data-orientation=vertical]{flex-direction:column}.axp-drag-drop-list-empty{display:flex;min-height:calc(var(--spacing, .25rem) * 12);width:100%;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 4)}.axp-drag-drop-list-empty-message{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));font-style:italic;color:var(--ax-text-secondary-color, #9e9e9e)}.axp-drag-drop-list-item{display:flex;cursor:move;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding:calc(var(--spacing, .25rem) * 2);-webkit-user-select:none;user-select:none;background-color:rgb(var(--ax-sys-color-lightest-surface));transition:all .2s ease}.axp-drag-drop-list-item.cdk-drag-preview,.axp-drag-drop-list-item.ax-drag-preview{border:1px dashed rgb(var(--ax-sys-color-primary-400))!important;box-shadow:0 4px 12px #00000026;opacity:.9}.axp-drag-drop-list-item.cdk-drag-preview{box-shadow:0 5px 10px #0003;opacity:.9}.axp-drag-drop-list-item.cdk-drag-placeholder{--tw-border-style: dashed;border-style:dashed;opacity:30%}.axp-drag-drop-list-item.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.axp-drag-drop-list-item-disabled{pointer-events:none;cursor:not-allowed;opacity:50%}.axp-drag-drop-list-item-handle{display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);flex-shrink:0;cursor:grab;align-items:center;justify-content:center;transition:color .2s ease}.axp-drag-drop-list-item-handle:active{cursor:grabbing}.axp-drag-drop-list-item-handle svg{height:100%;width:100%}.axp-drag-drop-list-item-content{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-bottom:calc(var(--spacing, .25rem) * .5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.cdk-drop-list-dragging .axp-drag-drop-list-item:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
2573
2572
  }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }, { type: i0.Output, args: ["itemsChange"] }], listId: [{ type: i0.Input, args: [{ isSignal: true, alias: "listId", required: false }] }], dropListGroup: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropListGroup", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], disable: [{ type: i0.Input, args: [{ isSignal: true, alias: "disable", required: false }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }], dropListDropped: [{ type: i0.Output, args: ["dropListDropped"] }] } });
2574
2573
 
2575
2574
  /**
@@ -2796,7 +2795,7 @@ class AXPConditionBuilderConditionComponent {
2796
2795
  this.removeItem.emit(this.item().id ?? '');
2797
2796
  }
2798
2797
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPConditionBuilderConditionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2799
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPConditionBuilderConditionComponent, isStandalone: true, selector: "axp-condition-builder-condition", inputs: { item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: true, transformFunction: null }, filterDefinitions: { classPropertyName: "filterDefinitions", publicName: "filterDefinitions", isSignal: true, isRequired: false, transformFunction: null }, onResolveWidget: { classPropertyName: "onResolveWidget", publicName: "onResolveWidget", isSignal: true, isRequired: false, transformFunction: null }, showFillByUser: { classPropertyName: "showFillByUser", publicName: "showFillByUser", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemChange: "itemChange", removeItem: "removeItem" }, ngImport: i0, template: "<div class=\"__condition-row\">\n <div class=\"__item-content\">\n <!-- Field Selector -->\n <div class=\"__field-selector\">\n <ax-select-box\n class=\"ax-sm\"\n [dataSource]=\"availableFields()\"\n [ngModel]=\"selectedFieldValue()\"\n (onValueChanged)=\"onFieldChange($event)\"\n valueField=\"value\"\n textField=\"text\"\n [placeholder]=\"('@data-management:metadata-definitions.components.query-builder.condition.select-field' | translate | async) || 'Select a field'\"\n [look]=\"'outline'\">\n </ax-select-box>\n </div>\n\n <!-- Filter Widget (Operator + Value) -->\n <div class=\"__operator-selector\">\n @if (selectedField()?.field && filterNode().type) {\n <axp-widgets-container\n class=\"__filter-widget-container\"\n [context]=\"context()\"\n (onContextChanged)=\"onContextChange($event)\">\n <ng-container axp-widget-renderer [node]=\"filterNode()\" [mode]=\"'edit'\">\n </ng-container>\n </axp-widgets-container>\n } @else {\n <div class=\"__filter-placeholder\">\n <span class=\"__placeholder-text\">{{\n ('@data-management:metadata-definitions.components.query-builder.condition.select-field-first' | translate | async) || 'Select a field first'\n }}</span>\n </div>\n }\n </div>\n\n <!-- Fill By User (optional) -->\n @if (showFillByUser()) {\n <div class=\"__fill-by-user\">\n <ax-check-box\n class=\"text-xs\"\n [ngModel]=\"selectedField()?.isParametric\"\n (ngModelChange)=\"onFillByUserChange($event)\">\n <ax-label>\n {{ '@data-management:metadata-definitions.components.query-builder.condition.fill-by-user' | translate | async }}\n </ax-label>\n </ax-check-box>\n </div>\n }\n </div>\n</div>\n", styles: ["@layer properties;.__condition-row{display:flex;width:100%;align-items:center;gap:calc(var(--spacing, .25rem) * 3)}.__condition-row .__item-content{display:flex;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 3);display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.__condition-row .__item-content .__field-selector{min-width:0}.__condition-row .__item-content .__field-selector ax-select-box{width:100%}.__condition-row .__item-content .__operator-selector{min-width:0}.__condition-row .__item-content .__operator-selector .__filter-widget-container{width:100%}.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep .axp-widgets-container{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3)}.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep ax-select-box{min-width:140px}.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep ax-text-box,.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep ax-number-box,.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep ax-date-time-box{flex:1}.__condition-row .__item-content .__operator-selector .__filter-placeholder{display:flex;align-items:center;justify-content:center;border-radius:.25rem;border-style:var(--tw-border-style);--tw-border-style: dashed;border-style:dashed;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding:calc(var(--spacing, .25rem) * 3);border-color:rgba(var(--ax-sys-color-border-lighter-surface),1);border-width:1px}.__condition-row .__item-content .__operator-selector .__filter-placeholder .__placeholder-text{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-neutral-500, oklch(55.6% 0 0));font-style:italic}.__condition-row .__item-content .__fill-by-user{grid-column:1/-1}@media(max-width:768px){.__condition-row{flex-direction:column;align-items:stretch}.__condition-row .__item-content{grid-template-columns:1fr}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i2$3.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", "itemHeight", "maxVisibleItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "ngmodule", type: AXCheckBoxModule }, { kind: "component", type: i2$2.AXCheckBoxComponent, selector: "ax-check-box", inputs: ["disabled", "tabIndex", "readonly", "color", "value", "name", "id", "isLoading", "indeterminate"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged"] }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i1$4.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { 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", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2798
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPConditionBuilderConditionComponent, isStandalone: true, selector: "axp-condition-builder-condition", inputs: { item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: true, transformFunction: null }, filterDefinitions: { classPropertyName: "filterDefinitions", publicName: "filterDefinitions", isSignal: true, isRequired: false, transformFunction: null }, onResolveWidget: { classPropertyName: "onResolveWidget", publicName: "onResolveWidget", isSignal: true, isRequired: false, transformFunction: null }, showFillByUser: { classPropertyName: "showFillByUser", publicName: "showFillByUser", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemChange: "itemChange", removeItem: "removeItem" }, ngImport: i0, template: "<div class=\"__condition-row\">\n <div class=\"__item-content\">\n <!-- Field Selector -->\n <div class=\"__field-selector\">\n <ax-select-box\n class=\"ax-sm\"\n [dataSource]=\"availableFields()\"\n [ngModel]=\"selectedFieldValue()\"\n (onValueChanged)=\"onFieldChange($event)\"\n valueField=\"value\"\n textField=\"text\"\n [placeholder]=\"('@data-management:metadata-definitions.components.query-builder.condition.select-field' | translate | async) || 'Select a field'\"\n [look]=\"'outline'\">\n </ax-select-box>\n </div>\n\n <!-- Filter Widget (Operator + Value) -->\n <div class=\"__operator-selector\">\n @if (selectedField()?.field && filterNode().type) {\n <axp-widgets-container\n class=\"__filter-widget-container\"\n [context]=\"context()\"\n (onContextChanged)=\"onContextChange($event)\">\n <ng-container axp-widget-renderer [node]=\"filterNode()\" [mode]=\"'edit'\">\n </ng-container>\n </axp-widgets-container>\n } @else {\n <div class=\"__filter-placeholder\">\n <span class=\"__placeholder-text\">{{\n ('@data-management:metadata-definitions.components.query-builder.condition.select-field-first' | translate | async) || 'Select a field first'\n }}</span>\n </div>\n }\n </div>\n\n <!-- Fill By User (optional) -->\n @if (showFillByUser()) {\n <div class=\"__fill-by-user\">\n <ax-check-box\n class=\"text-xs\"\n [ngModel]=\"selectedField()?.isParametric\"\n (ngModelChange)=\"onFillByUserChange($event)\">\n <ax-label>\n {{ '@data-management:metadata-definitions.components.query-builder.condition.fill-by-user' | translate | async }}\n </ax-label>\n </ax-check-box>\n </div>\n }\n </div>\n</div>\n", styles: ["@layer properties;.__condition-row{display:flex;width:100%;align-items:center;gap:calc(var(--spacing, .25rem) * 3)}.__condition-row .__item-content{display:flex;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 3);display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.__condition-row .__item-content .__field-selector{min-width:0}.__condition-row .__item-content .__field-selector ax-select-box{width:100%}.__condition-row .__item-content .__operator-selector{min-width:0}.__condition-row .__item-content .__operator-selector .__filter-widget-container{width:100%}.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep .axp-widgets-container{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3)}.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep ax-select-box{min-width:140px}.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep ax-text-box,.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep ax-number-box,.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep ax-date-time-box{flex:1}.__condition-row .__item-content .__operator-selector .__filter-placeholder{display:flex;align-items:center;justify-content:center;border-radius:.25rem;border-style:var(--tw-border-style);--tw-border-style: dashed;border-style:dashed;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding:calc(var(--spacing, .25rem) * 3);border-color:rgba(var(--ax-sys-color-border-lighter-surface),1);border-width:1px}.__condition-row .__item-content .__operator-selector .__filter-placeholder .__placeholder-text{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-neutral-500, oklch(55.6% 0 0));font-style:italic}.__condition-row .__item-content .__fill-by-user{grid-column:1 / -1}@media(max-width:768px){.__condition-row{flex-direction:column;align-items:stretch}.__condition-row .__item-content{grid-template-columns:1fr}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i2$4.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", "itemHeight", "maxVisibleItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "ngmodule", type: AXCheckBoxModule }, { kind: "component", type: i2$3.AXCheckBoxComponent, selector: "ax-check-box", inputs: ["disabled", "tabIndex", "readonly", "color", "value", "name", "id", "isLoading", "indeterminate"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged"] }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i1$5.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { 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", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2800
2799
  }
2801
2800
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPConditionBuilderConditionComponent, decorators: [{
2802
2801
  type: Component,
@@ -2809,7 +2808,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
2809
2808
  AXLabelModule,
2810
2809
  AXPWidgetCoreModule,
2811
2810
  AXTranslationModule,
2812
- ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"__condition-row\">\n <div class=\"__item-content\">\n <!-- Field Selector -->\n <div class=\"__field-selector\">\n <ax-select-box\n class=\"ax-sm\"\n [dataSource]=\"availableFields()\"\n [ngModel]=\"selectedFieldValue()\"\n (onValueChanged)=\"onFieldChange($event)\"\n valueField=\"value\"\n textField=\"text\"\n [placeholder]=\"('@data-management:metadata-definitions.components.query-builder.condition.select-field' | translate | async) || 'Select a field'\"\n [look]=\"'outline'\">\n </ax-select-box>\n </div>\n\n <!-- Filter Widget (Operator + Value) -->\n <div class=\"__operator-selector\">\n @if (selectedField()?.field && filterNode().type) {\n <axp-widgets-container\n class=\"__filter-widget-container\"\n [context]=\"context()\"\n (onContextChanged)=\"onContextChange($event)\">\n <ng-container axp-widget-renderer [node]=\"filterNode()\" [mode]=\"'edit'\">\n </ng-container>\n </axp-widgets-container>\n } @else {\n <div class=\"__filter-placeholder\">\n <span class=\"__placeholder-text\">{{\n ('@data-management:metadata-definitions.components.query-builder.condition.select-field-first' | translate | async) || 'Select a field first'\n }}</span>\n </div>\n }\n </div>\n\n <!-- Fill By User (optional) -->\n @if (showFillByUser()) {\n <div class=\"__fill-by-user\">\n <ax-check-box\n class=\"text-xs\"\n [ngModel]=\"selectedField()?.isParametric\"\n (ngModelChange)=\"onFillByUserChange($event)\">\n <ax-label>\n {{ '@data-management:metadata-definitions.components.query-builder.condition.fill-by-user' | translate | async }}\n </ax-label>\n </ax-check-box>\n </div>\n }\n </div>\n</div>\n", styles: ["@layer properties;.__condition-row{display:flex;width:100%;align-items:center;gap:calc(var(--spacing, .25rem) * 3)}.__condition-row .__item-content{display:flex;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 3);display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.__condition-row .__item-content .__field-selector{min-width:0}.__condition-row .__item-content .__field-selector ax-select-box{width:100%}.__condition-row .__item-content .__operator-selector{min-width:0}.__condition-row .__item-content .__operator-selector .__filter-widget-container{width:100%}.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep .axp-widgets-container{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3)}.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep ax-select-box{min-width:140px}.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep ax-text-box,.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep ax-number-box,.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep ax-date-time-box{flex:1}.__condition-row .__item-content .__operator-selector .__filter-placeholder{display:flex;align-items:center;justify-content:center;border-radius:.25rem;border-style:var(--tw-border-style);--tw-border-style: dashed;border-style:dashed;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding:calc(var(--spacing, .25rem) * 3);border-color:rgba(var(--ax-sys-color-border-lighter-surface),1);border-width:1px}.__condition-row .__item-content .__operator-selector .__filter-placeholder .__placeholder-text{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-neutral-500, oklch(55.6% 0 0));font-style:italic}.__condition-row .__item-content .__fill-by-user{grid-column:1/-1}@media(max-width:768px){.__condition-row{flex-direction:column;align-items:stretch}.__condition-row .__item-content{grid-template-columns:1fr}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
2811
+ ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"__condition-row\">\n <div class=\"__item-content\">\n <!-- Field Selector -->\n <div class=\"__field-selector\">\n <ax-select-box\n class=\"ax-sm\"\n [dataSource]=\"availableFields()\"\n [ngModel]=\"selectedFieldValue()\"\n (onValueChanged)=\"onFieldChange($event)\"\n valueField=\"value\"\n textField=\"text\"\n [placeholder]=\"('@data-management:metadata-definitions.components.query-builder.condition.select-field' | translate | async) || 'Select a field'\"\n [look]=\"'outline'\">\n </ax-select-box>\n </div>\n\n <!-- Filter Widget (Operator + Value) -->\n <div class=\"__operator-selector\">\n @if (selectedField()?.field && filterNode().type) {\n <axp-widgets-container\n class=\"__filter-widget-container\"\n [context]=\"context()\"\n (onContextChanged)=\"onContextChange($event)\">\n <ng-container axp-widget-renderer [node]=\"filterNode()\" [mode]=\"'edit'\">\n </ng-container>\n </axp-widgets-container>\n } @else {\n <div class=\"__filter-placeholder\">\n <span class=\"__placeholder-text\">{{\n ('@data-management:metadata-definitions.components.query-builder.condition.select-field-first' | translate | async) || 'Select a field first'\n }}</span>\n </div>\n }\n </div>\n\n <!-- Fill By User (optional) -->\n @if (showFillByUser()) {\n <div class=\"__fill-by-user\">\n <ax-check-box\n class=\"text-xs\"\n [ngModel]=\"selectedField()?.isParametric\"\n (ngModelChange)=\"onFillByUserChange($event)\">\n <ax-label>\n {{ '@data-management:metadata-definitions.components.query-builder.condition.fill-by-user' | translate | async }}\n </ax-label>\n </ax-check-box>\n </div>\n }\n </div>\n</div>\n", styles: ["@layer properties;.__condition-row{display:flex;width:100%;align-items:center;gap:calc(var(--spacing, .25rem) * 3)}.__condition-row .__item-content{display:flex;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 3);display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.__condition-row .__item-content .__field-selector{min-width:0}.__condition-row .__item-content .__field-selector ax-select-box{width:100%}.__condition-row .__item-content .__operator-selector{min-width:0}.__condition-row .__item-content .__operator-selector .__filter-widget-container{width:100%}.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep .axp-widgets-container{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3)}.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep ax-select-box{min-width:140px}.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep ax-text-box,.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep ax-number-box,.__condition-row .__item-content .__operator-selector .__filter-widget-container ::ng-deep ax-date-time-box{flex:1}.__condition-row .__item-content .__operator-selector .__filter-placeholder{display:flex;align-items:center;justify-content:center;border-radius:.25rem;border-style:var(--tw-border-style);--tw-border-style: dashed;border-style:dashed;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding:calc(var(--spacing, .25rem) * 3);border-color:rgba(var(--ax-sys-color-border-lighter-surface),1);border-width:1px}.__condition-row .__item-content .__operator-selector .__filter-placeholder .__placeholder-text{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-neutral-500, oklch(55.6% 0 0));font-style:italic}.__condition-row .__item-content .__fill-by-user{grid-column:1 / -1}@media(max-width:768px){.__condition-row{flex-direction:column;align-items:stretch}.__condition-row .__item-content{grid-template-columns:1fr}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
2813
2812
  }], ctorParameters: () => [], propDecorators: { item: [{ type: i0.Input, args: [{ isSignal: true, alias: "item", required: true }] }], filterDefinitions: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterDefinitions", required: false }] }], onResolveWidget: [{ type: i0.Input, args: [{ isSignal: true, alias: "onResolveWidget", required: false }] }], showFillByUser: [{ type: i0.Input, args: [{ isSignal: true, alias: "showFillByUser", required: false }] }], itemChange: [{ type: i0.Output, args: ["itemChange"] }], removeItem: [{ type: i0.Output, args: ["removeItem"] }] } });
2814
2813
 
2815
2814
  //#endregion
@@ -3156,7 +3155,7 @@ class AXPConditionBuilderComponent {
3156
3155
  this.updateValue();
3157
3156
  }
3158
3157
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPConditionBuilderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
3159
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPConditionBuilderComponent, isStandalone: true, selector: "axp-condition-builder", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, filterDefinitions: { classPropertyName: "filterDefinitions", publicName: "filterDefinitions", isSignal: true, isRequired: false, transformFunction: null }, showFillByUser: { classPropertyName: "showFillByUser", publicName: "showFillByUser", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"axp-condition-builder\">\n <div class=\"__content\">\n <ng-container\n [ngTemplateOutlet]=\"groupTemplate\"\n [ngTemplateOutletContext]=\"{ group: queryData(), isRoot: true }\"\n ></ng-container>\n </div>\n</div>\n\n<ng-template #groupTemplate let-group=\"group\" let-isRoot=\"isRoot\">\n <div\n class=\"__group\"\n [class.__root-group]=\"isRoot\"\n [class.__connectors-enabled]=\"(group.filters?.length ?? 0) > 1\"\n >\n <div class=\"__group-wrapper\">\n @if ((group.filters?.length ?? 0) > 1) {\n <div class=\"__group-connector\">\n <div class=\"__operator-selector\">\n <ax-dropdown-button\n class=\"ax-sm __operator-chip\"\n [text]=\"getLogicDisplayText(group.logic)\"\n [mode]=\"'dropdown'\"\n [look]=\"'solid'\"\n [color]=\"'primary'\"\n >\n <ax-button-item-list>\n @for (op of logicalOperatorsItems; track op.value) {\n <ax-button-item\n [text]=\"op.text\"\n [selected]=\"group.logic === op.value\"\n (onClick)=\"updateGroupLogicalOperator(group.id!, op.value)\"\n >\n </ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button>\n </div>\n </div>\n }\n\n <div\n class=\"__conditions-container\"\n axDropList\n (dropListDropped)=\"reorderGroupItemsEvent(group.id!, $event)\"\n >\n @if ((group.filters?.length ?? 0) === 0) {\n <div class=\"__group-empty\">\n <ax-button\n class=\"ax-sm __add-rule-btn\"\n [look]=\"'twotone'\"\n [color]=\"'primary'\"\n [text]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.add-rule.title'\n | translate\n | async\n \"\n (onClick)=\"addConditionToGroup(group.id!)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n <ax-button\n class=\"ax-sm __add-inner-group-btn\"\n [look]=\"'outline'\"\n [color]=\"'primary'\"\n [text]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.add-inner-group.title'\n | translate\n | async\n \"\n (onClick)=\"addGroupToGroup(group.id!)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-layer-group\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div>\n } @else {\n @for (\n item of getSortedFilters(group.filters || []);\n track item.id;\n let first = $first;\n let last = $last\n ) {\n <div\n class=\"__condition-item\"\n axDrag\n [class.__is-first]=\"first && (group.filters?.length ?? 0) > 1\"\n [class.__is-last]=\"last && (group.filters?.length ?? 0) > 1\"\n >\n <div class=\"__drag-handle\" axDragHandle>\n <ax-icon icon=\"fa-solid fa-grip-vertical\"></ax-icon>\n </div>\n\n <div class=\"__item-content\">\n @if (item.filters === undefined) {\n <axp-condition-builder-condition\n [item]=\"item\"\n [filterDefinitions]=\"filterDefinitions()\"\n [onResolveWidget]=\"resolveDefaultFilterWidget.bind(this)\"\n [showFillByUser]=\"showFillByUser()\"\n (itemChange)=\"updateCondition($event)\"\n (removeItem)=\"removeItem($event)\"\n >\n </axp-condition-builder-condition>\n } @else {\n <ng-container\n [ngTemplateOutlet]=\"groupTemplate\"\n [ngTemplateOutletContext]=\"{ group: item }\"\n >\n </ng-container>\n }\n </div>\n\n <div class=\"__item-controls\">\n <ax-button\n class=\"ax-sm __icon-btn\"\n [look]=\"'blank'\"\n [color]=\"'danger'\"\n [title]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.remove.title'\n | translate\n | async\n \"\n (onClick)=\"removeItem(item.id!)\"\n >\n <ax-icon icon=\"fa-light fa-trash-can\"></ax-icon>\n </ax-button>\n </div>\n </div>\n }\n }\n </div>\n </div>\n <!-- <div class=\"__add-condition-link ps-16\">\n <ax-button class=\"ax-sm __add-condition-btn\" [look]=\"'link'\" [color]=\"'primary'\"\n [text]=\"'@data-management:metadata-definitions.components.query-builder.actions.add-condition.title' | translate | async\"\n (onClick)=\"addConditionToGroup(group.id!)\">\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div> -->\n\n @if ((group.filters?.length ?? 0) > 0) {\n <div class=\"__group-actions\">\n <ax-button\n class=\"ax-sm __add-rule-btn\"\n [look]=\"'twotone'\"\n [color]=\"'primary'\"\n [text]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.add-rule.title'\n | translate\n | async\n \"\n (onClick)=\"addConditionToGroup(group.id!)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n <ax-button\n class=\"ax-sm __add-inner-group-btn\"\n [look]=\"'outline'\"\n [color]=\"'primary'\"\n [text]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.add-inner-group.title'\n | translate\n | async\n \"\n (onClick)=\"addGroupToGroup(group.id!)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-layer-group\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div>\n }\n </div>\n</ng-template>\n", styles: ["@layer properties;.axp-condition-builder{display:flex;height:100%;width:100%;flex-direction:column}.axp-condition-builder .__content{flex:1;overflow:auto;padding:calc(var(--spacing, .25rem) * 3)}.axp-condition-builder .__group{position:relative}.axp-condition-builder .__group.__root-group{border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:0;--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-condition-builder .__group:not(.__root-group){margin-top:calc(var(--spacing, .25rem) * 2);margin-bottom:calc(var(--spacing, .25rem) * 2);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding:calc(var(--spacing, .25rem) * 3);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border:1px solid rgba(var(--ax-sys-color-border-lightest-surface),1)}.axp-condition-builder .__group .__group-wrapper{--qb-connector-col: 4.25rem;--qb-conditions-gap: 1rem;display:grid;grid-template-columns:var(--qb-connector-col) 1fr;gap:0 var(--qb-conditions-gap);align-items:stretch;width:100%;min-height:2rem;min-width:0}.axp-condition-builder .__group:not(.__connectors-enabled)>.__group-wrapper{grid-template-columns:1fr}.axp-condition-builder .__group .__group-connector{--qb-operator-gap: .45rem;position:relative;width:var(--qb-connector-col);display:flex;flex-direction:column;align-items:center;justify-content:center;align-self:stretch;padding:0}.axp-condition-builder .__group .__group-connector:before,.axp-condition-builder .__group .__group-connector:after{content:\"\";position:absolute;left:50%;transform:translate(-50%);top:var(--qb-connector-top, 1.5rem);bottom:var(--qb-connector-bottom, 1.5rem);width:0;border-left:2px solid rgba(var(--ax-sys-color-primary-500),.5);z-index:0}.axp-condition-builder .__group .__group-connector:before{bottom:calc(50% - var(--qb-operator-gap))}.axp-condition-builder .__group .__group-connector:after{top:calc(50% + var(--qb-operator-gap))}.__group:not(.__connectors-enabled) .axp-condition-builder .__group .__group-connector:before,.__group:not(.__connectors-enabled) .axp-condition-builder .__group .__group-connector:after{content:none}.axp-condition-builder .__group .__group-connector .__operator-selector{position:absolute;left:50%;top:0;transform:translate(-50%);z-index:10;flex-shrink:0;margin:0;max-width:100%;box-sizing:border-box;display:flex;align-items:center;justify-content:center;height:100%}.axp-condition-builder .__group .__group-connector .__operator-selector .__operator-chip{min-width:3.25rem;max-width:100%;position:relative;z-index:1;border-radius:.375rem;font-size:.75rem;flex-shrink:0}.axp-condition-builder .__group .__conditions-container{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);min-height:2rem;padding-left:0;padding-right:0;position:relative;min-width:0}.axp-condition-builder .__group .__conditions-container .__group-empty{display:flex;min-height:3rem;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 3)}.axp-condition-builder .__group .__group-actions{margin-top:calc(var(--spacing, .25rem) * 2);display:flex;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 2.5);border-top:1px solid rgba(var(--ax-sys-color-border-lighter-surface),1);grid-column:1/-1}.axp-condition-builder .__group .__add-condition-link{padding-top:calc(var(--spacing, .25rem) * 2);flex-shrink:0}.axp-condition-builder .__condition-item{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5);border-radius:.375rem;cursor:move;-webkit-user-select:none;user-select:none;min-height:3rem;border:1px solid rgba(var(--ax-sys-color-border-lightest-surface),1);position:relative}.axp-condition-builder .__condition-item:hover{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);border-color:rgba(var(--ax-sys-color-border-lighter-surface),1)}.axp-condition-builder .__condition-item.__is-first:before,.axp-condition-builder .__condition-item.__is-last:before{content:\"\";position:absolute;left:calc(-1 * (var(--qb-connector-col) * .5 + var(--qb-conditions-gap, 1rem)));top:50%;transform:translateY(-50%);width:calc(var(--qb-connector-col) * .5 + var(--qb-conditions-gap, 1rem));height:0;border-top:2px solid rgba(var(--ax-sys-color-primary-500),.5);z-index:0}.axp-condition-builder .__condition-item .__drag-handle{display:flex;height:calc(var(--spacing, .25rem) * 5);width:calc(var(--spacing, .25rem) * 5);align-items:center;justify-content:center;color:var(--color-neutral-400, oklch(70.8% 0 0));cursor:grab;transition:color .15s ease-in-out;flex-shrink:0;position:relative;z-index:1}.axp-condition-builder .__condition-item .__drag-handle:active{cursor:grabbing}.axp-condition-builder .__condition-item .__drag-handle:hover{color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-condition-builder .__condition-item .__item-content{flex:1;position:relative;z-index:1;min-width:0}.axp-condition-builder .__condition-item .__item-controls{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing, .25rem);flex-shrink:0;width:2rem;position:relative;z-index:1}.axp-condition-builder .__condition-item .__icon-btn{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;padding:0;flex-shrink:0}.__condition-item.drag-preview{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-style:var(--tw-border-style);background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5);--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);opacity:.9;border-radius:.375rem;border-width:1px;min-height:3rem}.__condition-item.drag-placeholder{border-style:var(--tw-border-style);--tw-border-style: dashed;border-style:dashed;background-color:var(--color-primary-lightest);color:var(--color-on-primary-lightest);border-color:var(--color-border-primary-lightest);position:relative;border-radius:.375rem;border-color:rgba(var(--ax-sys-color-primary-300),.5);border-width:1px;min-height:3rem;margin-bottom:.5rem;opacity:.5}.__condition-item.drag-placeholder>*{opacity:0%}.__condition-item.drag-animating{transition:transform .25s cubic-bezier(.4,0,.2,1)}.__group:not(.__root-group).drag-preview{border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-width:1px}.__group:not(.__root-group).drag-placeholder{border-style:var(--tw-border-style);--tw-border-style: dashed;border-style:dashed;background-color:var(--color-primary-lightest);color:var(--color-on-primary-lightest);border-color:var(--color-border-primary-lightest);opacity:50%;border-color:rgba(var(--ax-sys-color-primary-300),.5);border-width:1px;margin-bottom:.5rem;min-height:4rem}.__group:not(.__root-group).drag-dragging{opacity:70%}.__group:not(.__root-group):hover:not(.drag-dragging) .__drag-handle{color:rgba(var(--ax-sys-color-primary-surface))}.__conditions-container.drop-list-dragging,.__conditions-container.drop-list-receiving{position:relative;min-height:calc(var(--spacing, .25rem) * 12);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);--tw-border-style: dashed;border-style:dashed;background-color:var(--color-primary-lightest);color:var(--color-on-primary-lightest);border-color:var(--color-border-primary-lightest);padding:var(--spacing, .25rem);border-color:rgba(var(--ax-sys-color-primary-300),.5);border-width:1px}.__conditions-container.drop-list-dragging:has(.__group-empty):after,.__conditions-container.drop-list-receiving:has(.__group-empty):after{content:\"Drop conditions here\";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 2);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-primary-surface));z-index:-1;pointer-events:none;min-height:2rem}.__conditions-container.drop-list-dragging .__condition-item:not(.drag-placeholder){margin-bottom:.375rem}.__conditions-container.drop-list-dragging .__condition-item:not(.drag-placeholder):last-child{margin-bottom:0}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: i1$2.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1$2.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "component", type: i3$4.AXDropdownButtonComponent, selector: "ax-dropdown-button", inputs: ["disabled", "size", "text", "color", "look", "type", "mode"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.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: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "directive", type: AXDragHandleDirective, selector: "[axDragHandle]" }, { kind: "directive", type: AXDropListDirective, selector: "[axDropList]", inputs: ["axDropList", "sortingDisabled", "dropListGroup", "dropListOrientation"], outputs: ["dropListDropped"], exportAs: ["axDropList"] }, { kind: "component", type: AXPConditionBuilderConditionComponent, selector: "axp-condition-builder-condition", inputs: ["item", "filterDefinitions", "onResolveWidget", "showFillByUser"], outputs: ["itemChange", "removeItem"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
3158
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPConditionBuilderComponent, isStandalone: true, selector: "axp-condition-builder", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, filterDefinitions: { classPropertyName: "filterDefinitions", publicName: "filterDefinitions", isSignal: true, isRequired: false, transformFunction: null }, showFillByUser: { classPropertyName: "showFillByUser", publicName: "showFillByUser", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"axp-condition-builder\">\n <div class=\"__content\">\n <ng-container\n [ngTemplateOutlet]=\"groupTemplate\"\n [ngTemplateOutletContext]=\"{ group: queryData(), isRoot: true }\"\n ></ng-container>\n </div>\n</div>\n\n<ng-template #groupTemplate let-group=\"group\" let-isRoot=\"isRoot\">\n <div\n class=\"__group\"\n [class.__root-group]=\"isRoot\"\n [class.__connectors-enabled]=\"(group.filters?.length ?? 0) > 1\"\n >\n <div class=\"__group-wrapper\">\n @if ((group.filters?.length ?? 0) > 1) {\n <div class=\"__group-connector\">\n <div class=\"__operator-selector\">\n <ax-dropdown-button\n class=\"ax-sm __operator-chip\"\n [text]=\"getLogicDisplayText(group.logic)\"\n [mode]=\"'dropdown'\"\n [look]=\"'solid'\"\n [color]=\"'primary'\"\n >\n <ax-button-item-list>\n @for (op of logicalOperatorsItems; track op.value) {\n <ax-button-item\n [text]=\"op.text\"\n [selected]=\"group.logic === op.value\"\n (onClick)=\"updateGroupLogicalOperator(group.id!, op.value)\"\n >\n </ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button>\n </div>\n </div>\n }\n\n <div\n class=\"__conditions-container\"\n axDropList\n (dropListDropped)=\"reorderGroupItemsEvent(group.id!, $event)\"\n >\n @if ((group.filters?.length ?? 0) === 0) {\n <div class=\"__group-empty\">\n <ax-button\n class=\"ax-sm __add-rule-btn\"\n [look]=\"'twotone'\"\n [color]=\"'primary'\"\n [text]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.add-rule.title'\n | translate\n | async\n \"\n (onClick)=\"addConditionToGroup(group.id!)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n <ax-button\n class=\"ax-sm __add-inner-group-btn\"\n [look]=\"'outline'\"\n [color]=\"'primary'\"\n [text]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.add-inner-group.title'\n | translate\n | async\n \"\n (onClick)=\"addGroupToGroup(group.id!)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-layer-group\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div>\n } @else {\n @for (\n item of getSortedFilters(group.filters || []);\n track item.id;\n let first = $first;\n let last = $last\n ) {\n <div\n class=\"__condition-item\"\n axDrag\n [class.__is-first]=\"first && (group.filters?.length ?? 0) > 1\"\n [class.__is-last]=\"last && (group.filters?.length ?? 0) > 1\"\n >\n <div class=\"__drag-handle\" axDragHandle>\n <ax-icon icon=\"fa-solid fa-grip-vertical\"></ax-icon>\n </div>\n\n <div class=\"__item-content\">\n @if (item.filters === undefined) {\n <axp-condition-builder-condition\n [item]=\"item\"\n [filterDefinitions]=\"filterDefinitions()\"\n [onResolveWidget]=\"resolveDefaultFilterWidget.bind(this)\"\n [showFillByUser]=\"showFillByUser()\"\n (itemChange)=\"updateCondition($event)\"\n (removeItem)=\"removeItem($event)\"\n >\n </axp-condition-builder-condition>\n } @else {\n <ng-container\n [ngTemplateOutlet]=\"groupTemplate\"\n [ngTemplateOutletContext]=\"{ group: item }\"\n >\n </ng-container>\n }\n </div>\n\n <div class=\"__item-controls\">\n <ax-button\n class=\"ax-sm __icon-btn\"\n [look]=\"'blank'\"\n [color]=\"'danger'\"\n [title]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.remove.title'\n | translate\n | async\n \"\n (onClick)=\"removeItem(item.id!)\"\n >\n <ax-icon icon=\"fa-light fa-trash-can\"></ax-icon>\n </ax-button>\n </div>\n </div>\n }\n }\n </div>\n </div>\n <!-- <div class=\"__add-condition-link ps-16\">\n <ax-button class=\"ax-sm __add-condition-btn\" [look]=\"'link'\" [color]=\"'primary'\"\n [text]=\"'@data-management:metadata-definitions.components.query-builder.actions.add-condition.title' | translate | async\"\n (onClick)=\"addConditionToGroup(group.id!)\">\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div> -->\n\n @if ((group.filters?.length ?? 0) > 0) {\n <div class=\"__group-actions\">\n <ax-button\n class=\"ax-sm __add-rule-btn\"\n [look]=\"'twotone'\"\n [color]=\"'primary'\"\n [text]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.add-rule.title'\n | translate\n | async\n \"\n (onClick)=\"addConditionToGroup(group.id!)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n <ax-button\n class=\"ax-sm __add-inner-group-btn\"\n [look]=\"'outline'\"\n [color]=\"'primary'\"\n [text]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.add-inner-group.title'\n | translate\n | async\n \"\n (onClick)=\"addGroupToGroup(group.id!)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-layer-group\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div>\n }\n </div>\n</ng-template>\n", styles: ["@layer properties;.axp-condition-builder{display:flex;height:100%;width:100%;flex-direction:column}.axp-condition-builder .__content{flex:1;overflow:auto;padding:calc(var(--spacing, .25rem) * 3)}.axp-condition-builder .__group{position:relative}.axp-condition-builder .__group.__root-group{border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:0;--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-condition-builder .__group:not(.__root-group){margin-top:calc(var(--spacing, .25rem) * 2);margin-bottom:calc(var(--spacing, .25rem) * 2);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding:calc(var(--spacing, .25rem) * 3);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border:1px solid rgba(var(--ax-sys-color-border-lightest-surface),1)}.axp-condition-builder .__group .__group-wrapper{--qb-connector-col: 4.25rem;--qb-conditions-gap: 1rem;display:grid;grid-template-columns:var(--qb-connector-col) 1fr;gap:0 var(--qb-conditions-gap);align-items:stretch;width:100%;min-height:2rem;min-width:0}.axp-condition-builder .__group:not(.__connectors-enabled)>.__group-wrapper{grid-template-columns:1fr}.axp-condition-builder .__group .__group-connector{--qb-operator-gap: .45rem;position:relative;width:var(--qb-connector-col);display:flex;flex-direction:column;align-items:center;justify-content:center;align-self:stretch;padding:0}.axp-condition-builder .__group .__group-connector:before,.axp-condition-builder .__group .__group-connector:after{content:\"\";position:absolute;left:50%;transform:translate(-50%);top:var(--qb-connector-top, 1.5rem);bottom:var(--qb-connector-bottom, 1.5rem);width:0;border-left:2px solid rgba(var(--ax-sys-color-primary-500),.5);z-index:0}.axp-condition-builder .__group .__group-connector:before{bottom:calc(50% - var(--qb-operator-gap))}.axp-condition-builder .__group .__group-connector:after{top:calc(50% + var(--qb-operator-gap))}.axp-condition-builder .__group .__group-connector .__operator-selector{position:absolute;top:0;left:50%;z-index:10;margin:0;display:flex;max-width:100%;flex-shrink:0;align-items:center;justify-content:center;transform:translate(-50%);box-sizing:border-box;height:100%}.axp-condition-builder .__group .__group-connector .__operator-selector .__operator-chip{position:relative;z-index:1;max-width:100%;flex-shrink:0;border-radius:var(--radius-md, .375rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));min-width:3.25rem}.axp-condition-builder .__group:not(.__connectors-enabled) .__group-connector:before,.axp-condition-builder .__group:not(.__connectors-enabled) .__group-connector:after{content:none}.axp-condition-builder .__group .__conditions-container{position:relative;display:flex;min-height:calc(var(--spacing, .25rem) * 8);min-width:0;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-left:0;padding-right:0}.axp-condition-builder .__group .__conditions-container .__group-empty{display:flex;min-height:calc(var(--spacing, .25rem) * 12);flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 3)}.axp-condition-builder .__group .__conditions-container.drop-list-dragging,.axp-condition-builder .__group .__conditions-container.drop-list-receiving{position:relative;min-height:calc(var(--spacing, .25rem) * 12);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);--tw-border-style: dashed;border-style:dashed;background-color:var(--color-primary-lightest);color:var(--color-on-primary-lightest);border-color:var(--color-border-primary-lightest);padding:var(--spacing, .25rem);border-color:rgba(var(--ax-sys-color-primary-300),.5);border-width:1px}:is(.axp-condition-builder .__group .__conditions-container.drop-list-dragging,.axp-condition-builder .__group .__conditions-container.drop-list-receiving):has(.__group-empty):after{content:\"Drop conditions here\";position:absolute;inset:0;z-index:-1;display:flex;min-height:calc(var(--spacing, .25rem) * 8);align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 2);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-primary-surface));pointer-events:none}.axp-condition-builder .__group .__conditions-container.drop-list-dragging .__condition-item:not(.drag-placeholder){margin-bottom:.375rem}.axp-condition-builder .__group .__conditions-container.drop-list-dragging .__condition-item:not(.drag-placeholder):last-child{margin-bottom:0}.axp-condition-builder .__group .__group-actions{margin-top:calc(var(--spacing, .25rem) * 2);display:flex;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2);border-top-style:var(--tw-border-style);border-top-width:1px;padding-block:calc(var(--spacing, .25rem) * 2.5);border-top:1px solid rgba(var(--ax-sys-color-border-lighter-surface),1);grid-column:1 / -1}.axp-condition-builder .__group .__add-condition-link{flex-shrink:0;padding-top:calc(var(--spacing, .25rem) * 2)}.axp-condition-builder .__condition-item{position:relative;display:flex;min-height:calc(var(--spacing, .25rem) * 12);cursor:move;align-items:center;gap:calc(var(--spacing, .25rem) * 3);background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5);-webkit-user-select:none;user-select:none;border-radius:.375rem;border:1px solid rgba(var(--ax-sys-color-border-lightest-surface),1)}.axp-condition-builder .__condition-item:hover{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);border-color:rgba(var(--ax-sys-color-border-lighter-surface),1)}.axp-condition-builder .__condition-item.__is-first:before,.axp-condition-builder .__condition-item.__is-last:before{content:\"\";position:absolute;left:calc(-1 * (var(--qb-connector-col) * .5 + var(--qb-conditions-gap, 1rem)));top:50%;transform:translateY(-50%);width:calc(var(--qb-connector-col) * .5 + var(--qb-conditions-gap, 1rem));height:0;border-top:2px solid rgba(var(--ax-sys-color-primary-500),.5);z-index:0}.axp-condition-builder .__condition-item .__drag-handle{position:relative;z-index:1;display:flex;height:calc(var(--spacing, .25rem) * 5);width:calc(var(--spacing, .25rem) * 5);flex-shrink:0;cursor:grab;align-items:center;justify-content:center;color:var(--color-neutral-400, oklch(70.8% 0 0));transition:color .15s ease-in-out}.axp-condition-builder .__condition-item .__drag-handle:active{cursor:grabbing}.axp-condition-builder .__condition-item .__drag-handle:hover{color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-condition-builder .__condition-item .__item-content{position:relative;z-index:1;min-width:0;flex:1}.axp-condition-builder .__condition-item .__item-controls{position:relative;z-index:1;display:flex;width:calc(var(--spacing, .25rem) * 8);flex-shrink:0;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing, .25rem)}.axp-condition-builder .__condition-item .__icon-btn{display:flex;flex-shrink:0;align-items:center;justify-content:center;padding:0;width:1.75rem;height:1.75rem}.axp-condition-builder .__condition-item.drag-preview{display:flex;min-height:calc(var(--spacing, .25rem) * 12);align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-style:var(--tw-border-style);background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5);--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);opacity:.9;border-radius:.375rem;border-width:1px}.axp-condition-builder .__condition-item.drag-placeholder{position:relative;margin-bottom:calc(var(--spacing, .25rem) * 2);min-height:calc(var(--spacing, .25rem) * 12);border-style:var(--tw-border-style);--tw-border-style: dashed;border-style:dashed;background-color:var(--color-primary-lightest);color:var(--color-on-primary-lightest);border-color:var(--color-border-primary-lightest);opacity:50%;border-radius:.375rem;border-color:rgba(var(--ax-sys-color-primary-300),.5);border-width:1px}.axp-condition-builder .__condition-item.drag-placeholder>*{opacity:0%}.axp-condition-builder .__condition-item.drag-animating{transition:transform .25s cubic-bezier(.4,0,.2,1)}.axp-condition-builder .__group:not(.__root-group).drag-preview{border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-width:1px}.axp-condition-builder .__group:not(.__root-group).drag-placeholder{margin-bottom:calc(var(--spacing, .25rem) * 2);min-height:calc(var(--spacing, .25rem) * 16);border-style:var(--tw-border-style);--tw-border-style: dashed;border-style:dashed;background-color:var(--color-primary-lightest);color:var(--color-on-primary-lightest);border-color:var(--color-border-primary-lightest);opacity:50%;border-color:rgba(var(--ax-sys-color-primary-300),.5);border-width:1px}.axp-condition-builder .__group:not(.__root-group).drag-dragging{opacity:70%}.axp-condition-builder .__group:not(.__root-group):hover:not(.drag-dragging) .__drag-handle{color:rgba(var(--ax-sys-color-primary-surface))}.__group:not(.__connectors-enabled) .axp-condition-builder .__group .__group-connector:before,.__group:not(.__connectors-enabled) .axp-condition-builder .__group .__group-connector:after{content:none}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: i1$2.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1$2.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "component", type: i3$4.AXDropdownButtonComponent, selector: "ax-dropdown-button", inputs: ["disabled", "size", "text", "color", "look", "type", "mode"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.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: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "directive", type: AXDragHandleDirective, selector: "[axDragHandle]" }, { kind: "directive", type: AXDropListDirective, selector: "[axDropList]", inputs: ["axDropList", "sortingDisabled", "dropListGroup", "dropListOrientation"], outputs: ["dropListDropped"], exportAs: ["axDropList"] }, { kind: "component", type: AXPConditionBuilderConditionComponent, selector: "axp-condition-builder-condition", inputs: ["item", "filterDefinitions", "onResolveWidget", "showFillByUser"], outputs: ["itemChange", "removeItem"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
3160
3159
  }
3161
3160
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPConditionBuilderComponent, decorators: [{
3162
3161
  type: Component,
@@ -3170,7 +3169,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
3170
3169
  AXDropListDirective,
3171
3170
  AXPConditionBuilderConditionComponent,
3172
3171
  AXTranslationModule,
3173
- ], template: "<div class=\"axp-condition-builder\">\n <div class=\"__content\">\n <ng-container\n [ngTemplateOutlet]=\"groupTemplate\"\n [ngTemplateOutletContext]=\"{ group: queryData(), isRoot: true }\"\n ></ng-container>\n </div>\n</div>\n\n<ng-template #groupTemplate let-group=\"group\" let-isRoot=\"isRoot\">\n <div\n class=\"__group\"\n [class.__root-group]=\"isRoot\"\n [class.__connectors-enabled]=\"(group.filters?.length ?? 0) > 1\"\n >\n <div class=\"__group-wrapper\">\n @if ((group.filters?.length ?? 0) > 1) {\n <div class=\"__group-connector\">\n <div class=\"__operator-selector\">\n <ax-dropdown-button\n class=\"ax-sm __operator-chip\"\n [text]=\"getLogicDisplayText(group.logic)\"\n [mode]=\"'dropdown'\"\n [look]=\"'solid'\"\n [color]=\"'primary'\"\n >\n <ax-button-item-list>\n @for (op of logicalOperatorsItems; track op.value) {\n <ax-button-item\n [text]=\"op.text\"\n [selected]=\"group.logic === op.value\"\n (onClick)=\"updateGroupLogicalOperator(group.id!, op.value)\"\n >\n </ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button>\n </div>\n </div>\n }\n\n <div\n class=\"__conditions-container\"\n axDropList\n (dropListDropped)=\"reorderGroupItemsEvent(group.id!, $event)\"\n >\n @if ((group.filters?.length ?? 0) === 0) {\n <div class=\"__group-empty\">\n <ax-button\n class=\"ax-sm __add-rule-btn\"\n [look]=\"'twotone'\"\n [color]=\"'primary'\"\n [text]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.add-rule.title'\n | translate\n | async\n \"\n (onClick)=\"addConditionToGroup(group.id!)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n <ax-button\n class=\"ax-sm __add-inner-group-btn\"\n [look]=\"'outline'\"\n [color]=\"'primary'\"\n [text]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.add-inner-group.title'\n | translate\n | async\n \"\n (onClick)=\"addGroupToGroup(group.id!)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-layer-group\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div>\n } @else {\n @for (\n item of getSortedFilters(group.filters || []);\n track item.id;\n let first = $first;\n let last = $last\n ) {\n <div\n class=\"__condition-item\"\n axDrag\n [class.__is-first]=\"first && (group.filters?.length ?? 0) > 1\"\n [class.__is-last]=\"last && (group.filters?.length ?? 0) > 1\"\n >\n <div class=\"__drag-handle\" axDragHandle>\n <ax-icon icon=\"fa-solid fa-grip-vertical\"></ax-icon>\n </div>\n\n <div class=\"__item-content\">\n @if (item.filters === undefined) {\n <axp-condition-builder-condition\n [item]=\"item\"\n [filterDefinitions]=\"filterDefinitions()\"\n [onResolveWidget]=\"resolveDefaultFilterWidget.bind(this)\"\n [showFillByUser]=\"showFillByUser()\"\n (itemChange)=\"updateCondition($event)\"\n (removeItem)=\"removeItem($event)\"\n >\n </axp-condition-builder-condition>\n } @else {\n <ng-container\n [ngTemplateOutlet]=\"groupTemplate\"\n [ngTemplateOutletContext]=\"{ group: item }\"\n >\n </ng-container>\n }\n </div>\n\n <div class=\"__item-controls\">\n <ax-button\n class=\"ax-sm __icon-btn\"\n [look]=\"'blank'\"\n [color]=\"'danger'\"\n [title]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.remove.title'\n | translate\n | async\n \"\n (onClick)=\"removeItem(item.id!)\"\n >\n <ax-icon icon=\"fa-light fa-trash-can\"></ax-icon>\n </ax-button>\n </div>\n </div>\n }\n }\n </div>\n </div>\n <!-- <div class=\"__add-condition-link ps-16\">\n <ax-button class=\"ax-sm __add-condition-btn\" [look]=\"'link'\" [color]=\"'primary'\"\n [text]=\"'@data-management:metadata-definitions.components.query-builder.actions.add-condition.title' | translate | async\"\n (onClick)=\"addConditionToGroup(group.id!)\">\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div> -->\n\n @if ((group.filters?.length ?? 0) > 0) {\n <div class=\"__group-actions\">\n <ax-button\n class=\"ax-sm __add-rule-btn\"\n [look]=\"'twotone'\"\n [color]=\"'primary'\"\n [text]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.add-rule.title'\n | translate\n | async\n \"\n (onClick)=\"addConditionToGroup(group.id!)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n <ax-button\n class=\"ax-sm __add-inner-group-btn\"\n [look]=\"'outline'\"\n [color]=\"'primary'\"\n [text]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.add-inner-group.title'\n | translate\n | async\n \"\n (onClick)=\"addGroupToGroup(group.id!)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-layer-group\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div>\n }\n </div>\n</ng-template>\n", styles: ["@layer properties;.axp-condition-builder{display:flex;height:100%;width:100%;flex-direction:column}.axp-condition-builder .__content{flex:1;overflow:auto;padding:calc(var(--spacing, .25rem) * 3)}.axp-condition-builder .__group{position:relative}.axp-condition-builder .__group.__root-group{border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:0;--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-condition-builder .__group:not(.__root-group){margin-top:calc(var(--spacing, .25rem) * 2);margin-bottom:calc(var(--spacing, .25rem) * 2);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding:calc(var(--spacing, .25rem) * 3);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border:1px solid rgba(var(--ax-sys-color-border-lightest-surface),1)}.axp-condition-builder .__group .__group-wrapper{--qb-connector-col: 4.25rem;--qb-conditions-gap: 1rem;display:grid;grid-template-columns:var(--qb-connector-col) 1fr;gap:0 var(--qb-conditions-gap);align-items:stretch;width:100%;min-height:2rem;min-width:0}.axp-condition-builder .__group:not(.__connectors-enabled)>.__group-wrapper{grid-template-columns:1fr}.axp-condition-builder .__group .__group-connector{--qb-operator-gap: .45rem;position:relative;width:var(--qb-connector-col);display:flex;flex-direction:column;align-items:center;justify-content:center;align-self:stretch;padding:0}.axp-condition-builder .__group .__group-connector:before,.axp-condition-builder .__group .__group-connector:after{content:\"\";position:absolute;left:50%;transform:translate(-50%);top:var(--qb-connector-top, 1.5rem);bottom:var(--qb-connector-bottom, 1.5rem);width:0;border-left:2px solid rgba(var(--ax-sys-color-primary-500),.5);z-index:0}.axp-condition-builder .__group .__group-connector:before{bottom:calc(50% - var(--qb-operator-gap))}.axp-condition-builder .__group .__group-connector:after{top:calc(50% + var(--qb-operator-gap))}.__group:not(.__connectors-enabled) .axp-condition-builder .__group .__group-connector:before,.__group:not(.__connectors-enabled) .axp-condition-builder .__group .__group-connector:after{content:none}.axp-condition-builder .__group .__group-connector .__operator-selector{position:absolute;left:50%;top:0;transform:translate(-50%);z-index:10;flex-shrink:0;margin:0;max-width:100%;box-sizing:border-box;display:flex;align-items:center;justify-content:center;height:100%}.axp-condition-builder .__group .__group-connector .__operator-selector .__operator-chip{min-width:3.25rem;max-width:100%;position:relative;z-index:1;border-radius:.375rem;font-size:.75rem;flex-shrink:0}.axp-condition-builder .__group .__conditions-container{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);min-height:2rem;padding-left:0;padding-right:0;position:relative;min-width:0}.axp-condition-builder .__group .__conditions-container .__group-empty{display:flex;min-height:3rem;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 3)}.axp-condition-builder .__group .__group-actions{margin-top:calc(var(--spacing, .25rem) * 2);display:flex;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 2.5);border-top:1px solid rgba(var(--ax-sys-color-border-lighter-surface),1);grid-column:1/-1}.axp-condition-builder .__group .__add-condition-link{padding-top:calc(var(--spacing, .25rem) * 2);flex-shrink:0}.axp-condition-builder .__condition-item{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5);border-radius:.375rem;cursor:move;-webkit-user-select:none;user-select:none;min-height:3rem;border:1px solid rgba(var(--ax-sys-color-border-lightest-surface),1);position:relative}.axp-condition-builder .__condition-item:hover{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);border-color:rgba(var(--ax-sys-color-border-lighter-surface),1)}.axp-condition-builder .__condition-item.__is-first:before,.axp-condition-builder .__condition-item.__is-last:before{content:\"\";position:absolute;left:calc(-1 * (var(--qb-connector-col) * .5 + var(--qb-conditions-gap, 1rem)));top:50%;transform:translateY(-50%);width:calc(var(--qb-connector-col) * .5 + var(--qb-conditions-gap, 1rem));height:0;border-top:2px solid rgba(var(--ax-sys-color-primary-500),.5);z-index:0}.axp-condition-builder .__condition-item .__drag-handle{display:flex;height:calc(var(--spacing, .25rem) * 5);width:calc(var(--spacing, .25rem) * 5);align-items:center;justify-content:center;color:var(--color-neutral-400, oklch(70.8% 0 0));cursor:grab;transition:color .15s ease-in-out;flex-shrink:0;position:relative;z-index:1}.axp-condition-builder .__condition-item .__drag-handle:active{cursor:grabbing}.axp-condition-builder .__condition-item .__drag-handle:hover{color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-condition-builder .__condition-item .__item-content{flex:1;position:relative;z-index:1;min-width:0}.axp-condition-builder .__condition-item .__item-controls{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing, .25rem);flex-shrink:0;width:2rem;position:relative;z-index:1}.axp-condition-builder .__condition-item .__icon-btn{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;padding:0;flex-shrink:0}.__condition-item.drag-preview{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-style:var(--tw-border-style);background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5);--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);opacity:.9;border-radius:.375rem;border-width:1px;min-height:3rem}.__condition-item.drag-placeholder{border-style:var(--tw-border-style);--tw-border-style: dashed;border-style:dashed;background-color:var(--color-primary-lightest);color:var(--color-on-primary-lightest);border-color:var(--color-border-primary-lightest);position:relative;border-radius:.375rem;border-color:rgba(var(--ax-sys-color-primary-300),.5);border-width:1px;min-height:3rem;margin-bottom:.5rem;opacity:.5}.__condition-item.drag-placeholder>*{opacity:0%}.__condition-item.drag-animating{transition:transform .25s cubic-bezier(.4,0,.2,1)}.__group:not(.__root-group).drag-preview{border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-width:1px}.__group:not(.__root-group).drag-placeholder{border-style:var(--tw-border-style);--tw-border-style: dashed;border-style:dashed;background-color:var(--color-primary-lightest);color:var(--color-on-primary-lightest);border-color:var(--color-border-primary-lightest);opacity:50%;border-color:rgba(var(--ax-sys-color-primary-300),.5);border-width:1px;margin-bottom:.5rem;min-height:4rem}.__group:not(.__root-group).drag-dragging{opacity:70%}.__group:not(.__root-group):hover:not(.drag-dragging) .__drag-handle{color:rgba(var(--ax-sys-color-primary-surface))}.__conditions-container.drop-list-dragging,.__conditions-container.drop-list-receiving{position:relative;min-height:calc(var(--spacing, .25rem) * 12);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);--tw-border-style: dashed;border-style:dashed;background-color:var(--color-primary-lightest);color:var(--color-on-primary-lightest);border-color:var(--color-border-primary-lightest);padding:var(--spacing, .25rem);border-color:rgba(var(--ax-sys-color-primary-300),.5);border-width:1px}.__conditions-container.drop-list-dragging:has(.__group-empty):after,.__conditions-container.drop-list-receiving:has(.__group-empty):after{content:\"Drop conditions here\";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 2);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-primary-surface));z-index:-1;pointer-events:none;min-height:2rem}.__conditions-container.drop-list-dragging .__condition-item:not(.drag-placeholder){margin-bottom:.375rem}.__conditions-container.drop-list-dragging .__condition-item:not(.drag-placeholder):last-child{margin-bottom:0}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
3172
+ ], template: "<div class=\"axp-condition-builder\">\n <div class=\"__content\">\n <ng-container\n [ngTemplateOutlet]=\"groupTemplate\"\n [ngTemplateOutletContext]=\"{ group: queryData(), isRoot: true }\"\n ></ng-container>\n </div>\n</div>\n\n<ng-template #groupTemplate let-group=\"group\" let-isRoot=\"isRoot\">\n <div\n class=\"__group\"\n [class.__root-group]=\"isRoot\"\n [class.__connectors-enabled]=\"(group.filters?.length ?? 0) > 1\"\n >\n <div class=\"__group-wrapper\">\n @if ((group.filters?.length ?? 0) > 1) {\n <div class=\"__group-connector\">\n <div class=\"__operator-selector\">\n <ax-dropdown-button\n class=\"ax-sm __operator-chip\"\n [text]=\"getLogicDisplayText(group.logic)\"\n [mode]=\"'dropdown'\"\n [look]=\"'solid'\"\n [color]=\"'primary'\"\n >\n <ax-button-item-list>\n @for (op of logicalOperatorsItems; track op.value) {\n <ax-button-item\n [text]=\"op.text\"\n [selected]=\"group.logic === op.value\"\n (onClick)=\"updateGroupLogicalOperator(group.id!, op.value)\"\n >\n </ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button>\n </div>\n </div>\n }\n\n <div\n class=\"__conditions-container\"\n axDropList\n (dropListDropped)=\"reorderGroupItemsEvent(group.id!, $event)\"\n >\n @if ((group.filters?.length ?? 0) === 0) {\n <div class=\"__group-empty\">\n <ax-button\n class=\"ax-sm __add-rule-btn\"\n [look]=\"'twotone'\"\n [color]=\"'primary'\"\n [text]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.add-rule.title'\n | translate\n | async\n \"\n (onClick)=\"addConditionToGroup(group.id!)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n <ax-button\n class=\"ax-sm __add-inner-group-btn\"\n [look]=\"'outline'\"\n [color]=\"'primary'\"\n [text]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.add-inner-group.title'\n | translate\n | async\n \"\n (onClick)=\"addGroupToGroup(group.id!)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-layer-group\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div>\n } @else {\n @for (\n item of getSortedFilters(group.filters || []);\n track item.id;\n let first = $first;\n let last = $last\n ) {\n <div\n class=\"__condition-item\"\n axDrag\n [class.__is-first]=\"first && (group.filters?.length ?? 0) > 1\"\n [class.__is-last]=\"last && (group.filters?.length ?? 0) > 1\"\n >\n <div class=\"__drag-handle\" axDragHandle>\n <ax-icon icon=\"fa-solid fa-grip-vertical\"></ax-icon>\n </div>\n\n <div class=\"__item-content\">\n @if (item.filters === undefined) {\n <axp-condition-builder-condition\n [item]=\"item\"\n [filterDefinitions]=\"filterDefinitions()\"\n [onResolveWidget]=\"resolveDefaultFilterWidget.bind(this)\"\n [showFillByUser]=\"showFillByUser()\"\n (itemChange)=\"updateCondition($event)\"\n (removeItem)=\"removeItem($event)\"\n >\n </axp-condition-builder-condition>\n } @else {\n <ng-container\n [ngTemplateOutlet]=\"groupTemplate\"\n [ngTemplateOutletContext]=\"{ group: item }\"\n >\n </ng-container>\n }\n </div>\n\n <div class=\"__item-controls\">\n <ax-button\n class=\"ax-sm __icon-btn\"\n [look]=\"'blank'\"\n [color]=\"'danger'\"\n [title]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.remove.title'\n | translate\n | async\n \"\n (onClick)=\"removeItem(item.id!)\"\n >\n <ax-icon icon=\"fa-light fa-trash-can\"></ax-icon>\n </ax-button>\n </div>\n </div>\n }\n }\n </div>\n </div>\n <!-- <div class=\"__add-condition-link ps-16\">\n <ax-button class=\"ax-sm __add-condition-btn\" [look]=\"'link'\" [color]=\"'primary'\"\n [text]=\"'@data-management:metadata-definitions.components.query-builder.actions.add-condition.title' | translate | async\"\n (onClick)=\"addConditionToGroup(group.id!)\">\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div> -->\n\n @if ((group.filters?.length ?? 0) > 0) {\n <div class=\"__group-actions\">\n <ax-button\n class=\"ax-sm __add-rule-btn\"\n [look]=\"'twotone'\"\n [color]=\"'primary'\"\n [text]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.add-rule.title'\n | translate\n | async\n \"\n (onClick)=\"addConditionToGroup(group.id!)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n <ax-button\n class=\"ax-sm __add-inner-group-btn\"\n [look]=\"'outline'\"\n [color]=\"'primary'\"\n [text]=\"\n '@data-management:metadata-definitions.components.query-builder.actions.add-inner-group.title'\n | translate\n | async\n \"\n (onClick)=\"addGroupToGroup(group.id!)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-layer-group\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div>\n }\n </div>\n</ng-template>\n", styles: ["@layer properties;.axp-condition-builder{display:flex;height:100%;width:100%;flex-direction:column}.axp-condition-builder .__content{flex:1;overflow:auto;padding:calc(var(--spacing, .25rem) * 3)}.axp-condition-builder .__group{position:relative}.axp-condition-builder .__group.__root-group{border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:0;--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-condition-builder .__group:not(.__root-group){margin-top:calc(var(--spacing, .25rem) * 2);margin-bottom:calc(var(--spacing, .25rem) * 2);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding:calc(var(--spacing, .25rem) * 3);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border:1px solid rgba(var(--ax-sys-color-border-lightest-surface),1)}.axp-condition-builder .__group .__group-wrapper{--qb-connector-col: 4.25rem;--qb-conditions-gap: 1rem;display:grid;grid-template-columns:var(--qb-connector-col) 1fr;gap:0 var(--qb-conditions-gap);align-items:stretch;width:100%;min-height:2rem;min-width:0}.axp-condition-builder .__group:not(.__connectors-enabled)>.__group-wrapper{grid-template-columns:1fr}.axp-condition-builder .__group .__group-connector{--qb-operator-gap: .45rem;position:relative;width:var(--qb-connector-col);display:flex;flex-direction:column;align-items:center;justify-content:center;align-self:stretch;padding:0}.axp-condition-builder .__group .__group-connector:before,.axp-condition-builder .__group .__group-connector:after{content:\"\";position:absolute;left:50%;transform:translate(-50%);top:var(--qb-connector-top, 1.5rem);bottom:var(--qb-connector-bottom, 1.5rem);width:0;border-left:2px solid rgba(var(--ax-sys-color-primary-500),.5);z-index:0}.axp-condition-builder .__group .__group-connector:before{bottom:calc(50% - var(--qb-operator-gap))}.axp-condition-builder .__group .__group-connector:after{top:calc(50% + var(--qb-operator-gap))}.axp-condition-builder .__group .__group-connector .__operator-selector{position:absolute;top:0;left:50%;z-index:10;margin:0;display:flex;max-width:100%;flex-shrink:0;align-items:center;justify-content:center;transform:translate(-50%);box-sizing:border-box;height:100%}.axp-condition-builder .__group .__group-connector .__operator-selector .__operator-chip{position:relative;z-index:1;max-width:100%;flex-shrink:0;border-radius:var(--radius-md, .375rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));min-width:3.25rem}.axp-condition-builder .__group:not(.__connectors-enabled) .__group-connector:before,.axp-condition-builder .__group:not(.__connectors-enabled) .__group-connector:after{content:none}.axp-condition-builder .__group .__conditions-container{position:relative;display:flex;min-height:calc(var(--spacing, .25rem) * 8);min-width:0;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-left:0;padding-right:0}.axp-condition-builder .__group .__conditions-container .__group-empty{display:flex;min-height:calc(var(--spacing, .25rem) * 12);flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 3)}.axp-condition-builder .__group .__conditions-container.drop-list-dragging,.axp-condition-builder .__group .__conditions-container.drop-list-receiving{position:relative;min-height:calc(var(--spacing, .25rem) * 12);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);--tw-border-style: dashed;border-style:dashed;background-color:var(--color-primary-lightest);color:var(--color-on-primary-lightest);border-color:var(--color-border-primary-lightest);padding:var(--spacing, .25rem);border-color:rgba(var(--ax-sys-color-primary-300),.5);border-width:1px}:is(.axp-condition-builder .__group .__conditions-container.drop-list-dragging,.axp-condition-builder .__group .__conditions-container.drop-list-receiving):has(.__group-empty):after{content:\"Drop conditions here\";position:absolute;inset:0;z-index:-1;display:flex;min-height:calc(var(--spacing, .25rem) * 8);align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 2);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-primary-surface));pointer-events:none}.axp-condition-builder .__group .__conditions-container.drop-list-dragging .__condition-item:not(.drag-placeholder){margin-bottom:.375rem}.axp-condition-builder .__group .__conditions-container.drop-list-dragging .__condition-item:not(.drag-placeholder):last-child{margin-bottom:0}.axp-condition-builder .__group .__group-actions{margin-top:calc(var(--spacing, .25rem) * 2);display:flex;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2);border-top-style:var(--tw-border-style);border-top-width:1px;padding-block:calc(var(--spacing, .25rem) * 2.5);border-top:1px solid rgba(var(--ax-sys-color-border-lighter-surface),1);grid-column:1 / -1}.axp-condition-builder .__group .__add-condition-link{flex-shrink:0;padding-top:calc(var(--spacing, .25rem) * 2)}.axp-condition-builder .__condition-item{position:relative;display:flex;min-height:calc(var(--spacing, .25rem) * 12);cursor:move;align-items:center;gap:calc(var(--spacing, .25rem) * 3);background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5);-webkit-user-select:none;user-select:none;border-radius:.375rem;border:1px solid rgba(var(--ax-sys-color-border-lightest-surface),1)}.axp-condition-builder .__condition-item:hover{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);border-color:rgba(var(--ax-sys-color-border-lighter-surface),1)}.axp-condition-builder .__condition-item.__is-first:before,.axp-condition-builder .__condition-item.__is-last:before{content:\"\";position:absolute;left:calc(-1 * (var(--qb-connector-col) * .5 + var(--qb-conditions-gap, 1rem)));top:50%;transform:translateY(-50%);width:calc(var(--qb-connector-col) * .5 + var(--qb-conditions-gap, 1rem));height:0;border-top:2px solid rgba(var(--ax-sys-color-primary-500),.5);z-index:0}.axp-condition-builder .__condition-item .__drag-handle{position:relative;z-index:1;display:flex;height:calc(var(--spacing, .25rem) * 5);width:calc(var(--spacing, .25rem) * 5);flex-shrink:0;cursor:grab;align-items:center;justify-content:center;color:var(--color-neutral-400, oklch(70.8% 0 0));transition:color .15s ease-in-out}.axp-condition-builder .__condition-item .__drag-handle:active{cursor:grabbing}.axp-condition-builder .__condition-item .__drag-handle:hover{color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-condition-builder .__condition-item .__item-content{position:relative;z-index:1;min-width:0;flex:1}.axp-condition-builder .__condition-item .__item-controls{position:relative;z-index:1;display:flex;width:calc(var(--spacing, .25rem) * 8);flex-shrink:0;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing, .25rem)}.axp-condition-builder .__condition-item .__icon-btn{display:flex;flex-shrink:0;align-items:center;justify-content:center;padding:0;width:1.75rem;height:1.75rem}.axp-condition-builder .__condition-item.drag-preview{display:flex;min-height:calc(var(--spacing, .25rem) * 12);align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-style:var(--tw-border-style);background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5);--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);opacity:.9;border-radius:.375rem;border-width:1px}.axp-condition-builder .__condition-item.drag-placeholder{position:relative;margin-bottom:calc(var(--spacing, .25rem) * 2);min-height:calc(var(--spacing, .25rem) * 12);border-style:var(--tw-border-style);--tw-border-style: dashed;border-style:dashed;background-color:var(--color-primary-lightest);color:var(--color-on-primary-lightest);border-color:var(--color-border-primary-lightest);opacity:50%;border-radius:.375rem;border-color:rgba(var(--ax-sys-color-primary-300),.5);border-width:1px}.axp-condition-builder .__condition-item.drag-placeholder>*{opacity:0%}.axp-condition-builder .__condition-item.drag-animating{transition:transform .25s cubic-bezier(.4,0,.2,1)}.axp-condition-builder .__group:not(.__root-group).drag-preview{border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-width:1px}.axp-condition-builder .__group:not(.__root-group).drag-placeholder{margin-bottom:calc(var(--spacing, .25rem) * 2);min-height:calc(var(--spacing, .25rem) * 16);border-style:var(--tw-border-style);--tw-border-style: dashed;border-style:dashed;background-color:var(--color-primary-lightest);color:var(--color-on-primary-lightest);border-color:var(--color-border-primary-lightest);opacity:50%;border-color:rgba(var(--ax-sys-color-primary-300),.5);border-width:1px}.axp-condition-builder .__group:not(.__root-group).drag-dragging{opacity:70%}.axp-condition-builder .__group:not(.__root-group):hover:not(.drag-dragging) .__drag-handle{color:rgba(var(--ax-sys-color-primary-surface))}.__group:not(.__connectors-enabled) .axp-condition-builder .__group .__group-connector:before,.__group:not(.__connectors-enabled) .axp-condition-builder .__group .__group-connector:after{content:none}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
3174
3173
  }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], filterDefinitions: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterDefinitions", required: false }] }], showFillByUser: [{ type: i0.Input, args: [{ isSignal: true, alias: "showFillByUser", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] } });
3175
3174
 
3176
3175
  // Shared types and definitions for all expression builders
@@ -3232,7 +3231,7 @@ class AXPFileProviderMenuComponent {
3232
3231
  </ax-button-item-list>
3233
3232
  </div>
3234
3233
  </ax-popover>
3235
- `, isInline: true, dependencies: [{ kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i4$2.AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1$2.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.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: AXTranslationModule }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
3234
+ `, isInline: true, dependencies: [{ kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i2$2.AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1$2.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.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: AXTranslationModule }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
3236
3235
  }
3237
3236
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFileProviderMenuComponent, decorators: [{
3238
3237
  type: Component,
@@ -4151,6 +4150,7 @@ class AXPQueryFiltersComponent {
4151
4150
  allowInEditableFields: true,
4152
4151
  handler: () => {
4153
4152
  this.tagBox()?.focus();
4153
+ this.openFilterPopover();
4154
4154
  },
4155
4155
  },
4156
4156
  ],
@@ -4200,6 +4200,82 @@ class AXPQueryFiltersComponent {
4200
4200
  ngOnInit() {
4201
4201
  this.tagBoxInput = this.tagBox()?.getHostElement().querySelector('input');
4202
4202
  }
4203
+ /** Opens the filter popover anchored to the last tag or tag-box start. */
4204
+ openFilterPopover() {
4205
+ this.syncPopoverAnchor();
4206
+ this.popover()?.open();
4207
+ }
4208
+ /** Click on the tag-box opens the filter menu (empty or with tags). */
4209
+ handleTagBoxClick(event) {
4210
+ if (this.filtersDefinitions().length === 0 || this.activeFilter()) {
4211
+ return;
4212
+ }
4213
+ const target = event.target;
4214
+ if (!(target instanceof HTMLElement)) {
4215
+ return;
4216
+ }
4217
+ if (target.closest('button')) {
4218
+ return;
4219
+ }
4220
+ this.tagBox()?.focus();
4221
+ this.openFilterPopover();
4222
+ }
4223
+ /**
4224
+ * Positions the filter popover:
4225
+ * - With tags: inline-end of the last tag (tag-box input inline-start).
4226
+ * - Without tags: inline-start of the tag-box.
4227
+ */
4228
+ syncPopoverAnchor(overrideTarget) {
4229
+ const popover = this.popover();
4230
+ if (!popover) {
4231
+ return;
4232
+ }
4233
+ const { target, placement, offsetX } = this.resolvePopoverAnchor(overrideTarget);
4234
+ if (target) {
4235
+ popover.target = target;
4236
+ }
4237
+ popover.placement = placement;
4238
+ popover.offsetX = offsetX;
4239
+ }
4240
+ resolvePopoverAnchor(overrideTarget) {
4241
+ const host = this.tagBox()?.getHostElement();
4242
+ if (!host) {
4243
+ return { target: null, placement: 'bottom-start', offsetX: 0 };
4244
+ }
4245
+ const rtl = this.isRtlContext(host);
4246
+ const input = host.querySelector('input.ax-input');
4247
+ const tagsContainer = host.querySelector('.ax-tags-container');
4248
+ const tagBoxStart = (tagsContainer ?? host.querySelector('.ax-editor-container') ?? host);
4249
+ const hasTags = Boolean(tagsContainer && this.findLastTagElement(tagsContainer));
4250
+ if (overrideTarget) {
4251
+ const inlineEndOffset = overrideTarget.offsetWidth;
4252
+ return {
4253
+ target: overrideTarget,
4254
+ placement: rtl ? 'bottom-end' : 'bottom-start',
4255
+ offsetX: rtl ? -inlineEndOffset : inlineEndOffset,
4256
+ };
4257
+ }
4258
+ if (hasTags && input) {
4259
+ return {
4260
+ target: input,
4261
+ placement: rtl ? 'bottom-end' : 'bottom-start',
4262
+ offsetX: 0,
4263
+ };
4264
+ }
4265
+ return {
4266
+ target: input ?? tagBoxStart,
4267
+ placement: rtl ? 'bottom-end' : 'bottom-start',
4268
+ offsetX: 0,
4269
+ };
4270
+ }
4271
+ findLastTagElement(tagsContainer) {
4272
+ const tagElements = Array.from(tagsContainer.children).filter((child) => child instanceof HTMLElement && !child.matches('input.ax-input'));
4273
+ return tagElements.length > 0 ? tagElements[tagElements.length - 1] : null;
4274
+ }
4275
+ isRtlContext(anchor) {
4276
+ const dir = getComputedStyle(anchor).direction || document.documentElement.getAttribute('dir');
4277
+ return dir === 'rtl';
4278
+ }
4203
4279
  handleSelectField(field) {
4204
4280
  if (this.isFilterDisabled(field)) {
4205
4281
  return;
@@ -4279,7 +4355,7 @@ class AXPQueryFiltersComponent {
4279
4355
  }
4280
4356
  }
4281
4357
  else {
4282
- this.popover()?.open();
4358
+ this.openFilterPopover();
4283
4359
  }
4284
4360
  }
4285
4361
  else if (e.nativeEvent?.key === 'Enter' && this.tagBox()?.inputValue()?.trim()) {
@@ -4297,12 +4373,14 @@ class AXPQueryFiltersComponent {
4297
4373
  e.stopPropagation();
4298
4374
  this.handleApplyFilter();
4299
4375
  }
4300
- handleTagClick(item) {
4376
+ handleTagClick(item, event) {
4301
4377
  if (item.field === 'all') {
4302
4378
  return;
4303
4379
  }
4304
4380
  this.captureEditingContextSnapshot(item);
4305
4381
  this.activeFilter.set(item);
4382
+ const clickedTag = event?.currentTarget instanceof HTMLElement ? event.currentTarget : undefined;
4383
+ this.syncPopoverAnchor(clickedTag);
4306
4384
  this.popover()?.open();
4307
4385
  }
4308
4386
  handleRemoveTag(e, index) {
@@ -4399,7 +4477,10 @@ class AXPQueryFiltersComponent {
4399
4477
  onPopoverOpened(e) {
4400
4478
  if (this.filtersDefinitions().length === 0) {
4401
4479
  this.popover()?.close();
4480
+ return;
4402
4481
  }
4482
+ this.syncPopoverAnchor();
4483
+ queueMicrotask(() => this.popover()?.updatePosition());
4403
4484
  }
4404
4485
  deactivateAllListItems() {
4405
4486
  if (this.listItems) {
@@ -4588,7 +4669,7 @@ class AXPQueryFiltersComponent {
4588
4669
  */
4589
4670
  #focusEffect;
4590
4671
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPQueryFiltersComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
4591
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPQueryFiltersComponent, isStandalone: true, selector: "axp-query-filters", inputs: { filtersDefinitions: { classPropertyName: "filtersDefinitions", publicName: "filtersDefinitions", isSignal: true, isRequired: false, transformFunction: null }, initialFilters: { classPropertyName: "initialFilters", publicName: "initialFilters", isSignal: true, isRequired: false, transformFunction: null }, quickSearch: { classPropertyName: "quickSearch", publicName: "quickSearch", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onFiltersChanged: "onFiltersChanged" }, viewQueries: [{ propertyName: "tagBox", first: true, predicate: ["tagBox"], descendants: true, isSignal: true }, { propertyName: "widgetRenderer", first: true, predicate: ["widgetRenderer"], descendants: true, isSignal: true }, { propertyName: "popover", first: true, predicate: ["popover"], descendants: true, isSignal: true }, { propertyName: "listItems", predicate: ["caseItem"], descendants: true }], ngImport: i0, template: "<div\n class=\"flex items-center gap-2 p-2\"\n (keydown.control.space)=\"popover.open()\"\n>\n <ax-button\n (keydown)=\"handleButtonKeyDown($event)\"\n (onClick)=\"popover.open()\"\n #filterButton\n [look]=\"'blank'\"\n >\n <ax-icon class=\"far fa-bars-filter cursor-pointer\"> </ax-icon>\n </ax-button>\n <ax-tag-box\n #tagBoxComponent\n [ngModel]=\"asyncTags()\"\n (onValueChanged)=\"handleSelectFilters($event)\"\n [textField]=\"'query'\"\n [valueField]=\"'id'\"\n [readonly]=\"filtersDefinitions().length === 0\"\n [look]=\"'none'\"\n [readonlyField]=\"'readOnly'\"\n [tagTemplate]=\"tagTemplate\"\n (onKeyDown)=\"handleKeyDown($event)\"\n [addOnEnter]=\"false\"\n [placeholder]=\"\n (filtersDefinitions().length === 0\n ? '@general:terms.interface.filter.no-filter-definitions'\n : '@general:terms.interface.filter.placeholder'\n )\n | translate\n | async\n \"\n #tagBox\n >\n <ax-suffix class=\"hidden shrink-0 whitespace-nowrap md:flex text-gray-500\">\n <ax-kbd look=\"blank\">\n <ax-kbd-item [keys]=\"filterFocusShortcutKeys\"></ax-kbd-item>\n </ax-kbd>\n </ax-suffix>\n </ax-tag-box>\n\n <ng-template #tagTemplate let-item let-index=\"index\">\n <div\n class=\"inline-flex items-center gap-1.5 hover:bg-darkest cursor-pointer rounded-md px-3 py-1 text-sm surface\"\n [class.!bg-primary]=\"item.field === 'all'\"\n [class.!text-white]=\"item.field === 'all'\"\n (click)=\"handleTagClick(item)\"\n >\n <span>{{ item.query }}</span>\n @if (!item.readOnly) {\n <button (click)=\"handleRemoveTag($event, index)\" type=\"button\">\n <ax-icon class=\"ax-icon ax-icon-close\"></ax-icon>\n </button>\n }\n </div>\n </ng-template>\n</div>\n\n<ax-popover\n [offsetY]=\"activeFilter() ? -30 : 0\"\n [target]=\"tagBoxInput\"\n [openOn]=\"'toggle'\"\n (onOpened)=\"onPopoverOpened($event)\"\n [closeOn]=\"'clickOut'\"\n (onClosed)=\"handlePopoverClosed($event)\"\n [adaptivityEnabled]=\"true\"\n #popover\n>\n <div\n class=\"md:min-w-72 w-full rounded-md md:max-h-96 lg:w-[450px] md:overflow-auto\"\n >\n <axp-widgets-container\n [context]=\"context()\"\n (onContextChanged)=\"onContextChanged($event)\"\n >\n @if (activeFilter()) {\n <div\n class=\"flex flex-col lightest-surface shadow-md\"\n (keydown.enter)=\"onEnterKeyPressed($event)\"\n >\n <ax-header class=\"border-b border-light px-4 py-2 font-semibold\">{{\n activeFilter()?.title! | translate | async\n }}</ax-header>\n <ax-content class=\"p-4\">\n <div class=\"mb-2\">\n <ax-badge\n [text]=\"\n (getActiveOperator(activeFilter())! | translate | async) || ''\n \"\n ></ax-badge>\n </div>\n <ng-container\n #widgetRenderer=\"widgetRenderer\"\n axp-widget-renderer\n [node]=\"{\n type: activeFilter()?.widget?.type || 'text-editor',\n path: resolveFilterContextField(activeFilter()!),\n options: activeFilter()?.widget?.options,\n }\"\n [mode]=\"'edit'\"\n >\n </ng-container>\n </ax-content>\n <ax-footer\n class=\"border-t flex justify-end border-light w-full px-4 py-2\"\n >\n <ax-button\n class=\"ax-sm\"\n [text]=\"'@general:actions.apply.title' | translate | async\"\n (onClick)=\"handleApplyFilter()\"\n ></ax-button>\n </ax-footer>\n </div>\n } @else {\n <div\n axListNavigation\n #list=\"axListNavigation\"\n class=\"axp-list-items border-none\"\n >\n <!-- @if (tagBox.inputValue()) {\n @for (inlineFilter of inlineFilters(); track inlineFilter.field) {\n <div\n axListNavigationItem\n #caseItem=\"axListNavigationItem\"\n [class.axp-state-focused]=\"caseItem.isActive()\"\n tabindex=\"0\"\n (click)=\"handleSelectInlineFilter(inlineFilter)\"\n (keydown)=\"handleInlineFilterKeyDown($event, inlineFilter)\"\n >\n {{ inlineFilter.title | translate | async }} {{ getActiveOperator(inlineFilter) }} '{{\n tagBox.inputValue()\n }}'\n </div>\n }\n <span class=\"w-full border-t border-light my-1\"></span>\n } -->\n @for (field of filterFields(); track field.field) {\n <div\n axListNavigationItem\n #caseItem=\"axListNavigationItem\"\n [class.axp-state-focused]=\"\n caseItem.isActive() && !isFilterDisabled(field)\n \"\n [class.axp-query-filters__advance-item--disabled]=\"\n isFilterDisabled(field)\n \"\n [attr.aria-disabled]=\"isFilterDisabled(field) ? 'true' : null\"\n [attr.tabindex]=\"isFilterDisabled(field) ? -1 : 0\"\n (click)=\"handleSelectField(field)\"\n (keydown)=\"handleFieldKeyDown($event, field)\"\n >\n <div class=\"flex items-end gap-2\">\n <ax-icon class=\"w-5\" [class]=\"'fa-light ' + field.icon\">\n </ax-icon>\n {{ field.title | translate | async }}\n </div>\n </div>\n }\n </div>\n }\n </axp-widgets-container>\n </div>\n</ax-popover>\n", styles: ["@layer properties;axp-query-filters{width:100%}axp-query-filters ax-tag-box .editor-container{background-color:transparent}axp-query-filters ax-tag-box ax-suffix{flex-shrink:0;white-space:nowrap}.axp-list-items{display:flex;min-width:calc(var(--spacing, .25rem) * 40);flex-direction:column;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-block:calc(var(--spacing, .25rem) * 4);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-list-items>div{min-width:calc(var(--spacing, .25rem) * 28);cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);text-align:start}.axp-list-items>div:focus{outline:none}.axp-list-items>div.axp-state-focused,.axp-list-items>div:hover{background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface)}.axp-list-items>div.axp-query-filters__advance-item--disabled{cursor:not-allowed;opacity:50%}.axp-list-items>div.axp-query-filters__advance-item--disabled.axp-state-focused,.axp-list-items>div.axp-query-filters__advance-item--disabled:hover{background-color:transparent}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.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: "component", type: AXKBDComponent, selector: "ax-kbd", inputs: ["look"] }, { kind: "component", type: AXKBDItemComponent, selector: "ax-kbd-item", inputs: ["keys", "join", "look"], outputs: ["lookChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i4$2.AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXSelectionListModule }, { kind: "ngmodule", type: AXTagBoxModule }, { kind: "component", type: i5$2.AXTagBoxComponent, selector: "ax-tag-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "allowNull", "type", "look", "addOnComma", "addOnEnter", "valueField", "textField", "readonlyField", "allowDuplicateValues", "tagTemplate"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onTagClick", "onTagDblClick", "onTagContextMenu"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { 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", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXListNavigationModule }, { kind: "directive", type: i7$1.AXListNavigationDirective, selector: "[axListNavigation]", inputs: ["orientation"], outputs: ["onNavigationChanged", "onKeypress"], exportAs: ["axListNavigation"] }, { kind: "directive", type: i7$1.AXListNavigationItemDirective, selector: "[axListNavigationItem]", outputs: ["onKeypress"], exportAs: ["axListNavigationItem"] }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "component", type: i4$1.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
4672
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPQueryFiltersComponent, isStandalone: true, selector: "axp-query-filters", inputs: { filtersDefinitions: { classPropertyName: "filtersDefinitions", publicName: "filtersDefinitions", isSignal: true, isRequired: false, transformFunction: null }, initialFilters: { classPropertyName: "initialFilters", publicName: "initialFilters", isSignal: true, isRequired: false, transformFunction: null }, quickSearch: { classPropertyName: "quickSearch", publicName: "quickSearch", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onFiltersChanged: "onFiltersChanged" }, viewQueries: [{ propertyName: "tagBox", first: true, predicate: ["tagBox"], descendants: true, isSignal: true }, { propertyName: "widgetRenderer", first: true, predicate: ["widgetRenderer"], descendants: true, isSignal: true }, { propertyName: "popover", first: true, predicate: ["popover"], descendants: true, isSignal: true }, { propertyName: "listItems", predicate: ["caseItem"], descendants: true }], ngImport: i0, template: "<div\n class=\"flex w-full min-w-0 items-center gap-2 p-2\"\n (keydown.control.space)=\"openFilterPopover()\"\n>\n <ax-button\n (keydown)=\"handleButtonKeyDown($event)\"\n (onClick)=\"openFilterPopover()\"\n #filterButton\n [look]=\"'blank'\"\n >\n <ax-icon class=\"far fa-bars-filter cursor-pointer\"> </ax-icon>\n </ax-button>\n <div class=\"min-w-0 flex-1\" (click)=\"handleTagBoxClick($event)\">\n <ax-tag-box\n #tagBoxComponent\n [ngModel]=\"asyncTags()\"\n (onValueChanged)=\"handleSelectFilters($event)\"\n [textField]=\"'query'\"\n [valueField]=\"'id'\"\n [readonly]=\"filtersDefinitions().length === 0\"\n [look]=\"'none'\"\n [readonlyField]=\"'readOnly'\"\n [tagTemplate]=\"tagTemplate\"\n (onKeyDown)=\"handleKeyDown($event)\"\n [addOnEnter]=\"false\"\n [placeholder]=\"\n (filtersDefinitions().length === 0\n ? '@general:terms.interface.filter.no-filter-definitions'\n : '@general:terms.interface.filter.placeholder'\n )\n | translate\n | async\n \"\n #tagBox\n >\n <ax-suffix class=\"hidden shrink-0 whitespace-nowrap md:flex text-gray-500\">\n <ax-kbd look=\"blank\">\n <ax-kbd-item [keys]=\"filterFocusShortcutKeys\"></ax-kbd-item>\n </ax-kbd>\n </ax-suffix>\n </ax-tag-box>\n </div>\n\n <ng-template #tagTemplate let-item let-index=\"index\">\n <div\n class=\"inline-flex items-center gap-1.5 hover:bg-darkest cursor-pointer rounded-md px-3 py-1 text-sm surface\"\n [class.!bg-primary]=\"item.field === 'all'\"\n [class.!text-white]=\"item.field === 'all'\"\n (click)=\"handleTagClick(item, $event)\"\n >\n <span>{{ item.query }}</span>\n @if (!item.readOnly) {\n <button (click)=\"handleRemoveTag($event, index)\" type=\"button\">\n <ax-icon class=\"ax-icon ax-icon-close\"></ax-icon>\n </button>\n }\n </div>\n </ng-template>\n</div>\n\n<ax-popover\n [offsetY]=\"activeFilter() ? -30 : 0\"\n [openOn]=\"'toggle'\"\n (onOpened)=\"onPopoverOpened($event)\"\n [closeOn]=\"'clickOut'\"\n (onClosed)=\"handlePopoverClosed($event)\"\n [adaptivityEnabled]=\"true\"\n #popover\n>\n <div\n class=\"md:min-w-72 w-full rounded-md md:max-h-96 lg:w-[450px] md:overflow-auto\"\n >\n <axp-widgets-container\n [context]=\"context()\"\n (onContextChanged)=\"onContextChanged($event)\"\n >\n @if (activeFilter()) {\n <div\n class=\"flex flex-col lightest-surface shadow-md\"\n (keydown.enter)=\"onEnterKeyPressed($event)\"\n >\n <ax-header class=\"border-b border-border-light px-4 py-2 font-semibold\">{{\n activeFilter()?.title! | translate | async\n }}</ax-header>\n <ax-content class=\"p-4\">\n <div class=\"mb-2\">\n <ax-badge\n [text]=\"\n (getActiveOperator(activeFilter())! | translate | async) || ''\n \"\n ></ax-badge>\n </div>\n <ng-container\n #widgetRenderer=\"widgetRenderer\"\n axp-widget-renderer\n [node]=\"{\n type: activeFilter()?.widget?.type || 'text-editor',\n path: resolveFilterContextField(activeFilter()!),\n options: activeFilter()?.widget?.options,\n }\"\n [mode]=\"'edit'\"\n >\n </ng-container>\n </ax-content>\n <ax-footer\n class=\"border-t flex justify-end border-border-light w-full px-4 py-2\"\n >\n <ax-button\n class=\"ax-sm\"\n [text]=\"'@general:actions.apply.title' | translate | async\"\n (onClick)=\"handleApplyFilter()\"\n ></ax-button>\n </ax-footer>\n </div>\n } @else {\n <div\n axListNavigation\n #list=\"axListNavigation\"\n class=\"axp-list-items border-none\"\n >\n <!-- @if (tagBox.inputValue()) {\n @for (inlineFilter of inlineFilters(); track inlineFilter.field) {\n <div\n axListNavigationItem\n #caseItem=\"axListNavigationItem\"\n [class.axp-state-focused]=\"caseItem.isActive()\"\n tabindex=\"0\"\n (click)=\"handleSelectInlineFilter(inlineFilter)\"\n (keydown)=\"handleInlineFilterKeyDown($event, inlineFilter)\"\n >\n {{ inlineFilter.title | translate | async }} {{ getActiveOperator(inlineFilter) }} '{{\n tagBox.inputValue()\n }}'\n </div>\n }\n <span class=\"w-full border-t border-light my-1\"></span>\n } -->\n @for (field of filterFields(); track field.field) {\n <div\n axListNavigationItem\n #caseItem=\"axListNavigationItem\"\n [class.axp-state-focused]=\"\n caseItem.isActive() && !isFilterDisabled(field)\n \"\n [class.axp-query-filters__advance-item--disabled]=\"\n isFilterDisabled(field)\n \"\n [attr.aria-disabled]=\"isFilterDisabled(field) ? 'true' : null\"\n [attr.tabindex]=\"isFilterDisabled(field) ? -1 : 0\"\n (click)=\"handleSelectField(field)\"\n (keydown)=\"handleFieldKeyDown($event, field)\"\n >\n <div class=\"flex items-end gap-2\">\n <ax-icon class=\"w-5\" [class]=\"'fa-light ' + field.icon\">\n </ax-icon>\n {{ field.title | translate | async }}\n </div>\n </div>\n }\n </div>\n }\n </axp-widgets-container>\n </div>\n</ax-popover>\n", styles: ["@layer properties;axp-query-filters{width:100%;min-width:0}axp-query-filters>.flex>.min-w-0.flex-1{min-width:0}axp-query-filters ax-tag-box{width:100%;min-width:0}axp-query-filters ax-tag-box .editor-container{background-color:transparent}axp-query-filters ax-tag-box ax-suffix{flex-shrink:0;white-space:nowrap}.axp-list-items{display:flex;min-width:calc(var(--spacing, .25rem) * 40);flex-direction:column;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-block:calc(var(--spacing, .25rem) * 4);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-list-items>div{min-width:calc(var(--spacing, .25rem) * 28);cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);text-align:start}.axp-list-items>div:focus{outline:none}.axp-list-items>div.axp-state-focused,.axp-list-items>div:hover{background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface)}.axp-list-items>div.axp-query-filters__advance-item--disabled{cursor:not-allowed;opacity:50%}.axp-list-items>div.axp-query-filters__advance-item--disabled.axp-state-focused,.axp-list-items>div.axp-query-filters__advance-item--disabled:hover{background-color:transparent}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.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: "component", type: AXKBDComponent, selector: "ax-kbd", inputs: ["look"] }, { kind: "component", type: AXKBDItemComponent, selector: "ax-kbd-item", inputs: ["keys", "join", "look"], outputs: ["lookChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i2$2.AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXSelectionListModule }, { kind: "ngmodule", type: AXTagBoxModule }, { kind: "component", type: i5$2.AXTagBoxComponent, selector: "ax-tag-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "allowNull", "type", "look", "addOnComma", "addOnEnter", "valueField", "textField", "readonlyField", "allowDuplicateValues", "tagTemplate"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onTagClick", "onTagDblClick", "onTagContextMenu"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { 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", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXListNavigationModule }, { kind: "directive", type: i7$1.AXListNavigationDirective, selector: "[axListNavigation]", inputs: ["orientation"], outputs: ["onNavigationChanged", "onKeypress"], exportAs: ["axListNavigation"] }, { kind: "directive", type: i7$1.AXListNavigationItemDirective, selector: "[axListNavigationItem]", outputs: ["onKeypress"], exportAs: ["axListNavigationItem"] }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "component", type: i1$3.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
4592
4673
  }
4593
4674
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPQueryFiltersComponent, decorators: [{
4594
4675
  type: Component,
@@ -4606,7 +4687,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
4606
4687
  AXPWidgetCoreModule,
4607
4688
  AXListNavigationModule,
4608
4689
  AXBadgeModule,
4609
- ], template: "<div\n class=\"flex items-center gap-2 p-2\"\n (keydown.control.space)=\"popover.open()\"\n>\n <ax-button\n (keydown)=\"handleButtonKeyDown($event)\"\n (onClick)=\"popover.open()\"\n #filterButton\n [look]=\"'blank'\"\n >\n <ax-icon class=\"far fa-bars-filter cursor-pointer\"> </ax-icon>\n </ax-button>\n <ax-tag-box\n #tagBoxComponent\n [ngModel]=\"asyncTags()\"\n (onValueChanged)=\"handleSelectFilters($event)\"\n [textField]=\"'query'\"\n [valueField]=\"'id'\"\n [readonly]=\"filtersDefinitions().length === 0\"\n [look]=\"'none'\"\n [readonlyField]=\"'readOnly'\"\n [tagTemplate]=\"tagTemplate\"\n (onKeyDown)=\"handleKeyDown($event)\"\n [addOnEnter]=\"false\"\n [placeholder]=\"\n (filtersDefinitions().length === 0\n ? '@general:terms.interface.filter.no-filter-definitions'\n : '@general:terms.interface.filter.placeholder'\n )\n | translate\n | async\n \"\n #tagBox\n >\n <ax-suffix class=\"hidden shrink-0 whitespace-nowrap md:flex text-gray-500\">\n <ax-kbd look=\"blank\">\n <ax-kbd-item [keys]=\"filterFocusShortcutKeys\"></ax-kbd-item>\n </ax-kbd>\n </ax-suffix>\n </ax-tag-box>\n\n <ng-template #tagTemplate let-item let-index=\"index\">\n <div\n class=\"inline-flex items-center gap-1.5 hover:bg-darkest cursor-pointer rounded-md px-3 py-1 text-sm surface\"\n [class.!bg-primary]=\"item.field === 'all'\"\n [class.!text-white]=\"item.field === 'all'\"\n (click)=\"handleTagClick(item)\"\n >\n <span>{{ item.query }}</span>\n @if (!item.readOnly) {\n <button (click)=\"handleRemoveTag($event, index)\" type=\"button\">\n <ax-icon class=\"ax-icon ax-icon-close\"></ax-icon>\n </button>\n }\n </div>\n </ng-template>\n</div>\n\n<ax-popover\n [offsetY]=\"activeFilter() ? -30 : 0\"\n [target]=\"tagBoxInput\"\n [openOn]=\"'toggle'\"\n (onOpened)=\"onPopoverOpened($event)\"\n [closeOn]=\"'clickOut'\"\n (onClosed)=\"handlePopoverClosed($event)\"\n [adaptivityEnabled]=\"true\"\n #popover\n>\n <div\n class=\"md:min-w-72 w-full rounded-md md:max-h-96 lg:w-[450px] md:overflow-auto\"\n >\n <axp-widgets-container\n [context]=\"context()\"\n (onContextChanged)=\"onContextChanged($event)\"\n >\n @if (activeFilter()) {\n <div\n class=\"flex flex-col lightest-surface shadow-md\"\n (keydown.enter)=\"onEnterKeyPressed($event)\"\n >\n <ax-header class=\"border-b border-light px-4 py-2 font-semibold\">{{\n activeFilter()?.title! | translate | async\n }}</ax-header>\n <ax-content class=\"p-4\">\n <div class=\"mb-2\">\n <ax-badge\n [text]=\"\n (getActiveOperator(activeFilter())! | translate | async) || ''\n \"\n ></ax-badge>\n </div>\n <ng-container\n #widgetRenderer=\"widgetRenderer\"\n axp-widget-renderer\n [node]=\"{\n type: activeFilter()?.widget?.type || 'text-editor',\n path: resolveFilterContextField(activeFilter()!),\n options: activeFilter()?.widget?.options,\n }\"\n [mode]=\"'edit'\"\n >\n </ng-container>\n </ax-content>\n <ax-footer\n class=\"border-t flex justify-end border-light w-full px-4 py-2\"\n >\n <ax-button\n class=\"ax-sm\"\n [text]=\"'@general:actions.apply.title' | translate | async\"\n (onClick)=\"handleApplyFilter()\"\n ></ax-button>\n </ax-footer>\n </div>\n } @else {\n <div\n axListNavigation\n #list=\"axListNavigation\"\n class=\"axp-list-items border-none\"\n >\n <!-- @if (tagBox.inputValue()) {\n @for (inlineFilter of inlineFilters(); track inlineFilter.field) {\n <div\n axListNavigationItem\n #caseItem=\"axListNavigationItem\"\n [class.axp-state-focused]=\"caseItem.isActive()\"\n tabindex=\"0\"\n (click)=\"handleSelectInlineFilter(inlineFilter)\"\n (keydown)=\"handleInlineFilterKeyDown($event, inlineFilter)\"\n >\n {{ inlineFilter.title | translate | async }} {{ getActiveOperator(inlineFilter) }} '{{\n tagBox.inputValue()\n }}'\n </div>\n }\n <span class=\"w-full border-t border-light my-1\"></span>\n } -->\n @for (field of filterFields(); track field.field) {\n <div\n axListNavigationItem\n #caseItem=\"axListNavigationItem\"\n [class.axp-state-focused]=\"\n caseItem.isActive() && !isFilterDisabled(field)\n \"\n [class.axp-query-filters__advance-item--disabled]=\"\n isFilterDisabled(field)\n \"\n [attr.aria-disabled]=\"isFilterDisabled(field) ? 'true' : null\"\n [attr.tabindex]=\"isFilterDisabled(field) ? -1 : 0\"\n (click)=\"handleSelectField(field)\"\n (keydown)=\"handleFieldKeyDown($event, field)\"\n >\n <div class=\"flex items-end gap-2\">\n <ax-icon class=\"w-5\" [class]=\"'fa-light ' + field.icon\">\n </ax-icon>\n {{ field.title | translate | async }}\n </div>\n </div>\n }\n </div>\n }\n </axp-widgets-container>\n </div>\n</ax-popover>\n", styles: ["@layer properties;axp-query-filters{width:100%}axp-query-filters ax-tag-box .editor-container{background-color:transparent}axp-query-filters ax-tag-box ax-suffix{flex-shrink:0;white-space:nowrap}.axp-list-items{display:flex;min-width:calc(var(--spacing, .25rem) * 40);flex-direction:column;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-block:calc(var(--spacing, .25rem) * 4);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-list-items>div{min-width:calc(var(--spacing, .25rem) * 28);cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);text-align:start}.axp-list-items>div:focus{outline:none}.axp-list-items>div.axp-state-focused,.axp-list-items>div:hover{background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface)}.axp-list-items>div.axp-query-filters__advance-item--disabled{cursor:not-allowed;opacity:50%}.axp-list-items>div.axp-query-filters__advance-item--disabled.axp-state-focused,.axp-list-items>div.axp-query-filters__advance-item--disabled:hover{background-color:transparent}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
4690
+ ], template: "<div\n class=\"flex w-full min-w-0 items-center gap-2 p-2\"\n (keydown.control.space)=\"openFilterPopover()\"\n>\n <ax-button\n (keydown)=\"handleButtonKeyDown($event)\"\n (onClick)=\"openFilterPopover()\"\n #filterButton\n [look]=\"'blank'\"\n >\n <ax-icon class=\"far fa-bars-filter cursor-pointer\"> </ax-icon>\n </ax-button>\n <div class=\"min-w-0 flex-1\" (click)=\"handleTagBoxClick($event)\">\n <ax-tag-box\n #tagBoxComponent\n [ngModel]=\"asyncTags()\"\n (onValueChanged)=\"handleSelectFilters($event)\"\n [textField]=\"'query'\"\n [valueField]=\"'id'\"\n [readonly]=\"filtersDefinitions().length === 0\"\n [look]=\"'none'\"\n [readonlyField]=\"'readOnly'\"\n [tagTemplate]=\"tagTemplate\"\n (onKeyDown)=\"handleKeyDown($event)\"\n [addOnEnter]=\"false\"\n [placeholder]=\"\n (filtersDefinitions().length === 0\n ? '@general:terms.interface.filter.no-filter-definitions'\n : '@general:terms.interface.filter.placeholder'\n )\n | translate\n | async\n \"\n #tagBox\n >\n <ax-suffix class=\"hidden shrink-0 whitespace-nowrap md:flex text-gray-500\">\n <ax-kbd look=\"blank\">\n <ax-kbd-item [keys]=\"filterFocusShortcutKeys\"></ax-kbd-item>\n </ax-kbd>\n </ax-suffix>\n </ax-tag-box>\n </div>\n\n <ng-template #tagTemplate let-item let-index=\"index\">\n <div\n class=\"inline-flex items-center gap-1.5 hover:bg-darkest cursor-pointer rounded-md px-3 py-1 text-sm surface\"\n [class.!bg-primary]=\"item.field === 'all'\"\n [class.!text-white]=\"item.field === 'all'\"\n (click)=\"handleTagClick(item, $event)\"\n >\n <span>{{ item.query }}</span>\n @if (!item.readOnly) {\n <button (click)=\"handleRemoveTag($event, index)\" type=\"button\">\n <ax-icon class=\"ax-icon ax-icon-close\"></ax-icon>\n </button>\n }\n </div>\n </ng-template>\n</div>\n\n<ax-popover\n [offsetY]=\"activeFilter() ? -30 : 0\"\n [openOn]=\"'toggle'\"\n (onOpened)=\"onPopoverOpened($event)\"\n [closeOn]=\"'clickOut'\"\n (onClosed)=\"handlePopoverClosed($event)\"\n [adaptivityEnabled]=\"true\"\n #popover\n>\n <div\n class=\"md:min-w-72 w-full rounded-md md:max-h-96 lg:w-[450px] md:overflow-auto\"\n >\n <axp-widgets-container\n [context]=\"context()\"\n (onContextChanged)=\"onContextChanged($event)\"\n >\n @if (activeFilter()) {\n <div\n class=\"flex flex-col lightest-surface shadow-md\"\n (keydown.enter)=\"onEnterKeyPressed($event)\"\n >\n <ax-header class=\"border-b border-border-light px-4 py-2 font-semibold\">{{\n activeFilter()?.title! | translate | async\n }}</ax-header>\n <ax-content class=\"p-4\">\n <div class=\"mb-2\">\n <ax-badge\n [text]=\"\n (getActiveOperator(activeFilter())! | translate | async) || ''\n \"\n ></ax-badge>\n </div>\n <ng-container\n #widgetRenderer=\"widgetRenderer\"\n axp-widget-renderer\n [node]=\"{\n type: activeFilter()?.widget?.type || 'text-editor',\n path: resolveFilterContextField(activeFilter()!),\n options: activeFilter()?.widget?.options,\n }\"\n [mode]=\"'edit'\"\n >\n </ng-container>\n </ax-content>\n <ax-footer\n class=\"border-t flex justify-end border-border-light w-full px-4 py-2\"\n >\n <ax-button\n class=\"ax-sm\"\n [text]=\"'@general:actions.apply.title' | translate | async\"\n (onClick)=\"handleApplyFilter()\"\n ></ax-button>\n </ax-footer>\n </div>\n } @else {\n <div\n axListNavigation\n #list=\"axListNavigation\"\n class=\"axp-list-items border-none\"\n >\n <!-- @if (tagBox.inputValue()) {\n @for (inlineFilter of inlineFilters(); track inlineFilter.field) {\n <div\n axListNavigationItem\n #caseItem=\"axListNavigationItem\"\n [class.axp-state-focused]=\"caseItem.isActive()\"\n tabindex=\"0\"\n (click)=\"handleSelectInlineFilter(inlineFilter)\"\n (keydown)=\"handleInlineFilterKeyDown($event, inlineFilter)\"\n >\n {{ inlineFilter.title | translate | async }} {{ getActiveOperator(inlineFilter) }} '{{\n tagBox.inputValue()\n }}'\n </div>\n }\n <span class=\"w-full border-t border-light my-1\"></span>\n } -->\n @for (field of filterFields(); track field.field) {\n <div\n axListNavigationItem\n #caseItem=\"axListNavigationItem\"\n [class.axp-state-focused]=\"\n caseItem.isActive() && !isFilterDisabled(field)\n \"\n [class.axp-query-filters__advance-item--disabled]=\"\n isFilterDisabled(field)\n \"\n [attr.aria-disabled]=\"isFilterDisabled(field) ? 'true' : null\"\n [attr.tabindex]=\"isFilterDisabled(field) ? -1 : 0\"\n (click)=\"handleSelectField(field)\"\n (keydown)=\"handleFieldKeyDown($event, field)\"\n >\n <div class=\"flex items-end gap-2\">\n <ax-icon class=\"w-5\" [class]=\"'fa-light ' + field.icon\">\n </ax-icon>\n {{ field.title | translate | async }}\n </div>\n </div>\n }\n </div>\n }\n </axp-widgets-container>\n </div>\n</ax-popover>\n", styles: ["@layer properties;axp-query-filters{width:100%;min-width:0}axp-query-filters>.flex>.min-w-0.flex-1{min-width:0}axp-query-filters ax-tag-box{width:100%;min-width:0}axp-query-filters ax-tag-box .editor-container{background-color:transparent}axp-query-filters ax-tag-box ax-suffix{flex-shrink:0;white-space:nowrap}.axp-list-items{display:flex;min-width:calc(var(--spacing, .25rem) * 40);flex-direction:column;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-block:calc(var(--spacing, .25rem) * 4);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-list-items>div{min-width:calc(var(--spacing, .25rem) * 28);cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);text-align:start}.axp-list-items>div:focus{outline:none}.axp-list-items>div.axp-state-focused,.axp-list-items>div:hover{background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface)}.axp-list-items>div.axp-query-filters__advance-item--disabled{cursor:not-allowed;opacity:50%}.axp-list-items>div.axp-query-filters__advance-item--disabled.axp-state-focused,.axp-list-items>div.axp-query-filters__advance-item--disabled:hover{background-color:transparent}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
4610
4691
  }], ctorParameters: () => [], propDecorators: { filtersDefinitions: [{ type: i0.Input, args: [{ isSignal: true, alias: "filtersDefinitions", required: false }] }], initialFilters: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialFilters", required: false }] }], quickSearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "quickSearch", required: false }] }], onFiltersChanged: [{ type: i0.Output, args: ["onFiltersChanged"] }], tagBox: [{ type: i0.ViewChild, args: ['tagBox', { isSignal: true }] }], widgetRenderer: [{ type: i0.ViewChild, args: ['widgetRenderer', { isSignal: true }] }], listItems: [{
4611
4692
  type: ViewChildren,
4612
4693
  args: ['caseItem']
@@ -4689,7 +4770,7 @@ class AXPPreloadFiltersComponent {
4689
4770
  return Array.isArray(validations) && validations.some((v) => v['rule'] === 'required');
4690
4771
  }
4691
4772
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPPreloadFiltersComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
4692
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPPreloadFiltersComponent, isStandalone: true, selector: "axp-preload-filters", inputs: { filterDefinitions: { classPropertyName: "filterDefinitions", publicName: "filterDefinitions", isSignal: true, isRequired: true, transformFunction: null }, showAllButton: { classPropertyName: "showAllButton", publicName: "showAllButton", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { apply: "apply", showAll: "showAll" }, ngImport: i0, template: "<div class=\"flex flex-col gap-4 items-center justify-center h-full\">\n <div class=\"card min-w-96 flex flex-col items-center gap-2 p-6\">\n <div class=\"header\">\n <img\n width=\"180\"\n src=\"/assets/images/general/filter.svg\"\n [attr.alt]=\"('@general:messages.preload-filters.filter-icon-alt' | translate | async) ?? ''\"\n />\n </div>\n <div class=\"py-6\">\n <div class=\"mb-6\">\n <h4 class=\"text-lg font-medium\">\n {{ '@general:messages.preload-filters.title' | translate | async }}\n </h4>\n <span class=\"text-sm text-gray-400\">\n {{ '@general:messages.preload-filters.description' | translate | async }}\n </span>\n </div>\n <axp-widgets-container [context]=\"context\" (onContextChanged)=\"onContextChanged($event)\">\n <ax-form #form (keydown)=\"onFormKeyDown($event, form)\">\n @for (filterDef of filterDefinitions(); track $index) {\n <ax-form-field class=\"mt-2\">\n <ax-label [required]=\"isFieldRequired(filterDef)\">\n {{ filterDef?.title ?? '' | translate | async }}\n </ax-label>\n <ng-container\n #widgetRenderer=\"widgetRenderer\"\n axp-widget-renderer\n [node]=\"{\n type: filterDef?.widget?.type || 'text-editor',\n path: filterDef?.field,\n options: filterDef?.widget?.options,\n }\"\n [mode]=\"'edit'\"\n >\n </ng-container>\n </ax-form-field>\n }\n <div class=\"mt-6\">\n <ax-button\n [text]=\"'@general:actions.apply.title' | translate | async\"\n (onClick)=\"handleApply(form)\"\n [color]=\"'primary'\"\n class=\"w-full\"\n ></ax-button>\n @if (showAllButton()) {\n <ax-button\n class=\"w-full mt-4 text-primary\"\n [look]=\"'blank'\"\n [text]=\"'@general:actions.show.all.title' | translate | async\"\n (onClick)=\"handleShowAll($event)\"\n ></ax-button>\n }\n </div>\n </ax-form>\n </axp-widgets-container>\n </div>\n </div>\n</div>\n", styles: ["/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { 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", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type: i2$4.AXFormFieldComponent, selector: "ax-form-field", inputs: ["labelMode"] }, { kind: "component", type: i2$4.AXFormComponent, selector: "ax-form", inputs: ["disabled", "readonly", "labelMode", "look", "messageStyle", "updateOn", "inUserInteractionActive"], outputs: ["onValidate", "updateOnChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i1$4.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4773
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPPreloadFiltersComponent, isStandalone: true, selector: "axp-preload-filters", inputs: { filterDefinitions: { classPropertyName: "filterDefinitions", publicName: "filterDefinitions", isSignal: true, isRequired: true, transformFunction: null }, showAllButton: { classPropertyName: "showAllButton", publicName: "showAllButton", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { apply: "apply", showAll: "showAll" }, ngImport: i0, template: "<div class=\"flex flex-col gap-4 items-center justify-center h-full\">\n <div class=\"card min-w-96 flex flex-col items-center gap-2 p-6\">\n <div class=\"header\">\n <img\n width=\"180\"\n src=\"/assets/images/general/filter.svg\"\n [attr.alt]=\"('@general:messages.preload-filters.filter-icon-alt' | translate | async) ?? ''\"\n />\n </div>\n <div class=\"py-6\">\n <div class=\"mb-6\">\n <h4 class=\"text-lg font-medium\">\n {{ '@general:messages.preload-filters.title' | translate | async }}\n </h4>\n <span class=\"text-sm text-gray-400\">\n {{ '@general:messages.preload-filters.description' | translate | async }}\n </span>\n </div>\n <axp-widgets-container [context]=\"context\" (onContextChanged)=\"onContextChanged($event)\">\n <ax-form #form (keydown)=\"onFormKeyDown($event, form)\">\n @for (filterDef of filterDefinitions(); track $index) {\n <ax-form-field class=\"mt-2\">\n <ax-label [required]=\"isFieldRequired(filterDef)\">\n {{ filterDef?.title ?? '' | translate | async }}\n </ax-label>\n <ng-container\n #widgetRenderer=\"widgetRenderer\"\n axp-widget-renderer\n [node]=\"{\n type: filterDef?.widget?.type || 'text-editor',\n path: filterDef?.field,\n options: filterDef?.widget?.options,\n }\"\n [mode]=\"'edit'\"\n >\n </ng-container>\n </ax-form-field>\n }\n <div class=\"mt-6\">\n <ax-button\n [text]=\"'@general:actions.apply.title' | translate | async\"\n (onClick)=\"handleApply(form)\"\n [color]=\"'primary'\"\n class=\"w-full\"\n ></ax-button>\n @if (showAllButton()) {\n <ax-button\n class=\"w-full mt-4 text-primary\"\n [look]=\"'blank'\"\n [text]=\"'@general:actions.show.all.title' | translate | async\"\n (onClick)=\"handleShowAll($event)\"\n ></ax-button>\n }\n </div>\n </ax-form>\n </axp-widgets-container>\n </div>\n </div>\n</div>\n", styles: ["/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { 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", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type: i2$5.AXFormFieldComponent, selector: "ax-form-field", inputs: ["labelMode"] }, { kind: "component", type: i2$5.AXFormComponent, selector: "ax-form", inputs: ["disabled", "readonly", "labelMode", "look", "messageStyle", "updateOn", "inUserInteractionActive"], outputs: ["onValidate", "updateOnChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i1$5.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4693
4774
  }
4694
4775
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPPreloadFiltersComponent, decorators: [{
4695
4776
  type: Component,
@@ -4819,7 +4900,7 @@ class AXPImageEditorPopupComponent extends AXBasePageComponent {
4819
4900
  </ax-button>
4820
4901
  </ax-suffix>
4821
4902
  </ax-footer>
4822
- `, isInline: true, styles: ["ax-image-editor-view>canvas{max-height:65vh;width:auto!important;height:auto!important}axp-image-editor-popup ax-image-editor-container{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXImageEditorModule }, { kind: "component", type: i1$6.AXImageEditorViewComponent, selector: "ax-image-editor-view", inputs: ["showGrid", "cropperSize", "src"] }, { kind: "component", type: i1$6.AXImageEditorContainerComponent, selector: "ax-image-editor-container", inputs: ["look", "disabled"], outputs: ["onValueChanged"] }, { kind: "component", type: i1$6.AXImageEditorCropComponent, selector: "ax-image-editor-crop", inputs: ["aspectRatio", "size"] }, { kind: "component", type: i1$6.AXImageEditorToolsBarComponent, selector: "ax-image-editor-tools-bar", inputs: ["active", "hidden"] }, { kind: "ngmodule", type: AXToolBarModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.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: AXButtonModule }, { kind: "component", type: i1$2.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: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
4903
+ `, isInline: true, styles: ["ax-image-editor-view>canvas{max-height:65vh;width:auto!important;height:auto!important}axp-image-editor-popup ax-image-editor-container{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXImageEditorModule }, { kind: "component", type: i1$7.AXImageEditorViewComponent, selector: "ax-image-editor-view", inputs: ["showGrid", "cropperSize", "src"] }, { kind: "component", type: i1$7.AXImageEditorContainerComponent, selector: "ax-image-editor-container", inputs: ["look", "disabled"], outputs: ["onValueChanged"] }, { kind: "component", type: i1$7.AXImageEditorCropComponent, selector: "ax-image-editor-crop", inputs: ["aspectRatio", "size"] }, { kind: "component", type: i1$7.AXImageEditorToolsBarComponent, selector: "ax-image-editor-tools-bar", inputs: ["active", "hidden"] }, { kind: "ngmodule", type: AXToolBarModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.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: AXButtonModule }, { kind: "component", type: i1$2.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: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
4823
4904
  }
4824
4905
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPImageEditorPopupComponent, decorators: [{
4825
4906
  type: Component,
@@ -4902,499 +4983,95 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
4902
4983
  args: [{ providedIn: 'root' }]
4903
4984
  }] });
4904
4985
 
4905
- const AXP_USER_AVATAR_PROVIDER = new InjectionToken('AXP_USER_AVATAR_PROVIDER');
4986
+ //#region ---- Signature editor types ----
4987
+ //#endregion
4906
4988
 
4907
- class AXPUserAvatarService {
4989
+ //#region ---- Constants ----
4990
+ const SIGNATURE_WIDGET_NAME = 'signature';
4991
+ //#endregion
4992
+ //#region ---- Signature editor service ----
4993
+ /**
4994
+ * Opens the shared signature capture dialog (paint pad, Clear, and Save/Apply).
4995
+ * Clear resets the canvas; the primary action persists the current pad (empty removes the signature).
4996
+ */
4997
+ class AXPSignatureEditorService {
4908
4998
  constructor() {
4909
- this.provider = inject(AXP_USER_AVATAR_PROVIDER, { optional: true });
4910
- // Cache configuration
4911
- this.cacheExpiryTime = 5 * 60 * 1000; // 5 minutes in milliseconds
4912
- this.refreshInterval = 3 * 60 * 1000; // 3 minutes in milliseconds
4913
- // Cache storage
4914
- this.cache = new Map();
4999
+ //#region ---- Services & Dependencies ----
5000
+ this.layoutBuilder = inject(AXPLayoutBuilderService);
4915
5001
  }
4916
- /**
4917
- * Gets user information with caching and auto-refresh
4918
- * @param userId The username to fetch information for
4919
- * @returns Observable that emits user avatar data
4920
- */
4921
- getUserInfo$(userId) {
4922
- // Check if we have a cached entry
4923
- if (!this.cache.has(userId) || this.isExpired(userId)) {
4924
- // Create a new cache entry with default values
4925
- const defaultData = {
4926
- id: userId,
4927
- status: 'offline',
4928
- username: '',
4929
- firstName: '',
4930
- lastName: ''
4931
- };
4932
- const subject = new BehaviorSubject(defaultData);
4933
- this.cache.set(userId, {
4934
- data: defaultData,
4935
- timestamp: Date.now(),
4936
- subject
5002
+ //#endregion
5003
+ //#region ---- Public API ----
5004
+ async open(options = {}) {
5005
+ const initialValue = options.value ?? null;
5006
+ const disabled = options.disabled ?? false;
5007
+ const ref = await this.layoutBuilder
5008
+ .create()
5009
+ .dialog((dialog) => {
5010
+ dialog
5011
+ .setTitle(options.title ?? '@platform-layout-widgets:widgets.signature.title')
5012
+ .setSize('sm')
5013
+ .setCloseButton(true)
5014
+ .setContext({ value: initialValue })
5015
+ .content((content) => {
5016
+ content
5017
+ .setDirection('column')
5018
+ .setGap('16px')
5019
+ .setAlignItems('stretch')
5020
+ .customWidget(SIGNATURE_WIDGET_NAME, {
5021
+ name: SIGNATURE_WIDGET_NAME,
5022
+ path: 'value',
5023
+ disabled,
5024
+ showOverlay: false,
5025
+ editMode: true,
5026
+ });
5027
+ })
5028
+ .setActions((actions) => {
5029
+ actions.cancel('@general:actions.cancel.title');
5030
+ actions.custom({
5031
+ title: '@general:actions.clear.title',
5032
+ icon: 'fa-light fa-eraser',
5033
+ disabled: '{{ !context.value }}',
5034
+ command: { name: 'widget:signature.clear' },
5035
+ position: 'prefix',
5036
+ });
5037
+ actions.submit(options.submitActionKey ?? '@general:actions.apply.title');
4937
5038
  });
4938
- // Fetch fresh data immediately
4939
- this.fetchAndUpdateCache(userId);
4940
- // Set up auto refresh
4941
- timer(this.refreshInterval, this.refreshInterval)
4942
- .pipe(tap(() => this.fetchAndUpdateCache(userId)))
4943
- .subscribe();
4944
- }
4945
- return this.cache.get(userId).subject.asObservable();
4946
- }
4947
- /**
4948
- * Gets user information (Promise-based for backward compatibility)
4949
- * @param userId The username to fetch information for
4950
- * @returns Promise that resolves to user avatar data
4951
- */
4952
- async getUserInfo(userId) {
4953
- // Check if we have an unexpired cached entry
4954
- if (this.cache.has(userId) && !this.isExpired(userId)) {
4955
- return this.cache.get(userId).data;
5039
+ })
5040
+ .show();
5041
+ const action = this.resolveAction(ref.action());
5042
+ const context = ref.context() ?? {};
5043
+ if (action === 'apply') {
5044
+ const newValue = context.value;
5045
+ const value = this.resolveAppliedValue(newValue, initialValue);
5046
+ ref.close();
5047
+ return { action: 'apply', value };
4956
5048
  }
4957
- // Fetch fresh data and cache it
4958
- return this.fetchAndUpdateCache(userId);
5049
+ ref.close();
5050
+ return { action: 'cancel', value: initialValue };
4959
5051
  }
4960
- /**
4961
- * Clears cached data while keeping live subscribers attached to their subjects.
4962
- */
4963
- clearCache(userId) {
4964
- if (userId) {
4965
- const entry = this.cache.get(userId);
4966
- if (entry) {
4967
- entry.timestamp = 0;
4968
- }
4969
- return;
4970
- }
4971
- for (const entry of this.cache.values()) {
4972
- entry.timestamp = 0;
5052
+ //#endregion
5053
+ //#region ---- Utility Methods ----
5054
+ resolveAction(action) {
5055
+ if (action === 'submit' || action === 'signature-apply') {
5056
+ return 'apply';
4973
5057
  }
5058
+ return 'cancel';
4974
5059
  }
4975
- /**
4976
- * Force refresh data for a specific username
4977
- * @param userId The username to refresh
4978
- * @returns Promise that resolves to the refreshed data
4979
- */
4980
- async refreshUserInfo(userId) {
4981
- return this.fetchAndUpdateCache(userId);
4982
- }
4983
- /**
4984
- * Checks if a cache entry is expired
4985
- */
4986
- isExpired(userId) {
4987
- const entry = this.cache.get(userId);
4988
- if (!entry)
4989
- return true;
4990
- return (Date.now() - entry.timestamp) > this.cacheExpiryTime;
4991
- }
4992
- /**
4993
- * Fetches data from provider and updates the cache
4994
- */
4995
- async fetchAndUpdateCache(userId) {
4996
- try {
4997
- const data = await this.provider?.provide(userId);
4998
- if (!data) {
4999
- throw new Error(`User info not found for ${userId}`);
5000
- }
5001
- const entry = this.cache.get(userId);
5002
- // Update the cache entry
5003
- if (entry) {
5004
- entry.data = data;
5005
- entry.timestamp = Date.now();
5006
- entry.subject.next(data);
5007
- }
5008
- else {
5009
- // Create a new cache entry if needed
5010
- const subject = new BehaviorSubject(data);
5011
- this.cache.set(userId, {
5012
- data,
5013
- timestamp: Date.now(),
5014
- subject
5015
- });
5016
- }
5017
- return data;
5060
+ resolveAppliedValue(newValue, initialValue) {
5061
+ if (newValue === null || newValue === '') {
5062
+ return null;
5018
5063
  }
5019
- catch (error) {
5020
- console.error(`Error fetching user info for ${userId}:`, error);
5021
- throw error;
5064
+ if (isString(newValue)) {
5065
+ return newValue;
5022
5066
  }
5067
+ return initialValue;
5023
5068
  }
5024
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPUserAvatarService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
5025
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPUserAvatarService, providedIn: 'root' }); }
5069
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSignatureEditorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
5070
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSignatureEditorService, providedIn: 'root' }); }
5026
5071
  }
5027
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPUserAvatarService, decorators: [{
5072
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSignatureEditorService, decorators: [{
5028
5073
  type: Injectable,
5029
- args: [{
5030
- providedIn: 'root',
5031
- }]
5032
- }] });
5033
-
5034
- class AXPUserAvatarComponent {
5035
- constructor() {
5036
- this.userAvatarService = inject(AXPUserAvatarService);
5037
- this.sessionService = inject(AXPSessionService);
5038
- this.fileStorage = inject(AXPFileStorageService);
5039
- this.blobObjectUrl = null;
5040
- this.resolveGeneration = 0;
5041
- this.userInfo = signal(null, ...(ngDevMode ? [{ debugName: "userInfo" }] : /* istanbul ignore next */ []));
5042
- this.size = input(40, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
5043
- this.userId = input('', ...(ngDevMode ? [{ debugName: "userId" }] : /* istanbul ignore next */ []));
5044
- this.src = signal('', ...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
5045
- this.userName = computed(() => this.userInfo()?.username || '', ...(ngDevMode ? [{ debugName: "userName" }] : /* istanbul ignore next */ []));
5046
- this.firstName = computed(() => this.userInfo()?.firstName?.trim() || '', ...(ngDevMode ? [{ debugName: "firstName" }] : /* istanbul ignore next */ []));
5047
- this.lastName = computed(() => this.userInfo()?.lastName?.trim() || '', ...(ngDevMode ? [{ debugName: "lastName" }] : /* istanbul ignore next */ []));
5048
- this.title = computed(() => this.resolveDisplayName(this.userInfo()), ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
5049
- this.isOnline = computed(() => this.userInfo()?.status === 'online', ...(ngDevMode ? [{ debugName: "isOnline" }] : /* istanbul ignore next */ []));
5050
- effect((onCleanup) => {
5051
- const id = this.userId();
5052
- if (!id) {
5053
- this.userInfo.set(null);
5054
- this.src.set('');
5055
- return;
5056
- }
5057
- const subscriptions = [
5058
- this.userAvatarService.getUserInfo$(id).subscribe((userData) => {
5059
- this.userInfo.set(userData);
5060
- void this.resolveAvatarSrc(userData, id);
5061
- }),
5062
- this.sessionService.user$.subscribe(() => {
5063
- void this.resolveAvatarSrc(this.userInfo(), id);
5064
- }),
5065
- ];
5066
- onCleanup(() => subscriptions.forEach((subscription) => subscription.unsubscribe()));
5067
- });
5068
- }
5069
- async resolveAvatarSrc(info, userId) {
5070
- const generation = ++this.resolveGeneration;
5071
- const sessionUser = this.sessionService.user;
5072
- let avatarUrl = sessionUser?.id === userId ? normalizeStoredImageRef(sessionUser.avatar) : null;
5073
- if (!avatarUrl) {
5074
- avatarUrl = normalizeStoredImageRef(info?.avatarUrl);
5075
- }
5076
- if (!avatarUrl) {
5077
- this.revokeBlobUrl();
5078
- this.src.set('');
5079
- return;
5080
- }
5081
- if (!isStoredImageFileId(avatarUrl)) {
5082
- if (generation !== this.resolveGeneration) {
5083
- return;
5084
- }
5085
- this.revokeBlobUrl();
5086
- this.src.set(avatarUrl);
5087
- return;
5088
- }
5089
- try {
5090
- const displayUrl = await resolveStoredImageDisplayUrl(avatarUrl, (fileId) => this.fileStorage.download(fileId));
5091
- if (generation !== this.resolveGeneration) {
5092
- if (displayUrl.startsWith('blob:')) {
5093
- URL.revokeObjectURL(displayUrl);
5094
- }
5095
- return;
5096
- }
5097
- this.revokeBlobUrl();
5098
- if (displayUrl.startsWith('blob:')) {
5099
- this.blobObjectUrl = displayUrl;
5100
- }
5101
- this.src.set(displayUrl);
5102
- }
5103
- catch {
5104
- if (generation !== this.resolveGeneration) {
5105
- return;
5106
- }
5107
- this.revokeBlobUrl();
5108
- this.src.set('');
5109
- }
5110
- }
5111
- revokeBlobUrl() {
5112
- if (this.blobObjectUrl) {
5113
- URL.revokeObjectURL(this.blobObjectUrl);
5114
- this.blobObjectUrl = null;
5115
- }
5116
- }
5117
- resolveDisplayName(info) {
5118
- if (!info) {
5119
- return '';
5120
- }
5121
- const parts = [info.firstName, info.lastName].map((part) => part?.trim()).filter(Boolean);
5122
- if (parts.length > 0) {
5123
- return parts.join(' ');
5124
- }
5125
- return info.username.trim();
5126
- }
5127
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPUserAvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5128
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", 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: "<div\n class=\"axp-user-avatar\"\n [class.axp-user-avatar--has-image]=\"!!src()\"\n [style.width.px]=\"size()\"\n [style.height.px]=\"size()\"\n>\n @if (src()) {\n <img\n class=\"axp-user-avatar__image\"\n [src]=\"src()\"\n [attr.alt]=\"title()\"\n [attr.title]=\"title()\"\n />\n } @else {\n <axp-avatar [size]=\"size()\" [fullName]=\"title()\" />\n }\n</div>\n", styles: [".axp-user-avatar{position:relative;display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:calc(infinity * 1px)}.axp-user-avatar--has-image{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-user-avatar__image{display:block;width:100%;height:100%;object-fit:cover;object-position:center}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "component", type: AXPAvatarComponent, selector: "axp-avatar", inputs: ["size", "src", "fullName", "fallbackText", "placeholder"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
5129
- }
5130
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPUserAvatarComponent, decorators: [{
5131
- type: Component,
5132
- args: [{ selector: 'axp-user-avatar', imports: [AXPAvatarComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [], template: "<div\n class=\"axp-user-avatar\"\n [class.axp-user-avatar--has-image]=\"!!src()\"\n [style.width.px]=\"size()\"\n [style.height.px]=\"size()\"\n>\n @if (src()) {\n <img\n class=\"axp-user-avatar__image\"\n [src]=\"src()\"\n [attr.alt]=\"title()\"\n [attr.title]=\"title()\"\n />\n } @else {\n <axp-avatar [size]=\"size()\" [fullName]=\"title()\" />\n }\n</div>\n", styles: [".axp-user-avatar{position:relative;display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:calc(infinity * 1px)}.axp-user-avatar--has-image{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-user-avatar__image{display:block;width:100%;height:100%;object-fit:cover;object-position:center}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
5133
- }], ctorParameters: () => [], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], userId: [{ type: i0.Input, args: [{ isSignal: true, alias: "userId", required: false }] }] } });
5134
-
5135
- //#region ---- Shared in-app inbox row item ----
5136
- class AXPInAppInboxItemComponent {
5137
- constructor() {
5138
- this.data = input.required(...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
5139
- this.showAvatar = input(true, ...(ngDevMode ? [{ debugName: "showAvatar" }] : /* istanbul ignore next */ []));
5140
- this.showDate = input(true, ...(ngDevMode ? [{ debugName: "showDate" }] : /* istanbul ignore next */ []));
5141
- this.showPin = input(false, ...(ngDevMode ? [{ debugName: "showPin" }] : /* istanbul ignore next */ []));
5142
- this.pinLabelKey = input('@general:actions.pin.title', ...(ngDevMode ? [{ debugName: "pinLabelKey" }] : /* istanbul ignore next */ []));
5143
- this.unpinLabelKey = input('@general:actions.unpin.title', ...(ngDevMode ? [{ debugName: "unpinLabelKey" }] : /* istanbul ignore next */ []));
5144
- this.priorityClass = computed(() => getInAppInboxPriorityClass(this.data().priority), ...(ngDevMode ? [{ debugName: "priorityClass" }] : /* istanbul ignore next */ []));
5145
- this.isUnread = computed(() => isInAppInboxUnread(this.data().readAt), ...(ngDevMode ? [{ debugName: "isUnread" }] : /* istanbul ignore next */ []));
5146
- this.itemPress = output();
5147
- this.togglePin = output();
5148
- this.closePopover = output();
5149
- }
5150
- onPress(id) {
5151
- this.itemPress.emit(id);
5152
- this.closePopover.emit();
5153
- }
5154
- onTogglePin(event) {
5155
- event.preventDefault();
5156
- event.stopPropagation();
5157
- this.togglePin.emit(this.data().id);
5158
- }
5159
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPInAppInboxItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5160
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPInAppInboxItemComponent, isStandalone: true, selector: "axp-in-app-inbox-item", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, showAvatar: { classPropertyName: "showAvatar", publicName: "showAvatar", isSignal: true, isRequired: false, transformFunction: null }, showDate: { classPropertyName: "showDate", publicName: "showDate", isSignal: true, isRequired: false, transformFunction: null }, showPin: { classPropertyName: "showPin", publicName: "showPin", isSignal: true, isRequired: false, transformFunction: null }, pinLabelKey: { classPropertyName: "pinLabelKey", publicName: "pinLabelKey", isSignal: true, isRequired: false, transformFunction: null }, unpinLabelKey: { classPropertyName: "unpinLabelKey", publicName: "unpinLabelKey", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemPress: "itemPress", togglePin: "togglePin", closePopover: "closePopover" }, ngImport: i0, template: "<div\n class=\"axp-in-app-inbox-item\"\n [id]=\"data().id\"\n (click)=\"onPress(data().id)\"\n [class]=\"[priorityClass(), isUnread() ? 'unread' : 'read']\"\n>\n @if (showAvatar()) {\n <div class=\"axp-in-app-inbox-item__avatar\">\n <axp-user-avatar [size]=\"48\" [userId]=\"data().sender?.id ?? 'system'\"></axp-user-avatar>\n @if (isUnread()) {\n <div class=\"axp-in-app-inbox-item__unread-badge\"></div>\n }\n </div>\n }\n\n <div class=\"axp-in-app-inbox-item__content\">\n <div class=\"axp-in-app-inbox-item__header\">\n <div class=\"axp-in-app-inbox-item__title\" [class.--unread]=\"isUnread()\">\n {{ data().sender?.fullName || data().title }}\n </div>\n <div class=\"axp-in-app-inbox-item__meta\">\n @if (showPin()) {\n @if (data().isPinned) {\n <button\n type=\"button\"\n class=\"axp-in-app-inbox-item__pin\"\n [attr.aria-label]=\"unpinLabelKey() | translate | async\"\n (click)=\"onTogglePin($event)\"\n >\n <ax-icon><i class=\"fa-solid fa-thumbtack\"></i></ax-icon>\n </button>\n } @else {\n <button\n type=\"button\"\n class=\"axp-in-app-inbox-item__pin axp-in-app-inbox-item__pin--muted\"\n [attr.aria-label]=\"pinLabelKey() | translate | async\"\n (click)=\"onTogglePin($event)\"\n >\n <ax-icon><i class=\"fa-regular fa-thumbtack\"></i></ax-icon>\n </button>\n }\n }\n @if (showDate()) {\n <div class=\"axp-in-app-inbox-item__time\">{{ data().createdAt | format: 'timeleft' | async }}</div>\n }\n </div>\n </div>\n <div class=\"axp-in-app-inbox-item__body\">{{ data().body }}</div>\n </div>\n</div>\n", styles: ["@layer properties;.axp-in-app-inbox-item{position:relative;display:flex;cursor:pointer;gap:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 3);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.axp-in-app-inbox-item.read{background:transparent}.axp-in-app-inbox-item.unread{background:rgb(var(--ax-sys-color-lighter-surface))}@media(hover:hover){.axp-in-app-inbox-item:hover .axp-in-app-inbox-item__pin--muted{visibility:visible;pointer-events:auto}}:is(.axp-in-app-inbox-item.Notice,.axp-in-app-inbox-item.Danger,.axp-in-app-inbox-item.Warning):before{content:\"\";position:absolute;inset-block:calc(var(--spacing, .25rem) * 3);inset-inline-start:calc(var(--spacing, .25rem) * 0);width:calc(var(--spacing, .25rem) * .5);border-radius:calc(infinity * 1px)}.axp-in-app-inbox-item.Notice:before{background:rgb(var(--ax-sys-color-success-500))}.axp-in-app-inbox-item.Danger:before{background:rgb(var(--ax-sys-color-danger-500))}.axp-in-app-inbox-item.Warning:before{background:rgb(var(--ax-sys-color-warning-500))}.axp-in-app-inbox-item__avatar{position:relative;height:calc(var(--spacing, .25rem) * 12);flex-shrink:0}.axp-in-app-inbox-item__unread-badge{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 0);bottom:0;width:10px;height:10px;background:rgb(var(--ax-sys-color-primary-500));border:2px solid rgb(var(--ax-sys-color-surface));border-radius:50%}.axp-in-app-inbox-item__content{min-width:0;flex:1}.axp-in-app-inbox-item__header{display:flex;align-items:flex-start;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3)}.axp-in-app-inbox-item__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgb(var(--ax-sys-color-on-surface))}.axp-in-app-inbox-item__title.--unread{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-in-app-inbox-item__meta{display:flex;flex-shrink:0;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5)}.axp-in-app-inbox-item__time{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));white-space:nowrap;color:rgb(var(--ax-sys-color-on-surface-variant))}.axp-in-app-inbox-item__body{margin-top:calc(var(--spacing, .25rem) * .5);overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;text-align:start;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgb(var(--ax-sys-color-on-surface-variant))}.axp-in-app-inbox-item__pin{display:inline-flex;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * .5);color:rgb(var(--ax-sys-color-primary))}.axp-in-app-inbox-item__pin i{rotate:45deg;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-in-app-inbox-item__pin--muted{color:rgb(var(--ax-sys-color-on-surface-variant))}@media(hover:hover){.axp-in-app-inbox-item__pin--muted{visibility:hidden;pointer-events:none}}.axp-in-app-inbox-item__pin--muted:focus-visible{visibility:visible;pointer-events:auto}.axp-in-app-inbox-item__pin--muted:hover{color:rgb(var(--ax-sys-color-primary))}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-duration: initial;--tw-font-weight: initial;--tw-border-style: solid}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXPUserAvatarComponent, selector: "axp-user-avatar", inputs: ["size", "userId"] }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "ngmodule", type: AXFormatModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.AXFormatPipe, name: "format" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
5161
- }
5162
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPInAppInboxItemComponent, decorators: [{
5163
- type: Component,
5164
- args: [{ selector: 'axp-in-app-inbox-item', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
5165
- CommonModule,
5166
- AXButtonModule,
5167
- AXDecoratorModule,
5168
- AXPUserAvatarComponent,
5169
- AXBadgeModule,
5170
- AXFormatModule,
5171
- AXTranslationModule,
5172
- ], template: "<div\n class=\"axp-in-app-inbox-item\"\n [id]=\"data().id\"\n (click)=\"onPress(data().id)\"\n [class]=\"[priorityClass(), isUnread() ? 'unread' : 'read']\"\n>\n @if (showAvatar()) {\n <div class=\"axp-in-app-inbox-item__avatar\">\n <axp-user-avatar [size]=\"48\" [userId]=\"data().sender?.id ?? 'system'\"></axp-user-avatar>\n @if (isUnread()) {\n <div class=\"axp-in-app-inbox-item__unread-badge\"></div>\n }\n </div>\n }\n\n <div class=\"axp-in-app-inbox-item__content\">\n <div class=\"axp-in-app-inbox-item__header\">\n <div class=\"axp-in-app-inbox-item__title\" [class.--unread]=\"isUnread()\">\n {{ data().sender?.fullName || data().title }}\n </div>\n <div class=\"axp-in-app-inbox-item__meta\">\n @if (showPin()) {\n @if (data().isPinned) {\n <button\n type=\"button\"\n class=\"axp-in-app-inbox-item__pin\"\n [attr.aria-label]=\"unpinLabelKey() | translate | async\"\n (click)=\"onTogglePin($event)\"\n >\n <ax-icon><i class=\"fa-solid fa-thumbtack\"></i></ax-icon>\n </button>\n } @else {\n <button\n type=\"button\"\n class=\"axp-in-app-inbox-item__pin axp-in-app-inbox-item__pin--muted\"\n [attr.aria-label]=\"pinLabelKey() | translate | async\"\n (click)=\"onTogglePin($event)\"\n >\n <ax-icon><i class=\"fa-regular fa-thumbtack\"></i></ax-icon>\n </button>\n }\n }\n @if (showDate()) {\n <div class=\"axp-in-app-inbox-item__time\">{{ data().createdAt | format: 'timeleft' | async }}</div>\n }\n </div>\n </div>\n <div class=\"axp-in-app-inbox-item__body\">{{ data().body }}</div>\n </div>\n</div>\n", styles: ["@layer properties;.axp-in-app-inbox-item{position:relative;display:flex;cursor:pointer;gap:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 3);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.axp-in-app-inbox-item.read{background:transparent}.axp-in-app-inbox-item.unread{background:rgb(var(--ax-sys-color-lighter-surface))}@media(hover:hover){.axp-in-app-inbox-item:hover .axp-in-app-inbox-item__pin--muted{visibility:visible;pointer-events:auto}}:is(.axp-in-app-inbox-item.Notice,.axp-in-app-inbox-item.Danger,.axp-in-app-inbox-item.Warning):before{content:\"\";position:absolute;inset-block:calc(var(--spacing, .25rem) * 3);inset-inline-start:calc(var(--spacing, .25rem) * 0);width:calc(var(--spacing, .25rem) * .5);border-radius:calc(infinity * 1px)}.axp-in-app-inbox-item.Notice:before{background:rgb(var(--ax-sys-color-success-500))}.axp-in-app-inbox-item.Danger:before{background:rgb(var(--ax-sys-color-danger-500))}.axp-in-app-inbox-item.Warning:before{background:rgb(var(--ax-sys-color-warning-500))}.axp-in-app-inbox-item__avatar{position:relative;height:calc(var(--spacing, .25rem) * 12);flex-shrink:0}.axp-in-app-inbox-item__unread-badge{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 0);bottom:0;width:10px;height:10px;background:rgb(var(--ax-sys-color-primary-500));border:2px solid rgb(var(--ax-sys-color-surface));border-radius:50%}.axp-in-app-inbox-item__content{min-width:0;flex:1}.axp-in-app-inbox-item__header{display:flex;align-items:flex-start;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3)}.axp-in-app-inbox-item__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgb(var(--ax-sys-color-on-surface))}.axp-in-app-inbox-item__title.--unread{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-in-app-inbox-item__meta{display:flex;flex-shrink:0;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5)}.axp-in-app-inbox-item__time{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));white-space:nowrap;color:rgb(var(--ax-sys-color-on-surface-variant))}.axp-in-app-inbox-item__body{margin-top:calc(var(--spacing, .25rem) * .5);overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;text-align:start;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgb(var(--ax-sys-color-on-surface-variant))}.axp-in-app-inbox-item__pin{display:inline-flex;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * .5);color:rgb(var(--ax-sys-color-primary))}.axp-in-app-inbox-item__pin i{rotate:45deg;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.axp-in-app-inbox-item__pin--muted{color:rgb(var(--ax-sys-color-on-surface-variant))}@media(hover:hover){.axp-in-app-inbox-item__pin--muted{visibility:hidden;pointer-events:none}}.axp-in-app-inbox-item__pin--muted:focus-visible{visibility:visible;pointer-events:auto}.axp-in-app-inbox-item__pin--muted:hover{color:rgb(var(--ax-sys-color-primary))}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-duration: initial;--tw-font-weight: initial;--tw-border-style: solid}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
5173
- }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }], showAvatar: [{ type: i0.Input, args: [{ isSignal: true, alias: "showAvatar", required: false }] }], showDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "showDate", required: false }] }], showPin: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPin", required: false }] }], pinLabelKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "pinLabelKey", required: false }] }], unpinLabelKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "unpinLabelKey", required: false }] }], itemPress: [{ type: i0.Output, args: ["itemPress"] }], togglePin: [{ type: i0.Output, args: ["togglePin"] }], closePopover: [{ type: i0.Output, args: ["closePopover"] }] } });
5174
-
5175
- class AXPInAppInboxPanelComponent {
5176
- constructor() {
5177
- this.unreadCountChange = output();
5178
- this.closePopover = output();
5179
- this.connector = inject(AXPInAppInboxConnectorService);
5180
- this.toastService = inject(AXToastService);
5181
- this.router = inject(Router);
5182
- this.sessionService = inject(AXPSessionService);
5183
- this.i18n = inject(AXP_IN_APP_INBOX_I18N);
5184
- this.config = inject(AXP_IN_APP_INBOX_CONFIG);
5185
- this.items = this.connector.pagedInboxList;
5186
- this.isLoading = this.connector.pageLoadingState;
5187
- this.activeTab = signal('Unread', ...(ngDevMode ? [{ debugName: "activeTab" }] : /* istanbul ignore next */ []));
5188
- this.tabItems = computed(() => this.buildTabItems(this.items()), ...(ngDevMode ? [{ debugName: "tabItems" }] : /* istanbul ignore next */ []));
5189
- this.showPin = computed(() => this.connector.capabilities.pinSupport, ...(ngDevMode ? [{ debugName: "showPin" }] : /* istanbul ignore next */ []));
5190
- effect(() => {
5191
- const unread = this.tabItems().find((tab) => tab.key === 'Unread')?.count ?? 0;
5192
- this.unreadCountChange.emit(unread);
5193
- });
5194
- }
5195
- async ngOnInit() {
5196
- await this.loadInbox();
5197
- }
5198
- changeActiveTab(tab) {
5199
- this.activeTab.set(tab);
5200
- }
5201
- getItems(tab) {
5202
- const list = this.items();
5203
- if (tab === 'All') {
5204
- return list;
5205
- }
5206
- if (tab === 'Unread') {
5207
- return list.filter((item) => isInAppInboxUnread(item.readAt));
5208
- }
5209
- return list.filter((item) => item.category === tab);
5210
- }
5211
- async loadInbox() {
5212
- try {
5213
- await this.connector.loadPage(0, 1000);
5214
- await this.connector.markUnseenAsSeen();
5215
- }
5216
- catch (error) {
5217
- this.toastService.show({
5218
- content: typeof error === 'string' ? error : 'Failed to load inbox.',
5219
- color: 'danger',
5220
- location: 'bottom-center',
5221
- closeButton: true,
5222
- timeOut: 3000,
5223
- timeOutProgress: true,
5224
- });
5225
- }
5226
- }
5227
- async markAsRead(id) {
5228
- await this.connector.markAsRead([id]);
5229
- }
5230
- async togglePin(id) {
5231
- await this.connector.togglePin(id);
5232
- }
5233
- async markAllAsRead() {
5234
- await this.connector.markAllAsRead();
5235
- }
5236
- viewAll() {
5237
- this.closePopover.emit();
5238
- const app = this.sessionService.application?.name ?? 'demo';
5239
- void this.router.navigate(this.config.viewAllRoute(app));
5240
- }
5241
- openSettings() {
5242
- if (!this.config.settingsRoute) {
5243
- return;
5244
- }
5245
- this.closePopover.emit();
5246
- const app = this.sessionService.application?.name ?? 'demo';
5247
- void this.router.navigate(this.config.settingsRoute(app));
5248
- }
5249
- buildTabItems(items) {
5250
- const unreadTotal = items.filter((item) => isInAppInboxUnread(item.readAt)).length;
5251
- const tabs = [
5252
- { key: 'Unread', labelKey: this.i18n.unread, count: unreadTotal },
5253
- { key: 'All', labelKey: this.i18n.all, count: unreadTotal },
5254
- ];
5255
- if (this.connector.capabilities.categoryTabs) {
5256
- const categories = [...new Set(items.map((item) => item.category).filter(Boolean))];
5257
- for (const category of categories) {
5258
- const count = items.filter((item) => item.category === category && isInAppInboxUnread(item.readAt)).length;
5259
- tabs.push({ key: category, labelKey: category, count });
5260
- }
5261
- }
5262
- return tabs;
5263
- }
5264
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPInAppInboxPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5265
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPInAppInboxPanelComponent, isStandalone: true, selector: "axp-in-app-inbox-panel", outputs: { unreadCountChange: "unreadCountChange", closePopover: "closePopover" }, ngImport: i0, template: "<div class=\"axp-in-app-inbox-panel__header\">\n <span class=\"axp-in-app-inbox-panel__title\">\n {{ i18n.panelTitle | translate | async }}\n </span>\n @if (config.settingsRoute) {\n <ax-button color=\"default\" look=\"blank\" (onClick)=\"openSettings()\">\n <ax-icon><i class=\"fa-regular fa-gear fa-lg\"></i></ax-icon>\n </ax-button>\n }\n</div>\n<ax-tabs [content]=\"tabContent\" look=\"with-line\" location=\"bottom\">\n @for (tab of tabItems(); track tab.key) {\n <ax-tab-item\n [text]=\"(tab.labelKey | translate | async) ?? ''\"\n [active]=\"activeTab() === tab.key\"\n (activeChange)=\"changeActiveTab(tab.key)\"\n >\n <ax-suffix>\n @if (tab.count && tab.key === 'Unread') {\n <ax-badge [color]=\"activeTab() === tab.key ? 'primary' : 'ghost'\" [text]=\"tab.count.toString()\"></ax-badge>\n }\n </ax-suffix>\n <ax-content>\n <div class=\"axp-in-app-inbox-panel__list\">\n @if (isLoading()) {\n <div class=\"axp-in-app-inbox-panel__loading\">\n @for (_ of [1, 2, 3]; track $index) {\n <div class=\"axp-in-app-inbox-panel__skeleton\">\n <div class=\"axp-in-app-inbox-panel__skeleton-avatar\"></div>\n <div class=\"axp-in-app-inbox-panel__skeleton-lines\">\n <div class=\"axp-in-app-inbox-panel__skeleton-line --wide\"></div>\n <div class=\"axp-in-app-inbox-panel__skeleton-line\"></div>\n </div>\n </div>\n }\n </div>\n } @else if (getItems(tab.key).length === 0) {\n <axp-state-message\n icon=\"fa-regular fa-bell-slash\"\n [title]=\"i18n.emptyTitle\"\n [description]=\"i18n.emptyDescription\"\n />\n } @else {\n @for (item of getItems(tab.key); track item.id) {\n <axp-in-app-inbox-item\n [data]=\"item\"\n [showPin]=\"showPin()\"\n [pinLabelKey]=\"i18n.pin\"\n [unpinLabelKey]=\"i18n.unpin\"\n (itemPress)=\"markAsRead($event)\"\n (togglePin)=\"togglePin($event)\"\n (closePopover)=\"closePopover.emit()\"\n />\n }\n }\n </div>\n <div class=\"axp-in-app-inbox-panel__footer\">\n <ax-button\n [disabled]=\"(tabItems()[0]?.count ?? 0) === 0\"\n color=\"default\"\n [text]=\"(i18n.markAllAsRead | translate | async) ?? ''\"\n (onClick)=\"markAllAsRead()\"\n />\n <ax-button\n color=\"primary\"\n [text]=\"(i18n.viewAll | translate | async) ?? ''\"\n (onClick)=\"viewAll()\"\n />\n </div>\n </ax-content>\n </ax-tab-item>\n }\n</ax-tabs>\n\n<ng-template [axTabContent] #tabContent=\"axTabContent\"></ng-template>\n", styles: ["@layer properties;.axp-in-app-inbox-panel__header{display:flex;align-items:center;justify-content:space-between;padding:calc(var(--spacing, .25rem) * 4)}.axp-in-app-inbox-panel__title{font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgb(var(--ax-sys-color-on-surface))}.axp-in-app-inbox-panel__list{max-height:50vh;overflow-y:auto}@media(width>=48rem){.axp-in-app-inbox-panel__list{width:32rem}}.axp-in-app-inbox-panel__footer{display:flex;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 4);border-top-style:var(--tw-border-style);border-top-width:1px;padding:calc(var(--spacing, .25rem) * 4);border-color:rgb(var(--ax-sys-color-border-surface))}.axp-in-app-inbox-panel__loading{padding:calc(var(--spacing, .25rem) * 2)}:where(.axp-in-app-inbox-panel__loading>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing, .25rem) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing, .25rem) * 2) * calc(1 - var(--tw-space-y-reverse)))}.axp-in-app-inbox-panel__skeleton{display:flex;animation:var(--animate-pulse, 1s ease-in-out both pulse);gap:calc(var(--spacing, .25rem) * 4);padding:calc(var(--spacing, .25rem) * 4)}.axp-in-app-inbox-panel__skeleton-avatar{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);flex-shrink:0;border-radius:calc(infinity * 1px);background:rgb(var(--ax-sys-color-lighter-surface))}.axp-in-app-inbox-panel__skeleton-lines{flex:1;padding-block:var(--spacing, .25rem)}:where(.axp-in-app-inbox-panel__skeleton-lines>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing, .25rem) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing, .25rem) * 2) * calc(1 - var(--tw-space-y-reverse)))}.axp-in-app-inbox-panel__skeleton-line{height:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);background:rgb(var(--ax-sys-color-lighter-surface))}.axp-in-app-inbox-panel__skeleton-line.--wide{width:75%}.axp-in-app-inbox-panel__skeleton-line:not(.--wide){width:50%}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-space-y-reverse{syntax: \"*\"; inherits: false; initial-value: 0;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial;--tw-border-style: solid;--tw-space-y-reverse: 0}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: AXTabsModule }, { kind: "component", type: i2$5.AXTabsComponent, selector: "ax-tabs", inputs: ["look", "location", "fitParent", "minWidth", "content"], outputs: ["onActiveTabChanged"] }, { kind: "component", type: i2$5.AXTabItemComponent, selector: "ax-tab-item", inputs: ["disabled", "text", "key", "headerTemplate", "active"], outputs: ["disabledChange", "onClick", "onBlur", "onFocus", "activeChange"] }, { kind: "directive", type: i2$5.AXTabContentDirective, selector: "[axTabContent]", inputs: ["axTabContent"], exportAs: ["axTabContent"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.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: AXBadgeModule }, { kind: "component", type: i4$1.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "titleParams", "descriptionParams", "look"] }, { kind: "component", type: AXPInAppInboxItemComponent, selector: "axp-in-app-inbox-item", inputs: ["data", "showAvatar", "showDate", "showPin", "pinLabelKey", "unpinLabelKey"], outputs: ["itemPress", "togglePin", "closePopover"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
5266
- }
5267
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPInAppInboxPanelComponent, decorators: [{
5268
- type: Component,
5269
- args: [{ selector: 'axp-in-app-inbox-panel', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
5270
- CommonModule,
5271
- AXButtonModule,
5272
- AXTabsModule,
5273
- AXDecoratorModule,
5274
- AXBadgeModule,
5275
- AXTranslationModule,
5276
- AXPStateMessageComponent,
5277
- AXPInAppInboxItemComponent,
5278
- ], template: "<div class=\"axp-in-app-inbox-panel__header\">\n <span class=\"axp-in-app-inbox-panel__title\">\n {{ i18n.panelTitle | translate | async }}\n </span>\n @if (config.settingsRoute) {\n <ax-button color=\"default\" look=\"blank\" (onClick)=\"openSettings()\">\n <ax-icon><i class=\"fa-regular fa-gear fa-lg\"></i></ax-icon>\n </ax-button>\n }\n</div>\n<ax-tabs [content]=\"tabContent\" look=\"with-line\" location=\"bottom\">\n @for (tab of tabItems(); track tab.key) {\n <ax-tab-item\n [text]=\"(tab.labelKey | translate | async) ?? ''\"\n [active]=\"activeTab() === tab.key\"\n (activeChange)=\"changeActiveTab(tab.key)\"\n >\n <ax-suffix>\n @if (tab.count && tab.key === 'Unread') {\n <ax-badge [color]=\"activeTab() === tab.key ? 'primary' : 'ghost'\" [text]=\"tab.count.toString()\"></ax-badge>\n }\n </ax-suffix>\n <ax-content>\n <div class=\"axp-in-app-inbox-panel__list\">\n @if (isLoading()) {\n <div class=\"axp-in-app-inbox-panel__loading\">\n @for (_ of [1, 2, 3]; track $index) {\n <div class=\"axp-in-app-inbox-panel__skeleton\">\n <div class=\"axp-in-app-inbox-panel__skeleton-avatar\"></div>\n <div class=\"axp-in-app-inbox-panel__skeleton-lines\">\n <div class=\"axp-in-app-inbox-panel__skeleton-line --wide\"></div>\n <div class=\"axp-in-app-inbox-panel__skeleton-line\"></div>\n </div>\n </div>\n }\n </div>\n } @else if (getItems(tab.key).length === 0) {\n <axp-state-message\n icon=\"fa-regular fa-bell-slash\"\n [title]=\"i18n.emptyTitle\"\n [description]=\"i18n.emptyDescription\"\n />\n } @else {\n @for (item of getItems(tab.key); track item.id) {\n <axp-in-app-inbox-item\n [data]=\"item\"\n [showPin]=\"showPin()\"\n [pinLabelKey]=\"i18n.pin\"\n [unpinLabelKey]=\"i18n.unpin\"\n (itemPress)=\"markAsRead($event)\"\n (togglePin)=\"togglePin($event)\"\n (closePopover)=\"closePopover.emit()\"\n />\n }\n }\n </div>\n <div class=\"axp-in-app-inbox-panel__footer\">\n <ax-button\n [disabled]=\"(tabItems()[0]?.count ?? 0) === 0\"\n color=\"default\"\n [text]=\"(i18n.markAllAsRead | translate | async) ?? ''\"\n (onClick)=\"markAllAsRead()\"\n />\n <ax-button\n color=\"primary\"\n [text]=\"(i18n.viewAll | translate | async) ?? ''\"\n (onClick)=\"viewAll()\"\n />\n </div>\n </ax-content>\n </ax-tab-item>\n }\n</ax-tabs>\n\n<ng-template [axTabContent] #tabContent=\"axTabContent\"></ng-template>\n", styles: ["@layer properties;.axp-in-app-inbox-panel__header{display:flex;align-items:center;justify-content:space-between;padding:calc(var(--spacing, .25rem) * 4)}.axp-in-app-inbox-panel__title{font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgb(var(--ax-sys-color-on-surface))}.axp-in-app-inbox-panel__list{max-height:50vh;overflow-y:auto}@media(width>=48rem){.axp-in-app-inbox-panel__list{width:32rem}}.axp-in-app-inbox-panel__footer{display:flex;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 4);border-top-style:var(--tw-border-style);border-top-width:1px;padding:calc(var(--spacing, .25rem) * 4);border-color:rgb(var(--ax-sys-color-border-surface))}.axp-in-app-inbox-panel__loading{padding:calc(var(--spacing, .25rem) * 2)}:where(.axp-in-app-inbox-panel__loading>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing, .25rem) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing, .25rem) * 2) * calc(1 - var(--tw-space-y-reverse)))}.axp-in-app-inbox-panel__skeleton{display:flex;animation:var(--animate-pulse, 1s ease-in-out both pulse);gap:calc(var(--spacing, .25rem) * 4);padding:calc(var(--spacing, .25rem) * 4)}.axp-in-app-inbox-panel__skeleton-avatar{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);flex-shrink:0;border-radius:calc(infinity * 1px);background:rgb(var(--ax-sys-color-lighter-surface))}.axp-in-app-inbox-panel__skeleton-lines{flex:1;padding-block:var(--spacing, .25rem)}:where(.axp-in-app-inbox-panel__skeleton-lines>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--spacing, .25rem) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing, .25rem) * 2) * calc(1 - var(--tw-space-y-reverse)))}.axp-in-app-inbox-panel__skeleton-line{height:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);background:rgb(var(--ax-sys-color-lighter-surface))}.axp-in-app-inbox-panel__skeleton-line.--wide{width:75%}.axp-in-app-inbox-panel__skeleton-line:not(.--wide){width:50%}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-space-y-reverse{syntax: \"*\"; inherits: false; initial-value: 0;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial;--tw-border-style: solid;--tw-space-y-reverse: 0}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
5279
- }], ctorParameters: () => [], propDecorators: { unreadCountChange: [{ type: i0.Output, args: ["unreadCountChange"] }], closePopover: [{ type: i0.Output, args: ["closePopover"] }] } });
5280
-
5281
- //#region ---- Shared in-app inbox header slot ----
5282
- class AXPInAppInboxSlotComponent {
5283
- constructor() {
5284
- this.config = inject(AXP_IN_APP_INBOX_CONFIG);
5285
- this.unreadCount = signal(0, ...(ngDevMode ? [{ debugName: "unreadCount" }] : /* istanbul ignore next */ []));
5286
- this.badgeDisplay = computed(() => {
5287
- const total = this.unreadCount();
5288
- if (total <= 0) {
5289
- return '';
5290
- }
5291
- return total > 50 ? '50+' : total.toString();
5292
- }, ...(ngDevMode ? [{ debugName: "badgeDisplay" }] : /* istanbul ignore next */ []));
5293
- this.popover = viewChild(AXPopoverComponent, ...(ngDevMode ? [{ debugName: "popover" }] : /* istanbul ignore next */ []));
5294
- }
5295
- setUnreadCount(value) {
5296
- this.unreadCount.set(value);
5297
- }
5298
- closePopover() {
5299
- this.popover()?.close();
5300
- }
5301
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPInAppInboxSlotComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5302
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPInAppInboxSlotComponent, isStandalone: true, selector: "axp-in-app-inbox-slot", viewQueries: [{ propertyName: "popover", first: true, predicate: AXPopoverComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ax-button\n [iconOnly]=\"true\"\n class=\"relative axp-in-app-inbox-slot__button\"\n color=\"primary\"\n #inboxTrigger\n>\n <ax-icon>\n <i [class]=\"config.headerIconClass\"></i>\n </ax-icon>\n</ax-button>\n<div\n class=\"axp-in-app-inbox-slot__badge\"\n [class.--xs]=\"badgeDisplay().length > 2\"\n>\n @if (badgeDisplay()) {\n <ax-badge color=\"danger\" [text]=\"badgeDisplay()\"></ax-badge>\n }\n</div>\n<ax-popover\n [target]=\"inboxTrigger\"\n [openOn]=\"'toggle'\"\n [closeOn]=\"'clickOut'\"\n [adaptivityEnabled]=\"true\"\n>\n <div class=\"bg-lightest rounded-md w-full\">\n <axp-in-app-inbox-panel\n (unreadCountChange)=\"setUnreadCount($event)\"\n (closePopover)=\"closePopover()\"\n />\n </div>\n</ax-popover>\n", styles: ["axp-in-app-inbox-slot{position:relative}axp-in-app-inbox-slot .axp-in-app-inbox-slot__badge{position:absolute;inset-inline-end:-.25rem;top:-.25rem;pointer-events:none}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "component", type: i4$1.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i4$2.AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: AXPInAppInboxPanelComponent, selector: "axp-in-app-inbox-panel", outputs: ["unreadCountChange", "closePopover"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
5303
- }
5304
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPInAppInboxSlotComponent, decorators: [{
5305
- type: Component,
5306
- args: [{ selector: 'axp-in-app-inbox-slot', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXButtonModule, AXDecoratorModule, AXBadgeModule, AXPopoverModule, AXPInAppInboxPanelComponent], template: "<ax-button\n [iconOnly]=\"true\"\n class=\"relative axp-in-app-inbox-slot__button\"\n color=\"primary\"\n #inboxTrigger\n>\n <ax-icon>\n <i [class]=\"config.headerIconClass\"></i>\n </ax-icon>\n</ax-button>\n<div\n class=\"axp-in-app-inbox-slot__badge\"\n [class.--xs]=\"badgeDisplay().length > 2\"\n>\n @if (badgeDisplay()) {\n <ax-badge color=\"danger\" [text]=\"badgeDisplay()\"></ax-badge>\n }\n</div>\n<ax-popover\n [target]=\"inboxTrigger\"\n [openOn]=\"'toggle'\"\n [closeOn]=\"'clickOut'\"\n [adaptivityEnabled]=\"true\"\n>\n <div class=\"bg-lightest rounded-md w-full\">\n <axp-in-app-inbox-panel\n (unreadCountChange)=\"setUnreadCount($event)\"\n (closePopover)=\"closePopover()\"\n />\n </div>\n</ax-popover>\n", styles: ["axp-in-app-inbox-slot{position:relative}axp-in-app-inbox-slot .axp-in-app-inbox-slot__badge{position:absolute;inset-inline-end:-.25rem;top:-.25rem;pointer-events:none}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
5307
- }], propDecorators: { popover: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXPopoverComponent), { isSignal: true }] }] } });
5308
-
5309
- //#region ---- Signature editor types ----
5310
- //#endregion
5311
-
5312
- //#region ---- Constants ----
5313
- const SIGNATURE_WIDGET_NAME = 'signature';
5314
- //#endregion
5315
- //#region ---- Signature editor service ----
5316
- /**
5317
- * Opens the shared signature capture dialog (paint pad, Clear, and Save/Apply).
5318
- * Clear resets the canvas; the primary action persists the current pad (empty removes the signature).
5319
- */
5320
- class AXPSignatureEditorService {
5321
- constructor() {
5322
- //#region ---- Services & Dependencies ----
5323
- this.layoutBuilder = inject(AXPLayoutBuilderService);
5324
- }
5325
- //#endregion
5326
- //#region ---- Public API ----
5327
- async open(options = {}) {
5328
- const initialValue = options.value ?? null;
5329
- const disabled = options.disabled ?? false;
5330
- const ref = await this.layoutBuilder
5331
- .create()
5332
- .dialog((dialog) => {
5333
- dialog
5334
- .setTitle(options.title ?? '@platform-layout-widgets:widgets.signature.title')
5335
- .setSize('sm')
5336
- .setCloseButton(true)
5337
- .setContext({ value: initialValue })
5338
- .content((content) => {
5339
- content
5340
- .setDirection('column')
5341
- .setGap('16px')
5342
- .setAlignItems('stretch')
5343
- .customWidget(SIGNATURE_WIDGET_NAME, {
5344
- name: SIGNATURE_WIDGET_NAME,
5345
- path: 'value',
5346
- disabled,
5347
- showOverlay: false,
5348
- editMode: true,
5349
- });
5350
- })
5351
- .setActions((actions) => {
5352
- actions.cancel('@general:actions.cancel.title');
5353
- actions.custom({
5354
- title: '@general:actions.clear.title',
5355
- icon: 'fa-light fa-eraser',
5356
- disabled: '{{ !context.value }}',
5357
- command: { name: 'widget:signature.clear' },
5358
- position: 'prefix',
5359
- });
5360
- actions.submit(options.submitActionKey ?? '@general:actions.apply.title');
5361
- });
5362
- })
5363
- .show();
5364
- const action = this.resolveAction(ref.action());
5365
- const context = ref.context() ?? {};
5366
- if (action === 'apply') {
5367
- const newValue = context.value;
5368
- const value = this.resolveAppliedValue(newValue, initialValue);
5369
- ref.close();
5370
- return { action: 'apply', value };
5371
- }
5372
- ref.close();
5373
- return { action: 'cancel', value: initialValue };
5374
- }
5375
- //#endregion
5376
- //#region ---- Utility Methods ----
5377
- resolveAction(action) {
5378
- if (action === 'submit' || action === 'signature-apply') {
5379
- return 'apply';
5380
- }
5381
- return 'cancel';
5382
- }
5383
- resolveAppliedValue(newValue, initialValue) {
5384
- if (newValue === null || newValue === '') {
5385
- return null;
5386
- }
5387
- if (isString(newValue)) {
5388
- return newValue;
5389
- }
5390
- return initialValue;
5391
- }
5392
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSignatureEditorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
5393
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSignatureEditorService, providedIn: 'root' }); }
5394
- }
5395
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSignatureEditorService, decorators: [{
5396
- type: Injectable,
5397
- args: [{ providedIn: 'root' }]
5074
+ args: [{ providedIn: 'root' }]
5398
5075
  }] });
5399
5076
 
5400
5077
  /**
@@ -5854,7 +5531,7 @@ class AXPPropertyViewerComponent {
5854
5531
  }
5855
5532
  }
5856
5533
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPPropertyViewerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5857
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPPropertyViewerComponent, isStandalone: true, selector: "axp-property-viewer", inputs: { tabsInput: { classPropertyName: "tabsInput", publicName: "tabsInput", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, bindingExpressionEditorMode: { classPropertyName: "bindingExpressionEditorMode", publicName: "bindingExpressionEditorMode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onChanged: "onChanged" }, viewQueries: [{ propertyName: "form", first: true, predicate: AXFormComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ax-form>\n <axp-widgets-container\n [context]=\"context()\"\n (onContextChanged)=\"handleContextChange($event)\"\n >\n <!-- #region Shared property row template (used in both advanced and simple modes) -->\n <ng-template\n #propertyRow\n let-prop=\"prop\"\n let-translateTitle=\"translateTitle\"\n >\n <div class=\"flex flex-col gap-2 py-2\">\n <!-- Property header: title + value/expression toggle (when binding.enabled) -->\n <div class=\"flex items-center gap-2 w-full\">\n @if (prop.showLabel !== false) {\n @if (translateTitle) {\n <span class=\"font-semibold flex-1 min-w-0\">{{\n prop.title | translate | async\n }}</span>\n } @else {\n <span class=\"font-semibold flex-1 min-w-0\">{{ prop.title }}</span>\n }\n }\n @if (prop.binding?.enabled) {\n <div class=\"flex gap-1 shrink-0 ax-sm\">\n <ax-button\n [toggleable]=\"true\"\n [selected]=\"isExpressionMode(prop)\"\n look=\"twotone\"\n [color]=\"isExpressionMode(prop) ? 'primary' : 'default'\"\n class=\"shrink-0\"\n [title]=\"\n (isExpressionMode(prop)\n ? '@general:terms.common.expression'\n : '@general:terms.common.value'\n )\n | translate\n | async\n \"\n (selectedChange)=\"setExpressionMode(prop, $event)\"\n >\n @if (isExpressionMode(prop)) {\n <ax-icon icon=\"fa-light fa-code\"></ax-icon>\n } @else {\n <ax-icon icon=\"fa-light fa-keyboard\"></ax-icon>\n }\n </ax-button>\n </div>\n }\n </div>\n <!-- Property content: expression editor (inline or popup) or widget renderer (value mode) -->\n @if (prop.binding?.enabled && isExpressionMode(prop)) {\n @if (bindingExpressionEditorMode() === 'inline') {\n <div class=\"w-full overflow-hidden\" style=\"direction: ltr\">\n <ax-code-editor\n [ngModel]=\"getBindingExpressionValue(prop)\"\n (ngModelChange)=\"setBindingExpressionValue(prop, $event)\"\n language=\"javascript\"\n [lineNumbers]=\"true\"\n class=\"w-full\"\n >\n </ax-code-editor>\n </div>\n } @else {\n <ax-button\n look=\"twotone\"\n color=\"primary\"\n size=\"sm\"\n class=\"w-full\"\n [text]=\"\n '@general:widgets.triggers.open-editor' | translate | async\n \"\n (onClick)=\"openBindingEditor(prop)\"\n [title]=\"\n '@general:widgets.triggers.edit-binding-expression'\n | translate\n | async\n \"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-code\"></ax-icon>\n </ax-prefix>\n </ax-button>\n }\n } @else if (prop.schema.interface) {\n <ng-container\n axp-widget-renderer\n [node]=\"prop.schema.interface\"\n [mode]=\"'edit'\"\n >\n </ng-container>\n }\n </div>\n </ng-template>\n <!-- #endregion -->\n\n <!-- #region Advanced mode: tabs + accordion groups -->\n @if (mode() === 'advanced') {\n <div class=\"flex flex-col\">\n @if (tabs().length > 1) {\n <div class=\"pb-2\">\n <ax-tabs\n look=\"default\"\n (onActiveTabChanged)=\"handleTabChange($event)\"\n [look]=\"'with-line'\"\n >\n @for (tab of tabs(); track $index) {\n <ax-tab-item\n [text]=\"(tab.title | translate | async) ?? ''\"\n [key]=\"$index.toString()\"\n [active]=\"currentTabIndex() === $index\"\n >\n </ax-tab-item>\n }\n </ax-tabs>\n </div>\n }\n <div class=\"flex-1 overflow-auto\">\n <ax-accordion-group [accordion]=\"false\" [look]=\"'flat'\">\n @for (group of groups(); track $index) {\n <ax-accordion-item\n class=\"mb-0!\"\n [caption]=\"(group.title | translate | async) ?? ''\"\n [isCollapsed]=\"group.isCollapsed\"\n (isCollapsedChange)=\"handleCollapsedChange(group.name, $event)\"\n >\n <div class=\"flex flex-col\">\n @for (p of group.props; track $index) {\n @if (isPropertyVisible(p)) {\n <ng-container\n *ngTemplateOutlet=\"\n propertyRow;\n context: { prop: p, translateTitle: true }\n \"\n >\n </ng-container>\n }\n }\n </div>\n </ax-accordion-item>\n }\n </ax-accordion-group>\n </div>\n </div>\n }\n <!-- #endregion -->\n\n <!-- #region Simple mode: flat list of properties with padding -->\n @else {\n <div class=\"flex flex-col p-4 gap-4\">\n @for (group of groups(); track $index) {\n @for (p of group.props; track $index) {\n @if (isPropertyVisible(p)) {\n <ng-container\n *ngTemplateOutlet=\"\n propertyRow;\n context: { prop: p, translateTitle: true }\n \"\n >\n </ng-container>\n }\n }\n }\n </div>\n }\n <!-- #endregion -->\n </axp-widgets-container>\n</ax-form>\n", styles: ["@layer properties;axp-property-viewer ax-accordion-item .ax-accordion-header{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);border-top-style:var(--tw-border-style);border-top-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial;--tw-border-style: solid}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXAccordionModule }, { kind: "component", type: i2$6.AXAccordionItemComponent, selector: "ax-accordion-item", inputs: ["isCollapsed", "icon", "textdecoration", "caption", "isLoading", "headerTemplate", "look", "disabled"], outputs: ["isCollapsedChange", "isLoadingChange", "onClick"] }, { kind: "component", type: i2$6.AXAccordionGroupComponent, selector: "ax-accordion-group", inputs: ["accordion", "activeIndex", "look", "collapsedOnItemClick"], outputs: ["activeIndexChange"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: AXButtonGroupModule }, { kind: "ngmodule", type: AXCodeEditorModule }, { kind: "component", type: i4$4.AXCodeEditorComponent, selector: "ax-code-editor", inputs: ["disabled", "value", "state", "name", "id", "language", "readonly", "placeholder", "lineNumbers", "lineWrapping", "tabSize", "indentWithTab", "theme", "extensions", "ariaLabel", "focusOnReady", "formatOnSave", "minRow", "customCompletions"], outputs: ["onValueChanged", "valueChange", "stateChange", "readonlyChange", "disabledChange", "ready", "save"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.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: AXFormModule }, { kind: "component", type: i2$4.AXFormComponent, selector: "ax-form", inputs: ["disabled", "readonly", "labelMode", "look", "messageStyle", "updateOn", "inUserInteractionActive"], outputs: ["onValidate", "updateOnChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXTabsModule }, { kind: "component", type: i2$5.AXTabsComponent, selector: "ax-tabs", inputs: ["look", "location", "fitParent", "minWidth", "content"], outputs: ["onActiveTabChanged"] }, { kind: "component", type: i2$5.AXTabItemComponent, selector: "ax-tab-item", inputs: ["disabled", "text", "key", "headerTemplate", "active"], outputs: ["disabledChange", "onClick", "onBlur", "onFocus", "activeChange"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { 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", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
5534
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPPropertyViewerComponent, isStandalone: true, selector: "axp-property-viewer", inputs: { tabsInput: { classPropertyName: "tabsInput", publicName: "tabsInput", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, bindingExpressionEditorMode: { classPropertyName: "bindingExpressionEditorMode", publicName: "bindingExpressionEditorMode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onChanged: "onChanged" }, viewQueries: [{ propertyName: "form", first: true, predicate: AXFormComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ax-form>\n <axp-widgets-container\n [context]=\"context()\"\n (onContextChanged)=\"handleContextChange($event)\"\n >\n <!-- #region Shared property row template (used in both advanced and simple modes) -->\n <ng-template\n #propertyRow\n let-prop=\"prop\"\n let-translateTitle=\"translateTitle\"\n >\n <div class=\"flex flex-col gap-2 py-2\">\n <!-- Property header: title + value/expression toggle (when binding.enabled) -->\n <div class=\"flex items-center gap-2 w-full\">\n @if (prop.showLabel !== false) {\n @if (translateTitle) {\n <span class=\"font-semibold flex-1 min-w-0\">{{\n prop.title | translate | async\n }}</span>\n } @else {\n <span class=\"font-semibold flex-1 min-w-0\">{{ prop.title }}</span>\n }\n }\n @if (prop.binding?.enabled) {\n <div class=\"flex gap-1 shrink-0 ax-sm\">\n <ax-button\n [toggleable]=\"true\"\n [selected]=\"isExpressionMode(prop)\"\n look=\"twotone\"\n [color]=\"isExpressionMode(prop) ? 'primary' : 'default'\"\n class=\"shrink-0\"\n [title]=\"\n (isExpressionMode(prop)\n ? '@general:terms.common.expression'\n : '@general:terms.common.value'\n )\n | translate\n | async\n \"\n (selectedChange)=\"setExpressionMode(prop, $event)\"\n >\n @if (isExpressionMode(prop)) {\n <ax-icon icon=\"fa-light fa-code\"></ax-icon>\n } @else {\n <ax-icon icon=\"fa-light fa-keyboard\"></ax-icon>\n }\n </ax-button>\n </div>\n }\n </div>\n <!-- Property content: expression editor (inline or popup) or widget renderer (value mode) -->\n @if (prop.binding?.enabled && isExpressionMode(prop)) {\n @if (bindingExpressionEditorMode() === 'inline') {\n <div class=\"w-full overflow-hidden\" style=\"direction: ltr\">\n <ax-code-editor\n [ngModel]=\"getBindingExpressionValue(prop)\"\n (ngModelChange)=\"setBindingExpressionValue(prop, $event)\"\n language=\"javascript\"\n [lineNumbers]=\"true\"\n class=\"w-full\"\n >\n </ax-code-editor>\n </div>\n } @else {\n <ax-button\n look=\"twotone\"\n color=\"primary\"\n size=\"sm\"\n class=\"w-full\"\n [text]=\"\n '@general:widgets.triggers.open-editor' | translate | async\n \"\n (onClick)=\"openBindingEditor(prop)\"\n [title]=\"\n '@general:widgets.triggers.edit-binding-expression'\n | translate\n | async\n \"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-code\"></ax-icon>\n </ax-prefix>\n </ax-button>\n }\n } @else if (prop.schema.interface) {\n <ng-container\n axp-widget-renderer\n [node]=\"prop.schema.interface\"\n [mode]=\"'edit'\"\n >\n </ng-container>\n }\n </div>\n </ng-template>\n <!-- #endregion -->\n\n <!-- #region Advanced mode: tabs + accordion groups -->\n @if (mode() === 'advanced') {\n <div class=\"flex flex-col\">\n @if (tabs().length > 1) {\n <div class=\"pb-2\">\n <ax-tabs\n look=\"default\"\n (onActiveTabChanged)=\"handleTabChange($event)\"\n [look]=\"'with-line'\"\n >\n @for (tab of tabs(); track $index) {\n <ax-tab-item\n [text]=\"(tab.title | translate | async) ?? ''\"\n [key]=\"$index.toString()\"\n [active]=\"currentTabIndex() === $index\"\n >\n </ax-tab-item>\n }\n </ax-tabs>\n </div>\n }\n <div class=\"flex-1 overflow-auto\">\n <ax-accordion-group [accordion]=\"false\" [look]=\"'flat'\">\n @for (group of groups(); track $index) {\n <ax-accordion-item\n class=\"mb-0!\"\n [caption]=\"(group.title | translate | async) ?? ''\"\n [isCollapsed]=\"group.isCollapsed\"\n (isCollapsedChange)=\"handleCollapsedChange(group.name, $event)\"\n >\n <div class=\"flex flex-col\">\n @for (p of group.props; track $index) {\n @if (isPropertyVisible(p)) {\n <ng-container\n *ngTemplateOutlet=\"\n propertyRow;\n context: { prop: p, translateTitle: true }\n \"\n >\n </ng-container>\n }\n }\n </div>\n </ax-accordion-item>\n }\n </ax-accordion-group>\n </div>\n </div>\n }\n <!-- #endregion -->\n\n <!-- #region Simple mode: flat list of properties with padding -->\n @else {\n <div class=\"flex flex-col p-4 gap-4\">\n @for (group of groups(); track $index) {\n @for (p of group.props; track $index) {\n @if (isPropertyVisible(p)) {\n <ng-container\n *ngTemplateOutlet=\"\n propertyRow;\n context: { prop: p, translateTitle: true }\n \"\n >\n </ng-container>\n }\n }\n }\n </div>\n }\n <!-- #endregion -->\n </axp-widgets-container>\n</ax-form>\n", styles: ["@layer properties;axp-property-viewer ax-accordion-item .ax-accordion-header{border-top-style:var(--tw-border-style);border-top-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXAccordionModule }, { kind: "component", type: i2$6.AXAccordionItemComponent, selector: "ax-accordion-item", inputs: ["isCollapsed", "icon", "textdecoration", "caption", "isLoading", "headerTemplate", "look", "disabled"], outputs: ["isCollapsedChange", "isLoadingChange", "onClick"] }, { kind: "component", type: i2$6.AXAccordionGroupComponent, selector: "ax-accordion-group", inputs: ["accordion", "activeIndex", "look", "collapsedOnItemClick"], outputs: ["activeIndexChange"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: AXButtonGroupModule }, { kind: "ngmodule", type: AXCodeEditorModule }, { kind: "component", type: i4$2.AXCodeEditorComponent, selector: "ax-code-editor", inputs: ["disabled", "value", "state", "name", "id", "language", "readonly", "placeholder", "lineNumbers", "lineWrapping", "tabSize", "indentWithTab", "theme", "extensions", "ariaLabel", "focusOnReady", "formatOnSave", "minRow", "customCompletions"], outputs: ["onValueChanged", "valueChange", "stateChange", "readonlyChange", "disabledChange", "ready", "save"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.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: AXFormModule }, { kind: "component", type: i2$5.AXFormComponent, selector: "ax-form", inputs: ["disabled", "readonly", "labelMode", "look", "messageStyle", "updateOn", "inUserInteractionActive"], outputs: ["onValidate", "updateOnChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXTabsModule }, { kind: "component", type: i8.AXTabsComponent, selector: "ax-tabs", inputs: ["look", "location", "fitParent", "minWidth", "content"], outputs: ["onActiveTabChanged"] }, { kind: "component", type: i8.AXTabItemComponent, selector: "ax-tab-item", inputs: ["disabled", "text", "key", "headerTemplate", "active"], outputs: ["disabledChange", "onClick", "onBlur", "onFocus", "activeChange"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { 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", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
5858
5535
  }
5859
5536
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPPropertyViewerComponent, decorators: [{
5860
5537
  type: Component,
@@ -5870,7 +5547,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
5870
5547
  AXTabsModule,
5871
5548
  AXPWidgetCoreModule,
5872
5549
  AXTranslationModule,
5873
- ], template: "<ax-form>\n <axp-widgets-container\n [context]=\"context()\"\n (onContextChanged)=\"handleContextChange($event)\"\n >\n <!-- #region Shared property row template (used in both advanced and simple modes) -->\n <ng-template\n #propertyRow\n let-prop=\"prop\"\n let-translateTitle=\"translateTitle\"\n >\n <div class=\"flex flex-col gap-2 py-2\">\n <!-- Property header: title + value/expression toggle (when binding.enabled) -->\n <div class=\"flex items-center gap-2 w-full\">\n @if (prop.showLabel !== false) {\n @if (translateTitle) {\n <span class=\"font-semibold flex-1 min-w-0\">{{\n prop.title | translate | async\n }}</span>\n } @else {\n <span class=\"font-semibold flex-1 min-w-0\">{{ prop.title }}</span>\n }\n }\n @if (prop.binding?.enabled) {\n <div class=\"flex gap-1 shrink-0 ax-sm\">\n <ax-button\n [toggleable]=\"true\"\n [selected]=\"isExpressionMode(prop)\"\n look=\"twotone\"\n [color]=\"isExpressionMode(prop) ? 'primary' : 'default'\"\n class=\"shrink-0\"\n [title]=\"\n (isExpressionMode(prop)\n ? '@general:terms.common.expression'\n : '@general:terms.common.value'\n )\n | translate\n | async\n \"\n (selectedChange)=\"setExpressionMode(prop, $event)\"\n >\n @if (isExpressionMode(prop)) {\n <ax-icon icon=\"fa-light fa-code\"></ax-icon>\n } @else {\n <ax-icon icon=\"fa-light fa-keyboard\"></ax-icon>\n }\n </ax-button>\n </div>\n }\n </div>\n <!-- Property content: expression editor (inline or popup) or widget renderer (value mode) -->\n @if (prop.binding?.enabled && isExpressionMode(prop)) {\n @if (bindingExpressionEditorMode() === 'inline') {\n <div class=\"w-full overflow-hidden\" style=\"direction: ltr\">\n <ax-code-editor\n [ngModel]=\"getBindingExpressionValue(prop)\"\n (ngModelChange)=\"setBindingExpressionValue(prop, $event)\"\n language=\"javascript\"\n [lineNumbers]=\"true\"\n class=\"w-full\"\n >\n </ax-code-editor>\n </div>\n } @else {\n <ax-button\n look=\"twotone\"\n color=\"primary\"\n size=\"sm\"\n class=\"w-full\"\n [text]=\"\n '@general:widgets.triggers.open-editor' | translate | async\n \"\n (onClick)=\"openBindingEditor(prop)\"\n [title]=\"\n '@general:widgets.triggers.edit-binding-expression'\n | translate\n | async\n \"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-code\"></ax-icon>\n </ax-prefix>\n </ax-button>\n }\n } @else if (prop.schema.interface) {\n <ng-container\n axp-widget-renderer\n [node]=\"prop.schema.interface\"\n [mode]=\"'edit'\"\n >\n </ng-container>\n }\n </div>\n </ng-template>\n <!-- #endregion -->\n\n <!-- #region Advanced mode: tabs + accordion groups -->\n @if (mode() === 'advanced') {\n <div class=\"flex flex-col\">\n @if (tabs().length > 1) {\n <div class=\"pb-2\">\n <ax-tabs\n look=\"default\"\n (onActiveTabChanged)=\"handleTabChange($event)\"\n [look]=\"'with-line'\"\n >\n @for (tab of tabs(); track $index) {\n <ax-tab-item\n [text]=\"(tab.title | translate | async) ?? ''\"\n [key]=\"$index.toString()\"\n [active]=\"currentTabIndex() === $index\"\n >\n </ax-tab-item>\n }\n </ax-tabs>\n </div>\n }\n <div class=\"flex-1 overflow-auto\">\n <ax-accordion-group [accordion]=\"false\" [look]=\"'flat'\">\n @for (group of groups(); track $index) {\n <ax-accordion-item\n class=\"mb-0!\"\n [caption]=\"(group.title | translate | async) ?? ''\"\n [isCollapsed]=\"group.isCollapsed\"\n (isCollapsedChange)=\"handleCollapsedChange(group.name, $event)\"\n >\n <div class=\"flex flex-col\">\n @for (p of group.props; track $index) {\n @if (isPropertyVisible(p)) {\n <ng-container\n *ngTemplateOutlet=\"\n propertyRow;\n context: { prop: p, translateTitle: true }\n \"\n >\n </ng-container>\n }\n }\n </div>\n </ax-accordion-item>\n }\n </ax-accordion-group>\n </div>\n </div>\n }\n <!-- #endregion -->\n\n <!-- #region Simple mode: flat list of properties with padding -->\n @else {\n <div class=\"flex flex-col p-4 gap-4\">\n @for (group of groups(); track $index) {\n @for (p of group.props; track $index) {\n @if (isPropertyVisible(p)) {\n <ng-container\n *ngTemplateOutlet=\"\n propertyRow;\n context: { prop: p, translateTitle: true }\n \"\n >\n </ng-container>\n }\n }\n }\n </div>\n }\n <!-- #endregion -->\n </axp-widgets-container>\n</ax-form>\n", styles: ["@layer properties;axp-property-viewer ax-accordion-item .ax-accordion-header{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);border-top-style:var(--tw-border-style);border-top-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial;--tw-border-style: solid}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
5550
+ ], template: "<ax-form>\n <axp-widgets-container\n [context]=\"context()\"\n (onContextChanged)=\"handleContextChange($event)\"\n >\n <!-- #region Shared property row template (used in both advanced and simple modes) -->\n <ng-template\n #propertyRow\n let-prop=\"prop\"\n let-translateTitle=\"translateTitle\"\n >\n <div class=\"flex flex-col gap-2 py-2\">\n <!-- Property header: title + value/expression toggle (when binding.enabled) -->\n <div class=\"flex items-center gap-2 w-full\">\n @if (prop.showLabel !== false) {\n @if (translateTitle) {\n <span class=\"font-semibold flex-1 min-w-0\">{{\n prop.title | translate | async\n }}</span>\n } @else {\n <span class=\"font-semibold flex-1 min-w-0\">{{ prop.title }}</span>\n }\n }\n @if (prop.binding?.enabled) {\n <div class=\"flex gap-1 shrink-0 ax-sm\">\n <ax-button\n [toggleable]=\"true\"\n [selected]=\"isExpressionMode(prop)\"\n look=\"twotone\"\n [color]=\"isExpressionMode(prop) ? 'primary' : 'default'\"\n class=\"shrink-0\"\n [title]=\"\n (isExpressionMode(prop)\n ? '@general:terms.common.expression'\n : '@general:terms.common.value'\n )\n | translate\n | async\n \"\n (selectedChange)=\"setExpressionMode(prop, $event)\"\n >\n @if (isExpressionMode(prop)) {\n <ax-icon icon=\"fa-light fa-code\"></ax-icon>\n } @else {\n <ax-icon icon=\"fa-light fa-keyboard\"></ax-icon>\n }\n </ax-button>\n </div>\n }\n </div>\n <!-- Property content: expression editor (inline or popup) or widget renderer (value mode) -->\n @if (prop.binding?.enabled && isExpressionMode(prop)) {\n @if (bindingExpressionEditorMode() === 'inline') {\n <div class=\"w-full overflow-hidden\" style=\"direction: ltr\">\n <ax-code-editor\n [ngModel]=\"getBindingExpressionValue(prop)\"\n (ngModelChange)=\"setBindingExpressionValue(prop, $event)\"\n language=\"javascript\"\n [lineNumbers]=\"true\"\n class=\"w-full\"\n >\n </ax-code-editor>\n </div>\n } @else {\n <ax-button\n look=\"twotone\"\n color=\"primary\"\n size=\"sm\"\n class=\"w-full\"\n [text]=\"\n '@general:widgets.triggers.open-editor' | translate | async\n \"\n (onClick)=\"openBindingEditor(prop)\"\n [title]=\"\n '@general:widgets.triggers.edit-binding-expression'\n | translate\n | async\n \"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-code\"></ax-icon>\n </ax-prefix>\n </ax-button>\n }\n } @else if (prop.schema.interface) {\n <ng-container\n axp-widget-renderer\n [node]=\"prop.schema.interface\"\n [mode]=\"'edit'\"\n >\n </ng-container>\n }\n </div>\n </ng-template>\n <!-- #endregion -->\n\n <!-- #region Advanced mode: tabs + accordion groups -->\n @if (mode() === 'advanced') {\n <div class=\"flex flex-col\">\n @if (tabs().length > 1) {\n <div class=\"pb-2\">\n <ax-tabs\n look=\"default\"\n (onActiveTabChanged)=\"handleTabChange($event)\"\n [look]=\"'with-line'\"\n >\n @for (tab of tabs(); track $index) {\n <ax-tab-item\n [text]=\"(tab.title | translate | async) ?? ''\"\n [key]=\"$index.toString()\"\n [active]=\"currentTabIndex() === $index\"\n >\n </ax-tab-item>\n }\n </ax-tabs>\n </div>\n }\n <div class=\"flex-1 overflow-auto\">\n <ax-accordion-group [accordion]=\"false\" [look]=\"'flat'\">\n @for (group of groups(); track $index) {\n <ax-accordion-item\n class=\"mb-0!\"\n [caption]=\"(group.title | translate | async) ?? ''\"\n [isCollapsed]=\"group.isCollapsed\"\n (isCollapsedChange)=\"handleCollapsedChange(group.name, $event)\"\n >\n <div class=\"flex flex-col\">\n @for (p of group.props; track $index) {\n @if (isPropertyVisible(p)) {\n <ng-container\n *ngTemplateOutlet=\"\n propertyRow;\n context: { prop: p, translateTitle: true }\n \"\n >\n </ng-container>\n }\n }\n </div>\n </ax-accordion-item>\n }\n </ax-accordion-group>\n </div>\n </div>\n }\n <!-- #endregion -->\n\n <!-- #region Simple mode: flat list of properties with padding -->\n @else {\n <div class=\"flex flex-col p-4 gap-4\">\n @for (group of groups(); track $index) {\n @for (p of group.props; track $index) {\n @if (isPropertyVisible(p)) {\n <ng-container\n *ngTemplateOutlet=\"\n propertyRow;\n context: { prop: p, translateTitle: true }\n \"\n >\n </ng-container>\n }\n }\n }\n </div>\n }\n <!-- #endregion -->\n </axp-widgets-container>\n</ax-form>\n", styles: ["@layer properties;axp-property-viewer ax-accordion-item .ax-accordion-header{border-top-style:var(--tw-border-style);border-top-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
5874
5551
  }], ctorParameters: () => [], propDecorators: { tabsInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabsInput", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], bindingExpressionEditorMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindingExpressionEditorMode", required: false }] }], onChanged: [{
5875
5552
  type: Output
5876
5553
  }], form: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXFormComponent), { isSignal: true }] }] } });
@@ -6376,7 +6053,7 @@ class AXPItemConfiguratorComponent {
6376
6053
  return action.disabled === true;
6377
6054
  }
6378
6055
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPItemConfiguratorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
6379
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPItemConfiguratorComponent, isStandalone: true, selector: "axp-item-configurator", inputs: { selectedItemId: { classPropertyName: "selectedItemId", publicName: "selectedItemId", isSignal: true, isRequired: false, transformFunction: null }, values: { classPropertyName: "values", publicName: "values", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, headerActions: { classPropertyName: "headerActions", publicName: "headerActions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedItemId: "selectedItemIdChange", values: "valuesChange" }, viewQueries: [{ propertyName: "itemSelectBox", first: true, predicate: ["itemSelectBox"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Item selector & info container -->\n<div class=\"__item-container\">\n @if (isEditMode()) {\n <div class=\"__item-selector\">\n <ax-select-box\n #itemSelectBox\n [ngModel]=\"selectedItemId()\"\n [dataSource]=\"availableItems()\"\n [placeholder]=\"\n ('@general:actions.select.title' | translate | async) ?? ''\n \"\n [readonly]=\"readonly()\"\n (onValueChanged)=\"onSelectionChange($event)\"\n valueField=\"value\"\n textField=\"text\"\n [itemTemplate]=\"itemTemplate\"\n [itemHeight]=\"72\"\n [selectedTemplate]=\"selectedTemplate\"\n (onClosed)=\"exitEditMode()\"\n >\n <ax-search-box></ax-search-box>\n <ax-clear-button></ax-clear-button>\n </ax-select-box>\n </div>\n }\n\n @if (!isEditMode()) {\n @if (selectedItemId() && currentItemConfig(); as config) {\n <div class=\"__item-info\">\n <div\n class=\"__item-header\"\n [class.__editable]=\"!readonly()\"\n (click)=\"enterEditMode()\"\n >\n <div>\n @if (config.icon) {\n <i [class]=\"config.icon\"></i>\n }\n <div>\n <span>\n {{ config.title | translate | async }}\n </span>\n @if (config.description) {\n <p>\n {{ (config.description | translate | async) ?? '' }}\n </p>\n }\n </div>\n </div>\n\n <div class=\"__action-buttons\" (click)=\"$event.stopPropagation()\">\n @if (config.hasProperties) {\n <ax-button\n [disabled]=\"!canConfigure() || readonly()\"\n [title]=\"\n ('@general:actions.configure.title' | translate | async) ?? ''\n \"\n look=\"blank\"\n [color]=\"isConfigured() ? 'primary' : 'default'\"\n size=\"sm\"\n (onClick)=\"openConfigureDialog()\"\n >\n <ax-icon icon=\"fa-solid fa-cog\"></ax-icon>\n </ax-button>\n }\n @for (\n action of visibleHeaderActions();\n track action.name ?? $index\n ) {\n <ax-button\n look=\"blank\"\n size=\"sm\"\n [color]=\"action.color ?? 'default'\"\n [disabled]=\"readonly() || isHeaderActionDisabled(action)\"\n [title]=\"(action.title | translate | async) ?? ''\"\n [class.icon-only]=\"action.iconOnly === true\"\n (onClick)=\"onHeaderActionClick(action)\"\n >\n @if (action.icon) {\n <ax-icon [icon]=\"action.icon\"></ax-icon>\n }\n @if (action.iconOnly !== true) {\n <span>{{ (action.title | translate | async) ?? '' }}</span>\n }\n </ax-button>\n }\n </div>\n </div>\n </div>\n } @else {\n <div\n class=\"__item-empty\"\n [class.__editable]=\"!readonly()\"\n (click)=\"enterEditMode()\"\n >\n <i class=\"fa-solid fa-puzzle-piece\"></i>\n <span>\n {{\n ('@general:widgets.widget-configurator.select-widget-type'\n | translate\n | async) ?? 'Select an item type'\n }}\n </span>\n </div>\n }\n }\n\n <ng-template #itemTemplate let-context>\n @let item = context.data;\n <div class=\"__item-template flex w-full items-center gap-3 p-2\">\n @if (item.icon) {\n <i [class]=\"item.icon + 'text-base w-5 text-center'\"></i>\n }\n <div class=\"flex flex-col gap-1 flex-1 min-w-0\">\n <div class=\"text-sm font-medium\">\n {{ item.text | translate | async }}\n </div>\n @if (item.description) {\n <div class=\"text-xs text-neutral-600\">\n {{ item.description | translate | async }}\n </div>\n }\n </div>\n </div>\n </ng-template>\n\n <ng-template #selectedTemplate let-item>\n <div class=\"__selected-template\">\n @if (item?.data?.icon) {\n <i [class]=\"item.data.icon\"></i>\n }\n <span>\n {{ item?.data?.text | translate | async }}\n </span>\n </div>\n </ng-template>\n</div>\n", styles: ["@layer properties;axp-item-configurator{display:flex;flex-direction:column}axp-item-configurator .__item-selector{display:flex;flex-direction:column}axp-item-configurator .__item-selector ax-select-box{width:100%}axp-item-configurator .__item-info{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 3)}axp-item-configurator .__item-info .__item-header{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}axp-item-configurator .__item-info .__item-header.__editable{cursor:pointer}axp-item-configurator .__item-info .__item-header.__editable:hover{border-radius:var(--radius-md, .375rem);background-color:rgba(var(--ax-sys-color-lighter-surface))}axp-item-configurator .__item-info .__item-header:not(.__editable){cursor:not-allowed}axp-item-configurator .__item-info .__item-header>div:first-child{display:flex;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}axp-item-configurator .__item-info .__item-header>div:first-child i{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));flex-shrink:0}axp-item-configurator .__item-info .__item-header>div:first-child>div{display:flex;flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}axp-item-configurator .__item-info .__item-header>div:first-child>div>span{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}axp-item-configurator .__item-info .__item-header>div:first-child>div>p{margin:0;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);color:var(--color-neutral-600, oklch(43.9% 0 0))}axp-item-configurator .__item-info .__action-buttons{display:flex;align-items:center;gap:var(--spacing, .25rem);flex-shrink:0}axp-item-configurator .__item-empty{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 2)}axp-item-configurator .__item-empty.__editable{cursor:pointer}axp-item-configurator .__item-empty.__editable:hover{border-radius:var(--radius-md, .375rem);background-color:rgba(var(--ax-sys-color-lighter-surface))}axp-item-configurator .__item-empty:not(.__editable){cursor:not-allowed}axp-item-configurator .__item-empty>i{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:var(--color-neutral-400, oklch(70.8% 0 0))}axp-item-configurator .__item-empty>span{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-neutral-600, oklch(43.9% 0 0))}axp-item-configurator .__item-template>i{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center}axp-item-configurator .__item-template>div>div:first-child{flex-shrink:0}axp-item-configurator .__item-template>div>div:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}axp-item-configurator .__selected-template{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}axp-item-configurator .__selected-template>i{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}axp-item-configurator .__selected-template>span{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}axp-item-configurator :host([readonly]){pointer-events:none;opacity:.7}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial;--tw-leading: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: AXSelectBoxModule }, { kind: "component", type: i2$3.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", "itemHeight", "maxVisibleItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i5.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6056
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPItemConfiguratorComponent, isStandalone: true, selector: "axp-item-configurator", inputs: { selectedItemId: { classPropertyName: "selectedItemId", publicName: "selectedItemId", isSignal: true, isRequired: false, transformFunction: null }, values: { classPropertyName: "values", publicName: "values", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, headerActions: { classPropertyName: "headerActions", publicName: "headerActions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedItemId: "selectedItemIdChange", values: "valuesChange" }, viewQueries: [{ propertyName: "itemSelectBox", first: true, predicate: ["itemSelectBox"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Item selector & info container -->\n<div class=\"__item-container\">\n @if (isEditMode()) {\n <div class=\"__item-selector\">\n <ax-select-box\n #itemSelectBox\n [ngModel]=\"selectedItemId()\"\n [dataSource]=\"availableItems()\"\n [placeholder]=\"\n ('@general:actions.select.title' | translate | async) ?? ''\n \"\n [readonly]=\"readonly()\"\n (onValueChanged)=\"onSelectionChange($event)\"\n valueField=\"value\"\n textField=\"text\"\n [itemTemplate]=\"itemTemplate\"\n [itemHeight]=\"72\"\n [selectedTemplate]=\"selectedTemplate\"\n (onClosed)=\"exitEditMode()\"\n >\n <ax-search-box></ax-search-box>\n <ax-clear-button></ax-clear-button>\n </ax-select-box>\n </div>\n }\n\n @if (!isEditMode()) {\n @if (selectedItemId() && currentItemConfig(); as config) {\n <div class=\"__item-info\">\n <div\n class=\"__item-header\"\n [class.__editable]=\"!readonly()\"\n (click)=\"enterEditMode()\"\n >\n <div>\n @if (config.icon) {\n <i [class]=\"config.icon\"></i>\n }\n <div>\n <span>\n {{ config.title | translate | async }}\n </span>\n @if (config.description) {\n <p>\n {{ (config.description | translate | async) ?? '' }}\n </p>\n }\n </div>\n </div>\n\n <div class=\"__action-buttons\" (click)=\"$event.stopPropagation()\">\n @if (config.hasProperties) {\n <ax-button\n [disabled]=\"!canConfigure() || readonly()\"\n [title]=\"\n ('@general:actions.configure.title' | translate | async) ?? ''\n \"\n look=\"blank\"\n [color]=\"isConfigured() ? 'primary' : 'default'\"\n size=\"sm\"\n (onClick)=\"openConfigureDialog()\"\n >\n <ax-icon icon=\"fa-solid fa-cog\"></ax-icon>\n </ax-button>\n }\n @for (\n action of visibleHeaderActions();\n track action.name ?? $index\n ) {\n <ax-button\n look=\"blank\"\n size=\"sm\"\n [color]=\"action.color ?? 'default'\"\n [disabled]=\"readonly() || isHeaderActionDisabled(action)\"\n [title]=\"(action.title | translate | async) ?? ''\"\n [class.icon-only]=\"action.iconOnly === true\"\n (onClick)=\"onHeaderActionClick(action)\"\n >\n @if (action.icon) {\n <ax-icon [icon]=\"action.icon\"></ax-icon>\n }\n @if (action.iconOnly !== true) {\n <span>{{ (action.title | translate | async) ?? '' }}</span>\n }\n </ax-button>\n }\n </div>\n </div>\n </div>\n } @else {\n <div\n class=\"__item-empty\"\n [class.__editable]=\"!readonly()\"\n (click)=\"enterEditMode()\"\n >\n <i class=\"fa-solid fa-puzzle-piece\"></i>\n <span>\n {{\n ('@general:widgets.widget-configurator.select-widget-type'\n | translate\n | async) ?? 'Select an item type'\n }}\n </span>\n </div>\n }\n }\n\n <ng-template #itemTemplate let-context>\n @let item = context.data;\n <div class=\"__item-template flex w-full items-center gap-3 p-2\">\n @if (item.icon) {\n <i [class]=\"item.icon + 'text-base w-5 text-center'\"></i>\n }\n <div class=\"flex flex-col gap-1 flex-1 min-w-0\">\n <div class=\"text-sm font-medium\">\n {{ item.text | translate | async }}\n </div>\n @if (item.description) {\n <div class=\"text-xs text-neutral-600\">\n {{ item.description | translate | async }}\n </div>\n }\n </div>\n </div>\n </ng-template>\n\n <ng-template #selectedTemplate let-item>\n <div class=\"__selected-template\">\n @if (item?.data?.icon) {\n <i [class]=\"item.data.icon\"></i>\n }\n <span>\n {{ item?.data?.text | translate | async }}\n </span>\n </div>\n </ng-template>\n</div>\n", styles: ["@layer properties;axp-item-configurator{display:flex;flex-direction:column}axp-item-configurator .__item-selector{display:flex;flex-direction:column}axp-item-configurator .__item-selector ax-select-box{width:100%}axp-item-configurator .__item-info{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 3)}axp-item-configurator .__item-info .__item-header{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}axp-item-configurator .__item-info .__item-header.__editable{cursor:pointer}axp-item-configurator .__item-info .__item-header.__editable:hover{border-radius:var(--radius-md, .375rem);background-color:rgba(var(--ax-sys-color-lighter-surface))}axp-item-configurator .__item-info .__item-header:not(.__editable){cursor:not-allowed}axp-item-configurator .__item-info .__item-header>div:first-child{display:flex;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}axp-item-configurator .__item-info .__item-header>div:first-child i{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));flex-shrink:0}axp-item-configurator .__item-info .__item-header>div:first-child>div{display:flex;flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}axp-item-configurator .__item-info .__item-header>div:first-child>div>span{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}axp-item-configurator .__item-info .__item-header>div:first-child>div>p{margin:0;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);color:var(--color-neutral-600, oklch(43.9% 0 0))}axp-item-configurator .__item-info .__action-buttons{display:flex;align-items:center;gap:var(--spacing, .25rem);flex-shrink:0}axp-item-configurator .__item-empty{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 2)}axp-item-configurator .__item-empty.__editable{cursor:pointer}axp-item-configurator .__item-empty.__editable:hover{border-radius:var(--radius-md, .375rem);background-color:rgba(var(--ax-sys-color-lighter-surface))}axp-item-configurator .__item-empty:not(.__editable){cursor:not-allowed}axp-item-configurator .__item-empty>i{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:var(--color-neutral-400, oklch(70.8% 0 0))}axp-item-configurator .__item-empty>span{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-neutral-600, oklch(43.9% 0 0))}axp-item-configurator .__item-template>i{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center}axp-item-configurator .__item-template>div>div:first-child{flex-shrink:0}axp-item-configurator .__item-template>div>div:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}axp-item-configurator .__selected-template{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}axp-item-configurator .__selected-template>i{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}axp-item-configurator .__selected-template>span{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}axp-item-configurator :host([readonly]){pointer-events:none;opacity:.7}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial;--tw-leading: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: AXSelectBoxModule }, { kind: "component", type: i2$4.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", "itemHeight", "maxVisibleItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i5.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6380
6057
  }
6381
6058
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPItemConfiguratorComponent, decorators: [{
6382
6059
  type: Component,
@@ -6444,11 +6121,11 @@ class AXPLayoutFloatingZoomBarComponent {
6444
6121
  this.zoomReset.emit();
6445
6122
  }
6446
6123
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPLayoutFloatingZoomBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
6447
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: AXPLayoutFloatingZoomBarComponent, isStandalone: true, selector: "axp-layout-floating-zoom-bar", inputs: { zoomLevel: { classPropertyName: "zoomLevel", publicName: "zoomLevel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zoomIn: "zoomIn", zoomOut: "zoomOut", zoomReset: "zoomReset" }, ngImport: i0, template: "<div class=\"axp-layout-floating-zoom-bar\">\n <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"onZoomOut()\">\n <ax-icon class=\"fa-solid fa-minus\"></ax-icon>\n </ax-button>\n <ax-button look=\"blank\" class=\"ax-sm __zoom-value\" [text]=\"zoomLabel()\" (onClick)=\"onZoomReset()\"></ax-button>\n <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"onZoomIn()\">\n <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n </ax-button>\n</div>\n", styles: ["@layer properties;.axp-layout-floating-zoom-bar{position:absolute;bottom:calc(var(--spacing, .25rem) * 4);z-index:20;display:flex;align-items:center;gap:var(--spacing, .25rem);border-radius:var(--radius-2xl, 1rem);padding:calc(var(--spacing, .25rem) * 1.5);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);inset-inline-end:1rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 8px 20px -12px #0000003d,0 2px 8px #00000014,inset 0 1px #ffffffbf}.axp-layout-floating-zoom-bar .__zoom-button{border-radius:var(--radius-xl, .75rem);color:rgba(var(--ax-sys-color-on-surface))}.axp-layout-floating-zoom-bar .__zoom-button:hover{background-color:rgb(var(--ax-sys-color-primary-500))}@supports (color: color-mix(in lab,red,red)){.axp-layout-floating-zoom-bar .__zoom-button:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}}.axp-layout-floating-zoom-bar .__zoom-value{min-width:calc(var(--spacing, .25rem) * 16);border-radius:var(--radius-xl, .75rem);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}.axp-layout-floating-zoom-bar .__zoom-value:hover{background-color:rgb(var(--ax-sys-color-primary-500))}@supports (color: color-mix(in lab,red,red)){.axp-layout-floating-zoom-bar .__zoom-value:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6124
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: AXPLayoutFloatingZoomBarComponent, isStandalone: true, selector: "axp-layout-floating-zoom-bar", inputs: { zoomLevel: { classPropertyName: "zoomLevel", publicName: "zoomLevel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zoomIn: "zoomIn", zoomOut: "zoomOut", zoomReset: "zoomReset" }, ngImport: i0, template: "<div class=\"axp-layout-floating-zoom-bar\">\n <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"onZoomOut()\">\n <ax-icon class=\"fa-solid fa-minus\"></ax-icon>\n </ax-button>\n <ax-button look=\"blank\" class=\"ax-sm __zoom-value\" [text]=\"zoomLabel()\" (onClick)=\"onZoomReset()\"></ax-button>\n <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"onZoomIn()\">\n <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n </ax-button>\n</div>\n", styles: ["@layer properties;.axp-layout-floating-zoom-bar{position:absolute;bottom:calc(var(--spacing, .25rem) * 4);z-index:20;display:flex;align-items:center;gap:var(--spacing, .25rem);border-radius:var(--radius-2xl, 1rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding:calc(var(--spacing, .25rem) * 1.5);inset-inline-end:1rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 8px 20px -12px #0000003d,0 2px 8px #00000014,inset 0 1px #ffffffbf}.axp-layout-floating-zoom-bar .__zoom-button{border-radius:var(--radius-xl, .75rem);color:rgba(var(--ax-sys-color-on-surface))}.axp-layout-floating-zoom-bar .__zoom-button:hover{background-color:rgb(var(--ax-sys-color-primary-500))}@supports (color: color-mix(in lab,red,red)){.axp-layout-floating-zoom-bar .__zoom-button:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}}.axp-layout-floating-zoom-bar .__zoom-value{min-width:calc(var(--spacing, .25rem) * 16);border-radius:var(--radius-xl, .75rem);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}.axp-layout-floating-zoom-bar .__zoom-value:hover{background-color:rgb(var(--ax-sys-color-primary-500))}@supports (color: color-mix(in lab,red,red)){.axp-layout-floating-zoom-bar .__zoom-value:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6448
6125
  }
6449
6126
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPLayoutFloatingZoomBarComponent, decorators: [{
6450
6127
  type: Component,
6451
- args: [{ selector: 'axp-layout-floating-zoom-bar', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [CommonModule, AXButtonModule, AXDecoratorModule], template: "<div class=\"axp-layout-floating-zoom-bar\">\n <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"onZoomOut()\">\n <ax-icon class=\"fa-solid fa-minus\"></ax-icon>\n </ax-button>\n <ax-button look=\"blank\" class=\"ax-sm __zoom-value\" [text]=\"zoomLabel()\" (onClick)=\"onZoomReset()\"></ax-button>\n <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"onZoomIn()\">\n <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n </ax-button>\n</div>\n", styles: ["@layer properties;.axp-layout-floating-zoom-bar{position:absolute;bottom:calc(var(--spacing, .25rem) * 4);z-index:20;display:flex;align-items:center;gap:var(--spacing, .25rem);border-radius:var(--radius-2xl, 1rem);padding:calc(var(--spacing, .25rem) * 1.5);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);inset-inline-end:1rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 8px 20px -12px #0000003d,0 2px 8px #00000014,inset 0 1px #ffffffbf}.axp-layout-floating-zoom-bar .__zoom-button{border-radius:var(--radius-xl, .75rem);color:rgba(var(--ax-sys-color-on-surface))}.axp-layout-floating-zoom-bar .__zoom-button:hover{background-color:rgb(var(--ax-sys-color-primary-500))}@supports (color: color-mix(in lab,red,red)){.axp-layout-floating-zoom-bar .__zoom-button:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}}.axp-layout-floating-zoom-bar .__zoom-value{min-width:calc(var(--spacing, .25rem) * 16);border-radius:var(--radius-xl, .75rem);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}.axp-layout-floating-zoom-bar .__zoom-value:hover{background-color:rgb(var(--ax-sys-color-primary-500))}@supports (color: color-mix(in lab,red,red)){.axp-layout-floating-zoom-bar .__zoom-value:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
6128
+ args: [{ selector: 'axp-layout-floating-zoom-bar', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [CommonModule, AXButtonModule, AXDecoratorModule], template: "<div class=\"axp-layout-floating-zoom-bar\">\n <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"onZoomOut()\">\n <ax-icon class=\"fa-solid fa-minus\"></ax-icon>\n </ax-button>\n <ax-button look=\"blank\" class=\"ax-sm __zoom-value\" [text]=\"zoomLabel()\" (onClick)=\"onZoomReset()\"></ax-button>\n <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"onZoomIn()\">\n <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n </ax-button>\n</div>\n", styles: ["@layer properties;.axp-layout-floating-zoom-bar{position:absolute;bottom:calc(var(--spacing, .25rem) * 4);z-index:20;display:flex;align-items:center;gap:var(--spacing, .25rem);border-radius:var(--radius-2xl, 1rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding:calc(var(--spacing, .25rem) * 1.5);inset-inline-end:1rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 8px 20px -12px #0000003d,0 2px 8px #00000014,inset 0 1px #ffffffbf}.axp-layout-floating-zoom-bar .__zoom-button{border-radius:var(--radius-xl, .75rem);color:rgba(var(--ax-sys-color-on-surface))}.axp-layout-floating-zoom-bar .__zoom-button:hover{background-color:rgb(var(--ax-sys-color-primary-500))}@supports (color: color-mix(in lab,red,red)){.axp-layout-floating-zoom-bar .__zoom-button:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}}.axp-layout-floating-zoom-bar .__zoom-value{min-width:calc(var(--spacing, .25rem) * 16);border-radius:var(--radius-xl, .75rem);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}.axp-layout-floating-zoom-bar .__zoom-value:hover{background-color:rgb(var(--ax-sys-color-primary-500))}@supports (color: color-mix(in lab,red,red)){.axp-layout-floating-zoom-bar .__zoom-value:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
6452
6129
  }], propDecorators: { zoomLevel: [{ type: i0.Input, args: [{ isSignal: true, alias: "zoomLevel", required: false }] }], zoomIn: [{ type: i0.Output, args: ["zoomIn"] }], zoomOut: [{ type: i0.Output, args: ["zoomOut"] }], zoomReset: [{ type: i0.Output, args: ["zoomReset"] }] } });
6453
6130
 
6454
6131
  //#region ---- Header ----
@@ -6519,11 +6196,11 @@ class AXPLayoutSideDetailPanelComponent {
6519
6196
  return icon?.surfaceVars ?? {};
6520
6197
  }
6521
6198
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPLayoutSideDetailPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
6522
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPLayoutSideDetailPanelComponent, isStandalone: true, selector: "axp-layout-side-detail-panel", inputs: { multiSelectLabel: { classPropertyName: "multiSelectLabel", publicName: "multiSelectLabel", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, sections: { classPropertyName: "sections", publicName: "sections", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, rowsSectionTitle: { classPropertyName: "rowsSectionTitle", publicName: "rowsSectionTitle", isSignal: true, isRequired: false, transformFunction: null }, noRowsMessage: { classPropertyName: "noRowsMessage", publicName: "noRowsMessage", isSignal: true, isRequired: false, transformFunction: null }, emptyState: { classPropertyName: "emptyState", publicName: "emptyState", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { panelClose: "panelClose" }, queries: [{ propertyName: "projectedSections", predicate: AXPLayoutSideDetailPanelSectionDirective, isSignal: true }], ngImport: i0, template: "@if (multiSelectLabel(); as multiLabel) {\n <div class=\"__header\">\n <div class=\"__title\">\n <span class=\"axp-layout-side-detail-panel__icon\">\n <i class=\"fa-fw fa-lg fa-solid\"></i>\n </span>\n <span>{{ multiLabel }}</span>\n </div>\n <ax-button [look]=\"'blank'\" class=\"ax-sm rounded-full\" (onClick)=\"onClose()\">\n <ax-icon icon=\"fa-solid fa-xmark\"></ax-icon>\n </ax-button>\n </div>\n <div class=\"__content\"></div>\n} @else if (header(); as h) {\n <div class=\"__header\">\n <div class=\"__title\">\n @if (h.icon; as icon) {\n <span\n class=\"axp-layout-side-detail-panel__icon\"\n [class.axp-layout-side-detail-panel__icon--shortcut]=\"icon.shortcut\"\n [class.axp-layout-side-detail-panel__icon--themed]=\"!!surfaceStyle(icon)['--node-bg-color']\"\n [style.--node-bg-color]=\"surfaceStyle(icon)['--node-bg-color']\"\n >\n <i [class]=\"icon.iconClass\"></i>\n @if (icon.shortcut) {\n <i class=\"fa-light fa-up-right-from-square axp-layout-side-detail-panel__icon-arrow\" aria-hidden=\"true\"></i>\n }\n </span>\n }\n <div class=\"flex flex-col min-w-0 flex-1\">\n <span class=\"__heading-primary\">{{ h.primaryTitle }}</span>\n @if (h.secondaryTitle) {\n <span class=\"text-xs opacity-80 truncate\">{{ h.secondaryTitle }}</span>\n }\n </div>\n </div>\n <ax-button [look]=\"'blank'\" class=\"ax-sm rounded-full\" (onClick)=\"onClose()\">\n <ax-icon icon=\"fa-solid fa-xmark\"></ax-icon>\n </ax-button>\n </div>\n <div class=\"__content\">\n @if (sections().length > 0) {\n @for (section of sections(); track sectionTrack(section, $index)) {\n <div class=\"__section\">\n @if (section.title) {\n <div class=\"__title\">\n <span>{{ section.title }}</span>\n </div>\n }\n <div class=\"__content\">\n @if (section.projectionKey; as projectionKey) {\n @if (templateForProjectionKey(projectionKey); as tpl) {\n <ng-container *ngTemplateOutlet=\"tpl\" />\n }\n } @else {\n @for (row of section.rows ?? []; track row.label + '-' + $index) {\n <div class=\"__row\">\n <div class=\"__title\">\n <span>{{ row.label }}</span>\n </div>\n <div class=\"__content\">\n @if (row.format) {\n <span>{{ row.value | format: row.format | async }}</span>\n } @else {\n <span>{{ row.value ?? '---' }}</span>\n }\n </div>\n </div>\n }\n }\n </div>\n </div>\n }\n } @else if (rows().length > 0) {\n <div class=\"__section\">\n @if (rowsSectionTitle(); as sectionTitle) {\n <div class=\"__title\">\n <span>{{ sectionTitle }}</span>\n </div>\n }\n <div class=\"__content\">\n @for (row of rows(); track row.label + '-' + $index) {\n <div class=\"__row\">\n <div class=\"__title\">\n <span>{{ row.label }}</span>\n </div>\n <div class=\"__content\">\n @if (row.format) {\n <span>{{ row.value | format: row.format | async }}</span>\n } @else {\n <span>{{ row.value ?? '---' }}</span>\n }\n </div>\n </div>\n }\n </div>\n </div>\n } @else if (noRowsMessage(); as noRows) {\n <div class=\"__section\">\n <div class=\"__content\">\n <span class=\"opacity-70 text-sm\">{{ noRows }}</span>\n </div>\n </div>\n }\n </div>\n} @else if (emptyState(); as empty) {\n <div class=\"__header\">\n <div class=\"__title\">\n @if (empty.icon; as icon) {\n <span\n class=\"axp-layout-side-detail-panel__icon\"\n [class.axp-layout-side-detail-panel__icon--themed]=\"!!surfaceStyle(icon)['--node-bg-color']\"\n [style.--node-bg-color]=\"surfaceStyle(icon)['--node-bg-color']\"\n >\n <i [class]=\"icon.iconClass\"></i>\n </span>\n }\n <span class=\"__heading-primary\">{{ empty.primaryTitle }}</span>\n </div>\n <ax-button [look]=\"'blank'\" class=\"ax-sm rounded-full\" (onClick)=\"onClose()\">\n <ax-icon icon=\"fa-solid fa-xmark\"></ax-icon>\n </ax-button>\n </div>\n <div class=\"__content\">\n <div class=\"__section\">\n <div class=\"__content\">\n <span class=\"opacity-70 text-sm\">{{ empty.message }}</span>\n </div>\n </div>\n </div>\n}\n", styles: ["@layer properties;axp-layout-side-detail-panel{display:flex;height:100%;flex-direction:column;border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}@media(width>=64rem){axp-layout-side-detail-panel{min-width:calc(var(--spacing, .25rem) * 80)}}axp-layout-side-detail-panel>.__header{display:flex;flex-shrink:0;flex-direction:row;align-items:center;justify-content:space-between;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;padding:calc(var(--spacing, .25rem) * 4)}axp-layout-side-detail-panel>.__header>.__title{display:flex;width:90%;flex-direction:row;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}axp-layout-side-detail-panel>.__header>.__title .__heading-primary{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start;--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}axp-layout-side-detail-panel>.__header>.__title .axp-layout-side-detail-panel__icon{position:relative;display:flex;flex:none;align-items:center;justify-content:center;background:transparent;border:none;box-shadow:none}axp-layout-side-detail-panel>.__header>.__title .axp-layout-side-detail-panel__icon--shortcut .axp-layout-side-detail-panel__icon-arrow{position:absolute;bottom:-2px;right:-2px;font-size:.45em;opacity:.9}axp-layout-side-detail-panel>.__header>.__title .axp-layout-side-detail-panel__icon i{--tw-leading: 1;line-height:1}axp-layout-side-detail-panel>.__header>.__title .axp-layout-side-detail-panel__icon--themed i{color:rgba(var(--node-bg-color))}axp-layout-side-detail-panel>.__content{display:flex;min-height:0;flex:1;flex-direction:column;overflow-y:auto}:where(axp-layout-side-detail-panel .__content>:not(:last-child)){--tw-divide-y-reverse: 0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px * var(--tw-divide-y-reverse));border-bottom-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)))}axp-layout-side-detail-panel>.__content>.__section{display:flex;flex-direction:column;padding:calc(var(--spacing, .25rem) * 4)}axp-layout-side-detail-panel>.__content>.__section>.__title{margin-bottom:calc(var(--spacing, .25rem) * 4);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}axp-layout-side-detail-panel>.__content>.__section>.__content{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4)}axp-layout-side-detail-panel>.__content>.__section>.__content>.__row{display:flex;flex-direction:column;gap:var(--spacing, .25rem)}axp-layout-side-detail-panel>.__content>.__section>.__content>.__row>.__title{display:flex;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);opacity:90%}axp-layout-side-detail-panel>.__content>.__section>.__content>.__row>.__content{display:flex;flex-direction:row;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}axp-layout-side-detail-panel>.__content>.__section>.__content>.__row>.__content span{opacity:70%}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-divide-y-reverse{syntax: \"*\"; inherits: false; initial-value: 0;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-leading: initial;--tw-font-weight: initial;--tw-divide-y-reverse: 0}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: AXFormatModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6199
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPLayoutSideDetailPanelComponent, isStandalone: true, selector: "axp-layout-side-detail-panel", inputs: { multiSelectLabel: { classPropertyName: "multiSelectLabel", publicName: "multiSelectLabel", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, sections: { classPropertyName: "sections", publicName: "sections", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, rowsSectionTitle: { classPropertyName: "rowsSectionTitle", publicName: "rowsSectionTitle", isSignal: true, isRequired: false, transformFunction: null }, noRowsMessage: { classPropertyName: "noRowsMessage", publicName: "noRowsMessage", isSignal: true, isRequired: false, transformFunction: null }, emptyState: { classPropertyName: "emptyState", publicName: "emptyState", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { panelClose: "panelClose" }, queries: [{ propertyName: "projectedSections", predicate: AXPLayoutSideDetailPanelSectionDirective, isSignal: true }], ngImport: i0, template: "@if (multiSelectLabel(); as multiLabel) {\n <div class=\"__header\">\n <div class=\"__title\">\n <span class=\"axp-layout-side-detail-panel__icon\">\n <i class=\"fa-fw fa-lg fa-solid\"></i>\n </span>\n <span>{{ multiLabel }}</span>\n </div>\n <ax-button [look]=\"'blank'\" class=\"ax-sm rounded-full\" (onClick)=\"onClose()\">\n <ax-icon icon=\"fa-solid fa-xmark\"></ax-icon>\n </ax-button>\n </div>\n <div class=\"__content\"></div>\n} @else if (header(); as h) {\n <div class=\"__header\">\n <div class=\"__title\">\n @if (h.icon; as icon) {\n <span\n class=\"axp-layout-side-detail-panel__icon\"\n [class.axp-layout-side-detail-panel__icon--shortcut]=\"icon.shortcut\"\n [class.axp-layout-side-detail-panel__icon--themed]=\"!!surfaceStyle(icon)['--node-bg-color']\"\n [style.--node-bg-color]=\"surfaceStyle(icon)['--node-bg-color']\"\n >\n <i [class]=\"icon.iconClass\"></i>\n @if (icon.shortcut) {\n <i class=\"fa-light fa-up-right-from-square axp-layout-side-detail-panel__icon-arrow\" aria-hidden=\"true\"></i>\n }\n </span>\n }\n <div class=\"flex flex-col min-w-0 flex-1\">\n <span class=\"__heading-primary\">{{ h.primaryTitle }}</span>\n @if (h.secondaryTitle) {\n <span class=\"text-xs opacity-80 truncate\">{{ h.secondaryTitle }}</span>\n }\n </div>\n </div>\n <ax-button [look]=\"'blank'\" class=\"ax-sm rounded-full\" (onClick)=\"onClose()\">\n <ax-icon icon=\"fa-solid fa-xmark\"></ax-icon>\n </ax-button>\n </div>\n <div class=\"__content\">\n @if (sections().length > 0) {\n @for (section of sections(); track sectionTrack(section, $index)) {\n <div class=\"__section\">\n @if (section.title) {\n <div class=\"__title\">\n <span>{{ section.title }}</span>\n </div>\n }\n <div class=\"__content\">\n @if (section.projectionKey; as projectionKey) {\n @if (templateForProjectionKey(projectionKey); as tpl) {\n <ng-container *ngTemplateOutlet=\"tpl\" />\n }\n } @else {\n @for (row of section.rows ?? []; track row.label + '-' + $index) {\n <div class=\"__row\">\n <div class=\"__title\">\n <span>{{ row.label }}</span>\n </div>\n <div class=\"__content\">\n @if (row.format) {\n <span>{{ row.value | format: row.format | async }}</span>\n } @else {\n <span>{{ row.value ?? '---' }}</span>\n }\n </div>\n </div>\n }\n }\n </div>\n </div>\n }\n } @else if (rows().length > 0) {\n <div class=\"__section\">\n @if (rowsSectionTitle(); as sectionTitle) {\n <div class=\"__title\">\n <span>{{ sectionTitle }}</span>\n </div>\n }\n <div class=\"__content\">\n @for (row of rows(); track row.label + '-' + $index) {\n <div class=\"__row\">\n <div class=\"__title\">\n <span>{{ row.label }}</span>\n </div>\n <div class=\"__content\">\n @if (row.format) {\n <span>{{ row.value | format: row.format | async }}</span>\n } @else {\n <span>{{ row.value ?? '---' }}</span>\n }\n </div>\n </div>\n }\n </div>\n </div>\n } @else if (noRowsMessage(); as noRows) {\n <div class=\"__section\">\n <div class=\"__content\">\n <span class=\"opacity-70 text-sm\">{{ noRows }}</span>\n </div>\n </div>\n }\n </div>\n} @else if (emptyState(); as empty) {\n <div class=\"__header\">\n <div class=\"__title\">\n @if (empty.icon; as icon) {\n <span\n class=\"axp-layout-side-detail-panel__icon\"\n [class.axp-layout-side-detail-panel__icon--themed]=\"!!surfaceStyle(icon)['--node-bg-color']\"\n [style.--node-bg-color]=\"surfaceStyle(icon)['--node-bg-color']\"\n >\n <i [class]=\"icon.iconClass\"></i>\n </span>\n }\n <span class=\"__heading-primary\">{{ empty.primaryTitle }}</span>\n </div>\n <ax-button [look]=\"'blank'\" class=\"ax-sm rounded-full\" (onClick)=\"onClose()\">\n <ax-icon icon=\"fa-solid fa-xmark\"></ax-icon>\n </ax-button>\n </div>\n <div class=\"__content\">\n <div class=\"__section\">\n <div class=\"__content\">\n <span class=\"opacity-70 text-sm\">{{ empty.message }}</span>\n </div>\n </div>\n </div>\n}\n", styles: ["@layer properties;axp-layout-side-detail-panel{display:flex;height:100%;flex-direction:column;border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}@media(width>=64rem){axp-layout-side-detail-panel{min-width:calc(var(--spacing, .25rem) * 80)}}axp-layout-side-detail-panel>.__header{display:flex;flex-shrink:0;flex-direction:row;align-items:center;justify-content:space-between;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;padding:calc(var(--spacing, .25rem) * 4)}axp-layout-side-detail-panel>.__header>.__title{display:flex;width:90%;flex-direction:row;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}axp-layout-side-detail-panel>.__header>.__title .__heading-primary{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start;--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}axp-layout-side-detail-panel>.__header>.__title .axp-layout-side-detail-panel__icon{position:relative;display:flex;flex:none;align-items:center;justify-content:center;background:transparent;border:none;box-shadow:none}axp-layout-side-detail-panel>.__header>.__title .axp-layout-side-detail-panel__icon.axp-layout-side-detail-panel__icon--shortcut .axp-layout-side-detail-panel__icon-arrow{position:absolute;bottom:-2px;right:-2px;font-size:.45em;opacity:.9}axp-layout-side-detail-panel>.__header>.__title .axp-layout-side-detail-panel__icon i{--tw-leading: 1;line-height:1}axp-layout-side-detail-panel>.__header>.__title .axp-layout-side-detail-panel__icon.axp-layout-side-detail-panel__icon--themed i{color:rgba(var(--node-bg-color))}axp-layout-side-detail-panel>.__content{display:flex;min-height:0;flex:1;flex-direction:column;overflow-y:auto}:where(axp-layout-side-detail-panel .__content>:not(:last-child)){--tw-divide-y-reverse: 0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px * var(--tw-divide-y-reverse));border-bottom-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)))}axp-layout-side-detail-panel>.__content>.__section{display:flex;flex-direction:column;padding:calc(var(--spacing, .25rem) * 4)}axp-layout-side-detail-panel>.__content>.__section>.__title{margin-bottom:calc(var(--spacing, .25rem) * 4);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}axp-layout-side-detail-panel>.__content>.__section>.__content{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4)}axp-layout-side-detail-panel>.__content>.__section>.__content>.__row{display:flex;flex-direction:column;gap:var(--spacing, .25rem)}axp-layout-side-detail-panel>.__content>.__section>.__content>.__row>.__title{display:flex;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);opacity:90%}axp-layout-side-detail-panel>.__content>.__section>.__content>.__row>.__content{display:flex;flex-direction:row;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}axp-layout-side-detail-panel>.__content>.__section>.__content>.__row>.__content span{opacity:70%}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-divide-y-reverse{syntax: \"*\"; inherits: false; initial-value: 0;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-leading: initial;--tw-font-weight: initial;--tw-divide-y-reverse: 0}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: AXFormatModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6523
6200
  }
6524
6201
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPLayoutSideDetailPanelComponent, decorators: [{
6525
6202
  type: Component,
6526
- args: [{ selector: 'axp-layout-side-detail-panel', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [CommonModule, AXDecoratorModule, AXButtonModule, AXFormatModule], template: "@if (multiSelectLabel(); as multiLabel) {\n <div class=\"__header\">\n <div class=\"__title\">\n <span class=\"axp-layout-side-detail-panel__icon\">\n <i class=\"fa-fw fa-lg fa-solid\"></i>\n </span>\n <span>{{ multiLabel }}</span>\n </div>\n <ax-button [look]=\"'blank'\" class=\"ax-sm rounded-full\" (onClick)=\"onClose()\">\n <ax-icon icon=\"fa-solid fa-xmark\"></ax-icon>\n </ax-button>\n </div>\n <div class=\"__content\"></div>\n} @else if (header(); as h) {\n <div class=\"__header\">\n <div class=\"__title\">\n @if (h.icon; as icon) {\n <span\n class=\"axp-layout-side-detail-panel__icon\"\n [class.axp-layout-side-detail-panel__icon--shortcut]=\"icon.shortcut\"\n [class.axp-layout-side-detail-panel__icon--themed]=\"!!surfaceStyle(icon)['--node-bg-color']\"\n [style.--node-bg-color]=\"surfaceStyle(icon)['--node-bg-color']\"\n >\n <i [class]=\"icon.iconClass\"></i>\n @if (icon.shortcut) {\n <i class=\"fa-light fa-up-right-from-square axp-layout-side-detail-panel__icon-arrow\" aria-hidden=\"true\"></i>\n }\n </span>\n }\n <div class=\"flex flex-col min-w-0 flex-1\">\n <span class=\"__heading-primary\">{{ h.primaryTitle }}</span>\n @if (h.secondaryTitle) {\n <span class=\"text-xs opacity-80 truncate\">{{ h.secondaryTitle }}</span>\n }\n </div>\n </div>\n <ax-button [look]=\"'blank'\" class=\"ax-sm rounded-full\" (onClick)=\"onClose()\">\n <ax-icon icon=\"fa-solid fa-xmark\"></ax-icon>\n </ax-button>\n </div>\n <div class=\"__content\">\n @if (sections().length > 0) {\n @for (section of sections(); track sectionTrack(section, $index)) {\n <div class=\"__section\">\n @if (section.title) {\n <div class=\"__title\">\n <span>{{ section.title }}</span>\n </div>\n }\n <div class=\"__content\">\n @if (section.projectionKey; as projectionKey) {\n @if (templateForProjectionKey(projectionKey); as tpl) {\n <ng-container *ngTemplateOutlet=\"tpl\" />\n }\n } @else {\n @for (row of section.rows ?? []; track row.label + '-' + $index) {\n <div class=\"__row\">\n <div class=\"__title\">\n <span>{{ row.label }}</span>\n </div>\n <div class=\"__content\">\n @if (row.format) {\n <span>{{ row.value | format: row.format | async }}</span>\n } @else {\n <span>{{ row.value ?? '---' }}</span>\n }\n </div>\n </div>\n }\n }\n </div>\n </div>\n }\n } @else if (rows().length > 0) {\n <div class=\"__section\">\n @if (rowsSectionTitle(); as sectionTitle) {\n <div class=\"__title\">\n <span>{{ sectionTitle }}</span>\n </div>\n }\n <div class=\"__content\">\n @for (row of rows(); track row.label + '-' + $index) {\n <div class=\"__row\">\n <div class=\"__title\">\n <span>{{ row.label }}</span>\n </div>\n <div class=\"__content\">\n @if (row.format) {\n <span>{{ row.value | format: row.format | async }}</span>\n } @else {\n <span>{{ row.value ?? '---' }}</span>\n }\n </div>\n </div>\n }\n </div>\n </div>\n } @else if (noRowsMessage(); as noRows) {\n <div class=\"__section\">\n <div class=\"__content\">\n <span class=\"opacity-70 text-sm\">{{ noRows }}</span>\n </div>\n </div>\n }\n </div>\n} @else if (emptyState(); as empty) {\n <div class=\"__header\">\n <div class=\"__title\">\n @if (empty.icon; as icon) {\n <span\n class=\"axp-layout-side-detail-panel__icon\"\n [class.axp-layout-side-detail-panel__icon--themed]=\"!!surfaceStyle(icon)['--node-bg-color']\"\n [style.--node-bg-color]=\"surfaceStyle(icon)['--node-bg-color']\"\n >\n <i [class]=\"icon.iconClass\"></i>\n </span>\n }\n <span class=\"__heading-primary\">{{ empty.primaryTitle }}</span>\n </div>\n <ax-button [look]=\"'blank'\" class=\"ax-sm rounded-full\" (onClick)=\"onClose()\">\n <ax-icon icon=\"fa-solid fa-xmark\"></ax-icon>\n </ax-button>\n </div>\n <div class=\"__content\">\n <div class=\"__section\">\n <div class=\"__content\">\n <span class=\"opacity-70 text-sm\">{{ empty.message }}</span>\n </div>\n </div>\n </div>\n}\n", styles: ["@layer properties;axp-layout-side-detail-panel{display:flex;height:100%;flex-direction:column;border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}@media(width>=64rem){axp-layout-side-detail-panel{min-width:calc(var(--spacing, .25rem) * 80)}}axp-layout-side-detail-panel>.__header{display:flex;flex-shrink:0;flex-direction:row;align-items:center;justify-content:space-between;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;padding:calc(var(--spacing, .25rem) * 4)}axp-layout-side-detail-panel>.__header>.__title{display:flex;width:90%;flex-direction:row;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}axp-layout-side-detail-panel>.__header>.__title .__heading-primary{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start;--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}axp-layout-side-detail-panel>.__header>.__title .axp-layout-side-detail-panel__icon{position:relative;display:flex;flex:none;align-items:center;justify-content:center;background:transparent;border:none;box-shadow:none}axp-layout-side-detail-panel>.__header>.__title .axp-layout-side-detail-panel__icon--shortcut .axp-layout-side-detail-panel__icon-arrow{position:absolute;bottom:-2px;right:-2px;font-size:.45em;opacity:.9}axp-layout-side-detail-panel>.__header>.__title .axp-layout-side-detail-panel__icon i{--tw-leading: 1;line-height:1}axp-layout-side-detail-panel>.__header>.__title .axp-layout-side-detail-panel__icon--themed i{color:rgba(var(--node-bg-color))}axp-layout-side-detail-panel>.__content{display:flex;min-height:0;flex:1;flex-direction:column;overflow-y:auto}:where(axp-layout-side-detail-panel .__content>:not(:last-child)){--tw-divide-y-reverse: 0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px * var(--tw-divide-y-reverse));border-bottom-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)))}axp-layout-side-detail-panel>.__content>.__section{display:flex;flex-direction:column;padding:calc(var(--spacing, .25rem) * 4)}axp-layout-side-detail-panel>.__content>.__section>.__title{margin-bottom:calc(var(--spacing, .25rem) * 4);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}axp-layout-side-detail-panel>.__content>.__section>.__content{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4)}axp-layout-side-detail-panel>.__content>.__section>.__content>.__row{display:flex;flex-direction:column;gap:var(--spacing, .25rem)}axp-layout-side-detail-panel>.__content>.__section>.__content>.__row>.__title{display:flex;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);opacity:90%}axp-layout-side-detail-panel>.__content>.__section>.__content>.__row>.__content{display:flex;flex-direction:row;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}axp-layout-side-detail-panel>.__content>.__section>.__content>.__row>.__content span{opacity:70%}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-divide-y-reverse{syntax: \"*\"; inherits: false; initial-value: 0;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-leading: initial;--tw-font-weight: initial;--tw-divide-y-reverse: 0}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
6203
+ args: [{ selector: 'axp-layout-side-detail-panel', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [CommonModule, AXDecoratorModule, AXButtonModule, AXFormatModule], template: "@if (multiSelectLabel(); as multiLabel) {\n <div class=\"__header\">\n <div class=\"__title\">\n <span class=\"axp-layout-side-detail-panel__icon\">\n <i class=\"fa-fw fa-lg fa-solid\"></i>\n </span>\n <span>{{ multiLabel }}</span>\n </div>\n <ax-button [look]=\"'blank'\" class=\"ax-sm rounded-full\" (onClick)=\"onClose()\">\n <ax-icon icon=\"fa-solid fa-xmark\"></ax-icon>\n </ax-button>\n </div>\n <div class=\"__content\"></div>\n} @else if (header(); as h) {\n <div class=\"__header\">\n <div class=\"__title\">\n @if (h.icon; as icon) {\n <span\n class=\"axp-layout-side-detail-panel__icon\"\n [class.axp-layout-side-detail-panel__icon--shortcut]=\"icon.shortcut\"\n [class.axp-layout-side-detail-panel__icon--themed]=\"!!surfaceStyle(icon)['--node-bg-color']\"\n [style.--node-bg-color]=\"surfaceStyle(icon)['--node-bg-color']\"\n >\n <i [class]=\"icon.iconClass\"></i>\n @if (icon.shortcut) {\n <i class=\"fa-light fa-up-right-from-square axp-layout-side-detail-panel__icon-arrow\" aria-hidden=\"true\"></i>\n }\n </span>\n }\n <div class=\"flex flex-col min-w-0 flex-1\">\n <span class=\"__heading-primary\">{{ h.primaryTitle }}</span>\n @if (h.secondaryTitle) {\n <span class=\"text-xs opacity-80 truncate\">{{ h.secondaryTitle }}</span>\n }\n </div>\n </div>\n <ax-button [look]=\"'blank'\" class=\"ax-sm rounded-full\" (onClick)=\"onClose()\">\n <ax-icon icon=\"fa-solid fa-xmark\"></ax-icon>\n </ax-button>\n </div>\n <div class=\"__content\">\n @if (sections().length > 0) {\n @for (section of sections(); track sectionTrack(section, $index)) {\n <div class=\"__section\">\n @if (section.title) {\n <div class=\"__title\">\n <span>{{ section.title }}</span>\n </div>\n }\n <div class=\"__content\">\n @if (section.projectionKey; as projectionKey) {\n @if (templateForProjectionKey(projectionKey); as tpl) {\n <ng-container *ngTemplateOutlet=\"tpl\" />\n }\n } @else {\n @for (row of section.rows ?? []; track row.label + '-' + $index) {\n <div class=\"__row\">\n <div class=\"__title\">\n <span>{{ row.label }}</span>\n </div>\n <div class=\"__content\">\n @if (row.format) {\n <span>{{ row.value | format: row.format | async }}</span>\n } @else {\n <span>{{ row.value ?? '---' }}</span>\n }\n </div>\n </div>\n }\n }\n </div>\n </div>\n }\n } @else if (rows().length > 0) {\n <div class=\"__section\">\n @if (rowsSectionTitle(); as sectionTitle) {\n <div class=\"__title\">\n <span>{{ sectionTitle }}</span>\n </div>\n }\n <div class=\"__content\">\n @for (row of rows(); track row.label + '-' + $index) {\n <div class=\"__row\">\n <div class=\"__title\">\n <span>{{ row.label }}</span>\n </div>\n <div class=\"__content\">\n @if (row.format) {\n <span>{{ row.value | format: row.format | async }}</span>\n } @else {\n <span>{{ row.value ?? '---' }}</span>\n }\n </div>\n </div>\n }\n </div>\n </div>\n } @else if (noRowsMessage(); as noRows) {\n <div class=\"__section\">\n <div class=\"__content\">\n <span class=\"opacity-70 text-sm\">{{ noRows }}</span>\n </div>\n </div>\n }\n </div>\n} @else if (emptyState(); as empty) {\n <div class=\"__header\">\n <div class=\"__title\">\n @if (empty.icon; as icon) {\n <span\n class=\"axp-layout-side-detail-panel__icon\"\n [class.axp-layout-side-detail-panel__icon--themed]=\"!!surfaceStyle(icon)['--node-bg-color']\"\n [style.--node-bg-color]=\"surfaceStyle(icon)['--node-bg-color']\"\n >\n <i [class]=\"icon.iconClass\"></i>\n </span>\n }\n <span class=\"__heading-primary\">{{ empty.primaryTitle }}</span>\n </div>\n <ax-button [look]=\"'blank'\" class=\"ax-sm rounded-full\" (onClick)=\"onClose()\">\n <ax-icon icon=\"fa-solid fa-xmark\"></ax-icon>\n </ax-button>\n </div>\n <div class=\"__content\">\n <div class=\"__section\">\n <div class=\"__content\">\n <span class=\"opacity-70 text-sm\">{{ empty.message }}</span>\n </div>\n </div>\n </div>\n}\n", styles: ["@layer properties;axp-layout-side-detail-panel{display:flex;height:100%;flex-direction:column;border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}@media(width>=64rem){axp-layout-side-detail-panel{min-width:calc(var(--spacing, .25rem) * 80)}}axp-layout-side-detail-panel>.__header{display:flex;flex-shrink:0;flex-direction:row;align-items:center;justify-content:space-between;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;padding:calc(var(--spacing, .25rem) * 4)}axp-layout-side-detail-panel>.__header>.__title{display:flex;width:90%;flex-direction:row;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}axp-layout-side-detail-panel>.__header>.__title .__heading-primary{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start;--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}axp-layout-side-detail-panel>.__header>.__title .axp-layout-side-detail-panel__icon{position:relative;display:flex;flex:none;align-items:center;justify-content:center;background:transparent;border:none;box-shadow:none}axp-layout-side-detail-panel>.__header>.__title .axp-layout-side-detail-panel__icon.axp-layout-side-detail-panel__icon--shortcut .axp-layout-side-detail-panel__icon-arrow{position:absolute;bottom:-2px;right:-2px;font-size:.45em;opacity:.9}axp-layout-side-detail-panel>.__header>.__title .axp-layout-side-detail-panel__icon i{--tw-leading: 1;line-height:1}axp-layout-side-detail-panel>.__header>.__title .axp-layout-side-detail-panel__icon.axp-layout-side-detail-panel__icon--themed i{color:rgba(var(--node-bg-color))}axp-layout-side-detail-panel>.__content{display:flex;min-height:0;flex:1;flex-direction:column;overflow-y:auto}:where(axp-layout-side-detail-panel .__content>:not(:last-child)){--tw-divide-y-reverse: 0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px * var(--tw-divide-y-reverse));border-bottom-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)))}axp-layout-side-detail-panel>.__content>.__section{display:flex;flex-direction:column;padding:calc(var(--spacing, .25rem) * 4)}axp-layout-side-detail-panel>.__content>.__section>.__title{margin-bottom:calc(var(--spacing, .25rem) * 4);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}axp-layout-side-detail-panel>.__content>.__section>.__content{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4)}axp-layout-side-detail-panel>.__content>.__section>.__content>.__row{display:flex;flex-direction:column;gap:var(--spacing, .25rem)}axp-layout-side-detail-panel>.__content>.__section>.__content>.__row>.__title{display:flex;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);opacity:90%}axp-layout-side-detail-panel>.__content>.__section>.__content>.__row>.__content{display:flex;flex-direction:row;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}axp-layout-side-detail-panel>.__content>.__section>.__content>.__row>.__content span{opacity:70%}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-divide-y-reverse{syntax: \"*\"; inherits: false; initial-value: 0;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-leading: initial;--tw-font-weight: initial;--tw-divide-y-reverse: 0}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
6527
6204
  }], propDecorators: { multiSelectLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiSelectLabel", required: false }] }], header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], sections: [{ type: i0.Input, args: [{ isSignal: true, alias: "sections", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], rowsSectionTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowsSectionTitle", required: false }] }], noRowsMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "noRowsMessage", required: false }] }], emptyState: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyState", required: false }] }], panelClose: [{ type: i0.Output, args: ["panelClose"] }], projectedSections: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => AXPLayoutSideDetailPanelSectionDirective), { isSignal: true }] }] } });
6528
6205
 
6529
6206
  //#endregion
@@ -6712,7 +6389,7 @@ class AXPMarkdownViewerComponent {
6712
6389
  }
6713
6390
  }
6714
6391
  </section>
6715
- `, isInline: true, styles: [".axp-markdown-viewer{display:block}.axp-markdown-viewer__content{display:block;font-size:.95rem;line-height:1.75;color:var(--ax-color-text, inherit);word-break:break-word;white-space:nowrap;text-wrap:wrap}.axp-markdown-viewer__content h1,.axp-markdown-viewer__content h2,.axp-markdown-viewer__content h3,.axp-markdown-viewer__content h4,.axp-markdown-viewer__content h5,.axp-markdown-viewer__content h6{display:block;margin:0;line-height:1.35;font-weight:600;letter-spacing:.01em}.axp-markdown-viewer__content h1{font-size:1.7rem!important}.axp-markdown-viewer__content h2{font-size:1.45rem!important}.axp-markdown-viewer__content h3{font-size:1.25rem!important}.axp-markdown-viewer__content h4{font-size:1.1rem!important}.axp-markdown-viewer__content h5{font-size:1rem!important}.axp-markdown-viewer__content h6{font-size:.92rem!important;opacity:.9}.axp-markdown-viewer__content p{margin:0}.axp-markdown-viewer__content ul{margin:0;padding-inline-start:1.25rem;list-style-type:disc;list-style-position:outside}.axp-markdown-viewer__content ol{margin:0;padding-inline-start:1.35rem;list-style-type:decimal;list-style-position:outside}.axp-markdown-viewer__content li{margin:0;line-height:1.75;padding-inline-start:.25rem}.axp-markdown-viewer__content ul ul,.axp-markdown-viewer__content ul ol,.axp-markdown-viewer__content ol ul,.axp-markdown-viewer__content ol ol{margin:0}.axp-markdown-viewer__content ul ul{list-style-type:circle}.axp-markdown-viewer__content blockquote{margin:0;padding:.45rem .65rem;border-inline-start:3px solid rgba(var(--ax-sys-color-primary),.35);background:rgba(var(--ax-sys-color-primary),.06);border-radius:.25rem}.axp-markdown-viewer__content hr{border:0;border-top:1px solid var(--ax-color-ghost, rgba(0, 0, 0, .16));margin:0}.axp-markdown-viewer__content code{font-family:var(--ax-font-mono, monospace);font-size:.9em;padding:.1rem .3rem;border-radius:.25rem;background:var(--ax-color-ghost, rgba(0, 0, 0, .06))}.axp-markdown-viewer__content pre{margin:0}.axp-markdown-viewer__content table{width:100%;border-collapse:collapse;margin:0}.axp-markdown-viewer__content th,.axp-markdown-viewer__content td{border:1px solid var(--ax-color-ghost, rgba(0, 0, 0, .12));padding:.35rem .5rem;text-align:start}.axp-markdown-viewer__content a{text-decoration:underline}.axp-markdown-viewer__content img{max-width:100%;height:auto;border-radius:.35rem}.axp-markdown-viewer__content details{margin:0;padding:.35rem .55rem;border:1px solid var(--ax-color-ghost, rgba(0, 0, 0, .12));border-radius:.35rem}.axp-markdown-viewer__content summary{cursor:pointer;font-weight:600}.axp-markdown-viewer__content sup{line-height:0;font-size:.75em}.axp-markdown-viewer__content .footnotes{margin:0;padding-top:.5rem;border-top:1px dashed var(--ax-color-ghost, rgba(0, 0, 0, .16))}.axp-markdown-viewer__content ul.contains-task-list{list-style:none;padding-inline-start:.2rem}.axp-markdown-viewer__content .task-list-item{list-style:none}.axp-markdown-viewer__content .task-list-item input[type=checkbox]{margin:0;transform:translateY(1px)}.axp-markdown-viewer__code{margin:0;padding:.75rem 1rem;border-radius:.5rem;background-color:var(--ax-surface-secondary, #111827);color:var(--ax-text-on-primary, #f9fafb);overflow:auto}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6392
+ `, isInline: true, styles: ["@layer properties;.axp-markdown-viewer{display:block}.axp-markdown-viewer .axp-markdown-viewer__content{display:block;overflow-wrap:break-word;font-size:.95rem;line-height:1.75;color:var(--ax-color-text, inherit);white-space:nowrap;text-wrap:wrap}.axp-markdown-viewer .axp-markdown-viewer__content h1,.axp-markdown-viewer .axp-markdown-viewer__content h2,.axp-markdown-viewer .axp-markdown-viewer__content h3,.axp-markdown-viewer .axp-markdown-viewer__content h4,.axp-markdown-viewer .axp-markdown-viewer__content h5,.axp-markdown-viewer .axp-markdown-viewer__content h6{display:block;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);margin:0;line-height:1.35;letter-spacing:.01em}.axp-markdown-viewer .axp-markdown-viewer__content h1{font-size:1.7rem!important}.axp-markdown-viewer .axp-markdown-viewer__content h2{font-size:1.45rem!important}.axp-markdown-viewer .axp-markdown-viewer__content h3{font-size:1.25rem!important}.axp-markdown-viewer .axp-markdown-viewer__content h4{font-size:1.1rem!important}.axp-markdown-viewer .axp-markdown-viewer__content h5{font-size:1rem!important}.axp-markdown-viewer .axp-markdown-viewer__content h6{font-size:.92rem!important;opacity:.9}.axp-markdown-viewer .axp-markdown-viewer__content p{margin:0}.axp-markdown-viewer .axp-markdown-viewer__content ul{margin:0;padding-inline-start:1.25rem;list-style-type:disc;list-style-position:outside}.axp-markdown-viewer .axp-markdown-viewer__content ol{margin:0;padding-inline-start:1.35rem;list-style-type:decimal;list-style-position:outside}.axp-markdown-viewer .axp-markdown-viewer__content li{margin:0;line-height:1.75;padding-inline-start:.25rem}.axp-markdown-viewer .axp-markdown-viewer__content ul ul,.axp-markdown-viewer .axp-markdown-viewer__content ul ol,.axp-markdown-viewer .axp-markdown-viewer__content ol ul,.axp-markdown-viewer .axp-markdown-viewer__content ol ol{margin:0}.axp-markdown-viewer .axp-markdown-viewer__content ul ul{list-style-type:circle}.axp-markdown-viewer .axp-markdown-viewer__content blockquote{margin:0;border-radius:.25rem;padding:.45rem .65rem;border-inline-start:3px solid rgba(var(--ax-sys-color-primary),.35);background:rgba(var(--ax-sys-color-primary),.06)}.axp-markdown-viewer .axp-markdown-viewer__content hr{margin:0;border-style:var(--tw-border-style);border-width:0px;border-top:1px solid var(--ax-color-ghost, rgba(0, 0, 0, .16))}.axp-markdown-viewer .axp-markdown-viewer__content code{border-radius:.25rem;font-family:var(--ax-font-mono, monospace);font-size:.9em;padding:.1rem .3rem;background:var(--ax-color-ghost, rgba(0, 0, 0, .06))}.axp-markdown-viewer .axp-markdown-viewer__content pre{margin:0}.axp-markdown-viewer .axp-markdown-viewer__content table{margin:0;width:100%;border-collapse:collapse}.axp-markdown-viewer .axp-markdown-viewer__content th,.axp-markdown-viewer .axp-markdown-viewer__content td{text-align:start;border:1px solid var(--ax-color-ghost, rgba(0, 0, 0, .12));padding:.35rem .5rem}.axp-markdown-viewer .axp-markdown-viewer__content a{text-decoration-line:underline}.axp-markdown-viewer .axp-markdown-viewer__content img{height:auto;max-width:100%;border-radius:.25rem}.axp-markdown-viewer .axp-markdown-viewer__content details{margin:0;border-radius:.25rem;padding:.35rem .55rem;border:1px solid var(--ax-color-ghost, rgba(0, 0, 0, .12))}.axp-markdown-viewer .axp-markdown-viewer__content summary{cursor:pointer;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-markdown-viewer .axp-markdown-viewer__content sup{font-size:.75em;line-height:0}.axp-markdown-viewer .axp-markdown-viewer__content .footnotes{margin:0;padding-top:calc(var(--spacing, .25rem) * 2);border-top:1px dashed var(--ax-color-ghost, rgba(0, 0, 0, .16))}.axp-markdown-viewer .axp-markdown-viewer__content ul.contains-task-list{list-style-type:none;padding-inline-start:.2rem}.axp-markdown-viewer .axp-markdown-viewer__content .task-list-item{list-style-type:none}.axp-markdown-viewer .axp-markdown-viewer__content .task-list-item input[type=checkbox]{margin:0;transform:translateY(1px)}.axp-markdown-viewer .axp-markdown-viewer__code{margin:0;overflow:auto;border-radius:var(--radius-lg, .5rem);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);background-color:var(--ax-surface-secondary, #111827);color:var(--ax-text-on-primary, #f9fafb)}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial;--tw-border-style: solid}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6716
6393
  }
6717
6394
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPMarkdownViewerComponent, decorators: [{
6718
6395
  type: Component,
@@ -6742,7 +6419,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
6742
6419
  }
6743
6420
  }
6744
6421
  </section>
6745
- `, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".axp-markdown-viewer{display:block}.axp-markdown-viewer__content{display:block;font-size:.95rem;line-height:1.75;color:var(--ax-color-text, inherit);word-break:break-word;white-space:nowrap;text-wrap:wrap}.axp-markdown-viewer__content h1,.axp-markdown-viewer__content h2,.axp-markdown-viewer__content h3,.axp-markdown-viewer__content h4,.axp-markdown-viewer__content h5,.axp-markdown-viewer__content h6{display:block;margin:0;line-height:1.35;font-weight:600;letter-spacing:.01em}.axp-markdown-viewer__content h1{font-size:1.7rem!important}.axp-markdown-viewer__content h2{font-size:1.45rem!important}.axp-markdown-viewer__content h3{font-size:1.25rem!important}.axp-markdown-viewer__content h4{font-size:1.1rem!important}.axp-markdown-viewer__content h5{font-size:1rem!important}.axp-markdown-viewer__content h6{font-size:.92rem!important;opacity:.9}.axp-markdown-viewer__content p{margin:0}.axp-markdown-viewer__content ul{margin:0;padding-inline-start:1.25rem;list-style-type:disc;list-style-position:outside}.axp-markdown-viewer__content ol{margin:0;padding-inline-start:1.35rem;list-style-type:decimal;list-style-position:outside}.axp-markdown-viewer__content li{margin:0;line-height:1.75;padding-inline-start:.25rem}.axp-markdown-viewer__content ul ul,.axp-markdown-viewer__content ul ol,.axp-markdown-viewer__content ol ul,.axp-markdown-viewer__content ol ol{margin:0}.axp-markdown-viewer__content ul ul{list-style-type:circle}.axp-markdown-viewer__content blockquote{margin:0;padding:.45rem .65rem;border-inline-start:3px solid rgba(var(--ax-sys-color-primary),.35);background:rgba(var(--ax-sys-color-primary),.06);border-radius:.25rem}.axp-markdown-viewer__content hr{border:0;border-top:1px solid var(--ax-color-ghost, rgba(0, 0, 0, .16));margin:0}.axp-markdown-viewer__content code{font-family:var(--ax-font-mono, monospace);font-size:.9em;padding:.1rem .3rem;border-radius:.25rem;background:var(--ax-color-ghost, rgba(0, 0, 0, .06))}.axp-markdown-viewer__content pre{margin:0}.axp-markdown-viewer__content table{width:100%;border-collapse:collapse;margin:0}.axp-markdown-viewer__content th,.axp-markdown-viewer__content td{border:1px solid var(--ax-color-ghost, rgba(0, 0, 0, .12));padding:.35rem .5rem;text-align:start}.axp-markdown-viewer__content a{text-decoration:underline}.axp-markdown-viewer__content img{max-width:100%;height:auto;border-radius:.35rem}.axp-markdown-viewer__content details{margin:0;padding:.35rem .55rem;border:1px solid var(--ax-color-ghost, rgba(0, 0, 0, .12));border-radius:.35rem}.axp-markdown-viewer__content summary{cursor:pointer;font-weight:600}.axp-markdown-viewer__content sup{line-height:0;font-size:.75em}.axp-markdown-viewer__content .footnotes{margin:0;padding-top:.5rem;border-top:1px dashed var(--ax-color-ghost, rgba(0, 0, 0, .16))}.axp-markdown-viewer__content ul.contains-task-list{list-style:none;padding-inline-start:.2rem}.axp-markdown-viewer__content .task-list-item{list-style:none}.axp-markdown-viewer__content .task-list-item input[type=checkbox]{margin:0;transform:translateY(1px)}.axp-markdown-viewer__code{margin:0;padding:.75rem 1rem;border-radius:.5rem;background-color:var(--ax-surface-secondary, #111827);color:var(--ax-text-on-primary, #f9fafb);overflow:auto}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
6422
+ `, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer properties;.axp-markdown-viewer{display:block}.axp-markdown-viewer .axp-markdown-viewer__content{display:block;overflow-wrap:break-word;font-size:.95rem;line-height:1.75;color:var(--ax-color-text, inherit);white-space:nowrap;text-wrap:wrap}.axp-markdown-viewer .axp-markdown-viewer__content h1,.axp-markdown-viewer .axp-markdown-viewer__content h2,.axp-markdown-viewer .axp-markdown-viewer__content h3,.axp-markdown-viewer .axp-markdown-viewer__content h4,.axp-markdown-viewer .axp-markdown-viewer__content h5,.axp-markdown-viewer .axp-markdown-viewer__content h6{display:block;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);margin:0;line-height:1.35;letter-spacing:.01em}.axp-markdown-viewer .axp-markdown-viewer__content h1{font-size:1.7rem!important}.axp-markdown-viewer .axp-markdown-viewer__content h2{font-size:1.45rem!important}.axp-markdown-viewer .axp-markdown-viewer__content h3{font-size:1.25rem!important}.axp-markdown-viewer .axp-markdown-viewer__content h4{font-size:1.1rem!important}.axp-markdown-viewer .axp-markdown-viewer__content h5{font-size:1rem!important}.axp-markdown-viewer .axp-markdown-viewer__content h6{font-size:.92rem!important;opacity:.9}.axp-markdown-viewer .axp-markdown-viewer__content p{margin:0}.axp-markdown-viewer .axp-markdown-viewer__content ul{margin:0;padding-inline-start:1.25rem;list-style-type:disc;list-style-position:outside}.axp-markdown-viewer .axp-markdown-viewer__content ol{margin:0;padding-inline-start:1.35rem;list-style-type:decimal;list-style-position:outside}.axp-markdown-viewer .axp-markdown-viewer__content li{margin:0;line-height:1.75;padding-inline-start:.25rem}.axp-markdown-viewer .axp-markdown-viewer__content ul ul,.axp-markdown-viewer .axp-markdown-viewer__content ul ol,.axp-markdown-viewer .axp-markdown-viewer__content ol ul,.axp-markdown-viewer .axp-markdown-viewer__content ol ol{margin:0}.axp-markdown-viewer .axp-markdown-viewer__content ul ul{list-style-type:circle}.axp-markdown-viewer .axp-markdown-viewer__content blockquote{margin:0;border-radius:.25rem;padding:.45rem .65rem;border-inline-start:3px solid rgba(var(--ax-sys-color-primary),.35);background:rgba(var(--ax-sys-color-primary),.06)}.axp-markdown-viewer .axp-markdown-viewer__content hr{margin:0;border-style:var(--tw-border-style);border-width:0px;border-top:1px solid var(--ax-color-ghost, rgba(0, 0, 0, .16))}.axp-markdown-viewer .axp-markdown-viewer__content code{border-radius:.25rem;font-family:var(--ax-font-mono, monospace);font-size:.9em;padding:.1rem .3rem;background:var(--ax-color-ghost, rgba(0, 0, 0, .06))}.axp-markdown-viewer .axp-markdown-viewer__content pre{margin:0}.axp-markdown-viewer .axp-markdown-viewer__content table{margin:0;width:100%;border-collapse:collapse}.axp-markdown-viewer .axp-markdown-viewer__content th,.axp-markdown-viewer .axp-markdown-viewer__content td{text-align:start;border:1px solid var(--ax-color-ghost, rgba(0, 0, 0, .12));padding:.35rem .5rem}.axp-markdown-viewer .axp-markdown-viewer__content a{text-decoration-line:underline}.axp-markdown-viewer .axp-markdown-viewer__content img{height:auto;max-width:100%;border-radius:.25rem}.axp-markdown-viewer .axp-markdown-viewer__content details{margin:0;border-radius:.25rem;padding:.35rem .55rem;border:1px solid var(--ax-color-ghost, rgba(0, 0, 0, .12))}.axp-markdown-viewer .axp-markdown-viewer__content summary{cursor:pointer;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-markdown-viewer .axp-markdown-viewer__content sup{font-size:.75em;line-height:0}.axp-markdown-viewer .axp-markdown-viewer__content .footnotes{margin:0;padding-top:calc(var(--spacing, .25rem) * 2);border-top:1px dashed var(--ax-color-ghost, rgba(0, 0, 0, .16))}.axp-markdown-viewer .axp-markdown-viewer__content ul.contains-task-list{list-style-type:none;padding-inline-start:.2rem}.axp-markdown-viewer .axp-markdown-viewer__content .task-list-item{list-style-type:none}.axp-markdown-viewer .axp-markdown-viewer__content .task-list-item input[type=checkbox]{margin:0;transform:translateY(1px)}.axp-markdown-viewer .axp-markdown-viewer__code{margin:0;overflow:auto;border-radius:var(--radius-lg, .5rem);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);background-color:var(--ax-surface-secondary, #111827);color:var(--ax-text-on-primary, #f9fafb)}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial;--tw-border-style: solid}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
6746
6423
  }], ctorParameters: () => [], propDecorators: { markdown: [{ type: i0.Input, args: [{ isSignal: true, alias: "markdown", required: false }] }], templates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => AXPMarkdownTemplateDirective), { isSignal: true }] }] } });
6747
6424
  /**
6748
6425
  * Lazy-loaded from workspace `node_modules`. Must stay as literal string specifiers (not variables,
@@ -7299,7 +6976,7 @@ class AXPMenuCustomizerComponent {
7299
6976
  this.toastService.warning(message);
7300
6977
  }
7301
6978
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPMenuCustomizerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
7302
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPMenuCustomizerComponent, isStandalone: true, selector: "axp-menu-customizer", inputs: { scopeKey: { classPropertyName: "scopeKey", publicName: "scopeKey", isSignal: true, isRequired: true, transformFunction: null }, showToolbar: { classPropertyName: "showToolbar", publicName: "showToolbar", isSignal: true, isRequired: false, transformFunction: null }, allowAddItems: { classPropertyName: "allowAddItems", publicName: "allowAddItems", isSignal: true, isRequired: false, transformFunction: null }, dragBehavior: { classPropertyName: "dragBehavior", publicName: "dragBehavior", isSignal: true, isRequired: false, transformFunction: null }, dragArea: { classPropertyName: "dragArea", publicName: "dragArea", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { saved: "saved", cancelled: "cancelled" }, host: { classAttribute: "axp-menu-customizer" }, viewQueries: [{ propertyName: "tree", first: true, predicate: AXTreeViewComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<!-- i18n path constants -->\n@let i18nBase = '@platform-management:menu-management';\n@let i18nEmptyStates = i18nBase + '.components.menu-list.empty-states';\n@let i18nActions = i18nBase + '.actions';\n\n<!-- Loading State -->\n@if (isLoading()) {\n <axp-state-message\n mode=\"loading\"\n icon=\"fa-light fa-spinner-third fa-spin\"\n [title]=\"(i18nEmptyStates + '.loading.title' | translate | async)!\"\n [description]=\"(i18nEmptyStates + '.loading.description' | translate | async)!\"\n />\n}\n\n<!-- Error State -->\n@else if (hasError()) {\n <axp-state-message\n mode=\"error\"\n icon=\"fa-light fa-circle-exclamation\"\n [title]=\"(i18nEmptyStates + '.error.title' | translate | async)!\"\n [description]=\"(i18nEmptyStates + '.error.description' | translate | async)!\"\n >\n <ax-button\n slot=\"actions\"\n [text]=\"'@general:actions.retry.title' | translate | async\"\n look=\"outline\"\n color=\"primary\"\n (onClick)=\"loadMenuItems()\"\n >\n <i class=\"fa-light fa-rotate-left\"></i>\n </ax-button>\n </axp-state-message>\n}\n\n<!-- Empty State -->\n@else if (showEmptyState()) {\n <axp-state-message\n mode=\"empty\"\n icon=\"fa-light fa-bars\"\n [title]=\"(i18nEmptyStates + '.no-data.title' | translate | async)!\"\n [description]=\"(i18nEmptyStates + '.no-data.description' | translate | async)!\"\n >\n @if (allowAddItems()) {\n <ax-button\n slot=\"actions\"\n [text]=\"i18nActions + '.add-root.title' | translate | async\"\n look=\"solid\"\n color=\"primary\"\n (onClick)=\"addRootMenuItem()\"\n >\n <i class=\"fa-light fa-plus\"></i>\n </ax-button>\n }\n </axp-state-message>\n}\n\n<!-- Main Content -->\n@else if (showContent()) {\n <!-- Toolbar -->\n @if (showToolbar()) {\n <div class=\"axp-menu-customizer__toolbar\">\n @if (allowAddItems()) {\n <ax-button\n [text]=\"i18nActions + '.add-root.title' | translate | async\"\n look=\"solid\"\n color=\"primary\"\n (onClick)=\"addRootMenuItem()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-plus\"></i>\n </ax-prefix>\n </ax-button>\n }\n\n <div class=\"axp-menu-customizer__toolbar-spacer\"></div>\n <!-- \n <ax-button\n [text]=\"i18nActions + '.collapse.title' | translate | async\"\n look=\"outline\"\n (onClick)=\"collapseAll()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-minus-square\"></i>\n </ax-prefix>\n </ax-button>\n\n <ax-button\n [text]=\"i18nActions + '.expand.title' | translate | async\"\n look=\"outline\"\n (onClick)=\"expandAll()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-plus-square\"></i>\n </ax-prefix>\n </ax-button> -->\n\n <ax-button\n [text]=\"i18nActions + '.reset.title' | translate | async\"\n look=\"outline\"\n color=\"danger\"\n (onClick)=\"resetCustomizations()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-rotate-left\"></i>\n </ax-prefix>\n </ax-button>\n </div>\n }\n\n <!-- Menu Tree -->\n <div class=\"axp-menu-customizer__container\">\n <div class=\"axp-menu-customizer__tree\">\n <ax-tree-view\n [(datasource)]=\"treeNodes\"\n look=\"default\"\n [nodeTemplate]=\"itemTemplate\"\n selectMode=\"none\"\n [showIcons]=\"false\"\n [showChildrenBadge]=\"false\"\n [dragBehavior]=\"dragBehavior()\"\n [dragArea]=\"dragArea()\"\n (onBeforeDrop)=\"handleBeforeDrop($event)\"\n (onOrderChange)=\"handleOrderChange($event)\"\n (onMoveChange)=\"handleMoveChange($event)\"\n />\n </div>\n </div>\n}\n\n<!-- Custom Item Template -->\n<ng-template #itemTemplate let-node=\"node\" let-level=\"level\">\n @let nodeData = node['data'];\n @let item = nodeData.menuItem;\n @let metadata = nodeData.metadata;\n @let isGroup = item.type === 'group';\n @let isBreak = item.type === 'break';\n @let isMenu = item.type === 'menu' || !item.type;\n @let canAddChild = !item.path && isMenu && allowAddItems();\n @let canToggleVisibility = item.name && metadata.isBuiltIn;\n @let canDelete = item.name && metadata.isCustom;\n @let i18nStates = '@platform-management:menu-management.states';\n\n <div\n class=\"axp-menu-customizer__item\"\n [class.axp-menu-customizer__item--hidden]=\"metadata.isHidden\"\n [class.axp-menu-customizer__item--custom]=\"metadata.isCustom\"\n [class.axp-menu-customizer__item--group]=\"isGroup\"\n >\n <!-- Icon (hidden for groups) -->\n @if (item.icon && !isGroup) {\n <i class=\"axp-menu-customizer__item-icon\" [class]=\"item.icon\"></i>\n }\n\n <!-- Content based on item type -->\n @if (isGroup) {\n <span class=\"axp-menu-customizer__item-group\">\n <i class=\"fa-light fa-layer-group\"></i>\n {{ item.text | translate | async }}\n </span>\n } @else if (isBreak) {\n <span class=\"axp-menu-customizer__item-divider\">\n <i class=\"fa-light fa-minus\"></i>\n {{ i18nStates + '.divider' | translate | async }}\n </span>\n } @else if (item.text) {\n <span class=\"axp-menu-customizer__item-text\">\n {{ item.text | translate | async }}\n </span>\n } @else if (item.path) {\n <span class=\"axp-menu-customizer__item-path\">\n <i class=\"fa-light fa-link\"></i>\n {{ item.path }}\n </span>\n }\n\n <!-- Menu Name/Key -->\n @if (item.name) {\n <code class=\"axp-menu-customizer__item-name\">{{ item.name }}</code>\n }\n\n <!-- Status Badges -->\n @if (metadata.isHidden) {\n <ax-badge [text]=\"(i18nStates + '.hidden' | translate | async)!\" color=\"danger\" />\n } @else if (metadata.isCustom) {\n <ax-badge [text]=\"(i18nStates + '.custom' | translate | async)!\" color=\"success\" />\n } @else if (metadata.isBuiltIn) {\n <ax-badge [text]=\"(i18nStates + '.built-in' | translate | async)!\" color=\"primary\" />\n }\n\n <!-- Actions Dropdown -->\n <ax-button class=\"axp-menu-customizer__item-actions\" look=\"blank\" size=\"sm\" [iconOnly]=\"true\">\n <ax-prefix>\n <i class=\"fa-light fa-ellipsis-vertical\"></i>\n </ax-prefix>\n\n <ax-dropdown-panel #panel>\n <ax-button-item-list>\n <!-- Edit (only for items with names) -->\n @if (item.name) {\n <ax-button-item\n [text]=\"('@general:actions.edit.title' | translate | async)!\"\n (onClick)=\"onAction('edit', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-edit\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n\n <!-- Show/Hide (only for built-in items with names) -->\n @if (canToggleVisibility) {\n @if (metadata.isHidden) {\n <ax-button-item\n [text]=\"(i18nActions + '.show.title' | translate | async)!\"\n (onClick)=\"onAction('show', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-eye\"></i>\n </ax-prefix>\n </ax-button-item>\n } @else {\n <ax-button-item\n [text]=\"(i18nActions + '.hide.title' | translate | async)!\"\n (onClick)=\"onAction('hide', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-eye-slash\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n }\n\n <!-- Add Child -->\n @if (canAddChild) {\n <ax-button-item\n [text]=\"(i18nActions + '.add-child.title' | translate | async)!\"\n (onClick)=\"onAction('add-child', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-plus\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n\n <!-- Delete (only for custom items with names) -->\n @if (canDelete) {\n <ax-divider />\n <ax-button-item\n color=\"danger\"\n [text]=\"('@general:actions.delete.title' | translate | async)!\"\n (onClick)=\"onAction('delete', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-trash\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n\n <!-- Info message for items without names -->\n @if (!item.name) {\n <ax-divider />\n <div class=\"p-2 text-xs text-neutral-500 italic\">\n {{ i18nBase + '.messages.info.no-name' | translate | async }}\n </div>\n }\n </ax-button-item-list>\n </ax-dropdown-panel>\n </ax-button>\n </div>\n</ng-template>\n", styles: ["@layer properties;.axp-menu-customizer{display:flex;height:100%;min-height:0;flex-direction:column}.axp-menu-customizer__toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding:calc(var(--spacing, .25rem) * 4);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;--tw-border-style: solid;border-style:solid;border-color:var(--color-neutral-200, oklch(92.2% 0 0));flex-shrink:0}.axp-menu-customizer__toolbar-spacer{min-width:calc(var(--spacing, .25rem) * 4);flex:1}.axp-menu-customizer__container{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4);padding:calc(var(--spacing, .25rem) * 4);min-height:0;flex:1;overflow:auto}.axp-menu-customizer__tree{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2)}.axp-menu-customizer__tree ax-tree-view{flex:1}.axp-menu-customizer__item{display:flex;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: solid;border-style:solid;border-color:var(--color-neutral-200, oklch(92.2% 0 0));background-color:var(--color-white, #fff);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.axp-menu-customizer__item:hover{background-color:var(--color-neutral-50, oklch(98.5% 0 0))}.axp-menu-customizer__item--hidden{opacity:50%}.axp-menu-customizer__item--hidden .axp-menu-customizer__item-text,.axp-menu-customizer__item--hidden .axp-menu-customizer__item-icon{text-decoration-line:line-through}.axp-menu-customizer__item--custom{border-color:rgba(var(--ax-sys-color-primary-200));background-color:rgba(var(--ax-sys-color-primary-50))}@supports (color: color-mix(in lab,red,red)){.axp-menu-customizer__item--custom{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-50)) 30%,transparent)}}.axp-menu-customizer__item--group{padding-block:calc(var(--spacing, .25rem) * 3);background-color:var(--color-neutral-50, oklch(98.5% 0 0))}.axp-menu-customizer__item-icon{display:flex;align-items:center;justify-content:center;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);color:rgba(var(--ax-sys-color-primary-600));flex-shrink:0}.axp-menu-customizer__item-text{min-width:0;flex:1;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.axp-menu-customizer__item-group{display:flex;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-500, oklch(55.6% 0 0));text-transform:uppercase;font-style:italic;--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em)}.axp-menu-customizer__item-group i{color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-menu-customizer__item-divider,.axp-menu-customizer__item-path{display:flex;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-500, oklch(55.6% 0 0));font-style:italic;min-width:0}.axp-menu-customizer__item-divider i,.axp-menu-customizer__item-path i{flex-shrink:0;color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-menu-customizer__item-name{display:inline-flex;align-items:center;border-radius:.25rem;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));background-color:var(--color-neutral-100, oklch(97% 0 0));color:var(--color-neutral-600, oklch(43.9% 0 0));font-family:var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-neutral-200, oklch(92.2% 0 0));-webkit-user-select:all;user-select:all;max-width:calc(var(--spacing, .25rem) * 48);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:0}.axp-menu-customizer__item-actions{margin-left:auto;flex-shrink:0;opacity:60%;transition-property:opacity;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.axp-menu-customizer__item:hover .axp-menu-customizer__item-actions{opacity:100%}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-duration: initial;--tw-font-weight: initial;--tw-tracking: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: i1$2.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1$2.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.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: AXDropdownButtonModule }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i5$1.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "placement", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXTreeViewComponent, selector: "ax-tree-view", inputs: ["datasource", "selectMode", "selectionBehavior", "dragArea", "dragBehavior", "showIcons", "showChildrenBadge", "expandedIcon", "collapsedIcon", "indentSize", "look", "nodeTemplate", "idField", "titleField", "tooltipField", "iconField", "expandedField", "selectedField", "indeterminateField", "disabledField", "hiddenField", "childrenField", "childrenCountField", "dataField", "inheritDisabled", "expandOnDoubleClick", "doubleClickDuration", "tooltipDelay", "controlledSelection", "selectedIds"], outputs: ["datasourceChange", "selectedIdsChange", "onBeforeDrop", "onNodeToggle", "onNodeSelect", "onNodeDoubleClick", "onNodeClick", "onSelectionChange", "onOrderChange", "onMoveChange", "onItemsChange"] }, { kind: "component", type: AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "titleParams", "descriptionParams", "look"] }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "component", type: i4$1.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6979
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPMenuCustomizerComponent, isStandalone: true, selector: "axp-menu-customizer", inputs: { scopeKey: { classPropertyName: "scopeKey", publicName: "scopeKey", isSignal: true, isRequired: true, transformFunction: null }, showToolbar: { classPropertyName: "showToolbar", publicName: "showToolbar", isSignal: true, isRequired: false, transformFunction: null }, allowAddItems: { classPropertyName: "allowAddItems", publicName: "allowAddItems", isSignal: true, isRequired: false, transformFunction: null }, dragBehavior: { classPropertyName: "dragBehavior", publicName: "dragBehavior", isSignal: true, isRequired: false, transformFunction: null }, dragArea: { classPropertyName: "dragArea", publicName: "dragArea", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { saved: "saved", cancelled: "cancelled" }, host: { classAttribute: "axp-menu-customizer" }, viewQueries: [{ propertyName: "tree", first: true, predicate: AXTreeViewComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<!-- i18n path constants -->\n@let i18nBase = '@platform-management:menu-management';\n@let i18nEmptyStates = i18nBase + '.components.menu-list.empty-states';\n@let i18nActions = i18nBase + '.actions';\n\n<!-- Loading State -->\n@if (isLoading()) {\n <axp-state-message\n mode=\"loading\"\n icon=\"fa-light fa-spinner-third fa-spin\"\n [title]=\"(i18nEmptyStates + '.loading.title' | translate | async)!\"\n [description]=\"(i18nEmptyStates + '.loading.description' | translate | async)!\"\n />\n}\n\n<!-- Error State -->\n@else if (hasError()) {\n <axp-state-message\n mode=\"error\"\n icon=\"fa-light fa-circle-exclamation\"\n [title]=\"(i18nEmptyStates + '.error.title' | translate | async)!\"\n [description]=\"(i18nEmptyStates + '.error.description' | translate | async)!\"\n >\n <ax-button\n slot=\"actions\"\n [text]=\"'@general:actions.retry.title' | translate | async\"\n look=\"outline\"\n color=\"primary\"\n (onClick)=\"loadMenuItems()\"\n >\n <i class=\"fa-light fa-rotate-left\"></i>\n </ax-button>\n </axp-state-message>\n}\n\n<!-- Empty State -->\n@else if (showEmptyState()) {\n <axp-state-message\n mode=\"empty\"\n icon=\"fa-light fa-bars\"\n [title]=\"(i18nEmptyStates + '.no-data.title' | translate | async)!\"\n [description]=\"(i18nEmptyStates + '.no-data.description' | translate | async)!\"\n >\n @if (allowAddItems()) {\n <ax-button\n slot=\"actions\"\n [text]=\"i18nActions + '.add-root.title' | translate | async\"\n look=\"solid\"\n color=\"primary\"\n (onClick)=\"addRootMenuItem()\"\n >\n <i class=\"fa-light fa-plus\"></i>\n </ax-button>\n }\n </axp-state-message>\n}\n\n<!-- Main Content -->\n@else if (showContent()) {\n <!-- Toolbar -->\n @if (showToolbar()) {\n <div class=\"axp-menu-customizer__toolbar\">\n @if (allowAddItems()) {\n <ax-button\n [text]=\"i18nActions + '.add-root.title' | translate | async\"\n look=\"solid\"\n color=\"primary\"\n (onClick)=\"addRootMenuItem()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-plus\"></i>\n </ax-prefix>\n </ax-button>\n }\n\n <div class=\"axp-menu-customizer__toolbar-spacer\"></div>\n <!-- \n <ax-button\n [text]=\"i18nActions + '.collapse.title' | translate | async\"\n look=\"outline\"\n (onClick)=\"collapseAll()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-minus-square\"></i>\n </ax-prefix>\n </ax-button>\n\n <ax-button\n [text]=\"i18nActions + '.expand.title' | translate | async\"\n look=\"outline\"\n (onClick)=\"expandAll()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-plus-square\"></i>\n </ax-prefix>\n </ax-button> -->\n\n <ax-button\n [text]=\"i18nActions + '.reset.title' | translate | async\"\n look=\"outline\"\n color=\"danger\"\n (onClick)=\"resetCustomizations()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-rotate-left\"></i>\n </ax-prefix>\n </ax-button>\n </div>\n }\n\n <!-- Menu Tree -->\n <div class=\"axp-menu-customizer__container\">\n <div class=\"axp-menu-customizer__tree\">\n <ax-tree-view\n [(datasource)]=\"treeNodes\"\n look=\"default\"\n [nodeTemplate]=\"itemTemplate\"\n selectMode=\"none\"\n [showIcons]=\"false\"\n [showChildrenBadge]=\"false\"\n [dragBehavior]=\"dragBehavior()\"\n [dragArea]=\"dragArea()\"\n (onBeforeDrop)=\"handleBeforeDrop($event)\"\n (onOrderChange)=\"handleOrderChange($event)\"\n (onMoveChange)=\"handleMoveChange($event)\"\n />\n </div>\n </div>\n}\n\n<!-- Custom Item Template -->\n<ng-template #itemTemplate let-node=\"node\" let-level=\"level\">\n @let nodeData = node['data'];\n @let item = nodeData.menuItem;\n @let metadata = nodeData.metadata;\n @let isGroup = item.type === 'group';\n @let isBreak = item.type === 'break';\n @let isMenu = item.type === 'menu' || !item.type;\n @let canAddChild = !item.path && isMenu && allowAddItems();\n @let canToggleVisibility = item.name && metadata.isBuiltIn;\n @let canDelete = item.name && metadata.isCustom;\n @let i18nStates = '@platform-management:menu-management.states';\n\n <div\n class=\"axp-menu-customizer__item\"\n [class.axp-menu-customizer__item--hidden]=\"metadata.isHidden\"\n [class.axp-menu-customizer__item--custom]=\"metadata.isCustom\"\n [class.axp-menu-customizer__item--group]=\"isGroup\"\n >\n <!-- Icon (hidden for groups) -->\n @if (item.icon && !isGroup) {\n <i class=\"axp-menu-customizer__item-icon\" [class]=\"item.icon\"></i>\n }\n\n <!-- Content based on item type -->\n @if (isGroup) {\n <span class=\"axp-menu-customizer__item-group\">\n <i class=\"fa-light fa-layer-group\"></i>\n {{ item.text | translate | async }}\n </span>\n } @else if (isBreak) {\n <span class=\"axp-menu-customizer__item-divider\">\n <i class=\"fa-light fa-minus\"></i>\n {{ i18nStates + '.divider' | translate | async }}\n </span>\n } @else if (item.text) {\n <span class=\"axp-menu-customizer__item-text\">\n {{ item.text | translate | async }}\n </span>\n } @else if (item.path) {\n <span class=\"axp-menu-customizer__item-path\">\n <i class=\"fa-light fa-link\"></i>\n {{ item.path }}\n </span>\n }\n\n <!-- Menu Name/Key -->\n @if (item.name) {\n <code class=\"axp-menu-customizer__item-name\">{{ item.name }}</code>\n }\n\n <!-- Status Badges -->\n @if (metadata.isHidden) {\n <ax-badge [text]=\"(i18nStates + '.hidden' | translate | async)!\" color=\"danger\" />\n } @else if (metadata.isCustom) {\n <ax-badge [text]=\"(i18nStates + '.custom' | translate | async)!\" color=\"success\" />\n } @else if (metadata.isBuiltIn) {\n <ax-badge [text]=\"(i18nStates + '.built-in' | translate | async)!\" color=\"primary\" />\n }\n\n <!-- Actions Dropdown -->\n <ax-button class=\"axp-menu-customizer__item-actions\" look=\"blank\" size=\"sm\" [iconOnly]=\"true\">\n <ax-prefix>\n <i class=\"fa-light fa-ellipsis-vertical\"></i>\n </ax-prefix>\n\n <ax-dropdown-panel #panel>\n <ax-button-item-list>\n <!-- Edit (only for items with names) -->\n @if (item.name) {\n <ax-button-item\n [text]=\"('@general:actions.edit.title' | translate | async)!\"\n (onClick)=\"onAction('edit', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-edit\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n\n <!-- Show/Hide (only for built-in items with names) -->\n @if (canToggleVisibility) {\n @if (metadata.isHidden) {\n <ax-button-item\n [text]=\"(i18nActions + '.show.title' | translate | async)!\"\n (onClick)=\"onAction('show', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-eye\"></i>\n </ax-prefix>\n </ax-button-item>\n } @else {\n <ax-button-item\n [text]=\"(i18nActions + '.hide.title' | translate | async)!\"\n (onClick)=\"onAction('hide', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-eye-slash\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n }\n\n <!-- Add Child -->\n @if (canAddChild) {\n <ax-button-item\n [text]=\"(i18nActions + '.add-child.title' | translate | async)!\"\n (onClick)=\"onAction('add-child', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-plus\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n\n <!-- Delete (only for custom items with names) -->\n @if (canDelete) {\n <ax-divider />\n <ax-button-item\n color=\"danger\"\n [text]=\"('@general:actions.delete.title' | translate | async)!\"\n (onClick)=\"onAction('delete', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-trash\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n\n <!-- Info message for items without names -->\n @if (!item.name) {\n <ax-divider />\n <div class=\"p-2 text-xs text-neutral-500 italic\">\n {{ i18nBase + '.messages.info.no-name' | translate | async }}\n </div>\n }\n </ax-button-item-list>\n </ax-dropdown-panel>\n </ax-button>\n </div>\n</ng-template>\n", styles: ["@layer properties;.axp-menu-customizer{display:flex;height:100%;min-height:0;flex-direction:column}.axp-menu-customizer .axp-menu-customizer__toolbar{display:flex;flex-shrink:0;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;--tw-border-style: solid;border-style:solid;border-color:var(--color-neutral-200, oklch(92.2% 0 0));padding:calc(var(--spacing, .25rem) * 4)}.axp-menu-customizer .axp-menu-customizer__toolbar-spacer{min-width:calc(var(--spacing, .25rem) * 4);flex:1}.axp-menu-customizer .axp-menu-customizer__container{display:flex;min-height:0;flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4);overflow:auto;padding:calc(var(--spacing, .25rem) * 4)}.axp-menu-customizer .axp-menu-customizer__tree{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2)}.axp-menu-customizer .axp-menu-customizer__tree ax-tree-view{flex:1}.axp-menu-customizer .axp-menu-customizer__item{display:flex;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: solid;border-style:solid;border-color:var(--color-neutral-200, oklch(92.2% 0 0));background-color:var(--color-white, #fff);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.axp-menu-customizer .axp-menu-customizer__item:hover{background-color:var(--color-neutral-50, oklch(98.5% 0 0))}.axp-menu-customizer .axp-menu-customizer__item:hover .axp-menu-customizer__item-actions{opacity:100%}.axp-menu-customizer .axp-menu-customizer__item--hidden{opacity:50%}.axp-menu-customizer .axp-menu-customizer__item--hidden .axp-menu-customizer__item-text,.axp-menu-customizer .axp-menu-customizer__item--hidden .axp-menu-customizer__item-icon{text-decoration-line:line-through}.axp-menu-customizer .axp-menu-customizer__item--custom{border-color:rgba(var(--ax-sys-color-primary-200));background-color:rgba(var(--ax-sys-color-primary-50))}@supports (color: color-mix(in lab,red,red)){.axp-menu-customizer .axp-menu-customizer__item--custom{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-50)) 30%,transparent)}}.axp-menu-customizer .axp-menu-customizer__item--group{background-color:var(--color-neutral-50, oklch(98.5% 0 0));padding-block:calc(var(--spacing, .25rem) * 3)}.axp-menu-customizer .axp-menu-customizer__item-icon{display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);flex-shrink:0;align-items:center;justify-content:center;color:rgba(var(--ax-sys-color-primary-600))}.axp-menu-customizer .axp-menu-customizer__item-text{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-menu-customizer .axp-menu-customizer__item-group{display:flex;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:var(--color-neutral-500, oklch(55.6% 0 0));text-transform:uppercase;font-style:italic}.axp-menu-customizer .axp-menu-customizer__item-group i{color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-menu-customizer .axp-menu-customizer__item-divider,.axp-menu-customizer .axp-menu-customizer__item-path{display:flex;min-width:0;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-500, oklch(55.6% 0 0));font-style:italic}:is(.axp-menu-customizer .axp-menu-customizer__item-divider,.axp-menu-customizer .axp-menu-customizer__item-path) i{flex-shrink:0;color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-menu-customizer .axp-menu-customizer__item-name{display:inline-flex;max-width:calc(var(--spacing, .25rem) * 48);flex-shrink:0;overflow:hidden;text-overflow:ellipsis;border-radius:.25rem;border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-neutral-200, oklch(92.2% 0 0));background-color:var(--color-neutral-100, oklch(97% 0 0));padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-family:var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);white-space:nowrap;color:var(--color-neutral-600, oklch(43.9% 0 0));-webkit-user-select:all;user-select:all}.axp-menu-customizer .axp-menu-customizer__item-actions{margin-left:auto;flex-shrink:0;opacity:60%;transition-property:opacity;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-duration: initial;--tw-font-weight: initial;--tw-tracking: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: i1$2.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1$2.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.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: AXDropdownButtonModule }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i5$1.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "placement", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXTreeViewComponent, selector: "ax-tree-view", inputs: ["datasource", "selectMode", "selectionBehavior", "dragArea", "dragBehavior", "showIcons", "showChildrenBadge", "expandedIcon", "collapsedIcon", "indentSize", "look", "nodeTemplate", "idField", "titleField", "tooltipField", "iconField", "expandedField", "selectedField", "indeterminateField", "disabledField", "hiddenField", "childrenField", "childrenCountField", "dataField", "inheritDisabled", "expandOnDoubleClick", "doubleClickDuration", "tooltipDelay", "controlledSelection", "selectedIds"], outputs: ["datasourceChange", "selectedIdsChange", "onBeforeDrop", "onNodeToggle", "onNodeSelect", "onNodeDoubleClick", "onNodeClick", "onSelectionChange", "onOrderChange", "onMoveChange", "onItemsChange"] }, { kind: "component", type: AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "titleParams", "descriptionParams", "look"] }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "component", type: i1$3.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
7303
6980
  }
7304
6981
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPMenuCustomizerComponent, decorators: [{
7305
6982
  type: Component,
@@ -7313,7 +6990,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
7313
6990
  AXPStateMessageComponent,
7314
6991
  AXBadgeModule,
7315
6992
  AsyncPipe,
7316
- ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { class: 'axp-menu-customizer' }, template: "<!-- i18n path constants -->\n@let i18nBase = '@platform-management:menu-management';\n@let i18nEmptyStates = i18nBase + '.components.menu-list.empty-states';\n@let i18nActions = i18nBase + '.actions';\n\n<!-- Loading State -->\n@if (isLoading()) {\n <axp-state-message\n mode=\"loading\"\n icon=\"fa-light fa-spinner-third fa-spin\"\n [title]=\"(i18nEmptyStates + '.loading.title' | translate | async)!\"\n [description]=\"(i18nEmptyStates + '.loading.description' | translate | async)!\"\n />\n}\n\n<!-- Error State -->\n@else if (hasError()) {\n <axp-state-message\n mode=\"error\"\n icon=\"fa-light fa-circle-exclamation\"\n [title]=\"(i18nEmptyStates + '.error.title' | translate | async)!\"\n [description]=\"(i18nEmptyStates + '.error.description' | translate | async)!\"\n >\n <ax-button\n slot=\"actions\"\n [text]=\"'@general:actions.retry.title' | translate | async\"\n look=\"outline\"\n color=\"primary\"\n (onClick)=\"loadMenuItems()\"\n >\n <i class=\"fa-light fa-rotate-left\"></i>\n </ax-button>\n </axp-state-message>\n}\n\n<!-- Empty State -->\n@else if (showEmptyState()) {\n <axp-state-message\n mode=\"empty\"\n icon=\"fa-light fa-bars\"\n [title]=\"(i18nEmptyStates + '.no-data.title' | translate | async)!\"\n [description]=\"(i18nEmptyStates + '.no-data.description' | translate | async)!\"\n >\n @if (allowAddItems()) {\n <ax-button\n slot=\"actions\"\n [text]=\"i18nActions + '.add-root.title' | translate | async\"\n look=\"solid\"\n color=\"primary\"\n (onClick)=\"addRootMenuItem()\"\n >\n <i class=\"fa-light fa-plus\"></i>\n </ax-button>\n }\n </axp-state-message>\n}\n\n<!-- Main Content -->\n@else if (showContent()) {\n <!-- Toolbar -->\n @if (showToolbar()) {\n <div class=\"axp-menu-customizer__toolbar\">\n @if (allowAddItems()) {\n <ax-button\n [text]=\"i18nActions + '.add-root.title' | translate | async\"\n look=\"solid\"\n color=\"primary\"\n (onClick)=\"addRootMenuItem()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-plus\"></i>\n </ax-prefix>\n </ax-button>\n }\n\n <div class=\"axp-menu-customizer__toolbar-spacer\"></div>\n <!-- \n <ax-button\n [text]=\"i18nActions + '.collapse.title' | translate | async\"\n look=\"outline\"\n (onClick)=\"collapseAll()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-minus-square\"></i>\n </ax-prefix>\n </ax-button>\n\n <ax-button\n [text]=\"i18nActions + '.expand.title' | translate | async\"\n look=\"outline\"\n (onClick)=\"expandAll()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-plus-square\"></i>\n </ax-prefix>\n </ax-button> -->\n\n <ax-button\n [text]=\"i18nActions + '.reset.title' | translate | async\"\n look=\"outline\"\n color=\"danger\"\n (onClick)=\"resetCustomizations()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-rotate-left\"></i>\n </ax-prefix>\n </ax-button>\n </div>\n }\n\n <!-- Menu Tree -->\n <div class=\"axp-menu-customizer__container\">\n <div class=\"axp-menu-customizer__tree\">\n <ax-tree-view\n [(datasource)]=\"treeNodes\"\n look=\"default\"\n [nodeTemplate]=\"itemTemplate\"\n selectMode=\"none\"\n [showIcons]=\"false\"\n [showChildrenBadge]=\"false\"\n [dragBehavior]=\"dragBehavior()\"\n [dragArea]=\"dragArea()\"\n (onBeforeDrop)=\"handleBeforeDrop($event)\"\n (onOrderChange)=\"handleOrderChange($event)\"\n (onMoveChange)=\"handleMoveChange($event)\"\n />\n </div>\n </div>\n}\n\n<!-- Custom Item Template -->\n<ng-template #itemTemplate let-node=\"node\" let-level=\"level\">\n @let nodeData = node['data'];\n @let item = nodeData.menuItem;\n @let metadata = nodeData.metadata;\n @let isGroup = item.type === 'group';\n @let isBreak = item.type === 'break';\n @let isMenu = item.type === 'menu' || !item.type;\n @let canAddChild = !item.path && isMenu && allowAddItems();\n @let canToggleVisibility = item.name && metadata.isBuiltIn;\n @let canDelete = item.name && metadata.isCustom;\n @let i18nStates = '@platform-management:menu-management.states';\n\n <div\n class=\"axp-menu-customizer__item\"\n [class.axp-menu-customizer__item--hidden]=\"metadata.isHidden\"\n [class.axp-menu-customizer__item--custom]=\"metadata.isCustom\"\n [class.axp-menu-customizer__item--group]=\"isGroup\"\n >\n <!-- Icon (hidden for groups) -->\n @if (item.icon && !isGroup) {\n <i class=\"axp-menu-customizer__item-icon\" [class]=\"item.icon\"></i>\n }\n\n <!-- Content based on item type -->\n @if (isGroup) {\n <span class=\"axp-menu-customizer__item-group\">\n <i class=\"fa-light fa-layer-group\"></i>\n {{ item.text | translate | async }}\n </span>\n } @else if (isBreak) {\n <span class=\"axp-menu-customizer__item-divider\">\n <i class=\"fa-light fa-minus\"></i>\n {{ i18nStates + '.divider' | translate | async }}\n </span>\n } @else if (item.text) {\n <span class=\"axp-menu-customizer__item-text\">\n {{ item.text | translate | async }}\n </span>\n } @else if (item.path) {\n <span class=\"axp-menu-customizer__item-path\">\n <i class=\"fa-light fa-link\"></i>\n {{ item.path }}\n </span>\n }\n\n <!-- Menu Name/Key -->\n @if (item.name) {\n <code class=\"axp-menu-customizer__item-name\">{{ item.name }}</code>\n }\n\n <!-- Status Badges -->\n @if (metadata.isHidden) {\n <ax-badge [text]=\"(i18nStates + '.hidden' | translate | async)!\" color=\"danger\" />\n } @else if (metadata.isCustom) {\n <ax-badge [text]=\"(i18nStates + '.custom' | translate | async)!\" color=\"success\" />\n } @else if (metadata.isBuiltIn) {\n <ax-badge [text]=\"(i18nStates + '.built-in' | translate | async)!\" color=\"primary\" />\n }\n\n <!-- Actions Dropdown -->\n <ax-button class=\"axp-menu-customizer__item-actions\" look=\"blank\" size=\"sm\" [iconOnly]=\"true\">\n <ax-prefix>\n <i class=\"fa-light fa-ellipsis-vertical\"></i>\n </ax-prefix>\n\n <ax-dropdown-panel #panel>\n <ax-button-item-list>\n <!-- Edit (only for items with names) -->\n @if (item.name) {\n <ax-button-item\n [text]=\"('@general:actions.edit.title' | translate | async)!\"\n (onClick)=\"onAction('edit', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-edit\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n\n <!-- Show/Hide (only for built-in items with names) -->\n @if (canToggleVisibility) {\n @if (metadata.isHidden) {\n <ax-button-item\n [text]=\"(i18nActions + '.show.title' | translate | async)!\"\n (onClick)=\"onAction('show', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-eye\"></i>\n </ax-prefix>\n </ax-button-item>\n } @else {\n <ax-button-item\n [text]=\"(i18nActions + '.hide.title' | translate | async)!\"\n (onClick)=\"onAction('hide', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-eye-slash\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n }\n\n <!-- Add Child -->\n @if (canAddChild) {\n <ax-button-item\n [text]=\"(i18nActions + '.add-child.title' | translate | async)!\"\n (onClick)=\"onAction('add-child', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-plus\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n\n <!-- Delete (only for custom items with names) -->\n @if (canDelete) {\n <ax-divider />\n <ax-button-item\n color=\"danger\"\n [text]=\"('@general:actions.delete.title' | translate | async)!\"\n (onClick)=\"onAction('delete', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-trash\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n\n <!-- Info message for items without names -->\n @if (!item.name) {\n <ax-divider />\n <div class=\"p-2 text-xs text-neutral-500 italic\">\n {{ i18nBase + '.messages.info.no-name' | translate | async }}\n </div>\n }\n </ax-button-item-list>\n </ax-dropdown-panel>\n </ax-button>\n </div>\n</ng-template>\n", styles: ["@layer properties;.axp-menu-customizer{display:flex;height:100%;min-height:0;flex-direction:column}.axp-menu-customizer__toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding:calc(var(--spacing, .25rem) * 4);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;--tw-border-style: solid;border-style:solid;border-color:var(--color-neutral-200, oklch(92.2% 0 0));flex-shrink:0}.axp-menu-customizer__toolbar-spacer{min-width:calc(var(--spacing, .25rem) * 4);flex:1}.axp-menu-customizer__container{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4);padding:calc(var(--spacing, .25rem) * 4);min-height:0;flex:1;overflow:auto}.axp-menu-customizer__tree{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2)}.axp-menu-customizer__tree ax-tree-view{flex:1}.axp-menu-customizer__item{display:flex;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: solid;border-style:solid;border-color:var(--color-neutral-200, oklch(92.2% 0 0));background-color:var(--color-white, #fff);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.axp-menu-customizer__item:hover{background-color:var(--color-neutral-50, oklch(98.5% 0 0))}.axp-menu-customizer__item--hidden{opacity:50%}.axp-menu-customizer__item--hidden .axp-menu-customizer__item-text,.axp-menu-customizer__item--hidden .axp-menu-customizer__item-icon{text-decoration-line:line-through}.axp-menu-customizer__item--custom{border-color:rgba(var(--ax-sys-color-primary-200));background-color:rgba(var(--ax-sys-color-primary-50))}@supports (color: color-mix(in lab,red,red)){.axp-menu-customizer__item--custom{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-50)) 30%,transparent)}}.axp-menu-customizer__item--group{padding-block:calc(var(--spacing, .25rem) * 3);background-color:var(--color-neutral-50, oklch(98.5% 0 0))}.axp-menu-customizer__item-icon{display:flex;align-items:center;justify-content:center;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);color:rgba(var(--ax-sys-color-primary-600));flex-shrink:0}.axp-menu-customizer__item-text{min-width:0;flex:1;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.axp-menu-customizer__item-group{display:flex;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-500, oklch(55.6% 0 0));text-transform:uppercase;font-style:italic;--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em)}.axp-menu-customizer__item-group i{color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-menu-customizer__item-divider,.axp-menu-customizer__item-path{display:flex;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-500, oklch(55.6% 0 0));font-style:italic;min-width:0}.axp-menu-customizer__item-divider i,.axp-menu-customizer__item-path i{flex-shrink:0;color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-menu-customizer__item-name{display:inline-flex;align-items:center;border-radius:.25rem;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));background-color:var(--color-neutral-100, oklch(97% 0 0));color:var(--color-neutral-600, oklch(43.9% 0 0));font-family:var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-neutral-200, oklch(92.2% 0 0));-webkit-user-select:all;user-select:all;max-width:calc(var(--spacing, .25rem) * 48);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:0}.axp-menu-customizer__item-actions{margin-left:auto;flex-shrink:0;opacity:60%;transition-property:opacity;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.axp-menu-customizer__item:hover .axp-menu-customizer__item-actions{opacity:100%}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-duration: initial;--tw-font-weight: initial;--tw-tracking: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
6993
+ ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { class: 'axp-menu-customizer' }, template: "<!-- i18n path constants -->\n@let i18nBase = '@platform-management:menu-management';\n@let i18nEmptyStates = i18nBase + '.components.menu-list.empty-states';\n@let i18nActions = i18nBase + '.actions';\n\n<!-- Loading State -->\n@if (isLoading()) {\n <axp-state-message\n mode=\"loading\"\n icon=\"fa-light fa-spinner-third fa-spin\"\n [title]=\"(i18nEmptyStates + '.loading.title' | translate | async)!\"\n [description]=\"(i18nEmptyStates + '.loading.description' | translate | async)!\"\n />\n}\n\n<!-- Error State -->\n@else if (hasError()) {\n <axp-state-message\n mode=\"error\"\n icon=\"fa-light fa-circle-exclamation\"\n [title]=\"(i18nEmptyStates + '.error.title' | translate | async)!\"\n [description]=\"(i18nEmptyStates + '.error.description' | translate | async)!\"\n >\n <ax-button\n slot=\"actions\"\n [text]=\"'@general:actions.retry.title' | translate | async\"\n look=\"outline\"\n color=\"primary\"\n (onClick)=\"loadMenuItems()\"\n >\n <i class=\"fa-light fa-rotate-left\"></i>\n </ax-button>\n </axp-state-message>\n}\n\n<!-- Empty State -->\n@else if (showEmptyState()) {\n <axp-state-message\n mode=\"empty\"\n icon=\"fa-light fa-bars\"\n [title]=\"(i18nEmptyStates + '.no-data.title' | translate | async)!\"\n [description]=\"(i18nEmptyStates + '.no-data.description' | translate | async)!\"\n >\n @if (allowAddItems()) {\n <ax-button\n slot=\"actions\"\n [text]=\"i18nActions + '.add-root.title' | translate | async\"\n look=\"solid\"\n color=\"primary\"\n (onClick)=\"addRootMenuItem()\"\n >\n <i class=\"fa-light fa-plus\"></i>\n </ax-button>\n }\n </axp-state-message>\n}\n\n<!-- Main Content -->\n@else if (showContent()) {\n <!-- Toolbar -->\n @if (showToolbar()) {\n <div class=\"axp-menu-customizer__toolbar\">\n @if (allowAddItems()) {\n <ax-button\n [text]=\"i18nActions + '.add-root.title' | translate | async\"\n look=\"solid\"\n color=\"primary\"\n (onClick)=\"addRootMenuItem()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-plus\"></i>\n </ax-prefix>\n </ax-button>\n }\n\n <div class=\"axp-menu-customizer__toolbar-spacer\"></div>\n <!-- \n <ax-button\n [text]=\"i18nActions + '.collapse.title' | translate | async\"\n look=\"outline\"\n (onClick)=\"collapseAll()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-minus-square\"></i>\n </ax-prefix>\n </ax-button>\n\n <ax-button\n [text]=\"i18nActions + '.expand.title' | translate | async\"\n look=\"outline\"\n (onClick)=\"expandAll()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-plus-square\"></i>\n </ax-prefix>\n </ax-button> -->\n\n <ax-button\n [text]=\"i18nActions + '.reset.title' | translate | async\"\n look=\"outline\"\n color=\"danger\"\n (onClick)=\"resetCustomizations()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-rotate-left\"></i>\n </ax-prefix>\n </ax-button>\n </div>\n }\n\n <!-- Menu Tree -->\n <div class=\"axp-menu-customizer__container\">\n <div class=\"axp-menu-customizer__tree\">\n <ax-tree-view\n [(datasource)]=\"treeNodes\"\n look=\"default\"\n [nodeTemplate]=\"itemTemplate\"\n selectMode=\"none\"\n [showIcons]=\"false\"\n [showChildrenBadge]=\"false\"\n [dragBehavior]=\"dragBehavior()\"\n [dragArea]=\"dragArea()\"\n (onBeforeDrop)=\"handleBeforeDrop($event)\"\n (onOrderChange)=\"handleOrderChange($event)\"\n (onMoveChange)=\"handleMoveChange($event)\"\n />\n </div>\n </div>\n}\n\n<!-- Custom Item Template -->\n<ng-template #itemTemplate let-node=\"node\" let-level=\"level\">\n @let nodeData = node['data'];\n @let item = nodeData.menuItem;\n @let metadata = nodeData.metadata;\n @let isGroup = item.type === 'group';\n @let isBreak = item.type === 'break';\n @let isMenu = item.type === 'menu' || !item.type;\n @let canAddChild = !item.path && isMenu && allowAddItems();\n @let canToggleVisibility = item.name && metadata.isBuiltIn;\n @let canDelete = item.name && metadata.isCustom;\n @let i18nStates = '@platform-management:menu-management.states';\n\n <div\n class=\"axp-menu-customizer__item\"\n [class.axp-menu-customizer__item--hidden]=\"metadata.isHidden\"\n [class.axp-menu-customizer__item--custom]=\"metadata.isCustom\"\n [class.axp-menu-customizer__item--group]=\"isGroup\"\n >\n <!-- Icon (hidden for groups) -->\n @if (item.icon && !isGroup) {\n <i class=\"axp-menu-customizer__item-icon\" [class]=\"item.icon\"></i>\n }\n\n <!-- Content based on item type -->\n @if (isGroup) {\n <span class=\"axp-menu-customizer__item-group\">\n <i class=\"fa-light fa-layer-group\"></i>\n {{ item.text | translate | async }}\n </span>\n } @else if (isBreak) {\n <span class=\"axp-menu-customizer__item-divider\">\n <i class=\"fa-light fa-minus\"></i>\n {{ i18nStates + '.divider' | translate | async }}\n </span>\n } @else if (item.text) {\n <span class=\"axp-menu-customizer__item-text\">\n {{ item.text | translate | async }}\n </span>\n } @else if (item.path) {\n <span class=\"axp-menu-customizer__item-path\">\n <i class=\"fa-light fa-link\"></i>\n {{ item.path }}\n </span>\n }\n\n <!-- Menu Name/Key -->\n @if (item.name) {\n <code class=\"axp-menu-customizer__item-name\">{{ item.name }}</code>\n }\n\n <!-- Status Badges -->\n @if (metadata.isHidden) {\n <ax-badge [text]=\"(i18nStates + '.hidden' | translate | async)!\" color=\"danger\" />\n } @else if (metadata.isCustom) {\n <ax-badge [text]=\"(i18nStates + '.custom' | translate | async)!\" color=\"success\" />\n } @else if (metadata.isBuiltIn) {\n <ax-badge [text]=\"(i18nStates + '.built-in' | translate | async)!\" color=\"primary\" />\n }\n\n <!-- Actions Dropdown -->\n <ax-button class=\"axp-menu-customizer__item-actions\" look=\"blank\" size=\"sm\" [iconOnly]=\"true\">\n <ax-prefix>\n <i class=\"fa-light fa-ellipsis-vertical\"></i>\n </ax-prefix>\n\n <ax-dropdown-panel #panel>\n <ax-button-item-list>\n <!-- Edit (only for items with names) -->\n @if (item.name) {\n <ax-button-item\n [text]=\"('@general:actions.edit.title' | translate | async)!\"\n (onClick)=\"onAction('edit', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-edit\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n\n <!-- Show/Hide (only for built-in items with names) -->\n @if (canToggleVisibility) {\n @if (metadata.isHidden) {\n <ax-button-item\n [text]=\"(i18nActions + '.show.title' | translate | async)!\"\n (onClick)=\"onAction('show', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-eye\"></i>\n </ax-prefix>\n </ax-button-item>\n } @else {\n <ax-button-item\n [text]=\"(i18nActions + '.hide.title' | translate | async)!\"\n (onClick)=\"onAction('hide', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-eye-slash\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n }\n\n <!-- Add Child -->\n @if (canAddChild) {\n <ax-button-item\n [text]=\"(i18nActions + '.add-child.title' | translate | async)!\"\n (onClick)=\"onAction('add-child', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-plus\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n\n <!-- Delete (only for custom items with names) -->\n @if (canDelete) {\n <ax-divider />\n <ax-button-item\n color=\"danger\"\n [text]=\"('@general:actions.delete.title' | translate | async)!\"\n (onClick)=\"onAction('delete', nodeData); panel.close()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-trash\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n\n <!-- Info message for items without names -->\n @if (!item.name) {\n <ax-divider />\n <div class=\"p-2 text-xs text-neutral-500 italic\">\n {{ i18nBase + '.messages.info.no-name' | translate | async }}\n </div>\n }\n </ax-button-item-list>\n </ax-dropdown-panel>\n </ax-button>\n </div>\n</ng-template>\n", styles: ["@layer properties;.axp-menu-customizer{display:flex;height:100%;min-height:0;flex-direction:column}.axp-menu-customizer .axp-menu-customizer__toolbar{display:flex;flex-shrink:0;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;--tw-border-style: solid;border-style:solid;border-color:var(--color-neutral-200, oklch(92.2% 0 0));padding:calc(var(--spacing, .25rem) * 4)}.axp-menu-customizer .axp-menu-customizer__toolbar-spacer{min-width:calc(var(--spacing, .25rem) * 4);flex:1}.axp-menu-customizer .axp-menu-customizer__container{display:flex;min-height:0;flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4);overflow:auto;padding:calc(var(--spacing, .25rem) * 4)}.axp-menu-customizer .axp-menu-customizer__tree{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2)}.axp-menu-customizer .axp-menu-customizer__tree ax-tree-view{flex:1}.axp-menu-customizer .axp-menu-customizer__item{display:flex;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: solid;border-style:solid;border-color:var(--color-neutral-200, oklch(92.2% 0 0));background-color:var(--color-white, #fff);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.axp-menu-customizer .axp-menu-customizer__item:hover{background-color:var(--color-neutral-50, oklch(98.5% 0 0))}.axp-menu-customizer .axp-menu-customizer__item:hover .axp-menu-customizer__item-actions{opacity:100%}.axp-menu-customizer .axp-menu-customizer__item--hidden{opacity:50%}.axp-menu-customizer .axp-menu-customizer__item--hidden .axp-menu-customizer__item-text,.axp-menu-customizer .axp-menu-customizer__item--hidden .axp-menu-customizer__item-icon{text-decoration-line:line-through}.axp-menu-customizer .axp-menu-customizer__item--custom{border-color:rgba(var(--ax-sys-color-primary-200));background-color:rgba(var(--ax-sys-color-primary-50))}@supports (color: color-mix(in lab,red,red)){.axp-menu-customizer .axp-menu-customizer__item--custom{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-50)) 30%,transparent)}}.axp-menu-customizer .axp-menu-customizer__item--group{background-color:var(--color-neutral-50, oklch(98.5% 0 0));padding-block:calc(var(--spacing, .25rem) * 3)}.axp-menu-customizer .axp-menu-customizer__item-icon{display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);flex-shrink:0;align-items:center;justify-content:center;color:rgba(var(--ax-sys-color-primary-600))}.axp-menu-customizer .axp-menu-customizer__item-text{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-menu-customizer .axp-menu-customizer__item-group{display:flex;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:var(--color-neutral-500, oklch(55.6% 0 0));text-transform:uppercase;font-style:italic}.axp-menu-customizer .axp-menu-customizer__item-group i{color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-menu-customizer .axp-menu-customizer__item-divider,.axp-menu-customizer .axp-menu-customizer__item-path{display:flex;min-width:0;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-500, oklch(55.6% 0 0));font-style:italic}:is(.axp-menu-customizer .axp-menu-customizer__item-divider,.axp-menu-customizer .axp-menu-customizer__item-path) i{flex-shrink:0;color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-menu-customizer .axp-menu-customizer__item-name{display:inline-flex;max-width:calc(var(--spacing, .25rem) * 48);flex-shrink:0;overflow:hidden;text-overflow:ellipsis;border-radius:.25rem;border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-neutral-200, oklch(92.2% 0 0));background-color:var(--color-neutral-100, oklch(97% 0 0));padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-family:var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);white-space:nowrap;color:var(--color-neutral-600, oklch(43.9% 0 0));-webkit-user-select:all;user-select:all}.axp-menu-customizer .axp-menu-customizer__item-actions{margin-left:auto;flex-shrink:0;opacity:60%;transition-property:opacity;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-duration: initial;--tw-font-weight: initial;--tw-tracking: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
7317
6994
  }], propDecorators: { scopeKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "scopeKey", required: true }] }], showToolbar: [{ type: i0.Input, args: [{ isSignal: true, alias: "showToolbar", required: false }] }], allowAddItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowAddItems", required: false }] }], dragBehavior: [{ type: i0.Input, args: [{ isSignal: true, alias: "dragBehavior", required: false }] }], dragArea: [{ type: i0.Input, args: [{ isSignal: true, alias: "dragArea", required: false }] }], saved: [{ type: i0.Output, args: ["saved"] }], cancelled: [{ type: i0.Output, args: ["cancelled"] }], tree: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXTreeViewComponent), { isSignal: true }] }] } });
7318
6995
 
7319
6996
  //#region ---- Imports ----
@@ -7426,7 +7103,7 @@ class AXPOutcomeResultsViewerComponent {
7426
7103
  }
7427
7104
  </ul>
7428
7105
  </ng-template>
7429
- `, isInline: true, styles: [".axp-outcome-results-viewer .__text-muted{color:rgb(var(--ax-sys-color-on-surface-variant))}.axp-outcome-results-viewer .__list{background-color:rgb(var(--ax-sys-color-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.axp-outcome-results-viewer .__row{border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.axp-outcome-results-viewer .__outcome-value{display:inline-flex;align-items:center;gap:.5rem;border-radius:.375rem;padding:.125rem .5rem;border-width:1px;border-style:solid;max-width:min(100%,28rem)}.axp-outcome-results-viewer .__outcome-value.__tone-default{color:rgb(var(--ax-sys-color-on-surface));background-color:rgb(var(--ax-sys-color-surface));border-color:rgb(var(--ax-sys-color-border-surface))}.axp-outcome-results-viewer .__outcome-value.__emphasis-medium{font-weight:500}.axp-outcome-results-viewer .__outcome-value.__emphasis-bold{font-weight:600}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
7106
+ `, isInline: true, styles: ["@layer properties;.axp-outcome-results-viewer .__text-muted{color:rgb(var(--ax-sys-color-on-surface-variant))}.axp-outcome-results-viewer .__list{background-color:rgb(var(--ax-sys-color-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.axp-outcome-results-viewer .__row{border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.axp-outcome-results-viewer .__outcome-value{display:inline-flex;max-width:min(100%,28rem);align-items:center;gap:calc(var(--spacing, .25rem) * 2);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: solid;border-style:solid;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5)}.axp-outcome-results-viewer .__outcome-value.__tone-default{color:rgb(var(--ax-sys-color-on-surface));background-color:rgb(var(--ax-sys-color-surface));border-color:rgb(var(--ax-sys-color-border-surface))}.axp-outcome-results-viewer .__outcome-value.__emphasis-medium{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-outcome-results-viewer .__outcome-value.__emphasis-bold{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
7430
7107
  }
7431
7108
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPOutcomeResultsViewerComponent, decorators: [{
7432
7109
  type: Component,
@@ -7487,7 +7164,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
7487
7164
  }
7488
7165
  </ul>
7489
7166
  </ng-template>
7490
- `, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet], encapsulation: ViewEncapsulation.None, host: { class: 'axp-outcome-results-viewer block' }, styles: [".axp-outcome-results-viewer .__text-muted{color:rgb(var(--ax-sys-color-on-surface-variant))}.axp-outcome-results-viewer .__list{background-color:rgb(var(--ax-sys-color-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.axp-outcome-results-viewer .__row{border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.axp-outcome-results-viewer .__outcome-value{display:inline-flex;align-items:center;gap:.5rem;border-radius:.375rem;padding:.125rem .5rem;border-width:1px;border-style:solid;max-width:min(100%,28rem)}.axp-outcome-results-viewer .__outcome-value.__tone-default{color:rgb(var(--ax-sys-color-on-surface));background-color:rgb(var(--ax-sys-color-surface));border-color:rgb(var(--ax-sys-color-border-surface))}.axp-outcome-results-viewer .__outcome-value.__emphasis-medium{font-weight:500}.axp-outcome-results-viewer .__outcome-value.__emphasis-bold{font-weight:600}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
7167
+ `, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet], encapsulation: ViewEncapsulation.None, host: { class: 'axp-outcome-results-viewer block' }, styles: ["@layer properties;.axp-outcome-results-viewer .__text-muted{color:rgb(var(--ax-sys-color-on-surface-variant))}.axp-outcome-results-viewer .__list{background-color:rgb(var(--ax-sys-color-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.axp-outcome-results-viewer .__row{border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.axp-outcome-results-viewer .__outcome-value{display:inline-flex;max-width:min(100%,28rem);align-items:center;gap:calc(var(--spacing, .25rem) * 2);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: solid;border-style:solid;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5)}.axp-outcome-results-viewer .__outcome-value.__tone-default{color:rgb(var(--ax-sys-color-on-surface));background-color:rgb(var(--ax-sys-color-surface));border-color:rgb(var(--ax-sys-color-border-surface))}.axp-outcome-results-viewer .__outcome-value.__emphasis-medium{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-outcome-results-viewer .__outcome-value.__emphasis-bold{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
7491
7168
  }], propDecorators: { model: [{ type: i0.Input, args: [{ isSignal: true, alias: "model", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }] } });
7492
7169
 
7493
7170
  //#region ---- Outcome results view model ----
@@ -7928,29 +7605,41 @@ class AXPResourceAppointmentComponent {
7928
7605
  this.resourceAppointmentService.executeCommand(event.item.data?.command, providerName);
7929
7606
  }
7930
7607
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPResourceAppointmentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
7931
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPResourceAppointmentComponent, isStandalone: true, selector: "axp-resource-appointment", inputs: { showResourceHeaders: { classPropertyName: "showResourceHeaders", publicName: "showResourceHeaders", isSignal: true, isRequired: false, transformFunction: null }, showUnassignedAppointments: { classPropertyName: "showUnassignedAppointments", publicName: "showUnassignedAppointments", isSignal: true, isRequired: false, transformFunction: null }, providerName: { classPropertyName: "providerName", publicName: "providerName", isSignal: true, isRequired: false, transformFunction: null } }, providers: [AXPResourceAppointmentService], viewQueries: [{ propertyName: "contextMenu", first: true, predicate: ["contextMenu"], descendants: true, isSignal: true }, { propertyName: "schedulerRef", first: true, predicate: ["scheduler"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"axp-resource-appointment__container flex flex-col min-h-0 h-full\">\n @if (isReady()) {\n <!-- TODO: Add weekly view 'timeline-weekly' -->\n <ax-scheduler\n #scheduler\n [views]=\"['timeline-day', 'timeline-month']\"\n [dataSource]=\"schedulerAppointments()\"\n [resources]=\"schedulerResources()\"\n [startingDate]=\"currentDate()\"\n [selectedView]=\"currentView()\"\n [draggable]=\"false\"\n (onRangeChanged)=\"handleRangeChanged($event)\"\n class=\"axp-resource-appointment__scheduler bg-lightest dark:bg-darkest flex-1\"\n ></ax-scheduler>\n\n <ax-context-menu\n #contextMenu\n [closeOn]=\"'leave'\"\n [orientation]=\"'vertical'\"\n (onOpening)=\"handleContextMenuOpening($event)\"\n (onItemClick)=\"handleContextMenuItemClick($event)\"\n ></ax-context-menu>\n } @else {\n <div class=\"axp-resource-appointment__loading flex items-center justify-center w-full h-full\">\n <ax-loading></ax-loading>\n </div>\n }\n</div>\n", styles: [":host{display:block;width:100%;height:100%}.axp-resource-appointment__scheduler{--ax-comp-scheduler-width: 100%;width:100%;height:100%;min-height:400px}.axp-resource-appointment__loading{min-height:300px}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: AXCommonModule }, { kind: "ngmodule", type: AXMenuModule }, { kind: "component", type: i1$7.AXContextMenuComponent, selector: "ax-context-menu", inputs: ["orientation", "openOn", "closeOn", "closeOnRouteChange", "items", "target"], outputs: ["onItemClick", "onOpening", "onClose"] }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i7.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "component", type: AXSchedulerComponent, selector: "ax-scheduler", inputs: ["calendar", "startingDate", "endDayHour", "startDayHour", "hasHeader", "readonly", "draggable", "hasActions", "dragStartDelay", "weekend", "allowFullScreen", "multiDayViewDaysCount", "showResourceHeaders", "showCurrentTimeIndicator", "scrollToCurrentTimeIndicator", "showUnassignedAppointments", "resources", "resourceTemplate", "firstDayOfWeek", "tooltipTemplate", "dataSource", "holidays", "views", "selectedView"], outputs: ["selectedViewChange", "onDataLoaded", "onRangeChanged", "onSlotClicked", "onSlotDblClicked", "onSlotRightClick", "onAppointmentDrop", "onActionClick", "onAppointmentClicked", "onAppointmentDblClicked", "onAppointmentRightClick"] }, { kind: "ngmodule", type: AXButtonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
7608
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPResourceAppointmentComponent, isStandalone: true, selector: "axp-resource-appointment", inputs: { showResourceHeaders: { classPropertyName: "showResourceHeaders", publicName: "showResourceHeaders", isSignal: true, isRequired: false, transformFunction: null }, showUnassignedAppointments: { classPropertyName: "showUnassignedAppointments", publicName: "showUnassignedAppointments", isSignal: true, isRequired: false, transformFunction: null }, providerName: { classPropertyName: "providerName", publicName: "providerName", isSignal: true, isRequired: false, transformFunction: null } }, providers: [AXPResourceAppointmentService], viewQueries: [{ propertyName: "contextMenu", first: true, predicate: ["contextMenu"], descendants: true, isSignal: true }, { propertyName: "schedulerRef", first: true, predicate: ["scheduler"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"axp-resource-appointment__container flex flex-col min-h-0 h-full\">\n @if (isReady()) {\n <!-- TODO: Add weekly view 'timeline-weekly' -->\n <ax-scheduler\n #scheduler\n [views]=\"['timeline-day', 'timeline-month']\"\n [dataSource]=\"schedulerAppointments()\"\n [resources]=\"schedulerResources()\"\n [startingDate]=\"currentDate()\"\n [selectedView]=\"currentView()\"\n [draggable]=\"false\"\n (onRangeChanged)=\"handleRangeChanged($event)\"\n class=\"axp-resource-appointment__scheduler bg-lightest dark:bg-darkest flex-1\"\n ></ax-scheduler>\n\n <ax-context-menu\n #contextMenu\n [closeOn]=\"'leave'\"\n [orientation]=\"'vertical'\"\n (onOpening)=\"handleContextMenuOpening($event)\"\n (onItemClick)=\"handleContextMenuItemClick($event)\"\n ></ax-context-menu>\n } @else {\n <div class=\"axp-resource-appointment__loading flex items-center justify-center w-full h-full\">\n <ax-loading></ax-loading>\n </div>\n }\n</div>\n", styles: [":host{display:block;height:100%;width:100%}:host .axp-resource-appointment__scheduler{--ax-comp-scheduler-width: 100%;height:100%;width:100%;min-height:400px}:host .axp-resource-appointment__loading{min-height:300px}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: AXCommonModule }, { kind: "ngmodule", type: AXMenuModule }, { kind: "component", type: i1$8.AXContextMenuComponent, selector: "ax-context-menu", inputs: ["orientation", "openOn", "closeOn", "closeOnRouteChange", "items", "target"], outputs: ["onItemClick", "onOpening", "onClose"] }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i7.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "component", type: AXSchedulerComponent, selector: "ax-scheduler", inputs: ["calendar", "startingDate", "endDayHour", "startDayHour", "hasHeader", "readonly", "draggable", "hasActions", "dragStartDelay", "weekend", "allowFullScreen", "multiDayViewDaysCount", "showResourceHeaders", "showCurrentTimeIndicator", "scrollToCurrentTimeIndicator", "showUnassignedAppointments", "resources", "resourceTemplate", "firstDayOfWeek", "tooltipTemplate", "dataSource", "holidays", "views", "selectedView"], outputs: ["selectedViewChange", "onDataLoaded", "onRangeChanged", "onSlotClicked", "onSlotDblClicked", "onSlotRightClick", "onAppointmentDrop", "onActionClick", "onAppointmentClicked", "onAppointmentDblClicked", "onAppointmentRightClick"] }, { kind: "ngmodule", type: AXButtonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
7932
7609
  }
7933
7610
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPResourceAppointmentComponent, decorators: [{
7934
7611
  type: Component,
7935
- args: [{ selector: 'axp-resource-appointment', imports: [AXCommonModule, AXMenuModule, AXLoadingModule, AXSchedulerComponent, AXButtonModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [AXPResourceAppointmentService], template: "<div class=\"axp-resource-appointment__container flex flex-col min-h-0 h-full\">\n @if (isReady()) {\n <!-- TODO: Add weekly view 'timeline-weekly' -->\n <ax-scheduler\n #scheduler\n [views]=\"['timeline-day', 'timeline-month']\"\n [dataSource]=\"schedulerAppointments()\"\n [resources]=\"schedulerResources()\"\n [startingDate]=\"currentDate()\"\n [selectedView]=\"currentView()\"\n [draggable]=\"false\"\n (onRangeChanged)=\"handleRangeChanged($event)\"\n class=\"axp-resource-appointment__scheduler bg-lightest dark:bg-darkest flex-1\"\n ></ax-scheduler>\n\n <ax-context-menu\n #contextMenu\n [closeOn]=\"'leave'\"\n [orientation]=\"'vertical'\"\n (onOpening)=\"handleContextMenuOpening($event)\"\n (onItemClick)=\"handleContextMenuItemClick($event)\"\n ></ax-context-menu>\n } @else {\n <div class=\"axp-resource-appointment__loading flex items-center justify-center w-full h-full\">\n <ax-loading></ax-loading>\n </div>\n }\n</div>\n", styles: [":host{display:block;width:100%;height:100%}.axp-resource-appointment__scheduler{--ax-comp-scheduler-width: 100%;width:100%;height:100%;min-height:400px}.axp-resource-appointment__loading{min-height:300px}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
7612
+ args: [{ selector: 'axp-resource-appointment', imports: [AXCommonModule, AXMenuModule, AXLoadingModule, AXSchedulerComponent, AXButtonModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [AXPResourceAppointmentService], template: "<div class=\"axp-resource-appointment__container flex flex-col min-h-0 h-full\">\n @if (isReady()) {\n <!-- TODO: Add weekly view 'timeline-weekly' -->\n <ax-scheduler\n #scheduler\n [views]=\"['timeline-day', 'timeline-month']\"\n [dataSource]=\"schedulerAppointments()\"\n [resources]=\"schedulerResources()\"\n [startingDate]=\"currentDate()\"\n [selectedView]=\"currentView()\"\n [draggable]=\"false\"\n (onRangeChanged)=\"handleRangeChanged($event)\"\n class=\"axp-resource-appointment__scheduler bg-lightest dark:bg-darkest flex-1\"\n ></ax-scheduler>\n\n <ax-context-menu\n #contextMenu\n [closeOn]=\"'leave'\"\n [orientation]=\"'vertical'\"\n (onOpening)=\"handleContextMenuOpening($event)\"\n (onItemClick)=\"handleContextMenuItemClick($event)\"\n ></ax-context-menu>\n } @else {\n <div class=\"axp-resource-appointment__loading flex items-center justify-center w-full h-full\">\n <ax-loading></ax-loading>\n </div>\n }\n</div>\n", styles: [":host{display:block;height:100%;width:100%}:host .axp-resource-appointment__scheduler{--ax-comp-scheduler-width: 100%;height:100%;width:100%;min-height:400px}:host .axp-resource-appointment__loading{min-height:300px}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
7936
7613
  }], ctorParameters: () => [], propDecorators: { showResourceHeaders: [{ type: i0.Input, args: [{ isSignal: true, alias: "showResourceHeaders", required: false }] }], showUnassignedAppointments: [{ type: i0.Input, args: [{ isSignal: true, alias: "showUnassignedAppointments", required: false }] }], providerName: [{ type: i0.Input, args: [{ isSignal: true, alias: "providerName", required: false }] }], contextMenu: [{ type: i0.ViewChild, args: ['contextMenu', { isSignal: true }] }], schedulerRef: [{ type: i0.ViewChild, args: ['scheduler', { isSignal: true }] }] } });
7937
7614
 
7938
7615
  //#region ---- Core value model (Sections / Items) ----
7939
7616
  //#endregion
7940
7617
 
7618
+ //#region ----- Imports -----
7619
+ //#endregion
7620
+ //#region ----- Component -----
7941
7621
  class AXPSectionItemsBuilderComponent {
7622
+ //#endregion
7623
+ //#region ----- Lifecycle -----
7942
7624
  constructor() {
7625
+ //#region ----- Template Helpers -----
7943
7626
  /** Used in template to branch between escaped text and sanitized HTML. */
7944
7627
  this.containsHtmlMarkup = containsHtmlMarkup;
7628
+ //#endregion
7629
+ //#region ----- Inputs & Outputs -----
7945
7630
  this.value = input.required(...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
7946
7631
  this.definition = input.required(...(ngDevMode ? [{ debugName: "definition" }] : /* istanbul ignore next */ []));
7947
7632
  this.readonlyMode = input(false, { ...(ngDevMode ? { debugName: "readonlyMode" } : /* istanbul ignore next */ {}), alias: 'readonly' });
7948
7633
  this.valueChange = output();
7634
+ //#endregion
7635
+ //#region ----- State Signals -----
7949
7636
  this.vm = signal({ sections: [] }, ...(ngDevMode ? [{ debugName: "vm" }] : /* istanbul ignore next */ []));
7950
7637
  /** Snapshot from the last external `[value]` sync (load, discard, save refresh). */
7951
7638
  this.baseline = signal({ sections: [] }, ...(ngDevMode ? [{ debugName: "baseline" }] : /* istanbul ignore next */ []));
7952
7639
  /** Set on local {@link commit}; cleared on external sync or {@link markClean}. */
7953
7640
  this.pendingCommitSnapshot = null;
7641
+ //#endregion
7642
+ //#region ----- Computed Properties -----
7954
7643
  /** True when the live model differs from the external baseline. */
7955
7644
  this.isDirty = computed(() => !isFormValueEqual(this.normalizeValue(this.vm()), this.baseline()), ...(ngDevMode ? [{ debugName: "isDirty" }] : /* istanbul ignore next */ []));
7956
7645
  this.sectionsModel = computed(() => this.normalizeValue(this.vm()), ...(ngDevMode ? [{ debugName: "sectionsModel" }] : /* istanbul ignore next */ []));
@@ -7998,6 +7687,8 @@ class AXPSectionItemsBuilderComponent {
7998
7687
  });
7999
7688
  });
8000
7689
  }
7690
+ //#endregion
7691
+ //#region ----- Public API -----
8001
7692
  /** Align dirty baseline to the current model (call after save). */
8002
7693
  markClean() {
8003
7694
  this.baseline.set(cloneDeep(this.normalizeValue(this.vm())));
@@ -8009,6 +7700,8 @@ class AXPSectionItemsBuilderComponent {
8009
7700
  async addSection() {
8010
7701
  await this.onAddSectionClick();
8011
7702
  }
7703
+ //#endregion
7704
+ //#region ----- Section Handlers -----
8012
7705
  async onAddSectionClick() {
8013
7706
  if (this.readonlyMode())
8014
7707
  return;
@@ -8020,7 +7713,9 @@ class AXPSectionItemsBuilderComponent {
8020
7713
  return;
8021
7714
  const sections = [...this.sectionsModel().sections];
8022
7715
  const p = partial;
8023
- const fromPartial = (typeof p['name'] === 'string' && p['name'].trim()) || (typeof p['id'] === 'string' && p['id'].trim()) || '';
7716
+ const fromPartial = (typeof p['name'] === 'string' && p['name'].trim()) ||
7717
+ (typeof p['id'] === 'string' && p['id'].trim()) ||
7718
+ '';
8024
7719
  const id = fromPartial || AXPDataGenerator.uuid();
8025
7720
  const section = {
8026
7721
  ...partial,
@@ -8063,6 +7758,15 @@ class AXPSectionItemsBuilderComponent {
8063
7758
  const remaining = this.sectionsModel().sections.filter((s) => s.id !== section.id);
8064
7759
  this.commit({ sections: this.reindexSections(remaining) });
8065
7760
  }
7761
+ onSectionDrop(event) {
7762
+ if (this.readonlyMode())
7763
+ return;
7764
+ const list = [...this.sectionsModel().sections];
7765
+ moveItemInArray(list, event.previousIndex, event.currentIndex);
7766
+ this.commit({ sections: this.reindexSections(list) });
7767
+ }
7768
+ //#endregion
7769
+ //#region ----- Item Handlers -----
8066
7770
  async onAddItems(section) {
8067
7771
  if (this.readonlyMode())
8068
7772
  return;
@@ -8105,7 +7809,9 @@ class AXPSectionItemsBuilderComponent {
8105
7809
  if (it.id !== item.id)
8106
7810
  return it;
8107
7811
  const merged = { ...it, ...updated };
8108
- const nextId = updated.id !== undefined && String(updated.id).length > 0 ? String(updated.id) : it.id;
7812
+ const nextId = updated.id !== undefined && String(updated.id).length > 0
7813
+ ? String(updated.id)
7814
+ : it.id;
8109
7815
  return { ...merged, id: nextId };
8110
7816
  }),
8111
7817
  };
@@ -8128,13 +7834,6 @@ class AXPSectionItemsBuilderComponent {
8128
7834
  });
8129
7835
  this.commit({ sections });
8130
7836
  }
8131
- onSectionDrop(event) {
8132
- if (this.readonlyMode())
8133
- return;
8134
- const list = [...this.sectionsModel().sections];
8135
- moveItemInArray(list, event.previousIndex, event.currentIndex);
8136
- this.commit({ sections: this.reindexSections(list) });
8137
- }
8138
7837
  onItemDrop(event, targetSectionId) {
8139
7838
  if (this.readonlyMode())
8140
7839
  return;
@@ -8163,6 +7862,8 @@ class AXPSectionItemsBuilderComponent {
8163
7862
  sections[targetIdx] = { ...target, items: this.reindexItems(targetItems) };
8164
7863
  this.commit({ sections });
8165
7864
  }
7865
+ //#endregion
7866
+ //#region ----- Display Helpers -----
8166
7867
  sectionItemsListId(sectionId) {
8167
7868
  return `section-${sectionId}-items`;
8168
7869
  }
@@ -8234,6 +7935,8 @@ class AXPSectionItemsBuilderComponent {
8234
7935
  }
8235
7936
  return '';
8236
7937
  }
7938
+ //#endregion
7939
+ //#region ----- Model Sync -----
8237
7940
  commit(next) {
8238
7941
  const normalized = this.normalizeValue(next);
8239
7942
  this.vm.set(normalized);
@@ -8258,7 +7961,7 @@ class AXPSectionItemsBuilderComponent {
8258
7961
  return items.map((it, i) => ({ ...it, order: i }));
8259
7962
  }
8260
7963
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSectionItemsBuilderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
8261
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPSectionItemsBuilderComponent, isStandalone: true, selector: "axp-section-items-builder", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, definition: { classPropertyName: "definition", publicName: "definition", isSignal: true, isRequired: true, transformFunction: null }, readonlyMode: { classPropertyName: "readonlyMode", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, host: { classAttribute: "axp-section-items-builder-host" }, ngImport: i0, template: "<div class=\"axp-section-items-builder\" *translate=\"let t\">\n <div class=\"__content\">\n @if (sectionsModel().sections.length === 0) {\n <axp-state-message\n icon=\"fa-light fa-layer-group\"\n [title]=\"definition().texts.emptySectionsTitle\"\n [description]=\"definition().texts.emptySectionsDescription\"\n >\n </axp-state-message>\n } @else {\n <div\n class=\"__sections-container\"\n cdkDropList\n [cdkDropListData]=\"sectionsModel().sections\"\n (cdkDropListDropped)=\"onSectionDrop($event)\"\n >\n @for (row of sectionRows(); track row.section.id) {\n <div\n class=\"__section\"\n cdkDrag\n cdkDragPreviewClass=\"axp-section-items-builder-drag-preview\"\n >\n <div class=\"__section-header\">\n @if (!readonlyMode()) {\n <div class=\"__section-drag-handle\" cdkDragHandle>\n <ax-icon icon=\"fa-solid fa-grip-vertical\"></ax-icon>\n </div>\n }\n <div class=\"__section-info\">\n @let secTitle =\n sectionTitleValue(row.section) | translate | async;\n <h3 class=\"__section-title\" [title]=\"secTitle\">\n {{ secTitle }}\n @if (definition().showSectionTechnicalName) {\n @let secTechName =\n sectionNameValue(row.section) | translate | async;\n @if (secTechName?.trim()) {\n <span class=\"__section-name-prefix\"\n >({{ secTechName }})</span\n >\n }\n }\n @if (isDefaultSection(row.section)) {\n @if (\n definition().texts.defaultSectionBadge;\n as defaultBadge\n ) {\n <span class=\"__default-section-badge\">{{\n defaultBadge | translate | async\n }}</span>\n }\n }\n </h3>\n @let secDesc =\n (sectionDescriptionValue(row.section) | translate | async) ||\n '';\n @let secDescTrimmed = secDesc?.trim();\n @if (secDescTrimmed) {\n @if (containsHtmlMarkup(secDescTrimmed)) {\n <div\n class=\"__section-description __section-description--rich\"\n [title]=\"tooltipPlainTextForHtml(secDesc)\"\n [innerHTML]=\"secDesc | safe: 'html'\"\n ></div>\n } @else {\n <p class=\"__section-description\" [title]=\"secDescTrimmed\">\n {{ secDescTrimmed }}\n </p>\n }\n }\n </div>\n @if (!readonlyMode()) {\n <div class=\"__section-actions\">\n @if (definition().promptAddItems) {\n <ax-button\n [text]=\"definition().texts.addItem | translate | async\"\n [color]=\"'accent2'\"\n (onClick)=\"onAddItems(row.section)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n }\n @if (definition().promptEditSection || canRemoveSection()) {\n <div class=\"__section-inline-actions\">\n @if (definition().promptEditSection) {\n <ax-button\n [look]=\"'blank'\"\n color=\"accent3\"\n (onClick)=\"onEditSection(row.section)\"\n >\n <ax-icon class=\"fa-light fa-pencil\"></ax-icon>\n </ax-button>\n }\n @if (canRemoveSection()) {\n <ax-button\n [look]=\"'blank'\"\n color=\"danger\"\n (onClick)=\"onRemoveSection(row.section)\"\n >\n <ax-icon class=\"fa-light fa-trash-can\"></ax-icon>\n </ax-button>\n }\n </div>\n }\n </div>\n }\n </div>\n\n <div class=\"__items-container\">\n <div\n class=\"__items-list\"\n cdkDropList\n [id]=\"sectionItemsListId(row.section.id)\"\n [cdkDropListData]=\"row.section.items\"\n [cdkDropListConnectedTo]=\"itemDropListIds()\"\n (cdkDropListDropped)=\"onItemDrop($event, row.section.id)\"\n >\n @if (row.itemRows.length === 0) {\n <axp-state-message\n icon=\"fa-light fa-inbox\"\n [title]=\"definition().texts.emptyItemsTitle\"\n [description]=\"definition().texts.emptyItemsDescription\"\n >\n </axp-state-message>\n } @else {\n @for (ir of row.itemRows; track ir.item.id) {\n <div\n class=\"__item\"\n cdkDrag\n cdkDragPreviewClass=\"axp-section-items-builder-drag-preview\"\n >\n @if (!readonlyMode()) {\n <div class=\"__drag-handle\" cdkDragHandle>\n <ax-icon icon=\"fa-solid fa-grip-vertical\"></ax-icon>\n </div>\n }\n <div class=\"__item-content\">\n <div\n class=\"__item-leading\"\n [title]=\"\n itemMultilingualField(\n ir.item,\n 'title',\n ir.view.title\n )\n | translate\n | async\n \"\n >\n <div\n class=\"__item-icon\"\n [class.__tone-easy]=\"ir.view.iconTone === 'easy'\"\n [class.__tone-medium]=\"\n ir.view.iconTone === 'medium'\n \"\n [class.__tone-hard]=\"ir.view.iconTone === 'hard'\"\n >\n <ax-icon [icon]=\"ir.view.icon\"></ax-icon>\n </div>\n </div>\n <div class=\"__item-info\">\n <div class=\"__item-info-body\">\n <div class=\"__title-row\">\n @let itemTitle =\n itemMultilingualField(\n ir.item,\n 'title',\n ir.view.title\n )\n | translate\n | async;\n @let itemName =\n itemMultilingualField(\n ir.item,\n 'name',\n ir.view.name\n )\n | translate\n | async;\n <h4\n class=\"__item-title\"\n [title]=\"\n itemTitle +\n (itemName?.trim()\n ? ' (' + itemName + ')'\n : '')\n \"\n >\n {{ itemTitle }}\n @if (itemName?.trim()) {\n <span class=\"__item-name-prefix\"\n >({{ itemName }})</span\n >\n }\n </h4>\n </div>\n @let itemDesc =\n (itemMultilingualField(\n ir.item,\n 'description',\n ir.view.description\n )\n | translate\n | async) || '';\n @let itemDescTrimmed = itemDesc?.trim();\n @if (itemDescTrimmed) {\n @if (containsHtmlMarkup(itemDescTrimmed)) {\n <div\n class=\"__item-description __item-description--rich\"\n [title]=\"tooltipPlainTextForHtml(itemDesc)\"\n [innerHTML]=\"itemDesc | safe: 'html'\"\n ></div>\n } @else {\n <p\n class=\"__item-description\"\n [title]=\"itemDescTrimmed\"\n >\n {{ itemDescTrimmed }}\n </p>\n }\n }\n </div>\n <div class=\"__title-actions\">\n @for (b of ir.view.badges; track $index) {\n <span\n class=\"__item-badge\"\n [class.__badge-neutral]=\"\n !b.variant || b.variant === 'neutral'\n \"\n [class.__badge-accent]=\"b.variant === 'accent'\"\n [class.__badge-warning]=\"\n b.variant === 'warning'\n \"\n [class.__badge-danger]=\"b.variant === 'danger'\"\n [class.__badge-success]=\"\n b.variant === 'success'\n \"\n >\n @if (isTranslationKey(b.text)) {\n {{ b.text | translate | async }}\n } @else {\n {{ b.text }}\n }\n </span>\n }\n @if (!readonlyMode()) {\n <div class=\"__item-actions\">\n @if (definition().promptEditItem) {\n <ax-button\n [look]=\"'blank'\"\n color=\"accent3\"\n (onClick)=\"\n onEditItem(ir.item, row.section.id)\n \"\n >\n <ax-icon\n class=\"fa-light fa-pencil\"\n ></ax-icon>\n </ax-button>\n }\n <ax-button\n [look]=\"'blank'\"\n color=\"danger\"\n (onClick)=\"\n onRemoveItem(ir.item, row.section.id)\n \"\n >\n <ax-icon\n class=\"fa-light fa-trash-can\"\n ></ax-icon>\n </ax-button>\n </div>\n }\n </div>\n </div>\n </div>\n </div>\n }\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n </div>\n</div>\n", styles: ["@layer properties;.axp-section-items-builder{display:flex;height:100%;width:100%;flex-direction:column}.axp-section-items-builder .__content{flex:1;overflow:auto}.axp-section-items-builder .__sections-container{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4)}.axp-section-items-builder .__section{border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-section-items-builder .__section .__section-header{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);padding:calc(var(--spacing, .25rem) * 3)}.axp-section-items-builder .__section .__section-header .__section-drag-handle{display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);align-items:center;justify-content:center;color:var(--color-neutral-400, oklch(70.8% 0 0));cursor:grab}.axp-section-items-builder .__section .__section-header .__section-drag-handle:active{cursor:grabbing}.axp-section-items-builder .__section .__section-header .__section-drag-handle:hover{color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-section-items-builder .__section .__section-header .__section-info{min-width:0;flex:1}.axp-section-items-builder .__section .__section-header .__section-info .__section-title{margin-bottom:var(--spacing, .25rem);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;min-width:0;overflow:hidden;font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);overflow-wrap:break-word}.axp-section-items-builder .__section .__section-header .__section-info .__section-title .__section-name-prefix{margin-left:var(--spacing, .25rem);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300);color:var(--color-neutral-500, oklch(55.6% 0 0));font-weight:300}.axp-section-items-builder .__section .__section-header .__section-info .__section-title .__default-section-badge{margin-left:calc(var(--spacing, .25rem) * 2);display:inline-flex;border-radius:.25rem;background-color:var(--color-neutral-100, oklch(97% 0 0));padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);color:var(--color-neutral-500, oklch(55.6% 0 0))}.axp-section-items-builder .__section .__section-header .__section-info .__section-description,.axp-section-items-builder .__section .__section-header .__section-info .__section-description--rich{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);overflow-wrap:break-word;color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-section-items-builder .__section .__section-header .__section-info .__section-description--rich p{margin:0}.axp-section-items-builder .__section .__section-header .__section-info .__section-description--rich p:first-child{margin-top:0}.axp-section-items-builder .__section .__section-header .__section-info .__section-description--rich ul{list-style-type:disc;list-style-position:outside;margin-block:.375rem 0;padding-inline-start:1.25rem}.axp-section-items-builder .__section .__section-header .__section-info .__section-description--rich ol{list-style-type:decimal;list-style-position:outside;margin-block:.375rem 0;padding-inline-start:1.25rem}.axp-section-items-builder .__section .__section-header .__section-info .__section-description--rich li{margin-block:.125rem;padding-inline-start:.25rem}.axp-section-items-builder .__section .__section-header .__section-actions{display:flex;flex-shrink:0;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.axp-section-items-builder .__section .__section-header .__section-inline-actions{display:flex;align-items:center;gap:0}.axp-section-items-builder .__section .__items-container{padding:calc(var(--spacing, .25rem) * 4)}.axp-section-items-builder .__section .__items-container .__items-list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 3);min-height:3rem}.axp-section-items-builder .__item{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;padding:calc(var(--spacing, .25rem) * 3);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);-webkit-user-select:none;user-select:none}.axp-section-items-builder .__item .__drag-handle{display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);align-items:center;justify-content:center;color:var(--color-neutral-400, oklch(70.8% 0 0));cursor:grab}.axp-section-items-builder .__item .__drag-handle:active{cursor:grabbing}.axp-section-items-builder .__item .__drag-handle:hover{color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-section-items-builder .__item .__item-content{display:flex;min-width:0;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 3)}.axp-section-items-builder .__item .__item-content .__item-leading{display:flex;flex-shrink:0;align-items:center;justify-content:center}.axp-section-items-builder .__item .__item-content .__item-icon{display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);align-items:center;justify-content:center;border-radius:var(--radius-md, .375rem);background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);color:rgba(var(--ax-sys-color-accent2-surface));--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-section-items-builder .__item .__item-content .__item-icon.__tone-easy{background-color:rgba(var(--ax-sys-color-success-surface));color:rgba(var(--ax-sys-color-success-surface))}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-icon.__tone-easy{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 10%,transparent)}}.axp-section-items-builder .__item .__item-content .__item-icon.__tone-medium{background-color:rgba(var(--ax-sys-color-warning-surface));color:rgba(var(--ax-sys-color-warning-surface))}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-icon.__tone-medium{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-surface)) 10%,transparent)}}.axp-section-items-builder .__item .__item-content .__item-icon.__tone-hard{background-color:rgba(var(--ax-sys-color-danger-surface));color:rgba(var(--ax-sys-color-danger-surface))}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-icon.__tone-hard{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 10%,transparent)}}.axp-section-items-builder .__item .__item-content .__item-info{display:flex;min-width:0;flex:1;flex-direction:row;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3)}.axp-section-items-builder .__item .__item-content .__item-info-body{display:flex;min-width:0;flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}.axp-section-items-builder .__item .__item-content .__title-row{display:flex;min-width:0;align-items:baseline}.axp-section-items-builder .__item .__item-content .__item-title{margin-bottom:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;min-width:0;flex:1;overflow:hidden;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);overflow-wrap:break-word}.axp-section-items-builder .__item .__item-content .__item-title .__item-name-prefix{margin-left:var(--spacing, .25rem);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300);color:var(--color-neutral-500, oklch(55.6% 0 0));font-weight:300}.axp-section-items-builder .__item .__item-content .__item-description,.axp-section-items-builder .__item .__item-content .__item-description--rich{margin-top:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);overflow-wrap:break-word;color:var(--color-neutral-500, oklch(55.6% 0 0))}.axp-section-items-builder .__item .__item-content .__item-description--rich p{margin:0}.axp-section-items-builder .__item .__item-content .__item-description--rich p:first-child{margin-top:0}.axp-section-items-builder .__item .__item-content .__item-description--rich ul{list-style-type:disc;list-style-position:outside;margin-block:.375rem 0;padding-inline-start:1.25rem}.axp-section-items-builder .__item .__item-content .__item-description--rich ol{list-style-type:decimal;list-style-position:outside;margin-block:.375rem 0;padding-inline-start:1.25rem}.axp-section-items-builder .__item .__item-content .__item-description--rich li{margin-block:.125rem;padding-inline-start:.25rem}.axp-section-items-builder .__item .__item-content .__title-actions{display:flex;flex-shrink:0;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:calc(var(--spacing, .25rem) * 2)}.axp-section-items-builder .__item .__item-content .__item-badge{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:1px;font-size:.6875rem;--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-section-items-builder .__item .__item-content .__item-badge.__badge-neutral{border-color:var(--color-neutral-200, oklch(92.2% 0 0));background-color:var(--color-neutral-100, oklch(97% 0 0));color:var(--color-neutral-700, oklch(37.1% 0 0))}.axp-section-items-builder .__item .__item-content .__item-badge.__badge-accent{border-color:rgba(var(--ax-sys-color-accent2-surface));background-color:rgba(var(--ax-sys-color-accent2-surface));color:rgba(var(--ax-sys-color-accent2-surface))}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-badge.__badge-accent{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-accent2-surface)) 30%,transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-badge.__badge-accent{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-accent2-surface)) 10%,transparent)}}.axp-section-items-builder .__item .__item-content .__item-badge.__badge-warning{border-color:rgba(var(--ax-sys-color-warning-surface));background-color:rgba(var(--ax-sys-color-warning-lightest-surface));color:rgba(var(--ax-sys-color-warning-800))}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-badge.__badge-warning{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-surface)) 40%,transparent)}}.axp-section-items-builder .__item .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){border-color:rgba(var(--ax-sys-color-warning-600))}.axp-section-items-builder .__item .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-warning-900))}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-900)) 85%,transparent)}}.axp-section-items-builder .__item .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){color:rgba(var(--ax-sys-color-warning-100))}.axp-section-items-builder .__item .__item-content .__item-badge.__badge-danger{border-color:rgba(var(--ax-sys-color-danger-surface));background-color:rgba(var(--ax-sys-color-danger-surface));color:rgba(var(--ax-sys-color-danger-surface))}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-badge.__badge-danger{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 40%,transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-badge.__badge-danger{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 10%,transparent)}}.axp-section-items-builder .__item .__item-content .__item-badge.__badge-success{border-color:rgba(var(--ax-sys-color-success-surface));background-color:rgba(var(--ax-sys-color-success-surface));color:rgba(var(--ax-sys-color-success-surface))}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-badge.__badge-success{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 40%,transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-badge.__badge-success{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 10%,transparent)}}.axp-section-items-builder .__item .__item-content .__item-actions{display:flex;align-items:center;gap:0}.axp-section-items-builder .__item{cursor:move}.axp-section-items-builder .__item:hover{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section{border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);padding:calc(var(--spacing, .25rem) * 3)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-drag-handle{display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);align-items:center;justify-content:center;color:var(--color-neutral-400, oklch(70.8% 0 0));cursor:grab}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-drag-handle:active{cursor:grabbing}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-drag-handle:hover{color:var(--color-neutral-600, oklch(43.9% 0 0))}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info{min-width:0;flex:1}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-title{margin-bottom:var(--spacing, .25rem);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;min-width:0;overflow:hidden;font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);overflow-wrap:break-word}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-title .__section-name-prefix{margin-left:var(--spacing, .25rem);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300);color:var(--color-neutral-500, oklch(55.6% 0 0));font-weight:300}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-title .__default-section-badge{margin-left:calc(var(--spacing, .25rem) * 2);display:inline-flex;border-radius:.25rem;background-color:var(--color-neutral-100, oklch(97% 0 0));padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);color:var(--color-neutral-500, oklch(55.6% 0 0))}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-description,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-description--rich{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);overflow-wrap:break-word;color:var(--color-neutral-600, oklch(43.9% 0 0))}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-description--rich p{margin:0}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-description--rich p:first-child{margin-top:0}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-description--rich ul{list-style-type:disc;list-style-position:outside;margin-block:.375rem 0;padding-inline-start:1.25rem}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-description--rich ol{list-style-type:decimal;list-style-position:outside;margin-block:.375rem 0;padding-inline-start:1.25rem}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-description--rich li{margin-block:.125rem;padding-inline-start:.25rem}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-actions{display:flex;flex-shrink:0;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-inline-actions{display:flex;align-items:center;gap:0}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__items-container{padding:calc(var(--spacing, .25rem) * 4)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__items-container .__items-list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 3);min-height:3rem}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section{--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);box-sizing:border-box;opacity:.98}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;padding:calc(var(--spacing, .25rem) * 3);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);-webkit-user-select:none;user-select:none}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__drag-handle{display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);align-items:center;justify-content:center;color:var(--color-neutral-400, oklch(70.8% 0 0));cursor:grab}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__drag-handle:active{cursor:grabbing}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__drag-handle:hover{color:var(--color-neutral-600, oklch(43.9% 0 0))}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content{display:flex;min-width:0;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 3)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-leading{display:flex;flex-shrink:0;align-items:center;justify-content:center}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-icon{display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);align-items:center;justify-content:center;border-radius:var(--radius-md, .375rem);background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);color:rgba(var(--ax-sys-color-accent2-surface));--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-icon.__tone-easy{background-color:rgba(var(--ax-sys-color-success-surface));color:rgba(var(--ax-sys-color-success-surface))}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-icon.__tone-easy{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 10%,transparent)}}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-icon.__tone-medium{background-color:rgba(var(--ax-sys-color-warning-surface));color:rgba(var(--ax-sys-color-warning-surface))}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-icon.__tone-medium{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-surface)) 10%,transparent)}}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-icon.__tone-hard{background-color:rgba(var(--ax-sys-color-danger-surface));color:rgba(var(--ax-sys-color-danger-surface))}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-icon.__tone-hard{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 10%,transparent)}}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-info{display:flex;min-width:0;flex:1;flex-direction:row;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-info-body{display:flex;min-width:0;flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__title-row{display:flex;min-width:0;align-items:baseline}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-title{margin-bottom:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;min-width:0;flex:1;overflow:hidden;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);overflow-wrap:break-word}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-title .__item-name-prefix{margin-left:var(--spacing, .25rem);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300);color:var(--color-neutral-500, oklch(55.6% 0 0));font-weight:300}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-description,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-description--rich{margin-top:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);overflow-wrap:break-word;color:var(--color-neutral-500, oklch(55.6% 0 0))}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-description--rich p{margin:0}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-description--rich p:first-child{margin-top:0}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-description--rich ul{list-style-type:disc;list-style-position:outside;margin-block:.375rem 0;padding-inline-start:1.25rem}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-description--rich ol{list-style-type:decimal;list-style-position:outside;margin-block:.375rem 0;padding-inline-start:1.25rem}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-description--rich li{margin-block:.125rem;padding-inline-start:.25rem}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__title-actions{display:flex;flex-shrink:0;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:calc(var(--spacing, .25rem) * 2)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:1px;font-size:.6875rem;--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-neutral{border-color:var(--color-neutral-200, oklch(92.2% 0 0));background-color:var(--color-neutral-100, oklch(97% 0 0));color:var(--color-neutral-700, oklch(37.1% 0 0))}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-accent{border-color:rgba(var(--ax-sys-color-accent2-surface));background-color:rgba(var(--ax-sys-color-accent2-surface));color:rgba(var(--ax-sys-color-accent2-surface))}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-accent{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-accent2-surface)) 30%,transparent)}}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-accent{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-accent2-surface)) 10%,transparent)}}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-warning{border-color:rgba(var(--ax-sys-color-warning-surface));background-color:rgba(var(--ax-sys-color-warning-lightest-surface));color:rgba(var(--ax-sys-color-warning-800))}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-warning{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-surface)) 40%,transparent)}}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){border-color:rgba(var(--ax-sys-color-warning-600))}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-warning-900))}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-900)) 85%,transparent)}}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){color:rgba(var(--ax-sys-color-warning-100))}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-danger{border-color:rgba(var(--ax-sys-color-danger-surface));background-color:rgba(var(--ax-sys-color-danger-surface));color:rgba(var(--ax-sys-color-danger-surface))}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-danger{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 40%,transparent)}}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-danger{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 10%,transparent)}}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-success{border-color:rgba(var(--ax-sys-color-success-surface));background-color:rgba(var(--ax-sys-color-success-surface));color:rgba(var(--ax-sys-color-success-surface))}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-success{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 40%,transparent)}}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-success{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 10%,transparent)}}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-actions{display:flex;align-items:center;gap:0}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item{--tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);box-sizing:border-box;cursor:grabbing;opacity:.98}.__section.cdk-drag-placeholder{border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);border-color:rgba(var(--ax-sys-color-accent2-surface));opacity:50%;margin-bottom:1rem;min-height:8rem}.__section.cdk-drag-dragging{opacity:70%}.__item.cdk-drag-placeholder{position:relative;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);border-color:rgba(var(--ax-sys-color-accent2-surface));min-height:5rem;margin-bottom:.75rem;opacity:.5}.__item.cdk-drag-placeholder>*{opacity:0%}.__item.cdk-drag-animating{transition:transform .25s cubic-bezier(.4,0,.2,1)}.axp-section-items-builder .__items-list.cdk-drop-list-dragging .__item:not(.cdk-drag-placeholder){margin-bottom:.75rem}.axp-section-items-builder .__items-list.cdk-drop-list-dragging,.axp-section-items-builder .__items-list.cdk-drop-list-receiving{position:relative;min-height:calc(var(--spacing, .25rem) * 16);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);border-color:rgba(var(--ax-sys-color-accent2-surface));padding:calc(var(--spacing, .25rem) * 2)}.axp-section-items-builder .__items-list.cdk-drop-list-dragging axp-state-message,.axp-section-items-builder .__items-list.cdk-drop-list-receiving axp-state-message{display:none}.axp-section-items-builder .__sections-container.cdk-drop-list-dragging .__section:not(.cdk-drag-placeholder){margin-bottom:1rem}.axp-section-items-builder .__sections-container.cdk-drop-list-dragging:has(.__section.cdk-drag-placeholder),.axp-section-items-builder .__sections-container.cdk-drop-list-receiving:has(.__section.cdk-drag-placeholder){border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);border-color:rgba(var(--ax-sys-color-accent2-surface));padding:calc(var(--spacing, .25rem) * 2)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-font-weight: initial;--tw-leading: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.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: AXTranslationModule }, { kind: "directive", type: i3.AXTranslatorDirective, selector: "[translate]" }, { kind: "component", type: AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "titleParams", "descriptionParams", "look"] }, { kind: "directive", type: 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: 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: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AXSafePipe, name: "safe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
7964
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPSectionItemsBuilderComponent, isStandalone: true, selector: "axp-section-items-builder", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, definition: { classPropertyName: "definition", publicName: "definition", isSignal: true, isRequired: true, transformFunction: null }, readonlyMode: { classPropertyName: "readonlyMode", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, host: { classAttribute: "axp-section-items-builder-host" }, ngImport: i0, template: "<div class=\"axp-section-items-builder\" *translate=\"let t\">\n <div class=\"__content\">\n @if (sectionsModel().sections.length === 0) {\n <!-- ----- Empty state when no sections are configured ----- -->\n <axp-state-message icon=\"fa-light fa-layer-group\" [title]=\"definition().texts.emptySectionsTitle\" [description]=\"definition().texts.emptySectionsDescription\"></axp-state-message>\n } @else {\n <!-- ----- Draggable section list when at least one section exists ----- -->\n <div class=\"__sections-container\" cdkDropList [cdkDropListData]=\"sectionsModel().sections\" (cdkDropListDropped)=\"onSectionDrop($event)\">\n @for (row of sectionRows(); track row.section.id) {\n <div class=\"__section\" cdkDrag cdkDragPreviewClass=\"axp-section-items-builder-drag-preview\">\n <div class=\"__section-header\">\n @if (!readonlyMode()) {\n <!-- ----- Section reorder handle (edit mode only) ----- -->\n <div class=\"__section-drag-handle\" cdkDragHandle>\n <ax-icon icon=\"fa-solid fa-grip-vertical\"></ax-icon>\n </div>\n }\n <div class=\"__section-info\">\n @let secTitle = sectionTitleValue(row.section) | translate | async;\n <h3 class=\"__section-title\" [title]=\"secTitle\">\n {{ secTitle }}\n @if (definition().showSectionTechnicalName) {\n @let secTechName = sectionNameValue(row.section) | translate | async;\n @if (secTechName?.trim()) {\n <span class=\"__section-name-prefix\">({{ secTechName }})</span>\n }\n }\n @if (isDefaultSection(row.section)) {\n @if (definition().texts.defaultSectionBadge; as defaultBadge) {\n <span class=\"__default-section-badge\">{{ defaultBadge | translate | async }}</span>\n }\n }\n </h3>\n @let secDesc = (sectionDescriptionValue(row.section) | translate | async) || '';\n @let secDescTrimmed = secDesc?.trim();\n @if (secDescTrimmed) {\n @if (containsHtmlMarkup(secDescTrimmed)) {\n <!-- ----- Rich HTML section description ----- -->\n <div class=\"__section-description __section-description--rich\" [title]=\"tooltipPlainTextForHtml(secDesc)\" [innerHTML]=\"secDesc | safe: 'html'\"></div>\n } @else {\n <!-- ----- Plain text section description ----- -->\n <p class=\"__section-description\" [title]=\"secDescTrimmed\">{{ secDescTrimmed }}</p>\n }\n }\n </div>\n @if (!readonlyMode()) {\n <!-- ----- Section toolbar: add items and inline edit/remove ----- -->\n <div class=\"__section-actions ax-sm\">\n @if (definition().promptAddItems) {\n <ax-button [text]=\"definition().texts.addItem | translate | async\" [color]=\"'accent2'\" (onClick)=\"onAddItems(row.section)\">\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n }\n @if (definition().promptEditSection || canRemoveSection()) {\n <div class=\"__section-inline-actions\">\n @if (definition().promptEditSection) {\n <ax-button [look]=\"'blank'\" color=\"accent3\" (onClick)=\"onEditSection(row.section)\">\n <ax-icon class=\"fa-light fa-pencil\"></ax-icon>\n </ax-button>\n }\n @if (canRemoveSection()) {\n <ax-button [look]=\"'blank'\" color=\"danger\" (onClick)=\"onRemoveSection(row.section)\">\n <ax-icon class=\"fa-light fa-trash-can\"></ax-icon>\n </ax-button>\n }\n </div>\n }\n </div>\n }\n </div>\n\n <div class=\"__items-container\">\n <div class=\"__items-list\" cdkDropList [id]=\"sectionItemsListId(row.section.id)\" [cdkDropListData]=\"row.section.items\" [cdkDropListConnectedTo]=\"itemDropListIds()\" (cdkDropListDropped)=\"onItemDrop($event, row.section.id)\">\n @if (row.itemRows.length === 0) {\n <!-- ----- Empty state when the section has no items ----- -->\n <axp-state-message icon=\"fa-light fa-inbox\" [title]=\"definition().texts.emptyItemsTitle\" [description]=\"definition().texts.emptyItemsDescription\"></axp-state-message>\n } @else {\n <!-- ----- Draggable item rows for this section ----- -->\n @for (ir of row.itemRows; track ir.item.id) {\n <div class=\"__item\" cdkDrag cdkDragPreviewClass=\"axp-section-items-builder-drag-preview\">\n @if (!readonlyMode()) {\n <!-- ----- Item reorder handle (edit mode only) ----- -->\n <div class=\"__drag-handle\" cdkDragHandle>\n <ax-icon icon=\"fa-solid fa-grip-vertical\"></ax-icon>\n </div>\n }\n <div class=\"__item-content\">\n <div class=\"__item-leading\" [title]=\"itemMultilingualField(ir.item, 'title', ir.view.title) | translate | async\">\n <div class=\"__item-icon\" [class.__tone-easy]=\"ir.view.iconTone === 'easy'\" [class.__tone-medium]=\"ir.view.iconTone === 'medium'\" [class.__tone-hard]=\"ir.view.iconTone === 'hard'\">\n <ax-icon [icon]=\"ir.view.icon\"></ax-icon>\n </div>\n </div>\n <div class=\"__item-info\">\n <div class=\"__item-info-body\">\n <div class=\"__title-row\">\n @let itemTitle = itemMultilingualField(ir.item, 'title', ir.view.title) | translate | async;\n @let itemName = itemMultilingualField(ir.item, 'name', ir.view.name) | translate | async;\n <h4 class=\"__item-title\" [title]=\"itemTitle + (itemName?.trim() ? ' (' + itemName + ')' : '')\">\n {{ itemTitle }}\n @if (itemName?.trim()) {\n <span class=\"__item-name-prefix\">({{ itemName }})</span>\n }\n </h4>\n </div>\n @let itemDesc = (itemMultilingualField(ir.item, 'description', ir.view.description) | translate | async) || '';\n @let itemDescTrimmed = itemDesc?.trim();\n @if (itemDescTrimmed) {\n @if (containsHtmlMarkup(itemDescTrimmed)) {\n <!-- ----- Rich HTML item description ----- -->\n <div class=\"__item-description __item-description--rich\" [title]=\"tooltipPlainTextForHtml(itemDesc)\" [innerHTML]=\"itemDesc | safe: 'html'\"></div>\n } @else {\n <!-- ----- Plain text item description ----- -->\n <p class=\"__item-description\" [title]=\"itemDescTrimmed\">{{ itemDescTrimmed }}</p>\n }\n }\n </div>\n <div class=\"__title-actions\">\n @for (b of ir.view.badges; track $index) {\n <span\n class=\"__item-badge\"\n [class.__badge-neutral]=\"!b.variant || b.variant === 'neutral'\"\n [class.__badge-accent]=\"b.variant === 'accent'\"\n [class.__badge-warning]=\"b.variant === 'warning'\"\n [class.__badge-danger]=\"b.variant === 'danger'\"\n [class.__badge-success]=\"b.variant === 'success'\"\n >\n @if (isTranslationKey(b.text)) {\n {{ b.text | translate | async }}\n } @else {\n {{ b.text }}\n }\n </span>\n }\n @if (!readonlyMode()) {\n <!-- ----- Item edit and remove actions ----- -->\n <div class=\"__item-actions ax-sm\">\n @if (definition().promptEditItem) {\n <ax-button [look]=\"'blank'\" color=\"accent3\" (onClick)=\"onEditItem(ir.item, row.section.id)\">\n <ax-icon class=\"fa-light fa-pencil\"></ax-icon>\n </ax-button>\n }\n <ax-button [look]=\"'blank'\" color=\"danger\" (onClick)=\"onRemoveItem(ir.item, row.section.id)\">\n <ax-icon class=\"fa-light fa-trash-can\"></ax-icon>\n </ax-button>\n </div>\n }\n </div>\n </div>\n </div>\n </div>\n }\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n </div>\n</div>\n", styles: ["@layer properties;.axp-section-items-builder{display:flex;height:100%;width:100%;flex-direction:column}.axp-section-items-builder .__content{flex:1;overflow:auto}.axp-section-items-builder .__sections-container{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4)}.axp-section-items-builder .__sections-container.cdk-drop-list-dragging .__section:not(.cdk-drag-placeholder){margin-bottom:calc(var(--spacing, .25rem) * 4)}.axp-section-items-builder .__sections-container.cdk-drop-list-dragging:has(.__section.cdk-drag-placeholder),.axp-section-items-builder .__sections-container.cdk-drop-list-dragging.cdk-drop-list-receiving:has(.__section.cdk-drag-placeholder){border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);border-color:rgba(var(--ax-sys-color-accent2-surface));padding:calc(var(--spacing, .25rem) * 2)}.axp-section-items-builder .__items-list.cdk-drop-list-dragging,.axp-section-items-builder .__items-list.cdk-drop-list-receiving{position:relative;min-height:calc(var(--spacing, .25rem) * 16);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);border-color:rgba(var(--ax-sys-color-accent2-surface));padding:calc(var(--spacing, .25rem) * 2)}:is(.axp-section-items-builder .__items-list.cdk-drop-list-dragging,.axp-section-items-builder .__items-list.cdk-drop-list-receiving) axp-state-message{display:none}.axp-section-items-builder .__items-list.cdk-drop-list-dragging .__item:not(.cdk-drag-placeholder){margin-bottom:calc(var(--spacing, .25rem) * 3)}.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section{border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);padding:calc(var(--spacing, .25rem) * 3)}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-drag-handle{display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);cursor:grab;align-items:center;justify-content:center;color:var(--color-neutral-400, oklch(70.8% 0 0))}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-drag-handle:active{cursor:grabbing}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-drag-handle:hover{color:var(--color-neutral-600, oklch(43.9% 0 0))}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info{min-width:0;flex:1}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-title{margin-bottom:var(--spacing, .25rem);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;min-width:0;overflow:hidden;font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);overflow-wrap:break-word}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-title .__section-name-prefix{margin-left:var(--spacing, .25rem);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300);color:var(--color-neutral-500, oklch(55.6% 0 0))}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-title .__default-section-badge{margin-left:calc(var(--spacing, .25rem) * 2);display:inline-flex;border-radius:.25rem;background-color:var(--color-neutral-100, oklch(97% 0 0));padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);color:var(--color-neutral-500, oklch(55.6% 0 0))}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-description{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);overflow-wrap:break-word;color:var(--color-neutral-600, oklch(43.9% 0 0))}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-description.__section-description--rich{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);overflow-wrap:break-word;color:var(--color-neutral-600, oklch(43.9% 0 0))}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-description.__section-description--rich p{margin:0}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-description.__section-description--rich p:first-child{margin-top:0}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-description.__section-description--rich ul{margin-top:calc(var(--spacing, .25rem) * 1.5);margin-bottom:0;list-style-position:outside;list-style-type:disc;padding-inline-start:calc(var(--spacing, .25rem) * 5)}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-description.__section-description--rich ol{margin-top:calc(var(--spacing, .25rem) * 1.5);margin-bottom:0;list-style-position:outside;list-style-type:decimal;padding-inline-start:calc(var(--spacing, .25rem) * 5)}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-description.__section-description--rich li{margin-block:calc(var(--spacing, .25rem) * .5);padding-inline-start:var(--spacing, .25rem)}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-actions{display:flex;flex-shrink:0;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-inline-actions{display:flex;align-items:center;gap:0}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__items-container{padding:calc(var(--spacing, .25rem) * 4)}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__items-container .__items-list{display:flex;min-height:calc(var(--spacing, .25rem) * 12);flex-direction:column;gap:calc(var(--spacing, .25rem) * 3)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section{box-sizing:border-box;opacity:.98;--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding:calc(var(--spacing, .25rem) * 3);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);-webkit-user-select:none;user-select:none}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__drag-handle{display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);cursor:grab;align-items:center;justify-content:center;color:var(--color-neutral-400, oklch(70.8% 0 0))}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__drag-handle:active{cursor:grabbing}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__drag-handle:hover{color:var(--color-neutral-600, oklch(43.9% 0 0))}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content{display:flex;min-width:0;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 3)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-leading{display:flex;flex-shrink:0;align-items:center;justify-content:center}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-icon{display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);align-items:center;justify-content:center;border-radius:var(--radius-md, .375rem);background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);color:rgba(var(--ax-sys-color-accent2-surface));--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-icon.__tone-easy{background-color:rgba(var(--ax-sys-color-success-surface));color:rgba(var(--ax-sys-color-success-surface))}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-icon.__tone-easy{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 10%,transparent)}}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-icon.__tone-medium{background-color:rgba(var(--ax-sys-color-warning-surface));color:rgba(var(--ax-sys-color-warning-surface))}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-icon.__tone-medium{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-surface)) 10%,transparent)}}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-icon.__tone-hard{background-color:rgba(var(--ax-sys-color-danger-surface));color:rgba(var(--ax-sys-color-danger-surface))}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-icon.__tone-hard{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 10%,transparent)}}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-info{display:flex;min-width:0;flex:1;flex-direction:row;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-info-body{display:flex;min-width:0;flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__title-row{display:flex;min-width:0;align-items:baseline}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-title{margin-bottom:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;min-width:0;flex:1;overflow:hidden;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);overflow-wrap:break-word}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-title .__item-name-prefix{margin-left:var(--spacing, .25rem);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300);color:var(--color-neutral-500, oklch(55.6% 0 0))}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-description{margin-top:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);overflow-wrap:break-word;color:var(--color-neutral-500, oklch(55.6% 0 0))}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-description.__item-description--rich{margin-top:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);overflow-wrap:break-word;color:var(--color-neutral-500, oklch(55.6% 0 0))}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-description.__item-description--rich p{margin:0}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-description.__item-description--rich p:first-child{margin-top:0}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-description.__item-description--rich ul{margin-top:calc(var(--spacing, .25rem) * 1.5);margin-bottom:0;list-style-position:outside;list-style-type:disc;padding-inline-start:calc(var(--spacing, .25rem) * 5)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-description.__item-description--rich ol{margin-top:calc(var(--spacing, .25rem) * 1.5);margin-bottom:0;list-style-position:outside;list-style-type:decimal;padding-inline-start:calc(var(--spacing, .25rem) * 5)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-description.__item-description--rich li{margin-block:calc(var(--spacing, .25rem) * .5);padding-inline-start:var(--spacing, .25rem)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__title-actions{display:flex;flex-shrink:0;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:calc(var(--spacing, .25rem) * 2)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:1px;font-size:.6875rem;--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-neutral{border-color:var(--color-neutral-200, oklch(92.2% 0 0));background-color:var(--color-neutral-100, oklch(97% 0 0));color:var(--color-neutral-700, oklch(37.1% 0 0))}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-accent{border-color:rgba(var(--ax-sys-color-accent2-surface));background-color:rgba(var(--ax-sys-color-accent2-surface));color:rgba(var(--ax-sys-color-accent2-surface))}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-accent{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-accent2-surface)) 30%,transparent)}}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-accent{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-accent2-surface)) 10%,transparent)}}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-warning{border-color:rgba(var(--ax-sys-color-warning-surface));background-color:rgba(var(--ax-sys-color-warning-lightest-surface));color:rgba(var(--ax-sys-color-warning-800))}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-warning{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-surface)) 40%,transparent)}}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){border-color:rgba(var(--ax-sys-color-warning-600))}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-warning-900))}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-900)) 85%,transparent)}}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){color:rgba(var(--ax-sys-color-warning-100))}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-danger{border-color:rgba(var(--ax-sys-color-danger-surface));background-color:rgba(var(--ax-sys-color-danger-surface));color:rgba(var(--ax-sys-color-danger-surface))}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-danger{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 40%,transparent)}}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-danger{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 10%,transparent)}}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-success{border-color:rgba(var(--ax-sys-color-success-surface));background-color:rgba(var(--ax-sys-color-success-surface));color:rgba(var(--ax-sys-color-success-surface))}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-success{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 40%,transparent)}}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-success{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 10%,transparent)}}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-actions{display:flex;align-items:center;gap:0}.axp-section-items-builder .__item{cursor:move}.axp-section-items-builder .__item:hover{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item{box-sizing:border-box;cursor:grabbing;opacity:.98;--tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.__section.cdk-drag-placeholder{margin-bottom:calc(var(--spacing, .25rem) * 4);min-height:calc(var(--spacing, .25rem) * 32);border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);border-color:rgba(var(--ax-sys-color-accent2-surface));opacity:50%}.__section.cdk-drag-dragging{opacity:70%}.__item.cdk-drag-placeholder{position:relative;margin-bottom:calc(var(--spacing, .25rem) * 3);min-height:calc(var(--spacing, .25rem) * 20);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);border-color:rgba(var(--ax-sys-color-accent2-surface));opacity:50%}.__item.cdk-drag-placeholder>*{opacity:0%}.__item.cdk-drag-animating{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .25s;transition-duration:.25s}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-duration{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-font-weight: initial;--tw-leading: initial;--tw-duration: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.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: AXTranslationModule }, { kind: "directive", type: i3.AXTranslatorDirective, selector: "[translate]" }, { kind: "component", type: AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "titleParams", "descriptionParams", "look"] }, { kind: "directive", type: 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: 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: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AXSafePipe, name: "safe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
8262
7965
  }
8263
7966
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSectionItemsBuilderComponent, decorators: [{
8264
7967
  type: Component,
@@ -8274,7 +7977,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
8274
7977
  CdkDrag,
8275
7978
  CdkDragHandle,
8276
7979
  AXSafePipe,
8277
- ], template: "<div class=\"axp-section-items-builder\" *translate=\"let t\">\n <div class=\"__content\">\n @if (sectionsModel().sections.length === 0) {\n <axp-state-message\n icon=\"fa-light fa-layer-group\"\n [title]=\"definition().texts.emptySectionsTitle\"\n [description]=\"definition().texts.emptySectionsDescription\"\n >\n </axp-state-message>\n } @else {\n <div\n class=\"__sections-container\"\n cdkDropList\n [cdkDropListData]=\"sectionsModel().sections\"\n (cdkDropListDropped)=\"onSectionDrop($event)\"\n >\n @for (row of sectionRows(); track row.section.id) {\n <div\n class=\"__section\"\n cdkDrag\n cdkDragPreviewClass=\"axp-section-items-builder-drag-preview\"\n >\n <div class=\"__section-header\">\n @if (!readonlyMode()) {\n <div class=\"__section-drag-handle\" cdkDragHandle>\n <ax-icon icon=\"fa-solid fa-grip-vertical\"></ax-icon>\n </div>\n }\n <div class=\"__section-info\">\n @let secTitle =\n sectionTitleValue(row.section) | translate | async;\n <h3 class=\"__section-title\" [title]=\"secTitle\">\n {{ secTitle }}\n @if (definition().showSectionTechnicalName) {\n @let secTechName =\n sectionNameValue(row.section) | translate | async;\n @if (secTechName?.trim()) {\n <span class=\"__section-name-prefix\"\n >({{ secTechName }})</span\n >\n }\n }\n @if (isDefaultSection(row.section)) {\n @if (\n definition().texts.defaultSectionBadge;\n as defaultBadge\n ) {\n <span class=\"__default-section-badge\">{{\n defaultBadge | translate | async\n }}</span>\n }\n }\n </h3>\n @let secDesc =\n (sectionDescriptionValue(row.section) | translate | async) ||\n '';\n @let secDescTrimmed = secDesc?.trim();\n @if (secDescTrimmed) {\n @if (containsHtmlMarkup(secDescTrimmed)) {\n <div\n class=\"__section-description __section-description--rich\"\n [title]=\"tooltipPlainTextForHtml(secDesc)\"\n [innerHTML]=\"secDesc | safe: 'html'\"\n ></div>\n } @else {\n <p class=\"__section-description\" [title]=\"secDescTrimmed\">\n {{ secDescTrimmed }}\n </p>\n }\n }\n </div>\n @if (!readonlyMode()) {\n <div class=\"__section-actions\">\n @if (definition().promptAddItems) {\n <ax-button\n [text]=\"definition().texts.addItem | translate | async\"\n [color]=\"'accent2'\"\n (onClick)=\"onAddItems(row.section)\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n }\n @if (definition().promptEditSection || canRemoveSection()) {\n <div class=\"__section-inline-actions\">\n @if (definition().promptEditSection) {\n <ax-button\n [look]=\"'blank'\"\n color=\"accent3\"\n (onClick)=\"onEditSection(row.section)\"\n >\n <ax-icon class=\"fa-light fa-pencil\"></ax-icon>\n </ax-button>\n }\n @if (canRemoveSection()) {\n <ax-button\n [look]=\"'blank'\"\n color=\"danger\"\n (onClick)=\"onRemoveSection(row.section)\"\n >\n <ax-icon class=\"fa-light fa-trash-can\"></ax-icon>\n </ax-button>\n }\n </div>\n }\n </div>\n }\n </div>\n\n <div class=\"__items-container\">\n <div\n class=\"__items-list\"\n cdkDropList\n [id]=\"sectionItemsListId(row.section.id)\"\n [cdkDropListData]=\"row.section.items\"\n [cdkDropListConnectedTo]=\"itemDropListIds()\"\n (cdkDropListDropped)=\"onItemDrop($event, row.section.id)\"\n >\n @if (row.itemRows.length === 0) {\n <axp-state-message\n icon=\"fa-light fa-inbox\"\n [title]=\"definition().texts.emptyItemsTitle\"\n [description]=\"definition().texts.emptyItemsDescription\"\n >\n </axp-state-message>\n } @else {\n @for (ir of row.itemRows; track ir.item.id) {\n <div\n class=\"__item\"\n cdkDrag\n cdkDragPreviewClass=\"axp-section-items-builder-drag-preview\"\n >\n @if (!readonlyMode()) {\n <div class=\"__drag-handle\" cdkDragHandle>\n <ax-icon icon=\"fa-solid fa-grip-vertical\"></ax-icon>\n </div>\n }\n <div class=\"__item-content\">\n <div\n class=\"__item-leading\"\n [title]=\"\n itemMultilingualField(\n ir.item,\n 'title',\n ir.view.title\n )\n | translate\n | async\n \"\n >\n <div\n class=\"__item-icon\"\n [class.__tone-easy]=\"ir.view.iconTone === 'easy'\"\n [class.__tone-medium]=\"\n ir.view.iconTone === 'medium'\n \"\n [class.__tone-hard]=\"ir.view.iconTone === 'hard'\"\n >\n <ax-icon [icon]=\"ir.view.icon\"></ax-icon>\n </div>\n </div>\n <div class=\"__item-info\">\n <div class=\"__item-info-body\">\n <div class=\"__title-row\">\n @let itemTitle =\n itemMultilingualField(\n ir.item,\n 'title',\n ir.view.title\n )\n | translate\n | async;\n @let itemName =\n itemMultilingualField(\n ir.item,\n 'name',\n ir.view.name\n )\n | translate\n | async;\n <h4\n class=\"__item-title\"\n [title]=\"\n itemTitle +\n (itemName?.trim()\n ? ' (' + itemName + ')'\n : '')\n \"\n >\n {{ itemTitle }}\n @if (itemName?.trim()) {\n <span class=\"__item-name-prefix\"\n >({{ itemName }})</span\n >\n }\n </h4>\n </div>\n @let itemDesc =\n (itemMultilingualField(\n ir.item,\n 'description',\n ir.view.description\n )\n | translate\n | async) || '';\n @let itemDescTrimmed = itemDesc?.trim();\n @if (itemDescTrimmed) {\n @if (containsHtmlMarkup(itemDescTrimmed)) {\n <div\n class=\"__item-description __item-description--rich\"\n [title]=\"tooltipPlainTextForHtml(itemDesc)\"\n [innerHTML]=\"itemDesc | safe: 'html'\"\n ></div>\n } @else {\n <p\n class=\"__item-description\"\n [title]=\"itemDescTrimmed\"\n >\n {{ itemDescTrimmed }}\n </p>\n }\n }\n </div>\n <div class=\"__title-actions\">\n @for (b of ir.view.badges; track $index) {\n <span\n class=\"__item-badge\"\n [class.__badge-neutral]=\"\n !b.variant || b.variant === 'neutral'\n \"\n [class.__badge-accent]=\"b.variant === 'accent'\"\n [class.__badge-warning]=\"\n b.variant === 'warning'\n \"\n [class.__badge-danger]=\"b.variant === 'danger'\"\n [class.__badge-success]=\"\n b.variant === 'success'\n \"\n >\n @if (isTranslationKey(b.text)) {\n {{ b.text | translate | async }}\n } @else {\n {{ b.text }}\n }\n </span>\n }\n @if (!readonlyMode()) {\n <div class=\"__item-actions\">\n @if (definition().promptEditItem) {\n <ax-button\n [look]=\"'blank'\"\n color=\"accent3\"\n (onClick)=\"\n onEditItem(ir.item, row.section.id)\n \"\n >\n <ax-icon\n class=\"fa-light fa-pencil\"\n ></ax-icon>\n </ax-button>\n }\n <ax-button\n [look]=\"'blank'\"\n color=\"danger\"\n (onClick)=\"\n onRemoveItem(ir.item, row.section.id)\n \"\n >\n <ax-icon\n class=\"fa-light fa-trash-can\"\n ></ax-icon>\n </ax-button>\n </div>\n }\n </div>\n </div>\n </div>\n </div>\n }\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n </div>\n</div>\n", styles: ["@layer properties;.axp-section-items-builder{display:flex;height:100%;width:100%;flex-direction:column}.axp-section-items-builder .__content{flex:1;overflow:auto}.axp-section-items-builder .__sections-container{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4)}.axp-section-items-builder .__section{border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-section-items-builder .__section .__section-header{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);padding:calc(var(--spacing, .25rem) * 3)}.axp-section-items-builder .__section .__section-header .__section-drag-handle{display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);align-items:center;justify-content:center;color:var(--color-neutral-400, oklch(70.8% 0 0));cursor:grab}.axp-section-items-builder .__section .__section-header .__section-drag-handle:active{cursor:grabbing}.axp-section-items-builder .__section .__section-header .__section-drag-handle:hover{color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-section-items-builder .__section .__section-header .__section-info{min-width:0;flex:1}.axp-section-items-builder .__section .__section-header .__section-info .__section-title{margin-bottom:var(--spacing, .25rem);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;min-width:0;overflow:hidden;font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);overflow-wrap:break-word}.axp-section-items-builder .__section .__section-header .__section-info .__section-title .__section-name-prefix{margin-left:var(--spacing, .25rem);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300);color:var(--color-neutral-500, oklch(55.6% 0 0));font-weight:300}.axp-section-items-builder .__section .__section-header .__section-info .__section-title .__default-section-badge{margin-left:calc(var(--spacing, .25rem) * 2);display:inline-flex;border-radius:.25rem;background-color:var(--color-neutral-100, oklch(97% 0 0));padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);color:var(--color-neutral-500, oklch(55.6% 0 0))}.axp-section-items-builder .__section .__section-header .__section-info .__section-description,.axp-section-items-builder .__section .__section-header .__section-info .__section-description--rich{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);overflow-wrap:break-word;color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-section-items-builder .__section .__section-header .__section-info .__section-description--rich p{margin:0}.axp-section-items-builder .__section .__section-header .__section-info .__section-description--rich p:first-child{margin-top:0}.axp-section-items-builder .__section .__section-header .__section-info .__section-description--rich ul{list-style-type:disc;list-style-position:outside;margin-block:.375rem 0;padding-inline-start:1.25rem}.axp-section-items-builder .__section .__section-header .__section-info .__section-description--rich ol{list-style-type:decimal;list-style-position:outside;margin-block:.375rem 0;padding-inline-start:1.25rem}.axp-section-items-builder .__section .__section-header .__section-info .__section-description--rich li{margin-block:.125rem;padding-inline-start:.25rem}.axp-section-items-builder .__section .__section-header .__section-actions{display:flex;flex-shrink:0;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.axp-section-items-builder .__section .__section-header .__section-inline-actions{display:flex;align-items:center;gap:0}.axp-section-items-builder .__section .__items-container{padding:calc(var(--spacing, .25rem) * 4)}.axp-section-items-builder .__section .__items-container .__items-list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 3);min-height:3rem}.axp-section-items-builder .__item{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;padding:calc(var(--spacing, .25rem) * 3);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);-webkit-user-select:none;user-select:none}.axp-section-items-builder .__item .__drag-handle{display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);align-items:center;justify-content:center;color:var(--color-neutral-400, oklch(70.8% 0 0));cursor:grab}.axp-section-items-builder .__item .__drag-handle:active{cursor:grabbing}.axp-section-items-builder .__item .__drag-handle:hover{color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-section-items-builder .__item .__item-content{display:flex;min-width:0;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 3)}.axp-section-items-builder .__item .__item-content .__item-leading{display:flex;flex-shrink:0;align-items:center;justify-content:center}.axp-section-items-builder .__item .__item-content .__item-icon{display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);align-items:center;justify-content:center;border-radius:var(--radius-md, .375rem);background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);color:rgba(var(--ax-sys-color-accent2-surface));--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-section-items-builder .__item .__item-content .__item-icon.__tone-easy{background-color:rgba(var(--ax-sys-color-success-surface));color:rgba(var(--ax-sys-color-success-surface))}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-icon.__tone-easy{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 10%,transparent)}}.axp-section-items-builder .__item .__item-content .__item-icon.__tone-medium{background-color:rgba(var(--ax-sys-color-warning-surface));color:rgba(var(--ax-sys-color-warning-surface))}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-icon.__tone-medium{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-surface)) 10%,transparent)}}.axp-section-items-builder .__item .__item-content .__item-icon.__tone-hard{background-color:rgba(var(--ax-sys-color-danger-surface));color:rgba(var(--ax-sys-color-danger-surface))}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-icon.__tone-hard{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 10%,transparent)}}.axp-section-items-builder .__item .__item-content .__item-info{display:flex;min-width:0;flex:1;flex-direction:row;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3)}.axp-section-items-builder .__item .__item-content .__item-info-body{display:flex;min-width:0;flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}.axp-section-items-builder .__item .__item-content .__title-row{display:flex;min-width:0;align-items:baseline}.axp-section-items-builder .__item .__item-content .__item-title{margin-bottom:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;min-width:0;flex:1;overflow:hidden;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);overflow-wrap:break-word}.axp-section-items-builder .__item .__item-content .__item-title .__item-name-prefix{margin-left:var(--spacing, .25rem);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300);color:var(--color-neutral-500, oklch(55.6% 0 0));font-weight:300}.axp-section-items-builder .__item .__item-content .__item-description,.axp-section-items-builder .__item .__item-content .__item-description--rich{margin-top:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);overflow-wrap:break-word;color:var(--color-neutral-500, oklch(55.6% 0 0))}.axp-section-items-builder .__item .__item-content .__item-description--rich p{margin:0}.axp-section-items-builder .__item .__item-content .__item-description--rich p:first-child{margin-top:0}.axp-section-items-builder .__item .__item-content .__item-description--rich ul{list-style-type:disc;list-style-position:outside;margin-block:.375rem 0;padding-inline-start:1.25rem}.axp-section-items-builder .__item .__item-content .__item-description--rich ol{list-style-type:decimal;list-style-position:outside;margin-block:.375rem 0;padding-inline-start:1.25rem}.axp-section-items-builder .__item .__item-content .__item-description--rich li{margin-block:.125rem;padding-inline-start:.25rem}.axp-section-items-builder .__item .__item-content .__title-actions{display:flex;flex-shrink:0;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:calc(var(--spacing, .25rem) * 2)}.axp-section-items-builder .__item .__item-content .__item-badge{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:1px;font-size:.6875rem;--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-section-items-builder .__item .__item-content .__item-badge.__badge-neutral{border-color:var(--color-neutral-200, oklch(92.2% 0 0));background-color:var(--color-neutral-100, oklch(97% 0 0));color:var(--color-neutral-700, oklch(37.1% 0 0))}.axp-section-items-builder .__item .__item-content .__item-badge.__badge-accent{border-color:rgba(var(--ax-sys-color-accent2-surface));background-color:rgba(var(--ax-sys-color-accent2-surface));color:rgba(var(--ax-sys-color-accent2-surface))}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-badge.__badge-accent{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-accent2-surface)) 30%,transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-badge.__badge-accent{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-accent2-surface)) 10%,transparent)}}.axp-section-items-builder .__item .__item-content .__item-badge.__badge-warning{border-color:rgba(var(--ax-sys-color-warning-surface));background-color:rgba(var(--ax-sys-color-warning-lightest-surface));color:rgba(var(--ax-sys-color-warning-800))}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-badge.__badge-warning{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-surface)) 40%,transparent)}}.axp-section-items-builder .__item .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){border-color:rgba(var(--ax-sys-color-warning-600))}.axp-section-items-builder .__item .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-warning-900))}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-900)) 85%,transparent)}}.axp-section-items-builder .__item .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){color:rgba(var(--ax-sys-color-warning-100))}.axp-section-items-builder .__item .__item-content .__item-badge.__badge-danger{border-color:rgba(var(--ax-sys-color-danger-surface));background-color:rgba(var(--ax-sys-color-danger-surface));color:rgba(var(--ax-sys-color-danger-surface))}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-badge.__badge-danger{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 40%,transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-badge.__badge-danger{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 10%,transparent)}}.axp-section-items-builder .__item .__item-content .__item-badge.__badge-success{border-color:rgba(var(--ax-sys-color-success-surface));background-color:rgba(var(--ax-sys-color-success-surface));color:rgba(var(--ax-sys-color-success-surface))}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-badge.__badge-success{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 40%,transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-section-items-builder .__item .__item-content .__item-badge.__badge-success{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 10%,transparent)}}.axp-section-items-builder .__item .__item-content .__item-actions{display:flex;align-items:center;gap:0}.axp-section-items-builder .__item{cursor:move}.axp-section-items-builder .__item:hover{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section{border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);padding:calc(var(--spacing, .25rem) * 3)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-drag-handle{display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);align-items:center;justify-content:center;color:var(--color-neutral-400, oklch(70.8% 0 0));cursor:grab}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-drag-handle:active{cursor:grabbing}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-drag-handle:hover{color:var(--color-neutral-600, oklch(43.9% 0 0))}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info{min-width:0;flex:1}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-title{margin-bottom:var(--spacing, .25rem);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;min-width:0;overflow:hidden;font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);overflow-wrap:break-word}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-title .__section-name-prefix{margin-left:var(--spacing, .25rem);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300);color:var(--color-neutral-500, oklch(55.6% 0 0));font-weight:300}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-title .__default-section-badge{margin-left:calc(var(--spacing, .25rem) * 2);display:inline-flex;border-radius:.25rem;background-color:var(--color-neutral-100, oklch(97% 0 0));padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);color:var(--color-neutral-500, oklch(55.6% 0 0))}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-description,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-description--rich{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);overflow-wrap:break-word;color:var(--color-neutral-600, oklch(43.9% 0 0))}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-description--rich p{margin:0}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-description--rich p:first-child{margin-top:0}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-description--rich ul{list-style-type:disc;list-style-position:outside;margin-block:.375rem 0;padding-inline-start:1.25rem}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-description--rich ol{list-style-type:decimal;list-style-position:outside;margin-block:.375rem 0;padding-inline-start:1.25rem}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-info .__section-description--rich li{margin-block:.125rem;padding-inline-start:.25rem}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-actions{display:flex;flex-shrink:0;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__section-header .__section-inline-actions{display:flex;align-items:center;gap:0}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__items-container{padding:calc(var(--spacing, .25rem) * 4)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section .__items-container .__items-list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 3);min-height:3rem}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section{--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);box-sizing:border-box;opacity:.98}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;padding:calc(var(--spacing, .25rem) * 3);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);-webkit-user-select:none;user-select:none}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__drag-handle{display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);align-items:center;justify-content:center;color:var(--color-neutral-400, oklch(70.8% 0 0));cursor:grab}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__drag-handle:active{cursor:grabbing}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__drag-handle:hover{color:var(--color-neutral-600, oklch(43.9% 0 0))}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content{display:flex;min-width:0;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 3)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-leading{display:flex;flex-shrink:0;align-items:center;justify-content:center}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-icon{display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);align-items:center;justify-content:center;border-radius:var(--radius-md, .375rem);background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);color:rgba(var(--ax-sys-color-accent2-surface));--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-icon.__tone-easy{background-color:rgba(var(--ax-sys-color-success-surface));color:rgba(var(--ax-sys-color-success-surface))}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-icon.__tone-easy{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 10%,transparent)}}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-icon.__tone-medium{background-color:rgba(var(--ax-sys-color-warning-surface));color:rgba(var(--ax-sys-color-warning-surface))}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-icon.__tone-medium{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-surface)) 10%,transparent)}}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-icon.__tone-hard{background-color:rgba(var(--ax-sys-color-danger-surface));color:rgba(var(--ax-sys-color-danger-surface))}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-icon.__tone-hard{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 10%,transparent)}}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-info{display:flex;min-width:0;flex:1;flex-direction:row;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-info-body{display:flex;min-width:0;flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__title-row{display:flex;min-width:0;align-items:baseline}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-title{margin-bottom:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;min-width:0;flex:1;overflow:hidden;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);overflow-wrap:break-word}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-title .__item-name-prefix{margin-left:var(--spacing, .25rem);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300);color:var(--color-neutral-500, oklch(55.6% 0 0));font-weight:300}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-description,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-description--rich{margin-top:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);overflow-wrap:break-word;color:var(--color-neutral-500, oklch(55.6% 0 0))}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-description--rich p{margin:0}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-description--rich p:first-child{margin-top:0}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-description--rich ul{list-style-type:disc;list-style-position:outside;margin-block:.375rem 0;padding-inline-start:1.25rem}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-description--rich ol{list-style-type:decimal;list-style-position:outside;margin-block:.375rem 0;padding-inline-start:1.25rem}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-description--rich li{margin-block:.125rem;padding-inline-start:.25rem}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__title-actions{display:flex;flex-shrink:0;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:calc(var(--spacing, .25rem) * 2)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:1px;font-size:.6875rem;--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-neutral{border-color:var(--color-neutral-200, oklch(92.2% 0 0));background-color:var(--color-neutral-100, oklch(97% 0 0));color:var(--color-neutral-700, oklch(37.1% 0 0))}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-accent{border-color:rgba(var(--ax-sys-color-accent2-surface));background-color:rgba(var(--ax-sys-color-accent2-surface));color:rgba(var(--ax-sys-color-accent2-surface))}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-accent{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-accent2-surface)) 30%,transparent)}}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-accent{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-accent2-surface)) 10%,transparent)}}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-warning{border-color:rgba(var(--ax-sys-color-warning-surface));background-color:rgba(var(--ax-sys-color-warning-lightest-surface));color:rgba(var(--ax-sys-color-warning-800))}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-warning{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-surface)) 40%,transparent)}}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){border-color:rgba(var(--ax-sys-color-warning-600))}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-warning-900))}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-900)) 85%,transparent)}}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){color:rgba(var(--ax-sys-color-warning-100))}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-danger{border-color:rgba(var(--ax-sys-color-danger-surface));background-color:rgba(var(--ax-sys-color-danger-surface));color:rgba(var(--ax-sys-color-danger-surface))}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-danger{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 40%,transparent)}}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-danger{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 10%,transparent)}}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-success{border-color:rgba(var(--ax-sys-color-success-surface));background-color:rgba(var(--ax-sys-color-success-surface));color:rgba(var(--ax-sys-color-success-surface))}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-success{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 40%,transparent)}}@supports (color: color-mix(in lab,red,red)){.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-badge.__badge-success{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 10%,transparent)}}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item .__item-content .__item-actions{display:flex;align-items:center;gap:0}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item{--tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);box-sizing:border-box;cursor:grabbing;opacity:.98}.__section.cdk-drag-placeholder{border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);border-color:rgba(var(--ax-sys-color-accent2-surface));opacity:50%;margin-bottom:1rem;min-height:8rem}.__section.cdk-drag-dragging{opacity:70%}.__item.cdk-drag-placeholder{position:relative;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);border-color:rgba(var(--ax-sys-color-accent2-surface));min-height:5rem;margin-bottom:.75rem;opacity:.5}.__item.cdk-drag-placeholder>*{opacity:0%}.__item.cdk-drag-animating{transition:transform .25s cubic-bezier(.4,0,.2,1)}.axp-section-items-builder .__items-list.cdk-drop-list-dragging .__item:not(.cdk-drag-placeholder){margin-bottom:.75rem}.axp-section-items-builder .__items-list.cdk-drop-list-dragging,.axp-section-items-builder .__items-list.cdk-drop-list-receiving{position:relative;min-height:calc(var(--spacing, .25rem) * 16);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);border-color:rgba(var(--ax-sys-color-accent2-surface));padding:calc(var(--spacing, .25rem) * 2)}.axp-section-items-builder .__items-list.cdk-drop-list-dragging axp-state-message,.axp-section-items-builder .__items-list.cdk-drop-list-receiving axp-state-message{display:none}.axp-section-items-builder .__sections-container.cdk-drop-list-dragging .__section:not(.cdk-drag-placeholder){margin-bottom:1rem}.axp-section-items-builder .__sections-container.cdk-drop-list-dragging:has(.__section.cdk-drag-placeholder),.axp-section-items-builder .__sections-container.cdk-drop-list-receiving:has(.__section.cdk-drag-placeholder){border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);border-color:rgba(var(--ax-sys-color-accent2-surface));padding:calc(var(--spacing, .25rem) * 2)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-font-weight: initial;--tw-leading: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
7980
+ ], template: "<div class=\"axp-section-items-builder\" *translate=\"let t\">\n <div class=\"__content\">\n @if (sectionsModel().sections.length === 0) {\n <!-- ----- Empty state when no sections are configured ----- -->\n <axp-state-message icon=\"fa-light fa-layer-group\" [title]=\"definition().texts.emptySectionsTitle\" [description]=\"definition().texts.emptySectionsDescription\"></axp-state-message>\n } @else {\n <!-- ----- Draggable section list when at least one section exists ----- -->\n <div class=\"__sections-container\" cdkDropList [cdkDropListData]=\"sectionsModel().sections\" (cdkDropListDropped)=\"onSectionDrop($event)\">\n @for (row of sectionRows(); track row.section.id) {\n <div class=\"__section\" cdkDrag cdkDragPreviewClass=\"axp-section-items-builder-drag-preview\">\n <div class=\"__section-header\">\n @if (!readonlyMode()) {\n <!-- ----- Section reorder handle (edit mode only) ----- -->\n <div class=\"__section-drag-handle\" cdkDragHandle>\n <ax-icon icon=\"fa-solid fa-grip-vertical\"></ax-icon>\n </div>\n }\n <div class=\"__section-info\">\n @let secTitle = sectionTitleValue(row.section) | translate | async;\n <h3 class=\"__section-title\" [title]=\"secTitle\">\n {{ secTitle }}\n @if (definition().showSectionTechnicalName) {\n @let secTechName = sectionNameValue(row.section) | translate | async;\n @if (secTechName?.trim()) {\n <span class=\"__section-name-prefix\">({{ secTechName }})</span>\n }\n }\n @if (isDefaultSection(row.section)) {\n @if (definition().texts.defaultSectionBadge; as defaultBadge) {\n <span class=\"__default-section-badge\">{{ defaultBadge | translate | async }}</span>\n }\n }\n </h3>\n @let secDesc = (sectionDescriptionValue(row.section) | translate | async) || '';\n @let secDescTrimmed = secDesc?.trim();\n @if (secDescTrimmed) {\n @if (containsHtmlMarkup(secDescTrimmed)) {\n <!-- ----- Rich HTML section description ----- -->\n <div class=\"__section-description __section-description--rich\" [title]=\"tooltipPlainTextForHtml(secDesc)\" [innerHTML]=\"secDesc | safe: 'html'\"></div>\n } @else {\n <!-- ----- Plain text section description ----- -->\n <p class=\"__section-description\" [title]=\"secDescTrimmed\">{{ secDescTrimmed }}</p>\n }\n }\n </div>\n @if (!readonlyMode()) {\n <!-- ----- Section toolbar: add items and inline edit/remove ----- -->\n <div class=\"__section-actions ax-sm\">\n @if (definition().promptAddItems) {\n <ax-button [text]=\"definition().texts.addItem | translate | async\" [color]=\"'accent2'\" (onClick)=\"onAddItems(row.section)\">\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n }\n @if (definition().promptEditSection || canRemoveSection()) {\n <div class=\"__section-inline-actions\">\n @if (definition().promptEditSection) {\n <ax-button [look]=\"'blank'\" color=\"accent3\" (onClick)=\"onEditSection(row.section)\">\n <ax-icon class=\"fa-light fa-pencil\"></ax-icon>\n </ax-button>\n }\n @if (canRemoveSection()) {\n <ax-button [look]=\"'blank'\" color=\"danger\" (onClick)=\"onRemoveSection(row.section)\">\n <ax-icon class=\"fa-light fa-trash-can\"></ax-icon>\n </ax-button>\n }\n </div>\n }\n </div>\n }\n </div>\n\n <div class=\"__items-container\">\n <div class=\"__items-list\" cdkDropList [id]=\"sectionItemsListId(row.section.id)\" [cdkDropListData]=\"row.section.items\" [cdkDropListConnectedTo]=\"itemDropListIds()\" (cdkDropListDropped)=\"onItemDrop($event, row.section.id)\">\n @if (row.itemRows.length === 0) {\n <!-- ----- Empty state when the section has no items ----- -->\n <axp-state-message icon=\"fa-light fa-inbox\" [title]=\"definition().texts.emptyItemsTitle\" [description]=\"definition().texts.emptyItemsDescription\"></axp-state-message>\n } @else {\n <!-- ----- Draggable item rows for this section ----- -->\n @for (ir of row.itemRows; track ir.item.id) {\n <div class=\"__item\" cdkDrag cdkDragPreviewClass=\"axp-section-items-builder-drag-preview\">\n @if (!readonlyMode()) {\n <!-- ----- Item reorder handle (edit mode only) ----- -->\n <div class=\"__drag-handle\" cdkDragHandle>\n <ax-icon icon=\"fa-solid fa-grip-vertical\"></ax-icon>\n </div>\n }\n <div class=\"__item-content\">\n <div class=\"__item-leading\" [title]=\"itemMultilingualField(ir.item, 'title', ir.view.title) | translate | async\">\n <div class=\"__item-icon\" [class.__tone-easy]=\"ir.view.iconTone === 'easy'\" [class.__tone-medium]=\"ir.view.iconTone === 'medium'\" [class.__tone-hard]=\"ir.view.iconTone === 'hard'\">\n <ax-icon [icon]=\"ir.view.icon\"></ax-icon>\n </div>\n </div>\n <div class=\"__item-info\">\n <div class=\"__item-info-body\">\n <div class=\"__title-row\">\n @let itemTitle = itemMultilingualField(ir.item, 'title', ir.view.title) | translate | async;\n @let itemName = itemMultilingualField(ir.item, 'name', ir.view.name) | translate | async;\n <h4 class=\"__item-title\" [title]=\"itemTitle + (itemName?.trim() ? ' (' + itemName + ')' : '')\">\n {{ itemTitle }}\n @if (itemName?.trim()) {\n <span class=\"__item-name-prefix\">({{ itemName }})</span>\n }\n </h4>\n </div>\n @let itemDesc = (itemMultilingualField(ir.item, 'description', ir.view.description) | translate | async) || '';\n @let itemDescTrimmed = itemDesc?.trim();\n @if (itemDescTrimmed) {\n @if (containsHtmlMarkup(itemDescTrimmed)) {\n <!-- ----- Rich HTML item description ----- -->\n <div class=\"__item-description __item-description--rich\" [title]=\"tooltipPlainTextForHtml(itemDesc)\" [innerHTML]=\"itemDesc | safe: 'html'\"></div>\n } @else {\n <!-- ----- Plain text item description ----- -->\n <p class=\"__item-description\" [title]=\"itemDescTrimmed\">{{ itemDescTrimmed }}</p>\n }\n }\n </div>\n <div class=\"__title-actions\">\n @for (b of ir.view.badges; track $index) {\n <span\n class=\"__item-badge\"\n [class.__badge-neutral]=\"!b.variant || b.variant === 'neutral'\"\n [class.__badge-accent]=\"b.variant === 'accent'\"\n [class.__badge-warning]=\"b.variant === 'warning'\"\n [class.__badge-danger]=\"b.variant === 'danger'\"\n [class.__badge-success]=\"b.variant === 'success'\"\n >\n @if (isTranslationKey(b.text)) {\n {{ b.text | translate | async }}\n } @else {\n {{ b.text }}\n }\n </span>\n }\n @if (!readonlyMode()) {\n <!-- ----- Item edit and remove actions ----- -->\n <div class=\"__item-actions ax-sm\">\n @if (definition().promptEditItem) {\n <ax-button [look]=\"'blank'\" color=\"accent3\" (onClick)=\"onEditItem(ir.item, row.section.id)\">\n <ax-icon class=\"fa-light fa-pencil\"></ax-icon>\n </ax-button>\n }\n <ax-button [look]=\"'blank'\" color=\"danger\" (onClick)=\"onRemoveItem(ir.item, row.section.id)\">\n <ax-icon class=\"fa-light fa-trash-can\"></ax-icon>\n </ax-button>\n </div>\n }\n </div>\n </div>\n </div>\n </div>\n }\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n </div>\n</div>\n", styles: ["@layer properties;.axp-section-items-builder{display:flex;height:100%;width:100%;flex-direction:column}.axp-section-items-builder .__content{flex:1;overflow:auto}.axp-section-items-builder .__sections-container{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 4)}.axp-section-items-builder .__sections-container.cdk-drop-list-dragging .__section:not(.cdk-drag-placeholder){margin-bottom:calc(var(--spacing, .25rem) * 4)}.axp-section-items-builder .__sections-container.cdk-drop-list-dragging:has(.__section.cdk-drag-placeholder),.axp-section-items-builder .__sections-container.cdk-drop-list-dragging.cdk-drop-list-receiving:has(.__section.cdk-drag-placeholder){border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);border-color:rgba(var(--ax-sys-color-accent2-surface));padding:calc(var(--spacing, .25rem) * 2)}.axp-section-items-builder .__items-list.cdk-drop-list-dragging,.axp-section-items-builder .__items-list.cdk-drop-list-receiving{position:relative;min-height:calc(var(--spacing, .25rem) * 16);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);border-color:rgba(var(--ax-sys-color-accent2-surface));padding:calc(var(--spacing, .25rem) * 2)}:is(.axp-section-items-builder .__items-list.cdk-drop-list-dragging,.axp-section-items-builder .__items-list.cdk-drop-list-receiving) axp-state-message{display:none}.axp-section-items-builder .__items-list.cdk-drop-list-dragging .__item:not(.cdk-drag-placeholder){margin-bottom:calc(var(--spacing, .25rem) * 3)}.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section{border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);padding:calc(var(--spacing, .25rem) * 3)}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-drag-handle{display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);cursor:grab;align-items:center;justify-content:center;color:var(--color-neutral-400, oklch(70.8% 0 0))}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-drag-handle:active{cursor:grabbing}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-drag-handle:hover{color:var(--color-neutral-600, oklch(43.9% 0 0))}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info{min-width:0;flex:1}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-title{margin-bottom:var(--spacing, .25rem);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;min-width:0;overflow:hidden;font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);overflow-wrap:break-word}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-title .__section-name-prefix{margin-left:var(--spacing, .25rem);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300);color:var(--color-neutral-500, oklch(55.6% 0 0))}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-title .__default-section-badge{margin-left:calc(var(--spacing, .25rem) * 2);display:inline-flex;border-radius:.25rem;background-color:var(--color-neutral-100, oklch(97% 0 0));padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);color:var(--color-neutral-500, oklch(55.6% 0 0))}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-description{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);overflow-wrap:break-word;color:var(--color-neutral-600, oklch(43.9% 0 0))}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-description.__section-description--rich{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);overflow-wrap:break-word;color:var(--color-neutral-600, oklch(43.9% 0 0))}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-description.__section-description--rich p{margin:0}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-description.__section-description--rich p:first-child{margin-top:0}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-description.__section-description--rich ul{margin-top:calc(var(--spacing, .25rem) * 1.5);margin-bottom:0;list-style-position:outside;list-style-type:disc;padding-inline-start:calc(var(--spacing, .25rem) * 5)}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-description.__section-description--rich ol{margin-top:calc(var(--spacing, .25rem) * 1.5);margin-bottom:0;list-style-position:outside;list-style-type:decimal;padding-inline-start:calc(var(--spacing, .25rem) * 5)}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-info .__section-description.__section-description--rich li{margin-block:calc(var(--spacing, .25rem) * .5);padding-inline-start:var(--spacing, .25rem)}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-actions{display:flex;flex-shrink:0;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__section-header .__section-inline-actions{display:flex;align-items:center;gap:0}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__items-container{padding:calc(var(--spacing, .25rem) * 4)}:is(.axp-section-items-builder .__section,.cdk-drag-preview.axp-section-items-builder-drag-preview.__section) .__items-container .__items-list{display:flex;min-height:calc(var(--spacing, .25rem) * 12);flex-direction:column;gap:calc(var(--spacing, .25rem) * 3)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__section{box-sizing:border-box;opacity:.98;--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding:calc(var(--spacing, .25rem) * 3);--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);-webkit-user-select:none;user-select:none}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__drag-handle{display:flex;height:calc(var(--spacing, .25rem) * 6);width:calc(var(--spacing, .25rem) * 6);cursor:grab;align-items:center;justify-content:center;color:var(--color-neutral-400, oklch(70.8% 0 0))}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__drag-handle:active{cursor:grabbing}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__drag-handle:hover{color:var(--color-neutral-600, oklch(43.9% 0 0))}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content{display:flex;min-width:0;flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 3)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-leading{display:flex;flex-shrink:0;align-items:center;justify-content:center}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-icon{display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);align-items:center;justify-content:center;border-radius:var(--radius-md, .375rem);background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);color:rgba(var(--ax-sys-color-accent2-surface));--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-icon.__tone-easy{background-color:rgba(var(--ax-sys-color-success-surface));color:rgba(var(--ax-sys-color-success-surface))}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-icon.__tone-easy{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 10%,transparent)}}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-icon.__tone-medium{background-color:rgba(var(--ax-sys-color-warning-surface));color:rgba(var(--ax-sys-color-warning-surface))}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-icon.__tone-medium{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-surface)) 10%,transparent)}}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-icon.__tone-hard{background-color:rgba(var(--ax-sys-color-danger-surface));color:rgba(var(--ax-sys-color-danger-surface))}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-icon.__tone-hard{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 10%,transparent)}}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-info{display:flex;min-width:0;flex:1;flex-direction:row;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-info-body{display:flex;min-width:0;flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__title-row{display:flex;min-width:0;align-items:baseline}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-title{margin-bottom:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;min-width:0;flex:1;overflow:hidden;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);overflow-wrap:break-word}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-title .__item-name-prefix{margin-left:var(--spacing, .25rem);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300);color:var(--color-neutral-500, oklch(55.6% 0 0))}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-description{margin-top:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);overflow-wrap:break-word;color:var(--color-neutral-500, oklch(55.6% 0 0))}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-description.__item-description--rich{margin-top:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);overflow-wrap:break-word;color:var(--color-neutral-500, oklch(55.6% 0 0))}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-description.__item-description--rich p{margin:0}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-description.__item-description--rich p:first-child{margin-top:0}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-description.__item-description--rich ul{margin-top:calc(var(--spacing, .25rem) * 1.5);margin-bottom:0;list-style-position:outside;list-style-type:disc;padding-inline-start:calc(var(--spacing, .25rem) * 5)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-description.__item-description--rich ol{margin-top:calc(var(--spacing, .25rem) * 1.5);margin-bottom:0;list-style-position:outside;list-style-type:decimal;padding-inline-start:calc(var(--spacing, .25rem) * 5)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-description.__item-description--rich li{margin-block:calc(var(--spacing, .25rem) * .5);padding-inline-start:var(--spacing, .25rem)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__title-actions{display:flex;flex-shrink:0;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:calc(var(--spacing, .25rem) * 2)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:1px;font-size:.6875rem;--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-neutral{border-color:var(--color-neutral-200, oklch(92.2% 0 0));background-color:var(--color-neutral-100, oklch(97% 0 0));color:var(--color-neutral-700, oklch(37.1% 0 0))}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-accent{border-color:rgba(var(--ax-sys-color-accent2-surface));background-color:rgba(var(--ax-sys-color-accent2-surface));color:rgba(var(--ax-sys-color-accent2-surface))}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-accent{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-accent2-surface)) 30%,transparent)}}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-accent{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-accent2-surface)) 10%,transparent)}}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-warning{border-color:rgba(var(--ax-sys-color-warning-surface));background-color:rgba(var(--ax-sys-color-warning-lightest-surface));color:rgba(var(--ax-sys-color-warning-800))}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-warning{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-surface)) 40%,transparent)}}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){border-color:rgba(var(--ax-sys-color-warning-600))}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-warning-900))}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-warning-900)) 85%,transparent)}}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-warning:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){color:rgba(var(--ax-sys-color-warning-100))}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-danger{border-color:rgba(var(--ax-sys-color-danger-surface));background-color:rgba(var(--ax-sys-color-danger-surface));color:rgba(var(--ax-sys-color-danger-surface))}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-danger{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 40%,transparent)}}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-danger{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-danger-surface)) 10%,transparent)}}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-success{border-color:rgba(var(--ax-sys-color-success-surface));background-color:rgba(var(--ax-sys-color-success-surface));color:rgba(var(--ax-sys-color-success-surface))}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-success{border-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 40%,transparent)}}@supports (color: color-mix(in lab,red,red)){:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-badge.__badge-success{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-success-surface)) 10%,transparent)}}:is(.axp-section-items-builder .__item,.cdk-drag-preview.axp-section-items-builder-drag-preview.__item) .__item-content .__item-actions{display:flex;align-items:center;gap:0}.axp-section-items-builder .__item{cursor:move}.axp-section-items-builder .__item:hover{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cdk-drag-preview.axp-section-items-builder-drag-preview.__item{box-sizing:border-box;cursor:grabbing;opacity:.98;--tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.__section.cdk-drag-placeholder{margin-bottom:calc(var(--spacing, .25rem) * 4);min-height:calc(var(--spacing, .25rem) * 32);border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);border-color:rgba(var(--ax-sys-color-accent2-surface));opacity:50%}.__section.cdk-drag-dragging{opacity:70%}.__item.cdk-drag-placeholder{position:relative;margin-bottom:calc(var(--spacing, .25rem) * 3);min-height:calc(var(--spacing, .25rem) * 20);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:var(--color-accent2-lightest);color:var(--color-on-accent2-lightest);border-color:var(--color-border-accent2-lightest);border-color:rgba(var(--ax-sys-color-accent2-surface));opacity:50%}.__item.cdk-drag-placeholder>*{opacity:0%}.__item.cdk-drag-animating{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .25s;transition-duration:.25s}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-duration{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-font-weight: initial;--tw-leading: initial;--tw-duration: initial}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
8278
7981
  }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], definition: [{ type: i0.Input, args: [{ isSignal: true, alias: "definition", required: true }] }], readonlyMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] } });
8279
7982
 
8280
7983
  class AXPQuerySortsComponent {
@@ -8951,7 +8654,7 @@ class AXPSpreadsheetComponent {
8951
8654
  }
8952
8655
  }
8953
8656
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSpreadsheetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
8954
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPSpreadsheetComponent, isStandalone: true, selector: "axp-spreadsheet", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, rowMode: { classPropertyName: "rowMode", publicName: "rowMode", isSignal: true, isRequired: false, transformFunction: null }, rowsInput: { classPropertyName: "rowsInput", publicName: "rowsInput", isSignal: true, isRequired: false, transformFunction: null }, rowsModel: { classPropertyName: "rowsModel", publicName: "rowsModel", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, emptyCellPlaceholder: { classPropertyName: "emptyCellPlaceholder", publicName: "emptyCellPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, rowTitlePath: { classPropertyName: "rowTitlePath", publicName: "rowTitlePath", isSignal: true, isRequired: false, transformFunction: null }, rowDescriptionPath: { classPropertyName: "rowDescriptionPath", publicName: "rowDescriptionPath", isSignal: true, isRequired: false, transformFunction: null }, allowAddRows: { classPropertyName: "allowAddRows", publicName: "allowAddRows", isSignal: true, isRequired: false, transformFunction: null }, allowRemoveRows: { classPropertyName: "allowRemoveRows", publicName: "allowRemoveRows", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rowsModel: "rowsModelChange", cellChange: "cellChange", rowChange: "rowChange", spreadsheetChange: "spreadsheetChange" }, host: { classAttribute: "axp-spreadsheet" }, ngImport: i0, template: "<!--\n #region ---- Spreadsheet Component Template ----\n-->\n<div class=\"__spreadsheet-container\" (click)=\"handleClickOutside($event)\">\n @if (isColumnsEmpty()) {\n <!-- Empty State: Columns are empty (regardless of rows) -->\n <div class=\"__empty-state\">\n <div class=\"__empty-icon\">\n <i class=\"fa-light fa-table-columns\"></i>\n </div>\n <div class=\"__empty-title\">\n {{ '@general:state-message.empty-columns.title' | translate | async }}\n </div>\n <div class=\"__empty-description\">\n {{\n '@general:state-message.empty-columns.description' | translate | async\n }}\n </div>\n </div>\n } @else if (isEmpty()) {\n <!-- Empty State: Both columns and rows are empty -->\n <div class=\"__empty-state\">\n <div class=\"__empty-icon\">\n <i class=\"fa-light fa-table\"></i>\n </div>\n <div class=\"__empty-title\">\n {{ '@general:state-message.empty.title' | translate | async }}\n </div>\n <div class=\"__empty-description\">\n {{ '@general:state-message.empty.description' | translate | async }}\n </div>\n </div>\n } @else if (isRowsEmpty()) {\n <!-- Empty State: Only rows are empty - Show columns -->\n <div class=\"__table-wrapper\">\n <table class=\"__table\">\n <!-- Header Row -->\n <thead class=\"__thead\">\n <tr class=\"__header-row\">\n <!-- Corner cell (title) -->\n <th class=\"__corner-cell\">\n @if (title()) {\n <div class=\"__corner-title\">\n {{ title() | translate | async }}\n </div>\n }\n @if (rowMode() === 'dynamic' && allowAddRows() && !readonly()) {\n <div class=\"__corner-actions\">\n <ax-button\n look=\"blank\"\n color=\"primary\"\n (onClick)=\"handleAddRow()\"\n [attr.aria-label]=\"'Add Row'\"\n >\n <ax-icon icon=\"far fa-plus\"></ax-icon>\n </ax-button>\n </div>\n }\n </th>\n\n <!-- Column headers -->\n @for (column of columns(); track column.name) {\n <th class=\"__column-header\" [style.width]=\"column.width\">\n <div class=\"__header-content\">\n <div class=\"__header-title\">\n {{ column.title | translate | async }}\n </div>\n </div>\n </th>\n }\n </tr>\n </thead>\n\n <!-- Empty State Row -->\n <tbody class=\"__tbody\">\n <tr class=\"__row __row--empty\">\n <td class=\"__row-header\" [attr.colspan]=\"columns().length + 1\">\n <div class=\"__empty-state-inline\">\n <div class=\"__empty-icon\">\n <i class=\"fa-light fa-list\"></i>\n </div>\n <div class=\"__empty-title\">\n {{\n '@general:state-message.empty-rows.title'\n | translate\n | async\n }}\n </div>\n <div class=\"__empty-description\">\n {{\n '@general:state-message.empty-rows.description'\n | translate\n | async\n }}\n </div>\n </div>\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n } @else {\n <!-- Full Spreadsheet: Both columns and rows are available -->\n <div class=\"__table-wrapper\">\n <table class=\"__table\">\n <!-- Header Row -->\n <thead class=\"__thead\">\n <tr class=\"__header-row\">\n <!-- Corner cell (title) -->\n <th class=\"__corner-cell\">\n @if (title()) {\n <div class=\"__corner-title\">\n {{ title() | translate | async }}\n </div>\n }\n @if (rowMode() === 'dynamic' && allowAddRows() && !readonly()) {\n <div class=\"__corner-actions\">\n <ax-button\n look=\"blank\"\n color=\"primary\"\n (onClick)=\"handleAddRow()\"\n [attr.aria-label]=\"'Add Row'\"\n >\n <ax-icon icon=\"far fa-plus\"></ax-icon>\n </ax-button>\n </div>\n }\n </th>\n\n <!-- Column headers -->\n @for (column of columns(); track column.name) {\n <th class=\"__column-header\" [style.width]=\"column.width\">\n <div class=\"__header-content\">\n <div class=\"__header-title\">\n {{ column.title | translate | async }}\n </div>\n </div>\n </th>\n }\n </tr>\n </thead>\n\n <!-- Body Rows -->\n <tbody class=\"__tbody\">\n <axp-widgets-container\n [context]=\"spreadsheetContext()\"\n (onContextChanged)=\"handleSpreadsheetContextChange($event)\"\n >\n @for (\n rowItem of rowsWithIds();\n track rowItem.rowId;\n let rowIndex = $index\n ) {\n <tr class=\"__row\" [class.__row--odd]=\"rowIndex % 2 === 1\">\n <!-- Row header -->\n <td class=\"__row-header\">\n <div class=\"__header-content\">\n @if (rowTitlePath()) {\n <div class=\"__header-title\">\n {{ getRowTitle(rowItem.row, rowTitlePath()!) }}\n </div>\n }\n @if (rowDescriptionPath()) {\n <div class=\"__header-description\">\n {{\n getRowDescription(rowItem.row, rowDescriptionPath()!)\n }}\n </div>\n }\n </div>\n @if (allowRemoveRows() && !readonly()) {\n <div\n class=\"__header-actions ax-sm opacity-30 hover:opacity-100\"\n >\n <ax-button\n look=\"blank\"\n color=\"danger\"\n (onClick)=\"handleRemoveRow(rowItem.rowId, $event)\"\n [attr.aria-label]=\"'Remove Row'\"\n >\n <ax-icon icon=\"far fa-times\"></ax-icon>\n </ax-button>\n </div>\n }\n </td>\n\n <!-- Spreadsheet cells -->\n @for (column of columns(); track column.name) {\n <td\n class=\"__cell\"\n [class.__cell--editing]=\"\n isCellEditing(rowItem.rowId, column.name)\n \"\n [class.__cell--readonly]=\"isColumnReadonly(column)\"\n (click)=\"\n $event.stopPropagation();\n handleCellClick(rowItem.rowId, column.name, $event)\n \"\n >\n @if (\n isCellEditing(rowItem.rowId, column.name) &&\n !isColumnReadonly(column)\n ) {\n <!-- Edit mode: Show widget in edit mode -->\n <div\n class=\"__cell-editor\"\n (blur)=\"handleCellBlur(rowItem.rowId, column.name)\"\n tabindex=\"-1\"\n >\n <ng-container\n axp-widget-renderer\n [node]=\"getCellWidgetNode(column, rowIndex)\"\n [mode]=\"'edit'\"\n ></ng-container>\n </div>\n <!-- Floating toolbar for commit/cancel -->\n <div\n class=\"__cell-toolbar ax-sm\"\n (click)=\"$event.stopPropagation()\"\n (mousedown)=\"\n $event.preventDefault(); $event.stopPropagation()\n \"\n (mouseup)=\"$event.stopPropagation()\"\n (focusin)=\"$event.stopPropagation()\"\n >\n <ax-button\n look=\"blank\"\n color=\"success\"\n (onClick)=\"commitCellEdit()\"\n [attr.aria-label]=\"'Commit'\"\n >\n <ax-icon icon=\"far fa-check\"></ax-icon>\n </ax-button>\n <ax-button\n look=\"blank\"\n color=\"danger\"\n (onClick)=\"cancelCellEdit()\"\n [attr.aria-label]=\"'Cancel'\"\n >\n <ax-icon icon=\"far fa-times\"></ax-icon>\n </ax-button>\n </div>\n } @else {\n <!-- View mode: Show widget in view mode or placeholder -->\n <div class=\"__cell-value\">\n @if (\n getCellValue(rowIndex, column.name) !== null &&\n getCellValue(rowIndex, column.name) !== undefined\n ) {\n <ng-container\n axp-widget-renderer\n [node]=\"getCellWidgetNode(column, rowIndex)\"\n [mode]=\"'view'\"\n ></ng-container>\n } @else {\n <span class=\"__cell-placeholder\">{{\n emptyCellPlaceholder()\n }}</span>\n }\n </div>\n }\n </td>\n }\n </tr>\n }\n </axp-widgets-container>\n </tbody>\n </table>\n </div>\n }\n</div>\n<!--\n #endregion\n-->\n", styles: ["@layer properties;.axp-spreadsheet{display:flex;height:100%;width:100%;flex-direction:column}.axp-spreadsheet .__spreadsheet-container{position:relative;flex:1;overflow:hidden;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest)}.axp-spreadsheet .__empty-state{display:flex;min-height:200px;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 8);text-align:center}.axp-spreadsheet .__empty-state .__empty-icon{margin-bottom:calc(var(--spacing, .25rem) * 4)}.axp-spreadsheet .__empty-state .__empty-icon i{font-size:var(--text-4xl, 2.25rem);line-height:var(--tw-leading, var(--text-4xl--line-height, calc(2.5 / 2.25)));color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-spreadsheet .__empty-state .__empty-title{margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:var(--color-neutral-800, oklch(26.9% 0 0))}.axp-spreadsheet .__empty-state .__empty-description{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-spreadsheet .__empty-state-inline{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 6);text-align:center}.axp-spreadsheet .__empty-state-inline .__empty-icon{margin-bottom:calc(var(--spacing, .25rem) * 3)}.axp-spreadsheet .__empty-state-inline .__empty-icon i{font-size:var(--text-2xl, 1.5rem);line-height:var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-spreadsheet .__empty-state-inline .__empty-title{margin-bottom:var(--spacing, .25rem);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:var(--color-neutral-800, oklch(26.9% 0 0))}.axp-spreadsheet .__empty-state-inline .__empty-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-spreadsheet .__table-wrapper{height:100%;width:100%;overflow-x:auto;overflow-y:auto;-webkit-overflow-scrolling:touch}.axp-spreadsheet .__table-wrapper::-webkit-scrollbar{height:8px;width:8px}.axp-spreadsheet .__table-wrapper::-webkit-scrollbar-track{background-color:var(--color-neutral-100, oklch(97% 0 0))}.axp-spreadsheet .__table-wrapper::-webkit-scrollbar-thumb{border-radius:.25rem;background-color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-spreadsheet .__table-wrapper::-webkit-scrollbar-thumb:hover{background-color:var(--color-neutral-500, oklch(55.6% 0 0))}.axp-spreadsheet .__table{min-width:100%;border-collapse:separate;--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;border-spacing:var(--tw-border-spacing-x) var(--tw-border-spacing-y)}.axp-spreadsheet .__table .__thead{position:sticky;top:0;z-index:2}.axp-spreadsheet .__table .__thead .__header-row .__corner-cell{position:relative;position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);width:200px;min-width:200px;border-style:var(--tw-border-style);border-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);z-index:3}.axp-spreadsheet .__table .__thead .__header-row .__corner-cell .__corner-title{text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-spreadsheet .__table .__thead .__header-row .__corner-cell .__corner-actions{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:var(--spacing, .25rem)}@media(max-width:768px){.axp-spreadsheet .__table .__thead .__header-row .__corner-cell{width:200px;min-width:200px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}}.axp-spreadsheet .__table .__thead .__header-row .__column-header{position:sticky;top:0;width:200px;min-width:200px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);text-align:center;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);white-space:nowrap;z-index:2}.axp-spreadsheet .__table .__thead .__header-row .__column-header.__column-header--empty{width:300px;min-width:300px;white-space:normal}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content{display:flex;flex-direction:column;gap:var(--spacing, .25rem)}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content .__header-title{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content .__header-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);overflow-wrap:break-word;white-space:normal;opacity:75%}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-actions{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:var(--spacing, .25rem)}@media(max-width:768px){.axp-spreadsheet .__table .__thead .__header-row .__column-header{width:120px;min-width:120px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content .__header-title,.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content .__header-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}}.axp-spreadsheet .__table .__tbody .__row.__row--empty .__row-header{text-align:center}.axp-spreadsheet .__table .__tbody .__row .__row-header{position:relative;position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);width:200px;min-width:200px;border-style:var(--tw-border-style);border-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);vertical-align:top;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);z-index:2}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-actions{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:var(--spacing, .25rem)}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content{display:flex;flex-direction:column;gap:var(--spacing, .25rem)}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content .__header-title{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content .__header-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);opacity:75%}@media(max-width:768px){.axp-spreadsheet .__table .__tbody .__row .__row-header{width:200px;min-width:200px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content .__header-title,.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content .__header-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}}.axp-spreadsheet .__table .__tbody .__row .__cell{position:relative;min-height:40px;width:200px;min-width:200px;cursor:pointer;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);text-align:center;vertical-align:middle}.axp-spreadsheet .__table .__tbody .__row .__cell:before{content:\"\";pointer-events:none;position:absolute;inset:0;background-color:color-mix(in srgb,#000 5%,transparent);opacity:0%;transition-property:opacity;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s;--tw-ease: var(--ease-in-out, cubic-bezier(.4, 0, .2, 1));transition-timing-function:var(--ease-in-out, cubic-bezier(.4, 0, .2, 1))}@supports (color: color-mix(in lab,red,red)){.axp-spreadsheet .__table .__tbody .__row .__cell:before{background-color:color-mix(in oklab,var(--color-black, #000) 5%,transparent)}}.axp-spreadsheet .__table .__tbody .__row .__cell:hover:not(.__cell--readonly):not(.__cell--editing):before{opacity:100%}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--readonly{cursor:default}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--readonly:hover:before{opacity:0%}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--empty{cursor:default}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--empty:hover:before{opacity:0%}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--editing{position:relative;border-style:var(--tw-border-style);border-width:2px;border-color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface));padding:1px}@supports (color: color-mix(in lab,red,red)){.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--editing{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--editing .__cell-editor{width:100%;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--editing .__cell-toolbar{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 0);bottom:-35px;display:flex;gap:calc(var(--spacing, .25rem) * .5);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding:var(--spacing, .25rem);white-space:nowrap;--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);z-index:100}.axp-spreadsheet .__table .__tbody .__row .__cell .__cell-value{display:flex;min-height:calc(var(--spacing, .25rem) * 5);align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * .5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));overflow-wrap:break-word}.axp-spreadsheet .__table .__tbody .__row .__cell .__cell-placeholder{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-spreadsheet .__table .__tbody .__row .__cell .__cell-editor{display:flex;width:100%;align-items:center;justify-content:center}@media(max-width:768px){.axp-spreadsheet .__table .__tbody .__row .__cell{width:120px;min-width:120px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}.axp-spreadsheet .__table .__tbody .__row .__cell .__cell-value{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-border-spacing-x{syntax: \"<length>\"; inherits: false; initial-value: 0;}@property --tw-border-spacing-y{syntax: \"<length>\"; inherits: false; initial-value: 0;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-ease{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-duration: initial;--tw-ease: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { 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", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
8657
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPSpreadsheetComponent, isStandalone: true, selector: "axp-spreadsheet", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, rowMode: { classPropertyName: "rowMode", publicName: "rowMode", isSignal: true, isRequired: false, transformFunction: null }, rowsInput: { classPropertyName: "rowsInput", publicName: "rowsInput", isSignal: true, isRequired: false, transformFunction: null }, rowsModel: { classPropertyName: "rowsModel", publicName: "rowsModel", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, emptyCellPlaceholder: { classPropertyName: "emptyCellPlaceholder", publicName: "emptyCellPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, rowTitlePath: { classPropertyName: "rowTitlePath", publicName: "rowTitlePath", isSignal: true, isRequired: false, transformFunction: null }, rowDescriptionPath: { classPropertyName: "rowDescriptionPath", publicName: "rowDescriptionPath", isSignal: true, isRequired: false, transformFunction: null }, allowAddRows: { classPropertyName: "allowAddRows", publicName: "allowAddRows", isSignal: true, isRequired: false, transformFunction: null }, allowRemoveRows: { classPropertyName: "allowRemoveRows", publicName: "allowRemoveRows", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rowsModel: "rowsModelChange", cellChange: "cellChange", rowChange: "rowChange", spreadsheetChange: "spreadsheetChange" }, host: { classAttribute: "axp-spreadsheet" }, ngImport: i0, template: "<!--\n #region ---- Spreadsheet Component Template ----\n-->\n<div class=\"__spreadsheet-container\" (click)=\"handleClickOutside($event)\">\n @if (isColumnsEmpty()) {\n <!-- Empty State: Columns are empty (regardless of rows) -->\n <div class=\"__empty-state\">\n <div class=\"__empty-icon\">\n <i class=\"fa-light fa-table-columns\"></i>\n </div>\n <div class=\"__empty-title\">\n {{ '@general:state-message.empty-columns.title' | translate | async }}\n </div>\n <div class=\"__empty-description\">\n {{\n '@general:state-message.empty-columns.description' | translate | async\n }}\n </div>\n </div>\n } @else if (isEmpty()) {\n <!-- Empty State: Both columns and rows are empty -->\n <div class=\"__empty-state\">\n <div class=\"__empty-icon\">\n <i class=\"fa-light fa-table\"></i>\n </div>\n <div class=\"__empty-title\">\n {{ '@general:state-message.empty.title' | translate | async }}\n </div>\n <div class=\"__empty-description\">\n {{ '@general:state-message.empty.description' | translate | async }}\n </div>\n </div>\n } @else if (isRowsEmpty()) {\n <!-- Empty State: Only rows are empty - Show columns -->\n <div class=\"__table-wrapper\">\n <table class=\"__table\">\n <!-- Header Row -->\n <thead class=\"__thead\">\n <tr class=\"__header-row\">\n <!-- Corner cell (title) -->\n <th class=\"__corner-cell\">\n @if (title()) {\n <div class=\"__corner-title\">\n {{ title() | translate | async }}\n </div>\n }\n @if (rowMode() === 'dynamic' && allowAddRows() && !readonly()) {\n <div class=\"__corner-actions\">\n <ax-button\n look=\"blank\"\n color=\"primary\"\n (onClick)=\"handleAddRow()\"\n [attr.aria-label]=\"'Add Row'\"\n >\n <ax-icon icon=\"far fa-plus\"></ax-icon>\n </ax-button>\n </div>\n }\n </th>\n\n <!-- Column headers -->\n @for (column of columns(); track column.name) {\n <th class=\"__column-header\" [style.width]=\"column.width\">\n <div class=\"__header-content\">\n <div class=\"__header-title\">\n {{ column.title | translate | async }}\n </div>\n </div>\n </th>\n }\n </tr>\n </thead>\n\n <!-- Empty State Row -->\n <tbody class=\"__tbody\">\n <tr class=\"__row __row--empty\">\n <td class=\"__row-header\" [attr.colspan]=\"columns().length + 1\">\n <div class=\"__empty-state-inline\">\n <div class=\"__empty-icon\">\n <i class=\"fa-light fa-list\"></i>\n </div>\n <div class=\"__empty-title\">\n {{\n '@general:state-message.empty-rows.title'\n | translate\n | async\n }}\n </div>\n <div class=\"__empty-description\">\n {{\n '@general:state-message.empty-rows.description'\n | translate\n | async\n }}\n </div>\n </div>\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n } @else {\n <!-- Full Spreadsheet: Both columns and rows are available -->\n <div class=\"__table-wrapper\">\n <table class=\"__table\">\n <!-- Header Row -->\n <thead class=\"__thead\">\n <tr class=\"__header-row\">\n <!-- Corner cell (title) -->\n <th class=\"__corner-cell\">\n @if (title()) {\n <div class=\"__corner-title\">\n {{ title() | translate | async }}\n </div>\n }\n @if (rowMode() === 'dynamic' && allowAddRows() && !readonly()) {\n <div class=\"__corner-actions\">\n <ax-button\n look=\"blank\"\n color=\"primary\"\n (onClick)=\"handleAddRow()\"\n [attr.aria-label]=\"'Add Row'\"\n >\n <ax-icon icon=\"far fa-plus\"></ax-icon>\n </ax-button>\n </div>\n }\n </th>\n\n <!-- Column headers -->\n @for (column of columns(); track column.name) {\n <th class=\"__column-header\" [style.width]=\"column.width\">\n <div class=\"__header-content\">\n <div class=\"__header-title\">\n {{ column.title | translate | async }}\n </div>\n </div>\n </th>\n }\n </tr>\n </thead>\n\n <!-- Body Rows -->\n <tbody class=\"__tbody\">\n <axp-widgets-container\n [context]=\"spreadsheetContext()\"\n (onContextChanged)=\"handleSpreadsheetContextChange($event)\"\n >\n @for (\n rowItem of rowsWithIds();\n track rowItem.rowId;\n let rowIndex = $index\n ) {\n <tr class=\"__row\" [class.__row--odd]=\"rowIndex % 2 === 1\">\n <!-- Row header -->\n <td class=\"__row-header\">\n <div class=\"__header-content\">\n @if (rowTitlePath()) {\n <div class=\"__header-title\">\n {{ getRowTitle(rowItem.row, rowTitlePath()!) }}\n </div>\n }\n @if (rowDescriptionPath()) {\n <div class=\"__header-description\">\n {{\n getRowDescription(rowItem.row, rowDescriptionPath()!)\n }}\n </div>\n }\n </div>\n @if (allowRemoveRows() && !readonly()) {\n <div\n class=\"__header-actions ax-sm opacity-30 hover:opacity-100\"\n >\n <ax-button\n look=\"blank\"\n color=\"danger\"\n (onClick)=\"handleRemoveRow(rowItem.rowId, $event)\"\n [attr.aria-label]=\"'Remove Row'\"\n >\n <ax-icon icon=\"far fa-times\"></ax-icon>\n </ax-button>\n </div>\n }\n </td>\n\n <!-- Spreadsheet cells -->\n @for (column of columns(); track column.name) {\n <td\n class=\"__cell\"\n [class.__cell--editing]=\"\n isCellEditing(rowItem.rowId, column.name)\n \"\n [class.__cell--readonly]=\"isColumnReadonly(column)\"\n (click)=\"\n $event.stopPropagation();\n handleCellClick(rowItem.rowId, column.name, $event)\n \"\n >\n @if (\n isCellEditing(rowItem.rowId, column.name) &&\n !isColumnReadonly(column)\n ) {\n <!-- Edit mode: Show widget in edit mode -->\n <div\n class=\"__cell-editor\"\n (blur)=\"handleCellBlur(rowItem.rowId, column.name)\"\n tabindex=\"-1\"\n >\n <ng-container\n axp-widget-renderer\n [node]=\"getCellWidgetNode(column, rowIndex)\"\n [mode]=\"'edit'\"\n ></ng-container>\n </div>\n <!-- Floating toolbar for commit/cancel -->\n <div\n class=\"__cell-toolbar ax-sm\"\n (click)=\"$event.stopPropagation()\"\n (mousedown)=\"\n $event.preventDefault(); $event.stopPropagation()\n \"\n (mouseup)=\"$event.stopPropagation()\"\n (focusin)=\"$event.stopPropagation()\"\n >\n <ax-button\n look=\"blank\"\n color=\"success\"\n (onClick)=\"commitCellEdit()\"\n [attr.aria-label]=\"'Commit'\"\n >\n <ax-icon icon=\"far fa-check\"></ax-icon>\n </ax-button>\n <ax-button\n look=\"blank\"\n color=\"danger\"\n (onClick)=\"cancelCellEdit()\"\n [attr.aria-label]=\"'Cancel'\"\n >\n <ax-icon icon=\"far fa-times\"></ax-icon>\n </ax-button>\n </div>\n } @else {\n <!-- View mode: Show widget in view mode or placeholder -->\n <div class=\"__cell-value\">\n @if (\n getCellValue(rowIndex, column.name) !== null &&\n getCellValue(rowIndex, column.name) !== undefined\n ) {\n <ng-container\n axp-widget-renderer\n [node]=\"getCellWidgetNode(column, rowIndex)\"\n [mode]=\"'view'\"\n ></ng-container>\n } @else {\n <span class=\"__cell-placeholder\">{{\n emptyCellPlaceholder()\n }}</span>\n }\n </div>\n }\n </td>\n }\n </tr>\n }\n </axp-widgets-container>\n </tbody>\n </table>\n </div>\n }\n</div>\n<!--\n #endregion\n-->\n", styles: ["@layer properties;.axp-spreadsheet{display:flex;height:100%;width:100%;flex-direction:column}.axp-spreadsheet .__spreadsheet-container{position:relative;flex:1;overflow:hidden;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest)}.axp-spreadsheet .__empty-state{display:flex;min-height:200px;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 8);text-align:center}.axp-spreadsheet .__empty-state .__empty-icon{margin-bottom:calc(var(--spacing, .25rem) * 4)}.axp-spreadsheet .__empty-state .__empty-icon i{font-size:var(--text-4xl, 2.25rem);line-height:var(--tw-leading, var(--text-4xl--line-height, calc(2.5 / 2.25)));color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-spreadsheet .__empty-state .__empty-title{margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:var(--color-neutral-800, oklch(26.9% 0 0))}.axp-spreadsheet .__empty-state .__empty-description{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-spreadsheet .__empty-state-inline{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 6);text-align:center}.axp-spreadsheet .__empty-state-inline .__empty-icon{margin-bottom:calc(var(--spacing, .25rem) * 3)}.axp-spreadsheet .__empty-state-inline .__empty-icon i{font-size:var(--text-2xl, 1.5rem);line-height:var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-spreadsheet .__empty-state-inline .__empty-title{margin-bottom:var(--spacing, .25rem);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:var(--color-neutral-800, oklch(26.9% 0 0))}.axp-spreadsheet .__empty-state-inline .__empty-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-spreadsheet .__table-wrapper{height:100%;width:100%;overflow-x:auto;overflow-y:auto;-webkit-overflow-scrolling:touch}.axp-spreadsheet .__table-wrapper::-webkit-scrollbar{height:8px;width:8px}.axp-spreadsheet .__table-wrapper::-webkit-scrollbar-track{background-color:var(--color-neutral-100, oklch(97% 0 0))}.axp-spreadsheet .__table-wrapper::-webkit-scrollbar-thumb{border-radius:.25rem;background-color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-spreadsheet .__table{min-width:100%;border-collapse:separate;--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;border-spacing:var(--tw-border-spacing-x) var(--tw-border-spacing-y)}.axp-spreadsheet .__table .__thead{position:sticky;top:0;z-index:2}.axp-spreadsheet .__table .__thead .__header-row .__corner-cell{position:relative;position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);width:200px;min-width:200px;border-style:var(--tw-border-style);border-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);z-index:3}.axp-spreadsheet .__table .__thead .__header-row .__corner-cell .__corner-title{text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-spreadsheet .__table .__thead .__header-row .__corner-cell .__corner-actions{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:var(--spacing, .25rem)}@media(max-width:768px){.axp-spreadsheet .__table .__thead .__header-row .__corner-cell{width:200px;min-width:200px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}}.axp-spreadsheet .__table .__thead .__header-row .__column-header{position:sticky;top:0;width:200px;min-width:200px;border-style:var(--tw-border-style);border-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);text-align:center;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);white-space:nowrap;z-index:2}.axp-spreadsheet .__table .__thead .__header-row .__column-header.__column-header--empty{width:300px;min-width:300px;white-space:normal}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content{display:flex;flex-direction:column;gap:var(--spacing, .25rem)}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content .__header-title{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content .__header-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);overflow-wrap:break-word;white-space:normal;opacity:75%}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-actions{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:var(--spacing, .25rem)}@media(max-width:768px){.axp-spreadsheet .__table .__thead .__header-row .__column-header{width:120px;min-width:120px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content .__header-title,.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content .__header-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}}.axp-spreadsheet .__table .__tbody .__row.__row--empty .__row-header{text-align:center}.axp-spreadsheet .__table .__tbody .__row .__row-header{position:relative;position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);width:200px;min-width:200px;border-style:var(--tw-border-style);border-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);vertical-align:top;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);z-index:2}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content{display:flex;flex-direction:column;gap:var(--spacing, .25rem)}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content .__header-title{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content .__header-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);opacity:75%}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-actions{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:var(--spacing, .25rem)}@media(max-width:768px){.axp-spreadsheet .__table .__tbody .__row .__row-header{width:200px;min-width:200px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content .__header-title,.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content .__header-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}}.axp-spreadsheet .__table .__tbody .__row .__cell{position:relative;min-height:40px;width:200px;min-width:200px;cursor:pointer;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);text-align:center;vertical-align:middle}.axp-spreadsheet .__table .__tbody .__row .__cell:before{content:\"\";pointer-events:none;position:absolute;inset:0;background-color:color-mix(in srgb,#000 5%,transparent);opacity:0%;transition-property:opacity;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s;--tw-ease: var(--ease-in-out, cubic-bezier(.4, 0, .2, 1));transition-timing-function:var(--ease-in-out, cubic-bezier(.4, 0, .2, 1))}@supports (color: color-mix(in lab,red,red)){.axp-spreadsheet .__table .__tbody .__row .__cell:before{background-color:color-mix(in oklab,var(--color-black, #000) 5%,transparent)}}.axp-spreadsheet .__table .__tbody .__row .__cell:hover:not(.__cell--readonly):not(.__cell--editing):before{opacity:100%}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--readonly{cursor:default}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--readonly:hover:before{opacity:0%}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--empty{cursor:default}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--empty:hover:before{opacity:0%}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--editing{position:relative;border-style:var(--tw-border-style);border-width:2px;border-color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface));padding:1px}@supports (color: color-mix(in lab,red,red)){.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--editing{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--editing .__cell-editor{width:100%;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--editing .__cell-toolbar{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 0);bottom:-35px;display:flex;gap:calc(var(--spacing, .25rem) * .5);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding:var(--spacing, .25rem);white-space:nowrap;--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);z-index:100}.axp-spreadsheet .__table .__tbody .__row .__cell .__cell-value{display:flex;min-height:calc(var(--spacing, .25rem) * 5);align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * .5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));overflow-wrap:break-word}.axp-spreadsheet .__table .__tbody .__row .__cell .__cell-placeholder{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-spreadsheet .__table .__tbody .__row .__cell .__cell-editor{display:flex;width:100%;align-items:center;justify-content:center}@media(max-width:768px){.axp-spreadsheet .__table .__tbody .__row .__cell{width:120px;min-width:120px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}.axp-spreadsheet .__table .__tbody .__row .__cell .__cell-value{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-border-spacing-x{syntax: \"<length>\"; inherits: false; initial-value: 0;}@property --tw-border-spacing-y{syntax: \"<length>\"; inherits: false; initial-value: 0;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-ease{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-duration: initial;--tw-ease: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$2.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: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { 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", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
8955
8658
  }
8956
8659
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSpreadsheetComponent, decorators: [{
8957
8660
  type: Component,
@@ -8964,7 +8667,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
8964
8667
  AXPWidgetCoreModule,
8965
8668
  ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
8966
8669
  class: 'axp-spreadsheet',
8967
- }, template: "<!--\n #region ---- Spreadsheet Component Template ----\n-->\n<div class=\"__spreadsheet-container\" (click)=\"handleClickOutside($event)\">\n @if (isColumnsEmpty()) {\n <!-- Empty State: Columns are empty (regardless of rows) -->\n <div class=\"__empty-state\">\n <div class=\"__empty-icon\">\n <i class=\"fa-light fa-table-columns\"></i>\n </div>\n <div class=\"__empty-title\">\n {{ '@general:state-message.empty-columns.title' | translate | async }}\n </div>\n <div class=\"__empty-description\">\n {{\n '@general:state-message.empty-columns.description' | translate | async\n }}\n </div>\n </div>\n } @else if (isEmpty()) {\n <!-- Empty State: Both columns and rows are empty -->\n <div class=\"__empty-state\">\n <div class=\"__empty-icon\">\n <i class=\"fa-light fa-table\"></i>\n </div>\n <div class=\"__empty-title\">\n {{ '@general:state-message.empty.title' | translate | async }}\n </div>\n <div class=\"__empty-description\">\n {{ '@general:state-message.empty.description' | translate | async }}\n </div>\n </div>\n } @else if (isRowsEmpty()) {\n <!-- Empty State: Only rows are empty - Show columns -->\n <div class=\"__table-wrapper\">\n <table class=\"__table\">\n <!-- Header Row -->\n <thead class=\"__thead\">\n <tr class=\"__header-row\">\n <!-- Corner cell (title) -->\n <th class=\"__corner-cell\">\n @if (title()) {\n <div class=\"__corner-title\">\n {{ title() | translate | async }}\n </div>\n }\n @if (rowMode() === 'dynamic' && allowAddRows() && !readonly()) {\n <div class=\"__corner-actions\">\n <ax-button\n look=\"blank\"\n color=\"primary\"\n (onClick)=\"handleAddRow()\"\n [attr.aria-label]=\"'Add Row'\"\n >\n <ax-icon icon=\"far fa-plus\"></ax-icon>\n </ax-button>\n </div>\n }\n </th>\n\n <!-- Column headers -->\n @for (column of columns(); track column.name) {\n <th class=\"__column-header\" [style.width]=\"column.width\">\n <div class=\"__header-content\">\n <div class=\"__header-title\">\n {{ column.title | translate | async }}\n </div>\n </div>\n </th>\n }\n </tr>\n </thead>\n\n <!-- Empty State Row -->\n <tbody class=\"__tbody\">\n <tr class=\"__row __row--empty\">\n <td class=\"__row-header\" [attr.colspan]=\"columns().length + 1\">\n <div class=\"__empty-state-inline\">\n <div class=\"__empty-icon\">\n <i class=\"fa-light fa-list\"></i>\n </div>\n <div class=\"__empty-title\">\n {{\n '@general:state-message.empty-rows.title'\n | translate\n | async\n }}\n </div>\n <div class=\"__empty-description\">\n {{\n '@general:state-message.empty-rows.description'\n | translate\n | async\n }}\n </div>\n </div>\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n } @else {\n <!-- Full Spreadsheet: Both columns and rows are available -->\n <div class=\"__table-wrapper\">\n <table class=\"__table\">\n <!-- Header Row -->\n <thead class=\"__thead\">\n <tr class=\"__header-row\">\n <!-- Corner cell (title) -->\n <th class=\"__corner-cell\">\n @if (title()) {\n <div class=\"__corner-title\">\n {{ title() | translate | async }}\n </div>\n }\n @if (rowMode() === 'dynamic' && allowAddRows() && !readonly()) {\n <div class=\"__corner-actions\">\n <ax-button\n look=\"blank\"\n color=\"primary\"\n (onClick)=\"handleAddRow()\"\n [attr.aria-label]=\"'Add Row'\"\n >\n <ax-icon icon=\"far fa-plus\"></ax-icon>\n </ax-button>\n </div>\n }\n </th>\n\n <!-- Column headers -->\n @for (column of columns(); track column.name) {\n <th class=\"__column-header\" [style.width]=\"column.width\">\n <div class=\"__header-content\">\n <div class=\"__header-title\">\n {{ column.title | translate | async }}\n </div>\n </div>\n </th>\n }\n </tr>\n </thead>\n\n <!-- Body Rows -->\n <tbody class=\"__tbody\">\n <axp-widgets-container\n [context]=\"spreadsheetContext()\"\n (onContextChanged)=\"handleSpreadsheetContextChange($event)\"\n >\n @for (\n rowItem of rowsWithIds();\n track rowItem.rowId;\n let rowIndex = $index\n ) {\n <tr class=\"__row\" [class.__row--odd]=\"rowIndex % 2 === 1\">\n <!-- Row header -->\n <td class=\"__row-header\">\n <div class=\"__header-content\">\n @if (rowTitlePath()) {\n <div class=\"__header-title\">\n {{ getRowTitle(rowItem.row, rowTitlePath()!) }}\n </div>\n }\n @if (rowDescriptionPath()) {\n <div class=\"__header-description\">\n {{\n getRowDescription(rowItem.row, rowDescriptionPath()!)\n }}\n </div>\n }\n </div>\n @if (allowRemoveRows() && !readonly()) {\n <div\n class=\"__header-actions ax-sm opacity-30 hover:opacity-100\"\n >\n <ax-button\n look=\"blank\"\n color=\"danger\"\n (onClick)=\"handleRemoveRow(rowItem.rowId, $event)\"\n [attr.aria-label]=\"'Remove Row'\"\n >\n <ax-icon icon=\"far fa-times\"></ax-icon>\n </ax-button>\n </div>\n }\n </td>\n\n <!-- Spreadsheet cells -->\n @for (column of columns(); track column.name) {\n <td\n class=\"__cell\"\n [class.__cell--editing]=\"\n isCellEditing(rowItem.rowId, column.name)\n \"\n [class.__cell--readonly]=\"isColumnReadonly(column)\"\n (click)=\"\n $event.stopPropagation();\n handleCellClick(rowItem.rowId, column.name, $event)\n \"\n >\n @if (\n isCellEditing(rowItem.rowId, column.name) &&\n !isColumnReadonly(column)\n ) {\n <!-- Edit mode: Show widget in edit mode -->\n <div\n class=\"__cell-editor\"\n (blur)=\"handleCellBlur(rowItem.rowId, column.name)\"\n tabindex=\"-1\"\n >\n <ng-container\n axp-widget-renderer\n [node]=\"getCellWidgetNode(column, rowIndex)\"\n [mode]=\"'edit'\"\n ></ng-container>\n </div>\n <!-- Floating toolbar for commit/cancel -->\n <div\n class=\"__cell-toolbar ax-sm\"\n (click)=\"$event.stopPropagation()\"\n (mousedown)=\"\n $event.preventDefault(); $event.stopPropagation()\n \"\n (mouseup)=\"$event.stopPropagation()\"\n (focusin)=\"$event.stopPropagation()\"\n >\n <ax-button\n look=\"blank\"\n color=\"success\"\n (onClick)=\"commitCellEdit()\"\n [attr.aria-label]=\"'Commit'\"\n >\n <ax-icon icon=\"far fa-check\"></ax-icon>\n </ax-button>\n <ax-button\n look=\"blank\"\n color=\"danger\"\n (onClick)=\"cancelCellEdit()\"\n [attr.aria-label]=\"'Cancel'\"\n >\n <ax-icon icon=\"far fa-times\"></ax-icon>\n </ax-button>\n </div>\n } @else {\n <!-- View mode: Show widget in view mode or placeholder -->\n <div class=\"__cell-value\">\n @if (\n getCellValue(rowIndex, column.name) !== null &&\n getCellValue(rowIndex, column.name) !== undefined\n ) {\n <ng-container\n axp-widget-renderer\n [node]=\"getCellWidgetNode(column, rowIndex)\"\n [mode]=\"'view'\"\n ></ng-container>\n } @else {\n <span class=\"__cell-placeholder\">{{\n emptyCellPlaceholder()\n }}</span>\n }\n </div>\n }\n </td>\n }\n </tr>\n }\n </axp-widgets-container>\n </tbody>\n </table>\n </div>\n }\n</div>\n<!--\n #endregion\n-->\n", styles: ["@layer properties;.axp-spreadsheet{display:flex;height:100%;width:100%;flex-direction:column}.axp-spreadsheet .__spreadsheet-container{position:relative;flex:1;overflow:hidden;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest)}.axp-spreadsheet .__empty-state{display:flex;min-height:200px;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 8);text-align:center}.axp-spreadsheet .__empty-state .__empty-icon{margin-bottom:calc(var(--spacing, .25rem) * 4)}.axp-spreadsheet .__empty-state .__empty-icon i{font-size:var(--text-4xl, 2.25rem);line-height:var(--tw-leading, var(--text-4xl--line-height, calc(2.5 / 2.25)));color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-spreadsheet .__empty-state .__empty-title{margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:var(--color-neutral-800, oklch(26.9% 0 0))}.axp-spreadsheet .__empty-state .__empty-description{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-spreadsheet .__empty-state-inline{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 6);text-align:center}.axp-spreadsheet .__empty-state-inline .__empty-icon{margin-bottom:calc(var(--spacing, .25rem) * 3)}.axp-spreadsheet .__empty-state-inline .__empty-icon i{font-size:var(--text-2xl, 1.5rem);line-height:var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-spreadsheet .__empty-state-inline .__empty-title{margin-bottom:var(--spacing, .25rem);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:var(--color-neutral-800, oklch(26.9% 0 0))}.axp-spreadsheet .__empty-state-inline .__empty-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-spreadsheet .__table-wrapper{height:100%;width:100%;overflow-x:auto;overflow-y:auto;-webkit-overflow-scrolling:touch}.axp-spreadsheet .__table-wrapper::-webkit-scrollbar{height:8px;width:8px}.axp-spreadsheet .__table-wrapper::-webkit-scrollbar-track{background-color:var(--color-neutral-100, oklch(97% 0 0))}.axp-spreadsheet .__table-wrapper::-webkit-scrollbar-thumb{border-radius:.25rem;background-color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-spreadsheet .__table-wrapper::-webkit-scrollbar-thumb:hover{background-color:var(--color-neutral-500, oklch(55.6% 0 0))}.axp-spreadsheet .__table{min-width:100%;border-collapse:separate;--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;border-spacing:var(--tw-border-spacing-x) var(--tw-border-spacing-y)}.axp-spreadsheet .__table .__thead{position:sticky;top:0;z-index:2}.axp-spreadsheet .__table .__thead .__header-row .__corner-cell{position:relative;position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);width:200px;min-width:200px;border-style:var(--tw-border-style);border-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);z-index:3}.axp-spreadsheet .__table .__thead .__header-row .__corner-cell .__corner-title{text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-spreadsheet .__table .__thead .__header-row .__corner-cell .__corner-actions{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:var(--spacing, .25rem)}@media(max-width:768px){.axp-spreadsheet .__table .__thead .__header-row .__corner-cell{width:200px;min-width:200px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}}.axp-spreadsheet .__table .__thead .__header-row .__column-header{position:sticky;top:0;width:200px;min-width:200px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);text-align:center;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);white-space:nowrap;z-index:2}.axp-spreadsheet .__table .__thead .__header-row .__column-header.__column-header--empty{width:300px;min-width:300px;white-space:normal}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content{display:flex;flex-direction:column;gap:var(--spacing, .25rem)}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content .__header-title{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content .__header-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);overflow-wrap:break-word;white-space:normal;opacity:75%}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-actions{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:var(--spacing, .25rem)}@media(max-width:768px){.axp-spreadsheet .__table .__thead .__header-row .__column-header{width:120px;min-width:120px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content .__header-title,.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content .__header-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}}.axp-spreadsheet .__table .__tbody .__row.__row--empty .__row-header{text-align:center}.axp-spreadsheet .__table .__tbody .__row .__row-header{position:relative;position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);width:200px;min-width:200px;border-style:var(--tw-border-style);border-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);vertical-align:top;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);z-index:2}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-actions{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:var(--spacing, .25rem)}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content{display:flex;flex-direction:column;gap:var(--spacing, .25rem)}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content .__header-title{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content .__header-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);opacity:75%}@media(max-width:768px){.axp-spreadsheet .__table .__tbody .__row .__row-header{width:200px;min-width:200px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content .__header-title,.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content .__header-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}}.axp-spreadsheet .__table .__tbody .__row .__cell{position:relative;min-height:40px;width:200px;min-width:200px;cursor:pointer;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);text-align:center;vertical-align:middle}.axp-spreadsheet .__table .__tbody .__row .__cell:before{content:\"\";pointer-events:none;position:absolute;inset:0;background-color:color-mix(in srgb,#000 5%,transparent);opacity:0%;transition-property:opacity;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s;--tw-ease: var(--ease-in-out, cubic-bezier(.4, 0, .2, 1));transition-timing-function:var(--ease-in-out, cubic-bezier(.4, 0, .2, 1))}@supports (color: color-mix(in lab,red,red)){.axp-spreadsheet .__table .__tbody .__row .__cell:before{background-color:color-mix(in oklab,var(--color-black, #000) 5%,transparent)}}.axp-spreadsheet .__table .__tbody .__row .__cell:hover:not(.__cell--readonly):not(.__cell--editing):before{opacity:100%}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--readonly{cursor:default}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--readonly:hover:before{opacity:0%}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--empty{cursor:default}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--empty:hover:before{opacity:0%}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--editing{position:relative;border-style:var(--tw-border-style);border-width:2px;border-color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface));padding:1px}@supports (color: color-mix(in lab,red,red)){.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--editing{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--editing .__cell-editor{width:100%;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--editing .__cell-toolbar{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 0);bottom:-35px;display:flex;gap:calc(var(--spacing, .25rem) * .5);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding:var(--spacing, .25rem);white-space:nowrap;--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);z-index:100}.axp-spreadsheet .__table .__tbody .__row .__cell .__cell-value{display:flex;min-height:calc(var(--spacing, .25rem) * 5);align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * .5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));overflow-wrap:break-word}.axp-spreadsheet .__table .__tbody .__row .__cell .__cell-placeholder{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-spreadsheet .__table .__tbody .__row .__cell .__cell-editor{display:flex;width:100%;align-items:center;justify-content:center}@media(max-width:768px){.axp-spreadsheet .__table .__tbody .__row .__cell{width:120px;min-width:120px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}.axp-spreadsheet .__table .__tbody .__row .__cell .__cell-value{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-border-spacing-x{syntax: \"<length>\"; inherits: false; initial-value: 0;}@property --tw-border-spacing-y{syntax: \"<length>\"; inherits: false; initial-value: 0;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-ease{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-duration: initial;--tw-ease: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
8670
+ }, template: "<!--\n #region ---- Spreadsheet Component Template ----\n-->\n<div class=\"__spreadsheet-container\" (click)=\"handleClickOutside($event)\">\n @if (isColumnsEmpty()) {\n <!-- Empty State: Columns are empty (regardless of rows) -->\n <div class=\"__empty-state\">\n <div class=\"__empty-icon\">\n <i class=\"fa-light fa-table-columns\"></i>\n </div>\n <div class=\"__empty-title\">\n {{ '@general:state-message.empty-columns.title' | translate | async }}\n </div>\n <div class=\"__empty-description\">\n {{\n '@general:state-message.empty-columns.description' | translate | async\n }}\n </div>\n </div>\n } @else if (isEmpty()) {\n <!-- Empty State: Both columns and rows are empty -->\n <div class=\"__empty-state\">\n <div class=\"__empty-icon\">\n <i class=\"fa-light fa-table\"></i>\n </div>\n <div class=\"__empty-title\">\n {{ '@general:state-message.empty.title' | translate | async }}\n </div>\n <div class=\"__empty-description\">\n {{ '@general:state-message.empty.description' | translate | async }}\n </div>\n </div>\n } @else if (isRowsEmpty()) {\n <!-- Empty State: Only rows are empty - Show columns -->\n <div class=\"__table-wrapper\">\n <table class=\"__table\">\n <!-- Header Row -->\n <thead class=\"__thead\">\n <tr class=\"__header-row\">\n <!-- Corner cell (title) -->\n <th class=\"__corner-cell\">\n @if (title()) {\n <div class=\"__corner-title\">\n {{ title() | translate | async }}\n </div>\n }\n @if (rowMode() === 'dynamic' && allowAddRows() && !readonly()) {\n <div class=\"__corner-actions\">\n <ax-button\n look=\"blank\"\n color=\"primary\"\n (onClick)=\"handleAddRow()\"\n [attr.aria-label]=\"'Add Row'\"\n >\n <ax-icon icon=\"far fa-plus\"></ax-icon>\n </ax-button>\n </div>\n }\n </th>\n\n <!-- Column headers -->\n @for (column of columns(); track column.name) {\n <th class=\"__column-header\" [style.width]=\"column.width\">\n <div class=\"__header-content\">\n <div class=\"__header-title\">\n {{ column.title | translate | async }}\n </div>\n </div>\n </th>\n }\n </tr>\n </thead>\n\n <!-- Empty State Row -->\n <tbody class=\"__tbody\">\n <tr class=\"__row __row--empty\">\n <td class=\"__row-header\" [attr.colspan]=\"columns().length + 1\">\n <div class=\"__empty-state-inline\">\n <div class=\"__empty-icon\">\n <i class=\"fa-light fa-list\"></i>\n </div>\n <div class=\"__empty-title\">\n {{\n '@general:state-message.empty-rows.title'\n | translate\n | async\n }}\n </div>\n <div class=\"__empty-description\">\n {{\n '@general:state-message.empty-rows.description'\n | translate\n | async\n }}\n </div>\n </div>\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n } @else {\n <!-- Full Spreadsheet: Both columns and rows are available -->\n <div class=\"__table-wrapper\">\n <table class=\"__table\">\n <!-- Header Row -->\n <thead class=\"__thead\">\n <tr class=\"__header-row\">\n <!-- Corner cell (title) -->\n <th class=\"__corner-cell\">\n @if (title()) {\n <div class=\"__corner-title\">\n {{ title() | translate | async }}\n </div>\n }\n @if (rowMode() === 'dynamic' && allowAddRows() && !readonly()) {\n <div class=\"__corner-actions\">\n <ax-button\n look=\"blank\"\n color=\"primary\"\n (onClick)=\"handleAddRow()\"\n [attr.aria-label]=\"'Add Row'\"\n >\n <ax-icon icon=\"far fa-plus\"></ax-icon>\n </ax-button>\n </div>\n }\n </th>\n\n <!-- Column headers -->\n @for (column of columns(); track column.name) {\n <th class=\"__column-header\" [style.width]=\"column.width\">\n <div class=\"__header-content\">\n <div class=\"__header-title\">\n {{ column.title | translate | async }}\n </div>\n </div>\n </th>\n }\n </tr>\n </thead>\n\n <!-- Body Rows -->\n <tbody class=\"__tbody\">\n <axp-widgets-container\n [context]=\"spreadsheetContext()\"\n (onContextChanged)=\"handleSpreadsheetContextChange($event)\"\n >\n @for (\n rowItem of rowsWithIds();\n track rowItem.rowId;\n let rowIndex = $index\n ) {\n <tr class=\"__row\" [class.__row--odd]=\"rowIndex % 2 === 1\">\n <!-- Row header -->\n <td class=\"__row-header\">\n <div class=\"__header-content\">\n @if (rowTitlePath()) {\n <div class=\"__header-title\">\n {{ getRowTitle(rowItem.row, rowTitlePath()!) }}\n </div>\n }\n @if (rowDescriptionPath()) {\n <div class=\"__header-description\">\n {{\n getRowDescription(rowItem.row, rowDescriptionPath()!)\n }}\n </div>\n }\n </div>\n @if (allowRemoveRows() && !readonly()) {\n <div\n class=\"__header-actions ax-sm opacity-30 hover:opacity-100\"\n >\n <ax-button\n look=\"blank\"\n color=\"danger\"\n (onClick)=\"handleRemoveRow(rowItem.rowId, $event)\"\n [attr.aria-label]=\"'Remove Row'\"\n >\n <ax-icon icon=\"far fa-times\"></ax-icon>\n </ax-button>\n </div>\n }\n </td>\n\n <!-- Spreadsheet cells -->\n @for (column of columns(); track column.name) {\n <td\n class=\"__cell\"\n [class.__cell--editing]=\"\n isCellEditing(rowItem.rowId, column.name)\n \"\n [class.__cell--readonly]=\"isColumnReadonly(column)\"\n (click)=\"\n $event.stopPropagation();\n handleCellClick(rowItem.rowId, column.name, $event)\n \"\n >\n @if (\n isCellEditing(rowItem.rowId, column.name) &&\n !isColumnReadonly(column)\n ) {\n <!-- Edit mode: Show widget in edit mode -->\n <div\n class=\"__cell-editor\"\n (blur)=\"handleCellBlur(rowItem.rowId, column.name)\"\n tabindex=\"-1\"\n >\n <ng-container\n axp-widget-renderer\n [node]=\"getCellWidgetNode(column, rowIndex)\"\n [mode]=\"'edit'\"\n ></ng-container>\n </div>\n <!-- Floating toolbar for commit/cancel -->\n <div\n class=\"__cell-toolbar ax-sm\"\n (click)=\"$event.stopPropagation()\"\n (mousedown)=\"\n $event.preventDefault(); $event.stopPropagation()\n \"\n (mouseup)=\"$event.stopPropagation()\"\n (focusin)=\"$event.stopPropagation()\"\n >\n <ax-button\n look=\"blank\"\n color=\"success\"\n (onClick)=\"commitCellEdit()\"\n [attr.aria-label]=\"'Commit'\"\n >\n <ax-icon icon=\"far fa-check\"></ax-icon>\n </ax-button>\n <ax-button\n look=\"blank\"\n color=\"danger\"\n (onClick)=\"cancelCellEdit()\"\n [attr.aria-label]=\"'Cancel'\"\n >\n <ax-icon icon=\"far fa-times\"></ax-icon>\n </ax-button>\n </div>\n } @else {\n <!-- View mode: Show widget in view mode or placeholder -->\n <div class=\"__cell-value\">\n @if (\n getCellValue(rowIndex, column.name) !== null &&\n getCellValue(rowIndex, column.name) !== undefined\n ) {\n <ng-container\n axp-widget-renderer\n [node]=\"getCellWidgetNode(column, rowIndex)\"\n [mode]=\"'view'\"\n ></ng-container>\n } @else {\n <span class=\"__cell-placeholder\">{{\n emptyCellPlaceholder()\n }}</span>\n }\n </div>\n }\n </td>\n }\n </tr>\n }\n </axp-widgets-container>\n </tbody>\n </table>\n </div>\n }\n</div>\n<!--\n #endregion\n-->\n", styles: ["@layer properties;.axp-spreadsheet{display:flex;height:100%;width:100%;flex-direction:column}.axp-spreadsheet .__spreadsheet-container{position:relative;flex:1;overflow:hidden;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest)}.axp-spreadsheet .__empty-state{display:flex;min-height:200px;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 8);text-align:center}.axp-spreadsheet .__empty-state .__empty-icon{margin-bottom:calc(var(--spacing, .25rem) * 4)}.axp-spreadsheet .__empty-state .__empty-icon i{font-size:var(--text-4xl, 2.25rem);line-height:var(--tw-leading, var(--text-4xl--line-height, calc(2.5 / 2.25)));color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-spreadsheet .__empty-state .__empty-title{margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:var(--color-neutral-800, oklch(26.9% 0 0))}.axp-spreadsheet .__empty-state .__empty-description{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-spreadsheet .__empty-state-inline{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 6);text-align:center}.axp-spreadsheet .__empty-state-inline .__empty-icon{margin-bottom:calc(var(--spacing, .25rem) * 3)}.axp-spreadsheet .__empty-state-inline .__empty-icon i{font-size:var(--text-2xl, 1.5rem);line-height:var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-spreadsheet .__empty-state-inline .__empty-title{margin-bottom:var(--spacing, .25rem);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:var(--color-neutral-800, oklch(26.9% 0 0))}.axp-spreadsheet .__empty-state-inline .__empty-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-600, oklch(43.9% 0 0))}.axp-spreadsheet .__table-wrapper{height:100%;width:100%;overflow-x:auto;overflow-y:auto;-webkit-overflow-scrolling:touch}.axp-spreadsheet .__table-wrapper::-webkit-scrollbar{height:8px;width:8px}.axp-spreadsheet .__table-wrapper::-webkit-scrollbar-track{background-color:var(--color-neutral-100, oklch(97% 0 0))}.axp-spreadsheet .__table-wrapper::-webkit-scrollbar-thumb{border-radius:.25rem;background-color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-spreadsheet .__table{min-width:100%;border-collapse:separate;--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;border-spacing:var(--tw-border-spacing-x) var(--tw-border-spacing-y)}.axp-spreadsheet .__table .__thead{position:sticky;top:0;z-index:2}.axp-spreadsheet .__table .__thead .__header-row .__corner-cell{position:relative;position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);width:200px;min-width:200px;border-style:var(--tw-border-style);border-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);z-index:3}.axp-spreadsheet .__table .__thead .__header-row .__corner-cell .__corner-title{text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-spreadsheet .__table .__thead .__header-row .__corner-cell .__corner-actions{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:var(--spacing, .25rem)}@media(max-width:768px){.axp-spreadsheet .__table .__thead .__header-row .__corner-cell{width:200px;min-width:200px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}}.axp-spreadsheet .__table .__thead .__header-row .__column-header{position:sticky;top:0;width:200px;min-width:200px;border-style:var(--tw-border-style);border-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);text-align:center;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);white-space:nowrap;z-index:2}.axp-spreadsheet .__table .__thead .__header-row .__column-header.__column-header--empty{width:300px;min-width:300px;white-space:normal}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content{display:flex;flex-direction:column;gap:var(--spacing, .25rem)}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content .__header-title{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content .__header-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);overflow-wrap:break-word;white-space:normal;opacity:75%}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-actions{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:var(--spacing, .25rem)}@media(max-width:768px){.axp-spreadsheet .__table .__thead .__header-row .__column-header{width:120px;min-width:120px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content .__header-title,.axp-spreadsheet .__table .__thead .__header-row .__column-header .__header-content .__header-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}}.axp-spreadsheet .__table .__tbody .__row.__row--empty .__row-header{text-align:center}.axp-spreadsheet .__table .__tbody .__row .__row-header{position:relative;position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);width:200px;min-width:200px;border-style:var(--tw-border-style);border-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);vertical-align:top;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);z-index:2}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content{display:flex;flex-direction:column;gap:var(--spacing, .25rem)}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content .__header-title{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content .__header-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);opacity:75%}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-actions{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:var(--spacing, .25rem)}@media(max-width:768px){.axp-spreadsheet .__table .__tbody .__row .__row-header{width:200px;min-width:200px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content .__header-title,.axp-spreadsheet .__table .__tbody .__row .__row-header .__header-content .__header-description{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}}.axp-spreadsheet .__table .__tbody .__row .__cell{position:relative;min-height:40px;width:200px;min-width:200px;cursor:pointer;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);text-align:center;vertical-align:middle}.axp-spreadsheet .__table .__tbody .__row .__cell:before{content:\"\";pointer-events:none;position:absolute;inset:0;background-color:color-mix(in srgb,#000 5%,transparent);opacity:0%;transition-property:opacity;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s;--tw-ease: var(--ease-in-out, cubic-bezier(.4, 0, .2, 1));transition-timing-function:var(--ease-in-out, cubic-bezier(.4, 0, .2, 1))}@supports (color: color-mix(in lab,red,red)){.axp-spreadsheet .__table .__tbody .__row .__cell:before{background-color:color-mix(in oklab,var(--color-black, #000) 5%,transparent)}}.axp-spreadsheet .__table .__tbody .__row .__cell:hover:not(.__cell--readonly):not(.__cell--editing):before{opacity:100%}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--readonly{cursor:default}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--readonly:hover:before{opacity:0%}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--empty{cursor:default}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--empty:hover:before{opacity:0%}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--editing{position:relative;border-style:var(--tw-border-style);border-width:2px;border-color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface));padding:1px}@supports (color: color-mix(in lab,red,red)){.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--editing{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--editing .__cell-editor{width:100%;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.axp-spreadsheet .__table .__tbody .__row .__cell.__cell--editing .__cell-toolbar{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 0);bottom:-35px;display:flex;gap:calc(var(--spacing, .25rem) * .5);border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding:var(--spacing, .25rem);white-space:nowrap;--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);z-index:100}.axp-spreadsheet .__table .__tbody .__row .__cell .__cell-value{display:flex;min-height:calc(var(--spacing, .25rem) * 5);align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * .5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));overflow-wrap:break-word}.axp-spreadsheet .__table .__tbody .__row .__cell .__cell-placeholder{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--color-neutral-400, oklch(70.8% 0 0))}.axp-spreadsheet .__table .__tbody .__row .__cell .__cell-editor{display:flex;width:100%;align-items:center;justify-content:center}@media(max-width:768px){.axp-spreadsheet .__table .__tbody .__row .__cell{width:120px;min-width:120px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}.axp-spreadsheet .__table .__tbody .__row .__cell .__cell-value{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-border-spacing-x{syntax: \"<length>\"; inherits: false; initial-value: 0;}@property --tw-border-spacing-y{syntax: \"<length>\"; inherits: false; initial-value: 0;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-ease{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-duration: initial;--tw-ease: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
8968
8671
  }], ctorParameters: () => [], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], rowMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowMode", required: false }] }], rowsInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowsInput", required: false }] }], rowsModel: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowsModel", required: false }] }, { type: i0.Output, args: ["rowsModelChange"] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], emptyCellPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyCellPlaceholder", required: false }] }], rowTitlePath: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowTitlePath", required: false }] }], rowDescriptionPath: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowDescriptionPath", required: false }] }], allowAddRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowAddRows", required: false }] }], allowRemoveRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowRemoveRows", required: false }] }], cellChange: [{ type: i0.Output, args: ["cellChange"] }], rowChange: [{ type: i0.Output, args: ["rowChange"] }], spreadsheetChange: [{ type: i0.Output, args: ["spreadsheetChange"] }] } });
8969
8672
 
8970
8673
  //#endregion
@@ -10040,7 +9743,7 @@ class AXPTemplateViewerComponent extends AXBasePageComponent {
10040
9743
  </ax-suffix>
10041
9744
  </ax-footer>
10042
9745
  }
10043
- `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { 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", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.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: AXButtonModule }, { kind: "component", type: i1$2.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: AXFormModule }, { kind: "component", type: i2$4.AXFormComponent, selector: "ax-form", inputs: ["disabled", "readonly", "labelMode", "look", "messageStyle", "updateOn", "inUserInteractionActive"], outputs: ["onValidate", "updateOnChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
9746
+ `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { 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", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.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: AXButtonModule }, { kind: "component", type: i1$2.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: AXFormModule }, { kind: "component", type: i2$5.AXFormComponent, selector: "ax-form", inputs: ["disabled", "readonly", "labelMode", "look", "messageStyle", "updateOn", "inUserInteractionActive"], outputs: ["onValidate", "updateOnChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
10044
9747
  }
10045
9748
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPTemplateViewerComponent, decorators: [{
10046
9749
  type: Component,
@@ -10121,6 +9824,236 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
10121
9824
  }]
10122
9825
  }] });
10123
9826
 
9827
+ const AXP_USER_AVATAR_PROVIDER = new InjectionToken('AXP_USER_AVATAR_PROVIDER');
9828
+
9829
+ class AXPUserAvatarService {
9830
+ constructor() {
9831
+ this.provider = inject(AXP_USER_AVATAR_PROVIDER, { optional: true });
9832
+ // Cache configuration
9833
+ this.cacheExpiryTime = 5 * 60 * 1000; // 5 minutes in milliseconds
9834
+ this.refreshInterval = 3 * 60 * 1000; // 3 minutes in milliseconds
9835
+ // Cache storage
9836
+ this.cache = new Map();
9837
+ }
9838
+ /**
9839
+ * Gets user information with caching and auto-refresh
9840
+ * @param userId The username to fetch information for
9841
+ * @returns Observable that emits user avatar data
9842
+ */
9843
+ getUserInfo$(userId) {
9844
+ // Check if we have a cached entry
9845
+ if (!this.cache.has(userId) || this.isExpired(userId)) {
9846
+ // Create a new cache entry with default values
9847
+ const defaultData = {
9848
+ id: userId,
9849
+ status: 'offline',
9850
+ username: '',
9851
+ firstName: '',
9852
+ lastName: ''
9853
+ };
9854
+ const subject = new BehaviorSubject(defaultData);
9855
+ this.cache.set(userId, {
9856
+ data: defaultData,
9857
+ timestamp: Date.now(),
9858
+ subject
9859
+ });
9860
+ // Fetch fresh data immediately
9861
+ this.fetchAndUpdateCache(userId);
9862
+ // Set up auto refresh
9863
+ timer(this.refreshInterval, this.refreshInterval)
9864
+ .pipe(tap(() => this.fetchAndUpdateCache(userId)))
9865
+ .subscribe();
9866
+ }
9867
+ return this.cache.get(userId).subject.asObservable();
9868
+ }
9869
+ /**
9870
+ * Gets user information (Promise-based for backward compatibility)
9871
+ * @param userId The username to fetch information for
9872
+ * @returns Promise that resolves to user avatar data
9873
+ */
9874
+ async getUserInfo(userId) {
9875
+ // Check if we have an unexpired cached entry
9876
+ if (this.cache.has(userId) && !this.isExpired(userId)) {
9877
+ return this.cache.get(userId).data;
9878
+ }
9879
+ // Fetch fresh data and cache it
9880
+ return this.fetchAndUpdateCache(userId);
9881
+ }
9882
+ /**
9883
+ * Clears cached data while keeping live subscribers attached to their subjects.
9884
+ */
9885
+ clearCache(userId) {
9886
+ if (userId) {
9887
+ const entry = this.cache.get(userId);
9888
+ if (entry) {
9889
+ entry.timestamp = 0;
9890
+ }
9891
+ return;
9892
+ }
9893
+ for (const entry of this.cache.values()) {
9894
+ entry.timestamp = 0;
9895
+ }
9896
+ }
9897
+ /**
9898
+ * Force refresh data for a specific username
9899
+ * @param userId The username to refresh
9900
+ * @returns Promise that resolves to the refreshed data
9901
+ */
9902
+ async refreshUserInfo(userId) {
9903
+ return this.fetchAndUpdateCache(userId);
9904
+ }
9905
+ /**
9906
+ * Checks if a cache entry is expired
9907
+ */
9908
+ isExpired(userId) {
9909
+ const entry = this.cache.get(userId);
9910
+ if (!entry)
9911
+ return true;
9912
+ return (Date.now() - entry.timestamp) > this.cacheExpiryTime;
9913
+ }
9914
+ /**
9915
+ * Fetches data from provider and updates the cache
9916
+ */
9917
+ async fetchAndUpdateCache(userId) {
9918
+ try {
9919
+ const data = await this.provider?.provide(userId);
9920
+ if (!data) {
9921
+ throw new Error(`User info not found for ${userId}`);
9922
+ }
9923
+ const entry = this.cache.get(userId);
9924
+ // Update the cache entry
9925
+ if (entry) {
9926
+ entry.data = data;
9927
+ entry.timestamp = Date.now();
9928
+ entry.subject.next(data);
9929
+ }
9930
+ else {
9931
+ // Create a new cache entry if needed
9932
+ const subject = new BehaviorSubject(data);
9933
+ this.cache.set(userId, {
9934
+ data,
9935
+ timestamp: Date.now(),
9936
+ subject
9937
+ });
9938
+ }
9939
+ return data;
9940
+ }
9941
+ catch (error) {
9942
+ console.error(`Error fetching user info for ${userId}:`, error);
9943
+ throw error;
9944
+ }
9945
+ }
9946
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPUserAvatarService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
9947
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPUserAvatarService, providedIn: 'root' }); }
9948
+ }
9949
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPUserAvatarService, decorators: [{
9950
+ type: Injectable,
9951
+ args: [{
9952
+ providedIn: 'root',
9953
+ }]
9954
+ }] });
9955
+
9956
+ class AXPUserAvatarComponent {
9957
+ constructor() {
9958
+ this.userAvatarService = inject(AXPUserAvatarService);
9959
+ this.sessionService = inject(AXPSessionService);
9960
+ this.fileStorage = inject(AXPFileStorageService);
9961
+ this.blobObjectUrl = null;
9962
+ this.resolveGeneration = 0;
9963
+ this.userInfo = signal(null, ...(ngDevMode ? [{ debugName: "userInfo" }] : /* istanbul ignore next */ []));
9964
+ this.size = input(40, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
9965
+ this.userId = input('', ...(ngDevMode ? [{ debugName: "userId" }] : /* istanbul ignore next */ []));
9966
+ this.src = signal('', ...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
9967
+ this.userName = computed(() => this.userInfo()?.username || '', ...(ngDevMode ? [{ debugName: "userName" }] : /* istanbul ignore next */ []));
9968
+ this.firstName = computed(() => this.userInfo()?.firstName?.trim() || '', ...(ngDevMode ? [{ debugName: "firstName" }] : /* istanbul ignore next */ []));
9969
+ this.lastName = computed(() => this.userInfo()?.lastName?.trim() || '', ...(ngDevMode ? [{ debugName: "lastName" }] : /* istanbul ignore next */ []));
9970
+ this.title = computed(() => this.resolveDisplayName(this.userInfo()), ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
9971
+ this.isOnline = computed(() => this.userInfo()?.status === 'online', ...(ngDevMode ? [{ debugName: "isOnline" }] : /* istanbul ignore next */ []));
9972
+ effect((onCleanup) => {
9973
+ const id = this.userId();
9974
+ if (!id) {
9975
+ this.userInfo.set(null);
9976
+ this.src.set('');
9977
+ return;
9978
+ }
9979
+ const subscriptions = [
9980
+ this.userAvatarService.getUserInfo$(id).subscribe((userData) => {
9981
+ this.userInfo.set(userData);
9982
+ void this.resolveAvatarSrc(userData, id);
9983
+ }),
9984
+ this.sessionService.user$.subscribe(() => {
9985
+ void this.resolveAvatarSrc(this.userInfo(), id);
9986
+ }),
9987
+ ];
9988
+ onCleanup(() => subscriptions.forEach((subscription) => subscription.unsubscribe()));
9989
+ });
9990
+ }
9991
+ async resolveAvatarSrc(info, userId) {
9992
+ const generation = ++this.resolveGeneration;
9993
+ const sessionUser = this.sessionService.user;
9994
+ let avatarUrl = sessionUser?.id === userId ? normalizeStoredImageRef(sessionUser.avatar) : null;
9995
+ if (!avatarUrl) {
9996
+ avatarUrl = normalizeStoredImageRef(info?.avatarUrl);
9997
+ }
9998
+ if (!avatarUrl) {
9999
+ this.revokeBlobUrl();
10000
+ this.src.set('');
10001
+ return;
10002
+ }
10003
+ if (!isStoredImageFileId(avatarUrl)) {
10004
+ if (generation !== this.resolveGeneration) {
10005
+ return;
10006
+ }
10007
+ this.revokeBlobUrl();
10008
+ this.src.set(avatarUrl);
10009
+ return;
10010
+ }
10011
+ try {
10012
+ const displayUrl = await resolveStoredImageDisplayUrl(avatarUrl, (fileId) => this.fileStorage.download(fileId));
10013
+ if (generation !== this.resolveGeneration) {
10014
+ if (displayUrl.startsWith('blob:')) {
10015
+ URL.revokeObjectURL(displayUrl);
10016
+ }
10017
+ return;
10018
+ }
10019
+ this.revokeBlobUrl();
10020
+ if (displayUrl.startsWith('blob:')) {
10021
+ this.blobObjectUrl = displayUrl;
10022
+ }
10023
+ this.src.set(displayUrl);
10024
+ }
10025
+ catch {
10026
+ if (generation !== this.resolveGeneration) {
10027
+ return;
10028
+ }
10029
+ this.revokeBlobUrl();
10030
+ this.src.set('');
10031
+ }
10032
+ }
10033
+ revokeBlobUrl() {
10034
+ if (this.blobObjectUrl) {
10035
+ URL.revokeObjectURL(this.blobObjectUrl);
10036
+ this.blobObjectUrl = null;
10037
+ }
10038
+ }
10039
+ resolveDisplayName(info) {
10040
+ if (!info) {
10041
+ return '';
10042
+ }
10043
+ const parts = [info.firstName, info.lastName].map((part) => part?.trim()).filter(Boolean);
10044
+ if (parts.length > 0) {
10045
+ return parts.join(' ');
10046
+ }
10047
+ return info.username.trim();
10048
+ }
10049
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPUserAvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
10050
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", 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: "<div\n class=\"axp-user-avatar\"\n [class.axp-user-avatar--has-image]=\"!!src()\"\n [style.width.px]=\"size()\"\n [style.height.px]=\"size()\"\n>\n @if (src()) {\n <img\n class=\"axp-user-avatar__image\"\n [src]=\"src()\"\n [attr.alt]=\"title()\"\n [attr.title]=\"title()\"\n />\n } @else {\n <axp-avatar [size]=\"size()\" [fullName]=\"title()\" />\n }\n</div>\n", styles: [".axp-user-avatar{position:relative;display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:calc(infinity * 1px)}.axp-user-avatar .axp-user-avatar__image{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.axp-user-avatar--has-image{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "component", type: AXPAvatarComponent, selector: "axp-avatar", inputs: ["size", "src", "fullName", "fallbackText", "placeholder"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
10051
+ }
10052
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPUserAvatarComponent, decorators: [{
10053
+ type: Component,
10054
+ args: [{ selector: 'axp-user-avatar', imports: [AXPAvatarComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [], template: "<div\n class=\"axp-user-avatar\"\n [class.axp-user-avatar--has-image]=\"!!src()\"\n [style.width.px]=\"size()\"\n [style.height.px]=\"size()\"\n>\n @if (src()) {\n <img\n class=\"axp-user-avatar__image\"\n [src]=\"src()\"\n [attr.alt]=\"title()\"\n [attr.title]=\"title()\"\n />\n } @else {\n <axp-avatar [size]=\"size()\" [fullName]=\"title()\" />\n }\n</div>\n", styles: [".axp-user-avatar{position:relative;display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:calc(infinity * 1px)}.axp-user-avatar .axp-user-avatar__image{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.axp-user-avatar--has-image{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
10055
+ }], ctorParameters: () => [], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], userId: [{ type: i0.Input, args: [{ isSignal: true, alias: "userId", required: false }] }] } });
10056
+
10124
10057
  //#region ---- Imports ----
10125
10058
  //#endregion
10126
10059
  //#region ---- Constants ----
@@ -10181,13 +10114,13 @@ class AXPVirtualKeypadComponent {
10181
10114
  this.keyPress.emit({ action: 'backspace' });
10182
10115
  }
10183
10116
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPVirtualKeypadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
10184
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPVirtualKeypadComponent, isStandalone: true, selector: "axp-virtual-keypad", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, showLetterHints: { classPropertyName: "showLetterHints", publicName: "showLetterHints", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { digitPress: "digitPress", backspace: "backspace", keyPress: "keyPress" }, host: { classAttribute: "axp-virtual-keypad-host" }, ngImport: i0, template: "<div\n class=\"axp-virtual-keypad\"\n role=\"group\"\n [attr.data-look]=\"look()\"\n [attr.aria-label]=\"'@general:virtual-keypad.aria-label' | translate | async\"\n>\n <div class=\"__grid\">\n @for (key of digitKeys; track key.digit) {\n <button\n type=\"button\"\n class=\"__key\"\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"key.digit\"\n (click)=\"onDigitPress(key.digit)\"\n >\n <span class=\"__digit\">{{ key.digit }}</span>\n @if (showLetterHints() && key.letters) {\n <span class=\"__letters\" aria-hidden=\"true\">{{ key.letters }}</span>\n }\n </button>\n }\n\n <span class=\"__spacer\" aria-hidden=\"true\"></span>\n\n <button\n type=\"button\"\n class=\"__key\"\n [disabled]=\"disabled()\"\n aria-label=\"0\"\n (click)=\"onDigitPress(zeroKey.digit)\"\n >\n <span class=\"__digit\">{{ zeroKey.digit }}</span>\n </button>\n\n <button\n type=\"button\"\n class=\"__key __key--action\"\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"'@general:virtual-keypad.backspace' | translate | async\"\n (click)=\"onBackspace()\"\n >\n <i class=\"fa-light fa-delete-left\" aria-hidden=\"true\"></i>\n </button>\n </div>\n</div>\n", styles: ["@layer properties;.axp-virtual-keypad-host{display:block;width:100%}.axp-virtual-keypad{--axp-keypad-key-size: 4.25rem;--axp-keypad-gap: .75rem;display:flex;width:100%;justify-content:center;-webkit-user-select:none;user-select:none}.axp-virtual-keypad .__grid{margin-inline:auto;display:grid;width:fit-content;justify-items:center;grid-template-columns:repeat(3,var(--axp-keypad-key-size));gap:var(--axp-keypad-gap)}.axp-virtual-keypad .__spacer{display:block;width:var(--axp-keypad-key-size);height:var(--axp-keypad-key-size)}.axp-virtual-keypad .__key{display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:0px;background-color:transparent;color:rgba(var(--ax-sys-color-on-lightest-surface));transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .1s;transition-duration:.1s;width:var(--axp-keypad-key-size);height:var(--axp-keypad-key-size)}.axp-virtual-keypad .__key:active:not(:disabled){transform:scale(.96)}.axp-virtual-keypad .__key:disabled{cursor:not-allowed;opacity:50%}.axp-virtual-keypad .__key:focus-visible{outline:2px solid rgb(var(--ax-sys-color-primary-600));outline-offset:2px}.axp-virtual-keypad .__digit{font-size:var(--text-3xl, 1.875rem);line-height:var(--tw-leading, var(--text-3xl--line-height, 1.2 ));--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.axp-virtual-keypad .__letters{margin-top:var(--spacing, .25rem);font-size:.6875rem;--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: .14em;letter-spacing:.14em;color:rgba(var(--ax-sys-color-on-lighter-surface));opacity:60%}.axp-virtual-keypad .__key--action{font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)))}.axp-virtual-keypad .__key--action i{font-size:var(--text-2xl, 1.5rem);line-height:var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)))}.axp-virtual-keypad[data-look=solid] .__key{background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-virtual-keypad[data-look=solid] .__key:active:not(:disabled){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-virtual-keypad[data-look=blank] .__key{--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-virtual-keypad[data-look=blank] .__key:active:not(:disabled){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-ordinal{syntax: \"*\"; inherits: false;}@property --tw-slashed-zero{syntax: \"*\"; inherits: false;}@property --tw-numeric-figure{syntax: \"*\"; inherits: false;}@property --tw-numeric-spacing{syntax: \"*\"; inherits: false;}@property --tw-numeric-fraction{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-duration: initial;--tw-leading: initial;--tw-font-weight: initial;--tw-ordinal: initial;--tw-slashed-zero: initial;--tw-numeric-figure: initial;--tw-numeric-spacing: initial;--tw-numeric-fraction: initial;--tw-tracking: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
10117
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPVirtualKeypadComponent, isStandalone: true, selector: "axp-virtual-keypad", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, showLetterHints: { classPropertyName: "showLetterHints", publicName: "showLetterHints", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { digitPress: "digitPress", backspace: "backspace", keyPress: "keyPress" }, host: { classAttribute: "axp-virtual-keypad-host" }, ngImport: i0, template: "<div\n class=\"axp-virtual-keypad\"\n role=\"group\"\n [attr.data-look]=\"look()\"\n [attr.aria-label]=\"'@general:virtual-keypad.aria-label' | translate | async\"\n>\n <div class=\"__grid\">\n @for (key of digitKeys; track key.digit) {\n <button\n type=\"button\"\n class=\"__key\"\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"key.digit\"\n (click)=\"onDigitPress(key.digit)\"\n >\n <span class=\"__digit\">{{ key.digit }}</span>\n @if (showLetterHints() && key.letters) {\n <span class=\"__letters\" aria-hidden=\"true\">{{ key.letters }}</span>\n }\n </button>\n }\n\n <span class=\"__spacer\" aria-hidden=\"true\"></span>\n\n <button\n type=\"button\"\n class=\"__key\"\n [disabled]=\"disabled()\"\n aria-label=\"0\"\n (click)=\"onDigitPress(zeroKey.digit)\"\n >\n <span class=\"__digit\">{{ zeroKey.digit }}</span>\n </button>\n\n <button\n type=\"button\"\n class=\"__key __key--action\"\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"'@general:virtual-keypad.backspace' | translate | async\"\n (click)=\"onBackspace()\"\n >\n <i class=\"fa-light fa-delete-left\" aria-hidden=\"true\"></i>\n </button>\n </div>\n</div>\n", styles: ["@layer properties;.axp-virtual-keypad-host{display:block;width:100%}.axp-virtual-keypad{--axp-keypad-key-size: 4.25rem;--axp-keypad-gap: .75rem;display:flex;width:100%;justify-content:center;-webkit-user-select:none;user-select:none}.axp-virtual-keypad .__grid{margin-inline:auto;display:grid;width:fit-content;justify-items:center;grid-template-columns:repeat(3,var(--axp-keypad-key-size));gap:var(--axp-keypad-gap)}.axp-virtual-keypad .__spacer{display:block;width:var(--axp-keypad-key-size);height:var(--axp-keypad-key-size)}.axp-virtual-keypad .__key{display:flex;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:0px;background-color:transparent;color:rgba(var(--ax-sys-color-on-lightest-surface));transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .1s;transition-duration:.1s;width:var(--axp-keypad-key-size);height:var(--axp-keypad-key-size)}.axp-virtual-keypad .__key:active:not(:disabled){transform:scale(.96)}.axp-virtual-keypad .__key:disabled{cursor:not-allowed;opacity:50%}.axp-virtual-keypad .__key:focus-visible{outline:2px solid rgb(var(--ax-sys-color-primary-600));outline-offset:2px}.axp-virtual-keypad .__digit{font-size:var(--text-3xl, 1.875rem);line-height:var(--tw-leading, var(--text-3xl--line-height, 1.2 ));--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.axp-virtual-keypad .__letters{margin-top:var(--spacing, .25rem);font-size:.6875rem;--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: .14em;letter-spacing:.14em;color:rgba(var(--ax-sys-color-on-lighter-surface));opacity:60%}.axp-virtual-keypad .__key--action{font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)))}.axp-virtual-keypad .__key--action i{font-size:var(--text-2xl, 1.5rem);line-height:var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)))}.axp-virtual-keypad[data-look=solid] .__key{background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-virtual-keypad[data-look=solid] .__key:active:not(:disabled){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-virtual-keypad[data-look=blank] .__key{--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-virtual-keypad[data-look=blank] .__key:active:not(:disabled){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-ordinal{syntax: \"*\"; inherits: false;}@property --tw-slashed-zero{syntax: \"*\"; inherits: false;}@property --tw-numeric-figure{syntax: \"*\"; inherits: false;}@property --tw-numeric-spacing{syntax: \"*\"; inherits: false;}@property --tw-numeric-fraction{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-duration: initial;--tw-leading: initial;--tw-font-weight: initial;--tw-ordinal: initial;--tw-slashed-zero: initial;--tw-numeric-figure: initial;--tw-numeric-spacing: initial;--tw-numeric-fraction: initial;--tw-tracking: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
10185
10118
  }
10186
10119
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPVirtualKeypadComponent, decorators: [{
10187
10120
  type: Component,
10188
10121
  args: [{ selector: 'axp-virtual-keypad', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXTranslationModule, AsyncPipe], host: {
10189
10122
  class: 'axp-virtual-keypad-host',
10190
- }, template: "<div\n class=\"axp-virtual-keypad\"\n role=\"group\"\n [attr.data-look]=\"look()\"\n [attr.aria-label]=\"'@general:virtual-keypad.aria-label' | translate | async\"\n>\n <div class=\"__grid\">\n @for (key of digitKeys; track key.digit) {\n <button\n type=\"button\"\n class=\"__key\"\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"key.digit\"\n (click)=\"onDigitPress(key.digit)\"\n >\n <span class=\"__digit\">{{ key.digit }}</span>\n @if (showLetterHints() && key.letters) {\n <span class=\"__letters\" aria-hidden=\"true\">{{ key.letters }}</span>\n }\n </button>\n }\n\n <span class=\"__spacer\" aria-hidden=\"true\"></span>\n\n <button\n type=\"button\"\n class=\"__key\"\n [disabled]=\"disabled()\"\n aria-label=\"0\"\n (click)=\"onDigitPress(zeroKey.digit)\"\n >\n <span class=\"__digit\">{{ zeroKey.digit }}</span>\n </button>\n\n <button\n type=\"button\"\n class=\"__key __key--action\"\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"'@general:virtual-keypad.backspace' | translate | async\"\n (click)=\"onBackspace()\"\n >\n <i class=\"fa-light fa-delete-left\" aria-hidden=\"true\"></i>\n </button>\n </div>\n</div>\n", styles: ["@layer properties;.axp-virtual-keypad-host{display:block;width:100%}.axp-virtual-keypad{--axp-keypad-key-size: 4.25rem;--axp-keypad-gap: .75rem;display:flex;width:100%;justify-content:center;-webkit-user-select:none;user-select:none}.axp-virtual-keypad .__grid{margin-inline:auto;display:grid;width:fit-content;justify-items:center;grid-template-columns:repeat(3,var(--axp-keypad-key-size));gap:var(--axp-keypad-gap)}.axp-virtual-keypad .__spacer{display:block;width:var(--axp-keypad-key-size);height:var(--axp-keypad-key-size)}.axp-virtual-keypad .__key{display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:0px;background-color:transparent;color:rgba(var(--ax-sys-color-on-lightest-surface));transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .1s;transition-duration:.1s;width:var(--axp-keypad-key-size);height:var(--axp-keypad-key-size)}.axp-virtual-keypad .__key:active:not(:disabled){transform:scale(.96)}.axp-virtual-keypad .__key:disabled{cursor:not-allowed;opacity:50%}.axp-virtual-keypad .__key:focus-visible{outline:2px solid rgb(var(--ax-sys-color-primary-600));outline-offset:2px}.axp-virtual-keypad .__digit{font-size:var(--text-3xl, 1.875rem);line-height:var(--tw-leading, var(--text-3xl--line-height, 1.2 ));--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.axp-virtual-keypad .__letters{margin-top:var(--spacing, .25rem);font-size:.6875rem;--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: .14em;letter-spacing:.14em;color:rgba(var(--ax-sys-color-on-lighter-surface));opacity:60%}.axp-virtual-keypad .__key--action{font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)))}.axp-virtual-keypad .__key--action i{font-size:var(--text-2xl, 1.5rem);line-height:var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)))}.axp-virtual-keypad[data-look=solid] .__key{background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-virtual-keypad[data-look=solid] .__key:active:not(:disabled){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-virtual-keypad[data-look=blank] .__key{--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-virtual-keypad[data-look=blank] .__key:active:not(:disabled){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-ordinal{syntax: \"*\"; inherits: false;}@property --tw-slashed-zero{syntax: \"*\"; inherits: false;}@property --tw-numeric-figure{syntax: \"*\"; inherits: false;}@property --tw-numeric-spacing{syntax: \"*\"; inherits: false;}@property --tw-numeric-fraction{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-duration: initial;--tw-leading: initial;--tw-font-weight: initial;--tw-ordinal: initial;--tw-slashed-zero: initial;--tw-numeric-figure: initial;--tw-numeric-spacing: initial;--tw-numeric-fraction: initial;--tw-tracking: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
10123
+ }, template: "<div\n class=\"axp-virtual-keypad\"\n role=\"group\"\n [attr.data-look]=\"look()\"\n [attr.aria-label]=\"'@general:virtual-keypad.aria-label' | translate | async\"\n>\n <div class=\"__grid\">\n @for (key of digitKeys; track key.digit) {\n <button\n type=\"button\"\n class=\"__key\"\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"key.digit\"\n (click)=\"onDigitPress(key.digit)\"\n >\n <span class=\"__digit\">{{ key.digit }}</span>\n @if (showLetterHints() && key.letters) {\n <span class=\"__letters\" aria-hidden=\"true\">{{ key.letters }}</span>\n }\n </button>\n }\n\n <span class=\"__spacer\" aria-hidden=\"true\"></span>\n\n <button\n type=\"button\"\n class=\"__key\"\n [disabled]=\"disabled()\"\n aria-label=\"0\"\n (click)=\"onDigitPress(zeroKey.digit)\"\n >\n <span class=\"__digit\">{{ zeroKey.digit }}</span>\n </button>\n\n <button\n type=\"button\"\n class=\"__key __key--action\"\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"'@general:virtual-keypad.backspace' | translate | async\"\n (click)=\"onBackspace()\"\n >\n <i class=\"fa-light fa-delete-left\" aria-hidden=\"true\"></i>\n </button>\n </div>\n</div>\n", styles: ["@layer properties;.axp-virtual-keypad-host{display:block;width:100%}.axp-virtual-keypad{--axp-keypad-key-size: 4.25rem;--axp-keypad-gap: .75rem;display:flex;width:100%;justify-content:center;-webkit-user-select:none;user-select:none}.axp-virtual-keypad .__grid{margin-inline:auto;display:grid;width:fit-content;justify-items:center;grid-template-columns:repeat(3,var(--axp-keypad-key-size));gap:var(--axp-keypad-gap)}.axp-virtual-keypad .__spacer{display:block;width:var(--axp-keypad-key-size);height:var(--axp-keypad-key-size)}.axp-virtual-keypad .__key{display:flex;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:0px;background-color:transparent;color:rgba(var(--ax-sys-color-on-lightest-surface));transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .1s;transition-duration:.1s;width:var(--axp-keypad-key-size);height:var(--axp-keypad-key-size)}.axp-virtual-keypad .__key:active:not(:disabled){transform:scale(.96)}.axp-virtual-keypad .__key:disabled{cursor:not-allowed;opacity:50%}.axp-virtual-keypad .__key:focus-visible{outline:2px solid rgb(var(--ax-sys-color-primary-600));outline-offset:2px}.axp-virtual-keypad .__digit{font-size:var(--text-3xl, 1.875rem);line-height:var(--tw-leading, var(--text-3xl--line-height, 1.2 ));--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.axp-virtual-keypad .__letters{margin-top:var(--spacing, .25rem);font-size:.6875rem;--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: .14em;letter-spacing:.14em;color:rgba(var(--ax-sys-color-on-lighter-surface));opacity:60%}.axp-virtual-keypad .__key--action{font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)))}.axp-virtual-keypad .__key--action i{font-size:var(--text-2xl, 1.5rem);line-height:var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)))}.axp-virtual-keypad[data-look=solid] .__key{background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-virtual-keypad[data-look=solid] .__key:active:not(:disabled){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-virtual-keypad[data-look=blank] .__key{--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-virtual-keypad[data-look=blank] .__key:active:not(:disabled){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-ordinal{syntax: \"*\"; inherits: false;}@property --tw-slashed-zero{syntax: \"*\"; inherits: false;}@property --tw-numeric-figure{syntax: \"*\"; inherits: false;}@property --tw-numeric-spacing{syntax: \"*\"; inherits: false;}@property --tw-numeric-fraction{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-duration: initial;--tw-leading: initial;--tw-font-weight: initial;--tw-ordinal: initial;--tw-slashed-zero: initial;--tw-numeric-figure: initial;--tw-numeric-spacing: initial;--tw-numeric-fraction: initial;--tw-tracking: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000}}}\n/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n"] }]
10191
10124
  }], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], showLetterHints: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLetterHints", required: false }] }], look: [{ type: i0.Input, args: [{ isSignal: true, alias: "look", required: false }] }], digitPress: [{ type: i0.Output, args: ["digitPress"] }], backspace: [{ type: i0.Output, args: ["backspace"] }], keyPress: [{ type: i0.Output, args: ["keyPress"] }] } });
10192
10125
 
10193
10126
  //#region ---- Virtual keypad types ----
@@ -10226,7 +10159,7 @@ class AXPQueryViewsComponent {
10226
10159
  console.log(e);
10227
10160
  }
10228
10161
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPQueryViewsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
10229
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", 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=\"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]=\"('@general:actions.create.title' | translate | async) || 'Create New'\"\n >\n </ax-tab-item> -->\n</ax-tabs>\n", dependencies: [{ kind: "ngmodule", type: AXTabsModule }, { kind: "component", type: i2$5.AXTabsComponent, selector: "ax-tabs", inputs: ["look", "location", "fitParent", "minWidth", "content"], outputs: ["onActiveTabChanged"] }, { kind: "component", type: i2$5.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: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
10162
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", 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=\"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]=\"('@general:actions.create.title' | translate | async) || 'Create New'\"\n >\n </ax-tab-item> -->\n</ax-tabs>\n", dependencies: [{ kind: "ngmodule", type: AXTabsModule }, { kind: "component", type: i8.AXTabsComponent, selector: "ax-tabs", inputs: ["look", "location", "fitParent", "minWidth", "content"], outputs: ["onActiveTabChanged"] }, { kind: "component", type: i8.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: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
10230
10163
  }
10231
10164
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPQueryViewsComponent, decorators: [{
10232
10165
  type: Component,
@@ -10877,5 +10810,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
10877
10810
  * Generated bundle index. Do not edit.
10878
10811
  */
10879
10812
 
10880
- export { AXPActivityLogComponent, AXPAvatarComponent, AXPCategoryTreeComponent, AXPColorPalettePickerComponent, AXPColumnItemListComponent, AXPCompareViewComponent, AXPConditionBuilderComponent, AXPConditionBuilderConditionComponent, AXPDataSelectorComponent, AXPDataSelectorService, AXPDragDropListComponent, AXPExpressionFieldDefinitions, AXPFileChooserDirective, AXPFileChooserService, AXPFileUploaderDirective, AXPFileUploaderService, AXPImageEditorPopupComponent, AXPImageEditorService, AXPInAppInboxItemComponent, AXPInAppInboxPanelComponent, AXPInAppInboxSlotComponent, AXPItemConfiguratorComponent, AXPLayoutFloatingZoomBarComponent, AXPLayoutSideDetailPanelComponent, AXPLayoutSideDetailPanelSectionDirective, AXPMarkdownTemplateDirective, AXPMarkdownViewerComponent, AXPMenuBadgeHelper, AXPMenuCustomizerComponent, AXPMenuCustomizerService, AXPOutcomeResultsViewerComponent, AXPPageComponentRegistryService, AXPPreloadFiltersComponent, AXPPropertyViewerComponent, AXPPropertyViewerPopupComponent, AXPPropertyViewerService, AXPQueryColumnsComponent, AXPQueryFiltersComponent, AXPQuerySortsComponent, AXPQueryViewsComponent, AXPRepeaterRowsLayoutComponent, AXPResourceAppointmentBoardProvider, AXPResourceAppointmentComponent, AXPResourceAppointmentService, AXPSectionItemsBuilderComponent, AXPSignatureEditorService, AXPSpreadsheetComponent, AXPStandardSectionItemsBuilderComponent, AXPStateMessageComponent, AXPStopwatchComponent, AXPTableColumnsEditorComponent, AXPTableColumnsEditorPopupComponent, AXPTableColumnsEditorService, AXPTableDataEditorComponent, AXPTableDataEditorPopupComponent, AXPTableDataEditorService, AXPTaskBadgeDirective, AXPTaskBadgeProvider, AXPTaskBadgeService, AXPTemplateViewerComponent, AXPTemplateViewerService, AXPTextCommandColumnComponent, AXPThemeLayoutActionsComponent, AXPThemeLayoutBlockComponent, AXPThemeLayoutContainerComponent, AXPThemeLayoutEndSideComponent, AXPThemeLayoutFooterComponent, AXPThemeLayoutHeaderComponent, AXPThemeLayoutListComponent, AXPThemeLayoutListItemComponent, AXPThemeLayoutListItemsGroupComponent, AXPThemeLayoutPageHeaderComponent, AXPThemeLayoutPagePrimaryActionsComponent, AXPThemeLayoutPageSecondaryActionsComponent, AXPThemeLayoutSectionComponent, AXPThemeLayoutStartSideComponent, AXPThemeLayoutToolbarComponent, AXPUserAvatarComponent, AXPUserAvatarService, AXPVirtualKeypadComponent, AXPWidgetFieldConfiguratorComponent, AXPWidgetItemComponent, AXPWidgetPropertyViewerComponent, AXPWidgetPropertyViewerPopupComponent, AXPWidgetPropertyViewerService, AXP_EXPRESSION_LOGIC_DEFINITIONS, AXP_EXPRESSION_OPERATION_DEFINITIONS, AXP_FILE_CHOOSER_PROVIDERS, AXP_FILE_UPLOADER_PROVIDERS, AXP_MENU_CUSTOMIZER_SERVICE, AXP_PAGE_COMPONENT_PROVIDER, AXP_RESOURCE_APPOINTMENT_PROVIDER, AXP_SYSTEM_FILE_CHOOSER_PROVIDER, AXP_SYSTEM_FILE_UPLOADER_PROVIDER, AXP_TASK_BADGE_PROVIDERS, AXP_USER_AVATAR_PROVIDER, STANDARD_SECTION_ITEMS_SECTION_TABS, buildPropertyViewerInitialContextFromProperties, buildPropertyViewerTabsFromProperties, buildTableColumnsEditorLayout, filterFileProvidersByContext, getFieldDefinitions, getLogicDefinition, getOperationDefinition, isPropertyBindingExpressionFormValue, preparePropertyForViewer, preparePropertyViewerTabs, registerFieldDefinitions, resolveExcludedFileProviderKeys, resolveFileChooserExtension, withValidationsOnEditorNode };
10813
+ export { AXPActivityLogComponent, AXPAvatarComponent, AXPCategoryTreeComponent, AXPColorPalettePickerComponent, AXPColumnItemListComponent, AXPCompareViewComponent, AXPConditionBuilderComponent, AXPConditionBuilderConditionComponent, AXPDataSelectorComponent, AXPDataSelectorService, AXPDragDropListComponent, AXPExpressionFieldDefinitions, AXPFileChooserDirective, AXPFileChooserService, AXPFileUploaderDirective, AXPFileUploaderService, AXPImageEditorPopupComponent, AXPImageEditorService, AXPItemConfiguratorComponent, AXPLayoutFloatingZoomBarComponent, AXPLayoutSideDetailPanelComponent, AXPLayoutSideDetailPanelSectionDirective, AXPMarkdownTemplateDirective, AXPMarkdownViewerComponent, AXPMenuBadgeHelper, AXPMenuCustomizerComponent, AXPMenuCustomizerService, AXPOutcomeResultsViewerComponent, AXPPageComponentRegistryService, AXPPreloadFiltersComponent, AXPPropertyViewerComponent, AXPPropertyViewerPopupComponent, AXPPropertyViewerService, AXPQueryColumnsComponent, AXPQueryFiltersComponent, AXPQuerySortsComponent, AXPQueryViewsComponent, AXPRepeaterRowsLayoutComponent, AXPResourceAppointmentBoardProvider, AXPResourceAppointmentComponent, AXPResourceAppointmentService, AXPSectionItemsBuilderComponent, AXPSignatureEditorService, AXPSpreadsheetComponent, AXPStandardSectionItemsBuilderComponent, AXPStateMessageComponent, AXPStopwatchComponent, AXPTableColumnsEditorComponent, AXPTableColumnsEditorPopupComponent, AXPTableColumnsEditorService, AXPTableDataEditorComponent, AXPTableDataEditorPopupComponent, AXPTableDataEditorService, AXPTaskBadgeDirective, AXPTaskBadgeProvider, AXPTaskBadgeService, AXPTemplateViewerComponent, AXPTemplateViewerService, AXPTextCommandColumnComponent, AXPThemeLayoutActionsComponent, AXPThemeLayoutBlockComponent, AXPThemeLayoutContainerComponent, AXPThemeLayoutEndSideComponent, AXPThemeLayoutFooterComponent, AXPThemeLayoutHeaderComponent, AXPThemeLayoutListComponent, AXPThemeLayoutListItemComponent, AXPThemeLayoutListItemsGroupComponent, AXPThemeLayoutPageHeaderComponent, AXPThemeLayoutPagePrimaryActionsComponent, AXPThemeLayoutPageSecondaryActionsComponent, AXPThemeLayoutSectionComponent, AXPThemeLayoutStartSideComponent, AXPThemeLayoutToolbarComponent, AXPUserAvatarComponent, AXPUserAvatarService, AXPVirtualKeypadComponent, AXPWidgetFieldConfiguratorComponent, AXPWidgetItemComponent, AXPWidgetPropertyViewerComponent, AXPWidgetPropertyViewerPopupComponent, AXPWidgetPropertyViewerService, AXP_EXPRESSION_LOGIC_DEFINITIONS, AXP_EXPRESSION_OPERATION_DEFINITIONS, AXP_FILE_CHOOSER_PROVIDERS, AXP_FILE_UPLOADER_PROVIDERS, AXP_MENU_CUSTOMIZER_SERVICE, AXP_PAGE_COMPONENT_PROVIDER, AXP_RESOURCE_APPOINTMENT_PROVIDER, AXP_SYSTEM_FILE_CHOOSER_PROVIDER, AXP_SYSTEM_FILE_UPLOADER_PROVIDER, AXP_TASK_BADGE_PROVIDERS, AXP_USER_AVATAR_PROVIDER, STANDARD_SECTION_ITEMS_SECTION_TABS, buildPropertyViewerInitialContextFromProperties, buildPropertyViewerTabsFromProperties, buildTableColumnsEditorLayout, filterFileProvidersByContext, getFieldDefinitions, getLogicDefinition, getOperationDefinition, isPropertyBindingExpressionFormValue, preparePropertyForViewer, preparePropertyViewerTabs, registerFieldDefinitions, resolveExcludedFileProviderKeys, resolveFileChooserExtension, withValidationsOnEditorNode };
10881
10814
  //# sourceMappingURL=acorex-platform-framework-client-layout-components.mjs.map