@dnd-kit/geometry 0.0.1

package/README.md

@@ -0,0 +1,15 @@
+# @dnd-kit/geometry
+
+[![Stable release](https://img.shields.io/npm/v/@dnd-kit/geometry.svg)](https://npm.im/@dnd-kit/geometry)
+
+## Installation
+
+To get started, install the `@dnd-kit/geometry` package via npm or yarn:
+
+```
+npm install @dnd-kit/geometry
+```
+
+## Usage
+
+Visit [docs.dndkit.com](https://docs.dndkit.com) to learn how to get started with @dnd-kit.

package/dist/index.d.ts

@@ -0,0 +1,157 @@
+declare enum Axis {
+    Horizontal = "x",
+    Vertical = "y"
+}
+declare const Axes: Axis[];
+
+type Coordinates = Record<Axis, number>;
+
+interface BoundingRectangle {
+    width: number;
+    height: number;
+    left: number;
+    right: number;
+    top: number;
+    bottom: number;
+}
+
+/**
+ * A Point represents a location in a two-dimensional coordinate system.
+ *
+ */
+declare class Point implements Coordinates {
+    x: number;
+    y: number;
+    /**
+     * @param {number} Coordinate of the point on the horizontal axis
+     * @param {number} Coordinate of the point on the vertical axis
+     */
+    constructor(x: number, y: number);
+    /**
+     * Returns the delta between this point and another point.
+     *
+     * @param {Point} a - A point
+     * @param {Point} b - Another point
+     */
+    static delta(a: Point, b: Point): Point;
+    /**
+     * Returns the distance (hypotenuse) between this point and another point.
+     *
+     * @param {Point} a - A point
+     * @param {Point} b - Another point
+     */
+    static distance(a: Point, b: Point): number;
+    /**
+     * Returns true if both points are equal.
+     *
+     * @param {Point} a - A point
+     * @param {Point} b - Another point
+     */
+    static equals(a: Point, b: Point): boolean;
+    static from({ x, y }: Coordinates): Point;
+}
+
+/**
+ * An abstract class representing a 2D geometric shape, such as
+ * a polygon or circle. Shapes are used for collision detection
+ * during drag and drop operations.
+ */
+declare abstract class Shape {
+    /**
+     * Get the bounding rectangle of the 2D shape.
+     * @returns The bounding rectangle of the shape.
+     */
+    abstract get boundingRectangle(): BoundingRectangle;
+    /**
+     * Get the center point of the 2D shape.
+     * @returns The center point of the shape.
+     */
+    abstract get center(): Point;
+    /**
+     * Get the total space taken up by the 2D shape.
+     * @returns The area of the shape.
+     */
+    abstract get area(): number;
+    /**
+     * Get the scale transformation of the shape on the 2D plane.
+     * @returns The scale of the shape.
+     */
+    abstract get scale(): {
+        x: number;
+        y: number;
+    };
+    /**
+     * Get the inverse scale transformation of the shape on the 2D plane.
+     * @returns The inverse scale of the shape.
+     */
+    abstract get inverseScale(): {
+        x: number;
+        y: number;
+    };
+    /**
+     * Returns whether or not this shape is equal to another shape.
+     *
+     * @param shape The other shape to compare with.
+     * @returns Whether or not the two shapes are equal.
+     */
+    abstract equals(shape: Shape): boolean;
+    /**
+     * Returns the intersection area between this shape and another shape.
+     *
+     * @param shape The other shape to calculate the intersection area with.
+     * @returns The intersection area between the two shapes.
+     */
+    abstract intersectionArea(shape: Shape): number;
+    /**
+     * Test a point for containment within this shape.
+     *
+     * @param point A point in world coordinates.
+     */
+    abstract containsPoint(point: Point): boolean;
+}
+
+declare class Rectangle implements Shape {
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+    constructor(left: number, top: number, width: number, height: number);
+    scale: {
+        x: number;
+        y: number;
+    };
+    get inverseScale(): {
+        x: number;
+        y: number;
+    };
+    translate(x: number, y: number): Rectangle;
+    get boundingRectangle(): BoundingRectangle;
+    get center(): Point;
+    get area(): number;
+    equals(shape: Shape): boolean;
+    containsPoint(point: Point): boolean;
+    intersectionArea(shape: Shape): number;
+    intersectionRatio(shape: Shape): number;
+    get bottom(): number;
+    get right(): number;
+}
+
+declare class Position {
+    constructor(initialValue: Coordinates);
+    initial: Point;
+    previous: Point;
+    current: Point;
+    get delta(): Point;
+    get direction(): "right" | "left" | "down" | "up" | null;
+    reset(coordinates: Coordinates): void;
+    update(coordinates: Coordinates): void;
+}
+
+type Distance = number | Coordinates | Pick<Coordinates, Axis.Horizontal> | Pick<Coordinates, Axis.Vertical>;
+
+/**
+ * Returns true if a set of relative coordinates exceeds a given distance.
+ */
+declare function exceedsDistance({ x, y }: Coordinates, distance: Distance): boolean;
+
+export { Axes, Axis, BoundingRectangle, Coordinates, Distance, Point, Position, Rectangle, Shape, exceedsDistance };

package/dist/index.js

@@ -0,0 +1,280 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __pow = Math.pow;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result)
+    __defProp(target, key, result);
+  return result;
+};
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  Axes: () => Axes,
+  Axis: () => Axis,
+  Point: () => Point,
+  Position: () => Position,
+  Rectangle: () => Rectangle,
+  exceedsDistance: () => exceedsDistance
+});
+module.exports = __toCommonJS(src_exports);
+
+// src/point/Point.ts
+var Point = class {
+  /**
+   * @param {number} Coordinate of the point on the horizontal axis
+   * @param {number} Coordinate of the point on the vertical axis
+   */
+  constructor(x, y) {
+    this.x = x;
+    this.y = y;
+  }
+  /**
+   * Returns the delta between this point and another point.
+   *
+   * @param {Point} a - A point
+   * @param {Point} b - Another point
+   */
+  static delta(a, b) {
+    return new Point(a.x - b.x, a.y - b.y);
+  }
+  /**
+   * Returns the distance (hypotenuse) between this point and another point.
+   *
+   * @param {Point} a - A point
+   * @param {Point} b - Another point
+   */
+  static distance(a, b) {
+    return Math.hypot(a.x - b.x, a.y - b.y);
+  }
+  /**
+   * Returns true if both points are equal.
+   *
+   * @param {Point} a - A point
+   * @param {Point} b - Another point
+   */
+  static equals(a, b) {
+    return a.x === b.x && a.y === b.y;
+  }
+  static from({ x, y }) {
+    return new Point(x, y);
+  }
+};
+
+// src/shapes/Rectangle.ts
+var Rectangle = class {
+  constructor(left, top, width, height) {
+    this.left = left;
+    this.top = top;
+    this.width = width;
+    this.height = height;
+    this.scale = {
+      x: 1,
+      y: 1
+    };
+  }
+  get inverseScale() {
+    return {
+      x: 1 / this.scale.x,
+      y: 1 / this.scale.y
+    };
+  }
+  translate(x, y) {
+    const { top, left, width, height, scale } = this;
+    const newShape = new Rectangle(left + x, top + y, width, height);
+    newShape.scale = __spreadValues({}, scale);
+    return newShape;
+  }
+  get boundingRectangle() {
+    const { width, height, left, top, right, bottom } = this;
+    return { width, height, left, top, right, bottom };
+  }
+  get center() {
+    const { left, top, right, bottom } = this;
+    return new Point((left + right) / 2, (top + bottom) / 2);
+  }
+  get area() {
+    const { width, height } = this;
+    return width * height;
+  }
+  equals(shape) {
+    if (!(shape instanceof Rectangle)) {
+      return false;
+    }
+    const { left, top, width, height } = this;
+    return left === shape.left && top === shape.top && width === shape.width && height === shape.height;
+  }
+  containsPoint(point) {
+    const { top, left, bottom, right } = this;
+    return top <= point.y && point.y <= bottom && left <= point.x && point.x <= right;
+  }
+  intersectionArea(shape) {
+    if (shape instanceof Rectangle) {
+      return rectangleRectangleIntersection(this, shape);
+    }
+    return 0;
+  }
+  intersectionRatio(shape) {
+    const { area } = this;
+    const intersectionArea = this.intersectionArea(shape);
+    const intersectionRatio = intersectionArea / (shape.area + area - intersectionArea);
+    return intersectionRatio;
+  }
+  get bottom() {
+    const { top, height } = this;
+    return top + height;
+  }
+  get right() {
+    const { left, width } = this;
+    return left + width;
+  }
+};
+function rectangleRectangleIntersection(a, b) {
+  const top = Math.max(b.top, a.top);
+  const left = Math.max(b.left, a.left);
+  const right = Math.min(b.left + b.width, a.left + a.width);
+  const bottom = Math.min(b.top + b.height, a.top + a.height);
+  const width = right - left;
+  const height = bottom - top;
+  if (left < right && top < bottom) {
+    const intersectionArea = width * height;
+    return intersectionArea;
+  }
+  return 0;
+}
+
+// src/position/position.ts
+var import_state = require("@dnd-kit/state");
+var SENSITIVITY = 10;
+var Position = class {
+  constructor(initialValue) {
+    const point = Point.from(initialValue);
+    this.initial = point;
+    this.current = point;
+    this.previous = point;
+  }
+  get delta() {
+    return Point.delta(this.current, this.initial);
+  }
+  get direction() {
+    const delta = {
+      x: this.current.x - this.previous.x,
+      y: this.current.y - this.previous.y
+    };
+    if (!delta.x && !delta.y) {
+      return null;
+    }
+    if (Math.abs(delta.x) > Math.abs(delta.y)) {
+      return delta.x > 0 ? "right" : "left";
+    }
+    return delta.y > 0 ? "down" : "up";
+  }
+  reset(coordinates) {
+    const point = Point.from(coordinates);
+    (0, import_state.batch)(() => {
+      this.current = point;
+      this.previous = point;
+      this.initial = point;
+    });
+  }
+  update(coordinates) {
+    const { current } = this;
+    const point = Point.from(coordinates);
+    if (Point.equals(current, point)) {
+      return;
+    }
+    const delta = {
+      x: point.x - current.x,
+      y: point.y - current.y
+    };
+    if (Math.abs(delta.x) < SENSITIVITY || Math.abs(delta.y) < SENSITIVITY) {
+      this.previous = current;
+    }
+    this.current = point;
+  }
+};
+__decorateClass([
+  import_state.reactive
+], Position.prototype, "initial", 2);
+__decorateClass([
+  import_state.reactive
+], Position.prototype, "previous", 2);
+__decorateClass([
+  import_state.reactive
+], Position.prototype, "current", 2);
+__decorateClass([
+  import_state.derived
+], Position.prototype, "delta", 1);
+__decorateClass([
+  import_state.derived
+], Position.prototype, "direction", 1);
+
+// src/distance/distance.ts
+function exceedsDistance({ x, y }, distance) {
+  const dx = Math.abs(x);
+  const dy = Math.abs(y);
+  if (typeof distance === "number") {
+    return Math.sqrt(__pow(dx, 2) + __pow(dy, 2)) > distance;
+  }
+  if ("x" in distance && "y" in distance) {
+    return dx > distance.x && dy > distance.y;
+  }
+  if ("x" in distance) {
+    return dx > distance.x;
+  }
+  if ("y" in distance) {
+    return dy > distance.y;
+  }
+  return false;
+}
+
+// src/types/axis.ts
+var Axis = /* @__PURE__ */ ((Axis2) => {
+  Axis2["Horizontal"] = "x";
+  Axis2["Vertical"] = "y";
+  return Axis2;
+})(Axis || {});
+var Axes = Object.values(Axis);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Axes,
+  Axis,
+  Point,
+  Position,
+  Rectangle,
+  exceedsDistance
+});

