@zag-js/popper 0.10.2 → 0.10.4

package/dist/index.js

@@ -1,281 +1,12 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-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);
+'use strict';
 
-// src/index.ts
-var src_exports = {};
-__export(src_exports, {
-  getBasePlacement: () => getBasePlacement,
-  getPlacement: () => getPlacement,
-  getPlacementStyles: () => getPlacementStyles
-});
-module.exports = __toCommonJS(src_exports);
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-// src/get-placement.ts
-var import_dom2 = require("@floating-ui/dom");
-var import_dom_query = require("@zag-js/dom-query");
-var import_utils = require("@zag-js/utils");
+const getPlacement = require('./get-placement.js');
+const getStyles = require('./get-styles.js');
 
-// src/auto-update.ts
-var import_dom = require("@floating-ui/dom");
-var import_element_rect = require("@zag-js/element-rect");
-var callAll = (...fns) => () => fns.forEach((fn) => fn());
-var isHTMLElement = (el) => {
-  return typeof el === "object" && el !== null && el.nodeType === 1;
-};
-var addDomEvent = (el, type, fn, options) => {
-  el.addEventListener(type, fn, options);
-  return () => el.removeEventListener(type, fn, options);
-};
-function resolveOptions(option) {
-  const bool = typeof option === "boolean";
-  return {
-    ancestorResize: bool ? option : option.ancestorResize ?? true,
-    ancestorScroll: bool ? option : option.ancestorScroll ?? true,
-    referenceResize: bool ? option : option.referenceResize ?? true
-  };
-}
-function autoUpdate(reference, floating, update, options = false) {
-  const { ancestorScroll, ancestorResize, referenceResize } = resolveOptions(options);
-  const useAncestors = ancestorScroll || ancestorResize;
-  const ancestors = [];
-  if (useAncestors && isHTMLElement(reference)) {
-    ancestors.push(...(0, import_dom.getOverflowAncestors)(reference));
-  }
-  function addResizeListeners() {
-    let cleanups = [(0, import_element_rect.trackElementRect)(floating, { scope: "size", onChange: update })];
-    if (referenceResize && isHTMLElement(reference)) {
-      cleanups.push((0, import_element_rect.trackElementRect)(reference, { onChange: update }));
-    }
-    cleanups.push(callAll(...ancestors.map((el) => addDomEvent(el, "resize", update))));
-    return () => cleanups.forEach((fn) => fn());
-  }
-  function addScrollListeners() {
-    return callAll(...ancestors.map((el) => addDomEvent(el, "scroll", update, { passive: true })));
-  }
-  return callAll(addResizeListeners(), addScrollListeners());
-}
 
-// src/middleware.ts
-var toVar = (value) => ({ variable: value, reference: `var(${value})` });
-var cssVars = {
-  arrowSize: toVar("--arrow-size"),
-  arrowSizeHalf: toVar("--arrow-size-half"),
-  arrowBg: toVar("--arrow-background"),
-  transformOrigin: toVar("--transform-origin"),
-  arrowOffset: toVar("--arrow-offset")
-};
-var getTransformOrigin = (arrow2) => ({
-  top: "bottom center",
-  "top-start": arrow2 ? `${arrow2.x}px bottom` : "left bottom",
-  "top-end": arrow2 ? `${arrow2.x}px bottom` : "right bottom",
-  bottom: "top center",
-  "bottom-start": arrow2 ? `${arrow2.x}px top` : "top left",
-  "bottom-end": arrow2 ? `${arrow2.x}px top` : "top right",
-  left: "right center",
-  "left-start": arrow2 ? `right ${arrow2.y}px` : "right top",
-  "left-end": arrow2 ? `right ${arrow2.y}px` : "right bottom",
-  right: "left center",
-  "right-start": arrow2 ? `left ${arrow2.y}px` : "left top",
-  "right-end": arrow2 ? `left ${arrow2.y}px` : "left bottom"
-});
-var transformOrigin = {
-  name: "transformOrigin",
-  fn({ placement, elements, middlewareData }) {
-    const { arrow: arrow2 } = middlewareData;
-    const transformOrigin2 = getTransformOrigin(arrow2)[placement];
-    const { floating } = elements;
-    floating.style.setProperty(cssVars.transformOrigin.variable, transformOrigin2);
-    return {
-      data: { transformOrigin: transformOrigin2 }
-    };
-  }
-};
-var shiftArrow = (opts) => ({
-  name: "shiftArrow",
-  fn({ placement, middlewareData }) {
-    const { element: arrow2 } = opts;
-    if (middlewareData.arrow) {
-      const { x, y } = middlewareData.arrow;
-      const dir = placement.split("-")[0];
-      Object.assign(arrow2.style, {
-        left: x != null ? `${x}px` : "",
-        top: y != null ? `${y}px` : "",
-        [dir]: `calc(100% + ${cssVars.arrowOffset.reference})`
-      });
-    }
-    return {};
-  }
-});
 
