@meve/ui/es/loading-bar/index.js

Argon design system components library

import LoadingBarComponent from './LoadingBar';
import { mountComponent } from '../utils/components';
var instance;

function ensureInstance() {
  if (!instance) {
    instance = mountComponent(LoadingBarComponent, 'body');
  }
}

function start() {
  ensureInstance();
  instance.instance.transition = undefined;
  instance.instance.error = false;
  instance.instance.value = 0;
  instance.instance.opacity = 1;
  requestAnimationFrame(function () {
    instance.instance.transition = 'width 4s linear, opacity 1s linear, background-color 2s';
    instance.instance.value = 80;
  });
}

function finish() {
  if (!instance) {
    return;
  }

  instance.instance.transition = 'width .3s linear, opacity 1s linear, background-color 2s';
  instance.instance.error = false;
  instance.instance.value = 100;
  instance.instance.opacity = 0;
}

function error() {
  ensureInstance();
  instance.instance.transition = undefined;
  instance.instance.value = 0;
  instance.instance.opacity = 1;
  instance.instance.error = true;
  requestAnimationFrame(function () {
    instance.instance.transition = 'width .3s linear, opacity 1s linear, background-color 2s';
    instance.instance.value = 100;
    instance.instance.opacity = 0;
  });
}

var LoadingBar = {
  start: start,
  finish: finish,
  error: error
};
export var _LoadingBarComponent = {};
export default LoadingBar;