{"id":19741330,"url":"https://github.com/vegaprotocol/pennant","last_synced_at":"2025-04-30T06:30:34.020Z","repository":{"id":37835384,"uuid":"339120615","full_name":"vegaprotocol/pennant","owner":"vegaprotocol","description":"A charting library for Vega Console","archived":false,"fork":false,"pushed_at":"2024-10-31T23:04:03.000Z","size":11533,"stargazers_count":29,"open_issues_count":52,"forks_count":8,"subscribers_count":16,"default_branch":"main","last_synced_at":"2024-11-01T00:17:29.841Z","etag":null,"topics":["chart","charting-library","react","vega-protocol"],"latest_commit_sha":null,"homepage":"https://pennant.vega.xyz","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/vegaprotocol.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-02-15T15:28:34.000Z","updated_at":"2024-10-30T14:06:19.000Z","dependencies_parsed_at":"2024-02-19T14:47:58.375Z","dependency_job_id":"832926ad-5420-47e5-9e40-ad5943730b72","html_url":"https://github.com/vegaprotocol/pennant","commit_stats":{"total_commits":984,"total_committers":11,"mean_commits":89.45454545454545,"dds":0.4725609756097561,"last_synced_commit":"1b2b8867e3a659a8349113511f0bc9888c3d4355"},"previous_names":[],"tags_count":128,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vegaprotocol%2Fpennant","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vegaprotocol%2Fpennant/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vegaprotocol%2Fpennant/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vegaprotocol%2Fpennant/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vegaprotocol","download_url":"https://codeload.github.com/vegaprotocol/pennant/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":224200573,"owners_count":17272467,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["chart","charting-library","react","vega-protocol"],"created_at":"2024-11-12T01:25:49.549Z","updated_at":"2024-11-12T01:25:50.034Z","avatar_url":"https://github.com/vegaprotocol.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![CI status](https://github.com/vegaprotocol/pennant/actions/workflows/test.yml/badge.svg)](https://github.com/vegaprotocol/pennant/actions/workflows/test.yml)\n[![GitHub license](https://img.shields.io/npm/l/pennant?style=plastic)](https://github.com/vegaprotocol/pennant/blob/main/LICENSE)\n[![NPM](https://img.shields.io/npm/v/pennant?style=plastic\u0026color=green)](https://npmjs.com/package/pennant/)\n\n\u003cbr /\u003e\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://github.com/vegaprotocol/pennant\"\u003e\n    \u003cimg src=\"./assets/logo.svg\" alt=\"Logo\" width=\"256\" height=\"128\" style=\"image-rendering: pixelated;\"\u003e\n  \u003c/a\u003e\n\n  \u003ch3 align=\"center\"\u003ePennant\u003c/h3\u003e\n\n  \u003cp align=\"center\"\u003e\n    A React component library for visualising historical and streaming financial market data.\n  \u003c/p\u003e\n\n  \u003cp align=\"center\"\u003e\n    \u003cimg src=\"./assets/candle-chart-screenshot.png\" alt=\"Pennant chart\" width=\"940\"\u003e\n  \u003c/p\u003e\n\n  \u003cp align=\"center\"\u003e\n    \u003cimg src=\"./assets/depth-chart-screenshot.png\" alt=\"Pennant chart\" width=\"950\"\u003e\n  \u003c/p\u003e\n  \n  \u003cp align=\"center\"\u003e\n    \u003ca href=\"https://pennant.vega.xyz\"\u003eView Demo\u003c/a\u003e\n    ·\n    \u003ca href=\"https://github.com/vegaprotocol/pennant/issues\"\u003eReport Bug\u003c/a\u003e\n    ·\n    \u003ca href=\"https://github.com/vegaprotocol/pennant/issues\"\u003eRequest Feature\u003c/a\u003e\n  \u003c/p\u003e\n\u003c/p\u003e\n\n\u003cdetails open=\"open\"\u003e\n  \u003csummary\u003eTable of Contents\u003c/summary\u003e\n  \u003col\u003e\n    \u003cli\u003e\n      \u003ca href=\"#about-the-project\"\u003eAbout The Project\u003c/a\u003e\n    \u003c/li\u003e\n    \u003cli\u003e\n      \u003ca href=\"#getting-started\"\u003eGetting Started\u003c/a\u003e\n      \u003cul\u003e\n        \u003cli\u003e\u003ca href=\"#prerequisites\"\u003ePrerequisites\u003c/a\u003e\u003c/li\u003e\n        \u003cli\u003e\u003ca href=\"#installation\"\u003eInstallation\u003c/a\u003e\u003c/li\u003e\n      \u003c/ul\u003e\n    \u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"#usage\"\u003eUsage\u003c/a\u003e\u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"#contributing\"\u003eContributing\u003c/a\u003e\u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"#license\"\u003eLicense\u003c/a\u003e\u003c/li\u003e\n  \u003c/ol\u003e\n\u003c/details\u003e\n\n## About The Project\n\nA React chart component visualising historical and streaming financial market data. Built for the Vega platform but can be embedded in any application.\n\n## Getting Started\n\nPennant is available from npm.\n\n### Prerequisites\n\nPennant has `react` and `react-dom` as peer dependencies.\n\n```sh\nyarn add react react-dom\n```\n\n### Installation\n\n```sh\nyarn add pennant\n```\n\n## Usage\n\n```jsx\nimport React from \"react\";\nimport { CandlestickChart } from \"pennant\";\n\nconst dataSource = new DataSource();\nconst options = {\n  chartType: \"candle\",\n  studies: [],\n  overlays: [],\n};\n\nexport const App = () =\u003e (\n  \u003cCandlestickChart dataSource={dataSource} options={options} interval=\"I1M\" /\u003e\n);\n```\n\nThe minimum props required are:\n\n- dataSource\n- options\n- interval\n\n### Styling pennant\n\nYou may customize the styling of pennant components by overriding the default CSS variables.\n\n```css\n/**\n * You can override the default pennant variables.\n * Note: this is not a complete list of --pennant- variables.\n */\n:root {\n  --pennant-color-success: #26ff8a;\n  --pennant-color-danger: #ff261a;\n}\n```\n\n## Data\n\nPennant displays financial data using a DataSource object you pass as a prop to the React CandlestickChart component. This object must implement the DataSource interface, and typically takes the form of a class.\n\nIt provides a set of methods such as `query` and `subscribe` which will be called by the chart to get historical and streaming data respectively.\n\nSeveral reference implementations are provided.\n\n## Contributing\n\n### Development\n\nWe use [Storybook](https://storybook.js.org/).\n\n```sh\nyarn storybook\n```\n\nOpen [http://localhost:6006](http://localhost:6006) to view in the browser.\n\nWe try our best to follow the [Conventional Commits](https://www.conventionalcommits.org/) specification. This lets use [standard-version](https://github.com/conventional-changelog/standard-version) for semantic versioning and CHANGELOG generation.\n\n### Building\n\nTo build the library run\n\n```sh\nyarn build\n```\n\nThe output can be found in the `dist` directory.\n\n### Testing\n\nTo run the tests\n\n```sh\nyarn test\n```\n\n### Releasing a new version\n\nWe use [standard-version](https://github.com/conventional-changelog/standard-version) for semantic versioning and CHANGELOG generation.\nAs long as your git commit messages are conventional and accurate, you no longer need to specify the semver type. It will be calculated for you.\nAn npm script is provided for convenience.\n\n```sh\nyarn release\n```\n\nIf successful you can push up the new commit and tag with\n\n```sh\ngit push --follow-tags origin main\n```\n\nTo release as a pre-release use the flag `--prerelease`.\n\n```sh\nyarn release -- --prerelease alpha --release-as minor\n```\n\n### Adding a new chart type\n\nAdd the new chart type in `chart-types.ts`. Add a new case in `helpers-spec.ts` which specifies how to draw the new chart type.\n\n## License\n\nPennant is available under the [MIT license](https://opensource.org/licenses/MIT).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvegaprotocol%2Fpennant","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvegaprotocol%2Fpennant","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvegaprotocol%2Fpennant/lists"}