-// src/get-placement.ts
-var defaultOptions = {
-  strategy: "absolute",
-  placement: "bottom",
-  listeners: true,
-  gutter: 8,
-  flip: true,
-  sameWidth: false,
-  overflowPadding: 8
-};
-function getPlacementImpl(reference, floating, opts = {}) {
-  if (!floating || !reference)
-    return;
-  const options = Object.assign({}, defaultOptions, opts);
-  const arrowEl = floating.querySelector("[data-part=arrow]");
-  const middleware = [];
-  const boundary = typeof options.boundary === "function" ? options.boundary() : options.boundary;
-  if (options.flip) {
-    middleware.push(
-      (0, import_dom2.flip)({
-        boundary,
-        padding: options.overflowPadding
-      })
-    );
-  }
-  if (options.gutter || options.offset) {
-    const arrowOffset = arrowEl ? arrowEl.offsetHeight / 2 : 0;
-    const data = options.gutter ? { mainAxis: options.gutter } : options.offset;
-    if (data?.mainAxis != null)
-      data.mainAxis += arrowOffset;
-    middleware.push((0, import_dom2.offset)(data));
-  }
-  middleware.push(
-    (0, import_dom2.shift)({
-      boundary,
-      crossAxis: options.overlap,
-      padding: options.overflowPadding
-    })
-  );
-  if (arrowEl) {
-    middleware.push(
-      (0, import_dom2.arrow)({ element: arrowEl, padding: 8 }),
-      shiftArrow({ element: arrowEl })
-    );
-  }
-  middleware.push(transformOrigin);
-  middleware.push(
-    (0, import_dom2.size)({
-      padding: options.overflowPadding,
-      apply({ rects, availableHeight, availableWidth }) {
-        const referenceWidth = Math.round(rects.reference.width);
-        floating.style.setProperty("--reference-width", `${referenceWidth}px`);
-        floating.style.setProperty("--available-width", `${availableWidth}px`);
-        floating.style.setProperty("--available-height", `${availableHeight}px`);
-        if (options.sameWidth) {
-          Object.assign(floating.style, {
-            width: `${referenceWidth}px`,
-            minWidth: "unset"
-          });
-        }
-        if (options.fitViewport) {
-          Object.assign(floating.style, {
-            maxWidth: `${availableWidth}px`,
-            maxHeight: `${availableHeight}px`
-          });
-        }
-      }
-    })
-  );
-  function compute(config = {}) {
-    if (!reference || !floating)
-      return;
-    const { placement, strategy, onComplete } = options;
-    (0, import_dom2.computePosition)(reference, floating, {
-      placement,
-      middleware,
-      strategy,
-      ...config
-    }).then((data) => {
-      const x = Math.round(data.x);
-      const y = Math.round(data.y);
-      Object.assign(floating.style, {
-        position: data.strategy,
-        top: "0px",
-        left: "0px",
-        transform: `translate3d(${x}px, ${y}px, 0)`
-      });
-      onComplete?.(data);
-    });
-  }
-  compute();
-  return (0, import_utils.callAll)(
-    options.listeners ? autoUpdate(reference, floating, compute, options.listeners) : void 0,
-    options.onCleanup
-  );
-}
-function getBasePlacement(placement) {
-  return placement.split("-")[0];
-}
-function getPlacement(referenceOrFn, floatingOrFn, opts = {}) {
-  const { defer, ...restOptions } = opts;
-  const func = defer ? import_dom_query.raf : (v) => v();
-  const cleanups = [];
-  cleanups.push(
-    func(() => {
-      const reference = typeof referenceOrFn === "function" ? referenceOrFn() : referenceOrFn;
-      const floating = typeof floatingOrFn === "function" ? floatingOrFn() : floatingOrFn;
-      cleanups.push(getPlacementImpl(reference, floating, restOptions));
-    })
-  );
-  return () => {
-    cleanups.forEach((fn) => fn?.());
-  };
-}
-
-// src/get-styles.ts
-var ARROW_FLOATING_STYLE = {
-  bottom: "rotate(45deg)",
-  left: "rotate(135deg)",
-  top: "rotate(225deg)",
-  right: "rotate(315deg)"
-};
-function getPlacementStyles(options) {
-  const { placement = "bottom" } = options;
-  return {
-    arrow: {
-      position: "absolute",
-      width: cssVars.arrowSize.reference,
-      height: cssVars.arrowSize.reference,
-      [cssVars.arrowSizeHalf.variable]: `calc(${cssVars.arrowSize.reference} / 2)`,
-      [cssVars.arrowOffset.variable]: `calc(${cssVars.arrowSizeHalf.reference} * -1)`
-    },
-    arrowTip: {
-      transform: ARROW_FLOATING_STYLE[placement.split("-")[0]],
-      background: cssVars.arrowBg.reference,
-      top: "0",
-      left: "0",
-      width: "100%",
-      height: "100%",
-      position: "absolute",
-      zIndex: "inherit"
-    },
-    floating: {
-      position: "absolute",
-      minWidth: "max-content",
-      top: "0px",
-      left: "0px"
-    }
-  };
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  getBasePlacement,
-  getPlacement,
-  getPlacementStyles
-});
+exports.getBasePlacement = getPlacement.getBasePlacement;
+exports.getPlacement = getPlacement.getPlacement;
+exports.getPlacementStyles = getStyles.getPlacementStyles;

