Skip to content
This repository was archived by the owner on Mar 14, 2022. It is now read-only.

Commit bc4f6f7

Browse files
jansiegeljansiegel
committed
Merge branch 'release/1.0.0'
2 parents a5e38ab + 6af8ad9 commit bc4f6f7

31 files changed

+15061
-1173
lines changed

‎.babelrc

+13-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,16 @@
11
{
22
"presets": [
3-
"react",
4-
"es2015"
5-
]
3+
"es2015-rollup",
4+
"react"
5+
],
6+
"env": {
7+
"test": {
8+
"presets": [
9+
"env"
10+
],
11+
"plugins": [
12+
"transform-runtime"
13+
]
14+
}
15+
}
616
}

‎.gitignore

+3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
node_modules
22
bower_components
3+
build
34
dist
5+
commonjs
6+
es
47
.DS_Store
58
.idea
69
*.log

‎.npmignore

-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,10 @@
11
node_modules
22
bower_components
3-
docs
43
test
54
.DS_Store
65
.idea
76
.babelrc
87
.editorconfig
98
.gitignore
109
.travis.yml
11-
webpack.config.js
1210
*.log

‎.release.json

+1-4
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,9 @@
55
"skip_git_push": true,
66
"release_message": true,
77
"remote": "origin",
8-
"pre_commit_commands": [
9-
"npm run full-build"
10-
],
118
"post_commit_commands": [],
129
"post_complete_commands": [],
1310
"files_to_commit": [
1411
"./docs/*"
1512
]
16-
}
13+
}

‎.travis.yml

+7-2
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,12 @@ language: node_js
33
sudo: false
44

55
node_js:
6-
- "6"
6+
- '6'
77

88
before_script:
9-
- "export TZ=Europe/Warsaw"
9+
- export TZ=Europe/Warsaw
10+
11+
notifications:
12+
email: false
13+
slack:
14+
secure: cDGwvetvROdzjr+rM8KYU48ZQNNwoyeSDI5KnH0y8jrGj/KhbHOsoToNjensduI3afoyouRKc1rbxe7qfmikT0SSiJluyWM4VwXRkdye0I0POnLYISS/fTPFGDulFyiuxOhHzmiQav1+zNkYonGgOVBVt/NqTZkSdc/n6HNdKXIC+3KLdUQ3AI+eaoPaph4jqUdaojSQr26K49Y8us/F7ITI7pPyxG/aVLzLwobGeUaYho+R3PahYBnPlhzNIpeAQ98ZM0Dv4+3ZLzkOZi+/qKWTsaOYFpAlm41QohrcN47XtBCDVLxZ9UzEghkIfHJS68po1MuBDK+ULgm7+LkwEMd6/iTJsKa7ziVmY5ijXdFIc4i+kfMjwsQO7Fm5XAVpm66O+qXlRG5cveCEuLl2NEGBsZ/6caKD7AOqWzF2X5UL+O3qX0deWLT4AOnS/nGnlysPr94/Pthy2QMTt8/lqxpMtBEH9zy0mM7l1ZbeL/eDgUGzNXHxS0rpaE873Ea9Kaq4PZ20AISTGlni11gZbhpAOWhjl9X4sbXzk8ANTvnTf/CeYX8JXCuTEXPPLr4WkHS+1oSq4rfA7DNKrqMgs1LceIy07GogtgAGhJx2b1jFsvk8rO7G0/wOC+E1SIM/8NzQkRxpRmS8y2jkJ4BaQM/6Ee4lpNocC1fsG2VhCw4=

