@opentripplanner/location-field v2.0.16
OTP-UI React Component Library
Description
React component library, which can be used to build trip planner webapps. See https://github.com/opentripplanner/otp-react-redux for a reference implementation of otp-ui (IMPORTANT: WIP / TBD...on using otp-ui in otp-rr). See https://www.npmjs.com/org/opentripplanner for current releases.
Getting Started
git checkout
yarn install
yarn build
yarn dev
Storybook Demo
Stack
A Monorepo with multiple packages and a shared build, test, and release process.
- π Lerna β- The Monorepo manager
- π¦ Yarn Workspacesβ - βSane multi-package management
- π Reactβ - βJavaScript library for user interfaces
- π styled-componentsβ -β CSS in JS elegance
- π Babelβ - βCompiles next-gen JavaScript
- π Storybook - UI Component Environment
- π Jestβ -β Unit/Snapshot Testing
Usage
yarn dev
- This starts Storybook for viewing all the components locally.yarn bootstrap
- This installs all of the packages and links dependent packages together.yarn build
- This babelfies all of the packages and creates/lib
folders for each one.yarn unit
- Run jest unit tests.yarn coverage
- Shows jest unit coverage.
Lerna
lerna changed
- Show which packages have changed.lerna diff
- Show specifically what files have cause the packages to change.lerna create <packageName>
- Creates new package and walks through setting up package.json
Lerna Publish to NPM
Some commands you might need to execute for npm:
npm login
npm config set access public
npx lerna publish
Linking
When linking inside of the Monorepo, everything works as expected. If you are trying to consume packages from this Monorepo in a different application locally, using npm link
or yarn link
does not work as expected. However, we have a workaround for the time being.
- Run
yarn build
- Run
yarn dev
- Change the
package.json
of the consumer from$YOUR_PACKAGE_NAME
(which lives inside the monorepo) tofile:./../monorepo/packages/$YOUR_PACKAGE_NAME
- Run
rm -rf node_modules && yarn
in the consumer - π
Contributing
All formatting and linting should be taken care of for you using stylelint, ESLint, and Prettier. You should also consider installing an extension for CSS syntax highlighting.
2 months ago
2 months ago
3 months ago
3 months ago
5 months ago
10 months ago
10 months ago
10 months ago
10 months ago
8 months ago
9 months ago
6 months ago
8 months ago
10 months ago
8 months ago
6 months ago
7 months ago
6 months ago
8 months ago
9 months ago
7 months ago
11 months ago
12 months ago
11 months ago
1 year ago
1 year ago
12 months ago
12 months ago
11 months ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago