@acorex/platform 21.0.0-next.83 → 21.0.0-next.88
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/acorex-platform-auth.mjs +1 -1
- package/fesm2022/acorex-platform-auth.mjs.map +1 -1
- package/fesm2022/{acorex-platform-common-common-settings.provider-Ytey9uhY.mjs → acorex-platform-common-common-settings.provider-VfmZct9H.mjs} +43 -3
- package/fesm2022/acorex-platform-common-common-settings.provider-VfmZct9H.mjs.map +1 -0
- package/fesm2022/acorex-platform-common.mjs +1709 -870
- package/fesm2022/acorex-platform-common.mjs.map +1 -1
- package/fesm2022/acorex-platform-contracts.mjs +1160 -9
- package/fesm2022/acorex-platform-contracts.mjs.map +1 -1
- package/fesm2022/acorex-platform-core.mjs +210 -131
- package/fesm2022/acorex-platform-core.mjs.map +1 -1
- package/fesm2022/acorex-platform-domain-contracts.mjs +58 -0
- package/fesm2022/acorex-platform-domain-contracts.mjs.map +1 -0
- package/fesm2022/acorex-platform-domain.mjs +2 -50
- package/fesm2022/acorex-platform-domain.mjs.map +1 -1
- package/fesm2022/acorex-platform-layout-builder.mjs.map +1 -1
- package/fesm2022/acorex-platform-layout-components.mjs +61 -23
- package/fesm2022/acorex-platform-layout-components.mjs.map +1 -1
- package/fesm2022/acorex-platform-layout-designer.mjs +3 -2
- package/fesm2022/acorex-platform-layout-designer.mjs.map +1 -1
- package/fesm2022/acorex-platform-layout-entity-attachments-page.component-CwG6n_Yb.mjs.map +1 -1
- package/fesm2022/acorex-platform-layout-entity-contracts.mjs +1114 -0
- package/fesm2022/acorex-platform-layout-entity-contracts.mjs.map +1 -0
- package/fesm2022/acorex-platform-layout-entity-file-list-popup.component--IeMZLIr.mjs.map +1 -1
- package/fesm2022/acorex-platform-layout-entity.mjs +661 -742
- package/fesm2022/acorex-platform-layout-entity.mjs.map +1 -1
- package/fesm2022/acorex-platform-layout-views.mjs +376 -176
- package/fesm2022/acorex-platform-layout-views.mjs.map +1 -1
- package/fesm2022/acorex-platform-layout-widget-core.mjs +11 -105
- package/fesm2022/acorex-platform-layout-widget-core.mjs.map +1 -1
- package/fesm2022/acorex-platform-layout-widgets-repeater-widget-column.component-CFyfix31.mjs +513 -0
- package/fesm2022/acorex-platform-layout-widgets-repeater-widget-column.component-CFyfix31.mjs.map +1 -0
- package/fesm2022/{acorex-platform-layout-widgets-tabular-data-edit-popup.component-DjpZU6gz.mjs → acorex-platform-layout-widgets-tabular-data-edit-popup.component-D4MOHEpI.mjs} +4 -4
- package/fesm2022/acorex-platform-layout-widgets-tabular-data-edit-popup.component-D4MOHEpI.mjs.map +1 -0
- package/fesm2022/acorex-platform-layout-widgets.mjs +871 -59
- package/fesm2022/acorex-platform-layout-widgets.mjs.map +1 -1
- package/fesm2022/acorex-platform-runtime.mjs.map +1 -1
- package/fesm2022/{acorex-platform-themes-default-entity-master-single-view.component-Br9p5aXT.mjs → acorex-platform-themes-default-entity-master-single-view.component-DrUwqKKA.mjs} +2 -3
- package/fesm2022/acorex-platform-themes-default-entity-master-single-view.component-DrUwqKKA.mjs.map +1 -0
- package/fesm2022/acorex-platform-themes-default.mjs +740 -96
- package/fesm2022/acorex-platform-themes-default.mjs.map +1 -1
- package/fesm2022/{acorex-platform-themes-shared-settings.provider-BjuzSe0T.mjs → acorex-platform-themes-shared-settings.provider-BUwPqwUS.mjs} +3 -3
- package/fesm2022/acorex-platform-themes-shared-settings.provider-BUwPqwUS.mjs.map +1 -0
- package/fesm2022/acorex-platform-themes-shared.mjs +4 -3
- package/fesm2022/acorex-platform-themes-shared.mjs.map +1 -1
- package/fesm2022/acorex-platform-workflow.mjs +6 -8
- package/fesm2022/acorex-platform-workflow.mjs.map +1 -1
- package/package.json +9 -5
- package/types/acorex-platform-auth.d.ts +2 -1
- package/types/acorex-platform-common.d.ts +419 -1083
- package/types/acorex-platform-contracts.d.ts +1791 -260
- package/types/acorex-platform-core.d.ts +2153 -2806
- package/types/acorex-platform-domain-contracts.d.ts +416 -0
- package/types/acorex-platform-domain.d.ts +4 -415
- package/types/acorex-platform-layout-builder.d.ts +2 -1
- package/types/acorex-platform-layout-components.d.ts +15 -4
- package/types/acorex-platform-layout-designer.d.ts +2 -1
- package/types/acorex-platform-layout-entity-contracts.d.ts +864 -0
- package/types/acorex-platform-layout-entity.d.ts +88 -269
- package/types/acorex-platform-layout-views.d.ts +48 -14
- package/types/acorex-platform-layout-widget-core.d.ts +9 -5
- package/types/acorex-platform-layout-widgets.d.ts +89 -13
- package/types/acorex-platform-runtime.d.ts +1 -1
- package/types/acorex-platform-themes-default.d.ts +173 -70
- package/types/acorex-platform-workflow.d.ts +5 -18
- package/fesm2022/acorex-platform-common-common-settings.provider-Ytey9uhY.mjs.map +0 -1
- package/fesm2022/acorex-platform-layout-widgets-repeater-widget-column.component-J0zcGKBX.mjs +0 -116
- package/fesm2022/acorex-platform-layout-widgets-repeater-widget-column.component-J0zcGKBX.mjs.map +0 -1
- package/fesm2022/acorex-platform-layout-widgets-tabular-data-edit-popup.component-DjpZU6gz.mjs.map +0 -1
- package/fesm2022/acorex-platform-native.mjs +0 -155
- package/fesm2022/acorex-platform-native.mjs.map +0 -1
- package/fesm2022/acorex-platform-themes-default-entity-master-single-view.component-Br9p5aXT.mjs.map +0 -1
- package/fesm2022/acorex-platform-themes-shared-settings.provider-BjuzSe0T.mjs.map +0 -1
- package/native/README.md +0 -4
- package/types/acorex-platform-native.d.ts +0 -28
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i1 from '@acorex/platform/layout/widget-core';
|
|
2
|
-
import { AXPWidgetCoreModule, AXPDataListWidgetComponent, AXPColumnWidgetComponent, AXPLayoutBaseWidgetComponent, AXP_NAME_PROPERTY, AXP_DISABLED_PROPERTY, AXP_STYLE_COLOR_PROPERTY, AXP_STYLE_LOOK_PROPERTY, AXP_ICON_PROPERTY, AXP_IS_LOADING_PROPERTY, cloneProperty, AXP_TEXT_PROPERTY, AXPWidgetGroupEnum, AXP_WIDGETS_ACTION_SUB_CONTROLS, AXP_WIDGETS_ACTION_CATEGORY, AXP_DATA_PATH_PROPERTY, AXP_WIDGETS_EDITOR_CATEGORY, AXPValueWidgetComponent, AXP_LABEL_PROPERTY, AXP_READONLY_PROPERTY, AXP_TRIGGERS_PROPERTY, booleanDefaultProperty, AXP_WIDGETS_EDITOR_SUB_CHOICE, AXP_PLACEHOLDER_PROPERTY, AXP_HAS_CLEAR_BUTTON_PROPERTY, AXP_WIDGETS_EDITOR_SUB_VISUAL, AXP_DATA_PROPERTY_GROUP, AXP_HAS_LABEL_PROPERTY, AXP_HAS_ICON_PROPERTY, createSelectProperty, AXP_BEHAVIOR_PROPERTY_GROUP, createStringProperty, AXP_WIDGETS_EDITOR_SUB_COMPOSITE, createBooleanProperty, AXP_DATE_FORMAT_PROPERTY, AXP_DATE_DEPTH_PROPERTY, AXP_DATE_RANGE_LIMIT_PROPERTY, AXP_REQUIRED_VALIDATION_PROPERTY, AXP_LESS_THAN_VALIDATION_PROPERTY, AXP_GREATER_THAN_VALIDATION_PROPERTY, AXP_TABLE_COLUMN_WIDTH_PROPERTY, AXP_WIDGETS_EDITOR_SUB_DATETIME, AXP_WIDGETS_EDITOR_SUB_RICH, AXP_MULTI_LANGUAGE_PROPERTY, AXP_MIN_LENGTH_VALIDATION_PROPERTY, AXP_REGULAR_EXPRESSION_VALIDATION_PROPERTY, AXP_MAX_LENGTH_VALIDATION_PROPERTY, largeTextDefaultProperty, AXP_WIDGETS_EDITOR_SUB_TEXT_INPUTS, AXP_ALLOW_MULTIPLE_PROPERTY, AXP_SPIN_BUTTON_PROPERTY, AXP_NUMBER_SEPARATOR_PROPERTY, numberDefaultProperty, numberMinValueProperty, numberMaxValueProperty, createNumberProperty, AXP_WIDGETS_EDITOR_SUB_NUMERIC, AXP_HAS_COPY_ICON_PROPERTY, AXP_HAS_EYE_ICON_PROPERTY, AXP_SHOW_PASSWORD_PROPERTY, AXP_MIN_LINE_COUNT_PROPERTY, AXP_MAX_LINE_COUNT_PROPERTY, AXP_FIT_LINE_COUNT_PROPERTY, richTextDefaultProperty, AXP_DATA_SOURCE_OPTIONS_PROPERTY, AXP_ALLOW_SEARCH_PROPERTY, selectEditorDefaultValueProperty, AXP_DIRECTION_PROPERTY, selectionListEditorDefaultValueProperty, plainTextDefaultProperty, AXP_FALSY_TEXT_PROPERTY, AXP_TRULY_TEXT_PROPERTY, AXPWidgetStatus, AXP_WIDGETS_ADVANCE_SUB_MEDIA, AXP_WIDGETS_ADVANCE_CATEGORY, AXP_WIDGETS_ADVANCE_SUB_INPUT,
|
|
2
|
+
import { AXPWidgetCoreModule, AXPDataListWidgetComponent, AXPColumnWidgetComponent, AXPLayoutBaseWidgetComponent, AXP_NAME_PROPERTY, AXP_DISABLED_PROPERTY, AXP_STYLE_COLOR_PROPERTY, AXP_STYLE_LOOK_PROPERTY, AXP_ICON_PROPERTY, AXP_IS_LOADING_PROPERTY, cloneProperty, AXP_TEXT_PROPERTY, AXPWidgetGroupEnum, AXP_WIDGETS_ACTION_SUB_CONTROLS, AXP_WIDGETS_ACTION_CATEGORY, AXP_DATA_PATH_PROPERTY, AXP_WIDGETS_EDITOR_CATEGORY, AXPValueWidgetComponent, AXP_LABEL_PROPERTY, AXP_READONLY_PROPERTY, AXP_TRIGGERS_PROPERTY, booleanDefaultProperty, AXP_WIDGETS_EDITOR_SUB_CHOICE, AXP_PLACEHOLDER_PROPERTY, AXP_HAS_CLEAR_BUTTON_PROPERTY, AXP_WIDGETS_EDITOR_SUB_VISUAL, AXP_DATA_PROPERTY_GROUP, AXP_HAS_LABEL_PROPERTY, AXP_HAS_ICON_PROPERTY, createSelectProperty, AXP_BEHAVIOR_PROPERTY_GROUP, createStringProperty, AXP_WIDGETS_EDITOR_SUB_COMPOSITE, createBooleanProperty, AXP_DATE_FORMAT_PROPERTY, AXP_DATE_DEPTH_PROPERTY, AXP_DATE_RANGE_LIMIT_PROPERTY, AXP_REQUIRED_VALIDATION_PROPERTY, AXP_LESS_THAN_VALIDATION_PROPERTY, AXP_GREATER_THAN_VALIDATION_PROPERTY, AXP_TABLE_COLUMN_WIDTH_PROPERTY, AXP_WIDGETS_EDITOR_SUB_DATETIME, AXP_WIDGETS_EDITOR_SUB_RICH, AXP_MULTI_LANGUAGE_PROPERTY, AXP_MIN_LENGTH_VALIDATION_PROPERTY, AXP_REGULAR_EXPRESSION_VALIDATION_PROPERTY, AXP_MAX_LENGTH_VALIDATION_PROPERTY, largeTextDefaultProperty, AXP_WIDGETS_EDITOR_SUB_TEXT_INPUTS, AXP_ALLOW_MULTIPLE_PROPERTY, AXP_SPIN_BUTTON_PROPERTY, AXP_NUMBER_SEPARATOR_PROPERTY, numberDefaultProperty, numberMinValueProperty, numberMaxValueProperty, createNumberProperty, AXP_WIDGETS_EDITOR_SUB_NUMERIC, AXP_HAS_COPY_ICON_PROPERTY, AXP_HAS_EYE_ICON_PROPERTY, AXP_SHOW_PASSWORD_PROPERTY, AXP_MIN_LINE_COUNT_PROPERTY, AXP_MAX_LINE_COUNT_PROPERTY, AXP_FIT_LINE_COUNT_PROPERTY, richTextDefaultProperty, AXP_DATA_SOURCE_OPTIONS_PROPERTY, AXP_ALLOW_SEARCH_PROPERTY, selectEditorDefaultValueProperty, AXP_DIRECTION_PROPERTY, selectionListEditorDefaultValueProperty, plainTextDefaultProperty, AXP_FALSY_TEXT_PROPERTY, AXP_TRULY_TEXT_PROPERTY, AXPWidgetStatus, AXP_WIDGETS_ADVANCE_SUB_MEDIA, AXP_WIDGETS_ADVANCE_CATEGORY, AXP_WIDGETS_ADVANCE_SUB_INPUT, AXP_WIDGETS_LAYOUT_SUB_LISTS, AXP_WIDGETS_LAYOUT_CATEGORY, AXP_STYLING_PROPERTY_GROUP, AXP_WIDGETS_ADVANCE_SUB_TOOLS, AXP_WIDGETS_ADVANCE_SUB_DATA, AXP_COLOR_PROPERTY, AXP_CONTENT_PROPERTY, AXP_WIDGETS_EDITOR_SUB_CONFIG, AXPWidgetRegistryService, AXPPropertyEditorHelper, AXP_WIDGETS_LAYOUT_SUB_GRID, AXPBlockBaseLayoutWidgetComponent, AXP_LAYOUT_SPACING_PROPERTY, AXP_LAYOUT_BORDER_PROPERTY, AXP_LAYOUT_DIRECTION_PROPERTY, AXP_TITLE_PROPERTY, AXP_LAYOUT_SHOW_HEADER_PROPERTY, AXP_LAYOUT_COLUMNS_PROPERTY, AXP_WIDGETS_LAYOUT_SUB_SURFACES, AXPFlexBaseLayoutWidgetComponent, AXP_LAYOUT_FLEX_PROPERTY, AXPFlexItemBaseLayoutWidgetComponent, AXP_LAYOUT_FLEX_ITEM_PROPERTY, AXP_THEME_PROPERTY, AXP_FONT_SIZE_PROPERTY, AXP_BG_COLOR_PROPERTY, AXP_WIDGETS_LAYOUT_SUB_SHELL, AXPTableBaseLayoutWidgetComponent, AXP_TABLE_COLUMNS_PROPERTY, AXP_LAYOUT_TABLE_PROPERTY_GROUP, AXPTableItemBaseLayoutWidgetComponent, AXP_TABLE_ITEM_COLSPAN_PROPERTY, AXP_TABLE_ITEM_ROWSPAN_PROPERTY, findNonEmptyBreakpoints, AXP_DEFAULT_ROW_COUNT_PROPERTY, AXP_APPEARANCE_PROPERTY_GROUP, AXP_WIDGETS_LAYOUT_SUB_UTILITY, AXPGridItemBaseLayoutWidgetComponent, AXPGridBaseLayoutWidgetComponent, AXP_LAYOUT_GRID_PROPERTY, AXP_LAYOUT_GRID_ITEM_PROPERTY, AXP_WIDGETS_LAYOUT_SUB_TABS, AXP_WIDGET_DEFINITION_PROVIDER } from '@acorex/platform/layout/widget-core';
|
|
3
3
|
export * from '@acorex/platform/layout/widget-core';
|
|
4
4
|
import { AXActionSheetService } from '@acorex/components/action-sheet';
|
|
5
5
|
import * as i1$3 from '@acorex/components/badge';
|
|
@@ -10,7 +10,7 @@ import * as i1$2 from '@acorex/components/check-box';
|
|
|
10
10
|
import { AXCheckBoxModule } from '@acorex/components/check-box';
|
|
11
11
|
import * as i2$1 from '@acorex/components/decorators';
|
|
12
12
|
import { AXDecoratorModule } from '@acorex/components/decorators';
|
|
13
|
-
import * as
|
|
13
|
+
import * as i4 from '@acorex/components/form';
|
|
14
14
|
import { AXFormModule } from '@acorex/components/form';
|
|
15
15
|
import * as i2 from '@acorex/components/label';
|
|
16
16
|
import { AXLabelModule, AXLabelComponent } from '@acorex/components/label';
|
|
@@ -21,20 +21,20 @@ import * as i1$6 from '@acorex/components/text-box';
|
|
|
21
21
|
import { AXTextBoxModule } from '@acorex/components/text-box';
|
|
22
22
|
import * as i6 from '@acorex/core/translation';
|
|
23
23
|
import { AXTranslationModule, AXTranslationService, resolveMultiLanguageString } from '@acorex/core/translation';
|
|
24
|
-
import { AXP_LOCALE_MANAGEMENT_PORT, AXPFilterOperatorMiddlewareService, AXPCleanNestedFilters, AXPClipBoardService, AXPSettingsService,
|
|
25
|
-
import { AXPDeviceService, setSmart, AXPColorPaletteService, extractValue, shouldUseLocaleMapShape, buildLocaleTextMapValue, AXPTagService, AXPExpressionEvaluatorService, AXPHookService,
|
|
24
|
+
import { AXP_LOCALE_MANAGEMENT_PORT, AXPFilterOperatorMiddlewareService, AXPCleanNestedFilters, AXPClipBoardService, AXPSettingsService, ALL_DEFAULT_OPERATORS, DATE_OPERATORS, BOOLEAN_OPERATORS, NUMBER_OPERATORS, STRING_OPERATORS, resolveDateFilterPresets, findManualPresetIdByOperation, applyDateFilterPreset, AXPFileStorageService, AXPFileActionsService, AXPIntegrationProviderRegistryService, normalizePositiveNumberOption, resolveEntityRowDisplayText, resolveEntityRowDisplayTitle, downloadGraphicFromElement, printGraphicFromElement, AXPStatusDefinitionProviderService, AXPRefreshEvent, AXPCommonSettings } from '@acorex/platform/common';
|
|
25
|
+
import { AXPDeviceService, setSmart, AXPColorPaletteService, extractValue, shouldUseLocaleMapShape, buildLocaleTextMapValue, AXPTagService, AXPExpressionEvaluatorService, AXPHookService, AXPDataSourceDefinitionProviderService, sortByMultiLanguageString, applyQueryArray, chordToKbdItemKeys, objectKeyValueTransforms } from '@acorex/platform/core';
|
|
26
26
|
import * as i1$4 from '@angular/common';
|
|
27
27
|
import { CommonModule, AsyncPipe } from '@angular/common';
|
|
28
28
|
import * as i0 from '@angular/core';
|
|
29
29
|
import { inject, signal, computed, Component, InjectionToken, viewChild, effect, untracked, HostBinding, Directive, ChangeDetectionStrategy, EventEmitter, linkedSignal, Injectable, model, input, ViewEncapsulation, ChangeDetectorRef, afterNextRender, output, Input, ElementRef, afterEveryRender, NgZone, importProvidersFrom, NgModule } from '@angular/core';
|
|
30
30
|
import * as i1$5 from '@angular/forms';
|
|
31
31
|
import { FormsModule } from '@angular/forms';
|
|
32
|
-
import * as i3
|
|
32
|
+
import * as i3 from '@acorex/components/select-box';
|
|
33
33
|
import { AXSelectBoxComponent, AXSelectBoxModule } from '@acorex/components/select-box';
|
|
34
34
|
import { set, get, castArray, isNil, isNull, isEmpty, isNumber, defaultTo, isEqual, cloneDeep } from 'lodash-es';
|
|
35
35
|
import * as i2$2 from '@acorex/components/loading';
|
|
36
36
|
import { AXLoadingModule } from '@acorex/components/loading';
|
|
37
|
-
import { AXPCommandService, provideQuerySetups } from '@acorex/platform/runtime';
|
|
37
|
+
import { AXPCommandService, AXPQueryService, provideQuerySetups } from '@acorex/platform/runtime';
|
|
38
38
|
import { AXPConditionBuilderComponent, AXPColorPalettePickerComponent, AXPDragDropListComponent, AXPColumnItemListComponent, AXPImageEditorService, AXPStateMessageComponent, AXPOutcomeResultsViewerComponent, AXPSignatureEditorService, AXPStopwatchComponent, AXPWidgetFieldConfiguratorComponent, AXPItemConfiguratorComponent, AXPRepeaterRowsLayoutComponent, AXPQueryFiltersComponent, AXPQuerySortsComponent, AXPQueryColumnsComponent } from '@acorex/platform/layout/components';
|
|
39
39
|
import { AXValidationModule, AXValidationService } from '@acorex/core/validation';
|
|
40
40
|
import { AXColorUtil } from '@acorex/core/utils';
|
|
@@ -45,10 +45,11 @@ import { AXPLayoutBuilderService, AXPLayoutRendererComponent } from '@acorex/pla
|
|
|
45
45
|
import * as i8 from '@acorex/components/collapse';
|
|
46
46
|
import { AXCollapseModule } from '@acorex/components/collapse';
|
|
47
47
|
import { AXFormatService } from '@acorex/core/format';
|
|
48
|
-
import
|
|
48
|
+
import { AXPRegionalSetting, AXPWidgetsCatalog, AXPDataGenerator, AXP_INTEGRATION_AUTH_METHOD_TYPE, normalizeDefinitionCategories } from '@acorex/platform/contracts';
|
|
49
|
+
import * as i3$2 from '@acorex/components/datetime-box';
|
|
49
50
|
import { AXDateTimeBoxModule } from '@acorex/components/datetime-box';
|
|
50
51
|
import { AXCalendarService, AXTimeDurationFormatter } from '@acorex/core/date-time';
|
|
51
|
-
import * as i3$
|
|
52
|
+
import * as i3$1 from '@acorex/components/popover';
|
|
52
53
|
import { AXPopoverModule, AXPopoverComponent } from '@acorex/components/popover';
|
|
53
54
|
import * as i2$4 from '@acorex/components/selection-list';
|
|
54
55
|
import { AXSelectionListModule } from '@acorex/components/selection-list';
|
|
@@ -56,16 +57,16 @@ import { AXSafePipe } from '@acorex/core/pipes';
|
|
|
56
57
|
import { AXPlatform } from '@acorex/core/platform';
|
|
57
58
|
import { AXEditorComponent } from '@acorex/components/editor';
|
|
58
59
|
import { AXPopupService } from '@acorex/components/popup';
|
|
59
|
-
import * as i4 from '@acorex/components/text-area';
|
|
60
|
+
import * as i4$1 from '@acorex/components/text-area';
|
|
60
61
|
import { AXTextAreaModule } from '@acorex/components/text-area';
|
|
61
62
|
import { toSignal } from '@angular/core/rxjs-interop';
|
|
62
63
|
import * as i1$7 from '@acorex/components/number-box';
|
|
63
64
|
import { AXNumberBoxModule } from '@acorex/components/number-box';
|
|
64
|
-
import * as i3$
|
|
65
|
+
import * as i3$3 from '@acorex/components/password-box';
|
|
65
66
|
import { AXPasswordBoxModule } from '@acorex/components/password-box';
|
|
66
67
|
import * as i1$8 from '@acorex/components/progress-bar';
|
|
67
68
|
import { AXProgressBarModule } from '@acorex/components/progress-bar';
|
|
68
|
-
import * as i3$
|
|
69
|
+
import * as i3$4 from '@acorex/components/range-slider';
|
|
69
70
|
import { AXRangeSliderModule } from '@acorex/components/range-slider';
|
|
70
71
|
import { AXRatePickerComponent } from '@acorex/components/rate-picker';
|
|
71
72
|
import * as i2$5 from '@acorex/components/wysiwyg';
|
|
@@ -93,6 +94,7 @@ import * as i1$d from '@acorex/components/media-viewer';
|
|
|
93
94
|
import { AXMediaViewerModule } from '@acorex/components/media-viewer';
|
|
94
95
|
import * as i1$e from '@acorex/components/image';
|
|
95
96
|
import { AXImageModule } from '@acorex/components/image';
|
|
97
|
+
import { AXPSessionService } from '@acorex/platform/auth';
|
|
96
98
|
import * as i1$f from '@acorex/components/json-viewer';
|
|
97
99
|
import { AXJsonViewerModule } from '@acorex/components/json-viewer';
|
|
98
100
|
import * as i1$g from '@acorex/components/map';
|
|
@@ -117,12 +119,12 @@ import { AXDropdownButtonModule } from '@acorex/components/dropdown-button';
|
|
|
117
119
|
import { AXKBDComponent, AXKBDItemComponent } from '@acorex/components/kbd';
|
|
118
120
|
import * as i1$k from '@acorex/components/cron-job';
|
|
119
121
|
import { AXCronJobModule } from '@acorex/components/cron-job';
|
|
120
|
-
import * as i3$
|
|
122
|
+
import * as i3$5 from '@acorex/components/time-duration';
|
|
121
123
|
import { AXTimeDurationModule } from '@acorex/components/time-duration';
|
|
122
124
|
import * as i1$l from '@acorex/components/alert';
|
|
123
125
|
import { AXAlertModule } from '@acorex/components/alert';
|
|
124
126
|
import { DomSanitizer } from '@angular/platform-browser';
|
|
125
|
-
import * as i4$
|
|
127
|
+
import * as i4$2 from '@acorex/components/tooltip';
|
|
126
128
|
import { AXTooltipModule } from '@acorex/components/tooltip';
|
|
127
129
|
import { AXP_ENTITY_DEFINITION_CRUD_SERVICE } from '@acorex/platform/domain';
|
|
128
130
|
|
|
@@ -1285,7 +1287,7 @@ class AXPCheckBoxWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
1285
1287
|
<ax-label>{{ label() }}</ax-label>
|
|
1286
1288
|
}
|
|
1287
1289
|
</ax-check-box>
|
|
1288
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AXCheckBoxModule }, { kind: "component", type: i1$2.AXCheckBoxComponent, selector: "ax-check-box", inputs: ["disabled", "tabIndex", "readonly", "color", "value", "name", "id", "isLoading", "indeterminate"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type:
|
|
1290
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AXCheckBoxModule }, { kind: "component", type: i1$2.AXCheckBoxComponent, selector: "ax-check-box", inputs: ["disabled", "tabIndex", "readonly", "color", "value", "name", "id", "isLoading", "indeterminate"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i2.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXValidationModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1289
1291
|
}
|
|
1290
1292
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPCheckBoxWidgetEditComponent, decorators: [{
|
|
1291
1293
|
type: Component,
|
|
@@ -1597,7 +1599,7 @@ class AXPColorBoxWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
1597
1599
|
<ax-clear-button></ax-clear-button>
|
|
1598
1600
|
}
|
|
1599
1601
|
</ax-color-box>
|
|
1600
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXColorBoxModule }, { kind: "component", type: i2$3.AXColorBoxComponent, selector: "ax-color-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "showBadge", "showValue", "showClearButton", "showIcon"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type:
|
|
1602
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXColorBoxModule }, { kind: "component", type: i2$3.AXColorBoxComponent, selector: "ax-color-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "showBadge", "showValue", "showClearButton", "showIcon"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1601
1603
|
}
|
|
1602
1604
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPColorBoxWidgetEditComponent, decorators: [{
|
|
1603
1605
|
type: Component,
|
|
@@ -2761,7 +2763,7 @@ class AXPContactWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
2761
2763
|
</ax-select-box>
|
|
2762
2764
|
}
|
|
2763
2765
|
</div>
|
|
2764
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i3
|
|
2766
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i3.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: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { 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: AXTextBoxModule }, { kind: "component", type: i1$6.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "maskPattern", "customTokens", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onMaskChanged"] }, { kind: "ngmodule", type: AXValidationModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2765
2767
|
}
|
|
2766
2768
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPContactWidgetEditComponent, decorators: [{
|
|
2767
2769
|
type: Component,
|
|
@@ -3589,7 +3591,7 @@ class AXPAddressWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
3589
3591
|
</div>
|
|
3590
3592
|
</div>
|
|
3591
3593
|
}
|
|
3592
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i3
|
|
3594
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i3.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: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { 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: AXTextBoxModule }, { kind: "component", type: i1$6.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "maskPattern", "customTokens", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onMaskChanged"] }, { kind: "ngmodule", type: AXValidationModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.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: AXCollapseModule }, { kind: "component", type: i8.AXCollapseComponent, selector: "ax-collapse", inputs: ["disabled", "look", "isCollapsed", "showHeader", "caption", "icon", "isLoading", "headerTemplate"], outputs: ["onClick", "isCollapsedChange"] }, { kind: "component", type: i8.AXCollapseGroupComponent, selector: "ax-collapse-group", inputs: ["look", "accordion", "activeIndex"], outputs: ["accordionChange", "activeIndexChange"] }, { kind: "component", type: AXPLayoutRendererComponent, selector: "axp-layout-renderer", inputs: ["layout", "context", "look", "mode"], outputs: ["contextChange", "contextInitiated", "validityChange"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3593
3595
|
}
|
|
3594
3596
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPAddressWidgetEditComponent, decorators: [{
|
|
3595
3597
|
type: Component,
|
|
@@ -3838,6 +3840,7 @@ class AXPDateTimeBoxWidgetColumnComponent extends AXPColumnWidgetComponent {
|
|
|
3838
3840
|
this.formatter = inject(AXFormatService);
|
|
3839
3841
|
this.settingsService = inject(AXPSettingsService);
|
|
3840
3842
|
this.convertedValue = signal(typeof this.rawValue === 'string' ? this.rawValue : null, ...(ngDevMode ? [{ debugName: "convertedValue" }] : /* istanbul ignore next */ []));
|
|
3843
|
+
this.displayValue = computed(() => this.convertedValue() ?? '---', ...(ngDevMode ? [{ debugName: "displayValue" }] : /* istanbul ignore next */ []));
|
|
3841
3844
|
this.dateMode = computed(() => this.options['mode'] || 'short', ...(ngDevMode ? [{ debugName: "dateMode" }] : /* istanbul ignore next */ []));
|
|
3842
3845
|
this.format = computed(() => {
|
|
3843
3846
|
const rawValue = this.options['format'];
|
|
@@ -3854,7 +3857,7 @@ class AXPDateTimeBoxWidgetColumnComponent extends AXPColumnWidgetComponent {
|
|
|
3854
3857
|
this.updateValue = async () => {
|
|
3855
3858
|
const rawValue = this.rawValue;
|
|
3856
3859
|
if (rawValue == null) {
|
|
3857
|
-
this.convertedValue.set(
|
|
3860
|
+
this.convertedValue.set('---');
|
|
3858
3861
|
return;
|
|
3859
3862
|
}
|
|
3860
3863
|
this.convertedValue.set(await this.handleFormat(rawValue));
|
|
@@ -3885,7 +3888,7 @@ class AXPDateTimeBoxWidgetColumnComponent extends AXPColumnWidgetComponent {
|
|
|
3885
3888
|
}
|
|
3886
3889
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPDateTimeBoxWidgetColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
3887
3890
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: AXPDateTimeBoxWidgetColumnComponent, isStandalone: true, selector: "axp-date-time-box-widget-column", inputs: { rawValue: "rawValue", rowData: "rowData" }, usesInheritance: true, ngImport: i0, template: `<div class="ax-flex">
|
|
3888
|
-
<span [dir]="'ltr'" [title]="
|
|
3891
|
+
<span [dir]="'ltr'" [title]="displayValue()">{{ displayValue() }}</span>
|
|
3889
3892
|
</div>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3890
3893
|
}
|
|
3891
3894
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPDateTimeBoxWidgetColumnComponent, decorators: [{
|
|
@@ -3893,7 +3896,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
3893
3896
|
args: [{
|
|
3894
3897
|
selector: 'axp-date-time-box-widget-column',
|
|
3895
3898
|
template: `<div class="ax-flex">
|
|
3896
|
-
<span [dir]="'ltr'" [title]="
|
|
3899
|
+
<span [dir]="'ltr'" [title]="displayValue()">{{ displayValue() }}</span>
|
|
3897
3900
|
</div>`,
|
|
3898
3901
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
3899
3902
|
imports: [],
|
|
@@ -3971,7 +3974,7 @@ class AXPFilterOperationsComponent {
|
|
|
3971
3974
|
return resolved.length > 0 ? resolved : base;
|
|
3972
3975
|
}
|
|
3973
3976
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFilterOperationsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3974
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPFilterOperationsComponent, isStandalone: true, selector: "axp-filter-operations", inputs: { selectedOperation: { classPropertyName: "selectedOperation", publicName: "selectedOperation", isSignal: true, isRequired: true, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, operations: { classPropertyName: "operations", publicName: "operations", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedOperation: "selectedOperationChange" }, ngImport: i0, template: "@if (operationItems().length > 1) {\n<ax-button #changeOperator look=\"blank\" color=\"default\" class=\"ax-sm\">\n <ax-icon class=\"fa-solid fa-ellipsis-vertical\"></ax-icon>\n</ax-button>\n<ax-popover\n #operatorsPopover\n [target]=\"changeOperator\"\n [openOn]=\"'toggle'\"\n [closeOn]=\"'clickOut'\"\n [adaptivityEnabled]=\"true\"\n>\n <div\n class=\"ax-max-h-max ax-overflow-auto ax-bg-lightest ax-py-5 ax-px-3 ax-border ax-border-default ax-rounded-md ax-shadow-md ax-w-full ax-min-w-[250px]\"\n >\n <ax-selection-list\n class=\"\"\n [valueField]=\"'name'\"\n [textField]=\"'title'\"\n [(ngModel)]=\"selectedOperation\"\n (ngModelChange)=\"operatorsPopover.close()\"\n [direction]=\"'vertical'\"\n [items]=\"operationItems()\"\n [multiple]=\"false\"\n ></ax-selection-list>\n </div>\n</ax-popover>\n}\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i3$
|
|
3977
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPFilterOperationsComponent, isStandalone: true, selector: "axp-filter-operations", inputs: { selectedOperation: { classPropertyName: "selectedOperation", publicName: "selectedOperation", isSignal: true, isRequired: true, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, operations: { classPropertyName: "operations", publicName: "operations", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedOperation: "selectedOperationChange" }, ngImport: i0, template: "@if (operationItems().length > 1) {\n<ax-button #changeOperator look=\"blank\" color=\"default\" class=\"ax-sm\">\n <ax-icon class=\"fa-solid fa-ellipsis-vertical\"></ax-icon>\n</ax-button>\n<ax-popover\n #operatorsPopover\n [target]=\"changeOperator\"\n [openOn]=\"'toggle'\"\n [closeOn]=\"'clickOut'\"\n [adaptivityEnabled]=\"true\"\n>\n <div\n class=\"ax-max-h-max ax-overflow-auto ax-bg-lightest ax-py-5 ax-px-3 ax-border ax-border-default ax-rounded-md ax-shadow-md ax-w-full ax-min-w-[250px]\"\n >\n <ax-selection-list\n class=\"\"\n [valueField]=\"'name'\"\n [textField]=\"'title'\"\n [(ngModel)]=\"selectedOperation\"\n (ngModelChange)=\"operatorsPopover.close()\"\n [direction]=\"'vertical'\"\n [items]=\"operationItems()\"\n [multiple]=\"false\"\n ></ax-selection-list>\n </div>\n</ax-popover>\n}\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i3$1.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$1.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: AXSelectionListModule }, { kind: "component", type: i2$4.AXSelectionListComponent, selector: "ax-selection-list", inputs: ["id", "name", "disabled", "readonly", "tabIndex", "size", "value", "valueField", "textField", "disabledField", "readonlyField", "multiple", "direction", "customTemplate", "showControl", "items", "look"], outputs: ["onValueChanged", "onBlur", "onFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3975
3978
|
}
|
|
3976
3979
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFilterOperationsComponent, decorators: [{
|
|
3977
3980
|
type: Component,
|
|
@@ -4290,7 +4293,7 @@ class AXPDateTimeBoxWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
4290
4293
|
return cls;
|
|
4291
4294
|
}
|
|
4292
4295
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPDateTimeBoxWidgetEditComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4293
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPDateTimeBoxWidgetEditComponent, isStandalone: true, selector: "axp-date-time-box-widget-edit", host: { properties: { "class": "this.__class" } }, viewQueries: [{ propertyName: "selectBox", first: true, predicate: ["selectBox"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<!-- Filter mode: grid/list filters with operation metadata and optional preset ranges -->\n@if (filterMode()) {\n <!-- Simple filter UI: operation picker + one or two datetime inputs -->\n @if (filterUi() === 'simple') {\n <div class=\"ax-flex ax-items-center ax-w-full\">\n <!-- Between operation: from / to range inputs -->\n @if (operation().type === 'between') {\n <div class=\"ax-flex-1 ax-flex ax-gap-2\">\n <ax-datetime-box\n #dateTimeBox\n class=\"ax-w-full\"\n [format]=\"calendarFormat()\"\n [picker]=\"format()\"\n [depth]=\"inputDepth()\"\n [minValue]=\"filterFromMinValue()\"\n [maxValue]=\"filterFromMaxValue()\"\n [placeholder]=\"'@general:terms.common.from' | translate | async\"\n [disabled]=\"isValuelessOperation()\"\n [ngModel]=\"filterRangeValue().from\"\n (onValueChanged)=\"handleFilterValueChange($event, 'from')\"\n >\n <ax-clear-button></ax-clear-button>\n @for (validation of validationRules(); track $index) {\n <ax-validation-rule\n [rule]=\"validation.rule\"\n [message]=\"validation.options?.message\"\n [options]=\"validation.options\"\n ></ax-validation-rule>\n }\n </ax-datetime-box>\n <ax-datetime-box\n class=\"ax-w-full\"\n [format]=\"calendarFormat()\"\n [picker]=\"format()\"\n [depth]=\"inputDepth()\"\n [minValue]=\"filterToMinValue()\"\n [maxValue]=\"filterToMaxValue()\"\n [placeholder]=\"'@general:terms.common.to' | translate | async\"\n [disabled]=\"isValuelessOperation()\"\n [ngModel]=\"filterRangeValue().to\"\n (onValueChanged)=\"handleFilterValueChange($event, 'to')\"\n >\n <ax-clear-button></ax-clear-button>\n @for (validation of validationRules(); track $index) {\n <ax-validation-rule\n [rule]=\"validation.rule\"\n [message]=\"validation.options?.message\"\n [options]=\"validation.options\"\n ></ax-validation-rule>\n }\n </ax-datetime-box>\n </div>\n } @else {\n <!-- Single-value operations: equal, greaterThan, lessThan, isEmpty, isNotEmpty, etc. -->\n <ax-datetime-box\n #dateTimeBox\n class=\"ax-flex-1\"\n [format]=\"calendarFormat()\"\n [picker]=\"format()\"\n [depth]=\"inputDepth()\"\n [placeholder]=\"(placeholder() | translate | async) ?? ''\"\n [disabled]=\"isValuelessOperation()\"\n [ngModel]=\"filterValue()\"\n (onValueChanged)=\"handleFilterValueChange($event, 'self')\"\n >\n <ax-clear-button></ax-clear-button>\n @for (validation of validationRules(); track $index) {\n <ax-validation-rule\n [rule]=\"validation.rule\"\n [message]=\"validation.options?.message\"\n [options]=\"validation.options\"\n ></ax-validation-rule>\n }\n </ax-datetime-box>\n }\n\n <!-- Operation selector (equal, between, isEmpty, ...) -->\n <axp-filter-operations\n type=\"datetime\"\n [operations]=\"filterOperations()\"\n [selectedOperation]=\"operation().type\"\n (selectedOperationChange)=\"handleOperationChange($event)\"\n ></axp-filter-operations>\n </div>\n } @else {\n <!-- Presets filter UI: relative ranges (Today, This Week, ...) plus manual inputs -->\n <div class=\"ax-flex ax-flex-col ax-items-center ax-w-full\">\n <!-- Preset dropdown (Today, Yesterday, This Week, Between, Greater Than, ...) -->\n @if (resolvedPresets().length) {\n <ax-select-box\n #selectBox\n class=\"ax-w-full\"\n [dataSource]=\"translatedPresets()\"\n [valueField]=\"'id'\"\n [textField]=\"'title'\"\n [placeholder]=\"('@general:actions.select.title' | translate | async) ?? ''\"\n [ngModel]=\"selectedPresetId()\"\n (onValueChanged)=\"handlePresetChange($event)\"\n >\n <ax-clear-button></ax-clear-button>\n </ax-select-box>\n }\n\n <!-- Manual preset: custom between range -->\n @if (selectedManualPreset()?.operationType === 'between') {\n <div class=\"ax-flex ax-gap-2 ax-mt-2 ax-w-full\">\n <ax-datetime-box\n [format]=\"calendarFormat()\"\n [picker]=\"format()\"\n [depth]=\"inputDepth()\"\n [minValue]=\"filterFromMinValue()\"\n [maxValue]=\"filterFromMaxValue()\"\n [placeholder]=\"'@general:terms.common.from' | translate | async\"\n [ngModel]=\"filterRangeValue().from\"\n (onValueChanged)=\"handleFilterValueChange($event, 'from')\"\n >\n @for (validation of validationRules(); track $index) {\n <ax-validation-rule\n [rule]=\"validation.rule\"\n [message]=\"validation.options?.message\"\n [options]=\"validation.options\"\n ></ax-validation-rule>\n }\n <ax-clear-button></ax-clear-button>\n </ax-datetime-box>\n <ax-datetime-box\n [format]=\"calendarFormat()\"\n [picker]=\"format()\"\n [depth]=\"inputDepth()\"\n [minValue]=\"filterToMinValue()\"\n [maxValue]=\"filterToMaxValue()\"\n [placeholder]=\"'@general:terms.common.to' | translate | async\"\n [ngModel]=\"filterRangeValue().to\"\n (onValueChanged)=\"handleFilterValueChange($event, 'to')\"\n >\n <ax-clear-button></ax-clear-button>\n @for (validation of validationRules(); track $index) {\n <ax-validation-rule\n [rule]=\"validation.rule\"\n [message]=\"validation.options?.message\"\n [options]=\"validation.options\"\n ></ax-validation-rule>\n }\n </ax-datetime-box>\n </div>\n }\n\n <!-- Manual preset: single bound for greaterThan / lessThan -->\n @if (\n selectedManualPreset()?.operationType === 'greaterThan' ||\n selectedManualPreset()?.operationType === 'lessThan'\n ) {\n <div class=\"ax-w-full ax-mt-2\">\n <ax-datetime-box\n [format]=\"calendarFormat()\"\n [picker]=\"format()\"\n [depth]=\"inputDepth()\"\n [ngModel]=\"filterValue()\"\n (onValueChanged)=\"handleFilterValueChange($event, 'self')\"\n >\n @for (validation of validationRules(); track $index) {\n <ax-validation-rule\n [rule]=\"validation.rule\"\n [message]=\"validation.options?.message\"\n [options]=\"validation.options\"\n ></ax-validation-rule>\n }\n <ax-clear-button></ax-clear-button>\n </ax-datetime-box>\n </div>\n }\n </div>\n }\n} @else {\n <!-- Standard form edit: single date/time value bound to entity or form field -->\n <ax-datetime-box\n [ngModel]=\"getValue()\"\n [picker]=\"format()\"\n [depth]=\"inputDepth()\"\n (onValueChanged)=\"handleValueChange($event)\"\n [minValue]=\"minValue()\"\n [maxValue]=\"maxValue()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n [format]=\"calendarFormat()\"\n [placeholder]=\"placeholder()\"\n >\n @for (validation of validationRules(); track $index) {\n <ax-validation-rule\n [rule]=\"validation.rule\"\n [message]=\"validation.options?.message\"\n [options]=\"validation.options\"\n ></ax-validation-rule>\n }\n @if (clearButton()) {\n <ax-clear-button></ax-clear-button>\n }\n </ax-datetime-box>\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i3.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: AXValidationModule }, { kind: "ngmodule", type: AXDateTimeBoxModule }, { kind: "component", type: i3$3.AXDateTimeBoxComponent, selector: "ax-datetime-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "depth", "id", "type", "look", "holidayDates", "allowTyping", "picker", "calendar", "weekend", "weekdays", "calendarLook", "yearRange", "boxLook", "format"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "onOpened", "onClosed", "readonlyChange", "disabledChange", "formatChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i3$1.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: AXTranslationModule }, { kind: "component", type: AXPFilterOperationsComponent, selector: "axp-filter-operations", inputs: ["selectedOperation", "type", "operations"], outputs: ["selectedOperationChange"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4296
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPDateTimeBoxWidgetEditComponent, isStandalone: true, selector: "axp-date-time-box-widget-edit", host: { properties: { "class": "this.__class" } }, viewQueries: [{ propertyName: "selectBox", first: true, predicate: ["selectBox"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<!-- Filter mode: grid/list filters with operation metadata and optional preset ranges -->\n@if (filterMode()) {\n <!-- Simple filter UI: operation picker + one or two datetime inputs -->\n @if (filterUi() === 'simple') {\n <div class=\"ax-flex ax-items-center ax-w-full\">\n <!-- Between operation: from / to range inputs -->\n @if (operation().type === 'between') {\n <div class=\"ax-flex-1 ax-flex ax-gap-2\">\n <ax-datetime-box\n #dateTimeBox\n class=\"ax-w-full\"\n [format]=\"calendarFormat()\"\n [picker]=\"format()\"\n [depth]=\"inputDepth()\"\n [minValue]=\"filterFromMinValue()\"\n [maxValue]=\"filterFromMaxValue()\"\n [placeholder]=\"'@general:terms.common.from' | translate | async\"\n [disabled]=\"isValuelessOperation()\"\n [ngModel]=\"filterRangeValue().from\"\n (onValueChanged)=\"handleFilterValueChange($event, 'from')\"\n >\n <ax-clear-button></ax-clear-button>\n @for (validation of validationRules(); track $index) {\n <ax-validation-rule\n [rule]=\"validation.rule\"\n [message]=\"validation.options?.message\"\n [options]=\"validation.options\"\n ></ax-validation-rule>\n }\n </ax-datetime-box>\n <ax-datetime-box\n class=\"ax-w-full\"\n [format]=\"calendarFormat()\"\n [picker]=\"format()\"\n [depth]=\"inputDepth()\"\n [minValue]=\"filterToMinValue()\"\n [maxValue]=\"filterToMaxValue()\"\n [placeholder]=\"'@general:terms.common.to' | translate | async\"\n [disabled]=\"isValuelessOperation()\"\n [ngModel]=\"filterRangeValue().to\"\n (onValueChanged)=\"handleFilterValueChange($event, 'to')\"\n >\n <ax-clear-button></ax-clear-button>\n @for (validation of validationRules(); track $index) {\n <ax-validation-rule\n [rule]=\"validation.rule\"\n [message]=\"validation.options?.message\"\n [options]=\"validation.options\"\n ></ax-validation-rule>\n }\n </ax-datetime-box>\n </div>\n } @else {\n <!-- Single-value operations: equal, greaterThan, lessThan, isEmpty, isNotEmpty, etc. -->\n <ax-datetime-box\n #dateTimeBox\n class=\"ax-flex-1\"\n [format]=\"calendarFormat()\"\n [picker]=\"format()\"\n [depth]=\"inputDepth()\"\n [placeholder]=\"(placeholder() | translate | async) ?? ''\"\n [disabled]=\"isValuelessOperation()\"\n [ngModel]=\"filterValue()\"\n (onValueChanged)=\"handleFilterValueChange($event, 'self')\"\n >\n <ax-clear-button></ax-clear-button>\n @for (validation of validationRules(); track $index) {\n <ax-validation-rule\n [rule]=\"validation.rule\"\n [message]=\"validation.options?.message\"\n [options]=\"validation.options\"\n ></ax-validation-rule>\n }\n </ax-datetime-box>\n }\n\n <!-- Operation selector (equal, between, isEmpty, ...) -->\n <axp-filter-operations\n type=\"datetime\"\n [operations]=\"filterOperations()\"\n [selectedOperation]=\"operation().type\"\n (selectedOperationChange)=\"handleOperationChange($event)\"\n ></axp-filter-operations>\n </div>\n } @else {\n <!-- Presets filter UI: relative ranges (Today, This Week, ...) plus manual inputs -->\n <div class=\"ax-flex ax-flex-col ax-items-center ax-w-full\">\n <!-- Preset dropdown (Today, Yesterday, This Week, Between, Greater Than, ...) -->\n @if (resolvedPresets().length) {\n <ax-select-box\n #selectBox\n class=\"ax-w-full\"\n [dataSource]=\"translatedPresets()\"\n [valueField]=\"'id'\"\n [textField]=\"'title'\"\n [placeholder]=\"('@general:actions.select.title' | translate | async) ?? ''\"\n [ngModel]=\"selectedPresetId()\"\n (onValueChanged)=\"handlePresetChange($event)\"\n >\n <ax-clear-button></ax-clear-button>\n </ax-select-box>\n }\n\n <!-- Manual preset: custom between range -->\n @if (selectedManualPreset()?.operationType === 'between') {\n <div class=\"ax-flex ax-gap-2 ax-mt-2 ax-w-full\">\n <ax-datetime-box\n [format]=\"calendarFormat()\"\n [picker]=\"format()\"\n [depth]=\"inputDepth()\"\n [minValue]=\"filterFromMinValue()\"\n [maxValue]=\"filterFromMaxValue()\"\n [placeholder]=\"'@general:terms.common.from' | translate | async\"\n [ngModel]=\"filterRangeValue().from\"\n (onValueChanged)=\"handleFilterValueChange($event, 'from')\"\n >\n @for (validation of validationRules(); track $index) {\n <ax-validation-rule\n [rule]=\"validation.rule\"\n [message]=\"validation.options?.message\"\n [options]=\"validation.options\"\n ></ax-validation-rule>\n }\n <ax-clear-button></ax-clear-button>\n </ax-datetime-box>\n <ax-datetime-box\n [format]=\"calendarFormat()\"\n [picker]=\"format()\"\n [depth]=\"inputDepth()\"\n [minValue]=\"filterToMinValue()\"\n [maxValue]=\"filterToMaxValue()\"\n [placeholder]=\"'@general:terms.common.to' | translate | async\"\n [ngModel]=\"filterRangeValue().to\"\n (onValueChanged)=\"handleFilterValueChange($event, 'to')\"\n >\n <ax-clear-button></ax-clear-button>\n @for (validation of validationRules(); track $index) {\n <ax-validation-rule\n [rule]=\"validation.rule\"\n [message]=\"validation.options?.message\"\n [options]=\"validation.options\"\n ></ax-validation-rule>\n }\n </ax-datetime-box>\n </div>\n }\n\n <!-- Manual preset: single bound for greaterThan / lessThan -->\n @if (\n selectedManualPreset()?.operationType === 'greaterThan' ||\n selectedManualPreset()?.operationType === 'lessThan'\n ) {\n <div class=\"ax-w-full ax-mt-2\">\n <ax-datetime-box\n [format]=\"calendarFormat()\"\n [picker]=\"format()\"\n [depth]=\"inputDepth()\"\n [ngModel]=\"filterValue()\"\n (onValueChanged)=\"handleFilterValueChange($event, 'self')\"\n >\n @for (validation of validationRules(); track $index) {\n <ax-validation-rule\n [rule]=\"validation.rule\"\n [message]=\"validation.options?.message\"\n [options]=\"validation.options\"\n ></ax-validation-rule>\n }\n <ax-clear-button></ax-clear-button>\n </ax-datetime-box>\n </div>\n }\n </div>\n }\n} @else {\n <!-- Standard form edit: single date/time value bound to entity or form field -->\n <ax-datetime-box\n [ngModel]=\"getValue()\"\n [picker]=\"format()\"\n [depth]=\"inputDepth()\"\n (onValueChanged)=\"handleValueChange($event)\"\n [minValue]=\"minValue()\"\n [maxValue]=\"maxValue()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n [format]=\"calendarFormat()\"\n [placeholder]=\"placeholder()\"\n >\n @for (validation of validationRules(); track $index) {\n <ax-validation-rule\n [rule]=\"validation.rule\"\n [message]=\"validation.options?.message\"\n [options]=\"validation.options\"\n ></ax-validation-rule>\n }\n @if (clearButton()) {\n <ax-clear-button></ax-clear-button>\n }\n </ax-datetime-box>\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: AXValidationModule }, { kind: "ngmodule", type: AXDateTimeBoxModule }, { kind: "component", type: i3$2.AXDateTimeBoxComponent, selector: "ax-datetime-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "depth", "id", "type", "look", "holidayDates", "allowTyping", "picker", "calendar", "weekend", "weekdays", "calendarLook", "yearRange", "boxLook", "format"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "onOpened", "onClosed", "readonlyChange", "disabledChange", "formatChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i3.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: AXTranslationModule }, { kind: "component", type: AXPFilterOperationsComponent, selector: "axp-filter-operations", inputs: ["selectedOperation", "type", "operations"], outputs: ["selectedOperationChange"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4294
4297
|
}
|
|
4295
4298
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPDateTimeBoxWidgetEditComponent, decorators: [{
|
|
4296
4299
|
type: Component,
|
|
@@ -4537,7 +4540,7 @@ class AXPEditorJsWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
4537
4540
|
></ax-validation-rule>
|
|
4538
4541
|
}
|
|
4539
4542
|
</ax-editor>
|
|
4540
|
-
`, isInline: true, dependencies: [{ kind: "component", type: AXEditorComponent, selector: "ax-editor", inputs: ["look", "readonly", "disabled", "value", "modules", "imageConfig"], outputs: ["onValueChanged"] }, { kind: "ngmodule", type: AXValidationModule }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type:
|
|
4543
|
+
`, isInline: true, dependencies: [{ kind: "component", type: AXEditorComponent, selector: "ax-editor", inputs: ["look", "readonly", "disabled", "value", "modules", "imageConfig"], outputs: ["onValueChanged"] }, { kind: "ngmodule", type: AXValidationModule }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
4541
4544
|
}
|
|
4542
4545
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPEditorJsWidgetEditComponent, decorators: [{
|
|
4543
4546
|
type: Component,
|
|
@@ -4805,7 +4808,7 @@ class AXPLargeTextWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
4805
4808
|
}
|
|
4806
4809
|
</div>
|
|
4807
4810
|
</div>
|
|
4808
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type:
|
|
4811
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: AXTextAreaModule }, { kind: "component", type: i4$1.AXTextAreaComponent, selector: "ax-text-area", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "placeholder", "maxLength", "look", "rows", "allowResize", "showCounter", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.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$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4809
4812
|
}
|
|
4810
4813
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPLargeTextWidgetEditComponent, decorators: [{
|
|
4811
4814
|
type: Component,
|
|
@@ -5202,7 +5205,7 @@ class AXPNumberBoxWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
5202
5205
|
</ax-button>
|
|
5203
5206
|
}
|
|
5204
5207
|
</div>
|
|
5205
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AXNumberBoxModule }, { kind: "component", type: i1$7.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "minValue", "maxValue", "showSpinButtons", "thousandsSeparator", "decimals", "changeOnScroll", "step"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "thousandsSeparatorChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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: AXFormModule }, { kind: "directive", type:
|
|
5208
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AXNumberBoxModule }, { kind: "component", type: i1$7.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "minValue", "maxValue", "showSpinButtons", "thousandsSeparator", "decimals", "changeOnScroll", "step"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "thousandsSeparatorChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.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: i6.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5206
5209
|
}
|
|
5207
5210
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPNumberBoxWidgetEditComponent, decorators: [{
|
|
5208
5211
|
type: Component,
|
|
@@ -5500,7 +5503,7 @@ class AXPPasswordBoxWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
5500
5503
|
<ax-clear-button></ax-clear-button>
|
|
5501
5504
|
}
|
|
5502
5505
|
</ax-password-box>
|
|
5503
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "ngmodule", type: AXPasswordBoxModule }, { kind: "component", type: i3$
|
|
5506
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "ngmodule", type: AXPasswordBoxModule }, { kind: "component", type: i3$3.AXPasswordBoxComponent, selector: "ax-password-box", inputs: ["readonly", "disabled", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "autoComplete", "showToggleButton", "class"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXValidationModule }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5504
5507
|
}
|
|
5505
5508
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPPasswordBoxWidgetEditComponent, decorators: [{
|
|
5506
5509
|
type: Component,
|
|
@@ -5844,7 +5847,7 @@ class AXPProgressBarWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
5844
5847
|
</div>
|
|
5845
5848
|
}
|
|
5846
5849
|
</div>
|
|
5847
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type:
|
|
5850
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: AXRangeSliderModule }, { kind: "component", type: i3$4.AXRangeSliderComponent, selector: "ax-range-slider", inputs: ["disabled", "readonly", "orientation", "color", "values", "mode", "min", "max", "step", "snap", "tooltipMode", "snapMode", "hasStep", "hasSnap", "hasLable", "hasTooltip"], outputs: ["valuesChange"] }, { kind: "ngmodule", type: AXValidationModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5848
5851
|
}
|
|
5849
5852
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPProgressBarWidgetEditComponent, decorators: [{
|
|
5850
5853
|
type: Component,
|
|
@@ -6130,7 +6133,7 @@ class AXPRatePickerWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
6130
6133
|
></ax-validation-rule>
|
|
6131
6134
|
}
|
|
6132
6135
|
</ax-rate-picker>
|
|
6133
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type:
|
|
6136
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "component", type: AXRatePickerComponent, selector: "ax-rate-picker", inputs: ["readonly", "disabled", "iconName", "max", "step", "hasTransition"] }, { kind: "ngmodule", type: AXValidationModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6134
6137
|
}
|
|
6135
6138
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPRatePickerWidgetEditComponent, decorators: [{
|
|
6136
6139
|
type: Component,
|
|
@@ -6574,7 +6577,7 @@ class AXPRichTextWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
6574
6577
|
[options]="validation.options"
|
|
6575
6578
|
></ax-validation-rule>
|
|
6576
6579
|
}
|
|
6577
|
-
</ax-wysiwyg-container>`, isInline: true, dependencies: [{ 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: AXWysiwygModule }, { kind: "component", type: i2$5.AXWysiwygContainerComponent, selector: "ax-wysiwyg-container", inputs: ["look", "readonly", "disabled", "value", "placeHolder", "initialLine"], outputs: ["onValueChanged"] }, { kind: "component", type: i2$5.AXWysiwygViewComponent, selector: "ax-wysiwyg-view" }, { kind: "component", type: i2$5.AXWysiwygAlignmentComponent, selector: "ax-wysiwyg-alignment" }, { kind: "component", type: i2$5.AXWysiwygColorsComponent, selector: "ax-wysiwyg-colors" }, { kind: "component", type: i2$5.AXWysiwygFontStyleComponent, selector: "ax-wysiwyg-font-style" }, { kind: "component", type: i2$5.AXWysiwygHistoryComponent, selector: "ax-wysiwyg-history" }, { kind: "component", type: i2$5.AXWysiwygInsertComponent, selector: "ax-wysiwyg-insert" }, { kind: "component", type: i2$5.AXWysiwygListComponent, selector: "ax-wysiwyg-list" }, { kind: "component", type: i2$5.AXWysiwygToolbarComponent, selector: "ax-wysiwyg-toolbar" }, { kind: "ngmodule", type: AXValidationModule }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type:
|
|
6580
|
+
</ax-wysiwyg-container>`, isInline: true, dependencies: [{ 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: AXWysiwygModule }, { kind: "component", type: i2$5.AXWysiwygContainerComponent, selector: "ax-wysiwyg-container", inputs: ["look", "readonly", "disabled", "value", "placeHolder", "initialLine"], outputs: ["onValueChanged"] }, { kind: "component", type: i2$5.AXWysiwygViewComponent, selector: "ax-wysiwyg-view" }, { kind: "component", type: i2$5.AXWysiwygAlignmentComponent, selector: "ax-wysiwyg-alignment" }, { kind: "component", type: i2$5.AXWysiwygColorsComponent, selector: "ax-wysiwyg-colors" }, { kind: "component", type: i2$5.AXWysiwygFontStyleComponent, selector: "ax-wysiwyg-font-style" }, { kind: "component", type: i2$5.AXWysiwygHistoryComponent, selector: "ax-wysiwyg-history" }, { kind: "component", type: i2$5.AXWysiwygInsertComponent, selector: "ax-wysiwyg-insert" }, { kind: "component", type: i2$5.AXWysiwygListComponent, selector: "ax-wysiwyg-list" }, { kind: "component", type: i2$5.AXWysiwygToolbarComponent, selector: "ax-wysiwyg-toolbar" }, { kind: "ngmodule", type: AXValidationModule }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.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: i6.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
6578
6581
|
}
|
|
6579
6582
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPRichTextWidgetEditComponent, decorators: [{
|
|
6580
6583
|
type: Component,
|
|
@@ -6997,6 +7000,14 @@ class AXPSelectBoxWidgetEditComponent extends AXPDataListWidgetComponent {
|
|
|
6997
7000
|
this.refresh();
|
|
6998
7001
|
}, ...(ngDevMode ? [{ debugName: "#clearOnDataSourceChangedEffect" }] : /* istanbul ignore next */ []));
|
|
6999
7002
|
}
|
|
7003
|
+
/**
|
|
7004
|
+
* In filter mode the stored value is wrapped as `{ value, operation, displayText }`.
|
|
7005
|
+
* Item resolution in the base widget needs the unwrapped key(s), so expose the same
|
|
7006
|
+
* display value used by the template to avoid resolving items with an `undefined` key.
|
|
7007
|
+
*/
|
|
7008
|
+
resolveSelectedItemsValue() {
|
|
7009
|
+
return this.filterMode() ? this.selectFilterDisplayValue() : this.getValue();
|
|
7010
|
+
}
|
|
7000
7011
|
#focusEffect;
|
|
7001
7012
|
focus() {
|
|
7002
7013
|
this.shouldFocus.set(true);
|
|
@@ -7172,7 +7183,7 @@ class AXPSelectBoxWidgetEditComponent extends AXPDataListWidgetComponent {
|
|
|
7172
7183
|
></ax-validation-rule>
|
|
7173
7184
|
}
|
|
7174
7185
|
</ax-select-box>
|
|
7175
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i3
|
|
7186
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i3.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: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i5$1.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: AXTranslationModule }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7176
7187
|
}
|
|
7177
7188
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSelectBoxWidgetEditComponent, decorators: [{
|
|
7178
7189
|
type: Component,
|
|
@@ -7561,7 +7572,7 @@ class AXPSelectionListWidgetEditComponent extends AXPDataListWidgetComponent {
|
|
|
7561
7572
|
></ax-validation-rule>
|
|
7562
7573
|
}
|
|
7563
7574
|
</ax-selection-list>
|
|
7564
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXSelectionListModule }, { kind: "component", type: i2$4.AXSelectionListComponent, selector: "ax-selection-list", inputs: ["id", "name", "disabled", "readonly", "tabIndex", "size", "value", "valueField", "textField", "disabledField", "readonlyField", "multiple", "direction", "customTemplate", "showControl", "items", "look"], outputs: ["onValueChanged", "onBlur", "onFocus"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type:
|
|
7575
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXSelectionListModule }, { kind: "component", type: i2$4.AXSelectionListComponent, selector: "ax-selection-list", inputs: ["id", "name", "disabled", "readonly", "tabIndex", "size", "value", "valueField", "textField", "disabledField", "readonlyField", "multiple", "direction", "customTemplate", "showControl", "items", "look"], outputs: ["onValueChanged", "onBlur", "onFocus"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7565
7576
|
}
|
|
7566
7577
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSelectionListWidgetEditComponent, decorators: [{
|
|
7567
7578
|
type: Component,
|
|
@@ -7986,7 +7997,7 @@ class AXPTagEditorWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
7986
7997
|
</div>
|
|
7987
7998
|
</div>
|
|
7988
7999
|
</ng-template>
|
|
7989
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXTagBoxModule }, { kind: "component", type: i1$9.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: AXAutocompleteModule }, { kind: "component", type: i2$6.AXAutocompleteComponent, selector: "ax-autocomplete", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "delayTime", "itemHeight", "maxVisibleItems", "dataSource", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "listHeaderTemplate", "listFooterTemplate", "dropdownWidth"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemClick", "onItemSelected"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type:
|
|
8000
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXTagBoxModule }, { kind: "component", type: i1$9.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: AXAutocompleteModule }, { kind: "component", type: i2$6.AXAutocompleteComponent, selector: "ax-autocomplete", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "delayTime", "itemHeight", "maxVisibleItems", "dataSource", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "listHeaderTemplate", "listFooterTemplate", "dropdownWidth"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemClick", "onItemSelected"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { 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: AXValidationModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7990
8001
|
}
|
|
7991
8002
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPTagEditorWidgetEditComponent, decorators: [{
|
|
7992
8003
|
type: Component,
|
|
@@ -8360,7 +8371,7 @@ class AXPTemplateBoxWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
8360
8371
|
</div>
|
|
8361
8372
|
</div>
|
|
8362
8373
|
</div>
|
|
8363
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type:
|
|
8374
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: AXTextAreaModule }, { kind: "component", type: i4$1.AXTextAreaComponent, selector: "ax-text-area", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "placeholder", "maxLength", "look", "rows", "allowResize", "showCounter", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i5$2.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "placement", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.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$1.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1$1.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
8364
8375
|
}
|
|
8365
8376
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPTemplateBoxWidgetEditComponent, decorators: [{
|
|
8366
8377
|
type: Component,
|
|
@@ -8701,7 +8712,7 @@ class AXPTextBoxWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
8701
8712
|
}
|
|
8702
8713
|
</ax-text-box>
|
|
8703
8714
|
</div>
|
|
8704
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AXTextBoxModule }, { kind: "component", type: i1$6.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "maskPattern", "customTokens", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onMaskChanged"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type:
|
|
8715
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AXTextBoxModule }, { kind: "component", type: i1$6.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "maskPattern", "customTokens", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onMaskChanged"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { 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: AXValidationModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.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: i6.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
8705
8716
|
}
|
|
8706
8717
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPTextBoxWidgetEditComponent, decorators: [{
|
|
8707
8718
|
type: Component,
|
|
@@ -11646,6 +11657,802 @@ const AXPImageMarkerWidget = {
|
|
|
11646
11657
|
},
|
|
11647
11658
|
};
|
|
11648
11659
|
|
|
11660
|
+
//#region ---- Imports ----
|
|
11661
|
+
//#endregion
|
|
11662
|
+
//#region ---- Widget Config ----
|
|
11663
|
+
const AXPIntegrationConnectionsPanelWidget = {
|
|
11664
|
+
name: 'integration-connections-panel',
|
|
11665
|
+
title: '@platform-layout-widgets:widgets.integration-connections-panel.title',
|
|
11666
|
+
description: '@platform-layout-widgets:widgets.integration-connections-panel.description',
|
|
11667
|
+
icon: 'fa-light fa-plug',
|
|
11668
|
+
categories: [AXP_WIDGETS_ADVANCE_CATEGORY],
|
|
11669
|
+
subCategory: AXP_WIDGETS_ADVANCE_SUB_TOOLS,
|
|
11670
|
+
groups: [AXPWidgetGroupEnum.UtilityWidget],
|
|
11671
|
+
type: 'editor',
|
|
11672
|
+
properties: [AXP_NAME_PROPERTY],
|
|
11673
|
+
components: {
|
|
11674
|
+
edit: {
|
|
11675
|
+
component: () => Promise.resolve().then(function () { return integrationConnectionsPanelWidgetEdit_component; }).then((c) => c.AXPIntegrationConnectionsPanelWidgetEditComponent),
|
|
11676
|
+
},
|
|
11677
|
+
view: {
|
|
11678
|
+
component: () => Promise.resolve().then(function () { return integrationConnectionsPanelWidgetEdit_component; }).then((c) => c.AXPIntegrationConnectionsPanelWidgetEditComponent),
|
|
11679
|
+
},
|
|
11680
|
+
},
|
|
11681
|
+
};
|
|
11682
|
+
|
|
11683
|
+
//#region ---- Imports ----
|
|
11684
|
+
//#endregion
|
|
11685
|
+
//#region ---- Component ----
|
|
11686
|
+
class AXPIntegrationConnectionAuthMethodPopupComponent extends AXBasePageComponent {
|
|
11687
|
+
constructor() {
|
|
11688
|
+
super(...arguments);
|
|
11689
|
+
this.methods = [];
|
|
11690
|
+
}
|
|
11691
|
+
selectMethod(authMethodType) {
|
|
11692
|
+
this.close({ authMethodType });
|
|
11693
|
+
}
|
|
11694
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPIntegrationConnectionAuthMethodPopupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
11695
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPIntegrationConnectionAuthMethodPopupComponent, isStandalone: true, selector: "axp-integration-connection-auth-method-popup", usesInheritance: true, ngImport: i0, template: `
|
|
11696
|
+
<div class="ax-flex ax-flex-col ax-gap-2 ax-p-4">
|
|
11697
|
+
@for (method of methods; track method.type) {
|
|
11698
|
+
<ax-button
|
|
11699
|
+
look="outline"
|
|
11700
|
+
color="default"
|
|
11701
|
+
class="ax-w-full"
|
|
11702
|
+
[text]="method.label"
|
|
11703
|
+
(onClick)="selectMethod(method.type)"
|
|
11704
|
+
></ax-button>
|
|
11705
|
+
}
|
|
11706
|
+
</div>
|
|
11707
|
+
<ax-footer>
|
|
11708
|
+
<ax-suffix>
|
|
11709
|
+
<ax-button
|
|
11710
|
+
look="outline"
|
|
11711
|
+
[text]="'@general:actions.cancel.title' | translate | async"
|
|
11712
|
+
(onClick)="close()"
|
|
11713
|
+
></ax-button>
|
|
11714
|
+
</ax-suffix>
|
|
11715
|
+
</ax-footer>
|
|
11716
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.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.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: AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
11717
|
+
}
|
|
11718
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPIntegrationConnectionAuthMethodPopupComponent, decorators: [{
|
|
11719
|
+
type: Component,
|
|
11720
|
+
args: [{
|
|
11721
|
+
selector: 'axp-integration-connection-auth-method-popup',
|
|
11722
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
11723
|
+
imports: [AsyncPipe, AXButtonModule, AXDecoratorModule, AXTranslationModule],
|
|
11724
|
+
template: `
|
|
11725
|
+
<div class="ax-flex ax-flex-col ax-gap-2 ax-p-4">
|
|
11726
|
+
@for (method of methods; track method.type) {
|
|
11727
|
+
<ax-button
|
|
11728
|
+
look="outline"
|
|
11729
|
+
color="default"
|
|
11730
|
+
class="ax-w-full"
|
|
11731
|
+
[text]="method.label"
|
|
11732
|
+
(onClick)="selectMethod(method.type)"
|
|
11733
|
+
></ax-button>
|
|
11734
|
+
}
|
|
11735
|
+
</div>
|
|
11736
|
+
<ax-footer>
|
|
11737
|
+
<ax-suffix>
|
|
11738
|
+
<ax-button
|
|
11739
|
+
look="outline"
|
|
11740
|
+
[text]="'@general:actions.cancel.title' | translate | async"
|
|
11741
|
+
(onClick)="close()"
|
|
11742
|
+
></ax-button>
|
|
11743
|
+
</ax-suffix>
|
|
11744
|
+
</ax-footer>
|
|
11745
|
+
`,
|
|
11746
|
+
}]
|
|
11747
|
+
}] });
|
|
11748
|
+
|
|
11749
|
+
//#endregion
|
|
11750
|
+
//#region ---- Component ----
|
|
11751
|
+
class AXPIntegrationConnectionConnectPopupComponent extends AXBasePageComponent {
|
|
11752
|
+
constructor() {
|
|
11753
|
+
super(...arguments);
|
|
11754
|
+
this.displayName = signal('', ...(ngDevMode ? [{ debugName: "displayName" }] : /* istanbul ignore next */ []));
|
|
11755
|
+
this.instanceUrl = signal('', ...(ngDevMode ? [{ debugName: "instanceUrl" }] : /* istanbul ignore next */ []));
|
|
11756
|
+
this.credentialPrimary = signal('', ...(ngDevMode ? [{ debugName: "credentialPrimary" }] : /* istanbul ignore next */ []));
|
|
11757
|
+
this.credentialSecondary = signal('', ...(ngDevMode ? [{ debugName: "credentialSecondary" }] : /* istanbul ignore next */ []));
|
|
11758
|
+
}
|
|
11759
|
+
isOAuth() {
|
|
11760
|
+
return this.authMethodType === AXP_INTEGRATION_AUTH_METHOD_TYPE.OAuth2;
|
|
11761
|
+
}
|
|
11762
|
+
showSecondaryCredential() {
|
|
11763
|
+
return (this.authMethodType === AXP_INTEGRATION_AUTH_METHOD_TYPE.Basic ||
|
|
11764
|
+
this.authMethodType === AXP_INTEGRATION_AUTH_METHOD_TYPE.ApiToken);
|
|
11765
|
+
}
|
|
11766
|
+
primaryCredentialLabelKey() {
|
|
11767
|
+
if (this.authMethodType === AXP_INTEGRATION_AUTH_METHOD_TYPE.Basic) {
|
|
11768
|
+
return `${this.i18nPrefix}.fields.username`;
|
|
11769
|
+
}
|
|
11770
|
+
if (this.authMethodType === AXP_INTEGRATION_AUTH_METHOD_TYPE.ApiToken) {
|
|
11771
|
+
return `${this.i18nPrefix}.fields.email`;
|
|
11772
|
+
}
|
|
11773
|
+
return `${this.i18nPrefix}.fields.token`;
|
|
11774
|
+
}
|
|
11775
|
+
primaryCredentialPlaceholderKey() {
|
|
11776
|
+
if (this.authMethodType === AXP_INTEGRATION_AUTH_METHOD_TYPE.Basic) {
|
|
11777
|
+
return `${this.i18nPrefix}.placeholders.username`;
|
|
11778
|
+
}
|
|
11779
|
+
if (this.authMethodType === AXP_INTEGRATION_AUTH_METHOD_TYPE.ApiToken) {
|
|
11780
|
+
return `${this.i18nPrefix}.placeholders.email`;
|
|
11781
|
+
}
|
|
11782
|
+
return `${this.i18nPrefix}.placeholders.token`;
|
|
11783
|
+
}
|
|
11784
|
+
secondaryCredentialLabelKey() {
|
|
11785
|
+
if (this.authMethodType === AXP_INTEGRATION_AUTH_METHOD_TYPE.ApiToken) {
|
|
11786
|
+
return `${this.i18nPrefix}.fields.api-token`;
|
|
11787
|
+
}
|
|
11788
|
+
return `${this.i18nPrefix}.fields.password`;
|
|
11789
|
+
}
|
|
11790
|
+
secondaryCredentialPlaceholderKey() {
|
|
11791
|
+
if (this.authMethodType === AXP_INTEGRATION_AUTH_METHOD_TYPE.ApiToken) {
|
|
11792
|
+
return `${this.i18nPrefix}.placeholders.api-token`;
|
|
11793
|
+
}
|
|
11794
|
+
return `${this.i18nPrefix}.placeholders.password`;
|
|
11795
|
+
}
|
|
11796
|
+
handleDisplayNameChange(event) {
|
|
11797
|
+
if (!event.isUserInteraction) {
|
|
11798
|
+
return;
|
|
11799
|
+
}
|
|
11800
|
+
this.displayName.set(event.value ?? '');
|
|
11801
|
+
}
|
|
11802
|
+
handleInstanceUrlChange(event) {
|
|
11803
|
+
if (!event.isUserInteraction) {
|
|
11804
|
+
return;
|
|
11805
|
+
}
|
|
11806
|
+
this.instanceUrl.set(event.value ?? '');
|
|
11807
|
+
}
|
|
11808
|
+
handleCredentialPrimaryChange(event) {
|
|
11809
|
+
if (!event.isUserInteraction) {
|
|
11810
|
+
return;
|
|
11811
|
+
}
|
|
11812
|
+
this.credentialPrimary.set(event.value ?? '');
|
|
11813
|
+
}
|
|
11814
|
+
handleCredentialSecondaryChange(event) {
|
|
11815
|
+
if (!event.isUserInteraction) {
|
|
11816
|
+
return;
|
|
11817
|
+
}
|
|
11818
|
+
this.credentialSecondary.set(event.value ?? '');
|
|
11819
|
+
}
|
|
11820
|
+
confirmOAuth() {
|
|
11821
|
+
this.close({ confirmed: true });
|
|
11822
|
+
}
|
|
11823
|
+
saveCredentials() {
|
|
11824
|
+
this.close({
|
|
11825
|
+
displayName: this.displayName(),
|
|
11826
|
+
instanceUrl: this.instanceUrl(),
|
|
11827
|
+
credentialPrimary: this.credentialPrimary(),
|
|
11828
|
+
credentialSecondary: this.credentialSecondary(),
|
|
11829
|
+
});
|
|
11830
|
+
}
|
|
11831
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPIntegrationConnectionConnectPopupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
11832
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPIntegrationConnectionConnectPopupComponent, isStandalone: true, selector: "axp-integration-connection-connect-popup", usesInheritance: true, ngImport: i0, template: `
|
|
11833
|
+
@if (isOAuth()) {
|
|
11834
|
+
<div class="ax-p-4 ax-text-sm ax-opacity-80">
|
|
11835
|
+
{{ i18nPrefix + '.dialogs.oauth.description' | translate | async }}
|
|
11836
|
+
</div>
|
|
11837
|
+
<ax-footer>
|
|
11838
|
+
<ax-suffix>
|
|
11839
|
+
<ax-button
|
|
11840
|
+
look="outline"
|
|
11841
|
+
[text]="'@general:actions.cancel.title' | translate | async"
|
|
11842
|
+
(onClick)="close()"
|
|
11843
|
+
></ax-button>
|
|
11844
|
+
<ax-button
|
|
11845
|
+
color="primary"
|
|
11846
|
+
[text]="i18nPrefix + '.actions.connect' | translate | async"
|
|
11847
|
+
(onClick)="confirmOAuth()"
|
|
11848
|
+
>
|
|
11849
|
+
<ax-suffix>
|
|
11850
|
+
<ax-icon>
|
|
11851
|
+
<i class="fa-light fa-arrow-up-right-from-square"></i>
|
|
11852
|
+
</ax-icon>
|
|
11853
|
+
</ax-suffix>
|
|
11854
|
+
</ax-button>
|
|
11855
|
+
</ax-suffix>
|
|
11856
|
+
</ax-footer>
|
|
11857
|
+
} @else {
|
|
11858
|
+
<div class="ax-flex ax-flex-col ax-gap-3 ax-p-4">
|
|
11859
|
+
<ax-form-field>
|
|
11860
|
+
<ax-label>{{ i18nPrefix + '.fields.display-name' | translate | async }}</ax-label>
|
|
11861
|
+
<ax-text-box
|
|
11862
|
+
[ngModel]="displayName()"
|
|
11863
|
+
[placeholder]="(i18nPrefix + '.placeholders.display-name' | translate | async) ?? ''"
|
|
11864
|
+
(onValueChanged)="handleDisplayNameChange($event)"
|
|
11865
|
+
></ax-text-box>
|
|
11866
|
+
</ax-form-field>
|
|
11867
|
+
|
|
11868
|
+
<ax-form-field>
|
|
11869
|
+
<ax-label>{{ i18nPrefix + '.fields.instance-url' | translate | async }}</ax-label>
|
|
11870
|
+
<ax-text-box
|
|
11871
|
+
[ngModel]="instanceUrl()"
|
|
11872
|
+
[placeholder]="(i18nPrefix + '.placeholders.instance-url' | translate | async) ?? ''"
|
|
11873
|
+
(onValueChanged)="handleInstanceUrlChange($event)"
|
|
11874
|
+
></ax-text-box>
|
|
11875
|
+
</ax-form-field>
|
|
11876
|
+
|
|
11877
|
+
<ax-form-field>
|
|
11878
|
+
<ax-label>{{ primaryCredentialLabelKey() | translate | async }}</ax-label>
|
|
11879
|
+
<ax-text-box
|
|
11880
|
+
[ngModel]="credentialPrimary()"
|
|
11881
|
+
[placeholder]="primaryCredentialPlaceholderKey() | translate | async"
|
|
11882
|
+
(onValueChanged)="handleCredentialPrimaryChange($event)"
|
|
11883
|
+
></ax-text-box>
|
|
11884
|
+
</ax-form-field>
|
|
11885
|
+
|
|
11886
|
+
@if (showSecondaryCredential()) {
|
|
11887
|
+
<ax-form-field>
|
|
11888
|
+
<ax-label>{{ secondaryCredentialLabelKey() | translate | async }}</ax-label>
|
|
11889
|
+
<ax-password-box
|
|
11890
|
+
[ngModel]="credentialSecondary()"
|
|
11891
|
+
[placeholder]="secondaryCredentialPlaceholderKey() | translate | async"
|
|
11892
|
+
(onValueChanged)="handleCredentialSecondaryChange($event)"
|
|
11893
|
+
></ax-password-box>
|
|
11894
|
+
</ax-form-field>
|
|
11895
|
+
}
|
|
11896
|
+
</div>
|
|
11897
|
+
<ax-footer>
|
|
11898
|
+
<ax-suffix>
|
|
11899
|
+
<ax-button
|
|
11900
|
+
look="outline"
|
|
11901
|
+
[text]="'@general:actions.cancel.title' | translate | async"
|
|
11902
|
+
(onClick)="close()"
|
|
11903
|
+
></ax-button>
|
|
11904
|
+
<ax-button
|
|
11905
|
+
color="primary"
|
|
11906
|
+
[text]="i18nPrefix + '.actions.save-connection' | translate | async"
|
|
11907
|
+
(onClick)="saveCredentials()"
|
|
11908
|
+
></ax-button>
|
|
11909
|
+
</ax-suffix>
|
|
11910
|
+
</ax-footer>
|
|
11911
|
+
}
|
|
11912
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.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: AXFormModule }, { kind: "component", type: i4.AXFormFieldComponent, selector: "ax-form-field", inputs: ["labelMode"] }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i2.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXPasswordBoxModule }, { kind: "component", type: i3$3.AXPasswordBoxComponent, selector: "ax-password-box", inputs: ["readonly", "disabled", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "autoComplete", "showToggleButton", "class"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXTextBoxModule }, { kind: "component", type: i1$6.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "maskPattern", "customTokens", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onMaskChanged"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
11913
|
+
}
|
|
11914
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPIntegrationConnectionConnectPopupComponent, decorators: [{
|
|
11915
|
+
type: Component,
|
|
11916
|
+
args: [{
|
|
11917
|
+
selector: 'axp-integration-connection-connect-popup',
|
|
11918
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
11919
|
+
imports: [
|
|
11920
|
+
AsyncPipe,
|
|
11921
|
+
FormsModule,
|
|
11922
|
+
AXButtonModule,
|
|
11923
|
+
AXDecoratorModule,
|
|
11924
|
+
AXFormModule,
|
|
11925
|
+
AXLabelModule,
|
|
11926
|
+
AXPasswordBoxModule,
|
|
11927
|
+
AXTextBoxModule,
|
|
11928
|
+
AXTranslationModule,
|
|
11929
|
+
],
|
|
11930
|
+
template: `
|
|
11931
|
+
@if (isOAuth()) {
|
|
11932
|
+
<div class="ax-p-4 ax-text-sm ax-opacity-80">
|
|
11933
|
+
{{ i18nPrefix + '.dialogs.oauth.description' | translate | async }}
|
|
11934
|
+
</div>
|
|
11935
|
+
<ax-footer>
|
|
11936
|
+
<ax-suffix>
|
|
11937
|
+
<ax-button
|
|
11938
|
+
look="outline"
|
|
11939
|
+
[text]="'@general:actions.cancel.title' | translate | async"
|
|
11940
|
+
(onClick)="close()"
|
|
11941
|
+
></ax-button>
|
|
11942
|
+
<ax-button
|
|
11943
|
+
color="primary"
|
|
11944
|
+
[text]="i18nPrefix + '.actions.connect' | translate | async"
|
|
11945
|
+
(onClick)="confirmOAuth()"
|
|
11946
|
+
>
|
|
11947
|
+
<ax-suffix>
|
|
11948
|
+
<ax-icon>
|
|
11949
|
+
<i class="fa-light fa-arrow-up-right-from-square"></i>
|
|
11950
|
+
</ax-icon>
|
|
11951
|
+
</ax-suffix>
|
|
11952
|
+
</ax-button>
|
|
11953
|
+
</ax-suffix>
|
|
11954
|
+
</ax-footer>
|
|
11955
|
+
} @else {
|
|
11956
|
+
<div class="ax-flex ax-flex-col ax-gap-3 ax-p-4">
|
|
11957
|
+
<ax-form-field>
|
|
11958
|
+
<ax-label>{{ i18nPrefix + '.fields.display-name' | translate | async }}</ax-label>
|
|
11959
|
+
<ax-text-box
|
|
11960
|
+
[ngModel]="displayName()"
|
|
11961
|
+
[placeholder]="(i18nPrefix + '.placeholders.display-name' | translate | async) ?? ''"
|
|
11962
|
+
(onValueChanged)="handleDisplayNameChange($event)"
|
|
11963
|
+
></ax-text-box>
|
|
11964
|
+
</ax-form-field>
|
|
11965
|
+
|
|
11966
|
+
<ax-form-field>
|
|
11967
|
+
<ax-label>{{ i18nPrefix + '.fields.instance-url' | translate | async }}</ax-label>
|
|
11968
|
+
<ax-text-box
|
|
11969
|
+
[ngModel]="instanceUrl()"
|
|
11970
|
+
[placeholder]="(i18nPrefix + '.placeholders.instance-url' | translate | async) ?? ''"
|
|
11971
|
+
(onValueChanged)="handleInstanceUrlChange($event)"
|
|
11972
|
+
></ax-text-box>
|
|
11973
|
+
</ax-form-field>
|
|
11974
|
+
|
|
11975
|
+
<ax-form-field>
|
|
11976
|
+
<ax-label>{{ primaryCredentialLabelKey() | translate | async }}</ax-label>
|
|
11977
|
+
<ax-text-box
|
|
11978
|
+
[ngModel]="credentialPrimary()"
|
|
11979
|
+
[placeholder]="primaryCredentialPlaceholderKey() | translate | async"
|
|
11980
|
+
(onValueChanged)="handleCredentialPrimaryChange($event)"
|
|
11981
|
+
></ax-text-box>
|
|
11982
|
+
</ax-form-field>
|
|
11983
|
+
|
|
11984
|
+
@if (showSecondaryCredential()) {
|
|
11985
|
+
<ax-form-field>
|
|
11986
|
+
<ax-label>{{ secondaryCredentialLabelKey() | translate | async }}</ax-label>
|
|
11987
|
+
<ax-password-box
|
|
11988
|
+
[ngModel]="credentialSecondary()"
|
|
11989
|
+
[placeholder]="secondaryCredentialPlaceholderKey() | translate | async"
|
|
11990
|
+
(onValueChanged)="handleCredentialSecondaryChange($event)"
|
|
11991
|
+
></ax-password-box>
|
|
11992
|
+
</ax-form-field>
|
|
11993
|
+
}
|
|
11994
|
+
</div>
|
|
11995
|
+
<ax-footer>
|
|
11996
|
+
<ax-suffix>
|
|
11997
|
+
<ax-button
|
|
11998
|
+
look="outline"
|
|
11999
|
+
[text]="'@general:actions.cancel.title' | translate | async"
|
|
12000
|
+
(onClick)="close()"
|
|
12001
|
+
></ax-button>
|
|
12002
|
+
<ax-button
|
|
12003
|
+
color="primary"
|
|
12004
|
+
[text]="i18nPrefix + '.actions.save-connection' | translate | async"
|
|
12005
|
+
(onClick)="saveCredentials()"
|
|
12006
|
+
></ax-button>
|
|
12007
|
+
</ax-suffix>
|
|
12008
|
+
</ax-footer>
|
|
12009
|
+
}
|
|
12010
|
+
`,
|
|
12011
|
+
}]
|
|
12012
|
+
}] });
|
|
12013
|
+
|
|
12014
|
+
//#region ---- Imports ----
|
|
12015
|
+
//#endregion
|
|
12016
|
+
//#region ---- Component ----
|
|
12017
|
+
class AXPIntegrationConnectionsPanelWidgetEditComponent extends AXPValueWidgetComponent {
|
|
12018
|
+
//#endregion
|
|
12019
|
+
//#region ---- Lifecycle ----
|
|
12020
|
+
constructor() {
|
|
12021
|
+
super();
|
|
12022
|
+
//#region ---- Constants ----
|
|
12023
|
+
this.I18N = '@platform-layout-widgets:widgets.integration-connections-panel';
|
|
12024
|
+
//#endregion
|
|
12025
|
+
//#region ---- Services & Dependencies ----
|
|
12026
|
+
this.queryService = inject(AXPQueryService);
|
|
12027
|
+
this.commandService = inject(AXPCommandService);
|
|
12028
|
+
this.sessionService = inject(AXPSessionService);
|
|
12029
|
+
this.providerRegistry = inject(AXPIntegrationProviderRegistryService);
|
|
12030
|
+
this.translationService = inject(AXTranslationService);
|
|
12031
|
+
this.popupService = inject(AXPopupService);
|
|
12032
|
+
//#endregion
|
|
12033
|
+
//#region ---- Computed ----
|
|
12034
|
+
this.providerIdFilter = computed(() => this.options()['providerId'], ...(ngDevMode ? [{ debugName: "providerIdFilter" }] : /* istanbul ignore next */ []));
|
|
12035
|
+
this.visibleProviders = computed(() => {
|
|
12036
|
+
const filter = this.providerIdFilter();
|
|
12037
|
+
const list = this.providers();
|
|
12038
|
+
if (!filter) {
|
|
12039
|
+
return list;
|
|
12040
|
+
}
|
|
12041
|
+
return list.filter((provider) => provider.id === filter);
|
|
12042
|
+
}, ...(ngDevMode ? [{ debugName: "visibleProviders" }] : /* istanbul ignore next */ []));
|
|
12043
|
+
//#endregion
|
|
12044
|
+
//#region ---- State ----
|
|
12045
|
+
this.loading = signal(true, ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
|
|
12046
|
+
this.providers = signal([], ...(ngDevMode ? [{ debugName: "providers" }] : /* istanbul ignore next */ []));
|
|
12047
|
+
this.connections = signal([], ...(ngDevMode ? [{ debugName: "connections" }] : /* istanbul ignore next */ []));
|
|
12048
|
+
this.authMethodOptions = signal({}, ...(ngDevMode ? [{ debugName: "authMethodOptions" }] : /* istanbul ignore next */ []));
|
|
12049
|
+
this.selectedAuthMethod = signal({}, ...(ngDevMode ? [{ debugName: "selectedAuthMethod" }] : /* istanbul ignore next */ []));
|
|
12050
|
+
this.formDisplayName = signal({}, ...(ngDevMode ? [{ debugName: "formDisplayName" }] : /* istanbul ignore next */ []));
|
|
12051
|
+
this.formInstanceUrl = signal({}, ...(ngDevMode ? [{ debugName: "formInstanceUrl" }] : /* istanbul ignore next */ []));
|
|
12052
|
+
this.formCredentialPrimary = signal({}, ...(ngDevMode ? [{ debugName: "formCredentialPrimary" }] : /* istanbul ignore next */ []));
|
|
12053
|
+
this.translationService.langChanges$.subscribe(() => {
|
|
12054
|
+
void this.refreshAuthMethodOptions(this.providers());
|
|
12055
|
+
});
|
|
12056
|
+
void this.load();
|
|
12057
|
+
}
|
|
12058
|
+
//#endregion
|
|
12059
|
+
//#region ---- Connection Helpers ----
|
|
12060
|
+
getConnection(providerId) {
|
|
12061
|
+
return this.connections().find((item) => item.providerId === providerId);
|
|
12062
|
+
}
|
|
12063
|
+
isConnectedOAuth(providerId) {
|
|
12064
|
+
const connection = this.getConnection(providerId);
|
|
12065
|
+
return connection?.authMethodType === AXP_INTEGRATION_AUTH_METHOD_TYPE.OAuth2;
|
|
12066
|
+
}
|
|
12067
|
+
connectedPrimaryValue(providerId) {
|
|
12068
|
+
const connection = this.getConnection(providerId);
|
|
12069
|
+
return defaultTo(this.formCredentialPrimary()[providerId], defaultTo(connection?.externalAccountName, ''));
|
|
12070
|
+
}
|
|
12071
|
+
connectedSecretPreview(providerId) {
|
|
12072
|
+
return defaultTo(this.getConnection(providerId)?.secretPreview, '');
|
|
12073
|
+
}
|
|
12074
|
+
//#endregion
|
|
12075
|
+
//#region ---- Auth Method Helpers ----
|
|
12076
|
+
hasMultipleAuthMethods(provider) {
|
|
12077
|
+
return provider.authMethodTypes.length > 1;
|
|
12078
|
+
}
|
|
12079
|
+
isOAuth(providerId) {
|
|
12080
|
+
return this.selectedAuthMethod()[providerId] === AXP_INTEGRATION_AUTH_METHOD_TYPE.OAuth2;
|
|
12081
|
+
}
|
|
12082
|
+
isBasic(providerId) {
|
|
12083
|
+
return this.selectedAuthMethod()[providerId] === AXP_INTEGRATION_AUTH_METHOD_TYPE.Basic;
|
|
12084
|
+
}
|
|
12085
|
+
isApiToken(providerId) {
|
|
12086
|
+
return this.selectedAuthMethod()[providerId] === AXP_INTEGRATION_AUTH_METHOD_TYPE.ApiToken;
|
|
12087
|
+
}
|
|
12088
|
+
showSecondaryCredential(providerId) {
|
|
12089
|
+
return this.isBasic(providerId) || this.isApiToken(providerId);
|
|
12090
|
+
}
|
|
12091
|
+
primaryCredentialLabelKey(providerId) {
|
|
12092
|
+
if (this.isBasic(providerId)) {
|
|
12093
|
+
return `${this.I18N}.fields.username`;
|
|
12094
|
+
}
|
|
12095
|
+
if (this.isApiToken(providerId)) {
|
|
12096
|
+
return `${this.I18N}.fields.email`;
|
|
12097
|
+
}
|
|
12098
|
+
return `${this.I18N}.fields.token`;
|
|
12099
|
+
}
|
|
12100
|
+
secondaryCredentialLabelKey(providerId) {
|
|
12101
|
+
if (this.isApiToken(providerId)) {
|
|
12102
|
+
return `${this.I18N}.fields.api-token`;
|
|
12103
|
+
}
|
|
12104
|
+
return `${this.I18N}.fields.password`;
|
|
12105
|
+
}
|
|
12106
|
+
//#endregion
|
|
12107
|
+
//#region ---- Connect Flow ----
|
|
12108
|
+
async handleConnect(provider) {
|
|
12109
|
+
let authMethodType = provider.authMethodTypes[0];
|
|
12110
|
+
if (this.hasMultipleAuthMethods(provider)) {
|
|
12111
|
+
const selected = await this.openAuthMethodPicker(provider);
|
|
12112
|
+
if (!selected) {
|
|
12113
|
+
return;
|
|
12114
|
+
}
|
|
12115
|
+
authMethodType = selected;
|
|
12116
|
+
}
|
|
12117
|
+
this.setAuthMethod(provider.id, authMethodType);
|
|
12118
|
+
await this.openConnectPopup(provider, authMethodType);
|
|
12119
|
+
}
|
|
12120
|
+
async openAuthMethodPicker(provider) {
|
|
12121
|
+
const title = await this.translationService.translateAsync(`${this.I18N}.dialogs.select-auth-method.title`);
|
|
12122
|
+
const result = await this.popupService.open(AXPIntegrationConnectionAuthMethodPopupComponent, {
|
|
12123
|
+
title,
|
|
12124
|
+
size: 'sm',
|
|
12125
|
+
data: {
|
|
12126
|
+
methods: this.authMethodOptions()[provider.id] ?? [],
|
|
12127
|
+
},
|
|
12128
|
+
});
|
|
12129
|
+
return result?.data?.authMethodType ?? null;
|
|
12130
|
+
}
|
|
12131
|
+
async openConnectPopup(provider, authMethodType) {
|
|
12132
|
+
const isOAuth = authMethodType === AXP_INTEGRATION_AUTH_METHOD_TYPE.OAuth2;
|
|
12133
|
+
const titleKey = isOAuth
|
|
12134
|
+
? `${this.I18N}.dialogs.oauth.title`
|
|
12135
|
+
: `${this.I18N}.dialogs.credentials.title`;
|
|
12136
|
+
const title = await this.translationService.translateAsync(titleKey);
|
|
12137
|
+
const result = await this.popupService.open(AXPIntegrationConnectionConnectPopupComponent, {
|
|
12138
|
+
title,
|
|
12139
|
+
size: isOAuth ? 'sm' : 'md',
|
|
12140
|
+
data: {
|
|
12141
|
+
authMethodType,
|
|
12142
|
+
i18nPrefix: this.I18N,
|
|
12143
|
+
providerDisplayName: provider.displayName,
|
|
12144
|
+
},
|
|
12145
|
+
});
|
|
12146
|
+
if (!result?.data) {
|
|
12147
|
+
return;
|
|
12148
|
+
}
|
|
12149
|
+
if (isOAuth) {
|
|
12150
|
+
if (get(result.data, 'confirmed')) {
|
|
12151
|
+
await this.startOAuth(provider);
|
|
12152
|
+
}
|
|
12153
|
+
return;
|
|
12154
|
+
}
|
|
12155
|
+
await this.connectWithCredentials(provider, authMethodType, result.data);
|
|
12156
|
+
}
|
|
12157
|
+
//#endregion
|
|
12158
|
+
//#region ---- Connection Actions ----
|
|
12159
|
+
async connectWithCredentials(provider, authMethodType, form) {
|
|
12160
|
+
const credentials = authMethodType === AXP_INTEGRATION_AUTH_METHOD_TYPE.Basic
|
|
12161
|
+
? { username: form.credentialPrimary, password: form.credentialSecondary }
|
|
12162
|
+
: authMethodType === AXP_INTEGRATION_AUTH_METHOD_TYPE.ApiToken
|
|
12163
|
+
? { email: form.credentialPrimary, apiToken: form.credentialSecondary }
|
|
12164
|
+
: { token: form.credentialPrimary };
|
|
12165
|
+
await this.commandService.execute('IntegrationManagement.Connection:ConnectWithCredentials', {
|
|
12166
|
+
providerId: provider.id,
|
|
12167
|
+
authMethodType,
|
|
12168
|
+
connectionScope: 'user',
|
|
12169
|
+
displayName: defaultTo(form.displayName, provider.id),
|
|
12170
|
+
instanceUrl: form.instanceUrl,
|
|
12171
|
+
credentials,
|
|
12172
|
+
});
|
|
12173
|
+
await this.load();
|
|
12174
|
+
}
|
|
12175
|
+
async startOAuth(provider) {
|
|
12176
|
+
const appName = this.sessionService.application?.name ?? 'demo';
|
|
12177
|
+
const redirectUri = `${window.location.origin}/${appName}/integrations/oauth/callback/${provider.id}`;
|
|
12178
|
+
const result = await this.commandService.execute('IntegrationManagement.Connection:StartOAuthAuthorization', {
|
|
12179
|
+
providerId: provider.id,
|
|
12180
|
+
connectionScope: 'user',
|
|
12181
|
+
displayName: provider.id,
|
|
12182
|
+
redirectUri,
|
|
12183
|
+
});
|
|
12184
|
+
const redirectUrl = get(result, 'data.redirectUrl');
|
|
12185
|
+
if (redirectUrl) {
|
|
12186
|
+
window.location.assign(redirectUrl);
|
|
12187
|
+
}
|
|
12188
|
+
}
|
|
12189
|
+
async disconnect(providerId) {
|
|
12190
|
+
const connection = this.getConnection(providerId);
|
|
12191
|
+
if (!connection) {
|
|
12192
|
+
return;
|
|
12193
|
+
}
|
|
12194
|
+
await this.commandService.execute('IntegrationManagement.Connection:Disconnect', {
|
|
12195
|
+
connectionId: connection.id,
|
|
12196
|
+
});
|
|
12197
|
+
await this.load();
|
|
12198
|
+
}
|
|
12199
|
+
//#endregion
|
|
12200
|
+
//#region ---- Form State ----
|
|
12201
|
+
setAuthMethod(providerId, method) {
|
|
12202
|
+
this.selectedAuthMethod.update((state) => ({ ...state, [providerId]: method }));
|
|
12203
|
+
}
|
|
12204
|
+
populateConnectionFormState(providers, connections) {
|
|
12205
|
+
const authDefaults = {};
|
|
12206
|
+
const displayNames = {};
|
|
12207
|
+
const instanceUrls = {};
|
|
12208
|
+
const credentialPrimary = {};
|
|
12209
|
+
for (const provider of providers) {
|
|
12210
|
+
authDefaults[provider.id] = provider.authMethodTypes[0];
|
|
12211
|
+
}
|
|
12212
|
+
for (const connection of connections) {
|
|
12213
|
+
authDefaults[connection.providerId] = connection.authMethodType;
|
|
12214
|
+
displayNames[connection.providerId] = connection.displayName;
|
|
12215
|
+
instanceUrls[connection.providerId] = defaultTo(connection.instanceUrl, '');
|
|
12216
|
+
if (connection.externalAccountName) {
|
|
12217
|
+
credentialPrimary[connection.providerId] = connection.externalAccountName;
|
|
12218
|
+
}
|
|
12219
|
+
}
|
|
12220
|
+
this.selectedAuthMethod.set(authDefaults);
|
|
12221
|
+
this.formDisplayName.set(displayNames);
|
|
12222
|
+
this.formInstanceUrl.set(instanceUrls);
|
|
12223
|
+
this.formCredentialPrimary.set(credentialPrimary);
|
|
12224
|
+
}
|
|
12225
|
+
//#endregion
|
|
12226
|
+
//#region ---- Data Loading ----
|
|
12227
|
+
async load() {
|
|
12228
|
+
this.loading.set(true);
|
|
12229
|
+
try {
|
|
12230
|
+
const providersResult = await this.queryService.fetch('IntegrationManagement.Provider:List', { includeConnectionStatus: true });
|
|
12231
|
+
const connectionsResult = await this.queryService.fetch('IntegrationManagement.Connection:ListMine', {});
|
|
12232
|
+
const providers = providersResult ?? [];
|
|
12233
|
+
const connections = connectionsResult ?? [];
|
|
12234
|
+
this.providers.set(providers);
|
|
12235
|
+
this.connections.set(connections);
|
|
12236
|
+
this.populateConnectionFormState(providers, connections);
|
|
12237
|
+
await this.refreshAuthMethodOptions(providers);
|
|
12238
|
+
}
|
|
12239
|
+
finally {
|
|
12240
|
+
this.loading.set(false);
|
|
12241
|
+
}
|
|
12242
|
+
}
|
|
12243
|
+
async refreshAuthMethodOptions(providers) {
|
|
12244
|
+
const options = {};
|
|
12245
|
+
for (const provider of providers) {
|
|
12246
|
+
const definition = await this.providerRegistry.get(provider.id);
|
|
12247
|
+
const methods = definition?.authMethods ?? [];
|
|
12248
|
+
options[provider.id] = await Promise.all(methods.map(async (method) => ({
|
|
12249
|
+
type: method.type,
|
|
12250
|
+
label: await this.translationService.translateAsync(method.label),
|
|
12251
|
+
})));
|
|
12252
|
+
}
|
|
12253
|
+
this.authMethodOptions.set(options);
|
|
12254
|
+
}
|
|
12255
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPIntegrationConnectionsPanelWidgetEditComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12256
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPIntegrationConnectionsPanelWidgetEditComponent, isStandalone: true, selector: "axp-integration-connections-panel-widget-edit", usesInheritance: true, ngImport: i0, template: `
|
|
12257
|
+
<div class="ax-flex ax-w-full ax-flex-col ax-gap-4">
|
|
12258
|
+
@if (loading()) {
|
|
12259
|
+
<ax-loading></ax-loading>
|
|
12260
|
+
} @else {
|
|
12261
|
+
@for (provider of visibleProviders(); track provider.id) {
|
|
12262
|
+
<section
|
|
12263
|
+
class="ax-flex ax-flex-col ax-gap-4 ax-rounded-lg ax-border ax-border-surface ax-bg-lighter-surface ax-p-4"
|
|
12264
|
+
>
|
|
12265
|
+
<div class="ax-flex ax-items-start ax-justify-between ax-gap-3">
|
|
12266
|
+
<div class="ax-flex ax-min-w-0 ax-items-center ax-gap-3">
|
|
12267
|
+
@if (provider.icon) {
|
|
12268
|
+
<ax-icon class="ax-text-lg">
|
|
12269
|
+
<i [class]="provider.icon"></i>
|
|
12270
|
+
</ax-icon>
|
|
12271
|
+
}
|
|
12272
|
+
<div class="ax-min-w-0">
|
|
12273
|
+
<div class="ax-font-medium">{{ provider.displayName | translate | async }}</div>
|
|
12274
|
+
@if (provider.description) {
|
|
12275
|
+
<div class="ax-text-sm ax-opacity-70">{{ provider.description | translate | async }}</div>
|
|
12276
|
+
}
|
|
12277
|
+
</div>
|
|
12278
|
+
</div>
|
|
12279
|
+
|
|
12280
|
+
@if (provider.isConnected) {
|
|
12281
|
+
<ax-button
|
|
12282
|
+
size="sm"
|
|
12283
|
+
look="outline"
|
|
12284
|
+
color="danger"
|
|
12285
|
+
[text]="I18N + '.actions.disconnect' | translate | async"
|
|
12286
|
+
(onClick)="disconnect(provider.id)"
|
|
12287
|
+
></ax-button>
|
|
12288
|
+
} @else {
|
|
12289
|
+
<ax-button
|
|
12290
|
+
size="sm"
|
|
12291
|
+
look="outline"
|
|
12292
|
+
color="primary"
|
|
12293
|
+
[text]="I18N + '.actions.connect' | translate | async"
|
|
12294
|
+
(onClick)="handleConnect(provider)"
|
|
12295
|
+
></ax-button>
|
|
12296
|
+
}
|
|
12297
|
+
</div>
|
|
12298
|
+
|
|
12299
|
+
@if (provider.isConnected && !isConnectedOAuth(provider.id)) {
|
|
12300
|
+
<div class="ax-flex ax-flex-col ax-gap-3">
|
|
12301
|
+
<ax-form-field>
|
|
12302
|
+
<ax-label>{{ I18N + '.fields.display-name' | translate | async }}</ax-label>
|
|
12303
|
+
<ax-text-box
|
|
12304
|
+
[readonly]="true"
|
|
12305
|
+
[ngModel]="formDisplayName()[provider.id]"
|
|
12306
|
+
></ax-text-box>
|
|
12307
|
+
</ax-form-field>
|
|
12308
|
+
|
|
12309
|
+
<ax-form-field>
|
|
12310
|
+
<ax-label>{{ I18N + '.fields.instance-url' | translate | async }}</ax-label>
|
|
12311
|
+
<ax-text-box
|
|
12312
|
+
[readonly]="true"
|
|
12313
|
+
[ngModel]="formInstanceUrl()[provider.id]"
|
|
12314
|
+
></ax-text-box>
|
|
12315
|
+
</ax-form-field>
|
|
12316
|
+
|
|
12317
|
+
<ax-form-field>
|
|
12318
|
+
<ax-label>{{ primaryCredentialLabelKey(provider.id) | translate | async }}</ax-label>
|
|
12319
|
+
<ax-text-box
|
|
12320
|
+
[readonly]="true"
|
|
12321
|
+
[ngModel]="connectedPrimaryValue(provider.id)"
|
|
12322
|
+
[placeholder]="connectedSecretPreview(provider.id)"
|
|
12323
|
+
></ax-text-box>
|
|
12324
|
+
</ax-form-field>
|
|
12325
|
+
|
|
12326
|
+
@if (showSecondaryCredential(provider.id)) {
|
|
12327
|
+
<ax-form-field>
|
|
12328
|
+
<ax-label>{{ secondaryCredentialLabelKey(provider.id) | translate | async }}</ax-label>
|
|
12329
|
+
<ax-password-box
|
|
12330
|
+
[readonly]="true"
|
|
12331
|
+
[ngModel]="''"
|
|
12332
|
+
[placeholder]="connectedSecretPreview(provider.id)"
|
|
12333
|
+
></ax-password-box>
|
|
12334
|
+
</ax-form-field>
|
|
12335
|
+
}
|
|
12336
|
+
</div>
|
|
12337
|
+
}
|
|
12338
|
+
</section>
|
|
12339
|
+
}
|
|
12340
|
+
}
|
|
12341
|
+
</div>
|
|
12342
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.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: AXFormModule }, { kind: "component", type: i4.AXFormFieldComponent, selector: "ax-form-field", inputs: ["labelMode"] }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i2.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i2$2.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: AXPasswordBoxModule }, { kind: "component", type: i3$3.AXPasswordBoxComponent, selector: "ax-password-box", inputs: ["readonly", "disabled", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "autoComplete", "showToggleButton", "class"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXTextBoxModule }, { kind: "component", type: i1$6.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "maskPattern", "customTokens", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onMaskChanged"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
12343
|
+
}
|
|
12344
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPIntegrationConnectionsPanelWidgetEditComponent, decorators: [{
|
|
12345
|
+
type: Component,
|
|
12346
|
+
args: [{
|
|
12347
|
+
selector: 'axp-integration-connections-panel-widget-edit',
|
|
12348
|
+
template: `
|
|
12349
|
+
<div class="ax-flex ax-w-full ax-flex-col ax-gap-4">
|
|
12350
|
+
@if (loading()) {
|
|
12351
|
+
<ax-loading></ax-loading>
|
|
12352
|
+
} @else {
|
|
12353
|
+
@for (provider of visibleProviders(); track provider.id) {
|
|
12354
|
+
<section
|
|
12355
|
+
class="ax-flex ax-flex-col ax-gap-4 ax-rounded-lg ax-border ax-border-surface ax-bg-lighter-surface ax-p-4"
|
|
12356
|
+
>
|
|
12357
|
+
<div class="ax-flex ax-items-start ax-justify-between ax-gap-3">
|
|
12358
|
+
<div class="ax-flex ax-min-w-0 ax-items-center ax-gap-3">
|
|
12359
|
+
@if (provider.icon) {
|
|
12360
|
+
<ax-icon class="ax-text-lg">
|
|
12361
|
+
<i [class]="provider.icon"></i>
|
|
12362
|
+
</ax-icon>
|
|
12363
|
+
}
|
|
12364
|
+
<div class="ax-min-w-0">
|
|
12365
|
+
<div class="ax-font-medium">{{ provider.displayName | translate | async }}</div>
|
|
12366
|
+
@if (provider.description) {
|
|
12367
|
+
<div class="ax-text-sm ax-opacity-70">{{ provider.description | translate | async }}</div>
|
|
12368
|
+
}
|
|
12369
|
+
</div>
|
|
12370
|
+
</div>
|
|
12371
|
+
|
|
12372
|
+
@if (provider.isConnected) {
|
|
12373
|
+
<ax-button
|
|
12374
|
+
size="sm"
|
|
12375
|
+
look="outline"
|
|
12376
|
+
color="danger"
|
|
12377
|
+
[text]="I18N + '.actions.disconnect' | translate | async"
|
|
12378
|
+
(onClick)="disconnect(provider.id)"
|
|
12379
|
+
></ax-button>
|
|
12380
|
+
} @else {
|
|
12381
|
+
<ax-button
|
|
12382
|
+
size="sm"
|
|
12383
|
+
look="outline"
|
|
12384
|
+
color="primary"
|
|
12385
|
+
[text]="I18N + '.actions.connect' | translate | async"
|
|
12386
|
+
(onClick)="handleConnect(provider)"
|
|
12387
|
+
></ax-button>
|
|
12388
|
+
}
|
|
12389
|
+
</div>
|
|
12390
|
+
|
|
12391
|
+
@if (provider.isConnected && !isConnectedOAuth(provider.id)) {
|
|
12392
|
+
<div class="ax-flex ax-flex-col ax-gap-3">
|
|
12393
|
+
<ax-form-field>
|
|
12394
|
+
<ax-label>{{ I18N + '.fields.display-name' | translate | async }}</ax-label>
|
|
12395
|
+
<ax-text-box
|
|
12396
|
+
[readonly]="true"
|
|
12397
|
+
[ngModel]="formDisplayName()[provider.id]"
|
|
12398
|
+
></ax-text-box>
|
|
12399
|
+
</ax-form-field>
|
|
12400
|
+
|
|
12401
|
+
<ax-form-field>
|
|
12402
|
+
<ax-label>{{ I18N + '.fields.instance-url' | translate | async }}</ax-label>
|
|
12403
|
+
<ax-text-box
|
|
12404
|
+
[readonly]="true"
|
|
12405
|
+
[ngModel]="formInstanceUrl()[provider.id]"
|
|
12406
|
+
></ax-text-box>
|
|
12407
|
+
</ax-form-field>
|
|
12408
|
+
|
|
12409
|
+
<ax-form-field>
|
|
12410
|
+
<ax-label>{{ primaryCredentialLabelKey(provider.id) | translate | async }}</ax-label>
|
|
12411
|
+
<ax-text-box
|
|
12412
|
+
[readonly]="true"
|
|
12413
|
+
[ngModel]="connectedPrimaryValue(provider.id)"
|
|
12414
|
+
[placeholder]="connectedSecretPreview(provider.id)"
|
|
12415
|
+
></ax-text-box>
|
|
12416
|
+
</ax-form-field>
|
|
12417
|
+
|
|
12418
|
+
@if (showSecondaryCredential(provider.id)) {
|
|
12419
|
+
<ax-form-field>
|
|
12420
|
+
<ax-label>{{ secondaryCredentialLabelKey(provider.id) | translate | async }}</ax-label>
|
|
12421
|
+
<ax-password-box
|
|
12422
|
+
[readonly]="true"
|
|
12423
|
+
[ngModel]="''"
|
|
12424
|
+
[placeholder]="connectedSecretPreview(provider.id)"
|
|
12425
|
+
></ax-password-box>
|
|
12426
|
+
</ax-form-field>
|
|
12427
|
+
}
|
|
12428
|
+
</div>
|
|
12429
|
+
}
|
|
12430
|
+
</section>
|
|
12431
|
+
}
|
|
12432
|
+
}
|
|
12433
|
+
</div>
|
|
12434
|
+
`,
|
|
12435
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
12436
|
+
imports: [
|
|
12437
|
+
AsyncPipe,
|
|
12438
|
+
FormsModule,
|
|
12439
|
+
AXButtonModule,
|
|
12440
|
+
AXDecoratorModule,
|
|
12441
|
+
AXFormModule,
|
|
12442
|
+
AXLabelModule,
|
|
12443
|
+
AXLoadingModule,
|
|
12444
|
+
AXPasswordBoxModule,
|
|
12445
|
+
AXTextBoxModule,
|
|
12446
|
+
AXTranslationModule,
|
|
12447
|
+
],
|
|
12448
|
+
}]
|
|
12449
|
+
}], ctorParameters: () => [] });
|
|
12450
|
+
|
|
12451
|
+
var integrationConnectionsPanelWidgetEdit_component = /*#__PURE__*/Object.freeze({
|
|
12452
|
+
__proto__: null,
|
|
12453
|
+
AXPIntegrationConnectionsPanelWidgetEditComponent: AXPIntegrationConnectionsPanelWidgetEditComponent
|
|
12454
|
+
});
|
|
12455
|
+
|
|
11649
12456
|
//#region ---- Imports ----
|
|
11650
12457
|
//#endregion
|
|
11651
12458
|
//#region ---- Component ----
|
|
@@ -12321,7 +13128,7 @@ class AXPQrcodeWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
12321
13128
|
}
|
|
12322
13129
|
}
|
|
12323
13130
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPQrcodeWidgetEditComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
12324
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPQrcodeWidgetEditComponent, isStandalone: true, selector: "axp-qrcode-widget-edit", host: { classAttribute: "ax-block ax-flex-1" }, usesInheritance: true, ngImport: i0, template: "<!-- Main Container -->\n<div class=\"ax-flex ax-flex-col ax-gap-3 ax-p-3 ax-w-fit\">\n <div class=\"ax-flex ax-justify-center\">\n <!-- QR Code Container -->\n <div class=\"ax-bg-lightest ax-border ax-border-default ax-rounded-md ax-shadow-md ax-p-3\" #qr>\n <!-- QR Code Display or Empty Placeholder -->\n @if (value()) {\n <!-- Display QR Code when value exists -->\n <ax-qrcode [content]=\"value()\" [size]=\"size()\" [color]=\"color()\" [level]=\"level()\" [outputType]=\"'svg'\">\n </ax-qrcode>\n } @else {\n <!-- Empty State: Show placeholder when value is null or empty -->\n <div\n class=\"ax-flex ax-flex-col ax-items-center ax-justify-center ax-text-center\"\n [style.width.px]=\"size()\"\n [style.height.px]=\"size()\"\n >\n <ax-icon icon=\"fa-light fa-qrcode\" class=\"ax-text-4xl ax-text-gray-400 ax-mb-3\"></ax-icon>\n <div class=\"ax-text-sm ax-text-gray-500\">\n {{ '@general:state-message.empty.title' | translate | async }}\n </div>\n </div>\n }\n\n <!-- Action Buttons Section -->\n @if (!readonly()) {\n <div class=\"ax-flex ax-items-center ax-justify-between ax-gap-2 ax-pt-4\">\n <!-- Edit Button: Opens popover to edit QR code content -->\n <ax-button\n #editBtn\n look=\"twotone\"\n [title]=\"('@general:actions.edit.title' | translate | async)!\"\n (onClick)=\"beginEdit()\"\n >\n <!-- Edit Popover: Text input for editing QR code content -->\n <ax-popover #po [target]=\"editBtn\" [openOn]=\"'toggle'\" [closeOn]=\"'clickOut'\" [adaptivityEnabled]=\"true\">\n <div\n class=\"ax-bg-lightest ax-border ax-border-default ax-rounded-md ax-shadow-md ax-p-5 ax-w-full sm:ax-w-96\"\n >\n <!-- Text Input for QR Code Content -->\n <ax-text-box\n [value]=\"draft()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n [placeholder]=\"placeholder() | translate | async\"\n (onValueChanged)=\"onDraftChange($event)\"\n >\n @if (hasClearButton()) {\n <ax-clear-button></ax-clear-button>\n }\n </ax-text-box>\n <!-- Popover Action Buttons -->\n <div class=\"ax-flex ax-justify-end ax-gap-2 ax-mt-3\">\n <ax-button\n look=\"outline\"\n class=\"ax-sm\"\n [text]=\"('@general:actions.cancel.title' | translate | async)!\"\n (onClick)=\"cancelEdit(); po.close()\"\n ></ax-button>\n <ax-button\n look=\"solid\"\n class=\"ax-sm\"\n color=\"primary\"\n [text]=\"('@general:actions.submit.title' | translate | async)!\"\n (onClick)=\"applyDraft(); po.close()\"\n ></ax-button>\n </div>\n </div>\n </ax-popover>\n <ax-icon icon=\"fa-light fa-pen\"></ax-icon>\n </ax-button>\n\n <!-- Upload Button: Upload text file to set QR code content -->\n <!-- <ax-button\n look=\"twotone\"\n [title]=\"('@general:actions.upload.title' | translate | async)!\"\n (onClick)=\"fileInput.click()\"\n >\n <input #fileInput type=\"file\" accept=\"text/plain\" class=\"ax-hidden\" (change)=\"onFileSelected($event)\" />\n <ax-icon icon=\"fa-light fa-upload\"></ax-icon>\n </ax-button> -->\n\n <!-- Export Button: Download QR code as image (only shown when value exists) -->\n @if (value()) {\n <ax-button\n look=\"twotone\"\n [title]=\"('@general:actions.preview.title' | translate | async)!\"\n (onClick)=\"openPreview()\"\n >\n <ax-icon icon=\"fa-light fa-expand\"></ax-icon>\n </ax-button>\n\n <ax-button\n look=\"twotone\"\n [title]=\"('@general:actions.export.title' | translate | async)!\"\n (onClick)=\"downloadQr(qr)\"\n >\n <ax-icon icon=\"fa-light fa-download\"></ax-icon>\n </ax-button>\n }\n\n <!-- Delete Button: Clear QR code value (only shown when not readonly and value exists) -->\n @if (!readonly() && value()) {\n <ax-button\n look=\"twotone\"\n [title]=\"('@general:actions.delete.title' | translate | async)!\"\n (onClick)=\"clearValue()\"\n >\n <ax-icon icon=\"ax-text-danger fa-light fa-trash-can\"></ax-icon>\n </ax-button>\n }\n </div>\n }\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: AXTextBoxModule }, { kind: "component", type: i1$6.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "maskPattern", "customTokens", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onMaskChanged"] }, { 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: AXButtonModule }, { kind: "component", type: i1$1.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: AXPopoverModule }, { kind: "component", type: i3$
|
|
13131
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPQrcodeWidgetEditComponent, isStandalone: true, selector: "axp-qrcode-widget-edit", host: { classAttribute: "ax-block ax-flex-1" }, usesInheritance: true, ngImport: i0, template: "<!-- Main Container -->\n<div class=\"ax-flex ax-flex-col ax-gap-3 ax-p-3 ax-w-fit\">\n <div class=\"ax-flex ax-justify-center\">\n <!-- QR Code Container -->\n <div class=\"ax-bg-lightest ax-border ax-border-default ax-rounded-md ax-shadow-md ax-p-3\" #qr>\n <!-- QR Code Display or Empty Placeholder -->\n @if (value()) {\n <!-- Display QR Code when value exists -->\n <ax-qrcode [content]=\"value()\" [size]=\"size()\" [color]=\"color()\" [level]=\"level()\" [outputType]=\"'svg'\">\n </ax-qrcode>\n } @else {\n <!-- Empty State: Show placeholder when value is null or empty -->\n <div\n class=\"ax-flex ax-flex-col ax-items-center ax-justify-center ax-text-center\"\n [style.width.px]=\"size()\"\n [style.height.px]=\"size()\"\n >\n <ax-icon icon=\"fa-light fa-qrcode\" class=\"ax-text-4xl ax-text-gray-400 ax-mb-3\"></ax-icon>\n <div class=\"ax-text-sm ax-text-gray-500\">\n {{ '@general:state-message.empty.title' | translate | async }}\n </div>\n </div>\n }\n\n <!-- Action Buttons Section -->\n @if (!readonly()) {\n <div class=\"ax-flex ax-items-center ax-justify-between ax-gap-2 ax-pt-4\">\n <!-- Edit Button: Opens popover to edit QR code content -->\n <ax-button\n #editBtn\n look=\"twotone\"\n [title]=\"('@general:actions.edit.title' | translate | async)!\"\n (onClick)=\"beginEdit()\"\n >\n <!-- Edit Popover: Text input for editing QR code content -->\n <ax-popover #po [target]=\"editBtn\" [openOn]=\"'toggle'\" [closeOn]=\"'clickOut'\" [adaptivityEnabled]=\"true\">\n <div\n class=\"ax-bg-lightest ax-border ax-border-default ax-rounded-md ax-shadow-md ax-p-5 ax-w-full sm:ax-w-96\"\n >\n <!-- Text Input for QR Code Content -->\n <ax-text-box\n [value]=\"draft()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n [placeholder]=\"placeholder() | translate | async\"\n (onValueChanged)=\"onDraftChange($event)\"\n >\n @if (hasClearButton()) {\n <ax-clear-button></ax-clear-button>\n }\n </ax-text-box>\n <!-- Popover Action Buttons -->\n <div class=\"ax-flex ax-justify-end ax-gap-2 ax-mt-3\">\n <ax-button\n look=\"outline\"\n class=\"ax-sm\"\n [text]=\"('@general:actions.cancel.title' | translate | async)!\"\n (onClick)=\"cancelEdit(); po.close()\"\n ></ax-button>\n <ax-button\n look=\"solid\"\n class=\"ax-sm\"\n color=\"primary\"\n [text]=\"('@general:actions.submit.title' | translate | async)!\"\n (onClick)=\"applyDraft(); po.close()\"\n ></ax-button>\n </div>\n </div>\n </ax-popover>\n <ax-icon icon=\"fa-light fa-pen\"></ax-icon>\n </ax-button>\n\n <!-- Upload Button: Upload text file to set QR code content -->\n <!-- <ax-button\n look=\"twotone\"\n [title]=\"('@general:actions.upload.title' | translate | async)!\"\n (onClick)=\"fileInput.click()\"\n >\n <input #fileInput type=\"file\" accept=\"text/plain\" class=\"ax-hidden\" (change)=\"onFileSelected($event)\" />\n <ax-icon icon=\"fa-light fa-upload\"></ax-icon>\n </ax-button> -->\n\n <!-- Export Button: Download QR code as image (only shown when value exists) -->\n @if (value()) {\n <ax-button\n look=\"twotone\"\n [title]=\"('@general:actions.preview.title' | translate | async)!\"\n (onClick)=\"openPreview()\"\n >\n <ax-icon icon=\"fa-light fa-expand\"></ax-icon>\n </ax-button>\n\n <ax-button\n look=\"twotone\"\n [title]=\"('@general:actions.export.title' | translate | async)!\"\n (onClick)=\"downloadQr(qr)\"\n >\n <ax-icon icon=\"fa-light fa-download\"></ax-icon>\n </ax-button>\n }\n\n <!-- Delete Button: Clear QR code value (only shown when not readonly and value exists) -->\n @if (!readonly() && value()) {\n <ax-button\n look=\"twotone\"\n [title]=\"('@general:actions.delete.title' | translate | async)!\"\n (onClick)=\"clearValue()\"\n >\n <ax-icon icon=\"ax-text-danger fa-light fa-trash-can\"></ax-icon>\n </ax-button>\n }\n </div>\n }\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: AXTextBoxModule }, { kind: "component", type: i1$6.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "maskPattern", "customTokens", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onMaskChanged"] }, { 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: AXButtonModule }, { kind: "component", type: i1$1.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: AXPopoverModule }, { kind: "component", type: i3$1.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: AXQrcodeModule }, { kind: "component", type: i5$3.AXQrcodeComponent, selector: "ax-qrcode", inputs: ["content", "size", "level", "color", "backgroundColor", "outputType"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: FormsModule }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
12325
13132
|
}
|
|
12326
13133
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPQrcodeWidgetEditComponent, decorators: [{
|
|
12327
13134
|
type: Component,
|
|
@@ -13357,7 +14164,7 @@ class AXPStatusChipComponent {
|
|
|
13357
14164
|
</div>
|
|
13358
14165
|
</ax-popover>
|
|
13359
14166
|
}
|
|
13360
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i3$
|
|
14167
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i3$1.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: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
13361
14168
|
}
|
|
13362
14169
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPStatusChipComponent, decorators: [{
|
|
13363
14170
|
type: Component,
|
|
@@ -16499,6 +17306,9 @@ const AXPPageWidget = {
|
|
|
16499
17306
|
},
|
|
16500
17307
|
};
|
|
16501
17308
|
|
|
17309
|
+
const AXP_REPEATER_ENTITY_BY_KEY_LOOKUP = new InjectionToken('AXP_REPEATER_ENTITY_BY_KEY_LOOKUP');
|
|
17310
|
+
//#endregion
|
|
17311
|
+
|
|
16502
17312
|
class AXPRepeaterWidgetDesignerComponent extends AXPValueWidgetComponent {
|
|
16503
17313
|
constructor() {
|
|
16504
17314
|
super(...arguments);
|
|
@@ -16819,7 +17629,7 @@ const AXPRepeaterWidget = {
|
|
|
16819
17629
|
component: () => Promise.resolve().then(function () { return repeaterWidgetDesigner_component; }).then((c) => c.AXPRepeaterWidgetDesignerComponent),
|
|
16820
17630
|
},
|
|
16821
17631
|
column: {
|
|
16822
|
-
component: () => import('./acorex-platform-layout-widgets-repeater-widget-column.component-
|
|
17632
|
+
component: () => import('./acorex-platform-layout-widgets-repeater-widget-column.component-CFyfix31.mjs').then((c) => c.AXPRepeaterWidgetColumnComponent),
|
|
16823
17633
|
},
|
|
16824
17634
|
},
|
|
16825
17635
|
};
|
|
@@ -18902,7 +19712,7 @@ class AXPGridOptionsWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
18902
19712
|
}
|
|
18903
19713
|
}
|
|
18904
19714
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPGridOptionsWidgetEditComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
18905
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPGridOptionsWidgetEditComponent, isStandalone: true, selector: "axp-grid-options-widget-editor", usesInheritance: true, ngImport: i0, template: "<div class=\"axp-grid-breakpoints ax-pb-4\">\n <ax-selection-list\n [direction]=\"'horizontal'\"\n [items]=\"selectionItems\"\n [look]=\"'card'\"\n [customTemplate]=\"customTemplate\"\n [showControl]=\"false\"\n [ngModel]=\"currentBreakpoint()\"\n (onValueChanged)=\"changeBreakPoint($event)\"\n ></ax-selection-list>\n</div>\n<ng-template #customTemplate let-item>\n @let data = item.data;\n <div [class]=\"isBreakpointConfigured()[data.id] ? 'ax-text-primary-300' : ''\">\n {{ data.text }}\n </div>\n</ng-template>\n<ax-button\n color=\"primary\"\n text=\"Reset\"\n [disabled]=\"currentBreakpoint() === 'default'\"\n (click)=\"resetBreakpoint()\"\n></ax-button>\n\n<div class=\"axp-grid-option ax-grid ax-grid-cols-[auto_1fr] ax-pt-2 ax-gap-2 ax-items-center ax-justify-items-start\">\n <span> Direction </span>\n <div>\n <ax-button-group [selection]=\"'single'\">\n <ax-button-group-item (onClick)=\"setGridDirection('row')\" [selected]=\"gridDirection() === 'row'\"\n ><ax-prefix\n ><svg\n data-wf-icon=\"FlexFlowWrapIcon\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M3 4H11V3H3V4ZM13.8536 11.1464L10.8536 8.14645L10.1464 8.85355L12.2929 11H3V12H12.2929L10.1464 14.1464L10.8536 14.8536L13.8536 11.8536L14.2071 11.5L13.8536 11.1464Z\"\n fill=\"currentColor\"\n ></path>\n <path\n opacity=\"0.4\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M3 10.7929L9.79289 4H11V4.20711L4.20711 11H3V10.7929Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n <ax-button-group-item (onClick)=\"setGridDirection('column')\" [selected]=\"gridDirection() === 'column'\"\n ><ax-prefix\n ><svg\n data-wf-icon=\"FlexFlowColumnWrapIcon\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M4 3L4 11L3 11L3 3L4 3ZM11.1464 13.8536L8.14645 10.8536L8.85355 10.1464L11 12.2929L11 3L12 3L12 12.2929L14.1464 10.1464L14.8536 10.8536L11.8536 13.8536L11.5 14.2071L11.1464 13.8536Z\"\n fill=\"currentColor\"\n ></path>\n <path\n opacity=\"0.4\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M10.7929 3L4 9.79289L4 11L4.20711 11L11 4.20711L11 3L10.7929 3Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n </ax-button-group>\n </div>\n <span>Grid</span>\n <div class=\"ax-flex ax-items-center ax-justify-between ax-gap-1\">\n <span class=\"ax-text-xs\">Row</span>\n <ax-number-box\n [minValue]=\"1\"\n [maxValue]=\"12\"\n [value]=\"rows()\"\n (onValueChanged)=\"setRowOrColumn($event.value, 'row')\"\n [changeOnScroll]=\"true\"\n [showSpinButtons]=\"false\"\n class=\"ax-sm ax-max-w-12\"\n ></ax-number-box>\n <span class=\"ax-text-xs\">Column</span>\n <ax-number-box\n [minValue]=\"1\"\n [maxValue]=\"12\"\n [value]=\"columns()\"\n (onValueChanged)=\"setRowOrColumn($event.value, 'column')\"\n [changeOnScroll]=\"true\"\n [showSpinButtons]=\"false\"\n class=\"ax-sm ax-max-w-12\"\n ></ax-number-box>\n <!-- <button>\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M7 3.29289C7.18754 3.10536 7.44189 3 7.70711 3H10.5C10.7022 3 10.8845 3.12182 10.9619 3.30866C11.0393 3.4955 10.9966 3.71055 10.8536 3.85355L9 5.70711V7H10.2929L12.1464 5.14645C12.2894 5.00345 12.5045 4.96067 12.6913 5.03806C12.8782 5.11545 13 5.29777 13 5.5V8.29289C13 8.55811 12.8946 8.81246 12.7071 9L11 10.7071C10.8125 10.8946 10.5581 11 10.2929 11H7.70711L4.85355 13.8536C4.65829 14.0488 4.34171 14.0488 4.14645 13.8536L2.14645 11.8536C1.95118 11.6583 1.95118 11.3417 2.14645 11.1464L5 8.29289V5.70711C5 5.44189 5.10536 5.18754 5.29289 5L7 3.29289ZM9.29289 4H7.70711L6 5.70711L6 8.29289C6 8.55811 5.89464 8.81246 5.70711 9L3.20711 11.5L4.5 12.7929L7 10.2929C7.18754 10.1054 7.44189 10 7.70711 10H10.2929L12 8.29289V6.70711L10.8536 7.85355C10.7598 7.94732 10.6326 8 10.5 8H8.5C8.22386 8 8 7.77614 8 7.5V5.5C8 5.36739 8.05268 5.24021 8.14645 5.14645L9.29289 4Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n </button> -->\n </div>\n\n <span>Align</span>\n <div class=\"ax-flex ax-justify-between ax-gap-2 ax-items-center\">\n <div\n class=\"ax-relative ax-size-[62px] ax-bg-[rgb(30,30,30)] ax-border ax-border-white ax-border-opacity-15 ax-rounded\"\n >\n <div class=\"ax-absolute ax-inset-0 ax-grid ax-grid-cols-3 ax-grid-rows-3\">\n @for (side of gridSides; track side.value) {\n <div\n [attr.aria-label]=\"side.label\"\n [attr.aria-value]=\"side.value\"\n class=\"ax-grid ax-place-content-center\"\n (mouseenter)=\"onHover(side)\"\n (mouseleave)=\"onHoverLeave()\"\n (click)=\"onClick(side)\"\n >\n @if (true) {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect x=\"7\" y=\"7\" width=\"2\" height=\"2\" rx=\"1\" fill=\"currentColor\" fill-opacity=\"0.3\"></rect>\n </svg>\n }\n </div>\n }\n </div>\n @if (hoveredJustify() && hoveredAlign()) {\n <div\n class=\"axp-grid-option-hover ax-absolute ax-inset-0 ax-grid ax-pointer-events-none ax-transition-all\"\n [style.justify-items]=\"hoveredJustify()\"\n [style.align-items]=\"hoveredAlign()\"\n >\n <div class=\"ax-flex ax-justify-center ax-items-center ax-min-w-5 ax-min-h-5\">\n <div class=\"ax-size-auto ax-z-[1] ax-rounded-lg ax-bg-[rgb(30,30,30)] ax-flex-none\">\n @if (clickedJustify() === 'stretch' && clickedAlign() === 'stretch') {\n } @else if (clickedJustify() === 'stretch') {\n <svg\n width=\"60\"\n height=\"20\"\n viewBox=\"0 0 60 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M4.5 4.6a.15.15 0 0 1 .033-.1h50.934l.003.003a.15.15 0 0 1 .03.097v10.8a.15.15 0 0 1-.03.097l-.003.003H4.533l-.003-.003a.15.15 0 0 1-.03-.097V4.6Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.07; stroke-opacity: 0.25\"\n ></path>\n </svg>\n } @else if (clickedAlign() === 'stretch') {\n <svg\n width=\"20\"\n height=\"60\"\n viewBox=\"0 0 20 60\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M4.6 4.5h10.8a.15.15 0 0 1 .097.03l.003.003v50.934l-.003.003a.15.15 0 0 1-.097.03H4.6a.15.15 0 0 1-.1-.033V4.533l.003-.003A.15.15 0 0 1 4.6 4.5Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.07; stroke-opacity: 0.25\"\n ></path>\n </svg>\n } @else {\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: #efeaea\"\n >\n <path\n d=\"M4.5 4.6a.1.1 0 0 1 .1-.1h10.8a.1.1 0 0 1 .1.1v10.8a.1.1 0 0 1-.1.1H4.6a.1.1 0 0 1-.1-.1V4.6Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"stroke-opacity: 0.25; fill-opacity: 0.07\"\n class=\"hover:fill-opacity-20\"\n ></path>\n </svg>\n }\n </div>\n </div>\n </div>\n }\n\n <div\n class=\"axp-grid-option-active ax-absolute ax-inset-0 ax-grid ax-pointer-events-none ax-transition-all\"\n [style.justify-items]=\"clickedJustify()\"\n [style.align-items]=\"clickedAlign()\"\n >\n <div class=\"ax-flex ax-justify-center ax-items-center ax-min-w-5 ax-min-h-5\">\n <div class=\"ax-size-auto ax-z-[2] ax-rounded-lg ax-bg-[rgb(30,30,30)] ax-flex-none\">\n @if (clickedJustify() === 'stretch' && clickedAlign() === 'stretch') {\n <svg\n width=\"60\"\n height=\"60\"\n viewBox=\"0 0 60 60\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M55.5 55.48a.02.02 0 0 1-.02.02H4.52a.02.02 0 0 1-.02-.02V4.52a.02.02 0 0 1 .02-.02h50.96a.02.02 0 0 1 .02.02v50.96Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.16; stroke: white\"\n ></path>\n <path\n d=\"m26.354 20.354 3.146-3.147V29.5h-3v1h3v12.293l-3.146-3.147-.707.708L30 44.707l4.354-4.353-.707-.708-3.147 3.147V30.5h12.293l-3.147 3.147.708.707L44.707 30l-4.353-4.354-.708.708 3.147 3.146H30.5V17.207l3.146 3.147.707-.707L30 15.293l-4.354 4.354.707.707Z\"\n fill=\"currentColor\"\n style=\"fill-opacity: 0.25\"\n ></path>\n <path\n d=\"m17.207 30.5 3.146 3.147-.707.707L15.293 30l4.353-4.354.707.708-3.146 3.146H26.5v1h-9.293Z\"\n fill=\"currentColor\"\n style=\"fill-opacity: 0.25\"\n ></path>\n </svg>\n } @else if (clickedJustify() === 'stretch') {\n <svg\n width=\"60\"\n height=\"20\"\n viewBox=\"0 0 60 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M4.5 4.6a.15.15 0 0 1 .033-.1h50.934l.003.003a.15.15 0 0 1 .03.097v10.8a.15.15 0 0 1-.03.097l-.003.003H4.533l-.003-.003a.15.15 0 0 1-.03-.097V4.6Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.16; stroke: white\"\n ></path>\n </svg>\n } @else if (clickedAlign() === 'stretch') {\n <svg\n width=\"20\"\n height=\"60\"\n viewBox=\"0 0 20 60\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M4.6 4.5h10.8a.15.15 0 0 1 .097.03l.003.003v50.934l-.003.003a.15.15 0 0 1-.097.03H4.6a.15.15 0 0 1-.1-.033V4.533l.003-.003A.15.15 0 0 1 4.6 4.5Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.16; stroke: white\"\n ></path>\n </svg>\n } @else {\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: #efeaea\"\n >\n <path\n d=\"M4.5 4.6a.1.1 0 0 1 .1-.1h10.8a.1.1 0 0 1 .1.1v10.8a.1.1 0 0 1-.1.1H4.6a.1.1 0 0 1-.1-.1V4.6Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill: #cebcbc; fill-opacity: 0.16\"\n ></path>\n </svg>\n }\n </div>\n </div>\n </div>\n </div>\n <div class=\"ax-grid ax-grid-cols-[auto_1fr] ax-items-center ax-justify-items-start ax-gap-2\">\n <span>X:</span>\n <div class=\"ax-w-24\">\n <ax-select-box\n class=\"ax-sm\"\n [dataSource]=\"justifyDataSource\"\n [value]=\"selectedJustify()\"\n (onValueChanged)=\"onJustifyChange($event)\"\n textField=\"label\"\n valueField=\"value\"\n placeholder=\"Choose...\"\n >\n </ax-select-box>\n </div>\n <span>Y:</span>\n <div class=\"ax-w-24\">\n <ax-select-box\n class=\"ax-sm\"\n [dataSource]=\"alignDataSource\"\n [value]=\"selectedAlign()\"\n (onValueChanged)=\"onAlignChange($event)\"\n textField=\"label\"\n valueField=\"value\"\n placeholder=\"Choose...\"\n >\n </ax-select-box>\n </div>\n </div>\n </div>\n\n <span>Gap</span>\n <div class=\"ax-flex ax-gap-2 ax-justify-between ax-items-center\">\n @if (gapMode() === 'single') {\n <ax-range-slider\n class=\"ax-w-32\"\n [values]=\"gap().x\"\n (valuesChange)=\"setGap($event ?? 0, 'both')\"\n ></ax-range-slider>\n <ax-number-box\n [minValue]=\"0\"\n [maxValue]=\"999\"\n [value]=\"gap().x\"\n (onValueChanged)=\"setGap($event.value ?? 0, 'both')\"\n [changeOnScroll]=\"true\"\n class=\"ax-sm ax-min-w-6\"\n [showSpinButtons]=\"false\"\n ><ax-suffix><ax-text class=\"!ax-text-xs !ax-px-1\">PX</ax-text></ax-suffix></ax-number-box\n >\n } @else {\n <div class=\"ax-flex ax-items-center ax-gap-2 ax-h-12\">\n <span class=\"ax-text-xs\"\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M12.2929 7.00004L9.14645 3.85359L9.85355 3.14648L14.2071 7.50004L9.85355 11.8536L9.14645 11.1465L12.2929 8.00004H3V7.00004H12.2929Z\"\n fill=\"currentColor\"\n ></path></svg ></span>\n <ax-number-box\n [minValue]=\"0\"\n [maxValue]=\"999\"\n [value]=\"gap().x\"\n (onValueChanged)=\"setGap($event.value ?? 0, 'x')\"\n [changeOnScroll]=\"true\"\n class=\"ax-sm ax-min-w-5\"\n [showSpinButtons]=\"false\"\n ><ax-suffix><ax-text class=\"!ax-text-xs !ax-px-1\">PX</ax-text></ax-suffix></ax-number-box\n >\n <span class=\"ax-text-xs\"><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M8.00001 12.2929L4.85356 9.14645L4.14645 9.85355L8.50001 14.2071L12.8536 9.85355L12.1465 9.14645L9.00001 12.2929L9.00001 3H8.00001L8.00001 12.2929Z\"\n fill=\"currentColor\"\n ></path></svg></span>\n <ax-number-box\n [minValue]=\"0\"\n [maxValue]=\"999\"\n [value]=\"gap().y\"\n [changeOnScroll]=\"true\"\n (valueChange)=\"setGap($event ?? 0, 'y')\"\n class=\"ax-sm ax-min-w-5\"\n [showSpinButtons]=\"false\"\n ><ax-suffix><ax-text class=\"!ax-text-xs !ax-px-1\">PX</ax-text></ax-suffix></ax-number-box\n >\n </div>\n }\n <button (click)=\"toggleGapMode()\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n @if (gapMode() === 'single') {\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M5 7L5 5C5 3.34315 6.34315 2 8 2C9.65685 2 11 3.34315 11 5V7C11.5523 7 12 7.44772 12 8V12C12 12.5523 11.5523 13 11 13H5C4.44772 13 4 12.5523 4 12V8C4 7.44771 4.44772 7 5 7ZM6 5C6 3.89543 6.89543 3 8 3C9.10457 3 10 3.89543 10 5V7H6V5ZM5 12V8H11V12H5Z\"\n fill=\"currentColor\"\n ></path>\n } @else {\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M9 5C9 3.89543 9.89543 3 11 3C12.1046 3 13 3.89543 13 5V6H14V5C14 3.34315 12.6569 2 11 2C9.34315 2 8 3.34315 8 5V7H3C2.44772 7 2 7.44771 2 8V12C2 12.5523 2.44772 13 3 13H9C9.55228 13 10 12.5523 10 12V8C10 7.44772 9.55228 7 9 7V5ZM3 8H9V12H3V8Z\"\n fill=\"currentColor\"\n ></path>\n }\n </svg>\n </button>\n </div>\n</div>\n", styles: ["axp-grid-options-widget{--ax-comp-range-slider-handler-size: .75rem}axp-grid-options-widget ax-selection-list>ul{flex-wrap:nowrap;overflow:auto;padding-bottom:.5rem;gap:.25rem}\n"], dependencies: [{ kind: "ngmodule", type: AXButtonGroupModule }, { kind: "component", type: i1$j.AXButtonGroupComponent, selector: "ax-button-group", inputs: ["disabled", "color", "look", "fitParent", "selection"], outputs: ["onBlur", "onFocus", "lookChange", "colorChange", "disabledChange", "onClick", "selectionChange", "selectedButtonChange"] }, { kind: "component", type: i1$j.AXButtonGroupItemComponent, selector: "ax-button-group-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { 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: AXSelectBoxModule }, { kind: "component", type: i3$1.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: AXNumberBoxModule }, { kind: "component", type: i1$7.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "minValue", "maxValue", "showSpinButtons", "thousandsSeparator", "decimals", "changeOnScroll", "step"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "thousandsSeparatorChange"] }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.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: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXRangeSliderModule }, { kind: "component", type: i3$5.AXRangeSliderComponent, selector: "ax-range-slider", inputs: ["disabled", "readonly", "orientation", "color", "values", "mode", "min", "max", "step", "snap", "tooltipMode", "snapMode", "hasStep", "hasSnap", "hasLable", "hasTooltip"], outputs: ["valuesChange"] }, { kind: "ngmodule", type: AXSelectionListModule }, { kind: "component", type: i2$4.AXSelectionListComponent, selector: "ax-selection-list", inputs: ["id", "name", "disabled", "readonly", "tabIndex", "size", "value", "valueField", "textField", "disabledField", "readonlyField", "multiple", "direction", "customTemplate", "showControl", "items", "look"], outputs: ["onValueChanged", "onBlur", "onFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
19715
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPGridOptionsWidgetEditComponent, isStandalone: true, selector: "axp-grid-options-widget-editor", usesInheritance: true, ngImport: i0, template: "<div class=\"axp-grid-breakpoints ax-pb-4\">\n <ax-selection-list\n [direction]=\"'horizontal'\"\n [items]=\"selectionItems\"\n [look]=\"'card'\"\n [customTemplate]=\"customTemplate\"\n [showControl]=\"false\"\n [ngModel]=\"currentBreakpoint()\"\n (onValueChanged)=\"changeBreakPoint($event)\"\n ></ax-selection-list>\n</div>\n<ng-template #customTemplate let-item>\n @let data = item.data;\n <div [class]=\"isBreakpointConfigured()[data.id] ? 'ax-text-primary-300' : ''\">\n {{ data.text }}\n </div>\n</ng-template>\n<ax-button\n color=\"primary\"\n text=\"Reset\"\n [disabled]=\"currentBreakpoint() === 'default'\"\n (click)=\"resetBreakpoint()\"\n></ax-button>\n\n<div class=\"axp-grid-option ax-grid ax-grid-cols-[auto_1fr] ax-pt-2 ax-gap-2 ax-items-center ax-justify-items-start\">\n <span> Direction </span>\n <div>\n <ax-button-group [selection]=\"'single'\">\n <ax-button-group-item (onClick)=\"setGridDirection('row')\" [selected]=\"gridDirection() === 'row'\"\n ><ax-prefix\n ><svg\n data-wf-icon=\"FlexFlowWrapIcon\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M3 4H11V3H3V4ZM13.8536 11.1464L10.8536 8.14645L10.1464 8.85355L12.2929 11H3V12H12.2929L10.1464 14.1464L10.8536 14.8536L13.8536 11.8536L14.2071 11.5L13.8536 11.1464Z\"\n fill=\"currentColor\"\n ></path>\n <path\n opacity=\"0.4\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M3 10.7929L9.79289 4H11V4.20711L4.20711 11H3V10.7929Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n <ax-button-group-item (onClick)=\"setGridDirection('column')\" [selected]=\"gridDirection() === 'column'\"\n ><ax-prefix\n ><svg\n data-wf-icon=\"FlexFlowColumnWrapIcon\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M4 3L4 11L3 11L3 3L4 3ZM11.1464 13.8536L8.14645 10.8536L8.85355 10.1464L11 12.2929L11 3L12 3L12 12.2929L14.1464 10.1464L14.8536 10.8536L11.8536 13.8536L11.5 14.2071L11.1464 13.8536Z\"\n fill=\"currentColor\"\n ></path>\n <path\n opacity=\"0.4\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M10.7929 3L4 9.79289L4 11L4.20711 11L11 4.20711L11 3L10.7929 3Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n </ax-button-group>\n </div>\n <span>Grid</span>\n <div class=\"ax-flex ax-items-center ax-justify-between ax-gap-1\">\n <span class=\"ax-text-xs\">Row</span>\n <ax-number-box\n [minValue]=\"1\"\n [maxValue]=\"12\"\n [value]=\"rows()\"\n (onValueChanged)=\"setRowOrColumn($event.value, 'row')\"\n [changeOnScroll]=\"true\"\n [showSpinButtons]=\"false\"\n class=\"ax-sm ax-max-w-12\"\n ></ax-number-box>\n <span class=\"ax-text-xs\">Column</span>\n <ax-number-box\n [minValue]=\"1\"\n [maxValue]=\"12\"\n [value]=\"columns()\"\n (onValueChanged)=\"setRowOrColumn($event.value, 'column')\"\n [changeOnScroll]=\"true\"\n [showSpinButtons]=\"false\"\n class=\"ax-sm ax-max-w-12\"\n ></ax-number-box>\n <!-- <button>\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M7 3.29289C7.18754 3.10536 7.44189 3 7.70711 3H10.5C10.7022 3 10.8845 3.12182 10.9619 3.30866C11.0393 3.4955 10.9966 3.71055 10.8536 3.85355L9 5.70711V7H10.2929L12.1464 5.14645C12.2894 5.00345 12.5045 4.96067 12.6913 5.03806C12.8782 5.11545 13 5.29777 13 5.5V8.29289C13 8.55811 12.8946 8.81246 12.7071 9L11 10.7071C10.8125 10.8946 10.5581 11 10.2929 11H7.70711L4.85355 13.8536C4.65829 14.0488 4.34171 14.0488 4.14645 13.8536L2.14645 11.8536C1.95118 11.6583 1.95118 11.3417 2.14645 11.1464L5 8.29289V5.70711C5 5.44189 5.10536 5.18754 5.29289 5L7 3.29289ZM9.29289 4H7.70711L6 5.70711L6 8.29289C6 8.55811 5.89464 8.81246 5.70711 9L3.20711 11.5L4.5 12.7929L7 10.2929C7.18754 10.1054 7.44189 10 7.70711 10H10.2929L12 8.29289V6.70711L10.8536 7.85355C10.7598 7.94732 10.6326 8 10.5 8H8.5C8.22386 8 8 7.77614 8 7.5V5.5C8 5.36739 8.05268 5.24021 8.14645 5.14645L9.29289 4Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n </button> -->\n </div>\n\n <span>Align</span>\n <div class=\"ax-flex ax-justify-between ax-gap-2 ax-items-center\">\n <div\n class=\"ax-relative ax-size-[62px] ax-bg-[rgb(30,30,30)] ax-border ax-border-white ax-border-opacity-15 ax-rounded\"\n >\n <div class=\"ax-absolute ax-inset-0 ax-grid ax-grid-cols-3 ax-grid-rows-3\">\n @for (side of gridSides; track side.value) {\n <div\n [attr.aria-label]=\"side.label\"\n [attr.aria-value]=\"side.value\"\n class=\"ax-grid ax-place-content-center\"\n (mouseenter)=\"onHover(side)\"\n (mouseleave)=\"onHoverLeave()\"\n (click)=\"onClick(side)\"\n >\n @if (true) {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect x=\"7\" y=\"7\" width=\"2\" height=\"2\" rx=\"1\" fill=\"currentColor\" fill-opacity=\"0.3\"></rect>\n </svg>\n }\n </div>\n }\n </div>\n @if (hoveredJustify() && hoveredAlign()) {\n <div\n class=\"axp-grid-option-hover ax-absolute ax-inset-0 ax-grid ax-pointer-events-none ax-transition-all\"\n [style.justify-items]=\"hoveredJustify()\"\n [style.align-items]=\"hoveredAlign()\"\n >\n <div class=\"ax-flex ax-justify-center ax-items-center ax-min-w-5 ax-min-h-5\">\n <div class=\"ax-size-auto ax-z-[1] ax-rounded-lg ax-bg-[rgb(30,30,30)] ax-flex-none\">\n @if (clickedJustify() === 'stretch' && clickedAlign() === 'stretch') {\n } @else if (clickedJustify() === 'stretch') {\n <svg\n width=\"60\"\n height=\"20\"\n viewBox=\"0 0 60 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M4.5 4.6a.15.15 0 0 1 .033-.1h50.934l.003.003a.15.15 0 0 1 .03.097v10.8a.15.15 0 0 1-.03.097l-.003.003H4.533l-.003-.003a.15.15 0 0 1-.03-.097V4.6Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.07; stroke-opacity: 0.25\"\n ></path>\n </svg>\n } @else if (clickedAlign() === 'stretch') {\n <svg\n width=\"20\"\n height=\"60\"\n viewBox=\"0 0 20 60\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M4.6 4.5h10.8a.15.15 0 0 1 .097.03l.003.003v50.934l-.003.003a.15.15 0 0 1-.097.03H4.6a.15.15 0 0 1-.1-.033V4.533l.003-.003A.15.15 0 0 1 4.6 4.5Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.07; stroke-opacity: 0.25\"\n ></path>\n </svg>\n } @else {\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: #efeaea\"\n >\n <path\n d=\"M4.5 4.6a.1.1 0 0 1 .1-.1h10.8a.1.1 0 0 1 .1.1v10.8a.1.1 0 0 1-.1.1H4.6a.1.1 0 0 1-.1-.1V4.6Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"stroke-opacity: 0.25; fill-opacity: 0.07\"\n class=\"hover:fill-opacity-20\"\n ></path>\n </svg>\n }\n </div>\n </div>\n </div>\n }\n\n <div\n class=\"axp-grid-option-active ax-absolute ax-inset-0 ax-grid ax-pointer-events-none ax-transition-all\"\n [style.justify-items]=\"clickedJustify()\"\n [style.align-items]=\"clickedAlign()\"\n >\n <div class=\"ax-flex ax-justify-center ax-items-center ax-min-w-5 ax-min-h-5\">\n <div class=\"ax-size-auto ax-z-[2] ax-rounded-lg ax-bg-[rgb(30,30,30)] ax-flex-none\">\n @if (clickedJustify() === 'stretch' && clickedAlign() === 'stretch') {\n <svg\n width=\"60\"\n height=\"60\"\n viewBox=\"0 0 60 60\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M55.5 55.48a.02.02 0 0 1-.02.02H4.52a.02.02 0 0 1-.02-.02V4.52a.02.02 0 0 1 .02-.02h50.96a.02.02 0 0 1 .02.02v50.96Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.16; stroke: white\"\n ></path>\n <path\n d=\"m26.354 20.354 3.146-3.147V29.5h-3v1h3v12.293l-3.146-3.147-.707.708L30 44.707l4.354-4.353-.707-.708-3.147 3.147V30.5h12.293l-3.147 3.147.708.707L44.707 30l-4.353-4.354-.708.708 3.147 3.146H30.5V17.207l3.146 3.147.707-.707L30 15.293l-4.354 4.354.707.707Z\"\n fill=\"currentColor\"\n style=\"fill-opacity: 0.25\"\n ></path>\n <path\n d=\"m17.207 30.5 3.146 3.147-.707.707L15.293 30l4.353-4.354.707.708-3.146 3.146H26.5v1h-9.293Z\"\n fill=\"currentColor\"\n style=\"fill-opacity: 0.25\"\n ></path>\n </svg>\n } @else if (clickedJustify() === 'stretch') {\n <svg\n width=\"60\"\n height=\"20\"\n viewBox=\"0 0 60 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M4.5 4.6a.15.15 0 0 1 .033-.1h50.934l.003.003a.15.15 0 0 1 .03.097v10.8a.15.15 0 0 1-.03.097l-.003.003H4.533l-.003-.003a.15.15 0 0 1-.03-.097V4.6Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.16; stroke: white\"\n ></path>\n </svg>\n } @else if (clickedAlign() === 'stretch') {\n <svg\n width=\"20\"\n height=\"60\"\n viewBox=\"0 0 20 60\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M4.6 4.5h10.8a.15.15 0 0 1 .097.03l.003.003v50.934l-.003.003a.15.15 0 0 1-.097.03H4.6a.15.15 0 0 1-.1-.033V4.533l.003-.003A.15.15 0 0 1 4.6 4.5Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.16; stroke: white\"\n ></path>\n </svg>\n } @else {\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: #efeaea\"\n >\n <path\n d=\"M4.5 4.6a.1.1 0 0 1 .1-.1h10.8a.1.1 0 0 1 .1.1v10.8a.1.1 0 0 1-.1.1H4.6a.1.1 0 0 1-.1-.1V4.6Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill: #cebcbc; fill-opacity: 0.16\"\n ></path>\n </svg>\n }\n </div>\n </div>\n </div>\n </div>\n <div class=\"ax-grid ax-grid-cols-[auto_1fr] ax-items-center ax-justify-items-start ax-gap-2\">\n <span>X:</span>\n <div class=\"ax-w-24\">\n <ax-select-box\n class=\"ax-sm\"\n [dataSource]=\"justifyDataSource\"\n [value]=\"selectedJustify()\"\n (onValueChanged)=\"onJustifyChange($event)\"\n textField=\"label\"\n valueField=\"value\"\n placeholder=\"Choose...\"\n >\n </ax-select-box>\n </div>\n <span>Y:</span>\n <div class=\"ax-w-24\">\n <ax-select-box\n class=\"ax-sm\"\n [dataSource]=\"alignDataSource\"\n [value]=\"selectedAlign()\"\n (onValueChanged)=\"onAlignChange($event)\"\n textField=\"label\"\n valueField=\"value\"\n placeholder=\"Choose...\"\n >\n </ax-select-box>\n </div>\n </div>\n </div>\n\n <span>Gap</span>\n <div class=\"ax-flex ax-gap-2 ax-justify-between ax-items-center\">\n @if (gapMode() === 'single') {\n <ax-range-slider\n class=\"ax-w-32\"\n [values]=\"gap().x\"\n (valuesChange)=\"setGap($event ?? 0, 'both')\"\n ></ax-range-slider>\n <ax-number-box\n [minValue]=\"0\"\n [maxValue]=\"999\"\n [value]=\"gap().x\"\n (onValueChanged)=\"setGap($event.value ?? 0, 'both')\"\n [changeOnScroll]=\"true\"\n class=\"ax-sm ax-min-w-6\"\n [showSpinButtons]=\"false\"\n ><ax-suffix><ax-text class=\"!ax-text-xs !ax-px-1\">PX</ax-text></ax-suffix></ax-number-box\n >\n } @else {\n <div class=\"ax-flex ax-items-center ax-gap-2 ax-h-12\">\n <span class=\"ax-text-xs\"\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M12.2929 7.00004L9.14645 3.85359L9.85355 3.14648L14.2071 7.50004L9.85355 11.8536L9.14645 11.1465L12.2929 8.00004H3V7.00004H12.2929Z\"\n fill=\"currentColor\"\n ></path></svg ></span>\n <ax-number-box\n [minValue]=\"0\"\n [maxValue]=\"999\"\n [value]=\"gap().x\"\n (onValueChanged)=\"setGap($event.value ?? 0, 'x')\"\n [changeOnScroll]=\"true\"\n class=\"ax-sm ax-min-w-5\"\n [showSpinButtons]=\"false\"\n ><ax-suffix><ax-text class=\"!ax-text-xs !ax-px-1\">PX</ax-text></ax-suffix></ax-number-box\n >\n <span class=\"ax-text-xs\"><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M8.00001 12.2929L4.85356 9.14645L4.14645 9.85355L8.50001 14.2071L12.8536 9.85355L12.1465 9.14645L9.00001 12.2929L9.00001 3H8.00001L8.00001 12.2929Z\"\n fill=\"currentColor\"\n ></path></svg></span>\n <ax-number-box\n [minValue]=\"0\"\n [maxValue]=\"999\"\n [value]=\"gap().y\"\n [changeOnScroll]=\"true\"\n (valueChange)=\"setGap($event ?? 0, 'y')\"\n class=\"ax-sm ax-min-w-5\"\n [showSpinButtons]=\"false\"\n ><ax-suffix><ax-text class=\"!ax-text-xs !ax-px-1\">PX</ax-text></ax-suffix></ax-number-box\n >\n </div>\n }\n <button (click)=\"toggleGapMode()\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n @if (gapMode() === 'single') {\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M5 7L5 5C5 3.34315 6.34315 2 8 2C9.65685 2 11 3.34315 11 5V7C11.5523 7 12 7.44772 12 8V12C12 12.5523 11.5523 13 11 13H5C4.44772 13 4 12.5523 4 12V8C4 7.44771 4.44772 7 5 7ZM6 5C6 3.89543 6.89543 3 8 3C9.10457 3 10 3.89543 10 5V7H6V5ZM5 12V8H11V12H5Z\"\n fill=\"currentColor\"\n ></path>\n } @else {\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M9 5C9 3.89543 9.89543 3 11 3C12.1046 3 13 3.89543 13 5V6H14V5C14 3.34315 12.6569 2 11 2C9.34315 2 8 3.34315 8 5V7H3C2.44772 7 2 7.44771 2 8V12C2 12.5523 2.44772 13 3 13H9C9.55228 13 10 12.5523 10 12V8C10 7.44772 9.55228 7 9 7V5ZM3 8H9V12H3V8Z\"\n fill=\"currentColor\"\n ></path>\n }\n </svg>\n </button>\n </div>\n</div>\n", styles: ["axp-grid-options-widget{--ax-comp-range-slider-handler-size: .75rem}axp-grid-options-widget ax-selection-list>ul{flex-wrap:nowrap;overflow:auto;padding-bottom:.5rem;gap:.25rem}\n"], dependencies: [{ kind: "ngmodule", type: AXButtonGroupModule }, { kind: "component", type: i1$j.AXButtonGroupComponent, selector: "ax-button-group", inputs: ["disabled", "color", "look", "fitParent", "selection"], outputs: ["onBlur", "onFocus", "lookChange", "colorChange", "disabledChange", "onClick", "selectionChange", "selectedButtonChange"] }, { kind: "component", type: i1$j.AXButtonGroupItemComponent, selector: "ax-button-group-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { 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: AXSelectBoxModule }, { kind: "component", type: i3.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: AXNumberBoxModule }, { kind: "component", type: i1$7.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "minValue", "maxValue", "showSpinButtons", "thousandsSeparator", "decimals", "changeOnScroll", "step"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "thousandsSeparatorChange"] }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.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: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXRangeSliderModule }, { kind: "component", type: i3$4.AXRangeSliderComponent, selector: "ax-range-slider", inputs: ["disabled", "readonly", "orientation", "color", "values", "mode", "min", "max", "step", "snap", "tooltipMode", "snapMode", "hasStep", "hasSnap", "hasLable", "hasTooltip"], outputs: ["valuesChange"] }, { kind: "ngmodule", type: AXSelectionListModule }, { kind: "component", type: i2$4.AXSelectionListComponent, selector: "ax-selection-list", inputs: ["id", "name", "disabled", "readonly", "tabIndex", "size", "value", "valueField", "textField", "disabledField", "readonlyField", "multiple", "direction", "customTemplate", "showControl", "items", "look"], outputs: ["onValueChanged", "onBlur", "onFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
18906
19716
|
}
|
|
18907
19717
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPGridOptionsWidgetEditComponent, decorators: [{
|
|
18908
19718
|
type: Component,
|
|
@@ -19072,7 +19882,7 @@ class AXPAdvancedGridOptionsWidgetEditComponent extends AXPValueWidgetComponent
|
|
|
19072
19882
|
this.selectedAlign.set({ value: align, label: this.findAlignNameById(align) });
|
|
19073
19883
|
}
|
|
19074
19884
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPAdvancedGridOptionsWidgetEditComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
19075
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPAdvancedGridOptionsWidgetEditComponent, isStandalone: true, selector: "axp-advanced-grid-options-widget-editor", usesInheritance: true, ngImport: i0, template: "<div class=\"axp-advanced-grid ax-w-11/12\">\n <div class=\"ax-grid ax-grid-cols-2 ax-grid-rows-2 ax-gap-x-3 ax-items-center ax-pb-2\">\n <span>Columns</span>\n <span>Items</span>\n <ax-number-box\n [minValue]=\"1\"\n [maxValue]=\"12\"\n [value]=\"columns()\"\n (onValueChanged)=\"changeValue($event, 'columns')\"\n ></ax-number-box>\n <ax-number-box\n [minValue]=\"1\"\n [maxValue]=\"99\"\n [value]=\"items()\"\n (onValueChanged)=\"changeValue($event, 'itemsCount')\"\n ></ax-number-box>\n </div>\n <span>Align</span>\n <div class=\"ax-flex ax-justify-between ax-gap-2 ax-items-center\">\n <div\n class=\"ax-relative ax-size-[62px] ax-bg-[rgb(30,30,30)] ax-border ax-border-white ax-border-opacity-15 ax-rounded\"\n >\n <div class=\"ax-absolute ax-inset-0 ax-grid ax-grid-cols-3 ax-grid-rows-3\">\n @for(side of gridSides; track side.value){\n <div\n [attr.aria-label]=\"side.label\"\n [attr.aria-value]=\"side.value\"\n class=\"ax-grid ax-place-content-center\"\n (mouseenter)=\"onHover(side)\"\n (mouseleave)=\"onHoverLeave()\"\n (click)=\"onClick(side)\"\n >\n @if (true) {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect x=\"7\" y=\"7\" width=\"2\" height=\"2\" rx=\"1\" fill=\"currentColor\" fill-opacity=\"0.3\"></rect>\n </svg>\n }\n </div>\n }\n </div>\n @if(hoveredJustify() && hoveredAlign()){\n <div\n class=\"axp-grid-option-hover ax-absolute ax-inset-0 ax-grid ax-pointer-events-none ax-transition-all\"\n [style.justify-items]=\"hoveredJustify()\"\n [style.align-items]=\"hoveredAlign()\"\n >\n <div class=\"ax-flex ax-justify-center ax-items-center ax-min-w-5 ax-min-h-5\">\n <div class=\"ax-size-auto ax-z-[1] ax-rounded-lg ax-bg-[rgb(30,30,30)] ax-flex-none\">\n @if(clickedJustify()==='stretch' && clickedAlign()==='stretch') {} @else if(clickedJustify()==='stretch'){\n <svg\n width=\"60\"\n height=\"20\"\n viewBox=\"0 0 60 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M4.5 4.6a.15.15 0 0 1 .033-.1h50.934l.003.003a.15.15 0 0 1 .03.097v10.8a.15.15 0 0 1-.03.097l-.003.003H4.533l-.003-.003a.15.15 0 0 1-.03-.097V4.6Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.07; stroke-opacity: 0.25\"\n ></path>\n </svg>\n } @else if(clickedAlign()==='stretch'){\n <svg\n width=\"20\"\n height=\"60\"\n viewBox=\"0 0 20 60\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M4.6 4.5h10.8a.15.15 0 0 1 .097.03l.003.003v50.934l-.003.003a.15.15 0 0 1-.097.03H4.6a.15.15 0 0 1-.1-.033V4.533l.003-.003A.15.15 0 0 1 4.6 4.5Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.07; stroke-opacity: 0.25\"\n ></path>\n </svg>\n } @else{\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: #efeaea\"\n >\n <path\n d=\"M4.5 4.6a.1.1 0 0 1 .1-.1h10.8a.1.1 0 0 1 .1.1v10.8a.1.1 0 0 1-.1.1H4.6a.1.1 0 0 1-.1-.1V4.6Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"stroke-opacity: 0.25; fill-opacity: 0.07\"\n class=\"hover:fill-opacity-20\"\n ></path>\n </svg>\n }\n </div>\n </div>\n </div>\n }\n\n <div\n class=\"axp-grid-option-active ax-absolute ax-inset-0 ax-grid ax-pointer-events-none ax-transition-all\"\n [style.justify-items]=\"clickedJustify()\"\n [style.align-items]=\"clickedAlign()\"\n >\n <div class=\"ax-flex ax-justify-center ax-items-center ax-min-w-5 ax-min-h-5\">\n <div class=\"ax-size-auto ax-z-[2] ax-rounded-lg ax-bg-[rgb(30,30,30)] ax-flex-none\">\n @if(clickedJustify()==='stretch' && clickedAlign()==='stretch') {\n <svg\n width=\"60\"\n height=\"60\"\n viewBox=\"0 0 60 60\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M55.5 55.48a.02.02 0 0 1-.02.02H4.52a.02.02 0 0 1-.02-.02V4.52a.02.02 0 0 1 .02-.02h50.96a.02.02 0 0 1 .02.02v50.96Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.16; stroke: white\"\n ></path>\n <path\n d=\"m26.354 20.354 3.146-3.147V29.5h-3v1h3v12.293l-3.146-3.147-.707.708L30 44.707l4.354-4.353-.707-.708-3.147 3.147V30.5h12.293l-3.147 3.147.708.707L44.707 30l-4.353-4.354-.708.708 3.147 3.146H30.5V17.207l3.146 3.147.707-.707L30 15.293l-4.354 4.354.707.707Z\"\n fill=\"currentColor\"\n style=\"fill-opacity: 0.25\"\n ></path>\n <path\n d=\"m17.207 30.5 3.146 3.147-.707.707L15.293 30l4.353-4.354.707.708-3.146 3.146H26.5v1h-9.293Z\"\n fill=\"currentColor\"\n style=\"fill-opacity: 0.25\"\n ></path>\n </svg>\n } @else if(clickedJustify()==='stretch'){\n <svg\n width=\"60\"\n height=\"20\"\n viewBox=\"0 0 60 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M4.5 4.6a.15.15 0 0 1 .033-.1h50.934l.003.003a.15.15 0 0 1 .03.097v10.8a.15.15 0 0 1-.03.097l-.003.003H4.533l-.003-.003a.15.15 0 0 1-.03-.097V4.6Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.16; stroke: white\"\n ></path>\n </svg>\n } @else if(clickedAlign()==='stretch'){\n <svg\n width=\"20\"\n height=\"60\"\n viewBox=\"0 0 20 60\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M4.6 4.5h10.8a.15.15 0 0 1 .097.03l.003.003v50.934l-.003.003a.15.15 0 0 1-.097.03H4.6a.15.15 0 0 1-.1-.033V4.533l.003-.003A.15.15 0 0 1 4.6 4.5Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.16; stroke: white\"\n ></path>\n </svg>\n } @else{\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: #efeaea\"\n >\n <path\n d=\"M4.5 4.6a.1.1 0 0 1 .1-.1h10.8a.1.1 0 0 1 .1.1v10.8a.1.1 0 0 1-.1.1H4.6a.1.1 0 0 1-.1-.1V4.6Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill: #cebcbc; fill-opacity: 0.16\"\n ></path>\n </svg>\n }\n </div>\n </div>\n </div>\n </div>\n <div class=\"ax-grid ax-grid-cols-[auto_1fr] ax-items-center ax-justify-items-start ax-gap-2\">\n <span>X:</span>\n <div class=\"ax-w-36\">\n <ax-select-box\n [dataSource]=\"justifyDataSource\"\n [value]=\"selectedJustify()\"\n (onValueChanged)=\"onJustifyChange($event)\"\n textField=\"label\"\n valueField=\"value\"\n placeholder=\"Choose...\"\n >\n </ax-select-box>\n </div>\n <span>Y:</span>\n <div class=\"ax-w-36\">\n <ax-select-box\n [dataSource]=\"alignDataSource\"\n [value]=\"selectedAlign()\"\n (onValueChanged)=\"onAlignChange($event)\"\n textField=\"label\"\n valueField=\"value\"\n placeholder=\"Choose...\"\n >\n </ax-select-box>\n </div>\n </div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AXDecoratorModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXNumberBoxModule }, { kind: "component", type: i1$7.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "minValue", "maxValue", "showSpinButtons", "thousandsSeparator", "decimals", "changeOnScroll", "step"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "thousandsSeparatorChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: AXLabelModule }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i3$1.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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
19885
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPAdvancedGridOptionsWidgetEditComponent, isStandalone: true, selector: "axp-advanced-grid-options-widget-editor", usesInheritance: true, ngImport: i0, template: "<div class=\"axp-advanced-grid ax-w-11/12\">\n <div class=\"ax-grid ax-grid-cols-2 ax-grid-rows-2 ax-gap-x-3 ax-items-center ax-pb-2\">\n <span>Columns</span>\n <span>Items</span>\n <ax-number-box\n [minValue]=\"1\"\n [maxValue]=\"12\"\n [value]=\"columns()\"\n (onValueChanged)=\"changeValue($event, 'columns')\"\n ></ax-number-box>\n <ax-number-box\n [minValue]=\"1\"\n [maxValue]=\"99\"\n [value]=\"items()\"\n (onValueChanged)=\"changeValue($event, 'itemsCount')\"\n ></ax-number-box>\n </div>\n <span>Align</span>\n <div class=\"ax-flex ax-justify-between ax-gap-2 ax-items-center\">\n <div\n class=\"ax-relative ax-size-[62px] ax-bg-[rgb(30,30,30)] ax-border ax-border-white ax-border-opacity-15 ax-rounded\"\n >\n <div class=\"ax-absolute ax-inset-0 ax-grid ax-grid-cols-3 ax-grid-rows-3\">\n @for(side of gridSides; track side.value){\n <div\n [attr.aria-label]=\"side.label\"\n [attr.aria-value]=\"side.value\"\n class=\"ax-grid ax-place-content-center\"\n (mouseenter)=\"onHover(side)\"\n (mouseleave)=\"onHoverLeave()\"\n (click)=\"onClick(side)\"\n >\n @if (true) {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect x=\"7\" y=\"7\" width=\"2\" height=\"2\" rx=\"1\" fill=\"currentColor\" fill-opacity=\"0.3\"></rect>\n </svg>\n }\n </div>\n }\n </div>\n @if(hoveredJustify() && hoveredAlign()){\n <div\n class=\"axp-grid-option-hover ax-absolute ax-inset-0 ax-grid ax-pointer-events-none ax-transition-all\"\n [style.justify-items]=\"hoveredJustify()\"\n [style.align-items]=\"hoveredAlign()\"\n >\n <div class=\"ax-flex ax-justify-center ax-items-center ax-min-w-5 ax-min-h-5\">\n <div class=\"ax-size-auto ax-z-[1] ax-rounded-lg ax-bg-[rgb(30,30,30)] ax-flex-none\">\n @if(clickedJustify()==='stretch' && clickedAlign()==='stretch') {} @else if(clickedJustify()==='stretch'){\n <svg\n width=\"60\"\n height=\"20\"\n viewBox=\"0 0 60 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M4.5 4.6a.15.15 0 0 1 .033-.1h50.934l.003.003a.15.15 0 0 1 .03.097v10.8a.15.15 0 0 1-.03.097l-.003.003H4.533l-.003-.003a.15.15 0 0 1-.03-.097V4.6Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.07; stroke-opacity: 0.25\"\n ></path>\n </svg>\n } @else if(clickedAlign()==='stretch'){\n <svg\n width=\"20\"\n height=\"60\"\n viewBox=\"0 0 20 60\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M4.6 4.5h10.8a.15.15 0 0 1 .097.03l.003.003v50.934l-.003.003a.15.15 0 0 1-.097.03H4.6a.15.15 0 0 1-.1-.033V4.533l.003-.003A.15.15 0 0 1 4.6 4.5Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.07; stroke-opacity: 0.25\"\n ></path>\n </svg>\n } @else{\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: #efeaea\"\n >\n <path\n d=\"M4.5 4.6a.1.1 0 0 1 .1-.1h10.8a.1.1 0 0 1 .1.1v10.8a.1.1 0 0 1-.1.1H4.6a.1.1 0 0 1-.1-.1V4.6Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"stroke-opacity: 0.25; fill-opacity: 0.07\"\n class=\"hover:fill-opacity-20\"\n ></path>\n </svg>\n }\n </div>\n </div>\n </div>\n }\n\n <div\n class=\"axp-grid-option-active ax-absolute ax-inset-0 ax-grid ax-pointer-events-none ax-transition-all\"\n [style.justify-items]=\"clickedJustify()\"\n [style.align-items]=\"clickedAlign()\"\n >\n <div class=\"ax-flex ax-justify-center ax-items-center ax-min-w-5 ax-min-h-5\">\n <div class=\"ax-size-auto ax-z-[2] ax-rounded-lg ax-bg-[rgb(30,30,30)] ax-flex-none\">\n @if(clickedJustify()==='stretch' && clickedAlign()==='stretch') {\n <svg\n width=\"60\"\n height=\"60\"\n viewBox=\"0 0 60 60\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M55.5 55.48a.02.02 0 0 1-.02.02H4.52a.02.02 0 0 1-.02-.02V4.52a.02.02 0 0 1 .02-.02h50.96a.02.02 0 0 1 .02.02v50.96Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.16; stroke: white\"\n ></path>\n <path\n d=\"m26.354 20.354 3.146-3.147V29.5h-3v1h3v12.293l-3.146-3.147-.707.708L30 44.707l4.354-4.353-.707-.708-3.147 3.147V30.5h12.293l-3.147 3.147.708.707L44.707 30l-4.353-4.354-.708.708 3.147 3.146H30.5V17.207l3.146 3.147.707-.707L30 15.293l-4.354 4.354.707.707Z\"\n fill=\"currentColor\"\n style=\"fill-opacity: 0.25\"\n ></path>\n <path\n d=\"m17.207 30.5 3.146 3.147-.707.707L15.293 30l4.353-4.354.707.708-3.146 3.146H26.5v1h-9.293Z\"\n fill=\"currentColor\"\n style=\"fill-opacity: 0.25\"\n ></path>\n </svg>\n } @else if(clickedJustify()==='stretch'){\n <svg\n width=\"60\"\n height=\"20\"\n viewBox=\"0 0 60 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M4.5 4.6a.15.15 0 0 1 .033-.1h50.934l.003.003a.15.15 0 0 1 .03.097v10.8a.15.15 0 0 1-.03.097l-.003.003H4.533l-.003-.003a.15.15 0 0 1-.03-.097V4.6Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.16; stroke: white\"\n ></path>\n </svg>\n } @else if(clickedAlign()==='stretch'){\n <svg\n width=\"20\"\n height=\"60\"\n viewBox=\"0 0 20 60\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: white\"\n >\n <path\n d=\"M4.6 4.5h10.8a.15.15 0 0 1 .097.03l.003.003v50.934l-.003.003a.15.15 0 0 1-.097.03H4.6a.15.15 0 0 1-.1-.033V4.533l.003-.003A.15.15 0 0 1 4.6 4.5Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill-opacity: 0.16; stroke: white\"\n ></path>\n </svg>\n } @else{\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"color: #efeaea\"\n >\n <path\n d=\"M4.5 4.6a.1.1 0 0 1 .1-.1h10.8a.1.1 0 0 1 .1.1v10.8a.1.1 0 0 1-.1.1H4.6a.1.1 0 0 1-.1-.1V4.6Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n style=\"fill: #cebcbc; fill-opacity: 0.16\"\n ></path>\n </svg>\n }\n </div>\n </div>\n </div>\n </div>\n <div class=\"ax-grid ax-grid-cols-[auto_1fr] ax-items-center ax-justify-items-start ax-gap-2\">\n <span>X:</span>\n <div class=\"ax-w-36\">\n <ax-select-box\n [dataSource]=\"justifyDataSource\"\n [value]=\"selectedJustify()\"\n (onValueChanged)=\"onJustifyChange($event)\"\n textField=\"label\"\n valueField=\"value\"\n placeholder=\"Choose...\"\n >\n </ax-select-box>\n </div>\n <span>Y:</span>\n <div class=\"ax-w-36\">\n <ax-select-box\n [dataSource]=\"alignDataSource\"\n [value]=\"selectedAlign()\"\n (onValueChanged)=\"onAlignChange($event)\"\n textField=\"label\"\n valueField=\"value\"\n placeholder=\"Choose...\"\n >\n </ax-select-box>\n </div>\n </div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AXDecoratorModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXNumberBoxModule }, { kind: "component", type: i1$7.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "minValue", "maxValue", "showSpinButtons", "thousandsSeparator", "decimals", "changeOnScroll", "step"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "thousandsSeparatorChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: AXLabelModule }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i3.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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
19076
19886
|
}
|
|
19077
19887
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPAdvancedGridOptionsWidgetEditComponent, decorators: [{
|
|
19078
19888
|
type: Component,
|
|
@@ -19502,7 +20312,7 @@ class AXPBorderWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
19502
20312
|
};
|
|
19503
20313
|
}
|
|
19504
20314
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPBorderWidgetEditComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
19505
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPBorderWidgetEditComponent, isStandalone: true, selector: "axp-border-widget-editor", viewQueries: [{ propertyName: "allBorderEl", first: true, predicate: ["allBorderEl"], descendants: true, isSignal: true }, { propertyName: "allRadiusEl", first: true, predicate: ["allRadiusEl"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-pt-2 axp-border-container\">\n <div class=\"ax-radius-box ax-flex ax-justify-between ax-items-center ax-gap-2 ax-h-[26px]\">\n <span class=\"ax-text-sm ax-font-light\">Radius</span>\n <div class=\"ax-flex ax-gap-1 ax-items-center\">\n <button\n #allRadiusEl\n (pointerdown)=\"handleActiveRadiusSide($event)\"\n name=\"all\"\n class=\"ax-p-1 hover:!ax-bg-[var(--hover-effect)]\"\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M2.5 5.5C2.5 3.84315 3.84315 2.5 5.5 2.5H10.5C12.1569 2.5 13.5 3.84315 13.5 5.5V10.5C13.5 12.1569 12.1569 13.5 10.5 13.5H5.5C3.84315 13.5 2.5 12.1569 2.5 10.5V5.5Z\"\n stroke=\"currentColor\"\n ></path>\n </svg>\n </button>\n\n <button\n (pointerdown)=\"handleActiveRadiusSide($event)\"\n name=\"sides\"\n class=\"ax-p-1 hover:!ax-bg-[var(--hover-effect)]\"\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M4.5 2C3.11929 2 2 3.11929 2 4.5V7H3V4.5C3 3.67157 3.67157 3 4.5 3H7V2H4.5Z\"\n fill=\"currentColor\"\n ></path>\n <path\n d=\"M9 2V3H11.5C12.3284 3 13 3.67157 13 4.5V7H14V4.5C14 3.11929 12.8807 2 11.5 2H9Z\"\n fill=\"currentColor\"\n ></path>\n <path\n d=\"M14 9H13V11.5C13 12.3284 12.3284 13 11.5 13H9V14H11.5C12.8807 14 14 12.8807 14 11.5V9Z\"\n fill=\"currentColor\"\n ></path>\n <path\n d=\"M7 14V13H4.5C3.67157 13 3 12.3284 3 11.5V9H2V11.5C2 12.8807 3.11929 14 4.5 14H7Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n </button>\n\n @if (currentActiveRadiusSide() === 'all') {\n <div class=\"ax-flex ax-justify-center ax-items-center ax-flex-shrink\">\n <ax-range-slider\n [values]=\"allRadius()\"\n [min]=\"0\"\n [max]=\"100\"\n (valuesChange)=\"setBorder($event ?? 0, 'radius', 'all')\"\n class=\"ax-min-w-24\"\n ></ax-range-slider>\n </div>\n <div class=\"ax-flex ax-justify-start ax-items-center\">\n <ax-number-box\n [minValue]=\"0\"\n [maxValue]=\"100\"\n [value]=\"allRadius()\"\n [changeOnScroll]=\"true\"\n (valueChange)=\"setBorder($event ?? 0, 'radius', 'all')\"\n class=\"ax-min-w-[4.5rem] ax-sm\"\n [showSpinButtons]=\"false\"\n ><ax-suffix>\n <ax-dropdown-button [text]=\"getRadiusUnitLabel('all')\" [look]=\"'blank'\" [mode]=\"'dropdown'\">\n <ax-button-item-list>\n @for (u of radiusUnits; track $index) {\n <ax-button-item\n [text]=\"u.toUpperCase()\"\n [selected]=\"getRadiusUnit('all') === u\"\n (onClick)=\"onRadiusUnitChange(u, 'all')\"\n ></ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button> </ax-suffix\n ></ax-number-box>\n </div>\n } @else {\n <div class=\"ax-w-48\"></div>\n }\n </div>\n </div>\n\n <div\n class=\"axp-border-radius-sides ax-flex ax-justify-end ax-items-center ax-overflow-y-hidden ax-transition-[height] ax-duration-300 ax-ease-in-out\"\n [class]=\"currentActiveRadiusSide() === 'all' ? '!ax-h-0' : '!ax-h-auto'\"\n style=\"interpolate-size: allow-keywords\"\n >\n <div class=\"ax-grid ax-grid-cols-2 ax-grid-rows-2 ax-gap-2\">\n <div class=\"ax-flex ax-gap-1 ax-items-center\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g opacity=\"0.4\">\n <path d=\"M14 14V9H13V13H9V14H14Z\" fill=\"currentColor\"></path>\n <path d=\"M7 14V13H3V9H2V14H7Z\" fill=\"currentColor\"></path>\n <path d=\"M2 7H3V6.5C3 4.567 4.567 3 6.5 3H7V2H6.5C4.01472 2 2 4.01472 2 6.5V7Z\" fill=\"currentColor\"></path>\n <path d=\"M9 2V3H13V7H14V2H9Z\" fill=\"currentColor\"></path>\n </g>\n <path d=\"M2.5 7V6.5C2.5 4.29086 4.29086 2.5 6.5 2.5H7\" stroke=\"currentColor\"></path>\n </svg>\n <div class=\"ax-flex ax-justify-start ax-items-center ax-max-w-24\">\n <ax-number-box\n class=\"ax-sm\"\n [minValue]=\"0\"\n [changeOnScroll]=\"true\"\n [ngModel]=\"calculatedValues().radius['top-left']\"\n (onValueChanged)=\"setBorder($event.value ?? 0, 'radius', 'top-left')\"\n [showSpinButtons]=\"false\"\n ><ax-suffix>\n <ax-dropdown-button [text]=\"getRadiusUnitLabel('top-left')\" [look]=\"'blank'\" [mode]=\"'dropdown'\">\n <ax-button-item-list>\n @for (u of radiusUnits; track $index) {\n <ax-button-item\n [text]=\"u.toUpperCase()\"\n [selected]=\"getRadiusUnit('top-left') === u\"\n (onClick)=\"onRadiusUnitChange(u, 'top-left')\"\n ></ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button> </ax-suffix\n ></ax-number-box>\n </div>\n </div>\n <div class=\"ax-flex ax-gap-1 ax-items-center\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g opacity=\"0.4\">\n <path d=\"M2 14V9H3V13H7V14H2Z\" fill=\"currentColor\"></path>\n <path d=\"M9 14V13H13V9H14V14H9Z\" fill=\"currentColor\"></path>\n <path\n d=\"M14 7H13V6.5C13 4.567 11.433 3 9.5 3H9V2H9.5C11.9853 2 14 4.01472 14 6.5V7Z\"\n fill=\"currentColor\"\n ></path>\n <path d=\"M7 2V3H3V7H2V2H7Z\" fill=\"currentColor\"></path>\n </g>\n <path d=\"M13.5 7V6.5C13.5 4.29086 11.7091 2.5 9.5 2.5H9\" stroke=\"currentColor\"></path>\n </svg>\n <div class=\"ax-flex ax-justify-start ax-items-center ax-max-w-24\">\n <ax-number-box\n class=\"ax-sm\"\n [minValue]=\"0\"\n [changeOnScroll]=\"true\"\n [ngModel]=\"calculatedValues().radius['top-right']\"\n (onValueChanged)=\"setBorder($event.value ?? 0, 'radius', 'top-right')\"\n [showSpinButtons]=\"false\"\n ><ax-suffix>\n <ax-dropdown-button [text]=\"getRadiusUnitLabel('top-right')\" [look]=\"'blank'\" [mode]=\"'dropdown'\">\n <ax-button-item-list>\n @for (u of radiusUnits; track $index) {\n <ax-button-item\n [text]=\"u.toUpperCase()\"\n [selected]=\"getRadiusUnit('top-right') === u\"\n (onClick)=\"onRadiusUnitChange(u, 'top-right')\"\n ></ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button> </ax-suffix\n ></ax-number-box>\n </div>\n </div>\n <div class=\"ax-flex ax-gap-1 ax-items-center\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g opacity=\"0.4\">\n <path d=\"M2 2V7H3V3H7V2H2Z\" fill=\"currentColor\"></path>\n <path d=\"M9 2V3H13V7H14V2H9Z\" fill=\"currentColor\"></path>\n <path d=\"M14 9H13V13H9V14H14V9Z\" fill=\"currentColor\"></path>\n <path\n d=\"M7 14V13H6.5C4.567 13 3 11.433 3 9.5V9H2V9.5C2 11.9853 4.01472 14 6.5 14H7Z\"\n fill=\"currentColor\"\n ></path>\n </g>\n <path d=\"M2.5 9V9.5C2.5 11.7091 4.29086 13.5 6.5 13.5H7\" stroke=\"currentColor\"></path>\n </svg>\n <div class=\"ax-flex ax-justify-start ax-items-center ax-max-w-24\">\n <ax-number-box\n class=\"ax-sm\"\n [minValue]=\"0\"\n [changeOnScroll]=\"true\"\n [ngModel]=\"calculatedValues().radius['bottom-left']\"\n (onValueChanged)=\"setBorder($event.value ?? 0, 'radius', 'bottom-left')\"\n [showSpinButtons]=\"false\"\n ><ax-suffix>\n <ax-dropdown-button [text]=\"getRadiusUnitLabel('bottom-left')\" [look]=\"'blank'\" [mode]=\"'dropdown'\">\n <ax-button-item-list>\n @for (u of radiusUnits; track $index) {\n <ax-button-item\n [text]=\"u.toUpperCase()\"\n [selected]=\"getRadiusUnit('bottom-left') === u\"\n (onClick)=\"onRadiusUnitChange(u, 'bottom-left')\"\n ></ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button> </ax-suffix\n ></ax-number-box>\n </div>\n </div>\n <div class=\"ax-flex ax-gap-1 ax-items-center\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g opacity=\"0.4\">\n <path d=\"M2 2V7H3V3H7V2H2Z\" fill=\"currentColor\"></path>\n <path d=\"M9 2V3H13V7H14V2H9Z\" fill=\"currentColor\"></path>\n <path\n d=\"M14 9H13V11.5C13 12.3284 12.3284 13 11.5 13H9V14H11.5C12.8807 14 14 12.8807 14 11.5V9Z\"\n fill=\"currentColor\"\n ></path>\n <path d=\"M7 14V13H3V9H2V14H7Z\" fill=\"currentColor\"></path>\n </g>\n <path d=\"M13.5 9V9.5C13.5 11.7091 11.7091 13.5 9.5 13.5H9\" stroke=\"currentColor\"></path>\n </svg>\n <div class=\"ax-flex ax-justify-start ax-items-center ax-max-w-24\">\n <ax-number-box\n class=\"ax-sm\"\n [minValue]=\"0\"\n [changeOnScroll]=\"true\"\n [ngModel]=\"calculatedValues().radius['bottom-right']\"\n (onValueChanged)=\"setBorder($event.value ?? 0, 'radius', 'bottom-right')\"\n [showSpinButtons]=\"false\"\n ><ax-suffix>\n <ax-dropdown-button [text]=\"getRadiusUnitLabel('bottom-right')\" [look]=\"'blank'\" [mode]=\"'dropdown'\">\n <ax-button-item-list>\n @for (u of radiusUnits; track $index) {\n <ax-button-item\n [text]=\"u.toUpperCase()\"\n [selected]=\"getRadiusUnit('bottom-right') === u\"\n (onClick)=\"onRadiusUnitChange(u, 'bottom-right')\"\n ></ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button> </ax-suffix\n ></ax-number-box>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"ax-flex ax-justify-between ax-items-center ax-py-1\">\n <span class=\"ax-text-sm ax-font-light\">Borders</span>\n </div>\n\n <div class=\"ax-border-box ax-flex ax-justify-between ax-items-center ax-gap-4\">\n <div class=\"ax-grid ax-grid-cols-3 ax-grid-rows-3 ax-gap-1 ax-flex-shrink-0\">\n <!-- Top Border -->\n <div class=\"ax-border-box-top ax-col-start-2 ax-row-start-1\">\n <button\n (pointerdown)=\"handleActiveBorderSide($event)\"\n name=\"top\"\n class=\"ax-p-1 hover:!ax-bg-[var(--hover-effect)]\"\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n opacity=\"0.4\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M2 13C2 13.5523 2.44772 14 3 14H13C13.5523 14 14 13.5523 14 13V5H13V13H3V5H2V13Z\"\n fill=\"currentColor\"\n ></path>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M2 3H14V2H2V3Z\" fill=\"currentColor\"></path>\n </svg>\n </button>\n </div>\n\n <!-- Right Border -->\n <div class=\"ax-border-box-right ax-col-start-3 ax-row-start-2\">\n <button\n (pointerdown)=\"handleActiveBorderSide($event)\"\n name=\"right\"\n class=\"ax-p-1 hover:!ax-bg-[var(--hover-effect)]\"\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n opacity=\"0.4\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M3 2C2.44772 2 2 2.44772 2 3L2 13C2 13.5523 2.44772 14 3 14L11 14L11 13L3 13L3 3L11 3L11 2L3 2Z\"\n fill=\"currentColor\"\n ></path>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M13 2L13 14L14 14L14 2L13 2Z\" fill=\"currentColor\"></path>\n </svg>\n </button>\n </div>\n\n <!-- Bottom Border -->\n <div class=\"ax-border-box-bottom ax-col-start-2 ax-row-start-3\">\n <button\n (pointerdown)=\"handleActiveBorderSide($event)\"\n name=\"bottom\"\n class=\"ax-p-1 hover:!ax-bg-[var(--hover-effect)]\"\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n opacity=\"0.4\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M2 3C2 2.44772 2.44772 2 3 2H13C13.5523 2 14 2.44772 14 3V11H13V3H3V11H2V3Z\"\n fill=\"currentColor\"\n ></path>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M2 13H14V14H2V13Z\" fill=\"currentColor\"></path>\n </svg>\n </button>\n </div>\n\n <!-- Left Border -->\n <div class=\"ax-border-box-left ax-col-start-1 ax-row-start-2\">\n <button\n (pointerdown)=\"handleActiveBorderSide($event)\"\n name=\"left\"\n class=\"ax-p-1 hover:!ax-bg-[var(--hover-effect)]\"\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n opacity=\"0.4\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M13 2C13.5523 2 14 2.44772 14 3L14 13C14 13.5523 13.5523 14 13 14L5 14L5 13L13 13L13 3L5 3L5 2L13 2Z\"\n fill=\"currentColor\"\n ></path>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M3 2L3 14L2 14L2 2L3 2Z\" fill=\"currentColor\"></path>\n </svg>\n </button>\n </div>\n\n <!-- All -->\n <div class=\"ax-border-box-all ax-col-start-2 ax-row-start-2\">\n <button\n #allBorderEl\n (pointerdown)=\"handleActiveBorderSide($event)\"\n name=\"all\"\n class=\"ax-p-1 hover:!ax-bg-[var(--hover-effect)]\"\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M2 3C2 2.44772 2.44772 2 3 2H13C13.5523 2 14 2.44772 14 3V13C14 13.5523 13.5523 14 13 14H3C2.44772 14 2 13.5523 2 13V3ZM13 3L3 3V13H13V3Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n </button>\n </div>\n </div>\n <div class=\"ax-grid ax-grid-cols-[auto_1fr] ax-items-center ax-justify-items-center ax-gap-x-2 ax-gap-y-2\">\n <div class=\"ax-text-sm ax-font-light\">Style</div>\n <ax-button-group class=\"ax-sm\" [selection]=\"'single'\">\n <ax-button-group-item\n (onClick)=\"setBorder('none', 'style', currentActiveSide())\"\n [selected]=\"shownStyle() === 'none'\"\n ><ax-prefix\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M8.70714 8.00004L12.3536 4.35359L11.6465 3.64648L8.00004 7.29293L4.35359 3.64648L3.64648 4.35359L7.29293 8.00004L3.64648 11.6465L4.35359 12.3536L8.00004 8.70714L11.6465 12.3536L12.3536 11.6465L8.70714 8.00004Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n <ax-button-group-item\n (onClick)=\"setBorder('solid', 'style', currentActiveSide())\"\n [selected]=\"shownStyle() === 'solid'\"\n ><ax-prefix\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M2 7.5H14\" stroke=\"currentColor\"></path></svg></ax-prefix\n ></ax-button-group-item>\n <ax-button-group-item\n (onClick)=\"setBorder('dashed', 'style', currentActiveSide())\"\n [selected]=\"shownStyle() === 'dashed'\"\n ><ax-prefix\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M5 7H2V8H5V7ZM11 8H12H14V7H12H11V8ZM9.5 7H6.5V8H9.5V7Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n <ax-button-group-item\n (onClick)=\"setBorder('dotted', 'style', currentActiveSide())\"\n [selected]=\"shownStyle() === 'dotted'\"\n ><ax-prefix\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M4 7H3V8H4V7ZM6 7H5V8H6V7ZM7 7H8V8H7V7ZM10 7H9V8H10V7ZM11 7H12V8H11V7ZM14 7H13V8H14V7Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n </ax-button-group>\n <div class=\"ax-contents\" [class]=\"shownStyle() === 'none' ? 'ax-invisible' : 'ax-visible'\">\n <div class=\"ax-text-sm ax-font-light\">Width</div>\n <div class=\"ax-flex ax-justify-start ax-items-center ax-max-w-36\">\n <ax-number-box\n [minValue]=\"0\"\n [changeOnScroll]=\"true\"\n [value]=\"shownWidth()\"\n (onValueChanged)=\"setBorder($event.value ?? 0, 'width', currentActiveSide())\"\n class=\"ax-sm ax-exclude\"\n [showSpinButtons]=\"false\"\n ><ax-suffix>\n <ax-dropdown-button [text]=\"getWidthUnitLabel(currentActiveSide())\" [look]=\"'blank'\" [mode]=\"'dropdown'\">\n <ax-button-item-list>\n @for (u of widthUnits; track $index) {\n <ax-button-item\n [text]=\"u.toUpperCase()\"\n [selected]=\"getWidthUnit(currentActiveSide()) === u\"\n (onClick)=\"onWidthUnitChange(u, currentActiveSide())\"\n ></ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button> </ax-suffix\n ></ax-number-box>\n </div>\n\n <div class=\"ax-text-sm ax-font-light\">Color</div>\n <div class=\"ax-flex ax-justify-start ax-items-center ax-max-w-36 ax-overflow-hidden\">\n <ax-color-box\n class=\"ax-sm\"\n [value]=\"shownColor()\"\n (onValueChanged)=\"setBorder($event.value ?? '', 'color', currentActiveSide())\"\n ></ax-color-box>\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: ["axp-border-widget-edit{--ax-comp-range-slider-handler-size: .75rem;--focus-color: rgb(var(--ax-sys-color-primary-700));--hover-effect: rgb(var(--ax-sys-color-primary-500))}\n"], dependencies: [{ kind: "ngmodule", type: AXNumberBoxModule }, { kind: "component", type: i1$7.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "minValue", "maxValue", "showSpinButtons", "thousandsSeparator", "decimals", "changeOnScroll", "step"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "thousandsSeparatorChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXCheckBoxModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1$1.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: AXRangeSliderModule }, { kind: "component", type: i3$5.AXRangeSliderComponent, selector: "ax-range-slider", inputs: ["disabled", "readonly", "orientation", "color", "values", "mode", "min", "max", "step", "snap", "tooltipMode", "snapMode", "hasStep", "hasSnap", "hasLable", "hasTooltip"], outputs: ["valuesChange"] }, { kind: "ngmodule", type: AXButtonGroupModule }, { kind: "component", type: i1$j.AXButtonGroupComponent, selector: "ax-button-group", inputs: ["disabled", "color", "look", "fitParent", "selection"], outputs: ["onBlur", "onFocus", "lookChange", "colorChange", "disabledChange", "onClick", "selectionChange", "selectedButtonChange"] }, { kind: "component", type: i1$j.AXButtonGroupItemComponent, selector: "ax-button-group-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "ngmodule", type: AXColorBoxModule }, { kind: "component", type: i2$3.AXColorBoxComponent, selector: "ax-color-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "showBadge", "showValue", "showClearButton", "showIcon"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "component", type: i6$1.AXDropdownButtonComponent, selector: "ax-dropdown-button", inputs: ["disabled", "size", "color", "look", "text", "type", "mode"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "lookChange", "colorChange", "disabledChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
20315
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPBorderWidgetEditComponent, isStandalone: true, selector: "axp-border-widget-editor", viewQueries: [{ propertyName: "allBorderEl", first: true, predicate: ["allBorderEl"], descendants: true, isSignal: true }, { propertyName: "allRadiusEl", first: true, predicate: ["allRadiusEl"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-pt-2 axp-border-container\">\n <div class=\"ax-radius-box ax-flex ax-justify-between ax-items-center ax-gap-2 ax-h-[26px]\">\n <span class=\"ax-text-sm ax-font-light\">Radius</span>\n <div class=\"ax-flex ax-gap-1 ax-items-center\">\n <button\n #allRadiusEl\n (pointerdown)=\"handleActiveRadiusSide($event)\"\n name=\"all\"\n class=\"ax-p-1 hover:!ax-bg-[var(--hover-effect)]\"\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M2.5 5.5C2.5 3.84315 3.84315 2.5 5.5 2.5H10.5C12.1569 2.5 13.5 3.84315 13.5 5.5V10.5C13.5 12.1569 12.1569 13.5 10.5 13.5H5.5C3.84315 13.5 2.5 12.1569 2.5 10.5V5.5Z\"\n stroke=\"currentColor\"\n ></path>\n </svg>\n </button>\n\n <button\n (pointerdown)=\"handleActiveRadiusSide($event)\"\n name=\"sides\"\n class=\"ax-p-1 hover:!ax-bg-[var(--hover-effect)]\"\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M4.5 2C3.11929 2 2 3.11929 2 4.5V7H3V4.5C3 3.67157 3.67157 3 4.5 3H7V2H4.5Z\"\n fill=\"currentColor\"\n ></path>\n <path\n d=\"M9 2V3H11.5C12.3284 3 13 3.67157 13 4.5V7H14V4.5C14 3.11929 12.8807 2 11.5 2H9Z\"\n fill=\"currentColor\"\n ></path>\n <path\n d=\"M14 9H13V11.5C13 12.3284 12.3284 13 11.5 13H9V14H11.5C12.8807 14 14 12.8807 14 11.5V9Z\"\n fill=\"currentColor\"\n ></path>\n <path\n d=\"M7 14V13H4.5C3.67157 13 3 12.3284 3 11.5V9H2V11.5C2 12.8807 3.11929 14 4.5 14H7Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n </button>\n\n @if (currentActiveRadiusSide() === 'all') {\n <div class=\"ax-flex ax-justify-center ax-items-center ax-flex-shrink\">\n <ax-range-slider\n [values]=\"allRadius()\"\n [min]=\"0\"\n [max]=\"100\"\n (valuesChange)=\"setBorder($event ?? 0, 'radius', 'all')\"\n class=\"ax-min-w-24\"\n ></ax-range-slider>\n </div>\n <div class=\"ax-flex ax-justify-start ax-items-center\">\n <ax-number-box\n [minValue]=\"0\"\n [maxValue]=\"100\"\n [value]=\"allRadius()\"\n [changeOnScroll]=\"true\"\n (valueChange)=\"setBorder($event ?? 0, 'radius', 'all')\"\n class=\"ax-min-w-[4.5rem] ax-sm\"\n [showSpinButtons]=\"false\"\n ><ax-suffix>\n <ax-dropdown-button [text]=\"getRadiusUnitLabel('all')\" [look]=\"'blank'\" [mode]=\"'dropdown'\">\n <ax-button-item-list>\n @for (u of radiusUnits; track $index) {\n <ax-button-item\n [text]=\"u.toUpperCase()\"\n [selected]=\"getRadiusUnit('all') === u\"\n (onClick)=\"onRadiusUnitChange(u, 'all')\"\n ></ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button> </ax-suffix\n ></ax-number-box>\n </div>\n } @else {\n <div class=\"ax-w-48\"></div>\n }\n </div>\n </div>\n\n <div\n class=\"axp-border-radius-sides ax-flex ax-justify-end ax-items-center ax-overflow-y-hidden ax-transition-[height] ax-duration-300 ax-ease-in-out\"\n [class]=\"currentActiveRadiusSide() === 'all' ? '!ax-h-0' : '!ax-h-auto'\"\n style=\"interpolate-size: allow-keywords\"\n >\n <div class=\"ax-grid ax-grid-cols-2 ax-grid-rows-2 ax-gap-2\">\n <div class=\"ax-flex ax-gap-1 ax-items-center\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g opacity=\"0.4\">\n <path d=\"M14 14V9H13V13H9V14H14Z\" fill=\"currentColor\"></path>\n <path d=\"M7 14V13H3V9H2V14H7Z\" fill=\"currentColor\"></path>\n <path d=\"M2 7H3V6.5C3 4.567 4.567 3 6.5 3H7V2H6.5C4.01472 2 2 4.01472 2 6.5V7Z\" fill=\"currentColor\"></path>\n <path d=\"M9 2V3H13V7H14V2H9Z\" fill=\"currentColor\"></path>\n </g>\n <path d=\"M2.5 7V6.5C2.5 4.29086 4.29086 2.5 6.5 2.5H7\" stroke=\"currentColor\"></path>\n </svg>\n <div class=\"ax-flex ax-justify-start ax-items-center ax-max-w-24\">\n <ax-number-box\n class=\"ax-sm\"\n [minValue]=\"0\"\n [changeOnScroll]=\"true\"\n [ngModel]=\"calculatedValues().radius['top-left']\"\n (onValueChanged)=\"setBorder($event.value ?? 0, 'radius', 'top-left')\"\n [showSpinButtons]=\"false\"\n ><ax-suffix>\n <ax-dropdown-button [text]=\"getRadiusUnitLabel('top-left')\" [look]=\"'blank'\" [mode]=\"'dropdown'\">\n <ax-button-item-list>\n @for (u of radiusUnits; track $index) {\n <ax-button-item\n [text]=\"u.toUpperCase()\"\n [selected]=\"getRadiusUnit('top-left') === u\"\n (onClick)=\"onRadiusUnitChange(u, 'top-left')\"\n ></ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button> </ax-suffix\n ></ax-number-box>\n </div>\n </div>\n <div class=\"ax-flex ax-gap-1 ax-items-center\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g opacity=\"0.4\">\n <path d=\"M2 14V9H3V13H7V14H2Z\" fill=\"currentColor\"></path>\n <path d=\"M9 14V13H13V9H14V14H9Z\" fill=\"currentColor\"></path>\n <path\n d=\"M14 7H13V6.5C13 4.567 11.433 3 9.5 3H9V2H9.5C11.9853 2 14 4.01472 14 6.5V7Z\"\n fill=\"currentColor\"\n ></path>\n <path d=\"M7 2V3H3V7H2V2H7Z\" fill=\"currentColor\"></path>\n </g>\n <path d=\"M13.5 7V6.5C13.5 4.29086 11.7091 2.5 9.5 2.5H9\" stroke=\"currentColor\"></path>\n </svg>\n <div class=\"ax-flex ax-justify-start ax-items-center ax-max-w-24\">\n <ax-number-box\n class=\"ax-sm\"\n [minValue]=\"0\"\n [changeOnScroll]=\"true\"\n [ngModel]=\"calculatedValues().radius['top-right']\"\n (onValueChanged)=\"setBorder($event.value ?? 0, 'radius', 'top-right')\"\n [showSpinButtons]=\"false\"\n ><ax-suffix>\n <ax-dropdown-button [text]=\"getRadiusUnitLabel('top-right')\" [look]=\"'blank'\" [mode]=\"'dropdown'\">\n <ax-button-item-list>\n @for (u of radiusUnits; track $index) {\n <ax-button-item\n [text]=\"u.toUpperCase()\"\n [selected]=\"getRadiusUnit('top-right') === u\"\n (onClick)=\"onRadiusUnitChange(u, 'top-right')\"\n ></ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button> </ax-suffix\n ></ax-number-box>\n </div>\n </div>\n <div class=\"ax-flex ax-gap-1 ax-items-center\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g opacity=\"0.4\">\n <path d=\"M2 2V7H3V3H7V2H2Z\" fill=\"currentColor\"></path>\n <path d=\"M9 2V3H13V7H14V2H9Z\" fill=\"currentColor\"></path>\n <path d=\"M14 9H13V13H9V14H14V9Z\" fill=\"currentColor\"></path>\n <path\n d=\"M7 14V13H6.5C4.567 13 3 11.433 3 9.5V9H2V9.5C2 11.9853 4.01472 14 6.5 14H7Z\"\n fill=\"currentColor\"\n ></path>\n </g>\n <path d=\"M2.5 9V9.5C2.5 11.7091 4.29086 13.5 6.5 13.5H7\" stroke=\"currentColor\"></path>\n </svg>\n <div class=\"ax-flex ax-justify-start ax-items-center ax-max-w-24\">\n <ax-number-box\n class=\"ax-sm\"\n [minValue]=\"0\"\n [changeOnScroll]=\"true\"\n [ngModel]=\"calculatedValues().radius['bottom-left']\"\n (onValueChanged)=\"setBorder($event.value ?? 0, 'radius', 'bottom-left')\"\n [showSpinButtons]=\"false\"\n ><ax-suffix>\n <ax-dropdown-button [text]=\"getRadiusUnitLabel('bottom-left')\" [look]=\"'blank'\" [mode]=\"'dropdown'\">\n <ax-button-item-list>\n @for (u of radiusUnits; track $index) {\n <ax-button-item\n [text]=\"u.toUpperCase()\"\n [selected]=\"getRadiusUnit('bottom-left') === u\"\n (onClick)=\"onRadiusUnitChange(u, 'bottom-left')\"\n ></ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button> </ax-suffix\n ></ax-number-box>\n </div>\n </div>\n <div class=\"ax-flex ax-gap-1 ax-items-center\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g opacity=\"0.4\">\n <path d=\"M2 2V7H3V3H7V2H2Z\" fill=\"currentColor\"></path>\n <path d=\"M9 2V3H13V7H14V2H9Z\" fill=\"currentColor\"></path>\n <path\n d=\"M14 9H13V11.5C13 12.3284 12.3284 13 11.5 13H9V14H11.5C12.8807 14 14 12.8807 14 11.5V9Z\"\n fill=\"currentColor\"\n ></path>\n <path d=\"M7 14V13H3V9H2V14H7Z\" fill=\"currentColor\"></path>\n </g>\n <path d=\"M13.5 9V9.5C13.5 11.7091 11.7091 13.5 9.5 13.5H9\" stroke=\"currentColor\"></path>\n </svg>\n <div class=\"ax-flex ax-justify-start ax-items-center ax-max-w-24\">\n <ax-number-box\n class=\"ax-sm\"\n [minValue]=\"0\"\n [changeOnScroll]=\"true\"\n [ngModel]=\"calculatedValues().radius['bottom-right']\"\n (onValueChanged)=\"setBorder($event.value ?? 0, 'radius', 'bottom-right')\"\n [showSpinButtons]=\"false\"\n ><ax-suffix>\n <ax-dropdown-button [text]=\"getRadiusUnitLabel('bottom-right')\" [look]=\"'blank'\" [mode]=\"'dropdown'\">\n <ax-button-item-list>\n @for (u of radiusUnits; track $index) {\n <ax-button-item\n [text]=\"u.toUpperCase()\"\n [selected]=\"getRadiusUnit('bottom-right') === u\"\n (onClick)=\"onRadiusUnitChange(u, 'bottom-right')\"\n ></ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button> </ax-suffix\n ></ax-number-box>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"ax-flex ax-justify-between ax-items-center ax-py-1\">\n <span class=\"ax-text-sm ax-font-light\">Borders</span>\n </div>\n\n <div class=\"ax-border-box ax-flex ax-justify-between ax-items-center ax-gap-4\">\n <div class=\"ax-grid ax-grid-cols-3 ax-grid-rows-3 ax-gap-1 ax-flex-shrink-0\">\n <!-- Top Border -->\n <div class=\"ax-border-box-top ax-col-start-2 ax-row-start-1\">\n <button\n (pointerdown)=\"handleActiveBorderSide($event)\"\n name=\"top\"\n class=\"ax-p-1 hover:!ax-bg-[var(--hover-effect)]\"\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n opacity=\"0.4\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M2 13C2 13.5523 2.44772 14 3 14H13C13.5523 14 14 13.5523 14 13V5H13V13H3V5H2V13Z\"\n fill=\"currentColor\"\n ></path>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M2 3H14V2H2V3Z\" fill=\"currentColor\"></path>\n </svg>\n </button>\n </div>\n\n <!-- Right Border -->\n <div class=\"ax-border-box-right ax-col-start-3 ax-row-start-2\">\n <button\n (pointerdown)=\"handleActiveBorderSide($event)\"\n name=\"right\"\n class=\"ax-p-1 hover:!ax-bg-[var(--hover-effect)]\"\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n opacity=\"0.4\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M3 2C2.44772 2 2 2.44772 2 3L2 13C2 13.5523 2.44772 14 3 14L11 14L11 13L3 13L3 3L11 3L11 2L3 2Z\"\n fill=\"currentColor\"\n ></path>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M13 2L13 14L14 14L14 2L13 2Z\" fill=\"currentColor\"></path>\n </svg>\n </button>\n </div>\n\n <!-- Bottom Border -->\n <div class=\"ax-border-box-bottom ax-col-start-2 ax-row-start-3\">\n <button\n (pointerdown)=\"handleActiveBorderSide($event)\"\n name=\"bottom\"\n class=\"ax-p-1 hover:!ax-bg-[var(--hover-effect)]\"\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n opacity=\"0.4\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M2 3C2 2.44772 2.44772 2 3 2H13C13.5523 2 14 2.44772 14 3V11H13V3H3V11H2V3Z\"\n fill=\"currentColor\"\n ></path>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M2 13H14V14H2V13Z\" fill=\"currentColor\"></path>\n </svg>\n </button>\n </div>\n\n <!-- Left Border -->\n <div class=\"ax-border-box-left ax-col-start-1 ax-row-start-2\">\n <button\n (pointerdown)=\"handleActiveBorderSide($event)\"\n name=\"left\"\n class=\"ax-p-1 hover:!ax-bg-[var(--hover-effect)]\"\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n opacity=\"0.4\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M13 2C13.5523 2 14 2.44772 14 3L14 13C14 13.5523 13.5523 14 13 14L5 14L5 13L13 13L13 3L5 3L5 2L13 2Z\"\n fill=\"currentColor\"\n ></path>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M3 2L3 14L2 14L2 2L3 2Z\" fill=\"currentColor\"></path>\n </svg>\n </button>\n </div>\n\n <!-- All -->\n <div class=\"ax-border-box-all ax-col-start-2 ax-row-start-2\">\n <button\n #allBorderEl\n (pointerdown)=\"handleActiveBorderSide($event)\"\n name=\"all\"\n class=\"ax-p-1 hover:!ax-bg-[var(--hover-effect)]\"\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M2 3C2 2.44772 2.44772 2 3 2H13C13.5523 2 14 2.44772 14 3V13C14 13.5523 13.5523 14 13 14H3C2.44772 14 2 13.5523 2 13V3ZM13 3L3 3V13H13V3Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n </button>\n </div>\n </div>\n <div class=\"ax-grid ax-grid-cols-[auto_1fr] ax-items-center ax-justify-items-center ax-gap-x-2 ax-gap-y-2\">\n <div class=\"ax-text-sm ax-font-light\">Style</div>\n <ax-button-group class=\"ax-sm\" [selection]=\"'single'\">\n <ax-button-group-item\n (onClick)=\"setBorder('none', 'style', currentActiveSide())\"\n [selected]=\"shownStyle() === 'none'\"\n ><ax-prefix\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M8.70714 8.00004L12.3536 4.35359L11.6465 3.64648L8.00004 7.29293L4.35359 3.64648L3.64648 4.35359L7.29293 8.00004L3.64648 11.6465L4.35359 12.3536L8.00004 8.70714L11.6465 12.3536L12.3536 11.6465L8.70714 8.00004Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n <ax-button-group-item\n (onClick)=\"setBorder('solid', 'style', currentActiveSide())\"\n [selected]=\"shownStyle() === 'solid'\"\n ><ax-prefix\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M2 7.5H14\" stroke=\"currentColor\"></path></svg></ax-prefix\n ></ax-button-group-item>\n <ax-button-group-item\n (onClick)=\"setBorder('dashed', 'style', currentActiveSide())\"\n [selected]=\"shownStyle() === 'dashed'\"\n ><ax-prefix\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M5 7H2V8H5V7ZM11 8H12H14V7H12H11V8ZM9.5 7H6.5V8H9.5V7Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n <ax-button-group-item\n (onClick)=\"setBorder('dotted', 'style', currentActiveSide())\"\n [selected]=\"shownStyle() === 'dotted'\"\n ><ax-prefix\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M4 7H3V8H4V7ZM6 7H5V8H6V7ZM7 7H8V8H7V7ZM10 7H9V8H10V7ZM11 7H12V8H11V7ZM14 7H13V8H14V7Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n </ax-button-group>\n <div class=\"ax-contents\" [class]=\"shownStyle() === 'none' ? 'ax-invisible' : 'ax-visible'\">\n <div class=\"ax-text-sm ax-font-light\">Width</div>\n <div class=\"ax-flex ax-justify-start ax-items-center ax-max-w-36\">\n <ax-number-box\n [minValue]=\"0\"\n [changeOnScroll]=\"true\"\n [value]=\"shownWidth()\"\n (onValueChanged)=\"setBorder($event.value ?? 0, 'width', currentActiveSide())\"\n class=\"ax-sm ax-exclude\"\n [showSpinButtons]=\"false\"\n ><ax-suffix>\n <ax-dropdown-button [text]=\"getWidthUnitLabel(currentActiveSide())\" [look]=\"'blank'\" [mode]=\"'dropdown'\">\n <ax-button-item-list>\n @for (u of widthUnits; track $index) {\n <ax-button-item\n [text]=\"u.toUpperCase()\"\n [selected]=\"getWidthUnit(currentActiveSide()) === u\"\n (onClick)=\"onWidthUnitChange(u, currentActiveSide())\"\n ></ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button> </ax-suffix\n ></ax-number-box>\n </div>\n\n <div class=\"ax-text-sm ax-font-light\">Color</div>\n <div class=\"ax-flex ax-justify-start ax-items-center ax-max-w-36 ax-overflow-hidden\">\n <ax-color-box\n class=\"ax-sm\"\n [value]=\"shownColor()\"\n (onValueChanged)=\"setBorder($event.value ?? '', 'color', currentActiveSide())\"\n ></ax-color-box>\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: ["axp-border-widget-edit{--ax-comp-range-slider-handler-size: .75rem;--focus-color: rgb(var(--ax-sys-color-primary-700));--hover-effect: rgb(var(--ax-sys-color-primary-500))}\n"], dependencies: [{ kind: "ngmodule", type: AXNumberBoxModule }, { kind: "component", type: i1$7.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "minValue", "maxValue", "showSpinButtons", "thousandsSeparator", "decimals", "changeOnScroll", "step"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "thousandsSeparatorChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXCheckBoxModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1$1.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: AXRangeSliderModule }, { kind: "component", type: i3$4.AXRangeSliderComponent, selector: "ax-range-slider", inputs: ["disabled", "readonly", "orientation", "color", "values", "mode", "min", "max", "step", "snap", "tooltipMode", "snapMode", "hasStep", "hasSnap", "hasLable", "hasTooltip"], outputs: ["valuesChange"] }, { kind: "ngmodule", type: AXButtonGroupModule }, { kind: "component", type: i1$j.AXButtonGroupComponent, selector: "ax-button-group", inputs: ["disabled", "color", "look", "fitParent", "selection"], outputs: ["onBlur", "onFocus", "lookChange", "colorChange", "disabledChange", "onClick", "selectionChange", "selectedButtonChange"] }, { kind: "component", type: i1$j.AXButtonGroupItemComponent, selector: "ax-button-group-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "ngmodule", type: AXColorBoxModule }, { kind: "component", type: i2$3.AXColorBoxComponent, selector: "ax-color-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "showBadge", "showValue", "showClearButton", "showIcon"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "component", type: i6$1.AXDropdownButtonComponent, selector: "ax-dropdown-button", inputs: ["disabled", "size", "color", "look", "text", "type", "mode"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "lookChange", "colorChange", "disabledChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
19506
20316
|
}
|
|
19507
20317
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPBorderWidgetEditComponent, decorators: [{
|
|
19508
20318
|
type: Component,
|
|
@@ -19946,7 +20756,7 @@ class AXPDataSourceOptionsWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
19946
20756
|
//#region ---- Lifecycle ----
|
|
19947
20757
|
#init;
|
|
19948
20758
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPDataSourceOptionsWidgetEditComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
19949
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPDataSourceOptionsWidgetEditComponent, isStandalone: true, selector: "axp-data-source-options-widget-editor", usesInheritance: true, ngImport: i0, template: "<div class=\"axp-data-source-options ax-flex ax-flex-col ax-gap-3 ax-py-2\">\n <!-- 1. Mode: exists or list -->\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <span class=\"ax-font-medium ax-text-sm\">{{ I18N.source | translate | async }}</span>\n <ax-selection-list [items]=\"modeItems()\" [ngModel]=\"dataSourceMode()\"\n (onValueChanged)=\"setDataSourceMode($event.value)\" direction=\"horizontal\" [multiple]=\"false\" [showControl]=\"true\"\n valueField=\"value\" textField=\"text\" />\n </div>\n\n <!-- 2. Select existing data source (only when mode is exists) -->\n @if (dataSourceMode() === 'exists') {\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <span class=\"ax-font-medium ax-text-sm\">{{ I18N.dataSource | translate | async }}</span>\n <ax-select-box [dataSource]=\"definitionsDataSource\" [ngModel]=\"getValue()['dataSource']\"\n (onValueChanged)=\"onDefinitionChange($event)\" valueField=\"name\" textField=\"title\"\n [placeholder]=\"(I18N.dataSourcePlaceholder | translate | async) ?? ''\">\n <ax-search-box></ax-search-box>\n <ax-clear-button></ax-clear-button>\n </ax-select-box>\n </div>\n }\n\n <!-- 3. Simple list (text rows) -->\n @if (dataSourceMode() === 'list') {\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <span class=\"ax-font-medium ax-text-sm\">{{ I18N.listItems | translate | async }}</span>\n <axp-repeater-rows-layout\n [count]=\"listEntries().length\"\n [rowTemplate]=\"listRowTpl\"\n [hasControls]=\"true\"\n [allowReorder]=\"true\"\n [addItemLabelKey]=\"I18N.addListItem\"\n (addClick)=\"addListEntry()\"\n (removeClick)=\"removeListEntry($event)\"\n (drop)=\"onListDrop($event)\"\n ></axp-repeater-rows-layout>\n <ng-template #listRowTpl let-index=\"index\">\n <ax-text-box\n class=\"ax-w-full\"\n [ngModel]=\"listEntries()[index]\"\n (onValueChanged)=\"onListEntryChange(index, $event)\"\n />\n </ng-template>\n </div>\n }\n\n <!-- 4. valueField / textField (exists only) -->\n @if (fieldSelectsKey() && dataSourceMode() === 'exists') {\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <span class=\"ax-font-medium ax-text-sm\">{{ I18N.valueField | translate | async }}</span>\n <ax-select-box [dataSource]=\"valueFieldDataSource()\" [ngModel]=\"getValue()['valueField']\"\n (onValueChanged)=\"onValueFieldChange($event)\" valueField=\"value\" textField=\"text\"\n [disabled]=\"valueTextFieldDisabled()\"\n [placeholder]=\"((valueTextFieldDisabled() ? I18N.valueFieldPlaceholderDisabled : I18N.valueFieldPlaceholder) | translate | async) ?? ''\">\n <ax-clear-button></ax-clear-button>\n </ax-select-box>\n </div>\n\n <!-- textField select -->\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <span class=\"ax-font-medium ax-text-sm\">{{ I18N.textField | translate | async }}</span>\n <ax-select-box [dataSource]=\"textFieldDataSource()\" [ngModel]=\"getValue()['textField']\"\n (onValueChanged)=\"onTextFieldChange($event)\" valueField=\"value\" textField=\"text\"\n [disabled]=\"valueTextFieldDisabled()\"\n [placeholder]=\"((valueTextFieldDisabled() ? I18N.textFieldPlaceholderDisabled : I18N.textFieldPlaceholder) | translate | async) ?? ''\">\n <ax-clear-button></ax-clear-button>\n </ax-select-box>\n </div>\n }\n\n <!-- 5. Filter editor (registered data source with filters) -->\n @if (dataSourceMode() === 'exists' && (selectedDefinition()?.filters?.length ?? 0) > 0) {\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <span class=\"ax-font-medium ax-text-sm\">{{ I18N.filters | translate | async }}</span>\n @if (filterCount() === 0) {\n <ax-button look=\"twotone\" color=\"default\" size=\"sm\" [text]=\"(I18N.filtersButtonEmpty | translate | async) ?? ''\"\n (onClick)=\"openFilterEditor()\" class=\"ax-w-full\">\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-filter\"></ax-icon>\n </ax-prefix>\n </ax-button>\n } @else {\n <ax-button look=\"twotone\" color=\"default\" size=\"sm\"\n [text]=\"((I18N.filtersButtonWithCount | translate: { params: { count: filterCount() } }) | async) ?? ''\"\n (onClick)=\"openFilterEditor()\" class=\"ax-w-full\">\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-filter\"></ax-icon>\n </ax-prefix>\n </ax-button>\n }\n </div>\n }\n</div>\n", styles: [".axp-data-source-options{min-width:0}\n"], dependencies: [{ kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.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.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: AXSearchBoxModule }, { kind: "component", type: i5$1.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: AXSelectBoxModule }, { kind: "component", type: i3
|
|
20759
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPDataSourceOptionsWidgetEditComponent, isStandalone: true, selector: "axp-data-source-options-widget-editor", usesInheritance: true, ngImport: i0, template: "<div class=\"axp-data-source-options ax-flex ax-flex-col ax-gap-3 ax-py-2\">\n <!-- 1. Mode: exists or list -->\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <span class=\"ax-font-medium ax-text-sm\">{{ I18N.source | translate | async }}</span>\n <ax-selection-list [items]=\"modeItems()\" [ngModel]=\"dataSourceMode()\"\n (onValueChanged)=\"setDataSourceMode($event.value)\" direction=\"horizontal\" [multiple]=\"false\" [showControl]=\"true\"\n valueField=\"value\" textField=\"text\" />\n </div>\n\n <!-- 2. Select existing data source (only when mode is exists) -->\n @if (dataSourceMode() === 'exists') {\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <span class=\"ax-font-medium ax-text-sm\">{{ I18N.dataSource | translate | async }}</span>\n <ax-select-box [dataSource]=\"definitionsDataSource\" [ngModel]=\"getValue()['dataSource']\"\n (onValueChanged)=\"onDefinitionChange($event)\" valueField=\"name\" textField=\"title\"\n [placeholder]=\"(I18N.dataSourcePlaceholder | translate | async) ?? ''\">\n <ax-search-box></ax-search-box>\n <ax-clear-button></ax-clear-button>\n </ax-select-box>\n </div>\n }\n\n <!-- 3. Simple list (text rows) -->\n @if (dataSourceMode() === 'list') {\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <span class=\"ax-font-medium ax-text-sm\">{{ I18N.listItems | translate | async }}</span>\n <axp-repeater-rows-layout\n [count]=\"listEntries().length\"\n [rowTemplate]=\"listRowTpl\"\n [hasControls]=\"true\"\n [allowReorder]=\"true\"\n [addItemLabelKey]=\"I18N.addListItem\"\n (addClick)=\"addListEntry()\"\n (removeClick)=\"removeListEntry($event)\"\n (drop)=\"onListDrop($event)\"\n ></axp-repeater-rows-layout>\n <ng-template #listRowTpl let-index=\"index\">\n <ax-text-box\n class=\"ax-w-full\"\n [ngModel]=\"listEntries()[index]\"\n (onValueChanged)=\"onListEntryChange(index, $event)\"\n />\n </ng-template>\n </div>\n }\n\n <!-- 4. valueField / textField (exists only) -->\n @if (fieldSelectsKey() && dataSourceMode() === 'exists') {\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <span class=\"ax-font-medium ax-text-sm\">{{ I18N.valueField | translate | async }}</span>\n <ax-select-box [dataSource]=\"valueFieldDataSource()\" [ngModel]=\"getValue()['valueField']\"\n (onValueChanged)=\"onValueFieldChange($event)\" valueField=\"value\" textField=\"text\"\n [disabled]=\"valueTextFieldDisabled()\"\n [placeholder]=\"((valueTextFieldDisabled() ? I18N.valueFieldPlaceholderDisabled : I18N.valueFieldPlaceholder) | translate | async) ?? ''\">\n <ax-clear-button></ax-clear-button>\n </ax-select-box>\n </div>\n\n <!-- textField select -->\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <span class=\"ax-font-medium ax-text-sm\">{{ I18N.textField | translate | async }}</span>\n <ax-select-box [dataSource]=\"textFieldDataSource()\" [ngModel]=\"getValue()['textField']\"\n (onValueChanged)=\"onTextFieldChange($event)\" valueField=\"value\" textField=\"text\"\n [disabled]=\"valueTextFieldDisabled()\"\n [placeholder]=\"((valueTextFieldDisabled() ? I18N.textFieldPlaceholderDisabled : I18N.textFieldPlaceholder) | translate | async) ?? ''\">\n <ax-clear-button></ax-clear-button>\n </ax-select-box>\n </div>\n }\n\n <!-- 5. Filter editor (registered data source with filters) -->\n @if (dataSourceMode() === 'exists' && (selectedDefinition()?.filters?.length ?? 0) > 0) {\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <span class=\"ax-font-medium ax-text-sm\">{{ I18N.filters | translate | async }}</span>\n @if (filterCount() === 0) {\n <ax-button look=\"twotone\" color=\"default\" size=\"sm\" [text]=\"(I18N.filtersButtonEmpty | translate | async) ?? ''\"\n (onClick)=\"openFilterEditor()\" class=\"ax-w-full\">\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-filter\"></ax-icon>\n </ax-prefix>\n </ax-button>\n } @else {\n <ax-button look=\"twotone\" color=\"default\" size=\"sm\"\n [text]=\"((I18N.filtersButtonWithCount | translate: { params: { count: filterCount() } }) | async) ?? ''\"\n (onClick)=\"openFilterEditor()\" class=\"ax-w-full\">\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-filter\"></ax-icon>\n </ax-prefix>\n </ax-button>\n }\n </div>\n }\n</div>\n", styles: [".axp-data-source-options{min-width:0}\n"], dependencies: [{ kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.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.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: AXSearchBoxModule }, { kind: "component", type: i5$1.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: AXSelectBoxModule }, { kind: "component", type: i3.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: AXSelectionListModule }, { kind: "component", type: i2$4.AXSelectionListComponent, selector: "ax-selection-list", inputs: ["id", "name", "disabled", "readonly", "tabIndex", "size", "value", "valueField", "textField", "disabledField", "readonlyField", "multiple", "direction", "customTemplate", "showControl", "items", "look"], outputs: ["onValueChanged", "onBlur", "onFocus"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXTextBoxModule }, { kind: "component", type: i1$6.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "maskPattern", "customTokens", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onMaskChanged"] }, { kind: "component", type: AXPRepeaterRowsLayoutComponent, selector: "axp-repeater-rows-layout", inputs: ["count", "disabled", "hasControls", "allowReorder", "rowTemplate", "addItemLabelKey", "emptyTitleKey", "emptyDescriptionKey", "addFirstItemLabelKey"], outputs: ["addClick", "removeClick", "drop"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
19950
20760
|
}
|
|
19951
20761
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPDataSourceOptionsWidgetEditComponent, decorators: [{
|
|
19952
20762
|
type: Component,
|
|
@@ -20449,7 +21259,7 @@ class AXPFlexOptionsWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
20449
21259
|
}
|
|
20450
21260
|
#af;
|
|
20451
21261
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFlexOptionsWidgetEditComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
20452
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPFlexOptionsWidgetEditComponent, isStandalone: true, selector: "axp-flex-options-widget-editor", usesInheritance: true, ngImport: i0, template: "<div class=\"axp-flex-option ax-grid ax-grid-cols-[auto_1fr] ax-pt-2 ax-gap-2 ax-items-center ax-justify-items-start\">\n <span>Direction</span>\n <div>\n <ax-button-group class=\"ax-sm\" [selection]=\"'single'\">\n <ax-button-group-item (onClick)=\"setFlexDirection('row')\" [selected]=\"flexDirection() === 'row'\"\n ><ax-prefix\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M12.2929 7.00004L9.14645 3.85359L9.85355 3.14648L14.2071 7.50004L9.85355 11.8536L9.14645 11.1465L12.2929 8.00004H3V7.00004H12.2929Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n <ax-button-group-item (onClick)=\"setFlexDirection('row-reverse')\" [selected]=\"flexDirection() === 'row-reverse'\"\n ><ax-prefix\n ><svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"transform: rotate(180deg)\"\n >\n <path\n d=\"M12.2929 7.00004L9.14645 3.85359L9.85355 3.14648L14.2071 7.50004L9.85355 11.8536L9.14645 11.1465L12.2929 8.00004H3V7.00004H12.2929Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n <ax-button-group-item (onClick)=\"setFlexDirection('column')\" [selected]=\"flexDirection() === 'column'\"\n ><ax-prefix\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M8.00001 12.2929L4.85356 9.14645L4.14645 9.85355L8.50001 14.2071L12.8536 9.85355L12.1465 9.14645L9.00001 12.2929L9.00001 3H8.00001L8.00001 12.2929Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n <ax-button-group-item\n (onClick)=\"setFlexDirection('column-reverse')\"\n [selected]=\"flexDirection() === 'column-reverse'\"\n ><ax-prefix\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M9.00004 3.70721L12.1465 6.85363L12.8536 6.14652L8.50001 1.79297L4.14645 6.14652L4.85356 6.85363L8.00004 3.70715L8.00004 13.0001H9.00004L9.00004 3.70721Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n </ax-button-group>\n </div>\n <span> Wrap </span>\n <div>\n <ax-selection-list\n [items]=\"['wrap', 'nowrap']\"\n [value]=\"flexWrap()\"\n (onValueChanged)=\"setWrapMode($event.value)\"\n direction=\"horizontal\"\n [multiple]=\"false\"\n [showControl]=\"true\"\n look=\"card\"\n valueField=\"id\"\n textField=\"text\"\n >\n <ng-template #itemTemplate let-item>\n <div class=\"ax-flex ax-items-center\">\n <ax-icon [icon]=\"item.icon\"></ax-icon>\n <span class=\"ax-ml-2\">{{ item.text }}</span>\n </div>\n </ng-template>\n </ax-selection-list>\n </div>\n <span>Align</span>\n <div class=\"ax-flex ax-justify-between ax-gap-2 ax-items-center\">\n <div\n class=\"ax-relative ax-size-[62px] ax-bg-[rgb(30,30,30)] ax-border ax-border-white ax-border-opacity-15 ax-rounded\"\n >\n <div class=\"ax-absolute ax-inset-0 ax-grid ax-grid-cols-3 ax-grid-rows-3\">\n @for (side of flexSides; track side.value) {\n <div\n [attr.aria-label]=\"side.label\"\n [attr.aria-value]=\"side.value\"\n class=\"ax-grid ax-place-content-center\"\n (mouseenter)=\"onHover(side)\"\n (mouseleave)=\"onHoverLeave()\"\n (click)=\"onClick(side)\"\n >\n @if (true) {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect x=\"7\" y=\"7\" width=\"2\" height=\"2\" rx=\"1\" fill=\"currentColor\" fill-opacity=\"0.3\"></rect>\n </svg>\n }\n </div>\n }\n </div>\n <div\n class=\"ax-absolute ax-inset-0 ax-flex ax-pointer-events-none ax-transition-all\"\n [style.justify-content]=\"hoveredJustify()\"\n [style.align-items]=\"hoveredAlign()\"\n [style.flex-direction]=\"flexDirection()\"\n >\n <div class=\"ax-flex ax-justify-center ax-items-center ax-min-w-5 ax-min-h-5\">\n <div\n class=\"ax-size-auto ax-z-[1] ax-rounded-lg ax-bg-[rgb(30,30,30)] ax-flex-none\"\n [class]=\"flexDirectionIsColumn() ? '-ax-rotate-90' : ''\"\n >\n @if (hoveredJustify() === 'space-between') {\n @if (clickedAlign() === 'stretch') {\n } @else if (clickedAlign() === 'baseline' && hoveredAlign() === 'flex-start') {\n } @else {\n <svg width=\"60\" height=\"20\" viewBox=\"0 0 60 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M29 6.5C29 6.22386 29.2239 6 29.5 6H30.5C30.7761 6 31 6.22386 31 6.5V15.5C31 15.7761 30.7761 16 30.5 16H29.5C29.2239 16 29 15.7761 29 15.5V6.5ZM9 8.5C9 8.22386 9.22386 8 9.5 8H10.5C10.7761 8 11 8.22386 11 8.5V12.5C11 12.7761 10.7761 13 10.5 13H9.5C9.22386 13 9 12.7761 9 12.5V8.5ZM49.5 8C49.2239 8 49 8.22386 49 8.5V14.5C49 14.7761 49.2239 15 49.5 15H50.5C50.7761 15 51 14.7761 51 14.5V8.5C51 8.22386 50.7761 8 50.5 8H49.5Z\"\n fill=\"currentColor\"\n fill-opacity=\"0.3\"\n ></path>\n </svg>\n }\n } @else if (hoveredJustify() === 'space-around') {\n @if (clickedAlign() === 'stretch') {\n } @else if (clickedAlign() === 'baseline' && hoveredAlign() === 'flex-start') {\n } @else {\n <svg width=\"60\" height=\"20\" viewBox=\"0 0 60 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect x=\"11\" y=\"9\" width=\"2\" height=\"5\" rx=\"0.5\" fill=\"currentColor\" fill-opacity=\"0.3\"></rect>\n <rect x=\"29\" y=\"6\" width=\"2\" height=\"10\" rx=\"0.5\" fill=\"currentColor\" fill-opacity=\"0.3\"></rect>\n <rect x=\"47\" y=\"8\" width=\"2\" height=\"7\" rx=\"0.5\" fill=\"currentColor\" fill-opacity=\"0.3\"></rect>\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M5 13L8 11L5 9V13ZM55 9L52 11L55 13V9Z\"\n fill=\"currentColor\"\n fill-opacity=\"0.3\"\n ></path>\n </svg>\n }\n } @else if (hoveredAlign() === 'flex-start') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M3.5 7C3.22386 7 3 6.77614 3 6.5V3.5C3 3.22386 3.22386 3 3.5 3H4.5C4.77614 3 5 3.22386 5 3.5V6.5C5 6.77614 4.77614 7 4.5 7H3.5ZM7.5 13C7.22386 13 7 12.7761 7 12.5V3.5C7 3.22386 7.22386 3 7.5 3H8.5C8.77614 3 9 3.22386 9 3.5V12.5C9 12.7761 8.77614 13 8.5 13H7.5ZM11.5 3C11.2239 3 11 3.22386 11 3.5V8.5C11 8.77614 11.2239 9 11.5 9H12.5C12.7761 9 13 8.77614 13 8.5V3.5C13 3.22386 12.7761 3 12.5 3H11.5Z\"\n fill=\"currentColor\"\n fill-opacity=\"0.3\"\n ></path>\n </svg>\n } @else if (hoveredAlign() === 'center') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M7.5 13C7.22386 13 7 12.7761 7 12.5V3.5C7 3.22386 7.22386 3 7.5 3H8.5C8.77614 3 9 3.22386 9 3.5V12.5C9 12.7761 8.77614 13 8.5 13H7.5ZM3.5 10C3.22386 10 3 9.77614 3 9.5V6.5C3 6.22386 3.22386 6 3.5 6H4.5C4.77614 6 5 6.22386 5 6.5V9.5C5 9.77614 4.77614 10 4.5 10H3.5ZM11.5 5C11.2239 5 11 5.22386 11 5.5V10.5C11 10.7761 11.2239 11 11.5 11H12.5C12.7761 11 13 10.7761 13 10.5V5.5C13 5.22386 12.7761 5 12.5 5H11.5Z\"\n fill=\"currentColor\"\n fill-opacity=\"0.3\"\n ></path>\n </svg>\n } @else if (hoveredAlign() === 'flex-end') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M11.5 7C11.2239 7 11 7.22386 11 7.5L11 12.5C11 12.7761 11.2239 13 11.5 13L12.5 13C12.7761 13 13 12.7761 13 12.5L13 7.5C13 7.22386 12.7761 7 12.5 7L11.5 7ZM7.5 13C7.22386 13 7 12.7761 7 12.5L7 3.5C7 3.22386 7.22386 3 7.5 3L8.5 3C8.77614 3 9 3.22386 9 3.5L9 12.5C9 12.7761 8.77614 13 8.5 13L7.5 13ZM3.5 13C3.22386 13 3 12.7761 3 12.5L3 9.5C3 9.22386 3.22386 9 3.5 9L4.5 9C4.77614 9 5 9.22386 5 9.5L5 12.5C5 12.7761 4.77614 13 4.5 13L3.5 13Z\"\n fill=\"currentColor\"\n fill-opacity=\"0.3\"\n ></path>\n </svg>\n } @else if (hoveredAlign() === 'stretch') {\n <svg width=\"20\" height=\"60\" viewBox=\"0 0 20 60\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M7 53.5C7 53.7761 6.77614 54 6.5 54L5.5 54C5.22386 54 5 53.7761 5 53.5L5 6.5C5 6.22386 5.22386 6 5.5 6L6.5 6C6.77614 6 7 6.22386 7 6.5L7 53.5ZM11 53.5C11 53.7761 10.7761 54 10.5 54L9.5 54C9.22386 54 9 53.7761 9 53.5L9 6.5C9 6.22386 9.22386 6 9.5 6L10.5 6C10.7761 6 11 6.22386 11 6.5L11 53.5ZM14.5 54C14.7761 54 15 53.7761 15 53.5L15 6.5C15 6.22386 14.7761 6 14.5 6L13.5 6C13.2239 6 13 6.22386 13 6.5L13 53.5C13 53.7761 13.2239 54 13.5 54L14.5 54Z\"\n fill=\"currentColor\"\n fill-opacity=\"0.3\"\n ></path>\n </svg>\n } @else if (hoveredAlign() === 'baseline') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M13 2V8.29289L14.6464 6.64645L15.3536 7.35355L12.5 10.2071L9.64645 7.35355L10.3536 6.64645L12 8.29289V2H13Z\"\n fill=\"currentColor\"\n fill-opacity=\"0.3\"\n ></path>\n <path d=\"M16 12L1 12V13L16 13V12Z\" fill=\"currentColor\"></path>\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M4.62582 2H6.37412L8.72712 10H7.68476L7.09649 7.99994H3.90349L3.31524 10H2.27288L4.62582 2ZM6.80237 6.99994L5.62585 2.9999H5.37409L4.19761 6.99994H6.80237Z\"\n fill=\"currentColor\"\n fill-opacity=\"0.3\"\n ></path>\n </svg>\n }\n </div>\n </div>\n </div>\n <div\n class=\"ax-absolute ax-inset-0 ax-flex ax-pointer-events-none ax-transition-all\"\n [style.justify-content]=\"clickedJustify()\"\n [style.align-items]=\"clickedAlign()\"\n [style.flex-direction]=\"flexDirection()\"\n >\n <div class=\"ax-flex ax-justify-center ax-items-center ax-min-w-5 ax-min-h-5\">\n <div\n class=\"ax-size-auto ax-z-[2] ax-rounded-lg ax-bg-[rgb(30,30,30)] ax-flex-none\"\n [class]=\"flexDirectionIsColumn() ? '-ax-rotate-90' : ''\"\n >\n @if (clickedJustify() === 'space-between') {\n @if (clickedAlign() === 'stretch') {\n <svg width=\"60\" height=\"60\" viewBox=\"0 0 60 60\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M11 53.5C11 53.7761 10.7761 54 10.5 54H9.5C9.22386 54 9 53.7761 9 53.5L9 6.5C9 6.22386 9.22386 6 9.5 6H10.5C10.7761 6 11 6.22386 11 6.5L11 53.5ZM31 53.5C31 53.7761 30.7761 54 30.5 54H29.5C29.2239 54 29 53.7761 29 53.5L29 6.5C29 6.22386 29.2239 6 29.5 6H30.5C30.7761 6 31 6.22386 31 6.5L31 53.5ZM50.5 54C50.7761 54 51 53.7761 51 53.5L51 6.5C51 6.22386 50.7761 6 50.5 6H49.5C49.2239 6 49 6.22386 49 6.5L49 53.5C49 53.7761 49.2239 54 49.5 54H50.5Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n } @else if (clickedAlign() === 'baseline') {\n <svg width=\"60\" height=\"20\" viewBox=\"0 0 60 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M50.5996 4V10.2929L52.246 8.64645L52.9531 9.35355L50.0996 12.2071L47.246 9.35355L47.9531 8.64645L49.5996 10.2929V4H50.5996Z\"\n fill=\"currentColor\"\n ></path>\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M9.35294 4H11.1012L13.4542 12H12.4119L11.8236 9.99994H8.63061L8.04236 12H7L9.35294 4ZM11.5295 8.99994L10.353 4.9999H10.1012L8.92473 8.99994H11.5295Z\"\n fill=\"currentColor\"\n ></path>\n <path d=\"M6 14H54V15H6V14Z\" fill=\"currentColor\"></path>\n </svg>\n } @else {\n <svg width=\"60\" height=\"20\" viewBox=\"0 0 60 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M29 6.5C29 6.22386 29.2239 6 29.5 6H30.5C30.7761 6 31 6.22386 31 6.5V15.5C31 15.7761 30.7761 16 30.5 16H29.5C29.2239 16 29 15.7761 29 15.5V6.5ZM9 8.5C9 8.22386 9.22386 8 9.5 8H10.5C10.7761 8 11 8.22386 11 8.5V12.5C11 12.7761 10.7761 13 10.5 13H9.5C9.22386 13 9 12.7761 9 12.5V8.5ZM49.5 8C49.2239 8 49 8.22386 49 8.5V14.5C49 14.7761 49.2239 15 49.5 15H50.5C50.7761 15 51 14.7761 51 14.5V8.5C51 8.22386 50.7761 8 50.5 8H49.5Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n }\n } @else if (clickedJustify() === 'space-around') {\n @if (clickedAlign() === 'stretch') {\n <svg width=\"60\" height=\"60\" viewBox=\"0 0 60 60\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8 30L5 32L5 28L8 30Z\" fill=\"currentColor\"></path>\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M13 53.5C13 53.7761 12.7761 54 12.5 54H11.5C11.2239 54 11 53.7761 11 53.5L11 6.5C11 6.22386 11.2239 6 11.5 6H12.5C12.7761 6 13 6.22386 13 6.5L13 53.5ZM31 53.5C31 53.7761 30.7761 54 30.5 54H29.5C29.2239 54 29 53.7761 29 53.5L29 6.5C29 6.22386 29.2239 6 29.5 6H30.5C30.7761 6 31 6.22386 31 6.5L31 53.5ZM48.5 54C48.7761 54 49 53.7761 49 53.5L49 6.5C49 6.22386 48.7761 6 48.5 6H47.5C47.2239 6 47 6.22386 47 6.5L47 53.5C47 53.7761 47.2239 54 47.5 54H48.5Z\"\n fill=\"currentColor\"\n ></path>\n <path d=\"M52 30L55 28L55 32L52 30Z\" fill=\"currentColor\"></path>\n </svg>\n } @else if (clickedAlign() === 'baseline') {\n <svg\n data-wf-icon=\"NineBoxAlignItemsRowSpaceAroundBaselineIcon\"\n width=\"60\"\n height=\"20\"\n viewBox=\"0 0 60 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M40.8529 4V10.2929L42.4993 8.64645L43.2064 9.35355L40.3529 12.2071L37.4993 9.35355L38.2064 8.64645L39.8529 10.2929V4H40.8529Z\"\n fill=\"currentColor\"\n ></path>\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M19.3523 4H21.1006L23.4536 12H22.4112L21.8229 9.99994H18.6299L18.0417 12H16.9993L19.3523 4ZM21.5288 8.99994L20.3523 4.9999H20.1005L18.924 8.99994H21.5288Z\"\n fill=\"currentColor\"\n ></path>\n <path d=\"M6 14H54V15H6V14Z\" fill=\"currentColor\"></path>\n </svg>\n } @else {\n <svg width=\"60\" height=\"20\" viewBox=\"0 0 60 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect x=\"11\" y=\"9\" width=\"2\" height=\"5\" rx=\"0.5\" fill=\"currentColor\"></rect>\n <rect x=\"29\" y=\"6\" width=\"2\" height=\"10\" rx=\"0.5\" fill=\"currentColor\"></rect>\n <rect x=\"47\" y=\"8\" width=\"2\" height=\"7\" rx=\"0.5\" fill=\"currentColor\"></rect>\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M5 13L8 11L5 9V13ZM55 9L52 11L55 13V9Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n }\n } @else if (clickedAlign() === 'flex-start') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M3.5 7C3.22386 7 3 6.77614 3 6.5V3.5C3 3.22386 3.22386 3 3.5 3H4.5C4.77614 3 5 3.22386 5 3.5V6.5C5 6.77614 4.77614 7 4.5 7H3.5ZM7.5 13C7.22386 13 7 12.7761 7 12.5V3.5C7 3.22386 7.22386 3 7.5 3H8.5C8.77614 3 9 3.22386 9 3.5V12.5C9 12.7761 8.77614 13 8.5 13H7.5ZM11.5 3C11.2239 3 11 3.22386 11 3.5V8.5C11 8.77614 11.2239 9 11.5 9H12.5C12.7761 9 13 8.77614 13 8.5V3.5C13 3.22386 12.7761 3 12.5 3H11.5Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n } @else if (clickedAlign() === 'center') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M7.5 13C7.22386 13 7 12.7761 7 12.5V3.5C7 3.22386 7.22386 3 7.5 3H8.5C8.77614 3 9 3.22386 9 3.5V12.5C9 12.7761 8.77614 13 8.5 13H7.5ZM3.5 10C3.22386 10 3 9.77614 3 9.5V6.5C3 6.22386 3.22386 6 3.5 6H4.5C4.77614 6 5 6.22386 5 6.5V9.5C5 9.77614 4.77614 10 4.5 10H3.5ZM11.5 5C11.2239 5 11 5.22386 11 5.5V10.5C11 10.7761 11.2239 11 11.5 11H12.5C12.7761 11 13 10.7761 13 10.5V5.5C13 5.22386 12.7761 5 12.5 5H11.5Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n } @else if (clickedAlign() === 'flex-end') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M11.5 7C11.2239 7 11 7.22386 11 7.5L11 12.5C11 12.7761 11.2239 13 11.5 13L12.5 13C12.7761 13 13 12.7761 13 12.5L13 7.5C13 7.22386 12.7761 7 12.5 7L11.5 7ZM7.5 13C7.22386 13 7 12.7761 7 12.5L7 3.5C7 3.22386 7.22386 3 7.5 3L8.5 3C8.77614 3 9 3.22386 9 3.5L9 12.5C9 12.7761 8.77614 13 8.5 13L7.5 13ZM3.5 13C3.22386 13 3 12.7761 3 12.5L3 9.5C3 9.22386 3.22386 9 3.5 9L4.5 9C4.77614 9 5 9.22386 5 9.5L5 12.5C5 12.7761 4.77614 13 4.5 13L3.5 13Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n } @else if (clickedAlign() === 'stretch') {\n <svg width=\"20\" height=\"60\" viewBox=\"0 0 20 60\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M7 53.5C7 53.7761 6.77614 54 6.5 54L5.5 54C5.22386 54 5 53.7761 5 53.5L5 6.5C5 6.22386 5.22386 6 5.5 6L6.5 6C6.77614 6 7 6.22386 7 6.5L7 53.5ZM11 53.5C11 53.7761 10.7761 54 10.5 54L9.5 54C9.22386 54 9 53.7761 9 53.5L9 6.5C9 6.22386 9.22386 6 9.5 6L10.5 6C10.7761 6 11 6.22386 11 6.5L11 53.5ZM14.5 54C14.7761 54 15 53.7761 15 53.5L15 6.5C15 6.22386 14.7761 6 14.5 6L13.5 6C13.2239 6 13 6.22386 13 6.5L13 53.5C13 53.7761 13.2239 54 13.5 54L14.5 54Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n } @else if (clickedAlign() === 'baseline') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M13 2V8.29289L14.6464 6.64645L15.3536 7.35355L12.5 10.2071L9.64645 7.35355L10.3536 6.64645L12 8.29289V2H13Z\"\n fill=\"currentColor\"\n ></path>\n <path d=\"M16 12L1 12V13L16 13V12Z\" fill=\"currentColor\"></path>\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M4.62582 2H6.37412L8.72712 10H7.68476L7.09649 7.99994H3.90349L3.31524 10H2.27288L4.62582 2ZM6.80237 6.99994L5.62585 2.9999H5.37409L4.19761 6.99994H6.80237Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n }\n </div>\n </div>\n </div>\n </div>\n <div class=\"ax-grid ax-grid-cols-[auto_1fr] ax-items-center ax-justify-items-start ax-gap-2\">\n <span class=\"ax-order-1\">X:</span>\n <div class=\"ax-max-w-28\" [style.order]=\"flexDirectionIsColumn() ? '4' : '2'\">\n <!-- <ax-select-box\n [dataSource]=\"flexDirectionIsColumn()? alignDataSource : justifyDataSource\"\n [ngModel]=\"flexDirectionIsColumn()? selectedAlign : selectedJustify\"\n (ngModelChange)=\"flexDirectionIsColumn()? selectedAlign = $event : selectedJustify = $event\"\n (onValueChanged)=\"flexDirectionIsColumn()? onAlignChange($event) :onJustifyChange($event)\"\n textField=\"label\"\n valueField=\"value\"\n placeholder=\"Choose...\"\n >\n </ax-select-box> -->\n <ax-select-box\n class=\"ax-sm\"\n [dataSource]=\"justifyDataSource\"\n [(ngModel)]=\"selectedJustify\"\n (onValueChanged)=\"onJustifyChange($event)\"\n textField=\"label\"\n valueField=\"value\"\n placeholder=\"Choose...\"\n >\n </ax-select-box>\n </div>\n <span class=\"ax-order-3\">Y:</span>\n <div class=\"ax-max-w-28\" [style.order]=\"flexDirectionIsColumn() ? '2' : '4'\">\n <ax-select-box\n class=\"ax-sm\"\n [dataSource]=\"alignDataSource\"\n [(ngModel)]=\"selectedAlign\"\n (onValueChanged)=\"onAlignChange($event)\"\n textField=\"label\"\n valueField=\"value\"\n placeholder=\"Choose...\"\n >\n </ax-select-box>\n </div>\n </div>\n </div>\n <span>Gap</span>\n <div class=\"ax-flex ax-gap-2 ax-justify-between ax-items-center\">\n @if (gapMode() === 'both') {\n <ax-range-slider\n class=\"ax-w-32\"\n [ngModel]=\"gap().both\"\n (ngModelChange)=\"setGap($event ?? 0, 'both')\"\n ></ax-range-slider>\n <ax-number-box\n [minValue]=\"0\"\n [maxValue]=\"999\"\n [value]=\"gap().both\"\n [changeOnScroll]=\"true\"\n (onValueChanged)=\"setGap($event.value ?? 0, 'both')\"\n class=\"ax-sm ax-max-w-[5.5rem]\"\n [showSpinButtons]=\"false\"\n ><ax-suffix><ax-text class=\"!ax-text-xs !ax-px-1\">PX</ax-text></ax-suffix></ax-number-box\n >\n } @else {\n <div class=\"ax-flex ax-items-center ax-gap-2 ax-h-12\">\n <span class=\"ax-text-xs\"\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M12.2929 7.00004L9.14645 3.85359L9.85355 3.14648L14.2071 7.50004L9.85355 11.8536L9.14645 11.1465L12.2929 8.00004H3V7.00004H12.2929Z\"\n fill=\"currentColor\"\n ></path></svg ></span>\n <ax-number-box\n [minValue]=\"0\"\n [maxValue]=\"999\"\n [value]=\"gap().x\"\n [changeOnScroll]=\"true\"\n (onValueChanged)=\"setGap($event.value ?? 0, 'x')\"\n class=\"ax-sm ax-min-w-5\"\n [showSpinButtons]=\"false\"\n ><ax-suffix><ax-text class=\"!ax-text-xs !ax-px-1\">PX</ax-text></ax-suffix></ax-number-box\n >\n <span class=\"ax-text-xs\"\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M8.00001 12.2929L4.85356 9.14645L4.14645 9.85355L8.50001 14.2071L12.8536 9.85355L12.1465 9.14645L9.00001 12.2929L9.00001 3H8.00001L8.00001 12.2929Z\"\n fill=\"currentColor\"\n ></path></svg></span>\n <ax-number-box\n [minValue]=\"0\"\n [maxValue]=\"999\"\n [value]=\"gap().y\"\n [changeOnScroll]=\"true\"\n (onValueChanged)=\"setGap($event.value ?? 0, 'y')\"\n class=\"ax-sm ax-min-w-5\"\n [showSpinButtons]=\"false\"\n ><ax-suffix><ax-text class=\"!ax-text-xs !ax-px-1\">PX</ax-text></ax-suffix></ax-number-box\n >\n </div>\n }\n <button (click)=\"setGapMode()\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n @if (gapMode() === 'both') {\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M5 7L5 5C5 3.34315 6.34315 2 8 2C9.65685 2 11 3.34315 11 5V7C11.5523 7 12 7.44772 12 8V12C12 12.5523 11.5523 13 11 13H5C4.44772 13 4 12.5523 4 12V8C4 7.44771 4.44772 7 5 7ZM6 5C6 3.89543 6.89543 3 8 3C9.10457 3 10 3.89543 10 5V7H6V5ZM5 12V8H11V12H5Z\"\n fill=\"currentColor\"\n ></path>\n } @else {\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M9 5C9 3.89543 9.89543 3 11 3C12.1046 3 13 3.89543 13 5V6H14V5C14 3.34315 12.6569 2 11 2C9.34315 2 8 3.34315 8 5V7H3C2.44772 7 2 7.44771 2 8V12C2 12.5523 2.44772 13 3 13H9C9.55228 13 10 12.5523 10 12V8C10 7.44772 9.55228 7 9 7V5ZM3 8H9V12H3V8Z\"\n fill=\"currentColor\"\n ></path>\n }\n </svg>\n </button>\n </div>\n <!-- <span>Items</span>\n <div>\n <ax-number-box\n [minValue]=\"0\"\n [maxValue]=\"12\"\n [ngModel]=\"itemsCount()\"\n (ngModelChange)=\"setItemsCount($event ?? 0)\"\n class=\"ax-w-32\"\n ></ax-number-box>\n </div> -->\n</div>\n", styles: [":host{--ax-comp-range-slider-handler-size: .75rem}\n"], dependencies: [{ kind: "ngmodule", type: AXButtonGroupModule }, { kind: "component", type: i1$j.AXButtonGroupComponent, selector: "ax-button-group", inputs: ["disabled", "color", "look", "fitParent", "selection"], outputs: ["onBlur", "onFocus", "lookChange", "colorChange", "disabledChange", "onClick", "selectionChange", "selectedButtonChange"] }, { kind: "component", type: i1$j.AXButtonGroupItemComponent, selector: "ax-button-group-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "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: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i3$1.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: AXRangeSliderModule }, { kind: "component", type: i3$5.AXRangeSliderComponent, selector: "ax-range-slider", inputs: ["disabled", "readonly", "orientation", "color", "values", "mode", "min", "max", "step", "snap", "tooltipMode", "snapMode", "hasStep", "hasSnap", "hasLable", "hasTooltip"], outputs: ["valuesChange"] }, { kind: "ngmodule", type: AXNumberBoxModule }, { kind: "component", type: i1$7.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "minValue", "maxValue", "showSpinButtons", "thousandsSeparator", "decimals", "changeOnScroll", "step"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "thousandsSeparatorChange"] }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXSelectionListModule }, { kind: "component", type: i2$4.AXSelectionListComponent, selector: "ax-selection-list", inputs: ["id", "name", "disabled", "readonly", "tabIndex", "size", "value", "valueField", "textField", "disabledField", "readonlyField", "multiple", "direction", "customTemplate", "showControl", "items", "look"], outputs: ["onValueChanged", "onBlur", "onFocus"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
21262
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPFlexOptionsWidgetEditComponent, isStandalone: true, selector: "axp-flex-options-widget-editor", usesInheritance: true, ngImport: i0, template: "<div class=\"axp-flex-option ax-grid ax-grid-cols-[auto_1fr] ax-pt-2 ax-gap-2 ax-items-center ax-justify-items-start\">\n <span>Direction</span>\n <div>\n <ax-button-group class=\"ax-sm\" [selection]=\"'single'\">\n <ax-button-group-item (onClick)=\"setFlexDirection('row')\" [selected]=\"flexDirection() === 'row'\"\n ><ax-prefix\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M12.2929 7.00004L9.14645 3.85359L9.85355 3.14648L14.2071 7.50004L9.85355 11.8536L9.14645 11.1465L12.2929 8.00004H3V7.00004H12.2929Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n <ax-button-group-item (onClick)=\"setFlexDirection('row-reverse')\" [selected]=\"flexDirection() === 'row-reverse'\"\n ><ax-prefix\n ><svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n style=\"transform: rotate(180deg)\"\n >\n <path\n d=\"M12.2929 7.00004L9.14645 3.85359L9.85355 3.14648L14.2071 7.50004L9.85355 11.8536L9.14645 11.1465L12.2929 8.00004H3V7.00004H12.2929Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n <ax-button-group-item (onClick)=\"setFlexDirection('column')\" [selected]=\"flexDirection() === 'column'\"\n ><ax-prefix\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M8.00001 12.2929L4.85356 9.14645L4.14645 9.85355L8.50001 14.2071L12.8536 9.85355L12.1465 9.14645L9.00001 12.2929L9.00001 3H8.00001L8.00001 12.2929Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n <ax-button-group-item\n (onClick)=\"setFlexDirection('column-reverse')\"\n [selected]=\"flexDirection() === 'column-reverse'\"\n ><ax-prefix\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M9.00004 3.70721L12.1465 6.85363L12.8536 6.14652L8.50001 1.79297L4.14645 6.14652L4.85356 6.85363L8.00004 3.70715L8.00004 13.0001H9.00004L9.00004 3.70721Z\"\n fill=\"currentColor\"\n ></path></svg></ax-prefix\n ></ax-button-group-item>\n </ax-button-group>\n </div>\n <span> Wrap </span>\n <div>\n <ax-selection-list\n [items]=\"['wrap', 'nowrap']\"\n [value]=\"flexWrap()\"\n (onValueChanged)=\"setWrapMode($event.value)\"\n direction=\"horizontal\"\n [multiple]=\"false\"\n [showControl]=\"true\"\n look=\"card\"\n valueField=\"id\"\n textField=\"text\"\n >\n <ng-template #itemTemplate let-item>\n <div class=\"ax-flex ax-items-center\">\n <ax-icon [icon]=\"item.icon\"></ax-icon>\n <span class=\"ax-ml-2\">{{ item.text }}</span>\n </div>\n </ng-template>\n </ax-selection-list>\n </div>\n <span>Align</span>\n <div class=\"ax-flex ax-justify-between ax-gap-2 ax-items-center\">\n <div\n class=\"ax-relative ax-size-[62px] ax-bg-[rgb(30,30,30)] ax-border ax-border-white ax-border-opacity-15 ax-rounded\"\n >\n <div class=\"ax-absolute ax-inset-0 ax-grid ax-grid-cols-3 ax-grid-rows-3\">\n @for (side of flexSides; track side.value) {\n <div\n [attr.aria-label]=\"side.label\"\n [attr.aria-value]=\"side.value\"\n class=\"ax-grid ax-place-content-center\"\n (mouseenter)=\"onHover(side)\"\n (mouseleave)=\"onHoverLeave()\"\n (click)=\"onClick(side)\"\n >\n @if (true) {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect x=\"7\" y=\"7\" width=\"2\" height=\"2\" rx=\"1\" fill=\"currentColor\" fill-opacity=\"0.3\"></rect>\n </svg>\n }\n </div>\n }\n </div>\n <div\n class=\"ax-absolute ax-inset-0 ax-flex ax-pointer-events-none ax-transition-all\"\n [style.justify-content]=\"hoveredJustify()\"\n [style.align-items]=\"hoveredAlign()\"\n [style.flex-direction]=\"flexDirection()\"\n >\n <div class=\"ax-flex ax-justify-center ax-items-center ax-min-w-5 ax-min-h-5\">\n <div\n class=\"ax-size-auto ax-z-[1] ax-rounded-lg ax-bg-[rgb(30,30,30)] ax-flex-none\"\n [class]=\"flexDirectionIsColumn() ? '-ax-rotate-90' : ''\"\n >\n @if (hoveredJustify() === 'space-between') {\n @if (clickedAlign() === 'stretch') {\n } @else if (clickedAlign() === 'baseline' && hoveredAlign() === 'flex-start') {\n } @else {\n <svg width=\"60\" height=\"20\" viewBox=\"0 0 60 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M29 6.5C29 6.22386 29.2239 6 29.5 6H30.5C30.7761 6 31 6.22386 31 6.5V15.5C31 15.7761 30.7761 16 30.5 16H29.5C29.2239 16 29 15.7761 29 15.5V6.5ZM9 8.5C9 8.22386 9.22386 8 9.5 8H10.5C10.7761 8 11 8.22386 11 8.5V12.5C11 12.7761 10.7761 13 10.5 13H9.5C9.22386 13 9 12.7761 9 12.5V8.5ZM49.5 8C49.2239 8 49 8.22386 49 8.5V14.5C49 14.7761 49.2239 15 49.5 15H50.5C50.7761 15 51 14.7761 51 14.5V8.5C51 8.22386 50.7761 8 50.5 8H49.5Z\"\n fill=\"currentColor\"\n fill-opacity=\"0.3\"\n ></path>\n </svg>\n }\n } @else if (hoveredJustify() === 'space-around') {\n @if (clickedAlign() === 'stretch') {\n } @else if (clickedAlign() === 'baseline' && hoveredAlign() === 'flex-start') {\n } @else {\n <svg width=\"60\" height=\"20\" viewBox=\"0 0 60 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect x=\"11\" y=\"9\" width=\"2\" height=\"5\" rx=\"0.5\" fill=\"currentColor\" fill-opacity=\"0.3\"></rect>\n <rect x=\"29\" y=\"6\" width=\"2\" height=\"10\" rx=\"0.5\" fill=\"currentColor\" fill-opacity=\"0.3\"></rect>\n <rect x=\"47\" y=\"8\" width=\"2\" height=\"7\" rx=\"0.5\" fill=\"currentColor\" fill-opacity=\"0.3\"></rect>\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M5 13L8 11L5 9V13ZM55 9L52 11L55 13V9Z\"\n fill=\"currentColor\"\n fill-opacity=\"0.3\"\n ></path>\n </svg>\n }\n } @else if (hoveredAlign() === 'flex-start') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M3.5 7C3.22386 7 3 6.77614 3 6.5V3.5C3 3.22386 3.22386 3 3.5 3H4.5C4.77614 3 5 3.22386 5 3.5V6.5C5 6.77614 4.77614 7 4.5 7H3.5ZM7.5 13C7.22386 13 7 12.7761 7 12.5V3.5C7 3.22386 7.22386 3 7.5 3H8.5C8.77614 3 9 3.22386 9 3.5V12.5C9 12.7761 8.77614 13 8.5 13H7.5ZM11.5 3C11.2239 3 11 3.22386 11 3.5V8.5C11 8.77614 11.2239 9 11.5 9H12.5C12.7761 9 13 8.77614 13 8.5V3.5C13 3.22386 12.7761 3 12.5 3H11.5Z\"\n fill=\"currentColor\"\n fill-opacity=\"0.3\"\n ></path>\n </svg>\n } @else if (hoveredAlign() === 'center') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M7.5 13C7.22386 13 7 12.7761 7 12.5V3.5C7 3.22386 7.22386 3 7.5 3H8.5C8.77614 3 9 3.22386 9 3.5V12.5C9 12.7761 8.77614 13 8.5 13H7.5ZM3.5 10C3.22386 10 3 9.77614 3 9.5V6.5C3 6.22386 3.22386 6 3.5 6H4.5C4.77614 6 5 6.22386 5 6.5V9.5C5 9.77614 4.77614 10 4.5 10H3.5ZM11.5 5C11.2239 5 11 5.22386 11 5.5V10.5C11 10.7761 11.2239 11 11.5 11H12.5C12.7761 11 13 10.7761 13 10.5V5.5C13 5.22386 12.7761 5 12.5 5H11.5Z\"\n fill=\"currentColor\"\n fill-opacity=\"0.3\"\n ></path>\n </svg>\n } @else if (hoveredAlign() === 'flex-end') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M11.5 7C11.2239 7 11 7.22386 11 7.5L11 12.5C11 12.7761 11.2239 13 11.5 13L12.5 13C12.7761 13 13 12.7761 13 12.5L13 7.5C13 7.22386 12.7761 7 12.5 7L11.5 7ZM7.5 13C7.22386 13 7 12.7761 7 12.5L7 3.5C7 3.22386 7.22386 3 7.5 3L8.5 3C8.77614 3 9 3.22386 9 3.5L9 12.5C9 12.7761 8.77614 13 8.5 13L7.5 13ZM3.5 13C3.22386 13 3 12.7761 3 12.5L3 9.5C3 9.22386 3.22386 9 3.5 9L4.5 9C4.77614 9 5 9.22386 5 9.5L5 12.5C5 12.7761 4.77614 13 4.5 13L3.5 13Z\"\n fill=\"currentColor\"\n fill-opacity=\"0.3\"\n ></path>\n </svg>\n } @else if (hoveredAlign() === 'stretch') {\n <svg width=\"20\" height=\"60\" viewBox=\"0 0 20 60\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M7 53.5C7 53.7761 6.77614 54 6.5 54L5.5 54C5.22386 54 5 53.7761 5 53.5L5 6.5C5 6.22386 5.22386 6 5.5 6L6.5 6C6.77614 6 7 6.22386 7 6.5L7 53.5ZM11 53.5C11 53.7761 10.7761 54 10.5 54L9.5 54C9.22386 54 9 53.7761 9 53.5L9 6.5C9 6.22386 9.22386 6 9.5 6L10.5 6C10.7761 6 11 6.22386 11 6.5L11 53.5ZM14.5 54C14.7761 54 15 53.7761 15 53.5L15 6.5C15 6.22386 14.7761 6 14.5 6L13.5 6C13.2239 6 13 6.22386 13 6.5L13 53.5C13 53.7761 13.2239 54 13.5 54L14.5 54Z\"\n fill=\"currentColor\"\n fill-opacity=\"0.3\"\n ></path>\n </svg>\n } @else if (hoveredAlign() === 'baseline') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M13 2V8.29289L14.6464 6.64645L15.3536 7.35355L12.5 10.2071L9.64645 7.35355L10.3536 6.64645L12 8.29289V2H13Z\"\n fill=\"currentColor\"\n fill-opacity=\"0.3\"\n ></path>\n <path d=\"M16 12L1 12V13L16 13V12Z\" fill=\"currentColor\"></path>\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M4.62582 2H6.37412L8.72712 10H7.68476L7.09649 7.99994H3.90349L3.31524 10H2.27288L4.62582 2ZM6.80237 6.99994L5.62585 2.9999H5.37409L4.19761 6.99994H6.80237Z\"\n fill=\"currentColor\"\n fill-opacity=\"0.3\"\n ></path>\n </svg>\n }\n </div>\n </div>\n </div>\n <div\n class=\"ax-absolute ax-inset-0 ax-flex ax-pointer-events-none ax-transition-all\"\n [style.justify-content]=\"clickedJustify()\"\n [style.align-items]=\"clickedAlign()\"\n [style.flex-direction]=\"flexDirection()\"\n >\n <div class=\"ax-flex ax-justify-center ax-items-center ax-min-w-5 ax-min-h-5\">\n <div\n class=\"ax-size-auto ax-z-[2] ax-rounded-lg ax-bg-[rgb(30,30,30)] ax-flex-none\"\n [class]=\"flexDirectionIsColumn() ? '-ax-rotate-90' : ''\"\n >\n @if (clickedJustify() === 'space-between') {\n @if (clickedAlign() === 'stretch') {\n <svg width=\"60\" height=\"60\" viewBox=\"0 0 60 60\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M11 53.5C11 53.7761 10.7761 54 10.5 54H9.5C9.22386 54 9 53.7761 9 53.5L9 6.5C9 6.22386 9.22386 6 9.5 6H10.5C10.7761 6 11 6.22386 11 6.5L11 53.5ZM31 53.5C31 53.7761 30.7761 54 30.5 54H29.5C29.2239 54 29 53.7761 29 53.5L29 6.5C29 6.22386 29.2239 6 29.5 6H30.5C30.7761 6 31 6.22386 31 6.5L31 53.5ZM50.5 54C50.7761 54 51 53.7761 51 53.5L51 6.5C51 6.22386 50.7761 6 50.5 6H49.5C49.2239 6 49 6.22386 49 6.5L49 53.5C49 53.7761 49.2239 54 49.5 54H50.5Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n } @else if (clickedAlign() === 'baseline') {\n <svg width=\"60\" height=\"20\" viewBox=\"0 0 60 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M50.5996 4V10.2929L52.246 8.64645L52.9531 9.35355L50.0996 12.2071L47.246 9.35355L47.9531 8.64645L49.5996 10.2929V4H50.5996Z\"\n fill=\"currentColor\"\n ></path>\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M9.35294 4H11.1012L13.4542 12H12.4119L11.8236 9.99994H8.63061L8.04236 12H7L9.35294 4ZM11.5295 8.99994L10.353 4.9999H10.1012L8.92473 8.99994H11.5295Z\"\n fill=\"currentColor\"\n ></path>\n <path d=\"M6 14H54V15H6V14Z\" fill=\"currentColor\"></path>\n </svg>\n } @else {\n <svg width=\"60\" height=\"20\" viewBox=\"0 0 60 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M29 6.5C29 6.22386 29.2239 6 29.5 6H30.5C30.7761 6 31 6.22386 31 6.5V15.5C31 15.7761 30.7761 16 30.5 16H29.5C29.2239 16 29 15.7761 29 15.5V6.5ZM9 8.5C9 8.22386 9.22386 8 9.5 8H10.5C10.7761 8 11 8.22386 11 8.5V12.5C11 12.7761 10.7761 13 10.5 13H9.5C9.22386 13 9 12.7761 9 12.5V8.5ZM49.5 8C49.2239 8 49 8.22386 49 8.5V14.5C49 14.7761 49.2239 15 49.5 15H50.5C50.7761 15 51 14.7761 51 14.5V8.5C51 8.22386 50.7761 8 50.5 8H49.5Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n }\n } @else if (clickedJustify() === 'space-around') {\n @if (clickedAlign() === 'stretch') {\n <svg width=\"60\" height=\"60\" viewBox=\"0 0 60 60\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8 30L5 32L5 28L8 30Z\" fill=\"currentColor\"></path>\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M13 53.5C13 53.7761 12.7761 54 12.5 54H11.5C11.2239 54 11 53.7761 11 53.5L11 6.5C11 6.22386 11.2239 6 11.5 6H12.5C12.7761 6 13 6.22386 13 6.5L13 53.5ZM31 53.5C31 53.7761 30.7761 54 30.5 54H29.5C29.2239 54 29 53.7761 29 53.5L29 6.5C29 6.22386 29.2239 6 29.5 6H30.5C30.7761 6 31 6.22386 31 6.5L31 53.5ZM48.5 54C48.7761 54 49 53.7761 49 53.5L49 6.5C49 6.22386 48.7761 6 48.5 6H47.5C47.2239 6 47 6.22386 47 6.5L47 53.5C47 53.7761 47.2239 54 47.5 54H48.5Z\"\n fill=\"currentColor\"\n ></path>\n <path d=\"M52 30L55 28L55 32L52 30Z\" fill=\"currentColor\"></path>\n </svg>\n } @else if (clickedAlign() === 'baseline') {\n <svg\n data-wf-icon=\"NineBoxAlignItemsRowSpaceAroundBaselineIcon\"\n width=\"60\"\n height=\"20\"\n viewBox=\"0 0 60 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M40.8529 4V10.2929L42.4993 8.64645L43.2064 9.35355L40.3529 12.2071L37.4993 9.35355L38.2064 8.64645L39.8529 10.2929V4H40.8529Z\"\n fill=\"currentColor\"\n ></path>\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M19.3523 4H21.1006L23.4536 12H22.4112L21.8229 9.99994H18.6299L18.0417 12H16.9993L19.3523 4ZM21.5288 8.99994L20.3523 4.9999H20.1005L18.924 8.99994H21.5288Z\"\n fill=\"currentColor\"\n ></path>\n <path d=\"M6 14H54V15H6V14Z\" fill=\"currentColor\"></path>\n </svg>\n } @else {\n <svg width=\"60\" height=\"20\" viewBox=\"0 0 60 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect x=\"11\" y=\"9\" width=\"2\" height=\"5\" rx=\"0.5\" fill=\"currentColor\"></rect>\n <rect x=\"29\" y=\"6\" width=\"2\" height=\"10\" rx=\"0.5\" fill=\"currentColor\"></rect>\n <rect x=\"47\" y=\"8\" width=\"2\" height=\"7\" rx=\"0.5\" fill=\"currentColor\"></rect>\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M5 13L8 11L5 9V13ZM55 9L52 11L55 13V9Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n }\n } @else if (clickedAlign() === 'flex-start') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M3.5 7C3.22386 7 3 6.77614 3 6.5V3.5C3 3.22386 3.22386 3 3.5 3H4.5C4.77614 3 5 3.22386 5 3.5V6.5C5 6.77614 4.77614 7 4.5 7H3.5ZM7.5 13C7.22386 13 7 12.7761 7 12.5V3.5C7 3.22386 7.22386 3 7.5 3H8.5C8.77614 3 9 3.22386 9 3.5V12.5C9 12.7761 8.77614 13 8.5 13H7.5ZM11.5 3C11.2239 3 11 3.22386 11 3.5V8.5C11 8.77614 11.2239 9 11.5 9H12.5C12.7761 9 13 8.77614 13 8.5V3.5C13 3.22386 12.7761 3 12.5 3H11.5Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n } @else if (clickedAlign() === 'center') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M7.5 13C7.22386 13 7 12.7761 7 12.5V3.5C7 3.22386 7.22386 3 7.5 3H8.5C8.77614 3 9 3.22386 9 3.5V12.5C9 12.7761 8.77614 13 8.5 13H7.5ZM3.5 10C3.22386 10 3 9.77614 3 9.5V6.5C3 6.22386 3.22386 6 3.5 6H4.5C4.77614 6 5 6.22386 5 6.5V9.5C5 9.77614 4.77614 10 4.5 10H3.5ZM11.5 5C11.2239 5 11 5.22386 11 5.5V10.5C11 10.7761 11.2239 11 11.5 11H12.5C12.7761 11 13 10.7761 13 10.5V5.5C13 5.22386 12.7761 5 12.5 5H11.5Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n } @else if (clickedAlign() === 'flex-end') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M11.5 7C11.2239 7 11 7.22386 11 7.5L11 12.5C11 12.7761 11.2239 13 11.5 13L12.5 13C12.7761 13 13 12.7761 13 12.5L13 7.5C13 7.22386 12.7761 7 12.5 7L11.5 7ZM7.5 13C7.22386 13 7 12.7761 7 12.5L7 3.5C7 3.22386 7.22386 3 7.5 3L8.5 3C8.77614 3 9 3.22386 9 3.5L9 12.5C9 12.7761 8.77614 13 8.5 13L7.5 13ZM3.5 13C3.22386 13 3 12.7761 3 12.5L3 9.5C3 9.22386 3.22386 9 3.5 9L4.5 9C4.77614 9 5 9.22386 5 9.5L5 12.5C5 12.7761 4.77614 13 4.5 13L3.5 13Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n } @else if (clickedAlign() === 'stretch') {\n <svg width=\"20\" height=\"60\" viewBox=\"0 0 20 60\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M7 53.5C7 53.7761 6.77614 54 6.5 54L5.5 54C5.22386 54 5 53.7761 5 53.5L5 6.5C5 6.22386 5.22386 6 5.5 6L6.5 6C6.77614 6 7 6.22386 7 6.5L7 53.5ZM11 53.5C11 53.7761 10.7761 54 10.5 54L9.5 54C9.22386 54 9 53.7761 9 53.5L9 6.5C9 6.22386 9.22386 6 9.5 6L10.5 6C10.7761 6 11 6.22386 11 6.5L11 53.5ZM14.5 54C14.7761 54 15 53.7761 15 53.5L15 6.5C15 6.22386 14.7761 6 14.5 6L13.5 6C13.2239 6 13 6.22386 13 6.5L13 53.5C13 53.7761 13.2239 54 13.5 54L14.5 54Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n } @else if (clickedAlign() === 'baseline') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M13 2V8.29289L14.6464 6.64645L15.3536 7.35355L12.5 10.2071L9.64645 7.35355L10.3536 6.64645L12 8.29289V2H13Z\"\n fill=\"currentColor\"\n ></path>\n <path d=\"M16 12L1 12V13L16 13V12Z\" fill=\"currentColor\"></path>\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M4.62582 2H6.37412L8.72712 10H7.68476L7.09649 7.99994H3.90349L3.31524 10H2.27288L4.62582 2ZM6.80237 6.99994L5.62585 2.9999H5.37409L4.19761 6.99994H6.80237Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n }\n </div>\n </div>\n </div>\n </div>\n <div class=\"ax-grid ax-grid-cols-[auto_1fr] ax-items-center ax-justify-items-start ax-gap-2\">\n <span class=\"ax-order-1\">X:</span>\n <div class=\"ax-max-w-28\" [style.order]=\"flexDirectionIsColumn() ? '4' : '2'\">\n <!-- <ax-select-box\n [dataSource]=\"flexDirectionIsColumn()? alignDataSource : justifyDataSource\"\n [ngModel]=\"flexDirectionIsColumn()? selectedAlign : selectedJustify\"\n (ngModelChange)=\"flexDirectionIsColumn()? selectedAlign = $event : selectedJustify = $event\"\n (onValueChanged)=\"flexDirectionIsColumn()? onAlignChange($event) :onJustifyChange($event)\"\n textField=\"label\"\n valueField=\"value\"\n placeholder=\"Choose...\"\n >\n </ax-select-box> -->\n <ax-select-box\n class=\"ax-sm\"\n [dataSource]=\"justifyDataSource\"\n [(ngModel)]=\"selectedJustify\"\n (onValueChanged)=\"onJustifyChange($event)\"\n textField=\"label\"\n valueField=\"value\"\n placeholder=\"Choose...\"\n >\n </ax-select-box>\n </div>\n <span class=\"ax-order-3\">Y:</span>\n <div class=\"ax-max-w-28\" [style.order]=\"flexDirectionIsColumn() ? '2' : '4'\">\n <ax-select-box\n class=\"ax-sm\"\n [dataSource]=\"alignDataSource\"\n [(ngModel)]=\"selectedAlign\"\n (onValueChanged)=\"onAlignChange($event)\"\n textField=\"label\"\n valueField=\"value\"\n placeholder=\"Choose...\"\n >\n </ax-select-box>\n </div>\n </div>\n </div>\n <span>Gap</span>\n <div class=\"ax-flex ax-gap-2 ax-justify-between ax-items-center\">\n @if (gapMode() === 'both') {\n <ax-range-slider\n class=\"ax-w-32\"\n [ngModel]=\"gap().both\"\n (ngModelChange)=\"setGap($event ?? 0, 'both')\"\n ></ax-range-slider>\n <ax-number-box\n [minValue]=\"0\"\n [maxValue]=\"999\"\n [value]=\"gap().both\"\n [changeOnScroll]=\"true\"\n (onValueChanged)=\"setGap($event.value ?? 0, 'both')\"\n class=\"ax-sm ax-max-w-[5.5rem]\"\n [showSpinButtons]=\"false\"\n ><ax-suffix><ax-text class=\"!ax-text-xs !ax-px-1\">PX</ax-text></ax-suffix></ax-number-box\n >\n } @else {\n <div class=\"ax-flex ax-items-center ax-gap-2 ax-h-12\">\n <span class=\"ax-text-xs\"\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M12.2929 7.00004L9.14645 3.85359L9.85355 3.14648L14.2071 7.50004L9.85355 11.8536L9.14645 11.1465L12.2929 8.00004H3V7.00004H12.2929Z\"\n fill=\"currentColor\"\n ></path></svg ></span>\n <ax-number-box\n [minValue]=\"0\"\n [maxValue]=\"999\"\n [value]=\"gap().x\"\n [changeOnScroll]=\"true\"\n (onValueChanged)=\"setGap($event.value ?? 0, 'x')\"\n class=\"ax-sm ax-min-w-5\"\n [showSpinButtons]=\"false\"\n ><ax-suffix><ax-text class=\"!ax-text-xs !ax-px-1\">PX</ax-text></ax-suffix></ax-number-box\n >\n <span class=\"ax-text-xs\"\n ><svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M8.00001 12.2929L4.85356 9.14645L4.14645 9.85355L8.50001 14.2071L12.8536 9.85355L12.1465 9.14645L9.00001 12.2929L9.00001 3H8.00001L8.00001 12.2929Z\"\n fill=\"currentColor\"\n ></path></svg></span>\n <ax-number-box\n [minValue]=\"0\"\n [maxValue]=\"999\"\n [value]=\"gap().y\"\n [changeOnScroll]=\"true\"\n (onValueChanged)=\"setGap($event.value ?? 0, 'y')\"\n class=\"ax-sm ax-min-w-5\"\n [showSpinButtons]=\"false\"\n ><ax-suffix><ax-text class=\"!ax-text-xs !ax-px-1\">PX</ax-text></ax-suffix></ax-number-box\n >\n </div>\n }\n <button (click)=\"setGapMode()\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n @if (gapMode() === 'both') {\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M5 7L5 5C5 3.34315 6.34315 2 8 2C9.65685 2 11 3.34315 11 5V7C11.5523 7 12 7.44772 12 8V12C12 12.5523 11.5523 13 11 13H5C4.44772 13 4 12.5523 4 12V8C4 7.44771 4.44772 7 5 7ZM6 5C6 3.89543 6.89543 3 8 3C9.10457 3 10 3.89543 10 5V7H6V5ZM5 12V8H11V12H5Z\"\n fill=\"currentColor\"\n ></path>\n } @else {\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M9 5C9 3.89543 9.89543 3 11 3C12.1046 3 13 3.89543 13 5V6H14V5C14 3.34315 12.6569 2 11 2C9.34315 2 8 3.34315 8 5V7H3C2.44772 7 2 7.44771 2 8V12C2 12.5523 2.44772 13 3 13H9C9.55228 13 10 12.5523 10 12V8C10 7.44772 9.55228 7 9 7V5ZM3 8H9V12H3V8Z\"\n fill=\"currentColor\"\n ></path>\n }\n </svg>\n </button>\n </div>\n <!-- <span>Items</span>\n <div>\n <ax-number-box\n [minValue]=\"0\"\n [maxValue]=\"12\"\n [ngModel]=\"itemsCount()\"\n (ngModelChange)=\"setItemsCount($event ?? 0)\"\n class=\"ax-w-32\"\n ></ax-number-box>\n </div> -->\n</div>\n", styles: [":host{--ax-comp-range-slider-handler-size: .75rem}\n"], dependencies: [{ kind: "ngmodule", type: AXButtonGroupModule }, { kind: "component", type: i1$j.AXButtonGroupComponent, selector: "ax-button-group", inputs: ["disabled", "color", "look", "fitParent", "selection"], outputs: ["onBlur", "onFocus", "lookChange", "colorChange", "disabledChange", "onClick", "selectionChange", "selectedButtonChange"] }, { kind: "component", type: i1$j.AXButtonGroupItemComponent, selector: "ax-button-group-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "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: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i3.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: AXRangeSliderModule }, { kind: "component", type: i3$4.AXRangeSliderComponent, selector: "ax-range-slider", inputs: ["disabled", "readonly", "orientation", "color", "values", "mode", "min", "max", "step", "snap", "tooltipMode", "snapMode", "hasStep", "hasSnap", "hasLable", "hasTooltip"], outputs: ["valuesChange"] }, { kind: "ngmodule", type: AXNumberBoxModule }, { kind: "component", type: i1$7.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "minValue", "maxValue", "showSpinButtons", "thousandsSeparator", "decimals", "changeOnScroll", "step"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "thousandsSeparatorChange"] }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXSelectionListModule }, { kind: "component", type: i2$4.AXSelectionListComponent, selector: "ax-selection-list", inputs: ["id", "name", "disabled", "readonly", "tabIndex", "size", "value", "valueField", "textField", "disabledField", "readonlyField", "multiple", "direction", "customTemplate", "showControl", "items", "look"], outputs: ["onValueChanged", "onBlur", "onFocus"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
20453
21263
|
}
|
|
20454
21264
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFlexOptionsWidgetEditComponent, decorators: [{
|
|
20455
21265
|
type: Component,
|
|
@@ -20892,7 +21702,7 @@ class AXPSpacingWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
20892
21702
|
return { clientX: touch.clientX, clientY: touch.clientY };
|
|
20893
21703
|
}
|
|
20894
21704
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSpacingWidgetEditComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
20895
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPSpacingWidgetEditComponent, isStandalone: true, selector: "axp-spacing-widget-editor", viewQueries: [{ propertyName: "popover", first: true, predicate: AXPopoverComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"axp-spacing-box ax-flex ax-justify-center ax-items-center ax-pt-4 ax-pb-2\">\n <div class=\"axp-spacing-inner-box\">\n <div class=\"axp-spacing-margin-box\">\n <!--MARGIN SVG DEFINE-->\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"224\" height=\"112\" class=\"area\">\n <mask id=\"margin-mask\" width=\"224\" height=\"112\">\n <rect fill=\"#000\" height=\"112\" width=\"224\" x=\"0\" y=\"0\"></rect>\n <rect fill=\"#fff\" height=\"112\" rx=\"4\" width=\"224\" x=\"0\" y=\"0\"></rect>\n <rect fill=\"#000\" height=\"66\" rx=\"4\" width=\"154\" x=\"35\" y=\"23\"></rect>\n </mask>\n <defs>\n <linearGradient id=\"FuseLinearGradient\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n <stop stop-color=\"white\"></stop>\n <stop offset=\"1\" stop-color=\"white\" stop-opacity=\"0\"></stop>\n </linearGradient>\n </defs>\n\n <!--MARGIN TOP SVG-->\n <g\n class=\"hover:ax-brightness-75\"\n style=\"cursor: s-resize\"\n (click)=\"openPopUp($event, 'margin', 'top')\"\n (mousedown)=\"listenToMove($event, 'margin', 'top')\"\n >\n <g>\n <path\n mode=\"delta\"\n fill=\"var(--color-background-1)\"\n d=\"\n m0,0\n h224\n l-36,24\n h-152\n l-36,-24z\n \"\n mask=\"url(#margin-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"white\"\n d=\"\n m0,0\n h224\n l-36,24\n h-152\n l-36,-24z\n \"\n fill-opacity=\"0.12\"\n mask=\"url(#margin-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"url(#FuseLinearGradient)\"\n d=\"\n m0,0\n h224\n l-36,24\n h-152\n l-36,-24z\n \"\n fill-opacity=\"0.02\"\n mask=\"url(#margin-mask)\"\n ></path>\n </g>\n </g>\n <!--MARGIN RIGHT SVG-->\n <g\n class=\"hover:ax-brightness-75\"\n style=\"cursor: s-resize\"\n (click)=\"openPopUp($event, 'margin', 'right')\"\n (mousedown)=\"listenToMove($event, 'margin', 'right')\"\n >\n <g>\n <path\n mode=\"delta\"\n fill=\"var(--color-background-1)\"\n d=\"\n m224,0\n v112\n l-36,-24\n v-64\n l36,-24z\n \"\n mask=\"url(#margin-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"white\"\n d=\"\n m224,0\n v112\n l-36,-24\n v-64\n l36,-24z\n \"\n fill-opacity=\"0.094\"\n mask=\"url(#margin-mask)\"\n ></path>\n </g>\n </g>\n <!--MARGIN BOTTOM SVG-->\n <g\n class=\"hover:ax-brightness-75\"\n style=\"cursor: s-resize\"\n (click)=\"openPopUp($event, 'margin', 'bottom')\"\n (mousedown)=\"listenToMove($event, 'margin', 'bottom')\"\n >\n <g>\n <path\n mode=\"delta\"\n fill=\"var(--color-background-1)\"\n d=\"\n m0,112\n h224\n l-36,-24\n h-152\n l-36,24z\n \"\n mask=\"url(#margin-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"white\"\n d=\"\n m0,112\n h224\n l-36,-24\n h-152\n l-36,24z\n \"\n fill-opacity=\"0.064\"\n mask=\"url(#margin-mask)\"\n ></path>\n </g>\n </g>\n <!--MARGIN LEFT SVG-->\n <g\n class=\"hover:ax-brightness-75\"\n style=\"cursor: s-resize\"\n (click)=\"openPopUp($event, 'margin', 'left')\"\n (mousedown)=\"listenToMove($event, 'margin', 'left')\"\n >\n <g>\n <path\n mode=\"delta\"\n fill=\"var(--color-background-1)\"\n d=\"\n m0,0\n v112\n l36,-24\n v-64\n l-36,-24z\n \"\n mask=\"url(#margin-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"white\"\n d=\"\n m0,0\n v112\n l36,-24\n v-64\n l-36,-24z\n \"\n fill-opacity=\"0.094\"\n mask=\"url(#margin-mask)\"\n ></path>\n </g>\n </g>\n </svg>\n\n <!--MARGIN TOP VALUE-->\n <div tabindex=\"0\" class=\"axp-spacing-value-container\" style=\"grid-area: 1 / 2 / 2 / 3\">\n <div class=\"axp-spacing-value-field\" style=\"grid-area: 1 / 2 / 2 / 3\">\n <span>{{ calculatedValues().margin.top + ' ' + units().margin.top }}</span>\n </div>\n </div>\n\n <!--MARGIN RIGHT VALUE-->\n <div tabindex=\"0\" class=\"axp-spacing-value-container\" style=\"grid-area: 2 / 3 / 3 / 4\">\n <div class=\"axp-spacing-value-field\" style=\"grid-area: 2 / 3 / 3 / 4\">\n <span>{{ calculatedValues().margin.right + ' ' + units().margin.right }}</span>\n </div>\n </div>\n\n <!--MARGIN BOTTOM VALUE-->\n <div tabindex=\"0\" class=\"axp-spacing-value-container\" style=\"grid-area: 3 / 2 / 4 / 3\">\n <div class=\"axp-spacing-value-field\" style=\"grid-area: 3 / 2 / 4 / 3\">\n <span>{{ calculatedValues().margin.bottom + ' ' + units().margin.bottom }}</span>\n </div>\n </div>\n\n <!--MARGIN LEFT VALUE-->\n <div tabindex=\"0\" style=\"grid-area: 2 / 1 / 3 / 2\" class=\"axp-spacing-value-container\">\n <div class=\"axp-spacing-value-field\" style=\"grid-area: 2 / 1 / 3 / 2\">\n <span>{{ calculatedValues().margin.left + ' ' + units().margin.left }}</span>\n </div>\n </div>\n </div>\n\n <div class=\"axp-spacing-padding-box\">\n <!--SVG DEFINE-->\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"150\" height=\"62\" class=\"area\">\n <mask id=\"padding-mask\" width=\"150\" height=\"62\">\n <rect fill=\"#000\" height=\"60\" width=\"150\" x=\"0\" y=\"0\"></rect>\n <rect fill=\"#fff\" height=\"60\" rx=\"2\" width=\"150\" x=\"0\" y=\"0\"></rect>\n <rect fill=\"#000\" height=\"14\" rx=\"2\" width=\"80\" x=\"35\" y=\"23\"></rect>\n </mask>\n\n <!--PADDING TOP SVG-->\n <g\n class=\"hover:ax-brightness-75\"\n style=\"cursor: s-resize\"\n (click)=\"openPopUp($event, 'padding', 'top')\"\n (mousedown)=\"listenToMove($event, 'padding', 'top')\"\n >\n <g>\n <path\n mode=\"delta\"\n fill=\"var(--color-background-1)\"\n d=\"\n m0,0\n h150\n l-36,24\n h-78\n l-36,-24z\n \"\n mask=\"url(#padding-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"white\"\n d=\"\n m0,0\n h150\n l-36,24\n h-78\n l-36,-24z\n \"\n fill-opacity=\"0.064\"\n mask=\"url(#padding-mask)\"\n ></path>\n </g>\n </g>\n\n <!--PADDING RIGHT SVG-->\n <g\n class=\"hover:ax-brightness-75\"\n style=\"cursor: s-resize\"\n (click)=\"openPopUp($event, 'padding', 'right')\"\n (mousedown)=\"listenToMove($event, 'padding', 'right')\"\n >\n <g>\n <path\n mode=\"delta\"\n fill=\"var(--color-background-1)\"\n d=\"\n m150,0\n v60\n l-36,-24\n v-12\n l36,-24z\n \"\n mask=\"url(#padding-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"white\"\n d=\"\n m150,0\n v60\n l-36,-24\n v-12\n l36,-24z\n \"\n fill-opacity=\"0.094\"\n mask=\"url(#padding-mask)\"\n ></path>\n </g>\n </g>\n\n <!--PADDING BOTTOM SVG-->\n <g\n class=\"hover:ax-brightness-75\"\n style=\"cursor: s-resize\"\n (click)=\"openPopUp($event, 'padding', 'bottom')\"\n (mousedown)=\"listenToMove($event, 'padding', 'bottom')\"\n >\n <g>\n <path\n mode=\"delta\"\n fill=\"var(--color-background-1)\"\n d=\"\n m0,60\n h150\n l-36,-24\n h-78\n l-36,24z\n \"\n mask=\"url(#padding-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"white\"\n d=\"\n m0,60\n h150\n l-36,-24\n h-78\n l-36,24z\n \"\n fill-opacity=\"0.12\"\n mask=\"url(#padding-mask)\"\n ></path>\n </g>\n </g>\n\n <!--PADDING LEFT SVG-->\n <g\n class=\"hover:ax-brightness-75\"\n style=\"cursor: s-resize\"\n (click)=\"openPopUp($event, 'padding', 'left')\"\n (mousedown)=\"listenToMove($event, 'padding', 'left')\"\n >\n <g>\n <path\n mode=\"delta\"\n fill=\"var(--color-background-1)\"\n d=\"\n m0,0\n v60\n l36,-24\n v-12\n l-36,-24z\n \"\n mask=\"url(#padding-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"white\"\n d=\"\n m0,0\n v60\n l36,-24\n v-12\n l-36,-24z\n \"\n fill-opacity=\"0.094\"\n mask=\"url(#padding-mask)\"\n ></path>\n </g>\n </g>\n </svg>\n\n <!--PADDING TOP SVG-->\n <div tabindex=\"0\" class=\"axp-spacing-value-container\" style=\"grid-area: 1 / 2 / 2 / 3\">\n <div class=\"axp-spacing-value-field\" style=\"grid-area: 1 / 2 / 2 / 3\">\n <span>{{ this.calculatedValues().padding.top + ' ' + units().padding.top }}</span>\n </div>\n </div>\n\n <!--PADDING RIGHT SVG-->\n <div tabindex=\"0\" class=\"axp-spacing-value-container\" style=\"grid-area: 2 / 3 / 3 / 4\">\n <div class=\"axp-spacing-value-field\" style=\"grid-area: 2 / 3 / 3 / 4\">\n <span>{{ this.calculatedValues().padding.right + ' ' + units().padding.right }}</span>\n </div>\n </div>\n\n <!--PADDING BOTTOM SVG-->\n <div tabindex=\"0\" class=\"axp-spacing-value-container\" style=\"grid-area: 3 / 2 / 4 / 3\">\n <div class=\"axp-spacing-value-field\" style=\"grid-area: 3 / 2 / 4 / 3\">\n <span>{{ this.calculatedValues().padding.bottom + ' ' + units().padding.bottom }}</span>\n </div>\n </div>\n\n <!--PADDING LEFT SVG-->\n <div tabindex=\"0\" class=\"axp-spacing-value-container\" style=\"grid-area: 2 / 1 / 3 / 2\">\n <div class=\"axp-spacing-value-field\" style=\"grid-area: 2 / 1 / 3 / 2\">\n <span>{{ this.calculatedValues().padding.left + ' ' + units().padding.left }}</span>\n </div>\n </div>\n </div>\n\n <!--PADDING TEXT-->\n <svg class=\"axp-spacing-padding-text\" xmlns=\"http://www.w3.org/2000/svg\" width=\"100%\" height=\"100%\">\n <text x=\"5\" y=\"10\" fill=\"white\" font-weight=\"500\" font-size=\"7\">PADDING</text>\n </svg>\n\n <!--MARGIN TEXT-->\n <svg class=\"axp-spacing-margin-text\" xmlns=\"http://www.w3.org/2000/svg\" width=\"100%\" height=\"100%\">\n <text x=\"5\" y=\"10\" fill=\"white\" font-weight=\"500\" font-size=\"7\">MARGIN</text>\n </svg>\n\n <!-- Ctrl hint -->\n <!-- <div class=\"ax-text-xs ax-text-center ax-text-neutral-400 ax-mt-1\">\n Hold Ctrl while dragging to adjust all sides\n </div> -->\n </div>\n</div>\n\n<ng-template #template let-type=\"type\" let-side=\"side\" let-value=\"value\">\n <div\n class=\"axp-spacing-popup-container\"\n (keydown.control.b)=\"setSpacing(originalValues()[this.current().type][this.current().side], type, side)\"\n >\n <div class=\"axp-spacing-popover\">\n <!--SET EMPTY-->\n <div class=\"ax-size-4 ax-cursor-pointer\" (click)=\"setSpacing(0, type, side)\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path opacity=\"0.4\" d=\"M14 2L14 13L10 13L10 2L14 2Z\" fill=\"currentColor\" fill-opacity=\"0.67\"></path>\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M7.99995 7L7.99995 1H8.99995L8.99995 14H7.99995L7.99995 8L3.70706 8L5.85351 10.1464L5.1464 10.8536L1.79285 7.5L5.1464 4.14645L5.85351 4.85355L3.70706 7L7.99995 7Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n </div>\n\n <div class=\"ax-flex ax-justify-center ax-h-6 ax-flex-col\">\n <input\n type=\"range\"\n name=\"range\"\n [min]=\"0\"\n [max]=\"200\"\n [value]=\"this.calculatedValues()[this.current().type][this.current().side]\"\n (input)=\"setSpacing($event, type, side)\"\n />\n </div>\n <div>\n <!--INPUT NUMBER-->\n <div style=\"--local-gap: 8px\">\n <div\n style=\"\n gap: 8px;\n height: auto;\n display: flex;\n flex-flow: column;\n -webkit-box-align: stretch;\n align-items: stretch;\n -webkit-box-pack: start;\n position: relative;\n justify-content: stretch;\n width: 100%;\n -webkit-box-flex: 1;\n flex-grow: 1;\n \"\n >\n <ax-number-box\n class=\"ax-sm\"\n [minValue]=\"0\"\n [changeOnScroll]=\"true\"\n [ngModel]=\"value\"\n (onValueChanged)=\"setSpacing($event.value ?? 0, type, side)\"\n [showSpinButtons]=\"false\"\n >\n <ax-suffix>\n <ax-dropdown-button [text]=\"getSpacingUnitLabel(type, side)\" [look]=\"'blank'\" [mode]=\"'dropdown'\">\n <ax-button-item-list>\n @for (u of spacingUnits; track $index) {\n <ax-button-item\n [text]=\"u.toUpperCase()\"\n [selected]=\"getSpacingUnit(type, side) === u\"\n (onClick)=\"onSpacingUnitChange(u, type, side)\"\n ></ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button>\n </ax-suffix>\n </ax-number-box>\n </div>\n </div>\n </div>\n <div class=\"axp-spacing-template-values\">\n @for (i of FixedValues; track $index) {\n <div\n (click)=\"setSpacing(i.value, type, side)\"\n class=\"hover:!ax-bg-gradient-to-b hover:!ax-from-white/20 hover:!ax-to-white/5 !ax-cursor-pointer\"\n [class]=\"i.colspan ? 'ax-col-span-' + i.colspan : ''\"\n [class]=\"i.rowspan ? 'ax-row-span-' + i.rowspan : ''\"\n tabindex=\"0\"\n style=\"\n border-bottom-color: var(--color-border-1);\n border-left-color: var(--color-border-1);\n border-right-color: var(--color-border-1);\n border-top-color: var(--color-border-1);\n outline: 0px;\n cursor: default;\n user-select: none;\n padding: 0px;\n box-sizing: border-box;\n font-family: inherit;\n font-size: inherit;\n --component-icon-color: var(--color-text-secondary);\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n border-radius: 4px;\n color: var(--color-action-secondary-text);\n background: var(--color-action-secondary-background);\n border-width: 0px;\n border-style: solid;\n box-shadow: var(--box-shadows-action-secondary);\n align-self: center;\n \"\n >\n <div class=\"ax-truncate\">\n {{ i.label }}\n <span class=\"ax-text-xs ax-text-neutral-400\">\n {{ units()[this.current().type][this.current().side] }}</span\n >\n </div>\n </div>\n }\n </div>\n </div>\n\n <div class=\"ax-h-[1px] ax-mt-1 ax-mb-1 ax-bg-border-1 ax-pointer-events-none\"></div>\n\n <div\n [class.ax-opacity-50]=\"\n originalValues()[this.current().type][this.current().side] ===\n calculatedValues()[this.current().type][this.current().side]\n \"\n (click)=\"setSpacing(originalValues()[this.current().type][this.current().side], type, side)\"\n tabindex=\"0\"\n class=\"ax-outline-none ax-select-none ax-py-1 ax-px-2 ax-my-1 ax-min-h-6 ax-cursor-pointer hover:!ax-bg-[#404040]\"\n >\n <div class=\"ax-flex ax-flex-row ax-items-center\">\n <div class=\"ax-min-w-6 ax-self-center ax-grow ax-basis-0\">\n <div class=\"ax-items-center ax-box-border ax-grid ax-grid-cols-[16px_1fr_auto] ax-gap-x-2 ax-gap-y-1\">\n <div class=\"ax-size-4\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M3.70712 5.00004L6.35357 2.35359L5.64646 1.64648L1.79291 5.50004L5.64646 9.35359L6.35357 8.64648L3.70712 6.00004H10C11.6569 6.00004 13 7.34318 13 9.00004C13 10.6569 11.6569 12 10 12H8.00001V13H10C12.2092 13 14 11.2092 14 9.00004C14 6.7909 12.2092 5.00004 10 5.00004H3.70712Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n </div>\n <div>Reset</div>\n </div>\n </div>\n <div class=\"ax-self-center\">\n <div\n class=\"ax-cursor-default ax-select-none ax-text-[11.5px] ax-font-normal ax-leading-4 ax-tracking-tight ax-text-secondary ax-justify-self-end ax-ml-[1px]\"\n >\n <ax-kbd class=\"look-text\">\n <ax-kbd-item [keys]=\"toggleShortcutKeys\"></ax-kbd-item>\n </ax-kbd>\n </div>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n\n<ax-popover #popover [openOn]=\"'click'\" [offsetY]=\"10\" [closeOn]=\"'clickOut'\">\n <ng-container\n [ngTemplateOutlet]=\"template\"\n [ngTemplateOutletContext]=\"{\n type: this.current().type,\n side: this.current().side,\n value: this.calculatedValues()[this.current().type][this.current().side],\n }\"\n ></ng-container>\n</ax-popover>\n", styles: [".axp-spacing-box{--color-text-secondary: rgba(255, 255, 255, .67);--color-ui-scrollbar-thumb: rgba(255, 255, 255, .67);--color-background-1: #292929;--color-text-secondary: white;--color-border-2: rgba(255, 255, 255, .16);--color-changed: rgb(167, 209, 255);--color-background: rgba(0, 106, 204, .18)}.axp-spacing-box .axp-spacing-inner-box{transform:scale(1.2);position:relative;display:grid;width:224px;height:112px;grid-template-columns:36px 1px 36px 1fr 36px 1px 36px;grid-template-rows:24px 2px 24px 1fr 24px 2px 24px;outline-style:none;cursor:default;-webkit-user-select:none;user-select:none}.axp-spacing-box .axp-spacing-inner-box .axp-spacing-value-container{pointer-events:none;border:none;outline:0px;cursor:default;-webkit-user-select:none;user-select:none;display:flex;align-items:center;justify-content:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;place-self:center;padding:2px;height:auto;width:auto;font-family:inherit;font-size:inherit;position:relative;border-radius:4px;color:var(--color-text-secondary);background:transparent;box-sizing:border-box;box-shadow:none}.axp-spacing-box .axp-spacing-inner-box .axp-spacing-value-container .axp-spacing-value-field{cursor:default;-webkit-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;font-weight:400;line-height:10px;letter-spacing:-.115px;display:flex;color:var(--color-text-secondary);background:transparent;padding:2px;margin:0;border-radius:2px;max-width:100%;box-sizing:content-box;place-self:center;position:relative;opacity:1;align-items:center;justify-content:center}.axp-spacing-box .axp-spacing-inner-box .axp-spacing-margin-box{border-radius:4px;grid-area:1/1/-1/-1;display:grid;grid-template-columns:36px 1fr 36px;grid-template-rows:24px minmax(8px,1fr) 24px;justify-items:center;width:224px;height:112px}.axp-spacing-box .axp-spacing-inner-box .axp-spacing-padding-box{border-radius:4px;grid-area:3/3/span 3/span 3;display:grid;grid-template-columns:36px 1fr 36px;grid-template-rows:24px minmax(8px,1fr) 24px;justify-items:center;width:150px;height:60px}.axp-spacing-box .axp-spacing-inner-box .axp-spacing-padding-text{grid-area:3/3/span 3/span 3;pointer-events:none;position:relative}.axp-spacing-box .axp-spacing-inner-box .axp-spacing-margin-text{grid-area:1/1/-1/-1;pointer-events:none;position:relative}.axp-spacing-popup-container{--color-action-secondary-text: white;--color-action-secondary-background: linear-gradient( 180deg, rgba(255, 255, 255, .13) 0%, rgba(255, 255, 255, .11) 100% );--box-shadows-action-secondary: 0px .5px 1px rgba(0, 0, 0, .8), inset 0px .5px .5px rgba(255, 255, 255, .12);--color-border-1: rgba(255, 255, 255, .13);max-width:239px;min-width:201px;background:#353535;border-radius:.5rem;color:var(--color-text-secondary, white);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,Helvetica,Arial,\"Apple Color Emoji\",\"Segoe UI Emoji\",Segoe UI Symbol,sans-serif;font-size:11.5px;line-height:16px}.axp-spacing-popup-container .axp-spacing-popover{display:grid;grid-template-columns:16px 1fr 56px;grid-template-rows:24px 1fr;align-items:center;gap:8px;width:241px;padding:8px}.axp-spacing-popup-container .axp-spacing-popover .axp-spacing-template-values{display:grid;grid-area:2/1/3/-1;grid-template-columns:repeat(5,1fr);grid-template-rows:24px 24px;gap:4px}.axp-spacing-popup-container .axp-spacing-popover input[type=range]{-webkit-appearance:none;appearance:none;width:100%;cursor:pointer;outline:none;overflow:hidden;border-radius:12px}.axp-spacing-popup-container .axp-spacing-popover input[type=range]::-webkit-slider-runnable-track{height:10px;background:#ccc;border-radius:12px}.axp-spacing-popup-container .axp-spacing-popover input[type=range]::-moz-range-track{height:10px;background:#ccc;border-radius:12px}.axp-spacing-popup-container .axp-spacing-popover input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;height:10px;width:10px;background-color:#fff;border-radius:50%;border:1px solid #353535;box-shadow:-407px 0 0 400px #29292970}.axp-spacing-popup-container .axp-spacing-popover input[type=range]::-moz-range-thumb{height:10px;width:10px;background-color:#fff;border-radius:50%;border:1px solid #353535;box-shadow:-407px 0 0 400px #29292970}.area{grid-area:1/1/-1/-1;overflow:hidden;border-radius:2px;filter:drop-shadow(rgba(255,255,255,.2) 0px -.5px 0px) drop-shadow(rgba(0,0,0,.4) 0px 0px 1px) drop-shadow(rgba(0,0,0,.2) 0px 1px 0px)}\n"], dependencies: [{ kind: "ngmodule", type: AXNumberBoxModule }, { kind: "component", type: i1$7.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "minValue", "maxValue", "showSpinButtons", "thousandsSeparator", "decimals", "changeOnScroll", "step"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "thousandsSeparatorChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXCheckBoxModule }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i3$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: CommonModule }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXRangeSliderModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1$1.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "component", type: i6$1.AXDropdownButtonComponent, selector: "ax-dropdown-button", inputs: ["disabled", "size", "color", "look", "text", "type", "mode"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "lookChange", "colorChange", "disabledChange"] }, { 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: 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" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
21705
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPSpacingWidgetEditComponent, isStandalone: true, selector: "axp-spacing-widget-editor", viewQueries: [{ propertyName: "popover", first: true, predicate: AXPopoverComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"axp-spacing-box ax-flex ax-justify-center ax-items-center ax-pt-4 ax-pb-2\">\n <div class=\"axp-spacing-inner-box\">\n <div class=\"axp-spacing-margin-box\">\n <!--MARGIN SVG DEFINE-->\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"224\" height=\"112\" class=\"area\">\n <mask id=\"margin-mask\" width=\"224\" height=\"112\">\n <rect fill=\"#000\" height=\"112\" width=\"224\" x=\"0\" y=\"0\"></rect>\n <rect fill=\"#fff\" height=\"112\" rx=\"4\" width=\"224\" x=\"0\" y=\"0\"></rect>\n <rect fill=\"#000\" height=\"66\" rx=\"4\" width=\"154\" x=\"35\" y=\"23\"></rect>\n </mask>\n <defs>\n <linearGradient id=\"FuseLinearGradient\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n <stop stop-color=\"white\"></stop>\n <stop offset=\"1\" stop-color=\"white\" stop-opacity=\"0\"></stop>\n </linearGradient>\n </defs>\n\n <!--MARGIN TOP SVG-->\n <g\n class=\"hover:ax-brightness-75\"\n style=\"cursor: s-resize\"\n (click)=\"openPopUp($event, 'margin', 'top')\"\n (mousedown)=\"listenToMove($event, 'margin', 'top')\"\n >\n <g>\n <path\n mode=\"delta\"\n fill=\"var(--color-background-1)\"\n d=\"\n m0,0\n h224\n l-36,24\n h-152\n l-36,-24z\n \"\n mask=\"url(#margin-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"white\"\n d=\"\n m0,0\n h224\n l-36,24\n h-152\n l-36,-24z\n \"\n fill-opacity=\"0.12\"\n mask=\"url(#margin-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"url(#FuseLinearGradient)\"\n d=\"\n m0,0\n h224\n l-36,24\n h-152\n l-36,-24z\n \"\n fill-opacity=\"0.02\"\n mask=\"url(#margin-mask)\"\n ></path>\n </g>\n </g>\n <!--MARGIN RIGHT SVG-->\n <g\n class=\"hover:ax-brightness-75\"\n style=\"cursor: s-resize\"\n (click)=\"openPopUp($event, 'margin', 'right')\"\n (mousedown)=\"listenToMove($event, 'margin', 'right')\"\n >\n <g>\n <path\n mode=\"delta\"\n fill=\"var(--color-background-1)\"\n d=\"\n m224,0\n v112\n l-36,-24\n v-64\n l36,-24z\n \"\n mask=\"url(#margin-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"white\"\n d=\"\n m224,0\n v112\n l-36,-24\n v-64\n l36,-24z\n \"\n fill-opacity=\"0.094\"\n mask=\"url(#margin-mask)\"\n ></path>\n </g>\n </g>\n <!--MARGIN BOTTOM SVG-->\n <g\n class=\"hover:ax-brightness-75\"\n style=\"cursor: s-resize\"\n (click)=\"openPopUp($event, 'margin', 'bottom')\"\n (mousedown)=\"listenToMove($event, 'margin', 'bottom')\"\n >\n <g>\n <path\n mode=\"delta\"\n fill=\"var(--color-background-1)\"\n d=\"\n m0,112\n h224\n l-36,-24\n h-152\n l-36,24z\n \"\n mask=\"url(#margin-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"white\"\n d=\"\n m0,112\n h224\n l-36,-24\n h-152\n l-36,24z\n \"\n fill-opacity=\"0.064\"\n mask=\"url(#margin-mask)\"\n ></path>\n </g>\n </g>\n <!--MARGIN LEFT SVG-->\n <g\n class=\"hover:ax-brightness-75\"\n style=\"cursor: s-resize\"\n (click)=\"openPopUp($event, 'margin', 'left')\"\n (mousedown)=\"listenToMove($event, 'margin', 'left')\"\n >\n <g>\n <path\n mode=\"delta\"\n fill=\"var(--color-background-1)\"\n d=\"\n m0,0\n v112\n l36,-24\n v-64\n l-36,-24z\n \"\n mask=\"url(#margin-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"white\"\n d=\"\n m0,0\n v112\n l36,-24\n v-64\n l-36,-24z\n \"\n fill-opacity=\"0.094\"\n mask=\"url(#margin-mask)\"\n ></path>\n </g>\n </g>\n </svg>\n\n <!--MARGIN TOP VALUE-->\n <div tabindex=\"0\" class=\"axp-spacing-value-container\" style=\"grid-area: 1 / 2 / 2 / 3\">\n <div class=\"axp-spacing-value-field\" style=\"grid-area: 1 / 2 / 2 / 3\">\n <span>{{ calculatedValues().margin.top + ' ' + units().margin.top }}</span>\n </div>\n </div>\n\n <!--MARGIN RIGHT VALUE-->\n <div tabindex=\"0\" class=\"axp-spacing-value-container\" style=\"grid-area: 2 / 3 / 3 / 4\">\n <div class=\"axp-spacing-value-field\" style=\"grid-area: 2 / 3 / 3 / 4\">\n <span>{{ calculatedValues().margin.right + ' ' + units().margin.right }}</span>\n </div>\n </div>\n\n <!--MARGIN BOTTOM VALUE-->\n <div tabindex=\"0\" class=\"axp-spacing-value-container\" style=\"grid-area: 3 / 2 / 4 / 3\">\n <div class=\"axp-spacing-value-field\" style=\"grid-area: 3 / 2 / 4 / 3\">\n <span>{{ calculatedValues().margin.bottom + ' ' + units().margin.bottom }}</span>\n </div>\n </div>\n\n <!--MARGIN LEFT VALUE-->\n <div tabindex=\"0\" style=\"grid-area: 2 / 1 / 3 / 2\" class=\"axp-spacing-value-container\">\n <div class=\"axp-spacing-value-field\" style=\"grid-area: 2 / 1 / 3 / 2\">\n <span>{{ calculatedValues().margin.left + ' ' + units().margin.left }}</span>\n </div>\n </div>\n </div>\n\n <div class=\"axp-spacing-padding-box\">\n <!--SVG DEFINE-->\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"150\" height=\"62\" class=\"area\">\n <mask id=\"padding-mask\" width=\"150\" height=\"62\">\n <rect fill=\"#000\" height=\"60\" width=\"150\" x=\"0\" y=\"0\"></rect>\n <rect fill=\"#fff\" height=\"60\" rx=\"2\" width=\"150\" x=\"0\" y=\"0\"></rect>\n <rect fill=\"#000\" height=\"14\" rx=\"2\" width=\"80\" x=\"35\" y=\"23\"></rect>\n </mask>\n\n <!--PADDING TOP SVG-->\n <g\n class=\"hover:ax-brightness-75\"\n style=\"cursor: s-resize\"\n (click)=\"openPopUp($event, 'padding', 'top')\"\n (mousedown)=\"listenToMove($event, 'padding', 'top')\"\n >\n <g>\n <path\n mode=\"delta\"\n fill=\"var(--color-background-1)\"\n d=\"\n m0,0\n h150\n l-36,24\n h-78\n l-36,-24z\n \"\n mask=\"url(#padding-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"white\"\n d=\"\n m0,0\n h150\n l-36,24\n h-78\n l-36,-24z\n \"\n fill-opacity=\"0.064\"\n mask=\"url(#padding-mask)\"\n ></path>\n </g>\n </g>\n\n <!--PADDING RIGHT SVG-->\n <g\n class=\"hover:ax-brightness-75\"\n style=\"cursor: s-resize\"\n (click)=\"openPopUp($event, 'padding', 'right')\"\n (mousedown)=\"listenToMove($event, 'padding', 'right')\"\n >\n <g>\n <path\n mode=\"delta\"\n fill=\"var(--color-background-1)\"\n d=\"\n m150,0\n v60\n l-36,-24\n v-12\n l36,-24z\n \"\n mask=\"url(#padding-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"white\"\n d=\"\n m150,0\n v60\n l-36,-24\n v-12\n l36,-24z\n \"\n fill-opacity=\"0.094\"\n mask=\"url(#padding-mask)\"\n ></path>\n </g>\n </g>\n\n <!--PADDING BOTTOM SVG-->\n <g\n class=\"hover:ax-brightness-75\"\n style=\"cursor: s-resize\"\n (click)=\"openPopUp($event, 'padding', 'bottom')\"\n (mousedown)=\"listenToMove($event, 'padding', 'bottom')\"\n >\n <g>\n <path\n mode=\"delta\"\n fill=\"var(--color-background-1)\"\n d=\"\n m0,60\n h150\n l-36,-24\n h-78\n l-36,24z\n \"\n mask=\"url(#padding-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"white\"\n d=\"\n m0,60\n h150\n l-36,-24\n h-78\n l-36,24z\n \"\n fill-opacity=\"0.12\"\n mask=\"url(#padding-mask)\"\n ></path>\n </g>\n </g>\n\n <!--PADDING LEFT SVG-->\n <g\n class=\"hover:ax-brightness-75\"\n style=\"cursor: s-resize\"\n (click)=\"openPopUp($event, 'padding', 'left')\"\n (mousedown)=\"listenToMove($event, 'padding', 'left')\"\n >\n <g>\n <path\n mode=\"delta\"\n fill=\"var(--color-background-1)\"\n d=\"\n m0,0\n v60\n l36,-24\n v-12\n l-36,-24z\n \"\n mask=\"url(#padding-mask)\"\n ></path>\n <path\n mode=\"delta\"\n fill=\"white\"\n d=\"\n m0,0\n v60\n l36,-24\n v-12\n l-36,-24z\n \"\n fill-opacity=\"0.094\"\n mask=\"url(#padding-mask)\"\n ></path>\n </g>\n </g>\n </svg>\n\n <!--PADDING TOP SVG-->\n <div tabindex=\"0\" class=\"axp-spacing-value-container\" style=\"grid-area: 1 / 2 / 2 / 3\">\n <div class=\"axp-spacing-value-field\" style=\"grid-area: 1 / 2 / 2 / 3\">\n <span>{{ this.calculatedValues().padding.top + ' ' + units().padding.top }}</span>\n </div>\n </div>\n\n <!--PADDING RIGHT SVG-->\n <div tabindex=\"0\" class=\"axp-spacing-value-container\" style=\"grid-area: 2 / 3 / 3 / 4\">\n <div class=\"axp-spacing-value-field\" style=\"grid-area: 2 / 3 / 3 / 4\">\n <span>{{ this.calculatedValues().padding.right + ' ' + units().padding.right }}</span>\n </div>\n </div>\n\n <!--PADDING BOTTOM SVG-->\n <div tabindex=\"0\" class=\"axp-spacing-value-container\" style=\"grid-area: 3 / 2 / 4 / 3\">\n <div class=\"axp-spacing-value-field\" style=\"grid-area: 3 / 2 / 4 / 3\">\n <span>{{ this.calculatedValues().padding.bottom + ' ' + units().padding.bottom }}</span>\n </div>\n </div>\n\n <!--PADDING LEFT SVG-->\n <div tabindex=\"0\" class=\"axp-spacing-value-container\" style=\"grid-area: 2 / 1 / 3 / 2\">\n <div class=\"axp-spacing-value-field\" style=\"grid-area: 2 / 1 / 3 / 2\">\n <span>{{ this.calculatedValues().padding.left + ' ' + units().padding.left }}</span>\n </div>\n </div>\n </div>\n\n <!--PADDING TEXT-->\n <svg class=\"axp-spacing-padding-text\" xmlns=\"http://www.w3.org/2000/svg\" width=\"100%\" height=\"100%\">\n <text x=\"5\" y=\"10\" fill=\"white\" font-weight=\"500\" font-size=\"7\">PADDING</text>\n </svg>\n\n <!--MARGIN TEXT-->\n <svg class=\"axp-spacing-margin-text\" xmlns=\"http://www.w3.org/2000/svg\" width=\"100%\" height=\"100%\">\n <text x=\"5\" y=\"10\" fill=\"white\" font-weight=\"500\" font-size=\"7\">MARGIN</text>\n </svg>\n\n <!-- Ctrl hint -->\n <!-- <div class=\"ax-text-xs ax-text-center ax-text-neutral-400 ax-mt-1\">\n Hold Ctrl while dragging to adjust all sides\n </div> -->\n </div>\n</div>\n\n<ng-template #template let-type=\"type\" let-side=\"side\" let-value=\"value\">\n <div\n class=\"axp-spacing-popup-container\"\n (keydown.control.b)=\"setSpacing(originalValues()[this.current().type][this.current().side], type, side)\"\n >\n <div class=\"axp-spacing-popover\">\n <!--SET EMPTY-->\n <div class=\"ax-size-4 ax-cursor-pointer\" (click)=\"setSpacing(0, type, side)\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path opacity=\"0.4\" d=\"M14 2L14 13L10 13L10 2L14 2Z\" fill=\"currentColor\" fill-opacity=\"0.67\"></path>\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M7.99995 7L7.99995 1H8.99995L8.99995 14H7.99995L7.99995 8L3.70706 8L5.85351 10.1464L5.1464 10.8536L1.79285 7.5L5.1464 4.14645L5.85351 4.85355L3.70706 7L7.99995 7Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n </div>\n\n <div class=\"ax-flex ax-justify-center ax-h-6 ax-flex-col\">\n <input\n type=\"range\"\n name=\"range\"\n [min]=\"0\"\n [max]=\"200\"\n [value]=\"this.calculatedValues()[this.current().type][this.current().side]\"\n (input)=\"setSpacing($event, type, side)\"\n />\n </div>\n <div>\n <!--INPUT NUMBER-->\n <div style=\"--local-gap: 8px\">\n <div\n style=\"\n gap: 8px;\n height: auto;\n display: flex;\n flex-flow: column;\n -webkit-box-align: stretch;\n align-items: stretch;\n -webkit-box-pack: start;\n position: relative;\n justify-content: stretch;\n width: 100%;\n -webkit-box-flex: 1;\n flex-grow: 1;\n \"\n >\n <ax-number-box\n class=\"ax-sm\"\n [minValue]=\"0\"\n [changeOnScroll]=\"true\"\n [ngModel]=\"value\"\n (onValueChanged)=\"setSpacing($event.value ?? 0, type, side)\"\n [showSpinButtons]=\"false\"\n >\n <ax-suffix>\n <ax-dropdown-button [text]=\"getSpacingUnitLabel(type, side)\" [look]=\"'blank'\" [mode]=\"'dropdown'\">\n <ax-button-item-list>\n @for (u of spacingUnits; track $index) {\n <ax-button-item\n [text]=\"u.toUpperCase()\"\n [selected]=\"getSpacingUnit(type, side) === u\"\n (onClick)=\"onSpacingUnitChange(u, type, side)\"\n ></ax-button-item>\n }\n </ax-button-item-list>\n </ax-dropdown-button>\n </ax-suffix>\n </ax-number-box>\n </div>\n </div>\n </div>\n <div class=\"axp-spacing-template-values\">\n @for (i of FixedValues; track $index) {\n <div\n (click)=\"setSpacing(i.value, type, side)\"\n class=\"hover:!ax-bg-gradient-to-b hover:!ax-from-white/20 hover:!ax-to-white/5 !ax-cursor-pointer\"\n [class]=\"i.colspan ? 'ax-col-span-' + i.colspan : ''\"\n [class]=\"i.rowspan ? 'ax-row-span-' + i.rowspan : ''\"\n tabindex=\"0\"\n style=\"\n border-bottom-color: var(--color-border-1);\n border-left-color: var(--color-border-1);\n border-right-color: var(--color-border-1);\n border-top-color: var(--color-border-1);\n outline: 0px;\n cursor: default;\n user-select: none;\n padding: 0px;\n box-sizing: border-box;\n font-family: inherit;\n font-size: inherit;\n --component-icon-color: var(--color-text-secondary);\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n border-radius: 4px;\n color: var(--color-action-secondary-text);\n background: var(--color-action-secondary-background);\n border-width: 0px;\n border-style: solid;\n box-shadow: var(--box-shadows-action-secondary);\n align-self: center;\n \"\n >\n <div class=\"ax-truncate\">\n {{ i.label }}\n <span class=\"ax-text-xs ax-text-neutral-400\">\n {{ units()[this.current().type][this.current().side] }}</span\n >\n </div>\n </div>\n }\n </div>\n </div>\n\n <div class=\"ax-h-[1px] ax-mt-1 ax-mb-1 ax-bg-border-1 ax-pointer-events-none\"></div>\n\n <div\n [class.ax-opacity-50]=\"\n originalValues()[this.current().type][this.current().side] ===\n calculatedValues()[this.current().type][this.current().side]\n \"\n (click)=\"setSpacing(originalValues()[this.current().type][this.current().side], type, side)\"\n tabindex=\"0\"\n class=\"ax-outline-none ax-select-none ax-py-1 ax-px-2 ax-my-1 ax-min-h-6 ax-cursor-pointer hover:!ax-bg-[#404040]\"\n >\n <div class=\"ax-flex ax-flex-row ax-items-center\">\n <div class=\"ax-min-w-6 ax-self-center ax-grow ax-basis-0\">\n <div class=\"ax-items-center ax-box-border ax-grid ax-grid-cols-[16px_1fr_auto] ax-gap-x-2 ax-gap-y-1\">\n <div class=\"ax-size-4\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M3.70712 5.00004L6.35357 2.35359L5.64646 1.64648L1.79291 5.50004L5.64646 9.35359L6.35357 8.64648L3.70712 6.00004H10C11.6569 6.00004 13 7.34318 13 9.00004C13 10.6569 11.6569 12 10 12H8.00001V13H10C12.2092 13 14 11.2092 14 9.00004C14 6.7909 12.2092 5.00004 10 5.00004H3.70712Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n </div>\n <div>Reset</div>\n </div>\n </div>\n <div class=\"ax-self-center\">\n <div\n class=\"ax-cursor-default ax-select-none ax-text-[11.5px] ax-font-normal ax-leading-4 ax-tracking-tight ax-text-secondary ax-justify-self-end ax-ml-[1px]\"\n >\n <ax-kbd class=\"look-text\">\n <ax-kbd-item [keys]=\"toggleShortcutKeys\"></ax-kbd-item>\n </ax-kbd>\n </div>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n\n<ax-popover #popover [openOn]=\"'click'\" [offsetY]=\"10\" [closeOn]=\"'clickOut'\">\n <ng-container\n [ngTemplateOutlet]=\"template\"\n [ngTemplateOutletContext]=\"{\n type: this.current().type,\n side: this.current().side,\n value: this.calculatedValues()[this.current().type][this.current().side],\n }\"\n ></ng-container>\n</ax-popover>\n", styles: [".axp-spacing-box{--color-text-secondary: rgba(255, 255, 255, .67);--color-ui-scrollbar-thumb: rgba(255, 255, 255, .67);--color-background-1: #292929;--color-text-secondary: white;--color-border-2: rgba(255, 255, 255, .16);--color-changed: rgb(167, 209, 255);--color-background: rgba(0, 106, 204, .18)}.axp-spacing-box .axp-spacing-inner-box{transform:scale(1.2);position:relative;display:grid;width:224px;height:112px;grid-template-columns:36px 1px 36px 1fr 36px 1px 36px;grid-template-rows:24px 2px 24px 1fr 24px 2px 24px;outline-style:none;cursor:default;-webkit-user-select:none;user-select:none}.axp-spacing-box .axp-spacing-inner-box .axp-spacing-value-container{pointer-events:none;border:none;outline:0px;cursor:default;-webkit-user-select:none;user-select:none;display:flex;align-items:center;justify-content:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;place-self:center;padding:2px;height:auto;width:auto;font-family:inherit;font-size:inherit;position:relative;border-radius:4px;color:var(--color-text-secondary);background:transparent;box-sizing:border-box;box-shadow:none}.axp-spacing-box .axp-spacing-inner-box .axp-spacing-value-container .axp-spacing-value-field{cursor:default;-webkit-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;font-weight:400;line-height:10px;letter-spacing:-.115px;display:flex;color:var(--color-text-secondary);background:transparent;padding:2px;margin:0;border-radius:2px;max-width:100%;box-sizing:content-box;place-self:center;position:relative;opacity:1;align-items:center;justify-content:center}.axp-spacing-box .axp-spacing-inner-box .axp-spacing-margin-box{border-radius:4px;grid-area:1/1/-1/-1;display:grid;grid-template-columns:36px 1fr 36px;grid-template-rows:24px minmax(8px,1fr) 24px;justify-items:center;width:224px;height:112px}.axp-spacing-box .axp-spacing-inner-box .axp-spacing-padding-box{border-radius:4px;grid-area:3/3/span 3/span 3;display:grid;grid-template-columns:36px 1fr 36px;grid-template-rows:24px minmax(8px,1fr) 24px;justify-items:center;width:150px;height:60px}.axp-spacing-box .axp-spacing-inner-box .axp-spacing-padding-text{grid-area:3/3/span 3/span 3;pointer-events:none;position:relative}.axp-spacing-box .axp-spacing-inner-box .axp-spacing-margin-text{grid-area:1/1/-1/-1;pointer-events:none;position:relative}.axp-spacing-popup-container{--color-action-secondary-text: white;--color-action-secondary-background: linear-gradient( 180deg, rgba(255, 255, 255, .13) 0%, rgba(255, 255, 255, .11) 100% );--box-shadows-action-secondary: 0px .5px 1px rgba(0, 0, 0, .8), inset 0px .5px .5px rgba(255, 255, 255, .12);--color-border-1: rgba(255, 255, 255, .13);max-width:239px;min-width:201px;background:#353535;border-radius:.5rem;color:var(--color-text-secondary, white);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,Helvetica,Arial,\"Apple Color Emoji\",\"Segoe UI Emoji\",Segoe UI Symbol,sans-serif;font-size:11.5px;line-height:16px}.axp-spacing-popup-container .axp-spacing-popover{display:grid;grid-template-columns:16px 1fr 56px;grid-template-rows:24px 1fr;align-items:center;gap:8px;width:241px;padding:8px}.axp-spacing-popup-container .axp-spacing-popover .axp-spacing-template-values{display:grid;grid-area:2/1/3/-1;grid-template-columns:repeat(5,1fr);grid-template-rows:24px 24px;gap:4px}.axp-spacing-popup-container .axp-spacing-popover input[type=range]{-webkit-appearance:none;appearance:none;width:100%;cursor:pointer;outline:none;overflow:hidden;border-radius:12px}.axp-spacing-popup-container .axp-spacing-popover input[type=range]::-webkit-slider-runnable-track{height:10px;background:#ccc;border-radius:12px}.axp-spacing-popup-container .axp-spacing-popover input[type=range]::-moz-range-track{height:10px;background:#ccc;border-radius:12px}.axp-spacing-popup-container .axp-spacing-popover input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;height:10px;width:10px;background-color:#fff;border-radius:50%;border:1px solid #353535;box-shadow:-407px 0 0 400px #29292970}.axp-spacing-popup-container .axp-spacing-popover input[type=range]::-moz-range-thumb{height:10px;width:10px;background-color:#fff;border-radius:50%;border:1px solid #353535;box-shadow:-407px 0 0 400px #29292970}.area{grid-area:1/1/-1/-1;overflow:hidden;border-radius:2px;filter:drop-shadow(rgba(255,255,255,.2) 0px -.5px 0px) drop-shadow(rgba(0,0,0,.4) 0px 0px 1px) drop-shadow(rgba(0,0,0,.2) 0px 1px 0px)}\n"], dependencies: [{ kind: "ngmodule", type: AXNumberBoxModule }, { kind: "component", type: i1$7.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "minValue", "maxValue", "showSpinButtons", "thousandsSeparator", "decimals", "changeOnScroll", "step"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "thousandsSeparatorChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXCheckBoxModule }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i3$1.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: CommonModule }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXRangeSliderModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1$1.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "component", type: i6$1.AXDropdownButtonComponent, selector: "ax-dropdown-button", inputs: ["disabled", "size", "color", "look", "text", "type", "mode"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "lookChange", "colorChange", "disabledChange"] }, { 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: 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" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
20896
21706
|
}
|
|
20897
21707
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSpacingWidgetEditComponent, decorators: [{
|
|
20898
21708
|
type: Component,
|
|
@@ -21257,7 +22067,7 @@ class AXPCallbackValidationWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
21257
22067
|
ax
|
|
21258
22068
|
</div>
|
|
21259
22069
|
</div>
|
|
21260
|
-
</axp-base-validation-component>`, isInline: true, dependencies: [{ kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "component", type: AXPBaseValidationComponent, selector: "axp-base-validation-component", inputs: ["validationStatus", "validationText", "validationTextPlaceholder"], outputs: ["validationStatusChange", "validationTextChange"] }, { kind: "ngmodule", type: AXTextAreaModule }, { kind: "component", type: i4.AXTextAreaComponent, selector: "ax-text-area", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "placeholder", "maxLength", "look", "rows", "allowResize", "showCounter", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXTextBoxModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
22070
|
+
</axp-base-validation-component>`, isInline: true, dependencies: [{ kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "component", type: AXPBaseValidationComponent, selector: "axp-base-validation-component", inputs: ["validationStatus", "validationText", "validationTextPlaceholder"], outputs: ["validationStatusChange", "validationTextChange"] }, { kind: "ngmodule", type: AXTextAreaModule }, { kind: "component", type: i4$1.AXTextAreaComponent, selector: "ax-text-area", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "placeholder", "maxLength", "look", "rows", "allowResize", "showCounter", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXTextBoxModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
21261
22071
|
}
|
|
21262
22072
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPCallbackValidationWidgetEditComponent, decorators: [{
|
|
21263
22073
|
type: Component,
|
|
@@ -22195,7 +23005,7 @@ class AXPImageWidgetColumnComponent extends AXPColumnWidgetComponent {
|
|
|
22195
23005
|
}, ...(ngDevMode ? [{ debugName: "objectFit" }] : /* istanbul ignore next */ []));
|
|
22196
23006
|
this.imageUrl = signal(null, ...(ngDevMode ? [{ debugName: "imageUrl" }] : /* istanbul ignore next */ []));
|
|
22197
23007
|
effect(() => {
|
|
22198
|
-
const value = this.
|
|
23008
|
+
const value = this.rawValue;
|
|
22199
23009
|
const currentUrl = this.imageUrl();
|
|
22200
23010
|
if (currentUrl && currentUrl.startsWith('blob:')) {
|
|
22201
23011
|
URL.revokeObjectURL(currentUrl);
|
|
@@ -22256,7 +23066,7 @@ class AXPImageWidgetColumnComponent extends AXPColumnWidgetComponent {
|
|
|
22256
23066
|
}
|
|
22257
23067
|
}
|
|
22258
23068
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPImageWidgetColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
22259
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPImageWidgetColumnComponent, isStandalone: true, selector: "axp-image-widget-column", usesInheritance: true, ngImport: i0, template: `
|
|
23069
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPImageWidgetColumnComponent, isStandalone: true, selector: "axp-image-widget-column", inputs: { rawValue: "rawValue", rowData: "rowData" }, usesInheritance: true, ngImport: i0, template: `
|
|
22260
23070
|
<div class="ax-flex ax-items-center ax-gap-2">
|
|
22261
23071
|
@if (imageUrl()) {
|
|
22262
23072
|
<span> Image </span>
|
|
@@ -22291,6 +23101,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
22291
23101
|
</div>
|
|
22292
23102
|
`,
|
|
22293
23103
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
23104
|
+
inputs: ['rawValue', 'rowData']
|
|
22294
23105
|
}]
|
|
22295
23106
|
}], ctorParameters: () => [] });
|
|
22296
23107
|
|
|
@@ -23055,7 +23866,7 @@ class AXPListToolbarWidgetViewComponent extends AXPValueWidgetComponent {
|
|
|
23055
23866
|
}
|
|
23056
23867
|
}
|
|
23057
23868
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPListToolbarWidgetViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
23058
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPListToolbarWidgetViewComponent, isStandalone: true, selector: "axp-list-toolbar-widget-view", usesInheritance: true, ngImport: i0, template: "<div class=\"ax-flex ax-items-center ax-gap-2 ax-border-b ax-border-light w-full\">\n @if (canFilter()) {\n <axp-query-filters\n [filtersDefinitions]=\"filterDefinitions()\"\n [initialFilters]=\"initialFilters()\"\n (onFiltersChanged)=\"onFiltersChanged($event)\"\n ></axp-query-filters>\n }\n <div class=\"ax-flex ax-items-center ax-gap-1 md:ax-gap-2\">\n @if (filterTriggerMode() === 'manual' && isFiltersDirty()) {\n <ax-button\n [title]=\"'@general:actions.apply.title'\"\n [iconOnly]=\"true\"\n #filterButton\n [color]=\"'primary'\"\n (onClick)=\"applyFilters()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-search\"></i>\n </ax-prefix>\n </ax-button>\n }\n @if (canColumns()) {\n <ax-button [iconOnly]=\"true\" #columnButton [color]=\"'default'\">\n <i class=\"fa-light fa-table-columns\"></i>\n </ax-button>\n <ax-popover\n [adaptivityEnabled]=\"true\"\n [offsetY]=\"30\"\n [target]=\"columnButton\"\n [openOn]=\"'toggle'\"\n [closeOn]=\"'clickOut'\"\n #popover\n >\n <div class=\"ax-lightest-surface ax-shadow-md ax-border md:ax-w-72 ax-w-full ax-rounded-md\">\n <ax-header class=\"ax-border-b ax-lighter-surface ax-rounded-t-md ax-p-4 ax-font-bold\">\n {{ '@general:terms.common.columns' | translate | async }}\n </ax-header>\n <div class=\"ax-py-2 ax-px-4\">\n <axp-query-columns\n [columns]=\"columnDefinitions()\"\n (columnsChange)=\"onColumnsChanged($event)\"\n ></axp-query-columns>\n </div>\n </div>\n </ax-popover>\n }\n @if (canSort()) {\n <ax-button [iconOnly]=\"true\" [text]=\"'Sorts'\" #sortButton [color]=\"'default'\">\n <i class=\"fa-light fa-sort-amount-up\"></i>\n </ax-button>\n <ax-popover\n [adaptivityEnabled]=\"true\"\n [offsetY]=\"10\"\n [target]=\"sortButton\"\n [openOn]=\"'toggle'\"\n [closeOn]=\"'clickOut'\"\n #popover\n >\n <div class=\"ax-lightest-surface ax-shadow-md ax-border md:ax-w-72 ax-w-full ax-rounded-md\">\n <ax-header class=\"ax-border-b ax-lighter-surface ax-rounded-t-md ax-p-4 ax-font-bold\">\n {{ '@general:terms.common.sorts' | translate | async }}\n </ax-header>\n <div class=\"ax-py-2 ax-px-4\">\n <axp-query-sorts\n [sortDefinitions]=\"sortDefinitions()\"\n (sortQueriesChange)=\"onSortsChanged($event)\"\n [initialSortQueries]=\"initialSorts()\"\n ></axp-query-sorts>\n </div>\n </div>\n </ax-popover>\n }\n </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.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.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: "component", type: AXPQueryFiltersComponent, selector: "axp-query-filters", inputs: ["filtersDefinitions", "initialFilters"], outputs: ["onFiltersChanged"] }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i3$
|
|
23869
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPListToolbarWidgetViewComponent, isStandalone: true, selector: "axp-list-toolbar-widget-view", usesInheritance: true, ngImport: i0, template: "<div class=\"ax-flex ax-items-center ax-gap-2 ax-border-b ax-border-light w-full\">\n @if (canFilter()) {\n <axp-query-filters\n [filtersDefinitions]=\"filterDefinitions()\"\n [initialFilters]=\"initialFilters()\"\n (onFiltersChanged)=\"onFiltersChanged($event)\"\n ></axp-query-filters>\n }\n <div class=\"ax-flex ax-items-center ax-gap-1 md:ax-gap-2\">\n @if (filterTriggerMode() === 'manual' && isFiltersDirty()) {\n <ax-button\n [title]=\"'@general:actions.apply.title'\"\n [iconOnly]=\"true\"\n #filterButton\n [color]=\"'primary'\"\n (onClick)=\"applyFilters()\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-search\"></i>\n </ax-prefix>\n </ax-button>\n }\n @if (canColumns()) {\n <ax-button [iconOnly]=\"true\" #columnButton [color]=\"'default'\">\n <i class=\"fa-light fa-table-columns\"></i>\n </ax-button>\n <ax-popover\n [adaptivityEnabled]=\"true\"\n [offsetY]=\"30\"\n [target]=\"columnButton\"\n [openOn]=\"'toggle'\"\n [closeOn]=\"'clickOut'\"\n #popover\n >\n <div class=\"ax-lightest-surface ax-shadow-md ax-border md:ax-w-72 ax-w-full ax-rounded-md\">\n <ax-header class=\"ax-border-b ax-lighter-surface ax-rounded-t-md ax-p-4 ax-font-bold\">\n {{ '@general:terms.common.columns' | translate | async }}\n </ax-header>\n <div class=\"ax-py-2 ax-px-4\">\n <axp-query-columns\n [columns]=\"columnDefinitions()\"\n (columnsChange)=\"onColumnsChanged($event)\"\n ></axp-query-columns>\n </div>\n </div>\n </ax-popover>\n }\n @if (canSort()) {\n <ax-button [iconOnly]=\"true\" [text]=\"'Sorts'\" #sortButton [color]=\"'default'\">\n <i class=\"fa-light fa-sort-amount-up\"></i>\n </ax-button>\n <ax-popover\n [adaptivityEnabled]=\"true\"\n [offsetY]=\"10\"\n [target]=\"sortButton\"\n [openOn]=\"'toggle'\"\n [closeOn]=\"'clickOut'\"\n #popover\n >\n <div class=\"ax-lightest-surface ax-shadow-md ax-border md:ax-w-72 ax-w-full ax-rounded-md\">\n <ax-header class=\"ax-border-b ax-lighter-surface ax-rounded-t-md ax-p-4 ax-font-bold\">\n {{ '@general:terms.common.sorts' | translate | async }}\n </ax-header>\n <div class=\"ax-py-2 ax-px-4\">\n <axp-query-sorts\n [sortDefinitions]=\"sortDefinitions()\"\n (sortQueriesChange)=\"onSortsChanged($event)\"\n [initialSortQueries]=\"initialSorts()\"\n ></axp-query-sorts>\n </div>\n </div>\n </ax-popover>\n }\n </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.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.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: "component", type: AXPQueryFiltersComponent, selector: "axp-query-filters", inputs: ["filtersDefinitions", "initialFilters"], outputs: ["onFiltersChanged"] }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i3$1.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: AXPQuerySortsComponent, selector: "axp-query-sorts", inputs: ["sortDefinitions", "initialSortQueries"], outputs: ["sortDefinitionsChange", "sortQueriesChange"] }, { kind: "component", type: AXPQueryColumnsComponent, selector: "axp-query-columns", inputs: ["columns"], outputs: ["columnsChange"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
23059
23870
|
}
|
|
23060
23871
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPListToolbarWidgetViewComponent, decorators: [{
|
|
23061
23872
|
type: Component,
|
|
@@ -23265,7 +24076,7 @@ class AXPMetaDataWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
23265
24076
|
}
|
|
23266
24077
|
</div>
|
|
23267
24078
|
</axp-widgets-container>
|
|
23268
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AXDecoratorModule }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "component", type: i1.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i1.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], outputs: ["onOptionsChanged", "onValueChanged", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type:
|
|
24079
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AXDecoratorModule }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "component", type: i1.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i1.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], outputs: ["onOptionsChanged", "onValueChanged", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type: i4.AXFormFieldComponent, selector: "ax-form-field", inputs: ["labelMode"] }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i2.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
23269
24080
|
}
|
|
23270
24081
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPMetaDataWidgetEditComponent, decorators: [{
|
|
23271
24082
|
type: Component,
|
|
@@ -23526,7 +24337,7 @@ class AXPNumberUnitBoxWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
23526
24337
|
</ax-number-box>
|
|
23527
24338
|
</div>
|
|
23528
24339
|
</div>
|
|
23529
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AXNumberBoxModule }, { kind: "component", type: i1$7.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "minValue", "maxValue", "showSpinButtons", "thousandsSeparator", "decimals", "changeOnScroll", "step"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "thousandsSeparatorChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXDecoratorModule }, { 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: AXFormModule }, { kind: "directive", type:
|
|
24340
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AXNumberBoxModule }, { kind: "component", type: i1$7.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "minValue", "maxValue", "showSpinButtons", "thousandsSeparator", "decimals", "changeOnScroll", "step"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "thousandsSeparatorChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXDecoratorModule }, { 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: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1$1.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "component", type: i6$1.AXDropdownButtonComponent, selector: "ax-dropdown-button", inputs: ["disabled", "size", "color", "look", "text", "type", "mode"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
23530
24341
|
}
|
|
23531
24342
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPNumberUnitBoxWidgetEditComponent, decorators: [{
|
|
23532
24343
|
type: Component,
|
|
@@ -23776,7 +24587,7 @@ class AXPTabularDataWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
23776
24587
|
this.platform = inject(AXPlatform);
|
|
23777
24588
|
}
|
|
23778
24589
|
async openPopup() {
|
|
23779
|
-
const { AXPTabularDataPopupComponent } = await import('./acorex-platform-layout-widgets-tabular-data-edit-popup.component-
|
|
24590
|
+
const { AXPTabularDataPopupComponent } = await import('./acorex-platform-layout-widgets-tabular-data-edit-popup.component-D4MOHEpI.mjs');
|
|
23780
24591
|
const popupData = await this.popupService.open(AXPTabularDataPopupComponent, {
|
|
23781
24592
|
size: this.platform.is('Mobile') || this.platform.is('SM') ? 'full' : this.columns().length > 3 ? 'lg' : 'md',
|
|
23782
24593
|
header: true,
|
|
@@ -23929,7 +24740,7 @@ class AXPTimerDurationWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
23929
24740
|
[options]="validation.options"
|
|
23930
24741
|
></ax-validation-rule>
|
|
23931
24742
|
}
|
|
23932
|
-
</ax-time-duration>`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type:
|
|
24743
|
+
</ax-time-duration>`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: AXTimeDurationModule }, { kind: "component", type: i3$5.AXTimeDurationComponent, selector: "ax-time-duration", inputs: ["disabled", "tabIndex", "readonly", "look", "name", "valueStart", "valueEnd", "label", "maskDigits", "minValue", "maxValue"], outputs: ["onValueChanged"] }, { kind: "ngmodule", type: AXValidationModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
23933
24744
|
}
|
|
23934
24745
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPTimerDurationWidgetEditComponent, decorators: [{
|
|
23935
24746
|
type: Component,
|
|
@@ -24143,7 +24954,7 @@ class AXPBooleanFilterWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
24143
24954
|
>
|
|
24144
24955
|
</ax-select-box>
|
|
24145
24956
|
</div>
|
|
24146
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i3
|
|
24957
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i3.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: AXTranslationModule }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
24147
24958
|
}
|
|
24148
24959
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPBooleanFilterWidgetEditComponent, decorators: [{
|
|
24149
24960
|
type: Component,
|
|
@@ -24319,7 +25130,7 @@ class AXPNumberFilterWidgetEditComponent extends AXPValueWidgetComponent {
|
|
|
24319
25130
|
(selectedOperationChange)="handleOperationChange($event)"
|
|
24320
25131
|
></axp-filter-operations>
|
|
24321
25132
|
</div>
|
|
24322
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type:
|
|
25133
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "ngmodule", type: AXNumberBoxModule }, { kind: "component", type: i1$7.AXNumberBoxComponent, selector: "ax-number-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "minValue", "maxValue", "showSpinButtons", "thousandsSeparator", "decimals", "changeOnScroll", "step"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "thousandsSeparatorChange"] }, { kind: "ngmodule", type: AXValidationModule }, { kind: "component", type: AXPFilterOperationsComponent, selector: "axp-filter-operations", inputs: ["selectedOperation", "type", "operations"], outputs: ["selectedOperationChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
24323
25134
|
}
|
|
24324
25135
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPNumberFilterWidgetEditComponent, decorators: [{
|
|
24325
25136
|
type: Component,
|
|
@@ -24501,7 +25312,7 @@ class AXPStatusFilterWidgetEditComponent extends AXPDataListWidgetComponent {
|
|
|
24501
25312
|
<ax-clear-button></ax-clear-button>
|
|
24502
25313
|
</ax-select-box>
|
|
24503
25314
|
</div>
|
|
24504
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i3
|
|
25315
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i3.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.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i5$1.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: AXTranslationModule }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
24505
25316
|
}
|
|
24506
25317
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPStatusFilterWidgetEditComponent, decorators: [{
|
|
24507
25318
|
type: Component,
|
|
@@ -24622,7 +25433,7 @@ class AXPStringWidgetFilterComponent extends AXPValueWidgetComponent {
|
|
|
24622
25433
|
(selectedOperationChange)="handleOperationChanged($event)"
|
|
24623
25434
|
></axp-filter-operations>
|
|
24624
25435
|
</div>
|
|
24625
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXTextBoxModule }, { kind: "component", type: i1$6.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "maskPattern", "customTokens", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onMaskChanged"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type:
|
|
25436
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXTextBoxModule }, { kind: "component", type: i1$6.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "maskPattern", "customTokens", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onMaskChanged"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i4.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: AXPFilterOperationsComponent, selector: "axp-filter-operations", inputs: ["selectedOperation", "type", "operations"], outputs: ["selectedOperationChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
24626
25437
|
}
|
|
24627
25438
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPStringWidgetFilterComponent, decorators: [{
|
|
24628
25439
|
type: Component,
|
|
@@ -25338,7 +26149,7 @@ class AXPFormFieldWidgetViewComponent extends AXPGridItemBaseLayoutWidgetCompone
|
|
|
25338
26149
|
</p>
|
|
25339
26150
|
}
|
|
25340
26151
|
</ax-form-field>
|
|
25341
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type:
|
|
26152
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type: i4.AXFormFieldComponent, selector: "ax-form-field", inputs: ["labelMode"] }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i2.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "directive", type: i1.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], outputs: ["onOptionsChanged", "onValueChanged", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "ngmodule", type: AXTooltipModule }, { kind: "directive", type: i4$2.AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
25342
26153
|
}
|
|
25343
26154
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFormFieldWidgetViewComponent, decorators: [{
|
|
25344
26155
|
type: Component,
|
|
@@ -25463,7 +26274,7 @@ class AXPFormFieldWidgetDesignerComponent extends AXPGridItemBaseLayoutWidgetCom
|
|
|
25463
26274
|
</p>
|
|
25464
26275
|
}
|
|
25465
26276
|
</ax-form-field>
|
|
25466
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type:
|
|
26277
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type: i4.AXFormFieldComponent, selector: "ax-form-field", inputs: ["labelMode"] }, { kind: "ngmodule", type: AXLabelModule }, { kind: "component", type: i2.AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "directive", type: AXPWidgetDesignerRendererDirective, selector: "[axp-widget-designer-renderer]", inputs: ["parentNode", "parentElement", "parentComponent", "index", "locked", "mode", "node"] }, { kind: "component", type: AXPDesignerAddWidgetMiniButtonComponent, selector: "axp-designer-add-widget-mini-button", outputs: ["onClick"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
25467
26278
|
}
|
|
25468
26279
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFormFieldWidgetDesignerComponent, decorators: [{
|
|
25469
26280
|
type: Component,
|
|
@@ -26373,7 +27184,7 @@ class AXPIconWidgetViewComponent extends AXPColumnWidgetComponent {
|
|
|
26373
27184
|
} @else {
|
|
26374
27185
|
<ax-icon [icon]="getIcon()"></ax-icon>
|
|
26375
27186
|
}
|
|
26376
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXTooltipModule }, { kind: "directive", type: i4$
|
|
27187
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXTooltipModule }, { kind: "directive", type: i4$2.AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
26377
27188
|
}
|
|
26378
27189
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPIconWidgetViewComponent, decorators: [{
|
|
26379
27190
|
type: Component,
|
|
@@ -27541,6 +28352,7 @@ const REGISTERED_WIDGETS = [
|
|
|
27541
28352
|
AXPJsonViewerWidget,
|
|
27542
28353
|
AXPOutcomeResultsViewerWidget,
|
|
27543
28354
|
AXPStopwatchWidget,
|
|
28355
|
+
AXPIntegrationConnectionsPanelWidget,
|
|
27544
28356
|
AXPToggleWidget,
|
|
27545
28357
|
AXPRatePickerWidget,
|
|
27546
28358
|
AXPColorBoxWidget,
|
|
@@ -28133,5 +28945,5 @@ var getWidgetsForAi_query = /*#__PURE__*/Object.freeze({
|
|
|
28133
28945
|
* Generated bundle index. Do not edit.
|
|
28134
28946
|
*/
|
|
28135
28947
|
|
|
28136
|
-
export { AXPAddressWidget, AXPAddressWidgetColumnComponent, AXPAddressWidgetEditComponent, AXPAddressWidgetService, AXPAddressWidgetViewComponent, AXPAdvancedGridItemWidget, AXPAdvancedGridItemWidgetDesignerComponent, AXPAdvancedGridItemWidgetViewComponent, AXPAdvancedGridOptionsWidget, AXPAdvancedGridOptionsWidgetEditComponent, AXPAdvancedGridWidget, AXPAdvancedGridWidgetDesignerComponent, AXPAdvancedGridWidgetViewComponent, AXPAvatarWidget, AXPAvatarWidgetColumnComponent, AXPAvatarWidgetDesignerComponent, AXPAvatarWidgetEditComponent, AXPAvatarWidgetViewComponent, AXPBetweenExpressionValidationWidget, AXPBetweenValidationWidgetEditComponent, AXPBlockWidget, AXPBlockWidgetDesignerComponent, AXPBlockWidgetViewComponent, AXPBorderWidget, AXPBorderWidgetEditComponent, AXPButtonWidget, AXPButtonWidgetColumnComponent, AXPButtonWidgetViewComponent, AXPCallbackValidationWidget, AXPCallbackValidationWidgetEditComponent, AXPCheckBoxWidget, AXPCheckBoxWidgetColumnComponent, AXPCheckBoxWidgetDesignerComponent, AXPCheckBoxWidgetEditComponent, AXPCheckBoxWidgetViewComponent, AXPCodeEditorWidget, AXPCodeEditorWidgetColumnComponent, AXPCodeEditorWidgetEditComponent, AXPCodeEditorWidgetViewComponent, AXPColorBoxWidget, AXPColorBoxWidgetColumnComponent, AXPColorBoxWidgetDesignerComponent, AXPColorBoxWidgetEditComponent, AXPColorBoxWidgetViewComponent, AXPColorPaletteWidget, AXPColorPaletteWidgetColumnComponent, AXPColorPaletteWidgetDesignerComponent, AXPColorPaletteWidgetEditComponent, AXPColorPaletteWidgetViewComponent, AXPConditionBuilderWidget, AXPConditionBuilderWidgetEditComponent, AXPConditionBuilderWidgetViewComponent, AXPConnectedDragDropListsWidget, AXPConnectedListsWidgetColumnComponent, AXPConnectedListsWidgetEditComponent, AXPConnectedListsWidgetViewComponent, AXPContactWidget, AXPContactWidgetColumnComponent, AXPContactWidgetEditComponent, AXPContactWidgetViewComponent, AXPDataListWidget, AXPDataListWidgetViewComponent, AXPDataSourceOptionsWidget, AXPDataSourceOptionsWidgetEditComponent, AXPDateTimeBoxWidget, AXPDateTimeBoxWidgetColumnComponent, AXPDateTimeBoxWidgetEditComponent, AXPDateTimeBoxWidgetViewComponent, AXPDirectionWidget, AXPDirectionWidgetEditComponent, AXPDragDropListWidget, AXPEditorJsWidget, AXPEditorJsWidgetColumnComponent, AXPEditorJsWidgetEditComponent, AXPEditorJsWidgetViewComponent, AXPEqualValidationWidget, AXPEqualValidationWidgetEditComponent, AXPFieldsetWidget, AXPFieldsetWidgetDesignerComponent, AXPFieldsetWidgetViewComponent, AXPFlexItemOptionsWidget, AXPFlexItemOptionsWidgetEditComponent, AXPFlexItemWidget, AXPFlexItemWidgetDesignerComponent, AXPFlexItemWidgetViewComponent, AXPFlexOptionsWidget, AXPFlexOptionsWidgetEditComponent, AXPFlexWidget, AXPFlexWidgetDesignerComponent, AXPFlexWidgetViewComponent, AXPGalleryWidget, AXPGalleryWidgetEditComponent, AXPGalleryWidgetViewComponent, AXPGetWidgetsForAIQuery, AXPGreaterThanExpressionValidationWidget, AXPGreaterThanValidationWidgetEditComponent, AXPGridItemOptionsWidget, AXPGridItemOptionsWidgetEditComponent, AXPGridOptionsWidget, AXPGridOptionsWidgetEditComponent, AXPImageMarkerPopupComponent, AXPImageMarkerWidget, AXPImageMarkerWidgetColumnComponent, AXPImageMarkerWidgetEditComponent, AXPImageMarkerWidgetViewComponent, AXPItemConfiguratorWidget, AXPItemConfiguratorWidgetColumnComponent, AXPItemConfiguratorWidgetEditComponent, AXPJsonViewerWidget, AXPJsonViewerWidgetEditComponent, AXPJsonViewerWidgetViewComponent, AXPLargeTextWidget, AXPLargeTextWidgetColumnComponent, AXPLargeTextWidgetEditComponent, AXPLargeTextWidgetViewComponent, AXPLessThanExpressionValidationWidget, AXPLessThanValidationWidgetEditComponent, AXPListWidgetColumnComponent, AXPListWidgetEditComponent, AXPListWidgetViewComponent, AXPMapWidgetEditComponent, AXPMapWidgetViewComponent, AXPMaxLengthExpressionValidationWidget, AXPMaxLengthValidationWidgetEditComponent, AXPMinLengthExpressionValidationWidget, AXPMinLengthValidationWidgetEditComponent, AXPNumberBoxWidget, AXPNumberBoxWidgetColumnComponent, AXPNumberBoxWidgetEditComponent, AXPNumberBoxWidgetViewComponent, AXPOutcomeResultsViewerWidget, AXPOutcomeResultsViewerWidgetViewComponent, AXPPageWidget, AXPPageWidgetViewComponent, AXPPasswordBoxWidget, AXPPasswordBoxWidgetColumnComponent, AXPPasswordBoxWidgetEditComponent, AXPPasswordBoxWidgetViewComponent, AXPProgressBarWidget, AXPProgressBarWidgetColumnComponent, AXPProgressBarWidgetEditComponent, AXPProgressBarWidgetViewComponent, AXPProviderSelectWidgetColumnComponent, AXPProviderSelectWidgetEditBase, AXPProviderSelectWidgetViewComponent, AXPQrcodeViewerService, AXPQrcodeWidget, AXPQrcodeWidgetColumnComponent, AXPQrcodeWidgetEditComponent, AXPQrcodeWidgetViewComponent, AXPRatePickerWidget, AXPRatePickerWidgetColumnComponent, AXPRatePickerWidgetEditComponent, AXPRatePickerWidgetViewComponent, AXPRegularExpressionValidationWidget, AXPRegularExpressionValidationWidgetEditComponent, AXPRepeaterWidget, AXPRepeaterWidgetDesignerComponent, AXPRepeaterWidgetEditComponent, AXPRepeaterWidgetViewComponent, AXPRequiredValidationWidget, AXPRequiredValidationWidgetEditComponent, AXPRichTextWidget, AXPRichTextWidgetColumnComponent, AXPRichTextWidgetEditComponent, AXPRichTextWidgetViewComponent, AXPSchedulerPickerWidget, AXPSchedulerPickerWidgetColumnComponent, AXPSchedulerPickerWidgetEditComponent, AXPSchedulerPickerWidgetViewComponent, AXPSelectBoxWidget, AXPSelectBoxWidgetColumnComponent, AXPSelectBoxWidgetEditComponent, AXPSelectBoxWidgetViewComponent, AXPSelectLanguagePopup, AXPSelectionListWidget, AXPSelectionListWidgetColumnComponent, AXPSelectionListWidgetDesignerComponent, AXPSelectionListWidgetEditComponent, AXPSelectionListWidgetViewComponent, AXPSignatureWidget, AXPSignatureWidgetColumnComponent, AXPSignatureWidgetEditComponent, AXPSignatureWidgetViewComponent, AXPSpacingWidget, AXPSpacingWidgetEditComponent, AXPStatusChipComponent, AXPStatusWidget, AXPStatusWidgetColumnComponent, AXPStatusWidgetEditComponent, AXPStatusWidgetViewComponent, AXPStepWizardWidget, AXPStepWizardWidgetViewComponent, AXPStopwatchWidget, AXPStopwatchWidgetViewComponent, AXPTableItemWidget, AXPTableItemWidgetDesignerComponent, AXPTableItemWidgetViewComponent, AXPTableWidget, AXPTableWidgetDesignerComponent, AXPTableWidgetViewComponent, AXPTagEditorWidget, AXPTagEditorWidgetColumnComponent, AXPTagEditorWidgetEditComponent, AXPTagEditorWidgetViewComponent, AXPTemplateBoxWidget, AXPTemplateBoxWidgetColumnComponent, AXPTemplateBoxWidgetEditComponent, AXPTemplateBoxWidgetPrintComponent, AXPTemplateBoxWidgetViewComponent, AXPTextBoxWidget, AXPTextBoxWidgetColumnComponent, AXPTextBoxWidgetEditComponent, AXPTextBoxWidgetViewComponent, AXPToggleWidget, AXPToggleWidgetColumnComponent, AXPToggleWidgetEditComponent, AXPToggleWidgetViewComponent, AXPWidgetFieldConfiguratorWidget, AXPWidgetFieldConfiguratorWidgetColumnComponent, AXPWidgetFieldConfiguratorWidgetEditComponent, AXPWidgetsModule, AXP_ABSOLUTE_UNITS, AXP_BORDER_RADIUS_UNITS, AXP_BORDER_WIDTH_UNITS, AXP_DATA_LIST_CMD_DELETE, AXP_DATA_LIST_CMD_EDIT, AXP_DATA_LIST_PENDING_DELETE_KEY, AXP_Flex_Box_Align_Options, AXP_Flex_Box_Alignments, AXP_Flex_Box_Justify_Options, AXP_Grid_Box_Align_Items_Options, AXP_Grid_Box_Alignments, AXP_Grid_Box_Justify_Items_Options, AXP_RELATIVE_UNITS, AXP_RELATIVE_UNITS_NO_PERCENT, AXP_ROW_EXPR_PREFIX, AXP_SPACING_UNITS, AXP_WIDGET_AI_AGENT_ASSIST_FOLLOW_UP_CHIPS_LAYOUT, AXP_WIDGET_AI_AGENT_CHART_LAYOUT, AXP_WIDGET_AI_AGENT_FORM_LAYOUT, AXP_WIDGET_AI_AGENT_NAMES, AXP_default_Border_Box_Units, AXP_default_Border_Box_Value, AXP_default_Spacing_Box_Units, AXP_default_Spacing_Box_Value, DEFAULT_QRCODE_SIZE, DEFAULT_STRATEGY_CONFIG, STRATEGY_CONFIG_TOKEN, matchesWidgetAiAgent };
|
|
28948
|
+
export { AXPAddressWidget, AXPAddressWidgetColumnComponent, AXPAddressWidgetEditComponent, AXPAddressWidgetService, AXPAddressWidgetViewComponent, AXPAdvancedGridItemWidget, AXPAdvancedGridItemWidgetDesignerComponent, AXPAdvancedGridItemWidgetViewComponent, AXPAdvancedGridOptionsWidget, AXPAdvancedGridOptionsWidgetEditComponent, AXPAdvancedGridWidget, AXPAdvancedGridWidgetDesignerComponent, AXPAdvancedGridWidgetViewComponent, AXPAvatarWidget, AXPAvatarWidgetColumnComponent, AXPAvatarWidgetDesignerComponent, AXPAvatarWidgetEditComponent, AXPAvatarWidgetViewComponent, AXPBetweenExpressionValidationWidget, AXPBetweenValidationWidgetEditComponent, AXPBlockWidget, AXPBlockWidgetDesignerComponent, AXPBlockWidgetViewComponent, AXPBorderWidget, AXPBorderWidgetEditComponent, AXPButtonWidget, AXPButtonWidgetColumnComponent, AXPButtonWidgetViewComponent, AXPCallbackValidationWidget, AXPCallbackValidationWidgetEditComponent, AXPCheckBoxWidget, AXPCheckBoxWidgetColumnComponent, AXPCheckBoxWidgetDesignerComponent, AXPCheckBoxWidgetEditComponent, AXPCheckBoxWidgetViewComponent, AXPCodeEditorWidget, AXPCodeEditorWidgetColumnComponent, AXPCodeEditorWidgetEditComponent, AXPCodeEditorWidgetViewComponent, AXPColorBoxWidget, AXPColorBoxWidgetColumnComponent, AXPColorBoxWidgetDesignerComponent, AXPColorBoxWidgetEditComponent, AXPColorBoxWidgetViewComponent, AXPColorPaletteWidget, AXPColorPaletteWidgetColumnComponent, AXPColorPaletteWidgetDesignerComponent, AXPColorPaletteWidgetEditComponent, AXPColorPaletteWidgetViewComponent, AXPConditionBuilderWidget, AXPConditionBuilderWidgetEditComponent, AXPConditionBuilderWidgetViewComponent, AXPConnectedDragDropListsWidget, AXPConnectedListsWidgetColumnComponent, AXPConnectedListsWidgetEditComponent, AXPConnectedListsWidgetViewComponent, AXPContactWidget, AXPContactWidgetColumnComponent, AXPContactWidgetEditComponent, AXPContactWidgetViewComponent, AXPDataListWidget, AXPDataListWidgetViewComponent, AXPDataSourceOptionsWidget, AXPDataSourceOptionsWidgetEditComponent, AXPDateTimeBoxWidget, AXPDateTimeBoxWidgetColumnComponent, AXPDateTimeBoxWidgetEditComponent, AXPDateTimeBoxWidgetViewComponent, AXPDirectionWidget, AXPDirectionWidgetEditComponent, AXPDragDropListWidget, AXPEditorJsWidget, AXPEditorJsWidgetColumnComponent, AXPEditorJsWidgetEditComponent, AXPEditorJsWidgetViewComponent, AXPEqualValidationWidget, AXPEqualValidationWidgetEditComponent, AXPFieldsetWidget, AXPFieldsetWidgetDesignerComponent, AXPFieldsetWidgetViewComponent, AXPFlexItemOptionsWidget, AXPFlexItemOptionsWidgetEditComponent, AXPFlexItemWidget, AXPFlexItemWidgetDesignerComponent, AXPFlexItemWidgetViewComponent, AXPFlexOptionsWidget, AXPFlexOptionsWidgetEditComponent, AXPFlexWidget, AXPFlexWidgetDesignerComponent, AXPFlexWidgetViewComponent, AXPGalleryWidget, AXPGalleryWidgetEditComponent, AXPGalleryWidgetViewComponent, AXPGetWidgetsForAIQuery, AXPGreaterThanExpressionValidationWidget, AXPGreaterThanValidationWidgetEditComponent, AXPGridItemOptionsWidget, AXPGridItemOptionsWidgetEditComponent, AXPGridOptionsWidget, AXPGridOptionsWidgetEditComponent, AXPImageMarkerPopupComponent, AXPImageMarkerWidget, AXPImageMarkerWidgetColumnComponent, AXPImageMarkerWidgetEditComponent, AXPImageMarkerWidgetViewComponent, AXPIntegrationConnectionsPanelWidget, AXPIntegrationConnectionsPanelWidgetEditComponent, AXPItemConfiguratorWidget, AXPItemConfiguratorWidgetColumnComponent, AXPItemConfiguratorWidgetEditComponent, AXPJsonViewerWidget, AXPJsonViewerWidgetEditComponent, AXPJsonViewerWidgetViewComponent, AXPLargeTextWidget, AXPLargeTextWidgetColumnComponent, AXPLargeTextWidgetEditComponent, AXPLargeTextWidgetViewComponent, AXPLessThanExpressionValidationWidget, AXPLessThanValidationWidgetEditComponent, AXPListWidgetColumnComponent, AXPListWidgetEditComponent, AXPListWidgetViewComponent, AXPMapWidgetEditComponent, AXPMapWidgetViewComponent, AXPMaxLengthExpressionValidationWidget, AXPMaxLengthValidationWidgetEditComponent, AXPMinLengthExpressionValidationWidget, AXPMinLengthValidationWidgetEditComponent, AXPNumberBoxWidget, AXPNumberBoxWidgetColumnComponent, AXPNumberBoxWidgetEditComponent, AXPNumberBoxWidgetViewComponent, AXPOutcomeResultsViewerWidget, AXPOutcomeResultsViewerWidgetViewComponent, AXPPageWidget, AXPPageWidgetViewComponent, AXPPasswordBoxWidget, AXPPasswordBoxWidgetColumnComponent, AXPPasswordBoxWidgetEditComponent, AXPPasswordBoxWidgetViewComponent, AXPProgressBarWidget, AXPProgressBarWidgetColumnComponent, AXPProgressBarWidgetEditComponent, AXPProgressBarWidgetViewComponent, AXPProviderSelectWidgetColumnComponent, AXPProviderSelectWidgetEditBase, AXPProviderSelectWidgetViewComponent, AXPQrcodeViewerService, AXPQrcodeWidget, AXPQrcodeWidgetColumnComponent, AXPQrcodeWidgetEditComponent, AXPQrcodeWidgetViewComponent, AXPRatePickerWidget, AXPRatePickerWidgetColumnComponent, AXPRatePickerWidgetEditComponent, AXPRatePickerWidgetViewComponent, AXPRegularExpressionValidationWidget, AXPRegularExpressionValidationWidgetEditComponent, AXPRepeaterWidget, AXPRepeaterWidgetDesignerComponent, AXPRepeaterWidgetEditComponent, AXPRepeaterWidgetViewComponent, AXPRequiredValidationWidget, AXPRequiredValidationWidgetEditComponent, AXPRichTextWidget, AXPRichTextWidgetColumnComponent, AXPRichTextWidgetEditComponent, AXPRichTextWidgetViewComponent, AXPSchedulerPickerWidget, AXPSchedulerPickerWidgetColumnComponent, AXPSchedulerPickerWidgetEditComponent, AXPSchedulerPickerWidgetViewComponent, AXPSelectBoxWidget, AXPSelectBoxWidgetColumnComponent, AXPSelectBoxWidgetEditComponent, AXPSelectBoxWidgetViewComponent, AXPSelectLanguagePopup, AXPSelectionListWidget, AXPSelectionListWidgetColumnComponent, AXPSelectionListWidgetDesignerComponent, AXPSelectionListWidgetEditComponent, AXPSelectionListWidgetViewComponent, AXPSignatureWidget, AXPSignatureWidgetColumnComponent, AXPSignatureWidgetEditComponent, AXPSignatureWidgetViewComponent, AXPSpacingWidget, AXPSpacingWidgetEditComponent, AXPStatusChipComponent, AXPStatusWidget, AXPStatusWidgetColumnComponent, AXPStatusWidgetEditComponent, AXPStatusWidgetViewComponent, AXPStepWizardWidget, AXPStepWizardWidgetViewComponent, AXPStopwatchWidget, AXPStopwatchWidgetViewComponent, AXPTableItemWidget, AXPTableItemWidgetDesignerComponent, AXPTableItemWidgetViewComponent, AXPTableWidget, AXPTableWidgetDesignerComponent, AXPTableWidgetViewComponent, AXPTagEditorWidget, AXPTagEditorWidgetColumnComponent, AXPTagEditorWidgetEditComponent, AXPTagEditorWidgetViewComponent, AXPTemplateBoxWidget, AXPTemplateBoxWidgetColumnComponent, AXPTemplateBoxWidgetEditComponent, AXPTemplateBoxWidgetPrintComponent, AXPTemplateBoxWidgetViewComponent, AXPTextBoxWidget, AXPTextBoxWidgetColumnComponent, AXPTextBoxWidgetEditComponent, AXPTextBoxWidgetViewComponent, AXPToggleWidget, AXPToggleWidgetColumnComponent, AXPToggleWidgetEditComponent, AXPToggleWidgetViewComponent, AXPWidgetFieldConfiguratorWidget, AXPWidgetFieldConfiguratorWidgetColumnComponent, AXPWidgetFieldConfiguratorWidgetEditComponent, AXPWidgetsModule, AXP_ABSOLUTE_UNITS, AXP_BORDER_RADIUS_UNITS, AXP_BORDER_WIDTH_UNITS, AXP_DATA_LIST_CMD_DELETE, AXP_DATA_LIST_CMD_EDIT, AXP_DATA_LIST_PENDING_DELETE_KEY, AXP_Flex_Box_Align_Options, AXP_Flex_Box_Alignments, AXP_Flex_Box_Justify_Options, AXP_Grid_Box_Align_Items_Options, AXP_Grid_Box_Alignments, AXP_Grid_Box_Justify_Items_Options, AXP_RELATIVE_UNITS, AXP_RELATIVE_UNITS_NO_PERCENT, AXP_REPEATER_ENTITY_BY_KEY_LOOKUP, AXP_ROW_EXPR_PREFIX, AXP_SPACING_UNITS, AXP_WIDGET_AI_AGENT_ASSIST_FOLLOW_UP_CHIPS_LAYOUT, AXP_WIDGET_AI_AGENT_CHART_LAYOUT, AXP_WIDGET_AI_AGENT_FORM_LAYOUT, AXP_WIDGET_AI_AGENT_NAMES, AXP_default_Border_Box_Units, AXP_default_Border_Box_Value, AXP_default_Spacing_Box_Units, AXP_default_Spacing_Box_Value, DEFAULT_QRCODE_SIZE, DEFAULT_STRATEGY_CONFIG, STRATEGY_CONFIG_TOKEN, matchesWidgetAiAgent };
|
|
28137
28949
|
//# sourceMappingURL=acorex-platform-layout-widgets.mjs.map
|