import _JSXStyle from "../styled-jsx.es.js";
import React from 'react';
var LinearProgress = function LinearProgress(_ref) {
  var _ref$isActive = _ref.isActive,
    isActive = _ref$isActive === void 0 ? false : _ref$isActive,
    progress = _ref.progress,
    _ref$color = _ref.color,
    color = _ref$color === void 0 ? '#1976d2' : _ref$color,
    _ref$speed = _ref.speed,
    speed = _ref$speed === void 0 ? 1.5 : _ref$speed,
    _ref$sticky = _ref.sticky,
    sticky = _ref$sticky === void 0 ? false : _ref$sticky;
  if (!isActive) return null;
  var isDeterminate = typeof progress === 'number' && progress >= 0 && progress <= 100;
  return /*#__PURE__*/React.createElement("div", {
    className: "jsx-3545010945 " + _JSXStyle.dynamic([["1414032995", [sticky && 'position: fixed;top: 0;left: 0;', color]]]) + " " + "loader-wrapper"
  }, isDeterminate ? /*#__PURE__*/React.createElement("div", {
    style: {
      width: "".concat(progress, "%"),
      backgroundColor: color
    },
    className: "jsx-3545010945 " + _JSXStyle.dynamic([["1414032995", [sticky && 'position: fixed;top: 0;left: 0;', color]]]) + " " + "determinate-bar"
  }) : /*#__PURE__*/React.createElement("div", {
    style: {
      animation: "linearSlide ".concat(speed, "s linear infinite")
    },
    className: "jsx-3545010945 " + _JSXStyle.dynamic([["1414032995", [sticky && 'position: fixed;top: 0;left: 0;', color]]]) + " " + "indeterminate-loader"
  }), /*#__PURE__*/React.createElement(_JSXStyle, {
    id: "1414032995",
    dynamic: [sticky && 'position: fixed;top: 0;left: 0;', color]
  }, ".loader-wrapper.__jsx-style-dynamic-selector{".concat(sticky && 'position: fixed;top: 0;left: 0;', " width:100%;height:4px;background:rgba(0,0,0,0.05);z-index:2000;overflow:hidden;}.determinate-bar.__jsx-style-dynamic-selector{height:100%;-webkit-transition:width 0.3s ease;transition:width 0.3s ease;}.indeterminate-loader.__jsx-style-dynamic-selector{width:100%;height:100%;background:linear-gradient( to right, transparent 0%, ").concat(color, " 50%, transparent 100% );background-size:200% 100%;}")), /*#__PURE__*/React.createElement(_JSXStyle, {
    id: "3545010945"
  }, "@-webkit-keyframes linearSlide{from{background-position:-100% 0;}to{background-position:100% 0;}}@keyframes linearSlide{from{background-position:-100% 0;}to{background-position:100% 0;}}"));
};
export default LinearProgress;