@acorex/cdk 22.1.0-next.9 → 22.1.0

package/types/acorex-cdk-gesture.d.ts

@@ -0,0 +1,120 @@
+import * as _angular_core from '@angular/core';
+import { OnDestroy, OutputEmitterRef } from '@angular/core';
+
+/**
+ * Hammer.js event payload emitted by AXGestureDirective outputs.
+ */
+interface AXGestureEvent {
+    type: string;
+    deltaX: number;
+    deltaY: number;
+    deltaTime: number;
+    distance: number;
+    angle: number;
+    velocity: number;
+    velocityX: number;
+    velocityY: number;
+    direction: number;
+    offsetDirection: number;
+    scale: number;
+    rotation: number;
+    center: {
+        x: number;
+        y: number;
+    };
+    srcEvent: Event;
+    target: HTMLElement;
+    pointerType: string;
+    eventType: number;
+    isFirst: boolean;
+    isFinal: boolean;
+    preventDefault: () => void;
+}
+/**
+ * Hammer.js constructor options passed through to the manager.
+ */
+interface AXGestureOptions {
+    touchAction?: string;
+    enable?: boolean;
+    cssProps?: Record<string, string | number>;
+    domEvents?: boolean;
+    inputTarget?: EventTarget;
+}
+/**
+ * Allowed pan and swipe directions. Maps to Hammer.DIRECTION_* constants.
+ */
+type AXGestureDirection = 'all' | 'horizontal' | 'vertical';
+/**
+ * Public surface of the Hammer manager exposed via AXGestureDirective.manager.
+ */
+interface AXGestureManager {
+    get: (name: string) => {
+        set: (options: object) => unknown;
+    } | null;
+    on: (events: string, handler: (ev: AXGestureEvent) => void) => void;
+    off: (events: string, handler: (ev: AXGestureEvent) => void) => void;
+    destroy: () => void;
+}
+
+/**
+ * Attaches Hammer.js gesture recognition to the host element.
+ *
+ * Usage:
+ * <div axGesture [direction]="'all'" (tap)="onTap($event)" (pan)="onPan($event)"></div>
+ */
+declare class AXGestureDirective implements OnDestroy {
+    #private;
+    private readonly el;
+    private readonly zone;
+    private readonly platformId;
+    /**
+     * Extra Hammer.js options forwarded to the manager constructor.
+     */
+    options: _angular_core.InputSignal<AXGestureOptions>;
+    /**
+     * Pan and swipe direction. Defaults to horizontal, matching Hammer.js.
+     */
+    direction: _angular_core.InputSignal<AXGestureDirection>;
+    /**
+     * Enables the multi-touch pinch recognizer. Disabled by default.
+     */
+    enablePinch: _angular_core.InputSignal<boolean>;
+    /**
+     * Enables the multi-touch rotate recognizer. Disabled by default.
+     */
+    enableRotate: _angular_core.InputSignal<boolean>;
+    /**
+     * Stops gesture recognition when true.
+     */
+    disabled: _angular_core.InputSignal<boolean>;
+    tap: OutputEmitterRef<AXGestureEvent>;
+    doubletap: OutputEmitterRef<AXGestureEvent>;
+    press: OutputEmitterRef<AXGestureEvent>;
+    pan: OutputEmitterRef<AXGestureEvent>;
+    panstart: OutputEmitterRef<AXGestureEvent>;
+    panmove: OutputEmitterRef<AXGestureEvent>;
+    panend: OutputEmitterRef<AXGestureEvent>;
+    swipe: OutputEmitterRef<AXGestureEvent>;
+    pinch: OutputEmitterRef<AXGestureEvent>;
+    rotate: OutputEmitterRef<AXGestureEvent>;
+    private hammer;
+    private hammerLib;
+    private setupId;
+    private ready;
+    private readonly emitters;
+    /**
+     * The underlying Hammer manager, or null when not initialized.
+     */
+    get manager(): AXGestureManager | null;
+    ngOnDestroy(): void;
+    private setup;
+    private loadHammer;
+    private toHammerDirection;
+    private teardown;
+    private readonly onHammerEvent;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXGestureDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<AXGestureDirective, "[axGesture]", ["axGesture"], { "options": { "alias": "options"; "required": false; "isSignal": true; }; "direction": { "alias": "direction"; "required": false; "isSignal": true; }; "enablePinch": { "alias": "enablePinch"; "required": false; "isSignal": true; }; "enableRotate": { "alias": "enableRotate"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "tap": "tap"; "doubletap": "doubletap"; "press": "press"; "pan": "pan"; "panstart": "panstart"; "panmove": "panmove"; "panend": "panend"; "swipe": "swipe"; "pinch": "pinch"; "rotate": "rotate"; }, never, never, true, never>;
+}
+
+export { AXGestureDirective };
+export type { AXGestureDirection, AXGestureEvent, AXGestureManager, AXGestureOptions };

package/types/acorex-cdk-highlight.d.ts

@@ -0,0 +1,81 @@
+import * as _angular_core from '@angular/core';
+import { PipeTransform } from '@angular/core';
+import { AXHighlightOptions, AXHighlightSegment } from '@acorex/core/utils';
+import { SafeHtml } from '@angular/platform-browser';
+
+/**
+ * Directive that highlights text within the host element or its descendants.
+ *
+ * Usage:
+ * ```html
+ * <div [axHighlight]="query()">...</div>
+ * <table [axHighlight]="query()" highlightSelector="tbody td">...</table>
+ * ```
+ */
+declare class AXHighlightDirective {
+    private readonly host;
+    private readonly destroyRef;
+    private readonly highlightService;
+    /**
+     * Text or list of texts to search and highlight.
+     */
+    readonly axHighlight: _angular_core.InputSignal<string | readonly string[]>;
+    /**
+     * Optional CSS selector scoped to the host element.
+     * When omitted, highlighting is applied to the host element itself.
+     */
+    readonly highlightSelector: _angular_core.InputSignal<string>;
+    /**
+     * Optional highlight behavior configuration.
+     */
+    readonly highlightOptions: _angular_core.InputSignal<AXHighlightOptions>;
+    /**
+     * When true, highlighting is disabled and any existing highlights are cleared.
+     */
+    readonly highlightDisabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Emits the number of matches highlighted after each render cycle.
+     */
+    readonly matchCount: _angular_core.OutputEmitterRef<number>;
+    constructor();
+    private resolveTarget;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXHighlightDirective, never>;
+    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>;
+}
+
+/**
+ * Renders text with search-term matches wrapped in `.ax-highlight` spans.
+ *
+ * Uses a single innerHTML string so Angular control-flow whitespace cannot insert
+ * gaps between highlighted and non-highlighted characters.
+ *
+ * Does not use the `ax-highlight-text` class on the host — that class is reserved for
+ * {@link AXHighlightService} DOM wrappers.
+ */
+declare class AXHighlightTextComponent {
+    #private;
+    private readonly sanitizer;
+    /** The full text to render. */
+    readonly text: _angular_core.InputSignal<string>;
+    /** The search term or terms to highlight within the text. */
+    readonly query: _angular_core.InputSignal<string | readonly string[]>;
+    /** When true, highlighting is disabled and plain text is shown. */
+    readonly highlightDisabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Optional highlight behavior configuration. */
+    readonly highlightOptions: _angular_core.InputSignal<AXHighlightOptions>;
+    protected readonly segments: _angular_core.Signal<AXHighlightSegment[]>;
+    protected readonly highlightedHtml: _angular_core.Signal<SafeHtml>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXHighlightTextComponent, never>;
+    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>;
+}
+
+/**
+ * Pure pipe that splits text into highlight segments for template rendering.
+ */
+declare class AXHighlightTextPipe implements PipeTransform {
+    transform(text: string | null | undefined, query: string | readonly string[] | null | undefined, options?: AXHighlightOptions): AXHighlightSegment[];
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXHighlightTextPipe, never>;
+    static ɵpipe: _angular_core.ɵɵPipeDeclaration<AXHighlightTextPipe, "axHighlightText", true>;
+}
+
+export { AXHighlightDirective, AXHighlightTextComponent, AXHighlightTextPipe };

package/types/acorex-cdk-horizontal-scroll.d.ts

@@ -1,22 +1,27 @@
 import * as _angular_core from '@angular/core';
 import { OnDestroy } from '@angular/core';
+import * as i1 from '@acorex/cdk/gesture';
 
 /**
- * Converts vertical mouse-wheel scrolling into horizontal scrolling on the host element.
- * Applies only when the host can scroll horizontally.
+ * Converts vertical mouse-wheel scrolling and horizontal pan into horizontal scrolling on the host element.
+ * Applies only when the host can scroll horizontally. Pan is provided by the hosted AXGestureDirective.
  *
  * Usage:
  * <div axHorizontalScroll [speed]="150" class="overflow-x-auto">
  *   ...
  * </div>
+ *
+ * Do not put `axGesture` on the same element; this directive already hosts it.
  */
 declare class AXHorizontalScrollDirective implements OnDestroy {
     #private;
-    private elementRef;
-    private platformId;
-    private zone;
+    private readonly elementRef;
+    private readonly platformId;
+    private readonly zone;
+    private readonly gesture;
+    private readonly destroyRef;
     /**
-     * Disables wheel-to-horizontal conversion when true.
+     * Disables wheel-to-horizontal conversion and pan scrolling when true.
      */
     disabled: _angular_core.InputSignal<boolean>;
     /**
@@ -28,17 +33,31 @@ declare class AXHorizontalScrollDirective implements OnDestroy {
     private targetScrollLeft;
     private scrollPosition;
     private lastFrameTime;
+    private isPanning;
+    private ignorePan;
+    private panStartScrollLeft;
+    private suppressClickListener;
+    private suppressClickTimer;
+    private readonly interactiveSelector;
     private readonly wheelListener;
+    constructor();
     ngOnDestroy(): void;
     private get nativeElement();
     private handleWheel;
+    private handlePanStart;
+    private handlePanMove;
+    private handlePanEnd;
+    private clearPanStyles;
+    private suppressClick;
+    private clearClickSuppression;
     private syncScrollState;
     private startAnimation;
     private applyScrollPosition;
     private stopAnimation;
     private canScrollHorizontally;
+    private getMaxScrollLeft;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXHorizontalScrollDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<AXHorizontalScrollDirective, "[axHorizontalScroll]", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "speed": { "alias": "speed"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<AXHorizontalScrollDirective, "[axHorizontalScroll]", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "speed": { "alias": "speed"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.AXGestureDirective; inputs: {}; outputs: {}; }]>;
 }
 
 export { AXHorizontalScrollDirective };

package/types/acorex-cdk-sliding-item.d.ts

@@ -1,18 +1,36 @@
 import * as _angular_core from '@angular/core';
+import * as i1 from '@acorex/cdk/gesture';
 
+/**
+ * Enables horizontal sliding on the host via the hosted AXGestureDirective pan events.
+ *
+ * Do not put `axGesture` on the same element; this directive already hosts it.
+ */
 declare class AXSlidingItemDirective {
     #private;
-    private hostElement;
-    private isMouseDown;
-    private prevX;
+    private readonly hostElement;
+    private readonly gesture;
+    private readonly destroyRef;
     currentX: _angular_core.WritableSignal<number>;
     stopPoint: _angular_core.WritableSignal<number>;
     disableSlidingRight: _angular_core.WritableSignal<boolean>;
     disableSlidingLeft: _angular_core.WritableSignal<boolean>;
+    protected readonly cursor: _angular_core.WritableSignal<string>;
+    private originX;
+    constructor();
+    private handlePanStart;
+    private handlePanMove;
+    private handlePanEnd;
     private dismiss;
+    /**
+     * Sets the position of the sliding element.
+     *
+     * @param pos - The horizontal position in pixels to set the element to
+     * @returns void - No return value. The element's transform is updated to the specified position.
+     */
     setPosition(pos: number): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXSlidingItemDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<AXSlidingItemDirective, "[axSlidingItem]", never, {}, {}, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<AXSlidingItemDirective, "[axSlidingItem]", never, {}, {}, never, never, true, [{ directive: typeof i1.AXGestureDirective; inputs: {}; outputs: {}; }]>;
 }
 
 export { AXSlidingItemDirective };