Can I render Semantic UI elements in custom renderer?

Tags: #<Tag:0x00007efc6522ee18>
#1

I am using the semantic-ui framework for React.
I’m currently looking to create a custom renderer to display some data using the component from semantic.

This is JSX, not HTML, and I’m wondering if it’s possible to render a react UI component in a custom renderer? IF so, how?

#2

Hey @mhennessy7

Handsontable for React 3.1.0 introduced

a possibility to use React components as Handsontable renderers and editors

src https://github.com/handsontable/react-handsontable/releases/tag/3.1.0

Here’s a demo that should help https://handsontable.com/docs/7.2.2/frameworks-wrapper-for-react-hot-column.html

#3

Thanks, I missed this before, this is exactly what I was looking for.
A quick follow up question. When using , what is the correct way to pass additional data to the custom renderer? For example, If I want to pass an array of data (for custom selection renderer), do I just add an new attribute to such as

<HotColumn source=[{“id”: “1”, “Label”: “Mark”},{“id”: “2”, “Label”: “Steve”}]>
and then access this in the renderer via the cellproperties.source ?
Or should i put this as an attribute of the custom render itself and use react props to access it?

Thx again

#4

Hi again, so I figured this out, looks like I can just pass in the data via a prop on the custom component.
I’m now running into an issue where the actual behavior of the component isn’t working within the grid?
Here is a link to the semantic Dropdown component I’m looking to use:

https://react.semantic-ui.com/modules/dropdown/#types-multiple-selection

i have this configured in a custom Editor, and I’ve setup up some default options. The drop down appears correctly, however, the behavior of selecting multiple isn’t working. If I use the drop down in a react page, it works fine, but inside the grid, when I make a selection, it doesn’t put the selection at the top of the list or otherwise let me select multiple.

Could you have one of your react developers see how/if this could work?

#5

Hey @mhennessy7

I saw that our Sales Manager already introduced us on emails so I guess we can close this topic.

#6