@instructure/ui-position 8.33.1 → 8.33.2

package/CHANGELOG.md

@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [8.33.2](https://github.com/instructure/instructure-ui/compare/v8.33.1...v8.33.2) (2023-01-25)
+
+**Note:** Version bump only for package @instructure/ui-position
+
 ## [8.33.1](https://github.com/instructure/instructure-ui/compare/v8.33.0...v8.33.1) (2023-01-06)
 
 **Note:** Version bump only for package @instructure/ui-position

package/es/Position/PositionContentLocator.js

@@ -21,6 +21,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+
 import { locator } from '@instructure/ui-test-locator';
 import { Position } from './index';
 export const PositionContentLocator = locator(`[${Position.contentLocatorAttribute}]`);

package/es/Position/PositionLocator.js

@@ -29,31 +29,26 @@ export const customMethods = {
   findTarget: function (element) {
     if (element && element.getAttribute) {
       const id = element.getAttribute(Position.locatorAttribute);
-
       for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
         args[_key - 1] = arguments[_key];
       }
-
       return locator(`[${Position.targetLocatorAttribute}="${id}"]`).find(...args);
     }
-
     throw new Error('Element ' + element + ' not found');
   },
   findContent: function (element) {
     if (element && element.getAttribute) {
       const id = element.getAttribute(Position.locatorAttribute);
-
       for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
         args[_key2 - 1] = arguments[_key2];
       }
-
       return locator(`[${Position.contentLocatorAttribute}="${id}"]`).find(...args);
     }
-
     throw new Error('Element ' + element + ' not found');
   }
 };
 export { PositionContentLocator };
-export { PositionTargetLocator }; // @ts-expect-error ts-migrate(2339) FIXME: Property 'selector' does not exist on type 'typeof... Remove this comment to see the full error message
+export { PositionTargetLocator };
 
+// @ts-expect-error ts-migrate(2339) FIXME: Property 'selector' does not exist on type 'typeof... Remove this comment to see the full error message
 export const PositionLocator = locator(Position.selector, customMethods);

package/es/Position/PositionTargetLocator.js

@@ -21,6 +21,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+
 import { Position } from './index';
 import { locator } from '@instructure/ui-test-locator';
 export const PositionTargetLocator = locator(`[${Position.targetLocatorAttribute}]`);

package/es/Position/index.js

@@ -1,5 +1,4 @@
 var _dec, _dec2, _dec3, _class, _class2;
