@tft/interact 12.5.0 → 13.0.0

package/esm2015/lib/directives/resizable.directive.js

@@ -1,152 +0,0 @@
-import { Directive, ElementRef, Input, Optional, SkipSelf, Output, EventEmitter, Renderer2, Inject } from '@angular/core';
-import { DOCUMENT } from '@angular/common';
-import interact from 'interactjs';
-import { InteractService } from '../services/interact.service';
-import { DraggableDirective } from './draggable.directive';
-import { DropzoneDirective } from './dropzone.directive';
-import { DragRootDirective } from './drag-root.directive';
-import { AccountForScaleDirective } from './account-for-scale.directive';
-import { DEFAULT_REGISTRY_ID } from '../models';
-/** @dynamic */
-export class ResizableDirective {
-    constructor(el, _document, interactService, renderer, drag_root_dir, account_for_scale_dir, draggable_dir, dropzone_dir) {
-        var _a;
-        this.el = el;
-        this._document = _document;
-        this.interactService = interactService;
-        this.renderer = renderer;
-        this.account_for_scale_dir = account_for_scale_dir;
-        this.draggable_dir = draggable_dir;
-        this.dropzone_dir = dropzone_dir;
-        this.enableResizeDefault = true;
-        // TODO: should this be an input with default or should consuming user set display in styles each time
-        this.position = 'absolute';
-        this.resizeDisabled = false;
-        this.resizeStart = new EventEmitter();
-        this.resizeMove = new EventEmitter();
-        this.resizeInertiaStart = new EventEmitter();
-        this.resizeEnd = new EventEmitter();
-        this.defaultConfig = {
-            edges: { left: true, right: true, bottom: true, top: true }
-        };
-        this.dragRoot = ((_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;
-    }
-    ngOnInit() {
-        var _a, _b;
-        this.addResizePropertiesToElement(this.el.nativeElement);
-        // we check for a dropzone, we use its id as the registry id if there is on
-        // otherwise, we use DEFAULT_REGISTRY_ID as a registry id. This allows us to keep our interactable
-        // drag state organized by dropzones.
-        this.registryId = ((_a = this.dropzone_dir) === null || _a === void 0 ? void 0 : _a.dropzoneId) || DEFAULT_REGISTRY_ID;
-        this.interactableId = ((_b = this.draggable_dir) === null || _b === void 0 ? void 0 : _b.interactableId) || this.interactService.addDraggableToRegistry(this.registryId, this.interactableId);
-        this.interactable = this.initiateResizeEvents(Object.assign(Object.assign({}, this.defaultConfig), this.resizeConfig), this.el.nativeElement);
-        this.alignDimensionsWithInputs(this.width, this.height);
-        this.interactableSubscription = this.interactService
-            .getInteractableState(this.interactableId, this.registryId)
-            .subscribe();
-    }
-    ngOnChanges(changes) {
-        if ((changes.resizeConfig || changes.resizeDisabled) && this.interactable) {
-            this.interactable.resizable(Object.assign(Object.assign({}, this.resizeConfig), { enabled: !this.resizeDisabled }));
-        }
-        if (changes.width || changes.height) {
-            this.alignDimensionsWithInputs(this.width, this.height);
-        }
-    }
-    ngOnDestroy() {
-        this.interactableSubscription.unsubscribe();
-        this.interactService.destroyInteractable(this.interactableId, this.registryId);
-    }
-    resizeListener(event) {
-        const deltaX = event.deltaRect.left;
-        const deltaY = event.deltaRect.top;
-        const { width, height } = event.rect;
-        this.interactService.updateSize(this.interactableId, this.registryId, { deltaX, deltaY, width, height }, this.el.nativeElement);
-    }
-    /**
-     *  hook elements into interacts resize event listeners
-     *  we spread the configs so that the consuming component only overwrites the
-     *  pieces that it explicitly indicates
-     * @param resizeConfig
-     * @param nativeElement
-     */
-    initiateResizeEvents(resizeConfig, nativeElement) {
-        var _a;
-        // TODO: This should try and get interactable from tft_draggable if it exists
-        const interactable = ((_a = this.draggable_dir) === null || _a === void 0 ? void 0 : _a.interactable) || interact(nativeElement);
-        return interactable.resizable(Object.assign(Object.assign({}, resizeConfig), { enabled: !this.resizeDisabled }))
-            .on('resizestart', (event) => { this.resizeStart.emit(this.mapResizeEvent(event)); })
-            .on('resizemove', (event) => {
-            if (this.enableResizeDefault) {
-                this.resizeListener(event);
-            }
-            const mappedEvent = this.mapResizeEvent(event);
-            this.resizeMove.emit(mappedEvent);
-        })
-            .on('resizeinertiastart', (event) => this.resizeInertiaStart.emit(this.mapResizeEvent(event)))
-            .on('resizeend', (event) => this.resizeEnd.emit(this.mapResizeEvent(event)));
-    }
-    mapResizeEvent(event) {
-        var _a, _b;
-        const target = event.target;
-        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;
-        const positionInDropTarget = target && relatedTarget
-            ? this.interactService.calculatePositionInElement(relatedTarget, target)
-            : null;
-        return {
-            interactEvent: event,
-            resizeRef: this,
-            // should I remove this?
-            dragRef: this.draggable_dir,
-            dragOrigin: this.dropzone_dir,
-            dropTarget: this.el.nativeElement.dropTarget,
-            positionInDropTarget
-        };
-    }
-    alignDimensionsWithInputs(width, height) {
-        this.interactService.updateSize(this.interactableId, this.registryId, { deltaX: 0, deltaY: 0, width, height }, this.el.nativeElement);
-    }
-    addResizePropertiesToElement(nativeElement) {
-        this.renderer.setProperty(nativeElement, 'resizeRef', this);
-    }
-}
-ResizableDirective.decorators = [
-    { type: Directive, args: [{
-                selector: '[tftResizable]',
-                // eslint-disable-next-line @angular-eslint/no-host-metadata-property
-                host: {
-                    // prevents touch events from colliding with with mouse events
-                    // on touch screen
-                    '[style.touchAction]': 'this.resizeDisabled ? "auto" : "none"',
-                    // default to absolute here to accommodate likely use cases
-                    // consuming component can easily over ride with position input
-                    '[style.position]': 'position',
-                    // follows interactjs suggested practices
-                    '[style.boxSizing]': '"border-box"',
-                }
-            },] }
-];
-ResizableDirective.ctorParameters = () => [
-    { type: ElementRef },
-    { type: Document, decorators: [{ type: Inject, args: [DOCUMENT,] }] },
-    { type: InteractService },
-    { type: Renderer2 },
-    { type: DragRootDirective, decorators: [{ type: Optional }] },
-    { type: AccountForScaleDirective, decorators: [{ type: Optional }] },
-    { type: DraggableDirective, decorators: [{ type: Optional }] },
-    { type: DropzoneDirective, decorators: [{ type: Optional }, { type: SkipSelf }] }
-];
-ResizableDirective.propDecorators = {
-    enableResizeDefault: [{ type: Input }],
-    position: [{ type: Input }],
-    resizeConfig: [{ type: Input }],
-    interactableId: [{ type: Input }],
-    width: [{ type: Input }],
-    height: [{ type: Input }],
-    resizeDisabled: [{ type: Input }],
-    resizeStart: [{ type: Output }],
-    resizeMove: [{ type: Output }],
-    resizeInertiaStart: [{ type: Output }],
-    resizeEnd: [{ type: Output }]
-};
-//# sourceMappingURL=resizable.directive.js.map

package/esm2015/lib/directives/resizable.directive.js.map

@@ -1 +0,0 @@
-{"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';\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  dragRoot: HTMLElement;\n\n  private interactableSubscription: Subscription;\n\n  constructor(\n    public el: ElementRef,\n    @Inject(DOCUMENT) private _document: Document,\n    private interactService: InteractService,\n    private renderer: Renderer2,\n    @Optional() 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  ) {\n    this.dragRoot = (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 deltaX = event.deltaRect.left;\n    const deltaY = event.deltaRect.top;\n    const { width, height } = event.rect;\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: any) {\n    // TODO: This should try and get interactable from tft_draggable if it exists\n    const interactable = this.draggable_dir?.interactable || interact(nativeElement);\n    return interactable.resizable({...resizeConfig, enabled: !this.resizeDisabled})\n      .on('resizestart', (event: NgResizeEvent) => { this.resizeStart.emit(this.mapResizeEvent(event))})\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) => this.resizeEnd.emit(this.mapResizeEvent(event)));\n  }\n\n  mapResizeEvent(event: NgResizeEvent ): TftResizeEvent {\n    const target  = event.target as TftDragElement;\n    const relatedTarget = this.draggable_dir?.dropzone_dir?.el.nativeElement\n    const positionInDropTarget = target && relatedTarget\n      ? this.interactService.calculatePositionInElement(relatedTarget, target)\n      : null;\n    return {\n      interactEvent: event,\n      resizeRef: this,\n      // should I remove this?\n      dragRef: this.draggable_dir,\n      dragOrigin: this.dropzone_dir,\n      dropTarget: this.el.nativeElement.dropTarget,\n      positionInDropTarget\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"]}

package/esm2015/lib/directives/resizable.directive.metadata.json

@@ -1 +0,0 @@
-[{"__symbolic":"module","version":4,"metadata":{"ResizableDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":13,"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":30,"character":3}}]}],"position":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3}}]}],"resizeConfig":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":3}}]}],"interactableId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":3}}]}],"width":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":3}}]}],"height":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"resizeDisabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"resizeStart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":40,"character":3}}]}],"resizeMove":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":41,"character":3}}]}],"resizeInertiaStart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":42,"character":3}}]}],"resizeEnd":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":43,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":57,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":57,"character":12}]}],null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":60,"character":5}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":61,"character":5}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":62,"character":5}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":63,"character":5}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf","line":63,"character":17}}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":56,"character":15},{"__symbolic":"error","message":"Could not resolve type","line":57,"character":41,"context":{"typeName":"Document"}},{"__symbolic":"reference","module":"../services/interact.service","name":"InteractService","line":58,"character":29},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":59,"character":22},{"__symbolic":"reference","module":"./drag-root.directive","name":"DragRootDirective","line":60,"character":32},{"__symbolic":"reference","module":"./account-for-scale.directive","name":"AccountForScaleDirective","line":61,"character":47},{"__symbolic":"reference","module":"./draggable.directive","name":"DraggableDirective","line":62,"character":40},{"__symbolic":"reference","module":"./dropzone.directive","name":"DropzoneDirective","line":63,"character":51}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"resizeListener":[{"__symbolic":"method"}],"initiateResizeEvents":[{"__symbolic":"method"}],"mapResizeEvent":[{"__symbolic":"method"}],"alignDimensionsWithInputs":[{"__symbolic":"method"}],"addResizePropertiesToElement":[{"__symbolic":"method"}]}}}}]

