-
Notifications
You must be signed in to change notification settings - Fork 27
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
0 parents
commit 2383586
Showing
378 changed files
with
163,553 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
# http://editorconfig.org | ||
|
||
root = true | ||
|
||
[*] | ||
charset = utf-8 | ||
indent_style = space | ||
indent_size = 2 | ||
end_of_line = lf | ||
insert_final_newline = true | ||
trim_trailing_whitespace = true | ||
|
||
[*.md] | ||
insert_final_newline = false | ||
trim_trailing_whitespace = false |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,39 @@ | ||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. | ||
|
||
# dependencies | ||
node_modules | ||
/.pnp | ||
.pnp.js | ||
packages/visa-charts-demo/public/apidocs.json | ||
packages/visa-charts-demo/public/mono-packages.json | ||
packages/charts-react/src/mono-packages.json | ||
packages/charts-react-hooks/src/mono-packages.json | ||
|
||
# misc | ||
.DS_Store | ||
.env.local | ||
.env.development.local | ||
.env.test.local | ||
.env.production.local | ||
.idea/ | ||
visa-charts-lib/src/components.d.ts | ||
*.d.ts | ||
|
||
# react/angular binding auto-generated files | ||
packages/charts-angular*/src/directives/ | ||
packages/charts-react*/src/components/ | ||
|
||
npm-debug.log* | ||
yarn-debug.log* | ||
yarn-error.log* | ||
*-lock.json | ||
*-debug.log | ||
*yarn.lock | ||
.yo-rc.json | ||
|
||
dist/ | ||
www/ | ||
build/ | ||
.stencil/ | ||
coverage/ | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
*.lock | ||
**/node_modules/ | ||
**/public/ | ||
**/dist/ | ||
**/www/ | ||
**/.stencil/ | ||
**/*.lock | ||
**/*.log | ||
**/*.d.ts | ||
**/*.config.js | ||
**/*.editorconfig | ||
**/*.gitignore | ||
**/LICENSE | ||
**/LICENSE HEADER | ||
.prettierignore | ||
*.log | ||
**/*.png | ||
**/*.jpg | ||
**/*.ico | ||
**/*.svg | ||
**/*.prod | ||
**/*.staging | ||
**/build/ | ||
**/*.snap | ||
**/*.env |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
{ | ||
"printWidth": 120, | ||
"singleQuote": true, | ||
"useTabs": false, | ||
"tabWidth": 2, | ||
"trailingComma": "none", | ||
"bracketSpacing": true, | ||
"insertPragma": false, | ||
"jsxBracketSameLine": false, | ||
"semi": true, | ||
"requirePragma": false, | ||
"proseWrap": "preserve", | ||
"arrowParens": "avoid" | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,32 @@ | ||
{ | ||
"version": "0.2.0", | ||
"configurations": [ | ||
{ | ||
"type": "node", | ||
"request": "launch", | ||
"name": "E2E Test Current File", | ||
"cwd": "${workspaceFolder}", | ||
"program": "${workspaceFolder}/node_modules/.bin/stencil", | ||
"args": ["test", "--e2e", "${relativeFile}"], | ||
"console": "integratedTerminal", | ||
"internalConsoleOptions": "neverOpen", | ||
"disableOptimisticBPs": true, | ||
"skipFiles": ["${workspaceFolder}/node_modules/**/*.js", "<node_internals>/**/*.js"] | ||
}, | ||
{ | ||
"type": "node", | ||
"request": "launch", | ||
"name": "Spec Test Current File", | ||
"cwd": "${workspaceFolder}", | ||
"port": 9229, | ||
"runtimeExecutable": "node", | ||
"runtimeArgs": ["--inspect-brk"], | ||
"program": "${workspaceFolder}/node_modules/.bin/stencil", | ||
"args": ["test", "--spec", "--max-workers=1", "${relativeFile}"], | ||
"console": "integratedTerminal", | ||
"internalConsoleOptions": "neverOpen", | ||
"disableOptimisticBPs": true, | ||
"skipFiles": ["${workspaceFolder}/node_modules/**/*.js", "<node_internals>/**/*.js"] | ||
} | ||
] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,70 @@ | ||
# Contributing to Visa Chart Components | ||
|
||
Thank you for being a part of the Visa Chart Components (VCC) community. Before contributing (whether opening an issue or a PR), please read this document in its entirety. | ||
|
||
Whenever a ticket or PR is opened, we will do our best to get back to you and guide you through our contribution process. Below are a few guidelines that will help you along the way. | ||
|
||
## Contents | ||
|
||
- <a href="Reporting_Issues">Reporting Issues</a> | ||
- <a href="Opening_an_Issue">Opening an Issue</a> | ||
- <a href="Issue_Guidelines">Issue Guidelines</a> | ||
- <a href="Contributing_Code">Contributing Code</a> | ||
- <a href="Architecture_Philosophy">Architecture Philosophy</a> | ||
- <a href="Branching_Structure">Branching Structure</a> | ||
- <a href="Setup">Setup</a> | ||
- <a href="Commit_Messages_and_Pull_Requests">Commit Messages and Pull Requests</a> | ||
|
||
<hr> | ||
<br> | ||
|
||
## <a name="Reporting_Issues" href="Reporting_Issues">#</a> Reporting Issues | ||
|
||
If you think you have found a bug or issue or have a feature request please start by making sure it hasn't already been reported, fixed, or implemented. You can search through existing issues and PRs to see if someone has reported one similar to yours. | ||
|
||
### <a name="Opening_an_Issue" href="Opening_an_Issue">#</a> Opening an Issue | ||
|
||
If you have identified a bug, issue, or feature request that has no existing PRs or tickets, create a new issue that briefly explains the problem, and provides a bit of background as to the circumstances that triggered it, and steps to reproduce it. | ||
|
||
- For code issues please include: | ||
|
||
- `@visa/charts` library version or specific component (`@visa/bar-chart`) version | ||
- Browser and version | ||
- A code example, link to a repo, gist or running site. This will help us repro and identify the issue. | ||
|
||
- For visual or layout problems, using images or animated gifs can help explain your issue. | ||
|
||
- For feature requests please include a link to any relevant examples, a screenshot, or even a sketch of your requested feature. | ||
|
||
### <a name="Issue_Guidelines" href="Issue_Guidelines">#</a> Issue Guidelines | ||
|
||
- Begin the title with '[ComponentName]' where appropriate, and use a succinct description. "doesn't work" doesn't help others find similar issues. | ||
- Do not group multiple topics into one issue, but instead each should be its own issue. | ||
|
||
<hr> | ||
<br> | ||
|
||
## <a name="Contributing_Code" href="Contributing_Code">#</a> Contributing Code | ||
|
||
Before contributing code or opening a PR, please open a feature request or issue (see [above](#Reporting_Issues)). This will help us identify whether we have already addressed the feature or issue in an upcoming release and assess how the feature or fix fits into our release plan. | ||
|
||
### <a name="Architecture_Philosophy" href="Architecture_Philosophy">#</a> Architecture Philosophy | ||
|
||
VCC is a well organized **_Monorepo_** for simplicity! | ||
The components are standard web components developed using Stencil can be reused directly in any web environment and/or framework. The development practices follows guardrails (_e.g. linting, testing etc._) to help maintain consistency and quality. | ||
|
||
### <a name="Branching_Structure" href="Branching_Structure">#</a> Branching Structure | ||
|
||
All stable releases are tagged on `master`. At any given time, `development` represents the latest development version of the library. Patches or hotfix releases are prepared on an independent branch. We will do our best to keep development branch in good shape, with tests passing at all times. | ||
|
||
### <a name="Setup" href="Setup">#</a> Setup | ||
|
||
1. Create an issue, if applicable, and then clone locally | ||
1. Create a branch off `development`. | ||
1. `yarn` or `npm install` | ||
1. `yarn bootstrap` or `npm run bootstrap` | ||
1. `yarn start` or `npm run start` | ||
|
||
### <a name="Commit_Messages_and_Pull_Requests" href="Commit_Messages_and_Pull_Requests">#</a> Commit Messages and Pull Requests | ||
|
||
This library needs to follow the [Conventional Commit specification](https://conventionalcommits.org/) with an addition of **Ticket/Issue Numbers**. Add your issue number to each commit message. Remember that your commit messages are going to be used in creating the `CHANGELOG.md` file, so let that thought guide you to create quality commit messages. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,19 @@ | ||
Copyright (c) Visa, Inc. | ||
|
||
Permission is hereby granted, free of charge, to any person obtaining a copy | ||
of this software and associated documentation files (the "Software"), to deal | ||
in the Software without restriction, including without limitation the rights | ||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell | ||
copies of the Software, and to permit persons to whom the Software is | ||
furnished to do so, subject to the following conditions: | ||
|
||
The above copyright notice and this permission notice shall be included in | ||
all copies or substantial portions of the Software. | ||
|
||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR | ||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, | ||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE | ||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER | ||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, | ||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN | ||
THE SOFTWARE. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
/** | ||
* Copyright (c) [YEARTOREPLACE] Visa, Inc. | ||
* | ||
* This source code is licensed under the MIT license | ||
* https://github.com/visa/visa-chart-components/blob/master/LICENSE | ||
* | ||
**/ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,132 @@ | ||
# Visa Chart Components | ||
|
||
![Image showing three examples of Visa Chart Components for demonstration purposes only.](docs/vcc-components.png 'clustered bar chart component') | ||
|
||
**Visa Chart Components (VCC)** is an accessibility focused, framework agnostic set of data experience design systems components for the web. VCC attempts to provide a toolset to enable developers to build equal data experiences for everyone, everywhere. | ||
|
||
Visa Chart Components (VCC) is provided under the [MIT license](LICENSE). | ||
|
||
<hr> | ||
|
||
### Installation Process: | ||
|
||
To use VCC in your projects run `yarn add @visa/charts`, or you can also install a single component by running `yarn add @visa/bar-chart`. We recommend leveraging bundles if you are going to install three (3) or more specific components for your project. | ||
|
||
While we do deliver React (`@visa/charts-react`) and Angular (`@visa/charts-angular`) bundles, VCC components are compiled to standard web components, leveraging [Stencil.js](https://stenciljs.com/) and can be reused directly in many web environments and/or frameworks. | ||
|
||
#### Bundles | ||
|
||
- [@visa/charts](packages/charts) (web components) | ||
- [@visa/charts-react](packages/charts-react) (react) | ||
- [@visa/charts-angular](packages/charts-angular) (angular) | ||
|
||
#### Components with `Ready` status | ||
|
||
- [@visa/bar-chart](packages/bar-chart) | ||
- [@visa/clustered-bar-chart](packages/clustered-bar-chart) | ||
- [@visa/stacked-bar-chart](packages/stacked-bar-chart) | ||
- [@visa/line-chart](packages/line-chart) | ||
- [@visa/pie-chart](packages/pie-chart) | ||
- [@visa/scatter-plot](packages/scatter-plot) | ||
- [@visa/heat-map](packages/heat-map) | ||
- [@visa/circle-packing](packages/circle-packing) | ||
- [@visa/parallel-plot](packages/parallel-plot) | ||
- [@visa/dumbbell-plot](packages/dumbbell-plot) | ||
- [@visa/world-map](packages/world-map) | ||
- [@visa/visa-charts-data-table](packages/data-table) | ||
|
||
#### Our utilities can also be leveraged directly | ||
|
||
- [@visa/visa-charts-utils](packages/utils) | ||
- [@visa/visa-charts-utils-dev](packages/utils-dev) | ||
|
||
<hr> | ||
|
||
### Development | ||
|
||
VCC is built as a monorepo containing a set of packages. These packages include specific chart components (e.g., `@visa/bar-chart`), our utilities (e.g., `@visa/visa-charts-utils`) as well as component bundles (e.g., `@visa/charts` or `@visa/charts-react`). | ||
|
||
##### Steps to get up and running for development | ||
|
||
_note: the initial install and build process can take some time._ | ||
|
||
- Clone the repo | ||
- run `yarn dev --i` to install the monorepo | ||
- run `yarn dev --b` to build the packages across the monorepo | ||
|
||
<br> | ||
|
||
##### Single component development | ||
|
||
For development work on a single component, we launch local stencil applications, which allow for faster development iterations and features like hot reloading. To run a single component development environment run the below command. _Note: these local/dev applications are not included in our builds._ | ||
|
||
`yarn dev --ibsw=@visa/<component-name>` | ||
|
||
The switches in the command relate to: | ||
|
||
- `i` = install the component | ||
- `b` = build the component | ||
- `sw` = start watching the component | ||
|
||
You can run `--ibsw`, `--bsw`, or `--sw` if you need to. You can also build packages together (once installed) using commands like: | ||
|
||
`yarn build --scope=@visa/visa-charts-utils && yarn build --scope=@visa/bar-chart` | ||
|
||
This can helpful if you are making changes to dependencies of the chart component, for example, our utilities package. | ||
|
||
<br> | ||
|
||
##### Running unit tests on a component | ||
|
||
We have built extensive unit testing out for some of our components and are working towards propagating this across the rest. To run unit tests the command is: | ||
|
||
`yarn dev --test=@visa/<component-name>` | ||
|
||
Also, in some cases, component snapshots may need to be updated after changes have been implemented on components themselves (take caution when updating testing snapshots). In this situation, run the update snapshot command as follows: | ||
|
||
`yarn dev --updateSnapshot=@visa/<component-name>` | ||
|
||
We use [vscode](https://code.visualstudio.com/) as our development environment, you can also leverage the built in debugging capability in this tool to evaluate the unit tests themselves. | ||
|
||
<br> | ||
|
||
##### Cleaning the repo | ||
|
||
_caution: this will require you to re-install the entire monorepo, which can take some time_ | ||
|
||
To clean repo we have clean command with options | ||
|
||
`yarn dev --c=<options>` | ||
|
||
Here, `<options>` can be | ||
|
||
`ALL`-- deletes all lock files, node_modules and build folders. | ||
|
||
`LOCK`-- deletes only lock files. | ||
|
||
`BUILD`-- deletes only build folders and files. | ||
|
||
`NODE`-- deletes only node_modules folder across repo. | ||
|
||
<hr> | ||
|
||
#### Credits | ||
|
||
You can find license information for all dependencies included in our build [here](packages/utils/src/utils/license.ts). Below is a list of key dependencies. | ||
|
||
- [d3.js](https://d3js.org/) | ||
- [stencil.js](https://stenciljs.com/) | ||
- [d3-svg-annotation](https://d3-annotation.susielu.com/) | ||
- [numeral.js](http://numeraljs.com/) | ||
- [node-uuid](https://github.com/uuidjs/uuid) | ||
- [ally.js](https://allyjs.io/) | ||
|
||
This project was/is built with tireless efforts from: | ||
|
||
- Chris DeMartini ([@visa](https://github.com/chris-demartini) / [personal](https://github.com/demartsc)) | ||
- Frank Elavsky ([@visa](https://github.com/frank-elavsky) / [personal](https://github.com/frankelavsky)) | ||
- Jaime Tanner ([@visa](https://github.com/jaime-tanner) / [personal](https://github.com/tannerjaime)) | ||
- Basavaraj Kabbure ([@visa](https://github.com/basav-kabbure) / [personal](https://github.com/basavarajk)) | ||
- Lilach Manheim ([personal](https://github.com/lmanheim)) | ||
- Tica Lin ([personal](https://github.com/ticahere)) | ||
- Akhil Gupta ([personal](https://github.com/akhil9tiet)) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
/** | ||
* Copyright (c) 2020 Visa, Inc. | ||
* | ||
* This source code is licensed under the MIT license | ||
* https://github.com/visa/visa-chart-components/blob/master/LICENSE | ||
* | ||
**/ | ||
const config = require('@commitlint/config-conventional'); | ||
|
||
module.exports = {extends: ['@commitlint/config-conventional'], | ||
rules: { | ||
'type-enum': [ | ||
2, | ||
'always', | ||
[ | ||
...config.rules['type-enum'][2], | ||
'wip' | ||
] | ||
] | ||
} | ||
}; |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Oops, something went wrong.