fix: fix typo

daybrush · May 2, 2020 · 6ad43bc · 6ad43bc
1 parent a0401ff
commit 6ad43bc
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 11 deletions.
diff --git a/packages/react-moveable/src/react-moveable/Moveable.tsx b/packages/react-moveable/src/react-moveable/Moveable.tsx
@@ -89,6 +89,22 @@ export default class Moveable<T = {}> extends React.PureComponent<MoveableProps
     public isInside(clientX: number, clientY: number): boolean {
         return this.moveable.isInside(clientX, clientY);
     }
+    /**
+     * Hit test an element or rect on a moveable target.
+     * @method Moveable#hitTest
+     * @param - element or rect to test
+     * @return - Get hit test rate (rate > 0 is hitted)
+     * @example
+     * import Moveable from "moveable";
+     *
+     * const moveable = new Moveable(document.body);
+     *
+     * document.body.addEventListener("mousedown", e => {
+     *     if (moveable.hitTest(e.target) > 0) {
+     *          console.log("hiited");
+     *     }
+     * });
+     */
     public hitTest(el: Element | HitRect): number {
         return this.moveable.hitTest(el);
     }

diff --git a/packages/react-moveable/src/react-moveable/ables/Snappable.tsx b/packages/react-moveable/src/react-moveable/ables/Snappable.tsx
@@ -1092,7 +1092,7 @@ function renderElementGroup(
     isDisplaySnapDigit: boolean,
     snapDigit: number,
     index: number,
-    snapDistForamt: Required<SnappableOptions>["snapDistForamt"],
+    snapDistFormat: Required<SnappableOptions>["snapDistFormat"],
     React: Renderer,
 ) {
     return flat(group.map((elementGuidelines, i) => {
@@ -1118,7 +1118,7 @@ function renderElementGroup(
                 "guideline",
                 "dashed",
             )}
-                data-size={snapSize > 0 ? snapDistForamt(snapSize) : ""}
+                data-size={snapSize > 0 ? snapDistFormat(snapSize) : ""}
                 key={`${directionName}LinkGuidline${i}-${j}`} style={{
                     [posName1]: `${minPos + linePos}px`,
                     [posName2]: `${-targetPos + pos[index ? 0 : 1]}px`,
@@ -1277,7 +1277,7 @@ function renderGapGuidelines(
     gapGuidelines: GapGuideline[],
     type: "vertical" | "horizontal",
     [directionName, posName1, posName2, sizeName]: readonly [string, string, string, string],
-    snapDistForamt: Required<SnappableOptions>["snapDistForamt"],
+    snapDistFormat: Required<SnappableOptions>["snapDistFormat"],
     React: any,
 ) {
     const {
@@ -1298,7 +1298,7 @@ function renderGapGuidelines(
             "guideline",
             "gap",
         )}
-            data-size={snapSize > 0 ? snapDistForamt(snapSize) : ""}
+            data-size={snapSize > 0 ? snapDistFormat(snapSize) : ""}
             key={`${otherType}GapGuideline${i}`} style={{
                 [posName1]: `${renderPos[index]}px`,
                 [posName2]: `${renderPos[otherIndex]}px`,
@@ -1390,7 +1390,7 @@ export default {
             snapThreshold = 5,
             snapDigit = 0,
             isDisplaySnapDigit = true,
-            snapDistForamt = (v: number) => v,
+            snapDistFormat = (v: number) => v,
         } = moveable.props;
         const poses = getAbsolutePosesByState(moveable.state);
         const { width, height, top, left, bottom, right } = getRect(poses);
@@ -1480,15 +1480,15 @@ export default {
                 gapVerticalGuidelines,
                 "vertical",
                 horizontalNames,
-                snapDistForamt,
+                snapDistFormat,
                 React,
             ),
             ...renderGapGuidelines(
                 moveable,
                 gapHorizontalGuidelines,
                 "horizontal",
                 verticalNames,
-                snapDistForamt,
+                snapDistFormat,
                 React,
             ),
             ...renderElementGroup(
@@ -1502,7 +1502,7 @@ export default {
                 isDisplaySnapDigit,
                 snapDigit,
                 0,
-                snapDistForamt,
+                snapDistFormat,
                 React,
             ),
             ...renderElementGroup(
@@ -1516,7 +1516,7 @@ export default {
                 isDisplaySnapDigit,
                 snapDigit,
                 1,
-                snapDistForamt,
+                snapDistFormat,
                 React,
             ),
             ...renderSnapPoses(

diff --git a/packages/react-moveable/src/react-moveable/types.ts b/packages/react-moveable/src/react-moveable/types.ts
@@ -39,7 +39,7 @@ export type MoveableManagerProps<T = {}> = {
  * @property - Minimum distance to pinch. (default: 20)
  * @property - Whether the container containing the target becomes a pinch. (default: true)
  * @property - Lets generate events of ables at the same time. (like Resizable, Scalable) (default: false)
- * @property - Add padding around the target to increase the drag area. (default: { left: 0, top: 0, right: 0, bottom: 0 })
+ * @property - Add padding around the target to increase the drag area. (default: null)
  */
 export interface MoveableDefaultProps {
     target?: SVGElement | HTMLElement | null;
@@ -90,6 +90,14 @@ export type MoveableManagerState<T = {}> = {
     rotation: number;
 } & T;
 
+/**
+ * @typedef
+ * @memberof Moveable
+ * @property - left padding
+ * @property - top padding
+ * @property - right padding
+ * @property - bottom padding
+ */
 export interface PaddingBox {
     left?: number;
     top?: number;
@@ -980,7 +988,7 @@ export interface SnappableOptions {
     elementGuidelines?: Element[];
     bounds?: BoundType;
     innerBounds?: InnerBoundType;
-    snapDistForamt?: (distance: number) => number | string;
+    snapDistFormat?: (distance: number) => number | string;
 }
 
 export interface SnappableProps extends SnappableOptions {
@@ -1102,6 +1110,14 @@ export interface RectInfo {
     origin: number[];
     beforeOrigin: number[];
 }
+/**
+ * @typedef
+ * @memberof Moveable
+ * @property - top position
+ * @property - left position
+ * @property - target's width
+ * @property - target's height
+ */
 export interface HitRect {
     top: number;
     left: number;