Skip to content

arlair/react-hyperscript-helpers

 
 

Repository files navigation

react-hyperscript-helpers

npm version Circle CI

A library inspired by hyperscript-helpers and react-hyperscript.

Allows for expressing UIs in the hyperscript-helpers style but with first class support for React.

The api has been greatly improved, making the library usable for actual projects.

Usage

DOM components are really easy to use. Just import and go.

import { div, h2 } from 'react-hyperscript-helpers';

export default () => div('.foo', [ h2('Hello, world') ]);

For custom components you can either create a factory function or use the h function, similar to react-hyperscript.

//MyComponent
import { div, hh } from 'react-hyperscript-helpers';

export default hh(() => div('Nifty Component'));

//Container
import MyComponent        from './MyComponent';
import SomeOtherComponent from 'who-whats-its';
import { div, h }         from  'react-hyperscript-helpers';

export default () => div('.foo', [
  MyComponent(),
  h(SomeOtherComponent, { foo: 'bar' })
]);

About

Terse syntax for hyperscript using react

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 78.2%
  • TypeScript 21.8%