@instructure/ui-position 11.7.8 → 11.7.9-snapshot-1

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [11.7.9-snapshot-1](https://github.com/instructure/instructure-ui/compare/v11.7.8...v11.7.9-snapshot-1) (2026-10-06)
+
+**Note:** Version bump only for package @instructure/ui-position
+
+
+
+
+
 ## [11.7.8](https://github.com/instructure/instructure-ui/compare/v11.7.7...v11.7.8) (2026-10-02)
 
 **Note:** Version bump only for package @instructure/ui-position

package/lib/Position/index.js

@@ -6,17 +6,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.Position = void 0;
 var _react = require("react");
-var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js");
-var _ensureSingleChild = require("@instructure/ui-react-utils/lib/ensureSingleChild.js");
-var _safeCloneElement = require("@instructure/ui-react-utils/lib/safeCloneElement.js");
-var _withDeterministicId = require("@instructure/ui-react-utils/lib/DeterministicIdContext/withDeterministicId.js");
-var _addPositionChangeListener = require("@instructure/ui-dom-utils/lib/addPositionChangeListener.js");
-var _findDOMNode = require("@instructure/ui-dom-utils/lib/findDOMNode.js");
-var _deepEqual = require("@instructure/ui-utils/lib/deepEqual.js");
-var _shallowEqual = require("@instructure/ui-utils/lib/shallowEqual.js");
-var _combineDataCid = require("@instructure/ui-utils/lib/combineDataCid.js");
+var _uiReactUtils = require("@instructure/ui-react-utils");
+var _uiDomUtils = require("@instructure/ui-dom-utils");
+var _uiUtils = require("@instructure/ui-utils");
 var _debounce = require("@instructure/debounce");
-var _Portal = require("@instructure/ui-portal/lib/Portal");
+var _uiPortal = require("@instructure/ui-portal");
 var _emotion = require("@instructure/emotion");
 var _styles = _interopRequireDefault(require("./styles.js"));
 var _theme = _interopRequireDefault(require("./theme.js"));
@@ -52,7 +46,7 @@ var _dec, _dec2, _class;
 category: components/Util Components
 ---
 **/
-let Position = exports.Position = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = _dec2(_class = class Position extends _react.Component {
+let Position = exports.Position = (_dec = (0, _uiReactUtils.withDeterministicId)(), _dec2 = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = _dec2(_class = class Position extends _react.Component {
   static displayName = 'Position';
   static componentId = 'Position';
   static allowedProps = _props.allowedProps;
@@ -104,7 +98,7 @@ let Position = exports.Position = (_dec = (0, _withDeterministicId.withDetermini
     }
   };
   shouldComponentUpdate(nextProps, nextState, nextContext) {
-    return !(0, _deepEqual.deepEqual)(this.state, nextState) || !(0, _shallowEqual.shallowEqual)(this.props, nextProps) || !(0, _shallowEqual.shallowEqual)(this.context, nextContext);
+    return !(0, _uiUtils.deepEqual)(this.state, nextState) || !(0, _uiUtils.shallowEqual)(this.props, nextProps) || !(0, _uiUtils.shallowEqual)(this.context, nextContext);
   }
   componentDidMount() {
     this.toggleLocatorAttributes(true);
@@ -140,8 +134,8 @@ let Position = exports.Position = (_dec = (0, _withDeterministicId.withDetermini
     // We have to find the actual DOM nodes and append the attributes
     // directly, as we can't be sure when safe cloning the child that
     // it will accept the data attribute as a prop
-    this.toggleLocatorAttribute((0, _findDOMNode.findDOMNode)(this._content), Position.contentLocatorAttribute, set);
-    this.toggleLocatorAttribute((0, _findDOMNode.findDOMNode)(this._target), Position.targetLocatorAttribute, set);
+    this.toggleLocatorAttribute((0, _uiDomUtils.findDOMNode)(this._content), Position.contentLocatorAttribute, set);
+    this.toggleLocatorAttribute((0, _uiDomUtils.findDOMNode)(this._target), Position.targetLocatorAttribute, set);
   }
   toggleLocatorAttribute(node, locator, set) {
     if (node && node.hasAttribute) {
@@ -174,7 +168,7 @@ let Position = exports.Position = (_dec = (0, _withDeterministicId.withDetermini
   // Write `--ui-position-available-{height,width}` directly on the content
   // node's inline style
   applyAvailableSpaceCustomProperties() {
-    const node = (0, _findDOMNode.findDOMNode)(this._content);
+    const node = (0, _uiDomUtils.findDOMNode)(this._content);
     if (!node?.style) return;
     const set = (name, value) => {
       if (typeof value === 'number' && Number.isFinite(value)) {
@@ -213,7 +207,7 @@ let Position = exports.Position = (_dec = (0, _withDeterministicId.withDetermini
     });
   };
   startTracking() {
-    this._listener = this._listener || (0, _addPositionChangeListener.addPositionChangeListener)(this._target, this.position);
+    this._listener = this._listener || (0, _uiDomUtils.addPositionChangeListener)(this._target, this.position);
   }
   stopTracking() {
     if (this._listener) {
@@ -224,9 +218,9 @@ let Position = exports.Position = (_dec = (0, _withDeterministicId.withDetermini
 
   // content that needs to be positioned relative to the target
   renderContent() {
-    let content = (0, _ensureSingleChild.ensureSingleChild)(this.props.children);
+    let content = (0, _uiReactUtils.ensureSingleChild)(this.props.children);
     if (content) {
-      content = (0, _safeCloneElement.safeCloneElement)(content, {
+      content = (0, _uiReactUtils.safeCloneElement)(content, {
         ref: el => {
           this._content = el;
         },
@@ -241,7 +235,7 @@ let Position = exports.Position = (_dec = (0, _withDeterministicId.withDetermini
         }),
         [Position.contentLocatorAttribute]: this._id
       });
-      content = (0, _jsxRuntime.jsx)(_Portal.Portal, {
+      content = (0, _jsxRuntime.jsx)(_uiPortal.Portal, {
         open: true,
         onOpen: this.handlePortalOpen,
         mountNode: this.props.mountNode,
@@ -252,16 +246,16 @@ let Position = exports.Position = (_dec = (0, _withDeterministicId.withDetermini
     return content;
   }
   renderTarget() {
-    const target = (0, _callRenderProp.callRenderProp)(this.props.renderTarget);
+    const target = (0, _uiReactUtils.callRenderProp)(this.props.renderTarget);
     if (target) {
-      return (0, _safeCloneElement.safeCloneElement)(target, {
+      return (0, _uiReactUtils.safeCloneElement)(target, {
         ref: el => {
           this._target = el;
         },
         [Position.targetLocatorAttribute]: this._id
       });
     } else if (this.props.target) {
-      this._target = (0, _callRenderProp.callRenderProp)(this.props.target);
+      this._target = (0, _uiReactUtils.callRenderProp)(this.props.target);
     }
     return null;
   }
@@ -273,7 +267,7 @@ let Position = exports.Position = (_dec = (0, _withDeterministicId.withDetermini
       ...props,
       css: this.props.styles?.position,
       ref: this.handleRef,
-      "data-cid": (0, _combineDataCid.combineDataCid)('Position', this.props),
+      "data-cid": (0, _uiUtils.combineDataCid)('Position', this.props),
       children: [this.renderTarget(), this.renderContent()]
     });
   }

package/lib/calculateElementPosition.js

@@ -6,15 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.calculateElementPosition = calculateElementPosition;
 exports.default = void 0;
 exports.parsePlacement = parsePlacement;
-var _getBoundingClientRect = require("@instructure/ui-dom-utils/lib/getBoundingClientRect.js");
-var _getScrollParents = require("@instructure/ui-dom-utils/lib/getScrollParents.js");
-var _getOffsetParents = require("@instructure/ui-dom-utils/lib/getOffsetParents.js");
-var _canUseDOM = require("@instructure/ui-dom-utils/lib/canUseDOM.js");
-var _findDOMNode = require("@instructure/ui-dom-utils/lib/findDOMNode.js");
-var _ownerDocument = require("@instructure/ui-dom-utils/lib/ownerDocument.js");
-var _ownerWindow = require("@instructure/ui-dom-utils/lib/ownerWindow.js");
+var _uiDomUtils = require("@instructure/ui-dom-utils");
 var _mirrorPlacement = require("./mirrorPlacement.js");
-var _px = require("@instructure/ui-utils/lib/px.js");
+var _uiUtils = require("@instructure/ui-utils");
 /*
  * The MIT License (MIT)
  *
@@ -94,7 +88,7 @@ class PositionedElement {
     top: 0,
     left: 0
   }) {
-    this.node = (0, _findDOMNode.findDOMNode)(element);
+    this.node = (0, _uiDomUtils.findDOMNode)(element);
     if (typeof placement === 'string') {
       this.placement = parsePlacement(placement);
     } else if (Array.isArray(placement)) {
@@ -102,7 +96,7 @@ class PositionedElement {
     } else {
       this.placement = ['bottom', 'center'];
     }
-    this.rect = (0, _getBoundingClientRect.getBoundingClientRect)(this.node);
+    this.rect = (0, _uiDomUtils.getBoundingClientRect)(this.node);
     this._offset = offsetToPx(offset, this.size, this.node);
   }
   node;
@@ -170,7 +164,7 @@ class PositionedElement {
     }, this.size, this.node), parseOffset(this._offset, this.placement)]);
   }
   get scrollParentsOffset() {
-    const parents = (0, _getScrollParents.getScrollParents)(this.node);
+    const parents = (0, _uiDomUtils.getScrollParents)(this.node);
     let offsetY = 0;
     let offsetX = 0;
     for (let i = 1; i < parents.length; i++) {
@@ -191,18 +185,18 @@ class PositionedElement {
     // element, it will position absolutely with respect to that
     // ancestor. We calculate the offset between the child and
     // positioned parent so we can negate that distance
-    const parents = (0, _getOffsetParents.getOffsetParents)(this.node);
-    const doc = (0, _ownerDocument.ownerDocument)(this.node);
+    const parents = (0, _uiDomUtils.getOffsetParents)(this.node);
+    const doc = (0, _uiDomUtils.ownerDocument)(this.node);
 
     // If there is more than one parent, the offset on the
     // documentElement should be calculated appropriately.
     // Otherwise we need to explictly account for that offset
-    let offsetY = parents.length > 1 ? 0 : (0, _getBoundingClientRect.getBoundingClientRect)(doc?.documentElement).top;
+    let offsetY = parents.length > 1 ? 0 : (0, _uiDomUtils.getBoundingClientRect)(doc?.documentElement).top;
     let offsetX = 0;
     let scrollY = 0;
     for (let i = 1; i < parents.length; i++) {
-      const parent = (0, _getBoundingClientRect.getBoundingClientRect)(parents[i]);
-      const child = (0, _getBoundingClientRect.getBoundingClientRect)(parents[i - 1]);
+      const parent = (0, _uiDomUtils.getBoundingClientRect)(parents[i]);
+      const child = (0, _uiDomUtils.getBoundingClientRect)(parents[i - 1]);
       offsetY = offsetY + (child.top - parent.top);
       offsetX = offsetX + (child.left - parent.left);
       if (parents[i] === doc?.body) {
@@ -224,7 +218,7 @@ class PositionedElement {
   normalizeScrollTop(element) {
     // Account for cross browser differences with scrollTop attribute on the
     // body element https://bugs.chromium.org/p/chromium/issues/detail?id=766938
-    return (0, _ownerDocument.ownerDocument)(this.node)?.body === element ? 0 : element.scrollTop;
+    return (0, _uiDomUtils.ownerDocument)(this.node)?.body === element ? 0 : element.scrollTop;
   }
 }
 class PositionData {
@@ -236,7 +230,7 @@ class PositionData {
       over
     } = this.options;
     if (!element || placement === 'offscreen') return;
-    this.container = container || (0, _ownerDocument.ownerDocument)(element)?.body;
+    this.container = container || (0, _uiDomUtils.ownerDocument)(element)?.body;
     this.element = new PositionedElement(element, placement, {
       top: this.options.offsetY,
       left: this.options.offsetX
@@ -272,12 +266,12 @@ class PositionData {
     return this.element.shouldStretchHorizontally ? this.target.height : null;
   }
   get position() {
-    const win = (0, _ownerWindow.ownerWindow)(this.target.node);
+    const win = (0, _uiDomUtils.ownerWindow)(this.target.node);
     let {
       left,
       top
     } = addOffsets([this.target.position, this.offset]);
-    if (_canUseDOM.canUseDOM && win?.matchMedia) {
+    if (_uiDomUtils.canUseDOM && win?.matchMedia) {
       const retina = win.matchMedia('only screen and (min-resolution: 1.3dppx)').matches || win.matchMedia('only screen and (-webkit-min-device-pixel-ratio: 1.3)').matches;
       if (!retina) {
         left = Math.round(left);
@@ -307,9 +301,9 @@ class PositionData {
     };
   }
   overflow(element) {
-    const parentWindow = (0, _ownerWindow.ownerWindow)(element);
-    const elementBounds = (0, _getBoundingClientRect.getBoundingClientRect)(element);
-    const windowBounds = (0, _getBoundingClientRect.getBoundingClientRect)(parentWindow);
+    const parentWindow = (0, _uiDomUtils.ownerWindow)(element);
+    const elementBounds = (0, _uiDomUtils.getBoundingClientRect)(element);
+    const windowBounds = (0, _uiDomUtils.getBoundingClientRect)(parentWindow);
     const offsets = addOffsets([this.target.position, this.offset]);
     const parentOffset = {
       top: this.element.positionedParentsOffset.top + this.element.scrollParentsOffset.top,
@@ -440,16 +434,16 @@ class PositionData {
     } = this.options;
     const elementNode = this.element?.node;
     if (!elementNode) return null;
-    if (constrain === 'window') return (0, _ownerWindow.ownerWindow)(elementNode) ?? null;
+    if (constrain === 'window') return (0, _uiDomUtils.ownerWindow)(elementNode) ?? null;
     if (constrain === 'scroll-parent') {
-      return (0, _getScrollParents.getScrollParents)(this.target?.node)[0] ?? null;
+      return (0, _uiDomUtils.getScrollParents)(this.target?.node)[0] ?? null;
     }
-    if (constrain === 'parent') return (0, _findDOMNode.findDOMNode)(this.container) ?? null;
+    if (constrain === 'parent') return (0, _uiDomUtils.findDOMNode)(this.container) ?? null;
     if (typeof constrain === 'function') {
-      return (0, _findDOMNode.findDOMNode)(constrain.call(null)) ?? null;
+      return (0, _uiDomUtils.findDOMNode)(constrain.call(null)) ?? null;
     }
     if (typeof constrain === 'object' && constrain) {
-      return (0, _findDOMNode.findDOMNode)(constrain) ?? null;
+      return (0, _uiDomUtils.findDOMNode)(constrain) ?? null;
     }
     return null;
   }
@@ -491,8 +485,8 @@ class PositionData {
     // `offsetX` / `offsetY` always push the popover *away* from the trigger
     // so on the primary axis they consume available space.
     const elementNode = this.element.node;
-    const offsetY = (0, _px.px)(this.element._offset.top, elementNode);
-    const offsetX = (0, _px.px)(this.element._offset.left, elementNode);
+    const offsetY = (0, _uiUtils.px)(this.element._offset.top, elementNode);
+    const offsetX = (0, _uiUtils.px)(this.element._offset.left, elementNode);
     const [primary] = this.element.placement;
     let height;
     if (primary === 'bottom') {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-position",
-  "version": "11.7.8",
+  "version": "11.7.9-snapshot-1",
   "description": "A component for positioning content with respect to a designated target.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -15,20 +15,20 @@
   "license": "MIT",
   "dependencies": {
     "@babel/runtime": "^7.29.7",
-    "@instructure/debounce": "11.7.8",
-    "@instructure/shared-types": "11.7.8",
-    "@instructure/ui-portal": "11.7.8",
-    "@instructure/emotion": "11.7.8",
-    "@instructure/ui-dom-utils": "11.7.8",
-    "@instructure/ui-react-utils": "11.7.8",
-    "@instructure/ui-utils": "11.7.8",
-    "@instructure/ui-themes": "11.7.8",
-    "@instructure/uid": "11.7.8"
+    "@instructure/debounce": "11.7.9-snapshot-1",
+    "@instructure/emotion": "11.7.9-snapshot-1",
+    "@instructure/shared-types": "11.7.9-snapshot-1",
+    "@instructure/ui-dom-utils": "11.7.9-snapshot-1",
+    "@instructure/ui-portal": "11.7.9-snapshot-1",
+    "@instructure/ui-react-utils": "11.7.9-snapshot-1",
+    "@instructure/ui-utils": "11.7.9-snapshot-1",
+    "@instructure/uid": "11.7.9-snapshot-1",
+    "@instructure/ui-themes": "11.7.9-snapshot-1"
   },
   "devDependencies": {
     "vitest": "^5.0.0",
-    "@instructure/ui-color-utils": "11.7.8",
-    "@instructure/ui-babel-preset": "11.7.8"
+    "@instructure/ui-babel-preset": "11.7.9-snapshot-1",
+    "@instructure/ui-color-utils": "11.7.9-snapshot-1"
   },
   "peerDependencies": {
     "react": ">=18 <=19"