Spaces:
Sleeping
Sleeping
pythonic-rag-FastAPIReact
/
frontend
/node_modules
/@mui
/material
/CircularProgress
/CircularProgress.js
| 'use client'; | |
| import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose"; | |
| import _extends from "@babel/runtime/helpers/esm/extends"; | |
| const _excluded = ["className", "color", "disableShrink", "size", "style", "thickness", "value", "variant"]; | |
| let _ = t => t, | |
| _t, | |
| _t2, | |
| _t3, | |
| _t4; | |
| import * as React from 'react'; | |
| import PropTypes from 'prop-types'; | |
| import clsx from 'clsx'; | |
| import chainPropTypes from '@mui/utils/chainPropTypes'; | |
| import composeClasses from '@mui/utils/composeClasses'; | |
| import { keyframes, css } from '@mui/system'; | |
| import capitalize from '../utils/capitalize'; | |
| import { useDefaultProps } from '../DefaultPropsProvider'; | |
| import styled from '../styles/styled'; | |
| import { getCircularProgressUtilityClass } from './circularProgressClasses'; | |
| import { jsx as _jsx } from "react/jsx-runtime"; | |
| const SIZE = 44; | |
| const circularRotateKeyframe = keyframes(_t || (_t = _` | |
| 0% { | |
| transform: rotate(0deg); | |
| } | |
| 100% { | |
| transform: rotate(360deg); | |
| } | |
| `)); | |
| const circularDashKeyframe = keyframes(_t2 || (_t2 = _` | |
| 0% { | |
| stroke-dasharray: 1px, 200px; | |
| stroke-dashoffset: 0; | |
| } | |
| 50% { | |
| stroke-dasharray: 100px, 200px; | |
| stroke-dashoffset: -15px; | |
| } | |
| 100% { | |
| stroke-dasharray: 100px, 200px; | |
| stroke-dashoffset: -125px; | |
| } | |
| `)); | |
| const useUtilityClasses = ownerState => { | |
| const { | |
| classes, | |
| variant, | |
| color, | |
| disableShrink | |
| } = ownerState; | |
| const slots = { | |
| root: ['root', variant, `color${capitalize(color)}`], | |
| svg: ['svg'], | |
| circle: ['circle', `circle${capitalize(variant)}`, disableShrink && 'circleDisableShrink'] | |
| }; | |
| return composeClasses(slots, getCircularProgressUtilityClass, classes); | |
| }; | |
| const CircularProgressRoot = styled('span', { | |
| name: 'MuiCircularProgress', | |
| slot: 'Root', | |
| overridesResolver: (props, styles) => { | |
| const { | |
| ownerState | |
| } = props; | |
| return [styles.root, styles[ownerState.variant], styles[`color${capitalize(ownerState.color)}`]]; | |
| } | |
| })(({ | |
| ownerState, | |
| theme | |
| }) => _extends({ | |
| display: 'inline-block' | |
| }, ownerState.variant === 'determinate' && { | |
| transition: theme.transitions.create('transform') | |
| }, ownerState.color !== 'inherit' && { | |
| color: (theme.vars || theme).palette[ownerState.color].main | |
| }), ({ | |
| ownerState | |
| }) => ownerState.variant === 'indeterminate' && css(_t3 || (_t3 = _` | |
| animation: ${0} 1.4s linear infinite; | |
| `), circularRotateKeyframe)); | |
| const CircularProgressSVG = styled('svg', { | |
| name: 'MuiCircularProgress', | |
| slot: 'Svg', | |
| overridesResolver: (props, styles) => styles.svg | |
| })({ | |
| display: 'block' // Keeps the progress centered | |
| }); | |
| const CircularProgressCircle = styled('circle', { | |
| name: 'MuiCircularProgress', | |
| slot: 'Circle', | |
| overridesResolver: (props, styles) => { | |
| const { | |
| ownerState | |
| } = props; | |
| return [styles.circle, styles[`circle${capitalize(ownerState.variant)}`], ownerState.disableShrink && styles.circleDisableShrink]; | |
| } | |
| })(({ | |
| ownerState, | |
| theme | |
| }) => _extends({ | |
| stroke: 'currentColor' | |
| }, ownerState.variant === 'determinate' && { | |
| transition: theme.transitions.create('stroke-dashoffset') | |
| }, ownerState.variant === 'indeterminate' && { | |
| // Some default value that looks fine waiting for the animation to kicks in. | |
| strokeDasharray: '80px, 200px', | |
| strokeDashoffset: 0 // Add the unit to fix a Edge 16 and below bug. | |
| }), ({ | |
| ownerState | |
| }) => ownerState.variant === 'indeterminate' && !ownerState.disableShrink && css(_t4 || (_t4 = _` | |
| animation: ${0} 1.4s ease-in-out infinite; | |
| `), circularDashKeyframe)); | |
| /** | |
| * ## ARIA | |
| * | |
| * If the progress bar is describing the loading progress of a particular region of a page, | |
| * you should use `aria-describedby` to point to the progress bar, and set the `aria-busy` | |
| * attribute to `true` on that region until it has finished loading. | |
| */ | |
| const CircularProgress = /*#__PURE__*/React.forwardRef(function CircularProgress(inProps, ref) { | |
| const props = useDefaultProps({ | |
| props: inProps, | |
| name: 'MuiCircularProgress' | |
| }); | |
| const { | |
| className, | |
| color = 'primary', | |
| disableShrink = false, | |
| size = 40, | |
| style, | |
| thickness = 3.6, | |
| value = 0, | |
| variant = 'indeterminate' | |
| } = props, | |
| other = _objectWithoutPropertiesLoose(props, _excluded); | |
| const ownerState = _extends({}, props, { | |
| color, | |
| disableShrink, | |
| size, | |
| thickness, | |
| value, | |
| variant | |
| }); | |
| const classes = useUtilityClasses(ownerState); | |
| const circleStyle = {}; | |
| const rootStyle = {}; | |
| const rootProps = {}; | |
| if (variant === 'determinate') { | |
| const circumference = 2 * Math.PI * ((SIZE - thickness) / 2); | |
| circleStyle.strokeDasharray = circumference.toFixed(3); | |
| rootProps['aria-valuenow'] = Math.round(value); | |
| circleStyle.strokeDashoffset = `${((100 - value) / 100 * circumference).toFixed(3)}px`; | |
| rootStyle.transform = 'rotate(-90deg)'; | |
| } | |
| return /*#__PURE__*/_jsx(CircularProgressRoot, _extends({ | |
| className: clsx(classes.root, className), | |
| style: _extends({ | |
| width: size, | |
| height: size | |
| }, rootStyle, style), | |
| ownerState: ownerState, | |
| ref: ref, | |
| role: "progressbar" | |
| }, rootProps, other, { | |
| children: /*#__PURE__*/_jsx(CircularProgressSVG, { | |
| className: classes.svg, | |
| ownerState: ownerState, | |
| viewBox: `${SIZE / 2} ${SIZE / 2} ${SIZE} ${SIZE}`, | |
| children: /*#__PURE__*/_jsx(CircularProgressCircle, { | |
| className: classes.circle, | |
| style: circleStyle, | |
| ownerState: ownerState, | |
| cx: SIZE, | |
| cy: SIZE, | |
| r: (SIZE - thickness) / 2, | |
| fill: "none", | |
| strokeWidth: thickness | |
| }) | |
| }) | |
| })); | |
| }); | |
| process.env.NODE_ENV !== "production" ? CircularProgress.propTypes /* remove-proptypes */ = { | |
| // βββββββββββββββββββββββββββββββ Warning βββββββββββββββββββββββββββββββ | |
| // β These PropTypes are generated from the TypeScript type definitions. β | |
| // β To update them, edit the d.ts file and run `pnpm proptypes`. β | |
| // βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ | |
| /** | |
| * Override or extend the styles applied to the component. | |
| */ | |
| classes: PropTypes.object, | |
| /** | |
| * @ignore | |
| */ | |
| className: PropTypes.string, | |
| /** | |
| * The color of the component. | |
| * It supports both default and custom theme colors, which can be added as shown in the | |
| * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors). | |
| * @default 'primary' | |
| */ | |
| color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['inherit', 'primary', 'secondary', 'error', 'info', 'success', 'warning']), PropTypes.string]), | |
| /** | |
| * If `true`, the shrink animation is disabled. | |
| * This only works if variant is `indeterminate`. | |
| * @default false | |
| */ | |
| disableShrink: chainPropTypes(PropTypes.bool, props => { | |
| if (props.disableShrink && props.variant && props.variant !== 'indeterminate') { | |
| return new Error('MUI: You have provided the `disableShrink` prop ' + 'with a variant other than `indeterminate`. This will have no effect.'); | |
| } | |
| return null; | |
| }), | |
| /** | |
| * The size of the component. | |
| * If using a number, the pixel unit is assumed. | |
| * If using a string, you need to provide the CSS unit, for example '3rem'. | |
| * @default 40 | |
| */ | |
| size: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), | |
| /** | |
| * @ignore | |
| */ | |
| style: PropTypes.object, | |
| /** | |
| * The system prop that allows defining system overrides as well as additional CSS styles. | |
| */ | |
| sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]), | |
| /** | |
| * The thickness of the circle. | |
| * @default 3.6 | |
| */ | |
| thickness: PropTypes.number, | |
| /** | |
| * The value of the progress indicator for the determinate variant. | |
| * Value between 0 and 100. | |
| * @default 0 | |
| */ | |
| value: PropTypes.number, | |
| /** | |
| * The variant to use. | |
| * Use indeterminate when there is no progress value. | |
| * @default 'indeterminate' | |
| */ | |
| variant: PropTypes.oneOf(['determinate', 'indeterminate']) | |
| } : void 0; | |
| export default CircularProgress; |