Updated code, and snapshots

src/core/client/ui/components/ValidationMessage/ValidationMessage.css

@@ -1,5 +1,5 @@
 .root {
-  composes: validationMessage from "talk-ui/shared/typography.css";
+  composes: alertMessage from "talk-ui/shared/typography.css";
   position: relative;
   display: inline-flex;
   justify-content: flex-start;

src/core/client/ui/components/ValidationMessage/ValidationMessage.spec.tsx

@@ -8,7 +8,6 @@ import ValidationMessage from "./ValidationMessage";
 it("renders correctly", () => {
   const props: PropTypesOf<typeof ValidationMessage> = {
     className: "custom",
-    color: "error",
     children: "Hello World",
   };
   const renderer = TestRenderer.create(<ValidationMessage {...props} />);

src/core/client/ui/components/ValidationMessage/__snapshots__/ValidationMessage.spec.tsx.snap

@@ -3,7 +3,6 @@
 exports[`renders correctly 1`] = `
 <div
   className="ValidationMessage-root ValidationMessage-colorError custom"
-  color="error"
 >
   <span
     className="Icon-root ValidationMessage-icon Icon-sm"