An example of moving required styling to classes so can be controlled with css

src/components/fields/SchemaField.js

@@ -14,7 +14,6 @@ import StringField from "./StringField";
 import UnsupportedField from "./UnsupportedField";
 import DescriptionField from "./DescriptionField";
 
-const REQUIRED_FIELD_SYMBOL = "*";
 const COMPONENT_TYPES = {
   "array":     ArrayField,
   "boolean":   BooleanField,
@@ -40,8 +39,8 @@ function getLabel(label, required, id) {
     return null;
   }
   return (
-    <label className="control-label" htmlFor={id}>
-      {required ? label + REQUIRED_FIELD_SYMBOL : label}
+    <label className={required ? "control-label control-label-required":"control-label"} htmlFor={id}>
+      {label}
     </label>
   );
 }

src/components/fields/TitleField.js

@@ -1,11 +1,8 @@
 import React, {PropTypes} from "react";
 
-const REQUIRED_FIELD_SYMBOL = "*";
-
 function TitleField(props) {
   const {id, title, required} = props;
-  const legend = required ? title + REQUIRED_FIELD_SYMBOL : title;
-  return <legend id={id}>{legend}</legend>;
+  return <legend id={id} className={required ? "legend-required":""}>{title}</legend>;
 }
 
 if (process.env.NODE_ENV !== "production") {

test/ObjectField_test.js

@@ -107,8 +107,8 @@ describe("ObjectField", () => {
       // Required field is <input type="text" required="">
       expect(node.querySelector("input[type=text]").getAttribute("required"))
         .eql("");
-      expect(node.querySelector(".field-string label").textContent)
-        .eql("Foo*");
+      expect(node.querySelector(".control-label-required").textContent)
+        .eql("Foo");
     });
 
     it("should fill fields with form data", () => {

test/TitleField_test.js

@@ -47,23 +47,22 @@ describe("TitleField", () => {
     expect(node.id).to.equal("sample_id");
   });
 
-  it("should include only title, when field is not required", () => {
+  it("should not add 'legend-required' class to the title, when field is not required", () => {
     const props = {
       title: "Field title",
       required: false
     };
     const {node} = createComponent(TitleFieldWrapper, props);
 
-    expect(node.textContent).to.equal(props.title);
+    expect(node.className).not.to.equal("legend-required");
   });
 
-  it("should add an asterisk to the title, when field is required", () => {
+  it("should add 'legend-required' class to the title, when field is required", () => {
     const props = {
       title: "Field title",
       required: true
     };
     const {node} = createComponent(TitleFieldWrapper, props);
-
-    expect(node.textContent).to.equal(props.title + "*");
+    expect(node.className).to.equal("legend-required");
   });
 });