@tft/interact 14.0.0 → 15.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (53) hide show
  1. package/{esm2020 → esm2022}/index.mjs +5 -5
  2. package/{esm2020 → esm2022}/lib/directives/account-for-scale.directive.mjs +26 -26
  3. package/{esm2020 → esm2022}/lib/directives/apply-scale.directive.mjs +28 -28
  4. package/esm2022/lib/directives/auto-scroll.directive.mjs +56 -0
  5. package/{esm2020 → esm2022}/lib/directives/drag-preview.directive.mjs +20 -20
  6. package/{esm2020 → esm2022}/lib/directives/drag-root.directive.mjs +32 -32
  7. package/esm2022/lib/directives/draggable.directive.mjs +320 -0
  8. package/esm2022/lib/directives/dropzone.directive.mjs +114 -0
  9. package/esm2022/lib/directives/gesturable.directive.mjs +82 -0
  10. package/{esm2020 → esm2022}/lib/directives/index.mjs +9 -9
  11. package/esm2022/lib/directives/resizable.directive.mjs +228 -0
  12. package/{esm2020 → esm2022}/lib/interact.module.mjs +66 -66
  13. package/{esm2020 → esm2022}/lib/models/index.mjs +1 -1
  14. package/{esm2020 → esm2022}/lib/models/interact.mjs +27 -27
  15. package/{esm2020 → esm2022}/lib/pipes/array-of-n.pipe.mjs +22 -22
  16. package/{esm2020 → esm2022}/lib/pipes/index.mjs +1 -1
  17. package/esm2022/lib/services/interact.service.mjs +197 -0
  18. package/esm2022/lib/utils/helpers.mjs +35 -0
  19. package/{esm2020 → esm2022}/lib/utils/index.mjs +1 -1
  20. package/{esm2020 → esm2022}/tft-interact.mjs +4 -4
  21. package/{fesm2020 → fesm2022}/tft-interact.mjs +1155 -1155
  22. package/{fesm2020 → fesm2022}/tft-interact.mjs.map +1 -1
  23. package/index.d.ts +5 -5
  24. package/lib/directives/account-for-scale.directive.d.ts +15 -15
  25. package/lib/directives/apply-scale.directive.d.ts +11 -11
  26. package/lib/directives/auto-scroll.directive.d.ts +34 -34
  27. package/lib/directives/drag-preview.directive.d.ts +10 -10
  28. package/lib/directives/drag-root.directive.d.ts +15 -15
  29. package/lib/directives/draggable.directive.d.ts +76 -76
  30. package/lib/directives/dropzone.directive.d.ts +40 -40
  31. package/lib/directives/gesturable.directive.d.ts +27 -27
  32. package/lib/directives/index.d.ts +9 -9
  33. package/lib/directives/resizable.directive.d.ts +61 -61
  34. package/lib/interact.module.d.ts +20 -20
  35. package/lib/models/index.d.ts +1 -1
  36. package/lib/models/interact.d.ts +140 -140
  37. package/lib/pipes/array-of-n.pipe.d.ts +12 -12
  38. package/lib/pipes/index.d.ts +1 -1
  39. package/lib/services/interact.service.d.ts +83 -83
  40. package/lib/utils/helpers.d.ts +12 -12
  41. package/lib/utils/index.d.ts +1 -1
  42. package/package.json +7 -15
  43. package/tft-interact-15.1.0.tgz +0 -0
  44. package/esm2020/lib/directives/auto-scroll.directive.mjs +0 -56
  45. package/esm2020/lib/directives/draggable.directive.mjs +0 -320
  46. package/esm2020/lib/directives/dropzone.directive.mjs +0 -114
  47. package/esm2020/lib/directives/gesturable.directive.mjs +0 -82
  48. package/esm2020/lib/directives/resizable.directive.mjs +0 -228
  49. package/esm2020/lib/services/interact.service.mjs +0 -197
  50. package/esm2020/lib/utils/helpers.mjs +0 -35
  51. package/fesm2015/tft-interact.mjs +0 -1203
  52. package/fesm2015/tft-interact.mjs.map +0 -1
  53. package/tft-interact-14.0.0.tgz +0 -0
