mdc-react/src/circular-progress/constants.js

Material Components for the web implemented in React

export const strings = {
    XMLNS: 'http://www.w3.org/2000/svg',
};

export const sizeProps = {
    large: {
        viewBox: 48,
        radius: 18,
        strokeWidth: 4,
        gapPatchStrokeWidth: 3.2,
        strokeDasharray: 113.097,
        indeterminateStrokeDashoffset: 56.549
    },
    medium: {
        viewBox: 32,
        radius: 12.5,
        strokeWidth: 3,
        gapPatchStrokeWidth: 2.4,
        strokeDasharray: 78.54,
        indeterminateStrokeDashoffset: 39.27
    },
    small: {
        viewBox: 24,
        radius: 8.75,
        strokeWidth: 2.5,
        gapPatchStrokeWidth: 2,
        strokeDasharray: 54.978,
        indeterminateStrokeDashoffset: 27.489
    }
};

export const cssClasses = {
    ROOT: 'mdc-circular-progress',
    SMALL: 'mdc-circular-progress--small',
    MEDIUM: 'mdc-circular-progress--medium',
    LARGE: 'mdc-circular-progress--large',
    INDETERMINATE: 'mdc-circular-progress--indeterminate',
    CLOSED: 'mdc-circular-progress--closed',

    DETERMINATE_CONTAINER: 'mdc-circular-progress__determinate-container',
    DETERMINATE_CIRCLE_GRAPHIC: 'mdc-circular-progress__determinate-circle-graphic',
    DETERMINATE_TRACK: 'mdc-circular-progress__determinate-track',
    DETERMINATE_CIRCLE: 'mdc-circular-progress__determinate-circle',

    INDETERMINATE_CONTAINER: 'mdc-circular-progress__indeterminate-container',
    INDETERMINATE_CIRCLE_GRAPHIC: 'mdc-circular-progress__indeterminate-circle-graphic',

    SPINNER_LAYER: 'mdc-circular-progress__spinner-layer',
    COLOR: 'mdc-circular-progress__color',
    CIRCLE_CLIPPER: 'mdc-circular-progress__circle-clipper',
    CIRCLE_LEFT: 'mdc-circular-progress__circle-left',
    CIRCLE_RIGHT: 'mdc-circular-progress__circle-right',
    GAP_PATCH: 'mdc-circular-progress__gap-patch'
};

export const Size = {
    LARGE: 'large',
    MEDIUM: 'medium',
    SMALL: 'small'
};