package/dist/index.mjs

@@ -0,0 +1,252 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __pow = Math.pow;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result)
+    __defProp(target, key, result);
+  return result;
+};
+
+// src/point/Point.ts
+var Point = class {
+  /**
+   * @param {number} Coordinate of the point on the horizontal axis
+   * @param {number} Coordinate of the point on the vertical axis
+   */
+  constructor(x, y) {
+    this.x = x;
+    this.y = y;
+  }
+  /**
+   * Returns the delta between this point and another point.
+   *
+   * @param {Point} a - A point
+   * @param {Point} b - Another point
+   */
+  static delta(a, b) {
+    return new Point(a.x - b.x, a.y - b.y);
+  }
+  /**
+   * Returns the distance (hypotenuse) between this point and another point.
+   *
+   * @param {Point} a - A point
+   * @param {Point} b - Another point
+   */
+  static distance(a, b) {
+    return Math.hypot(a.x - b.x, a.y - b.y);
+  }
+  /**
+   * Returns true if both points are equal.
+   *
+   * @param {Point} a - A point
+   * @param {Point} b - Another point
+   */
+  static equals(a, b) {
+    return a.x === b.x && a.y === b.y;
+  }
+  static from({ x, y }) {
+    return new Point(x, y);
+  }
+};
+
+// src/shapes/Rectangle.ts
+var Rectangle = class {
+  constructor(left, top, width, height) {
+    this.left = left;
+    this.top = top;
+    this.width = width;
+    this.height = height;
+    this.scale = {
+      x: 1,
+      y: 1
+    };
+  }
+  get inverseScale() {
+    return {
+      x: 1 / this.scale.x,
+      y: 1 / this.scale.y
+    };
+  }
+  translate(x, y) {
+    const { top, left, width, height, scale } = this;
+    const newShape = new Rectangle(left + x, top + y, width, height);
+    newShape.scale = __spreadValues({}, scale);
+    return newShape;
+  }
+  get boundingRectangle() {
+    const { width, height, left, top, right, bottom } = this;
+    return { width, height, left, top, right, bottom };
+  }
+  get center() {
+    const { left, top, right, bottom } = this;
+    return new Point((left + right) / 2, (top + bottom) / 2);
+  }
+  get area() {
+    const { width, height } = this;
+    return width * height;
+  }
+  equals(shape) {
+    if (!(shape instanceof Rectangle)) {
+      return false;
+    }
+    const { left, top, width, height } = this;
+    return left === shape.left && top === shape.top && width === shape.width && height === shape.height;
+  }
+  containsPoint(point) {
+    const { top, left, bottom, right } = this;
+    return top <= point.y && point.y <= bottom && left <= point.x && point.x <= right;
+  }
+  intersectionArea(shape) {
+    if (shape instanceof Rectangle) {
+      return rectangleRectangleIntersection(this, shape);
+    }
+    return 0;
+  }
+  intersectionRatio(shape) {
+    const { area } = this;
+    const intersectionArea = this.intersectionArea(shape);
+    const intersectionRatio = intersectionArea / (shape.area + area - intersectionArea);
+    return intersectionRatio;
+  }
+  get bottom() {
+    const { top, height } = this;
+    return top + height;
+  }
+  get right() {
+    const { left, width } = this;
+    return left + width;
+  }
+};
+function rectangleRectangleIntersection(a, b) {
+  const top = Math.max(b.top, a.top);
+  const left = Math.max(b.left, a.left);
+  const right = Math.min(b.left + b.width, a.left + a.width);
+  const bottom = Math.min(b.top + b.height, a.top + a.height);
+  const width = right - left;
+  const height = bottom - top;
+  if (left < right && top < bottom) {
+    const intersectionArea = width * height;
+    return intersectionArea;
+  }
+  return 0;
+}
+
+// src/position/position.ts
+import { batch, derived, reactive } from "@dnd-kit/state";
+var SENSITIVITY = 10;
+var Position = class {
+  constructor(initialValue) {
+    const point = Point.from(initialValue);
+    this.initial = point;
+    this.current = point;
+    this.previous = point;
+  }
+  get delta() {
+    return Point.delta(this.current, this.initial);
+  }
+  get direction() {
+    const delta = {
+      x: this.current.x - this.previous.x,
+      y: this.current.y - this.previous.y
+    };
+    if (!delta.x && !delta.y) {
+      return null;
+    }
+    if (Math.abs(delta.x) > Math.abs(delta.y)) {
+      return delta.x > 0 ? "right" : "left";
+    }
+    return delta.y > 0 ? "down" : "up";
+  }
+  reset(coordinates) {
+    const point = Point.from(coordinates);
+    batch(() => {
+      this.current = point;
+      this.previous = point;
+      this.initial = point;
+    });
+  }
+  update(coordinates) {
+    const { current } = this;
+    const point = Point.from(coordinates);
+    if (Point.equals(current, point)) {
+      return;
+    }
+    const delta = {
+      x: point.x - current.x,
+      y: point.y - current.y
+    };
+    if (Math.abs(delta.x) < SENSITIVITY || Math.abs(delta.y) < SENSITIVITY) {
+      this.previous = current;
+    }
+    this.current = point;
+  }
+};
+__decorateClass([
+  reactive
+], Position.prototype, "initial", 2);
+__decorateClass([
+  reactive
+], Position.prototype, "previous", 2);
+__decorateClass([
+  reactive
+], Position.prototype, "current", 2);
+__decorateClass([
+  derived
+], Position.prototype, "delta", 1);
+__decorateClass([
+  derived
+], Position.prototype, "direction", 1);
+
+// src/distance/distance.ts
+function exceedsDistance({ x, y }, distance) {
+  const dx = Math.abs(x);
+  const dy = Math.abs(y);
+  if (typeof distance === "number") {
+    return Math.sqrt(__pow(dx, 2) + __pow(dy, 2)) > distance;
+  }
+  if ("x" in distance && "y" in distance) {
+    return dx > distance.x && dy > distance.y;
+  }
+  if ("x" in distance) {
+    return dx > distance.x;
+  }
+  if ("y" in distance) {
+    return dy > distance.y;
+  }
+  return false;
+}
+
+// src/types/axis.ts
+var Axis = /* @__PURE__ */ ((Axis2) => {
+  Axis2["Horizontal"] = "x";
+  Axis2["Vertical"] = "y";
+  return Axis2;
+})(Axis || {});
+var Axes = Object.values(Axis);
+export {
+  Axes,
+  Axis,
+  Point,
+  Position,
+  Rectangle,
+  exceedsDistance
+};

package/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "@dnd-kit/geometry",
+  "version": "0.0.1",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "sideEffects": false,
+  "license": "MIT",
+  "files": [
+    "dist/**"
+  ],
+  "scripts": {
+    "build": "tsup src/index.ts --format esm,cjs --dts --external react",
+    "dev": "tsup src/index.ts --format esm,cjs --watch --dts --external react",
+    "lint": "TIMING=1 eslint src/**/*.ts* --fix",
+    "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist"
+  },
+  "dependencies": {
+    "@dnd-kit/state": "*",
+    "tslib": "^2.6.2"
+  },
+  "devDependencies": {
+    "@dnd-kit/eslint-config": "*",
+    "eslint": "^8.38.0",
+    "tsup": "^6.7.0",
+    "typescript": "^5.0.4"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}