Uncaught RangeError: Maximum call stack size exceeded ReactElement.js

exceeded.md

I am trying to display three components in the browser, but I am getting Uncaught RangeError: Maximum call stack size exceeded. The anonymous function is pointing to the react internal files. It would be great if you guys could let me know how to debug and fix the error. I'm providing the main js file which causes the error

I debugged at this line ReactCompositeComponent_mountComponent @ ReactPerf.js?94d4:66 It's throwing some object... but I'm not sure how to proceed. output: renderedComponent = Object {$$typeof: Symbol(react.element), type: "div", key: null, ref: null, props: Object…}

error

Uncaught RangeError: Maximum call stack size exceeded ReactElement.js?49af:112 

ReactElement.createElement @ ReactElement.js?49af:112
ReactElementValidator.createElement @ ReactElementValidator.js?0630:223
redux-ball_render @ redux-ball.jsx?ed37:53
(anonymous function) @ makeAssimilatePrototype.js?04ea:15
ReactCompositeComponentMixin._renderValidatedComponentWithoutOwnerOrContext @ ReactCompositeComponent.js?3093:587
ReactCompositeComponentMixin._renderValidatedComponent @ ReactCompositeComponent.js?3093:607
ReactCompositeComponent__renderValidatedComponent @ ReactPerf.js?94d4:66
ReactCompositeComponentMixin.mountComponent @ ReactCompositeComponent.js?3093:220
ReactCompositeComponent_mountComponent @ ReactPerf.js?94d4:66
ReactReconciler.mountComponent @ ReactReconciler.js?bb76:37

code

import Basketball from 'sports-players';
import CarRacing from 'sports-players';
import Football from 'sports-players';

export default {
    start: 'clickWrapper',
    steps: {
        clickWrapper: {
            components: [
                {
                    component: Basketball,
                    componentConfig: {
                        ballDisplay: 'left',
                        labelText: 'here?'
                    }
                },
                {
                    component: CarRacing,
                    componentConfig: {
                        ballDisplay: 'right',
                        clickChoices: [
                            {
                                value: 'cool',
                                label: 'place'
                            },
                            {
                                value: 'now',
                                label: 'after'
                            }
                        ]
                    }
                }
            ],
            next: 'inputWrapper'
        },
        inputWrapper: {
            components: [
                {
                    component: Basketball,
                    componentConfig: {
                        ballDisplay: 'left',
                        labelText: 'Lets play footballer?'
                    }
                },
                {
                    component: Football,
                    componentConfig: {
                        ballDisplay: 'right',
                        inputType: 'text', //TODO: This should default to text, so remove
                        verifyButtonLabel: 'Looks good.',
                        textInputSubLabel: 'Enter a name'
                    }
                }
            ],
            next: 'end'
        }
        /*end: {
            components: [
                {
                    id: 'proteinLabel',
                    type: LabelBubble,
                    position: 'left',
                    labelText: 'What ?'
                },
                {
                    id: 'proteinChoice',
                    type: CarRacingBubble,
                    position: 'right',
                    subText: 'Pick one',
                    choices: [
                        {
                            value: 'continue',
                            label: 'Keep going'
                        },
                        {
                            value: 'startOver',
                            label: 'Start over'
                        }
                    ]
                }
            ],
            next: (flowData) => {
                if (flowData.transition === 'startOver') {
                    return 'intro';
                } else {
                    return 'sliderWrapper';
                }
            }
        }*/
    }
};