@parkassist/pa-ui-library/dist/components/Progress/index.js

INX Platform elements

var __rest = this && this.__rest || function (s, e) {
  var t = {};
  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  }
  return t;
};
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import React from 'react';
import { Palette } from '../../index';
import CircularProgress from '@mui/material/CircularProgress';
import Box from '@mui/material/Box';
import LinearProgress from '@mui/material/LinearProgress';
const Progress = _a => {
  var {
      value = 0,
      linear = false,
      variant = 'indeterminate',
      showLabel = false,
      color = Palette.BLACK,
      height,
      transparent = false
    } = _a,
    props = __rest(_a, ["value", "linear", "variant", "showLabel", "color", "height", "transparent"]);
  const determinateWithLabel = Boolean(showLabel && variant === 'determinate');
  const transparentStyles = {
    '&.MuiLinearProgress-root, &.MuiLinearProgress-root::before': {
      backgroundColor: 'transparent'
    },
    '& .MuiLinearProgress-bar1Indeterminate, & .MuiLinearProgress-bar2Indeterminate': {
      backgroundColor: color,
      opacity: 1
    }
  };
  return _jsxs(_Fragment, {
    children: [!linear && _jsxs(Box, {
      sx: {
        position: 'relative',
        display: 'inline-flex',
        color
      },
      children: [_jsx(CircularProgress, Object.assign({
        color: "inherit",
        variant: variant
      }, props, {
        value: value
      })), _jsx(Box, {
        sx: {
          top: 0,
          left: 0,
          bottom: 0,
          right: 0,
          position: 'absolute',
          display: 'flex',
          alignItems: 'center',
          justifyContent: 'center'
        },
        children: variant === 'determinate' && _jsx(Box, {
          color: Palette.DARK_GREY,
          children: `${Math.round(value)}%`
        })
      })]
    }), linear && _jsx(Box, {
      sx: {
        width: props.width ? props.width : '100%'
      },
      children: _jsxs(Box, {
        sx: {
          display: 'flex',
          alignItems: 'center'
        },
        children: [_jsx(Box, {
          sx: {
            width: '100%',
            mr: determinateWithLabel ? 1 : 0,
            color
          },
          children: _jsx(LinearProgress, Object.assign({
            color: "inherit",
            variant: variant,
            value: value,
            sx: Object.assign(Object.assign({}, height && {
              height: `${height}px`
            }), transparent && transparentStyles)
          }, props))
        }), determinateWithLabel && _jsx(Box, {
          sx: {
            minWidth: 35
          },
          color: Palette.DARK_GREY,
          children: `${Math.round(value)}%`
        })]
      })
    })]
  });
};
export default Progress;