Socket
Socket
Sign inDemoInstall

@interactjs/modifiers

Package Overview
Dependencies
4
Maintainers
2
Versions
136
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 1.10.23 to 1.10.24

6

aspectRatio.d.ts

@@ -5,3 +5,3 @@ /**

* @description
* This module forces elements to be resized with a specified dx/dy ratio.
* This modifier forces elements to be resized with a specified dx/dy ratio.
*

@@ -20,3 +20,3 @@ * ```js

import type { Point, Rect, EdgeOptions } from '@interactjs/core/types';
import Modification from './Modification';
import { Modification } from './Modification';
import type { Modifier, ModifierModule, ModifierState } from './types';

@@ -29,3 +29,3 @@ export interface AspectRatioOptions {

}
export declare type AspectRatioState = ModifierState<AspectRatioOptions, {
export type AspectRatioState = ModifierState<AspectRatioOptions, {
startCoords: Point;

@@ -32,0 +32,0 @@ startRect: Rect;

@@ -5,3 +5,3 @@ /**

* @description
* This module forces elements to be resized with a specified dx/dy ratio.
* This modifier forces elements to be resized with a specified dx/dy ratio.
*

@@ -19,6 +19,7 @@ * ```js

*/
import extend from "../utils/extend.js";
import { addEdges } from "../utils/rect.js";
import Modification from './Modification';
import { makeModifier } from './base';
import { Modification } from './Modification';
const aspectRatio = {

@@ -40,7 +41,5 @@ start(arg) {

} = state.options;
if (ratio === 'preserve') {
ratio = rect.width / rect.height;
}
state.startCoords = extend({}, coords);

@@ -57,3 +56,2 @@ state.startRect = extend({}, rect);

state.xIsPrimaryAxis = !!(edges.left || edges.right);
if (state.equalDelta) {

@@ -71,7 +69,5 @@ const sign = (linkedEdges.left ? 1 : -1) * (linkedEdges.top ? 1 : -1);

}
if (enabled !== false) {
extend(edges, linkedEdges);
}
if (!(modifiers != null && modifiers.length)) return;

@@ -82,6 +78,6 @@ const subModification = new Modification(arg.interaction);

state.subModification = subModification;
subModification.startAll({ ...arg
subModification.startAll({
...arg
});
},
set(arg) {

@@ -100,7 +96,5 @@ const {

aspectMethod(state, state.xIsPrimaryAxis, coords, rect);
if (!state.subModification) {
return null;
}
const correctedRect = extend({}, rect);

@@ -111,3 +105,4 @@ addEdges(linkedEdges, correctedRect, {

});
const result = state.subModification.setAll({ ...arg,
const result = state.subModification.setAll({
...arg,
rect: correctedRect,

@@ -122,13 +117,11 @@ edges: linkedEdges,

} = result;
if (result.changed) {
const xIsCriticalAxis = Math.abs(delta.x) > Math.abs(delta.y); // do aspect modification again with critical edge axis as primary
const xIsCriticalAxis = Math.abs(delta.x) > Math.abs(delta.y);
// do aspect modification again with critical edge axis as primary
aspectMethod(state, xIsCriticalAxis, result.coords, result.rect);
extend(coords, result.coords);
}
return result.eventProps;
},
defaults: {

@@ -141,3 +134,2 @@ ratio: 'preserve',

};
function setEqualDelta({

@@ -153,3 +145,2 @@ startCoords,

}
function setRatio({

@@ -169,5 +160,4 @@ startRect,

}
export default makeModifier(aspectRatio, 'aspectRatio');
export { aspectRatio };
//# sourceMappingURL=aspectRatio.js.map

@@ -1,2 +0,2 @@

import t from"../utils/extend.prod.js";import{addEdges as e}from"../utils/rect.prod.js";import o from"./Modification";import{makeModifier as r}from"./base";const i={start(e){const{state:r,rect:i,edges:s,pageCoords:a}=e;let{ratio:n,enabled:d}=r.options;const{equalDelta:l,modifiers:c}=r.options;"preserve"===n&&(n=i.width/i.height),r.startCoords=t({},a),r.startRect=t({},i),r.ratio=n,r.equalDelta=l;const p=r.linkedEdges={top:s.top||s.left&&!s.bottom,left:s.left||s.top&&!s.right,bottom:s.bottom||s.right&&!s.top,right:s.right||s.bottom&&!s.left};if(r.xIsPrimaryAxis=!(!s.left&&!s.right),r.equalDelta){const t=(p.left?1:-1)*(p.top?1:-1);r.edgeSign={x:t,y:t}}else r.edgeSign={x:p.left?-1:1,y:p.top?-1:1};if(!1!==d&&t(s,p),null==c||!c.length)return;const f=new o(e.interaction);f.copyFrom(e.interaction.modification),f.prepareStates(c),r.subModification=f,f.startAll({...e})},set(o){const{state:r,rect:i,coords:n}=o,{linkedEdges:d}=r,l=t({},n),c=r.equalDelta?s:a;if(t(o.edges,d),c(r,r.xIsPrimaryAxis,n,i),!r.subModification)return null;const p=t({},i);e(d,p,{x:n.x-l.x,y:n.y-l.y});const f=r.subModification.setAll({...o,rect:p,edges:d,pageCoords:n,prevCoords:n,prevRect:p}),{delta:g}=f;return f.changed&&(c(r,Math.abs(g.x)>Math.abs(g.y),f.coords,f.rect),t(n,f.coords)),f.eventProps},defaults:{ratio:"preserve",equalDelta:!1,modifiers:[],enabled:!1}};function s({startCoords:t,edgeSign:e},o,r){o?r.y=t.y+(r.x-t.x)*e.y:r.x=t.x+(r.y-t.y)*e.x}function a({startRect:t,startCoords:e,ratio:o,edgeSign:r},i,s,a){if(i){const i=a.width/o;s.y=e.y+(i-t.height)*r.y}else{const i=a.height*o;s.x=e.x+(i-t.width)*r.x}}export default r(i,"aspectRatio");export{i as aspectRatio};
import t from"../utils/extend.prod.js";import{addEdges as e}from"../utils/rect.prod.js";import{makeModifier as o}from"./base";import{Modification as r}from"./Modification";const i={start(e){const{state:o,rect:i,edges:s,pageCoords:a}=e;let{ratio:n,enabled:d}=o.options;const{equalDelta:l,modifiers:c}=o.options;"preserve"===n&&(n=i.width/i.height),o.startCoords=t({},a),o.startRect=t({},i),o.ratio=n,o.equalDelta=l;const p=o.linkedEdges={top:s.top||s.left&&!s.bottom,left:s.left||s.top&&!s.right,bottom:s.bottom||s.right&&!s.top,right:s.right||s.bottom&&!s.left};if(o.xIsPrimaryAxis=!(!s.left&&!s.right),o.equalDelta){const t=(p.left?1:-1)*(p.top?1:-1);o.edgeSign={x:t,y:t}}else o.edgeSign={x:p.left?-1:1,y:p.top?-1:1};if(!1!==d&&t(s,p),null==c||!c.length)return;const f=new r(e.interaction);f.copyFrom(e.interaction.modification),f.prepareStates(c),o.subModification=f,f.startAll({...e})},set(o){const{state:r,rect:i,coords:n}=o,{linkedEdges:d}=r,l=t({},n),c=r.equalDelta?s:a;if(t(o.edges,d),c(r,r.xIsPrimaryAxis,n,i),!r.subModification)return null;const p=t({},i);e(d,p,{x:n.x-l.x,y:n.y-l.y});const f=r.subModification.setAll({...o,rect:p,edges:d,pageCoords:n,prevCoords:n,prevRect:p}),{delta:g}=f;return f.changed&&(c(r,Math.abs(g.x)>Math.abs(g.y),f.coords,f.rect),t(n,f.coords)),f.eventProps},defaults:{ratio:"preserve",equalDelta:!1,modifiers:[],enabled:!1}};function s({startCoords:t,edgeSign:e},o,r){o?r.y=t.y+(r.x-t.x)*e.y:r.x=t.x+(r.y-t.y)*e.x}function a({startRect:t,startCoords:e,ratio:o,edgeSign:r},i,s,a){if(i){const i=a.width/o;s.y=e.y+(i-t.height)*r.y}else{const i=a.height*o;s.x=e.x+(i-t.width)*r.x}}export default o(i,"aspectRatio");export{i as aspectRatio};
//# sourceMappingURL=aspectRatio.prod.js.map
import type { InteractEvent } from '@interactjs/core/InteractEvent';
import type Interaction from '@interactjs/core/Interaction';
import type { Plugin } from '@interactjs/core/scope';
import Modification from './Modification';
import { Modification } from './Modification';
import type { Modifier, ModifierModule, ModifierState } from './types';

@@ -6,0 +6,0 @@ declare module '@interactjs/core/Interaction' {

@@ -1,2 +0,2 @@

import Modification from './Modification';
import { Modification } from './Modification';
export function makeModifier(module, name) {

@@ -12,7 +12,7 @@ const {

};
const modifier = _options => {
const options = _options || {};
options.enabled = options.enabled !== false; // add missing defaults to options
options.enabled = options.enabled !== false;
// add missing defaults to options
for (const prop in defaults) {

@@ -24,3 +24,2 @@ if (!(prop in options)) {

}
const m = {

@@ -41,3 +40,2 @@ options,

};
if (name && typeof name === 'string') {

@@ -48,3 +46,2 @@ // for backwrads compatibility

}
return modifier;

@@ -57,3 +54,2 @@ }

const result = interaction.modification.result;
if (result) {

@@ -60,0 +56,0 @@ iEvent.modifiers = result.eventProps;

@@ -1,2 +0,2 @@

import t from"./Modification";export function makeModifier(t,e){const{defaults:i}=t,n={start:t.start,set:t.set,beforeEnd:t.beforeEnd,stop:t.stop},o=t=>{const o=t||{};o.enabled=!1!==o.enabled;for(const t in i)t in o||(o[t]=i[t]);const r={options:o,methods:n,name:e,enable:()=>(o.enabled=!0,r),disable:()=>(o.enabled=!1,r)};return r};return e&&"string"==typeof e&&(o._defaults=i,o._methods=n),o}export function addEventModifiers({iEvent:t,interaction:e}){const i=e.modification.result;i&&(t.modifiers=i.eventProps)}const e={id:"modifiers/base",before:["actions"],install(t){t.defaults.perAction.modifiers=[]},listeners:{"interactions:new"({interaction:e}){e.modification=new t(e)},"interactions:before-action-start"(t){const{interaction:e}=t,i=t.interaction.modification;i.start(t,e.coords.start.page),e.edges=i.edges,i.applyToInteraction(t)},"interactions:before-action-move"(t){const{interaction:e}=t,{modification:i}=e,n=i.setAndApply(t);return e.edges=i.edges,n},"interactions:before-action-end"(t){const{interaction:e}=t,{modification:i}=e,n=i.beforeEnd(t);return e.edges=i.startEdges,n},"interactions:action-start":addEventModifiers,"interactions:action-move":addEventModifiers,"interactions:action-end":addEventModifiers,"interactions:after-action-start":t=>t.interaction.modification.restoreInteractionCoords(t),"interactions:after-action-move":t=>t.interaction.modification.restoreInteractionCoords(t),"interactions:stop":t=>t.interaction.modification.stop(t)}};export default e;
import{Modification as t}from"./Modification";export function makeModifier(t,e){const{defaults:i}=t,n={start:t.start,set:t.set,beforeEnd:t.beforeEnd,stop:t.stop},o=t=>{const o=t||{};o.enabled=!1!==o.enabled;for(const t in i)t in o||(o[t]=i[t]);const r={options:o,methods:n,name:e,enable:()=>(o.enabled=!0,r),disable:()=>(o.enabled=!1,r)};return r};return e&&"string"==typeof e&&(o._defaults=i,o._methods=n),o}export function addEventModifiers({iEvent:t,interaction:e}){const i=e.modification.result;i&&(t.modifiers=i.eventProps)}const e={id:"modifiers/base",before:["actions"],install(t){t.defaults.perAction.modifiers=[]},listeners:{"interactions:new"({interaction:e}){e.modification=new t(e)},"interactions:before-action-start"(t){const{interaction:e}=t,i=t.interaction.modification;i.start(t,e.coords.start.page),e.edges=i.edges,i.applyToInteraction(t)},"interactions:before-action-move"(t){const{interaction:e}=t,{modification:i}=e,n=i.setAndApply(t);return e.edges=i.edges,n},"interactions:before-action-end"(t){const{interaction:e}=t,{modification:i}=e,n=i.beforeEnd(t);return e.edges=i.startEdges,n},"interactions:action-start":addEventModifiers,"interactions:action-move":addEventModifiers,"interactions:action-end":addEventModifiers,"interactions:after-action-start":t=>t.interaction.modification.restoreInteractionCoords(t),"interactions:after-action-move":t=>t.interaction.modification.restoreInteractionCoords(t),"interactions:stop":t=>t.interaction.modification.stop(t)}};export default e;
//# sourceMappingURL=base.prod.js.map

@@ -21,3 +21,3 @@ import type { EventPhase } from '@interactjs/core/InteractEvent';

}
export default class Modification {
export declare class Modification {
states: ModifierState[];

@@ -24,0 +24,0 @@ startOffset: Rect;

import clone from "../utils/clone.js";
import extend from "../utils/extend.js";
import * as rectUtils from "../utils/rect.js";
export default class Modification {
export class Modification {
states = [];

@@ -18,3 +18,2 @@ startOffset = {

interaction;
constructor(interaction) {

@@ -30,3 +29,2 @@ this.interaction = interaction;

}
start({

@@ -57,3 +55,2 @@ phase

}
fillArg(arg) {

@@ -71,3 +68,2 @@ const {

}
startAll(arg) {

@@ -81,3 +77,2 @@ for (const state of this.states) {

}
setAll(arg) {

@@ -96,6 +91,4 @@ const {

const newResult = createResult(arg.coords, arg.rect);
for (const state of states) {
var _state$methods;
const {

@@ -106,3 +99,2 @@ options

let returnValue = null;
if ((_state$methods = state.methods) != null && _state$methods.set && this.shouldDo(options, preEnd, phase)) {

@@ -116,6 +108,4 @@ arg.state = state;

}
newResult.eventProps.push(returnValue);
}
extend(this.edges, arg.edges);

@@ -130,3 +120,2 @@ newResult.delta.x = arg.coords.x - arg.pageCoords.x;

const prevRect = this.result.rect;
if (prevCoords && prevRect) {

@@ -136,6 +125,4 @@ const rectChanged = newResult.rect.left !== prevRect.left || newResult.rect.right !== prevRect.right || newResult.rect.top !== prevRect.top || newResult.rect.bottom !== prevRect.bottom;

}
return newResult;
}
applyToInteraction(arg) {

@@ -155,7 +142,5 @@ const {

const curDelta = result.delta;
if (phase === 'start') {
extend(this.startDelta, result.delta);
}
for (const [coordsSet, delta] of [[startCoords, startDelta], [curCoords, curDelta]]) {

@@ -167,3 +152,2 @@ coordsSet.page.x += delta.x;

}
const {

@@ -180,3 +164,2 @@ rectDelta

}
setAndApply(arg) {

@@ -196,9 +179,9 @@ const {

}));
this.result = result; // don't fire an action move if a modifier would keep the event in the same
this.result = result;
// don't fire an action move if a modifier would keep the event in the same
// cordinates as before
if (!result.changed && (!skipModifiers || skipModifiers < this.states.length) && interaction.interacting()) {
return false;
}
if (arg.modifiedCoords) {

@@ -217,6 +200,4 @@ const {

}
this.applyToInteraction(arg);
}
beforeEnd(arg) {

@@ -228,9 +209,6 @@ const {

const states = this.states;
if (!states || !states.length) {
return;
}
let doPreend = false;
for (const state of states) {

@@ -243,3 +221,2 @@ arg.state = state;

const endPosition = methods.beforeEnd && methods.beforeEnd(arg);
if (endPosition) {

@@ -249,6 +226,4 @@ this.endResult = endPosition;

}
doPreend = doPreend || !doPreend && this.shouldDo(options, true, arg.phase, true);
}
if (doPreend) {

@@ -262,3 +237,2 @@ // trigger a final modified move before ending

}
stop(arg) {

@@ -268,7 +242,5 @@ const {

} = arg;
if (!this.states || !this.states.length) {
return;
}
const modifierArg = extend({

@@ -281,6 +253,4 @@ states: this.states,

this.fillArg(modifierArg);
for (const state of this.states) {
modifierArg.state = state;
if (state.methods.stop) {

@@ -290,10 +260,7 @@ state.methods.stop(modifierArg);

}
this.states = null;
this.endResult = null;
}
prepareStates(modifierList) {
this.states = [];
for (let index = 0; index < modifierList.length; index++) {

@@ -312,6 +279,4 @@ const {

}
return this.states;
}
restoreInteractionCoords({

@@ -333,3 +298,2 @@ interaction: {

const coordsAndDeltas = [[coords.start, startDelta], [coords.cur, curDelta]];
for (const [coordsSet, delta] of coordsAndDeltas) {

@@ -341,3 +305,2 @@ coordsSet.page.x -= delta.x;

}
rect.left -= rectDelta.left;

@@ -348,15 +311,16 @@ rect.right -= rectDelta.right;

}
shouldDo(options, preEnd, phase, requireEndOnly) {
if ( // ignore disabled modifiers
!options || options.enabled === false || // check if we require endOnly option to fire move before end
requireEndOnly && !options.endOnly || // don't apply endOnly modifiers when not ending
options.endOnly && !preEnd || // check if modifier should run be applied on start
if (
// ignore disabled modifiers
!options || options.enabled === false ||
// check if we require endOnly option to fire move before end
requireEndOnly && !options.endOnly ||
// don't apply endOnly modifiers when not ending
options.endOnly && !preEnd ||
// check if modifier should run be applied on start
phase === 'start' && !options.setStart) {
return false;
}
return true;
}
copyFrom(other) {

@@ -370,3 +334,2 @@ this.startOffset = other.startOffset;

}
destroy() {

@@ -377,5 +340,3 @@ for (const prop in this) {

}
}
function createResult(coords, rect) {

@@ -399,11 +360,8 @@ return {

}
function getModifierList(interaction) {
const actionOptions = interaction.interactable.options[interaction.prepared.name];
const actionModifiers = actionOptions.modifiers;
if (actionModifiers && actionModifiers.length) {
return actionModifiers;
}
return ['snap', 'snapSize', 'snapEdges', 'restrict', 'restrictEdges', 'restrictSize'].map(type => {

@@ -417,3 +375,2 @@ const options = actionOptions[type];

}
export function getRectOffset(rect, coords) {

@@ -420,0 +377,0 @@ return rect ? {

@@ -1,2 +0,2 @@

import t from"../utils/clone.prod.js";import e from"../utils/extend.prod.js";import*as s from"../utils/rect.prod.js";export default class o{states=[];startOffset={left:0,right:0,top:0,bottom:0};startDelta;result;endResult;startEdges;edges;interaction;constructor(t){this.interaction=t,this.result=r(),this.edges={left:!1,right:!1,top:!1,bottom:!1}}start({phase:t},s){const{interaction:o}=this,i=(t=>{const e=t.interactable.options[t.prepared.name],s=e.modifiers;return s&&s.length?s:["snap","snapSize","snapEdges","restrict","restrictEdges","restrictSize"].map((t=>{const s=e[t];return s&&s.enabled&&{options:s,methods:s._methods}})).filter((t=>!!t))})(o);this.prepareStates(i),this.startEdges=e({},o.edges),this.edges=e({},this.startEdges),this.startOffset=getRectOffset(o.rect,s),this.startDelta={x:0,y:0};const a=this.fillArg({phase:t,pageCoords:s,preEnd:!1});return this.result=r(),this.startAll(a),this.result=this.setAll(a)}fillArg(t){const{interaction:e}=this;return t.interaction=e,t.interactable=e.interactable,t.element=e.element,t.rect||=e.rect,t.edges||=this.startEdges,t.startOffset=this.startOffset,t}startAll(t){for(const e of this.states)e.methods.start&&(t.state=e,e.methods.start(t))}setAll(t){const{phase:o,preEnd:i,skipModifiers:a,rect:n,edges:l}=t;t.coords=e({},t.pageCoords),t.rect=e({},n),t.edges=e({},l);const c=a?this.states.slice(a):this.states,d=r(t.coords,t.rect);for(const r of c){var h;const{options:a}=r,n=e({},t.coords);let l=null;null!=(h=r.methods)&&h.set&&this.shouldDo(a,i,o)&&(t.state=r,l=r.methods.set(t),s.addEdges(t.edges,t.rect,{x:t.coords.x-n.x,y:t.coords.y-n.y})),d.eventProps.push(l)}e(this.edges,t.edges),d.delta.x=t.coords.x-t.pageCoords.x,d.delta.y=t.coords.y-t.pageCoords.y,d.rectDelta.left=t.rect.left-n.left,d.rectDelta.right=t.rect.right-n.right,d.rectDelta.top=t.rect.top-n.top,d.rectDelta.bottom=t.rect.bottom-n.bottom;const p=this.result.coords,f=this.result.rect;if(p&&f){const t=d.rect.left!==f.left||d.rect.right!==f.right||d.rect.top!==f.top||d.rect.bottom!==f.bottom;d.changed=t||p.x!==d.coords.x||p.y!==d.coords.y}return d}applyToInteraction(t){const{interaction:s}=this,{phase:o}=t,r=s.coords.cur,i=s.coords.start,{result:a,startDelta:n}=this,l=a.delta;"start"===o&&e(this.startDelta,a.delta);for(const[t,e]of[[i,n],[r,l]])t.page.x+=e.x,t.page.y+=e.y,t.client.x+=e.x,t.client.y+=e.y;const{rectDelta:c}=this.result,d=t.rect||s.rect;d.left+=c.left,d.right+=c.right,d.top+=c.top,d.bottom+=c.bottom,d.width=d.right-d.left,d.height=d.bottom-d.top}setAndApply(t){const{interaction:e}=this,{phase:s,preEnd:o,skipModifiers:r}=t,i=this.setAll(this.fillArg({preEnd:o,phase:s,pageCoords:t.modifiedCoords||e.coords.cur.page}));if(this.result=i,!i.changed&&(!r||r<this.states.length)&&e.interacting())return!1;if(t.modifiedCoords){const{page:s}=e.coords.cur,o={x:t.modifiedCoords.x-s.x,y:t.modifiedCoords.y-s.y};i.coords.x+=o.x,i.coords.y+=o.y,i.delta.x+=o.x,i.delta.y+=o.y}this.applyToInteraction(t)}beforeEnd(t){const{interaction:e,event:s}=t,o=this.states;if(!o||!o.length)return;let r=!1;for(const e of o){t.state=e;const{options:s,methods:o}=e,i=o.beforeEnd&&o.beforeEnd(t);if(i)return this.endResult=i,!1;r=r||!r&&this.shouldDo(s,!0,t.phase,!0)}r&&e.move({event:s,preEnd:!0})}stop(t){const{interaction:s}=t;if(!this.states||!this.states.length)return;const o=e({states:this.states,interactable:s.interactable,element:s.element,rect:null},t);this.fillArg(o);for(const t of this.states)o.state=t,t.methods.stop&&t.methods.stop(o);this.states=null,this.endResult=null}prepareStates(t){this.states=[];for(let e=0;e<t.length;e++){const{options:s,methods:o,name:r}=t[e];this.states.push({options:s,methods:o,index:e,name:r})}return this.states}restoreInteractionCoords({interaction:{coords:t,rect:e,modification:s}}){if(!s.result)return;const{startDelta:o}=s,{delta:r,rectDelta:i}=s.result,a=[[t.start,o],[t.cur,r]];for(const[t,e]of a)t.page.x-=e.x,t.page.y-=e.y,t.client.x-=e.x,t.client.y-=e.y;e.left-=i.left,e.right-=i.right,e.top-=i.top,e.bottom-=i.bottom}shouldDo(t,e,s,o){return!(!t||!1===t.enabled||o&&!t.endOnly||t.endOnly&&!e||"start"===s&&!t.setStart)}copyFrom(s){this.startOffset=s.startOffset,this.startDelta=s.startDelta,this.startEdges=s.startEdges,this.edges=s.edges,this.states=s.states.map((e=>t(e))),this.result=r(e({},s.result.coords),e({},s.result.rect))}destroy(){for(const t in this)this[t]=null}}function r(t,e){return{rect:e,coords:t,delta:{x:0,y:0},rectDelta:{left:0,right:0,top:0,bottom:0},eventProps:[],changed:!0}}export function getRectOffset(t,e){return t?{left:e.x-t.left,top:e.y-t.top,right:t.right-e.x,bottom:t.bottom-e.y}:{left:0,top:0,right:0,bottom:0}}
import t from"../utils/clone.prod.js";import e from"../utils/extend.prod.js";import*as s from"../utils/rect.prod.js";export class Modification{states=[];startOffset={left:0,right:0,top:0,bottom:0};startDelta;result;endResult;startEdges;edges;interaction;constructor(t){this.interaction=t,this.result=o(),this.edges={left:!1,right:!1,top:!1,bottom:!1}}start({phase:t},s){const{interaction:r}=this,i=(t=>{const e=t.interactable.options[t.prepared.name],s=e.modifiers;return s&&s.length?s:["snap","snapSize","snapEdges","restrict","restrictEdges","restrictSize"].map((t=>{const s=e[t];return s&&s.enabled&&{options:s,methods:s._methods}})).filter((t=>!!t))})(r);this.prepareStates(i),this.startEdges=e({},r.edges),this.edges=e({},this.startEdges),this.startOffset=getRectOffset(r.rect,s),this.startDelta={x:0,y:0};const n=this.fillArg({phase:t,pageCoords:s,preEnd:!1});return this.result=o(),this.startAll(n),this.result=this.setAll(n)}fillArg(t){const{interaction:e}=this;return t.interaction=e,t.interactable=e.interactable,t.element=e.element,t.rect||=e.rect,t.edges||=this.startEdges,t.startOffset=this.startOffset,t}startAll(t){for(const e of this.states)e.methods.start&&(t.state=e,e.methods.start(t))}setAll(t){const{phase:r,preEnd:i,skipModifiers:n,rect:a,edges:l}=t;t.coords=e({},t.pageCoords),t.rect=e({},a),t.edges=e({},l);const c=n?this.states.slice(n):this.states,d=o(t.coords,t.rect);for(const o of c){var h;const{options:n}=o,a=e({},t.coords);let l=null;null!=(h=o.methods)&&h.set&&this.shouldDo(n,i,r)&&(t.state=o,l=o.methods.set(t),s.addEdges(t.edges,t.rect,{x:t.coords.x-a.x,y:t.coords.y-a.y})),d.eventProps.push(l)}e(this.edges,t.edges),d.delta.x=t.coords.x-t.pageCoords.x,d.delta.y=t.coords.y-t.pageCoords.y,d.rectDelta.left=t.rect.left-a.left,d.rectDelta.right=t.rect.right-a.right,d.rectDelta.top=t.rect.top-a.top,d.rectDelta.bottom=t.rect.bottom-a.bottom;const p=this.result.coords,f=this.result.rect;if(p&&f){const t=d.rect.left!==f.left||d.rect.right!==f.right||d.rect.top!==f.top||d.rect.bottom!==f.bottom;d.changed=t||p.x!==d.coords.x||p.y!==d.coords.y}return d}applyToInteraction(t){const{interaction:s}=this,{phase:o}=t,r=s.coords.cur,i=s.coords.start,{result:n,startDelta:a}=this,l=n.delta;"start"===o&&e(this.startDelta,n.delta);for(const[t,e]of[[i,a],[r,l]])t.page.x+=e.x,t.page.y+=e.y,t.client.x+=e.x,t.client.y+=e.y;const{rectDelta:c}=this.result,d=t.rect||s.rect;d.left+=c.left,d.right+=c.right,d.top+=c.top,d.bottom+=c.bottom,d.width=d.right-d.left,d.height=d.bottom-d.top}setAndApply(t){const{interaction:e}=this,{phase:s,preEnd:o,skipModifiers:r}=t,i=this.setAll(this.fillArg({preEnd:o,phase:s,pageCoords:t.modifiedCoords||e.coords.cur.page}));if(this.result=i,!i.changed&&(!r||r<this.states.length)&&e.interacting())return!1;if(t.modifiedCoords){const{page:s}=e.coords.cur,o={x:t.modifiedCoords.x-s.x,y:t.modifiedCoords.y-s.y};i.coords.x+=o.x,i.coords.y+=o.y,i.delta.x+=o.x,i.delta.y+=o.y}this.applyToInteraction(t)}beforeEnd(t){const{interaction:e,event:s}=t,o=this.states;if(!o||!o.length)return;let r=!1;for(const e of o){t.state=e;const{options:s,methods:o}=e,i=o.beforeEnd&&o.beforeEnd(t);if(i)return this.endResult=i,!1;r=r||!r&&this.shouldDo(s,!0,t.phase,!0)}r&&e.move({event:s,preEnd:!0})}stop(t){const{interaction:s}=t;if(!this.states||!this.states.length)return;const o=e({states:this.states,interactable:s.interactable,element:s.element,rect:null},t);this.fillArg(o);for(const t of this.states)o.state=t,t.methods.stop&&t.methods.stop(o);this.states=null,this.endResult=null}prepareStates(t){this.states=[];for(let e=0;e<t.length;e++){const{options:s,methods:o,name:r}=t[e];this.states.push({options:s,methods:o,index:e,name:r})}return this.states}restoreInteractionCoords({interaction:{coords:t,rect:e,modification:s}}){if(!s.result)return;const{startDelta:o}=s,{delta:r,rectDelta:i}=s.result,n=[[t.start,o],[t.cur,r]];for(const[t,e]of n)t.page.x-=e.x,t.page.y-=e.y,t.client.x-=e.x,t.client.y-=e.y;e.left-=i.left,e.right-=i.right,e.top-=i.top,e.bottom-=i.bottom}shouldDo(t,e,s,o){return!(!t||!1===t.enabled||o&&!t.endOnly||t.endOnly&&!e||"start"===s&&!t.setStart)}copyFrom(s){this.startOffset=s.startOffset,this.startDelta=s.startDelta,this.startEdges=s.startEdges,this.edges=s.edges,this.states=s.states.map((e=>t(e))),this.result=o(e({},s.result.coords),e({},s.result.rect))}destroy(){for(const t in this)this[t]=null}}function o(t,e){return{rect:e,coords:t,delta:{x:0,y:0},rectDelta:{left:0,right:0,top:0,bottom:0},eventProps:[],changed:!0}}export function getRectOffset(t,e){return t?{left:e.x-t.left,top:e.y-t.top,right:t.right-e.x,bottom:t.bottom-e.y}:{left:0,top:0,right:0,bottom:0}}
//# sourceMappingURL=Modification.prod.js.map
const noop = () => {};
noop._defaults = {};
export default noop;
//# sourceMappingURL=noop.js.map
{
"name": "@interactjs/modifiers",
"version": "1.10.23",
"version": "1.10.24",
"main": "index",

@@ -13,10 +13,10 @@ "module": "index",

"dependencies": {
"@interactjs/snappers": "1.10.23"
"@interactjs/snappers": "1.10.24"
},
"peerDependencies": {
"@interactjs/core": "1.10.23",
"@interactjs/utils": "1.10.23"
"@interactjs/core": "1.10.24",
"@interactjs/utils": "1.10.24"
},
"optionalDependencies": {
"@interactjs/interact": "1.10.23"
"@interactjs/interact": "1.10.24"
},

@@ -31,3 +31,3 @@ "publishConfig": {

"license": "MIT",
"gitHead": "9ba48631"
"gitHead": "86c64a3f"
}
import snappers from "../snappers/plugin.js";
/* eslint-disable import/no-duplicates -- for typescript module augmentations */
import './all';

@@ -12,3 +12,2 @@ import './base';

id: 'modifiers',
install(scope) {

@@ -20,4 +19,5 @@ const {

scope.usePlugin(snappers);
interact.modifiers = all; // for backwrads compatibility
interact.modifiers = all;
// for backwrads compatibility
for (const type in all) {

@@ -32,5 +32,4 @@ const {

}
};
export default modifiers;
//# sourceMappingURL=plugin.js.map

@@ -11,3 +11,3 @@ import type { Point, Rect } from '@interactjs/core/types';

}
export declare type RestrictEdgesState = ModifierState<RestrictEdgesOptions, {
export type RestrictEdgesState = ModifierState<RestrictEdgesOptions, {
inner: Rect;

@@ -14,0 +14,0 @@ outer: Rect;

@@ -1,2 +0,2 @@

// This module adds the options.resize.restrictEdges setting which sets min and
// This modifier adds the options.resize.restrictEdges setting which sets min and
// max for the top, left, bottom and right edges of the target being resized.

@@ -11,2 +11,3 @@ //

// })
import extend from "../../utils/extend.js";

@@ -28,3 +29,2 @@ import * as rectUtils from "../../utils/rect.js";

};
function start({

@@ -39,3 +39,2 @@ interaction,

let offset;
if (options) {

@@ -45,3 +44,2 @@ const offsetRect = getRestrictionRect(options.offset, interaction, interaction.coords.start.page);

}
offset = offset || {

@@ -58,3 +56,2 @@ x: 0,

}
function set({

@@ -70,7 +67,5 @@ coords,

} = state;
if (!edges) {
return;
}
const page = extend({}, coords);

@@ -81,3 +76,2 @@ const inner = getRestrictionRect(options.inner, interaction, page) || {};

fixRect(outer, noOuter);
if (edges.top) {

@@ -88,3 +82,2 @@ coords.y = Math.min(Math.max(outer.top + offset.top, page.y), inner.top + offset.top);

}
if (edges.left) {

@@ -96,3 +89,2 @@ coords.x = Math.min(Math.max(outer.left + offset.left, page.x), inner.left + offset.left);

}
function fixRect(rect, defaults) {

@@ -104,6 +96,4 @@ for (const edge of ['top', 'left', 'bottom', 'right']) {

}
return rect;
}
const defaults = {

@@ -110,0 +100,0 @@ inner: null,

@@ -11,3 +11,3 @@ import type Interaction from '@interactjs/core/Interaction';

}
export declare type RestrictState = ModifierState<RestrictOptions, {
export type RestrictState = ModifierState<RestrictOptions, {
offset: Rect;

@@ -14,0 +14,0 @@ }>;

@@ -5,3 +5,2 @@ import extend from "../../utils/extend.js";

import { makeModifier } from '../base';
function start({

@@ -26,10 +25,7 @@ rect,

}, options.offset || {});
if (rect && elementRect) {
const restriction = getRestrictionRect(options.restriction, interaction, pageCoords);
if (restriction) {
const widthDiff = restriction.right - restriction.left - rect.width;
const heightDiff = restriction.bottom - restriction.top - rect.height;
if (widthDiff < 0) {

@@ -39,3 +35,2 @@ offset.left += widthDiff;

}
if (heightDiff < 0) {

@@ -46,3 +41,2 @@ offset.top += heightDiff;

}
offset.left += startOffset.left - rect.width * elementRect.left;

@@ -53,6 +47,4 @@ offset.top += startOffset.top - rect.height * elementRect.top;

}
state.offset = offset;
}
function set({

@@ -73,3 +65,2 @@ coords,

}
export function getRestrictionRect(value, interaction, coords) {

@@ -76,0 +67,0 @@ if (is.func(value)) {

@@ -13,5 +13,3 @@ import extend from "../../utils/extend.js";

},
set elementRect(_) {}
}, restrict.defaults);

@@ -18,0 +16,0 @@ const restrictRect = {

@@ -12,3 +12,3 @@ import type { Point, Rect, Size } from '@interactjs/core/types';

declare function start(arg: ModifierArg<RestrictEdgesState>): void;
export declare type RestrictSizeState = RestrictEdgesState & ModifierState<RestrictSizeOptions & {
export type RestrictSizeState = RestrictEdgesState & ModifierState<RestrictSizeOptions & {
inner: Rect;

@@ -15,0 +15,0 @@ outer: Rect;

@@ -14,7 +14,5 @@ import extend from "../../utils/extend.js";

};
function start(arg) {
return restrictEdges.start(arg);
}
function set(arg) {

@@ -30,7 +28,5 @@ const {

} = state;
if (!edges) {
return;
}
const minSize = rectUtils.tlbrToXywh(getRestrictionRect(options.min, interaction, arg.coords)) || noMin;

@@ -43,3 +39,2 @@ const maxSize = rectUtils.tlbrToXywh(getRestrictionRect(options.max, interaction, arg.coords)) || noMax;

};
if (edges.top) {

@@ -52,3 +47,2 @@ state.options.inner.top = rect.bottom - minSize.height;

}
if (edges.left) {

@@ -61,7 +55,5 @@ state.options.inner.left = rect.right - minSize.width;

}
restrictEdges.set(arg);
state.options = options;
}
const defaults = {

@@ -68,0 +60,0 @@ min: null,

@@ -5,3 +5,3 @@ /**

* @description
* WOW> This module allows snapping of the edges of targets during resize
* This modifier allows snapping of the edges of targets during resize
* interactions.

@@ -33,3 +33,3 @@ *

import { snapSize } from './size';
export declare type SnapEdgesOptions = Pick<SnapOptions, 'targets' | 'range' | 'offset' | 'endOnly' | 'enabled'>;
export type SnapEdgesOptions = Pick<SnapOptions, 'targets' | 'range' | 'offset' | 'endOnly' | 'enabled'>;
declare const snapEdges: ModifierModule<SnapEdgesOptions, SnapState, ReturnType<typeof snapSize.set>>;

@@ -36,0 +36,0 @@ declare const _default: {

@@ -5,3 +5,3 @@ /**

* @description
* WOW> This module allows snapping of the edges of targets during resize
* This modifier allows snapping of the edges of targets during resize
* interactions.

@@ -30,2 +30,3 @@ *

*/
import clone from "../../utils/clone.js";

@@ -35,3 +36,2 @@ import extend from "../../utils/extend.js";

import { snapSize } from './size';
function start(arg) {

@@ -41,11 +41,8 @@ const {

} = arg;
if (!edges) {
return null;
}
arg.state.targetFields = arg.state.targetFields || [[edges.left ? 'left' : 'right', edges.top ? 'top' : 'bottom']];
return snapSize.start(arg);
}
const snapEdges = {

@@ -52,0 +49,0 @@ start,

@@ -17,4 +17,4 @@ import type { Interaction, InteractionProxy } from '@interactjs/core/Interaction';

}
export declare type SnapFunction = (x: number, y: number, interaction: InteractionProxy<ActionName>, offset: Offset, index: number) => SnapPosition;
export declare type SnapTarget = SnapPosition | SnapFunction;
export type SnapFunction = (x: number, y: number, interaction: InteractionProxy<ActionName>, offset: Offset, index: number) => SnapPosition;
export type SnapTarget = SnapPosition | SnapFunction;
export interface SnapOptions {

@@ -30,3 +30,3 @@ targets?: SnapTarget[];

}
export declare type SnapState = ModifierState<SnapOptions, {
export type SnapState = ModifierState<SnapOptions, {
offsets?: Offset[];

@@ -33,0 +33,0 @@ closest?: any;

@@ -7,3 +7,2 @@ import extend from "../../utils/extend.js";

import { makeModifier } from '../base';
function start(arg) {

@@ -26,3 +25,2 @@ const {

let snapOffset;
if (options.offset === 'startCoords') {

@@ -42,3 +40,2 @@ snapOffset = {

}
const {

@@ -59,3 +56,2 @@ relativePoints

}
function set(arg) {

@@ -74,3 +70,2 @@ const {

const targets = [];
if (!options.offsetWithOrigin) {

@@ -80,11 +75,8 @@ page.x -= origin.x;

}
for (const offset of offsets) {
const relativeX = page.x - offset.x;
const relativeY = page.y - offset.y;
for (let index = 0, len = options.targets.length; index < len; index++) {
const snapTarget = options.targets[index];
let target;
if (is.func(snapTarget)) {

@@ -95,7 +87,5 @@ target = snapTarget(relativeX, relativeY, interaction._proxy, offset, index);

}
if (!target) {
continue;
}
targets.push({

@@ -111,3 +101,2 @@ x: (is.number(target.x) ? target.x : relativeX) + offset.x,

}
const closest = {

@@ -123,3 +112,2 @@ target: null,

};
for (const target of targets) {

@@ -130,14 +118,19 @@ const range = target.range;

const distance = hypot(dx, dy);
let inRange = distance <= range; // Infinite targets count as being out of range
let inRange = distance <= range;
// Infinite targets count as being out of range
// compared to non infinite ones that are in range
if (range === Infinity && closest.inRange && closest.range !== Infinity) {
inRange = false;
}
if (!closest.target || (inRange ? // is the closest target in range?
closest.inRange && range !== Infinity ? // the pointer is relatively deeper in this target
distance / range < closest.distance / closest.range : // this target has Infinite range and the closest doesn't
range === Infinity && closest.range !== Infinity || // OR this target is closer that the previous closest
distance < closest.distance : // The other is not in range and the pointer is closer to this target
if (!closest.target || (inRange ?
// is the closest target in range?
closest.inRange && range !== Infinity ?
// the pointer is relatively deeper in this target
distance / range < closest.distance / closest.range :
// this target has Infinite range and the closest doesn't
range === Infinity && closest.range !== Infinity ||
// OR this target is closer that the previous closest
distance < closest.distance :
// The other is not in range and the pointer is closer to this target
!closest.inRange && distance < closest.distance)) {

@@ -152,3 +145,2 @@ closest.target = target;

}
if (closest.inRange) {

@@ -158,7 +150,5 @@ coords.x = closest.target.x;

}
state.closest = closest;
return closest;
}
function getOrigin(arg) {

@@ -172,3 +162,2 @@ const {

}
const defaults = {

@@ -175,0 +164,0 @@ range: Infinity,

import type { ModifierArg } from '../types';
import type { SnapOptions, SnapState } from './pointer';
export declare type SnapSizeOptions = Pick<SnapOptions, 'targets' | 'offset' | 'endOnly' | 'range' | 'enabled'>;
export type SnapSizeOptions = Pick<SnapOptions, 'targets' | 'offset' | 'endOnly' | 'range' | 'enabled'>;
declare function start(arg: ModifierArg<SnapState>): any;

@@ -5,0 +5,0 @@ declare function set(arg: any): {

@@ -1,3 +0,4 @@

// This module allows snapping of the size of targets during resize
// This modifier allows snapping of the size of targets during resize
// interactions.
import extend from "../../utils/extend.js";

@@ -7,3 +8,2 @@ import is from "../../utils/is.js";

import { snap } from './pointer';
function start(arg) {

@@ -17,7 +17,5 @@ const {

} = state;
if (!edges) {
return null;
}
arg.state = {

@@ -43,3 +41,2 @@ options: {

}
function set(arg) {

@@ -61,6 +58,4 @@ const {

state.options.targets = [];
for (const snapTarget of options.targets || []) {
let target;
if (is.func(snapTarget)) {

@@ -71,7 +66,5 @@ target = snapTarget(relative.x, relative.y, interaction);

}
if (!target) {
continue;
}
for (const [xField, yField] of state.targetFields) {

@@ -84,6 +77,4 @@ if (xField in target || yField in target) {

}
state.options.targets.push(target);
}
const returnValue = snap.set(arg);

@@ -93,3 +84,2 @@ state.options = options;

}
const defaults = {

@@ -96,0 +86,0 @@ range: Infinity,

@@ -0,3 +1,3 @@

import type { Interactable } from '@interactjs/core/Interactable';
import type { EventPhase } from '@interactjs/core/InteractEvent';
import type { Interactable } from '@interactjs/core/Interactable';
import type Interaction from '@interactjs/core/Interaction';

@@ -17,3 +17,3 @@ import type { EdgeOptions, FullRect, Point, Rect } from '@interactjs/core/types';

}
export declare type ModifierState<Defaults = unknown, StateProps = unknown, Name extends string = any> = {
export type ModifierState<Defaults = unknown, StateProps = unknown, Name extends string = any> = {
options: Defaults;

@@ -20,0 +20,0 @@ methods?: Modifier<Defaults>['methods'];

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc