Allow mixins to export a view and remove render event.

Mixins can extend your app’s state, actions and events. Take it one step further and let them export a view function too.

A mixin’s view would work by returning an object of one or more components.

// mixin
view(state, actions) {
  return {
    MyComponent,
    MyOtherComponent
  }
}

While the state, actions and events props are plain objects that we can merge for you, we can’t merge views as they are functions! But we can collect the views into an object and give it to you.

// app
view(state, actions, { MyComponent }) {
  return <MyComponent />
}

This can be useful for components that work together with a mixin like the Router/Link.

This means instead of e.g., myLibrary.Hello component and myLibrary.hello mixin, now you could do this instead.

export default function() {
  return {
    state: {
      hello: {
        color: "red"
      }
    },
    actions: {
      hello: {
        doSomething() { /* ... */ }
      }
    },
    view(state, actions) {
      return {
        hello: {
          Hello(props, children) {

            // This is a regular component.  
            // What's special about it is that's inside the view closure, so
            // it's effectively "pre-wired" to the state and actions.

            return (
              <a
                style={{ color: state.hello.color }}
                href={props.url}
                onclick={actions.hello.doSomething}
              >
                {children}
              </a>
            )
          }
        }
      }
    }
  }
}

Then you can then use it like this.

import hello from "hyperapp-hello"

app({
  view: (state, actions, { hello: { Hello } }) => (
    <div class="myapp">
      <Hello url="https://hyperapp.js.org" />
    </div>
  ),
  mixins: [hello()]
})

Your comments and questions please. 👋

[rajaraodv]

@zaceno This was from here: https://hyperapp.slack.com/archives/C41ECC0V6/p1505964096000002

[andyrj]

@JorgeBucaran oh ya I can adapt my router, I’m just asking mainly out of curiosity if there are other use-cases where it couldn’t be replicated with the view exported from mixin. I can’t think of a use myself outside of routing.