breathing guide

React component for making your own breathing style

demo

cycle

inhale -> hold -> exhale -> hold

api

| name | type | default | description | |---|---|---|---| |inhaleTimer|number|0|period of inhale (millisecond)| |inhaleHoldTimer|number|0|period of holding breath after inhale (millisecond)| |exhaleTimer|number|0|period of exhale (millisecond)| |exhaleHoldTimer|number|0|period of holding breath after exhale (millisecond)|

usage

import React, { Component } from 'react';
import BreathingGuide from 'w-breathing-guide';

class App extends Component {
 render() {
   return (
     <div className="App">
       <BreathingGuide
         inhaleTimer={4000}
         inhaleHoldTimer={4000}
         exhaleTimer={4000}
         exhaleHoldTimer={4000}
       />
     </div>
   );
 }
}

export default App;