move to typescript

Author: jbetancur

.babelrc

@@ -1,3 +1,4 @@
 node_modules
 dist
 coverage
+storybook-static

.eslintignore

@@ -1,11 +1,13 @@
 module.exports = {
 	parser: '@typescript-eslint/parser', // Specifies the ESLint parser
+	plugins: ['jest', '@typescript-eslint'],
 	extends: [
 		'plugin:react/recommended', // Uses the recommended rules from @eslint-plugin-react
 		'plugin:@typescript-eslint/recommended', // Uses the recommended rules from the @typescript-eslint/eslint-plugin
 		'prettier/@typescript-eslint', // Uses eslint-config-prettier to disable ESLint rules from @typescript-eslint/eslint-plugin that would conflict with prettier
 		'plugin:prettier/recommended', // Enables eslint-plugin-prettier and displays prettier errors as ESLint errors. Make sure this is always the last configuration in the extends array.
 		'plugin:react-hooks/recommended',
+		'plugin:jsx-a11y/recommended',
 	],
 	parserOptions: {
 		ecmaVersion: 2018, // Allows for the parsing of modern ECMAScript features
@@ -35,23 +37,10 @@ module.exports = {
 	overrides: [
 		{
 			files: ['**/*.js', '**/*.jsx'],
-			plugins: ['jest', 'react-hooks', 'jsx-a11y'],
 			rules: {
-				'max-len': 0,
-				'react/forbid-prop-types': 0,
-				'import/no-extraneous-dependencies': 0,
-				'no-confusing-arrow': ['error', { allowParens: true }],
-				'arrow-parens': ['error', 'as-needed'],
-				'react/jsx-filename-extension': [1, { extensions: ['.js', '.jsx'] }],
-				'import/prefer-default-export': 0,
-				'object-curly-newline': ['error', { consistent: true }],
-				'implicit-arrow-linebreak': 0,
-				'operator-linebreak': 0,
-				'linebreak-style': 0,
-				'arrow-body-style': 0,
-				'react-hooks/rules-of-hooks': 'error', // Checks rules of Hooks
-				'react-hooks/exhaustive-deps': 'warn', // Checks effect dependencies
-				'react/jsx-props-no-spreading': 0,
+				'@typescript-eslint/no-var-requires': 'off',
+				'@typescript-eslint/explicit-module-boundary-types': 'off',
+				'react/display-name': 'off',
 			},
 		},
 	],

.eslintrc.js

@@ -59,7 +59,6 @@ typings/
 
 # dist
 dist/*
-!dist/index.js
 
 # Storybook
 storybook-static

.gitignore

@@ -0,0 +1,9 @@
+module.exports = {
+		stories: ['../stories/**/*.stories.@(ts|tsx|js|jsx)'],
+	addons: [
+		'@storybook/addon-actions',
+		'@storybook/addon-storysource',
+		'@storybook/addon-links',
+		'@storybook/addon-a11y',
+	],
+};

.storybook/main.js

@@ -1,7 +1,7 @@
 {
   "processors": ["stylelint-processor-styled-components"],
   "extends": [
-    "stylelint-config-standard",
+    "stylelint-config-recommended",
     "stylelint-config-styled-components"
   ],
   "rules": {

.storybook/main.ts

@@ -1,55 +1,55 @@
-[![Build Status](https://travis-ci.org/jbetancur/react-data-table-component.svg?branch=master)](https://travis-ci.org/jbetancur/react-data-table-component) [![npm version](https://badge.fury.io/js/react-data-table-component.svg)](https://badge.fury.io/js/react-data-table-component) [![codecov](https://codecov.io/gh/jbetancur/react-data-table-component/branch/master/graph/badge.svg)](https://codecov.io/gh/jbetancur/react-data-table-component) [![Storybook](https://cdn.jsdelivr.net/gh/storybookjs/brand@master/badge/badge-storybook.svg)](https://jbetancur.github.io/react-data-table-component)
+[![Build Status](https://travis-ci.com/jbetancur/react-data-table-component.svg?branch=master)](	) [![npm version](https://badge.fury.io/js/react-data-table-component.svg)](https://badge.fury.io/js/react-data-table-component) [![codecov](https://codecov.io/gh/jbetancur/react-data-table-component/branch/master/graph/badge.svg)](https://codecov.io/gh/jbetancur/react-data-table-component) [![Storybook](https://cdn.jsdelivr.net/gh/storybookjs/brand@master/badge/badge-storybook.svg)](https://jbetancur.github.io/react-data-table-component)
 
 <!-- TOC -->
 
 - [React Data Table Component](#react-data-table-component)
-  - [Demo and Examples](#demo-and-examples)
-  - [Key Features](#key-features)
-  - [Requirements](#requirements)
-  - [Installation](#installation)
-  - [Logging Issues and Contributions](#logging-issues-and-contributions)
-  - [API and Usage](#api-and-usage)
-    - [Columns](#columns)
-      - [column.hide media presets](#columnhide-media-presets)
-    - [DataTable Properties](#datatable-properties)
-      - [Basic](#basic)
-      - [Row Selection](#row-selection)
-      - [Row Expander](#row-expander)
-      - [Sorting](#sorting)
-      - [Pagination](#pagination)
-      - [Header](#header)
-      - [Header Context Menu when using Selectable Rows](#header-context-menu-when-using-selectable-rows)
-      - [Progress Indicator](#progress-indicator)
-      - [Theming and Customization](#theming-and-customization)
-        - [Dark Mode Theme](#dark-mode-theme)
-        - [Defining Your Own Theme Using `createTheme`](#defining-your-own-theme-using-createtheme)
-        - [Overidding Styling using css-in-js](#overidding-styling-using-css-in-js)
-      - [Conditional Row Styling](#conditional-row-styling)
-        - [Example](#example)
-      - [Conditional Style Object](#conditional-style-object)
-  - [Basic Table](#basic-table)
-  - [Selectable Rows](#selectable-rows)
-    - [Clearing Selected Rows](#clearing-selected-rows)
-    - [Overriding with Ui Component Library](#overriding-with-ui-component-library)
-  - [Using Custom Checkboxes and Indeterminate State](#using-custom-checkboxes-and-indeterminate-state)
-  - [Custom Cells](#custom-cells)
-  - [Expandable Rows](#expandable-rows)
-  - [UI Library Integration](#ui-library-integration)
-  - [Optimizing for Performance and Caveats](#optimizing-for-performance-and-caveats)
-    - [Passing non-primitive props (objects, arrays and functions)](#passing-non-primitive-props-objects-arrays-and-functions)
-      - [Optimizing Class Components](#optimizing-class-components)
-        - [Examples of Optimizations](#examples-of-optimizations)
-      - [Optimizing Functional Components](#optimizing-functional-components)
-  - [CSS Overrides](#css-overrides)
+	- [Demo and Examples](#demo-and-examples)
+	- [Key Features](#key-features)
+	- [Requirements](#requirements)
+	- [Installation](#installation)
+	- [Logging Issues and Contributions](#logging-issues-and-contributions)
+	- [API and Usage](#api-and-usage)
+		- [Columns](#columns)
+			- [column.hide media presets](#columnhide-media-presets)
+		- [DataTable Properties](#datatable-properties)
+			- [Basic](#basic)
+			- [Row Selection](#row-selection)
+			- [Row Expander](#row-expander)
+			- [Sorting](#sorting)
+			- [Pagination](#pagination)
+			- [Header](#header)
+			- [Header Context Menu when using Selectable Rows](#header-context-menu-when-using-selectable-rows)
+			- [Progress Indicator](#progress-indicator)
+			- [Theming and Customization](#theming-and-customization)
+				- [Dark Mode Theme](#dark-mode-theme)
+				- [Defining Your Own Theme Using `createTheme`](#defining-your-own-theme-using-createtheme)
+				- [Overidding Styling using css-in-js](#overidding-styling-using-css-in-js)
+			- [Conditional Row Styling](#conditional-row-styling)
+				- [Example](#example)
+			- [Conditional Style Object](#conditional-style-object)
+	- [Basic Table](#basic-table)
+	- [Selectable Rows](#selectable-rows)
+		- [Clearing Selected Rows](#clearing-selected-rows)
+		- [Overriding with Ui Component Library](#overriding-with-ui-component-library)
+	- [Using Custom Checkboxes and Indeterminate State](#using-custom-checkboxes-and-indeterminate-state)
+	- [Custom Cells](#custom-cells)
+	- [Expandable Rows](#expandable-rows)
+	- [UI Library Integration](#ui-library-integration)
+	- [Optimizing for Performance and Caveats](#optimizing-for-performance-and-caveats)
+		- [Passing non-primitive props (objects, arrays and functions)](#passing-non-primitive-props-objects-arrays-and-functions)
+			- [Optimizing Class Components](#optimizing-class-components)
+				- [Examples of Optimizations](#examples-of-optimizations)
+			- [Optimizing Functional Components](#optimizing-functional-components)
+	- [CSS Overrides](#css-overrides)
 - [Development](#development)
-  - [Setup](#setup)
-  - [Local development](#local-development)
-  - [Including NPM packages](#including-npm-packages)
-    - [Library dependencies -- <root_dir>/package.**json](#library-dependencies----root_dirpackagejson)
-    - [Storybook dependencies -- <root_dir>/stories/package.json](#storybook-dependencies----root_dirstoriespackagejson)
-  - [Lint](#lint)
-  - [Test](#test)
-  - [Build](#build)
+	- [Setup](#setup)
+	- [Local development](#local-development)
+	- [Including NPM packages](#including-npm-packages)
+		- [Library dependencies -- <root_dir>/package.**json](#library-dependencies----root_dirpackagejson)
+		- [Storybook dependencies -- <root_dir>/stories/package.json](#storybook-dependencies----root_dirstoriespackagejson)
+	- [Lint](#lint)
+	- [Test](#test)
+	- [Build](#build)
 - [Contributors](#contributors)
 
 <!-- /TOC -->
@@ -250,7 +250,7 @@ When the breakpoint is reached the column will be hidden. These are the built-in
 |--------------------------|---------------------|----------|---------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
 | contextMessage | object | no | `{ singular: 'item', plural: 'items', message: 'selected' }` | override the context menu selected message when using `selectableRows` |
 | contextActions | component or array of components| no |  | add context actions to the context menu when using `selectableRows` |
-| contextComponent | bool | no | false | Overide the default context menu when using `selectableRows` with your own custom componet. RDT will compose the `selectedCount` prop to your custom component. This will negate `contextMessage` and `contextActions` |
+| contextComponent | component | no | null | Overide the default context menu when using `selectableRows` with your own custom componet. RDT will compose the `selectedCount` prop to your custom component. This will negate `contextMessage` and `contextActions` |
 | noContextMenu | bool | no | false | Do not display the context menu when using `selectableRows` |
 
 #### Progress Indicator

.storybook/preview.js renamed to .storybook/preview.ts

@@ -0,0 +1,27 @@
+module.exports = {
+	parser: 'babel-eslint',
+	extends: ['plugin:jsx-a11y/recommended'],
+	plugins: ['jest', 'react-hooks', 'jsx-a11y'],
+	rules: {
+		'max-len': 0,
+		'react/forbid-prop-types': 0,
+		'import/no-extraneous-dependencies': 0,
+		'no-confusing-arrow': ['error', { allowParens: true }],
+		'arrow-parens': ['error', 'as-needed'],
+		'react/jsx-filename-extension': [1, { extensions: ['.js', '.jsx'] }],
+		'import/prefer-default-export': 0,
+		'object-curly-newline': ['error', { consistent: true }],
+		'implicit-arrow-linebreak': 0,
+		'operator-linebreak': 0,
+		'linebreak-style': 0,
+		'arrow-body-style': 0,
+		'react-hooks/rules-of-hooks': 'error', // Checks rules of Hooks
+		'react-hooks/exhaustive-deps': 'warn', // Checks effect dependencies
+		'react/jsx-props-no-spreading': 0,
+		'react/display-name': 0,
+	},
+	env: {
+		'jest/globals': true,
+		browser: true,
+	},
+};