React-dayo NPM

React Dayo

A Queue component for notification etc.

Usage

/**
 * To prepare of using the `react-dayo`.
 * It requires `react@^16.8.0`, `@types/react`, `styled-components@^4.2.0` and `@types/styled-components`.
 * And you will need `react-dom` and `@types/react-dom` too
 *
 * ```bash
 * yarn add react-dayo react @types/react react-dom react @types/react-dom styled-components @types/styled-components
 * ```
 */
import {createDayo} from 'react-dayo';
/**
 * If you intent to use `log` which is one of the preset.
 * You also write the following like.
 */
import log from 'react-dayo/dist/main/mods/seed/presets/alerts/log';

The Directory structure is looked at here.

Example

First write the markup.

<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- omit -->
  </head>
  <body>
    <div id="app"><!-- For to mount your react app --></div>
    <div id="dayobox">
      <!-- For to mount <Dayo /> in here with `ReactDom.createPortal` -->
    </div>
  </body>
</html>

const [Dayo, dispatch] = createDayo();

ReactDom.render(
  (
    <div>
      {/* ...nest... */}

      <div>
        <button onClick={dispatch(log.message('Hello by Dayo'))}>button</button>
      </div>

      {ReactDom.createPortal(<Dayo />, document.getElementById('dayobox'))}

      {/* ...nest... */}
    </div>
  )
  document.getElementById('app')
)

Creat custom seed

todo

react-dayo v0.3.6-alpha.0

React Dayo

Usage

Example

Creat custom seed

Archive