@@ -1,140 +1,140 @@
1
- import { DropzoneDirective, DraggableDirective, GesturableDirective, ResizableDirective } from '../directives';
2
- import { Point, DragEvent, ResizeEvent, Interactable, DropEvent, GestureEvent } from '@interactjs/types';
3
- import { BehaviorSubject, Observable } from 'rxjs';
4
- import { InjectionToken } from '@angular/core';
5
- export declare type CssDimensionUnit = 'px' | 'em';
6
- export interface InteractRootConfig {
7
- cssDimensionUnit: CssDimensionUnit;
8
- }
9
- export declare const INTERACT_ROOT_CONFIG: InjectionToken<InteractRootConfig>;
10
- export declare const DEFAULT_REGISTRY_ID = "DEFAULT";
11
- /**
12
- * Default initial value for Delta BehaviorSubject
13
- */
14
- export declare const defaultDelta: Delta;
15
- /**
16
- * Default initial value for Size BehaviorSubject
17
- */
18
- export declare const defaultSize: Size;
19
- /**
20
- * Default initial value for Position BehaviorSubject
21
- */
22
- export declare const defaultPosition: Position;
23
- /**
24
- * The shape of the state/events/behavior system for each dropzone
25
- * and the DEFAULT_REGISTRY_ID system (for drop components initialized outside
26
- * of a dropzone).
27
- */
28
- export interface InteractableSystem {
29
- deltas$: BehaviorSubject<Delta>;
30
- position$: BehaviorSubject<Position>;
31
- size$: BehaviorSubject<Size & Delta>;
32
- interactable$: Observable<TftCoords>;
33
- }
34
- /**
35
- * The key map of InteractableSystems. One for the drag components
36
- * that originated outside of a dropzone, plus one for each dropzone.
37
- */
38
- export interface InteractableRegistry {
39
- [key: string]: InteractableSystem;
40
- }
41
- /**
42
- * HTMLElement with helpful drag directives attached to facilitate moving drag data between dropzones
43
- */
44
- export declare type TftDragElement = HTMLElement & {
45
- dragRef?: DraggableDirective;
46
- dragOrigin?: DropzoneDirective;
47
- dropTarget?: DropzoneDirective;
48
- };
49
- /**
50
- * HTMLElement with helpful drag directives attached to facilitate moving drag data between dropzones
51
- */
52
- export declare type TftResizeElement = HTMLElement & {
53
- resizeRef?: ResizableDirective;
54
- };
55
- /**
56
- * Extends the interact drop events by adding reference to the dropped components drag
57
- * directive to the html element. This gives the dropzone access to things like data
58
- * and parent dropzone of the dropped component.
59
- */
60
- export declare type NgDropEvent = DropEvent & {
61
- draggable: Interactable & {
62
- target: TftDragElement;
63
- };
64
- relatedTarget: TftDragElement;
65
- };
66
- /**
67
- * Extends the interact resize events by adding a reference to the dragRef
68
- * directive to the html element.
69
- */
70
- export declare type NgResizeEvent = ResizeEvent & {
71
- draggable: Interactable & {
72
- target: TftDragElement;
73
- };
74
- };
75
- /**
76
- * We extend the interact DragEvent a little here, adding to the target element references for:
77
- * - the component we are dragging (dragRef)
78
- * - the dropzone component where the drag component originated (dragOrigin)
79
- * - the dropzone component that it was dropped in (dropTarget)
80
- * This helps us to pass references to directive classes as events like dragenter and drag exit happens.
81
- * We use these references to emit a (mostly) consistent event across drag, drop, resize event.
82
- */
83
- export declare type NgDragEvent = DragEvent & {
84
- dropzone: {
85
- target: HTMLElement;
86
- };
87
- target: TftDragElement;
88
- };
89
- /**
90
- * Event emitted when resizing, dragging, dropping
91
- */
92
- export interface TftInteractableEvent {
93
- dragRef: DraggableDirective;
94
- dragOrigin?: DropzoneDirective;
95
- dropTarget?: DropzoneDirective;
96
- positionInDropTarget: Point;
97
- }
98
- /**
99
- * Event emitted on drop
100
- */
101
- export interface TftDropEvent extends TftInteractableEvent {
102
- interactEvent: NgDropEvent;
103
- }
104
- /**
105
- * Event emitted on drag
106
- */
107
- export interface TftDragEvent extends TftInteractableEvent {
108
- interactEvent: NgDragEvent;
109
- }
110
- /**
111
- * Event emitted on resize
112
- */
113
- export interface TftResizeEvent extends TftInteractableEvent {
114
- interactEvent: ResizeEvent;
115
- resizeRef: ResizableDirective;
116
- size: {
117
- width: number;
118
- height: number;
119
- };
120
- }
121
- export declare type TftCoords = Delta & Position & Size;
122
- export interface Delta {
123
- deltaX: number | null;
124
- deltaY: number | null;
125
- targetElement: TftDragElement | null;
126
- }
127
- export interface Position {
128
- x: number | null;
129
- y: number | null;
130
- targetElement: TftDragElement | null;
131
- }
132
- export interface Size {
133
- width: number | null;
134
- height: number | null;
135
- targetElement: TftResizeElement | null;
136
- }
137
- export interface TftGestureEvent {
138
- gestureRef: GesturableDirective;
139
- interactEvent: GestureEvent;
140
- }
1
+ import { DropzoneDirective, DraggableDirective, GesturableDirective, ResizableDirective } from '../directives';
2
+ import { Point, DragEvent, ResizeEvent, Interactable, DropEvent, GestureEvent } from '@interactjs/types';
3
+ import { BehaviorSubject, Observable } from 'rxjs';
4
+ import { InjectionToken } from '@angular/core';
5
+ export type CssDimensionUnit = 'px' | 'em';
6
+ export interface InteractRootConfig {
7
+ cssDimensionUnit: CssDimensionUnit;
8
+ }
9
+ export declare const INTERACT_ROOT_CONFIG: InjectionToken<InteractRootConfig>;
10
+ export declare const DEFAULT_REGISTRY_ID = "DEFAULT";
11
+ /**
12
+ * Default initial value for Delta BehaviorSubject
13
+ */
14
+ export declare const defaultDelta: Delta;
15
+ /**
16
+ * Default initial value for Size BehaviorSubject
17
+ */
18
+ export declare const defaultSize: Size;
19
+ /**
20
+ * Default initial value for Position BehaviorSubject
21
+ */
22
+ export declare const defaultPosition: Position;
23
+ /**
24
+ * The shape of the state/events/behavior system for each dropzone
25
+ * and the DEFAULT_REGISTRY_ID system (for drop components initialized outside
26
+ * of a dropzone).
27
+ */
28
+ export interface InteractableSystem {
29
+ deltas$: BehaviorSubject<Delta>;
30
+ position$: BehaviorSubject<Position>;
31
+ size$: BehaviorSubject<Size & Delta>;
32
+ interactable$: Observable<TftCoords>;
33
+ }
34
+ /**
35
+ * The key map of InteractableSystems. One for the drag components
36
+ * that originated outside of a dropzone, plus one for each dropzone.
37
+ */
38
+ export interface InteractableRegistry {
39
+ [key: string]: InteractableSystem;
40
+ }
41
+ /**
42
+ * HTMLElement with helpful drag directives attached to facilitate moving drag data between dropzones
43
+ */
44
+ export type TftDragElement = HTMLElement & {
45
+ dragRef?: DraggableDirective;
46
+ dragOrigin?: DropzoneDirective;
47
+ dropTarget?: DropzoneDirective;
48
+ };
49
+ /**
50
+ * HTMLElement with helpful drag directives attached to facilitate moving drag data between dropzones
51
+ */
52
+ export type TftResizeElement = HTMLElement & {
53
+ resizeRef?: ResizableDirective;
54
+ };
55
+ /**
56
+ * Extends the interact drop events by adding reference to the dropped components drag
57
+ * directive to the html element. This gives the dropzone access to things like data
58
+ * and parent dropzone of the dropped component.
59
+ */
60
+ export type NgDropEvent = DropEvent & {
61
+ draggable: Interactable & {
62
+ target: TftDragElement;
63
+ };
64
+ relatedTarget: TftDragElement;
65
+ };
66
+ /**
67
+ * Extends the interact resize events by adding a reference to the dragRef
68
+ * directive to the html element.
69
+ */
70
+ export type NgResizeEvent = ResizeEvent & {
71
+ draggable: Interactable & {
72
+ target: TftDragElement;
73
+ };
74
+ };
75
+ /**
76
+ * We extend the interact DragEvent a little here, adding to the target element references for:
77
+ * - the component we are dragging (dragRef)
78
+ * - the dropzone component where the drag component originated (dragOrigin)
79
+ * - the dropzone component that it was dropped in (dropTarget)
80
+ * This helps us to pass references to directive classes as events like dragenter and drag exit happens.
81
+ * We use these references to emit a (mostly) consistent event across drag, drop, resize event.
82
+ */
83
+ export type NgDragEvent = DragEvent & {
84
+ dropzone: {
85
+ target: HTMLElement;
86
+ };
87
+ target: TftDragElement;
88
+ };
89
+ /**
90
+ * Event emitted when resizing, dragging, dropping
91
+ */
92
+ export interface TftInteractableEvent {
93
+ dragRef: DraggableDirective;
94
+ dragOrigin?: DropzoneDirective;
95
+ dropTarget?: DropzoneDirective;
96
+ positionInDropTarget: Point;
97
+ }
98
+ /**
99
+ * Event emitted on drop
100
+ */
101
+ export interface TftDropEvent extends TftInteractableEvent {
102
+ interactEvent: NgDropEvent;
103
+ }
104
+ /**
105
+ * Event emitted on drag
106
+ */
107
+ export interface TftDragEvent extends TftInteractableEvent {
108
+ interactEvent: NgDragEvent;
109
+ }
110
+ /**
111
+ * Event emitted on resize
112
+ */
113
+ export interface TftResizeEvent extends TftInteractableEvent {
114
+ interactEvent: ResizeEvent;
115
+ resizeRef: ResizableDirective;
116
+ size: {
117
+ width: number;
118
+ height: number;
119
+ };
120
+ }
121
+ export type TftCoords = Delta & Position & Size;
122
+ export interface Delta {
123
+ deltaX: number | null;
124
+ deltaY: number | null;
125
+ targetElement: TftDragElement | null;
126
+ }
127
+ export interface Position {
128
+ x: number | null;
129
+ y: number | null;
130
+ targetElement: TftDragElement | null;
131
+ }
132
+ export interface Size {
133
+ width: number | null;
134
+ height: number | null;
135
+ targetElement: TftResizeElement | null;
136
+ }
137
+ export interface TftGestureEvent {
138
+ gestureRef: GesturableDirective;
139
+ interactEvent: GestureEvent;
140
+ }
@@ -1,12 +1,12 @@
1
- import { PipeTransform } from '@angular/core';
2
- import * as i0 from "@angular/core";
3
- export declare class ArrayOfNPipe implements PipeTransform {
4
- /**
5
- *
6
- * @param n the number to make an array of
7
- * @param max the max length of the array (useful for limiting rendering in ngFor loop)
8
- */
9
- transform(n: number, max: number): any;
10
- static ɵfac: i0.ɵɵFactoryDeclaration<ArrayOfNPipe, never>;
11
- static ɵpipe: i0.ɵɵPipeDeclaration<ArrayOfNPipe, "arrayOfN", false>;
12
- }
1
+ import { PipeTransform } from '@angular/core';
2
+ import * as i0 from "@angular/core";
3
+ export declare class ArrayOfNPipe implements PipeTransform {
4
+ /**
5
+ *
6
+ * @param n the number to make an array of
7
+ * @param max the max length of the array (useful for limiting rendering in ngFor loop)
8
+ */
9
+ transform(n: number, max: number): any;
10
+ static ɵfac: i0.ɵɵFactoryDeclaration<ArrayOfNPipe, never>;
11
+ static ɵpipe: i0.ɵɵPipeDeclaration<ArrayOfNPipe, "arrayOfN", false>;
12
+ }
@@ -1 +1 @@
1
- export * from './array-of-n.pipe';
1
+ export * from './array-of-n.pipe';
@@ -1,83 +1,83 @@
1
- import { RendererFactory2, NgZone } from '@angular/core';
2
- import { BehaviorSubject, Observable } from 'rxjs';
3
- import { TftCoords, Delta, Size, Position, InteractableRegistry, TftDragElement, TftResizeElement } from '../models';
4
- import * as i0 from "@angular/core";
5
- export declare class InteractService {
6
- private rendererFactory;
7
- private ngZone;
8
- rootConfig: any;
9
- private _interactableIndex;
10
- private _dropzoneIndex;
11
- private renderer;
12
- readonly dragRegistrySystem: {
13
- [key: string]: InteractableRegistry;
14
- };
15
- private cssUnit;
16
- constructor(rendererFactory: RendererFactory2, ngZone: NgZone, rootConfig: any);
17
- addDeltaToPosition(delta: Delta, position: Position): {
18
- x: number;
19
- y: number;
20
- targetElement: TftDragElement;
21
- };
22
- addRegistryToSystem(customRegistryId?: string | null): string;
23
- addDraggableToRegistry(customRegistryId?: any, interactableId?: string | null): string;
24
- destroyInteractable(interactableId: string, registryId?: string): void;
25
- subscribeToInteractable(interactableId: string, registryId?: string): import("../models").InteractableSystem;
26
- createInteractableState(initialPosition: Position, initialSize: Size, initialDelta: Delta): {
27
- deltas$: BehaviorSubject<Delta>;
28
- position$: BehaviorSubject<Position>;
29
- size$: BehaviorSubject<{
30
- deltaX: number;
31
- deltaY: number;
32
- targetElement: TftDragElement;
33
- width: number;
34
- height: number;
35
- }>;
36
- interactable$: Observable<TftCoords>;
37
- };
38
- createInteractableId(customInteractableId?: string | null): string;
39
- createDropzoneId(index: number): string;
40
- getInteractableState(interactableId: string, registryId?: string): Observable<TftCoords>;
41
- updateDeltas(interactId: string, registryId: string, { deltaX, deltaY }: {
42
- deltaX: any;
43
- deltaY: any;
44
- }, targetElement: any): void;
45
- updatePosition(interactId: string, registryId: string, { x, y }: {
46
- x: number;
47
- y: number;
48
- }, targetElement: any): void;
49
- updateSize(interactId: string, registryId: string, { deltaX, deltaY, width, height }: {
50
- deltaX: any;
51
- deltaY: any;
52
- width: any;
53
- height: any;
54
- }, targetElement: any): void;
55
- interactableExistOnRegistry(interactId: string, registryId?: string): boolean;
56
- /**
57
- * Uses renderer to set width and height of angular component
58
- * @param width the desired width of component
59
- * @param height the desired height of component
60
- * @param target the element to transform
61
- */
62
- setElementSize(width: number, height: number, target: TftResizeElement): void;
63
- /**
64
- * Uses renderer to set position of angular component
65
- * @param x position on x axis
66
- * @param y position on y axis
67
- * @param target the element to transform
68
- */
69
- setElementTransform(x: number, y: number, position: Position): void;
70
- /**
71
- * Generates a translate string for the x and y arguments passed to
72
- * be passed to css transform
73
- * @param x the position along the x axis
74
- * @param y the position along the y axis
75
- */
76
- createTransformString(x: number, y: number): string;
77
- calculatePositionInElement(zoneElement: Interact.Element, dragElement: TftDragElement, scale?: number): {
78
- x: number;
79
- y: number;
80
- };
81
- static ɵfac: i0.ɵɵFactoryDeclaration<InteractService, [null, null, { optional: true; }]>;
82
- static ɵprov: i0.ɵɵInjectableDeclaration<InteractService>;
83
- }
1
+ import { RendererFactory2, NgZone } from '@angular/core';
2
+ import { BehaviorSubject, Observable } from 'rxjs';
3
+ import { TftCoords, Delta, Size, Position, InteractableRegistry, TftDragElement, TftResizeElement } from '../models';
4
+ import * as i0 from "@angular/core";
5
+ export declare class InteractService {
6
+ private rendererFactory;
7
+ private ngZone;
8
+ rootConfig: any;
9
+ private _interactableIndex;
10
+ private _dropzoneIndex;
11
+ private renderer;
12
+ readonly dragRegistrySystem: {
13
+ [key: string]: InteractableRegistry;
14
+ };
15
+ private cssUnit;
16
+ constructor(rendererFactory: RendererFactory2, ngZone: NgZone, rootConfig: any);
17
+ addDeltaToPosition(delta: Delta, position: Position): {
18
+ x: number;
19
+ y: number;
20
+ targetElement: TftDragElement;
21
+ };
22
+ addRegistryToSystem(customRegistryId?: string | null): string;
23
+ addDraggableToRegistry(customRegistryId?: any, interactableId?: string | null): string;
24
+ destroyInteractable(interactableId: string, registryId?: string): void;
25
+ subscribeToInteractable(interactableId: string, registryId?: string): import("../models").InteractableSystem;
26
+ createInteractableState(initialPosition: Position, initialSize: Size, initialDelta: Delta): {
27
+ deltas$: BehaviorSubject<Delta>;
28
+ position$: BehaviorSubject<Position>;
29
+ size$: BehaviorSubject<{
30
+ deltaX: number;
31
+ deltaY: number;
32
+ targetElement: TftDragElement;
33
+ width: number;
34
+ height: number;
35
+ }>;
36
+ interactable$: Observable<TftCoords>;
37
+ };
38
+ createInteractableId(customInteractableId?: string | null): string;
39
+ createDropzoneId(index: number): string;
40
+ getInteractableState(interactableId: string, registryId?: string): Observable<TftCoords>;
41
+ updateDeltas(interactId: string, registryId: string, { deltaX, deltaY }: {
42
+ deltaX: any;
43
+ deltaY: any;
44
+ }, targetElement: any): void;
45
+ updatePosition(interactId: string, registryId: string, { x, y }: {
46
+ x: number;
47
+ y: number;
48
+ }, targetElement: any): void;
49
+ updateSize(interactId: string, registryId: string, { deltaX, deltaY, width, height }: {
50
+ deltaX: any;
51
+ deltaY: any;
52
+ width: any;
53
+ height: any;
54
+ }, targetElement: any): void;
55
+ interactableExistOnRegistry(interactId: string, registryId?: string): boolean;
56
+ /**
57
+ * Uses renderer to set width and height of angular component
58
+ * @param width the desired width of component
59
+ * @param height the desired height of component
60
+ * @param target the element to transform
61
+ */
62
+ setElementSize(width: number, height: number, target: TftResizeElement): void;
63
+ /**
64
+ * Uses renderer to set position of angular component
65
+ * @param x position on x axis
66
+ * @param y position on y axis
67
+ * @param target the element to transform
68
+ */
69
+ setElementTransform(x: number, y: number, position: Position): void;
70
+ /**
71
+ * Generates a translate string for the x and y arguments passed to
72
+ * be passed to css transform
73
+ * @param x the position along the x axis
74
+ * @param y the position along the y axis
75
+ */
76
+ createTransformString(x: number, y: number): string;
77
+ calculatePositionInElement(zoneElement: Interact.Element, dragElement: TftDragElement, scale?: number): {
78
+ x: number;
79
+ y: number;
80
+ };
81
+ static ɵfac: i0.ɵɵFactoryDeclaration<InteractService, [null, null, { optional: true; }]>;
82
+ static ɵprov: i0.ɵɵInjectableDeclaration<InteractService>;
83
+ }
@@ -1,12 +1,12 @@
1
- import { EmbeddedViewRef } from '@angular/core';
2
- /** Gets the closest ancestor of an element that matches a selector. */
3
- export declare function getClosestMatchingAncestor(element: HTMLElement, selector: string): HTMLElement;
4
- /**
5
- * Create a copy of the HTML Element
6
- */
7
- export declare function cloneElement(element: HTMLElement): HTMLElement;
8
- /**
9
- * Gets the root HTML element of an embedded view.
10
- * If the root is not an HTML element it gets wrapped in one.
11
- */
12
- export declare function getRootNode(viewRef: EmbeddedViewRef<any>, _document: Document): HTMLElement;
1
+ import { EmbeddedViewRef } from '@angular/core';
2
+ /** Gets the closest ancestor of an element that matches a selector. */
3
+ export declare function getClosestMatchingAncestor(element: HTMLElement, selector: string): HTMLElement;
4
+ /**
5
+ * Create a copy of the HTML Element
6
+ */
7
+ export declare function cloneElement(element: HTMLElement): HTMLElement;
8
+ /**
9
+ * Gets the root HTML element of an embedded view.
10
+ * If the root is not an HTML element it gets wrapped in one.
11
+ */
12
+ export declare function getRootNode(viewRef: EmbeddedViewRef<any>, _document: Document): HTMLElement;
@@ -1 +1 @@
1
- export * from './helpers';
1
+ export * from './helpers';
package/package.json CHANGED
@@ -1,21 +1,15 @@
1
1
  {
2
2
  "name": "@tft/interact",
3
- "version": "14.0.0",
3
+ "version": "15.1.0",
4
4
  "peerDependencies": {
5
5
  "@angular/common": "^13.0.0",
6
6
  "@angular/core": "^13.0.0",
7
- "interactjs": "~1.9.19",
8
- "rxjs": "^7.0.0",
9
- "@angular/platform-browser-dynamic": "14.0.1"
7
+ "interactjs": "~1.9.19"
10
8
  },
11
9
  "dependencies": {
12
10
  "tslib": "^2.0.0"
13
11
  },
14
- "module": "fesm2015/tft-interact.mjs",
15
- "es2020": "fesm2020/tft-interact.mjs",
16
- "esm2020": "esm2020/tft-interact.mjs",
17
- "fesm2020": "fesm2020/tft-interact.mjs",
18
- "fesm2015": "fesm2015/tft-interact.mjs",
12
+ "module": "fesm2022/tft-interact.mjs",
19
13
  "typings": "index.d.ts",
20
14
  "exports": {
21
15
  "./package.json": {
@@ -23,12 +17,10 @@
23
17
  },
24
18
  ".": {
25
19
  "types": "./index.d.ts",
26
- "esm2020": "./esm2020/tft-interact.mjs",
27
- "es2020": "./fesm2020/tft-interact.mjs",
28
- "es2015": "./fesm2015/tft-interact.mjs",
29
- "node": "./fesm2015/tft-interact.mjs",
30
- "default": "./fesm2020/tft-interact.mjs"
20
+ "esm2022": "./esm2022/tft-interact.mjs",
21
+ "esm": "./esm2022/tft-interact.mjs",
22
+ "default": "./fesm2022/tft-interact.mjs"
31
23
  }
32
24
  },
33
25
  "sideEffects": false
34
- }
26
+ }
Binary file
@@ -1,56 +0,0 @@
1
- import { Directive, ElementRef, HostListener, Input } from '@angular/core';
2
- import { BehaviorSubject, Subject } from 'rxjs';
3
- import { scan, shareReplay } from 'rxjs/operators';
4
- import * as i0 from "@angular/core";
5
- ;
6
- /**
7
- * Use to apply scale to the element and tell the drag and resize directives to account for the scale when
8
- * @example <div tftAccountForScale [scale]="2.5"> <div tftDraggable> </div> </div>
9
- * @note if `dragRoot` is used this directive should be used on the same element to ensure that the drag
10
- * element accounts for scale
11
- */
12
- export class AutoScrollDirective {
13
- constructor(el) {
14
- this.el = el;
15
- /**
16
- * Limit minimum time between scroll events in milliseconds
17
- */
18
- this.autoScrollConfig = {
19
- margin: 50,
20
- distance: 3,
21
- interval: 50,
22
- speed: 300,
23
- enabled: true
24
- };
25
- this.scrollDeltaObserver = new Subject();
26
- const { scrollTop, scrollLeft } = el.nativeElement;
27
- this.scrollSubject = new BehaviorSubject({ scrollTop, scrollLeft });
28
- this.scrollObserver = this.scrollSubject.pipe(scan((previous, current) => {
29
- const scrollTop = current.scrollTop - previous.scrollTop;
30
- const scrollLeft = current.scrollLeft - previous.scrollLeft;
31
- this.scrollDeltaObserver.next({ scrollTop, scrollLeft });
32
- return current;
33
- }), shareReplay(1));
34
- this.scrollObserver.subscribe();
35
- }
36
- // this setup allows consumers to set x, y scale independently or just set them both with scale
37
- scroll(scrollEvent) {
38
- const target = scrollEvent.target;
39
- const { scrollTop, scrollLeft } = target;
40
- this.scrollSubject.next({ scrollTop, scrollLeft });
41
- }
42
- }
43
- AutoScrollDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: AutoScrollDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
44
- AutoScrollDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: AutoScrollDirective, selector: "[tftAutoScroll]", inputs: { autoScrollConfig: "autoScrollConfig" }, host: { listeners: { "scroll": "scroll($event)" } }, ngImport: i0 });
45
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: AutoScrollDirective, decorators: [{
46
- type: Directive,
47
- args: [{
48
- selector: '[tftAutoScroll]'
49
- }]
50
- }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { autoScrollConfig: [{
51
- type: Input
52
- }], scroll: [{
53
- type: HostListener,
54
- args: ['scroll', ['$event']]
55
- }] } });
56
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXV0by1zY3JvbGwuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9pbnRlcmFjdC9zcmMvbGliL2RpcmVjdGl2ZXMvYXV0by1zY3JvbGwuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsVUFBVSxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDM0UsT0FBTyxFQUFFLGVBQWUsRUFBYyxPQUFPLEVBQUUsTUFBTSxNQUFNLENBQUM7QUFDNUQsT0FBTyxFQUFFLElBQUksRUFBRSxXQUFXLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQzs7QUFFVyxDQUFDO0FBQy9EOzs7OztHQUtHO0FBSUgsTUFBTSxPQUFPLG1CQUFtQjtJQXNCOUIsWUFDUyxFQUFjO1FBQWQsT0FBRSxHQUFGLEVBQUUsQ0FBWTtRQXRCdkI7O1dBRUc7UUFDTSxxQkFBZ0IsR0FBRztZQUMxQixNQUFNLEVBQUUsRUFBRTtZQUNWLFFBQVEsRUFBRSxDQUFDO1lBQ1gsUUFBUSxFQUFFLEVBQUU7WUFDWixLQUFLLEVBQUUsR0FBRztZQUNWLE9BQU8sRUFBRSxJQUFJO1NBQ2QsQ0FBQztRQUdPLHdCQUFtQixHQUFHLElBQUksT0FBTyxFQUFnQixDQUFDO1FBWXpELE1BQU0sRUFBRSxTQUFTLEVBQUUsVUFBVSxFQUFFLEdBQUksRUFBRSxDQUFDLGFBQTZCLENBQUM7UUFDcEUsSUFBSSxDQUFDLGFBQWEsR0FBRyxJQUFJLGVBQWUsQ0FBQyxFQUFDLFNBQVMsRUFBRSxVQUFVLEVBQUMsQ0FBQyxDQUFDO1FBQ2xFLElBQUksQ0FBQyxjQUFjLEdBQUcsSUFBSSxDQUFDLGFBQWEsQ0FBQyxJQUFJLENBQzNDLElBQUksQ0FBQyxDQUFDLFFBQVEsRUFBRSxPQUFPLEVBQUUsRUFBRTtZQUN6QixNQUFNLFNBQVMsR0FBRyxPQUFPLENBQUMsU0FBUyxHQUFHLFFBQVEsQ0FBQyxTQUFTLENBQUM7WUFDekQsTUFBTSxVQUFVLEdBQUcsT0FBTyxDQUFDLFVBQVUsR0FBRyxRQUFRLENBQUMsVUFBVSxDQUFDO1lBQzVELElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxJQUFJLENBQUMsRUFBQyxTQUFTLEVBQUUsVUFBVSxFQUFDLENBQUMsQ0FBQztZQUN2RCxPQUFPLE9BQU8sQ0FBQztRQUNqQixDQUFDLENBQUMsRUFDRixXQUFXLENBQUMsQ0FBQyxDQUFDLENBQ2YsQ0FBQTtRQUNELElBQUksQ0FBQyxjQUFjLENBQUMsU0FBUyxFQUFFLENBQUM7SUFDbEMsQ0FBQztJQXZCRCwrRkFBK0Y7SUFDM0QsTUFBTSxDQUFDLFdBQWtCO1FBQzNELE1BQU0sTUFBTSxHQUFJLFdBQVcsQ0FBQyxNQUFzQixDQUFDO1FBQ25ELE1BQU0sRUFBRSxTQUFTLEVBQUUsVUFBVSxFQUFFLEdBQUcsTUFBTSxDQUFDO1FBQ3pDLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLEVBQUMsU0FBUyxFQUFFLFVBQVUsRUFBQyxDQUFDLENBQUE7SUFDbEQsQ0FBQzs7Z0hBbkJVLG1CQUFtQjtvR0FBbkIsbUJBQW1COzJGQUFuQixtQkFBbUI7a0JBSC9CLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLGlCQUFpQjtpQkFDNUI7aUdBS1UsZ0JBQWdCO3NCQUF4QixLQUFLO2dCQVc4QixNQUFNO3NCQUF6QyxZQUFZO3VCQUFDLFFBQVEsRUFBRSxDQUFDLFFBQVEsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgRWxlbWVudFJlZiwgSG9zdExpc3RlbmVyLCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQmVoYXZpb3JTdWJqZWN0LCBPYnNlcnZhYmxlLCBTdWJqZWN0IH0gZnJvbSAncnhqcyc7XG5pbXBvcnQgeyBzY2FuLCBzaGFyZVJlcGxheSB9IGZyb20gJ3J4anMvb3BlcmF0b3JzJztcblxuaW50ZXJmYWNlIFNjcm9sbE9iamVjdCB7c2Nyb2xsVG9wOiBudW1iZXIsIHNjcm9sbExlZnQ6IG51bWJlcn07XG4vKipcbiAqIFVzZSB0byBhcHBseSBzY2FsZSB0byB0aGUgZWxlbWVudCBhbmQgdGVsbCB0aGUgZHJhZyBhbmQgcmVzaXplIGRpcmVjdGl2ZXMgdG8gYWNjb3VudCBmb3IgdGhlIHNjYWxlIHdoZW5cbiAqIEBleGFtcGxlIDxkaXYgdGZ0QWNjb3VudEZvclNjYWxlIFtzY2FsZV09XCIyLjVcIj4gPGRpdiB0ZnREcmFnZ2FibGU+IDwvZGl2PiA8L2Rpdj5cbiAqIEBub3RlIGlmIGBkcmFnUm9vdGAgaXMgdXNlZCB0aGlzIGRpcmVjdGl2ZSBzaG91bGQgYmUgdXNlZCBvbiB0aGUgc2FtZSBlbGVtZW50IHRvIGVuc3VyZSB0aGF0IHRoZSBkcmFnXG4gKiBlbGVtZW50IGFjY291bnRzIGZvciBzY2FsZVxuICovXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdbdGZ0QXV0b1Njcm9sbF0nXG59KVxuZXhwb3J0IGNsYXNzIEF1dG9TY3JvbGxEaXJlY3RpdmUge1xuICAvKipcbiAgICogTGltaXQgbWluaW11bSB0aW1lIGJldHdlZW4gc2Nyb2xsIGV2ZW50cyBpbiBtaWxsaXNlY29uZHNcbiAgICovXG4gIEBJbnB1dCgpIGF1dG9TY3JvbGxDb25maWcgPSB7XG4gICAgbWFyZ2luOiA1MCxcbiAgICBkaXN0YW5jZTogMyxcbiAgICBpbnRlcnZhbDogNTAsXG4gICAgc3BlZWQ6IDMwMCxcbiAgICBlbmFibGVkOiB0cnVlXG4gIH07XG4gIHByaXZhdGUgc2Nyb2xsU3ViamVjdDogQmVoYXZpb3JTdWJqZWN0PFNjcm9sbE9iamVjdD47XG4gIHJlYWRvbmx5IHNjcm9sbE9ic2VydmVyOiBPYnNlcnZhYmxlPFNjcm9sbE9iamVjdD47XG4gIHJlYWRvbmx5IHNjcm9sbERlbHRhT2JzZXJ2ZXIgPSBuZXcgU3ViamVjdDxTY3JvbGxPYmplY3Q+KCk7XG4gIC8vIHRoaXMgc2V0dXAgYWxsb3dzIGNvbnN1bWVycyB0byBzZXQgeCwgeSBzY2FsZSBpbmRlcGVuZGVudGx5IG9yIGp1c3Qgc2V0IHRoZW0gYm90aCB3aXRoIHNjYWxlXG4gIEBIb3N0TGlzdGVuZXIoJ3Njcm9sbCcsIFsnJGV2ZW50J10pIHNjcm9sbChzY3JvbGxFdmVudDogRXZlbnQpIHtcbiAgICBjb25zdCB0YXJnZXQgPSAoc2Nyb2xsRXZlbnQudGFyZ2V0IGFzIEhUTUxFbGVtZW50KTtcbiAgICBjb25zdCB7IHNjcm9sbFRvcCwgc2Nyb2xsTGVmdCB9ID0gdGFyZ2V0O1xuICAgIHRoaXMuc2Nyb2xsU3ViamVjdC5uZXh0KHtzY3JvbGxUb3AsIHNjcm9sbExlZnR9KVxuICB9XG5cblxuICBjb25zdHJ1Y3RvcihcbiAgICBwdWJsaWMgZWw6IEVsZW1lbnRSZWZcbiAgKSB7XG4gICAgY29uc3QgeyBzY3JvbGxUb3AsIHNjcm9sbExlZnQgfSA9IChlbC5uYXRpdmVFbGVtZW50IGFzIEhUTUxFbGVtZW50KTtcbiAgICB0aGlzLnNjcm9sbFN1YmplY3QgPSBuZXcgQmVoYXZpb3JTdWJqZWN0KHtzY3JvbGxUb3AsIHNjcm9sbExlZnR9KTtcbiAgICB0aGlzLnNjcm9sbE9ic2VydmVyID0gdGhpcy5zY3JvbGxTdWJqZWN0LnBpcGUoXG4gICAgICBzY2FuKChwcmV2aW91cywgY3VycmVudCkgPT4ge1xuICAgICAgICBjb25zdCBzY3JvbGxUb3AgPSBjdXJyZW50LnNjcm9sbFRvcCAtIHByZXZpb3VzLnNjcm9sbFRvcDtcbiAgICAgICAgY29uc3Qgc2Nyb2xsTGVmdCA9IGN1cnJlbnQuc2Nyb2xsTGVmdCAtIHByZXZpb3VzLnNjcm9sbExlZnQ7XG4gICAgICAgIHRoaXMuc2Nyb2xsRGVsdGFPYnNlcnZlci5uZXh0KHtzY3JvbGxUb3AsIHNjcm9sbExlZnR9KTtcbiAgICAgICAgcmV0dXJuIGN1cnJlbnQ7XG4gICAgICB9KSxcbiAgICAgIHNoYXJlUmVwbGF5KDEpLFxuICAgIClcbiAgICB0aGlzLnNjcm9sbE9ic2VydmVyLnN1YnNjcmliZSgpO1xuICB9XG5cbn1cbiJdfQ==