package/esm2015/lib/interact.module.js

@@ -1,42 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { ArrayOfNPipe } from './pipes/array-of-n.pipe';
-import { ApplyScaleDirective, DraggableDirective, DragRootDirective, AccountForScaleDirective, GesturableDirective, ResizableDirective, DropzoneDirective, DragPreviewDirective } from './directives';
-import { InteractService } from './services/interact.service';
-import { INTERACT_ROOT_CONFIG } from './models';
-const EXPORTS = [
-    DraggableDirective,
-    ResizableDirective,
-    DropzoneDirective,
-    GesturableDirective,
-    DragRootDirective,
-    AccountForScaleDirective,
-    ApplyScaleDirective,
-    DragPreviewDirective,
-    ArrayOfNPipe,
-];
-export class InteractModule {
-    static forRoot(config) {
-        const defaultConfig = { cssDimensionUnit: 'px' };
-        return {
-            ngModule: InteractModule,
-            providers: [
-                { provide: INTERACT_ROOT_CONFIG, useValue: Object.assign(Object.assign({}, defaultConfig), config) },
-                InteractService
-            ]
-        };
-    }
-}
-InteractModule.decorators = [
-    { type: NgModule, args: [{
-                imports: [CommonModule],
-                // providers: [{ provide: INTERACT_ROOT_CONFIG, useValue: 'px' }],
-                declarations: [
-                    ...EXPORTS,
-                ],
-                exports: [
-                    ...EXPORTS
-                ]
-            },] }
-];
-//# sourceMappingURL=interact.module.js.map

