JSPM

dw-neit-rc-progress

4.0.0
    • ESM via JSPM
    • ES Module Entrypoint
    • Export Map
    • Keywords
    • License
    • Repository URL
    • TypeScript Types
    • README
    • Created
    • Published
    • Downloads 2
    • Score
      100M100P100Q37836F
    • License MIT

    progress ui component for react

    Package Exports

    • dw-neit-rc-progress
    • dw-neit-rc-progress/es/index.js
    • dw-neit-rc-progress/lib/index.js

    This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (dw-neit-rc-progress) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

    Readme

    dw-neit-rc-progress

    Progress Bar.

    NPM version dumi build status Test coverage npm download bundle size

    Example

    https://progress.react-component.vercel.app/

    Screenshots

    Browsers

    • support IE9+, Chrome, Firefox, Safari

    Install

    dw-neit-rc-progress

    Usage

    import { Line, Circle } from 'dw-neit-rc-progress';
    
    export default () => (
      <>
         <Line percent={10} strokeWidth={4} strokeColor="#D3D3D3" />
         <Circle percent={10} strokeWidth={4} strokeColor="#D3D3D3" /> 
      </>
    );

    Compatibility

    IE / Edge
    IE / Edge
    Firefox
    Firefox
    Chrome
    Chrome
    Safari
    Safari
    Electron
    Electron
    IE11, Edge last 2 versions last 2 versions last 2 versions last 2 versions

    API

    props

    name type default description
    strokeWidth Number 1 Width of the stroke. Unit is percentage of SVG canvas size.
    strokeColor String #2db7f5 Stroke color.
    trailWidth Number 1 Width of the trail stroke. Unit is percentage of SVG canvas size. Trail is always centered relative to actual progress path. If trailWidth is not defined, it is the same as strokeWidth.
    trailColor String #D9D9D9 Color for lighter trail stroke underneath the actual progress path.
    strokeLinecap String 'round' The shape to be used at the end of the progress bar: can be `butt`, `square` or `round`.
    prefixCls String dw-neit-rc-progress prefix className for component
    className String customized className
    style Object style object will be added to svg element
    percent Number | Number[] 0 the percent of the progress
    gapDegree Number 0 the gap degree of half circle, 0 - 360
    gapPosition String top the gap position: can be `top`, `bottom`, `left`, or `right`.

    Installation

    npm install --save dw-neit-rc-progress

    Development

    npm install
    npm start

    License

    dw-neit-rc-progress is released under the MIT license.