Opencare Crown

Base

This library outputs all of antd v4.6.6. You can read their documentation to learn more about their components. Additionally, this library outputs all antd icons, plus the compatible package to make migrating from antd v3 easier.

All antd components can be imported from this library under the base opencare-crown like so:

import { Button, StarOutlined, Icon } from 'opencare-crown';

Styleguide

This library outputs our brand styleguide. Currently it includes our Digital Colors which can be imported like so:

import { colors } from 'opencare-crown/lib/styleguide';

Custom Components

Last but not least, this library supports the addition of custom components as we continue to grow our component library. Custom components can be imported into your app like so:

import { ComponentName } from 'opencare-crown/lib/custom';

Migrating your app to use this library

1. This library requires your app be using the following versions of prop-types, react, and react-dom:

"prop-types": "^15.7.2",
"react": "^16.13.1",
"react-dom": "^16.13.1"

2. Furthermore, this app has [email protected] as a dependency, so you'll need to remove antd completely from your app. Unfortunately it is not possible to maintain two versions of antd within your app. Thankfully, this library exports everything from antd, including the @ant-design/compatible package to make migration easier. Simply search for all instances of 'antd' in your app, and replace with 'opencare-crown' (Replace all imports basically).
3. If your package also uses @ant-design/icons or @ant-design/compatible you will need to remove those (and replace with this library).
4. Make sure you remove all instances of antd.less as it will no longer be needed.
5. Validating styling is what will take the most time in this migration (as it will need to be done manually). This library updated the hex values for various things like the primary-color, so you'll need to go through each page/flow and catch anything that might have broken. Also many of our apps layer custom styles on top of antd components - you will need to validate that these still work correctly.