package/esm2015/lib/interact.module.js.map

@@ -1 +0,0 @@
-{"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,wBAAwB,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AACtM,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,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, 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  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"]}

package/esm2015/lib/interact.module.metadata.json

@@ -1 +0,0 @@
-[{"__symbolic":"module","version":4,"metadata":{"InteractModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":22,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":23,"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":"AccountForScaleDirective","line":15,"character":2},{"__symbolic":"reference","module":"./directives","name":"ApplyScaleDirective","line":16,"character":2},{"__symbolic":"reference","module":"./directives","name":"DragPreviewDirective","line":17,"character":2},{"__symbolic":"reference","module":"./pipes/array-of-n.pipe","name":"ArrayOfNPipe","line":18,"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":"AccountForScaleDirective","line":15,"character":2},{"__symbolic":"reference","module":"./directives","name":"ApplyScaleDirective","line":16,"character":2},{"__symbolic":"reference","module":"./directives","name":"DragPreviewDirective","line":17,"character":2},{"__symbolic":"reference","module":"./pipes/array-of-n.pipe","name":"ArrayOfNPipe","line":18,"character":2}]}]}]}}}]

package/esm2015/lib/models/index.js

@@ -1,2 +0,0 @@
-export * from './interact';
-//# sourceMappingURL=index.js.map

package/esm2015/lib/models/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../libs/interact/src/lib/models/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC","sourcesContent":["export * from './interact';"]}

package/esm2015/lib/models/index.metadata.json

@@ -1 +0,0 @@
-[{"__symbolic":"module","version":4,"metadata":{},"exports":[{"from":"./interact"}]}]

package/esm2015/lib/models/interact.js

@@ -1,28 +0,0 @@
-import { InjectionToken } from '@angular/core';
-export const INTERACT_ROOT_CONFIG = new InjectionToken('INTERACT_ROOT_CONFIG_PARAMS');
-export const DEFAULT_REGISTRY_ID = 'DEFAULT';
-/**
- * Default initial value for Delta BehaviorSubject
- */
-export const defaultDelta = {
-    deltaX: 0,
-    deltaY: 0,
-    targetElement: null
-};
-/**
- * Default initial value for Size BehaviorSubject
- */
-export const defaultSize = {
-    width: null,
-    height: null,
-    targetElement: null
-};
-/**
- * Default initial value for Position BehaviorSubject
- */
-export const defaultPosition = {
-    x: 0,
-    y: 0,
-    targetElement: null
-};
-//# sourceMappingURL=interact.js.map

package/esm2015/lib/models/interact.js.map

@@ -1 +0,0 @@
-{"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}\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"]}

package/esm2015/lib/models/interact.metadata.json

@@ -1 +0,0 @@
-[{"__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"}}}]

