v4.2.0

Thanks to @dpoindexter for helping out with this release.

Minor changes

1. Adds compatability with React v16 (#136, thanks to @dpoindexter)
2. Changes to use createClass package instead of React.createClass in lue with React 15.5 (#134)
3. Adds ability to override default behavior of isEqalImmutable (see #133)
4. Make component instantiation more general in order to support React 16 (see #137)

Internal Changes

1. Changes build system to Webpack
2. Changes from lodash.assign to object-assign as this is what react-create-class uses. (deduping)
3. Removes lodash.pickBy, using own implementation instead. Reducing size.
4. Setup vscode settings with recommended prettier plugin.
5. Adds prettier precommit step.
6. Changes from mocha to Jest
7. Adds codecov integration.
8. Bumps internal dependencies

v4.1.1

Fixes issue with create factory not mimicking correctly React classes after React 0.14. See #126 for more information.

v4.1.0

Additions

1. Adds ability to add local decorator to component through component.withDecorator():

// 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:

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 for more info.
2. Fixes as Omniscient component factory disguises as a React class. This works around the fact that many third party libraries uses custom ways to use classes. For instance hot reloading. See #125 for more information.

v4.0.0

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.

There are still some features only available through Omniscient.js components, though. Such as syntactic sugar for component keys, string-defined display names, easier access to immutable data or cursors (wrapping/unwrapping as single argument), and the ability to add life cycle methods if that's something you need.

Deletions

1. There is no longer a magic statics property. Instead this is made explicit through a overridable option on the provided shouldComponentUpdate called isIgnorable. This function can be used to signal what property on the props that should be ignored. Nothing is ignored by default. You don't have to use isIgnorable manually, but you can use the ignore component provided as syntactic sugar in a helper library called omnipotent. See an example of this in the migration steps below.
2. As there is no longer a default statics property, statics are no longer passed as second props argument to the function. This means you only get props as a single parameter to your stateless components (Cursors/Immutable structures are still wrapped/unwrapped). See examples in migration steps below.
3. Now only supports React 0.14.0.
4. No more .JSX extension. This was a workaround to get interoperability with JSX and non-JSX code. With React 0.14, this is no longer needed!
5. No more need for own React Native package, as React and ReactDOM is separate packages as of React 0.14. This change removes ability and need of doing require('omniscient/native').

Additions

1. Adds support for React Class level decorators. See relevant discussion and prompted need in issue #117.
   Example usage with decorator:
   js var decoratedComponent = component.withDefaults({ classDecorator: compose(Radium, function (Component) { var DecoratedComponent = doSomething(Component); return DecoratedComponent; }) }); * var Component = decoratedComponent(function (props) { // ... some implementation });

Internal Changes

1. Now only builds on node 4.0.0 due to the latest jsdom.

Migration Steps

There are three things you need to change to get it working in the latest version. If you haven't used statics, there is nothing to change. The example before and after code below contains all the information you need to migrate.

Before

var MyComponent = component(function (props, statics) {
  var onClick = statics.clickHandler;
  return DOM.button({ onClick }, 'Click me!');
});

var App = component(function (props) {
  return MyComponent({
    text: 'Click me!'
  }, {
    // statics
    clickHandler: function () {
      console.log('Clicked the button!');
    }
  })
});

After

var shouldUpdate = require('omniscient/shouldupdate').withDefaults({
  isIgnorable: function (value, key) {
    // ignore properties with key `statics`
    return key === 'statics';
  }
});

var StaticsIgnoredComponent = component({
  shouldComponentUpdate: shouldUpdate
}, function (props) {
  var onClick = props.statics.clickHandler;
  return DOM.button({ onClick }, 'Click me!');
});

var App = component(function (props) {
  return StaticsIgnoredComponent({
    text: 'Click me!'
    statics: {
      clickHandler: function () {
        console.log('Clicked the button!');
      }
    }
  })
});

Or using the omnipotent helper:

var ignore = require('omnipotent/decorator/ignore');

var MyComponent = component(function (props) {
  var onClick = props.statics.clickHandler;
  return DOM.button({ onClick }, 'Click me!');
});

// Create a new component that has statics ignored
var StaticsIgnoredComponent = ignore('statics', MyComponent);

var App = component(function (props) {
  return StaticsIgnoredComponent({
    text: 'Click me!'
    statics: {
      clickHandler: function () {
        console.log('Clicked the button!');
      }
    }
  })
});

Migration Steps JSX removal

.jsx has been removed, but the migration is real simple. Remove all instances of .jsx and component.withDefaults({ jsx: true }) from your codebase.

Before

var MyComponent = component((props) => (
  <h1>Hello {props.text}</h1>
)).jsx; // note the `.jsx`

var App = component(() => (
  <div>
    <MyComponent text="Hello!" />
  </div>
)).jsx;

After

var MyComponent = component((props) => (
  <h1>Hello {props.text}</h1>
));

var App = component(() => (
  <div>
    <MyComponent text="Hello!" />
  </div>
));

As an added bonus you now have complete interoperability between jsx and non-jsx:

var MyComponent = component((props) => (
  <h1>Hello {props.text}</h1>
));

var App = component(() => (
  React.DOM.div({},
    MyComponent({ text: 'Hello!' })
  )
));

v3.3.0

Additions

Adds support for React-Native, by doing

var component = require('omniscient/native');

Requires react-native installed.

v3.2.0

Minor release adding some features. Most notably the transition for new API for ignorable fields. Currently all properties under the statics property name is ignored, but this is a poor and weak API. We'll transition to a more explicit API through decorator helpers. This release is obviously non-breaking, so the statics property behaviour isn't removed yet, but will be with the next major release.

Additions

1. Allow for nested mixins for shouldComponentUpdate. See #99
2. Changes isStatics to be isIgnorable and overridable. See a28d59

v3.1.0

Additions

1. Now allows for automatic "unwrapping" of single cursors (and define what field to unwrap) #60. Example:

var localComponent = component.withDefaults({
  cursorField: 'foobar'
});

var Component = localComponent(function(myPassedCursor) {
  // Now you have myPassedCursor instead of having to do props.foobar
});

React.render(<Component foobar={myCursor} />, document.body)

1. Added "hot swapping" of functions passed in statics. This is to swap out event handlers passed with a cursor reference. See #68
2. As Omniscient encourages more work in the render function, you might have to do additional work even though some of your data is unchanged. We added omniscient.cached to allow for cached functions, dependent on input. Example:

var called = 0;
var point = function (point) {
  return point.get('x') + ':' + point.get('y');
};
var line = component.cached(function (from, to) {
  called = called + 1;
  return point(from) + '-' + point(to)
});


var a = Cursor.from(Immutable.fromJS({x:0, y:0}));
var b = Cursor.from(Immutable.fromJS({x: 1, y:7}));

line(a, b).should.equal("0:0-1:7");
called.should.equal(1);

line(a, b).should.equal("0:0-1:7");
called.should.equal(1);

Bugfixes

1. Fixes a bug where children were being attached as statics (#66)
2. Fixes bug when overriding isEqualCursor (419046b)
3. Fixes accessible cursor across mixins when unwrapping cursors. (#86)

Internal changes

1. Now uses lodash.assign internally, for potential de-duping. #61
2. Makes sure the props object is not mutated (#62)
3. Uses isNode from React to test for valid elements (#63)
4. Improves performance and simplifies internals of shouldComponentUpdate mixin (#78, #79)

v3.0.1

Obligatory mess-up patch. Updates dist files to latest version of Omniscient.

v3.0.0

Note: This release is missing dist-files. Use v3.0.1 for updated dist-files. Release should work just fine through Browserify/Webpack.

Addition

• shouldComponentUpdate is now accessible on its own. This means that you
  can include the mixin into your code base without including unused code from
  the Omniscient core. #33

var shouldupdate = require('omniscient/shouldupdate');

var mixins = [{ shouldComponentUpdate: shouldupdate }];
var MyComponent = React.createClass({
  mixins: mixins,

  render: function () { /* ...* / }
});

• Following 2. from Changes (changes to use lodash.isEqual), cursors can now be anywhere in the props three. See #39

React.render(MyComponent({ some: { path: { to: cursor }}}), document.body);

• You can now have immutable structures as a part of your props/state #55

React.render(MyComponent({ obj: Immutable.List.of(1, 2, 3) }), document.body);

• You can now pass on cursors directly to non-JSX components #43

var MyComponent = component(function (cursor) {
  // do something with cursor
});

React.render(MyComponent(myCursor), document.body);

• You can now pass on immutable structure as single argument (as with cursor) #58

React.render(MyComponent(Immutable.List.of(1, 2, 3)), document.body);

• You can now define component name through named render function 22bdf88

var Component = component(function DisplayName() {
  return <div>Hello!</div>;
});

in addition to previous syntax:

var Component = component('DisplayName', function () {
  return <div>Hello!</div>;
});

• You can now set to always use JSX component (see Breaking Changes) 53e5318

var component = require('omniscient');

var localComponent = component.withDefaults({
  jsx: true
});

var Component = localComponent(function MyJsxComponent() {
  /* ... */
});

// Component is JSX component. No need for Component.jsx
React.render(<Component />, document.body);

• You can now pass on statics as argument to non-JSX a523e59

var MyComponent = component(function (cursor, statics) {
  // do something with statics
});

React.render(MyComponent(myCursor, myStatic), document.body);

Breaking Changes

• Can't longer override helper functions directly. Now you can create local component factories
  which doesn't alter global state. #36

Overview of all overridables:

var component = require('omniscient');

var localComponent = component.withDefaults({
  // Goes directly to component
  shouldComponentUpdate: function(nextProps, nextState), // check update
  jsx: false, // whether or not to default to jsx components

  // Is passed on to `shouldComponentUpdate`
  isCursor: function(cursor), // check if is props
  isEqualCursor: function (oneCursor, otherCursor), // check cursor
  isEqualState: function (currentState, nextState), // check state
  isImmutable: function (currentState, nextState), // check if object is immutable
  isEqualProps: function (currentProps, nextProps), // check props
  unCursor: function (cursor) // convert from cursor to object
});

You can also override directly on shouldComponentUpdate

var shouldUpdate = require('omniscient/shouldUpdate');

var localShouldUpdate = shouldUpdate.withDefaults({
  isCursor: function(cursor), // check if is props
  isEqualCursor: function (oneCursor, otherCursor), // check cursor
  isEqualState: function (currentState, nextState), // check state
  isImmutable: function (currentState, nextState), // check if object is immutable
  isEqualProps: function (currentProps, nextProps), // check props
  unCursor: function (cursor) // convert from cursor to object
});

v2.1.0

Version v2.1.0

Additions:

1. Adds support for React static methods.
2. Adds dist files (./dist/omniscient.js and ./dist/omniscient.min.js) and build script.

E.g.

var mixins = [{ statics: { foo: noop } }, { statics: { bar: noop } }];

var Component = component(mixins, function () {
  return React.DOM.text(null, 'hello');
});

Component.foo.should.be.a('function');
Component.jsx.foo.should.be.a('function');
Component.bar.should.be.a('function');
Component.jsx.bar.should.be.a('function');