Feature Request: Allow any type of object to be rendered as and Item and Group Title about react-calendar-timeline HOT 9 CLOSED

I think it would be good if we could do something like:

// Custom component for the Item rendered
class Item extends React.Component {
  render(){
    return <div styles="width: {this.props.width}">{this.props.item.title}</div>;
  }
};

// Timeline using a custom Item-Renderer
class Root extends React.Component {
  render(){
    return (
      <Timeline groups={groups}
                items={items}
                itemRenderer={<Item/>}
                />
    );
  }
}

That would help to make the Items as flexible as possible. @gyarasu and @tacticalcoding could solve their problem with it. right?

from react-calendar-timeline.

That would be great!

from react-calendar-timeline.

@signalwerk
I see.
Sorry for my misunderstanding.
I'm looking forward to implementing this solution!

from react-calendar-timeline.

Hey, we already have itemRenderer since v0.13.0 and it is possible to give any React prop as the title of the group, as shown in the treeGroups demo (source).

So I'm closing this thread! 🎉

from react-calendar-timeline.

I think this not easy to do because the items are scaled depending on the width. But I agree it would be a cool feature. Maybe a customizable "tooltip" as a first step

from react-calendar-timeline.

Is it easy to put a link(<a>) to group cell?

For example, Adding 'href' property to object in groups array.

const groups = [
      {id: 1, title: 'group 1', href: 'http://example.com'}, // this group will be rendered as a link
      {id: 2, title: 'group 2'}
    ];

from react-calendar-timeline.

@signalwerk
Thank you very much for your response!

Unfortunately, it doesn't work.
'Item' component has never been rendered, as long as I try.

I want to know more about 'itemRenderer' property.
However, I can't find the information about that property(itemRenderer).
How do you know about 'itemRenderer'?

from react-calendar-timeline.

I'm sorry @gyarasu if I puzzled you. @dmr and me were suggesting how to handle that case. But it's not implemented yet. Sorry for any inconvenience.

from react-calendar-timeline.

Very cool, thank you!

from react-calendar-timeline.