package/esm2015/lib/pipes/array-of-n.pipe.js

@@ -1,18 +0,0 @@
-import { Pipe } from '@angular/core';
-export class ArrayOfNPipe {
-    /**
-     *
-     * @param n the number to make an array of
-     * @param max the max length of the array (useful for limiting rendering in ngFor loop)
-     */
-    transform(n, max) {
-        const length = ((max && max < n) || n === Infinity) ? max : n;
-        return new Array(length).fill(length).map((x, i) => i);
-    }
-}
-ArrayOfNPipe.decorators = [
-    { type: Pipe, args: [{
-                name: 'arrayOfN'
-            },] }
-];
-//# sourceMappingURL=array-of-n.pipe.js.map

package/esm2015/lib/pipes/array-of-n.pipe.js.map

@@ -1 +0,0 @@
-{"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"]}

package/esm2015/lib/pipes/array-of-n.pipe.metadata.json

@@ -1 +0,0 @@
-[{"__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"}]}}}}]

package/esm2015/lib/pipes/index.js

@@ -1,2 +0,0 @@
-export * from './array-of-n.pipe';
-//# sourceMappingURL=index.js.map

package/esm2015/lib/pipes/index.js.map

@@ -1 +0,0 @@
-{"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';"]}

package/esm2015/lib/pipes/index.metadata.json

@@ -1 +0,0 @@
-[{"__symbolic":"module","version":4,"metadata":{},"exports":[{"from":"./array-of-n.pipe"}]}]

package/esm2015/lib/services/interact.service.js