package/dist/index.mjs

@@ -1,14 +1,2 @@
-import {
-  getBasePlacement,
-  getPlacement
-} from "./chunk-EC2KMZAZ.mjs";
-import "./chunk-MLNMIWN3.mjs";
-import {
-  getPlacementStyles
-} from "./chunk-V4C4UQPN.mjs";
-import "./chunk-X5LLREVI.mjs";
-export {
-  getBasePlacement,
-  getPlacement,
-  getPlacementStyles
-};
+export { getBasePlacement, getPlacement } from './get-placement.mjs';
+export { getPlacementStyles } from './get-styles.mjs';

package/dist/middleware.d.ts

@@ -1,6 +1,5 @@
-import { Middleware } from '@floating-ui/dom';
-
-declare const cssVars: {
+import type { Middleware } from "@floating-ui/dom";
+export declare const cssVars: {
     arrowSize: {
         variable: string;
         reference: string;
@@ -22,10 +21,9 @@ declare const cssVars: {
         reference: string;
     };
 };
-declare const transformOrigin: Middleware;
+export declare const transformOrigin: Middleware;
 type ArrowOptions = {
     element: HTMLElement;
 };
-declare const shiftArrow: (opts: ArrowOptions) => Middleware;
-
-export { cssVars, shiftArrow, transformOrigin };
+export declare const shiftArrow: (opts: ArrowOptions) => Middleware;
+export {};

package/dist/middleware.js

@@ -1,39 +1,16 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-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);
+'use strict';
 
-// src/middleware.ts
-var middleware_exports = {};
-__export(middleware_exports, {
-  cssVars: () => cssVars,
-  shiftArrow: () => shiftArrow,
-  transformOrigin: () => transformOrigin
-});
-module.exports = __toCommonJS(middleware_exports);
-var toVar = (value) => ({ variable: value, reference: `var(${value})` });
-var cssVars = {
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const toVar = (value) => ({ variable: value, reference: `var(${value})` });
+const cssVars = {
   arrowSize: toVar("--arrow-size"),
   arrowSizeHalf: toVar("--arrow-size-half"),
   arrowBg: toVar("--arrow-background"),
   transformOrigin: toVar("--transform-origin"),
   arrowOffset: toVar("--arrow-offset")
 };
-var getTransformOrigin = (arrow) => ({
+const getTransformOrigin = (arrow) => ({
   top: "bottom center",
   "top-start": arrow ? `${arrow.x}px bottom` : "left bottom",
   "top-end": arrow ? `${arrow.x}px bottom` : "right bottom",
@@ -47,7 +24,7 @@ var getTransformOrigin = (arrow) => ({
   "right-start": arrow ? `left ${arrow.y}px` : "left top",
   "right-end": arrow ? `left ${arrow.y}px` : "left bottom"
 });
-var transformOrigin = {
+const transformOrigin = {
   name: "transformOrigin",
   fn({ placement, elements, middlewareData }) {
     const { arrow } = middlewareData;
@@ -59,7 +36,7 @@ var transformOrigin = {
     };
   }
 };
-var shiftArrow = (opts) => ({
+const shiftArrow = (opts) => ({
   name: "shiftArrow",
   fn({ placement, middlewareData }) {
     const { element: arrow } = opts;
@@ -75,9 +52,7 @@ var shiftArrow = (opts) => ({
     return {};
   }
 });
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  cssVars,
-  shiftArrow,
-  transformOrigin
-});
+
+exports.cssVars = cssVars;
+exports.shiftArrow = shiftArrow;
+exports.transformOrigin = transformOrigin;

package/dist/middleware.mjs

@@ -1,10 +1,52 @@
-import {
-  cssVars,
-  shiftArrow,
-  transformOrigin
-} from "./chunk-X5LLREVI.mjs";
-export {
-  cssVars,
-  shiftArrow,
-  transformOrigin
+const toVar = (value) => ({ variable: value, reference: `var(${value})` });
+const cssVars = {
+  arrowSize: toVar("--arrow-size"),
+  arrowSizeHalf: toVar("--arrow-size-half"),
+  arrowBg: toVar("--arrow-background"),
+  transformOrigin: toVar("--transform-origin"),
+  arrowOffset: toVar("--arrow-offset")
 };
+const getTransformOrigin = (arrow) => ({
+  top: "bottom center",
+  "top-start": arrow ? `${arrow.x}px bottom` : "left bottom",
+  "top-end": arrow ? `${arrow.x}px bottom` : "right bottom",
+  bottom: "top center",
+  "bottom-start": arrow ? `${arrow.x}px top` : "top left",
+  "bottom-end": arrow ? `${arrow.x}px top` : "top right",
+  left: "right center",
+  "left-start": arrow ? `right ${arrow.y}px` : "right top",
+  "left-end": arrow ? `right ${arrow.y}px` : "right bottom",
+  right: "left center",
+  "right-start": arrow ? `left ${arrow.y}px` : "left top",
+  "right-end": arrow ? `left ${arrow.y}px` : "left bottom"
+});
+const transformOrigin = {
+  name: "transformOrigin",
+  fn({ placement, elements, middlewareData }) {
+    const { arrow } = middlewareData;
+    const transformOrigin2 = getTransformOrigin(arrow)[placement];
+    const { floating } = elements;
+    floating.style.setProperty(cssVars.transformOrigin.variable, transformOrigin2);
+    return {
+      data: { transformOrigin: transformOrigin2 }
+    };
+  }
+};
+const shiftArrow = (opts) => ({
+  name: "shiftArrow",
+  fn({ placement, middlewareData }) {
+    const { element: arrow } = opts;
+    if (middlewareData.arrow) {
+      const { x, y } = middlewareData.arrow;
+      const dir = placement.split("-")[0];
+      Object.assign(arrow.style, {
+        left: x != null ? `${x}px` : "",
+        top: y != null ? `${y}px` : "",
+        [dir]: `calc(100% + ${cssVars.arrowOffset.reference})`
+      });
+    }
+    return {};
+  }
+});
+
+export { cssVars, shiftArrow, transformOrigin };

package/dist/types.d.ts

@@ -1,8 +1,7 @@
-import { Placement, Boundary, ComputePositionReturn } from '@floating-ui/dom';
-export { Placement } from '@floating-ui/dom';
-import { AutoUpdateOptions } from './auto-update.js';
-
-type PositioningOptions = {
+import type { Boundary, ComputePositionReturn, Placement } from "@floating-ui/dom";
+import type { AutoUpdateOptions } from "./auto-update";
+export type { Placement };
+export type PositioningOptions = {
     /**
      * The strategy to use for positioning
      */
@@ -60,6 +59,4 @@ type PositioningOptions = {
      */
     onCleanup?: VoidFunction;
 };
-type BasePlacement = "top" | "right" | "bottom" | "left";
-
-export { BasePlacement, PositioningOptions };
+export type BasePlacement = "top" | "right" | "bottom" | "left";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/popper",
-  "version": "0.10.2",
+  "version": "0.10.4",
   "description": "Dynamic positioning logic for ui machines",
   "keywords": [
     "js",
@@ -23,10 +23,10 @@
     "url": "https://github.com/chakra-ui/zag/issues"
   },
   "dependencies": {
-    "@floating-ui/dom": "1.2.9",
-    "@zag-js/dom-query": "0.10.2",
-    "@zag-js/element-rect": "0.10.2",
-    "@zag-js/utils": "0.10.2"
+    "@floating-ui/dom": "1.4.3",
+    "@zag-js/dom-query": "0.10.4",
+    "@zag-js/element-rect": "0.10.4",
+    "@zag-js/utils": "0.10.4"
   },
   "devDependencies": {
     "clean-package": "2.2.0"
@@ -44,13 +44,8 @@
     "./package.json": "./package.json"
   },
   "scripts": {
-    "build-fast": "tsup src",
-    "start": "pnpm build --watch",
-    "build": "tsup src --dts",
-    "test": "jest --config ../../../jest.config.js --rootDir . --passWithNoTests",
+    "build": "vite build -c ../../../vite.config.ts",
     "lint": "eslint src --ext .ts,.tsx",
-    "test-ci": "pnpm test --ci --runInBand",
-    "test-watch": "pnpm test --watch -u",
     "typecheck": "tsc --noEmit"
   }
 }

package/src/get-placement.ts

@@ -45,7 +45,7 @@ function getPlacementImpl(reference: MaybeRectElement, floating: MaybeElement, o
 
   if (options.gutter || options.offset) {
     const arrowOffset = arrowEl ? arrowEl.offsetHeight / 2 : 0
-    const data = options.gutter ? { mainAxis: options.gutter } : options.offset
+    const data = options.offset ? options.offset : { mainAxis: options.gutter }
     if (data?.mainAxis != null) data.mainAxis += arrowOffset
     middleware.push(offset(data))
   }

package/dist/chunk-EC2KMZAZ.mjs

@@ -1,130 +0,0 @@
-import {
-  autoUpdate
-} from "./chunk-MLNMIWN3.mjs";
-import {
-  shiftArrow,
-  transformOrigin
-} from "./chunk-X5LLREVI.mjs";
-
-// src/get-placement.ts
-import { arrow, computePosition, flip, offset, shift, size } from "@floating-ui/dom";
-import { raf } from "@zag-js/dom-query";
-import { callAll } from "@zag-js/utils";
-var defaultOptions = {
-  strategy: "absolute",
-  placement: "bottom",
-  listeners: true,
-  gutter: 8,
-  flip: true,
-  sameWidth: false,
-  overflowPadding: 8
-};
-function getPlacementImpl(reference, floating, opts = {}) {
-  if (!floating || !reference)
-    return;
-  const options = Object.assign({}, defaultOptions, opts);
-  const arrowEl = floating.querySelector("[data-part=arrow]");
-  const middleware = [];
-  const boundary = typeof options.boundary === "function" ? options.boundary() : options.boundary;
-  if (options.flip) {
-    middleware.push(
-      flip({
-        boundary,
-        padding: options.overflowPadding
-      })
-    );
-  }
-  if (options.gutter || options.offset) {
-    const arrowOffset = arrowEl ? arrowEl.offsetHeight / 2 : 0;
-    const data = options.gutter ? { mainAxis: options.gutter } : options.offset;
-    if (data?.mainAxis != null)
-      data.mainAxis += arrowOffset;
-    middleware.push(offset(data));
-  }
-  middleware.push(
-    shift({
-      boundary,
-      crossAxis: options.overlap,
-      padding: options.overflowPadding
-    })
-  );
-  if (arrowEl) {
-    middleware.push(
-      arrow({ element: arrowEl, padding: 8 }),
-      shiftArrow({ element: arrowEl })
-    );
-  }
-  middleware.push(transformOrigin);
-  middleware.push(
-    size({
-      padding: options.overflowPadding,
-      apply({ rects, availableHeight, availableWidth }) {
-        const referenceWidth = Math.round(rects.reference.width);
-        floating.style.setProperty("--reference-width", `${referenceWidth}px`);
-        floating.style.setProperty("--available-width", `${availableWidth}px`);
-        floating.style.setProperty("--available-height", `${availableHeight}px`);
-        if (options.sameWidth) {
-          Object.assign(floating.style, {
-            width: `${referenceWidth}px`,
-            minWidth: "unset"
-          });
-        }
-        if (options.fitViewport) {
-          Object.assign(floating.style, {
-            maxWidth: `${availableWidth}px`,
-            maxHeight: `${availableHeight}px`
-          });
-        }
-      }
-    })
-  );
-  function compute(config = {}) {
-    if (!reference || !floating)
-      return;
-    const { placement, strategy, onComplete } = options;
-    computePosition(reference, floating, {
-      placement,
-      middleware,
-      strategy,
-      ...config
-    }).then((data) => {
-      const x = Math.round(data.x);
-      const y = Math.round(data.y);
-      Object.assign(floating.style, {
-        position: data.strategy,
-        top: "0px",
-        left: "0px",
-        transform: `translate3d(${x}px, ${y}px, 0)`
-      });
-      onComplete?.(data);
-    });
-  }
-  compute();
-  return callAll(
-    options.listeners ? autoUpdate(reference, floating, compute, options.listeners) : void 0,
-    options.onCleanup
-  );
-}
-function getBasePlacement(placement) {
-  return placement.split("-")[0];
-}
-function getPlacement(referenceOrFn, floatingOrFn, opts = {}) {
-  const { defer, ...restOptions } = opts;
-  const func = defer ? raf : (v) => v();
-  const cleanups = [];
-  cleanups.push(
-    func(() => {
-      const reference = typeof referenceOrFn === "function" ? referenceOrFn() : referenceOrFn;
-      const floating = typeof floatingOrFn === "function" ? floatingOrFn() : floatingOrFn;
-      cleanups.push(getPlacementImpl(reference, floating, restOptions));
-    })
-  );
-  return () => {
-    cleanups.forEach((fn) => fn?.());
-  };
-}
-
-export {
-  getBasePlacement,
-  getPlacement
-};