Skip to content

Commit 7724b5c

Browse files
author
Cédric Delpoux
committed
v2.0.0
1 parent e3fe0b2 commit 7724b5c

28 files changed

+7194
-1647
lines changed

‎.babelrc

Lines changed: 0 additions & 8 deletions
This file was deleted.

‎.editorconfig

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,5 +9,8 @@ indent_style = space
99
indent_size = 2
1010

1111
[*.md]
12-
indent_size = 4
1312
trim_trailing_whitespace = false
13+
14+
[package.json]
15+
indent_style = space
16+
indent_size = 2

‎.eslintrc

Lines changed: 9 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -1,53 +1,15 @@
11
{
22
"parser": "babel-eslint",
3-
4-
"plugins": [
5-
"react"
6-
],
7-
83
"env": {
4+
"amd": true,
95
"es6": true,
10-
"browser": true,
11-
"node": true,
12-
"mocha": true
6+
"jest/globals": true
137
},
14-
15-
"ecmaFeatures": {
16-
"jsx": true,
17-
"modules": true
18-
},
19-
20-
"rules": {
21-
"block-scoped-var": 0,
22-
"brace-style": [2, "1tbs", {"allowSingleLine": true}],
23-
"camelcase": 0,
24-
"comma-dangle": [1, "always-multiline"],
25-
"comma-style": [1, "last"],
26-
"consistent-this": [2, "self"],
27-
"curly": 0,
28-
"indent": [1, 2],
29-
"quotes": [1, "single", "avoid-escape"],
30-
"no-multiple-empty-lines": [1, {"max": 1}],
31-
"no-self-compare": 2,
32-
"no-underscore-dangle": 0,
33-
"no-unused-vars": [2, {"vars": "all", "args": "none"}],
34-
"no-use-before-define": 0,
35-
"no-var": 2,
36-
"semi": [2, "never"],
37-
"space-after-keywords": [1, "always"],
38-
"space-before-blocks": [1, "always"],
39-
"space-before-function-parentheses": [1, "never"],
40-
"space-in-parens": [1, "never"],
41-
"spaced-line-comment": [1, "always"],
42-
"strict": [2, "never"],
43-
"react/jsx-boolean-value": [1, "never"],
44-
"react/jsx-quotes": [1, "double", "avoid-escape"],
45-
"react/jsx-uses-react": 2,
46-
"react/jsx-uses-vars": 2,
47-
"react/no-did-mount-set-state": 2,
48-
"react/no-did-update-set-state": 2,
49-
"react/react-in-jsx-scope": 2,
50-
"react/self-closing-comp": 1,
51-
"react/wrap-multilines": 1
52-
}
8+
"plugins": ["jest", "prettier", "react"],
9+
"extends": [
10+
"eslint:recommended",
11+
"plugin:jest/recommended",
12+
"plugin:react/recommended",
13+
"prettier"
14+
]
5315
}

‎.gitignore

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
1-
lib
2-
node_modules
3-
npm-debug.log
4-
.DS_Store
1+
/coverage
2+
/demo/dist
3+
/es
4+
/lib
5+
/node_modules
6+
/umd
7+
npm-debug.log*

‎.lintstagedrc

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"*.js": [
3+
"prettier --no-bracket-spacing --no-semi --trailing-comma=es5 --write",
4+
"git add"
5+
]
6+
}

‎.travis.yml

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
sudo: false
2+
3+
language: node_js
4+
node_js: 8
5+
6+
before_install:
7+
- npm install codecov
8+
9+
after_success:
10+
- cat ./coverage/lcov.info | ./node_modules/.bin/codecov
11+
12+
branches:
13+
only:
14+
- master

‎CHANGELOG.md

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,38 @@
1-
# Changelog
1+
# 2.0.0 - 2017-18-10
22

3-
## 1.0.6 - 2017-08-24
3+
* Added: Nwb build
4+
* Update: Nwb build
5+
* Added: Tests
6+
* Added: styled-components dependency
7+
* Removed: classnames dependency
8+
9+
# 1.0.6 - 2017-08-24
410

511
* Changed: Import PropTypes from `prop-types` package
612
* Added: Yarn
713

8-
## 1.0.5 - 2015-07-09
14+
# 1.0.5 - 2015-07-09
915

1016
* Changed: webpack build
1117

12-
## 1.0.4 - 2015-07-08
18+
# 1.0.4 - 2015-07-08
1319

1420
* Added: webpack build
1521

16-
## 1.0.3 - 2015-07-03
22+
# 1.0.3 - 2015-07-03
1723

1824
* Added: fixed tooltip example
1925

20-
## 1.0.2 - 2015-07-02
26+
# 1.0.2 - 2015-07-02
2127

2228
* Changed: tooltips example screenshot
2329

24-
## 1.0.1 - 2015-07-02
30+
# 1.0.1 - 2015-07-02
2531

2632
* Changed: repository url in package.json
2733
* Added: Npm Badge in README
2834

29-
## 1.0.0 - 2015-07-01
35+
# 1.0.0 - 2015-07-01
3036

3137
* Initial release
3238

‎CONTRIBUTING.md

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
# Contributing
2+
3+
## Prerequisites
4+
5+
[Node.js](http://nodejs.org/) >= v4 must be installed.
6+
7+
## Installation
8+
9+
- Running `yarn` or `npm install` in the components's root directory will install everything you need for development.
10+
11+
## Demo Development Server
12+
13+
- `npm run demo:start` will run a development server with the component's demo app at [http://localhost:1190](http://localhost:1190) with hot module reloading.
14+
15+
## Linting
16+
17+
- `npm run lint` will lint the `src` and `demo/src` folders
18+
19+
## Running Tests
20+
21+
- `npm test` will run the tests once and produce a coverage report in `coverage/`.
22+
23+
- `npm run test:watch` will run the tests on every change.
24+
25+
## Building
26+
27+
- `npm run build` will build the component for publishing to npm and also bundle the demo app.
28+
29+
- `npm run clean` will delete built resources.
30+
31+
> **Builds:**
32+
> * CommonJS build => `/lib`,
33+
> * ES6 modules build => `/es`
34+
> * UMD build => `/umd`
35+
> * Demo build => `/demo/dist`

‎LICENCE renamed to ‎LICENCE.md

File renamed without changes.

‎README.md

Lines changed: 59 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -1,123 +1,88 @@
1-
# react-simple-tooltip ![npm](https://img.shields.io/npm/v/react-simple-tooltip.svg) ![license](https://img.shields.io/npm/l/react-simple-tooltip.svg) ![github-issues](https://img.shields.io/github/issues/xuopled/react-simple-tooltip.svg)
1+
# react-simple-tooltip
22

3-
A lightweight and simple tooltip component for React
3+
[![npm package][npm-badge]][npm]
4+
[![Travis][build-badge]][build]
5+
[![Codecov][codecov-badge]][codecov]
6+
![Module formats][module-formats]
47

5-
## Install
8+
A lightweight and simple tooltip component for React
69

7-
```sh
8-
npm install --save react-simple-tooltip
9-
```
10+
## Getting started
1011

1112
[![react-simple-tooltip](https://nodei.co/npm/react-simple-tooltip.png?downloads=true&downloadRank=true&stars=true)](https://nodei.co/npm/react-simple-tooltip/)
1213

13-
## Changelog
14+
You can download `react-simple-tooltip` from the NPM registry via the `npm` or `yarn` commands
1415

15-
See [changelog](./CHANGELOG.md)
16+
```shell
17+
yarn add react-simple-tooltip
18+
npm install react-simple-tooltip --save
19+
```
1620

17-
## Demo
21+
If you don't use package manager and you want to include `react-simple-tooltip` directly in your html, you could get it from the UNPKG CDN
1822

19-
http://xuopled.github.io/react-simple-tooltip/
23+
```html
24+
https://unpkg.com/react-simple-tooltip/dist/react-simple-tooltip.min.js.
25+
```
2026

2127
## Usage
2228

23-
### Examples
29+
```javascript
30+
import React from "react"
31+
import Tooltip from "react-simple-tooltip"
2432

25-
![Tooltip example](/screenshots/themed-tooltips.png)
33+
const App = () =>
34+
<Tooltip>
35+
<button>Hover me !</button>
36+
</Tooltip>
37+
```
2638

27-
#### Fixed Tooltip
39+
## Demo
2840

29-
```js
30-
import 'react-simple-tooltip/lib/index.css'
41+
See [Demo page][github-page]
3142

32-
import React from 'react'
33-
import Tooltip from 'react-simple-tooltip'
43+
## Props
3444

35-
export default class MyComponent {
36-
render() {
37-
return (
38-
<div>
39-
<Tooltip>
40-
<div>react-simple-tooltip</div>
41-
<div>By xuopled</div>
42-
</Tooltip>
43-
</div>
44-
)
45-
}
46-
}
47-
```
45+
|Name|PropType|Description|Default
46+
|---|---|---|---
47+
|arrow|PropTypes.number|Arrow size, in pixels|8
48+
|background|PropTypes.string|Tooltip background color|"#000"
49+
|border|PropTypes.string|Tooltip border color|"#000"
50+
|color|PropTypes.string|Tooltip text color|"#fff"
51+
|content|PropTypes.any.isRequired|Tooltip content|-
52+
|fixed|PropTypes.bool|Tooltip behavior, hover by default|false
53+
|fontFamily|PropTypes.bool|Tooltip text font-family|"inherit"
54+
|fontSize|PropTypes.bool|Tooltip text font-size|"inherit"
55+
|padding|PropTypes.number|Tooltip padding, in pixels|16
56+
|placement|PropTypes.oneOf(["left", "top", "right", "bottom"])|Tooltip placement|"top"
57+
|radius|PropTypes.number|Tooltip border radius|0
58+
|zIndex|PropTypes.number|Tooltip z-index|1
4859

49-
#### Hover Tooltip
50-
51-
```js
52-
import 'react-simple-tooltip/lib/index.css'
53-
54-
import React, { Component } from 'react'
55-
import Tooltip from 'react-simple-tooltip'
56-
57-
export default class MyComponent extends Component {
58-
constructor(props, context) {
59-
super(props, context)
60-
61-
this.state = {
62-
tooltipTrigger: null,
63-
}
64-
}
65-
66-
handleHover(trigger) {
67-
this.setState({
68-
tooltipTrigger: trigger,
69-
})
70-
}
71-
72-
render() {
73-
return (
74-
<div>
75-
{ this.state.tooltipTrigger
76-
? (
77-
<Tooltip placement="top" trigger={ this.state.tooltipTrigger }>
78-
<div>react-simple-tooltip</div>
79-
<div>By xuopled</div>
80-
</Tooltip>
81-
)
82-
: null
83-
}
84-
85-
86-
<RandomComponent
87-
onComponentHover={ ::this.handleHover }
88-
/>
89-
</div>
90-
)
91-
}
92-
}
93-
```
60+
## Contributing
9461

95-
### Props
62+
* ⇄ Pull/Merge requests and ★ Stars are always welcome.
63+
* For bugs and feature requests, please [create an issue][github-issue].
64+
* Pull requests must be accompanied by passing automated tests (`npm test`).
9665

97-
* `placement`: String - by default is right - one of ['top', 'right', 'bottom', 'left']
98-
* `theme`: String - by default is black - one of ['black', 'grey', 'blue', 'green', 'yellow', 'red']
99-
* `trigger`: React element - by default is null
66+
See [CONTRIBUTING.md](./CONTRIBUTING.md) guidelines
10067

101-
## Development
68+
## Changelog
10269

103-
### Clean `lib` folder
70+
See [CHANGELOG.md](./CHANGELOG.md)
10471

105-
```js
106-
npm run clean
107-
```
72+
## License
10873

109-
### Build `lib` folder
74+
This project is licensed under the MIT License - see the [LICENCE.md](./LICENCE.md) file for details
11075

111-
```js
112-
npm run build
113-
```
76+
[npm-badge]: https://img.shields.io/npm/v/react-simple-tooltip.svg?style=flat-square
77+
[npm]: https://www.npmjs.org/package/react-simple-tooltip
11478

115-
### Lint `src` folder
79+
[build-badge]: https://img.shields.io/travis/xuopled/react-simple-tooltip/master.svg?style=flat-square
80+
[build]: https://travis-ci.org/xuopled/react-simple-tooltip
11681

117-
```js
118-
npm run build
119-
```
82+
[codecov-badge]: https://img.shields.io/codecov/c/github/xuopled/react-simple-tooltip.svg?style=flat-square
83+
[codecov]: https://codecov.io/gh/xuopled/react-simple-tooltip
12084

121-
## License
85+
[module-formats]: https://img.shields.io/badge/module%20formats-umd%2C%20cjs%2C%20esm-green.svg?style=flat-square
12286

123-
See [MIT](./LICENCE)
87+
[github-page]: https://xuopled.github.io/react-simple-tooltip
88+
[github-issue]: https://github.com/xuopled/react-simple-tooltip/issues/new

‎demo/src/demo.md

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
## Description
2+
3+
`react-card-bank` checks your `number` prop and display on of these three folowwing logos if `number` is recognized ad credit card number:
4+
* Visa
5+
* MasterCard
6+
* Cb
7+
8+
You can hightlight specific field (to match with your form field).
9+
10+
> There is also the card verso displayed following `verso` prop.
11+
12+
## Demo

0 commit comments

Comments
 (0)