@zag-js/rect-utils 0.0.0-dev-20220704151659 → 0.0.0-dev-20220707125149

package/dist/from-points.d.ts

@@ -1,3 +1,3 @@
-import type { Point } from "./types";
 import { Rect } from "./rect";
+import type { Point } from "./types";
 export declare function getRectFromPoints(...pts: Point[]): Rect;

package/dist/from-rotation.d.ts

@@ -1,5 +1,5 @@
-import type { Point } from "./types";
 import { Rect } from "./rect";
+import type { Point } from "./types";
 export declare function toRad(d: number): number;
 export declare function rotate(a: Point, d: number, c: Point): Point;
 export declare function getRotationRect(r: Rect, deg: number): Rect;

package/dist/get-polygon.d.ts

@@ -0,0 +1,5 @@
+import type { RectValue } from "./types";
+export declare function getElementPolygon(rectValue: RectValue, placement: string): {
+    x: number;
+    y: number;
+}[];

package/dist/index.d.ts

@@ -7,6 +7,7 @@ export * from "./from-points";
 export * from "./from-range";
 export * from "./from-rotation";
 export * from "./from-window";
+export * from "./get-polygon";
 export * from "./intersection";
 export * from "./operations";
 export * from "./polygon";

package/dist/index.js

@@ -1,8 +1,25 @@
 "use strict";
 var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+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 __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -20,7 +37,6 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var src_exports = {};
 __export(src_exports, {
-  Rect: () => Rect,
   alignRect: () => alignRect,
   closest: () => closest,
   closestSideToPoint: () => closestSideToPoint,
@@ -29,6 +45,7 @@ __export(src_exports, {
   contains: () => contains,
   containsPoint: () => containsPoint,
   containsRect: () => containsRect,
+  createRect: () => createRect,
   debugPolygon: () => debugPolygon,
   distance: () => distance,
   distanceBtwEdges: () => distanceBtwEdges,
@@ -36,7 +53,11 @@ __export(src_exports, {
   distanceFromRect: () => distanceFromRect,
   expand: () => expand,
   fromRange: () => fromRange,
+  getElementPolygon: () => getElementPolygon,
   getElementRect: () => getElementRect,
+  getRectCenters: () => getRectCenters,
+  getRectCorners: () => getRectCorners,
+  getRectEdges: () => getRectEdges,
   getRectFromPoints: () => getRectFromPoints,
   getRotationRect: () => getRotationRect,
   getViewportRect: () => getViewportRect,
@@ -44,121 +65,109 @@ __export(src_exports, {
   inset: () => inset,
   intersection: () => intersection,
   intersects: () => intersects,
+  isPointInPolygon: () => isPointInPolygon,
+  isRect: () => isRect,
   isSymmetric: () => isSymmetric,
   rotate: () => rotate,
   shift: () => shift,
   shrink: () => shrink,
   toRad: () => toRad,
-  union: () => union,
-  withinPolygon: () => withinPolygon
+  union: () => union
 });
 module.exports = __toCommonJS(src_exports);
 
 // src/align.ts
 function hAlign(a, ref, h) {
   let x = ref.minX;
-  if (h === "left-inside")
+  if (h === "left-inside") {
     x = ref.minX;
-  if (h === "left-outside")
+  }
+  if (h === "left-outside") {
     x = ref.minX - ref.width;
-  if (h === "right-inside")
+  }
+  if (h === "right-inside") {
     x = ref.maxX - ref.width;
-  if (h === "right-outside")
+  }
+  if (h === "right-outside") {
     x = ref.maxX;
-  if (h === "center")
+  }
+  if (h === "center") {
     x = ref.midX - ref.width / 2;
-  return a.clone().set({ x });
+  }
+  return __spreadProps(__spreadValues({}, a), { x });
 }
 function vAlign(a, ref, v) {
   let y = ref.minY;
-  if (v === "top-inside")
+  if (v === "top-inside") {
     y = ref.minY;
-  if (v === "top-outside")
+  }
+  if (v === "top-outside") {
     y = ref.minY - a.height;
-  if (v === "bottom-inside")
+  }
+  if (v === "bottom-inside") {
     y = ref.maxY - a.height;
-  if (v === "bottom-outside")
+  }
+  if (v === "bottom-outside") {
     y = ref.maxY;
-  if (v === "center")
+  }
+  if (v === "center") {
     y = ref.midY - a.height / 2;
-  return a.clone().set({ y });
+  }
+  return __spreadProps(__spreadValues({}, a), { y });
 }
 function alignRect(a, ref, options) {
   const { h, v } = options;
   return vAlign(hAlign(a, ref, h), ref, v);
 }
 
+// ../core/dist/index.mjs
+var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
+
 // src/rect.ts
 var point = (x, y) => ({ x, y });
-var Rect = class {
-  constructor(v) {
-    this.v = v;
-  }
-  static create(v) {
-    return new Rect(v);
-  }
-  set(n) {
-    return new Rect(Object.assign({}, this.v, n));
-  }
-  clone() {
-    return new Rect(this.v);
-  }
-  get x() {
-    return this.v.x;
-  }
-  get y() {
-    return this.v.y;
-  }
-  get width() {
-    return this.v.width;
-  }
-  get height() {
-    return this.v.height;
-  }
-  get minX() {
-    return this.v.x;
-  }
-  get midX() {
-    return this.v.x + this.v.width / 2;
-  }
-  get maxX() {
-    return this.v.x + this.v.width;
-  }
-  get minY() {
-    return this.v.y;
-  }
-  get midY() {
-    return this.v.y + this.v.height / 2;
-  }
-  get maxY() {
-    return this.v.y + this.v.height;
-  }
-  get center() {
-    return point(this.midX, this.midY);
-  }
-  get centers() {
-    const top = point(this.midX, this.minY);
-    const right = point(this.maxX, this.midY);
-    const bottom = point(this.midX, this.maxY);
-    const left = point(this.minX, this.midY);
-    return { top, right, bottom, left };
-  }
-  get corners() {
-    const top = point(this.minX, this.minY);
-    const right = point(this.maxX, this.minY);
-    const bottom = point(this.maxX, this.maxY);
-    const left = point(this.minX, this.maxY);
-    return { top, right, bottom, left };
-  }
-  get edges() {
-    const c = this.corners;
-    const top = [c.top, c.right];
-    const right = [c.right, c.bottom];
-    const bottom = [c.left, c.bottom];
-    const left = [c.top, c.left];
-    return { top, right, bottom, left };
-  }
-};
+function createRect(r) {
+  const { x, y, width, height } = r;
+  const midX = x + width / 2;
+  const midY = y + height / 2;
+  return {
+    x,
+    y,
+    width,
+    height,
+    minX: x,
+    minY: y,
+    maxX: x + width,
+    maxY: y + height,
+    midX,
+    midY,
+    center: point(midX, midY)
+  };
+}
+function isRect(v) {
+  return hasProp(v, "x") && hasProp(v, "y") && hasProp(v, "width") && hasProp(v, "height");
+}
+function getRectCenters(v) {
+  const top = point(v.midX, v.minY);
+  const right = point(v.maxX, v.midY);
+  const bottom = point(v.midX, v.maxY);
+  const left = point(v.minX, v.midY);
+  return { top, right, bottom, left };
+}
+function getRectCorners(v) {
+  const top = point(v.minX, v.minY);
+  const right = point(v.maxX, v.minY);
+  const bottom = point(v.maxX, v.maxY);
+  const left = point(v.minX, v.maxY);
+  return { top, right, bottom, left };
+}
+function getRectEdges(v) {
+  const c = getRectCorners(v);
+  const top = [c.top, c.right];
+  const right = [c.right, c.bottom];
+  const bottom = [c.left, c.bottom];
+  const left = [c.top, c.left];
+  return { top, right, bottom, left };
+}
 
 // src/intersection.ts
 function intersects(a, b) {
@@ -169,7 +178,7 @@ function intersection(a, b) {
   const y = Math.max(a.y, b.y);
   const x2 = Math.min(a.x + a.width, b.x + b.width);
   const y2 = Math.min(a.y + a.height, b.y + b.height);
-  return Rect.create({ x, y, width: x2 - x, height: y2 - y });
+  return createRect({ x, y, width: x2 - x, height: y2 - y });
 }
 function collisions(a, b) {
   return {
@@ -228,14 +237,18 @@ function closest(...pts) {
   };
 }
 function closestSideToRect(ref, r) {
-  if (r.maxX <= ref.minX)
+  if (r.maxX <= ref.minX) {
     return "left";
-  if (r.minX >= ref.maxX)
+  }
+  if (r.minX >= ref.maxX) {
     return "right";
-  if (r.maxY <= ref.minY)
+  }
+  if (r.maxY <= ref.minY) {
     return "top";
-  if (r.minY >= ref.maxY)
+  }
+  if (r.minY >= ref.maxY) {
     return "bottom";
+  }
   return "left";
 }
 function closestSideToPoint(ref, p) {
@@ -265,17 +278,17 @@ function containsPoint(r, p) {
   return r.minX <= p.x && p.x <= r.maxX && r.minY <= p.y && p.y <= r.maxY;
 }
 function containsRect(a, b) {
-  return Object.values(b.corners).every((c) => containsPoint(a, c));
+  return Object.values(getRectCorners(b)).every((c) => containsPoint(a, c));
 }
 function contains(r, v) {
-  return v instanceof Rect ? containsRect(r, v) : containsPoint(r, v);
+  return isRect(v) ? containsRect(r, v) : containsPoint(r, v);
 }
 
 // ../dom/dist/index.mjs
 function getCache() {
   const g = globalThis;
-  g.__styleCache__ = g.__styleCache__ || /* @__PURE__ */ new WeakMap();
-  return g.__styleCache__;
+  g.__styleCache = g.__styleCache || /* @__PURE__ */ new WeakMap();
+  return g.__styleCache;
 }
 function getComputedStyle(el) {
   var _a;
@@ -293,7 +306,7 @@ function getComputedStyle(el) {
 
 // src/from-element.ts
 function getElementRect(el, opts = {}) {
-  return Rect.create(getClientRect(el, opts));
+  return createRect(getClientRect(el, opts));
 }
 function getClientRect(el, opts = {}) {
   const { excludeScrollbar = false, excludeBorders = false } = opts;
@@ -328,7 +341,7 @@ function getRectFromPoints(...pts) {
   const y = Math.min(...ys);
   const width = Math.max(...xs) - x;
   const height = Math.max(...ys) - y;
-  return Rect.create({ x, y, width, height });
+  return createRect({ x, y, width, height });
 }
 
 // src/union.ts
@@ -350,17 +363,16 @@ function fromRange(range) {
   let rs = [];
   const rects = Array.from(range.getClientRects());
   if (rects.length) {
-    rs = rs.concat(rects.map((r) => Rect.create(r)));
-  } else {
-    let start = range.startContainer;
-    if (start.nodeType === Node.TEXT_NODE) {
-      start = start.parentNode;
-    }
-    if (start instanceof HTMLElement) {
-      let r = getElementRect(start);
-      r.clone().set({ x: r.maxX, width: 0 });
-      rs.push(r);
-    }
+    rs = rs.concat(rects.map(createRect));
+    return union.apply(void 0, rs);
+  }
+  let start = range.startContainer;
+  if (start.nodeType === Node.TEXT_NODE) {
+    start = start.parentNode;
+  }
+  if (start instanceof HTMLElement) {
+    const r = getElementRect(start);
+    rs.push(__spreadProps(__spreadValues({}, r), { x: r.maxX, width: 0 }));
   }
   return union.apply(void 0, rs);
 }
@@ -375,22 +387,30 @@ function rotate(a, d, c) {
   const cos = Math.cos(r);
   const x = a.x - c.x;
   const y = a.y - c.y;
-  return { x: c.x + x * cos - y * sin, y: c.y + x * sin + y * cos };
+  return {
+    x: c.x + x * cos - y * sin,
+    y: c.y + x * sin + y * cos
+  };
 }
 function getRotationRect(r, deg) {
-  const rr = Object.values(r.corners).map((p) => rotate(p, deg, r.center));
+  const rr = Object.values(getRectCorners(r)).map((p) => rotate(p, deg, r.center));
   const xs = rr.map((p) => p.x);
   const ys = rr.map((p) => p.y);
   const minX = Math.min(...xs);
   const minY = Math.min(...ys);
   const maxX = Math.max(...xs);
   const maxY = Math.max(...ys);
-  return Rect.create({ x: minX, y: minY, width: maxX - minX, height: maxY - minY });
+  return createRect({
+    x: minX,
+    y: minY,
+    width: maxX - minX,
+    height: maxY - minY
+  });
 }
 
 // src/from-window.ts
 function getWindowRect(win, opts = {}) {
-  return Rect.create(getViewportRect(win, opts));
+  return createRect(getViewportRect(win, opts));
 }
 function getViewportRect(win, opts) {
   const { excludeScrollbar = false } = opts;
@@ -407,12 +427,30 @@ function getViewportRect(win, opts) {
   return rect;
 }
 
+// src/get-polygon.ts
+function getElementPolygon(rectValue, placement) {
+  const rect = createRect(rectValue);
+  const { top, right, left, bottom } = getRectCorners(rect);
+  const [base] = placement.split("-");
+  return {
+    top: [left, top, right, bottom],
+    right: [top, right, bottom, left],
+    bottom: [top, left, bottom, right],
+    left: [right, top, left, bottom]
+  }[base];
+}
+
 // src/operations.ts
 var isSymmetric = (v) => "dx" in v || "dy" in v;
 function inset(r, i) {
   const v = isSymmetric(i) ? { left: i.dx, right: i.dx, top: i.dy, bottom: i.dy } : i;
   const { top = 0, right = 0, bottom = 0, left = 0 } = v;
-  return Rect.create({ x: r.x + left, y: r.y + top, width: r.width - left - right, height: r.height - top - bottom });
+  return createRect({
+    x: r.x + left,
+    y: r.y + top,
+    width: r.width - left - right,
+    height: r.height - top - bottom
+  });
 }
 function expand(r, v) {
   const value = typeof v === "number" ? { dx: -v, dy: -v } : v;
@@ -424,11 +462,16 @@ function shrink(r, v) {
 }
 function shift(r, o) {
   const { x = 0, y = 0 } = o;
-  return Rect.create({ x: r.x + x, y: r.y + y, width: r.width, height: r.height });
+  return createRect({
+    x: r.x + x,
+    y: r.y + y,
+    width: r.width,
+    height: r.height
+  });
 }
 
 // src/polygon.ts
-function withinPolygon(polygon, point2) {
+function isPointInPolygon(polygon, point2) {
   const { x, y } = point2;
   let c = false;
   for (let i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {
@@ -470,3 +513,7 @@ function debugPolygon(polygon) {
   const points = polygon.map((point2) => `${point2.x},${point2.y}`).join(" ");
   el.setAttribute("points", points);
 }
+debugPolygon.remove = () => {
+  const el = document.getElementById("debug-polygon");
+  el == null ? void 0 : el.remove();
+};

package/dist/index.mjs

@@ -1,108 +1,115 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+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 __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+
 // src/align.ts
 function hAlign(a, ref, h) {
   let x = ref.minX;
-  if (h === "left-inside")
+  if (h === "left-inside") {
     x = ref.minX;
-  if (h === "left-outside")
+  }
+  if (h === "left-outside") {
     x = ref.minX - ref.width;
-  if (h === "right-inside")
+  }
+  if (h === "right-inside") {
     x = ref.maxX - ref.width;
-  if (h === "right-outside")
+  }
+  if (h === "right-outside") {
     x = ref.maxX;
-  if (h === "center")
+  }
+  if (h === "center") {
     x = ref.midX - ref.width / 2;
-  return a.clone().set({ x });
+  }
+  return __spreadProps(__spreadValues({}, a), { x });
 }
 function vAlign(a, ref, v) {
   let y = ref.minY;
-  if (v === "top-inside")
+  if (v === "top-inside") {
     y = ref.minY;
-  if (v === "top-outside")
+  }
+  if (v === "top-outside") {
     y = ref.minY - a.height;
-  if (v === "bottom-inside")
+  }
+  if (v === "bottom-inside") {
     y = ref.maxY - a.height;
-  if (v === "bottom-outside")
+  }
+  if (v === "bottom-outside") {
     y = ref.maxY;
-  if (v === "center")
+  }
+  if (v === "center") {
     y = ref.midY - a.height / 2;
-  return a.clone().set({ y });
+  }
+  return __spreadProps(__spreadValues({}, a), { y });
 }
 function alignRect(a, ref, options) {
   const { h, v } = options;
   return vAlign(hAlign(a, ref, h), ref, v);
 }
 
+// ../core/dist/index.mjs
+var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
+
 // src/rect.ts
 var point = (x, y) => ({ x, y });
-var Rect = class {
-  constructor(v) {
-    this.v = v;
-  }
-  static create(v) {
-    return new Rect(v);
-  }
-  set(n) {
-    return new Rect(Object.assign({}, this.v, n));
-  }
-  clone() {
-    return new Rect(this.v);
-  }
-  get x() {
-    return this.v.x;
-  }
-  get y() {
-    return this.v.y;
-  }
-  get width() {
-    return this.v.width;
-  }
-  get height() {
-    return this.v.height;
-  }
-  get minX() {
-    return this.v.x;
-  }
-  get midX() {
-    return this.v.x + this.v.width / 2;
-  }
-  get maxX() {
-    return this.v.x + this.v.width;
-  }
-  get minY() {
-    return this.v.y;
-  }
-  get midY() {
-    return this.v.y + this.v.height / 2;
-  }
-  get maxY() {
-    return this.v.y + this.v.height;
-  }
-  get center() {
-    return point(this.midX, this.midY);
-  }
-  get centers() {
-    const top = point(this.midX, this.minY);
-    const right = point(this.maxX, this.midY);
-    const bottom = point(this.midX, this.maxY);
-    const left = point(this.minX, this.midY);
-    return { top, right, bottom, left };
-  }
-  get corners() {
-    const top = point(this.minX, this.minY);
-    const right = point(this.maxX, this.minY);
-    const bottom = point(this.maxX, this.maxY);
-    const left = point(this.minX, this.maxY);
-    return { top, right, bottom, left };
-  }
-  get edges() {
-    const c = this.corners;
-    const top = [c.top, c.right];
-    const right = [c.right, c.bottom];
-    const bottom = [c.left, c.bottom];
-    const left = [c.top, c.left];
-    return { top, right, bottom, left };
-  }
-};
+function createRect(r) {
+  const { x, y, width, height } = r;
+  const midX = x + width / 2;
+  const midY = y + height / 2;
+  return {
+    x,
+    y,
+    width,
+    height,
+    minX: x,
+    minY: y,
+    maxX: x + width,
+    maxY: y + height,
+    midX,
+    midY,
+    center: point(midX, midY)
+  };
+}
+function isRect(v) {
+  return hasProp(v, "x") && hasProp(v, "y") && hasProp(v, "width") && hasProp(v, "height");
+}
+function getRectCenters(v) {
+  const top = point(v.midX, v.minY);
+  const right = point(v.maxX, v.midY);
+  const bottom = point(v.midX, v.maxY);
+  const left = point(v.minX, v.midY);
+  return { top, right, bottom, left };
+}
+function getRectCorners(v) {
+  const top = point(v.minX, v.minY);
+  const right = point(v.maxX, v.minY);
+  const bottom = point(v.maxX, v.maxY);
+  const left = point(v.minX, v.maxY);
+  return { top, right, bottom, left };
+}
+function getRectEdges(v) {
+  const c = getRectCorners(v);
+  const top = [c.top, c.right];
+  const right = [c.right, c.bottom];
+  const bottom = [c.left, c.bottom];
+  const left = [c.top, c.left];
+  return { top, right, bottom, left };
+}
 
 // src/intersection.ts
 function intersects(a, b) {
@@ -113,7 +120,7 @@ function intersection(a, b) {
   const y = Math.max(a.y, b.y);
   const x2 = Math.min(a.x + a.width, b.x + b.width);
   const y2 = Math.min(a.y + a.height, b.y + b.height);
-  return Rect.create({ x, y, width: x2 - x, height: y2 - y });
+  return createRect({ x, y, width: x2 - x, height: y2 - y });
 }
 function collisions(a, b) {
   return {
@@ -172,14 +179,18 @@ function closest(...pts) {
   };
 }
 function closestSideToRect(ref, r) {
-  if (r.maxX <= ref.minX)
+  if (r.maxX <= ref.minX) {
     return "left";
-  if (r.minX >= ref.maxX)
+  }
+  if (r.minX >= ref.maxX) {
     return "right";
-  if (r.maxY <= ref.minY)
+  }
+  if (r.maxY <= ref.minY) {
     return "top";
-  if (r.minY >= ref.maxY)
+  }
+  if (r.minY >= ref.maxY) {
     return "bottom";
+  }
   return "left";
 }
 function closestSideToPoint(ref, p) {
@@ -209,17 +220,17 @@ function containsPoint(r, p) {
   return r.minX <= p.x && p.x <= r.maxX && r.minY <= p.y && p.y <= r.maxY;
 }
 function containsRect(a, b) {
-  return Object.values(b.corners).every((c) => containsPoint(a, c));
+  return Object.values(getRectCorners(b)).every((c) => containsPoint(a, c));
 }
 function contains(r, v) {
-  return v instanceof Rect ? containsRect(r, v) : containsPoint(r, v);
+  return isRect(v) ? containsRect(r, v) : containsPoint(r, v);
 }
 
 // ../dom/dist/index.mjs
 function getCache() {
   const g = globalThis;
-  g.__styleCache__ = g.__styleCache__ || /* @__PURE__ */ new WeakMap();
-  return g.__styleCache__;
+  g.__styleCache = g.__styleCache || /* @__PURE__ */ new WeakMap();
+  return g.__styleCache;
 }
 function getComputedStyle(el) {
   var _a;
@@ -237,7 +248,7 @@ function getComputedStyle(el) {
 
 // src/from-element.ts
 function getElementRect(el, opts = {}) {
-  return Rect.create(getClientRect(el, opts));
+  return createRect(getClientRect(el, opts));
 }
 function getClientRect(el, opts = {}) {
   const { excludeScrollbar = false, excludeBorders = false } = opts;
@@ -272,7 +283,7 @@ function getRectFromPoints(...pts) {
   const y = Math.min(...ys);
   const width = Math.max(...xs) - x;
   const height = Math.max(...ys) - y;
-  return Rect.create({ x, y, width, height });
+  return createRect({ x, y, width, height });
 }
 
 // src/union.ts
@@ -294,17 +305,16 @@ function fromRange(range) {
   let rs = [];
   const rects = Array.from(range.getClientRects());
   if (rects.length) {
-    rs = rs.concat(rects.map((r) => Rect.create(r)));
-  } else {
-    let start = range.startContainer;
-    if (start.nodeType === Node.TEXT_NODE) {
-      start = start.parentNode;
-    }
-    if (start instanceof HTMLElement) {
-      let r = getElementRect(start);
-      r.clone().set({ x: r.maxX, width: 0 });
-      rs.push(r);
-    }
+    rs = rs.concat(rects.map(createRect));
+    return union.apply(void 0, rs);
+  }
+  let start = range.startContainer;
+  if (start.nodeType === Node.TEXT_NODE) {
+    start = start.parentNode;
+  }
+  if (start instanceof HTMLElement) {
+    const r = getElementRect(start);
+    rs.push(__spreadProps(__spreadValues({}, r), { x: r.maxX, width: 0 }));
   }
   return union.apply(void 0, rs);
 }
@@ -319,22 +329,30 @@ function rotate(a, d, c) {
   const cos = Math.cos(r);
   const x = a.x - c.x;
   const y = a.y - c.y;
-  return { x: c.x + x * cos - y * sin, y: c.y + x * sin + y * cos };
+  return {
+    x: c.x + x * cos - y * sin,
+    y: c.y + x * sin + y * cos
+  };
 }
 function getRotationRect(r, deg) {
-  const rr = Object.values(r.corners).map((p) => rotate(p, deg, r.center));
+  const rr = Object.values(getRectCorners(r)).map((p) => rotate(p, deg, r.center));
   const xs = rr.map((p) => p.x);
   const ys = rr.map((p) => p.y);
   const minX = Math.min(...xs);
   const minY = Math.min(...ys);
   const maxX = Math.max(...xs);
   const maxY = Math.max(...ys);
-  return Rect.create({ x: minX, y: minY, width: maxX - minX, height: maxY - minY });
+  return createRect({
+    x: minX,
+    y: minY,
+    width: maxX - minX,
+    height: maxY - minY
+  });
 }
 
 // src/from-window.ts
 function getWindowRect(win, opts = {}) {
-  return Rect.create(getViewportRect(win, opts));
+  return createRect(getViewportRect(win, opts));
 }
 function getViewportRect(win, opts) {
   const { excludeScrollbar = false } = opts;
@@ -351,12 +369,30 @@ function getViewportRect(win, opts) {
   return rect;
 }
 
+// src/get-polygon.ts
+function getElementPolygon(rectValue, placement) {
+  const rect = createRect(rectValue);
+  const { top, right, left, bottom } = getRectCorners(rect);
+  const [base] = placement.split("-");
+  return {
+    top: [left, top, right, bottom],
+    right: [top, right, bottom, left],
+    bottom: [top, left, bottom, right],
+    left: [right, top, left, bottom]
+  }[base];
+}
+
 // src/operations.ts
 var isSymmetric = (v) => "dx" in v || "dy" in v;
 function inset(r, i) {
   const v = isSymmetric(i) ? { left: i.dx, right: i.dx, top: i.dy, bottom: i.dy } : i;
   const { top = 0, right = 0, bottom = 0, left = 0 } = v;
-  return Rect.create({ x: r.x + left, y: r.y + top, width: r.width - left - right, height: r.height - top - bottom });
+  return createRect({
+    x: r.x + left,
+    y: r.y + top,
+    width: r.width - left - right,
+    height: r.height - top - bottom
+  });
 }
 function expand(r, v) {
   const value = typeof v === "number" ? { dx: -v, dy: -v } : v;
@@ -368,11 +404,16 @@ function shrink(r, v) {
 }
 function shift(r, o) {
   const { x = 0, y = 0 } = o;
-  return Rect.create({ x: r.x + x, y: r.y + y, width: r.width, height: r.height });
+  return createRect({
+    x: r.x + x,
+    y: r.y + y,
+    width: r.width,
+    height: r.height
+  });
 }
 
 // src/polygon.ts
-function withinPolygon(polygon, point2) {
+function isPointInPolygon(polygon, point2) {
   const { x, y } = point2;
   let c = false;
   for (let i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {
@@ -414,8 +455,11 @@ function debugPolygon(polygon) {
   const points = polygon.map((point2) => `${point2.x},${point2.y}`).join(" ");
   el.setAttribute("points", points);
 }
+debugPolygon.remove = () => {
+  const el = document.getElementById("debug-polygon");
+  el == null ? void 0 : el.remove();
+};
 export {
-  Rect,
   alignRect,
   closest,
   closestSideToPoint,
@@ -424,6 +468,7 @@ export {
   contains,
   containsPoint,
   containsRect,
+  createRect,
   debugPolygon,
   distance,
   distanceBtwEdges,
@@ -431,7 +476,11 @@ export {
   distanceFromRect,
   expand,
   fromRange,
+  getElementPolygon,
   getElementRect,
+  getRectCenters,
+  getRectCorners,
+  getRectEdges,
   getRectFromPoints,
   getRotationRect,
   getViewportRect,
@@ -439,11 +488,12 @@ export {
   inset,
   intersection,
   intersects,
+  isPointInPolygon,
+  isRect,
   isSymmetric,
   rotate,
   shift,
   shrink,
   toRad,
-  union,
-  withinPolygon
+  union
 };

package/dist/polygon.d.ts

@@ -1,3 +1,6 @@
 import type { Point } from "./types";
-export declare function withinPolygon(polygon: Point[], point: Point): boolean;
+export declare function isPointInPolygon(polygon: Point[], point: Point): boolean;
 export declare function debugPolygon(polygon: Point[]): void;
+export declare namespace debugPolygon {
+    var remove: () => void;
+}

package/dist/rect.d.ts

@@ -1,64 +1,61 @@
 import type { RectEdge, RectValue } from "./types";
-export declare class Rect {
-    private v;
-    static create(v: RectValue): Rect;
-    protected constructor(v: RectValue);
-    set(n: Partial<RectValue>): Rect;
-    clone(): Rect;
-    get x(): number;
-    get y(): number;
-    get width(): number;
-    get height(): number;
-    get minX(): number;
-    get midX(): number;
-    get maxX(): number;
-    get minY(): number;
-    get midY(): number;
-    get maxY(): number;
-    get center(): {
+export declare function createRect(r: RectValue): {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    minX: number;
+    minY: number;
+    maxX: number;
+    maxY: number;
+    midX: number;
+    midY: number;
+    center: {
         x: number;
         y: number;
     };
-    get centers(): {
-        top: {
-            x: number;
-            y: number;
-        };
-        right: {
-            x: number;
-            y: number;
-        };
-        bottom: {
-            x: number;
-            y: number;
-        };
-        left: {
-            x: number;
-            y: number;
-        };
+};
+export declare type Rect = ReturnType<typeof createRect>;
+export declare function isRect(v: any): v is Rect;
+export declare function getRectCenters(v: Rect): {
+    top: {
+        x: number;
+        y: number;
     };
-    get corners(): {
-        top: {
-            x: number;
-            y: number;
-        };
-        right: {
-            x: number;
-            y: number;
-        };
-        bottom: {
-            x: number;
-            y: number;
-        };
-        left: {
-            x: number;
-            y: number;
-        };
+    right: {
+        x: number;
+        y: number;
     };
-    get edges(): {
-        top: RectEdge;
-        right: RectEdge;
-        bottom: RectEdge;
-        left: RectEdge;
+    bottom: {
+        x: number;
+        y: number;
+    };
+    left: {
+        x: number;
+        y: number;
+    };
+};
+export declare function getRectCorners(v: Rect): {
+    top: {
+        x: number;
+        y: number;
+    };
+    right: {
+        x: number;
+        y: number;
+    };
+    bottom: {
+        x: number;
+        y: number;
+    };
+    left: {
+        x: number;
+        y: number;
     };
-}
+};
+export declare function getRectEdges(v: Rect): {
+    top: RectEdge;
+    right: RectEdge;
+    bottom: RectEdge;
+    left: RectEdge;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/rect-utils",
-  "version": "0.0.0-dev-20220704151659",
+  "version": "0.0.0-dev-20220707125149",
   "description": "",
   "keywords": [
     "js",
@@ -25,7 +25,7 @@
     "url": "https://github.com/chakra-ui/zag/issues"
   },
   "dependencies": {
-    "@zag-js/dom-utils": "0.0.0-dev-20220704151659",
+    "@zag-js/dom-utils": "0.0.0-dev-20220707125149",
     "@zag-js/utils": "0.1.2"
   },
   "scripts": {