async-render

async-render gives you a component to show spinners after a timeout until suspense is ready

Install

npm install @rogal/async-render --save

Getting Started

In this example the h1 element will be shown after 2s

import React from 'react'
import {
  AsyncRender
} from '@rogal/async-render';

const App = () => {
  return (
    <AsyncRender loading>
      <h1>hello</h1>
    </TranslateProvider>
  )
}

How to increase the timeout

The timeout by default is 2000, so you can increase giving the prop timeout

import React from 'react'
import {
  AsyncRender
} from '@rogal/async-render';

const App = () => {
  return (
    <AsyncRender loading timeout={4000}>
      <h1>hello</h1>
    </TranslateProvider>
  )
}

Props

| Name | Type | Default |
| :-----------------------: | :---------------: | :----------------: | | loading | Boolean | none | | children | React.Node | none | | timeout | number | 2000 |

How to contribute

You can install and have an enviroment ready for use with Storybook

  npm i
  npm start

License

MIT