@@ -1,208 +0,0 @@
-import { Injectable, RendererFactory2, NgZone, Inject, Optional } from '@angular/core';
-import { BehaviorSubject, combineLatest } from 'rxjs';
-import { tap, map, shareReplay } from 'rxjs/operators';
-import { defaultPosition, defaultSize, defaultDelta, DEFAULT_REGISTRY_ID, INTERACT_ROOT_CONFIG } from '../models';
-import * as i0 from "@angular/core";
-import * as i1 from "../models/interact";
-export class InteractService {
-    constructor(rendererFactory, ngZone, rootConfig) {
-        this.rendererFactory = rendererFactory;
-        this.ngZone = ngZone;
-        this.rootConfig = rootConfig;
-        this._interactableIndex = 0;
-        this._dropzoneIndex = 0;
-        // TODO: consider using Map here
-        this.dragRegistrySystem = {};
-        this.cssUnit = 'px';
-        this.renderer = this.rendererFactory.createRenderer(null, null);
-        this.cssUnit = (rootConfig === null || rootConfig === void 0 ? void 0 : rootConfig.cssDimensionUnit) || 'px';
-    }
-    addDeltaToPosition(delta, position) {
-        return {
-            x: delta.deltaX + position.x,
-            y: delta.deltaY + position.y,
-            targetElement: position.targetElement || delta.targetElement
-        };
-    }
-    addRegistryToSystem(customRegistryId = null) {
-        const registryId = customRegistryId || this.createDropzoneId(this._dropzoneIndex++);
-        this.dragRegistrySystem[registryId] = {};
-        return registryId;
-    }
-    addDraggableToRegistry(customRegistryId = null, interactableId = null) {
-        const registryId = customRegistryId || DEFAULT_REGISTRY_ID;
-        // if we pass an id to createInteractableId then it is used when creating the interactable
-        // and returned, otherwise a an id is created for the draggable.
-        const key = this.createInteractableId(interactableId);
-        if (!Object.prototype.hasOwnProperty.call(this.dragRegistrySystem, registryId)) {
-            this.dragRegistrySystem[registryId] = {};
-        }
-        this.dragRegistrySystem[registryId][key] = this.createInteractableState(defaultPosition, defaultSize, defaultDelta);
-        return key;
-    }
-    destroyInteractable(interactableId, registryId = DEFAULT_REGISTRY_ID) {
-        if (this.dragRegistrySystem[registryId][interactableId]) {
-            delete this.dragRegistrySystem[registryId][interactableId];
-        }
-    }
-    subscribeToInteractable(interactableId, registryId = DEFAULT_REGISTRY_ID) {
-        return this.dragRegistrySystem[registryId][interactableId];
-    }
-    createInteractableState(initialPosition, initialSize, initialDelta) {
-        const deltas$ = new BehaviorSubject(initialDelta);
-        // tracks the size of the element
-        const size$ = new BehaviorSubject(Object.assign(Object.assign({}, initialSize), initialDelta));
-        // Stream of positions as they change
-        const position$ = new BehaviorSubject(initialPosition);
-        // All draggable data mapped together
-        const interactable$ = combineLatest([
-            size$.pipe(
-            // startWith({...initialSize, ...initialDelta}),
-            shareReplay(1), 
-            // filter(resizeEvent => !!resizeEvent.targetElement),
-            tap(({ deltaX, deltaY, width, height, targetElement }) => {
-                this.ngZone.runOutsideAngular(() => {
-                    this.setElementSize(width, height, targetElement);
-                });
-                // only reposition if necessary i.e when resizing left or up
-                if (deltaX || deltaY) {
-                    deltas$.next({ deltaX, deltaY, targetElement });
-                }
-            })),
-            deltas$.pipe(shareReplay(1), tap((delta) => {
-                const position = position$.value;
-                const newPosition = this.addDeltaToPosition(delta, position);
-                position$.next(newPosition);
-            })),
-            position$.pipe(shareReplay(1), tap(position => {
-                this.ngZone.runOutsideAngular(() => {
-                    this.setElementTransform(position.x, position.y, position);
-                });
-            }))
-        ]).pipe(shareReplay(1), map(([size, deltas, position]) => {
-            return {
-                x: position.x,
-                y: position.y,
-                deltaX: deltas.deltaX,
-                deltaY: deltas.deltaY,
-                width: size.width,
-                height: size.height,
-                targetElement: size.targetElement || position.targetElement || deltas.targetElement
-            };
-        }));
-        // TODO: update system to handle only returning interactable$
-        return {
-            deltas$,
-            position$,
-            size$,
-            interactable$
-        };
-    }
-    createInteractableId(customInteractableId = null) {
-        return customInteractableId || `interactable${this._interactableIndex++}`;
-    }
-    createDropzoneId(index) {
-        return `dropzone${index}`;
-    }
-    getInteractableState(interactableId, registryId = DEFAULT_REGISTRY_ID) {
-        return this.dragRegistrySystem[registryId][interactableId].interactable$;
-    }
-    updateDeltas(interactId, registryId, { deltaX, deltaY }, targetElement) {
-        if (!this.interactableExistOnRegistry(interactId, registryId))
-            return;
-        this.dragRegistrySystem[registryId][interactId].deltas$.next({ deltaX, deltaY, targetElement });
-    }
-    updatePosition(interactId, registryId, { x, y }, targetElement) {
-        if (!this.interactableExistOnRegistry(interactId, registryId))
-            return;
-        this.dragRegistrySystem[registryId][interactId].position$.next({ x, y, targetElement });
-    }
-    updateSize(interactId, registryId, { deltaX, deltaY, width, height }, targetElement) {
-        if (!this.interactableExistOnRegistry(interactId, registryId))
-            return;
-        this.dragRegistrySystem[registryId][interactId].size$.next({ deltaX, deltaY, width, height, targetElement });
-    }
-    interactableExistOnRegistry(interactId, registryId = DEFAULT_REGISTRY_ID) {
-        // eslint-disable-next-line no-prototype-builtins
-        return this.dragRegistrySystem.hasOwnProperty(registryId) && this.dragRegistrySystem[registryId].hasOwnProperty(interactId);
-    }
-    /**
-     * Uses renderer to set width and height of angular component
-     * @param width the desired width of component
-     * @param height the desired height of component
-     * @param target the element to transform
-     */
-    setElementSize(width, height, target) {
-        var _a;
-        if (!target)
-            return;
-        const accountForScaleDirective = (_a = target.resizeRef) === null || _a === void 0 ? void 0 : _a.account_for_scale_dir;
-        if (accountForScaleDirective) {
-            const { scale } = accountForScaleDirective;
-            const scaledWidth = width / scale;
-            const scaledHeight = height / scale;
-            this.renderer.setStyle(target, 'width', `${scaledWidth}${this.cssUnit}`);
-            this.renderer.setStyle(target, 'height', `${scaledHeight}${this.cssUnit}`);
-        }
-        else {
-            this.renderer.setStyle(target, 'width', `${width}${this.cssUnit}`);
-            this.renderer.setStyle(target, 'height', `${height}${this.cssUnit}`);
-        }
-    }
-    /**
-     * Uses renderer to set position of angular component
-     * @param x position on x axis
-     * @param y position on y axis
-     * @param target the element to transform
-     */
-    setElementTransform(x, y, position) {
-        var _a, _b;
-        if (!(position === null || position === void 0 ? void 0 : position.targetElement))
-            return;
-        const dragRef = (_a = position.targetElement) === null || _a === void 0 ? void 0 : _a.dragRef;
-        const accountForScaleDirective = (dragRef === null || dragRef === void 0 ? void 0 : dragRef.account_for_scale_dir) || ((_b = dragRef === null || dragRef === void 0 ? void 0 : dragRef.dragRoot) === null || _b === void 0 ? void 0 : _b.account_for_scale_dir);
-        if (accountForScaleDirective) {
-            const { scale } = accountForScaleDirective;
-            this.renderer.setStyle(position.targetElement, 'left', `${x / scale}${this.cssUnit}`);
-            this.renderer.setStyle(position.targetElement, 'top', `${y / scale}${this.cssUnit}`);
-        }
-        else {
-            this.renderer.setStyle(position.targetElement, 'left', `${x}${this.cssUnit}`);
-            this.renderer.setStyle(position.targetElement, 'top', `${y}${this.cssUnit}`);
-        }
-    }
-    /**
-     * Generates a translate string for the x and y arguments passed to
-     * be passed to css transform
-     * @param x the position along the x axis
-     * @param y the position along the y axis
-     */
-    createTransformString(x, y) {
-        return `translate3d(${x}${this.cssUnit}, ${y}${this.cssUnit}, 0)`;
-    }
-    calculatePositionInElement(zoneElement, dragElement, scale) {
-        // TODO: this calculation may not cover a lot of scenarios, keep an eye out for possible improvements
-        const zoneRect = zoneElement.getBoundingClientRect();
-        const dragRect = dragElement.getBoundingClientRect();
-        const position = scale
-            ? {
-                x: (dragRect.left - zoneRect.left) / scale || 1,
-                y: (dragRect.top - zoneRect.top) / scale || 1
-            } : {
-            x: dragRect.left - zoneRect.left,
-            y: dragRect.top - zoneRect.top
-        };
-        // console.log({ y:position.y, drt:dragRect.top, zrt: zoneRect.top})
-        return position;
-    }
-}
-InteractService.ɵprov = i0.ɵɵdefineInjectable({ factory: function InteractService_Factory() { return new InteractService(i0.ɵɵinject(i0.RendererFactory2), i0.ɵɵinject(i0.NgZone), i0.ɵɵinject(i1.INTERACT_ROOT_CONFIG, 8)); }, token: InteractService, providedIn: "root" });
-InteractService.decorators = [
-    { type: Injectable, args: [{ providedIn: 'root' },] }
-];
-InteractService.ctorParameters = () => [
-    { type: RendererFactory2 },
-    { type: NgZone },
-    { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [INTERACT_ROOT_CONFIG,] }] }
-];
-//# sourceMappingURL=interact.service.js.map

