How can I override React Components with surveyjs

[dmitry-kurmanov]

@juliankrispel, hello! Could you please describe what are you looking for in greater details?

You can open any example with ReactJS, please see: https://surveyjs.io/Examples/Library/?id=questiontype-radiogroup&platform=Reactjs&theme=default

Also you can look at our example repo: https://github.com/surveyjs/surveyjs_react_quickstart . The repo includes all custom widgets and the SurveyJS builder.

In fact all versions of SurveyJS has same API and differ only the frameworks specific stuff like ReactDom.render. So maybe the doc will help you.

[juliankrispel]

@dmitrykurmanov in particular I'm struggling to find an example of how to customize rendering of any of the components. The only customization seems to be through themes is that right?

[juliankrispel]

Also, while I got your attention 😅 - by the looks of it the entire state seems to be managed inside the survey class - am I right in assuming that survey-react is just a shell?

[dmitry-kurmanov]

The only customization seems to be through themes is that right?

also we have the onAfterRenderQuestion event: https://surveyjs.io/Documentation/Library/?id=surveymodel#onAfterRenderQuestion

but for the complex tasks we reccomend to create custom widgets, please look at examples: https://plnkr.co/edit/HdnYE5?p=preview and https://plnkr.co/edit/fXsLf1R88WxxDFaFEnYx?p=preview

am I right in assuming that survey-react is just a shell?

yes we have a model ("headless" core) and different implementations for frameworks

[juliankrispel]

@dmitrykurmanov is there any way to use react with these widgets?

[dmitry-kurmanov]

@juliankrispel If I understand you correctly, you can find example of using in our repo: https://github.com/surveyjs/surveyjs_react_quickstart/blob/master/src/App.js

Or may be you want to create custom widgets via the jsx and ReactJS instead of pure js?

[juliankrispel]

@dmitrykurmanov that's exactly it - since I'm using react I'd like to use react patterns to render views rather than injecting html (which is what I can see the react implementation do here) - I'm guessing the answer is that's not possible.

In which case - is that something that you guys would be interested in? As in would you accept a pr?

[andrewtelnov]

@juliankrispel We will definately review your PR and discuss it internally. If we feel it benefits our users we definately aprove it. It is hard to say right now, would we do it or not. We have to understand what you are going to do. You are always may re-register the react implementation of our questions. There are two parts: question model + platform dependent part. The registeration looks like:

ReactQuestionFactory.Instance.registerQuestion("checkbox", props => {
  return React.createElement(SurveyQuestionCheckbox, props);
});

If you call registerQuesion several times for the same question type, then the last react component would be used.

Thank you, Andrew

[juliankrispel]

ooooh nice - thanks @andrewtelnov ! I'll give that a go!