'use strict';

(function (ResponsiveSize) {
  ResponsiveSize[ResponsiveSize["XSmall"] = 0] = "XSmall";
  ResponsiveSize[ResponsiveSize["Small"] = 1] = "Small";
  ResponsiveSize[ResponsiveSize["Medium"] = 2] = "Medium";
  ResponsiveSize[ResponsiveSize["Large"] = 3] = "Large";
  ResponsiveSize[ResponsiveSize["XLarge"] = 4] = "XLarge";
})(exports.ResponsiveSize || (exports.ResponsiveSize = {}));
const SizeLimits = {
  [exports.ResponsiveSize.XSmall]: 600,
  [exports.ResponsiveSize.Small]: 768,
  [exports.ResponsiveSize.Medium]: 992,
  [exports.ResponsiveSize.Large]: 1200,
};
function getSizeOfWidth(width) {
  const limits = Object.keys(SizeLimits);
  for (let i = 0; i < limits.length; i++) {
    const k = limits[i];
    if (width < SizeLimits[k]) {
      return Number(k);
    }
  }
  return exports.ResponsiveSize.XLarge;
}
class ResponsiveUIHelper {
  constructor(el, onSizeChange) {
    this.el = el;
    // @ts-ignore
    if (ResizeObserver) {
      // @ts-ignore
      new ResizeObserver(() => {
        const size = getSizeOfWidth(this.el.clientWidth);
        if (this.size !== size) {
          this.size = size;
          onSizeChange(size);
        }
      }).observe(this.el);
    }
  }
}

exports.ResponsiveUIHelper = ResponsiveUIHelper;
