{"id":20994095,"url":"https://github.com/tradeshift/tradeshift-ui","last_synced_at":"2025-05-14T21:30:44.134Z","repository":{"id":18346003,"uuid":"68007240","full_name":"Tradeshift/tradeshift-ui","owner":"Tradeshift","description":"The Tradeshift UI Library \u0026 Framework","archived":false,"fork":false,"pushed_at":"2025-04-25T18:36:27.000Z","size":35511,"stargazers_count":33,"open_issues_count":168,"forks_count":45,"subscribers_count":37,"default_branch":"master","last_synced_at":"2025-04-25T19:39:44.775Z","etag":null,"topics":["javascript","ui"],"latest_commit_sha":null,"homepage":"https://ui.tradeshift.com","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Tradeshift.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":".github/CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":".github/CODEOWNERS","security":null,"support":null,"governance":null,"roadmap":"ROADMAP.md","authors":null,"dei":null}},"created_at":"2016-09-12T12:33:23.000Z","updated_at":"2025-01-14T08:03:28.000Z","dependencies_parsed_at":"2023-02-16T18:02:13.847Z","dependency_job_id":"d7caf334-2de8-4931-940c-275d42ad823e","html_url":"https://github.com/Tradeshift/tradeshift-ui","commit_stats":null,"previous_names":[],"tags_count":215,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tradeshift%2Ftradeshift-ui","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tradeshift%2Ftradeshift-ui/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tradeshift%2Ftradeshift-ui/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tradeshift%2Ftradeshift-ui/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Tradeshift","download_url":"https://codeload.github.com/Tradeshift/tradeshift-ui/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254230746,"owners_count":22036230,"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":["javascript","ui"],"created_at":"2024-11-19T07:16:50.979Z","updated_at":"2025-05-14T21:30:39.123Z","avatar_url":"https://github.com/Tradeshift.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![travis.org Build Status](https://travis-ci.org/Tradeshift/tradeshift-ui.svg?branch=master)](https://travis-ci.org/Tradeshift/tradeshift-ui) [![devDependencies](https://img.shields.io/david/dev/Tradeshift/tradeshift-ui.svg?style=flat-square)](https://david-dm.org/Tradeshift/tradeshift-ui/?type=dev)\n\n---\n\n# [Tradeshift UI](https://ui.tradeshift.com)\n\nTradeshift UI is a UI library to help you create apps that implement the [Tradeshift Design Principles](https://ui.tradeshift.com/#design/). Check out our [documentation site](https://ui.tradeshift.com) to learn more about how it works and try out live code examples.\n\nIf you want to know about what the latest version is and what's new, check out our [releases page](http://github.com/Tradeshift/tradeshift-ui/releases).\n\nIf you'd like to submit a feature request or report a bug, go to our [issues pages](http://github.com/Tradeshift/tradeshift-ui/issues).\n\n## Installation\n\n1. Clone this repository\n1. Install [NodeJS](https://nodejs.org/), either LTS or current.\n1. Install the Grunt Command Line Utility globally.\n    - `npm install -g grunt-cli`\n1. Use the configured version of node\n    - `nvm use`\n1. Install the dependencies of this project.\n    - `npm install`\n\n## Usage (Local Development)\n\n1. Start the `grunt` script in the root of the repository.\n   - `grunt`\n1. Use [`http://localhost:10111/dist/ts.js`](`http://localhost:10111/dist/ts.js`) in your app running locally to initialize Tradeshift UI.\n1. Whenever you modify the source files, the script will rebuild the distribution files in `dist/` so you're always using the latest version.\n\n### Optional steps to run the documentation site locally\n\n1. Run `grunt dev` (instead of just `grunt`) and the documentantion website will open up on [`http://localhost:10114/`](http://localhost:10114/)\n1. Whenever you modify the source files, the script will rebuild the documentation so you're always using the latest version.\n\n### Maintaining the v11 branch\n\nCheck out the `v11` branch and create pull requests on that branch. Releasing: see [v11 instructions](/Tradeshift/tradeshift-ui/tree/v11#release--deployment).\n\n## Git Hooks\n\nWatch out, whenever you create a commit, the pre-commit hook will lint all staged files and it might commit all changes in each staged file, not just the staged lines.\n\n## Docs\n\nOur docs site is hosted by GitHub Pages at https://ui.tradeshift.com.\n\n## Release \u0026 Deployment\n\n### Manual Release:\n\n1. **Check out a feature branch**. Name it anything. The `master` branch is protected from being pushed to directly, and your code will get released to S3 but not to git/GitHub/npm.\n2. **`npm version ${increment || 'patch'}`**; Bumps the version in `package.json` and `package-lock.json`, and creates a commit and a tag for you. Examples: `npm version 12.8.4`, `npm version patch`, [see docs](https://docs.npmjs.com/cli/v8/commands/npm-version).\n3. **`nvm use`** (use the specified node and npm version)\n4. **`npm i`**\n5. **`npm run build`**\n6. **`npm run package-dist`**. That creates a `package.json` for the npm dist package.\n7. **`git push origin {branch}`**; pushes the newly created commit. Don't use a fork.\n8. **`git push origin {the new tag just created}`**. Example: `git push origin v12.8.4`. Run `git tag` to list tags and find the one just created.\n9. **Merge** the branch into the main branch, wait for the build to succeed. Then navigate to the tag on Github and create a release from it _(could be pre-release)_\n10. **Deploy** the files to S3 (no overwrites) running the Github action workflow \"Deploy to S3\". By default it will use the main branch. If you are releasing a `v11` release, you need to select that.\n11. Make sure you are logged in to npm (run **`npm login`**).\n12. **Use the right package registry**: You may have configured `@tradeshift:registry https://npm.pkg.github.com/` (run `npm config list` to check, `npm config delete @tradeshift:registry` to reset registry to default (registry.npmjs.org), `npm config set @tradeshift:registry https://npm.pkg.github.com/` to add it back). The package must be released to https://npm.pkg.github.com/, but if you want it to show up at https://www.npmjs.com/package/@tradeshift/tradeshift-ui, you must also publish using default/no config entry for `@tradeshift:registry`.\n13. Go to the dist dir: **`cd dist/npm`**. In there, run **`npm publish --tag {tag_name}`**. The tag name must be `next` for `v11` releases, `latest` or not specified for latest release. This pushes the package to registry. **Note the following**:\n  If the tagging goes wrong and a v11 release is marked as `latest` in npm (`npm show @tradeshift/tradeshift-ui` to check), run `npm dist-tag add @tradeshift/tradeshift-ui@{LATEST_TS-UI_RELEASE} latest` (again, be aware of `@tradeshift:registry` config).\n\n### Automatic Release\n\n**- Currently not working -**\n\nAlternatively, releasing can be started using one of the following commands (but release-it needs to be fixed):\n\n1. Create a new branch. It will not work on the main branch.\n\n2. Make sure you have the following environment variables set:\n\n```sh\nexport AWS_ACCESS_KEY_ID=[Your AWS access key id]\nexport AWS_SECRET_ACCESS_KEY=[Your AWS secret access key]\nexport GH_ACCESS_TOK=[Your GitHub personal access token]\n```\n\n3. Run one of the following commands:\n\n```sh\n# Let's say the current version is v10.0.0\n\n# npm dist-tag ls\n# latest: 10.0.0\n\n\t# Bump the patch version and release\n\t\u003e npm run release\n\n# npm dist-tag ls\n# latest: 10.0.1\n\n\t# Bump the minor version and release\n\t\u003e npm run release -- minor\n\n# npm dist-tag ls\n# latest: 10.1.0\n\n\t# Bump the major version and release\n\t\u003e npm run release -- major\n\n# npm dist-tag ls\n# latest: 11.0.0\n#\n\t# Bump the minor version and pre-release\n\t\u003e npm run prelease -- minor --preRelease=beta\n\n# npm dist-tag ls\n# latest: 11.0.0\n# next: 11.1.0-beta.0\n\n\t# Bump the major version and pre-release\n\t\u003e npm run prelease -- major --preRelease=beta\n\n# npm dist-tag ls\n# latest: 11.0.0\n# next: 12.0.0-beta.0\n\n\t# Bump the major version and pre-release\n\t\u003e npm run prelease -- --preRelease=rc\n\n# npm dist-tag ls\n# latest: 11.0.0\n# next: 12.0.0-rc.0\n```\n\nAny of these commands will essentially do the following steps:\n\n- `npm version ${increment || 'patch'}` # Bump the version and create a git tag\n- `grunt dist` # Generate distributable files\n- `npm run deploy-s3` # Deploy those files to S3 (no overwrites!)\n- `git push` # Push the newly created commit and tag to GitHub\n- Release to GitHub _(could be pre-release)_ # Mark the tag as a GitHub Release\n- `npm publish` _(tag is latest or next)_ # Push the package to registry.npmjs.org\n\n## Updating the docs\n\nWe serve the docs site from the `gh-pages` branch and all generated files are present in the `.gitignore` of the `master`-style branches. The `gh-pages` branch only contains these generated files, one folder for each major version since we introduced versioning to the docs (`v10`).\n\nMake sure you have the following environment variables set:\n\n```sh\nexport GH_USER_NAME=[Your GitHub username]\nexport GH_ACCESS_TOK=[Your GitHub personal access token]\n```\n\nRun `npm run gh-pages`, which will do the following:\n\n- `grunt dist` # Generate distributable files\n- `cd tasks` # This is actually the CWD of the gh-pages script\n- `git clone ${GH_USER_NAME}:${GH_ACCESS_TOK}@github:Tradeshift/tradeshift-ui -b gh-pages --single-branch` # Clone the gh-pages branch to a new folder\n- Create a `v${majorVersion}` folder and/or replace its contents\n- Push the changes to `origin/gh-pages-update`\n\nFrom here, you should create a PR against `gh-pages` to update the docs site and once it's merged, GitHub Pages will update.\n\n## Running tests\n\nMake sure you have a BrowserStack Automate account and have the following environment variables set:\n\n```sh\nexport BROWSERSTACK_USERNAME=[Your BrowserStack username]\nexport BROWSERSTACK_KEY=[Your BrowserStack key]\n```\n\nThen feel free to start running the tests as such:\n\n`npm test`\n\nThis command will run all the Jasmine tests for all UI Components through BrowserStack.\n\nWe're currently testing on the following browsers:\n\n- Google Chrome (latest, previous)\n- Mozilla Firefox (latest, previous)\n- Apple Safari (latest, previous)\n- Microsoft Edge (latest, previous)\n- IE11\n\n## Contribute\n\nIf you would like to contribute to our codebase, just fork the repo and make a PR.\n\n## License\n\n- You can always create forks on GitHub, submit Issues and Pull Requests.\n- You can only use Tradeshift-UI to make apps on a Tradeshift platform, e.g. tradeshift.com.\n- You can fix a bug until the bugfix is deployed by Tradeshift.\n- You can host Tradeshift UI yourself.\n- If you want to make a bigger change or just want to talk with us, reach out to our team here on GitHub.\n\nYou can read the full license agreement in the [LICENSE.md](https://github.com/Tradeshift/tradeshift-ui/blob/master/LICENSE.md).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftradeshift%2Ftradeshift-ui","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftradeshift%2Ftradeshift-ui","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftradeshift%2Ftradeshift-ui/lists"}