How runtime dependencies could work for Guevara

myEditor.js

export default Neos => {
  const {React, Components, api} = Neos;
  const {Component} = React;
  const {Button, Input, PageTree} = Components;

  //
  // How to connect this to the store? Should we expose @connect?
  //
  return class MyCustomComponent extends Component {
    render() {
      return (
        <div>
          <Input placeholder="Search for pages..." />
          <PageTree />
          <Button onClick={() => api.searchFor(...)}>Search!</Button>
        </div>
      );
    }
  };
};

myExtension.js

import neos from 'neos';
import myCustomComponentFactory from './myEditor';

//
// Some Mechanism to make the UI aware of the extension
//
neos.ui.registerCustomInspectorEditorFactory(myCustomComponentFactory);

neos.js

//
// This would be a separate npm package, that you'll need
// as a dependency in order to use
//

//
// Check for global neos API
//

if (window.neos === undefined) {
  throw new Error('Neos API not found!');
}

//
// Check for version constraint
//
if (!isCompatibleVersion(window.neos.version)) {
  console.warn(`Detected incompatible JSAPI ${window.neos.version}`);
}

export default window.neos;