Reactjs Wrapper for tui.calendar

[IniZio]

I am planning to write a Reactjs wrapper for this nice package, and have read the vuejs and angularjs implementations, however they seem to differ from the pattern that React suggests i.e. 'data down, actions up'.

Therefore just want to ask if it is preferred to follow the other wrappers or figure our the React way?

[dongsik-yoo]

I think it's better that you figure the React way out. https://ui.toast.com/tui-calendar is implemented by React.

[dongsik-yoo]

@IniZio If you have any question to create React wrapper, don't hesitate leave comments or issue.

[damusix]

@dongsik-yoo can you provide an example? Also, how would we manage calendar state?

[dongsik-yoo]

@damusix I needed very simple state in my example site. So this is simple sample.

class CalendarMain extends React.Component {
  constructor() {
    super();
    this.state = {
      renderRange: ''
    };

    this.options = {
      defaultView: 'month',
      template: CalendarTemplate,
      useCreationPopup: true,
      useDetailPopup: true,
      calendars: calendarList,
      month: {},
      week: {}
    };
  }

  componentDidMount() {
    this.calendar = this.createCalendarMain();
    this.setEventHandlers();
    this.setSchedules();
    this.setRenderRangeText();
  }

  componentDidUpdate() {
    this.calendar.render();
  }

  setSchedules() {
    const cal = this.calendar;
    const schedules = generateSchedule(
      calendarList,
      cal.getViewName(),
      cal.getDateRangeStart(),
      cal.getDateRangeEnd(),
      cal.getOptions()
    );
    cal.createSchedules(schedules);
  }

  createCalendarMain() {
    return new TuiCalendar('#calendar', this.options);
  }
}

[IniZio]

Currently working on the wrapper here https://github.com/IniZio/react-tui-calendar

[dongsik-yoo]

@IniZio It's empty repository. Can you please check it out?

[IniZio]

Yes I am doing the initial setup still 😅

[dongsik-yoo]

Oh, sorry. I didn't understand what you said.
Thank you for your effort.

[dongsik-yoo]

I introduce to you Another TOAST UI Family. It would be helpful for your React application.
TOAST UI Grid v3.0 has been released. New design and Tree+Grid. Please have a look.

https://github.com/nhnent/tui.grid

[IniZio]

I am working on the integrating react-tui-calendar with https://github.com/IniZio/usthing-ui 😄

[dongsik-yoo]

@IniZio usthing-ui has many useful components. Great!

[IniZio]

Demo site for the wrapper https://inizio.github.io/react-tui-calendar/, though the wrapper itself is not ready yet 😂

[IniZio]

react-tui-calendar was occupied already, published at tui-calendar-react for testing

[dongsik-yoo]

@IniZio Thank you for your effort. I would be great helpful to users!.
BTW, tui-calendar-react link is forbidden.

[IniZio]

Fixed the link 🙈