package/esm2015/lib/services/interact.service.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"interact.service.js","sourceRoot":"","sources":["../../../../../../libs/interact/src/lib/services/interact.service.ts"],"names":[],"mappings":"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","sourcesContent":["\nimport { Injectable, Renderer2, RendererFactory2, NgZone, Inject, InjectionToken, Optional, AfterViewInit } from '@angular/core';\nimport { BehaviorSubject, Observable, combineLatest } from 'rxjs';\nimport { tap, map, shareReplay } from 'rxjs/operators';\nimport {\n  TftCoords, Delta, Size, Position, InteractableRegistry,\n  defaultPosition, defaultSize, defaultDelta, DEFAULT_REGISTRY_ID, TftDragElement, TftResizeElement, INTERACT_ROOT_CONFIG, InteractRootConfig\n} from '../models';\n\n\n\n@Injectable({providedIn: 'root'})\nexport class InteractService {\n\n  private _interactableIndex = 0;\n  private _dropzoneIndex = 0;\n  private renderer: Renderer2;\n\n  // TODO: consider using Map here\n  readonly dragRegistrySystem: { [key: string]: InteractableRegistry } = { };\n  private cssUnit = 'px'\n  constructor(\n    private rendererFactory: RendererFactory2,\n    private ngZone: NgZone,\n    @Optional() @Inject(INTERACT_ROOT_CONFIG) public rootConfig\n  ) {\n    this.renderer = this.rendererFactory.createRenderer(null, null);\n    this.cssUnit = rootConfig?.cssDimensionUnit || 'px';\n  }\n\n  addDeltaToPosition(delta: Delta, position: Position) {\n    return {\n      x: delta.deltaX + position.x,\n      y: delta.deltaY + position.y,\n      targetElement: position.targetElement || delta.targetElement\n    }\n  }\n\n  addRegistryToSystem(customRegistryId: string | null = null) {\n    const registryId = customRegistryId || this.createDropzoneId(this._dropzoneIndex++);\n    this.dragRegistrySystem[registryId] = {};\n    return registryId;\n  }\n\n  addDraggableToRegistry(customRegistryId = null, interactableId: string | null = null ) {\n    const registryId = customRegistryId || DEFAULT_REGISTRY_ID;\n    // if we pass an id to createInteractableId then it is used when creating the interactable\n    // and returned, otherwise a an id is created for the draggable.\n    const key = this.createInteractableId(interactableId );\n    if (!Object.prototype.hasOwnProperty.call(this.dragRegistrySystem, registryId)) {\n      this.dragRegistrySystem[registryId] = {};\n    }\n    this.dragRegistrySystem[registryId][key] = this.createInteractableState(defaultPosition, defaultSize, defaultDelta);\n    return key\n  }\n\n  destroyInteractable(interactableId: string, registryId = DEFAULT_REGISTRY_ID) {\n    if(this.dragRegistrySystem[registryId][interactableId]) {\n      delete this.dragRegistrySystem[registryId][interactableId];\n    }\n  }\n\n  subscribeToInteractable(interactableId: string, registryId = DEFAULT_REGISTRY_ID) {\n    return this.dragRegistrySystem[registryId][interactableId];\n  }\n\n  createInteractableState(initialPosition: Position, initialSize: Size, initialDelta: Delta ) {\n\n    const deltas$ = new BehaviorSubject(initialDelta);\n    // tracks the size of the element\n    const size$ = new BehaviorSubject({...initialSize, ...initialDelta});\n    // Stream of positions as they change\n    const position$ = new BehaviorSubject(initialPosition);\n\n    // All draggable data mapped together\n    const interactable$: Observable<TftCoords> = combineLatest([\n      size$.pipe(\n        // startWith({...initialSize, ...initialDelta}),\n        shareReplay(1),\n        // filter(resizeEvent => !!resizeEvent.targetElement),\n        tap(({deltaX, deltaY, width, height, targetElement}) => {\n          this.ngZone.runOutsideAngular(() => {\n            this.setElementSize(width, height, targetElement);\n          });\n          // only reposition if necessary i.e when resizing left or up\n          if(deltaX || deltaY) {\n            deltas$.next({deltaX, deltaY, targetElement});\n          }\n        })\n      ),\n      deltas$.pipe(\n        shareReplay(1),\n        tap((delta) => {\n          const position = position$.value;\n          const newPosition = this.addDeltaToPosition(delta, position);\n          position$.next(newPosition);\n        })\n      ),\n      position$.pipe(\n        shareReplay(1),\n        tap( position => {\n          this.ngZone.runOutsideAngular(() => {\n            this.setElementTransform(position.x, position.y, position);\n          })\n        })\n      )\n      ]).pipe(\n      shareReplay(1),\n      map( ([size, deltas, position]): TftCoords=> {\n        return {\n          x: position.x,\n          y: position.y,\n          deltaX: deltas.deltaX,\n          deltaY: deltas.deltaY,\n          width: size.width,\n          height: size.height,\n          targetElement: size.targetElement || position.targetElement || deltas.targetElement\n        }\n      }),\n    )\n    // TODO: update system to handle only returning interactable$\n    return {\n      deltas$,\n      position$,\n      size$,\n      interactable$\n    }\n  }\n\n  createInteractableId(customInteractableId: string | null = null) {\n    return customInteractableId || `interactable${this._interactableIndex++}`\n  }\n\n  createDropzoneId(index: number) {\n    return `dropzone${index}`\n  }\n\n  getInteractableState( interactableId: string, registryId = DEFAULT_REGISTRY_ID) {\n    return this.dragRegistrySystem[registryId][interactableId].interactable$;\n  }\n\n  updateDeltas(interactId: string, registryId: string, { deltaX, deltaY }, targetElement) {\n    if (!this.interactableExistOnRegistry(interactId, registryId)) return;\n    this.dragRegistrySystem[registryId][interactId].deltas$.next({ deltaX, deltaY, targetElement })\n  }\n\n  updatePosition(interactId: string, registryId: string, { x, y }, targetElement) {\n    if (!this.interactableExistOnRegistry(interactId, registryId)) return;\n    this.dragRegistrySystem[registryId][interactId].position$.next({ x, y, targetElement })\n  }\n\n  updateSize(interactId: string, registryId: string, { deltaX, deltaY, width, height }, targetElement) {\n    if (!this.interactableExistOnRegistry(interactId, registryId)) return\n    this.dragRegistrySystem[registryId][interactId].size$.next({deltaX, deltaY, width, height, targetElement});\n  }\n\n  interactableExistOnRegistry(interactId: string, registryId = DEFAULT_REGISTRY_ID) {\n    // eslint-disable-next-line no-prototype-builtins\n    return this.dragRegistrySystem.hasOwnProperty(registryId) && this.dragRegistrySystem[registryId].hasOwnProperty(interactId);\n  }\n  /**\n   * Uses renderer to set width and height of angular component\n   * @param width the desired width of component\n   * @param height the desired height of component\n   * @param target the element to transform\n   */\n  setElementSize(width: number, height: number, target: TftResizeElement) {\n    if(!target) return;\n    const accountForScaleDirective = target.resizeRef?.account_for_scale_dir\n    if (accountForScaleDirective) {\n      const { scale } = accountForScaleDirective\n      const scaledWidth = width / scale;\n      const scaledHeight = height / scale;\n      this.renderer.setStyle(target, 'width', `${scaledWidth}${this.cssUnit}`);\n      this.renderer.setStyle(target, 'height', `${scaledHeight}${this.cssUnit}`);\n    } else {\n      this.renderer.setStyle(target, 'width', `${width}${this.cssUnit}`);\n      this.renderer.setStyle(target, 'height', `${height}${this.cssUnit}`);\n    }\n  }\n  /**\n   * Uses renderer to set position of angular component\n   * @param x position on x axis\n   * @param y position on y axis\n   * @param target the element to transform\n   */\n  setElementTransform(x: number, y: number, position: Position ) {\n    if(!position?.targetElement) return;\n    const dragRef = position.targetElement?.dragRef;\n    const accountForScaleDirective = dragRef?.account_for_scale_dir || dragRef?.dragRoot?.account_for_scale_dir\n    if (accountForScaleDirective) {\n      const {scale} = accountForScaleDirective;\n      this.renderer.setStyle(position.targetElement, 'left', `${x / scale}${this.cssUnit}`);\n      this.renderer.setStyle(position.targetElement, 'top', `${y / scale}${this.cssUnit}`);\n    } else {\n      this.renderer.setStyle(position.targetElement, 'left', `${x}${this.cssUnit}`);\n      this.renderer.setStyle(position.targetElement, 'top', `${y}${this.cssUnit}`);\n    }\n  }\n  /**\n   * Generates a translate string for the x and y arguments passed to\n   * be passed to css transform\n   * @param x the position along the x axis\n   * @param y the position along the y axis\n   */\n  createTransformString(x: number, y: number) {\n    return `translate3d(${x}${this.cssUnit}, ${y}${this.cssUnit}, 0)`\n  }\n\n  calculatePositionInElement(zoneElement: Interact.Element, dragElement: TftDragElement, scale?: number) {\n    // TODO: this calculation may not cover a lot of scenarios, keep an eye out for possible improvements\n    const zoneRect = zoneElement.getBoundingClientRect();\n    const dragRect = dragElement.getBoundingClientRect();\n    const position = scale\n      ? {\n      x: (dragRect.left - zoneRect.left) / scale  || 1,\n      y: (dragRect.top - zoneRect.top) / scale || 1\n      } : {\n        x: dragRect.left - zoneRect.left,\n        y: dragRect.top - zoneRect.top\n    };\n    // console.log({ y:position.y, drt:dragRect.top, zrt: zoneRect.top})\n    return position;\n  }\n}\n"]}

