react-moveable - npm Package Compare versions

Comparing version 0.52.1 to 0.53.0

CHANGELOG.md

@@ -6,2 +6,24 @@ # Change Log
 
+## [0.52.1](https://github.com/daybrush/moveable/blob/master/packages/react-moveable/compare/react-moveable@0.52.0...react-moveable@0.52.1) (2023-06-28)
+
+
+### :bug: Bug Fix
+
+* fix dragTarget's unset #960 ([8e60b38](https://github.com/daybrush/moveable/blob/master/packages/react-moveable/commit/8e60b385b8931a3aab953b315618ec15f9360611))
+* fix helper alias ([ee5bf0b](https://github.com/daybrush/moveable/blob/master/packages/react-moveable/commit/ee5bf0b958a49694e4eed111755d1ef5ba5c6dc9))
+
+
+### :house: Code Refactoring
+
+* change rollup to vite ([213f346](https://github.com/daybrush/moveable/blob/master/packages/react-moveable/commit/213f346257289eaec6f3f6f618e8fba33859c384))
+
+
+### :mega: Other
+
+* fix ts-loader version ([429ae5f](https://github.com/daybrush/moveable/blob/master/packages/react-moveable/commit/429ae5faa48fa9bedfc2463c1aaaebc58575bf80))
+* fix update modules ([bb608dc](https://github.com/daybrush/moveable/blob/master/packages/react-moveable/commit/bb608dc0d1d9eb13e538d1026c05809d89757b1d))
+* publish packages ([510d7cd](https://github.com/daybrush/moveable/blob/master/packages/react-moveable/commit/510d7cdf76eef4a17cc75d95634ebcb6d9688f8e))
+
+
+
 ## [0.52.0](https://github.com/daybrush/moveable/blob/master/packages/react-moveable/compare/react-moveable@0.51.0...react-moveable@0.52.0) (2023-06-25)
@@ -8,0 +30,0 @@

declaration/gesto/GestoUtils.d.ts

@@ -10,3 +10,3 @@ import { MoveableManagerState, ResizableProps, MoveableManagerInterface, OnTransformEvent, OnTransformStartEvent, DraggableProps } from "../types";
 }
-export declare function resolveTransformEvent(event: any, functionName: string): void;
+export declare function resolveTransformEvent(moveable: MoveableManagerInterface, event: any, functionName: string): void;
 export declare function convertTransformFormat(datas: any, value: any, dist: any): string;
@@ -25,5 +25,5 @@ export declare function getTransformDist({ datas, distX, distY }: any): number[];
 export declare function scaleMatrix(state: any, scale: number[]): number[];
-export declare function fillTransformStartEvent(e: any): OnTransformStartEvent;
-export declare function setDefaultTransformIndex(e: any, property: string): void;
-export declare function setTransformIndex(e: any, index: number): void;
+export declare function fillTransformStartEvent(moveable: MoveableManagerInterface, e: any): OnTransformStartEvent;
+export declare function setDefaultTransformIndex(moveable: MoveableManagerInterface, e: any, property: string): void;
+export declare function setTransformIndex(moveable: MoveableManagerInterface, e: any, index: number): void;
 export declare function fillOriginalTransform(e: any, transform: string): void;
@@ -30,0 +30,0 @@ export declare function getBeforeRenderableDatas(e: any): any;

declaration/gesto/getAbleGesto.d.ts

@@ -1,5 +0,5 @@
-import { MoveableManagerInterface } from "../types";
+import { Able, MoveableManagerInterface } from "../types";
 import { IObject } from "@daybrush/utils";
 import Gesto from "gesto";
-export declare function triggerAble(moveable: MoveableManagerInterface, ableType: string, eventOperations: string[], eventAffix: string, eventType: any, e: any, requestInstant?: boolean): boolean;
+export declare function triggerAble(moveable: MoveableManagerInterface, moveableAbles: Able[], eventOperations: string[], eventAffix: string, eventType: any, e: any, requestInstant?: boolean): boolean;
 export declare function checkMoveableTarget(moveable: MoveableManagerInterface): (e: {
@@ -6,0 +6,0 @@ inputEvent: Event;

declaration/InitialMoveable.d.ts

@@ -65,2 +65,3 @@ import * as React from "react";
     getManager(): MoveableManagerInterface<any, any>;
+    getMoveables(): MoveableManagerInterface[];
     private _updateRefs;
@@ -67,0 +68,0 @@ private _checkChangeTargets;

declaration/MoveableGroup.d.ts

 import MoveableManager from "./MoveableManager";
-import { GroupableProps, GroupRect, RectInfo } from "./types";
+import { GroupableProps, GroupRect, MoveableManagerInterface, RectInfo } from "./types";
 import ChildrenDiffer from "@egjs/children-differ";
@@ -19,5 +19,5 @@ /**
         customStyledMap: Record<string, any>;
-        wrapperMoveable: import("./types").MoveableManagerInterface<{}, {}> | null;
+        wrapperMoveable: MoveableManagerInterface<{}, {}> | null;
         isWrapperMounted: boolean;
-        parentMoveable: import("./types").MoveableManagerInterface<{}, {}> | null;
+        parentMoveable: MoveableManagerInterface<{}, {}> | null;
         parentPosition: number[] | null;
@@ -74,2 +74,3 @@ target: HTMLElement | SVGElement | null;
     getRequestChildStyles(): (keyof CSSStyleDeclaration)[];
+    getMoveables(): MoveableManagerInterface[];
     protected updateAbles(): void;
@@ -76,0 +77,0 @@ protected _updateTargets(): void;

declaration/MoveableIndividualGroup.d.ts

 /// <reference types="react" />
 import MoveableManager from "./MoveableManager";
-import { GroupableProps, IndividualGroupableProps, RectInfo } from "./types";
+import { GroupableProps, IndividualGroupableProps, MoveableManagerInterface, RectInfo, Requester } from "./types";
 /**
@@ -16,6 +16,3 @@ * @namespace Moveable.IndividualGroup
     getRect(): RectInfo;
-    request(): {
-        request(): any;
-        requestEnd(): any;
-    };
+    request(ableName: string, param?: Record<string, any>, isInstant?: boolean): Requester;
     dragStart(): this;
@@ -25,2 +22,3 @@ hitTest(): number;
     isDragging(): boolean;
+    getMoveables(): MoveableManagerInterface[];
     updateRenderPoses(): void;
@@ -27,0 +25,0 @@ checkUpdate(): void;

declaration/MoveableManager.d.ts

@@ -231,2 +231,10 @@ import * as React from "react";
     /**
+     * moveable is the top level that manages targets
+     * `Single`: MoveableManager instance
+     * `Group`: MoveableGroup instance
+     * `IndividualGroup`: MoveableIndividaulGroup instance
+     * Returns leaf target MoveableManagers.
+     */
+    getMoveables(): MoveableManagerInterface[];
+    /**
      * Remove the Moveable object and the events.
@@ -233,0 +241,0 @@ * @method Moveable#destroy

declaration/utils.d.ts

@@ -120,3 +120,3 @@ import { IObject } from "@daybrush/utils";
 export declare function catchEvent<EventName extends keyof Props, Props extends IObject<any> = MoveableProps>(moveable: any, name: EventName, callback: (e: Props[EventName] extends ((e: infer P) => any) | undefined ? P : IObject<any>) => void): any;
-export declare function triggerEvent<EventName extends keyof Props, Props extends IObject<any> = MoveableProps>(moveable: any, name: EventName, params: Props[EventName] extends ((e: infer P) => any) | undefined ? P : IObject<any>, isManager?: boolean): any;
+export declare function triggerEvent<EventName extends keyof Props, Props extends IObject<any> = MoveableProps>(moveable: any, name: EventName, params: Props[EventName] extends ((e: infer P) => any) | undefined ? P : IObject<any>, isManager?: boolean, isRequest?: boolean): any;
 export declare function getComputedStyle(el: Element, pseudoElt?: string | null): CSSStyleDeclaration;
@@ -140,3 +140,3 @@ export declare function filterAbles(ables: Able[], methods: Array<keyof Able>, triggerAblesSimultaneously?: boolean): Able<IObject<any>, IObject<any>>[];
 export declare function getDirectionCondition(ableName: string, checkAbles?: string[]): (moveable: any, e: any) => any;
-export declare function convertTransformInfo(transforms: string[], index: number): {
+export declare function convertTransformInfo(transforms: string[], state: MoveableManagerState, index: number): {
     transforms: string[];
@@ -143,0 +143,0 @@ beforeFunctionMatrix: number[];

package.json

 {
     "name": "react-moveable",
-    "version": "0.52.1",
+    "version": "0.53.0",
     "description": "A React Component that create Moveable, Draggable, Resizable, Scalable, Rotatable, Warpable, Pinchable, Groupable.",
@@ -71,3 +71,3 @@ "main": "./dist/moveable.cjs.js",
         "@babel/core": "^7.7.2",
-        "@croffle/bakery": "^0.0.23",
+        "@croffle/bakery": "^0.0.25",
         "@daybrush/builder": "^0.2.4",
@@ -98,3 +98,3 @@ "@daybrush/tester": "^0.1.3",
         "concurrently": "^7.6.0",
-        "croffle": "^0.0.19",
+        "croffle": "^0.0.21",
         "css-loader": "^5.0.1",
@@ -101,0 +101,0 @@ "eslint": "^7.7.0",

src/ables/Scalable.ts

@@ -117,3 +117,3 @@ import {
 
-        setDefaultTransformIndex(e, "scale");
+        setDefaultTransformIndex(moveable, e, "scale");
 
@@ -162,3 +162,3 @@ datas.isWidth = isWidth;
             setMaxScaleSize,
-            ...fillTransformStartEvent(e),
+            ...fillTransformStartEvent(moveable, e),
             dragStart: Draggable.dragStart(
@@ -186,3 +186,3 @@ moveable,
         e: any) {
-        resolveTransformEvent(e, "scale");
+        resolveTransformEvent(moveable, e, "scale");
         const {
@@ -189,0 +189,0 @@ datas,

src/consts.ts

@@ -298,2 +298,3 @@ import getAgent from "@egjs/agent";
     "getControlBoxElement",
+    "getMoveables",
 ];

src/gesto/GestoUtils.ts

@@ -75,3 +75,3 @@
 
-export function resolveTransformEvent(event: any, functionName: string) {
+export function resolveTransformEvent(moveable: MoveableManagerInterface, event: any, functionName: string) {
     const {
@@ -108,3 +108,3 @@ datas,
 
-    const result = convertTransformInfo(nextTransforms, nextIndex);
+    const result = convertTransformInfo(nextTransforms, moveable.state, nextIndex);
     const targetFunction = result.targetFunction;
@@ -406,3 +406,3 @@ const matFunctionName = functionName === "rotate" ? "rotateZ" : functionName;
 
-export function fillTransformStartEvent(e: any): OnTransformStartEvent {
+export function fillTransformStartEvent(moveable: MoveableManagerInterface, e: any): OnTransformStartEvent {
     const originalDatas = getBeforeRenderableDatas(e);
@@ -412,16 +412,16 @@ return {
             originalDatas.startTransforms = isArray(transform) ? transform : splitSpace(transform);
-            setTransformIndex(e, index);
+            setTransformIndex(moveable, e, index);
         },
         setTransformIndex: (index: number) => {
-            setTransformIndex(e, index);
+            setTransformIndex(moveable, e, index);
         },
     };
 }
-export function setDefaultTransformIndex(e: any, property: string) {
+export function setDefaultTransformIndex(moveable: MoveableManagerInterface, e: any, property: string) {
     const originalDatas = getBeforeRenderableDatas(e);
     const startTransforms = originalDatas.startTransforms;
 
-    setTransformIndex(e, findIndex<string>(startTransforms, func => func.indexOf(`${property}(`) === 0));
+    setTransformIndex(moveable, e, findIndex<string>(startTransforms, func => func.indexOf(`${property}(`) === 0));
 }
-export function setTransformIndex(e: any, index: number) {
+export function setTransformIndex(moveable: MoveableManagerInterface, e: any, index: number) {
     const originalDatas = getBeforeRenderableDatas(e);
@@ -439,3 +439,7 @@ const datas = e.datas;
     }
-    const info = parse([transform]);
+    const state = moveable.state;
+    const info = parse([transform], {
+        "x%": v => v / 100 * state.offsetWidth,
+        "y%": v => v / 100 * state.offsetHeight,
+    });
 
@@ -442,0 +446,0 @@ datas.startValue = info[0].functionValue;

src/gesto/getAbleGesto.ts

@@ -10,3 +10,3 @@ import { Able, MoveableManagerInterface, MoveableGroupInterface } from "../types";
     moveable: MoveableManagerInterface,
-    ableType: string,
+    moveableAbles: Able[],
     eventOperations: string[],
@@ -35,3 +35,3 @@ eventAffix: string,
     }
-    const ables: Able[] = [...(moveable as any)[ableType]];
+    const ables: Able[] = [...moveableAbles];
 
@@ -200,3 +200,3 @@ if (isRequest) {
     if (!isStart && !isEnd && !isAfter && updatedCount && !requestInstant) {
-        triggerAble(moveable, ableType, eventOperations, eventAffix, eventType + "After", e);
+        triggerAble(moveable, moveableAbles, eventOperations, eventAffix, eventType + "After", e);
     }
@@ -300,5 +300,5 @@ return true;
                 const eventOperations = eventOperation === "drag" ? [eventOperation] : ["drag", eventOperation];
+                const moveableAbles: Able[] = [...(moveable as any)[ableType]];
+                const result = triggerAble(moveable, moveableAbles, eventOperations, eventAffix, eventType, e);
 
-                const result = triggerAble(moveable, ableType, eventOperations, eventAffix, eventType, e);
-
                 if (!result) {
@@ -305,0 +305,0 @@ e.stop();

src/groupUtils.ts

@@ -28,2 +28,3 @@ import { Able, MoveableGroupInterface, MoveableManagerInterface, MoveableManagerState } from "./types";
             ...e,
+            isRequestChild: true,
             datas: childDatas[i][name],
@@ -30,0 +31,0 @@ originalDatas: childDatas[i],

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

14411751

increased by204.19%

Number of package files

184

increased by24.32%

Lines of code

75943

increased by33.78%

No dependency changes