@tft/interact 12.5.3 → 13.0.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.
- package/esm2020/index.mjs +6 -0
- package/esm2020/lib/directives/account-for-scale.directive.mjs +26 -0
- package/esm2020/lib/directives/apply-scale.directive.mjs +28 -0
- package/esm2020/lib/directives/auto-scroll.directive.mjs +56 -0
- package/esm2020/lib/directives/drag-preview.directive.mjs +20 -0
- package/esm2020/lib/directives/drag-root.directive.mjs +32 -0
- package/esm2020/lib/directives/draggable.directive.mjs +320 -0
- package/esm2020/lib/directives/dropzone.directive.mjs +114 -0
- package/esm2020/lib/directives/gesturable.directive.mjs +82 -0
- package/esm2020/lib/directives/index.mjs +10 -0
- package/esm2020/lib/directives/resizable.directive.mjs +228 -0
- package/esm2020/lib/interact.module.mjs +66 -0
- package/esm2020/lib/models/index.mjs +2 -0
- package/esm2020/lib/models/interact.mjs +28 -0
- package/esm2020/lib/pipes/array-of-n.pipe.mjs +22 -0
- package/esm2020/lib/pipes/index.mjs +2 -0
- package/esm2020/lib/services/interact.service.mjs +197 -0
- package/esm2020/lib/utils/helpers.mjs +35 -0
- package/esm2020/lib/utils/index.mjs +2 -0
- package/esm2020/tft-interact.mjs +5 -0
- package/fesm2015/{tft-interact.js → tft-interact.mjs} +355 -257
- package/fesm2015/tft-interact.mjs.map +1 -0
- package/fesm2020/tft-interact.mjs +1192 -0
- package/fesm2020/tft-interact.mjs.map +1 -0
- package/lib/directives/account-for-scale.directive.d.ts +3 -0
- package/lib/directives/apply-scale.directive.d.ts +3 -0
- package/lib/directives/auto-scroll.directive.d.ts +3 -0
- package/lib/directives/drag-preview.directive.d.ts +3 -0
- package/lib/directives/drag-root.directive.d.ts +3 -0
- package/lib/directives/draggable.directive.d.ts +3 -0
- package/lib/directives/dropzone.directive.d.ts +3 -0
- package/lib/directives/gesturable.directive.d.ts +3 -0
- package/lib/directives/resizable.directive.d.ts +3 -0
- package/lib/interact.module.d.ts +15 -0
- package/lib/pipes/array-of-n.pipe.d.ts +3 -0
- package/lib/services/interact.service.d.ts +3 -0
- package/package.json +23 -10
- package/tft-interact-13.0.0.tgz +0 -0
- package/tft-interact.d.ts +1 -2
- package/bundles/tft-interact.umd.js +0 -1526
- package/bundles/tft-interact.umd.js.map +0 -1
- package/esm2015/index.js +0 -6
- package/esm2015/index.js.map +0 -1
- package/esm2015/index.metadata.json +0 -1
- package/esm2015/lib/directives/account-for-scale.directive.js +0 -26
- package/esm2015/lib/directives/account-for-scale.directive.js.map +0 -1
- package/esm2015/lib/directives/account-for-scale.directive.metadata.json +0 -1
- package/esm2015/lib/directives/account-for-scale.directive.ngfactory.js.map +0 -1
- package/esm2015/lib/directives/apply-scale.directive.js +0 -26
- package/esm2015/lib/directives/apply-scale.directive.js.map +0 -1
- package/esm2015/lib/directives/apply-scale.directive.metadata.json +0 -1
- package/esm2015/lib/directives/apply-scale.directive.ngfactory.js.map +0 -1
- package/esm2015/lib/directives/auto-scroll.directive.js +0 -54
- package/esm2015/lib/directives/auto-scroll.directive.js.map +0 -1
- package/esm2015/lib/directives/auto-scroll.directive.metadata.json +0 -1
- package/esm2015/lib/directives/auto-scroll.directive.ngfactory.js.map +0 -1
- package/esm2015/lib/directives/drag-preview.directive.js +0 -20
- package/esm2015/lib/directives/drag-preview.directive.js.map +0 -1
- package/esm2015/lib/directives/drag-preview.directive.metadata.json +0 -1
- package/esm2015/lib/directives/drag-preview.directive.ngfactory.js.map +0 -1
- package/esm2015/lib/directives/drag-root.directive.js +0 -27
- package/esm2015/lib/directives/drag-root.directive.js.map +0 -1
- package/esm2015/lib/directives/drag-root.directive.metadata.json +0 -1
- package/esm2015/lib/directives/drag-root.directive.ngfactory.js.map +0 -1
- package/esm2015/lib/directives/draggable.directive.js +0 -286
- package/esm2015/lib/directives/draggable.directive.js.map +0 -1
- package/esm2015/lib/directives/draggable.directive.metadata.json +0 -1
- package/esm2015/lib/directives/draggable.directive.ngfactory.js.map +0 -1
- package/esm2015/lib/directives/dropzone.directive.js +0 -105
- package/esm2015/lib/directives/dropzone.directive.js.map +0 -1
- package/esm2015/lib/directives/dropzone.directive.metadata.json +0 -1
- package/esm2015/lib/directives/dropzone.directive.ngfactory.js.map +0 -1
- package/esm2015/lib/directives/gesturable.directive.js +0 -77
- package/esm2015/lib/directives/gesturable.directive.js.map +0 -1
- package/esm2015/lib/directives/gesturable.directive.metadata.json +0 -1
- package/esm2015/lib/directives/gesturable.directive.ngfactory.js.map +0 -1
- package/esm2015/lib/directives/index.js +0 -10
- package/esm2015/lib/directives/index.js.map +0 -1
- package/esm2015/lib/directives/index.metadata.json +0 -1
- package/esm2015/lib/directives/resizable.directive.js +0 -201
- package/esm2015/lib/directives/resizable.directive.js.map +0 -1
- package/esm2015/lib/directives/resizable.directive.metadata.json +0 -1
- package/esm2015/lib/directives/resizable.directive.ngfactory.js.map +0 -1
- package/esm2015/lib/interact.module.js +0 -43
- package/esm2015/lib/interact.module.js.map +0 -1
- package/esm2015/lib/interact.module.metadata.json +0 -1
- package/esm2015/lib/interact.module.ngfactory.js.map +0 -1
- package/esm2015/lib/models/index.js +0 -2
- package/esm2015/lib/models/index.js.map +0 -1
- package/esm2015/lib/models/index.metadata.json +0 -1
- package/esm2015/lib/models/interact.js +0 -28
- package/esm2015/lib/models/interact.js.map +0 -1
- package/esm2015/lib/models/interact.metadata.json +0 -1
- package/esm2015/lib/pipes/array-of-n.pipe.js +0 -18
- package/esm2015/lib/pipes/array-of-n.pipe.js.map +0 -1
- package/esm2015/lib/pipes/array-of-n.pipe.metadata.json +0 -1
- package/esm2015/lib/pipes/array-of-n.pipe.ngfactory.js.map +0 -1
- package/esm2015/lib/pipes/index.js +0 -2
- package/esm2015/lib/pipes/index.js.map +0 -1
- package/esm2015/lib/pipes/index.metadata.json +0 -1
- package/esm2015/lib/services/interact.service.js +0 -196
- package/esm2015/lib/services/interact.service.js.map +0 -1
- package/esm2015/lib/services/interact.service.metadata.json +0 -1
- package/esm2015/lib/services/interact.service.ngfactory.js.map +0 -1
- package/esm2015/lib/utils/helpers.js +0 -35
- package/esm2015/lib/utils/helpers.js.map +0 -1
- package/esm2015/lib/utils/helpers.metadata.json +0 -1
- package/esm2015/lib/utils/index.js +0 -2
- package/esm2015/lib/utils/index.js.map +0 -1
- package/esm2015/lib/utils/index.metadata.json +0 -1
- package/esm2015/tft-interact.js +0 -7
- package/esm2015/tft-interact.js.map +0 -1
- package/esm2015/tft-interact.metadata.json +0 -1
- package/fesm2015/tft-interact.js.map +0 -1
- package/tft-interact-12.5.3.tgz +0 -0
- package/tft-interact.metadata.json +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
[{"__symbolic":"module","version":4,"metadata":{},"exports":[{"from":"./draggable.directive"},{"from":"./dropzone.directive"},{"from":"./resizable.directive"},{"from":"./drag-preview.directive"},{"from":"./gesturable.directive"},{"from":"./drag-root.directive"},{"from":"./account-for-scale.directive"},{"from":"./apply-scale.directive"},{"from":"./auto-scroll.directive"}]}]
|
|
@@ -1,201 +0,0 @@
|
|
|
1
|
-
import { Directive, ElementRef, Input, Optional, SkipSelf, Output, EventEmitter, Renderer2, Inject } from '@angular/core';
|
|
2
|
-
import { DOCUMENT } from '@angular/common';
|
|
3
|
-
import interact from 'interactjs';
|
|
4
|
-
import { InteractService } from '../services/interact.service';
|
|
5
|
-
import { DraggableDirective } from './draggable.directive';
|
|
6
|
-
import { DropzoneDirective } from './dropzone.directive';
|
|
7
|
-
import { DragRootDirective } from './drag-root.directive';
|
|
8
|
-
import { AccountForScaleDirective } from './account-for-scale.directive';
|
|
9
|
-
import { DEFAULT_REGISTRY_ID } from '../models';
|
|
10
|
-
import { AutoScrollDirective } from './auto-scroll.directive';
|
|
11
|
-
/** @dynamic */
|
|
12
|
-
export class ResizableDirective {
|
|
13
|
-
constructor(el, _document, interactService, renderer, drag_root_dir, account_for_scale_dir, draggable_dir, dropzone_dir, auto_scroll_dir) {
|
|
14
|
-
var _a;
|
|
15
|
-
this.el = el;
|
|
16
|
-
this._document = _document;
|
|
17
|
-
this.interactService = interactService;
|
|
18
|
-
this.renderer = renderer;
|
|
19
|
-
this.drag_root_dir = drag_root_dir;
|
|
20
|
-
this.account_for_scale_dir = account_for_scale_dir;
|
|
21
|
-
this.draggable_dir = draggable_dir;
|
|
22
|
-
this.dropzone_dir = dropzone_dir;
|
|
23
|
-
this.auto_scroll_dir = auto_scroll_dir;
|
|
24
|
-
this.enableResizeDefault = true;
|
|
25
|
-
// TODO: should this be an input with default or should consuming user set display in styles each time
|
|
26
|
-
this.position = 'absolute';
|
|
27
|
-
this.resizeDisabled = false;
|
|
28
|
-
this.resizeStart = new EventEmitter();
|
|
29
|
-
this.resizeMove = new EventEmitter();
|
|
30
|
-
this.resizeInertiaStart = new EventEmitter();
|
|
31
|
-
this.resizeEnd = new EventEmitter();
|
|
32
|
-
this.defaultConfig = {
|
|
33
|
-
edges: { left: true, right: true, bottom: true, top: true }
|
|
34
|
-
};
|
|
35
|
-
this.activeEdges = { left: false, right: false, top: false, bottom: false };
|
|
36
|
-
this.dragRootEl = ((_a = drag_root_dir === null || drag_root_dir === void 0 ? void 0 : drag_root_dir.el) === null || _a === void 0 ? void 0 : _a.nativeElement) || this._document.body;
|
|
37
|
-
}
|
|
38
|
-
get scale() {
|
|
39
|
-
var _a, _b, _c;
|
|
40
|
-
return ((_a = this.account_for_scale_dir) === null || _a === void 0 ? void 0 : _a.scale) || ((_c = (_b = this.drag_root_dir) === null || _b === void 0 ? void 0 : _b.account_for_scale_dir) === null || _c === void 0 ? void 0 : _c.scale);
|
|
41
|
-
}
|
|
42
|
-
ngOnInit() {
|
|
43
|
-
var _a, _b;
|
|
44
|
-
this.addResizePropertiesToElement(this.el.nativeElement);
|
|
45
|
-
// we check for a dropzone, we use its id as the registry id if there is on
|
|
46
|
-
// otherwise, we use DEFAULT_REGISTRY_ID as a registry id. This allows us to keep our interactable
|
|
47
|
-
// drag state organized by dropzones.
|
|
48
|
-
this.registryId = ((_a = this.dropzone_dir) === null || _a === void 0 ? void 0 : _a.dropzoneId) || DEFAULT_REGISTRY_ID;
|
|
49
|
-
this.interactableId = ((_b = this.draggable_dir) === null || _b === void 0 ? void 0 : _b.interactableId) || this.interactService.addDraggableToRegistry(this.registryId, this.interactableId);
|
|
50
|
-
this.interactable = this.initiateResizeEvents(Object.assign(Object.assign({}, this.defaultConfig), this.resizeConfig), this.el.nativeElement);
|
|
51
|
-
this.alignDimensionsWithInputs(this.width, this.height);
|
|
52
|
-
this.interactableSubscription = this.interactService
|
|
53
|
-
.getInteractableState(this.interactableId, this.registryId)
|
|
54
|
-
.subscribe();
|
|
55
|
-
}
|
|
56
|
-
ngOnChanges(changes) {
|
|
57
|
-
if ((changes.resizeConfig || changes.resizeDisabled) && this.interactable) {
|
|
58
|
-
this.interactable.resizable(Object.assign(Object.assign({}, this.resizeConfig), { enabled: !this.resizeDisabled }));
|
|
59
|
-
}
|
|
60
|
-
if (changes.width || changes.height) {
|
|
61
|
-
this.alignDimensionsWithInputs(this.width, this.height);
|
|
62
|
-
}
|
|
63
|
-
}
|
|
64
|
-
ngOnDestroy() {
|
|
65
|
-
this.interactableSubscription.unsubscribe();
|
|
66
|
-
this.interactService.destroyInteractable(this.interactableId, this.registryId);
|
|
67
|
-
}
|
|
68
|
-
resizeListener(event) {
|
|
69
|
-
const element = this.el.nativeElement;
|
|
70
|
-
const scale = this.scale;
|
|
71
|
-
const { deltaRect } = event;
|
|
72
|
-
const deltaX = deltaRect.left / scale;
|
|
73
|
-
const deltaY = deltaRect.top / scale;
|
|
74
|
-
// We get the width and height directly from the native element because
|
|
75
|
-
// the event dimension can get out of sync when resizing with autoScroll
|
|
76
|
-
const rect = element.getBoundingClientRect();
|
|
77
|
-
const width = (rect.width + deltaRect.width) / scale;
|
|
78
|
-
const height = (rect.height + deltaRect.height) / scale;
|
|
79
|
-
this.interactService.updateSize(this.interactableId, this.registryId, { deltaX, deltaY, width, height }, this.el.nativeElement);
|
|
80
|
-
}
|
|
81
|
-
/**
|
|
82
|
-
* hook elements into interacts resize event listeners
|
|
83
|
-
* we spread the configs so that the consuming component only overwrites the
|
|
84
|
-
* pieces that it explicitly indicates
|
|
85
|
-
* @param resizeConfig
|
|
86
|
-
* @param nativeElement
|
|
87
|
-
*/
|
|
88
|
-
initiateResizeEvents(resizeConfig, nativeElement) {
|
|
89
|
-
var _a;
|
|
90
|
-
// TODO: This should try and get interactable from tft_draggable if it exists
|
|
91
|
-
const defaultResizeConfig = Object.assign(Object.assign(Object.assign({}, resizeConfig), { enabled: !this.resizeDisabled }), (this.auto_scroll_dir && {
|
|
92
|
-
autoScroll: Object.assign(Object.assign({}, this.auto_scroll_dir.autoScrollConfig), { container: this.auto_scroll_dir.el.nativeElement })
|
|
93
|
-
}));
|
|
94
|
-
const interactable = ((_a = this.draggable_dir) === null || _a === void 0 ? void 0 : _a.interactable) || interact(nativeElement);
|
|
95
|
-
return interactable.resizable(defaultResizeConfig)
|
|
96
|
-
.on('resizestart', (event) => {
|
|
97
|
-
this.activeEdges = event.edges;
|
|
98
|
-
if (this.auto_scroll_dir) {
|
|
99
|
-
this.subscribeToScrollEvents();
|
|
100
|
-
}
|
|
101
|
-
this.resizeStart.emit(this.mapResizeEvent(event));
|
|
102
|
-
})
|
|
103
|
-
.on('resizemove', (event) => {
|
|
104
|
-
if (this.enableResizeDefault) {
|
|
105
|
-
this.resizeListener(event);
|
|
106
|
-
}
|
|
107
|
-
const mappedEvent = this.mapResizeEvent(event);
|
|
108
|
-
this.resizeMove.emit(mappedEvent);
|
|
109
|
-
})
|
|
110
|
-
.on('resizeinertiastart', (event) => this.resizeInertiaStart.emit(this.mapResizeEvent(event)))
|
|
111
|
-
.on('resizeend', (event) => {
|
|
112
|
-
if (this.auto_scroll_dir) {
|
|
113
|
-
this.scrollEventsSubscription.unsubscribe();
|
|
114
|
-
}
|
|
115
|
-
this.activeEdges = { left: false, right: false, top: false, bottom: false };
|
|
116
|
-
this.resizeEnd.emit(this.mapResizeEvent(event));
|
|
117
|
-
});
|
|
118
|
-
}
|
|
119
|
-
mapResizeEvent(event) {
|
|
120
|
-
var _a, _b;
|
|
121
|
-
const target = this.el.nativeElement;
|
|
122
|
-
const relatedTarget = (_b = (_a = this.draggable_dir) === null || _a === void 0 ? void 0 : _a.dropzone_dir) === null || _b === void 0 ? void 0 : _b.el.nativeElement;
|
|
123
|
-
const scale = this.scale;
|
|
124
|
-
const positionInDropTarget = target && relatedTarget
|
|
125
|
-
? this.interactService.calculatePositionInElement(relatedTarget, target, scale)
|
|
126
|
-
: null;
|
|
127
|
-
return {
|
|
128
|
-
interactEvent: event,
|
|
129
|
-
resizeRef: this,
|
|
130
|
-
dragRef: this.draggable_dir,
|
|
131
|
-
dragOrigin: this.dropzone_dir,
|
|
132
|
-
dropTarget: this.el.nativeElement.dropTarget,
|
|
133
|
-
positionInDropTarget,
|
|
134
|
-
size: {
|
|
135
|
-
width: target.clientWidth / scale,
|
|
136
|
-
height: target.clientHeight / scale
|
|
137
|
-
}
|
|
138
|
-
};
|
|
139
|
-
}
|
|
140
|
-
alignDimensionsWithInputs(width, height) {
|
|
141
|
-
this.interactService.updateSize(this.interactableId, this.registryId, { deltaX: 0, deltaY: 0, width, height }, this.el.nativeElement);
|
|
142
|
-
}
|
|
143
|
-
addResizePropertiesToElement(nativeElement) {
|
|
144
|
-
this.renderer.setProperty(nativeElement, 'resizeRef', this);
|
|
145
|
-
}
|
|
146
|
-
subscribeToScrollEvents() {
|
|
147
|
-
this.scrollEventsSubscription = this.auto_scroll_dir.scrollDeltaObserver.subscribe(({ scrollLeft, scrollTop }) => {
|
|
148
|
-
const scale = this.scale;
|
|
149
|
-
const target = this.el.nativeElement;
|
|
150
|
-
const { width: prevWidth, height: prevHeight } = target.getBoundingClientRect();
|
|
151
|
-
const deltaHeight = scrollTop * (this.activeEdges.top ? -1 : this.activeEdges.bottom ? 1 : 0);
|
|
152
|
-
const deltaWidth = scrollLeft * (this.activeEdges.left ? -1 : this.activeEdges.right ? 1 : 0);
|
|
153
|
-
const height = (prevHeight + deltaHeight) / scale;
|
|
154
|
-
const width = (prevWidth + deltaWidth) / scale;
|
|
155
|
-
const deltaX = this.activeEdges.left ? (scrollLeft / scale) : 0;
|
|
156
|
-
const deltaY = this.activeEdges.top ? (scrollTop / scale) : 0;
|
|
157
|
-
this.interactService.updateSize(this.interactableId, this.registryId, { deltaX, deltaY, width, height }, this.el.nativeElement);
|
|
158
|
-
});
|
|
159
|
-
}
|
|
160
|
-
}
|
|
161
|
-
ResizableDirective.decorators = [
|
|
162
|
-
{ type: Directive, args: [{
|
|
163
|
-
selector: '[tftResizable]',
|
|
164
|
-
// eslint-disable-next-line @angular-eslint/no-host-metadata-property
|
|
165
|
-
host: {
|
|
166
|
-
// prevents touch events from colliding with with mouse events
|
|
167
|
-
// on touch screen
|
|
168
|
-
'[style.touchAction]': 'this.resizeDisabled ? "auto" : "none"',
|
|
169
|
-
// default to absolute here to accommodate likely use cases
|
|
170
|
-
// consuming component can easily over ride with position input
|
|
171
|
-
'[style.position]': 'position',
|
|
172
|
-
// follows interactjs suggested practices
|
|
173
|
-
'[style.boxSizing]': '"border-box"',
|
|
174
|
-
}
|
|
175
|
-
},] }
|
|
176
|
-
];
|
|
177
|
-
ResizableDirective.ctorParameters = () => [
|
|
178
|
-
{ type: ElementRef },
|
|
179
|
-
{ type: Document, decorators: [{ type: Inject, args: [DOCUMENT,] }] },
|
|
180
|
-
{ type: InteractService },
|
|
181
|
-
{ type: Renderer2 },
|
|
182
|
-
{ type: DragRootDirective, decorators: [{ type: Optional }] },
|
|
183
|
-
{ type: AccountForScaleDirective, decorators: [{ type: Optional }] },
|
|
184
|
-
{ type: DraggableDirective, decorators: [{ type: Optional }] },
|
|
185
|
-
{ type: DropzoneDirective, decorators: [{ type: Optional }, { type: SkipSelf }] },
|
|
186
|
-
{ type: AutoScrollDirective, decorators: [{ type: Optional }, { type: SkipSelf }] }
|
|
187
|
-
];
|
|
188
|
-
ResizableDirective.propDecorators = {
|
|
189
|
-
enableResizeDefault: [{ type: Input }],
|
|
190
|
-
position: [{ type: Input }],
|
|
191
|
-
resizeConfig: [{ type: Input }],
|
|
192
|
-
interactableId: [{ type: Input }],
|
|
193
|
-
width: [{ type: Input }],
|
|
194
|
-
height: [{ type: Input }],
|
|
195
|
-
resizeDisabled: [{ type: Input }],
|
|
196
|
-
resizeStart: [{ type: Output }],
|
|
197
|
-
resizeMove: [{ type: Output }],
|
|
198
|
-
resizeInertiaStart: [{ type: Output }],
|
|
199
|
-
resizeEnd: [{ type: Output }]
|
|
200
|
-
};
|
|
201
|
-
//# sourceMappingURL=resizable.directive.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"resizable.directive.js","sourceRoot":"","sources":["../../../../../../libs/interact/src/lib/directives/resizable.directive.ts"],"names":[],"mappings":"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","sourcesContent":["import { Directive, OnInit, OnDestroy, ElementRef, Input, Optional, SkipSelf, Output, EventEmitter, OnChanges, SimpleChanges, Renderer2, Inject} from '@angular/core';\nimport { DOCUMENT } from '@angular/common';\nimport interact from 'interactjs';\nimport { InteractService } from '../services/interact.service';\nimport { ResizableOptions, ResizeEvent, Interactable } from '@interactjs/types/index';\nimport { Subscription } from 'rxjs';\nimport { DraggableDirective } from './draggable.directive';\nimport { DropzoneDirective } from './dropzone.directive';\nimport { DragRootDirective } from './drag-root.directive';\nimport { AccountForScaleDirective } from './account-for-scale.directive';\nimport { NgResizeEvent, TftResizeEvent, DEFAULT_REGISTRY_ID, TftDragElement } from '../models';\nimport { AutoScrollDirective } from './auto-scroll.directive';\n\ninterface ActiveEdges {\n top: boolean;\n bottom: boolean;\n left: boolean;\n right: boolean;\n}\n/** @dynamic */\n@Directive({\n selector: '[tftResizable]',\n // eslint-disable-next-line @angular-eslint/no-host-metadata-property\n host: {\n // prevents touch events from colliding with with mouse events\n // on touch screen\n '[style.touchAction]': 'this.resizeDisabled ? \"auto\" : \"none\"',\n // default to absolute here to accommodate likely use cases\n // consuming component can easily over ride with position input\n '[style.position]': 'position',\n // follows interactjs suggested practices\n '[style.boxSizing]': '\"border-box\"',\n\n }\n})\nexport class ResizableDirective implements OnInit, OnDestroy, OnChanges {\n\n @Input() enableResizeDefault = true;\n // TODO: should this be an input with default or should consuming user set display in styles each time\n @Input() position = 'absolute';\n @Input() resizeConfig: Partial<Interact.OrBoolean<ResizableOptions>>;\n @Input() interactableId: string;\n\n @Input() width: number;\n @Input() height: number;\n @Input() resizeDisabled = false;\n\n @Output() resizeStart = new EventEmitter<TftResizeEvent>();\n @Output() resizeMove = new EventEmitter<TftResizeEvent>();\n @Output() resizeInertiaStart = new EventEmitter<TftResizeEvent>();\n @Output() resizeEnd = new EventEmitter<TftResizeEvent>();\n\n defaultConfig: Partial<Interact.OrBoolean<ResizableOptions>> = {\n edges: { left: true, right: true, bottom: true, top: true }\n };\n registryId: string;\n interactable: Interactable;\n // The\n dragRootEl: HTMLElement;\n\n private activeEdges: ActiveEdges = {left: false, right: false, top: false, bottom: false}\n private interactableSubscription: Subscription;\n private scrollEventsSubscription: Subscription;\n\n get scale(): number {\n return this.account_for_scale_dir?.scale || this.drag_root_dir?.account_for_scale_dir?.scale;\n }\n\n constructor(\n public el: ElementRef,\n @Inject(DOCUMENT) private _document: Document,\n private interactService: InteractService,\n private renderer: Renderer2,\n @Optional() private drag_root_dir?: DragRootDirective,\n @Optional() public account_for_scale_dir?: AccountForScaleDirective,\n @Optional() private draggable_dir?: DraggableDirective,\n @Optional() @SkipSelf() private dropzone_dir?: DropzoneDirective,\n @Optional() @SkipSelf() public auto_scroll_dir?: AutoScrollDirective\n\n\n ) {\n this.dragRootEl = (drag_root_dir?.el?.nativeElement as HTMLElement) || this._document.body;\n }\n\n ngOnInit() {\n this.addResizePropertiesToElement(this.el.nativeElement);\n\n // we check for a dropzone, we use its id as the registry id if there is on\n // otherwise, we use DEFAULT_REGISTRY_ID as a registry id. This allows us to keep our interactable\n // drag state organized by dropzones.\n this.registryId = this.dropzone_dir?.dropzoneId || DEFAULT_REGISTRY_ID;\n\n this.interactableId = this.draggable_dir?.interactableId || this.interactService.addDraggableToRegistry(this.registryId, this.interactableId);\n\n this.interactable = this.initiateResizeEvents(\n {...this.defaultConfig, ...this.resizeConfig },\n this.el.nativeElement\n );\n\n this.alignDimensionsWithInputs(this.width, this.height);\n\n this.interactableSubscription = this.interactService\n .getInteractableState(this.interactableId, this.registryId)\n .subscribe();\n }\n\n ngOnChanges(changes: SimpleChanges) {\n if ((changes.resizeConfig || changes.resizeDisabled) && this.interactable) {\n this.interactable.resizable({...this.resizeConfig, enabled: !this.resizeDisabled,});\n }\n if (changes.width || changes.height) {\n this.alignDimensionsWithInputs(this.width, this.height);\n }\n }\n\n ngOnDestroy() {\n this.interactableSubscription.unsubscribe();\n this.interactService.destroyInteractable(this.interactableId, this.registryId);\n }\n\n resizeListener(event: ResizeEvent) {\n const element: TftDragElement = this.el.nativeElement;\n const scale = this.scale;\n const {deltaRect} = event;\n const deltaX = deltaRect.left/scale;\n const deltaY = deltaRect.top/scale;\n // We get the width and height directly from the native element because\n // the event dimension can get out of sync when resizing with autoScroll\n const rect = element.getBoundingClientRect();\n const width = (rect.width + deltaRect.width)/scale;\n const height = (rect.height + deltaRect.height)/scale;\n\n this.interactService.updateSize(\n this.interactableId,\n this.registryId,\n {deltaX, deltaY, width, height},\n this.el.nativeElement\n );\n }\n /**\n * hook elements into interacts resize event listeners\n * we spread the configs so that the consuming component only overwrites the\n * pieces that it explicitly indicates\n * @param resizeConfig\n * @param nativeElement\n */\n initiateResizeEvents(resizeConfig: Partial<Interact.OrBoolean<ResizableOptions>>, nativeElement: TftDragElement) {\n // TODO: This should try and get interactable from tft_draggable if it exists\n const defaultResizeConfig = {\n ...resizeConfig,\n enabled: !this.resizeDisabled,\n ...(this.auto_scroll_dir && {\n autoScroll: {\n ...this.auto_scroll_dir.autoScrollConfig,\n container: this.auto_scroll_dir.el.nativeElement as HTMLElement\n }\n })\n };\n const interactable = this.draggable_dir?.interactable || interact(nativeElement);\n return interactable.resizable(defaultResizeConfig)\n .on('resizestart', (event: NgResizeEvent) => {\n this.activeEdges = event.edges as ActiveEdges;\n if (this.auto_scroll_dir) {\n this.subscribeToScrollEvents();\n }\n this.resizeStart.emit(this.mapResizeEvent(event))\n })\n .on('resizemove', (event: NgResizeEvent) => {\n if (this.enableResizeDefault) {\n this.resizeListener(event)\n }\n const mappedEvent = this.mapResizeEvent(event);\n this.resizeMove.emit(mappedEvent)\n })\n .on('resizeinertiastart', (event: NgResizeEvent) => this.resizeInertiaStart.emit(this.mapResizeEvent(event)))\n .on('resizeend', (event: NgResizeEvent) => {\n if (this.auto_scroll_dir) {\n this.scrollEventsSubscription.unsubscribe();\n }\n this.activeEdges = {left: false, right: false, top: false, bottom: false}\n\n this.resizeEnd.emit(this.mapResizeEvent(event));\n });\n }\n\n mapResizeEvent(event: NgResizeEvent ): TftResizeEvent {\n const target = this.el.nativeElement as TftDragElement;\n const relatedTarget = this.draggable_dir?.dropzone_dir?.el.nativeElement;\n const scale = this.scale;\n const positionInDropTarget = target && relatedTarget\n ? this.interactService.calculatePositionInElement(relatedTarget, target, scale)\n : null;\n return {\n interactEvent: event,\n resizeRef: this,\n dragRef: this.draggable_dir,\n dragOrigin: this.dropzone_dir,\n dropTarget: this.el.nativeElement.dropTarget,\n positionInDropTarget,\n size: {\n width: target.clientWidth / scale,\n height: target.clientHeight / scale\n }\n }\n }\n\n alignDimensionsWithInputs(width: number, height: number) {\n this.interactService.updateSize(\n this.interactableId,\n this.registryId,\n {deltaX: 0, deltaY: 0, width, height},\n this.el.nativeElement\n );\n }\n\n addResizePropertiesToElement(nativeElement: TftDragElement) {\n this.renderer.setProperty(nativeElement, 'resizeRef', this);\n }\n\n subscribeToScrollEvents() {\n this.scrollEventsSubscription = this.auto_scroll_dir.scrollDeltaObserver.subscribe(({scrollLeft, scrollTop}) => {\n const scale = this.scale;\n const target = this.el.nativeElement as HTMLElement;\n const {width: prevWidth, height: prevHeight} = target.getBoundingClientRect();\n\n const deltaHeight = scrollTop * (this.activeEdges.top ? -1 : this.activeEdges.bottom ? 1 : 0);\n const deltaWidth = scrollLeft * (this.activeEdges.left ? -1 : this.activeEdges.right ? 1 : 0);\n\n const height = (prevHeight + deltaHeight) / scale;\n const width = (prevWidth + deltaWidth) / scale;\n const deltaX = this.activeEdges.left ? (scrollLeft / scale) : 0;\n const deltaY = this.activeEdges.top ? (scrollTop / scale) : 0;\n this.interactService.updateSize(\n this.interactableId,\n this.registryId,\n {deltaX, deltaY, width, height},\n this.el.nativeElement as HTMLElement\n );\n });\n }\n}\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
[{"__symbolic":"module","version":4,"metadata":{"ResizableDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":20,"character":1},"arguments":[{"selector":"[tftResizable]","host":{"[style.touchAction]":"this.resizeDisabled ? \"auto\" : \"none\"","[style.position]":"position","[style.boxSizing]":"\"border-box\"","$quoted$":["[style.touchAction]","[style.position]","[style.boxSizing]"]}}]}],"members":{"enableResizeDefault":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"position":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":3}}]}],"resizeConfig":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3}}]}],"interactableId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"width":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":3}}]}],"height":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":44,"character":3}}]}],"resizeDisabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":45,"character":3}}]}],"resizeStart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":47,"character":3}}]}],"resizeMove":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":48,"character":3}}]}],"resizeInertiaStart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":49,"character":3}}]}],"resizeEnd":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":50,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":70,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":70,"character":12}]}],null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":73,"character":5}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":74,"character":5}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":75,"character":5}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":76,"character":5}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf","line":76,"character":17}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":77,"character":5}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf","line":77,"character":17}}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":69,"character":15},{"__symbolic":"error","message":"Could not resolve type","line":70,"character":41,"context":{"typeName":"Document"}},{"__symbolic":"reference","module":"../services/interact.service","name":"InteractService","line":71,"character":29},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":72,"character":22},{"__symbolic":"reference","module":"./drag-root.directive","name":"DragRootDirective","line":73,"character":40},{"__symbolic":"reference","module":"./account-for-scale.directive","name":"AccountForScaleDirective","line":74,"character":47},{"__symbolic":"reference","module":"./draggable.directive","name":"DraggableDirective","line":75,"character":40},{"__symbolic":"reference","module":"./dropzone.directive","name":"DropzoneDirective","line":76,"character":51},{"__symbolic":"reference","module":"./auto-scroll.directive","name":"AutoScrollDirective","line":77,"character":53}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"resizeListener":[{"__symbolic":"method"}],"initiateResizeEvents":[{"__symbolic":"method"}],"mapResizeEvent":[{"__symbolic":"method"}],"alignDimensionsWithInputs":[{"__symbolic":"method"}],"addResizePropertiesToElement":[{"__symbolic":"method"}],"subscribeToScrollEvents":[{"__symbolic":"method"}]}}}}]
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"resizable.directive.ngfactory.js","sourceRoot":"","sources":["../../../../../../libs/interact/src/lib/directives/resizable.directive.ngfactory.ts"],"names":[],"mappings":"","sourcesContent":["import * as i0 from '@angular/core';\ni0.ComponentFactory;\n"]}
|
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
import { NgModule } from '@angular/core';
|
|
2
|
-
import { CommonModule } from '@angular/common';
|
|
3
|
-
import { ArrayOfNPipe } from './pipes/array-of-n.pipe';
|
|
4
|
-
import { ApplyScaleDirective, DraggableDirective, DragRootDirective, AutoScrollDirective, AccountForScaleDirective, GesturableDirective, ResizableDirective, DropzoneDirective, DragPreviewDirective } from './directives';
|
|
5
|
-
import { InteractService } from './services/interact.service';
|
|
6
|
-
import { INTERACT_ROOT_CONFIG } from './models';
|
|
7
|
-
const EXPORTS = [
|
|
8
|
-
DraggableDirective,
|
|
9
|
-
ResizableDirective,
|
|
10
|
-
DropzoneDirective,
|
|
11
|
-
GesturableDirective,
|
|
12
|
-
DragRootDirective,
|
|
13
|
-
AutoScrollDirective,
|
|
14
|
-
AccountForScaleDirective,
|
|
15
|
-
ApplyScaleDirective,
|
|
16
|
-
DragPreviewDirective,
|
|
17
|
-
ArrayOfNPipe,
|
|
18
|
-
];
|
|
19
|
-
export class InteractModule {
|
|
20
|
-
static forRoot(config) {
|
|
21
|
-
const defaultConfig = { cssDimensionUnit: 'px' };
|
|
22
|
-
return {
|
|
23
|
-
ngModule: InteractModule,
|
|
24
|
-
providers: [
|
|
25
|
-
{ provide: INTERACT_ROOT_CONFIG, useValue: Object.assign(Object.assign({}, defaultConfig), config) },
|
|
26
|
-
InteractService
|
|
27
|
-
]
|
|
28
|
-
};
|
|
29
|
-
}
|
|
30
|
-
}
|
|
31
|
-
InteractModule.decorators = [
|
|
32
|
-
{ type: NgModule, args: [{
|
|
33
|
-
imports: [CommonModule],
|
|
34
|
-
// providers: [{ provide: INTERACT_ROOT_CONFIG, useValue: 'px' }],
|
|
35
|
-
declarations: [
|
|
36
|
-
...EXPORTS,
|
|
37
|
-
],
|
|
38
|
-
exports: [
|
|
39
|
-
...EXPORTS
|
|
40
|
-
]
|
|
41
|
-
},] }
|
|
42
|
-
];
|
|
43
|
-
//# sourceMappingURL=interact.module.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"interact.module.js","sourceRoot":"","sources":["../../../../../libs/interact/src/lib/interact.module.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9D,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AACvD,OAAO,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAC3N,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAC9D,OAAO,EAAsB,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAIpE,MAAM,OAAO,GAAG;IACd,kBAAkB;IAClB,kBAAkB;IAClB,iBAAiB;IACjB,mBAAmB;IACnB,iBAAiB;IACjB,mBAAmB;IACnB,wBAAwB;IACxB,mBAAmB;IACnB,oBAAoB;IACpB,YAAY;CACb,CAAC;AAaF,MAAM,OAAO,cAAc;IACzB,MAAM,CAAC,OAAO,CAAC,MAA0B;QACvC,MAAM,aAAa,GAAuB,EAAC,gBAAgB,EAAE,IAAI,EAAC,CAAA;QAClE,OAAO;YACL,QAAQ,EAAE,cAAc;YACxB,SAAS,EAAE;gBACT,EAAE,OAAO,EAAE,oBAAoB,EAAE,QAAQ,kCAAM,aAAa,GAAK,MAAM,CAAC,EAAE;gBAC1E,eAAe;aAChB;SACF,CAAC;IACJ,CAAC;;;YApBF,QAAQ,SAAC;gBACR,OAAO,EAAE,CAAC,YAAY,CAAC;gBACvB,kEAAkE;gBAClE,YAAY,EAAE;oBACZ,GAAG,OAAO;iBACX;gBACD,OAAO,EAAE;oBACP,GAAG,OAAO;iBACX;aACF","sourcesContent":["import { ModuleWithProviders, NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ArrayOfNPipe } from './pipes/array-of-n.pipe';\nimport { ApplyScaleDirective, DraggableDirective, DragRootDirective, AutoScrollDirective, AccountForScaleDirective, GesturableDirective, ResizableDirective, DropzoneDirective, DragPreviewDirective } from './directives';\nimport { InteractService } from './services/interact.service';\nimport { InteractRootConfig, INTERACT_ROOT_CONFIG } from './models';\n\n\n\nconst EXPORTS = [\n DraggableDirective,\n ResizableDirective,\n DropzoneDirective,\n GesturableDirective,\n DragRootDirective,\n AutoScrollDirective,\n AccountForScaleDirective,\n ApplyScaleDirective,\n DragPreviewDirective,\n ArrayOfNPipe,\n];\n\n\n@NgModule({\n imports: [CommonModule],\n // providers: [{ provide: INTERACT_ROOT_CONFIG, useValue: 'px' }],\n declarations: [\n ...EXPORTS,\n ],\n exports: [\n ...EXPORTS\n ]\n})\nexport class InteractModule {\n static forRoot(config: InteractRootConfig): ModuleWithProviders<InteractModule> {\n const defaultConfig: InteractRootConfig = {cssDimensionUnit: 'px'}\n return {\n ngModule: InteractModule,\n providers: [\n { provide: INTERACT_ROOT_CONFIG, useValue: {...defaultConfig, ...config} },\n InteractService\n ]\n };\n }\n}\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
[{"__symbolic":"module","version":4,"metadata":{"InteractModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":23,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":24,"character":12}],"declarations":[{"__symbolic":"reference","module":"./directives","name":"DraggableDirective","line":10,"character":2},{"__symbolic":"reference","module":"./directives","name":"ResizableDirective","line":11,"character":2},{"__symbolic":"reference","module":"./directives","name":"DropzoneDirective","line":12,"character":2},{"__symbolic":"reference","module":"./directives","name":"GesturableDirective","line":13,"character":2},{"__symbolic":"reference","module":"./directives","name":"DragRootDirective","line":14,"character":2},{"__symbolic":"reference","module":"./directives","name":"AutoScrollDirective","line":15,"character":2},{"__symbolic":"reference","module":"./directives","name":"AccountForScaleDirective","line":16,"character":2},{"__symbolic":"reference","module":"./directives","name":"ApplyScaleDirective","line":17,"character":2},{"__symbolic":"reference","module":"./directives","name":"DragPreviewDirective","line":18,"character":2},{"__symbolic":"reference","module":"./pipes/array-of-n.pipe","name":"ArrayOfNPipe","line":19,"character":2}],"exports":[{"__symbolic":"reference","module":"./directives","name":"DraggableDirective","line":10,"character":2},{"__symbolic":"reference","module":"./directives","name":"ResizableDirective","line":11,"character":2},{"__symbolic":"reference","module":"./directives","name":"DropzoneDirective","line":12,"character":2},{"__symbolic":"reference","module":"./directives","name":"GesturableDirective","line":13,"character":2},{"__symbolic":"reference","module":"./directives","name":"DragRootDirective","line":14,"character":2},{"__symbolic":"reference","module":"./directives","name":"AutoScrollDirective","line":15,"character":2},{"__symbolic":"reference","module":"./directives","name":"AccountForScaleDirective","line":16,"character":2},{"__symbolic":"reference","module":"./directives","name":"ApplyScaleDirective","line":17,"character":2},{"__symbolic":"reference","module":"./directives","name":"DragPreviewDirective","line":18,"character":2},{"__symbolic":"reference","module":"./pipes/array-of-n.pipe","name":"ArrayOfNPipe","line":19,"character":2}]}]}]}}}]
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"interact.module.ngfactory.js","sourceRoot":"","sources":["../../../../../libs/interact/src/lib/interact.module.ngfactory.ts"],"names":[],"mappings":"","sourcesContent":["import * as i0 from '@angular/core';\nimport * as i1 from './interact.module';\nimport * as i2 from '@angular/common';\nimport * as i3 from './directives/draggable.directive';\nimport * as i4 from './directives/resizable.directive';\nimport * as i5 from './directives/dropzone.directive';\nimport * as i6 from './directives/gesturable.directive';\nimport * as i7 from './directives/drag-root.directive';\nimport * as i8 from './directives/auto-scroll.directive';\nimport * as i9 from './directives/account-for-scale.directive';\nimport * as i10 from './directives/apply-scale.directive';\nimport * as i11 from './directives/drag-preview.directive';\nimport * as i12 from './pipes/array-of-n.pipe';\nexport const InteractModuleNgFactory:i0.NgModuleFactory<i1.InteractModule> = (null as any);\nvar _decl0_0:i2.NgClass = (<any>(null as any));\nvar _decl0_1:i2.NgComponentOutlet = (<any>(null as any));\nvar _decl0_2:i2.NgForOf<any,any> = (<any>(null as any));\nvar _decl0_3:i2.NgIf<any> = (<any>(null as any));\nvar _decl0_4:i2.NgTemplateOutlet = (<any>(null as any));\nvar _decl0_5:i2.NgStyle = (<any>(null as any));\nvar _decl0_6:i2.NgSwitch = (<any>(null as any));\nvar _decl0_7:i2.NgSwitchCase = (<any>(null as any));\nvar _decl0_8:i2.NgSwitchDefault = (<any>(null as any));\nvar _decl0_9:i2.NgPlural = (<any>(null as any));\nvar _decl0_10:i2.NgPluralCase = (<any>(null as any));\nvar _decl0_11:i3.DraggableDirective<any> = (<any>(null as any));\nvar _decl0_12:i4.ResizableDirective = (<any>(null as any));\nvar _decl0_13:i5.DropzoneDirective = (<any>(null as any));\nvar _decl0_14:i6.GesturableDirective<any> = (<any>(null as any));\nvar _decl0_15:i7.DragRootDirective = (<any>(null as any));\nvar _decl0_16:i8.AutoScrollDirective = (<any>(null as any));\nvar _decl0_17:i9.AccountForScaleDirective = (<any>(null as any));\nvar _decl0_18:i10.ApplyScaleDirective = (<any>(null as any));\nvar _decl0_19:i11.DragPreviewDirective<any> = (<any>(null as any));\nvar _decl0_20:i2.AsyncPipe = (<any>(null as any));\nvar _decl0_21:i2.UpperCasePipe = (<any>(null as any));\nvar _decl0_22:i2.LowerCasePipe = (<any>(null as any));\nvar _decl0_23:i2.JsonPipe = (<any>(null as any));\nvar _decl0_24:i2.SlicePipe = (<any>(null as any));\nvar _decl0_25:i2.DecimalPipe = (<any>(null as any));\nvar _decl0_26:i2.PercentPipe = (<any>(null as any));\nvar _decl0_27:i2.TitleCasePipe = (<any>(null as any));\nvar _decl0_28:i2.CurrencyPipe = (<any>(null as any));\nvar _decl0_29:i2.DatePipe = (<any>(null as any));\nvar _decl0_30:i2.I18nPluralPipe = (<any>(null as any));\nvar _decl0_31:i2.I18nSelectPipe = (<any>(null as any));\nvar _decl0_32:i2.KeyValuePipe = (<any>(null as any));\nvar _decl0_34:i12.ArrayOfNPipe = (<any>(null as any));\nvar _decl0_35:i2.CommonModule = (<any>(null as any));\nvar _decl0_36:i0.TemplateRef<any> = (<any>(null as any));\nvar _decl0_37:i0.ElementRef<any> = (<any>(null as any));\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../libs/interact/src/lib/models/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC","sourcesContent":["export * from './interact';"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
[{"__symbolic":"module","version":4,"metadata":{},"exports":[{"from":"./interact"}]}]
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
import { InjectionToken } from '@angular/core';
|
|
2
|
-
export const INTERACT_ROOT_CONFIG = new InjectionToken('INTERACT_ROOT_CONFIG_PARAMS');
|
|
3
|
-
export const DEFAULT_REGISTRY_ID = 'DEFAULT';
|
|
4
|
-
/**
|
|
5
|
-
* Default initial value for Delta BehaviorSubject
|
|
6
|
-
*/
|
|
7
|
-
export const defaultDelta = {
|
|
8
|
-
deltaX: 0,
|
|
9
|
-
deltaY: 0,
|
|
10
|
-
targetElement: null
|
|
11
|
-
};
|
|
12
|
-
/**
|
|
13
|
-
* Default initial value for Size BehaviorSubject
|
|
14
|
-
*/
|
|
15
|
-
export const defaultSize = {
|
|
16
|
-
width: null,
|
|
17
|
-
height: null,
|
|
18
|
-
targetElement: null
|
|
19
|
-
};
|
|
20
|
-
/**
|
|
21
|
-
* Default initial value for Position BehaviorSubject
|
|
22
|
-
*/
|
|
23
|
-
export const defaultPosition = {
|
|
24
|
-
x: 0,
|
|
25
|
-
y: 0,
|
|
26
|
-
targetElement: null
|
|
27
|
-
};
|
|
28
|
-
//# sourceMappingURL=interact.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"interact.js","sourceRoot":"","sources":["../../../../../../libs/interact/src/lib/models/interact.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAQ/C,MAAM,CAAC,MAAM,oBAAoB,GAAG,IAAI,cAAc,CAAqB,6BAA6B,CAAC,CAAC;AAE1G,MAAM,CAAC,MAAM,mBAAmB,GAAG,SAAS,CAAC;AAC7C;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAU;IACjC,MAAM,EAAE,CAAC;IACT,MAAM,EAAE,CAAC;IACT,aAAa,EAAE,IAAI;CACpB,CAAC;AACF;;GAEG;AACH,MAAM,CAAC,MAAM,WAAW,GAAS;IAC/B,KAAK,EAAE,IAAI;IACX,MAAM,EAAE,IAAI;IACZ,aAAa,EAAE,IAAI;CACpB,CAAA;AACD;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAa;IACvC,CAAC,EAAE,CAAC;IACJ,CAAC,EAAE,CAAC;IACJ,aAAa,EAAE,IAAI;CACpB,CAAA","sourcesContent":["import { DropzoneDirective, DraggableDirective, GesturableDirective, ResizableDirective } from '../directives';\nimport { Point, DragEvent, ResizeEvent, Interactable, DropEvent, GestureEvent } from '@interactjs/types';\nimport { BehaviorSubject, Observable } from 'rxjs';\nimport { InjectionToken } from '@angular/core';\n\n\n\nexport type CssDimensionUnit = 'px' | 'em';\nexport interface InteractRootConfig {\n cssDimensionUnit: CssDimensionUnit;\n}\nexport const INTERACT_ROOT_CONFIG = new InjectionToken<InteractRootConfig>('INTERACT_ROOT_CONFIG_PARAMS');\n\nexport const DEFAULT_REGISTRY_ID = 'DEFAULT';\n/**\n * Default initial value for Delta BehaviorSubject\n */\nexport const defaultDelta: Delta = {\n deltaX: 0,\n deltaY: 0,\n targetElement: null\n};\n/**\n * Default initial value for Size BehaviorSubject\n */\nexport const defaultSize: Size = {\n width: null,\n height: null,\n targetElement: null\n}\n/**\n * Default initial value for Position BehaviorSubject\n */\nexport const defaultPosition: Position = {\n x: 0,\n y: 0,\n targetElement: null\n}\n/**\n * The shape of the state/events/behavior system for each dropzone\n * and the DEFAULT_REGISTRY_ID system (for drop components initialized outside\n * of a dropzone).\n */\nexport interface InteractableSystem {\n deltas$: BehaviorSubject<Delta>;\n position$: BehaviorSubject<Position>;\n size$: BehaviorSubject<Size & Delta>;\n\n interactable$: Observable<TftCoords>;\n}\n/**\n * The key map of InteractableSystems. One for the drag components\n * that originated outside of a dropzone, plus one for each dropzone.\n */\nexport interface InteractableRegistry {\n [key: string]: InteractableSystem\n}\n\n/**\n * HTMLElement with helpful drag directives attached to facilitate moving drag data between dropzones\n */\nexport type TftDragElement = HTMLElement & {\n dragRef?: DraggableDirective\n dragOrigin?: DropzoneDirective\n dropTarget?: DropzoneDirective\n}\n\n/**\n * HTMLElement with helpful drag directives attached to facilitate moving drag data between dropzones\n */\n export type TftResizeElement = HTMLElement & {\n resizeRef?: ResizableDirective\n}\n\n/**\n * Extends the interact drop events by adding reference to the dropped components drag\n * directive to the html element. This gives the dropzone access to things like data\n * and parent dropzone of the dropped component.\n */\nexport type NgDropEvent = DropEvent & {\n draggable: Interactable & {\n target: TftDragElement;\n };\n relatedTarget: TftDragElement;\n};\n/**\n * Extends the interact resize events by adding a reference to the dragRef\n * directive to the html element.\n */\nexport type NgResizeEvent = ResizeEvent & {\n draggable: Interactable & {\n target: TftDragElement;\n };\n};\n/**\n * We extend the interact DragEvent a little here, adding to the target element references for:\n * - the component we are dragging (dragRef)\n * - the dropzone component where the drag component originated (dragOrigin)\n * - the dropzone component that it was dropped in (dropTarget)\n * This helps us to pass references to directive classes as events like dragenter and drag exit happens.\n * We use these references to emit a (mostly) consistent event across drag, drop, resize event.\n */\nexport type NgDragEvent = DragEvent & {\n dropzone: { target: HTMLElement},\n target: TftDragElement\n};\n/**\n * Event emitted when resizing, dragging, dropping\n */\nexport interface TftInteractableEvent {\n dragRef: DraggableDirective;\n dragOrigin?: DropzoneDirective;\n dropTarget?: DropzoneDirective;\n positionInDropTarget: Point;\n}\n/**\n * Event emitted on drop\n */\nexport interface TftDropEvent extends TftInteractableEvent {\n interactEvent: NgDropEvent\n}\n/**\n * Event emitted on drag\n */\nexport interface TftDragEvent extends TftInteractableEvent {\n interactEvent: NgDragEvent\n}\n/**\n * Event emitted on resize\n */\nexport interface TftResizeEvent extends TftInteractableEvent {\n interactEvent: ResizeEvent,\n resizeRef: ResizableDirective\n size: {\n width: number;\n height: number;\n }\n}\n\nexport type TftCoords= Delta & Position & Size;\n\nexport interface Delta {\n deltaX: number | null;\n deltaY: number | null;\n targetElement: TftDragElement | null;\n}\n\nexport interface Position {\n x: number | null;\n y: number | null;\n targetElement: TftDragElement | null;\n}\n\nexport interface Size {\n width: number | null;\n height: number | null;\n targetElement: TftResizeElement | null;\n}\n\nexport interface TftGestureEvent {\n gestureRef: GesturableDirective;\n interactEvent: GestureEvent;\n}\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
[{"__symbolic":"module","version":4,"metadata":{"CssDimensionUnit":{"__symbolic":"interface"},"InteractRootConfig":{"__symbolic":"interface"},"INTERACT_ROOT_CONFIG":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":11,"character":40},"arguments":["INTERACT_ROOT_CONFIG_PARAMS"]},"DEFAULT_REGISTRY_ID":"DEFAULT","defaultDelta":{"deltaX":0,"deltaY":0,"targetElement":null},"defaultSize":{"width":null,"height":null,"targetElement":null},"defaultPosition":{"x":0,"y":0,"targetElement":null},"InteractableSystem":{"__symbolic":"interface"},"InteractableRegistry":{"__symbolic":"interface"},"TftDragElement":{"__symbolic":"interface"},"TftResizeElement":{"__symbolic":"interface"},"NgDropEvent":{"__symbolic":"interface"},"NgResizeEvent":{"__symbolic":"interface"},"NgDragEvent":{"__symbolic":"interface"},"TftInteractableEvent":{"__symbolic":"interface"},"TftDropEvent":{"__symbolic":"interface"},"TftDragEvent":{"__symbolic":"interface"},"TftResizeEvent":{"__symbolic":"interface"},"TftCoords":{"__symbolic":"interface"},"Delta":{"__symbolic":"interface"},"Position":{"__symbolic":"interface"},"Size":{"__symbolic":"interface"},"TftGestureEvent":{"__symbolic":"interface"}}}]
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import { Pipe } from '@angular/core';
|
|
2
|
-
export class ArrayOfNPipe {
|
|
3
|
-
/**
|
|
4
|
-
*
|
|
5
|
-
* @param n the number to make an array of
|
|
6
|
-
* @param max the max length of the array (useful for limiting rendering in ngFor loop)
|
|
7
|
-
*/
|
|
8
|
-
transform(n, max) {
|
|
9
|
-
const length = ((max && max < n) || n === Infinity) ? max : n;
|
|
10
|
-
return new Array(length).fill(length).map((x, i) => i);
|
|
11
|
-
}
|
|
12
|
-
}
|
|
13
|
-
ArrayOfNPipe.decorators = [
|
|
14
|
-
{ type: Pipe, args: [{
|
|
15
|
-
name: 'arrayOfN'
|
|
16
|
-
},] }
|
|
17
|
-
];
|
|
18
|
-
//# sourceMappingURL=array-of-n.pipe.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"array-of-n.pipe.js","sourceRoot":"","sources":["../../../../../../libs/interact/src/lib/pipes/array-of-n.pipe.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAiB,MAAM,eAAe,CAAC;AAKpD,MAAM,OAAO,YAAY;IAEvB;;;;OAIG;IACH,SAAS,CAAC,CAAS,EAAE,GAAW;QAC9B,MAAM,MAAM,GAAG,CAAC,CAAC,GAAG,IAAI,GAAG,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK,QAAQ,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;QAC9D,OAAO,IAAI,KAAK,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAC,CAAC,EAAC,EAAE,CAAC,CAAC,CAAC,CAAC;IACvD,CAAC;;;YAbF,IAAI,SAAC;gBACJ,IAAI,EAAE,UAAU;aACjB","sourcesContent":["import { Pipe, PipeTransform } from '@angular/core';\n\n@Pipe({\n name: 'arrayOfN'\n})\nexport class ArrayOfNPipe implements PipeTransform {\n\n /**\n * \n * @param n the number to make an array of \n * @param max the max length of the array (useful for limiting rendering in ngFor loop)\n */\n transform(n: number, max: number): any {\n const length = ((max && max < n) || n === Infinity) ? max : n;\n return new Array(length).fill(length).map((x,i)=> i); \n }\n\n}\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
[{"__symbolic":"module","version":4,"metadata":{"ArrayOfNPipe":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Pipe","line":2,"character":1},"arguments":[{"name":"arrayOfN"}]}],"members":{"transform":[{"__symbolic":"method"}]}}}}]
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"array-of-n.pipe.ngfactory.js","sourceRoot":"","sources":["../../../../../../libs/interact/src/lib/pipes/array-of-n.pipe.ngfactory.ts"],"names":[],"mappings":"","sourcesContent":["import * as i0 from '@angular/core';\ni0.ComponentFactory;\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../libs/interact/src/lib/pipes/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC","sourcesContent":["export * from './array-of-n.pipe';"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
[{"__symbolic":"module","version":4,"metadata":{},"exports":[{"from":"./array-of-n.pipe"}]}]
|