<commit_before># TT React Calendar

[![NPM Version][npm-image]][npm-url]
[![Downloads Stats][npm-downloads]][npm-url]

## Description

A no-frills calendar widget that lets you bring your own styling. This component
takes a start date, an end date, and a `renderDay` function, and then gets out
of the way.

## Installation

```sh
npm install --save tt-react-calendar
```

## Usage

```javascript
import Calendar from 'tt-react-calendar';

function renderDay(day) {
  return <div className="day">{day.format('dd')}</div>
}

function MyComponent() {
  return (
    <Calendar
      className="calendar-container"
      dayAbbrevs={['Su', 'M', 'T', 'W', 'Th', 'F', 'Sa']}
      dayHeaderClassName="calendar-day-header"
      dayHeaderStyle={Calendar.DayHeaderStyles.InFirstMonth}
      firstRenderedDay="2016-12-25"
      lastRenderedDay="2017-02-12"
      monthClassName="calendar-month"
      monthHeaderFormat="MMMM YYYY"
      renderDay={renderDay}
      weekClassName="calendar-week"
    />
  );
}
```

### Properties

Name | Type | Description
-----|------|-------------
`className` | string | Class name for the calendar's container element
`dayAbbrevs` | Array.&lt;string&gt; | Array of day names, starting with Sunday. Defaults to `['Su', 'M', 'T', 'W', 'Th', 'F', 'Sa']`.
`dayHeaderClassName` | string | Class name for the day header container element<commit_msg>[README] Add note about CSS<commit_after># TT React Calendar

[![NPM Version][npm-image]][npm-url]
[![Downloads Stats][npm-downloads]][npm-url]

## Description

A no-frills calendar widget that lets you bring your own styling. This component
takes a start date, an end date, and a `renderDay` function, and then gets out
of the way.

## Installation

```sh
npm install --save tt-react-calendar
```

## Usage

```javascript
import Calendar from 'tt-react-calendar';

function renderDay(day) {
  return <div className="day">{day.format('dd')}</div>
}

function MyComponent() {
  return (
    <Calendar
      className="calendar-container"
      dayAbbrevs={['Su', 'M', 'T', 'W', 'Th', 'F', 'Sa']}
      dayHeaderClassName="calendar-day-header"
      dayHeaderStyle={Calendar.DayHeaderStyles.InFirstMonth}
      firstRenderedDay="2016-12-25"
      lastRenderedDay="2017-02-12"
      monthClassName="calendar-month"
      monthHeaderFormat="MMMM YYYY"
      renderDay={renderDay}
      weekClassName="calendar-week"
    />
  );
}
```

And somewhere in your stylesheet build process...

```css
@import 'tt-react-calendar/dist/styles.css';
```

### Properties

Name | Type | Description
-----|------|-------------
`className` | string | Class name for the calendar's container element
`dayAbbrevs` | Array.&lt;string&gt; | Array of day names, starting with Sunday. Defaults to `['Su', 'M', 'T', 'W', 'Th', 'F', 'Sa']`.
`dayHeaderClassName` | string | Class name for the day header container element
{'fraction_non_alphanumeric': 0.16701607267645002, 'fraction_numerical': 0.011180992313067784, 'mean_word_length': 3.9023972602739727, 'pattern_counts': {'":': 0, '<': 9, '<?xml version=': 0, '>': 9, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 4, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1387115', 'n_tokens_mistral': 939, 'n_tokens_neox': 885, 'n_words': 251}