Implement custom Immutable Map control & support for Immutable datastructures in variations

[nikgraf]

No description provided.

[pe3]

Is this issue about extending variationsToProps.js so that variations-files could produce objects from required modules?

In my case I'm using the CALMM architecture and my component properties are Bacon Atoms. I would like to write variations which initialize components with these.

// Counter/v-initialize-atom.js
var Atom = require("bacon.atom")
module.exports = {
  "name": "Initialize with 100",
  "props": {
    "value": Atom(100)
  }
};

As a temporary sollution I'm creating wrapper components with a more traditional API only for Carte Blance. Like this:

import React, { PropTypes } from 'react';
import Atom from "bacon.atom"
import Counter from '../Counter';

const CounterDemo = ({value}) => (
  <Counter value={Atom(value)} />
)

CounterDemo.propTypes = {
  value: PropTypes.number,
};

export default CounterDemo;

[nikgraf]

Exactly @pe3 - ideally we would to allow you to use plain JavaScript in the variation files. From what I understand this is a bit of a challenge as every required would need to be converted with webpack.

Another option would be to allow people to hook into the serialization/de-serialization step and use Atom or Immutable as well. Yet we haven't had time to experiment with any possible solution. I'm super curious about any ideas that might come up in a discussion 👍

[pe3]

Just a crazy heretic - non Webpack - idea that came to my mind: with SystemJS the bundling could maybe happen (for development purposes) on-demand in the browser like this:

<script src="system.js"></script>
<script>
  // set our baseURL reference path
  System.config({
    baseURL: '/app'
  });

  // loads /app/main.js
  System.import('main.js');
</script>

Could something similar be done with Webpack?

[nikgraf]

@pe3 to be honest: I don't know