@fastkit/visibility/dist/visibility.mjs

A library to watch the visible state of the browser window.

import { IN_WINDOW } from '@fastkit/helpers';

var _hidden = "hidden";
var _visibilityChange = "visibilitychange";
if (IN_WINDOW) {
  if (document.hidden !== void 0) {
    _hidden = "hidden";
    _visibilityChange = "visibilitychange";
  } else if (document.mozHidden !== void 0) {
    _hidden = "mozHidden";
    _visibilityChange = "mozvisibilitychange";
  } else if (document.msHidden !== void 0) {
    _hidden = "msHidden";
    _visibilityChange = "msvisibilitychange";
  } else if (document.webkitHidden !== void 0) {
    _hidden = "webkitHidden";
    _visibilityChange = "webkitvisibilitychange";
  }
}
var HIDDEN = _hidden;
var VISIBILITY_CHANGE = _visibilityChange;

// src/visibility.ts
var states = ["visible", "hidden"];
function getVisibilityState() {
  if (!IN_WINDOW) return "hidden";
  return document[HIDDEN] ? "hidden" : "visible";
}
var VisibilityManager = class {
  _state = getVisibilityState();
  _stateListeners = [];
  _typedCallbacks = {
    visible: [],
    hidden: []
  };
  get state() {
    return this._state;
  }
  get isVisible() {
    return this._state === "visible";
  }
  get isHidden() {
    return this._state === "hidden";
  }
  constructor() {
    if (IN_WINDOW) {
      document.addEventListener(
        VISIBILITY_CHANGE,
        (e) => {
          this._setState(getVisibilityState(), e);
        },
        false
      );
    }
  }
  _setState(state, event) {
    if (this._state !== state) {
      this._state = state;
      this._triggerStateListeners(state, event);
      this._triggerTypedCallback(state, event);
    }
  }
  _triggerStateListeners(state, event) {
    const listeners = this._stateListeners.slice();
    listeners.forEach((listener) => {
      listener(state, event);
    });
  }
  _triggerTypedCallback(state, event) {
    const callbacks = this._typedCallbacks[state].slice();
    callbacks.forEach((callback) => {
      callback(event);
    });
  }
  change(listener) {
    this._stateListeners.push(listener);
    const remover = () => {
      this.remove(listener, "change");
    };
    return remover;
  }
  visible(callback) {
    this._typedCallbacks.visible.push(callback);
    const remover = () => {
      this.remove(callback, "visible");
    };
    return remover;
  }
  hidden(callback) {
    this._typedCallbacks.hidden.push(callback);
    const remover = () => {
      this.remove(callback, "hidden");
    };
    return remover;
  }
  remove(listenerOrCallback, targetState) {
    if (!targetState || targetState === "change") {
      const index = this._stateListeners.indexOf(
        listenerOrCallback
      );
      if (index !== -1) {
        this._stateListeners.splice(index, 1);
        return;
      }
    }
    for (const state of states) {
      if (targetState && state !== targetState) continue;
      const targets = this._typedCallbacks[state];
      const index = targets.indexOf(
        listenerOrCallback
      );
      if (index !== -1) {
        targets.splice(index, 1);
        return;
      }
    }
  }
};

// src/index.ts
var visibilityManager = new VisibilityManager();

export { VisibilityManager, visibilityManager };
//# sourceMappingURL=visibility.mjs.map
//# sourceMappingURL=visibility.mjs.map