package/esm2015/lib/services/interact.service.metadata.json

@@ -1 +0,0 @@
-[{"__symbolic":"module","version":4,"metadata":{"InteractService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":11,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":24,"character":5}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":24,"character":17},"arguments":[{"__symbolic":"reference","module":"../models","name":"INTERACT_ROOT_CONFIG","line":24,"character":24}]}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"RendererFactory2","line":22,"character":29},{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":23,"character":20},null]}],"addDeltaToPosition":[{"__symbolic":"method"}],"addRegistryToSystem":[{"__symbolic":"method"}],"addDraggableToRegistry":[{"__symbolic":"method"}],"destroyInteractable":[{"__symbolic":"method"}],"subscribeToInteractable":[{"__symbolic":"method"}],"createInteractableState":[{"__symbolic":"method"}],"createInteractableId":[{"__symbolic":"method"}],"createDropzoneId":[{"__symbolic":"method"}],"getInteractableState":[{"__symbolic":"method"}],"updateDeltas":[{"__symbolic":"method"}],"updatePosition":[{"__symbolic":"method"}],"updateSize":[{"__symbolic":"method"}],"interactableExistOnRegistry":[{"__symbolic":"method"}],"setElementSize":[{"__symbolic":"method"}],"setElementTransform":[{"__symbolic":"method"}],"createTransformString":[{"__symbolic":"method"}],"calculatePositionInElement":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}}}}]