fix: support able requester types

daybrush · Dec 24, 2022 · c26e5a9 · c26e5a9
1 parent 008116c
commit c26e5a9
Show file tree

Hide file tree

Showing 2 changed files with 67 additions and 4 deletions.
diff --git a/packages/react-moveable/src/types.ts b/packages/react-moveable/src/types.ts
@@ -2009,6 +2009,45 @@ export interface ResizableOptions extends RenderDirections {
      */
     checkResizableError?: boolean;
 }
+/**
+ * @typedef
+ * @memberof Moveable
+ * @extends Moveable.AbleRequestParam
+ * @description the Resizable's request parameter
+ */
+export interface AbleRequesters {
+    draggable: DraggableRequestParam;
+    resizable: ResizableRequestParam;
+    scalable: ScalableRequestParam;
+    rotatable: RotatableRequestParam;
+    [key: string]: AbleRequestParam;
+}
+
+/**
+ * @typedef
+ * @memberof Moveable.Draggable
+ * @extends Moveable.AbleRequestParam
+ * @description the Draggable's request parameter
+ */
+export interface DraggableRequestParam extends AbleRequestParam {
+    /**
+     * x position
+     */
+    x?: number;
+    /**
+     * y position
+     */
+    y?: number;
+    /**
+     * X number to move
+     */
+    deltaX?: number;
+    /**
+     * Y number to move
+     */
+    deltaY?: number;
+}
+
 /**
  * @typedef
  * @memberof Moveable.Resizable
@@ -2118,6 +2157,28 @@ export interface ScalableRequestParam extends AbleRequestParam {
      */
     deltaHeight?: number;
 }
+
+
+
+
+/**
+ * @typedef
+ * @memberof Moveable.Rotatable
+ * @extends Moveable.AbleRequestParam
+ * @description the Rotatable's request parameter
+ */
+export interface RotatableRequestParam extends AbleRequestParam {
+    /**
+     * delta number of rotation
+     */
+    deltaRotate?: number;
+    /**
+     * absolute number of moveable's rotation
+     */
+    rotate?: number;
+}
+
+
 export interface ScalableEvents {
     onScaleStart: OnScaleStart;
     onBeforeScale: OnBeforeScale;
@@ -3070,8 +3131,10 @@ export interface MoveableInterface {
      * requester.request({ deltaX: 10, deltaY: 10 });
      * requester.requestEnd();
      */
-    request<RequestParam extends {} = AbleRequestParam>(
-        ableName: string, params?: RequestParam, isInstant?: boolean): Requester<RequestParam>;
+    request<
+        RequestParam extends AbleRequesters[Name],
+        Name extends string = string,
+    >(ableName: Name, params?: RequestParam, isInstant?: boolean): Requester<RequestParam>;
     destroy(): void;
     dragStart(e: MouseEvent | TouchEvent): void;
     isInside(clientX: number, clientY: number): boolean;

diff --git a/packages/react-moveable/stories/7-Request/apps/ResizableApp.tsx b/packages/react-moveable/stories/7-Request/apps/ResizableApp.tsx
@@ -1,13 +1,13 @@
 import * as React from "react";
-import Moveable, { ResizableRequestParam } from "@/react-moveable";
+import Moveable from "@/react-moveable";
 
 export default function App(props: Record<string, any>) {
     const widthInputRef = React.useRef<HTMLInputElement>(null);
     const heightInputRef = React.useRef<HTMLInputElement>(null);
     const moveableRef = React.useRef<Moveable>(null);
     const [requestCallbacks] = React.useState(() => {
         function request() {
-            moveableRef.current!.request<ResizableRequestParam>("resizable", {
+            moveableRef.current!.request("resizable", {
                 offsetWidth: parseInt(widthInputRef.current!.value),
                 offsetHeight: parseInt(heightInputRef.current!.value),
             }, true);