@acorex/components 18.12.38 → 18.12.39
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/common/lib/components/button-base-component.class.d.ts +10 -10
- package/common/lib/components/interactive-component.class.d.ts +11 -11
- package/common/lib/types/base/button.type.d.ts +8 -0
- package/common/lib/types/base/color.type.d.ts +7 -0
- package/common/lib/types/base/events.types.d.ts +1 -1
- package/common/lib/types/base/index.d.ts +5 -0
- package/common/lib/types/base/interactive.type.d.ts +13 -0
- package/common/lib/types/base/look.type.d.ts +7 -0
- package/common/lib/types/base/value.type.d.ts +9 -0
- package/esm2022/button-group/lib/button-group.component.mjs +2 -2
- package/esm2022/common/lib/components/base-component.class.mjs +1 -1
- package/esm2022/common/lib/components/button-base-component.class.mjs +11 -11
- package/esm2022/common/lib/components/interactive-component.class.mjs +12 -12
- package/esm2022/common/lib/components/selection-base.component.class.mjs +13 -5
- package/esm2022/common/lib/types/base/button.type.mjs +18 -0
- package/esm2022/common/lib/types/base/color.type.mjs +16 -0
- package/esm2022/common/lib/types/base/events.types.mjs +1 -1
- package/esm2022/common/lib/types/base/index.mjs +6 -1
- package/esm2022/common/lib/types/base/interactive.type.mjs +31 -0
- package/esm2022/common/lib/types/base/look.type.mjs +16 -0
- package/esm2022/common/lib/types/base/value.type.mjs +19 -0
- package/esm2022/otp/lib/otp.component.mjs +2 -2
- package/esm2022/side-menu/lib/side-menu.component.mjs +2 -2
- package/esm2022/tabs/lib/tabs.component.mjs +2 -2
- package/esm2022/wysiwyg/lib/wysiwyg/wysiwyg-view/wysiwyg-view.component.mjs +2 -2
- package/fesm2022/acorex-components-button-group.mjs +2 -2
- package/fesm2022/acorex-components-button-group.mjs.map +1 -1
- package/fesm2022/acorex-components-common.mjs +124 -28
- package/fesm2022/acorex-components-common.mjs.map +1 -1
- package/fesm2022/acorex-components-otp.mjs +2 -2
- package/fesm2022/acorex-components-otp.mjs.map +1 -1
- package/fesm2022/acorex-components-side-menu.mjs +2 -2
- package/fesm2022/acorex-components-side-menu.mjs.map +1 -1
- package/fesm2022/acorex-components-tabs.mjs +2 -2
- package/fesm2022/acorex-components-tabs.mjs.map +1 -1
- package/fesm2022/acorex-components-wysiwyg.mjs +2 -2
- package/fesm2022/acorex-components-wysiwyg.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { inject, ElementRef, signal, afterNextRender, Injectable, Directive, Host, Self, Optional, Input, Inject, NgModule, ChangeDetectorRef, ViewContainerRef, EventEmitter, InjectionToken, Output, input, effect } from '@angular/core';
|
|
2
|
+
import { model, output, Component, inject, ElementRef, signal, afterNextRender, Injectable, Directive, Host, Self, Optional, Input, Inject, NgModule, ChangeDetectorRef, ViewContainerRef, EventEmitter, InjectionToken, Output, input, effect } from '@angular/core';
|
|
3
|
+
import { AXHtmlUtil } from '@acorex/core/utils';
|
|
3
4
|
import { flatten, clone, filter, isEqual } from 'lodash-es';
|
|
4
5
|
import { DataSource } from '@angular/cdk/collections';
|
|
5
6
|
import { Subscription, BehaviorSubject, debounceTime, distinctUntilChanged, Subject, fromEvent, noop, skip } from 'rxjs';
|
|
@@ -8,13 +9,42 @@ import * as i1 from '@angular/platform-browser';
|
|
|
8
9
|
import { Observable } from 'rxjs/internal/Observable';
|
|
9
10
|
import { map, pairwise, filter as filter$1, startWith, exhaustMap } from 'rxjs/operators';
|
|
10
11
|
import { classes } from 'polytype';
|
|
11
|
-
import { AXHtmlUtil } from '@acorex/core/utils';
|
|
12
12
|
import { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';
|
|
13
13
|
import { isBrowser } from '@acorex/core/platform';
|
|
14
14
|
import { AXValidationService } from '@acorex/core/validation';
|
|
15
15
|
import { AXFormatService } from '@acorex/core/format';
|
|
16
16
|
import * as i1$1 from '@angular/forms';
|
|
17
17
|
|
|
18
|
+
class NXButtonComponent {
|
|
19
|
+
constructor() {
|
|
20
|
+
this.text = model();
|
|
21
|
+
this.toggleableChange = output();
|
|
22
|
+
this.selectedChange = output();
|
|
23
|
+
}
|
|
24
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: NXButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
25
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.0", type: NXButtonComponent, selector: "ng-component", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { text: "textChange", toggleableChange: "toggleableChange", selectedChange: "selectedChange" }, ngImport: i0, template: '', isInline: true }); }
|
|
26
|
+
}
|
|
27
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: NXButtonComponent, decorators: [{
|
|
28
|
+
type: Component,
|
|
29
|
+
args: [{
|
|
30
|
+
template: '',
|
|
31
|
+
}]
|
|
32
|
+
}] });
|
|
33
|
+
|
|
34
|
+
class NXColorComponent {
|
|
35
|
+
constructor() {
|
|
36
|
+
this.color = model('ghost');
|
|
37
|
+
}
|
|
38
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: NXColorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
39
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.0", type: NXColorComponent, selector: "ng-component", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { color: "colorChange" }, ngImport: i0, template: '', isInline: true }); }
|
|
40
|
+
}
|
|
41
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: NXColorComponent, decorators: [{
|
|
42
|
+
type: Component,
|
|
43
|
+
args: [{
|
|
44
|
+
template: '',
|
|
45
|
+
}]
|
|
46
|
+
}] });
|
|
47
|
+
|
|
18
48
|
class NXComponent {
|
|
19
49
|
constructor() {
|
|
20
50
|
this.#elementRef = inject(ElementRef);
|
|
@@ -59,6 +89,64 @@ class NXNativeEvent extends NXEvent {
|
|
|
59
89
|
class NXClickEvent extends NXNativeEvent {
|
|
60
90
|
}
|
|
61
91
|
|
|
92
|
+
class NXInteractiveComponent extends NXComponent {
|
|
93
|
+
constructor() {
|
|
94
|
+
super(...arguments);
|
|
95
|
+
this.disabled = model(false);
|
|
96
|
+
this.tabIndex = model(0);
|
|
97
|
+
this.onFocus = output();
|
|
98
|
+
this.onBlur = output();
|
|
99
|
+
}
|
|
100
|
+
focus() {
|
|
101
|
+
AXHtmlUtil.focusElement(this.nativeElement);
|
|
102
|
+
}
|
|
103
|
+
blur() {
|
|
104
|
+
AXHtmlUtil.blurElement(this.nativeElement);
|
|
105
|
+
}
|
|
106
|
+
hasFocus() {
|
|
107
|
+
return AXHtmlUtil.hasFocus(this.nativeElement);
|
|
108
|
+
}
|
|
109
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: NXInteractiveComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
110
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.0", type: NXInteractiveComponent, selector: "ng-component", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled: "disabledChange", tabIndex: "tabIndexChange", onFocus: "onFocus", onBlur: "onBlur" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
|
|
111
|
+
}
|
|
112
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: NXInteractiveComponent, decorators: [{
|
|
113
|
+
type: Component,
|
|
114
|
+
args: [{
|
|
115
|
+
template: '',
|
|
116
|
+
}]
|
|
117
|
+
}] });
|
|
118
|
+
|
|
119
|
+
class NXLookComponent {
|
|
120
|
+
constructor() {
|
|
121
|
+
this.look = model('solid');
|
|
122
|
+
}
|
|
123
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: NXLookComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
124
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.0", type: NXLookComponent, selector: "ng-component", inputs: { look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { look: "lookChange" }, ngImport: i0, template: '', isInline: true }); }
|
|
125
|
+
}
|
|
126
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: NXLookComponent, decorators: [{
|
|
127
|
+
type: Component,
|
|
128
|
+
args: [{
|
|
129
|
+
template: '',
|
|
130
|
+
}]
|
|
131
|
+
}] });
|
|
132
|
+
|
|
133
|
+
class NXValueComponent {
|
|
134
|
+
constructor() {
|
|
135
|
+
this.readonly = model();
|
|
136
|
+
this.name = model();
|
|
137
|
+
this.value = model();
|
|
138
|
+
this.onValueChanged = output();
|
|
139
|
+
}
|
|
140
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: NXValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
141
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.0", type: NXValueComponent, selector: "ng-component", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { readonly: "readonlyChange", name: "nameChange", value: "valueChange", onValueChanged: "onValueChanged" }, ngImport: i0, template: '', isInline: true }); }
|
|
142
|
+
}
|
|
143
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: NXValueComponent, decorators: [{
|
|
144
|
+
type: Component,
|
|
145
|
+
args: [{
|
|
146
|
+
template: '',
|
|
147
|
+
}]
|
|
148
|
+
}] });
|
|
149
|
+
|
|
62
150
|
const defaultOffset = 3;
|
|
63
151
|
function convertToPlacement(value) {
|
|
64
152
|
const result = [];
|
|
@@ -992,15 +1080,15 @@ class MXInteractiveComponent extends MXBaseComponent {
|
|
|
992
1080
|
constructor() {
|
|
993
1081
|
super(...arguments);
|
|
994
1082
|
/**
|
|
995
|
-
|
|
996
|
-
|
|
1083
|
+
* @ignore
|
|
1084
|
+
*/
|
|
997
1085
|
this.onTouchedCallback = noop;
|
|
998
1086
|
this._touched = false;
|
|
999
1087
|
/**
|
|
1000
|
-
|
|
1001
|
-
|
|
1002
|
-
|
|
1003
|
-
|
|
1088
|
+
* Emits an event whenever the disabled state of the component changes.
|
|
1089
|
+
*
|
|
1090
|
+
* @event
|
|
1091
|
+
*/
|
|
1004
1092
|
this.disabledChange = new EventEmitter();
|
|
1005
1093
|
this._tabIndex = 0;
|
|
1006
1094
|
/**
|
|
@@ -1025,15 +1113,15 @@ class MXInteractiveComponent extends MXBaseComponent {
|
|
|
1025
1113
|
this.onTouchedCallback = fn;
|
|
1026
1114
|
}
|
|
1027
1115
|
/**
|
|
1028
|
-
|
|
1029
|
-
|
|
1030
|
-
|
|
1116
|
+
* Indicates whether the component has been touched.
|
|
1117
|
+
*
|
|
1118
|
+
*/
|
|
1031
1119
|
get touched() {
|
|
1032
1120
|
return this._touched;
|
|
1033
1121
|
}
|
|
1034
1122
|
/**
|
|
1035
|
-
|
|
1036
|
-
|
|
1123
|
+
* @ignore
|
|
1124
|
+
*/
|
|
1037
1125
|
markAsTouched() {
|
|
1038
1126
|
if (!this.touched) {
|
|
1039
1127
|
this.onTouchedCallback();
|
|
@@ -1156,8 +1244,8 @@ class MXButtonBaseComponent extends classes(MXInteractiveComponent, MXColorLookC
|
|
|
1156
1244
|
});
|
|
1157
1245
|
}
|
|
1158
1246
|
/**
|
|
1159
|
-
|
|
1160
|
-
|
|
1247
|
+
* @ignore
|
|
1248
|
+
*/
|
|
1161
1249
|
constructor() {
|
|
1162
1250
|
super();
|
|
1163
1251
|
/**
|
|
@@ -1167,17 +1255,17 @@ class MXButtonBaseComponent extends classes(MXInteractiveComponent, MXColorLookC
|
|
|
1167
1255
|
*/
|
|
1168
1256
|
this.textChange = new EventEmitter();
|
|
1169
1257
|
/**
|
|
1170
|
-
|
|
1171
|
-
|
|
1172
|
-
|
|
1173
|
-
|
|
1258
|
+
* Emits an event when the toggleable state of the action sheet changes.
|
|
1259
|
+
*
|
|
1260
|
+
* @event
|
|
1261
|
+
*/
|
|
1174
1262
|
this.toggleableChange = new EventEmitter();
|
|
1175
1263
|
this._toggleable = false;
|
|
1176
1264
|
/**
|
|
1177
|
-
|
|
1178
|
-
|
|
1179
|
-
|
|
1180
|
-
|
|
1265
|
+
* Emits an event whenever the selection state of the component changes.
|
|
1266
|
+
*
|
|
1267
|
+
* @event
|
|
1268
|
+
*/
|
|
1181
1269
|
this.selectedChange = new EventEmitter();
|
|
1182
1270
|
this._selected = false;
|
|
1183
1271
|
}
|
|
@@ -1546,11 +1634,15 @@ class MXSelectionValueComponent extends MXValueComponent {
|
|
|
1546
1634
|
if (value == null || (isArray && value.length == 0)) {
|
|
1547
1635
|
return this.multiple ? [] : null;
|
|
1548
1636
|
}
|
|
1549
|
-
const normalizedItems = isArray
|
|
1637
|
+
const normalizedItems = isArray
|
|
1638
|
+
? this.normalizeItemsList(value, true)
|
|
1639
|
+
: this.normalizeItemsList([value], true);
|
|
1550
1640
|
if (normalizedItems.length == 0) {
|
|
1551
1641
|
return this.multiple ? [] : null;
|
|
1552
1642
|
}
|
|
1553
|
-
const result = this.multiple
|
|
1643
|
+
const result = this.multiple
|
|
1644
|
+
? normalizedItems.map((c) => c[this.valueField])
|
|
1645
|
+
: normalizedItems[0][this.valueField];
|
|
1554
1646
|
return result;
|
|
1555
1647
|
}
|
|
1556
1648
|
emitOnValueChangedEvent(oldValue, newValue) {
|
|
@@ -1620,14 +1712,18 @@ class MXSelectionValueComponent extends MXValueComponent {
|
|
|
1620
1712
|
this.commitValue([], true);
|
|
1621
1713
|
return;
|
|
1622
1714
|
}
|
|
1623
|
-
const normalizeItems = Array.isArray(items)
|
|
1715
|
+
const normalizeItems = Array.isArray(items)
|
|
1716
|
+
? this.normalizeItemsList(items)
|
|
1717
|
+
: [this.normalizeItem(items)];
|
|
1624
1718
|
const newSelectedItems = this.selectedItems.filter((i) => !normalizeItems.some((n) => n[this.valueField] == i[this.valueField]));
|
|
1625
1719
|
this.commitValue(newSelectedItems, true);
|
|
1626
1720
|
}
|
|
1627
1721
|
selectItems(...items) {
|
|
1628
1722
|
if (items && items.length) {
|
|
1629
1723
|
let newSelectedItems = Array.isArray(this.value) ? this.value : [this.value];
|
|
1630
|
-
const normalizeItems = Array.isArray(items)
|
|
1724
|
+
const normalizeItems = Array.isArray(items)
|
|
1725
|
+
? this.normalizeItemsList(items)
|
|
1726
|
+
: [this.normalizeItem(items)];
|
|
1631
1727
|
if (this.multiple) {
|
|
1632
1728
|
newSelectedItems = [...newSelectedItems, ...normalizeItems];
|
|
1633
1729
|
}
|
|
@@ -1836,5 +1932,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
|
|
|
1836
1932
|
* Generated bundle index. Do not edit.
|
|
1837
1933
|
*/
|
|
1838
1934
|
|
|
1839
|
-
export { AXAutoFocusDirective, AXButtonClickEvent, AXClearableComponent, AXClickEvent, AXClosbaleComponent, AXCommonModule, AXComponent, AXComponentCloseEvent, AXComponentClosedPromise, AXComponentClosing, AXComponentResult, AXDataSource, AXDomService, AXEvent, AXFocusEvent, AXFocusableComponent, AXHotkeyDirective, AXHotkeysService, AXHtmlEvent, AXInfiniteScrollerDirective, AXInvertedColorDirective, AXItemClickEvent, AXListDataSource, AXNgModelDelayedValueChangedDirective, AXOptionChangedEvent, AXPagedComponent, AXRangeChangedEvent, AXResponsiveDirective, AXRippleDirective, AXSearchableComponent, AXSelectionValueChangedEvent, AXValuableComponent, AXValueChangedEvent, AX_LOCATIONS, AX_PLACEMENT_BOTTOM, AX_PLACEMENT_BOTTOM_END, AX_PLACEMENT_BOTTOM_START, AX_PLACEMENT_END, AX_PLACEMENT_END_BOTTOM, AX_PLACEMENT_END_TOP, AX_PLACEMENT_MAP, AX_PLACEMENT_START, AX_PLACEMENT_START_BOTTOM, AX_PLACEMENT_START_TOP, AX_PLACEMENT_TOP, AX_PLACEMENT_TOP_END, AX_PLACEMENT_TOP_START, AX_SELECTION_DATA_TOKEN, AX_STYLE_COLOR_TYPES, AX_STYLE_LOOK_TYPES, MXBaseComponent, MXButtonBaseComponent, MXColorComponent, MXColorLookComponent, MXInputBaseValueComponent, MXInteractiveComponent, MXLookComponent, MXLookableComponent, MXSelectionBridgeService, MXSelectionValueComponent, MXValueComponent, NXClickEvent, NXComponent, NXEvent, NXNativeEvent, TAB_META_KEY, convertArrayToDataSource, convertToPlacement };
|
|
1935
|
+
export { AXAutoFocusDirective, AXButtonClickEvent, AXClearableComponent, AXClickEvent, AXClosbaleComponent, AXCommonModule, AXComponent, AXComponentCloseEvent, AXComponentClosedPromise, AXComponentClosing, AXComponentResult, AXDataSource, AXDomService, AXEvent, AXFocusEvent, AXFocusableComponent, AXHotkeyDirective, AXHotkeysService, AXHtmlEvent, AXInfiniteScrollerDirective, AXInvertedColorDirective, AXItemClickEvent, AXListDataSource, AXNgModelDelayedValueChangedDirective, AXOptionChangedEvent, AXPagedComponent, AXRangeChangedEvent, AXResponsiveDirective, AXRippleDirective, AXSearchableComponent, AXSelectionValueChangedEvent, AXValuableComponent, AXValueChangedEvent, AX_LOCATIONS, AX_PLACEMENT_BOTTOM, AX_PLACEMENT_BOTTOM_END, AX_PLACEMENT_BOTTOM_START, AX_PLACEMENT_END, AX_PLACEMENT_END_BOTTOM, AX_PLACEMENT_END_TOP, AX_PLACEMENT_MAP, AX_PLACEMENT_START, AX_PLACEMENT_START_BOTTOM, AX_PLACEMENT_START_TOP, AX_PLACEMENT_TOP, AX_PLACEMENT_TOP_END, AX_PLACEMENT_TOP_START, AX_SELECTION_DATA_TOKEN, AX_STYLE_COLOR_TYPES, AX_STYLE_LOOK_TYPES, MXBaseComponent, MXButtonBaseComponent, MXColorComponent, MXColorLookComponent, MXInputBaseValueComponent, MXInteractiveComponent, MXLookComponent, MXLookableComponent, MXSelectionBridgeService, MXSelectionValueComponent, MXValueComponent, NXButtonComponent, NXClickEvent, NXColorComponent, NXComponent, NXEvent, NXInteractiveComponent, NXLookComponent, NXNativeEvent, NXValueComponent, TAB_META_KEY, convertArrayToDataSource, convertToPlacement };
|
|
1840
1936
|
//# sourceMappingURL=acorex-components-common.mjs.map
|