-
 /*
  * The MIT License (MIT)
  *
@@ -37,7 +36,6 @@ import generateStyle from './styles';
 import generateComponentTheme from './theme';
 import { allowedProps, propTypes } from './props';
 import { calculateElementPosition } from '../calculateElementPosition';
-
 /**
 ---
 category: components/utilities
@@ -53,23 +51,18 @@ let Position = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, g
     this._listener = null;
     this._content = void 0;
     this._target = void 0;
-
     this.handleRef = el => {
       const elementRef = this.props.elementRef;
       this.ref = el;
-
       if (typeof elementRef === 'function') {
         elementRef(el);
       }
     };
-
     this.handlePortalOpen = () => {
       this.position();
-
       if (this.props.shouldTrackPosition) {
         this.startTracking();
       }
-
       this._timeouts.push(setTimeout(() => {
         if (this.state.positioned && typeof this.props.onPositioned === 'function') {
           this.props.onPositioned({
@@ -80,14 +73,12 @@ let Position = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, g
         }
       }, 0));
     };
-
     this.position = () => {
       this.setState({
         positioned: true,
         ...this.calculatePosition(this.props)
       });
     };
-
     this.state = {
       positioned: false,
       ...this.calculatePosition(props)
@@ -98,32 +89,24 @@ let Position = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, g
     });
     this._id = this.props.id || props.deterministicId();
   }
-
   shouldComponentUpdate(nextProps, nextState, nextContext) {
     return !deepEqual(this.state, nextState) || !shallowEqual(this.props, nextProps) || !shallowEqual(this.context, nextContext);
   }
-
   componentDidMount() {
     var _this$props$makeStyle, _this$props;
-
     this.toggleLocatorAttributes(true);
     (_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props);
   }
-
   componentDidUpdate(prevProps, prevState) {
     var _this$props$makeStyle2, _this$props2;
-
     this.position();
     this.toggleLocatorAttributes(true);
-
     if (this.props.shouldTrackPosition !== prevProps.shouldTrackPosition) {
       this.props.shouldTrackPosition ? this.startTracking() : this.stopTracking();
     }
-
     const _this$state = this.state,
-          style = _this$state.style,
-          placement = _this$state.placement;
-
+      style = _this$state.style,
+      placement = _this$state.placement;
     if (style && prevState.style && (placement !== prevState.placement || style.top !== prevState.style.top || style.left !== prevState.style.left) && typeof this.props.onPositionChanged === 'function') {
       this.props.onPositionChanged({
         top: style.top,
@@ -131,20 +114,15 @@ let Position = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, g
         placement
       });
     }
-
     (_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2);
   }
-
   componentWillUnmount() {
     ;
     this.position.cancel();
     this.stopTracking();
-
     this._timeouts.forEach(timeout => clearTimeout(timeout));
-
     this.toggleLocatorAttributes(false);
   }
-
   toggleLocatorAttributes(set) {
     // 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
@@ -152,21 +130,18 @@ let Position = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, g
     this.toggleLocatorAttribute(findDOMNode(this._content), Position.contentLocatorAttribute, set);
     this.toggleLocatorAttribute(findDOMNode(this._target), Position.targetLocatorAttribute, set);
   }
-
   toggleLocatorAttribute(node, locator, set) {
     if (node && node.hasAttribute) {
       if (set && !node.hasAttribute(locator)) {
         ;
         node.setAttribute(locator, this._id);
       }
-
       if (!set && node.hasAttribute(locator)) {
         ;
         node.removeAttribute(locator);
       }
     }
   }
-
   calculatePosition(props) {
     return calculateElementPosition(this._content, this._target, {
       placement: props.placement,
@@ -177,26 +152,21 @@ let Position = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, g
       over: props.shouldPositionOverTarget
     });
   }
-
   startTracking() {
     this._listener = this._listener || addPositionChangeListener(this._target, this.position);
   }
-
   stopTracking() {
     if (this._listener) {
       this._listener.remove();
-
       this._listener = null;
     }
-  } // content that needs to be positioned relative to the target
-
+  }
 
+  // content that needs to be positioned relative to the target
   renderContent() {
     let content = ensureSingleChild(this.props.children);
-
     if (content) {
       var _this$props$styles;
-
       content = safeCloneElement(content, {
         ref: el => {
           this._content = el;
@@ -219,13 +189,10 @@ let Position = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, g
         insertAt: this.props.insertAt
       }, content);
     }
-
     return content;
   }
-
   renderTarget() {
     const target = callRenderProp(this.props.renderTarget);
-
     if (target) {
       return safeCloneElement(target, {
         ref: el => {
@@ -236,13 +203,10 @@ let Position = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, g
     } else if (this.props.target) {
       this._target = callRenderProp(this.props.target);
     }
-
     return null;
   }
-
   render() {
     var _this$props$styles2;
-
     const props = {
       [Position.locatorAttribute]: this._id
     };
@@ -251,7 +215,6 @@ let Position = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, g
       ref: this.handleRef
     }), this.renderTarget(), this.renderContent());
   }
-
 }, _class2.displayName = "Position", _class2.componentId = 'Position', _class2.allowedProps = allowedProps, _class2.propTypes = propTypes, _class2.defaultProps = {
   placement: 'bottom center',
   mountNode: null,

package/es/Position/locator.js

@@ -21,6 +21,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+
 import { PositionLocator } from './PositionLocator';
 export { PositionContentLocator, PositionTargetLocator, customMethods } from './PositionLocator';
 export { PositionLocator };

package/es/Position/props.js

@@ -21,6 +21,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+
 import PropTypes from 'prop-types';
 import { element } from '@instructure/ui-prop-types';
 import { PositionPropTypes } from '../PositionPropTypes';

package/es/Position/styles.js

@@ -41,5 +41,4 @@ const generateStyle = (componentTheme, props) => {
     zIndex: componentTheme.zIndex
   };
 };
-
 export default generateStyle;

package/es/Position/theme.js

@@ -32,8 +32,8 @@ const generateComponentTheme = theme => {
   const componentVariables = {
     zIndex: stacking === null || stacking === void 0 ? void 0 : stacking.topmost
   };
-  return { ...componentVariables
+  return {
+    ...componentVariables
   };
 };
-
 export default generateComponentTheme;

package/es/PositionPropTypes.js

@@ -21,6 +21,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+
 import PropTypes from 'prop-types';
 import { element } from '@instructure/ui-prop-types';
 const placementPropValues = ['top', 'bottom', 'start', 'end', 'top start', 'top center', 'top end', 'top stretch', 'bottom start', 'bottom center', 'bottom end', 'bottom stretch', 'start top', 'start center', 'start bottom', 'start stretch', 'end top', 'end center', 'end bottom', 'end stretch', 'center start', 'center end', 'offscreen'];
@@ -29,17 +30,16 @@ const PositionPropTypes = {
    * The placement of the content in relation to the trigger
    */
   placement: PropTypes.oneOf(placementPropValues),
-
   /**
    * An element or a function returning an element to use as the mount node
    */
   mountNode: PropTypes.oneOfType([element, PropTypes.func]),
-
   /**
    * The parent in which to constrain a placement
    */
   constrain: PropTypes.oneOfType([element, PropTypes.func, PropTypes.oneOf(['window', 'scroll-parent', 'parent', 'none'])])
 };
+
 /**
  * The placement of the content in relation to the trigger
  */