Refactor certain components that set css classes with dynamic values to have explicit prop types

For example the Identifier.js component sets the class fd-identifier--${size} however, the size variables prop type validation is size: PropTypes.string. Ideally this would be an explicit range of values so that consumers are warned if they provide a value to to size that isn’t valid css. There are a few options to do this, but at SAP Concur we have abstracted out these values into arrays in their own file like so

...
export const MESSAGEBAR_TYPES = [
    'success',
    'info',
    'warning',
    'error'
];

export const MESSAGEBOX_TYPES = [
    'confirm',
    'error',
    'info',
    'success',
    'warning'
];

export const BUTTON_TYPES = [
    'default',
    'primary',
    'secondary',
    'create',
    'success',
    'info',
    'warning',
    'danger',
    'link'
];
...

and then we import them into components where they are needed.

[chrismanciero]

👍 Sounds like a good idea.

[mobot11]

@droshev I still think we can move forward with this piece of work. If we end up having to change / remove some of the values we will able to change them in a central location instead of having to dig through all of the separate components.