react-tether
Version:
A positioning engine to make overlays, tooltips and dropdowns better
3 lines (2 loc) • 5.33 kB
JavaScript
var e=require("react"),t=require("react-dom"),n=require("tether");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=/*#__PURE__*/r(e),i=/*#__PURE__*/r(t),s=/*#__PURE__*/r(n);function a(){return a=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},a.apply(this,arguments)}function l(e,t){return l=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},l(e,t)}var c=["onUpdate","onRepositioned","renderElement","renderElementTag","renderElementTo","renderTarget","className","id","style"];module.exports=/*#__PURE__*/function(t){var n,r;function d(){for(var e,n=arguments.length,r=new Array(n),i=0;i<n;i++)r[i]=arguments[i];return(e=t.call.apply(t,[this].concat(r))||this)._targetNode=o.default.createRef(),e._elementNode=o.default.createRef(),e._elementParentNode=null,e._tetherInstance=null,e}r=t,(n=d).prototype=Object.create(r.prototype),n.prototype.constructor=n,l(n,r);var u,h,p=d.prototype;return p.componentDidMount=function(){this._createContainer(),this.forceUpdate()},p.componentDidUpdate=function(e){if(e.renderElementTag===this.props.renderElementTag&&e.renderElementTo===this.props.renderElementTo||this._createContainer(),this._elementParentNode&&e.className!==this.props.className){var t,n,r=(e.className||"").split(" ").filter(function(e){return e.length>0}),o=(this.props.className||"").split(" ").filter(function(e){return e.length>0});(t=this._elementParentNode.classList).remove.apply(t,r),(n=this._elementParentNode.classList).add.apply(n,o)}this._update()},p.componentWillUnmount=function(){this._destroy()},p.getTetherInstance=function(){return this._tetherInstance},p.disable=function(){var e;null==(e=this._tetherInstance)||e.disable()},p.enable=function(){var e;null==(e=this._tetherInstance)||e.enable()},p.on=function(e,t,n){this._tetherInstance.on(e,t,n)},p.once=function(e,t,n){this._tetherInstance.once(e,t,n)},p.off=function(e,t){this._tetherInstance.off(e,t)},p.position=function(){var e;null==(e=this._tetherInstance)||e.position()},p._runRenders=function(){var t="function"==typeof this.props.renderTarget?this.props.renderTarget(this._targetNode):null,n="function"==typeof this.props.renderElement?this.props.renderElement(this._elementNode):null;return e.isValidElement(t)||(t=null),e.isValidElement(n)||(n=null),{targetComponent:t,elementComponent:n}},p._createTetherInstance=function(e){this._tetherInstance&&this._destroy(),this._tetherInstance=new s.default(e),this._registerEventListeners()},p._destroyTetherInstance=function(){this._tetherInstance&&(this._tetherInstance.destroy(),this._tetherInstance=null)},p._registerEventListeners=function(){var e=this;this.on("update",function(){return e.props.onUpdate&&e.props.onUpdate.apply(e,[].slice.call(arguments))}),this.on("repositioned",function(){return e.props.onRepositioned&&e.props.onRepositioned.apply(e,[].slice.call(arguments))})},p._destroy=function(){this._destroyTetherInstance(),this._removeContainer()},p._createContainer=function(){this._removeContainer();var e=this.props,t=e.renderElementTag,n=e.className;this._elementParentNode=document.createElement(void 0===t?"div":t),this._elementParentNode.className=n||""},p._addContainerToDOM=function(){this._elementParentNode&&this._renderNode&&this._elementParentNode.parentNode!==this._renderNode&&this._renderNode.append(this._elementParentNode)},p._removeContainer=function(){this._elementParentNode&&this._elementParentNode.parentNode&&this._elementParentNode.remove()},p._update=function(){this._elementNode.current&&this._targetNode.current?this._updateTether():this._destroy()},p._updateTether=function(){var e,t=this.props,n=t.id,r=t.style,o=function(e,t){if(null==e)return{};var n,r,o={},i=Object.keys(e);for(r=0;r<i.length;r++)t.indexOf(n=i[r])>=0||(o[n]=e[n]);return o}(t,c),i=a({target:this._targetNode.current,element:this._elementParentNode},o),s=n||"";if(this._elementParentNode&&this._elementParentNode.id!==s&&(this._elementParentNode.id=s),this._elementParentNode&&r){var l=this._elementParentNode.style;for(var d in r)if(l[d]!==r[d]){var u=r[d];u&&(l[d]=u)}}this._addContainerToDOM(),this._tetherInstance?this._tetherInstance.setOptions(i):this._createTetherInstance(i),null==(e=this._tetherInstance)||e.position()},p.render=function(){var e=this._runRenders(),t=e.targetComponent,n=e.elementComponent;return t?o.default.createElement(o.default.Fragment,null,t,n&&this._elementParentNode&&i.default.createPortal(n,this._elementParentNode)):null},u=d,(h=[{key:"_renderNode",get:function(){var e=this.props.renderElementTo;return"string"==typeof e?document.querySelector(e):e||document.body}}])&&function(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,"symbol"==typeof(o=function(e,t){if("object"!=typeof e||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,"string");if("object"!=typeof r)return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(r.key))?o:String(o),r)}var o}(u.prototype,h),Object.defineProperty(u,"prototype",{writable:!1}),d}(e.Component);
//# sourceMappingURL=react-tether.cjs.map