‎CONTRIBUTING.md

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
# Contributing to Handsontable
2+
3+
Your contributions to this project are very welcome. If you want to fix a bug or propose a new feature, you can open a new Pull Request but first make sure it follows these general rules:
4+
5+
1. Sign this [Contributor License Agreement](https://goo.gl/forms/yuutGuN0RjsikVpM2) to allow us to publish your changes to the code.
6+
2. Make your changes on a separate branch. This will speed up the merging process.
7+
3. Always make the target of your pull request the `develop` branch, not `master`.
8+
4. Please review our [coding style](https://github.com/airbnb/javascript) for instructions on how to properly style the code.
9+
5. Add a thorough description of all the changes.
10+
11+
Thank you for your commitment!

‎LICENSE

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
(The MIT License)
22

3-
Copyright (c) 2012-2014 Marcin Warpechowski
4-
Copyright (c) 2015 Handsoncode sp. z o.o. <[email protected]>
3+
Copyright (c) Handsoncode sp. z o.o. <[email protected]>
54

65
Permission is hereby granted, free of charge, to any person obtaining
76
a copy of this software and associated documentation files (the

‎README.md

+145-58
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,61 @@
1-
# react-handsontable [![Build Status](https://travis-ci.org/handsontable/react-handsontable.png?branch=master)](https://travis-ci.org/handsontable/react-handsontable)
2-
A React wrapper for the the [Handsontable](https://github.com/handsontable/handsontable) spreadsheet component.
1+
<img src="https://raw.githubusercontent.com/handsontable/static-files/master/Images/Logo/Handsontable/handsontable-react.png" alt="Handsontable for React" />
2+
3+
<br/>
4+
5+
**Handsontable for React** is the official wrapper for [**Handsontable**](//github.com/handsontable/handsontable), a JavaScript data grid component with a spreadsheet look & feel. It easily integrates with any data source and comes with lots of useful features like data binding, validation, sorting or powerful context menu.
6+
7+
[![Build status](https://travis-ci.org/handsontable/react-handsontable.png?branch=master)](//travis-ci.org/handsontable/react-handsontable)
8+
9+
<br/>
310

411
## Table of contents
5-
1. [Installation](#installation)
6-
2. [Building](#building)
7-
3. [Basic usage](#basic-usage)
8-
4. [Examples](#examples)
9-
5. [License](#license)
10-
6. [Contact](#contact)
11-
7. [Other wrappers](#other-wrappers)
1212

13-
## Installation
1413

15-
For detailed installation instructions, please take a look at our wiki under ["Installation guide"](https://github.com/handsontable/react-handsontable/wiki/Installation-guide).
14+
1. [Installation](#installation)
15+
2. [Getting Started](#getting-started)
16+
3. [Documentation](#documentation)
17+
4. [What to use it for?](#what-to-use-it-for)
18+
5. [Features](#features)
19+
6. [Screenshot](#screenshot)
20+
7. [Resources](#resources)
21+
8. [Support](#support)
22+
9. [Contributing](#contributing)
23+
10. [Licensing](#licensing)
1624

17-
## Building
18-
If you used npm to download the library, you should be good to go, but if you want to make a build yourself, go to the directory where `react-handsontable` source is located and run:
25+
<br/>
1926

20-
```sh
21-
npm run build
27+
## Installation
28+
Use npm to download the project.
29+
```bash
30+
npm install handsontable @handsontable/react
31+
```
32+
A package scope for Handsontable Pro users:
33+
```bash
34+
npm install handsontable-pro @handsontable-pro/react
2235
```
2336

24-
This will create a `/dist/` directory with `react-handsontable.js` and `react-handsontable.min.js` for you to use.
37+
<br/>
2538

26-
## Basic usage
27-
`react-handsontable` creates a `<HotTable>` component. You can use it just like any other React component. For example:
39+
## Getting Started
40+
Assuming that you have installed the wrapper with npm, now you just need to include Handsontable styles into your build system and use `<HotTable>` just like any other React component.
2841

29-
```jsx
30-
// import React...
42+
### Handsontable Community Edition:
43+
44+
**Styles**
45+
```css
46+
@import 'handsontable/dist/handsontable.full.css';
47+
```
48+
49+
**React Component**
50+
```js
3151
import React from 'react';
3252
import ReactDOM from 'react-dom';
53+
import {HotTable} from '@handsontable/react';
3354

34-
// ... and HotTable
35-
import HotTable from 'react-handsontable';
36-
37-
class ExampleComponent extends React.Component {
55+
class HotApp extends React.Component {
3856
constructor(props) {
3957
super(props);
40-
this.handsontableData = [
58+
this.data = [
4159
["", "Ford", "Volvo", "Toyota", "Honda"],
4260
["2016", 10, 11, 12, 13],
4361
["2017", 20, 11, 14, 13],
@@ -47,49 +65,118 @@ class ExampleComponent extends React.Component {
4765

4866
render() {
4967
return (
50-
<div id="example-component">
51-
<HotTable root="hot" data={this.handsontableData} colHeaders={true} rowHeaders={true} width="600" height="300" stretchH="all" />
68+
<div id="hot-app">
69+
<HotTable data={this.data} colHeaders={true} rowHeaders={true} width="600" height="300" stretchH="all" />
5270
</div>
5371
);
5472
}
5573
}
5674
```
57-
58-
Note, that you can provide the Handsontable options either as:
59-
* individual component properties
60-
```jsx
61-
<HotTable root="hot" data={this.handsontableData} colHeaders={true} rowHeaders={true} width="600" height="300" stretchH="all" />
75+
### Handsontable Pro:
76+
**Styles**
77+
```css
78+
@import 'handsontable-pro/dist/handsontable.full.css';
6279
```
63-
* an object passed to a single `settings` property
64-
```jsx
65-
<HotTable root="hot" settings={{
66-
data: this.handsontableData,
67-
colHeaders: true,
68-
rowHeaders: true,
69-
width: 600,
70-
height: 300,
71-
stretchH: 'all'
72-
}} />
80+
81+
**React Component**
82+
```js
83+
import React from 'react';
84+
import ReactDOM from 'react-dom';
85+
import {HotTable} from '@handsontable-pro/react';
86+
87+
class HotApp extends React.Component {
88+
constructor(props) {
89+
super(props);
90+
this.data = [
91+
["", "Ford", "Volvo", "Toyota", "Honda"],
92+
["2016", 10, 11, 12, 13],
93+
["2017", 20, 11, 14, 13],
94+
["2018", 30, 15, 12, 13]
95+
];
96+
}
97+
98+
render() {
99+
return (
100+
<div id="hot-app">
101+
<HotTable data={this.data} colHeaders={true} rowHeaders={true} width="600" height="300" stretchH="all" />
102+
</div>
103+
);
104+
}
105+
}
73106
```
74107

75-
The `root` property declares the `id` of the root element for the table. It is optional - if it isn't provided, the table will get a random generated `id`.
108+
<br/>
76109

77-
## Examples
78-
- [Simple react-handsontable implementation](http://codepen.io/handsoncode/pen/ygvaxv?editors=0010)
79-
- [Simple react-handsontable implementation with a single-property configuration](http://codepen.io/handsoncode/pen/pRamwZ?editors=0010)
80-
- [Interactive HotTable demo](http://codepen.io/handsoncode/pen/zNRoxb?editors=0010)
81-
- [Simple Redux implementation demo](http://codepen.io/handsoncode/pen/LWmvPX?editors=0010)
110+
## Documentation
111+
Visit [docs.handsontable.com](https://docs.handsontable.com/react) to get more Handsontable for React examples and guides.
82112

83-
## License
84-
`react-handsontable` is released under the [MIT license](https://github.com/handsontable/react-handsontable/blob/master/LICENSE).
85-
Copyrights belong to Handsoncode sp. z o.o.
113+
<br/>
114+
115+
## What to use it for?
116+
The list below gives a rough idea on what you can do with Handsontable, but it shouldn't limit you in any way:
117+
118+
- Database editing
119+
- Configuration controlling
120+
- Data merging
121+
- Team scheduling
122+
- Sales reporting
123+
- Financial analysis
124+
125+
<br/>
126+
127+
## Features
128+
129+
Some of the most popular features include:
86130

87-
## Contact
88-
Feel free to give us feedback on this wrapper using this [contact form](https://handsontable.com/contact.html) or write directly at [email protected].
131+
- Sorting data
132+
- Data validation
133+
- Conditional formatting
134+
- Freezing rows/columns
135+
- Merging cells
136+
- Defining custom cell types
137+
- Moving rows/columns
138+
- Resizing rows/columns
139+
- Context menu
140+
- Adding comments to cells
141+
- Dragging fill handle to populate data
142+
- Internationalization
143+
- Non-contiguous selection
89144

90-
## Other Wrappers
91-
Handsontable comes with more wrappers and directives for popular frameworks:
145+
<br/>
92146

93-
- [hot-table](https://github.com/handsontable/hot-table) (Polymer - WebComponents)
94-
- [ngHandsontable](https://github.com/handsontable/ngHandsontable) (Angular 1)
95-
- [vue-handsontable-official](https://github.com/handsontable/vue-handsontable-official) (Vue.js)
147+
## Screenshot
148+
<div align="center">
149+
<a href="//handsontable.com/examples">
150+
<img src="https://raw.githubusercontent.com/handsontable/static-files/master/Images/Screenshots/handsontable-ce-showcase.png" align="center" alt="Handsontable for React" />
151+
</a>
152+
</div>
153+
154+
<br/>
155+
156+
## Resources
157+
- [Guides](//docs.handsontable.com/react)
158+
- [API Reference](//docs.handsontable.com/Core.html)
159+
- [Release notes](//github.com/handsontable/react-handsontable/releases)
160+
- [Roadmap](//trello.com/b/PztR4hpj)
161+
- [Twitter](//twitter.com/handsontable)
162+
163+
<br/>
164+
165+
## Support
166+
You can report your issues here on [GitHub](//github.com/handsontable/react-handsontable/issues).
167+
168+
An open source version of Handsontable doesn't include technical support. You need to purchase the [Handsontable Pro](//handsontable.com/pricing) license or [contact us](//handsontable.com/contact) directly in order to obtain a technical support from the Handsontable team.
169+
170+
<br/>
171+
172+
## Contributing
173+
If you would like to help us to develop this wrapper for React, please first read the [guide for contributors](//github.com/handsontable/react-handsontable/blob/master/CONTRIBUTING.md).
174+
175+
<br/>
176+
177+
## Licensing
178+
This wrapper is released under [the MIT license](//github.com/handsontable/react-handsontable/blob/master/LICENSE).
179+
180+
<br/>
181+
182+
Copyrights belong to Handsoncode sp. z o.o.

0 commit comments

Comments
 (0)