@gitlab/ui/dist/directives/resize_observer/resize_observer.js

GitLab UI Components

import isFunction from 'lodash/isFunction';

let observer = null;
const ResizeObserverDirective = {
  bind(el, {
    value: resizeHandler
  }) {
    if (!isFunction(resizeHandler)) {
      throw TypeError('directive value must be a function');
    }

    if (!observer) {
      // the observer instance is shared for performance reasons
      // more information: https://github.com/WICG/ResizeObserver/issues/59
      observer = new ResizeObserver(entries => {
        entries.forEach(event => {
          event.target.glResizeHandler(event);
        });
      });
    }

    el.glResizeHandler = resizeHandler;
    observer.observe(el);
  },

  unbind(el) {
    if (el.glResizeHandler) {
      var _observer;

      delete el.glResizeHandler;
      (_observer = observer) === null || _observer === void 0 ? void 0 : _observer.unobserve(el);
    }
  }

};

export default ResizeObserverDirective;