Skip to content

Commit

Permalink
Merge pull request #133 from Yoctol/typescript
Browse files Browse the repository at this point in the history
migrate to TypeScript
  • Loading branch information
chentsulin authored Sep 1, 2021
2 parents 85ba7a4 + d99715c commit f27de9f
Show file tree
Hide file tree
Showing 16 changed files with 7,495 additions and 213 deletions.
12 changes: 6 additions & 6 deletions .babelrc.js
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
module.exports = {
presets: ['@babel/preset-env', '@babel/preset-react'],
env: {
production: {
ignore: [/__tests__/],
},
},
presets: [
'@babel/preset-env',
'@babel/preset-react',
'@babel/preset-typescript',
],
plugins: ['babel-plugin-typescript-to-proptypes'],
};
2 changes: 1 addition & 1 deletion .editorconfig
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true

[*.{json,js,yml,css,html}]
[*.{json,js,jsx,ts,tsx,yml,css,html}]
indent_style = space
indent_size = 2

Expand Down
34 changes: 31 additions & 3 deletions .eslintrc.js
Original file line number Diff line number Diff line change
@@ -1,12 +1,40 @@
module.exports = {
parser: 'babel-eslint',
extends: 'yoctol',
parserOptions: {
ecmaFeatures: {
jsx: true,
},
},
parser: '@typescript-eslint/parser',
extends: [
'yoctol',
'plugin:import/typescript',
'plugin:@typescript-eslint/recommended',
],
env: {
node: true,
jest: true,
browser: true,
},
rules: {
'react/sort-prop-types': 'off',
'no-use-before-define': 'off',
'@typescript-eslint/no-use-before-define': ['error'],
'import/extensions': [
'error',
'ignorePackages',
{
js: 'never',
jsx: 'never',
ts: 'never',
tsx: 'never',
},
],
'react/jsx-filename-extension': ['error', { extensions: ['.jsx', '.tsx'] }],
},
settings: {
'import/resolver': {
node: {
extensions: ['.js', '.jsx', '.ts', '.tsx'],
},
},
},
};
5 changes: 4 additions & 1 deletion .github/workflows/ci.yml
Original file line number Diff line number Diff line change
Expand Up @@ -28,12 +28,15 @@ jobs:
- name: Lint ESLint
run: npm run lint

- name: Type Check
run: npm run check

test:
name: Run tests on Node v${{ matrix.node_version_to_setup }}
runs-on: ubuntu-latest
strategy:
matrix:
node_version_to_setup: [10, 12, 14, 16]
node_version_to_setup: [12, 14, 16]
steps:
- name: Checkout repo
uses: actions/checkout@v2
Expand Down
34 changes: 17 additions & 17 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -84,23 +84,23 @@ for more detailed props, please refer to below:

## Props

| name | description | type | required | default |
| --------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------- | -------- | --------------------------------------------- |
| data | The words array | `{ text: string, value: number }>[]` ||
| width | Width of the layout (px) | `number` | | `700` |
| height | Height of the layout (px) | `number` | | `600` |
| font | The font accessor function, which indicates the font face for each word. A constant may be specified instead of a function. | `string \| (d) => string` | | `'serif'` |
| fontStyle | The fontStyle accessor function, which indicates the font style for each word. A constant may be specified instead of a function. | `string \| (d) => string` | | `'normal'` |
| fontWeight | The fontWeight accessor function, which indicates the font weight for each word. A constant may be specified instead of a function. | `string \| (d) => string` | | `'normal'` |
| fontSize | The fontSize accessor function, which indicates the numerical font size for each word. | `(d) => number` | | `(d) => Math.sqrt(d.value)` |
| rotate | The rotate accessor function, which indicates the rotation angle (in degrees) for each word. | `(d) => number` | | `() => (~~(Math.random() * 6) - 3) * 30` |
| spiral | The current type of spiral used for positioning words. This can either be one of the two built-in spirals, "archimedean" and "rectangular", or an arbitrary spiral generator can be used | `string \| ([width, height]) => t => [x, y]` | | `'archimedean'` |
| padding | The padding accessor function, which indicates the numerical padding for each word. | `number \| (d) => number` | | `1` |
| random | The internal random number generator, used for selecting the initial position of each word, and the clockwise/counterclockwise direction of the spiral for each word. This should return a number in the range `[0, 1)`. | `(d) => number` | | `Math.random` |
| fill | The fill accessor function, which indicates the color for each word. | `(d, i) => string` | | `(d, i) => scaleOrdinal(schemeCategory10)(i)` |
| onWordClick | The function will be called when `click` event is triggered on a word | `word => {}` | | null |
| onWordMouseOver | The function will be called when `mouseover` event is triggered on a word | `word => {}` | | null |
| onWordMouseOut | The function will be called when `mouseout` event is triggered on a word | `word => {}` | | null |
| name | description | type | required | default |
| --------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------- | -------- | --------------------------------------------- |
| data | The words array | `{ text: string, value: number }>[]` ||
| width | Width of the layout (px) | `number` | | `700` |
| height | Height of the layout (px) | `number` | | `600` |
| font | The font accessor function, which indicates the font face for each word. A constant may be specified instead of a function. | `string \| (d) => string` | | `'serif'` |
| fontStyle | The fontStyle accessor function, which indicates the font style for each word. A constant may be specified instead of a function. | `string \| (d) => string` | | `'normal'` |
| fontWeight | The fontWeight accessor function, which indicates the font weight for each word. A constant may be specified instead of a function. | `string \| number \| (d) => string \| number` | | `'normal'` |
| fontSize | The fontSize accessor function, which indicates the numerical font size for each word. | `(d) => number` | | `(d) => Math.sqrt(d.value)` |
| rotate | The rotate accessor function, which indicates the rotation angle (in degrees) for each word. | `(d) => number` | | `() => (~~(Math.random() * 6) - 3) * 30` |
| spiral | The current type of spiral used for positioning words. This can either be one of the two built-in spirals, "archimedean" and "rectangular", or an arbitrary spiral generator can be used | `'archimedean' \| 'rectangular' \| ([width, height]) => t => [x, y]` | | `'archimedean'` |
| padding | The padding accessor function, which indicates the numerical padding for each word. | `number \| (d) => number` | | `1` |
| random | The internal random number generator, used for selecting the initial position of each word, and the clockwise/counterclockwise direction of the spiral for each word. This should return a number in the range `[0, 1)`. | `(d) => number` | | `Math.random` |
| fill | The fill accessor function, which indicates the color for each word. | `(d, i) => string` | | `(d, i) => scaleOrdinal(schemeCategory10)(i)` |
| onWordClick | The function will be called when `click` event is triggered on a word | `word => {}` | | null |
| onWordMouseOver | The function will be called when `mouseover` event is triggered on a word | `word => {}` | | null |
| onWordMouseOut | The function will be called when `mouseout` event is triggered on a word | `word => {}` | | null |

## FAQ

Expand Down
4 changes: 2 additions & 2 deletions lint-staged.config.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
module.exports = {
'*.js': ['eslint --fix'],
'*.md': ['prettier --write'],
'*package.json': ['prettier-package-json --write'],
'*.(js|ts)': ['eslint --fix'],
'*.(md|json|yml)': ['prettier --write'],
};
Loading

0 comments on commit f27de9f

Please sign in to comment.