Skip to content

Commit

Permalink
Updates docs and changelog for new release
Browse files Browse the repository at this point in the history
  • Loading branch information
mikaelbr committed Nov 11, 2015
1 parent 4d424dc commit 7cc1e9e
Show file tree
Hide file tree
Showing 2 changed files with 109 additions and 0 deletions.
33 changes: 33 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,39 @@ Changelog

Changelog with fixes and additions between each release.

## Version `v4.1.0`

### Additions

1. Adds ability to add local decorator to component through `component.withDecorator()`:
```js
// Some third party libraries requires you to decorate the
// React class, not the created component. You can do that
// by creating a decorated component factory
var someDecorator = compose(Radium, function (Component) {
var DecoratedComponent = doSomething(Component);
return DecoratedComponent;
});
var Component = component.classDecorator(someDecorator, function (props) {
// ... some implementation
});
React.render(<Component />, mountingPoint);
```

This can also be used as a partially applied function:

```js
var decoratedComponent = component.classDecorator(someDecorator);
var Component = decoratedComponent(function (props) {
// ... some implementation
});
```

### Bugfixes

1. Fixes Omniscient component factory input to handle being new-ed up from within React. Fixes some test issues and potential bugs with contexts. See [#123](https://github.com/omniscientjs/omniscient/issues/123) for more info.
2. Fixes as Omniscient component factory disguises as a React class. This worksaround the fact that many third party libraries uses custom ways to use classes. For instance hot reloading. See [#125](https://github.com/omniscientjs/omniscient/pull/125) for more information.

## Version `v4.0.0` - Breaking changes

`React 0.14.0` introduced some very nice features such as stateless components, and we saw that it hit very close the the usage as we've seen in Omniscient.js for the last year. With this change we made some simplifications to our components to be even more similar to vanilla React. Now you can use Omniscient.js as you would with vanilla React, just with added optimizations. Much like memoization for normal functions.
Expand Down
76 changes: 76 additions & 0 deletions api.md
Original file line number Diff line number Diff line change
Expand Up @@ -115,6 +115,82 @@ React.render(, mountingPoint);
**Returns** `Component`,
### `omniscient(classDecorator, [displayName], [mixins], [render])`
Create components for functional views, with an attached local class decorator.
Omniscient uses a `React.createClass()` internally to create an higher order
component to attach performance boost and add some syntactic sugar to your
components. Sometimes third party apps need to be added as decorator to this
internal class. For instance Redux or Radium.
This create factory behaves the same as normal Omniscient.js component
creation, but with the additional first parameter for class decorator.
The API of Omniscient is pretty simple, you create a Stateless React Component
but memoized with a smart implemented `shouldComponentUpdate`.
The provided `shouldComponentUpdate` handles immutable data and cursors by default.
It also falls back to a deep value check if passed props isn't immutable structures.
You can use an Omniscient component in the same way you'd use a React Stateless Function,
or you can use some of the additional features, such as string defined display name and
pass in life cycle methods. These are features normally not accessible for vanilla
Stateless React Components.
If you simply pass one cursor, the cursor will be accessible on the
`props.cursor` accessor.
#### Decorating class components
```jsx
// Some third party libraries requires you to decorate the
// React class, not the created component. You can do that
// by creating a decorated component factory
var someDecorator = compose(Radium, function (Component) {
var DecoratedComponent = doSomething(Component);
return DecoratedComponent;
});
var Component = component.classDecorator(someDecorator, function (props) {
// ... some implementation
});

React.render(, mountingPoint);
```
Also works by creating a component factory:
```jsx
var someDecorator = compose(Radium, function (Component) {
var DecoratedComponent = doSomething(Component);
return DecoratedComponent;
});
var newFactory = component.classDecorator(someDecorator);
var Component = newFactory(function (props) {
// ... some implementation
});

React.render(, mountingPoint);
```
### Parameters
| param | type | description |
| ---------------- | ------------ | ----------------------------------------------------------------------------------------------------- |
| `classDecorator` | Function | Decorator to use for internal class (e.g. Redux connect, Radium) |
| `[displayName]` | String | _optional:_ Component's display name. Used when debug()'ing and by React |
| `[mixins]` | Array,Object | _optional:_ React mixins. Object literals with functions, or array of object literals with functions. |
| `[render]` | Function | _optional:_ Stateless component to add memoization on. |
### Properties
| property | type | description |
| ----------------------- | -------- | --------------------------------- |
| `shouldComponentUpdate` | Function | Get default shouldComponentUpdate |
**Returns** `Component,Function`,
### `omniscient.debug(pattern)`
Activate debugging for components. Will log when a component renders,
Expand Down

0 comments on commit 7cc1e9e

Please sign in to comment.