Introduction

A library of hooks and components for building temporal UI in React, powered by day.js.

Motivation

There are a lot of libraries that probably cover this already, but I wanted to build this mainly for my own learning.

I tend to gravitate toward using day.js in my projects, which motivated including an option to expose those objects instead of native Date objects.

If you find it useful, feel free to use it or contribute.

Installation

npm install react-temporal-ui

Example usage

import { useCalendar } from 'react-temporal-ui';

const App = () => {
  const { weeks, nextMonth, prevMonth } = useCalendar();

  return (
    <>
      <button onClick={prevMonth}>Prev</button>
      <button onClick={nextMonth}>Next</button>

      {weeks.map((week, i) => (
        <div key={i}>
          {week.map((day, j) => (
            <p>{day.getDate()}</p>
          ))}
        </div>
      ))}
    </>
  );
};

License

The project is licensed under the permissive MIT license.