react-pizza

The utility for creating (p)react component habitat.

Feature

• Support react and preact
• Set props and call method or get attribute which preact-habitat is not supported

Installation

npm install react-pizza
# or use yarn
yarn add react-pizza

Usage

import * as React from 'react'
import * as pizza from 'react-pizza'

class Timer extends React.Component {
  state = {
    count: this.props.count
  }

  increase() {
    this.setState({ count: this.state.count + 1 })
  }

  render() {
    return <p>{this.state.count}</p>
  }
}

// document.body
// <div id="root"></div>
const render = pizza(Timer)
const timer = render('#root', { count: 10 })
// <div id="root"><p>10</p></div>

timer.call('increase') // Call `increase` method
// <div id="root"><p>11</p></div>
timer.ref(0).current.state === timer.ref()[0].current.state) === timer.call('state', 0)
// { count: 11 }

// Set the props of all elements
timer.setProps({ count: 10 })
// Set the prop of #root element
timer.setProps({ count: 10 }, document.querySelect('#root'))
// Set the prop of first element
timer.setProps({ count: 10 }, 0)

// Unmount timer in all elements
timer.remove()

timer.remove(0)
timer.remove(document.querySelect('#root'))

// Mount origin
timer.origin === render.origin
timer.origin === Timer

Contributing

• Fork it!
• Create your new branch:
  git checkout -b feature-new or git checkout -b fix-which-bug
• Start your magic work now
• Make sure npm test passes
• Commit your changes:
  git commit -am 'feat: some description (close #123)' or git commit -am 'fix: some description (fix #123)'
• Push to the branch: git push
• Submit a pull request :)

Authors

This library is written and maintained by imcuttle, [email protected].

License

MIT - imcuttle 🐟