Added colors to appointments BOD-393

client/src/components/form-items-formatted/colorpicker-form-item.component.jsx

@@ -0,0 +1,20 @@
+import React, { forwardRef } from "react";
+import { BlockPicker } from "react-color";
+//To be used as a form element only.
+
+const ColorPickerFormItem = ({ value, onChange, style, ...restProps }, ref) => {
+  const handleChangeComplete = (color) => {
+    if (onChange) onChange(color);
+  };
+
+  return (
+    <BlockPicker
+      {...restProps}
+      style={{ width: "100%", ...style }}
+      color={value}
+      triangle="hide"
+      onChangeComplete={handleChangeComplete}
+    />
+  );
+};
+export default forwardRef(ColorPickerFormItem);