0.7.0 • Published 9 days ago

@blaze-react/loader v0.7.0

Weekly downloads
60
License
ISC
Repository
-
Last release
9 days ago

Description

Spinner and ProgressBar component generally allow to show graphically the progress status of a task or process.

Usage

Default Bar

<ProgressBar progress={40} />

Custom progress bar with steps and icon

const ProgressDemo = () => {
  const [progress, setProgress] = useState(0);

  useEffect(() => {
    setTimeout(() => setProgress(100), 2000);
  }, []);

  const handleChange = ({ value: rangeValue }) =>
    setProgress(Number(rangeValue));

  const steps = [
    {
      start: 0,
      final: 99,
      backgroundColor: ProgressBar.backgroundColor.orange,
      icon: "priority_high"
    },
    {
      start: 99,
      final: 100,
      backgroundColor: ProgressBar.backgroundColor.green,
      icon: "done"
    }
  ];

  return (
    <ProgressBar
      steps={steps}
      progress={progress}
      message={{
        incomplete: "Loading...",
        status: `${progress}%`,
        position: ProgressBar.position.left
      }}
    />
  );
};

<ProgressDemo />;

Default Spinner

<Spinner size={Spinner.size.small} />

Custom spinner with content locked

<Spinner animation={Spinner.animationType.ease} lockContent />

API

Coming soon...

0.8.0-alpha.33

10 days ago

0.8.0-alpha.35

9 days ago

0.8.0-alpha.31

10 days ago

0.8.0-alpha.26

2 months ago

0.8.0-alpha.24

2 months ago

0.8.0-alpha.23

2 months ago

0.8.0-alpha.21

2 months ago

0.8.0-alpha.14

2 months ago

0.8.0-alpha.16

2 months ago

0.8.0-alpha.11

2 months ago

0.8.0-alpha.10

2 months ago

0.8.0-alpha.13

2 months ago

0.8.0-alpha.19

2 months ago

0.8.0-alpha.18

2 months ago

0.8.0-alpha.20

2 months ago

0.8.0-alpha.9

2 months ago

0.8.0-alpha.7

2 months ago

0.8.0-alpha.6

2 months ago

0.6.2-alpha.0

3 months ago

0.8.0-alpha.4

3 months ago

0.8.0-alpha.3

3 months ago

0.7.0

6 months ago

0.6.4

8 months ago

0.6.2

9 months ago

0.6.0

9 months ago

0.5.30

10 months ago

0.5.28

10 months ago

0.5.26

12 months ago

0.5.23

1 year ago

0.5.19

1 year ago

0.5.17

1 year ago

0.5.15

1 year ago

0.5.13

1 year ago

0.5.12

1 year ago

0.5.9

1 year ago

0.5.8

1 year ago

0.5.0

1 year ago

0.4.57

1 year ago

0.4.55

1 year ago

0.4.54

1 year ago

0.4.52

1 year ago

0.4.48

1 year ago

0.4.47

1 year ago

0.4.46

2 years ago

0.4.42

2 years ago

0.4.38

2 years ago

0.4.37-alpha.0

2 years ago

0.4.37

2 years ago

0.4.36

2 years ago

0.4.33

2 years ago

0.4.34

2 years ago

0.4.29

2 years ago

0.4.22

2 years ago

0.4.16

2 years ago

0.4.15

2 years ago

0.4.14

2 years ago

0.4.8

2 years ago

0.4.7

2 years ago

0.4.3

2 years ago

0.4.0

2 years ago

0.3.66

2 years ago

0.3.58

2 years ago

0.3.53

2 years ago

0.3.52

2 years ago

0.3.51

2 years ago

0.3.50

2 years ago

0.3.49

2 years ago

0.3.47

2 years ago

0.3.46

2 years ago

0.3.45

2 years ago

0.3.44

2 years ago

0.3.43

2 years ago

0.3.42

2 years ago

0.3.41

2 years ago

0.3.39

2 years ago

0.3.38

2 years ago

0.3.31

2 years ago

0.3.30

2 years ago

0.3.29

2 years ago

0.3.28

2 years ago

0.3.12

2 years ago