@acorex/cdk 22.1.8 → 22.2.1
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-cdk-common.mjs +55 -1
- package/fesm2022/acorex-cdk-common.mjs.map +1 -1
- package/fesm2022/acorex-cdk-drag-drop.mjs +24 -4
- package/fesm2022/acorex-cdk-drag-drop.mjs.map +1 -1
- package/fesm2022/acorex-cdk-highlight.mjs +2 -72
- package/fesm2022/acorex-cdk-highlight.mjs.map +1 -1
- package/fesm2022/acorex-cdk-horizontal-scroll.mjs +24 -7
- package/fesm2022/acorex-cdk-horizontal-scroll.mjs.map +1 -1
- package/fesm2022/acorex-cdk-shimmer.mjs +220 -0
- package/fesm2022/acorex-cdk-shimmer.mjs.map +1 -0
- package/package.json +6 -2
- package/shimmer/README.md +11 -0
- package/types/acorex-cdk-common.d.ts +18 -1
- package/types/acorex-cdk-drag-drop.d.ts +7 -1
- package/types/acorex-cdk-highlight.d.ts +1 -28
- package/types/acorex-cdk-horizontal-scroll.d.ts +3 -0
- package/types/acorex-cdk-shimmer.d.ts +68 -0
|
@@ -1181,5 +1181,22 @@ declare class AXHotkeysService {
|
|
|
1181
1181
|
static ɵprov: i0.ɵɵInjectableDeclaration<AXHotkeysService>;
|
|
1182
1182
|
}
|
|
1183
1183
|
|
|
1184
|
-
|
|
1184
|
+
/**
|
|
1185
|
+
* Scrolls `element` into view inside `container` using nearest-edge behavior.
|
|
1186
|
+
* Only adjusts the container's own scrollTop — never the document — so overlay
|
|
1187
|
+
* dismissal on document scroll is not triggered.
|
|
1188
|
+
*/
|
|
1189
|
+
declare function scrollNearestIntoView(container: HTMLElement, element: HTMLElement, topInset?: number): void;
|
|
1190
|
+
/**
|
|
1191
|
+
* Scrolls an option into view inside a scrollable container using nearest-edge behavior.
|
|
1192
|
+
* Uses bounding rects relative to the container so it works even when offsetParent differs.
|
|
1193
|
+
*/
|
|
1194
|
+
declare function scrollOptionWithinContainer(container: HTMLElement, option: HTMLElement): void;
|
|
1195
|
+
/**
|
|
1196
|
+
* Retries `fn` on successive animation frames until it returns true or `attempts` is exhausted.
|
|
1197
|
+
* Used when the target element appears only after an overlay has been positioned and laid out.
|
|
1198
|
+
*/
|
|
1199
|
+
declare function retryFrames(fn: () => boolean, attempts?: number): void;
|
|
1200
|
+
|
|
1201
|
+
export { AXAutoFocusDirective, AXAutocompleteParentComponent, AXButtonClickEvent, AXClearableComponent, AXClickEvent, AXClosableComponent, AXCommonModule, AXComponent, AXComponentCloseEvent, AXComponentClosedPromise, AXComponentClosing, AXComponentResult, AXDataSource, AXDomService, AXEvent, AXFocusEvent, AXFocusableComponent, AXHotkeyDirective, AXHotkeysService, AXHtmlEvent, AXInfiniteScrollerDirective, AXInvertedColorDirective, AXItemClickEvent, AXItemSelectedEvent, 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, applyDataSourceQuery, convertArrayToDataSource, convertToPlacement, retryFrames, scrollNearestIntoView, scrollOptionWithinContainer };
|
|
1185
1202
|
export type { AXAnimationEasing, AXComponentState, AXConnectedPosition, AXDataListFetchCallbackResult, AXDataListFetchDataCallback, AXDataListItems, AXDataListQuery, AXDataSourceByKeyCallback, AXDataSourceCallbackResult, AXDataSourceChangedEvent, AXDataSourceConfig, AXDataSourceFilterOption, AXDataSourceItemExpandedEvent, AXDataSourceLoadCallback, AXDataSourceOperator, AXDataSourceQuery, AXDataSourceSortOption, AXDirection, AXExpandToggleIcons, AXFilterLogic, AXFormValidationRule, AXHotKeyAction, AXLocation, AXOrientation, AXPagedComponentInterface, AXPlacement, AXPlacementType, AXRange, AXScrollPosition, AXSelectionMode, AXSizeType, AXSortOrder, AXStyleColorClassType, AXStyleColorType, AXStyleInteractiveLookClassType, AXStyleLookClassType, AXStyleLookType, AXStyleSizeType, AXSurfaceType, DisabledCallback, MXComponentOptionChanged, MXComponentOptionChanging, MXComponentSetOption, NormalizedItem };
|
|
@@ -148,6 +148,8 @@ declare class AXDropListDirective extends NXComponent implements OnInit, AfterCo
|
|
|
148
148
|
dropListOrientation: _angular_core.InputSignal<"horizontal" | "vertical">;
|
|
149
149
|
/** Emits when an item is dropped into the list. */
|
|
150
150
|
dropListDropped: _angular_core.OutputEmitterRef<AXDropListDroppedEvent>;
|
|
151
|
+
/** Emits when the sort preview transforms change during an active drag. */
|
|
152
|
+
sortPreviewChanged: _angular_core.OutputEmitterRef<void>;
|
|
151
153
|
/** The `axDrag` directives that are direct children of this list. */
|
|
152
154
|
readonly _draggableItems: _angular_core.Signal<readonly AXDragDirective[]>;
|
|
153
155
|
/** The native element of the drop list. */
|
|
@@ -162,6 +164,8 @@ declare class AXDropListDirective extends NXComponent implements OnInit, AfterCo
|
|
|
162
164
|
private readonly _listInitialRect;
|
|
163
165
|
/** The detected `gap` of the list for the current orientation. */
|
|
164
166
|
private readonly _listGap;
|
|
167
|
+
/** Whether the list is in RTL direction (cached at drag start). */
|
|
168
|
+
private readonly _isRtl;
|
|
165
169
|
/** Internal orientation state; can be overridden programmatically by host components. */
|
|
166
170
|
readonly orientation: _angular_core.WritableSignal<"horizontal" | "vertical">;
|
|
167
171
|
/** Internal sorting-disabled state; can be overridden programmatically by host components. */
|
|
@@ -173,6 +177,8 @@ declare class AXDropListDirective extends NXComponent implements OnInit, AfterCo
|
|
|
173
177
|
ngOnDestroy(): void;
|
|
174
178
|
/** Checks if the given drag item is the one currently active in this list. */
|
|
175
179
|
isDragActiveForThisList(dragItem: AXDragDirective): boolean;
|
|
180
|
+
/** Whether the list is horizontal and in RTL direction. */
|
|
181
|
+
private isHorizontalRtl;
|
|
176
182
|
/**
|
|
177
183
|
* Prepares the list for sorting when a drag operation starts from within this list.
|
|
178
184
|
* @param dragItem The item that is being dragged.
|
|
@@ -233,7 +239,7 @@ declare class AXDropListDirective extends NXComponent implements OnInit, AfterCo
|
|
|
233
239
|
/** Resets the internal state of the directive to its initial values. */
|
|
234
240
|
resetSortState(): void;
|
|
235
241
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXDropListDirective, never>;
|
|
236
|
-
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<AXDropListDirective, "[axDropList]", ["axDropList"], { "axDropList": { "alias": "axDropList"; "required": false; "isSignal": true; }; "sortingDisabled": { "alias": "sortingDisabled"; "required": false; "isSignal": true; }; "dropListGroup": { "alias": "dropListGroup"; "required": false; "isSignal": true; }; "dropListOrientation": { "alias": "dropListOrientation"; "required": false; "isSignal": true; }; }, { "dropListDropped": "dropListDropped"; }, ["_draggableItems"], never, true, never>;
|
|
242
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<AXDropListDirective, "[axDropList]", ["axDropList"], { "axDropList": { "alias": "axDropList"; "required": false; "isSignal": true; }; "sortingDisabled": { "alias": "sortingDisabled"; "required": false; "isSignal": true; }; "dropListGroup": { "alias": "dropListGroup"; "required": false; "isSignal": true; }; "dropListOrientation": { "alias": "dropListOrientation"; "required": false; "isSignal": true; }; }, { "dropListDropped": "dropListDropped"; "sortPreviewChanged": "sortPreviewChanged"; }, ["_draggableItems"], never, true, never>;
|
|
237
243
|
}
|
|
238
244
|
|
|
239
245
|
interface AXDropZoneDropEvent extends NXNativeEvent<AXDropZoneDirective, MouseEvent> {
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import * as _angular_core from '@angular/core';
|
|
2
2
|
import { PipeTransform } from '@angular/core';
|
|
3
3
|
import { AXHighlightOptions, AXHighlightSegment } from '@acorex/core/utils';
|
|
4
|
-
import { SafeHtml } from '@angular/platform-browser';
|
|
5
4
|
|
|
6
5
|
/**
|
|
7
6
|
* Directive that highlights text within the host element or its descendants.
|
|
@@ -43,32 +42,6 @@ declare class AXHighlightDirective {
|
|
|
43
42
|
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<AXHighlightDirective, "[axHighlight]", never, { "axHighlight": { "alias": "axHighlight"; "required": false; "isSignal": true; }; "highlightSelector": { "alias": "highlightSelector"; "required": false; "isSignal": true; }; "highlightOptions": { "alias": "highlightOptions"; "required": false; "isSignal": true; }; "highlightDisabled": { "alias": "highlightDisabled"; "required": false; "isSignal": true; }; }, { "matchCount": "matchCount"; }, never, never, true, never>;
|
|
44
43
|
}
|
|
45
44
|
|
|
46
|
-
/**
|
|
47
|
-
* Renders text with search-term matches wrapped in `.ax-highlight` spans.
|
|
48
|
-
*
|
|
49
|
-
* Uses a single innerHTML string so Angular control-flow whitespace cannot insert
|
|
50
|
-
* gaps between highlighted and non-highlighted characters.
|
|
51
|
-
*
|
|
52
|
-
* Does not use the `ax-highlight-text` class on the host — that class is reserved for
|
|
53
|
-
* {@link AXHighlightService} DOM wrappers.
|
|
54
|
-
*/
|
|
55
|
-
declare class AXHighlightTextComponent {
|
|
56
|
-
#private;
|
|
57
|
-
private readonly sanitizer;
|
|
58
|
-
/** The full text to render. */
|
|
59
|
-
readonly text: _angular_core.InputSignal<string>;
|
|
60
|
-
/** The search term or terms to highlight within the text. */
|
|
61
|
-
readonly query: _angular_core.InputSignal<string | readonly string[]>;
|
|
62
|
-
/** When true, highlighting is disabled and plain text is shown. */
|
|
63
|
-
readonly highlightDisabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
64
|
-
/** Optional highlight behavior configuration. */
|
|
65
|
-
readonly highlightOptions: _angular_core.InputSignal<AXHighlightOptions>;
|
|
66
|
-
protected readonly segments: _angular_core.Signal<AXHighlightSegment[]>;
|
|
67
|
-
protected readonly highlightedHtml: _angular_core.Signal<SafeHtml>;
|
|
68
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXHighlightTextComponent, never>;
|
|
69
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXHighlightTextComponent, "ax-highlight-text", never, { "text": { "alias": "text"; "required": false; "isSignal": true; }; "query": { "alias": "query"; "required": false; "isSignal": true; }; "highlightDisabled": { "alias": "highlightDisabled"; "required": false; "isSignal": true; }; "highlightOptions": { "alias": "highlightOptions"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
70
|
-
}
|
|
71
|
-
|
|
72
45
|
/**
|
|
73
46
|
* Pure pipe that splits text into highlight segments for template rendering.
|
|
74
47
|
*/
|
|
@@ -78,4 +51,4 @@ declare class AXHighlightTextPipe implements PipeTransform {
|
|
|
78
51
|
static ɵpipe: _angular_core.ɵɵPipeDeclaration<AXHighlightTextPipe, "axHighlightText", true>;
|
|
79
52
|
}
|
|
80
53
|
|
|
81
|
-
export { AXHighlightDirective,
|
|
54
|
+
export { AXHighlightDirective, AXHighlightTextPipe };
|
|
@@ -45,6 +45,7 @@ declare class AXHorizontalScrollDirective implements OnDestroy {
|
|
|
45
45
|
private panStartScrollPosition;
|
|
46
46
|
private suppressClickListener;
|
|
47
47
|
private suppressClickTimer;
|
|
48
|
+
private _isRtl;
|
|
48
49
|
private readonly interactiveSelector;
|
|
49
50
|
private readonly wheelListener;
|
|
50
51
|
protected touchAction(): string | null;
|
|
@@ -52,6 +53,8 @@ declare class AXHorizontalScrollDirective implements OnDestroy {
|
|
|
52
53
|
ngOnDestroy(): void;
|
|
53
54
|
private get nativeElement();
|
|
54
55
|
private isHorizontal;
|
|
56
|
+
private get rtlSign();
|
|
57
|
+
private refreshRtlState;
|
|
55
58
|
private getCurrentScrollPosition;
|
|
56
59
|
private getMaxScrollPosition;
|
|
57
60
|
private canScroll;
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
import * as _angular_core from '@angular/core';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Applies the shimmer text effect to a host element.
|
|
5
|
+
*/
|
|
6
|
+
declare class AXShimmerDirective {
|
|
7
|
+
#private;
|
|
8
|
+
private readonly hostElement;
|
|
9
|
+
private readonly destroyRef;
|
|
10
|
+
private readonly platformId;
|
|
11
|
+
private readonly refresh;
|
|
12
|
+
/**
|
|
13
|
+
* Plays the shimmer animation once instead of looping.
|
|
14
|
+
*
|
|
15
|
+
* @defaultValue false
|
|
16
|
+
*/
|
|
17
|
+
once: _angular_core.InputSignal<boolean>;
|
|
18
|
+
/**
|
|
19
|
+
* Reverses the shimmer sweep direction.
|
|
20
|
+
*
|
|
21
|
+
* @defaultValue false
|
|
22
|
+
*/
|
|
23
|
+
reverse: _angular_core.InputSignal<boolean>;
|
|
24
|
+
/**
|
|
25
|
+
* Disables the shimmer effect and renders normal text.
|
|
26
|
+
*
|
|
27
|
+
* @defaultValue false
|
|
28
|
+
*/
|
|
29
|
+
disabled: _angular_core.InputSignal<boolean>;
|
|
30
|
+
/**
|
|
31
|
+
* Duration of one shimmer sweep in milliseconds.
|
|
32
|
+
*
|
|
33
|
+
* @defaultValue 2000
|
|
34
|
+
*/
|
|
35
|
+
duration: _angular_core.InputSignal<number>;
|
|
36
|
+
/**
|
|
37
|
+
* Width of the highlight band. Numbers use the spacing scale; strings accept any CSS length.
|
|
38
|
+
*/
|
|
39
|
+
spread: _angular_core.InputSignal<string | number>;
|
|
40
|
+
/**
|
|
41
|
+
* Tilt of the highlight band in degrees.
|
|
42
|
+
*
|
|
43
|
+
* @defaultValue 20
|
|
44
|
+
*/
|
|
45
|
+
angle: _angular_core.InputSignal<number>;
|
|
46
|
+
/**
|
|
47
|
+
* Explicit highlight color. Accepts ACoreX semantic colors (`primary`, `danger`, …) or any CSS color value.
|
|
48
|
+
* Falls back to a tint derived from currentColor when omitted.
|
|
49
|
+
*/
|
|
50
|
+
color: _angular_core.InputSignal<string>;
|
|
51
|
+
constructor();
|
|
52
|
+
private get element();
|
|
53
|
+
private resolveSpread;
|
|
54
|
+
private isSemanticColor;
|
|
55
|
+
private resolveHighlightColor;
|
|
56
|
+
private isDarkMode;
|
|
57
|
+
private isRtl;
|
|
58
|
+
private prefersReducedMotion;
|
|
59
|
+
private buildBackgroundImage;
|
|
60
|
+
private applyShimmerStyles;
|
|
61
|
+
private clearShimmerStyles;
|
|
62
|
+
private restartShimmerAnimation;
|
|
63
|
+
private cancelShimmerAnimation;
|
|
64
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXShimmerDirective, never>;
|
|
65
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<AXShimmerDirective, "[axShimmer]", never, { "once": { "alias": "once"; "required": false; "isSignal": true; }; "reverse": { "alias": "reverse"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "duration": { "alias": "duration"; "required": false; "isSignal": true; }; "spread": { "alias": "spread"; "required": false; "isSignal": true; }; "angle": { "alias": "angle"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
export { AXShimmerDirective };
|