From da38cd444ace143404206873ea9b5a9b9c16ffb6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Se=CC=81rgio=20Ramos?= <mail@sergioramos.me>
Date: Wed, 17 Jan 2018 19:40:10 +0000
Subject: [PATCH] test: update snapshots

---
 .../__snapshots__/icons.spec.js.snap          | 12849 +++++++-------
 packages/icons/src/__tests__/icons.spec.js    |   899 +-
 .../__snapshots__/affinity.spec.js.snap       |   104 +-
 .../__tests__/__snapshots__/cns.spec.js.snap  |    57 +-
 .../__snapshots__/images.spec.js.snap         |    68 +-
 .../__tests__/__snapshots__/name.spec.js.snap |    94 +-
 .../__snapshots__/network.spec.js.snap        |  1454 +-
 .../__snapshots__/package.spec.js.snap        |   213 +-
 .../__snapshots__/title.spec.js.snap          |     2 +
 .../__snapshots__/key-value.spec.js.snap      |  1355 +-
 .../__tests__/__snapshots__/list.spec.js.snap |  2685 ++-
 .../__snapshots__/metadata.spec.js.snap       |   250 +-
 .../__snapshots__/snapshots.spec.js.snap      |  1940 ++-
 .../__snapshots__/summary.spec.js.snap        |  5033 +++---
 .../__tests__/__snapshots__/tags.spec.js.snap |   310 +-
 .../__snapshots__/toolbar.spec.js.snap        |   434 +-
 .../__snapshots__/header.spec.js.snap         |   384 -
 .../__tests__/__snapshots__/menu.spec.js.snap |    14 +-
 .../navigation/__tests__/header.spec.js       |    18 -
 .../__snapshots__/metadata.spec.js.snap       |   772 +-
 .../__snapshots__/networks.spec.js.snap       |   725 +-
 .../__tests__/__snapshots__/tag.spec.js.snap  |   222 +-
 .../__tests__/__snapshots__/list.spec.js.snap | 14007 ++++++++--------
 .../__snapshots__/metadata.spec.js.snap       |  1228 +-
 .../__snapshots__/summary.spec.js.snap        |  1762 +-
 .../__tests__/__snapshots__/tags.spec.js.snap |  1868 ++-
 .../__snapshots__/breadcrumb.spec.js.snap     |   123 +-
 .../__snapshots__/index.spec.js.snap          |    65 +-
 .../__snapshots__/footer.spec.js.snap         |    24 +-
 packages/ui-toolkit/src/footer/index.js       |    40 +-
 .../__tests__/__snapshots__/form.spec.js.snap |     4 +-
 .../__snapshots__/message.spec.js.snap        |     3 +
 32 files changed, 24830 insertions(+), 24176 deletions(-)
 delete mode 100644 packages/my-joy-beta/src/components/navigation/__tests__/__snapshots__/header.spec.js.snap
 delete mode 100644 packages/my-joy-beta/src/components/navigation/__tests__/header.spec.js

diff --git a/packages/icons/src/__tests__/__snapshots__/icons.spec.js.snap b/packages/icons/src/__tests__/__snapshots__/icons.spec.js.snap
index 46b49f67..64bed9f8 100644
--- a/packages/icons/src/__tests__/__snapshots__/icons.spec.js.snap
+++ b/packages/icons/src/__tests__/__snapshots__/icons.spec.js.snap
@@ -1,9515 +1,10422 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders <Actions /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 4 16"
     width="4"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#464646"
-      fill-rule="evenodd"
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#464646"
+        fill-rule="evenodd"
     />
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#464646"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "translateY(0.375rem)",
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#464646"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "translateY(0.375rem)",
+              }
         }
-      }
     />
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#464646"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "translateY(0.75rem)",
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#464646"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "translateY(0.75rem)",
+              }
         }
-      }
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 4 16"
     width="4"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#FFF"
-      fill-rule="evenodd"
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#FFF"
+        fill-rule="evenodd"
     />
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#FFF"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "translateY(0.375rem)",
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#FFF"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "translateY(0.375rem)",
+              }
         }
-      }
     />
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#FFF"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "translateY(0.75rem)",
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#FFF"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "translateY(0.75rem)",
+              }
         }
-      }
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 4 16"
     width="4"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill={true}
-      fill-rule="evenodd"
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill={undefined}
+        fill-rule="evenodd"
     />
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill={true}
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "translateY(0.375rem)",
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill={undefined}
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "translateY(0.375rem)",
+              }
         }
-      }
     />
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill={true}
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "translateY(0.75rem)",
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill={undefined}
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "translateY(0.75rem)",
+              }
         }
-      }
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 4 16"
     width="4"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#464646"
-      fill-rule="evenodd"
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#464646"
+        fill-rule="evenodd"
     />
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#464646"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "translateY(0.375rem)",
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#464646"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "translateY(0.375rem)",
+              }
         }
-      }
     />
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#464646"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "translateY(0.75rem)",
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#464646"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "translateY(0.75rem)",
+              }
         }
-      }
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 4 16"
     width="4"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#464646"
-      fill-rule="evenodd"
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#464646"
+        fill-rule="evenodd"
     />
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#464646"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "translateY(0.375rem)",
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#464646"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "translateY(0.375rem)",
+              }
         }
-      }
     />
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#464646"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "translateY(0.75rem)",
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#464646"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "translateY(0.75rem)",
+              }
         }
-      }
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 4 16"
     width="4"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#464646"
-      fill-rule="evenodd"
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#464646"
+        fill-rule="evenodd"
     />
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#464646"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "translateY(0.375rem)",
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#464646"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "translateY(0.375rem)",
+              }
         }
-      }
     />
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#464646"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "translateY(0.75rem)",
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#464646"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "translateY(0.75rem)",
+              }
         }
-      }
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 4 16"
     width="4"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#464646"
-      fill-rule="evenodd"
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#464646"
+        fill-rule="evenodd"
     />
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#464646"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "translateY(0.375rem)",
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#464646"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "translateY(0.375rem)",
+              }
         }
-      }
     />
     <path
-      d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-      fill="#464646"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "translateY(0.75rem)",
+        d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+        fill="#464646"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "translateY(0.75rem)",
+              }
         }
-      }
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Affinity /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 12"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1104 1236)"
+        transform="translate(-1104 1236)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1104 -1236)"
-            xlinkHref="#b"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1104 -1236)"
+                    xlinkHref="#b"
+                />
+            </g>
         </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 12 0C 10.9 0 9.9 0.300003 9 0.800003C 8.1 0.300003 7.1 0 6 0C 2.7 0 0 2.7 0 6C 0 9.3 2.7 12 6 12C 7.1 12 8.1 11.7 9 11.2C 9.9 11.7 10.9 12 12 12C 15.3 12 18 9.3 18 6C 18 2.7 15.3 0 12 0ZM 6 11C 3.2 11 1 8.8 1 6C 1 3.2 3.2 1 6 1C 6.7 1 7.4 1.2 8.1 1.5C 6.8 2.6 6 4.2 6 6C 6 7.8 6.8 9.4 8.1 10.5C 7.4 10.8 6.7 11 6 11ZM 11 6C 11 7.6 10.2 9.1 9 10C 7.8 9.1 7 7.7 7 6C 7 4.3 7.8 2.9 9 2C 10.2 2.9 11 4.4 11 6ZM 12 11C 11.3 11 10.6 10.8 9.9 10.5C 11.2 9.4 12 7.8 12 6C 12 4.2 11.2 2.6 9.9 1.5C 10.5 1.2 11.2 1 12 1C 14.8 1 17 3.2 17 6C 17 8.8 14.8 11 12 11Z"
-        id="b"
-      />
+        <path
+            d="M 12 0C 10.9 0 9.9 0.300003 9 0.800003C 8.1 0.300003 7.1 0 6 0C 2.7 0 0 2.7 0 6C 0 9.3 2.7 12 6 12C 7.1 12 8.1 11.7 9 11.2C 9.9 11.7 10.9 12 12 12C 15.3 12 18 9.3 18 6C 18 2.7 15.3 0 12 0ZM 6 11C 3.2 11 1 8.8 1 6C 1 3.2 3.2 1 6 1C 6.7 1 7.4 1.2 8.1 1.5C 6.8 2.6 6 4.2 6 6C 6 7.8 6.8 9.4 8.1 10.5C 7.4 10.8 6.7 11 6 11ZM 11 6C 11 7.6 10.2 9.1 9 10C 7.8 9.1 7 7.7 7 6C 7 4.3 7.8 2.9 9 2C 10.2 2.9 11 4.4 11 6ZM 12 11C 11.3 11 10.6 10.8 9.9 10.5C 11.2 9.4 12 7.8 12 6C 12 4.2 11.2 2.6 9.9 1.5C 10.5 1.2 11.2 1 12 1C 14.8 1 17 3.2 17 6C 17 8.8 14.8 11 12 11Z"
+            id="b"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 12"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1104 1236)"
+        transform="translate(-1104 1236)"
     >
-      <g>
         <g>
-          <use
-            fill="#FFF"
-            transform="translate(1104 -1236)"
-            xlinkHref="#b"
-          />
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(1104 -1236)"
+                    xlinkHref="#b"
+                />
+            </g>
         </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 12 0C 10.9 0 9.9 0.300003 9 0.800003C 8.1 0.300003 7.1 0 6 0C 2.7 0 0 2.7 0 6C 0 9.3 2.7 12 6 12C 7.1 12 8.1 11.7 9 11.2C 9.9 11.7 10.9 12 12 12C 15.3 12 18 9.3 18 6C 18 2.7 15.3 0 12 0ZM 6 11C 3.2 11 1 8.8 1 6C 1 3.2 3.2 1 6 1C 6.7 1 7.4 1.2 8.1 1.5C 6.8 2.6 6 4.2 6 6C 6 7.8 6.8 9.4 8.1 10.5C 7.4 10.8 6.7 11 6 11ZM 11 6C 11 7.6 10.2 9.1 9 10C 7.8 9.1 7 7.7 7 6C 7 4.3 7.8 2.9 9 2C 10.2 2.9 11 4.4 11 6ZM 12 11C 11.3 11 10.6 10.8 9.9 10.5C 11.2 9.4 12 7.8 12 6C 12 4.2 11.2 2.6 9.9 1.5C 10.5 1.2 11.2 1 12 1C 14.8 1 17 3.2 17 6C 17 8.8 14.8 11 12 11Z"
-        id="b"
-      />
+        <path
+            d="M 12 0C 10.9 0 9.9 0.300003 9 0.800003C 8.1 0.300003 7.1 0 6 0C 2.7 0 0 2.7 0 6C 0 9.3 2.7 12 6 12C 7.1 12 8.1 11.7 9 11.2C 9.9 11.7 10.9 12 12 12C 15.3 12 18 9.3 18 6C 18 2.7 15.3 0 12 0ZM 6 11C 3.2 11 1 8.8 1 6C 1 3.2 3.2 1 6 1C 6.7 1 7.4 1.2 8.1 1.5C 6.8 2.6 6 4.2 6 6C 6 7.8 6.8 9.4 8.1 10.5C 7.4 10.8 6.7 11 6 11ZM 11 6C 11 7.6 10.2 9.1 9 10C 7.8 9.1 7 7.7 7 6C 7 4.3 7.8 2.9 9 2C 10.2 2.9 11 4.4 11 6ZM 12 11C 11.3 11 10.6 10.8 9.9 10.5C 11.2 9.4 12 7.8 12 6C 12 4.2 11.2 2.6 9.9 1.5C 10.5 1.2 11.2 1 12 1C 14.8 1 17 3.2 17 6C 17 8.8 14.8 11 12 11Z"
+            id="b"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 12"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1104 1236)"
+        transform="translate(-1104 1236)"
     >
-      <g>
         <g>
-          <use
-            fill={true}
-            transform="translate(1104 -1236)"
-            xlinkHref="#b"
-          />
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(1104 -1236)"
+                    xlinkHref="#b"
+                />
+            </g>
         </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 12 0C 10.9 0 9.9 0.300003 9 0.800003C 8.1 0.300003 7.1 0 6 0C 2.7 0 0 2.7 0 6C 0 9.3 2.7 12 6 12C 7.1 12 8.1 11.7 9 11.2C 9.9 11.7 10.9 12 12 12C 15.3 12 18 9.3 18 6C 18 2.7 15.3 0 12 0ZM 6 11C 3.2 11 1 8.8 1 6C 1 3.2 3.2 1 6 1C 6.7 1 7.4 1.2 8.1 1.5C 6.8 2.6 6 4.2 6 6C 6 7.8 6.8 9.4 8.1 10.5C 7.4 10.8 6.7 11 6 11ZM 11 6C 11 7.6 10.2 9.1 9 10C 7.8 9.1 7 7.7 7 6C 7 4.3 7.8 2.9 9 2C 10.2 2.9 11 4.4 11 6ZM 12 11C 11.3 11 10.6 10.8 9.9 10.5C 11.2 9.4 12 7.8 12 6C 12 4.2 11.2 2.6 9.9 1.5C 10.5 1.2 11.2 1 12 1C 14.8 1 17 3.2 17 6C 17 8.8 14.8 11 12 11Z"
-        id="b"
-      />
+        <path
+            d="M 12 0C 10.9 0 9.9 0.300003 9 0.800003C 8.1 0.300003 7.1 0 6 0C 2.7 0 0 2.7 0 6C 0 9.3 2.7 12 6 12C 7.1 12 8.1 11.7 9 11.2C 9.9 11.7 10.9 12 12 12C 15.3 12 18 9.3 18 6C 18 2.7 15.3 0 12 0ZM 6 11C 3.2 11 1 8.8 1 6C 1 3.2 3.2 1 6 1C 6.7 1 7.4 1.2 8.1 1.5C 6.8 2.6 6 4.2 6 6C 6 7.8 6.8 9.4 8.1 10.5C 7.4 10.8 6.7 11 6 11ZM 11 6C 11 7.6 10.2 9.1 9 10C 7.8 9.1 7 7.7 7 6C 7 4.3 7.8 2.9 9 2C 10.2 2.9 11 4.4 11 6ZM 12 11C 11.3 11 10.6 10.8 9.9 10.5C 11.2 9.4 12 7.8 12 6C 12 4.2 11.2 2.6 9.9 1.5C 10.5 1.2 11.2 1 12 1C 14.8 1 17 3.2 17 6C 17 8.8 14.8 11 12 11Z"
+            id="b"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 12"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1104 1236)"
+        transform="translate(-1104 1236)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1104 -1236)"
-            xlinkHref="#b"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1104 -1236)"
+                    xlinkHref="#b"
+                />
+            </g>
         </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 12 0C 10.9 0 9.9 0.300003 9 0.800003C 8.1 0.300003 7.1 0 6 0C 2.7 0 0 2.7 0 6C 0 9.3 2.7 12 6 12C 7.1 12 8.1 11.7 9 11.2C 9.9 11.7 10.9 12 12 12C 15.3 12 18 9.3 18 6C 18 2.7 15.3 0 12 0ZM 6 11C 3.2 11 1 8.8 1 6C 1 3.2 3.2 1 6 1C 6.7 1 7.4 1.2 8.1 1.5C 6.8 2.6 6 4.2 6 6C 6 7.8 6.8 9.4 8.1 10.5C 7.4 10.8 6.7 11 6 11ZM 11 6C 11 7.6 10.2 9.1 9 10C 7.8 9.1 7 7.7 7 6C 7 4.3 7.8 2.9 9 2C 10.2 2.9 11 4.4 11 6ZM 12 11C 11.3 11 10.6 10.8 9.9 10.5C 11.2 9.4 12 7.8 12 6C 12 4.2 11.2 2.6 9.9 1.5C 10.5 1.2 11.2 1 12 1C 14.8 1 17 3.2 17 6C 17 8.8 14.8 11 12 11Z"
-        id="b"
-      />
+        <path
+            d="M 12 0C 10.9 0 9.9 0.300003 9 0.800003C 8.1 0.300003 7.1 0 6 0C 2.7 0 0 2.7 0 6C 0 9.3 2.7 12 6 12C 7.1 12 8.1 11.7 9 11.2C 9.9 11.7 10.9 12 12 12C 15.3 12 18 9.3 18 6C 18 2.7 15.3 0 12 0ZM 6 11C 3.2 11 1 8.8 1 6C 1 3.2 3.2 1 6 1C 6.7 1 7.4 1.2 8.1 1.5C 6.8 2.6 6 4.2 6 6C 6 7.8 6.8 9.4 8.1 10.5C 7.4 10.8 6.7 11 6 11ZM 11 6C 11 7.6 10.2 9.1 9 10C 7.8 9.1 7 7.7 7 6C 7 4.3 7.8 2.9 9 2C 10.2 2.9 11 4.4 11 6ZM 12 11C 11.3 11 10.6 10.8 9.9 10.5C 11.2 9.4 12 7.8 12 6C 12 4.2 11.2 2.6 9.9 1.5C 10.5 1.2 11.2 1 12 1C 14.8 1 17 3.2 17 6C 17 8.8 14.8 11 12 11Z"
+            id="b"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 12"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1104 1236)"
+        transform="translate(-1104 1236)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1104 -1236)"
-            xlinkHref="#b"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1104 -1236)"
+                    xlinkHref="#b"
+                />
+            </g>
         </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 12 0C 10.9 0 9.9 0.300003 9 0.800003C 8.1 0.300003 7.1 0 6 0C 2.7 0 0 2.7 0 6C 0 9.3 2.7 12 6 12C 7.1 12 8.1 11.7 9 11.2C 9.9 11.7 10.9 12 12 12C 15.3 12 18 9.3 18 6C 18 2.7 15.3 0 12 0ZM 6 11C 3.2 11 1 8.8 1 6C 1 3.2 3.2 1 6 1C 6.7 1 7.4 1.2 8.1 1.5C 6.8 2.6 6 4.2 6 6C 6 7.8 6.8 9.4 8.1 10.5C 7.4 10.8 6.7 11 6 11ZM 11 6C 11 7.6 10.2 9.1 9 10C 7.8 9.1 7 7.7 7 6C 7 4.3 7.8 2.9 9 2C 10.2 2.9 11 4.4 11 6ZM 12 11C 11.3 11 10.6 10.8 9.9 10.5C 11.2 9.4 12 7.8 12 6C 12 4.2 11.2 2.6 9.9 1.5C 10.5 1.2 11.2 1 12 1C 14.8 1 17 3.2 17 6C 17 8.8 14.8 11 12 11Z"
-        id="b"
-      />
+        <path
+            d="M 12 0C 10.9 0 9.9 0.300003 9 0.800003C 8.1 0.300003 7.1 0 6 0C 2.7 0 0 2.7 0 6C 0 9.3 2.7 12 6 12C 7.1 12 8.1 11.7 9 11.2C 9.9 11.7 10.9 12 12 12C 15.3 12 18 9.3 18 6C 18 2.7 15.3 0 12 0ZM 6 11C 3.2 11 1 8.8 1 6C 1 3.2 3.2 1 6 1C 6.7 1 7.4 1.2 8.1 1.5C 6.8 2.6 6 4.2 6 6C 6 7.8 6.8 9.4 8.1 10.5C 7.4 10.8 6.7 11 6 11ZM 11 6C 11 7.6 10.2 9.1 9 10C 7.8 9.1 7 7.7 7 6C 7 4.3 7.8 2.9 9 2C 10.2 2.9 11 4.4 11 6ZM 12 11C 11.3 11 10.6 10.8 9.9 10.5C 11.2 9.4 12 7.8 12 6C 12 4.2 11.2 2.6 9.9 1.5C 10.5 1.2 11.2 1 12 1C 14.8 1 17 3.2 17 6C 17 8.8 14.8 11 12 11Z"
+            id="b"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 12"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1104 1236)"
+        transform="translate(-1104 1236)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1104 -1236)"
-            xlinkHref="#b"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1104 -1236)"
+                    xlinkHref="#b"
+                />
+            </g>
         </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 12 0C 10.9 0 9.9 0.300003 9 0.800003C 8.1 0.300003 7.1 0 6 0C 2.7 0 0 2.7 0 6C 0 9.3 2.7 12 6 12C 7.1 12 8.1 11.7 9 11.2C 9.9 11.7 10.9 12 12 12C 15.3 12 18 9.3 18 6C 18 2.7 15.3 0 12 0ZM 6 11C 3.2 11 1 8.8 1 6C 1 3.2 3.2 1 6 1C 6.7 1 7.4 1.2 8.1 1.5C 6.8 2.6 6 4.2 6 6C 6 7.8 6.8 9.4 8.1 10.5C 7.4 10.8 6.7 11 6 11ZM 11 6C 11 7.6 10.2 9.1 9 10C 7.8 9.1 7 7.7 7 6C 7 4.3 7.8 2.9 9 2C 10.2 2.9 11 4.4 11 6ZM 12 11C 11.3 11 10.6 10.8 9.9 10.5C 11.2 9.4 12 7.8 12 6C 12 4.2 11.2 2.6 9.9 1.5C 10.5 1.2 11.2 1 12 1C 14.8 1 17 3.2 17 6C 17 8.8 14.8 11 12 11Z"
-        id="b"
-      />
+        <path
+            d="M 12 0C 10.9 0 9.9 0.300003 9 0.800003C 8.1 0.300003 7.1 0 6 0C 2.7 0 0 2.7 0 6C 0 9.3 2.7 12 6 12C 7.1 12 8.1 11.7 9 11.2C 9.9 11.7 10.9 12 12 12C 15.3 12 18 9.3 18 6C 18 2.7 15.3 0 12 0ZM 6 11C 3.2 11 1 8.8 1 6C 1 3.2 3.2 1 6 1C 6.7 1 7.4 1.2 8.1 1.5C 6.8 2.6 6 4.2 6 6C 6 7.8 6.8 9.4 8.1 10.5C 7.4 10.8 6.7 11 6 11ZM 11 6C 11 7.6 10.2 9.1 9 10C 7.8 9.1 7 7.7 7 6C 7 4.3 7.8 2.9 9 2C 10.2 2.9 11 4.4 11 6ZM 12 11C 11.3 11 10.6 10.8 9.9 10.5C 11.2 9.4 12 7.8 12 6C 12 4.2 11.2 2.6 9.9 1.5C 10.5 1.2 11.2 1 12 1C 14.8 1 17 3.2 17 6C 17 8.8 14.8 11 12 11Z"
+            id="b"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 12"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1104 1236)"
+        transform="translate(-1104 1236)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1104 -1236)"
-            xlinkHref="#b"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1104 -1236)"
+                    xlinkHref="#b"
+                />
+            </g>
         </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 12 0C 10.9 0 9.9 0.300003 9 0.800003C 8.1 0.300003 7.1 0 6 0C 2.7 0 0 2.7 0 6C 0 9.3 2.7 12 6 12C 7.1 12 8.1 11.7 9 11.2C 9.9 11.7 10.9 12 12 12C 15.3 12 18 9.3 18 6C 18 2.7 15.3 0 12 0ZM 6 11C 3.2 11 1 8.8 1 6C 1 3.2 3.2 1 6 1C 6.7 1 7.4 1.2 8.1 1.5C 6.8 2.6 6 4.2 6 6C 6 7.8 6.8 9.4 8.1 10.5C 7.4 10.8 6.7 11 6 11ZM 11 6C 11 7.6 10.2 9.1 9 10C 7.8 9.1 7 7.7 7 6C 7 4.3 7.8 2.9 9 2C 10.2 2.9 11 4.4 11 6ZM 12 11C 11.3 11 10.6 10.8 9.9 10.5C 11.2 9.4 12 7.8 12 6C 12 4.2 11.2 2.6 9.9 1.5C 10.5 1.2 11.2 1 12 1C 14.8 1 17 3.2 17 6C 17 8.8 14.8 11 12 11Z"
-        id="b"
-      />
+        <path
+            d="M 12 0C 10.9 0 9.9 0.300003 9 0.800003C 8.1 0.300003 7.1 0 6 0C 2.7 0 0 2.7 0 6C 0 9.3 2.7 12 6 12C 7.1 12 8.1 11.7 9 11.2C 9.9 11.7 10.9 12 12 12C 15.3 12 18 9.3 18 6C 18 2.7 15.3 0 12 0ZM 6 11C 3.2 11 1 8.8 1 6C 1 3.2 3.2 1 6 1C 6.7 1 7.4 1.2 8.1 1.5C 6.8 2.6 6 4.2 6 6C 6 7.8 6.8 9.4 8.1 10.5C 7.4 10.8 6.7 11 6 11ZM 11 6C 11 7.6 10.2 9.1 9 10C 7.8 9.1 7 7.7 7 6C 7 4.3 7.8 2.9 9 2C 10.2 2.9 11 4.4 11 6ZM 12 11C 11.3 11 10.6 10.8 9.9 10.5C 11.2 9.4 12 7.8 12 6C 12 4.2 11.2 2.6 9.9 1.5C 10.5 1.2 11.2 1 12 1C 14.8 1 17 3.2 17 6C 17 8.8 14.8 11 12 11Z"
+            id="b"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Arrow /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="6"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 9 6"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="6"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 9 6"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
-      fill="#FFF"
-      fillRule="evenodd"
+        d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
+        fill="#FFF"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="6"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 9 6"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
-      fill={true}
-      fillRule="evenodd"
+        d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
+        fill={undefined}
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="6"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 9 6"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="6"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 9 6"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="6"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 9 6"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="6"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 9 6"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Bin /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 17"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M4 0v1H0v2h12V1H8.001V0H4zM1 17h10V4H1v13z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M4 0v1H0v2h12V1H8.001V0H4zM1 17h10V4H1v13z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 17"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M4 0v1H0v2h12V1H8.001V0H4zM1 17h10V4H1v13z"
-      fill="#FFF"
-      fillRule="evenodd"
+        d="M4 0v1H0v2h12V1H8.001V0H4zM1 17h10V4H1v13z"
+        fill="#FFF"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 17"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M4 0v1H0v2h12V1H8.001V0H4zM1 17h10V4H1v13z"
-      fill={true}
-      fillRule="evenodd"
+        d="M4 0v1H0v2h12V1H8.001V0H4zM1 17h10V4H1v13z"
+        fill={undefined}
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 12 17"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M4 0v1H0v2h12V1H8.001V0H4zM1 17h10V4H1v13z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M4 0v1H0v2h12V1H8.001V0H4zM1 17h10V4H1v13z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 12 17"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M4 0v1H0v2h12V1H8.001V0H4zM1 17h10V4H1v13z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M4 0v1H0v2h12V1H8.001V0H4zM1 17h10V4H1v13z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 12 17"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M4 0v1H0v2h12V1H8.001V0H4zM1 17h10V4H1v13z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M4 0v1H0v2h12V1H8.001V0H4zM1 17h10V4H1v13z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 17"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M4 0v1H0v2h12V1H8.001V0H4zM1 17h10V4H1v13z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M4 0v1H0v2h12V1H8.001V0H4zM1 17h10V4H1v13z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Checkcircle /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M9 18A9 9 0 1 0 9 0a9 9 0 0 0 0 18z"
-      fill="#FFF"
-      fillRule="evenodd"
+        d="M9 18A9 9 0 1 0 9 0a9 9 0 0 0 0 18z"
+        fill="#FFF"
+        fillRule="evenodd"
     />
     <path
-      d="M9 19c5.523 0 10-4.477 10-10h-2a8 8 0 0 1-8 8v2zM19 9C19 3.477 14.523-1 9-1v2a8 8 0 0 1 8 8h2zM9-1C3.477-1-1 3.477-1 9h2a8 8 0 0 1 8-8v-2zM-1 9c0 5.523 4.477 10 10 10v-2a8 8 0 0 1-8-8h-2z"
-      fill="#464646"
+        d="M9 19c5.523 0 10-4.477 10-10h-2a8 8 0 0 1-8 8v2zM19 9C19 3.477 14.523-1 9-1v2a8 8 0 0 1 8 8h2zM9-1C3.477-1-1 3.477-1 9h2a8 8 0 0 1 8-8v-2zM-1 9c0 5.523 4.477 10 10 10v-2a8 8 0 0 1-8-8h-2z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="18"
     light={true}
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M9 18A9 9 0 1 0 9 0a9 9 0 0 0 0 18z"
-      fill="#FFF"
-      fillRule="evenodd"
+        d="M9 18A9 9 0 1 0 9 0a9 9 0 0 0 0 18z"
+        fill="#FFF"
+        fillRule="evenodd"
     />
     <path
-      d="M9 19c5.523 0 10-4.477 10-10h-2a8 8 0 0 1-8 8v2zM19 9C19 3.477 14.523-1 9-1v2a8 8 0 0 1 8 8h2zM9-1C3.477-1-1 3.477-1 9h2a8 8 0 0 1 8-8v-2zM-1 9c0 5.523 4.477 10 10 10v-2a8 8 0 0 1-8-8h-2z"
-      fill="#464646"
+        d="M9 19c5.523 0 10-4.477 10-10h-2a8 8 0 0 1-8 8v2zM19 9C19 3.477 14.523-1 9-1v2a8 8 0 0 1 8 8h2zM9-1C3.477-1-1 3.477-1 9h2a8 8 0 0 1 8-8v-2zM-1 9c0 5.523 4.477 10 10 10v-2a8 8 0 0 1-8-8h-2z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     disabled={true}
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M9 18A9 9 0 1 0 9 0a9 9 0 0 0 0 18z"
-      fill="#FFF"
-      fillRule="evenodd"
+        d="M9 18A9 9 0 1 0 9 0a9 9 0 0 0 0 18z"
+        fill="#FFF"
+        fillRule="evenodd"
     />
     <path
-      d="M9 19c5.523 0 10-4.477 10-10h-2a8 8 0 0 1-8 8v2zM19 9C19 3.477 14.523-1 9-1v2a8 8 0 0 1 8 8h2zM9-1C3.477-1-1 3.477-1 9h2a8 8 0 0 1 8-8v-2zM-1 9c0 5.523 4.477 10 10 10v-2a8 8 0 0 1-8-8h-2z"
-      fill="#464646"
+        d="M9 19c5.523 0 10-4.477 10-10h-2a8 8 0 0 1-8 8v2zM19 9C19 3.477 14.523-1 9-1v2a8 8 0 0 1 8 8h2zM9-1C3.477-1-1 3.477-1 9h2a8 8 0 0 1 8-8v-2zM-1 9c0 5.523 4.477 10 10 10v-2a8 8 0 0 1-8-8h-2z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M9 18A9 9 0 1 0 9 0a9 9 0 0 0 0 18z"
-      fill="#FFF"
-      fillRule="evenodd"
+        d="M9 18A9 9 0 1 0 9 0a9 9 0 0 0 0 18z"
+        fill="#FFF"
+        fillRule="evenodd"
     />
     <path
-      d="M9 19c5.523 0 10-4.477 10-10h-2a8 8 0 0 1-8 8v2zM19 9C19 3.477 14.523-1 9-1v2a8 8 0 0 1 8 8h2zM9-1C3.477-1-1 3.477-1 9h2a8 8 0 0 1 8-8v-2zM-1 9c0 5.523 4.477 10 10 10v-2a8 8 0 0 1-8-8h-2z"
-      fill="#464646"
+        d="M9 19c5.523 0 10-4.477 10-10h-2a8 8 0 0 1-8 8v2zM19 9C19 3.477 14.523-1 9-1v2a8 8 0 0 1 8 8h2zM9-1C3.477-1-1 3.477-1 9h2a8 8 0 0 1 8-8v-2zM-1 9c0 5.523 4.477 10 10 10v-2a8 8 0 0 1-8-8h-2z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M9 18A9 9 0 1 0 9 0a9 9 0 0 0 0 18z"
-      fill="#FFF"
-      fillRule="evenodd"
+        d="M9 18A9 9 0 1 0 9 0a9 9 0 0 0 0 18z"
+        fill="#FFF"
+        fillRule="evenodd"
     />
     <path
-      d="M9 19c5.523 0 10-4.477 10-10h-2a8 8 0 0 1-8 8v2zM19 9C19 3.477 14.523-1 9-1v2a8 8 0 0 1 8 8h2zM9-1C3.477-1-1 3.477-1 9h2a8 8 0 0 1 8-8v-2zM-1 9c0 5.523 4.477 10 10 10v-2a8 8 0 0 1-8-8h-2z"
-      fill="#464646"
+        d="M9 19c5.523 0 10-4.477 10-10h-2a8 8 0 0 1-8 8v2zM19 9C19 3.477 14.523-1 9-1v2a8 8 0 0 1 8 8h2zM9-1C3.477-1-1 3.477-1 9h2a8 8 0 0 1 8-8v-2zM-1 9c0 5.523 4.477 10 10 10v-2a8 8 0 0 1-8-8h-2z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M9 18A9 9 0 1 0 9 0a9 9 0 0 0 0 18z"
-      fill="#FFF"
-      fillRule="evenodd"
+        d="M9 18A9 9 0 1 0 9 0a9 9 0 0 0 0 18z"
+        fill="#FFF"
+        fillRule="evenodd"
     />
     <path
-      d="M9 19c5.523 0 10-4.477 10-10h-2a8 8 0 0 1-8 8v2zM19 9C19 3.477 14.523-1 9-1v2a8 8 0 0 1 8 8h2zM9-1C3.477-1-1 3.477-1 9h2a8 8 0 0 1 8-8v-2zM-1 9c0 5.523 4.477 10 10 10v-2a8 8 0 0 1-8-8h-2z"
-      fill="#464646"
+        d="M9 19c5.523 0 10-4.477 10-10h-2a8 8 0 0 1-8 8v2zM19 9C19 3.477 14.523-1 9-1v2a8 8 0 0 1 8 8h2zM9-1C3.477-1-1 3.477-1 9h2a8 8 0 0 1 8-8v-2zM-1 9c0 5.523 4.477 10 10 10v-2a8 8 0 0 1-8-8h-2z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M9 18A9 9 0 1 0 9 0a9 9 0 0 0 0 18z"
-      fill="#FFF"
-      fillRule="evenodd"
+        d="M9 18A9 9 0 1 0 9 0a9 9 0 0 0 0 18z"
+        fill="#FFF"
+        fillRule="evenodd"
     />
     <path
-      d="M9 19c5.523 0 10-4.477 10-10h-2a8 8 0 0 1-8 8v2zM19 9C19 3.477 14.523-1 9-1v2a8 8 0 0 1 8 8h2zM9-1C3.477-1-1 3.477-1 9h2a8 8 0 0 1 8-8v-2zM-1 9c0 5.523 4.477 10 10 10v-2a8 8 0 0 1-8-8h-2z"
-      fill="#464646"
+        d="M9 19c5.523 0 10-4.477 10-10h-2a8 8 0 0 1-8 8v2zM19 9C19 3.477 14.523-1 9-1v2a8 8 0 0 1 8 8h2zM9-1C3.477-1-1 3.477-1 9h2a8 8 0 0 1 8-8v-2zM-1 9c0 5.523 4.477 10 10 10v-2a8 8 0 0 1-8-8h-2z"
+        fill="#464646"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Clipboard /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     width="13"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2367 443)"
+        transform="translate(-2367 443)"
     >
-      <use
-        fill="#464646"
-        transform="translate(2370 -437)"
-        xlinkHref="#e"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2367 -443)"
-        xlinkHref="#f"
-      />
+        <use
+            fill="#464646"
+            transform="translate(2370 -437)"
+            xlinkHref="#e"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2367 -443)"
+            xlinkHref="#f"
+        />
     </g>
     <defs>
-      <path
-        d="M6 3L4 5V0H3v5L1 3 0 4l3.5 3L7 4 6 3z"
-        id="e"
-      />
-      <path
-        d="M12 1h-2V0H3v1H1c-.6 0-1 .4-1 1v13c0 .6.4 1 1 1h11c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zM4 1h5v2H4V1zm8 14H1V2h2v2h7V2h2v13z"
-        id="f"
-      />
+        <path
+            d="M6 3L4 5V0H3v5L1 3 0 4l3.5 3L7 4 6 3z"
+            id="e"
+        />
+        <path
+            d="M12 1h-2V0H3v1H1c-.6 0-1 .4-1 1v13c0 .6.4 1 1 1h11c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zM4 1h5v2H4V1zm8 14H1V2h2v2h7V2h2v13z"
+            id="f"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     width="13"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2367 443)"
+        transform="translate(-2367 443)"
     >
-      <use
-        fill="#FFF"
-        transform="translate(2370 -437)"
-        xlinkHref="#e"
-      />
-      <use
-        fill="#FFF"
-        transform="translate(2367 -443)"
-        xlinkHref="#f"
-      />
+        <use
+            fill="#FFF"
+            transform="translate(2370 -437)"
+            xlinkHref="#e"
+        />
+        <use
+            fill="#FFF"
+            transform="translate(2367 -443)"
+            xlinkHref="#f"
+        />
     </g>
     <defs>
-      <path
-        d="M6 3L4 5V0H3v5L1 3 0 4l3.5 3L7 4 6 3z"
-        id="e"
-      />
-      <path
-        d="M12 1h-2V0H3v1H1c-.6 0-1 .4-1 1v13c0 .6.4 1 1 1h11c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zM4 1h5v2H4V1zm8 14H1V2h2v2h7V2h2v13z"
-        id="f"
-      />
+        <path
+            d="M6 3L4 5V0H3v5L1 3 0 4l3.5 3L7 4 6 3z"
+            id="e"
+        />
+        <path
+            d="M12 1h-2V0H3v1H1c-.6 0-1 .4-1 1v13c0 .6.4 1 1 1h11c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zM4 1h5v2H4V1zm8 14H1V2h2v2h7V2h2v13z"
+            id="f"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     width="13"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2367 443)"
+        transform="translate(-2367 443)"
     >
-      <use
-        fill={true}
-        transform="translate(2370 -437)"
-        xlinkHref="#e"
-      />
-      <use
-        fill={true}
-        transform="translate(2367 -443)"
-        xlinkHref="#f"
-      />
+        <use
+            fill={undefined}
+            transform="translate(2370 -437)"
+            xlinkHref="#e"
+        />
+        <use
+            fill={undefined}
+            transform="translate(2367 -443)"
+            xlinkHref="#f"
+        />
     </g>
     <defs>
-      <path
-        d="M6 3L4 5V0H3v5L1 3 0 4l3.5 3L7 4 6 3z"
-        id="e"
-      />
-      <path
-        d="M12 1h-2V0H3v1H1c-.6 0-1 .4-1 1v13c0 .6.4 1 1 1h11c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zM4 1h5v2H4V1zm8 14H1V2h2v2h7V2h2v13z"
-        id="f"
-      />
+        <path
+            d="M6 3L4 5V0H3v5L1 3 0 4l3.5 3L7 4 6 3z"
+            id="e"
+        />
+        <path
+            d="M12 1h-2V0H3v1H1c-.6 0-1 .4-1 1v13c0 .6.4 1 1 1h11c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zM4 1h5v2H4V1zm8 14H1V2h2v2h7V2h2v13z"
+            id="f"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     width="13"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2367 443)"
+        transform="translate(-2367 443)"
     >
-      <use
-        fill="#464646"
-        transform="translate(2370 -437)"
-        xlinkHref="#e"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2367 -443)"
-        xlinkHref="#f"
-      />
+        <use
+            fill="#464646"
+            transform="translate(2370 -437)"
+            xlinkHref="#e"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2367 -443)"
+            xlinkHref="#f"
+        />
     </g>
     <defs>
-      <path
-        d="M6 3L4 5V0H3v5L1 3 0 4l3.5 3L7 4 6 3z"
-        id="e"
-      />
-      <path
-        d="M12 1h-2V0H3v1H1c-.6 0-1 .4-1 1v13c0 .6.4 1 1 1h11c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zM4 1h5v2H4V1zm8 14H1V2h2v2h7V2h2v13z"
-        id="f"
-      />
+        <path
+            d="M6 3L4 5V0H3v5L1 3 0 4l3.5 3L7 4 6 3z"
+            id="e"
+        />
+        <path
+            d="M12 1h-2V0H3v1H1c-.6 0-1 .4-1 1v13c0 .6.4 1 1 1h11c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zM4 1h5v2H4V1zm8 14H1V2h2v2h7V2h2v13z"
+            id="f"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     width="13"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2367 443)"
+        transform="translate(-2367 443)"
     >
-      <use
-        fill="#464646"
-        transform="translate(2370 -437)"
-        xlinkHref="#e"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2367 -443)"
-        xlinkHref="#f"
-      />
+        <use
+            fill="#464646"
+            transform="translate(2370 -437)"
+            xlinkHref="#e"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2367 -443)"
+            xlinkHref="#f"
+        />
     </g>
     <defs>
-      <path
-        d="M6 3L4 5V0H3v5L1 3 0 4l3.5 3L7 4 6 3z"
-        id="e"
-      />
-      <path
-        d="M12 1h-2V0H3v1H1c-.6 0-1 .4-1 1v13c0 .6.4 1 1 1h11c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zM4 1h5v2H4V1zm8 14H1V2h2v2h7V2h2v13z"
-        id="f"
-      />
+        <path
+            d="M6 3L4 5V0H3v5L1 3 0 4l3.5 3L7 4 6 3z"
+            id="e"
+        />
+        <path
+            d="M12 1h-2V0H3v1H1c-.6 0-1 .4-1 1v13c0 .6.4 1 1 1h11c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zM4 1h5v2H4V1zm8 14H1V2h2v2h7V2h2v13z"
+            id="f"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     width="13"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2367 443)"
+        transform="translate(-2367 443)"
     >
-      <use
-        fill="#464646"
-        transform="translate(2370 -437)"
-        xlinkHref="#e"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2367 -443)"
-        xlinkHref="#f"
-      />
+        <use
+            fill="#464646"
+            transform="translate(2370 -437)"
+            xlinkHref="#e"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2367 -443)"
+            xlinkHref="#f"
+        />
     </g>
     <defs>
-      <path
-        d="M6 3L4 5V0H3v5L1 3 0 4l3.5 3L7 4 6 3z"
-        id="e"
-      />
-      <path
-        d="M12 1h-2V0H3v1H1c-.6 0-1 .4-1 1v13c0 .6.4 1 1 1h11c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zM4 1h5v2H4V1zm8 14H1V2h2v2h7V2h2v13z"
-        id="f"
-      />
+        <path
+            d="M6 3L4 5V0H3v5L1 3 0 4l3.5 3L7 4 6 3z"
+            id="e"
+        />
+        <path
+            d="M12 1h-2V0H3v1H1c-.6 0-1 .4-1 1v13c0 .6.4 1 1 1h11c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zM4 1h5v2H4V1zm8 14H1V2h2v2h7V2h2v13z"
+            id="f"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     width="13"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2367 443)"
+        transform="translate(-2367 443)"
     >
-      <use
-        fill="#464646"
-        transform="translate(2370 -437)"
-        xlinkHref="#e"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2367 -443)"
-        xlinkHref="#f"
-      />
+        <use
+            fill="#464646"
+            transform="translate(2370 -437)"
+            xlinkHref="#e"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2367 -443)"
+            xlinkHref="#f"
+        />
     </g>
     <defs>
-      <path
-        d="M6 3L4 5V0H3v5L1 3 0 4l3.5 3L7 4 6 3z"
-        id="e"
-      />
-      <path
-        d="M12 1h-2V0H3v1H1c-.6 0-1 .4-1 1v13c0 .6.4 1 1 1h11c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zM4 1h5v2H4V1zm8 14H1V2h2v2h7V2h2v13z"
-        id="f"
-      />
+        <path
+            d="M6 3L4 5V0H3v5L1 3 0 4l3.5 3L7 4 6 3z"
+            id="e"
+        />
+        <path
+            d="M12 1h-2V0H3v1H1c-.6 0-1 .4-1 1v13c0 .6.4 1 1 1h11c.6 0 1-.4 1-1V2c0-.6-.4-1-1-1zM4 1h5v2H4V1zm8 14H1V2h2v2h7V2h2v13z"
+            id="f"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Close /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M7.314 5.9l4.242-4.243L10.142.243 5.9 4.485 1.657.243.243 1.657l4.242 4.242-4.242 4.243 1.414 1.414 4.242-4.242 4.243 4.242 1.414-1.414L7.314 5.9z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M7.314 5.9l4.242-4.243L10.142.243 5.9 4.485 1.657.243.243 1.657l4.242 4.242-4.242 4.243 1.414 1.414 4.242-4.242 4.243 4.242 1.414-1.414L7.314 5.9z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M7.314 5.9l4.242-4.243L10.142.243 5.9 4.485 1.657.243.243 1.657l4.242 4.242-4.242 4.243 1.414 1.414 4.242-4.242 4.243 4.242 1.414-1.414L7.314 5.9z"
-      fill="#FFF"
-      fillRule="evenodd"
+        d="M7.314 5.9l4.242-4.243L10.142.243 5.9 4.485 1.657.243.243 1.657l4.242 4.242-4.242 4.243 1.414 1.414 4.242-4.242 4.243 4.242 1.414-1.414L7.314 5.9z"
+        fill="#FFF"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M7.314 5.9l4.242-4.243L10.142.243 5.9 4.485 1.657.243.243 1.657l4.242 4.242-4.242 4.243 1.414 1.414 4.242-4.242 4.243 4.242 1.414-1.414L7.314 5.9z"
-      fill={true}
-      fillRule="evenodd"
+        d="M7.314 5.9l4.242-4.243L10.142.243 5.9 4.485 1.657.243.243 1.657l4.242 4.242-4.242 4.243 1.414 1.414 4.242-4.242 4.243 4.242 1.414-1.414L7.314 5.9z"
+        fill={undefined}
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M7.314 5.9l4.242-4.243L10.142.243 5.9 4.485 1.657.243.243 1.657l4.242 4.242-4.242 4.243 1.414 1.414 4.242-4.242 4.243 4.242 1.414-1.414L7.314 5.9z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M7.314 5.9l4.242-4.243L10.142.243 5.9 4.485 1.657.243.243 1.657l4.242 4.242-4.242 4.243 1.414 1.414 4.242-4.242 4.243 4.242 1.414-1.414L7.314 5.9z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M7.314 5.9l4.242-4.243L10.142.243 5.9 4.485 1.657.243.243 1.657l4.242 4.242-4.242 4.243 1.414 1.414 4.242-4.242 4.243 4.242 1.414-1.414L7.314 5.9z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M7.314 5.9l4.242-4.243L10.142.243 5.9 4.485 1.657.243.243 1.657l4.242 4.242-4.242 4.243 1.414 1.414 4.242-4.242 4.243 4.242 1.414-1.414L7.314 5.9z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M7.314 5.9l4.242-4.243L10.142.243 5.9 4.485 1.657.243.243 1.657l4.242 4.242-4.242 4.243 1.414 1.414 4.242-4.242 4.243 4.242 1.414-1.414L7.314 5.9z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M7.314 5.9l4.242-4.243L10.142.243 5.9 4.485 1.657.243.243 1.657l4.242 4.242-4.242 4.243 1.414 1.414 4.242-4.242 4.243 4.242 1.414-1.414L7.314 5.9z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M7.314 5.9l4.242-4.243L10.142.243 5.9 4.485 1.657.243.243 1.657l4.242 4.242-4.242 4.243 1.414 1.414 4.242-4.242 4.243 4.242 1.414-1.414L7.314 5.9z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M7.314 5.9l4.242-4.243L10.142.243 5.9 4.485 1.657.243.243 1.657l4.242 4.242-4.242 4.243 1.414 1.414 4.242-4.242 4.243 4.242 1.414-1.414L7.314 5.9z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Cns /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="13"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 16 13"
     width="16"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1106 442)"
+        transform="translate(-1106 442)"
     >
-      <use
-        fill="#464646"
-        transform="translate(1106 -442)"
-        xlinkHref="#g"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1106.6 -434)"
-        xlinkHref="#h"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1112.1 -434)"
-        xlinkHref="#i"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1117.6 -434)"
-        xlinkHref="#h"
-      />
+        <use
+            fill="#464646"
+            transform="translate(1106 -442)"
+            xlinkHref="#g"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1106.6 -434)"
+            xlinkHref="#h"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1112.1 -434)"
+            xlinkHref="#i"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1117.6 -434)"
+            xlinkHref="#h"
+        />
     </g>
     <defs>
-      <path
-        d="M15 1v4H1V1h14zm0-1H1C.4 0 0 .4 0 1v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1V1c0-.6-.4-1-1-1z"
-        id="g"
-      />
-      <path
-        d="M3 2.4l-.6.7V0h-1v3.1l-.7-.7-.7.7L1.9 5l1.8-1.9-.7-.7z"
-        id="h"
-      />
-      <path
-        d="M3 2.4l-.6.7V0h-1v3.1l-.6-.7-.8.7L1.9 5l1.9-1.9-.8-.7z"
-        id="i"
-      />
+        <path
+            d="M15 1v4H1V1h14zm0-1H1C.4 0 0 .4 0 1v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1V1c0-.6-.4-1-1-1z"
+            id="g"
+        />
+        <path
+            d="M3 2.4l-.6.7V0h-1v3.1l-.7-.7-.7.7L1.9 5l1.8-1.9-.7-.7z"
+            id="h"
+        />
+        <path
+            d="M3 2.4l-.6.7V0h-1v3.1l-.6-.7-.8.7L1.9 5l1.9-1.9-.8-.7z"
+            id="i"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="13"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 16 13"
     width="16"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1106 442)"
+        transform="translate(-1106 442)"
     >
-      <use
-        fill="#FFF"
-        transform="translate(1106 -442)"
-        xlinkHref="#g"
-      />
-      <use
-        fill="#FFF"
-        transform="translate(1106.6 -434)"
-        xlinkHref="#h"
-      />
-      <use
-        fill="#FFF"
-        transform="translate(1112.1 -434)"
-        xlinkHref="#i"
-      />
-      <use
-        fill="#FFF"
-        transform="translate(1117.6 -434)"
-        xlinkHref="#h"
-      />
+        <use
+            fill="#FFF"
+            transform="translate(1106 -442)"
+            xlinkHref="#g"
+        />
+        <use
+            fill="#FFF"
+            transform="translate(1106.6 -434)"
+            xlinkHref="#h"
+        />
+        <use
+            fill="#FFF"
+            transform="translate(1112.1 -434)"
+            xlinkHref="#i"
+        />
+        <use
+            fill="#FFF"
+            transform="translate(1117.6 -434)"
+            xlinkHref="#h"
+        />
     </g>
     <defs>
-      <path
-        d="M15 1v4H1V1h14zm0-1H1C.4 0 0 .4 0 1v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1V1c0-.6-.4-1-1-1z"
-        id="g"
-      />
-      <path
-        d="M3 2.4l-.6.7V0h-1v3.1l-.7-.7-.7.7L1.9 5l1.8-1.9-.7-.7z"
-        id="h"
-      />
-      <path
-        d="M3 2.4l-.6.7V0h-1v3.1l-.6-.7-.8.7L1.9 5l1.9-1.9-.8-.7z"
-        id="i"
-      />
+        <path
+            d="M15 1v4H1V1h14zm0-1H1C.4 0 0 .4 0 1v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1V1c0-.6-.4-1-1-1z"
+            id="g"
+        />
+        <path
+            d="M3 2.4l-.6.7V0h-1v3.1l-.7-.7-.7.7L1.9 5l1.8-1.9-.7-.7z"
+            id="h"
+        />
+        <path
+            d="M3 2.4l-.6.7V0h-1v3.1l-.6-.7-.8.7L1.9 5l1.9-1.9-.8-.7z"
+            id="i"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="13"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 16 13"
     width="16"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1106 442)"
+        transform="translate(-1106 442)"
     >
-      <use
-        fill={true}
-        transform="translate(1106 -442)"
-        xlinkHref="#g"
-      />
-      <use
-        fill={true}
-        transform="translate(1106.6 -434)"
-        xlinkHref="#h"
-      />
-      <use
-        fill={true}
-        transform="translate(1112.1 -434)"
-        xlinkHref="#i"
-      />
-      <use
-        fill={true}
-        transform="translate(1117.6 -434)"
-        xlinkHref="#h"
-      />
+        <use
+            fill={undefined}
+            transform="translate(1106 -442)"
+            xlinkHref="#g"
+        />
+        <use
+            fill={undefined}
+            transform="translate(1106.6 -434)"
+            xlinkHref="#h"
+        />
+        <use
+            fill={undefined}
+            transform="translate(1112.1 -434)"
+            xlinkHref="#i"
+        />
+        <use
+            fill={undefined}
+            transform="translate(1117.6 -434)"
+            xlinkHref="#h"
+        />
     </g>
     <defs>
-      <path
-        d="M15 1v4H1V1h14zm0-1H1C.4 0 0 .4 0 1v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1V1c0-.6-.4-1-1-1z"
-        id="g"
-      />
-      <path
-        d="M3 2.4l-.6.7V0h-1v3.1l-.7-.7-.7.7L1.9 5l1.8-1.9-.7-.7z"
-        id="h"
-      />
-      <path
-        d="M3 2.4l-.6.7V0h-1v3.1l-.6-.7-.8.7L1.9 5l1.9-1.9-.8-.7z"
-        id="i"
-      />
+        <path
+            d="M15 1v4H1V1h14zm0-1H1C.4 0 0 .4 0 1v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1V1c0-.6-.4-1-1-1z"
+            id="g"
+        />
+        <path
+            d="M3 2.4l-.6.7V0h-1v3.1l-.7-.7-.7.7L1.9 5l1.8-1.9-.7-.7z"
+            id="h"
+        />
+        <path
+            d="M3 2.4l-.6.7V0h-1v3.1l-.6-.7-.8.7L1.9 5l1.9-1.9-.8-.7z"
+            id="i"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="13"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 16 13"
     width="16"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1106 442)"
+        transform="translate(-1106 442)"
     >
-      <use
-        fill="#464646"
-        transform="translate(1106 -442)"
-        xlinkHref="#g"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1106.6 -434)"
-        xlinkHref="#h"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1112.1 -434)"
-        xlinkHref="#i"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1117.6 -434)"
-        xlinkHref="#h"
-      />
+        <use
+            fill="#464646"
+            transform="translate(1106 -442)"
+            xlinkHref="#g"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1106.6 -434)"
+            xlinkHref="#h"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1112.1 -434)"
+            xlinkHref="#i"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1117.6 -434)"
+            xlinkHref="#h"
+        />
     </g>
     <defs>
-      <path
-        d="M15 1v4H1V1h14zm0-1H1C.4 0 0 .4 0 1v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1V1c0-.6-.4-1-1-1z"
-        id="g"
-      />
-      <path
-        d="M3 2.4l-.6.7V0h-1v3.1l-.7-.7-.7.7L1.9 5l1.8-1.9-.7-.7z"
-        id="h"
-      />
-      <path
-        d="M3 2.4l-.6.7V0h-1v3.1l-.6-.7-.8.7L1.9 5l1.9-1.9-.8-.7z"
-        id="i"
-      />
+        <path
+            d="M15 1v4H1V1h14zm0-1H1C.4 0 0 .4 0 1v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1V1c0-.6-.4-1-1-1z"
+            id="g"
+        />
+        <path
+            d="M3 2.4l-.6.7V0h-1v3.1l-.7-.7-.7.7L1.9 5l1.8-1.9-.7-.7z"
+            id="h"
+        />
+        <path
+            d="M3 2.4l-.6.7V0h-1v3.1l-.6-.7-.8.7L1.9 5l1.9-1.9-.8-.7z"
+            id="i"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="13"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 16 13"
     width="16"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1106 442)"
+        transform="translate(-1106 442)"
     >
-      <use
-        fill="#464646"
-        transform="translate(1106 -442)"
-        xlinkHref="#g"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1106.6 -434)"
-        xlinkHref="#h"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1112.1 -434)"
-        xlinkHref="#i"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1117.6 -434)"
-        xlinkHref="#h"
-      />
+        <use
+            fill="#464646"
+            transform="translate(1106 -442)"
+            xlinkHref="#g"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1106.6 -434)"
+            xlinkHref="#h"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1112.1 -434)"
+            xlinkHref="#i"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1117.6 -434)"
+            xlinkHref="#h"
+        />
     </g>
     <defs>
-      <path
-        d="M15 1v4H1V1h14zm0-1H1C.4 0 0 .4 0 1v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1V1c0-.6-.4-1-1-1z"
-        id="g"
-      />
-      <path
-        d="M3 2.4l-.6.7V0h-1v3.1l-.7-.7-.7.7L1.9 5l1.8-1.9-.7-.7z"
-        id="h"
-      />
-      <path
-        d="M3 2.4l-.6.7V0h-1v3.1l-.6-.7-.8.7L1.9 5l1.9-1.9-.8-.7z"
-        id="i"
-      />
+        <path
+            d="M15 1v4H1V1h14zm0-1H1C.4 0 0 .4 0 1v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1V1c0-.6-.4-1-1-1z"
+            id="g"
+        />
+        <path
+            d="M3 2.4l-.6.7V0h-1v3.1l-.7-.7-.7.7L1.9 5l1.8-1.9-.7-.7z"
+            id="h"
+        />
+        <path
+            d="M3 2.4l-.6.7V0h-1v3.1l-.6-.7-.8.7L1.9 5l1.9-1.9-.8-.7z"
+            id="i"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="13"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 16 13"
     width="16"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1106 442)"
+        transform="translate(-1106 442)"
     >
-      <use
-        fill="#464646"
-        transform="translate(1106 -442)"
-        xlinkHref="#g"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1106.6 -434)"
-        xlinkHref="#h"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1112.1 -434)"
-        xlinkHref="#i"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1117.6 -434)"
-        xlinkHref="#h"
-      />
+        <use
+            fill="#464646"
+            transform="translate(1106 -442)"
+            xlinkHref="#g"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1106.6 -434)"
+            xlinkHref="#h"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1112.1 -434)"
+            xlinkHref="#i"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1117.6 -434)"
+            xlinkHref="#h"
+        />
     </g>
     <defs>
-      <path
-        d="M15 1v4H1V1h14zm0-1H1C.4 0 0 .4 0 1v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1V1c0-.6-.4-1-1-1z"
-        id="g"
-      />
-      <path
-        d="M3 2.4l-.6.7V0h-1v3.1l-.7-.7-.7.7L1.9 5l1.8-1.9-.7-.7z"
-        id="h"
-      />
-      <path
-        d="M3 2.4l-.6.7V0h-1v3.1l-.6-.7-.8.7L1.9 5l1.9-1.9-.8-.7z"
-        id="i"
-      />
+        <path
+            d="M15 1v4H1V1h14zm0-1H1C.4 0 0 .4 0 1v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1V1c0-.6-.4-1-1-1z"
+            id="g"
+        />
+        <path
+            d="M3 2.4l-.6.7V0h-1v3.1l-.7-.7-.7.7L1.9 5l1.8-1.9-.7-.7z"
+            id="h"
+        />
+        <path
+            d="M3 2.4l-.6.7V0h-1v3.1l-.6-.7-.8.7L1.9 5l1.9-1.9-.8-.7z"
+            id="i"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="13"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 16 13"
     width="16"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1106 442)"
+        transform="translate(-1106 442)"
     >
-      <use
-        fill="#464646"
-        transform="translate(1106 -442)"
-        xlinkHref="#g"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1106.6 -434)"
-        xlinkHref="#h"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1112.1 -434)"
-        xlinkHref="#i"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1117.6 -434)"
-        xlinkHref="#h"
-      />
+        <use
+            fill="#464646"
+            transform="translate(1106 -442)"
+            xlinkHref="#g"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1106.6 -434)"
+            xlinkHref="#h"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1112.1 -434)"
+            xlinkHref="#i"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1117.6 -434)"
+            xlinkHref="#h"
+        />
     </g>
     <defs>
-      <path
-        d="M15 1v4H1V1h14zm0-1H1C.4 0 0 .4 0 1v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1V1c0-.6-.4-1-1-1z"
-        id="g"
-      />
-      <path
-        d="M3 2.4l-.6.7V0h-1v3.1l-.7-.7-.7.7L1.9 5l1.8-1.9-.7-.7z"
-        id="h"
-      />
-      <path
-        d="M3 2.4l-.6.7V0h-1v3.1l-.6-.7-.8.7L1.9 5l1.9-1.9-.8-.7z"
-        id="i"
-      />
+        <path
+            d="M15 1v4H1V1h14zm0-1H1C.4 0 0 .4 0 1v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1V1c0-.6-.4-1-1-1z"
+            id="g"
+        />
+        <path
+            d="M3 2.4l-.6.7V0h-1v3.1l-.7-.7-.7.7L1.9 5l1.8-1.9-.7-.7z"
+            id="h"
+        />
+        <path
+            d="M3 2.4l-.6.7V0h-1v3.1l-.6-.7-.8.7L1.9 5l1.9-1.9-.8-.7z"
+            id="i"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Copy /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 13 16"
     width="13"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M 12 1L 10 1L 10 0L 3 0L 3 1L 1 1C 0.4 1 0 1.4 0 2L 0 15C 0 15.6 0.4 16 1 16L 12 16C 12.6 16 13 15.6 13 15L 13 2C 13 1.4 12.6 1 12 1ZM 4 1L 9 1L 9 2L 9 3L 4 3L 4 2L 4 1ZM 12 15L 1 15L 1 2L 3 2L 3 4L 10 4L 10 2L 12 2L 12 15Z"
-      fill="#464646"
+        d="M 12 1L 10 1L 10 0L 3 0L 3 1L 1 1C 0.4 1 0 1.4 0 2L 0 15C 0 15.6 0.4 16 1 16L 12 16C 12.6 16 13 15.6 13 15L 13 2C 13 1.4 12.6 1 12 1ZM 4 1L 9 1L 9 2L 9 3L 4 3L 4 2L 4 1ZM 12 15L 1 15L 1 2L 3 2L 3 4L 10 4L 10 2L 12 2L 12 15Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 13 16"
     width="13"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M 12 1L 10 1L 10 0L 3 0L 3 1L 1 1C 0.4 1 0 1.4 0 2L 0 15C 0 15.6 0.4 16 1 16L 12 16C 12.6 16 13 15.6 13 15L 13 2C 13 1.4 12.6 1 12 1ZM 4 1L 9 1L 9 2L 9 3L 4 3L 4 2L 4 1ZM 12 15L 1 15L 1 2L 3 2L 3 4L 10 4L 10 2L 12 2L 12 15Z"
-      fill="#FFF"
+        d="M 12 1L 10 1L 10 0L 3 0L 3 1L 1 1C 0.4 1 0 1.4 0 2L 0 15C 0 15.6 0.4 16 1 16L 12 16C 12.6 16 13 15.6 13 15L 13 2C 13 1.4 12.6 1 12 1ZM 4 1L 9 1L 9 2L 9 3L 4 3L 4 2L 4 1ZM 12 15L 1 15L 1 2L 3 2L 3 4L 10 4L 10 2L 12 2L 12 15Z"
+        fill="#FFF"
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 13 16"
     width="13"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M 12 1L 10 1L 10 0L 3 0L 3 1L 1 1C 0.4 1 0 1.4 0 2L 0 15C 0 15.6 0.4 16 1 16L 12 16C 12.6 16 13 15.6 13 15L 13 2C 13 1.4 12.6 1 12 1ZM 4 1L 9 1L 9 2L 9 3L 4 3L 4 2L 4 1ZM 12 15L 1 15L 1 2L 3 2L 3 4L 10 4L 10 2L 12 2L 12 15Z"
-      fill={true}
+        d="M 12 1L 10 1L 10 0L 3 0L 3 1L 1 1C 0.4 1 0 1.4 0 2L 0 15C 0 15.6 0.4 16 1 16L 12 16C 12.6 16 13 15.6 13 15L 13 2C 13 1.4 12.6 1 12 1ZM 4 1L 9 1L 9 2L 9 3L 4 3L 4 2L 4 1ZM 12 15L 1 15L 1 2L 3 2L 3 4L 10 4L 10 2L 12 2L 12 15Z"
+        fill={undefined}
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 13 16"
     width="13"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M 12 1L 10 1L 10 0L 3 0L 3 1L 1 1C 0.4 1 0 1.4 0 2L 0 15C 0 15.6 0.4 16 1 16L 12 16C 12.6 16 13 15.6 13 15L 13 2C 13 1.4 12.6 1 12 1ZM 4 1L 9 1L 9 2L 9 3L 4 3L 4 2L 4 1ZM 12 15L 1 15L 1 2L 3 2L 3 4L 10 4L 10 2L 12 2L 12 15Z"
-      fill="#464646"
+        d="M 12 1L 10 1L 10 0L 3 0L 3 1L 1 1C 0.4 1 0 1.4 0 2L 0 15C 0 15.6 0.4 16 1 16L 12 16C 12.6 16 13 15.6 13 15L 13 2C 13 1.4 12.6 1 12 1ZM 4 1L 9 1L 9 2L 9 3L 4 3L 4 2L 4 1ZM 12 15L 1 15L 1 2L 3 2L 3 4L 10 4L 10 2L 12 2L 12 15Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 13 16"
     width="13"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M 12 1L 10 1L 10 0L 3 0L 3 1L 1 1C 0.4 1 0 1.4 0 2L 0 15C 0 15.6 0.4 16 1 16L 12 16C 12.6 16 13 15.6 13 15L 13 2C 13 1.4 12.6 1 12 1ZM 4 1L 9 1L 9 2L 9 3L 4 3L 4 2L 4 1ZM 12 15L 1 15L 1 2L 3 2L 3 4L 10 4L 10 2L 12 2L 12 15Z"
-      fill="#464646"
+        d="M 12 1L 10 1L 10 0L 3 0L 3 1L 1 1C 0.4 1 0 1.4 0 2L 0 15C 0 15.6 0.4 16 1 16L 12 16C 12.6 16 13 15.6 13 15L 13 2C 13 1.4 12.6 1 12 1ZM 4 1L 9 1L 9 2L 9 3L 4 3L 4 2L 4 1ZM 12 15L 1 15L 1 2L 3 2L 3 4L 10 4L 10 2L 12 2L 12 15Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 13 16"
     width="13"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M 12 1L 10 1L 10 0L 3 0L 3 1L 1 1C 0.4 1 0 1.4 0 2L 0 15C 0 15.6 0.4 16 1 16L 12 16C 12.6 16 13 15.6 13 15L 13 2C 13 1.4 12.6 1 12 1ZM 4 1L 9 1L 9 2L 9 3L 4 3L 4 2L 4 1ZM 12 15L 1 15L 1 2L 3 2L 3 4L 10 4L 10 2L 12 2L 12 15Z"
-      fill="#464646"
+        d="M 12 1L 10 1L 10 0L 3 0L 3 1L 1 1C 0.4 1 0 1.4 0 2L 0 15C 0 15.6 0.4 16 1 16L 12 16C 12.6 16 13 15.6 13 15L 13 2C 13 1.4 12.6 1 12 1ZM 4 1L 9 1L 9 2L 9 3L 4 3L 4 2L 4 1ZM 12 15L 1 15L 1 2L 3 2L 3 4L 10 4L 10 2L 12 2L 12 15Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 13 16"
     width="13"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M 12 1L 10 1L 10 0L 3 0L 3 1L 1 1C 0.4 1 0 1.4 0 2L 0 15C 0 15.6 0.4 16 1 16L 12 16C 12.6 16 13 15.6 13 15L 13 2C 13 1.4 12.6 1 12 1ZM 4 1L 9 1L 9 2L 9 3L 4 3L 4 2L 4 1ZM 12 15L 1 15L 1 2L 3 2L 3 4L 10 4L 10 2L 12 2L 12 15Z"
-      fill="#464646"
+        d="M 12 1L 10 1L 10 0L 3 0L 3 1L 1 1C 0.4 1 0 1.4 0 2L 0 15C 0 15.6 0.4 16 1 16L 12 16C 12.6 16 13 15.6 13 15L 13 2C 13 1.4 12.6 1 12 1ZM 4 1L 9 1L 9 2L 9 3L 4 3L 4 2L 4 1ZM 12 15L 1 15L 1 2L 3 2L 3 4L 10 4L 10 2L 12 2L 12 15Z"
+        fill="#464646"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Cpu /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="24"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 24 24"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M20,18a2,2,0,0,1-2,2H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H18a2,2,0,0,1,2,2Zm3-5a1,1,0,0,0,0-2H22V10h1a1,1,0,0,0,0-2H22V6a4,4,0,0,0-4-4H16V1a1,1,0,0,0-2,0V2H13V1a1,1,0,0,0-2,0V2H10V1A1,1,0,0,0,8,1V2H6A4,4,0,0,0,2,6V8H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v2a4,4,0,0,0,4,4H8v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h2a4,4,0,0,0,4-4V16h1a1,1,0,0,0,0-2H22V13ZM7,7V17H17V7Zm9,9H8V8h8Z"
-      fill="#464646"
+        d="M20,18a2,2,0,0,1-2,2H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H18a2,2,0,0,1,2,2Zm3-5a1,1,0,0,0,0-2H22V10h1a1,1,0,0,0,0-2H22V6a4,4,0,0,0-4-4H16V1a1,1,0,0,0-2,0V2H13V1a1,1,0,0,0-2,0V2H10V1A1,1,0,0,0,8,1V2H6A4,4,0,0,0,2,6V8H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v2a4,4,0,0,0,4,4H8v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h2a4,4,0,0,0,4-4V16h1a1,1,0,0,0,0-2H22V13ZM7,7V17H17V7Zm9,9H8V8h8Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="24"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 24 24"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M20,18a2,2,0,0,1-2,2H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H18a2,2,0,0,1,2,2Zm3-5a1,1,0,0,0,0-2H22V10h1a1,1,0,0,0,0-2H22V6a4,4,0,0,0-4-4H16V1a1,1,0,0,0-2,0V2H13V1a1,1,0,0,0-2,0V2H10V1A1,1,0,0,0,8,1V2H6A4,4,0,0,0,2,6V8H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v2a4,4,0,0,0,4,4H8v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h2a4,4,0,0,0,4-4V16h1a1,1,0,0,0,0-2H22V13ZM7,7V17H17V7Zm9,9H8V8h8Z"
-      fill="#FFF"
+        d="M20,18a2,2,0,0,1-2,2H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H18a2,2,0,0,1,2,2Zm3-5a1,1,0,0,0,0-2H22V10h1a1,1,0,0,0,0-2H22V6a4,4,0,0,0-4-4H16V1a1,1,0,0,0-2,0V2H13V1a1,1,0,0,0-2,0V2H10V1A1,1,0,0,0,8,1V2H6A4,4,0,0,0,2,6V8H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v2a4,4,0,0,0,4,4H8v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h2a4,4,0,0,0,4-4V16h1a1,1,0,0,0,0-2H22V13ZM7,7V17H17V7Zm9,9H8V8h8Z"
+        fill="#FFF"
     />
-  </svg>
+</svg>,
   <svg
     height="24"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 24 24"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M20,18a2,2,0,0,1-2,2H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H18a2,2,0,0,1,2,2Zm3-5a1,1,0,0,0,0-2H22V10h1a1,1,0,0,0,0-2H22V6a4,4,0,0,0-4-4H16V1a1,1,0,0,0-2,0V2H13V1a1,1,0,0,0-2,0V2H10V1A1,1,0,0,0,8,1V2H6A4,4,0,0,0,2,6V8H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v2a4,4,0,0,0,4,4H8v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h2a4,4,0,0,0,4-4V16h1a1,1,0,0,0,0-2H22V13ZM7,7V17H17V7Zm9,9H8V8h8Z"
-      fill={true}
+        d="M20,18a2,2,0,0,1-2,2H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H18a2,2,0,0,1,2,2Zm3-5a1,1,0,0,0,0-2H22V10h1a1,1,0,0,0,0-2H22V6a4,4,0,0,0-4-4H16V1a1,1,0,0,0-2,0V2H13V1a1,1,0,0,0-2,0V2H10V1A1,1,0,0,0,8,1V2H6A4,4,0,0,0,2,6V8H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v2a4,4,0,0,0,4,4H8v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h2a4,4,0,0,0,4-4V16h1a1,1,0,0,0,0-2H22V13ZM7,7V17H17V7Zm9,9H8V8h8Z"
+        fill={undefined}
     />
-  </svg>
+</svg>,
   <svg
     height="24"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 24 24"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M20,18a2,2,0,0,1-2,2H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H18a2,2,0,0,1,2,2Zm3-5a1,1,0,0,0,0-2H22V10h1a1,1,0,0,0,0-2H22V6a4,4,0,0,0-4-4H16V1a1,1,0,0,0-2,0V2H13V1a1,1,0,0,0-2,0V2H10V1A1,1,0,0,0,8,1V2H6A4,4,0,0,0,2,6V8H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v2a4,4,0,0,0,4,4H8v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h2a4,4,0,0,0,4-4V16h1a1,1,0,0,0,0-2H22V13ZM7,7V17H17V7Zm9,9H8V8h8Z"
-      fill="#464646"
+        d="M20,18a2,2,0,0,1-2,2H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H18a2,2,0,0,1,2,2Zm3-5a1,1,0,0,0,0-2H22V10h1a1,1,0,0,0,0-2H22V6a4,4,0,0,0-4-4H16V1a1,1,0,0,0-2,0V2H13V1a1,1,0,0,0-2,0V2H10V1A1,1,0,0,0,8,1V2H6A4,4,0,0,0,2,6V8H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v2a4,4,0,0,0,4,4H8v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h2a4,4,0,0,0,4-4V16h1a1,1,0,0,0,0-2H22V13ZM7,7V17H17V7Zm9,9H8V8h8Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="24"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 24 24"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M20,18a2,2,0,0,1-2,2H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H18a2,2,0,0,1,2,2Zm3-5a1,1,0,0,0,0-2H22V10h1a1,1,0,0,0,0-2H22V6a4,4,0,0,0-4-4H16V1a1,1,0,0,0-2,0V2H13V1a1,1,0,0,0-2,0V2H10V1A1,1,0,0,0,8,1V2H6A4,4,0,0,0,2,6V8H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v2a4,4,0,0,0,4,4H8v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h2a4,4,0,0,0,4-4V16h1a1,1,0,0,0,0-2H22V13ZM7,7V17H17V7Zm9,9H8V8h8Z"
-      fill="#464646"
+        d="M20,18a2,2,0,0,1-2,2H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H18a2,2,0,0,1,2,2Zm3-5a1,1,0,0,0,0-2H22V10h1a1,1,0,0,0,0-2H22V6a4,4,0,0,0-4-4H16V1a1,1,0,0,0-2,0V2H13V1a1,1,0,0,0-2,0V2H10V1A1,1,0,0,0,8,1V2H6A4,4,0,0,0,2,6V8H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v2a4,4,0,0,0,4,4H8v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h2a4,4,0,0,0,4-4V16h1a1,1,0,0,0,0-2H22V13ZM7,7V17H17V7Zm9,9H8V8h8Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="24"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 24 24"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M20,18a2,2,0,0,1-2,2H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H18a2,2,0,0,1,2,2Zm3-5a1,1,0,0,0,0-2H22V10h1a1,1,0,0,0,0-2H22V6a4,4,0,0,0-4-4H16V1a1,1,0,0,0-2,0V2H13V1a1,1,0,0,0-2,0V2H10V1A1,1,0,0,0,8,1V2H6A4,4,0,0,0,2,6V8H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v2a4,4,0,0,0,4,4H8v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h2a4,4,0,0,0,4-4V16h1a1,1,0,0,0,0-2H22V13ZM7,7V17H17V7Zm9,9H8V8h8Z"
-      fill="#464646"
+        d="M20,18a2,2,0,0,1-2,2H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H18a2,2,0,0,1,2,2Zm3-5a1,1,0,0,0,0-2H22V10h1a1,1,0,0,0,0-2H22V6a4,4,0,0,0-4-4H16V1a1,1,0,0,0-2,0V2H13V1a1,1,0,0,0-2,0V2H10V1A1,1,0,0,0,8,1V2H6A4,4,0,0,0,2,6V8H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v2a4,4,0,0,0,4,4H8v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h2a4,4,0,0,0,4-4V16h1a1,1,0,0,0,0-2H22V13ZM7,7V17H17V7Zm9,9H8V8h8Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="24"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 24 24"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M20,18a2,2,0,0,1-2,2H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H18a2,2,0,0,1,2,2Zm3-5a1,1,0,0,0,0-2H22V10h1a1,1,0,0,0,0-2H22V6a4,4,0,0,0-4-4H16V1a1,1,0,0,0-2,0V2H13V1a1,1,0,0,0-2,0V2H10V1A1,1,0,0,0,8,1V2H6A4,4,0,0,0,2,6V8H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v2a4,4,0,0,0,4,4H8v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h2a4,4,0,0,0,4-4V16h1a1,1,0,0,0,0-2H22V13ZM7,7V17H17V7Zm9,9H8V8h8Z"
-      fill="#464646"
+        d="M20,18a2,2,0,0,1-2,2H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H18a2,2,0,0,1,2,2Zm3-5a1,1,0,0,0,0-2H22V10h1a1,1,0,0,0,0-2H22V6a4,4,0,0,0-4-4H16V1a1,1,0,0,0-2,0V2H13V1a1,1,0,0,0-2,0V2H10V1A1,1,0,0,0,8,1V2H6A4,4,0,0,0,2,6V8H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v1H1a1,1,0,0,0,0,2H2v2a4,4,0,0,0,4,4H8v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h1v1a1,1,0,0,0,2,0V22h2a4,4,0,0,0,4-4V16h1a1,1,0,0,0,0-2H22V13ZM7,7V17H17V7Zm9,9H8V8h8Z"
+        fill="#464646"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <DataCenter /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="13"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 9 13"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M0 13h9V0H0v13zm2-2h5V2H2v9zm1-7h3.001V3H3v1zm0 2h3.001V5H3v1zm0 2h3.001V7H3v1z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M0 13h9V0H0v13zm2-2h5V2H2v9zm1-7h3.001V3H3v1zm0 2h3.001V5H3v1zm0 2h3.001V7H3v1z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="13"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 9 13"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M0 13h9V0H0v13zm2-2h5V2H2v9zm1-7h3.001V3H3v1zm0 2h3.001V5H3v1zm0 2h3.001V7H3v1z"
-      fill="#FFF"
-      fillRule="evenodd"
+        d="M0 13h9V0H0v13zm2-2h5V2H2v9zm1-7h3.001V3H3v1zm0 2h3.001V5H3v1zm0 2h3.001V7H3v1z"
+        fill="#FFF"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="13"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 9 13"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M0 13h9V0H0v13zm2-2h5V2H2v9zm1-7h3.001V3H3v1zm0 2h3.001V5H3v1zm0 2h3.001V7H3v1z"
-      fill={true}
-      fillRule="evenodd"
+        d="M0 13h9V0H0v13zm2-2h5V2H2v9zm1-7h3.001V3H3v1zm0 2h3.001V5H3v1zm0 2h3.001V7H3v1z"
+        fill={undefined}
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="13"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 9 13"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M0 13h9V0H0v13zm2-2h5V2H2v9zm1-7h3.001V3H3v1zm0 2h3.001V5H3v1zm0 2h3.001V7H3v1z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M0 13h9V0H0v13zm2-2h5V2H2v9zm1-7h3.001V3H3v1zm0 2h3.001V5H3v1zm0 2h3.001V7H3v1z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="13"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 9 13"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M0 13h9V0H0v13zm2-2h5V2H2v9zm1-7h3.001V3H3v1zm0 2h3.001V5H3v1zm0 2h3.001V7H3v1z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M0 13h9V0H0v13zm2-2h5V2H2v9zm1-7h3.001V3H3v1zm0 2h3.001V5H3v1zm0 2h3.001V7H3v1z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="13"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 9 13"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M0 13h9V0H0v13zm2-2h5V2H2v9zm1-7h3.001V3H3v1zm0 2h3.001V5H3v1zm0 2h3.001V7H3v1z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M0 13h9V0H0v13zm2-2h5V2H2v9zm1-7h3.001V3H3v1zm0 2h3.001V5H3v1zm0 2h3.001V7H3v1z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="13"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 9 13"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M0 13h9V0H0v13zm2-2h5V2H2v9zm1-7h3.001V3H3v1zm0 2h3.001V5H3v1zm0 2h3.001V7H3v1z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M0 13h9V0H0v13zm2-2h5V2H2v9zm1-7h3.001V3H3v1zm0 2h3.001V5H3v1zm0 2h3.001V7H3v1z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Delete /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 9 12"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17403 -18583)"
+        transform="translate(17403 -18583)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(-17403 18583)"
-          xlinkHref="#j"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(-17403 18583)"
+                xlinkHref="#j"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
-        fillRule="evenodd"
-        id="j"
-      />
+        <path
+            d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
+            fillRule="evenodd"
+            id="j"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 9 12"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17403 -18583)"
+        transform="translate(17403 -18583)"
     >
-      <g>
-        <use
-          fill="#FFF"
-          transform="translate(-17403 18583)"
-          xlinkHref="#j"
-        />
-      </g>
+        <g>
+            <use
+                fill="#FFF"
+                transform="translate(-17403 18583)"
+                xlinkHref="#j"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
-        fillRule="evenodd"
-        id="j"
-      />
+        <path
+            d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
+            fillRule="evenodd"
+            id="j"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 9 12"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17403 -18583)"
+        transform="translate(17403 -18583)"
     >
-      <g>
-        <use
-          fill={true}
-          transform="translate(-17403 18583)"
-          xlinkHref="#j"
-        />
-      </g>
+        <g>
+            <use
+                fill={undefined}
+                transform="translate(-17403 18583)"
+                xlinkHref="#j"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
-        fillRule="evenodd"
-        id="j"
-      />
+        <path
+            d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
+            fillRule="evenodd"
+            id="j"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 9 12"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17403 -18583)"
+        transform="translate(17403 -18583)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(-17403 18583)"
-          xlinkHref="#j"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(-17403 18583)"
+                xlinkHref="#j"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
-        fillRule="evenodd"
-        id="j"
-      />
+        <path
+            d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
+            fillRule="evenodd"
+            id="j"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 9 12"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17403 -18583)"
+        transform="translate(17403 -18583)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(-17403 18583)"
-          xlinkHref="#j"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(-17403 18583)"
+                xlinkHref="#j"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
-        fillRule="evenodd"
-        id="j"
-      />
+        <path
+            d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
+            fillRule="evenodd"
+            id="j"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 9 12"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17403 -18583)"
+        transform="translate(17403 -18583)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(-17403 18583)"
-          xlinkHref="#j"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(-17403 18583)"
+                xlinkHref="#j"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
-        fillRule="evenodd"
-        id="j"
-      />
+        <path
+            d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
+            fillRule="evenodd"
+            id="j"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 9 12"
     width="9"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17403 -18583)"
+        transform="translate(17403 -18583)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(-17403 18583)"
-          xlinkHref="#j"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(-17403 18583)"
+                xlinkHref="#j"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
-        fillRule="evenodd"
-        id="j"
-      />
+        <path
+            d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
+            fillRule="evenodd"
+            id="j"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Dot /> without throwing 1`] = `
-.c0 {
+Array [
+  .c0 {
   width: 0.375rem;
   height: 0.375rem;
   border-radius: 50%;
   display: inline-block;
 }
 
-<div>
-  <span
+<span
     className="c0"
-  />
-  <span
+/>,
+  .c0 {
+  width: 0.375rem;
+  height: 0.375rem;
+  border-radius: 50%;
+  display: inline-block;
+}
+
+<span
     className="c0"
-  />
-  <span
+/>,
+  .c0 {
+  width: 0.375rem;
+  height: 0.375rem;
+  border-radius: 50%;
+  display: inline-block;
+}
+
+<span
     className="c0"
     disabled={true}
-  />
-  <span
+/>,
+  .c0 {
+  width: 0.375rem;
+  height: 0.375rem;
+  border-radius: 50%;
+  display: inline-block;
+}
+
+<span
     className="c0"
     direction="right"
-  />
-  <span
+/>,
+  .c0 {
+  width: 0.375rem;
+  height: 0.375rem;
+  border-radius: 50%;
+  display: inline-block;
+}
+
+<span
     className="c0"
     direction="up"
-  />
-  <span
+/>,
+  .c0 {
+  width: 0.375rem;
+  height: 0.375rem;
+  border-radius: 50%;
+  display: inline-block;
+}
+
+<span
     className="c0"
     direction="left"
-  />
-  <span
+/>,
+  .c0 {
+  width: 0.375rem;
+  height: 0.375rem;
+  border-radius: 50%;
+  display: inline-block;
+}
+
+<span
     className="c0"
     direction="down"
-  />
-</div>
+/>,
+]
 `;
 
 exports[`renders <Duplicate /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17861 -18582)"
+        transform="translate(17861 -18582)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(-17861 18582)"
-          xlinkHref="#k"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(-17861 18582)"
+                xlinkHref="#k"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 7 0L 5 0L 5 5L 0 5L 0 7L 5 7L 5 12L 7 12L 7 7L 12 7L 12 5L 7 5L 7 0Z"
-        fillRule="evenodd"
-        id="k"
-      />
+        <path
+            d="M 7 0L 5 0L 5 5L 0 5L 0 7L 5 7L 5 12L 7 12L 7 7L 12 7L 12 5L 7 5L 7 0Z"
+            fillRule="evenodd"
+            id="k"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17861 -18582)"
+        transform="translate(17861 -18582)"
     >
-      <g>
-        <use
-          fill="#FFF"
-          transform="translate(-17861 18582)"
-          xlinkHref="#k"
-        />
-      </g>
+        <g>
+            <use
+                fill="#FFF"
+                transform="translate(-17861 18582)"
+                xlinkHref="#k"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 7 0L 5 0L 5 5L 0 5L 0 7L 5 7L 5 12L 7 12L 7 7L 12 7L 12 5L 7 5L 7 0Z"
-        fillRule="evenodd"
-        id="k"
-      />
+        <path
+            d="M 7 0L 5 0L 5 5L 0 5L 0 7L 5 7L 5 12L 7 12L 7 7L 12 7L 12 5L 7 5L 7 0Z"
+            fillRule="evenodd"
+            id="k"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17861 -18582)"
+        transform="translate(17861 -18582)"
     >
-      <g>
-        <use
-          fill={true}
-          transform="translate(-17861 18582)"
-          xlinkHref="#k"
-        />
-      </g>
+        <g>
+            <use
+                fill={undefined}
+                transform="translate(-17861 18582)"
+                xlinkHref="#k"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 7 0L 5 0L 5 5L 0 5L 0 7L 5 7L 5 12L 7 12L 7 7L 12 7L 12 5L 7 5L 7 0Z"
-        fillRule="evenodd"
-        id="k"
-      />
+        <path
+            d="M 7 0L 5 0L 5 5L 0 5L 0 7L 5 7L 5 12L 7 12L 7 7L 12 7L 12 5L 7 5L 7 0Z"
+            fillRule="evenodd"
+            id="k"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17861 -18582)"
+        transform="translate(17861 -18582)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(-17861 18582)"
-          xlinkHref="#k"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(-17861 18582)"
+                xlinkHref="#k"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 7 0L 5 0L 5 5L 0 5L 0 7L 5 7L 5 12L 7 12L 7 7L 12 7L 12 5L 7 5L 7 0Z"
-        fillRule="evenodd"
-        id="k"
-      />
+        <path
+            d="M 7 0L 5 0L 5 5L 0 5L 0 7L 5 7L 5 12L 7 12L 7 7L 12 7L 12 5L 7 5L 7 0Z"
+            fillRule="evenodd"
+            id="k"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17861 -18582)"
+        transform="translate(17861 -18582)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(-17861 18582)"
-          xlinkHref="#k"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(-17861 18582)"
+                xlinkHref="#k"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 7 0L 5 0L 5 5L 0 5L 0 7L 5 7L 5 12L 7 12L 7 7L 12 7L 12 5L 7 5L 7 0Z"
-        fillRule="evenodd"
-        id="k"
-      />
+        <path
+            d="M 7 0L 5 0L 5 5L 0 5L 0 7L 5 7L 5 12L 7 12L 7 7L 12 7L 12 5L 7 5L 7 0Z"
+            fillRule="evenodd"
+            id="k"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17861 -18582)"
+        transform="translate(17861 -18582)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(-17861 18582)"
-          xlinkHref="#k"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(-17861 18582)"
+                xlinkHref="#k"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 7 0L 5 0L 5 5L 0 5L 0 7L 5 7L 5 12L 7 12L 7 7L 12 7L 12 5L 7 5L 7 0Z"
-        fillRule="evenodd"
-        id="k"
-      />
+        <path
+            d="M 7 0L 5 0L 5 5L 0 5L 0 7L 5 7L 5 12L 7 12L 7 7L 12 7L 12 5L 7 5L 7 0Z"
+            fillRule="evenodd"
+            id="k"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17861 -18582)"
+        transform="translate(17861 -18582)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(-17861 18582)"
-          xlinkHref="#k"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(-17861 18582)"
+                xlinkHref="#k"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 7 0L 5 0L 5 5L 0 5L 0 7L 5 7L 5 12L 7 12L 7 7L 12 7L 12 5L 7 5L 7 0Z"
-        fillRule="evenodd"
-        id="k"
-      />
+        <path
+            d="M 7 0L 5 0L 5 5L 0 5L 0 7L 5 7L 5 12L 7 12L 7 7L 12 7L 12 5L 7 5L 7 0Z"
+            fillRule="evenodd"
+            id="k"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Edit /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     width="17"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1886 444)"
+        transform="translate(-1886 444)"
     >
-      <use
-        fill="#464646"
-        transform="translate(1886 -441.9)"
-        xlinkHref="#l"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1889.4 -444)"
-        xlinkHref="#m"
-      />
+        <use
+            fill="#464646"
+            transform="translate(1886 -441.9)"
+            xlinkHref="#l"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1889.4 -444)"
+            xlinkHref="#m"
+        />
     </g>
     <defs>
-      <path
-        d="M13 7v5c0 .5-.4 1-1 1H2c-.5 0-1-.4-1-1V2c0-.5.4-1 1-1h5V0H2C.9 0 0 .9 0 2v10c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V7h-1z"
-        id="l"
-      />
-      <path
-        d="M9.8 0L1.4 8.5 0 12.7l4.2-1.4 8.5-8.5L9.8 0zm-7 8.5l7.1-7.1 1.4 1.4-7.1 7.1-1.4-1.4z"
-        id="m"
-      />
+        <path
+            d="M13 7v5c0 .5-.4 1-1 1H2c-.5 0-1-.4-1-1V2c0-.5.4-1 1-1h5V0H2C.9 0 0 .9 0 2v10c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V7h-1z"
+            id="l"
+        />
+        <path
+            d="M9.8 0L1.4 8.5 0 12.7l4.2-1.4 8.5-8.5L9.8 0zm-7 8.5l7.1-7.1 1.4 1.4-7.1 7.1-1.4-1.4z"
+            id="m"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     width="17"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1886 444)"
+        transform="translate(-1886 444)"
     >
-      <use
-        fill="#FFF"
-        transform="translate(1886 -441.9)"
-        xlinkHref="#l"
-      />
-      <use
-        fill="#FFF"
-        transform="translate(1889.4 -444)"
-        xlinkHref="#m"
-      />
+        <use
+            fill="#FFF"
+            transform="translate(1886 -441.9)"
+            xlinkHref="#l"
+        />
+        <use
+            fill="#FFF"
+            transform="translate(1889.4 -444)"
+            xlinkHref="#m"
+        />
     </g>
     <defs>
-      <path
-        d="M13 7v5c0 .5-.4 1-1 1H2c-.5 0-1-.4-1-1V2c0-.5.4-1 1-1h5V0H2C.9 0 0 .9 0 2v10c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V7h-1z"
-        id="l"
-      />
-      <path
-        d="M9.8 0L1.4 8.5 0 12.7l4.2-1.4 8.5-8.5L9.8 0zm-7 8.5l7.1-7.1 1.4 1.4-7.1 7.1-1.4-1.4z"
-        id="m"
-      />
+        <path
+            d="M13 7v5c0 .5-.4 1-1 1H2c-.5 0-1-.4-1-1V2c0-.5.4-1 1-1h5V0H2C.9 0 0 .9 0 2v10c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V7h-1z"
+            id="l"
+        />
+        <path
+            d="M9.8 0L1.4 8.5 0 12.7l4.2-1.4 8.5-8.5L9.8 0zm-7 8.5l7.1-7.1 1.4 1.4-7.1 7.1-1.4-1.4z"
+            id="m"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     width="17"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1886 444)"
+        transform="translate(-1886 444)"
     >
-      <use
-        fill={true}
-        transform="translate(1886 -441.9)"
-        xlinkHref="#l"
-      />
-      <use
-        fill={true}
-        transform="translate(1889.4 -444)"
-        xlinkHref="#m"
-      />
+        <use
+            fill={undefined}
+            transform="translate(1886 -441.9)"
+            xlinkHref="#l"
+        />
+        <use
+            fill={undefined}
+            transform="translate(1889.4 -444)"
+            xlinkHref="#m"
+        />
     </g>
     <defs>
-      <path
-        d="M13 7v5c0 .5-.4 1-1 1H2c-.5 0-1-.4-1-1V2c0-.5.4-1 1-1h5V0H2C.9 0 0 .9 0 2v10c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V7h-1z"
-        id="l"
-      />
-      <path
-        d="M9.8 0L1.4 8.5 0 12.7l4.2-1.4 8.5-8.5L9.8 0zm-7 8.5l7.1-7.1 1.4 1.4-7.1 7.1-1.4-1.4z"
-        id="m"
-      />
+        <path
+            d="M13 7v5c0 .5-.4 1-1 1H2c-.5 0-1-.4-1-1V2c0-.5.4-1 1-1h5V0H2C.9 0 0 .9 0 2v10c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V7h-1z"
+            id="l"
+        />
+        <path
+            d="M9.8 0L1.4 8.5 0 12.7l4.2-1.4 8.5-8.5L9.8 0zm-7 8.5l7.1-7.1 1.4 1.4-7.1 7.1-1.4-1.4z"
+            id="m"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     width="17"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1886 444)"
+        transform="translate(-1886 444)"
     >
-      <use
-        fill="#464646"
-        transform="translate(1886 -441.9)"
-        xlinkHref="#l"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1889.4 -444)"
-        xlinkHref="#m"
-      />
+        <use
+            fill="#464646"
+            transform="translate(1886 -441.9)"
+            xlinkHref="#l"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1889.4 -444)"
+            xlinkHref="#m"
+        />
     </g>
     <defs>
-      <path
-        d="M13 7v5c0 .5-.4 1-1 1H2c-.5 0-1-.4-1-1V2c0-.5.4-1 1-1h5V0H2C.9 0 0 .9 0 2v10c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V7h-1z"
-        id="l"
-      />
-      <path
-        d="M9.8 0L1.4 8.5 0 12.7l4.2-1.4 8.5-8.5L9.8 0zm-7 8.5l7.1-7.1 1.4 1.4-7.1 7.1-1.4-1.4z"
-        id="m"
-      />
+        <path
+            d="M13 7v5c0 .5-.4 1-1 1H2c-.5 0-1-.4-1-1V2c0-.5.4-1 1-1h5V0H2C.9 0 0 .9 0 2v10c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V7h-1z"
+            id="l"
+        />
+        <path
+            d="M9.8 0L1.4 8.5 0 12.7l4.2-1.4 8.5-8.5L9.8 0zm-7 8.5l7.1-7.1 1.4 1.4-7.1 7.1-1.4-1.4z"
+            id="m"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     width="17"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1886 444)"
+        transform="translate(-1886 444)"
     >
-      <use
-        fill="#464646"
-        transform="translate(1886 -441.9)"
-        xlinkHref="#l"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1889.4 -444)"
-        xlinkHref="#m"
-      />
+        <use
+            fill="#464646"
+            transform="translate(1886 -441.9)"
+            xlinkHref="#l"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1889.4 -444)"
+            xlinkHref="#m"
+        />
     </g>
     <defs>
-      <path
-        d="M13 7v5c0 .5-.4 1-1 1H2c-.5 0-1-.4-1-1V2c0-.5.4-1 1-1h5V0H2C.9 0 0 .9 0 2v10c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V7h-1z"
-        id="l"
-      />
-      <path
-        d="M9.8 0L1.4 8.5 0 12.7l4.2-1.4 8.5-8.5L9.8 0zm-7 8.5l7.1-7.1 1.4 1.4-7.1 7.1-1.4-1.4z"
-        id="m"
-      />
+        <path
+            d="M13 7v5c0 .5-.4 1-1 1H2c-.5 0-1-.4-1-1V2c0-.5.4-1 1-1h5V0H2C.9 0 0 .9 0 2v10c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V7h-1z"
+            id="l"
+        />
+        <path
+            d="M9.8 0L1.4 8.5 0 12.7l4.2-1.4 8.5-8.5L9.8 0zm-7 8.5l7.1-7.1 1.4 1.4-7.1 7.1-1.4-1.4z"
+            id="m"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     width="17"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1886 444)"
+        transform="translate(-1886 444)"
     >
-      <use
-        fill="#464646"
-        transform="translate(1886 -441.9)"
-        xlinkHref="#l"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1889.4 -444)"
-        xlinkHref="#m"
-      />
+        <use
+            fill="#464646"
+            transform="translate(1886 -441.9)"
+            xlinkHref="#l"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1889.4 -444)"
+            xlinkHref="#m"
+        />
     </g>
     <defs>
-      <path
-        d="M13 7v5c0 .5-.4 1-1 1H2c-.5 0-1-.4-1-1V2c0-.5.4-1 1-1h5V0H2C.9 0 0 .9 0 2v10c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V7h-1z"
-        id="l"
-      />
-      <path
-        d="M9.8 0L1.4 8.5 0 12.7l4.2-1.4 8.5-8.5L9.8 0zm-7 8.5l7.1-7.1 1.4 1.4-7.1 7.1-1.4-1.4z"
-        id="m"
-      />
+        <path
+            d="M13 7v5c0 .5-.4 1-1 1H2c-.5 0-1-.4-1-1V2c0-.5.4-1 1-1h5V0H2C.9 0 0 .9 0 2v10c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V7h-1z"
+            id="l"
+        />
+        <path
+            d="M9.8 0L1.4 8.5 0 12.7l4.2-1.4 8.5-8.5L9.8 0zm-7 8.5l7.1-7.1 1.4 1.4-7.1 7.1-1.4-1.4z"
+            id="m"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     width="17"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1886 444)"
+        transform="translate(-1886 444)"
     >
-      <use
-        fill="#464646"
-        transform="translate(1886 -441.9)"
-        xlinkHref="#l"
-      />
-      <use
-        fill="#464646"
-        transform="translate(1889.4 -444)"
-        xlinkHref="#m"
-      />
+        <use
+            fill="#464646"
+            transform="translate(1886 -441.9)"
+            xlinkHref="#l"
+        />
+        <use
+            fill="#464646"
+            transform="translate(1889.4 -444)"
+            xlinkHref="#m"
+        />
     </g>
     <defs>
-      <path
-        d="M13 7v5c0 .5-.4 1-1 1H2c-.5 0-1-.4-1-1V2c0-.5.4-1 1-1h5V0H2C.9 0 0 .9 0 2v10c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V7h-1z"
-        id="l"
-      />
-      <path
-        d="M9.8 0L1.4 8.5 0 12.7l4.2-1.4 8.5-8.5L9.8 0zm-7 8.5l7.1-7.1 1.4 1.4-7.1 7.1-1.4-1.4z"
-        id="m"
-      />
+        <path
+            d="M13 7v5c0 .5-.4 1-1 1H2c-.5 0-1-.4-1-1V2c0-.5.4-1 1-1h5V0H2C.9 0 0 .9 0 2v10c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V7h-1z"
+            id="l"
+        />
+        <path
+            d="M9.8 0L1.4 8.5 0 12.7l4.2-1.4 8.5-8.5L9.8 0zm-7 8.5l7.1-7.1 1.4 1.4-7.1 7.1-1.4-1.4z"
+            id="m"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Fabric /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 16.2 16.2"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <path
-      d="M16.2,6.61a17.42,17.42,0,0,0-3.37-.26,11.67,11.67,0,0,1-.47-4A15.72,15.72,0,0,1,16,2.59l.2-1a16,16,0,0,0-3.77-.24A11,11,0,0,1,12.59.2l-1-.2a14.09,14.09,0,0,0-.2,1.46A8.44,8.44,0,0,0,7.82,2.68c-.15.1-.31.19-.47.28A15.07,15.07,0,0,1,7.59.2l-1-.2a16.37,16.37,0,0,0-.26,3.37,11.66,11.66,0,0,1-4,.46A15.6,15.6,0,0,1,2.59.2l-1-.2a16.29,16.29,0,0,0-.25,3.77C.67,3.7.21,3.61.2,3.61l-.2,1c.07,0,.63.12,1.46.19a8.48,8.48,0,0,0,1.22,3.6A5.3,5.3,0,0,1,3,8.85,17.52,17.52,0,0,1,.2,8.61l-.2,1a16.66,16.66,0,0,0,3,.26h.4a11.71,11.71,0,0,1,.46,4A17,17,0,0,1,.2,13.61l-.2,1a16.66,16.66,0,0,0,3,.26l.8,0c-.07.7-.16,1.16-.16,1.17l1,.2c0-.07.12-.63.19-1.46a8.49,8.49,0,0,0,3.6-1.23c.15-.1.3-.18.46-.27A16.88,16.88,0,0,1,8.61,16l1,.2a17,17,0,0,0,.25-3.37,11.73,11.73,0,0,1,4-.47A17.13,17.13,0,0,1,13.61,16l1,.2a17.28,17.28,0,0,0,.24-3.77,11,11,0,0,1,1.17.16l.2-1a14.09,14.09,0,0,0-1.46-.2,8.45,8.45,0,0,0-1.23-3.59c-.1-.15-.18-.31-.27-.47A15.07,15.07,0,0,1,16,7.59ZM8.38,3.51a7.26,7.26,0,0,1,3-1,13.17,13.17,0,0,0,.44,3.93,9.35,9.35,0,0,0-3.51,1A8.4,8.4,0,0,1,7.39,4,6.75,6.75,0,0,0,8.38,3.51ZM2.48,4.84H3a12.4,12.4,0,0,0,3.44-.44,9.35,9.35,0,0,0,1,3.51A8.38,8.38,0,0,1,4,8.8a6.18,6.18,0,0,0-.53-1A7.36,7.36,0,0,1,2.48,4.84Zm5.34,7.84a7.22,7.22,0,0,1-3,1A12.61,12.61,0,0,0,4.4,9.78a9,9,0,0,0,3.52-1,8.43,8.43,0,0,1,.88,3.37A7.11,7.11,0,0,0,7.82,12.68Zm5.9-1.33a13.23,13.23,0,0,0-3.94.44,9,9,0,0,0-1-3.51,8.44,8.44,0,0,1,3.38-.89,6.69,6.69,0,0,0,.52,1A7.13,7.13,0,0,1,13.72,11.35Z"
-      fill="#464646"
+        d="M16.2,6.61a17.42,17.42,0,0,0-3.37-.26,11.67,11.67,0,0,1-.47-4A15.72,15.72,0,0,1,16,2.59l.2-1a16,16,0,0,0-3.77-.24A11,11,0,0,1,12.59.2l-1-.2a14.09,14.09,0,0,0-.2,1.46A8.44,8.44,0,0,0,7.82,2.68c-.15.1-.31.19-.47.28A15.07,15.07,0,0,1,7.59.2l-1-.2a16.37,16.37,0,0,0-.26,3.37,11.66,11.66,0,0,1-4,.46A15.6,15.6,0,0,1,2.59.2l-1-.2a16.29,16.29,0,0,0-.25,3.77C.67,3.7.21,3.61.2,3.61l-.2,1c.07,0,.63.12,1.46.19a8.48,8.48,0,0,0,1.22,3.6A5.3,5.3,0,0,1,3,8.85,17.52,17.52,0,0,1,.2,8.61l-.2,1a16.66,16.66,0,0,0,3,.26h.4a11.71,11.71,0,0,1,.46,4A17,17,0,0,1,.2,13.61l-.2,1a16.66,16.66,0,0,0,3,.26l.8,0c-.07.7-.16,1.16-.16,1.17l1,.2c0-.07.12-.63.19-1.46a8.49,8.49,0,0,0,3.6-1.23c.15-.1.3-.18.46-.27A16.88,16.88,0,0,1,8.61,16l1,.2a17,17,0,0,0,.25-3.37,11.73,11.73,0,0,1,4-.47A17.13,17.13,0,0,1,13.61,16l1,.2a17.28,17.28,0,0,0,.24-3.77,11,11,0,0,1,1.17.16l.2-1a14.09,14.09,0,0,0-1.46-.2,8.45,8.45,0,0,0-1.23-3.59c-.1-.15-.18-.31-.27-.47A15.07,15.07,0,0,1,16,7.59ZM8.38,3.51a7.26,7.26,0,0,1,3-1,13.17,13.17,0,0,0,.44,3.93,9.35,9.35,0,0,0-3.51,1A8.4,8.4,0,0,1,7.39,4,6.75,6.75,0,0,0,8.38,3.51ZM2.48,4.84H3a12.4,12.4,0,0,0,3.44-.44,9.35,9.35,0,0,0,1,3.51A8.38,8.38,0,0,1,4,8.8a6.18,6.18,0,0,0-.53-1A7.36,7.36,0,0,1,2.48,4.84Zm5.34,7.84a7.22,7.22,0,0,1-3,1A12.61,12.61,0,0,0,4.4,9.78a9,9,0,0,0,3.52-1,8.43,8.43,0,0,1,.88,3.37A7.11,7.11,0,0,0,7.82,12.68Zm5.9-1.33a13.23,13.23,0,0,0-3.94.44,9,9,0,0,0-1-3.51,8.44,8.44,0,0,1,3.38-.89,6.69,6.69,0,0,0,.52,1A7.13,7.13,0,0,1,13.72,11.35Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 16.2 16.2"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <path
-      d="M16.2,6.61a17.42,17.42,0,0,0-3.37-.26,11.67,11.67,0,0,1-.47-4A15.72,15.72,0,0,1,16,2.59l.2-1a16,16,0,0,0-3.77-.24A11,11,0,0,1,12.59.2l-1-.2a14.09,14.09,0,0,0-.2,1.46A8.44,8.44,0,0,0,7.82,2.68c-.15.1-.31.19-.47.28A15.07,15.07,0,0,1,7.59.2l-1-.2a16.37,16.37,0,0,0-.26,3.37,11.66,11.66,0,0,1-4,.46A15.6,15.6,0,0,1,2.59.2l-1-.2a16.29,16.29,0,0,0-.25,3.77C.67,3.7.21,3.61.2,3.61l-.2,1c.07,0,.63.12,1.46.19a8.48,8.48,0,0,0,1.22,3.6A5.3,5.3,0,0,1,3,8.85,17.52,17.52,0,0,1,.2,8.61l-.2,1a16.66,16.66,0,0,0,3,.26h.4a11.71,11.71,0,0,1,.46,4A17,17,0,0,1,.2,13.61l-.2,1a16.66,16.66,0,0,0,3,.26l.8,0c-.07.7-.16,1.16-.16,1.17l1,.2c0-.07.12-.63.19-1.46a8.49,8.49,0,0,0,3.6-1.23c.15-.1.3-.18.46-.27A16.88,16.88,0,0,1,8.61,16l1,.2a17,17,0,0,0,.25-3.37,11.73,11.73,0,0,1,4-.47A17.13,17.13,0,0,1,13.61,16l1,.2a17.28,17.28,0,0,0,.24-3.77,11,11,0,0,1,1.17.16l.2-1a14.09,14.09,0,0,0-1.46-.2,8.45,8.45,0,0,0-1.23-3.59c-.1-.15-.18-.31-.27-.47A15.07,15.07,0,0,1,16,7.59ZM8.38,3.51a7.26,7.26,0,0,1,3-1,13.17,13.17,0,0,0,.44,3.93,9.35,9.35,0,0,0-3.51,1A8.4,8.4,0,0,1,7.39,4,6.75,6.75,0,0,0,8.38,3.51ZM2.48,4.84H3a12.4,12.4,0,0,0,3.44-.44,9.35,9.35,0,0,0,1,3.51A8.38,8.38,0,0,1,4,8.8a6.18,6.18,0,0,0-.53-1A7.36,7.36,0,0,1,2.48,4.84Zm5.34,7.84a7.22,7.22,0,0,1-3,1A12.61,12.61,0,0,0,4.4,9.78a9,9,0,0,0,3.52-1,8.43,8.43,0,0,1,.88,3.37A7.11,7.11,0,0,0,7.82,12.68Zm5.9-1.33a13.23,13.23,0,0,0-3.94.44,9,9,0,0,0-1-3.51,8.44,8.44,0,0,1,3.38-.89,6.69,6.69,0,0,0,.52,1A7.13,7.13,0,0,1,13.72,11.35Z"
-      fill="#FFF"
+        d="M16.2,6.61a17.42,17.42,0,0,0-3.37-.26,11.67,11.67,0,0,1-.47-4A15.72,15.72,0,0,1,16,2.59l.2-1a16,16,0,0,0-3.77-.24A11,11,0,0,1,12.59.2l-1-.2a14.09,14.09,0,0,0-.2,1.46A8.44,8.44,0,0,0,7.82,2.68c-.15.1-.31.19-.47.28A15.07,15.07,0,0,1,7.59.2l-1-.2a16.37,16.37,0,0,0-.26,3.37,11.66,11.66,0,0,1-4,.46A15.6,15.6,0,0,1,2.59.2l-1-.2a16.29,16.29,0,0,0-.25,3.77C.67,3.7.21,3.61.2,3.61l-.2,1c.07,0,.63.12,1.46.19a8.48,8.48,0,0,0,1.22,3.6A5.3,5.3,0,0,1,3,8.85,17.52,17.52,0,0,1,.2,8.61l-.2,1a16.66,16.66,0,0,0,3,.26h.4a11.71,11.71,0,0,1,.46,4A17,17,0,0,1,.2,13.61l-.2,1a16.66,16.66,0,0,0,3,.26l.8,0c-.07.7-.16,1.16-.16,1.17l1,.2c0-.07.12-.63.19-1.46a8.49,8.49,0,0,0,3.6-1.23c.15-.1.3-.18.46-.27A16.88,16.88,0,0,1,8.61,16l1,.2a17,17,0,0,0,.25-3.37,11.73,11.73,0,0,1,4-.47A17.13,17.13,0,0,1,13.61,16l1,.2a17.28,17.28,0,0,0,.24-3.77,11,11,0,0,1,1.17.16l.2-1a14.09,14.09,0,0,0-1.46-.2,8.45,8.45,0,0,0-1.23-3.59c-.1-.15-.18-.31-.27-.47A15.07,15.07,0,0,1,16,7.59ZM8.38,3.51a7.26,7.26,0,0,1,3-1,13.17,13.17,0,0,0,.44,3.93,9.35,9.35,0,0,0-3.51,1A8.4,8.4,0,0,1,7.39,4,6.75,6.75,0,0,0,8.38,3.51ZM2.48,4.84H3a12.4,12.4,0,0,0,3.44-.44,9.35,9.35,0,0,0,1,3.51A8.38,8.38,0,0,1,4,8.8a6.18,6.18,0,0,0-.53-1A7.36,7.36,0,0,1,2.48,4.84Zm5.34,7.84a7.22,7.22,0,0,1-3,1A12.61,12.61,0,0,0,4.4,9.78a9,9,0,0,0,3.52-1,8.43,8.43,0,0,1,.88,3.37A7.11,7.11,0,0,0,7.82,12.68Zm5.9-1.33a13.23,13.23,0,0,0-3.94.44,9,9,0,0,0-1-3.51,8.44,8.44,0,0,1,3.38-.89,6.69,6.69,0,0,0,.52,1A7.13,7.13,0,0,1,13.72,11.35Z"
+        fill="#FFF"
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 16.2 16.2"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <path
-      d="M16.2,6.61a17.42,17.42,0,0,0-3.37-.26,11.67,11.67,0,0,1-.47-4A15.72,15.72,0,0,1,16,2.59l.2-1a16,16,0,0,0-3.77-.24A11,11,0,0,1,12.59.2l-1-.2a14.09,14.09,0,0,0-.2,1.46A8.44,8.44,0,0,0,7.82,2.68c-.15.1-.31.19-.47.28A15.07,15.07,0,0,1,7.59.2l-1-.2a16.37,16.37,0,0,0-.26,3.37,11.66,11.66,0,0,1-4,.46A15.6,15.6,0,0,1,2.59.2l-1-.2a16.29,16.29,0,0,0-.25,3.77C.67,3.7.21,3.61.2,3.61l-.2,1c.07,0,.63.12,1.46.19a8.48,8.48,0,0,0,1.22,3.6A5.3,5.3,0,0,1,3,8.85,17.52,17.52,0,0,1,.2,8.61l-.2,1a16.66,16.66,0,0,0,3,.26h.4a11.71,11.71,0,0,1,.46,4A17,17,0,0,1,.2,13.61l-.2,1a16.66,16.66,0,0,0,3,.26l.8,0c-.07.7-.16,1.16-.16,1.17l1,.2c0-.07.12-.63.19-1.46a8.49,8.49,0,0,0,3.6-1.23c.15-.1.3-.18.46-.27A16.88,16.88,0,0,1,8.61,16l1,.2a17,17,0,0,0,.25-3.37,11.73,11.73,0,0,1,4-.47A17.13,17.13,0,0,1,13.61,16l1,.2a17.28,17.28,0,0,0,.24-3.77,11,11,0,0,1,1.17.16l.2-1a14.09,14.09,0,0,0-1.46-.2,8.45,8.45,0,0,0-1.23-3.59c-.1-.15-.18-.31-.27-.47A15.07,15.07,0,0,1,16,7.59ZM8.38,3.51a7.26,7.26,0,0,1,3-1,13.17,13.17,0,0,0,.44,3.93,9.35,9.35,0,0,0-3.51,1A8.4,8.4,0,0,1,7.39,4,6.75,6.75,0,0,0,8.38,3.51ZM2.48,4.84H3a12.4,12.4,0,0,0,3.44-.44,9.35,9.35,0,0,0,1,3.51A8.38,8.38,0,0,1,4,8.8a6.18,6.18,0,0,0-.53-1A7.36,7.36,0,0,1,2.48,4.84Zm5.34,7.84a7.22,7.22,0,0,1-3,1A12.61,12.61,0,0,0,4.4,9.78a9,9,0,0,0,3.52-1,8.43,8.43,0,0,1,.88,3.37A7.11,7.11,0,0,0,7.82,12.68Zm5.9-1.33a13.23,13.23,0,0,0-3.94.44,9,9,0,0,0-1-3.51,8.44,8.44,0,0,1,3.38-.89,6.69,6.69,0,0,0,.52,1A7.13,7.13,0,0,1,13.72,11.35Z"
-      fill={true}
+        d="M16.2,6.61a17.42,17.42,0,0,0-3.37-.26,11.67,11.67,0,0,1-.47-4A15.72,15.72,0,0,1,16,2.59l.2-1a16,16,0,0,0-3.77-.24A11,11,0,0,1,12.59.2l-1-.2a14.09,14.09,0,0,0-.2,1.46A8.44,8.44,0,0,0,7.82,2.68c-.15.1-.31.19-.47.28A15.07,15.07,0,0,1,7.59.2l-1-.2a16.37,16.37,0,0,0-.26,3.37,11.66,11.66,0,0,1-4,.46A15.6,15.6,0,0,1,2.59.2l-1-.2a16.29,16.29,0,0,0-.25,3.77C.67,3.7.21,3.61.2,3.61l-.2,1c.07,0,.63.12,1.46.19a8.48,8.48,0,0,0,1.22,3.6A5.3,5.3,0,0,1,3,8.85,17.52,17.52,0,0,1,.2,8.61l-.2,1a16.66,16.66,0,0,0,3,.26h.4a11.71,11.71,0,0,1,.46,4A17,17,0,0,1,.2,13.61l-.2,1a16.66,16.66,0,0,0,3,.26l.8,0c-.07.7-.16,1.16-.16,1.17l1,.2c0-.07.12-.63.19-1.46a8.49,8.49,0,0,0,3.6-1.23c.15-.1.3-.18.46-.27A16.88,16.88,0,0,1,8.61,16l1,.2a17,17,0,0,0,.25-3.37,11.73,11.73,0,0,1,4-.47A17.13,17.13,0,0,1,13.61,16l1,.2a17.28,17.28,0,0,0,.24-3.77,11,11,0,0,1,1.17.16l.2-1a14.09,14.09,0,0,0-1.46-.2,8.45,8.45,0,0,0-1.23-3.59c-.1-.15-.18-.31-.27-.47A15.07,15.07,0,0,1,16,7.59ZM8.38,3.51a7.26,7.26,0,0,1,3-1,13.17,13.17,0,0,0,.44,3.93,9.35,9.35,0,0,0-3.51,1A8.4,8.4,0,0,1,7.39,4,6.75,6.75,0,0,0,8.38,3.51ZM2.48,4.84H3a12.4,12.4,0,0,0,3.44-.44,9.35,9.35,0,0,0,1,3.51A8.38,8.38,0,0,1,4,8.8a6.18,6.18,0,0,0-.53-1A7.36,7.36,0,0,1,2.48,4.84Zm5.34,7.84a7.22,7.22,0,0,1-3,1A12.61,12.61,0,0,0,4.4,9.78a9,9,0,0,0,3.52-1,8.43,8.43,0,0,1,.88,3.37A7.11,7.11,0,0,0,7.82,12.68Zm5.9-1.33a13.23,13.23,0,0,0-3.94.44,9,9,0,0,0-1-3.51,8.44,8.44,0,0,1,3.38-.89,6.69,6.69,0,0,0,.52,1A7.13,7.13,0,0,1,13.72,11.35Z"
+        fill={undefined}
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 16.2 16.2"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <path
-      d="M16.2,6.61a17.42,17.42,0,0,0-3.37-.26,11.67,11.67,0,0,1-.47-4A15.72,15.72,0,0,1,16,2.59l.2-1a16,16,0,0,0-3.77-.24A11,11,0,0,1,12.59.2l-1-.2a14.09,14.09,0,0,0-.2,1.46A8.44,8.44,0,0,0,7.82,2.68c-.15.1-.31.19-.47.28A15.07,15.07,0,0,1,7.59.2l-1-.2a16.37,16.37,0,0,0-.26,3.37,11.66,11.66,0,0,1-4,.46A15.6,15.6,0,0,1,2.59.2l-1-.2a16.29,16.29,0,0,0-.25,3.77C.67,3.7.21,3.61.2,3.61l-.2,1c.07,0,.63.12,1.46.19a8.48,8.48,0,0,0,1.22,3.6A5.3,5.3,0,0,1,3,8.85,17.52,17.52,0,0,1,.2,8.61l-.2,1a16.66,16.66,0,0,0,3,.26h.4a11.71,11.71,0,0,1,.46,4A17,17,0,0,1,.2,13.61l-.2,1a16.66,16.66,0,0,0,3,.26l.8,0c-.07.7-.16,1.16-.16,1.17l1,.2c0-.07.12-.63.19-1.46a8.49,8.49,0,0,0,3.6-1.23c.15-.1.3-.18.46-.27A16.88,16.88,0,0,1,8.61,16l1,.2a17,17,0,0,0,.25-3.37,11.73,11.73,0,0,1,4-.47A17.13,17.13,0,0,1,13.61,16l1,.2a17.28,17.28,0,0,0,.24-3.77,11,11,0,0,1,1.17.16l.2-1a14.09,14.09,0,0,0-1.46-.2,8.45,8.45,0,0,0-1.23-3.59c-.1-.15-.18-.31-.27-.47A15.07,15.07,0,0,1,16,7.59ZM8.38,3.51a7.26,7.26,0,0,1,3-1,13.17,13.17,0,0,0,.44,3.93,9.35,9.35,0,0,0-3.51,1A8.4,8.4,0,0,1,7.39,4,6.75,6.75,0,0,0,8.38,3.51ZM2.48,4.84H3a12.4,12.4,0,0,0,3.44-.44,9.35,9.35,0,0,0,1,3.51A8.38,8.38,0,0,1,4,8.8a6.18,6.18,0,0,0-.53-1A7.36,7.36,0,0,1,2.48,4.84Zm5.34,7.84a7.22,7.22,0,0,1-3,1A12.61,12.61,0,0,0,4.4,9.78a9,9,0,0,0,3.52-1,8.43,8.43,0,0,1,.88,3.37A7.11,7.11,0,0,0,7.82,12.68Zm5.9-1.33a13.23,13.23,0,0,0-3.94.44,9,9,0,0,0-1-3.51,8.44,8.44,0,0,1,3.38-.89,6.69,6.69,0,0,0,.52,1A7.13,7.13,0,0,1,13.72,11.35Z"
-      fill="#464646"
+        d="M16.2,6.61a17.42,17.42,0,0,0-3.37-.26,11.67,11.67,0,0,1-.47-4A15.72,15.72,0,0,1,16,2.59l.2-1a16,16,0,0,0-3.77-.24A11,11,0,0,1,12.59.2l-1-.2a14.09,14.09,0,0,0-.2,1.46A8.44,8.44,0,0,0,7.82,2.68c-.15.1-.31.19-.47.28A15.07,15.07,0,0,1,7.59.2l-1-.2a16.37,16.37,0,0,0-.26,3.37,11.66,11.66,0,0,1-4,.46A15.6,15.6,0,0,1,2.59.2l-1-.2a16.29,16.29,0,0,0-.25,3.77C.67,3.7.21,3.61.2,3.61l-.2,1c.07,0,.63.12,1.46.19a8.48,8.48,0,0,0,1.22,3.6A5.3,5.3,0,0,1,3,8.85,17.52,17.52,0,0,1,.2,8.61l-.2,1a16.66,16.66,0,0,0,3,.26h.4a11.71,11.71,0,0,1,.46,4A17,17,0,0,1,.2,13.61l-.2,1a16.66,16.66,0,0,0,3,.26l.8,0c-.07.7-.16,1.16-.16,1.17l1,.2c0-.07.12-.63.19-1.46a8.49,8.49,0,0,0,3.6-1.23c.15-.1.3-.18.46-.27A16.88,16.88,0,0,1,8.61,16l1,.2a17,17,0,0,0,.25-3.37,11.73,11.73,0,0,1,4-.47A17.13,17.13,0,0,1,13.61,16l1,.2a17.28,17.28,0,0,0,.24-3.77,11,11,0,0,1,1.17.16l.2-1a14.09,14.09,0,0,0-1.46-.2,8.45,8.45,0,0,0-1.23-3.59c-.1-.15-.18-.31-.27-.47A15.07,15.07,0,0,1,16,7.59ZM8.38,3.51a7.26,7.26,0,0,1,3-1,13.17,13.17,0,0,0,.44,3.93,9.35,9.35,0,0,0-3.51,1A8.4,8.4,0,0,1,7.39,4,6.75,6.75,0,0,0,8.38,3.51ZM2.48,4.84H3a12.4,12.4,0,0,0,3.44-.44,9.35,9.35,0,0,0,1,3.51A8.38,8.38,0,0,1,4,8.8a6.18,6.18,0,0,0-.53-1A7.36,7.36,0,0,1,2.48,4.84Zm5.34,7.84a7.22,7.22,0,0,1-3,1A12.61,12.61,0,0,0,4.4,9.78a9,9,0,0,0,3.52-1,8.43,8.43,0,0,1,.88,3.37A7.11,7.11,0,0,0,7.82,12.68Zm5.9-1.33a13.23,13.23,0,0,0-3.94.44,9,9,0,0,0-1-3.51,8.44,8.44,0,0,1,3.38-.89,6.69,6.69,0,0,0,.52,1A7.13,7.13,0,0,1,13.72,11.35Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 16.2 16.2"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <path
-      d="M16.2,6.61a17.42,17.42,0,0,0-3.37-.26,11.67,11.67,0,0,1-.47-4A15.72,15.72,0,0,1,16,2.59l.2-1a16,16,0,0,0-3.77-.24A11,11,0,0,1,12.59.2l-1-.2a14.09,14.09,0,0,0-.2,1.46A8.44,8.44,0,0,0,7.82,2.68c-.15.1-.31.19-.47.28A15.07,15.07,0,0,1,7.59.2l-1-.2a16.37,16.37,0,0,0-.26,3.37,11.66,11.66,0,0,1-4,.46A15.6,15.6,0,0,1,2.59.2l-1-.2a16.29,16.29,0,0,0-.25,3.77C.67,3.7.21,3.61.2,3.61l-.2,1c.07,0,.63.12,1.46.19a8.48,8.48,0,0,0,1.22,3.6A5.3,5.3,0,0,1,3,8.85,17.52,17.52,0,0,1,.2,8.61l-.2,1a16.66,16.66,0,0,0,3,.26h.4a11.71,11.71,0,0,1,.46,4A17,17,0,0,1,.2,13.61l-.2,1a16.66,16.66,0,0,0,3,.26l.8,0c-.07.7-.16,1.16-.16,1.17l1,.2c0-.07.12-.63.19-1.46a8.49,8.49,0,0,0,3.6-1.23c.15-.1.3-.18.46-.27A16.88,16.88,0,0,1,8.61,16l1,.2a17,17,0,0,0,.25-3.37,11.73,11.73,0,0,1,4-.47A17.13,17.13,0,0,1,13.61,16l1,.2a17.28,17.28,0,0,0,.24-3.77,11,11,0,0,1,1.17.16l.2-1a14.09,14.09,0,0,0-1.46-.2,8.45,8.45,0,0,0-1.23-3.59c-.1-.15-.18-.31-.27-.47A15.07,15.07,0,0,1,16,7.59ZM8.38,3.51a7.26,7.26,0,0,1,3-1,13.17,13.17,0,0,0,.44,3.93,9.35,9.35,0,0,0-3.51,1A8.4,8.4,0,0,1,7.39,4,6.75,6.75,0,0,0,8.38,3.51ZM2.48,4.84H3a12.4,12.4,0,0,0,3.44-.44,9.35,9.35,0,0,0,1,3.51A8.38,8.38,0,0,1,4,8.8a6.18,6.18,0,0,0-.53-1A7.36,7.36,0,0,1,2.48,4.84Zm5.34,7.84a7.22,7.22,0,0,1-3,1A12.61,12.61,0,0,0,4.4,9.78a9,9,0,0,0,3.52-1,8.43,8.43,0,0,1,.88,3.37A7.11,7.11,0,0,0,7.82,12.68Zm5.9-1.33a13.23,13.23,0,0,0-3.94.44,9,9,0,0,0-1-3.51,8.44,8.44,0,0,1,3.38-.89,6.69,6.69,0,0,0,.52,1A7.13,7.13,0,0,1,13.72,11.35Z"
-      fill="#464646"
+        d="M16.2,6.61a17.42,17.42,0,0,0-3.37-.26,11.67,11.67,0,0,1-.47-4A15.72,15.72,0,0,1,16,2.59l.2-1a16,16,0,0,0-3.77-.24A11,11,0,0,1,12.59.2l-1-.2a14.09,14.09,0,0,0-.2,1.46A8.44,8.44,0,0,0,7.82,2.68c-.15.1-.31.19-.47.28A15.07,15.07,0,0,1,7.59.2l-1-.2a16.37,16.37,0,0,0-.26,3.37,11.66,11.66,0,0,1-4,.46A15.6,15.6,0,0,1,2.59.2l-1-.2a16.29,16.29,0,0,0-.25,3.77C.67,3.7.21,3.61.2,3.61l-.2,1c.07,0,.63.12,1.46.19a8.48,8.48,0,0,0,1.22,3.6A5.3,5.3,0,0,1,3,8.85,17.52,17.52,0,0,1,.2,8.61l-.2,1a16.66,16.66,0,0,0,3,.26h.4a11.71,11.71,0,0,1,.46,4A17,17,0,0,1,.2,13.61l-.2,1a16.66,16.66,0,0,0,3,.26l.8,0c-.07.7-.16,1.16-.16,1.17l1,.2c0-.07.12-.63.19-1.46a8.49,8.49,0,0,0,3.6-1.23c.15-.1.3-.18.46-.27A16.88,16.88,0,0,1,8.61,16l1,.2a17,17,0,0,0,.25-3.37,11.73,11.73,0,0,1,4-.47A17.13,17.13,0,0,1,13.61,16l1,.2a17.28,17.28,0,0,0,.24-3.77,11,11,0,0,1,1.17.16l.2-1a14.09,14.09,0,0,0-1.46-.2,8.45,8.45,0,0,0-1.23-3.59c-.1-.15-.18-.31-.27-.47A15.07,15.07,0,0,1,16,7.59ZM8.38,3.51a7.26,7.26,0,0,1,3-1,13.17,13.17,0,0,0,.44,3.93,9.35,9.35,0,0,0-3.51,1A8.4,8.4,0,0,1,7.39,4,6.75,6.75,0,0,0,8.38,3.51ZM2.48,4.84H3a12.4,12.4,0,0,0,3.44-.44,9.35,9.35,0,0,0,1,3.51A8.38,8.38,0,0,1,4,8.8a6.18,6.18,0,0,0-.53-1A7.36,7.36,0,0,1,2.48,4.84Zm5.34,7.84a7.22,7.22,0,0,1-3,1A12.61,12.61,0,0,0,4.4,9.78a9,9,0,0,0,3.52-1,8.43,8.43,0,0,1,.88,3.37A7.11,7.11,0,0,0,7.82,12.68Zm5.9-1.33a13.23,13.23,0,0,0-3.94.44,9,9,0,0,0-1-3.51,8.44,8.44,0,0,1,3.38-.89,6.69,6.69,0,0,0,.52,1A7.13,7.13,0,0,1,13.72,11.35Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 16.2 16.2"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <path
-      d="M16.2,6.61a17.42,17.42,0,0,0-3.37-.26,11.67,11.67,0,0,1-.47-4A15.72,15.72,0,0,1,16,2.59l.2-1a16,16,0,0,0-3.77-.24A11,11,0,0,1,12.59.2l-1-.2a14.09,14.09,0,0,0-.2,1.46A8.44,8.44,0,0,0,7.82,2.68c-.15.1-.31.19-.47.28A15.07,15.07,0,0,1,7.59.2l-1-.2a16.37,16.37,0,0,0-.26,3.37,11.66,11.66,0,0,1-4,.46A15.6,15.6,0,0,1,2.59.2l-1-.2a16.29,16.29,0,0,0-.25,3.77C.67,3.7.21,3.61.2,3.61l-.2,1c.07,0,.63.12,1.46.19a8.48,8.48,0,0,0,1.22,3.6A5.3,5.3,0,0,1,3,8.85,17.52,17.52,0,0,1,.2,8.61l-.2,1a16.66,16.66,0,0,0,3,.26h.4a11.71,11.71,0,0,1,.46,4A17,17,0,0,1,.2,13.61l-.2,1a16.66,16.66,0,0,0,3,.26l.8,0c-.07.7-.16,1.16-.16,1.17l1,.2c0-.07.12-.63.19-1.46a8.49,8.49,0,0,0,3.6-1.23c.15-.1.3-.18.46-.27A16.88,16.88,0,0,1,8.61,16l1,.2a17,17,0,0,0,.25-3.37,11.73,11.73,0,0,1,4-.47A17.13,17.13,0,0,1,13.61,16l1,.2a17.28,17.28,0,0,0,.24-3.77,11,11,0,0,1,1.17.16l.2-1a14.09,14.09,0,0,0-1.46-.2,8.45,8.45,0,0,0-1.23-3.59c-.1-.15-.18-.31-.27-.47A15.07,15.07,0,0,1,16,7.59ZM8.38,3.51a7.26,7.26,0,0,1,3-1,13.17,13.17,0,0,0,.44,3.93,9.35,9.35,0,0,0-3.51,1A8.4,8.4,0,0,1,7.39,4,6.75,6.75,0,0,0,8.38,3.51ZM2.48,4.84H3a12.4,12.4,0,0,0,3.44-.44,9.35,9.35,0,0,0,1,3.51A8.38,8.38,0,0,1,4,8.8a6.18,6.18,0,0,0-.53-1A7.36,7.36,0,0,1,2.48,4.84Zm5.34,7.84a7.22,7.22,0,0,1-3,1A12.61,12.61,0,0,0,4.4,9.78a9,9,0,0,0,3.52-1,8.43,8.43,0,0,1,.88,3.37A7.11,7.11,0,0,0,7.82,12.68Zm5.9-1.33a13.23,13.23,0,0,0-3.94.44,9,9,0,0,0-1-3.51,8.44,8.44,0,0,1,3.38-.89,6.69,6.69,0,0,0,.52,1A7.13,7.13,0,0,1,13.72,11.35Z"
-      fill="#464646"
+        d="M16.2,6.61a17.42,17.42,0,0,0-3.37-.26,11.67,11.67,0,0,1-.47-4A15.72,15.72,0,0,1,16,2.59l.2-1a16,16,0,0,0-3.77-.24A11,11,0,0,1,12.59.2l-1-.2a14.09,14.09,0,0,0-.2,1.46A8.44,8.44,0,0,0,7.82,2.68c-.15.1-.31.19-.47.28A15.07,15.07,0,0,1,7.59.2l-1-.2a16.37,16.37,0,0,0-.26,3.37,11.66,11.66,0,0,1-4,.46A15.6,15.6,0,0,1,2.59.2l-1-.2a16.29,16.29,0,0,0-.25,3.77C.67,3.7.21,3.61.2,3.61l-.2,1c.07,0,.63.12,1.46.19a8.48,8.48,0,0,0,1.22,3.6A5.3,5.3,0,0,1,3,8.85,17.52,17.52,0,0,1,.2,8.61l-.2,1a16.66,16.66,0,0,0,3,.26h.4a11.71,11.71,0,0,1,.46,4A17,17,0,0,1,.2,13.61l-.2,1a16.66,16.66,0,0,0,3,.26l.8,0c-.07.7-.16,1.16-.16,1.17l1,.2c0-.07.12-.63.19-1.46a8.49,8.49,0,0,0,3.6-1.23c.15-.1.3-.18.46-.27A16.88,16.88,0,0,1,8.61,16l1,.2a17,17,0,0,0,.25-3.37,11.73,11.73,0,0,1,4-.47A17.13,17.13,0,0,1,13.61,16l1,.2a17.28,17.28,0,0,0,.24-3.77,11,11,0,0,1,1.17.16l.2-1a14.09,14.09,0,0,0-1.46-.2,8.45,8.45,0,0,0-1.23-3.59c-.1-.15-.18-.31-.27-.47A15.07,15.07,0,0,1,16,7.59ZM8.38,3.51a7.26,7.26,0,0,1,3-1,13.17,13.17,0,0,0,.44,3.93,9.35,9.35,0,0,0-3.51,1A8.4,8.4,0,0,1,7.39,4,6.75,6.75,0,0,0,8.38,3.51ZM2.48,4.84H3a12.4,12.4,0,0,0,3.44-.44,9.35,9.35,0,0,0,1,3.51A8.38,8.38,0,0,1,4,8.8a6.18,6.18,0,0,0-.53-1A7.36,7.36,0,0,1,2.48,4.84Zm5.34,7.84a7.22,7.22,0,0,1-3,1A12.61,12.61,0,0,0,4.4,9.78a9,9,0,0,0,3.52-1,8.43,8.43,0,0,1,.88,3.37A7.11,7.11,0,0,0,7.82,12.68Zm5.9-1.33a13.23,13.23,0,0,0-3.94.44,9,9,0,0,0-1-3.51,8.44,8.44,0,0,1,3.38-.89,6.69,6.69,0,0,0,.52,1A7.13,7.13,0,0,1,13.72,11.35Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 16.2 16.2"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <path
-      d="M16.2,6.61a17.42,17.42,0,0,0-3.37-.26,11.67,11.67,0,0,1-.47-4A15.72,15.72,0,0,1,16,2.59l.2-1a16,16,0,0,0-3.77-.24A11,11,0,0,1,12.59.2l-1-.2a14.09,14.09,0,0,0-.2,1.46A8.44,8.44,0,0,0,7.82,2.68c-.15.1-.31.19-.47.28A15.07,15.07,0,0,1,7.59.2l-1-.2a16.37,16.37,0,0,0-.26,3.37,11.66,11.66,0,0,1-4,.46A15.6,15.6,0,0,1,2.59.2l-1-.2a16.29,16.29,0,0,0-.25,3.77C.67,3.7.21,3.61.2,3.61l-.2,1c.07,0,.63.12,1.46.19a8.48,8.48,0,0,0,1.22,3.6A5.3,5.3,0,0,1,3,8.85,17.52,17.52,0,0,1,.2,8.61l-.2,1a16.66,16.66,0,0,0,3,.26h.4a11.71,11.71,0,0,1,.46,4A17,17,0,0,1,.2,13.61l-.2,1a16.66,16.66,0,0,0,3,.26l.8,0c-.07.7-.16,1.16-.16,1.17l1,.2c0-.07.12-.63.19-1.46a8.49,8.49,0,0,0,3.6-1.23c.15-.1.3-.18.46-.27A16.88,16.88,0,0,1,8.61,16l1,.2a17,17,0,0,0,.25-3.37,11.73,11.73,0,0,1,4-.47A17.13,17.13,0,0,1,13.61,16l1,.2a17.28,17.28,0,0,0,.24-3.77,11,11,0,0,1,1.17.16l.2-1a14.09,14.09,0,0,0-1.46-.2,8.45,8.45,0,0,0-1.23-3.59c-.1-.15-.18-.31-.27-.47A15.07,15.07,0,0,1,16,7.59ZM8.38,3.51a7.26,7.26,0,0,1,3-1,13.17,13.17,0,0,0,.44,3.93,9.35,9.35,0,0,0-3.51,1A8.4,8.4,0,0,1,7.39,4,6.75,6.75,0,0,0,8.38,3.51ZM2.48,4.84H3a12.4,12.4,0,0,0,3.44-.44,9.35,9.35,0,0,0,1,3.51A8.38,8.38,0,0,1,4,8.8a6.18,6.18,0,0,0-.53-1A7.36,7.36,0,0,1,2.48,4.84Zm5.34,7.84a7.22,7.22,0,0,1-3,1A12.61,12.61,0,0,0,4.4,9.78a9,9,0,0,0,3.52-1,8.43,8.43,0,0,1,.88,3.37A7.11,7.11,0,0,0,7.82,12.68Zm5.9-1.33a13.23,13.23,0,0,0-3.94.44,9,9,0,0,0-1-3.51,8.44,8.44,0,0,1,3.38-.89,6.69,6.69,0,0,0,.52,1A7.13,7.13,0,0,1,13.72,11.35Z"
-      fill="#464646"
+        d="M16.2,6.61a17.42,17.42,0,0,0-3.37-.26,11.67,11.67,0,0,1-.47-4A15.72,15.72,0,0,1,16,2.59l.2-1a16,16,0,0,0-3.77-.24A11,11,0,0,1,12.59.2l-1-.2a14.09,14.09,0,0,0-.2,1.46A8.44,8.44,0,0,0,7.82,2.68c-.15.1-.31.19-.47.28A15.07,15.07,0,0,1,7.59.2l-1-.2a16.37,16.37,0,0,0-.26,3.37,11.66,11.66,0,0,1-4,.46A15.6,15.6,0,0,1,2.59.2l-1-.2a16.29,16.29,0,0,0-.25,3.77C.67,3.7.21,3.61.2,3.61l-.2,1c.07,0,.63.12,1.46.19a8.48,8.48,0,0,0,1.22,3.6A5.3,5.3,0,0,1,3,8.85,17.52,17.52,0,0,1,.2,8.61l-.2,1a16.66,16.66,0,0,0,3,.26h.4a11.71,11.71,0,0,1,.46,4A17,17,0,0,1,.2,13.61l-.2,1a16.66,16.66,0,0,0,3,.26l.8,0c-.07.7-.16,1.16-.16,1.17l1,.2c0-.07.12-.63.19-1.46a8.49,8.49,0,0,0,3.6-1.23c.15-.1.3-.18.46-.27A16.88,16.88,0,0,1,8.61,16l1,.2a17,17,0,0,0,.25-3.37,11.73,11.73,0,0,1,4-.47A17.13,17.13,0,0,1,13.61,16l1,.2a17.28,17.28,0,0,0,.24-3.77,11,11,0,0,1,1.17.16l.2-1a14.09,14.09,0,0,0-1.46-.2,8.45,8.45,0,0,0-1.23-3.59c-.1-.15-.18-.31-.27-.47A15.07,15.07,0,0,1,16,7.59ZM8.38,3.51a7.26,7.26,0,0,1,3-1,13.17,13.17,0,0,0,.44,3.93,9.35,9.35,0,0,0-3.51,1A8.4,8.4,0,0,1,7.39,4,6.75,6.75,0,0,0,8.38,3.51ZM2.48,4.84H3a12.4,12.4,0,0,0,3.44-.44,9.35,9.35,0,0,0,1,3.51A8.38,8.38,0,0,1,4,8.8a6.18,6.18,0,0,0-.53-1A7.36,7.36,0,0,1,2.48,4.84Zm5.34,7.84a7.22,7.22,0,0,1-3,1A12.61,12.61,0,0,0,4.4,9.78a9,9,0,0,0,3.52-1,8.43,8.43,0,0,1,.88,3.37A7.11,7.11,0,0,0,7.82,12.68Zm5.9-1.33a13.23,13.23,0,0,0-3.94.44,9,9,0,0,0-1-3.51,8.44,8.44,0,0,1,3.38-.89,6.69,6.69,0,0,0,.52,1A7.13,7.13,0,0,1,13.72,11.35Z"
+        fill="#464646"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Firewall /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 15 17"
     width="15"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1886 1522)"
+        transform="translate(-1886 1522)"
     >
-      <g>
         <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1886 -1522)"
-              xlinkHref="#n"
-            />
-          </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1886 -1522)"
+                        xlinkHref="#n"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1889 -1519)"
+                        xlinkHref="#o"
+                    />
+                </g>
+            </g>
         </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1889 -1519)"
-              xlinkHref="#o"
-            />
-          </g>
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 7.5 1.60001C 8.6 2.60001 10.5 3.20001 12.9 3.20001C 13.3 3.20001 13.6 3.20001 14 3.20001L 14 5C 14 10 11.7 13.9 7.5 15.9C 3.5 13.9 1 9.3 1 4L 1 3.20001C 1.3 3.20001 1.7 3.20001 2.1 3.20001C 4.5 3.20001 6.4 2.70001 7.5 1.60001ZM 7.5 0C 6.6 1.8 3.9 2.20001 2.1 2.20001C 0.899998 2.20001 0 2.10001 0 2.10001L 0 4C 0 9.9 3 15 7.5 17C 12 15 15 10.9 15 5L 15 2.10001C 15 2.10001 14.1 2.20001 12.9 2.20001C 11.1 2.20001 8.4 1.8 7.5 0Z"
-        id="n"
-      />
-      <path
-        d="M 4 2.05496L 4 9.06593C 2.1 7.73626 1 5.3187 1 2.65936L 1 2.41758C 2.2 2.41758 3.2 2.29672 4 2.05496ZM 5 0C 4.2 1.08791 2.3 1.20879 1 1.20879C 0.4 1.20879 0 1.20879 0 1.20879L 0 2.65936C 0 6.40661 2 9.67034 5 11L 5 0Z"
-        id="o"
-      />
+        <path
+            d="M 7.5 1.60001C 8.6 2.60001 10.5 3.20001 12.9 3.20001C 13.3 3.20001 13.6 3.20001 14 3.20001L 14 5C 14 10 11.7 13.9 7.5 15.9C 3.5 13.9 1 9.3 1 4L 1 3.20001C 1.3 3.20001 1.7 3.20001 2.1 3.20001C 4.5 3.20001 6.4 2.70001 7.5 1.60001ZM 7.5 0C 6.6 1.8 3.9 2.20001 2.1 2.20001C 0.899998 2.20001 0 2.10001 0 2.10001L 0 4C 0 9.9 3 15 7.5 17C 12 15 15 10.9 15 5L 15 2.10001C 15 2.10001 14.1 2.20001 12.9 2.20001C 11.1 2.20001 8.4 1.8 7.5 0Z"
+            id="n"
+        />
+        <path
+            d="M 4 2.05496L 4 9.06593C 2.1 7.73626 1 5.3187 1 2.65936L 1 2.41758C 2.2 2.41758 3.2 2.29672 4 2.05496ZM 5 0C 4.2 1.08791 2.3 1.20879 1 1.20879C 0.4 1.20879 0 1.20879 0 1.20879L 0 2.65936C 0 6.40661 2 9.67034 5 11L 5 0Z"
+            id="o"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 15 17"
     width="15"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1886 1522)"
+        transform="translate(-1886 1522)"
     >
-      <g>
         <g>
-          <g>
-            <use
-              fill="#FFF"
-              transform="translate(1886 -1522)"
-              xlinkHref="#n"
-            />
-          </g>
+            <g>
+                <g>
+                    <use
+                        fill="#FFF"
+                        transform="translate(1886 -1522)"
+                        xlinkHref="#n"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#FFF"
+                        transform="translate(1889 -1519)"
+                        xlinkHref="#o"
+                    />
+                </g>
+            </g>
         </g>
-        <g>
-          <g>
-            <use
-              fill="#FFF"
-              transform="translate(1889 -1519)"
-              xlinkHref="#o"
-            />
-          </g>
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 7.5 1.60001C 8.6 2.60001 10.5 3.20001 12.9 3.20001C 13.3 3.20001 13.6 3.20001 14 3.20001L 14 5C 14 10 11.7 13.9 7.5 15.9C 3.5 13.9 1 9.3 1 4L 1 3.20001C 1.3 3.20001 1.7 3.20001 2.1 3.20001C 4.5 3.20001 6.4 2.70001 7.5 1.60001ZM 7.5 0C 6.6 1.8 3.9 2.20001 2.1 2.20001C 0.899998 2.20001 0 2.10001 0 2.10001L 0 4C 0 9.9 3 15 7.5 17C 12 15 15 10.9 15 5L 15 2.10001C 15 2.10001 14.1 2.20001 12.9 2.20001C 11.1 2.20001 8.4 1.8 7.5 0Z"
-        id="n"
-      />
-      <path
-        d="M 4 2.05496L 4 9.06593C 2.1 7.73626 1 5.3187 1 2.65936L 1 2.41758C 2.2 2.41758 3.2 2.29672 4 2.05496ZM 5 0C 4.2 1.08791 2.3 1.20879 1 1.20879C 0.4 1.20879 0 1.20879 0 1.20879L 0 2.65936C 0 6.40661 2 9.67034 5 11L 5 0Z"
-        id="o"
-      />
+        <path
+            d="M 7.5 1.60001C 8.6 2.60001 10.5 3.20001 12.9 3.20001C 13.3 3.20001 13.6 3.20001 14 3.20001L 14 5C 14 10 11.7 13.9 7.5 15.9C 3.5 13.9 1 9.3 1 4L 1 3.20001C 1.3 3.20001 1.7 3.20001 2.1 3.20001C 4.5 3.20001 6.4 2.70001 7.5 1.60001ZM 7.5 0C 6.6 1.8 3.9 2.20001 2.1 2.20001C 0.899998 2.20001 0 2.10001 0 2.10001L 0 4C 0 9.9 3 15 7.5 17C 12 15 15 10.9 15 5L 15 2.10001C 15 2.10001 14.1 2.20001 12.9 2.20001C 11.1 2.20001 8.4 1.8 7.5 0Z"
+            id="n"
+        />
+        <path
+            d="M 4 2.05496L 4 9.06593C 2.1 7.73626 1 5.3187 1 2.65936L 1 2.41758C 2.2 2.41758 3.2 2.29672 4 2.05496ZM 5 0C 4.2 1.08791 2.3 1.20879 1 1.20879C 0.4 1.20879 0 1.20879 0 1.20879L 0 2.65936C 0 6.40661 2 9.67034 5 11L 5 0Z"
+            id="o"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 15 17"
     width="15"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1886 1522)"
+        transform="translate(-1886 1522)"
     >
-      <g>
         <g>
-          <g>
-            <use
-              fill={true}
-              transform="translate(1886 -1522)"
-              xlinkHref="#n"
-            />
-          </g>
+            <g>
+                <g>
+                    <use
+                        fill={undefined}
+                        transform="translate(1886 -1522)"
+                        xlinkHref="#n"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill={undefined}
+                        transform="translate(1889 -1519)"
+                        xlinkHref="#o"
+                    />
+                </g>
+            </g>
         </g>
-        <g>
-          <g>
-            <use
-              fill={true}
-              transform="translate(1889 -1519)"
-              xlinkHref="#o"
-            />
-          </g>
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 7.5 1.60001C 8.6 2.60001 10.5 3.20001 12.9 3.20001C 13.3 3.20001 13.6 3.20001 14 3.20001L 14 5C 14 10 11.7 13.9 7.5 15.9C 3.5 13.9 1 9.3 1 4L 1 3.20001C 1.3 3.20001 1.7 3.20001 2.1 3.20001C 4.5 3.20001 6.4 2.70001 7.5 1.60001ZM 7.5 0C 6.6 1.8 3.9 2.20001 2.1 2.20001C 0.899998 2.20001 0 2.10001 0 2.10001L 0 4C 0 9.9 3 15 7.5 17C 12 15 15 10.9 15 5L 15 2.10001C 15 2.10001 14.1 2.20001 12.9 2.20001C 11.1 2.20001 8.4 1.8 7.5 0Z"
-        id="n"
-      />
-      <path
-        d="M 4 2.05496L 4 9.06593C 2.1 7.73626 1 5.3187 1 2.65936L 1 2.41758C 2.2 2.41758 3.2 2.29672 4 2.05496ZM 5 0C 4.2 1.08791 2.3 1.20879 1 1.20879C 0.4 1.20879 0 1.20879 0 1.20879L 0 2.65936C 0 6.40661 2 9.67034 5 11L 5 0Z"
-        id="o"
-      />
+        <path
+            d="M 7.5 1.60001C 8.6 2.60001 10.5 3.20001 12.9 3.20001C 13.3 3.20001 13.6 3.20001 14 3.20001L 14 5C 14 10 11.7 13.9 7.5 15.9C 3.5 13.9 1 9.3 1 4L 1 3.20001C 1.3 3.20001 1.7 3.20001 2.1 3.20001C 4.5 3.20001 6.4 2.70001 7.5 1.60001ZM 7.5 0C 6.6 1.8 3.9 2.20001 2.1 2.20001C 0.899998 2.20001 0 2.10001 0 2.10001L 0 4C 0 9.9 3 15 7.5 17C 12 15 15 10.9 15 5L 15 2.10001C 15 2.10001 14.1 2.20001 12.9 2.20001C 11.1 2.20001 8.4 1.8 7.5 0Z"
+            id="n"
+        />
+        <path
+            d="M 4 2.05496L 4 9.06593C 2.1 7.73626 1 5.3187 1 2.65936L 1 2.41758C 2.2 2.41758 3.2 2.29672 4 2.05496ZM 5 0C 4.2 1.08791 2.3 1.20879 1 1.20879C 0.4 1.20879 0 1.20879 0 1.20879L 0 2.65936C 0 6.40661 2 9.67034 5 11L 5 0Z"
+            id="o"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 15 17"
     width="15"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1886 1522)"
+        transform="translate(-1886 1522)"
     >
-      <g>
         <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1886 -1522)"
-              xlinkHref="#n"
-            />
-          </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1886 -1522)"
+                        xlinkHref="#n"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1889 -1519)"
+                        xlinkHref="#o"
+                    />
+                </g>
+            </g>
         </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1889 -1519)"
-              xlinkHref="#o"
-            />
-          </g>
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 7.5 1.60001C 8.6 2.60001 10.5 3.20001 12.9 3.20001C 13.3 3.20001 13.6 3.20001 14 3.20001L 14 5C 14 10 11.7 13.9 7.5 15.9C 3.5 13.9 1 9.3 1 4L 1 3.20001C 1.3 3.20001 1.7 3.20001 2.1 3.20001C 4.5 3.20001 6.4 2.70001 7.5 1.60001ZM 7.5 0C 6.6 1.8 3.9 2.20001 2.1 2.20001C 0.899998 2.20001 0 2.10001 0 2.10001L 0 4C 0 9.9 3 15 7.5 17C 12 15 15 10.9 15 5L 15 2.10001C 15 2.10001 14.1 2.20001 12.9 2.20001C 11.1 2.20001 8.4 1.8 7.5 0Z"
-        id="n"
-      />
-      <path
-        d="M 4 2.05496L 4 9.06593C 2.1 7.73626 1 5.3187 1 2.65936L 1 2.41758C 2.2 2.41758 3.2 2.29672 4 2.05496ZM 5 0C 4.2 1.08791 2.3 1.20879 1 1.20879C 0.4 1.20879 0 1.20879 0 1.20879L 0 2.65936C 0 6.40661 2 9.67034 5 11L 5 0Z"
-        id="o"
-      />
+        <path
+            d="M 7.5 1.60001C 8.6 2.60001 10.5 3.20001 12.9 3.20001C 13.3 3.20001 13.6 3.20001 14 3.20001L 14 5C 14 10 11.7 13.9 7.5 15.9C 3.5 13.9 1 9.3 1 4L 1 3.20001C 1.3 3.20001 1.7 3.20001 2.1 3.20001C 4.5 3.20001 6.4 2.70001 7.5 1.60001ZM 7.5 0C 6.6 1.8 3.9 2.20001 2.1 2.20001C 0.899998 2.20001 0 2.10001 0 2.10001L 0 4C 0 9.9 3 15 7.5 17C 12 15 15 10.9 15 5L 15 2.10001C 15 2.10001 14.1 2.20001 12.9 2.20001C 11.1 2.20001 8.4 1.8 7.5 0Z"
+            id="n"
+        />
+        <path
+            d="M 4 2.05496L 4 9.06593C 2.1 7.73626 1 5.3187 1 2.65936L 1 2.41758C 2.2 2.41758 3.2 2.29672 4 2.05496ZM 5 0C 4.2 1.08791 2.3 1.20879 1 1.20879C 0.4 1.20879 0 1.20879 0 1.20879L 0 2.65936C 0 6.40661 2 9.67034 5 11L 5 0Z"
+            id="o"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 15 17"
     width="15"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1886 1522)"
+        transform="translate(-1886 1522)"
     >
-      <g>
         <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1886 -1522)"
-              xlinkHref="#n"
-            />
-          </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1886 -1522)"
+                        xlinkHref="#n"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1889 -1519)"
+                        xlinkHref="#o"
+                    />
+                </g>
+            </g>
         </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1889 -1519)"
-              xlinkHref="#o"
-            />
-          </g>
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 7.5 1.60001C 8.6 2.60001 10.5 3.20001 12.9 3.20001C 13.3 3.20001 13.6 3.20001 14 3.20001L 14 5C 14 10 11.7 13.9 7.5 15.9C 3.5 13.9 1 9.3 1 4L 1 3.20001C 1.3 3.20001 1.7 3.20001 2.1 3.20001C 4.5 3.20001 6.4 2.70001 7.5 1.60001ZM 7.5 0C 6.6 1.8 3.9 2.20001 2.1 2.20001C 0.899998 2.20001 0 2.10001 0 2.10001L 0 4C 0 9.9 3 15 7.5 17C 12 15 15 10.9 15 5L 15 2.10001C 15 2.10001 14.1 2.20001 12.9 2.20001C 11.1 2.20001 8.4 1.8 7.5 0Z"
-        id="n"
-      />
-      <path
-        d="M 4 2.05496L 4 9.06593C 2.1 7.73626 1 5.3187 1 2.65936L 1 2.41758C 2.2 2.41758 3.2 2.29672 4 2.05496ZM 5 0C 4.2 1.08791 2.3 1.20879 1 1.20879C 0.4 1.20879 0 1.20879 0 1.20879L 0 2.65936C 0 6.40661 2 9.67034 5 11L 5 0Z"
-        id="o"
-      />
+        <path
+            d="M 7.5 1.60001C 8.6 2.60001 10.5 3.20001 12.9 3.20001C 13.3 3.20001 13.6 3.20001 14 3.20001L 14 5C 14 10 11.7 13.9 7.5 15.9C 3.5 13.9 1 9.3 1 4L 1 3.20001C 1.3 3.20001 1.7 3.20001 2.1 3.20001C 4.5 3.20001 6.4 2.70001 7.5 1.60001ZM 7.5 0C 6.6 1.8 3.9 2.20001 2.1 2.20001C 0.899998 2.20001 0 2.10001 0 2.10001L 0 4C 0 9.9 3 15 7.5 17C 12 15 15 10.9 15 5L 15 2.10001C 15 2.10001 14.1 2.20001 12.9 2.20001C 11.1 2.20001 8.4 1.8 7.5 0Z"
+            id="n"
+        />
+        <path
+            d="M 4 2.05496L 4 9.06593C 2.1 7.73626 1 5.3187 1 2.65936L 1 2.41758C 2.2 2.41758 3.2 2.29672 4 2.05496ZM 5 0C 4.2 1.08791 2.3 1.20879 1 1.20879C 0.4 1.20879 0 1.20879 0 1.20879L 0 2.65936C 0 6.40661 2 9.67034 5 11L 5 0Z"
+            id="o"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 15 17"
     width="15"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1886 1522)"
+        transform="translate(-1886 1522)"
     >
-      <g>
         <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1886 -1522)"
-              xlinkHref="#n"
-            />
-          </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1886 -1522)"
+                        xlinkHref="#n"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1889 -1519)"
+                        xlinkHref="#o"
+                    />
+                </g>
+            </g>
         </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1889 -1519)"
-              xlinkHref="#o"
-            />
-          </g>
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 7.5 1.60001C 8.6 2.60001 10.5 3.20001 12.9 3.20001C 13.3 3.20001 13.6 3.20001 14 3.20001L 14 5C 14 10 11.7 13.9 7.5 15.9C 3.5 13.9 1 9.3 1 4L 1 3.20001C 1.3 3.20001 1.7 3.20001 2.1 3.20001C 4.5 3.20001 6.4 2.70001 7.5 1.60001ZM 7.5 0C 6.6 1.8 3.9 2.20001 2.1 2.20001C 0.899998 2.20001 0 2.10001 0 2.10001L 0 4C 0 9.9 3 15 7.5 17C 12 15 15 10.9 15 5L 15 2.10001C 15 2.10001 14.1 2.20001 12.9 2.20001C 11.1 2.20001 8.4 1.8 7.5 0Z"
-        id="n"
-      />
-      <path
-        d="M 4 2.05496L 4 9.06593C 2.1 7.73626 1 5.3187 1 2.65936L 1 2.41758C 2.2 2.41758 3.2 2.29672 4 2.05496ZM 5 0C 4.2 1.08791 2.3 1.20879 1 1.20879C 0.4 1.20879 0 1.20879 0 1.20879L 0 2.65936C 0 6.40661 2 9.67034 5 11L 5 0Z"
-        id="o"
-      />
+        <path
+            d="M 7.5 1.60001C 8.6 2.60001 10.5 3.20001 12.9 3.20001C 13.3 3.20001 13.6 3.20001 14 3.20001L 14 5C 14 10 11.7 13.9 7.5 15.9C 3.5 13.9 1 9.3 1 4L 1 3.20001C 1.3 3.20001 1.7 3.20001 2.1 3.20001C 4.5 3.20001 6.4 2.70001 7.5 1.60001ZM 7.5 0C 6.6 1.8 3.9 2.20001 2.1 2.20001C 0.899998 2.20001 0 2.10001 0 2.10001L 0 4C 0 9.9 3 15 7.5 17C 12 15 15 10.9 15 5L 15 2.10001C 15 2.10001 14.1 2.20001 12.9 2.20001C 11.1 2.20001 8.4 1.8 7.5 0Z"
+            id="n"
+        />
+        <path
+            d="M 4 2.05496L 4 9.06593C 2.1 7.73626 1 5.3187 1 2.65936L 1 2.41758C 2.2 2.41758 3.2 2.29672 4 2.05496ZM 5 0C 4.2 1.08791 2.3 1.20879 1 1.20879C 0.4 1.20879 0 1.20879 0 1.20879L 0 2.65936C 0 6.40661 2 9.67034 5 11L 5 0Z"
+            id="o"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 15 17"
     width="15"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1886 1522)"
+        transform="translate(-1886 1522)"
     >
-      <g>
         <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1886 -1522)"
-              xlinkHref="#n"
-            />
-          </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1886 -1522)"
+                        xlinkHref="#n"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1889 -1519)"
+                        xlinkHref="#o"
+                    />
+                </g>
+            </g>
         </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1889 -1519)"
-              xlinkHref="#o"
-            />
-          </g>
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 7.5 1.60001C 8.6 2.60001 10.5 3.20001 12.9 3.20001C 13.3 3.20001 13.6 3.20001 14 3.20001L 14 5C 14 10 11.7 13.9 7.5 15.9C 3.5 13.9 1 9.3 1 4L 1 3.20001C 1.3 3.20001 1.7 3.20001 2.1 3.20001C 4.5 3.20001 6.4 2.70001 7.5 1.60001ZM 7.5 0C 6.6 1.8 3.9 2.20001 2.1 2.20001C 0.899998 2.20001 0 2.10001 0 2.10001L 0 4C 0 9.9 3 15 7.5 17C 12 15 15 10.9 15 5L 15 2.10001C 15 2.10001 14.1 2.20001 12.9 2.20001C 11.1 2.20001 8.4 1.8 7.5 0Z"
-        id="n"
-      />
-      <path
-        d="M 4 2.05496L 4 9.06593C 2.1 7.73626 1 5.3187 1 2.65936L 1 2.41758C 2.2 2.41758 3.2 2.29672 4 2.05496ZM 5 0C 4.2 1.08791 2.3 1.20879 1 1.20879C 0.4 1.20879 0 1.20879 0 1.20879L 0 2.65936C 0 6.40661 2 9.67034 5 11L 5 0Z"
-        id="o"
-      />
+        <path
+            d="M 7.5 1.60001C 8.6 2.60001 10.5 3.20001 12.9 3.20001C 13.3 3.20001 13.6 3.20001 14 3.20001L 14 5C 14 10 11.7 13.9 7.5 15.9C 3.5 13.9 1 9.3 1 4L 1 3.20001C 1.3 3.20001 1.7 3.20001 2.1 3.20001C 4.5 3.20001 6.4 2.70001 7.5 1.60001ZM 7.5 0C 6.6 1.8 3.9 2.20001 2.1 2.20001C 0.899998 2.20001 0 2.10001 0 2.10001L 0 4C 0 9.9 3 15 7.5 17C 12 15 15 10.9 15 5L 15 2.10001C 15 2.10001 14.1 2.20001 12.9 2.20001C 11.1 2.20001 8.4 1.8 7.5 0Z"
+            id="n"
+        />
+        <path
+            d="M 4 2.05496L 4 9.06593C 2.1 7.73626 1 5.3187 1 2.65936L 1 2.41758C 2.2 2.41758 3.2 2.29672 4 2.05496ZM 5 0C 4.2 1.08791 2.3 1.20879 1 1.20879C 0.4 1.20879 0 1.20879 0 1.20879L 0 2.65936C 0 6.40661 2 9.67034 5 11L 5 0Z"
+            id="o"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <General /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="20"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 20 20"
     width="20"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M18,17a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V3A1,1,0,0,1,3,2H17a1,1,0,0,1,1,1ZM17,0H3A3,3,0,0,0,0,3V17a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V3A3,3,0,0,0,17,0ZM10,15a5,5,0,1,1,5-5A5,5,0,0,1,10,15ZM10,4a6,6,0,1,0,6,6A6,6,0,0,0,10,4ZM9,10a1,1,0,1,0,1-1A1,1,0,0,0,9,10Z"
-      fill="#464646"
+        d="M18,17a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V3A1,1,0,0,1,3,2H17a1,1,0,0,1,1,1ZM17,0H3A3,3,0,0,0,0,3V17a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V3A3,3,0,0,0,17,0ZM10,15a5,5,0,1,1,5-5A5,5,0,0,1,10,15ZM10,4a6,6,0,1,0,6,6A6,6,0,0,0,10,4ZM9,10a1,1,0,1,0,1-1A1,1,0,0,0,9,10Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="20"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 20 20"
     width="20"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M18,17a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V3A1,1,0,0,1,3,2H17a1,1,0,0,1,1,1ZM17,0H3A3,3,0,0,0,0,3V17a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V3A3,3,0,0,0,17,0ZM10,15a5,5,0,1,1,5-5A5,5,0,0,1,10,15ZM10,4a6,6,0,1,0,6,6A6,6,0,0,0,10,4ZM9,10a1,1,0,1,0,1-1A1,1,0,0,0,9,10Z"
-      fill="#FFF"
+        d="M18,17a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V3A1,1,0,0,1,3,2H17a1,1,0,0,1,1,1ZM17,0H3A3,3,0,0,0,0,3V17a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V3A3,3,0,0,0,17,0ZM10,15a5,5,0,1,1,5-5A5,5,0,0,1,10,15ZM10,4a6,6,0,1,0,6,6A6,6,0,0,0,10,4ZM9,10a1,1,0,1,0,1-1A1,1,0,0,0,9,10Z"
+        fill="#FFF"
     />
-  </svg>
+</svg>,
   <svg
     height="20"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 20 20"
     width="20"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M18,17a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V3A1,1,0,0,1,3,2H17a1,1,0,0,1,1,1ZM17,0H3A3,3,0,0,0,0,3V17a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V3A3,3,0,0,0,17,0ZM10,15a5,5,0,1,1,5-5A5,5,0,0,1,10,15ZM10,4a6,6,0,1,0,6,6A6,6,0,0,0,10,4ZM9,10a1,1,0,1,0,1-1A1,1,0,0,0,9,10Z"
-      fill={true}
+        d="M18,17a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V3A1,1,0,0,1,3,2H17a1,1,0,0,1,1,1ZM17,0H3A3,3,0,0,0,0,3V17a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V3A3,3,0,0,0,17,0ZM10,15a5,5,0,1,1,5-5A5,5,0,0,1,10,15ZM10,4a6,6,0,1,0,6,6A6,6,0,0,0,10,4ZM9,10a1,1,0,1,0,1-1A1,1,0,0,0,9,10Z"
+        fill={undefined}
     />
-  </svg>
+</svg>,
   <svg
     height="20"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 20 20"
     width="20"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M18,17a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V3A1,1,0,0,1,3,2H17a1,1,0,0,1,1,1ZM17,0H3A3,3,0,0,0,0,3V17a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V3A3,3,0,0,0,17,0ZM10,15a5,5,0,1,1,5-5A5,5,0,0,1,10,15ZM10,4a6,6,0,1,0,6,6A6,6,0,0,0,10,4ZM9,10a1,1,0,1,0,1-1A1,1,0,0,0,9,10Z"
-      fill="#464646"
+        d="M18,17a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V3A1,1,0,0,1,3,2H17a1,1,0,0,1,1,1ZM17,0H3A3,3,0,0,0,0,3V17a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V3A3,3,0,0,0,17,0ZM10,15a5,5,0,1,1,5-5A5,5,0,0,1,10,15ZM10,4a6,6,0,1,0,6,6A6,6,0,0,0,10,4ZM9,10a1,1,0,1,0,1-1A1,1,0,0,0,9,10Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="20"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 20 20"
     width="20"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M18,17a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V3A1,1,0,0,1,3,2H17a1,1,0,0,1,1,1ZM17,0H3A3,3,0,0,0,0,3V17a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V3A3,3,0,0,0,17,0ZM10,15a5,5,0,1,1,5-5A5,5,0,0,1,10,15ZM10,4a6,6,0,1,0,6,6A6,6,0,0,0,10,4ZM9,10a1,1,0,1,0,1-1A1,1,0,0,0,9,10Z"
-      fill="#464646"
+        d="M18,17a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V3A1,1,0,0,1,3,2H17a1,1,0,0,1,1,1ZM17,0H3A3,3,0,0,0,0,3V17a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V3A3,3,0,0,0,17,0ZM10,15a5,5,0,1,1,5-5A5,5,0,0,1,10,15ZM10,4a6,6,0,1,0,6,6A6,6,0,0,0,10,4ZM9,10a1,1,0,1,0,1-1A1,1,0,0,0,9,10Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="20"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 20 20"
     width="20"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M18,17a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V3A1,1,0,0,1,3,2H17a1,1,0,0,1,1,1ZM17,0H3A3,3,0,0,0,0,3V17a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V3A3,3,0,0,0,17,0ZM10,15a5,5,0,1,1,5-5A5,5,0,0,1,10,15ZM10,4a6,6,0,1,0,6,6A6,6,0,0,0,10,4ZM9,10a1,1,0,1,0,1-1A1,1,0,0,0,9,10Z"
-      fill="#464646"
+        d="M18,17a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V3A1,1,0,0,1,3,2H17a1,1,0,0,1,1,1ZM17,0H3A3,3,0,0,0,0,3V17a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V3A3,3,0,0,0,17,0ZM10,15a5,5,0,1,1,5-5A5,5,0,0,1,10,15ZM10,4a6,6,0,1,0,6,6A6,6,0,0,0,10,4ZM9,10a1,1,0,1,0,1-1A1,1,0,0,0,9,10Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="20"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 20 20"
     width="20"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M18,17a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V3A1,1,0,0,1,3,2H17a1,1,0,0,1,1,1ZM17,0H3A3,3,0,0,0,0,3V17a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V3A3,3,0,0,0,17,0ZM10,15a5,5,0,1,1,5-5A5,5,0,0,1,10,15ZM10,4a6,6,0,1,0,6,6A6,6,0,0,0,10,4ZM9,10a1,1,0,1,0,1-1A1,1,0,0,0,9,10Z"
-      fill="#464646"
+        d="M18,17a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V3A1,1,0,0,1,3,2H17a1,1,0,0,1,1,1ZM17,0H3A3,3,0,0,0,0,3V17a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V3A3,3,0,0,0,17,0ZM10,15a5,5,0,1,1,5-5A5,5,0,0,1,10,15ZM10,4a6,6,0,1,0,6,6A6,6,0,0,0,10,4ZM9,10a1,1,0,1,0,1-1A1,1,0,0,0,9,10Z"
+        fill="#464646"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Health /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <g
-      fill-rule="evenodd"
+        fill-rule="evenodd"
     >
-      <circle
-        cx="9"
-        cy="9"
-        fill="#009858"
-        r="9"
-      />
-      <path
-        d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
-        fill="#FFF"
-      />
+        <circle
+            cx="9"
+            cy="9"
+            fill="#009858"
+            r="9"
+        />
+        <path
+            d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
+            fill="#FFF"
+        />
     </g>
-  </svg>
+</svg>,
   <svg
     height="18"
     light={true}
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <g
-      fill-rule="evenodd"
+        fill-rule="evenodd"
     >
-      <circle
-        cx="9"
-        cy="9"
-        fill="#009858"
-        r="9"
-      />
-      <path
-        d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
-        fill="#FFF"
-      />
+        <circle
+            cx="9"
+            cy="9"
+            fill="#009858"
+            r="9"
+        />
+        <path
+            d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
+            fill="#FFF"
+        />
     </g>
-  </svg>
+</svg>,
   <svg
     disabled={true}
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <g
-      fill-rule="evenodd"
+        fill-rule="evenodd"
     >
-      <circle
-        cx="9"
-        cy="9"
-        fill="#009858"
-        r="9"
-      />
-      <path
-        d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
-        fill="#FFF"
-      />
+        <circle
+            cx="9"
+            cy="9"
+            fill="#009858"
+            r="9"
+        />
+        <path
+            d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
+            fill="#FFF"
+        />
     </g>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <g
-      fill-rule="evenodd"
+        fill-rule="evenodd"
     >
-      <circle
-        cx="9"
-        cy="9"
-        fill="#009858"
-        r="9"
-      />
-      <path
-        d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
-        fill="#FFF"
-      />
+        <circle
+            cx="9"
+            cy="9"
+            fill="#009858"
+            r="9"
+        />
+        <path
+            d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
+            fill="#FFF"
+        />
     </g>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <g
-      fill-rule="evenodd"
+        fill-rule="evenodd"
     >
-      <circle
-        cx="9"
-        cy="9"
-        fill="#009858"
-        r="9"
-      />
-      <path
-        d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
-        fill="#FFF"
-      />
+        <circle
+            cx="9"
+            cy="9"
+            fill="#009858"
+            r="9"
+        />
+        <path
+            d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
+            fill="#FFF"
+        />
     </g>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <g
-      fill-rule="evenodd"
+        fill-rule="evenodd"
     >
-      <circle
-        cx="9"
-        cy="9"
-        fill="#009858"
-        r="9"
-      />
-      <path
-        d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
-        fill="#FFF"
-      />
+        <circle
+            cx="9"
+            cy="9"
+            fill="#009858"
+            r="9"
+        />
+        <path
+            d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
+            fill="#FFF"
+        />
     </g>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <g
-      fill-rule="evenodd"
+        fill-rule="evenodd"
     >
-      <circle
-        cx="9"
-        cy="9"
-        fill="#009858"
-        r="9"
-      />
-      <path
-        d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
-        fill="#FFF"
-      />
+        <circle
+            cx="9"
+            cy="9"
+            fill="#009858"
+            r="9"
+        />
+        <path
+            d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
+            fill="#FFF"
+        />
     </g>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Id /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     width="18"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2124 441)"
+        transform="translate(-2124 441)"
     >
-      <use
-        fill="#464646"
-        transform="translate(2124 -441)"
-        xlinkHref="#p"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2126 -439)"
-        xlinkHref="#q"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2134 -438)"
-        xlinkHref="#r"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2134 -436)"
-        xlinkHref="#s"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2134 -434)"
-        xlinkHref="#t"
-      />
+        <use
+            fill="#464646"
+            transform="translate(2124 -441)"
+            xlinkHref="#p"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2126 -439)"
+            xlinkHref="#q"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2134 -438)"
+            xlinkHref="#r"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2134 -436)"
+            xlinkHref="#s"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2134 -434)"
+            xlinkHref="#t"
+        />
     </g>
     <defs>
-      <path
-        d="M16 1c.6 0 1 .5 1 1v8c0 .6-.5 1-1 1H2c-.6 0-1-.5-1-1V2c0-.6.5-1 1-1h14zm0-1H2C.9 0 0 .9 0 2v8c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V2c0-1.1-.9-2-2-2z"
-        id="p"
-      />
-      <path
-        d="M4.7 1C5.4 1 6 1.6 6 2.3v2.5c0 .7-.6 1.3-1.3 1.3H2.3C1.6 6.1 1 5.5 1 4.8V2.3C1 1.6 1.6 1 2.3 1h2.4zm0-1H2.3C1 0 0 1 0 2.3v2.3c0 1.3 1 2.3 2.3 2.3h2.3C6 7 7 5.9 7 4.6V2.3C7 1 6 0 4.7 0z"
-        id="q"
-      />
-      <path
-        d="M5 0H0v1h5V0z"
-        id="r"
-      />
-      <path
-        d="M6 0H0v1h6V0z"
-        id="s"
-      />
-      <path
-        d="M4 0H0v1h4V0z"
-        id="t"
-      />
+        <path
+            d="M16 1c.6 0 1 .5 1 1v8c0 .6-.5 1-1 1H2c-.6 0-1-.5-1-1V2c0-.6.5-1 1-1h14zm0-1H2C.9 0 0 .9 0 2v8c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V2c0-1.1-.9-2-2-2z"
+            id="p"
+        />
+        <path
+            d="M4.7 1C5.4 1 6 1.6 6 2.3v2.5c0 .7-.6 1.3-1.3 1.3H2.3C1.6 6.1 1 5.5 1 4.8V2.3C1 1.6 1.6 1 2.3 1h2.4zm0-1H2.3C1 0 0 1 0 2.3v2.3c0 1.3 1 2.3 2.3 2.3h2.3C6 7 7 5.9 7 4.6V2.3C7 1 6 0 4.7 0z"
+            id="q"
+        />
+        <path
+            d="M5 0H0v1h5V0z"
+            id="r"
+        />
+        <path
+            d="M6 0H0v1h6V0z"
+            id="s"
+        />
+        <path
+            d="M4 0H0v1h4V0z"
+            id="t"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     width="18"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2124 441)"
+        transform="translate(-2124 441)"
     >
-      <use
-        fill="#FFF"
-        transform="translate(2124 -441)"
-        xlinkHref="#p"
-      />
-      <use
-        fill="#FFF"
-        transform="translate(2126 -439)"
-        xlinkHref="#q"
-      />
-      <use
-        fill="#FFF"
-        transform="translate(2134 -438)"
-        xlinkHref="#r"
-      />
-      <use
-        fill="#FFF"
-        transform="translate(2134 -436)"
-        xlinkHref="#s"
-      />
-      <use
-        fill="#FFF"
-        transform="translate(2134 -434)"
-        xlinkHref="#t"
-      />
+        <use
+            fill="#FFF"
+            transform="translate(2124 -441)"
+            xlinkHref="#p"
+        />
+        <use
+            fill="#FFF"
+            transform="translate(2126 -439)"
+            xlinkHref="#q"
+        />
+        <use
+            fill="#FFF"
+            transform="translate(2134 -438)"
+            xlinkHref="#r"
+        />
+        <use
+            fill="#FFF"
+            transform="translate(2134 -436)"
+            xlinkHref="#s"
+        />
+        <use
+            fill="#FFF"
+            transform="translate(2134 -434)"
+            xlinkHref="#t"
+        />
     </g>
     <defs>
-      <path
-        d="M16 1c.6 0 1 .5 1 1v8c0 .6-.5 1-1 1H2c-.6 0-1-.5-1-1V2c0-.6.5-1 1-1h14zm0-1H2C.9 0 0 .9 0 2v8c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V2c0-1.1-.9-2-2-2z"
-        id="p"
-      />
-      <path
-        d="M4.7 1C5.4 1 6 1.6 6 2.3v2.5c0 .7-.6 1.3-1.3 1.3H2.3C1.6 6.1 1 5.5 1 4.8V2.3C1 1.6 1.6 1 2.3 1h2.4zm0-1H2.3C1 0 0 1 0 2.3v2.3c0 1.3 1 2.3 2.3 2.3h2.3C6 7 7 5.9 7 4.6V2.3C7 1 6 0 4.7 0z"
-        id="q"
-      />
-      <path
-        d="M5 0H0v1h5V0z"
-        id="r"
-      />
-      <path
-        d="M6 0H0v1h6V0z"
-        id="s"
-      />
-      <path
-        d="M4 0H0v1h4V0z"
-        id="t"
-      />
+        <path
+            d="M16 1c.6 0 1 .5 1 1v8c0 .6-.5 1-1 1H2c-.6 0-1-.5-1-1V2c0-.6.5-1 1-1h14zm0-1H2C.9 0 0 .9 0 2v8c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V2c0-1.1-.9-2-2-2z"
+            id="p"
+        />
+        <path
+            d="M4.7 1C5.4 1 6 1.6 6 2.3v2.5c0 .7-.6 1.3-1.3 1.3H2.3C1.6 6.1 1 5.5 1 4.8V2.3C1 1.6 1.6 1 2.3 1h2.4zm0-1H2.3C1 0 0 1 0 2.3v2.3c0 1.3 1 2.3 2.3 2.3h2.3C6 7 7 5.9 7 4.6V2.3C7 1 6 0 4.7 0z"
+            id="q"
+        />
+        <path
+            d="M5 0H0v1h5V0z"
+            id="r"
+        />
+        <path
+            d="M6 0H0v1h6V0z"
+            id="s"
+        />
+        <path
+            d="M4 0H0v1h4V0z"
+            id="t"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     width="18"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2124 441)"
+        transform="translate(-2124 441)"
     >
-      <use
-        fill={true}
-        transform="translate(2124 -441)"
-        xlinkHref="#p"
-      />
-      <use
-        fill={true}
-        transform="translate(2126 -439)"
-        xlinkHref="#q"
-      />
-      <use
-        fill={true}
-        transform="translate(2134 -438)"
-        xlinkHref="#r"
-      />
-      <use
-        fill={true}
-        transform="translate(2134 -436)"
-        xlinkHref="#s"
-      />
-      <use
-        fill={true}
-        transform="translate(2134 -434)"
-        xlinkHref="#t"
-      />
+        <use
+            fill={undefined}
+            transform="translate(2124 -441)"
+            xlinkHref="#p"
+        />
+        <use
+            fill={undefined}
+            transform="translate(2126 -439)"
+            xlinkHref="#q"
+        />
+        <use
+            fill={undefined}
+            transform="translate(2134 -438)"
+            xlinkHref="#r"
+        />
+        <use
+            fill={undefined}
+            transform="translate(2134 -436)"
+            xlinkHref="#s"
+        />
+        <use
+            fill={undefined}
+            transform="translate(2134 -434)"
+            xlinkHref="#t"
+        />
     </g>
     <defs>
-      <path
-        d="M16 1c.6 0 1 .5 1 1v8c0 .6-.5 1-1 1H2c-.6 0-1-.5-1-1V2c0-.6.5-1 1-1h14zm0-1H2C.9 0 0 .9 0 2v8c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V2c0-1.1-.9-2-2-2z"
-        id="p"
-      />
-      <path
-        d="M4.7 1C5.4 1 6 1.6 6 2.3v2.5c0 .7-.6 1.3-1.3 1.3H2.3C1.6 6.1 1 5.5 1 4.8V2.3C1 1.6 1.6 1 2.3 1h2.4zm0-1H2.3C1 0 0 1 0 2.3v2.3c0 1.3 1 2.3 2.3 2.3h2.3C6 7 7 5.9 7 4.6V2.3C7 1 6 0 4.7 0z"
-        id="q"
-      />
-      <path
-        d="M5 0H0v1h5V0z"
-        id="r"
-      />
-      <path
-        d="M6 0H0v1h6V0z"
-        id="s"
-      />
-      <path
-        d="M4 0H0v1h4V0z"
-        id="t"
-      />
+        <path
+            d="M16 1c.6 0 1 .5 1 1v8c0 .6-.5 1-1 1H2c-.6 0-1-.5-1-1V2c0-.6.5-1 1-1h14zm0-1H2C.9 0 0 .9 0 2v8c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V2c0-1.1-.9-2-2-2z"
+            id="p"
+        />
+        <path
+            d="M4.7 1C5.4 1 6 1.6 6 2.3v2.5c0 .7-.6 1.3-1.3 1.3H2.3C1.6 6.1 1 5.5 1 4.8V2.3C1 1.6 1.6 1 2.3 1h2.4zm0-1H2.3C1 0 0 1 0 2.3v2.3c0 1.3 1 2.3 2.3 2.3h2.3C6 7 7 5.9 7 4.6V2.3C7 1 6 0 4.7 0z"
+            id="q"
+        />
+        <path
+            d="M5 0H0v1h5V0z"
+            id="r"
+        />
+        <path
+            d="M6 0H0v1h6V0z"
+            id="s"
+        />
+        <path
+            d="M4 0H0v1h4V0z"
+            id="t"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     width="18"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2124 441)"
+        transform="translate(-2124 441)"
     >
-      <use
-        fill="#464646"
-        transform="translate(2124 -441)"
-        xlinkHref="#p"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2126 -439)"
-        xlinkHref="#q"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2134 -438)"
-        xlinkHref="#r"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2134 -436)"
-        xlinkHref="#s"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2134 -434)"
-        xlinkHref="#t"
-      />
+        <use
+            fill="#464646"
+            transform="translate(2124 -441)"
+            xlinkHref="#p"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2126 -439)"
+            xlinkHref="#q"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2134 -438)"
+            xlinkHref="#r"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2134 -436)"
+            xlinkHref="#s"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2134 -434)"
+            xlinkHref="#t"
+        />
     </g>
     <defs>
-      <path
-        d="M16 1c.6 0 1 .5 1 1v8c0 .6-.5 1-1 1H2c-.6 0-1-.5-1-1V2c0-.6.5-1 1-1h14zm0-1H2C.9 0 0 .9 0 2v8c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V2c0-1.1-.9-2-2-2z"
-        id="p"
-      />
-      <path
-        d="M4.7 1C5.4 1 6 1.6 6 2.3v2.5c0 .7-.6 1.3-1.3 1.3H2.3C1.6 6.1 1 5.5 1 4.8V2.3C1 1.6 1.6 1 2.3 1h2.4zm0-1H2.3C1 0 0 1 0 2.3v2.3c0 1.3 1 2.3 2.3 2.3h2.3C6 7 7 5.9 7 4.6V2.3C7 1 6 0 4.7 0z"
-        id="q"
-      />
-      <path
-        d="M5 0H0v1h5V0z"
-        id="r"
-      />
-      <path
-        d="M6 0H0v1h6V0z"
-        id="s"
-      />
-      <path
-        d="M4 0H0v1h4V0z"
-        id="t"
-      />
+        <path
+            d="M16 1c.6 0 1 .5 1 1v8c0 .6-.5 1-1 1H2c-.6 0-1-.5-1-1V2c0-.6.5-1 1-1h14zm0-1H2C.9 0 0 .9 0 2v8c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V2c0-1.1-.9-2-2-2z"
+            id="p"
+        />
+        <path
+            d="M4.7 1C5.4 1 6 1.6 6 2.3v2.5c0 .7-.6 1.3-1.3 1.3H2.3C1.6 6.1 1 5.5 1 4.8V2.3C1 1.6 1.6 1 2.3 1h2.4zm0-1H2.3C1 0 0 1 0 2.3v2.3c0 1.3 1 2.3 2.3 2.3h2.3C6 7 7 5.9 7 4.6V2.3C7 1 6 0 4.7 0z"
+            id="q"
+        />
+        <path
+            d="M5 0H0v1h5V0z"
+            id="r"
+        />
+        <path
+            d="M6 0H0v1h6V0z"
+            id="s"
+        />
+        <path
+            d="M4 0H0v1h4V0z"
+            id="t"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     width="18"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2124 441)"
+        transform="translate(-2124 441)"
     >
-      <use
-        fill="#464646"
-        transform="translate(2124 -441)"
-        xlinkHref="#p"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2126 -439)"
-        xlinkHref="#q"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2134 -438)"
-        xlinkHref="#r"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2134 -436)"
-        xlinkHref="#s"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2134 -434)"
-        xlinkHref="#t"
-      />
+        <use
+            fill="#464646"
+            transform="translate(2124 -441)"
+            xlinkHref="#p"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2126 -439)"
+            xlinkHref="#q"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2134 -438)"
+            xlinkHref="#r"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2134 -436)"
+            xlinkHref="#s"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2134 -434)"
+            xlinkHref="#t"
+        />
     </g>
     <defs>
-      <path
-        d="M16 1c.6 0 1 .5 1 1v8c0 .6-.5 1-1 1H2c-.6 0-1-.5-1-1V2c0-.6.5-1 1-1h14zm0-1H2C.9 0 0 .9 0 2v8c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V2c0-1.1-.9-2-2-2z"
-        id="p"
-      />
-      <path
-        d="M4.7 1C5.4 1 6 1.6 6 2.3v2.5c0 .7-.6 1.3-1.3 1.3H2.3C1.6 6.1 1 5.5 1 4.8V2.3C1 1.6 1.6 1 2.3 1h2.4zm0-1H2.3C1 0 0 1 0 2.3v2.3c0 1.3 1 2.3 2.3 2.3h2.3C6 7 7 5.9 7 4.6V2.3C7 1 6 0 4.7 0z"
-        id="q"
-      />
-      <path
-        d="M5 0H0v1h5V0z"
-        id="r"
-      />
-      <path
-        d="M6 0H0v1h6V0z"
-        id="s"
-      />
-      <path
-        d="M4 0H0v1h4V0z"
-        id="t"
-      />
+        <path
+            d="M16 1c.6 0 1 .5 1 1v8c0 .6-.5 1-1 1H2c-.6 0-1-.5-1-1V2c0-.6.5-1 1-1h14zm0-1H2C.9 0 0 .9 0 2v8c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V2c0-1.1-.9-2-2-2z"
+            id="p"
+        />
+        <path
+            d="M4.7 1C5.4 1 6 1.6 6 2.3v2.5c0 .7-.6 1.3-1.3 1.3H2.3C1.6 6.1 1 5.5 1 4.8V2.3C1 1.6 1.6 1 2.3 1h2.4zm0-1H2.3C1 0 0 1 0 2.3v2.3c0 1.3 1 2.3 2.3 2.3h2.3C6 7 7 5.9 7 4.6V2.3C7 1 6 0 4.7 0z"
+            id="q"
+        />
+        <path
+            d="M5 0H0v1h5V0z"
+            id="r"
+        />
+        <path
+            d="M6 0H0v1h6V0z"
+            id="s"
+        />
+        <path
+            d="M4 0H0v1h4V0z"
+            id="t"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     width="18"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2124 441)"
+        transform="translate(-2124 441)"
     >
-      <use
-        fill="#464646"
-        transform="translate(2124 -441)"
-        xlinkHref="#p"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2126 -439)"
-        xlinkHref="#q"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2134 -438)"
-        xlinkHref="#r"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2134 -436)"
-        xlinkHref="#s"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2134 -434)"
-        xlinkHref="#t"
-      />
+        <use
+            fill="#464646"
+            transform="translate(2124 -441)"
+            xlinkHref="#p"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2126 -439)"
+            xlinkHref="#q"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2134 -438)"
+            xlinkHref="#r"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2134 -436)"
+            xlinkHref="#s"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2134 -434)"
+            xlinkHref="#t"
+        />
     </g>
     <defs>
-      <path
-        d="M16 1c.6 0 1 .5 1 1v8c0 .6-.5 1-1 1H2c-.6 0-1-.5-1-1V2c0-.6.5-1 1-1h14zm0-1H2C.9 0 0 .9 0 2v8c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V2c0-1.1-.9-2-2-2z"
-        id="p"
-      />
-      <path
-        d="M4.7 1C5.4 1 6 1.6 6 2.3v2.5c0 .7-.6 1.3-1.3 1.3H2.3C1.6 6.1 1 5.5 1 4.8V2.3C1 1.6 1.6 1 2.3 1h2.4zm0-1H2.3C1 0 0 1 0 2.3v2.3c0 1.3 1 2.3 2.3 2.3h2.3C6 7 7 5.9 7 4.6V2.3C7 1 6 0 4.7 0z"
-        id="q"
-      />
-      <path
-        d="M5 0H0v1h5V0z"
-        id="r"
-      />
-      <path
-        d="M6 0H0v1h6V0z"
-        id="s"
-      />
-      <path
-        d="M4 0H0v1h4V0z"
-        id="t"
-      />
+        <path
+            d="M16 1c.6 0 1 .5 1 1v8c0 .6-.5 1-1 1H2c-.6 0-1-.5-1-1V2c0-.6.5-1 1-1h14zm0-1H2C.9 0 0 .9 0 2v8c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V2c0-1.1-.9-2-2-2z"
+            id="p"
+        />
+        <path
+            d="M4.7 1C5.4 1 6 1.6 6 2.3v2.5c0 .7-.6 1.3-1.3 1.3H2.3C1.6 6.1 1 5.5 1 4.8V2.3C1 1.6 1.6 1 2.3 1h2.4zm0-1H2.3C1 0 0 1 0 2.3v2.3c0 1.3 1 2.3 2.3 2.3h2.3C6 7 7 5.9 7 4.6V2.3C7 1 6 0 4.7 0z"
+            id="q"
+        />
+        <path
+            d="M5 0H0v1h5V0z"
+            id="r"
+        />
+        <path
+            d="M6 0H0v1h6V0z"
+            id="s"
+        />
+        <path
+            d="M4 0H0v1h4V0z"
+            id="t"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     width="18"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2124 441)"
+        transform="translate(-2124 441)"
     >
-      <use
-        fill="#464646"
-        transform="translate(2124 -441)"
-        xlinkHref="#p"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2126 -439)"
-        xlinkHref="#q"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2134 -438)"
-        xlinkHref="#r"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2134 -436)"
-        xlinkHref="#s"
-      />
-      <use
-        fill="#464646"
-        transform="translate(2134 -434)"
-        xlinkHref="#t"
-      />
+        <use
+            fill="#464646"
+            transform="translate(2124 -441)"
+            xlinkHref="#p"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2126 -439)"
+            xlinkHref="#q"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2134 -438)"
+            xlinkHref="#r"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2134 -436)"
+            xlinkHref="#s"
+        />
+        <use
+            fill="#464646"
+            transform="translate(2134 -434)"
+            xlinkHref="#t"
+        />
     </g>
     <defs>
-      <path
-        d="M16 1c.6 0 1 .5 1 1v8c0 .6-.5 1-1 1H2c-.6 0-1-.5-1-1V2c0-.6.5-1 1-1h14zm0-1H2C.9 0 0 .9 0 2v8c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V2c0-1.1-.9-2-2-2z"
-        id="p"
-      />
-      <path
-        d="M4.7 1C5.4 1 6 1.6 6 2.3v2.5c0 .7-.6 1.3-1.3 1.3H2.3C1.6 6.1 1 5.5 1 4.8V2.3C1 1.6 1.6 1 2.3 1h2.4zm0-1H2.3C1 0 0 1 0 2.3v2.3c0 1.3 1 2.3 2.3 2.3h2.3C6 7 7 5.9 7 4.6V2.3C7 1 6 0 4.7 0z"
-        id="q"
-      />
-      <path
-        d="M5 0H0v1h5V0z"
-        id="r"
-      />
-      <path
-        d="M6 0H0v1h6V0z"
-        id="s"
-      />
-      <path
-        d="M4 0H0v1h4V0z"
-        id="t"
-      />
+        <path
+            d="M16 1c.6 0 1 .5 1 1v8c0 .6-.5 1-1 1H2c-.6 0-1-.5-1-1V2c0-.6.5-1 1-1h14zm0-1H2C.9 0 0 .9 0 2v8c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V2c0-1.1-.9-2-2-2z"
+            id="p"
+        />
+        <path
+            d="M4.7 1C5.4 1 6 1.6 6 2.3v2.5c0 .7-.6 1.3-1.3 1.3H2.3C1.6 6.1 1 5.5 1 4.8V2.3C1 1.6 1.6 1 2.3 1h2.4zm0-1H2.3C1 0 0 1 0 2.3v2.3c0 1.3 1 2.3 2.3 2.3h2.3C6 7 7 5.9 7 4.6V2.3C7 1 6 0 4.7 0z"
+            id="q"
+        />
+        <path
+            d="M5 0H0v1h5V0z"
+            id="r"
+        />
+        <path
+            d="M6 0H0v1h6V0z"
+            id="s"
+        />
+        <path
+            d="M4 0H0v1h4V0z"
+            id="t"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Import /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="24"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 24 24"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2061 2768)"
+        transform="translate(-2061 2768)"
     >
-      <clipPath
-        clipRule="evenodd"
-        id="u"
-      >
-        <path
-          d="M2061-2768h24v24h-24v-24z"
-          fill="#FFF"
-        />
-      </clipPath>
-      <g
-        clipPath="url(#u)"
-      >
-        <path
-          d="M2061-2768h24v24h-24v-24z"
-          fill="#FFF"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2061 -2754)"
-          xlinkHref="#v"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2072 -2768)"
-          xlinkHref="#w"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2067.29 -2755)"
-          xlinkHref="#undefined"
-        />
-      </g>
+        <clipPath
+            clipRule="evenodd"
+            id="u"
+        >
+            <path
+                d="M2061-2768h24v24h-24v-24z"
+                fill="#FFF"
+            />
+        </clipPath>
+        <g
+            clipPath="url(#u)"
+        >
+            <path
+                d="M2061-2768h24v24h-24v-24z"
+                fill="#FFF"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2061 -2754)"
+                xlinkHref="#v"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2072 -2768)"
+                xlinkHref="#w"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2067.29 -2755)"
+                xlinkHref="#undefined"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M0 0h2v8h20V0h2v10H0V0z"
-        fillRule="evenodd"
-        id="v"
-      />
-      <path
-        d="M0 0h2v18H0V0z"
-        fillRule="evenodd"
-        id="w"
-      />
-      <path
-        d="M1.414 0L0 1.414l4.295 4.292.655.658.759.756 5.705-5.705L10 0 5.707 4.293 1.414 0z"
-        fillRule="evenodd"
-        id="undefined"
-      />
+        <path
+            d="M0 0h2v8h20V0h2v10H0V0z"
+            fillRule="evenodd"
+            id="v"
+        />
+        <path
+            d="M0 0h2v18H0V0z"
+            fillRule="evenodd"
+            id="w"
+        />
+        <path
+            d="M1.414 0L0 1.414l4.295 4.292.655.658.759.756 5.705-5.705L10 0 5.707 4.293 1.414 0z"
+            fillRule="evenodd"
+            id="undefined"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="24"
     light={true}
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 24 24"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2061 2768)"
+        transform="translate(-2061 2768)"
     >
-      <clipPath
-        clipRule="evenodd"
-        id="u"
-      >
-        <path
-          d="M2061-2768h24v24h-24v-24z"
-          fill="#FFF"
-        />
-      </clipPath>
-      <g
-        clipPath="url(#u)"
-      >
-        <path
-          d="M2061-2768h24v24h-24v-24z"
-          fill="#FFF"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2061 -2754)"
-          xlinkHref="#v"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2072 -2768)"
-          xlinkHref="#w"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2067.29 -2755)"
-          xlinkHref="#undefined"
-        />
-      </g>
+        <clipPath
+            clipRule="evenodd"
+            id="u"
+        >
+            <path
+                d="M2061-2768h24v24h-24v-24z"
+                fill="#FFF"
+            />
+        </clipPath>
+        <g
+            clipPath="url(#u)"
+        >
+            <path
+                d="M2061-2768h24v24h-24v-24z"
+                fill="#FFF"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2061 -2754)"
+                xlinkHref="#v"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2072 -2768)"
+                xlinkHref="#w"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2067.29 -2755)"
+                xlinkHref="#undefined"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M0 0h2v8h20V0h2v10H0V0z"
-        fillRule="evenodd"
-        id="v"
-      />
-      <path
-        d="M0 0h2v18H0V0z"
-        fillRule="evenodd"
-        id="w"
-      />
-      <path
-        d="M1.414 0L0 1.414l4.295 4.292.655.658.759.756 5.705-5.705L10 0 5.707 4.293 1.414 0z"
-        fillRule="evenodd"
-        id="undefined"
-      />
+        <path
+            d="M0 0h2v8h20V0h2v10H0V0z"
+            fillRule="evenodd"
+            id="v"
+        />
+        <path
+            d="M0 0h2v18H0V0z"
+            fillRule="evenodd"
+            id="w"
+        />
+        <path
+            d="M1.414 0L0 1.414l4.295 4.292.655.658.759.756 5.705-5.705L10 0 5.707 4.293 1.414 0z"
+            fillRule="evenodd"
+            id="undefined"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     disabled={true}
     height="24"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 24 24"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2061 2768)"
+        transform="translate(-2061 2768)"
     >
-      <clipPath
-        clipRule="evenodd"
-        id="u"
-      >
-        <path
-          d="M2061-2768h24v24h-24v-24z"
-          fill="#FFF"
-        />
-      </clipPath>
-      <g
-        clipPath="url(#u)"
-      >
-        <path
-          d="M2061-2768h24v24h-24v-24z"
-          fill="#FFF"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2061 -2754)"
-          xlinkHref="#v"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2072 -2768)"
-          xlinkHref="#w"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2067.29 -2755)"
-          xlinkHref="#undefined"
-        />
-      </g>
+        <clipPath
+            clipRule="evenodd"
+            id="u"
+        >
+            <path
+                d="M2061-2768h24v24h-24v-24z"
+                fill="#FFF"
+            />
+        </clipPath>
+        <g
+            clipPath="url(#u)"
+        >
+            <path
+                d="M2061-2768h24v24h-24v-24z"
+                fill="#FFF"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2061 -2754)"
+                xlinkHref="#v"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2072 -2768)"
+                xlinkHref="#w"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2067.29 -2755)"
+                xlinkHref="#undefined"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M0 0h2v8h20V0h2v10H0V0z"
-        fillRule="evenodd"
-        id="v"
-      />
-      <path
-        d="M0 0h2v18H0V0z"
-        fillRule="evenodd"
-        id="w"
-      />
-      <path
-        d="M1.414 0L0 1.414l4.295 4.292.655.658.759.756 5.705-5.705L10 0 5.707 4.293 1.414 0z"
-        fillRule="evenodd"
-        id="undefined"
-      />
+        <path
+            d="M0 0h2v8h20V0h2v10H0V0z"
+            fillRule="evenodd"
+            id="v"
+        />
+        <path
+            d="M0 0h2v18H0V0z"
+            fillRule="evenodd"
+            id="w"
+        />
+        <path
+            d="M1.414 0L0 1.414l4.295 4.292.655.658.759.756 5.705-5.705L10 0 5.707 4.293 1.414 0z"
+            fillRule="evenodd"
+            id="undefined"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="24"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 24 24"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2061 2768)"
+        transform="translate(-2061 2768)"
     >
-      <clipPath
-        clipRule="evenodd"
-        id="u"
-      >
-        <path
-          d="M2061-2768h24v24h-24v-24z"
-          fill="#FFF"
-        />
-      </clipPath>
-      <g
-        clipPath="url(#u)"
-      >
-        <path
-          d="M2061-2768h24v24h-24v-24z"
-          fill="#FFF"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2061 -2754)"
-          xlinkHref="#v"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2072 -2768)"
-          xlinkHref="#w"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2067.29 -2755)"
-          xlinkHref="#undefined"
-        />
-      </g>
+        <clipPath
+            clipRule="evenodd"
+            id="u"
+        >
+            <path
+                d="M2061-2768h24v24h-24v-24z"
+                fill="#FFF"
+            />
+        </clipPath>
+        <g
+            clipPath="url(#u)"
+        >
+            <path
+                d="M2061-2768h24v24h-24v-24z"
+                fill="#FFF"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2061 -2754)"
+                xlinkHref="#v"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2072 -2768)"
+                xlinkHref="#w"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2067.29 -2755)"
+                xlinkHref="#undefined"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M0 0h2v8h20V0h2v10H0V0z"
-        fillRule="evenodd"
-        id="v"
-      />
-      <path
-        d="M0 0h2v18H0V0z"
-        fillRule="evenodd"
-        id="w"
-      />
-      <path
-        d="M1.414 0L0 1.414l4.295 4.292.655.658.759.756 5.705-5.705L10 0 5.707 4.293 1.414 0z"
-        fillRule="evenodd"
-        id="undefined"
-      />
+        <path
+            d="M0 0h2v8h20V0h2v10H0V0z"
+            fillRule="evenodd"
+            id="v"
+        />
+        <path
+            d="M0 0h2v18H0V0z"
+            fillRule="evenodd"
+            id="w"
+        />
+        <path
+            d="M1.414 0L0 1.414l4.295 4.292.655.658.759.756 5.705-5.705L10 0 5.707 4.293 1.414 0z"
+            fillRule="evenodd"
+            id="undefined"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="24"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 24 24"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2061 2768)"
+        transform="translate(-2061 2768)"
     >
-      <clipPath
-        clipRule="evenodd"
-        id="u"
-      >
-        <path
-          d="M2061-2768h24v24h-24v-24z"
-          fill="#FFF"
-        />
-      </clipPath>
-      <g
-        clipPath="url(#u)"
-      >
-        <path
-          d="M2061-2768h24v24h-24v-24z"
-          fill="#FFF"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2061 -2754)"
-          xlinkHref="#v"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2072 -2768)"
-          xlinkHref="#w"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2067.29 -2755)"
-          xlinkHref="#undefined"
-        />
-      </g>
+        <clipPath
+            clipRule="evenodd"
+            id="u"
+        >
+            <path
+                d="M2061-2768h24v24h-24v-24z"
+                fill="#FFF"
+            />
+        </clipPath>
+        <g
+            clipPath="url(#u)"
+        >
+            <path
+                d="M2061-2768h24v24h-24v-24z"
+                fill="#FFF"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2061 -2754)"
+                xlinkHref="#v"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2072 -2768)"
+                xlinkHref="#w"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2067.29 -2755)"
+                xlinkHref="#undefined"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M0 0h2v8h20V0h2v10H0V0z"
-        fillRule="evenodd"
-        id="v"
-      />
-      <path
-        d="M0 0h2v18H0V0z"
-        fillRule="evenodd"
-        id="w"
-      />
-      <path
-        d="M1.414 0L0 1.414l4.295 4.292.655.658.759.756 5.705-5.705L10 0 5.707 4.293 1.414 0z"
-        fillRule="evenodd"
-        id="undefined"
-      />
+        <path
+            d="M0 0h2v8h20V0h2v10H0V0z"
+            fillRule="evenodd"
+            id="v"
+        />
+        <path
+            d="M0 0h2v18H0V0z"
+            fillRule="evenodd"
+            id="w"
+        />
+        <path
+            d="M1.414 0L0 1.414l4.295 4.292.655.658.759.756 5.705-5.705L10 0 5.707 4.293 1.414 0z"
+            fillRule="evenodd"
+            id="undefined"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="24"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 24 24"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2061 2768)"
+        transform="translate(-2061 2768)"
     >
-      <clipPath
-        clipRule="evenodd"
-        id="u"
-      >
-        <path
-          d="M2061-2768h24v24h-24v-24z"
-          fill="#FFF"
-        />
-      </clipPath>
-      <g
-        clipPath="url(#u)"
-      >
-        <path
-          d="M2061-2768h24v24h-24v-24z"
-          fill="#FFF"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2061 -2754)"
-          xlinkHref="#v"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2072 -2768)"
-          xlinkHref="#w"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2067.29 -2755)"
-          xlinkHref="#undefined"
-        />
-      </g>
+        <clipPath
+            clipRule="evenodd"
+            id="u"
+        >
+            <path
+                d="M2061-2768h24v24h-24v-24z"
+                fill="#FFF"
+            />
+        </clipPath>
+        <g
+            clipPath="url(#u)"
+        >
+            <path
+                d="M2061-2768h24v24h-24v-24z"
+                fill="#FFF"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2061 -2754)"
+                xlinkHref="#v"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2072 -2768)"
+                xlinkHref="#w"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2067.29 -2755)"
+                xlinkHref="#undefined"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M0 0h2v8h20V0h2v10H0V0z"
-        fillRule="evenodd"
-        id="v"
-      />
-      <path
-        d="M0 0h2v18H0V0z"
-        fillRule="evenodd"
-        id="w"
-      />
-      <path
-        d="M1.414 0L0 1.414l4.295 4.292.655.658.759.756 5.705-5.705L10 0 5.707 4.293 1.414 0z"
-        fillRule="evenodd"
-        id="undefined"
-      />
+        <path
+            d="M0 0h2v8h20V0h2v10H0V0z"
+            fillRule="evenodd"
+            id="v"
+        />
+        <path
+            d="M0 0h2v18H0V0z"
+            fillRule="evenodd"
+            id="w"
+        />
+        <path
+            d="M1.414 0L0 1.414l4.295 4.292.655.658.759.756 5.705-5.705L10 0 5.707 4.293 1.414 0z"
+            fillRule="evenodd"
+            id="undefined"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="24"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 24 24"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-2061 2768)"
+        transform="translate(-2061 2768)"
     >
-      <clipPath
-        clipRule="evenodd"
-        id="u"
-      >
-        <path
-          d="M2061-2768h24v24h-24v-24z"
-          fill="#FFF"
-        />
-      </clipPath>
-      <g
-        clipPath="url(#u)"
-      >
-        <path
-          d="M2061-2768h24v24h-24v-24z"
-          fill="#FFF"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2061 -2754)"
-          xlinkHref="#v"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2072 -2768)"
-          xlinkHref="#w"
-        />
-        <use
-          fill="#464646"
-          transform="translate(2067.29 -2755)"
-          xlinkHref="#undefined"
-        />
-      </g>
+        <clipPath
+            clipRule="evenodd"
+            id="u"
+        >
+            <path
+                d="M2061-2768h24v24h-24v-24z"
+                fill="#FFF"
+            />
+        </clipPath>
+        <g
+            clipPath="url(#u)"
+        >
+            <path
+                d="M2061-2768h24v24h-24v-24z"
+                fill="#FFF"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2061 -2754)"
+                xlinkHref="#v"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2072 -2768)"
+                xlinkHref="#w"
+            />
+            <use
+                fill="#464646"
+                transform="translate(2067.29 -2755)"
+                xlinkHref="#undefined"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M0 0h2v8h20V0h2v10H0V0z"
-        fillRule="evenodd"
-        id="v"
-      />
-      <path
-        d="M0 0h2v18H0V0z"
-        fillRule="evenodd"
-        id="w"
-      />
-      <path
-        d="M1.414 0L0 1.414l4.295 4.292.655.658.759.756 5.705-5.705L10 0 5.707 4.293 1.414 0z"
-        fillRule="evenodd"
-        id="undefined"
-      />
+        <path
+            d="M0 0h2v8h20V0h2v10H0V0z"
+            fillRule="evenodd"
+            id="v"
+        />
+        <path
+            d="M0 0h2v18H0V0z"
+            fillRule="evenodd"
+            id="w"
+        />
+        <path
+            d="M1.414 0L0 1.414l4.295 4.292.655.658.759.756 5.705-5.705L10 0 5.707 4.293 1.414 0z"
+            fillRule="evenodd"
+            id="undefined"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <InstanceCount /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 17"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1105 974)"
+        transform="translate(-1105 974)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1105 -974)"
-            xlinkHref="#x"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1105 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1111 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1117 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1105 -968)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1111 -968)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1117 -968)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1105 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1111 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1117 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
         </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1111 -974)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1117 -974)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1105 -968)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1111 -968)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1117 -968)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1105 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1111 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1117 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 2.5 5C 3.88071 5 5 3.88071 5 2.5C 5 1.11929 3.88071 0 2.5 0C 1.11929 0 0 1.11929 0 2.5C 0 3.88071 1.11929 5 2.5 5Z"
-        id="x"
-      />
-      <path
-        d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
-        id="y"
-      />
+        <path
+            d="M 2.5 5C 3.88071 5 5 3.88071 5 2.5C 5 1.11929 3.88071 0 2.5 0C 1.11929 0 0 1.11929 0 2.5C 0 3.88071 1.11929 5 2.5 5Z"
+            id="x"
+        />
+        <path
+            d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
+            id="y"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 17"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1105 974)"
+        transform="translate(-1105 974)"
     >
-      <g>
         <g>
-          <use
-            fill="#FFF"
-            transform="translate(1105 -974)"
-            xlinkHref="#x"
-          />
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(1105 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(1111 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(1117 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(1105 -968)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#FFF"
+                        transform="translate(1111 -968)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#FFF"
+                        transform="translate(1117 -968)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#FFF"
+                        transform="translate(1105 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#FFF"
+                        transform="translate(1111 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#FFF"
+                        transform="translate(1117 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
         </g>
-        <g>
-          <use
-            fill="#FFF"
-            transform="translate(1111 -974)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <use
-            fill="#FFF"
-            transform="translate(1117 -974)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <use
-            fill="#FFF"
-            transform="translate(1105 -968)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#FFF"
-              transform="translate(1111 -968)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#FFF"
-              transform="translate(1117 -968)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#FFF"
-              transform="translate(1105 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#FFF"
-              transform="translate(1111 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#FFF"
-              transform="translate(1117 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 2.5 5C 3.88071 5 5 3.88071 5 2.5C 5 1.11929 3.88071 0 2.5 0C 1.11929 0 0 1.11929 0 2.5C 0 3.88071 1.11929 5 2.5 5Z"
-        id="x"
-      />
-      <path
-        d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
-        id="y"
-      />
+        <path
+            d="M 2.5 5C 3.88071 5 5 3.88071 5 2.5C 5 1.11929 3.88071 0 2.5 0C 1.11929 0 0 1.11929 0 2.5C 0 3.88071 1.11929 5 2.5 5Z"
+            id="x"
+        />
+        <path
+            d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
+            id="y"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 17"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1105 974)"
+        transform="translate(-1105 974)"
     >
-      <g>
         <g>
-          <use
-            fill={true}
-            transform="translate(1105 -974)"
-            xlinkHref="#x"
-          />
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(1105 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(1111 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(1117 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(1105 -968)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill={undefined}
+                        transform="translate(1111 -968)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill={undefined}
+                        transform="translate(1117 -968)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill={undefined}
+                        transform="translate(1105 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill={undefined}
+                        transform="translate(1111 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill={undefined}
+                        transform="translate(1117 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
         </g>
-        <g>
-          <use
-            fill={true}
-            transform="translate(1111 -974)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <use
-            fill={true}
-            transform="translate(1117 -974)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <use
-            fill={true}
-            transform="translate(1105 -968)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <g>
-            <use
-              fill={true}
-              transform="translate(1111 -968)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill={true}
-              transform="translate(1117 -968)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill={true}
-              transform="translate(1105 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill={true}
-              transform="translate(1111 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill={true}
-              transform="translate(1117 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 2.5 5C 3.88071 5 5 3.88071 5 2.5C 5 1.11929 3.88071 0 2.5 0C 1.11929 0 0 1.11929 0 2.5C 0 3.88071 1.11929 5 2.5 5Z"
-        id="x"
-      />
-      <path
-        d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
-        id="y"
-      />
+        <path
+            d="M 2.5 5C 3.88071 5 5 3.88071 5 2.5C 5 1.11929 3.88071 0 2.5 0C 1.11929 0 0 1.11929 0 2.5C 0 3.88071 1.11929 5 2.5 5Z"
+            id="x"
+        />
+        <path
+            d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
+            id="y"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 17"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1105 974)"
+        transform="translate(-1105 974)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1105 -974)"
-            xlinkHref="#x"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1105 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1111 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1117 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1105 -968)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1111 -968)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1117 -968)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1105 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1111 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1117 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
         </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1111 -974)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1117 -974)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1105 -968)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1111 -968)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1117 -968)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1105 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1111 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1117 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 2.5 5C 3.88071 5 5 3.88071 5 2.5C 5 1.11929 3.88071 0 2.5 0C 1.11929 0 0 1.11929 0 2.5C 0 3.88071 1.11929 5 2.5 5Z"
-        id="x"
-      />
-      <path
-        d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
-        id="y"
-      />
+        <path
+            d="M 2.5 5C 3.88071 5 5 3.88071 5 2.5C 5 1.11929 3.88071 0 2.5 0C 1.11929 0 0 1.11929 0 2.5C 0 3.88071 1.11929 5 2.5 5Z"
+            id="x"
+        />
+        <path
+            d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
+            id="y"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 17"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1105 974)"
+        transform="translate(-1105 974)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1105 -974)"
-            xlinkHref="#x"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1105 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1111 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1117 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1105 -968)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1111 -968)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1117 -968)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1105 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1111 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1117 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
         </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1111 -974)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1117 -974)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1105 -968)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1111 -968)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1117 -968)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1105 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1111 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1117 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 2.5 5C 3.88071 5 5 3.88071 5 2.5C 5 1.11929 3.88071 0 2.5 0C 1.11929 0 0 1.11929 0 2.5C 0 3.88071 1.11929 5 2.5 5Z"
-        id="x"
-      />
-      <path
-        d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
-        id="y"
-      />
+        <path
+            d="M 2.5 5C 3.88071 5 5 3.88071 5 2.5C 5 1.11929 3.88071 0 2.5 0C 1.11929 0 0 1.11929 0 2.5C 0 3.88071 1.11929 5 2.5 5Z"
+            id="x"
+        />
+        <path
+            d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
+            id="y"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 17"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1105 974)"
+        transform="translate(-1105 974)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1105 -974)"
-            xlinkHref="#x"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1105 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1111 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1117 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1105 -968)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1111 -968)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1117 -968)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1105 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1111 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1117 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
         </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1111 -974)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1117 -974)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1105 -968)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1111 -968)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1117 -968)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1105 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1111 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1117 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 2.5 5C 3.88071 5 5 3.88071 5 2.5C 5 1.11929 3.88071 0 2.5 0C 1.11929 0 0 1.11929 0 2.5C 0 3.88071 1.11929 5 2.5 5Z"
-        id="x"
-      />
-      <path
-        d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
-        id="y"
-      />
+        <path
+            d="M 2.5 5C 3.88071 5 5 3.88071 5 2.5C 5 1.11929 3.88071 0 2.5 0C 1.11929 0 0 1.11929 0 2.5C 0 3.88071 1.11929 5 2.5 5Z"
+            id="x"
+        />
+        <path
+            d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
+            id="y"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 17"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1105 974)"
+        transform="translate(-1105 974)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1105 -974)"
-            xlinkHref="#x"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1105 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1111 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1117 -974)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1105 -968)"
+                    xlinkHref="#x"
+                />
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1111 -968)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1117 -968)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1105 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1111 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1117 -962)"
+                        xlinkHref="#y"
+                    />
+                </g>
+            </g>
         </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1111 -974)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1117 -974)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1105 -968)"
-            xlinkHref="#x"
-          />
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1111 -968)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1117 -968)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1105 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1111 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1117 -962)"
-              xlinkHref="#y"
-            />
-          </g>
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 2.5 5C 3.88071 5 5 3.88071 5 2.5C 5 1.11929 3.88071 0 2.5 0C 1.11929 0 0 1.11929 0 2.5C 0 3.88071 1.11929 5 2.5 5Z"
-        id="x"
-      />
-      <path
-        d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
-        id="y"
-      />
+        <path
+            d="M 2.5 5C 3.88071 5 5 3.88071 5 2.5C 5 1.11929 3.88071 0 2.5 0C 1.11929 0 0 1.11929 0 2.5C 0 3.88071 1.11929 5 2.5 5Z"
+            id="x"
+        />
+        <path
+            d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
+            id="y"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <InstanceType /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 15 18"
     width="15"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1106 1522)"
+        transform="translate(-1106 1522)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1108 -1516)"
-            xlinkHref="#z"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1108 -1516)"
+                    xlinkHref="#z"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1110 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1112 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1114 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1116 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1106 -1522)"
+                    xlinkHref="#B"
+                />
+            </g>
         </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1110 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1112 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1114 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1116 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1106 -1522)"
-            xlinkHref="#B"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 10 1L 10 7L 1 7L 1 1L 10 1ZM 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 7C 0 7.5 0.4 8 1 8L 10 8C 10.5 8 11 7.6 11 7L 11 1C 11 0.4 10.6 0 10 0Z"
-        id="z"
-      />
-      <path
-        d="M 0.5 4C 0.2 4 0 3.8 0 3.5L 0 0.5C 0 0.2 0.2 0 0.5 0C 0.8 0 1 0.2 1 0.5L 1 3.5C 1 3.8 0.8 4 0.5 4Z"
-        id="A"
-      />
-      <path
-        d="M 14 4L 11 1L 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 17C 0 17.5 0.4 18 1 18L 14 18C 14.5 18 15 17.6 15 17L 15 5L 14 4ZM 12.6 4L 11 4L 11 2.4L 12.6 4ZM 1 17L 1 1L 10 1L 10 5L 14 5L 14 17L 1 17Z"
-        id="B"
-      />
+        <path
+            d="M 10 1L 10 7L 1 7L 1 1L 10 1ZM 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 7C 0 7.5 0.4 8 1 8L 10 8C 10.5 8 11 7.6 11 7L 11 1C 11 0.4 10.6 0 10 0Z"
+            id="z"
+        />
+        <path
+            d="M 0.5 4C 0.2 4 0 3.8 0 3.5L 0 0.5C 0 0.2 0.2 0 0.5 0C 0.8 0 1 0.2 1 0.5L 1 3.5C 1 3.8 0.8 4 0.5 4Z"
+            id="A"
+        />
+        <path
+            d="M 14 4L 11 1L 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 17C 0 17.5 0.4 18 1 18L 14 18C 14.5 18 15 17.6 15 17L 15 5L 14 4ZM 12.6 4L 11 4L 11 2.4L 12.6 4ZM 1 17L 1 1L 10 1L 10 5L 14 5L 14 17L 1 17Z"
+            id="B"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 15 18"
     width="15"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1106 1522)"
+        transform="translate(-1106 1522)"
     >
-      <g>
         <g>
-          <use
-            fill="#FFF"
-            transform="translate(1108 -1516)"
-            xlinkHref="#z"
-          />
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(1108 -1516)"
+                    xlinkHref="#z"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(1110 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(1112 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(1114 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(1116 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(1106 -1522)"
+                    xlinkHref="#B"
+                />
+            </g>
         </g>
-        <g>
-          <use
-            fill="#FFF"
-            transform="translate(1110 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#FFF"
-            transform="translate(1112 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#FFF"
-            transform="translate(1114 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#FFF"
-            transform="translate(1116 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#FFF"
-            transform="translate(1106 -1522)"
-            xlinkHref="#B"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 10 1L 10 7L 1 7L 1 1L 10 1ZM 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 7C 0 7.5 0.4 8 1 8L 10 8C 10.5 8 11 7.6 11 7L 11 1C 11 0.4 10.6 0 10 0Z"
-        id="z"
-      />
-      <path
-        d="M 0.5 4C 0.2 4 0 3.8 0 3.5L 0 0.5C 0 0.2 0.2 0 0.5 0C 0.8 0 1 0.2 1 0.5L 1 3.5C 1 3.8 0.8 4 0.5 4Z"
-        id="A"
-      />
-      <path
-        d="M 14 4L 11 1L 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 17C 0 17.5 0.4 18 1 18L 14 18C 14.5 18 15 17.6 15 17L 15 5L 14 4ZM 12.6 4L 11 4L 11 2.4L 12.6 4ZM 1 17L 1 1L 10 1L 10 5L 14 5L 14 17L 1 17Z"
-        id="B"
-      />
+        <path
+            d="M 10 1L 10 7L 1 7L 1 1L 10 1ZM 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 7C 0 7.5 0.4 8 1 8L 10 8C 10.5 8 11 7.6 11 7L 11 1C 11 0.4 10.6 0 10 0Z"
+            id="z"
+        />
+        <path
+            d="M 0.5 4C 0.2 4 0 3.8 0 3.5L 0 0.5C 0 0.2 0.2 0 0.5 0C 0.8 0 1 0.2 1 0.5L 1 3.5C 1 3.8 0.8 4 0.5 4Z"
+            id="A"
+        />
+        <path
+            d="M 14 4L 11 1L 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 17C 0 17.5 0.4 18 1 18L 14 18C 14.5 18 15 17.6 15 17L 15 5L 14 4ZM 12.6 4L 11 4L 11 2.4L 12.6 4ZM 1 17L 1 1L 10 1L 10 5L 14 5L 14 17L 1 17Z"
+            id="B"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 15 18"
     width="15"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1106 1522)"
+        transform="translate(-1106 1522)"
     >
-      <g>
         <g>
-          <use
-            fill={true}
-            transform="translate(1108 -1516)"
-            xlinkHref="#z"
-          />
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(1108 -1516)"
+                    xlinkHref="#z"
+                />
+            </g>
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(1110 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(1112 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(1114 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(1116 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(1106 -1522)"
+                    xlinkHref="#B"
+                />
+            </g>
         </g>
-        <g>
-          <use
-            fill={true}
-            transform="translate(1110 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill={true}
-            transform="translate(1112 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill={true}
-            transform="translate(1114 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill={true}
-            transform="translate(1116 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill={true}
-            transform="translate(1106 -1522)"
-            xlinkHref="#B"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 10 1L 10 7L 1 7L 1 1L 10 1ZM 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 7C 0 7.5 0.4 8 1 8L 10 8C 10.5 8 11 7.6 11 7L 11 1C 11 0.4 10.6 0 10 0Z"
-        id="z"
-      />
-      <path
-        d="M 0.5 4C 0.2 4 0 3.8 0 3.5L 0 0.5C 0 0.2 0.2 0 0.5 0C 0.8 0 1 0.2 1 0.5L 1 3.5C 1 3.8 0.8 4 0.5 4Z"
-        id="A"
-      />
-      <path
-        d="M 14 4L 11 1L 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 17C 0 17.5 0.4 18 1 18L 14 18C 14.5 18 15 17.6 15 17L 15 5L 14 4ZM 12.6 4L 11 4L 11 2.4L 12.6 4ZM 1 17L 1 1L 10 1L 10 5L 14 5L 14 17L 1 17Z"
-        id="B"
-      />
+        <path
+            d="M 10 1L 10 7L 1 7L 1 1L 10 1ZM 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 7C 0 7.5 0.4 8 1 8L 10 8C 10.5 8 11 7.6 11 7L 11 1C 11 0.4 10.6 0 10 0Z"
+            id="z"
+        />
+        <path
+            d="M 0.5 4C 0.2 4 0 3.8 0 3.5L 0 0.5C 0 0.2 0.2 0 0.5 0C 0.8 0 1 0.2 1 0.5L 1 3.5C 1 3.8 0.8 4 0.5 4Z"
+            id="A"
+        />
+        <path
+            d="M 14 4L 11 1L 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 17C 0 17.5 0.4 18 1 18L 14 18C 14.5 18 15 17.6 15 17L 15 5L 14 4ZM 12.6 4L 11 4L 11 2.4L 12.6 4ZM 1 17L 1 1L 10 1L 10 5L 14 5L 14 17L 1 17Z"
+            id="B"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 15 18"
     width="15"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1106 1522)"
+        transform="translate(-1106 1522)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1108 -1516)"
-            xlinkHref="#z"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1108 -1516)"
+                    xlinkHref="#z"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1110 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1112 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1114 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1116 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1106 -1522)"
+                    xlinkHref="#B"
+                />
+            </g>
         </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1110 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1112 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1114 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1116 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1106 -1522)"
-            xlinkHref="#B"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 10 1L 10 7L 1 7L 1 1L 10 1ZM 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 7C 0 7.5 0.4 8 1 8L 10 8C 10.5 8 11 7.6 11 7L 11 1C 11 0.4 10.6 0 10 0Z"
-        id="z"
-      />
-      <path
-        d="M 0.5 4C 0.2 4 0 3.8 0 3.5L 0 0.5C 0 0.2 0.2 0 0.5 0C 0.8 0 1 0.2 1 0.5L 1 3.5C 1 3.8 0.8 4 0.5 4Z"
-        id="A"
-      />
-      <path
-        d="M 14 4L 11 1L 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 17C 0 17.5 0.4 18 1 18L 14 18C 14.5 18 15 17.6 15 17L 15 5L 14 4ZM 12.6 4L 11 4L 11 2.4L 12.6 4ZM 1 17L 1 1L 10 1L 10 5L 14 5L 14 17L 1 17Z"
-        id="B"
-      />
+        <path
+            d="M 10 1L 10 7L 1 7L 1 1L 10 1ZM 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 7C 0 7.5 0.4 8 1 8L 10 8C 10.5 8 11 7.6 11 7L 11 1C 11 0.4 10.6 0 10 0Z"
+            id="z"
+        />
+        <path
+            d="M 0.5 4C 0.2 4 0 3.8 0 3.5L 0 0.5C 0 0.2 0.2 0 0.5 0C 0.8 0 1 0.2 1 0.5L 1 3.5C 1 3.8 0.8 4 0.5 4Z"
+            id="A"
+        />
+        <path
+            d="M 14 4L 11 1L 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 17C 0 17.5 0.4 18 1 18L 14 18C 14.5 18 15 17.6 15 17L 15 5L 14 4ZM 12.6 4L 11 4L 11 2.4L 12.6 4ZM 1 17L 1 1L 10 1L 10 5L 14 5L 14 17L 1 17Z"
+            id="B"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 15 18"
     width="15"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1106 1522)"
+        transform="translate(-1106 1522)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1108 -1516)"
-            xlinkHref="#z"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1108 -1516)"
+                    xlinkHref="#z"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1110 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1112 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1114 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1116 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1106 -1522)"
+                    xlinkHref="#B"
+                />
+            </g>
         </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1110 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1112 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1114 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1116 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1106 -1522)"
-            xlinkHref="#B"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 10 1L 10 7L 1 7L 1 1L 10 1ZM 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 7C 0 7.5 0.4 8 1 8L 10 8C 10.5 8 11 7.6 11 7L 11 1C 11 0.4 10.6 0 10 0Z"
-        id="z"
-      />
-      <path
-        d="M 0.5 4C 0.2 4 0 3.8 0 3.5L 0 0.5C 0 0.2 0.2 0 0.5 0C 0.8 0 1 0.2 1 0.5L 1 3.5C 1 3.8 0.8 4 0.5 4Z"
-        id="A"
-      />
-      <path
-        d="M 14 4L 11 1L 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 17C 0 17.5 0.4 18 1 18L 14 18C 14.5 18 15 17.6 15 17L 15 5L 14 4ZM 12.6 4L 11 4L 11 2.4L 12.6 4ZM 1 17L 1 1L 10 1L 10 5L 14 5L 14 17L 1 17Z"
-        id="B"
-      />
+        <path
+            d="M 10 1L 10 7L 1 7L 1 1L 10 1ZM 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 7C 0 7.5 0.4 8 1 8L 10 8C 10.5 8 11 7.6 11 7L 11 1C 11 0.4 10.6 0 10 0Z"
+            id="z"
+        />
+        <path
+            d="M 0.5 4C 0.2 4 0 3.8 0 3.5L 0 0.5C 0 0.2 0.2 0 0.5 0C 0.8 0 1 0.2 1 0.5L 1 3.5C 1 3.8 0.8 4 0.5 4Z"
+            id="A"
+        />
+        <path
+            d="M 14 4L 11 1L 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 17C 0 17.5 0.4 18 1 18L 14 18C 14.5 18 15 17.6 15 17L 15 5L 14 4ZM 12.6 4L 11 4L 11 2.4L 12.6 4ZM 1 17L 1 1L 10 1L 10 5L 14 5L 14 17L 1 17Z"
+            id="B"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 15 18"
     width="15"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1106 1522)"
+        transform="translate(-1106 1522)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1108 -1516)"
-            xlinkHref="#z"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1108 -1516)"
+                    xlinkHref="#z"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1110 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1112 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1114 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1116 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1106 -1522)"
+                    xlinkHref="#B"
+                />
+            </g>
         </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1110 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1112 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1114 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1116 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1106 -1522)"
-            xlinkHref="#B"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 10 1L 10 7L 1 7L 1 1L 10 1ZM 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 7C 0 7.5 0.4 8 1 8L 10 8C 10.5 8 11 7.6 11 7L 11 1C 11 0.4 10.6 0 10 0Z"
-        id="z"
-      />
-      <path
-        d="M 0.5 4C 0.2 4 0 3.8 0 3.5L 0 0.5C 0 0.2 0.2 0 0.5 0C 0.8 0 1 0.2 1 0.5L 1 3.5C 1 3.8 0.8 4 0.5 4Z"
-        id="A"
-      />
-      <path
-        d="M 14 4L 11 1L 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 17C 0 17.5 0.4 18 1 18L 14 18C 14.5 18 15 17.6 15 17L 15 5L 14 4ZM 12.6 4L 11 4L 11 2.4L 12.6 4ZM 1 17L 1 1L 10 1L 10 5L 14 5L 14 17L 1 17Z"
-        id="B"
-      />
+        <path
+            d="M 10 1L 10 7L 1 7L 1 1L 10 1ZM 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 7C 0 7.5 0.4 8 1 8L 10 8C 10.5 8 11 7.6 11 7L 11 1C 11 0.4 10.6 0 10 0Z"
+            id="z"
+        />
+        <path
+            d="M 0.5 4C 0.2 4 0 3.8 0 3.5L 0 0.5C 0 0.2 0.2 0 0.5 0C 0.8 0 1 0.2 1 0.5L 1 3.5C 1 3.8 0.8 4 0.5 4Z"
+            id="A"
+        />
+        <path
+            d="M 14 4L 11 1L 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 17C 0 17.5 0.4 18 1 18L 14 18C 14.5 18 15 17.6 15 17L 15 5L 14 4ZM 12.6 4L 11 4L 11 2.4L 12.6 4ZM 1 17L 1 1L 10 1L 10 5L 14 5L 14 17L 1 17Z"
+            id="B"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 15 18"
     width="15"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1106 1522)"
+        transform="translate(-1106 1522)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1108 -1516)"
-            xlinkHref="#z"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1108 -1516)"
+                    xlinkHref="#z"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1110 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1112 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1114 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1116 -1514)"
+                    xlinkHref="#A"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1106 -1522)"
+                    xlinkHref="#B"
+                />
+            </g>
         </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1110 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1112 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1114 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1116 -1514)"
-            xlinkHref="#A"
-          />
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1106 -1522)"
-            xlinkHref="#B"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 10 1L 10 7L 1 7L 1 1L 10 1ZM 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 7C 0 7.5 0.4 8 1 8L 10 8C 10.5 8 11 7.6 11 7L 11 1C 11 0.4 10.6 0 10 0Z"
-        id="z"
-      />
-      <path
-        d="M 0.5 4C 0.2 4 0 3.8 0 3.5L 0 0.5C 0 0.2 0.2 0 0.5 0C 0.8 0 1 0.2 1 0.5L 1 3.5C 1 3.8 0.8 4 0.5 4Z"
-        id="A"
-      />
-      <path
-        d="M 14 4L 11 1L 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 17C 0 17.5 0.4 18 1 18L 14 18C 14.5 18 15 17.6 15 17L 15 5L 14 4ZM 12.6 4L 11 4L 11 2.4L 12.6 4ZM 1 17L 1 1L 10 1L 10 5L 14 5L 14 17L 1 17Z"
-        id="B"
-      />
+        <path
+            d="M 10 1L 10 7L 1 7L 1 1L 10 1ZM 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 7C 0 7.5 0.4 8 1 8L 10 8C 10.5 8 11 7.6 11 7L 11 1C 11 0.4 10.6 0 10 0Z"
+            id="z"
+        />
+        <path
+            d="M 0.5 4C 0.2 4 0 3.8 0 3.5L 0 0.5C 0 0.2 0.2 0 0.5 0C 0.8 0 1 0.2 1 0.5L 1 3.5C 1 3.8 0.8 4 0.5 4Z"
+            id="A"
+        />
+        <path
+            d="M 14 4L 11 1L 10 0L 1 0C 0.5 0 0 0.4 0 1L 0 17C 0 17.5 0.4 18 1 18L 14 18C 14.5 18 15 17.6 15 17L 15 5L 14 4ZM 12.6 4L 11 4L 11 2.4L 12.6 4ZM 1 17L 1 1L 10 1L 10 5L 14 5L 14 17L 1 17Z"
+            id="B"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Instances /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="9"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 18 9"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M4.5 0a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9m8.59 0c-.375 0-.739.047-1.09.12 2.184.456 3.818 2.239 3.818 4.38S14.184 8.424 12 8.88c.351.073.715.12 1.09.12C15.803 9 18 6.985 18 4.5S15.802 0 13.09 0M14 4.5C14 6.985 11.802 9 9.09 9c-.375 0-.739-.047-1.09-.12 2.184-.456 3.818-2.239 3.818-4.38S10.184.576 8 .12C8.351.047 8.715 0 9.09 0 11.803 0 14 2.015 14 4.5"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M4.5 0a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9m8.59 0c-.375 0-.739.047-1.09.12 2.184.456 3.818 2.239 3.818 4.38S14.184 8.424 12 8.88c.351.073.715.12 1.09.12C15.803 9 18 6.985 18 4.5S15.802 0 13.09 0M14 4.5C14 6.985 11.802 9 9.09 9c-.375 0-.739-.047-1.09-.12 2.184-.456 3.818-2.239 3.818-4.38S10.184.576 8 .12C8.351.047 8.715 0 9.09 0 11.803 0 14 2.015 14 4.5"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="9"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 18 9"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M4.5 0a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9m8.59 0c-.375 0-.739.047-1.09.12 2.184.456 3.818 2.239 3.818 4.38S14.184 8.424 12 8.88c.351.073.715.12 1.09.12C15.803 9 18 6.985 18 4.5S15.802 0 13.09 0M14 4.5C14 6.985 11.802 9 9.09 9c-.375 0-.739-.047-1.09-.12 2.184-.456 3.818-2.239 3.818-4.38S10.184.576 8 .12C8.351.047 8.715 0 9.09 0 11.803 0 14 2.015 14 4.5"
-      fill="#FFF"
-      fillRule="evenodd"
+        d="M4.5 0a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9m8.59 0c-.375 0-.739.047-1.09.12 2.184.456 3.818 2.239 3.818 4.38S14.184 8.424 12 8.88c.351.073.715.12 1.09.12C15.803 9 18 6.985 18 4.5S15.802 0 13.09 0M14 4.5C14 6.985 11.802 9 9.09 9c-.375 0-.739-.047-1.09-.12 2.184-.456 3.818-2.239 3.818-4.38S10.184.576 8 .12C8.351.047 8.715 0 9.09 0 11.803 0 14 2.015 14 4.5"
+        fill="#FFF"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="9"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 18 9"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M4.5 0a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9m8.59 0c-.375 0-.739.047-1.09.12 2.184.456 3.818 2.239 3.818 4.38S14.184 8.424 12 8.88c.351.073.715.12 1.09.12C15.803 9 18 6.985 18 4.5S15.802 0 13.09 0M14 4.5C14 6.985 11.802 9 9.09 9c-.375 0-.739-.047-1.09-.12 2.184-.456 3.818-2.239 3.818-4.38S10.184.576 8 .12C8.351.047 8.715 0 9.09 0 11.803 0 14 2.015 14 4.5"
-      fill={true}
-      fillRule="evenodd"
+        d="M4.5 0a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9m8.59 0c-.375 0-.739.047-1.09.12 2.184.456 3.818 2.239 3.818 4.38S14.184 8.424 12 8.88c.351.073.715.12 1.09.12C15.803 9 18 6.985 18 4.5S15.802 0 13.09 0M14 4.5C14 6.985 11.802 9 9.09 9c-.375 0-.739-.047-1.09-.12 2.184-.456 3.818-2.239 3.818-4.38S10.184.576 8 .12C8.351.047 8.715 0 9.09 0 11.803 0 14 2.015 14 4.5"
+        fill={undefined}
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="9"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 18 9"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M4.5 0a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9m8.59 0c-.375 0-.739.047-1.09.12 2.184.456 3.818 2.239 3.818 4.38S14.184 8.424 12 8.88c.351.073.715.12 1.09.12C15.803 9 18 6.985 18 4.5S15.802 0 13.09 0M14 4.5C14 6.985 11.802 9 9.09 9c-.375 0-.739-.047-1.09-.12 2.184-.456 3.818-2.239 3.818-4.38S10.184.576 8 .12C8.351.047 8.715 0 9.09 0 11.803 0 14 2.015 14 4.5"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M4.5 0a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9m8.59 0c-.375 0-.739.047-1.09.12 2.184.456 3.818 2.239 3.818 4.38S14.184 8.424 12 8.88c.351.073.715.12 1.09.12C15.803 9 18 6.985 18 4.5S15.802 0 13.09 0M14 4.5C14 6.985 11.802 9 9.09 9c-.375 0-.739-.047-1.09-.12 2.184-.456 3.818-2.239 3.818-4.38S10.184.576 8 .12C8.351.047 8.715 0 9.09 0 11.803 0 14 2.015 14 4.5"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="9"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 18 9"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M4.5 0a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9m8.59 0c-.375 0-.739.047-1.09.12 2.184.456 3.818 2.239 3.818 4.38S14.184 8.424 12 8.88c.351.073.715.12 1.09.12C15.803 9 18 6.985 18 4.5S15.802 0 13.09 0M14 4.5C14 6.985 11.802 9 9.09 9c-.375 0-.739-.047-1.09-.12 2.184-.456 3.818-2.239 3.818-4.38S10.184.576 8 .12C8.351.047 8.715 0 9.09 0 11.803 0 14 2.015 14 4.5"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M4.5 0a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9m8.59 0c-.375 0-.739.047-1.09.12 2.184.456 3.818 2.239 3.818 4.38S14.184 8.424 12 8.88c.351.073.715.12 1.09.12C15.803 9 18 6.985 18 4.5S15.802 0 13.09 0M14 4.5C14 6.985 11.802 9 9.09 9c-.375 0-.739-.047-1.09-.12 2.184-.456 3.818-2.239 3.818-4.38S10.184.576 8 .12C8.351.047 8.715 0 9.09 0 11.803 0 14 2.015 14 4.5"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="9"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 18 9"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M4.5 0a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9m8.59 0c-.375 0-.739.047-1.09.12 2.184.456 3.818 2.239 3.818 4.38S14.184 8.424 12 8.88c.351.073.715.12 1.09.12C15.803 9 18 6.985 18 4.5S15.802 0 13.09 0M14 4.5C14 6.985 11.802 9 9.09 9c-.375 0-.739-.047-1.09-.12 2.184-.456 3.818-2.239 3.818-4.38S10.184.576 8 .12C8.351.047 8.715 0 9.09 0 11.803 0 14 2.015 14 4.5"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M4.5 0a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9m8.59 0c-.375 0-.739.047-1.09.12 2.184.456 3.818 2.239 3.818 4.38S14.184 8.424 12 8.88c.351.073.715.12 1.09.12C15.803 9 18 6.985 18 4.5S15.802 0 13.09 0M14 4.5C14 6.985 11.802 9 9.09 9c-.375 0-.739-.047-1.09-.12 2.184-.456 3.818-2.239 3.818-4.38S10.184.576 8 .12C8.351.047 8.715 0 9.09 0 11.803 0 14 2.015 14 4.5"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="9"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 18 9"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M4.5 0a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9m8.59 0c-.375 0-.739.047-1.09.12 2.184.456 3.818 2.239 3.818 4.38S14.184 8.424 12 8.88c.351.073.715.12 1.09.12C15.803 9 18 6.985 18 4.5S15.802 0 13.09 0M14 4.5C14 6.985 11.802 9 9.09 9c-.375 0-.739-.047-1.09-.12 2.184-.456 3.818-2.239 3.818-4.38S10.184.576 8 .12C8.351.047 8.715 0 9.09 0 11.803 0 14 2.015 14 4.5"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M4.5 0a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9m8.59 0c-.375 0-.739.047-1.09.12 2.184.456 3.818 2.239 3.818 4.38S14.184 8.424 12 8.88c.351.073.715.12 1.09.12C15.803 9 18 6.985 18 4.5S15.802 0 13.09 0M14 4.5C14 6.985 11.802 9 9.09 9c-.375 0-.739-.047-1.09-.12 2.184-.456 3.818-2.239 3.818-4.38S10.184.576 8 .12C8.351.047 8.715 0 9.09 0 11.803 0 14 2.015 14 4.5"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Loading /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="6"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 24 6"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <use
-      fill="#3b46cc"
-      xlinkHref="#C"
+        fill="#3b46cc"
+        xlinkHref="#C"
     />
     <use
-      fill="#3b46cc"
-      opacity=".5"
-      transform="translate(9)"
-      xlinkHref="#C"
+        fill="#3b46cc"
+        opacity=".5"
+        transform="translate(9)"
+        xlinkHref="#C"
     />
     <use
-      fill="#3b46cc"
-      opacity=".25"
-      transform="translate(18)"
-      xlinkHref="#C"
+        fill="#3b46cc"
+        opacity=".25"
+        transform="translate(18)"
+        xlinkHref="#C"
     />
     <defs>
-      <path
-        d="M0 0h6v6H0V0z"
-        fillRule="evenodd"
-        id="C"
-      />
+        <path
+            d="M0 0h6v6H0V0z"
+            fillRule="evenodd"
+            id="C"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="6"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 24 6"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <use
-      fill="#FFF"
-      xlinkHref="#C"
+        fill="#FFF"
+        xlinkHref="#C"
     />
     <use
-      fill="#FFF"
-      opacity=".5"
-      transform="translate(9)"
-      xlinkHref="#C"
+        fill="#FFF"
+        opacity=".5"
+        transform="translate(9)"
+        xlinkHref="#C"
     />
     <use
-      fill="#FFF"
-      opacity=".25"
-      transform="translate(18)"
-      xlinkHref="#C"
+        fill="#FFF"
+        opacity=".25"
+        transform="translate(18)"
+        xlinkHref="#C"
     />
     <defs>
-      <path
-        d="M0 0h6v6H0V0z"
-        fillRule="evenodd"
-        id="C"
-      />
+        <path
+            d="M0 0h6v6H0V0z"
+            fillRule="evenodd"
+            id="C"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="6"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 24 6"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <use
-      fill={true}
-      xlinkHref="#C"
+        fill={undefined}
+        xlinkHref="#C"
     />
     <use
-      fill={true}
-      opacity=".5"
-      transform="translate(9)"
-      xlinkHref="#C"
+        fill={undefined}
+        opacity=".5"
+        transform="translate(9)"
+        xlinkHref="#C"
     />
     <use
-      fill={true}
-      opacity=".25"
-      transform="translate(18)"
-      xlinkHref="#C"
+        fill={undefined}
+        opacity=".25"
+        transform="translate(18)"
+        xlinkHref="#C"
     />
     <defs>
-      <path
-        d="M0 0h6v6H0V0z"
-        fillRule="evenodd"
-        id="C"
-      />
+        <path
+            d="M0 0h6v6H0V0z"
+            fillRule="evenodd"
+            id="C"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="6"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 24 6"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <use
-      fill="#3b46cc"
-      xlinkHref="#C"
+        fill="#3b46cc"
+        xlinkHref="#C"
     />
     <use
-      fill="#3b46cc"
-      opacity=".5"
-      transform="translate(9)"
-      xlinkHref="#C"
+        fill="#3b46cc"
+        opacity=".5"
+        transform="translate(9)"
+        xlinkHref="#C"
     />
     <use
-      fill="#3b46cc"
-      opacity=".25"
-      transform="translate(18)"
-      xlinkHref="#C"
+        fill="#3b46cc"
+        opacity=".25"
+        transform="translate(18)"
+        xlinkHref="#C"
     />
     <defs>
-      <path
-        d="M0 0h6v6H0V0z"
-        fillRule="evenodd"
-        id="C"
-      />
+        <path
+            d="M0 0h6v6H0V0z"
+            fillRule="evenodd"
+            id="C"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="6"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 24 6"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <use
-      fill="#3b46cc"
-      xlinkHref="#C"
+        fill="#3b46cc"
+        xlinkHref="#C"
     />
     <use
-      fill="#3b46cc"
-      opacity=".5"
-      transform="translate(9)"
-      xlinkHref="#C"
+        fill="#3b46cc"
+        opacity=".5"
+        transform="translate(9)"
+        xlinkHref="#C"
     />
     <use
-      fill="#3b46cc"
-      opacity=".25"
-      transform="translate(18)"
-      xlinkHref="#C"
+        fill="#3b46cc"
+        opacity=".25"
+        transform="translate(18)"
+        xlinkHref="#C"
     />
     <defs>
-      <path
-        d="M0 0h6v6H0V0z"
-        fillRule="evenodd"
-        id="C"
-      />
+        <path
+            d="M0 0h6v6H0V0z"
+            fillRule="evenodd"
+            id="C"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="6"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 24 6"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <use
-      fill="#3b46cc"
-      xlinkHref="#C"
+        fill="#3b46cc"
+        xlinkHref="#C"
     />
     <use
-      fill="#3b46cc"
-      opacity=".5"
-      transform="translate(9)"
-      xlinkHref="#C"
+        fill="#3b46cc"
+        opacity=".5"
+        transform="translate(9)"
+        xlinkHref="#C"
     />
     <use
-      fill="#3b46cc"
-      opacity=".25"
-      transform="translate(18)"
-      xlinkHref="#C"
+        fill="#3b46cc"
+        opacity=".25"
+        transform="translate(18)"
+        xlinkHref="#C"
     />
     <defs>
-      <path
-        d="M0 0h6v6H0V0z"
-        fillRule="evenodd"
-        id="C"
-      />
+        <path
+            d="M0 0h6v6H0V0z"
+            fillRule="evenodd"
+            id="C"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="6"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 24 6"
     width="24"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <use
-      fill="#3b46cc"
-      xlinkHref="#C"
+        fill="#3b46cc"
+        xlinkHref="#C"
     />
     <use
-      fill="#3b46cc"
-      opacity=".5"
-      transform="translate(9)"
-      xlinkHref="#C"
+        fill="#3b46cc"
+        opacity=".5"
+        transform="translate(9)"
+        xlinkHref="#C"
     />
     <use
-      fill="#3b46cc"
-      opacity=".25"
-      transform="translate(18)"
-      xlinkHref="#C"
+        fill="#3b46cc"
+        opacity=".25"
+        transform="translate(18)"
+        xlinkHref="#C"
     />
     <defs>
-      <path
-        d="M0 0h6v6H0V0z"
-        fillRule="evenodd"
-        id="C"
-      />
+        <path
+            d="M0 0h6v6H0V0z"
+            fillRule="evenodd"
+            id="C"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Login /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 17"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1885 179)"
+        transform="translate(-1885 179)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1889 -179)"
-            xlinkHref="#D"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1889 -179)"
+                    xlinkHref="#D"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1885 -175)"
+                    xlinkHref="#E"
+                />
+            </g>
         </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1885 -175)"
-            xlinkHref="#E"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 12 1.00001L 12 16L 1 16L 1 11L 0 11L 0 16C 0 16.6 0.4 17 1 17L 12 17C 12.6 17 13 16.6 13 16L 13 1.00001C 13 0.400006 12.6 6.10352e-06 12 6.10352e-06L 1 6.10352e-06C 0.4 6.10352e-06 0 0.400006 0 1.00001L 0 6.00001L 1 6.00001L 1 1.00001L 12 1.00001Z"
-        id="D"
-      />
-      <path
-        d="M 13.7 4.29999L 13.2 3.9L 8.7 6.10352e-06L 8 0.599997L 11.9 4.00001L 0 4.00001L 0 5.00001L 11.9 5.00001L 8 8.4L 8.7 9.00001L 13.9 4.50001L 13.7 4.29999Z"
-        id="E"
-      />
+        <path
+            d="M 12 1.00001L 12 16L 1 16L 1 11L 0 11L 0 16C 0 16.6 0.4 17 1 17L 12 17C 12.6 17 13 16.6 13 16L 13 1.00001C 13 0.400006 12.6 6.10352e-06 12 6.10352e-06L 1 6.10352e-06C 0.4 6.10352e-06 0 0.400006 0 1.00001L 0 6.00001L 1 6.00001L 1 1.00001L 12 1.00001Z"
+            id="D"
+        />
+        <path
+            d="M 13.7 4.29999L 13.2 3.9L 8.7 6.10352e-06L 8 0.599997L 11.9 4.00001L 0 4.00001L 0 5.00001L 11.9 5.00001L 8 8.4L 8.7 9.00001L 13.9 4.50001L 13.7 4.29999Z"
+            id="E"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 17"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1885 179)"
+        transform="translate(-1885 179)"
     >
-      <g>
         <g>
-          <use
-            fill="#FFF"
-            transform="translate(1889 -179)"
-            xlinkHref="#D"
-          />
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(1889 -179)"
+                    xlinkHref="#D"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(1885 -175)"
+                    xlinkHref="#E"
+                />
+            </g>
         </g>
-        <g>
-          <use
-            fill="#FFF"
-            transform="translate(1885 -175)"
-            xlinkHref="#E"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 12 1.00001L 12 16L 1 16L 1 11L 0 11L 0 16C 0 16.6 0.4 17 1 17L 12 17C 12.6 17 13 16.6 13 16L 13 1.00001C 13 0.400006 12.6 6.10352e-06 12 6.10352e-06L 1 6.10352e-06C 0.4 6.10352e-06 0 0.400006 0 1.00001L 0 6.00001L 1 6.00001L 1 1.00001L 12 1.00001Z"
-        id="D"
-      />
-      <path
-        d="M 13.7 4.29999L 13.2 3.9L 8.7 6.10352e-06L 8 0.599997L 11.9 4.00001L 0 4.00001L 0 5.00001L 11.9 5.00001L 8 8.4L 8.7 9.00001L 13.9 4.50001L 13.7 4.29999Z"
-        id="E"
-      />
+        <path
+            d="M 12 1.00001L 12 16L 1 16L 1 11L 0 11L 0 16C 0 16.6 0.4 17 1 17L 12 17C 12.6 17 13 16.6 13 16L 13 1.00001C 13 0.400006 12.6 6.10352e-06 12 6.10352e-06L 1 6.10352e-06C 0.4 6.10352e-06 0 0.400006 0 1.00001L 0 6.00001L 1 6.00001L 1 1.00001L 12 1.00001Z"
+            id="D"
+        />
+        <path
+            d="M 13.7 4.29999L 13.2 3.9L 8.7 6.10352e-06L 8 0.599997L 11.9 4.00001L 0 4.00001L 0 5.00001L 11.9 5.00001L 8 8.4L 8.7 9.00001L 13.9 4.50001L 13.7 4.29999Z"
+            id="E"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 17"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1885 179)"
+        transform="translate(-1885 179)"
     >
-      <g>
         <g>
-          <use
-            fill={true}
-            transform="translate(1889 -179)"
-            xlinkHref="#D"
-          />
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(1889 -179)"
+                    xlinkHref="#D"
+                />
+            </g>
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(1885 -175)"
+                    xlinkHref="#E"
+                />
+            </g>
         </g>
-        <g>
-          <use
-            fill={true}
-            transform="translate(1885 -175)"
-            xlinkHref="#E"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 12 1.00001L 12 16L 1 16L 1 11L 0 11L 0 16C 0 16.6 0.4 17 1 17L 12 17C 12.6 17 13 16.6 13 16L 13 1.00001C 13 0.400006 12.6 6.10352e-06 12 6.10352e-06L 1 6.10352e-06C 0.4 6.10352e-06 0 0.400006 0 1.00001L 0 6.00001L 1 6.00001L 1 1.00001L 12 1.00001Z"
-        id="D"
-      />
-      <path
-        d="M 13.7 4.29999L 13.2 3.9L 8.7 6.10352e-06L 8 0.599997L 11.9 4.00001L 0 4.00001L 0 5.00001L 11.9 5.00001L 8 8.4L 8.7 9.00001L 13.9 4.50001L 13.7 4.29999Z"
-        id="E"
-      />
+        <path
+            d="M 12 1.00001L 12 16L 1 16L 1 11L 0 11L 0 16C 0 16.6 0.4 17 1 17L 12 17C 12.6 17 13 16.6 13 16L 13 1.00001C 13 0.400006 12.6 6.10352e-06 12 6.10352e-06L 1 6.10352e-06C 0.4 6.10352e-06 0 0.400006 0 1.00001L 0 6.00001L 1 6.00001L 1 1.00001L 12 1.00001Z"
+            id="D"
+        />
+        <path
+            d="M 13.7 4.29999L 13.2 3.9L 8.7 6.10352e-06L 8 0.599997L 11.9 4.00001L 0 4.00001L 0 5.00001L 11.9 5.00001L 8 8.4L 8.7 9.00001L 13.9 4.50001L 13.7 4.29999Z"
+            id="E"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 17"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1885 179)"
+        transform="translate(-1885 179)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1889 -179)"
-            xlinkHref="#D"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1889 -179)"
+                    xlinkHref="#D"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1885 -175)"
+                    xlinkHref="#E"
+                />
+            </g>
         </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1885 -175)"
-            xlinkHref="#E"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 12 1.00001L 12 16L 1 16L 1 11L 0 11L 0 16C 0 16.6 0.4 17 1 17L 12 17C 12.6 17 13 16.6 13 16L 13 1.00001C 13 0.400006 12.6 6.10352e-06 12 6.10352e-06L 1 6.10352e-06C 0.4 6.10352e-06 0 0.400006 0 1.00001L 0 6.00001L 1 6.00001L 1 1.00001L 12 1.00001Z"
-        id="D"
-      />
-      <path
-        d="M 13.7 4.29999L 13.2 3.9L 8.7 6.10352e-06L 8 0.599997L 11.9 4.00001L 0 4.00001L 0 5.00001L 11.9 5.00001L 8 8.4L 8.7 9.00001L 13.9 4.50001L 13.7 4.29999Z"
-        id="E"
-      />
+        <path
+            d="M 12 1.00001L 12 16L 1 16L 1 11L 0 11L 0 16C 0 16.6 0.4 17 1 17L 12 17C 12.6 17 13 16.6 13 16L 13 1.00001C 13 0.400006 12.6 6.10352e-06 12 6.10352e-06L 1 6.10352e-06C 0.4 6.10352e-06 0 0.400006 0 1.00001L 0 6.00001L 1 6.00001L 1 1.00001L 12 1.00001Z"
+            id="D"
+        />
+        <path
+            d="M 13.7 4.29999L 13.2 3.9L 8.7 6.10352e-06L 8 0.599997L 11.9 4.00001L 0 4.00001L 0 5.00001L 11.9 5.00001L 8 8.4L 8.7 9.00001L 13.9 4.50001L 13.7 4.29999Z"
+            id="E"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 17"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1885 179)"
+        transform="translate(-1885 179)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1889 -179)"
-            xlinkHref="#D"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1889 -179)"
+                    xlinkHref="#D"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1885 -175)"
+                    xlinkHref="#E"
+                />
+            </g>
         </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1885 -175)"
-            xlinkHref="#E"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 12 1.00001L 12 16L 1 16L 1 11L 0 11L 0 16C 0 16.6 0.4 17 1 17L 12 17C 12.6 17 13 16.6 13 16L 13 1.00001C 13 0.400006 12.6 6.10352e-06 12 6.10352e-06L 1 6.10352e-06C 0.4 6.10352e-06 0 0.400006 0 1.00001L 0 6.00001L 1 6.00001L 1 1.00001L 12 1.00001Z"
-        id="D"
-      />
-      <path
-        d="M 13.7 4.29999L 13.2 3.9L 8.7 6.10352e-06L 8 0.599997L 11.9 4.00001L 0 4.00001L 0 5.00001L 11.9 5.00001L 8 8.4L 8.7 9.00001L 13.9 4.50001L 13.7 4.29999Z"
-        id="E"
-      />
+        <path
+            d="M 12 1.00001L 12 16L 1 16L 1 11L 0 11L 0 16C 0 16.6 0.4 17 1 17L 12 17C 12.6 17 13 16.6 13 16L 13 1.00001C 13 0.400006 12.6 6.10352e-06 12 6.10352e-06L 1 6.10352e-06C 0.4 6.10352e-06 0 0.400006 0 1.00001L 0 6.00001L 1 6.00001L 1 1.00001L 12 1.00001Z"
+            id="D"
+        />
+        <path
+            d="M 13.7 4.29999L 13.2 3.9L 8.7 6.10352e-06L 8 0.599997L 11.9 4.00001L 0 4.00001L 0 5.00001L 11.9 5.00001L 8 8.4L 8.7 9.00001L 13.9 4.50001L 13.7 4.29999Z"
+            id="E"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 17"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1885 179)"
+        transform="translate(-1885 179)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1889 -179)"
-            xlinkHref="#D"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1889 -179)"
+                    xlinkHref="#D"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1885 -175)"
+                    xlinkHref="#E"
+                />
+            </g>
         </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1885 -175)"
-            xlinkHref="#E"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 12 1.00001L 12 16L 1 16L 1 11L 0 11L 0 16C 0 16.6 0.4 17 1 17L 12 17C 12.6 17 13 16.6 13 16L 13 1.00001C 13 0.400006 12.6 6.10352e-06 12 6.10352e-06L 1 6.10352e-06C 0.4 6.10352e-06 0 0.400006 0 1.00001L 0 6.00001L 1 6.00001L 1 1.00001L 12 1.00001Z"
-        id="D"
-      />
-      <path
-        d="M 13.7 4.29999L 13.2 3.9L 8.7 6.10352e-06L 8 0.599997L 11.9 4.00001L 0 4.00001L 0 5.00001L 11.9 5.00001L 8 8.4L 8.7 9.00001L 13.9 4.50001L 13.7 4.29999Z"
-        id="E"
-      />
+        <path
+            d="M 12 1.00001L 12 16L 1 16L 1 11L 0 11L 0 16C 0 16.6 0.4 17 1 17L 12 17C 12.6 17 13 16.6 13 16L 13 1.00001C 13 0.400006 12.6 6.10352e-06 12 6.10352e-06L 1 6.10352e-06C 0.4 6.10352e-06 0 0.400006 0 1.00001L 0 6.00001L 1 6.00001L 1 1.00001L 12 1.00001Z"
+            id="D"
+        />
+        <path
+            d="M 13.7 4.29999L 13.2 3.9L 8.7 6.10352e-06L 8 0.599997L 11.9 4.00001L 0 4.00001L 0 5.00001L 11.9 5.00001L 8 8.4L 8.7 9.00001L 13.9 4.50001L 13.7 4.29999Z"
+            id="E"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 17"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1885 179)"
+        transform="translate(-1885 179)"
     >
-      <g>
         <g>
-          <use
-            fill="#464646"
-            transform="translate(1889 -179)"
-            xlinkHref="#D"
-          />
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1889 -179)"
+                    xlinkHref="#D"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1885 -175)"
+                    xlinkHref="#E"
+                />
+            </g>
         </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1885 -175)"
-            xlinkHref="#E"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 12 1.00001L 12 16L 1 16L 1 11L 0 11L 0 16C 0 16.6 0.4 17 1 17L 12 17C 12.6 17 13 16.6 13 16L 13 1.00001C 13 0.400006 12.6 6.10352e-06 12 6.10352e-06L 1 6.10352e-06C 0.4 6.10352e-06 0 0.400006 0 1.00001L 0 6.00001L 1 6.00001L 1 1.00001L 12 1.00001Z"
-        id="D"
-      />
-      <path
-        d="M 13.7 4.29999L 13.2 3.9L 8.7 6.10352e-06L 8 0.599997L 11.9 4.00001L 0 4.00001L 0 5.00001L 11.9 5.00001L 8 8.4L 8.7 9.00001L 13.9 4.50001L 13.7 4.29999Z"
-        id="E"
-      />
+        <path
+            d="M 12 1.00001L 12 16L 1 16L 1 11L 0 11L 0 16C 0 16.6 0.4 17 1 17L 12 17C 12.6 17 13 16.6 13 16L 13 1.00001C 13 0.400006 12.6 6.10352e-06 12 6.10352e-06L 1 6.10352e-06C 0.4 6.10352e-06 0 0.400006 0 1.00001L 0 6.00001L 1 6.00001L 1 1.00001L 12 1.00001Z"
+            id="D"
+        />
+        <path
+            d="M 13.7 4.29999L 13.2 3.9L 8.7 6.10352e-06L 8 0.599997L 11.9 4.00001L 0 4.00001L 0 5.00001L 11.9 5.00001L 8 8.4L 8.7 9.00001L 13.9 4.50001L 13.7 4.29999Z"
+            id="E"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Memory /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="21.68"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 21.68 21.68"
     width="21.68"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M6.24,11.9,8.36,14l1.42-1.41L7.66,10.49ZM4.12,14l2.12,2.12,1.42-1.41L5.54,12.6ZM8.36,9.78l2.13,2.12,1.41-1.41L9.78,8.36Zm2.13-2.12,2.12,2.12L14,8.36,11.9,6.24Zm2.12-2.13,2.12,2.13,1.41-1.42L14,4.12Zm8.48,0L16.14.59a2,2,0,0,0-2.83,0L.59,13.31a2,2,0,0,0,0,2.83l5,4.95a2,2,0,0,0,2.82,0l1.42-1.41.71.7A1,1,0,0,0,11.9,19l-.71-.71.71-.7.71.7A1,1,0,0,0,14,16.85l-.71-.71.71-.71.71.71a1,1,0,0,0,1.41-1.41L15.43,14l.71-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71.7-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71,1.41-1.42A2,2,0,0,0,21.09,5.54ZM7,19.68,2,14.73,14.73,2l4.95,5Z"
-      fill="#464646"
+        d="M6.24,11.9,8.36,14l1.42-1.41L7.66,10.49ZM4.12,14l2.12,2.12,1.42-1.41L5.54,12.6ZM8.36,9.78l2.13,2.12,1.41-1.41L9.78,8.36Zm2.13-2.12,2.12,2.12L14,8.36,11.9,6.24Zm2.12-2.13,2.12,2.13,1.41-1.42L14,4.12Zm8.48,0L16.14.59a2,2,0,0,0-2.83,0L.59,13.31a2,2,0,0,0,0,2.83l5,4.95a2,2,0,0,0,2.82,0l1.42-1.41.71.7A1,1,0,0,0,11.9,19l-.71-.71.71-.7.71.7A1,1,0,0,0,14,16.85l-.71-.71.71-.71.71.71a1,1,0,0,0,1.41-1.41L15.43,14l.71-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71.7-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71,1.41-1.42A2,2,0,0,0,21.09,5.54ZM7,19.68,2,14.73,14.73,2l4.95,5Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="21.68"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 21.68 21.68"
     width="21.68"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M6.24,11.9,8.36,14l1.42-1.41L7.66,10.49ZM4.12,14l2.12,2.12,1.42-1.41L5.54,12.6ZM8.36,9.78l2.13,2.12,1.41-1.41L9.78,8.36Zm2.13-2.12,2.12,2.12L14,8.36,11.9,6.24Zm2.12-2.13,2.12,2.13,1.41-1.42L14,4.12Zm8.48,0L16.14.59a2,2,0,0,0-2.83,0L.59,13.31a2,2,0,0,0,0,2.83l5,4.95a2,2,0,0,0,2.82,0l1.42-1.41.71.7A1,1,0,0,0,11.9,19l-.71-.71.71-.7.71.7A1,1,0,0,0,14,16.85l-.71-.71.71-.71.71.71a1,1,0,0,0,1.41-1.41L15.43,14l.71-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71.7-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71,1.41-1.42A2,2,0,0,0,21.09,5.54ZM7,19.68,2,14.73,14.73,2l4.95,5Z"
-      fill="#FFF"
+        d="M6.24,11.9,8.36,14l1.42-1.41L7.66,10.49ZM4.12,14l2.12,2.12,1.42-1.41L5.54,12.6ZM8.36,9.78l2.13,2.12,1.41-1.41L9.78,8.36Zm2.13-2.12,2.12,2.12L14,8.36,11.9,6.24Zm2.12-2.13,2.12,2.13,1.41-1.42L14,4.12Zm8.48,0L16.14.59a2,2,0,0,0-2.83,0L.59,13.31a2,2,0,0,0,0,2.83l5,4.95a2,2,0,0,0,2.82,0l1.42-1.41.71.7A1,1,0,0,0,11.9,19l-.71-.71.71-.7.71.7A1,1,0,0,0,14,16.85l-.71-.71.71-.71.71.71a1,1,0,0,0,1.41-1.41L15.43,14l.71-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71.7-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71,1.41-1.42A2,2,0,0,0,21.09,5.54ZM7,19.68,2,14.73,14.73,2l4.95,5Z"
+        fill="#FFF"
     />
-  </svg>
+</svg>,
   <svg
     height="21.68"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 21.68 21.68"
     width="21.68"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M6.24,11.9,8.36,14l1.42-1.41L7.66,10.49ZM4.12,14l2.12,2.12,1.42-1.41L5.54,12.6ZM8.36,9.78l2.13,2.12,1.41-1.41L9.78,8.36Zm2.13-2.12,2.12,2.12L14,8.36,11.9,6.24Zm2.12-2.13,2.12,2.13,1.41-1.42L14,4.12Zm8.48,0L16.14.59a2,2,0,0,0-2.83,0L.59,13.31a2,2,0,0,0,0,2.83l5,4.95a2,2,0,0,0,2.82,0l1.42-1.41.71.7A1,1,0,0,0,11.9,19l-.71-.71.71-.7.71.7A1,1,0,0,0,14,16.85l-.71-.71.71-.71.71.71a1,1,0,0,0,1.41-1.41L15.43,14l.71-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71.7-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71,1.41-1.42A2,2,0,0,0,21.09,5.54ZM7,19.68,2,14.73,14.73,2l4.95,5Z"
-      fill={true}
+        d="M6.24,11.9,8.36,14l1.42-1.41L7.66,10.49ZM4.12,14l2.12,2.12,1.42-1.41L5.54,12.6ZM8.36,9.78l2.13,2.12,1.41-1.41L9.78,8.36Zm2.13-2.12,2.12,2.12L14,8.36,11.9,6.24Zm2.12-2.13,2.12,2.13,1.41-1.42L14,4.12Zm8.48,0L16.14.59a2,2,0,0,0-2.83,0L.59,13.31a2,2,0,0,0,0,2.83l5,4.95a2,2,0,0,0,2.82,0l1.42-1.41.71.7A1,1,0,0,0,11.9,19l-.71-.71.71-.7.71.7A1,1,0,0,0,14,16.85l-.71-.71.71-.71.71.71a1,1,0,0,0,1.41-1.41L15.43,14l.71-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71.7-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71,1.41-1.42A2,2,0,0,0,21.09,5.54ZM7,19.68,2,14.73,14.73,2l4.95,5Z"
+        fill={undefined}
     />
-  </svg>
+</svg>,
   <svg
     height="21.68"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 21.68 21.68"
     width="21.68"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M6.24,11.9,8.36,14l1.42-1.41L7.66,10.49ZM4.12,14l2.12,2.12,1.42-1.41L5.54,12.6ZM8.36,9.78l2.13,2.12,1.41-1.41L9.78,8.36Zm2.13-2.12,2.12,2.12L14,8.36,11.9,6.24Zm2.12-2.13,2.12,2.13,1.41-1.42L14,4.12Zm8.48,0L16.14.59a2,2,0,0,0-2.83,0L.59,13.31a2,2,0,0,0,0,2.83l5,4.95a2,2,0,0,0,2.82,0l1.42-1.41.71.7A1,1,0,0,0,11.9,19l-.71-.71.71-.7.71.7A1,1,0,0,0,14,16.85l-.71-.71.71-.71.71.71a1,1,0,0,0,1.41-1.41L15.43,14l.71-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71.7-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71,1.41-1.42A2,2,0,0,0,21.09,5.54ZM7,19.68,2,14.73,14.73,2l4.95,5Z"
-      fill="#464646"
+        d="M6.24,11.9,8.36,14l1.42-1.41L7.66,10.49ZM4.12,14l2.12,2.12,1.42-1.41L5.54,12.6ZM8.36,9.78l2.13,2.12,1.41-1.41L9.78,8.36Zm2.13-2.12,2.12,2.12L14,8.36,11.9,6.24Zm2.12-2.13,2.12,2.13,1.41-1.42L14,4.12Zm8.48,0L16.14.59a2,2,0,0,0-2.83,0L.59,13.31a2,2,0,0,0,0,2.83l5,4.95a2,2,0,0,0,2.82,0l1.42-1.41.71.7A1,1,0,0,0,11.9,19l-.71-.71.71-.7.71.7A1,1,0,0,0,14,16.85l-.71-.71.71-.71.71.71a1,1,0,0,0,1.41-1.41L15.43,14l.71-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71.7-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71,1.41-1.42A2,2,0,0,0,21.09,5.54ZM7,19.68,2,14.73,14.73,2l4.95,5Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="21.68"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 21.68 21.68"
     width="21.68"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M6.24,11.9,8.36,14l1.42-1.41L7.66,10.49ZM4.12,14l2.12,2.12,1.42-1.41L5.54,12.6ZM8.36,9.78l2.13,2.12,1.41-1.41L9.78,8.36Zm2.13-2.12,2.12,2.12L14,8.36,11.9,6.24Zm2.12-2.13,2.12,2.13,1.41-1.42L14,4.12Zm8.48,0L16.14.59a2,2,0,0,0-2.83,0L.59,13.31a2,2,0,0,0,0,2.83l5,4.95a2,2,0,0,0,2.82,0l1.42-1.41.71.7A1,1,0,0,0,11.9,19l-.71-.71.71-.7.71.7A1,1,0,0,0,14,16.85l-.71-.71.71-.71.71.71a1,1,0,0,0,1.41-1.41L15.43,14l.71-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71.7-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71,1.41-1.42A2,2,0,0,0,21.09,5.54ZM7,19.68,2,14.73,14.73,2l4.95,5Z"
-      fill="#464646"
+        d="M6.24,11.9,8.36,14l1.42-1.41L7.66,10.49ZM4.12,14l2.12,2.12,1.42-1.41L5.54,12.6ZM8.36,9.78l2.13,2.12,1.41-1.41L9.78,8.36Zm2.13-2.12,2.12,2.12L14,8.36,11.9,6.24Zm2.12-2.13,2.12,2.13,1.41-1.42L14,4.12Zm8.48,0L16.14.59a2,2,0,0,0-2.83,0L.59,13.31a2,2,0,0,0,0,2.83l5,4.95a2,2,0,0,0,2.82,0l1.42-1.41.71.7A1,1,0,0,0,11.9,19l-.71-.71.71-.7.71.7A1,1,0,0,0,14,16.85l-.71-.71.71-.71.71.71a1,1,0,0,0,1.41-1.41L15.43,14l.71-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71.7-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71,1.41-1.42A2,2,0,0,0,21.09,5.54ZM7,19.68,2,14.73,14.73,2l4.95,5Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="21.68"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 21.68 21.68"
     width="21.68"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M6.24,11.9,8.36,14l1.42-1.41L7.66,10.49ZM4.12,14l2.12,2.12,1.42-1.41L5.54,12.6ZM8.36,9.78l2.13,2.12,1.41-1.41L9.78,8.36Zm2.13-2.12,2.12,2.12L14,8.36,11.9,6.24Zm2.12-2.13,2.12,2.13,1.41-1.42L14,4.12Zm8.48,0L16.14.59a2,2,0,0,0-2.83,0L.59,13.31a2,2,0,0,0,0,2.83l5,4.95a2,2,0,0,0,2.82,0l1.42-1.41.71.7A1,1,0,0,0,11.9,19l-.71-.71.71-.7.71.7A1,1,0,0,0,14,16.85l-.71-.71.71-.71.71.71a1,1,0,0,0,1.41-1.41L15.43,14l.71-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71.7-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71,1.41-1.42A2,2,0,0,0,21.09,5.54ZM7,19.68,2,14.73,14.73,2l4.95,5Z"
-      fill="#464646"
+        d="M6.24,11.9,8.36,14l1.42-1.41L7.66,10.49ZM4.12,14l2.12,2.12,1.42-1.41L5.54,12.6ZM8.36,9.78l2.13,2.12,1.41-1.41L9.78,8.36Zm2.13-2.12,2.12,2.12L14,8.36,11.9,6.24Zm2.12-2.13,2.12,2.13,1.41-1.42L14,4.12Zm8.48,0L16.14.59a2,2,0,0,0-2.83,0L.59,13.31a2,2,0,0,0,0,2.83l5,4.95a2,2,0,0,0,2.82,0l1.42-1.41.71.7A1,1,0,0,0,11.9,19l-.71-.71.71-.7.71.7A1,1,0,0,0,14,16.85l-.71-.71.71-.71.71.71a1,1,0,0,0,1.41-1.41L15.43,14l.71-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71.7-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71,1.41-1.42A2,2,0,0,0,21.09,5.54ZM7,19.68,2,14.73,14.73,2l4.95,5Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="21.68"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 21.68 21.68"
     width="21.68"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M6.24,11.9,8.36,14l1.42-1.41L7.66,10.49ZM4.12,14l2.12,2.12,1.42-1.41L5.54,12.6ZM8.36,9.78l2.13,2.12,1.41-1.41L9.78,8.36Zm2.13-2.12,2.12,2.12L14,8.36,11.9,6.24Zm2.12-2.13,2.12,2.13,1.41-1.42L14,4.12Zm8.48,0L16.14.59a2,2,0,0,0-2.83,0L.59,13.31a2,2,0,0,0,0,2.83l5,4.95a2,2,0,0,0,2.82,0l1.42-1.41.71.7A1,1,0,0,0,11.9,19l-.71-.71.71-.7.71.7A1,1,0,0,0,14,16.85l-.71-.71.71-.71.71.71a1,1,0,0,0,1.41-1.41L15.43,14l.71-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71.7-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71,1.41-1.42A2,2,0,0,0,21.09,5.54ZM7,19.68,2,14.73,14.73,2l4.95,5Z"
-      fill="#464646"
+        d="M6.24,11.9,8.36,14l1.42-1.41L7.66,10.49ZM4.12,14l2.12,2.12,1.42-1.41L5.54,12.6ZM8.36,9.78l2.13,2.12,1.41-1.41L9.78,8.36Zm2.13-2.12,2.12,2.12L14,8.36,11.9,6.24Zm2.12-2.13,2.12,2.13,1.41-1.42L14,4.12Zm8.48,0L16.14.59a2,2,0,0,0-2.83,0L.59,13.31a2,2,0,0,0,0,2.83l5,4.95a2,2,0,0,0,2.82,0l1.42-1.41.71.7A1,1,0,0,0,11.9,19l-.71-.71.71-.7.71.7A1,1,0,0,0,14,16.85l-.71-.71.71-.71.71.71a1,1,0,0,0,1.41-1.41L15.43,14l.71-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71.7-.71.71.71a1,1,0,0,0,1.41-1.41l-.7-.71,1.41-1.42A2,2,0,0,0,21.09,5.54ZM7,19.68,2,14.73,14.73,2l4.95,5Z"
+        fill="#464646"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Metadata /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="11"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 11"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1884 1236)"
+        transform="translate(-1884 1236)"
     >
-      <g>
         <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1884 -1233.9)"
-              xlinkHref="#F"
-            />
-          </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1884 -1233.9)"
+                        xlinkHref="#F"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1896 -1233.9)"
+                        xlinkHref="#G"
+                    />
+                </g>
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1891 -1236)"
+                    xlinkHref="#H"
+                />
+            </g>
         </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1896 -1233.9)"
-              xlinkHref="#G"
-            />
-          </g>
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1891 -1236)"
-            xlinkHref="#H"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 5.5 6.79999L 0 3.4L 5.5 6.10352e-06L 6 0.799994L 1.9 3.4L 6 6.00001L 5.5 6.79999Z"
-        id="F"
-      />
-      <path
-        d="M 0.5 6.79999L 0 6.00001L 4.1 3.4L 0 0.799994L 0.5 6.10352e-06L 6 3.4L 0.5 6.79999Z"
-        id="G"
-      />
-      <path
-        d="M 1 11L 0 11L 3 0L 4 0L 1 11Z"
-        id="H"
-      />
+        <path
+            d="M 5.5 6.79999L 0 3.4L 5.5 6.10352e-06L 6 0.799994L 1.9 3.4L 6 6.00001L 5.5 6.79999Z"
+            id="F"
+        />
+        <path
+            d="M 0.5 6.79999L 0 6.00001L 4.1 3.4L 0 0.799994L 0.5 6.10352e-06L 6 3.4L 0.5 6.79999Z"
+            id="G"
+        />
+        <path
+            d="M 1 11L 0 11L 3 0L 4 0L 1 11Z"
+            id="H"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="11"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 11"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1884 1236)"
+        transform="translate(-1884 1236)"
     >
-      <g>
         <g>
-          <g>
-            <use
-              fill="#FFF"
-              transform="translate(1884 -1233.9)"
-              xlinkHref="#F"
-            />
-          </g>
+            <g>
+                <g>
+                    <use
+                        fill="#FFF"
+                        transform="translate(1884 -1233.9)"
+                        xlinkHref="#F"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#FFF"
+                        transform="translate(1896 -1233.9)"
+                        xlinkHref="#G"
+                    />
+                </g>
+            </g>
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(1891 -1236)"
+                    xlinkHref="#H"
+                />
+            </g>
         </g>
-        <g>
-          <g>
-            <use
-              fill="#FFF"
-              transform="translate(1896 -1233.9)"
-              xlinkHref="#G"
-            />
-          </g>
-        </g>
-        <g>
-          <use
-            fill="#FFF"
-            transform="translate(1891 -1236)"
-            xlinkHref="#H"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 5.5 6.79999L 0 3.4L 5.5 6.10352e-06L 6 0.799994L 1.9 3.4L 6 6.00001L 5.5 6.79999Z"
-        id="F"
-      />
-      <path
-        d="M 0.5 6.79999L 0 6.00001L 4.1 3.4L 0 0.799994L 0.5 6.10352e-06L 6 3.4L 0.5 6.79999Z"
-        id="G"
-      />
-      <path
-        d="M 1 11L 0 11L 3 0L 4 0L 1 11Z"
-        id="H"
-      />
+        <path
+            d="M 5.5 6.79999L 0 3.4L 5.5 6.10352e-06L 6 0.799994L 1.9 3.4L 6 6.00001L 5.5 6.79999Z"
+            id="F"
+        />
+        <path
+            d="M 0.5 6.79999L 0 6.00001L 4.1 3.4L 0 0.799994L 0.5 6.10352e-06L 6 3.4L 0.5 6.79999Z"
+            id="G"
+        />
+        <path
+            d="M 1 11L 0 11L 3 0L 4 0L 1 11Z"
+            id="H"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="11"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 11"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1884 1236)"
+        transform="translate(-1884 1236)"
     >
-      <g>
         <g>
-          <g>
-            <use
-              fill={true}
-              transform="translate(1884 -1233.9)"
-              xlinkHref="#F"
-            />
-          </g>
+            <g>
+                <g>
+                    <use
+                        fill={undefined}
+                        transform="translate(1884 -1233.9)"
+                        xlinkHref="#F"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill={undefined}
+                        transform="translate(1896 -1233.9)"
+                        xlinkHref="#G"
+                    />
+                </g>
+            </g>
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(1891 -1236)"
+                    xlinkHref="#H"
+                />
+            </g>
         </g>
-        <g>
-          <g>
-            <use
-              fill={true}
-              transform="translate(1896 -1233.9)"
-              xlinkHref="#G"
-            />
-          </g>
-        </g>
-        <g>
-          <use
-            fill={true}
-            transform="translate(1891 -1236)"
-            xlinkHref="#H"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 5.5 6.79999L 0 3.4L 5.5 6.10352e-06L 6 0.799994L 1.9 3.4L 6 6.00001L 5.5 6.79999Z"
-        id="F"
-      />
-      <path
-        d="M 0.5 6.79999L 0 6.00001L 4.1 3.4L 0 0.799994L 0.5 6.10352e-06L 6 3.4L 0.5 6.79999Z"
-        id="G"
-      />
-      <path
-        d="M 1 11L 0 11L 3 0L 4 0L 1 11Z"
-        id="H"
-      />
+        <path
+            d="M 5.5 6.79999L 0 3.4L 5.5 6.10352e-06L 6 0.799994L 1.9 3.4L 6 6.00001L 5.5 6.79999Z"
+            id="F"
+        />
+        <path
+            d="M 0.5 6.79999L 0 6.00001L 4.1 3.4L 0 0.799994L 0.5 6.10352e-06L 6 3.4L 0.5 6.79999Z"
+            id="G"
+        />
+        <path
+            d="M 1 11L 0 11L 3 0L 4 0L 1 11Z"
+            id="H"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="11"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 11"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1884 1236)"
+        transform="translate(-1884 1236)"
     >
-      <g>
         <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1884 -1233.9)"
-              xlinkHref="#F"
-            />
-          </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1884 -1233.9)"
+                        xlinkHref="#F"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1896 -1233.9)"
+                        xlinkHref="#G"
+                    />
+                </g>
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1891 -1236)"
+                    xlinkHref="#H"
+                />
+            </g>
         </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1896 -1233.9)"
-              xlinkHref="#G"
-            />
-          </g>
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1891 -1236)"
-            xlinkHref="#H"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 5.5 6.79999L 0 3.4L 5.5 6.10352e-06L 6 0.799994L 1.9 3.4L 6 6.00001L 5.5 6.79999Z"
-        id="F"
-      />
-      <path
-        d="M 0.5 6.79999L 0 6.00001L 4.1 3.4L 0 0.799994L 0.5 6.10352e-06L 6 3.4L 0.5 6.79999Z"
-        id="G"
-      />
-      <path
-        d="M 1 11L 0 11L 3 0L 4 0L 1 11Z"
-        id="H"
-      />
+        <path
+            d="M 5.5 6.79999L 0 3.4L 5.5 6.10352e-06L 6 0.799994L 1.9 3.4L 6 6.00001L 5.5 6.79999Z"
+            id="F"
+        />
+        <path
+            d="M 0.5 6.79999L 0 6.00001L 4.1 3.4L 0 0.799994L 0.5 6.10352e-06L 6 3.4L 0.5 6.79999Z"
+            id="G"
+        />
+        <path
+            d="M 1 11L 0 11L 3 0L 4 0L 1 11Z"
+            id="H"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="11"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 11"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1884 1236)"
+        transform="translate(-1884 1236)"
     >
-      <g>
         <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1884 -1233.9)"
-              xlinkHref="#F"
-            />
-          </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1884 -1233.9)"
+                        xlinkHref="#F"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1896 -1233.9)"
+                        xlinkHref="#G"
+                    />
+                </g>
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1891 -1236)"
+                    xlinkHref="#H"
+                />
+            </g>
         </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1896 -1233.9)"
-              xlinkHref="#G"
-            />
-          </g>
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1891 -1236)"
-            xlinkHref="#H"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 5.5 6.79999L 0 3.4L 5.5 6.10352e-06L 6 0.799994L 1.9 3.4L 6 6.00001L 5.5 6.79999Z"
-        id="F"
-      />
-      <path
-        d="M 0.5 6.79999L 0 6.00001L 4.1 3.4L 0 0.799994L 0.5 6.10352e-06L 6 3.4L 0.5 6.79999Z"
-        id="G"
-      />
-      <path
-        d="M 1 11L 0 11L 3 0L 4 0L 1 11Z"
-        id="H"
-      />
+        <path
+            d="M 5.5 6.79999L 0 3.4L 5.5 6.10352e-06L 6 0.799994L 1.9 3.4L 6 6.00001L 5.5 6.79999Z"
+            id="F"
+        />
+        <path
+            d="M 0.5 6.79999L 0 6.00001L 4.1 3.4L 0 0.799994L 0.5 6.10352e-06L 6 3.4L 0.5 6.79999Z"
+            id="G"
+        />
+        <path
+            d="M 1 11L 0 11L 3 0L 4 0L 1 11Z"
+            id="H"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="11"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 11"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1884 1236)"
+        transform="translate(-1884 1236)"
     >
-      <g>
         <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1884 -1233.9)"
-              xlinkHref="#F"
-            />
-          </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1884 -1233.9)"
+                        xlinkHref="#F"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1896 -1233.9)"
+                        xlinkHref="#G"
+                    />
+                </g>
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1891 -1236)"
+                    xlinkHref="#H"
+                />
+            </g>
         </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1896 -1233.9)"
-              xlinkHref="#G"
-            />
-          </g>
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1891 -1236)"
-            xlinkHref="#H"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 5.5 6.79999L 0 3.4L 5.5 6.10352e-06L 6 0.799994L 1.9 3.4L 6 6.00001L 5.5 6.79999Z"
-        id="F"
-      />
-      <path
-        d="M 0.5 6.79999L 0 6.00001L 4.1 3.4L 0 0.799994L 0.5 6.10352e-06L 6 3.4L 0.5 6.79999Z"
-        id="G"
-      />
-      <path
-        d="M 1 11L 0 11L 3 0L 4 0L 1 11Z"
-        id="H"
-      />
+        <path
+            d="M 5.5 6.79999L 0 3.4L 5.5 6.10352e-06L 6 0.799994L 1.9 3.4L 6 6.00001L 5.5 6.79999Z"
+            id="F"
+        />
+        <path
+            d="M 0.5 6.79999L 0 6.00001L 4.1 3.4L 0 0.799994L 0.5 6.10352e-06L 6 3.4L 0.5 6.79999Z"
+            id="G"
+        />
+        <path
+            d="M 1 11L 0 11L 3 0L 4 0L 1 11Z"
+            id="H"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="11"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 11"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1884 1236)"
+        transform="translate(-1884 1236)"
     >
-      <g>
         <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1884 -1233.9)"
-              xlinkHref="#F"
-            />
-          </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1884 -1233.9)"
+                        xlinkHref="#F"
+                    />
+                </g>
+            </g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1896 -1233.9)"
+                        xlinkHref="#G"
+                    />
+                </g>
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1891 -1236)"
+                    xlinkHref="#H"
+                />
+            </g>
         </g>
-        <g>
-          <g>
-            <use
-              fill="#464646"
-              transform="translate(1896 -1233.9)"
-              xlinkHref="#G"
-            />
-          </g>
-        </g>
-        <g>
-          <use
-            fill="#464646"
-            transform="translate(1891 -1236)"
-            xlinkHref="#H"
-          />
-        </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 5.5 6.79999L 0 3.4L 5.5 6.10352e-06L 6 0.799994L 1.9 3.4L 6 6.00001L 5.5 6.79999Z"
-        id="F"
-      />
-      <path
-        d="M 0.5 6.79999L 0 6.00001L 4.1 3.4L 0 0.799994L 0.5 6.10352e-06L 6 3.4L 0.5 6.79999Z"
-        id="G"
-      />
-      <path
-        d="M 1 11L 0 11L 3 0L 4 0L 1 11Z"
-        id="H"
-      />
+        <path
+            d="M 5.5 6.79999L 0 3.4L 5.5 6.10352e-06L 6 0.799994L 1.9 3.4L 6 6.00001L 5.5 6.79999Z"
+            id="F"
+        />
+        <path
+            d="M 0.5 6.79999L 0 6.00001L 4.1 3.4L 0 0.799994L 0.5 6.10352e-06L 6 3.4L 0.5 6.79999Z"
+            id="G"
+        />
+        <path
+            d="M 1 11L 0 11L 3 0L 4 0L 1 11Z"
+            id="H"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Minus /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="2"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 8 2"
     width="8"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M0 0h8v2H0z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M0 0h8v2H0z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="2"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 8 2"
     width="8"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M0 0h8v2H0z"
-      fill="#FFF"
-      fillRule="evenodd"
+        d="M0 0h8v2H0z"
+        fill="#FFF"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="2"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 8 2"
     width="8"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M0 0h8v2H0z"
-      fill={true}
-      fillRule="evenodd"
+        d="M0 0h8v2H0z"
+        fill={undefined}
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="2"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 8 2"
     width="8"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M0 0h8v2H0z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M0 0h8v2H0z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="2"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 8 2"
     width="8"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M0 0h8v2H0z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M0 0h8v2H0z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="2"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 8 2"
     width="8"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M0 0h8v2H0z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M0 0h8v2H0z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="2"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 8 2"
     width="8"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M0 0h8v2H0z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M0 0h8v2H0z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Name /> without throwing 1`] = `
-<div>
-  <name />
-  <name
-    light={true}
-  />
-  <name
-    disabled={true}
-  />
-  <name
-    direction="right"
-  />
-  <name
-    direction="up"
-  />
-  <name
-    direction="left"
-  />
-  <name
-    direction="down"
-  />
-</div>
+Array [
+  <svg
+    height="17"
+    style={
+        Object {
+            "transform": "rotate(0deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 16.24 13.55"
+    width="17"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <path
+        d="M.24,13.55c-1-2,1.39-6.73,1.52-7C4.47,1.5,6.77-.55,9,.12a2.34,2.34,0,0,1,1.4,1.16c.54,1.06-.26,2.41-1.18,4-.55.91-1.69,3.42-1.78,3.67-.37,1-.88,2.35-.52,2.86.19.28.73.34,1.14.34s1-.77,1.31-1.49c.56-1.48,1.87-4.94,4.1-4.27,1.78.53,1.27,2.56.93,3.91s-.11,1.51-.1,1.52a2.21,2.21,0,0,0,1.95-.24v1c-1.41.73-2.11.72-2.74.21-.88-.71-.48-2.19-.33-2.75.38-1.52.47-2.3-.07-2.46-.73-.22-1.6,1-2.57,3.52-.4,1.1-1.26,2.3-2.48,2.3a2.48,2.48,0,0,1-2.17-.88c-.72-1.05-.14-2.62.38-4,.09-.23,1.3-2.91,1.87-3.87s2.11-3.06.49-3.29S5.18,2.83,2.87,7.16c-1.71,3.21-1.78,5.95-1.62,6.39Z"
+        fill="#464646"
+    />
+</svg>,
+  <svg
+    height="17"
+    style={
+        Object {
+            "transform": "rotate(0deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 16.24 13.55"
+    width="17"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <path
+        d="M.24,13.55c-1-2,1.39-6.73,1.52-7C4.47,1.5,6.77-.55,9,.12a2.34,2.34,0,0,1,1.4,1.16c.54,1.06-.26,2.41-1.18,4-.55.91-1.69,3.42-1.78,3.67-.37,1-.88,2.35-.52,2.86.19.28.73.34,1.14.34s1-.77,1.31-1.49c.56-1.48,1.87-4.94,4.1-4.27,1.78.53,1.27,2.56.93,3.91s-.11,1.51-.1,1.52a2.21,2.21,0,0,0,1.95-.24v1c-1.41.73-2.11.72-2.74.21-.88-.71-.48-2.19-.33-2.75.38-1.52.47-2.3-.07-2.46-.73-.22-1.6,1-2.57,3.52-.4,1.1-1.26,2.3-2.48,2.3a2.48,2.48,0,0,1-2.17-.88c-.72-1.05-.14-2.62.38-4,.09-.23,1.3-2.91,1.87-3.87s2.11-3.06.49-3.29S5.18,2.83,2.87,7.16c-1.71,3.21-1.78,5.95-1.62,6.39Z"
+        fill="#FFF"
+    />
+</svg>,
+  <svg
+    height="17"
+    style={
+        Object {
+            "transform": "rotate(0deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 16.24 13.55"
+    width="17"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <path
+        d="M.24,13.55c-1-2,1.39-6.73,1.52-7C4.47,1.5,6.77-.55,9,.12a2.34,2.34,0,0,1,1.4,1.16c.54,1.06-.26,2.41-1.18,4-.55.91-1.69,3.42-1.78,3.67-.37,1-.88,2.35-.52,2.86.19.28.73.34,1.14.34s1-.77,1.31-1.49c.56-1.48,1.87-4.94,4.1-4.27,1.78.53,1.27,2.56.93,3.91s-.11,1.51-.1,1.52a2.21,2.21,0,0,0,1.95-.24v1c-1.41.73-2.11.72-2.74.21-.88-.71-.48-2.19-.33-2.75.38-1.52.47-2.3-.07-2.46-.73-.22-1.6,1-2.57,3.52-.4,1.1-1.26,2.3-2.48,2.3a2.48,2.48,0,0,1-2.17-.88c-.72-1.05-.14-2.62.38-4,.09-.23,1.3-2.91,1.87-3.87s2.11-3.06.49-3.29S5.18,2.83,2.87,7.16c-1.71,3.21-1.78,5.95-1.62,6.39Z"
+        fill={undefined}
+    />
+</svg>,
+  <svg
+    height="17"
+    style={
+        Object {
+            "transform": "rotate(90deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 16.24 13.55"
+    width="17"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <path
+        d="M.24,13.55c-1-2,1.39-6.73,1.52-7C4.47,1.5,6.77-.55,9,.12a2.34,2.34,0,0,1,1.4,1.16c.54,1.06-.26,2.41-1.18,4-.55.91-1.69,3.42-1.78,3.67-.37,1-.88,2.35-.52,2.86.19.28.73.34,1.14.34s1-.77,1.31-1.49c.56-1.48,1.87-4.94,4.1-4.27,1.78.53,1.27,2.56.93,3.91s-.11,1.51-.1,1.52a2.21,2.21,0,0,0,1.95-.24v1c-1.41.73-2.11.72-2.74.21-.88-.71-.48-2.19-.33-2.75.38-1.52.47-2.3-.07-2.46-.73-.22-1.6,1-2.57,3.52-.4,1.1-1.26,2.3-2.48,2.3a2.48,2.48,0,0,1-2.17-.88c-.72-1.05-.14-2.62.38-4,.09-.23,1.3-2.91,1.87-3.87s2.11-3.06.49-3.29S5.18,2.83,2.87,7.16c-1.71,3.21-1.78,5.95-1.62,6.39Z"
+        fill="#464646"
+    />
+</svg>,
+  <svg
+    height="17"
+    style={
+        Object {
+            "transform": "rotate(180deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 16.24 13.55"
+    width="17"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <path
+        d="M.24,13.55c-1-2,1.39-6.73,1.52-7C4.47,1.5,6.77-.55,9,.12a2.34,2.34,0,0,1,1.4,1.16c.54,1.06-.26,2.41-1.18,4-.55.91-1.69,3.42-1.78,3.67-.37,1-.88,2.35-.52,2.86.19.28.73.34,1.14.34s1-.77,1.31-1.49c.56-1.48,1.87-4.94,4.1-4.27,1.78.53,1.27,2.56.93,3.91s-.11,1.51-.1,1.52a2.21,2.21,0,0,0,1.95-.24v1c-1.41.73-2.11.72-2.74.21-.88-.71-.48-2.19-.33-2.75.38-1.52.47-2.3-.07-2.46-.73-.22-1.6,1-2.57,3.52-.4,1.1-1.26,2.3-2.48,2.3a2.48,2.48,0,0,1-2.17-.88c-.72-1.05-.14-2.62.38-4,.09-.23,1.3-2.91,1.87-3.87s2.11-3.06.49-3.29S5.18,2.83,2.87,7.16c-1.71,3.21-1.78,5.95-1.62,6.39Z"
+        fill="#464646"
+    />
+</svg>,
+  <svg
+    height="17"
+    style={
+        Object {
+            "transform": "rotate(-90deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 16.24 13.55"
+    width="17"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <path
+        d="M.24,13.55c-1-2,1.39-6.73,1.52-7C4.47,1.5,6.77-.55,9,.12a2.34,2.34,0,0,1,1.4,1.16c.54,1.06-.26,2.41-1.18,4-.55.91-1.69,3.42-1.78,3.67-.37,1-.88,2.35-.52,2.86.19.28.73.34,1.14.34s1-.77,1.31-1.49c.56-1.48,1.87-4.94,4.1-4.27,1.78.53,1.27,2.56.93,3.91s-.11,1.51-.1,1.52a2.21,2.21,0,0,0,1.95-.24v1c-1.41.73-2.11.72-2.74.21-.88-.71-.48-2.19-.33-2.75.38-1.52.47-2.3-.07-2.46-.73-.22-1.6,1-2.57,3.52-.4,1.1-1.26,2.3-2.48,2.3a2.48,2.48,0,0,1-2.17-.88c-.72-1.05-.14-2.62.38-4,.09-.23,1.3-2.91,1.87-3.87s2.11-3.06.49-3.29S5.18,2.83,2.87,7.16c-1.71,3.21-1.78,5.95-1.62,6.39Z"
+        fill="#464646"
+    />
+</svg>,
+  <svg
+    height="17"
+    style={
+        Object {
+            "transform": "rotate(0deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 16.24 13.55"
+    width="17"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <path
+        d="M.24,13.55c-1-2,1.39-6.73,1.52-7C4.47,1.5,6.77-.55,9,.12a2.34,2.34,0,0,1,1.4,1.16c.54,1.06-.26,2.41-1.18,4-.55.91-1.69,3.42-1.78,3.67-.37,1-.88,2.35-.52,2.86.19.28.73.34,1.14.34s1-.77,1.31-1.49c.56-1.48,1.87-4.94,4.1-4.27,1.78.53,1.27,2.56.93,3.91s-.11,1.51-.1,1.52a2.21,2.21,0,0,0,1.95-.24v1c-1.41.73-2.11.72-2.74.21-.88-.71-.48-2.19-.33-2.75.38-1.52.47-2.3-.07-2.46-.73-.22-1.6,1-2.57,3.52-.4,1.1-1.26,2.3-2.48,2.3a2.48,2.48,0,0,1-2.17-.88c-.72-1.05-.14-2.62.38-4,.09-.23,1.3-2.91,1.87-3.87s2.11-3.06.49-3.29S5.18,2.83,2.87,7.16c-1.71,3.21-1.78,5.95-1.62,6.39Z"
+        fill="#464646"
+    />
+</svg>,
+]
 `;
 
 exports[`renders <Network /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1105 710)"
+        transform="translate(-1105 710)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(1105 -710)"
-          xlinkHref="#I"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(1105 -710)"
+                xlinkHref="#I"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 15.1685 5.96629C 14.5618 5.96629 13.9551 6.16854 13.4494 6.57303L 11.6292 4.75281C 11.9326 4.24719 12.236 3.64045 12.236 3.03371C 12.236 1.31461 10.9213 1.50686e-09 9.20225 1.50686e-09C 7.48314 1.50686e-09 6.16854 1.31461 6.16854 3.03371C 6.16854 3.64045 6.37078 4.24719 6.77528 4.75281L 4.95506 6.57303C 4.24719 6.16854 3.64045 5.96629 3.03371 5.96629C 1.31461 5.96629 0 7.2809 0 9C 0 10.7191 1.31461 12.0337 3.03371 12.0337C 3.64045 12.0337 4.24719 11.8315 4.75281 11.427L 6.57303 13.2472C 6.26966 13.7528 5.96629 14.3596 5.96629 14.9663C 5.96629 16.6854 7.2809 18 9 18C 10.7191 18 12.0337 16.6854 12.0337 14.9663C 12.0337 14.3596 11.8315 13.7528 11.427 13.2472L 13.2472 11.427C 13.7528 11.7303 14.3596 12.0337 14.9663 12.0337C 16.6854 12.0337 18 10.7191 18 9C 18 7.2809 16.8876 5.96629 15.1685 5.96629ZM 9.10112 12.0337C 8.49438 12.0337 7.88764 12.236 7.38203 12.6404L 5.5618 10.8202C 5.86517 10.3146 6.16854 9.70787 6.16854 9.10112C 6.16854 8.49438 5.96629 7.88764 5.5618 7.38202L 7.38203 5.5618C 7.88764 5.86517 8.49438 6.16854 9.10112 6.16854C 9.70787 6.16854 10.3146 5.96629 10.8202 5.5618L 12.6404 7.38202C 12.3371 7.78652 12.1348 8.39326 12.1348 9C 12.1348 9.60674 12.3371 10.2135 12.7416 10.7191L 10.9214 12.5393C 10.3146 12.236 9.70787 12.0337 9.10112 12.0337ZM 9.10112 0.910112C 10.2135 0.910112 11.1236 1.82022 11.1236 2.93258C 11.1236 4.04494 10.2135 4.95506 9.10112 4.95506C 7.98876 4.95506 7.07865 4.04494 7.07865 2.93258C 7.07865 1.82022 7.98876 0.910112 9.10112 0.910112ZM 1.01124 9C 1.01124 7.88764 1.92135 6.97753 3.03371 6.97753C 4.14607 6.97753 5.05618 7.88764 5.05618 9C 5.05618 10.1124 4.14607 11.0225 3.03371 11.0225C 1.92135 11.0225 1.01124 10.1124 1.01124 9ZM 9.10112 17.0899C 7.98876 17.0899 7.07865 16.1798 7.07865 15.0674C 7.07865 13.9551 7.98876 13.0449 9.10112 13.0449C 10.2135 13.0449 11.1236 13.9551 11.1236 15.0674C 11.1236 16.1798 10.2135 17.0899 9.10112 17.0899ZM 15.1685 11.0225C 14.0562 11.0225 13.1461 10.1124 13.1461 9C 13.1461 7.88764 14.0562 6.97753 15.1685 6.97753C 16.2809 6.97753 17.191 7.88764 17.191 9C 17.191 10.1124 16.2809 11.0225 15.1685 11.0225Z"
-        id="I"
-      />
+        <path
+            d="M 15.1685 5.96629C 14.5618 5.96629 13.9551 6.16854 13.4494 6.57303L 11.6292 4.75281C 11.9326 4.24719 12.236 3.64045 12.236 3.03371C 12.236 1.31461 10.9213 1.50686e-09 9.20225 1.50686e-09C 7.48314 1.50686e-09 6.16854 1.31461 6.16854 3.03371C 6.16854 3.64045 6.37078 4.24719 6.77528 4.75281L 4.95506 6.57303C 4.24719 6.16854 3.64045 5.96629 3.03371 5.96629C 1.31461 5.96629 0 7.2809 0 9C 0 10.7191 1.31461 12.0337 3.03371 12.0337C 3.64045 12.0337 4.24719 11.8315 4.75281 11.427L 6.57303 13.2472C 6.26966 13.7528 5.96629 14.3596 5.96629 14.9663C 5.96629 16.6854 7.2809 18 9 18C 10.7191 18 12.0337 16.6854 12.0337 14.9663C 12.0337 14.3596 11.8315 13.7528 11.427 13.2472L 13.2472 11.427C 13.7528 11.7303 14.3596 12.0337 14.9663 12.0337C 16.6854 12.0337 18 10.7191 18 9C 18 7.2809 16.8876 5.96629 15.1685 5.96629ZM 9.10112 12.0337C 8.49438 12.0337 7.88764 12.236 7.38203 12.6404L 5.5618 10.8202C 5.86517 10.3146 6.16854 9.70787 6.16854 9.10112C 6.16854 8.49438 5.96629 7.88764 5.5618 7.38202L 7.38203 5.5618C 7.88764 5.86517 8.49438 6.16854 9.10112 6.16854C 9.70787 6.16854 10.3146 5.96629 10.8202 5.5618L 12.6404 7.38202C 12.3371 7.78652 12.1348 8.39326 12.1348 9C 12.1348 9.60674 12.3371 10.2135 12.7416 10.7191L 10.9214 12.5393C 10.3146 12.236 9.70787 12.0337 9.10112 12.0337ZM 9.10112 0.910112C 10.2135 0.910112 11.1236 1.82022 11.1236 2.93258C 11.1236 4.04494 10.2135 4.95506 9.10112 4.95506C 7.98876 4.95506 7.07865 4.04494 7.07865 2.93258C 7.07865 1.82022 7.98876 0.910112 9.10112 0.910112ZM 1.01124 9C 1.01124 7.88764 1.92135 6.97753 3.03371 6.97753C 4.14607 6.97753 5.05618 7.88764 5.05618 9C 5.05618 10.1124 4.14607 11.0225 3.03371 11.0225C 1.92135 11.0225 1.01124 10.1124 1.01124 9ZM 9.10112 17.0899C 7.98876 17.0899 7.07865 16.1798 7.07865 15.0674C 7.07865 13.9551 7.98876 13.0449 9.10112 13.0449C 10.2135 13.0449 11.1236 13.9551 11.1236 15.0674C 11.1236 16.1798 10.2135 17.0899 9.10112 17.0899ZM 15.1685 11.0225C 14.0562 11.0225 13.1461 10.1124 13.1461 9C 13.1461 7.88764 14.0562 6.97753 15.1685 6.97753C 16.2809 6.97753 17.191 7.88764 17.191 9C 17.191 10.1124 16.2809 11.0225 15.1685 11.0225Z"
+            id="I"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1105 710)"
+        transform="translate(-1105 710)"
     >
-      <g>
-        <use
-          fill="#FFF"
-          transform="translate(1105 -710)"
-          xlinkHref="#I"
-        />
-      </g>
+        <g>
+            <use
+                fill="#FFF"
+                transform="translate(1105 -710)"
+                xlinkHref="#I"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 15.1685 5.96629C 14.5618 5.96629 13.9551 6.16854 13.4494 6.57303L 11.6292 4.75281C 11.9326 4.24719 12.236 3.64045 12.236 3.03371C 12.236 1.31461 10.9213 1.50686e-09 9.20225 1.50686e-09C 7.48314 1.50686e-09 6.16854 1.31461 6.16854 3.03371C 6.16854 3.64045 6.37078 4.24719 6.77528 4.75281L 4.95506 6.57303C 4.24719 6.16854 3.64045 5.96629 3.03371 5.96629C 1.31461 5.96629 0 7.2809 0 9C 0 10.7191 1.31461 12.0337 3.03371 12.0337C 3.64045 12.0337 4.24719 11.8315 4.75281 11.427L 6.57303 13.2472C 6.26966 13.7528 5.96629 14.3596 5.96629 14.9663C 5.96629 16.6854 7.2809 18 9 18C 10.7191 18 12.0337 16.6854 12.0337 14.9663C 12.0337 14.3596 11.8315 13.7528 11.427 13.2472L 13.2472 11.427C 13.7528 11.7303 14.3596 12.0337 14.9663 12.0337C 16.6854 12.0337 18 10.7191 18 9C 18 7.2809 16.8876 5.96629 15.1685 5.96629ZM 9.10112 12.0337C 8.49438 12.0337 7.88764 12.236 7.38203 12.6404L 5.5618 10.8202C 5.86517 10.3146 6.16854 9.70787 6.16854 9.10112C 6.16854 8.49438 5.96629 7.88764 5.5618 7.38202L 7.38203 5.5618C 7.88764 5.86517 8.49438 6.16854 9.10112 6.16854C 9.70787 6.16854 10.3146 5.96629 10.8202 5.5618L 12.6404 7.38202C 12.3371 7.78652 12.1348 8.39326 12.1348 9C 12.1348 9.60674 12.3371 10.2135 12.7416 10.7191L 10.9214 12.5393C 10.3146 12.236 9.70787 12.0337 9.10112 12.0337ZM 9.10112 0.910112C 10.2135 0.910112 11.1236 1.82022 11.1236 2.93258C 11.1236 4.04494 10.2135 4.95506 9.10112 4.95506C 7.98876 4.95506 7.07865 4.04494 7.07865 2.93258C 7.07865 1.82022 7.98876 0.910112 9.10112 0.910112ZM 1.01124 9C 1.01124 7.88764 1.92135 6.97753 3.03371 6.97753C 4.14607 6.97753 5.05618 7.88764 5.05618 9C 5.05618 10.1124 4.14607 11.0225 3.03371 11.0225C 1.92135 11.0225 1.01124 10.1124 1.01124 9ZM 9.10112 17.0899C 7.98876 17.0899 7.07865 16.1798 7.07865 15.0674C 7.07865 13.9551 7.98876 13.0449 9.10112 13.0449C 10.2135 13.0449 11.1236 13.9551 11.1236 15.0674C 11.1236 16.1798 10.2135 17.0899 9.10112 17.0899ZM 15.1685 11.0225C 14.0562 11.0225 13.1461 10.1124 13.1461 9C 13.1461 7.88764 14.0562 6.97753 15.1685 6.97753C 16.2809 6.97753 17.191 7.88764 17.191 9C 17.191 10.1124 16.2809 11.0225 15.1685 11.0225Z"
-        id="I"
-      />
+        <path
+            d="M 15.1685 5.96629C 14.5618 5.96629 13.9551 6.16854 13.4494 6.57303L 11.6292 4.75281C 11.9326 4.24719 12.236 3.64045 12.236 3.03371C 12.236 1.31461 10.9213 1.50686e-09 9.20225 1.50686e-09C 7.48314 1.50686e-09 6.16854 1.31461 6.16854 3.03371C 6.16854 3.64045 6.37078 4.24719 6.77528 4.75281L 4.95506 6.57303C 4.24719 6.16854 3.64045 5.96629 3.03371 5.96629C 1.31461 5.96629 0 7.2809 0 9C 0 10.7191 1.31461 12.0337 3.03371 12.0337C 3.64045 12.0337 4.24719 11.8315 4.75281 11.427L 6.57303 13.2472C 6.26966 13.7528 5.96629 14.3596 5.96629 14.9663C 5.96629 16.6854 7.2809 18 9 18C 10.7191 18 12.0337 16.6854 12.0337 14.9663C 12.0337 14.3596 11.8315 13.7528 11.427 13.2472L 13.2472 11.427C 13.7528 11.7303 14.3596 12.0337 14.9663 12.0337C 16.6854 12.0337 18 10.7191 18 9C 18 7.2809 16.8876 5.96629 15.1685 5.96629ZM 9.10112 12.0337C 8.49438 12.0337 7.88764 12.236 7.38203 12.6404L 5.5618 10.8202C 5.86517 10.3146 6.16854 9.70787 6.16854 9.10112C 6.16854 8.49438 5.96629 7.88764 5.5618 7.38202L 7.38203 5.5618C 7.88764 5.86517 8.49438 6.16854 9.10112 6.16854C 9.70787 6.16854 10.3146 5.96629 10.8202 5.5618L 12.6404 7.38202C 12.3371 7.78652 12.1348 8.39326 12.1348 9C 12.1348 9.60674 12.3371 10.2135 12.7416 10.7191L 10.9214 12.5393C 10.3146 12.236 9.70787 12.0337 9.10112 12.0337ZM 9.10112 0.910112C 10.2135 0.910112 11.1236 1.82022 11.1236 2.93258C 11.1236 4.04494 10.2135 4.95506 9.10112 4.95506C 7.98876 4.95506 7.07865 4.04494 7.07865 2.93258C 7.07865 1.82022 7.98876 0.910112 9.10112 0.910112ZM 1.01124 9C 1.01124 7.88764 1.92135 6.97753 3.03371 6.97753C 4.14607 6.97753 5.05618 7.88764 5.05618 9C 5.05618 10.1124 4.14607 11.0225 3.03371 11.0225C 1.92135 11.0225 1.01124 10.1124 1.01124 9ZM 9.10112 17.0899C 7.98876 17.0899 7.07865 16.1798 7.07865 15.0674C 7.07865 13.9551 7.98876 13.0449 9.10112 13.0449C 10.2135 13.0449 11.1236 13.9551 11.1236 15.0674C 11.1236 16.1798 10.2135 17.0899 9.10112 17.0899ZM 15.1685 11.0225C 14.0562 11.0225 13.1461 10.1124 13.1461 9C 13.1461 7.88764 14.0562 6.97753 15.1685 6.97753C 16.2809 6.97753 17.191 7.88764 17.191 9C 17.191 10.1124 16.2809 11.0225 15.1685 11.0225Z"
+            id="I"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1105 710)"
+        transform="translate(-1105 710)"
     >
-      <g>
-        <use
-          fill={true}
-          transform="translate(1105 -710)"
-          xlinkHref="#I"
-        />
-      </g>
+        <g>
+            <use
+                fill={undefined}
+                transform="translate(1105 -710)"
+                xlinkHref="#I"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 15.1685 5.96629C 14.5618 5.96629 13.9551 6.16854 13.4494 6.57303L 11.6292 4.75281C 11.9326 4.24719 12.236 3.64045 12.236 3.03371C 12.236 1.31461 10.9213 1.50686e-09 9.20225 1.50686e-09C 7.48314 1.50686e-09 6.16854 1.31461 6.16854 3.03371C 6.16854 3.64045 6.37078 4.24719 6.77528 4.75281L 4.95506 6.57303C 4.24719 6.16854 3.64045 5.96629 3.03371 5.96629C 1.31461 5.96629 0 7.2809 0 9C 0 10.7191 1.31461 12.0337 3.03371 12.0337C 3.64045 12.0337 4.24719 11.8315 4.75281 11.427L 6.57303 13.2472C 6.26966 13.7528 5.96629 14.3596 5.96629 14.9663C 5.96629 16.6854 7.2809 18 9 18C 10.7191 18 12.0337 16.6854 12.0337 14.9663C 12.0337 14.3596 11.8315 13.7528 11.427 13.2472L 13.2472 11.427C 13.7528 11.7303 14.3596 12.0337 14.9663 12.0337C 16.6854 12.0337 18 10.7191 18 9C 18 7.2809 16.8876 5.96629 15.1685 5.96629ZM 9.10112 12.0337C 8.49438 12.0337 7.88764 12.236 7.38203 12.6404L 5.5618 10.8202C 5.86517 10.3146 6.16854 9.70787 6.16854 9.10112C 6.16854 8.49438 5.96629 7.88764 5.5618 7.38202L 7.38203 5.5618C 7.88764 5.86517 8.49438 6.16854 9.10112 6.16854C 9.70787 6.16854 10.3146 5.96629 10.8202 5.5618L 12.6404 7.38202C 12.3371 7.78652 12.1348 8.39326 12.1348 9C 12.1348 9.60674 12.3371 10.2135 12.7416 10.7191L 10.9214 12.5393C 10.3146 12.236 9.70787 12.0337 9.10112 12.0337ZM 9.10112 0.910112C 10.2135 0.910112 11.1236 1.82022 11.1236 2.93258C 11.1236 4.04494 10.2135 4.95506 9.10112 4.95506C 7.98876 4.95506 7.07865 4.04494 7.07865 2.93258C 7.07865 1.82022 7.98876 0.910112 9.10112 0.910112ZM 1.01124 9C 1.01124 7.88764 1.92135 6.97753 3.03371 6.97753C 4.14607 6.97753 5.05618 7.88764 5.05618 9C 5.05618 10.1124 4.14607 11.0225 3.03371 11.0225C 1.92135 11.0225 1.01124 10.1124 1.01124 9ZM 9.10112 17.0899C 7.98876 17.0899 7.07865 16.1798 7.07865 15.0674C 7.07865 13.9551 7.98876 13.0449 9.10112 13.0449C 10.2135 13.0449 11.1236 13.9551 11.1236 15.0674C 11.1236 16.1798 10.2135 17.0899 9.10112 17.0899ZM 15.1685 11.0225C 14.0562 11.0225 13.1461 10.1124 13.1461 9C 13.1461 7.88764 14.0562 6.97753 15.1685 6.97753C 16.2809 6.97753 17.191 7.88764 17.191 9C 17.191 10.1124 16.2809 11.0225 15.1685 11.0225Z"
-        id="I"
-      />
+        <path
+            d="M 15.1685 5.96629C 14.5618 5.96629 13.9551 6.16854 13.4494 6.57303L 11.6292 4.75281C 11.9326 4.24719 12.236 3.64045 12.236 3.03371C 12.236 1.31461 10.9213 1.50686e-09 9.20225 1.50686e-09C 7.48314 1.50686e-09 6.16854 1.31461 6.16854 3.03371C 6.16854 3.64045 6.37078 4.24719 6.77528 4.75281L 4.95506 6.57303C 4.24719 6.16854 3.64045 5.96629 3.03371 5.96629C 1.31461 5.96629 0 7.2809 0 9C 0 10.7191 1.31461 12.0337 3.03371 12.0337C 3.64045 12.0337 4.24719 11.8315 4.75281 11.427L 6.57303 13.2472C 6.26966 13.7528 5.96629 14.3596 5.96629 14.9663C 5.96629 16.6854 7.2809 18 9 18C 10.7191 18 12.0337 16.6854 12.0337 14.9663C 12.0337 14.3596 11.8315 13.7528 11.427 13.2472L 13.2472 11.427C 13.7528 11.7303 14.3596 12.0337 14.9663 12.0337C 16.6854 12.0337 18 10.7191 18 9C 18 7.2809 16.8876 5.96629 15.1685 5.96629ZM 9.10112 12.0337C 8.49438 12.0337 7.88764 12.236 7.38203 12.6404L 5.5618 10.8202C 5.86517 10.3146 6.16854 9.70787 6.16854 9.10112C 6.16854 8.49438 5.96629 7.88764 5.5618 7.38202L 7.38203 5.5618C 7.88764 5.86517 8.49438 6.16854 9.10112 6.16854C 9.70787 6.16854 10.3146 5.96629 10.8202 5.5618L 12.6404 7.38202C 12.3371 7.78652 12.1348 8.39326 12.1348 9C 12.1348 9.60674 12.3371 10.2135 12.7416 10.7191L 10.9214 12.5393C 10.3146 12.236 9.70787 12.0337 9.10112 12.0337ZM 9.10112 0.910112C 10.2135 0.910112 11.1236 1.82022 11.1236 2.93258C 11.1236 4.04494 10.2135 4.95506 9.10112 4.95506C 7.98876 4.95506 7.07865 4.04494 7.07865 2.93258C 7.07865 1.82022 7.98876 0.910112 9.10112 0.910112ZM 1.01124 9C 1.01124 7.88764 1.92135 6.97753 3.03371 6.97753C 4.14607 6.97753 5.05618 7.88764 5.05618 9C 5.05618 10.1124 4.14607 11.0225 3.03371 11.0225C 1.92135 11.0225 1.01124 10.1124 1.01124 9ZM 9.10112 17.0899C 7.98876 17.0899 7.07865 16.1798 7.07865 15.0674C 7.07865 13.9551 7.98876 13.0449 9.10112 13.0449C 10.2135 13.0449 11.1236 13.9551 11.1236 15.0674C 11.1236 16.1798 10.2135 17.0899 9.10112 17.0899ZM 15.1685 11.0225C 14.0562 11.0225 13.1461 10.1124 13.1461 9C 13.1461 7.88764 14.0562 6.97753 15.1685 6.97753C 16.2809 6.97753 17.191 7.88764 17.191 9C 17.191 10.1124 16.2809 11.0225 15.1685 11.0225Z"
+            id="I"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1105 710)"
+        transform="translate(-1105 710)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(1105 -710)"
-          xlinkHref="#I"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(1105 -710)"
+                xlinkHref="#I"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 15.1685 5.96629C 14.5618 5.96629 13.9551 6.16854 13.4494 6.57303L 11.6292 4.75281C 11.9326 4.24719 12.236 3.64045 12.236 3.03371C 12.236 1.31461 10.9213 1.50686e-09 9.20225 1.50686e-09C 7.48314 1.50686e-09 6.16854 1.31461 6.16854 3.03371C 6.16854 3.64045 6.37078 4.24719 6.77528 4.75281L 4.95506 6.57303C 4.24719 6.16854 3.64045 5.96629 3.03371 5.96629C 1.31461 5.96629 0 7.2809 0 9C 0 10.7191 1.31461 12.0337 3.03371 12.0337C 3.64045 12.0337 4.24719 11.8315 4.75281 11.427L 6.57303 13.2472C 6.26966 13.7528 5.96629 14.3596 5.96629 14.9663C 5.96629 16.6854 7.2809 18 9 18C 10.7191 18 12.0337 16.6854 12.0337 14.9663C 12.0337 14.3596 11.8315 13.7528 11.427 13.2472L 13.2472 11.427C 13.7528 11.7303 14.3596 12.0337 14.9663 12.0337C 16.6854 12.0337 18 10.7191 18 9C 18 7.2809 16.8876 5.96629 15.1685 5.96629ZM 9.10112 12.0337C 8.49438 12.0337 7.88764 12.236 7.38203 12.6404L 5.5618 10.8202C 5.86517 10.3146 6.16854 9.70787 6.16854 9.10112C 6.16854 8.49438 5.96629 7.88764 5.5618 7.38202L 7.38203 5.5618C 7.88764 5.86517 8.49438 6.16854 9.10112 6.16854C 9.70787 6.16854 10.3146 5.96629 10.8202 5.5618L 12.6404 7.38202C 12.3371 7.78652 12.1348 8.39326 12.1348 9C 12.1348 9.60674 12.3371 10.2135 12.7416 10.7191L 10.9214 12.5393C 10.3146 12.236 9.70787 12.0337 9.10112 12.0337ZM 9.10112 0.910112C 10.2135 0.910112 11.1236 1.82022 11.1236 2.93258C 11.1236 4.04494 10.2135 4.95506 9.10112 4.95506C 7.98876 4.95506 7.07865 4.04494 7.07865 2.93258C 7.07865 1.82022 7.98876 0.910112 9.10112 0.910112ZM 1.01124 9C 1.01124 7.88764 1.92135 6.97753 3.03371 6.97753C 4.14607 6.97753 5.05618 7.88764 5.05618 9C 5.05618 10.1124 4.14607 11.0225 3.03371 11.0225C 1.92135 11.0225 1.01124 10.1124 1.01124 9ZM 9.10112 17.0899C 7.98876 17.0899 7.07865 16.1798 7.07865 15.0674C 7.07865 13.9551 7.98876 13.0449 9.10112 13.0449C 10.2135 13.0449 11.1236 13.9551 11.1236 15.0674C 11.1236 16.1798 10.2135 17.0899 9.10112 17.0899ZM 15.1685 11.0225C 14.0562 11.0225 13.1461 10.1124 13.1461 9C 13.1461 7.88764 14.0562 6.97753 15.1685 6.97753C 16.2809 6.97753 17.191 7.88764 17.191 9C 17.191 10.1124 16.2809 11.0225 15.1685 11.0225Z"
-        id="I"
-      />
+        <path
+            d="M 15.1685 5.96629C 14.5618 5.96629 13.9551 6.16854 13.4494 6.57303L 11.6292 4.75281C 11.9326 4.24719 12.236 3.64045 12.236 3.03371C 12.236 1.31461 10.9213 1.50686e-09 9.20225 1.50686e-09C 7.48314 1.50686e-09 6.16854 1.31461 6.16854 3.03371C 6.16854 3.64045 6.37078 4.24719 6.77528 4.75281L 4.95506 6.57303C 4.24719 6.16854 3.64045 5.96629 3.03371 5.96629C 1.31461 5.96629 0 7.2809 0 9C 0 10.7191 1.31461 12.0337 3.03371 12.0337C 3.64045 12.0337 4.24719 11.8315 4.75281 11.427L 6.57303 13.2472C 6.26966 13.7528 5.96629 14.3596 5.96629 14.9663C 5.96629 16.6854 7.2809 18 9 18C 10.7191 18 12.0337 16.6854 12.0337 14.9663C 12.0337 14.3596 11.8315 13.7528 11.427 13.2472L 13.2472 11.427C 13.7528 11.7303 14.3596 12.0337 14.9663 12.0337C 16.6854 12.0337 18 10.7191 18 9C 18 7.2809 16.8876 5.96629 15.1685 5.96629ZM 9.10112 12.0337C 8.49438 12.0337 7.88764 12.236 7.38203 12.6404L 5.5618 10.8202C 5.86517 10.3146 6.16854 9.70787 6.16854 9.10112C 6.16854 8.49438 5.96629 7.88764 5.5618 7.38202L 7.38203 5.5618C 7.88764 5.86517 8.49438 6.16854 9.10112 6.16854C 9.70787 6.16854 10.3146 5.96629 10.8202 5.5618L 12.6404 7.38202C 12.3371 7.78652 12.1348 8.39326 12.1348 9C 12.1348 9.60674 12.3371 10.2135 12.7416 10.7191L 10.9214 12.5393C 10.3146 12.236 9.70787 12.0337 9.10112 12.0337ZM 9.10112 0.910112C 10.2135 0.910112 11.1236 1.82022 11.1236 2.93258C 11.1236 4.04494 10.2135 4.95506 9.10112 4.95506C 7.98876 4.95506 7.07865 4.04494 7.07865 2.93258C 7.07865 1.82022 7.98876 0.910112 9.10112 0.910112ZM 1.01124 9C 1.01124 7.88764 1.92135 6.97753 3.03371 6.97753C 4.14607 6.97753 5.05618 7.88764 5.05618 9C 5.05618 10.1124 4.14607 11.0225 3.03371 11.0225C 1.92135 11.0225 1.01124 10.1124 1.01124 9ZM 9.10112 17.0899C 7.98876 17.0899 7.07865 16.1798 7.07865 15.0674C 7.07865 13.9551 7.98876 13.0449 9.10112 13.0449C 10.2135 13.0449 11.1236 13.9551 11.1236 15.0674C 11.1236 16.1798 10.2135 17.0899 9.10112 17.0899ZM 15.1685 11.0225C 14.0562 11.0225 13.1461 10.1124 13.1461 9C 13.1461 7.88764 14.0562 6.97753 15.1685 6.97753C 16.2809 6.97753 17.191 7.88764 17.191 9C 17.191 10.1124 16.2809 11.0225 15.1685 11.0225Z"
+            id="I"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1105 710)"
+        transform="translate(-1105 710)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(1105 -710)"
-          xlinkHref="#I"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(1105 -710)"
+                xlinkHref="#I"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 15.1685 5.96629C 14.5618 5.96629 13.9551 6.16854 13.4494 6.57303L 11.6292 4.75281C 11.9326 4.24719 12.236 3.64045 12.236 3.03371C 12.236 1.31461 10.9213 1.50686e-09 9.20225 1.50686e-09C 7.48314 1.50686e-09 6.16854 1.31461 6.16854 3.03371C 6.16854 3.64045 6.37078 4.24719 6.77528 4.75281L 4.95506 6.57303C 4.24719 6.16854 3.64045 5.96629 3.03371 5.96629C 1.31461 5.96629 0 7.2809 0 9C 0 10.7191 1.31461 12.0337 3.03371 12.0337C 3.64045 12.0337 4.24719 11.8315 4.75281 11.427L 6.57303 13.2472C 6.26966 13.7528 5.96629 14.3596 5.96629 14.9663C 5.96629 16.6854 7.2809 18 9 18C 10.7191 18 12.0337 16.6854 12.0337 14.9663C 12.0337 14.3596 11.8315 13.7528 11.427 13.2472L 13.2472 11.427C 13.7528 11.7303 14.3596 12.0337 14.9663 12.0337C 16.6854 12.0337 18 10.7191 18 9C 18 7.2809 16.8876 5.96629 15.1685 5.96629ZM 9.10112 12.0337C 8.49438 12.0337 7.88764 12.236 7.38203 12.6404L 5.5618 10.8202C 5.86517 10.3146 6.16854 9.70787 6.16854 9.10112C 6.16854 8.49438 5.96629 7.88764 5.5618 7.38202L 7.38203 5.5618C 7.88764 5.86517 8.49438 6.16854 9.10112 6.16854C 9.70787 6.16854 10.3146 5.96629 10.8202 5.5618L 12.6404 7.38202C 12.3371 7.78652 12.1348 8.39326 12.1348 9C 12.1348 9.60674 12.3371 10.2135 12.7416 10.7191L 10.9214 12.5393C 10.3146 12.236 9.70787 12.0337 9.10112 12.0337ZM 9.10112 0.910112C 10.2135 0.910112 11.1236 1.82022 11.1236 2.93258C 11.1236 4.04494 10.2135 4.95506 9.10112 4.95506C 7.98876 4.95506 7.07865 4.04494 7.07865 2.93258C 7.07865 1.82022 7.98876 0.910112 9.10112 0.910112ZM 1.01124 9C 1.01124 7.88764 1.92135 6.97753 3.03371 6.97753C 4.14607 6.97753 5.05618 7.88764 5.05618 9C 5.05618 10.1124 4.14607 11.0225 3.03371 11.0225C 1.92135 11.0225 1.01124 10.1124 1.01124 9ZM 9.10112 17.0899C 7.98876 17.0899 7.07865 16.1798 7.07865 15.0674C 7.07865 13.9551 7.98876 13.0449 9.10112 13.0449C 10.2135 13.0449 11.1236 13.9551 11.1236 15.0674C 11.1236 16.1798 10.2135 17.0899 9.10112 17.0899ZM 15.1685 11.0225C 14.0562 11.0225 13.1461 10.1124 13.1461 9C 13.1461 7.88764 14.0562 6.97753 15.1685 6.97753C 16.2809 6.97753 17.191 7.88764 17.191 9C 17.191 10.1124 16.2809 11.0225 15.1685 11.0225Z"
-        id="I"
-      />
+        <path
+            d="M 15.1685 5.96629C 14.5618 5.96629 13.9551 6.16854 13.4494 6.57303L 11.6292 4.75281C 11.9326 4.24719 12.236 3.64045 12.236 3.03371C 12.236 1.31461 10.9213 1.50686e-09 9.20225 1.50686e-09C 7.48314 1.50686e-09 6.16854 1.31461 6.16854 3.03371C 6.16854 3.64045 6.37078 4.24719 6.77528 4.75281L 4.95506 6.57303C 4.24719 6.16854 3.64045 5.96629 3.03371 5.96629C 1.31461 5.96629 0 7.2809 0 9C 0 10.7191 1.31461 12.0337 3.03371 12.0337C 3.64045 12.0337 4.24719 11.8315 4.75281 11.427L 6.57303 13.2472C 6.26966 13.7528 5.96629 14.3596 5.96629 14.9663C 5.96629 16.6854 7.2809 18 9 18C 10.7191 18 12.0337 16.6854 12.0337 14.9663C 12.0337 14.3596 11.8315 13.7528 11.427 13.2472L 13.2472 11.427C 13.7528 11.7303 14.3596 12.0337 14.9663 12.0337C 16.6854 12.0337 18 10.7191 18 9C 18 7.2809 16.8876 5.96629 15.1685 5.96629ZM 9.10112 12.0337C 8.49438 12.0337 7.88764 12.236 7.38203 12.6404L 5.5618 10.8202C 5.86517 10.3146 6.16854 9.70787 6.16854 9.10112C 6.16854 8.49438 5.96629 7.88764 5.5618 7.38202L 7.38203 5.5618C 7.88764 5.86517 8.49438 6.16854 9.10112 6.16854C 9.70787 6.16854 10.3146 5.96629 10.8202 5.5618L 12.6404 7.38202C 12.3371 7.78652 12.1348 8.39326 12.1348 9C 12.1348 9.60674 12.3371 10.2135 12.7416 10.7191L 10.9214 12.5393C 10.3146 12.236 9.70787 12.0337 9.10112 12.0337ZM 9.10112 0.910112C 10.2135 0.910112 11.1236 1.82022 11.1236 2.93258C 11.1236 4.04494 10.2135 4.95506 9.10112 4.95506C 7.98876 4.95506 7.07865 4.04494 7.07865 2.93258C 7.07865 1.82022 7.98876 0.910112 9.10112 0.910112ZM 1.01124 9C 1.01124 7.88764 1.92135 6.97753 3.03371 6.97753C 4.14607 6.97753 5.05618 7.88764 5.05618 9C 5.05618 10.1124 4.14607 11.0225 3.03371 11.0225C 1.92135 11.0225 1.01124 10.1124 1.01124 9ZM 9.10112 17.0899C 7.98876 17.0899 7.07865 16.1798 7.07865 15.0674C 7.07865 13.9551 7.98876 13.0449 9.10112 13.0449C 10.2135 13.0449 11.1236 13.9551 11.1236 15.0674C 11.1236 16.1798 10.2135 17.0899 9.10112 17.0899ZM 15.1685 11.0225C 14.0562 11.0225 13.1461 10.1124 13.1461 9C 13.1461 7.88764 14.0562 6.97753 15.1685 6.97753C 16.2809 6.97753 17.191 7.88764 17.191 9C 17.191 10.1124 16.2809 11.0225 15.1685 11.0225Z"
+            id="I"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1105 710)"
+        transform="translate(-1105 710)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(1105 -710)"
-          xlinkHref="#I"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(1105 -710)"
+                xlinkHref="#I"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 15.1685 5.96629C 14.5618 5.96629 13.9551 6.16854 13.4494 6.57303L 11.6292 4.75281C 11.9326 4.24719 12.236 3.64045 12.236 3.03371C 12.236 1.31461 10.9213 1.50686e-09 9.20225 1.50686e-09C 7.48314 1.50686e-09 6.16854 1.31461 6.16854 3.03371C 6.16854 3.64045 6.37078 4.24719 6.77528 4.75281L 4.95506 6.57303C 4.24719 6.16854 3.64045 5.96629 3.03371 5.96629C 1.31461 5.96629 0 7.2809 0 9C 0 10.7191 1.31461 12.0337 3.03371 12.0337C 3.64045 12.0337 4.24719 11.8315 4.75281 11.427L 6.57303 13.2472C 6.26966 13.7528 5.96629 14.3596 5.96629 14.9663C 5.96629 16.6854 7.2809 18 9 18C 10.7191 18 12.0337 16.6854 12.0337 14.9663C 12.0337 14.3596 11.8315 13.7528 11.427 13.2472L 13.2472 11.427C 13.7528 11.7303 14.3596 12.0337 14.9663 12.0337C 16.6854 12.0337 18 10.7191 18 9C 18 7.2809 16.8876 5.96629 15.1685 5.96629ZM 9.10112 12.0337C 8.49438 12.0337 7.88764 12.236 7.38203 12.6404L 5.5618 10.8202C 5.86517 10.3146 6.16854 9.70787 6.16854 9.10112C 6.16854 8.49438 5.96629 7.88764 5.5618 7.38202L 7.38203 5.5618C 7.88764 5.86517 8.49438 6.16854 9.10112 6.16854C 9.70787 6.16854 10.3146 5.96629 10.8202 5.5618L 12.6404 7.38202C 12.3371 7.78652 12.1348 8.39326 12.1348 9C 12.1348 9.60674 12.3371 10.2135 12.7416 10.7191L 10.9214 12.5393C 10.3146 12.236 9.70787 12.0337 9.10112 12.0337ZM 9.10112 0.910112C 10.2135 0.910112 11.1236 1.82022 11.1236 2.93258C 11.1236 4.04494 10.2135 4.95506 9.10112 4.95506C 7.98876 4.95506 7.07865 4.04494 7.07865 2.93258C 7.07865 1.82022 7.98876 0.910112 9.10112 0.910112ZM 1.01124 9C 1.01124 7.88764 1.92135 6.97753 3.03371 6.97753C 4.14607 6.97753 5.05618 7.88764 5.05618 9C 5.05618 10.1124 4.14607 11.0225 3.03371 11.0225C 1.92135 11.0225 1.01124 10.1124 1.01124 9ZM 9.10112 17.0899C 7.98876 17.0899 7.07865 16.1798 7.07865 15.0674C 7.07865 13.9551 7.98876 13.0449 9.10112 13.0449C 10.2135 13.0449 11.1236 13.9551 11.1236 15.0674C 11.1236 16.1798 10.2135 17.0899 9.10112 17.0899ZM 15.1685 11.0225C 14.0562 11.0225 13.1461 10.1124 13.1461 9C 13.1461 7.88764 14.0562 6.97753 15.1685 6.97753C 16.2809 6.97753 17.191 7.88764 17.191 9C 17.191 10.1124 16.2809 11.0225 15.1685 11.0225Z"
-        id="I"
-      />
+        <path
+            d="M 15.1685 5.96629C 14.5618 5.96629 13.9551 6.16854 13.4494 6.57303L 11.6292 4.75281C 11.9326 4.24719 12.236 3.64045 12.236 3.03371C 12.236 1.31461 10.9213 1.50686e-09 9.20225 1.50686e-09C 7.48314 1.50686e-09 6.16854 1.31461 6.16854 3.03371C 6.16854 3.64045 6.37078 4.24719 6.77528 4.75281L 4.95506 6.57303C 4.24719 6.16854 3.64045 5.96629 3.03371 5.96629C 1.31461 5.96629 0 7.2809 0 9C 0 10.7191 1.31461 12.0337 3.03371 12.0337C 3.64045 12.0337 4.24719 11.8315 4.75281 11.427L 6.57303 13.2472C 6.26966 13.7528 5.96629 14.3596 5.96629 14.9663C 5.96629 16.6854 7.2809 18 9 18C 10.7191 18 12.0337 16.6854 12.0337 14.9663C 12.0337 14.3596 11.8315 13.7528 11.427 13.2472L 13.2472 11.427C 13.7528 11.7303 14.3596 12.0337 14.9663 12.0337C 16.6854 12.0337 18 10.7191 18 9C 18 7.2809 16.8876 5.96629 15.1685 5.96629ZM 9.10112 12.0337C 8.49438 12.0337 7.88764 12.236 7.38203 12.6404L 5.5618 10.8202C 5.86517 10.3146 6.16854 9.70787 6.16854 9.10112C 6.16854 8.49438 5.96629 7.88764 5.5618 7.38202L 7.38203 5.5618C 7.88764 5.86517 8.49438 6.16854 9.10112 6.16854C 9.70787 6.16854 10.3146 5.96629 10.8202 5.5618L 12.6404 7.38202C 12.3371 7.78652 12.1348 8.39326 12.1348 9C 12.1348 9.60674 12.3371 10.2135 12.7416 10.7191L 10.9214 12.5393C 10.3146 12.236 9.70787 12.0337 9.10112 12.0337ZM 9.10112 0.910112C 10.2135 0.910112 11.1236 1.82022 11.1236 2.93258C 11.1236 4.04494 10.2135 4.95506 9.10112 4.95506C 7.98876 4.95506 7.07865 4.04494 7.07865 2.93258C 7.07865 1.82022 7.98876 0.910112 9.10112 0.910112ZM 1.01124 9C 1.01124 7.88764 1.92135 6.97753 3.03371 6.97753C 4.14607 6.97753 5.05618 7.88764 5.05618 9C 5.05618 10.1124 4.14607 11.0225 3.03371 11.0225C 1.92135 11.0225 1.01124 10.1124 1.01124 9ZM 9.10112 17.0899C 7.98876 17.0899 7.07865 16.1798 7.07865 15.0674C 7.07865 13.9551 7.98876 13.0449 9.10112 13.0449C 10.2135 13.0449 11.1236 13.9551 11.1236 15.0674C 11.1236 16.1798 10.2135 17.0899 9.10112 17.0899ZM 15.1685 11.0225C 14.0562 11.0225 13.1461 10.1124 13.1461 9C 13.1461 7.88764 14.0562 6.97753 15.1685 6.97753C 16.2809 6.97753 17.191 7.88764 17.191 9C 17.191 10.1124 16.2809 11.0225 15.1685 11.0225Z"
+            id="I"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18 18"
     width="18"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1105 710)"
+        transform="translate(-1105 710)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(1105 -710)"
-          xlinkHref="#I"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(1105 -710)"
+                xlinkHref="#I"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 15.1685 5.96629C 14.5618 5.96629 13.9551 6.16854 13.4494 6.57303L 11.6292 4.75281C 11.9326 4.24719 12.236 3.64045 12.236 3.03371C 12.236 1.31461 10.9213 1.50686e-09 9.20225 1.50686e-09C 7.48314 1.50686e-09 6.16854 1.31461 6.16854 3.03371C 6.16854 3.64045 6.37078 4.24719 6.77528 4.75281L 4.95506 6.57303C 4.24719 6.16854 3.64045 5.96629 3.03371 5.96629C 1.31461 5.96629 0 7.2809 0 9C 0 10.7191 1.31461 12.0337 3.03371 12.0337C 3.64045 12.0337 4.24719 11.8315 4.75281 11.427L 6.57303 13.2472C 6.26966 13.7528 5.96629 14.3596 5.96629 14.9663C 5.96629 16.6854 7.2809 18 9 18C 10.7191 18 12.0337 16.6854 12.0337 14.9663C 12.0337 14.3596 11.8315 13.7528 11.427 13.2472L 13.2472 11.427C 13.7528 11.7303 14.3596 12.0337 14.9663 12.0337C 16.6854 12.0337 18 10.7191 18 9C 18 7.2809 16.8876 5.96629 15.1685 5.96629ZM 9.10112 12.0337C 8.49438 12.0337 7.88764 12.236 7.38203 12.6404L 5.5618 10.8202C 5.86517 10.3146 6.16854 9.70787 6.16854 9.10112C 6.16854 8.49438 5.96629 7.88764 5.5618 7.38202L 7.38203 5.5618C 7.88764 5.86517 8.49438 6.16854 9.10112 6.16854C 9.70787 6.16854 10.3146 5.96629 10.8202 5.5618L 12.6404 7.38202C 12.3371 7.78652 12.1348 8.39326 12.1348 9C 12.1348 9.60674 12.3371 10.2135 12.7416 10.7191L 10.9214 12.5393C 10.3146 12.236 9.70787 12.0337 9.10112 12.0337ZM 9.10112 0.910112C 10.2135 0.910112 11.1236 1.82022 11.1236 2.93258C 11.1236 4.04494 10.2135 4.95506 9.10112 4.95506C 7.98876 4.95506 7.07865 4.04494 7.07865 2.93258C 7.07865 1.82022 7.98876 0.910112 9.10112 0.910112ZM 1.01124 9C 1.01124 7.88764 1.92135 6.97753 3.03371 6.97753C 4.14607 6.97753 5.05618 7.88764 5.05618 9C 5.05618 10.1124 4.14607 11.0225 3.03371 11.0225C 1.92135 11.0225 1.01124 10.1124 1.01124 9ZM 9.10112 17.0899C 7.98876 17.0899 7.07865 16.1798 7.07865 15.0674C 7.07865 13.9551 7.98876 13.0449 9.10112 13.0449C 10.2135 13.0449 11.1236 13.9551 11.1236 15.0674C 11.1236 16.1798 10.2135 17.0899 9.10112 17.0899ZM 15.1685 11.0225C 14.0562 11.0225 13.1461 10.1124 13.1461 9C 13.1461 7.88764 14.0562 6.97753 15.1685 6.97753C 16.2809 6.97753 17.191 7.88764 17.191 9C 17.191 10.1124 16.2809 11.0225 15.1685 11.0225Z"
-        id="I"
-      />
+        <path
+            d="M 15.1685 5.96629C 14.5618 5.96629 13.9551 6.16854 13.4494 6.57303L 11.6292 4.75281C 11.9326 4.24719 12.236 3.64045 12.236 3.03371C 12.236 1.31461 10.9213 1.50686e-09 9.20225 1.50686e-09C 7.48314 1.50686e-09 6.16854 1.31461 6.16854 3.03371C 6.16854 3.64045 6.37078 4.24719 6.77528 4.75281L 4.95506 6.57303C 4.24719 6.16854 3.64045 5.96629 3.03371 5.96629C 1.31461 5.96629 0 7.2809 0 9C 0 10.7191 1.31461 12.0337 3.03371 12.0337C 3.64045 12.0337 4.24719 11.8315 4.75281 11.427L 6.57303 13.2472C 6.26966 13.7528 5.96629 14.3596 5.96629 14.9663C 5.96629 16.6854 7.2809 18 9 18C 10.7191 18 12.0337 16.6854 12.0337 14.9663C 12.0337 14.3596 11.8315 13.7528 11.427 13.2472L 13.2472 11.427C 13.7528 11.7303 14.3596 12.0337 14.9663 12.0337C 16.6854 12.0337 18 10.7191 18 9C 18 7.2809 16.8876 5.96629 15.1685 5.96629ZM 9.10112 12.0337C 8.49438 12.0337 7.88764 12.236 7.38203 12.6404L 5.5618 10.8202C 5.86517 10.3146 6.16854 9.70787 6.16854 9.10112C 6.16854 8.49438 5.96629 7.88764 5.5618 7.38202L 7.38203 5.5618C 7.88764 5.86517 8.49438 6.16854 9.10112 6.16854C 9.70787 6.16854 10.3146 5.96629 10.8202 5.5618L 12.6404 7.38202C 12.3371 7.78652 12.1348 8.39326 12.1348 9C 12.1348 9.60674 12.3371 10.2135 12.7416 10.7191L 10.9214 12.5393C 10.3146 12.236 9.70787 12.0337 9.10112 12.0337ZM 9.10112 0.910112C 10.2135 0.910112 11.1236 1.82022 11.1236 2.93258C 11.1236 4.04494 10.2135 4.95506 9.10112 4.95506C 7.98876 4.95506 7.07865 4.04494 7.07865 2.93258C 7.07865 1.82022 7.98876 0.910112 9.10112 0.910112ZM 1.01124 9C 1.01124 7.88764 1.92135 6.97753 3.03371 6.97753C 4.14607 6.97753 5.05618 7.88764 5.05618 9C 5.05618 10.1124 4.14607 11.0225 3.03371 11.0225C 1.92135 11.0225 1.01124 10.1124 1.01124 9ZM 9.10112 17.0899C 7.98876 17.0899 7.07865 16.1798 7.07865 15.0674C 7.07865 13.9551 7.98876 13.0449 9.10112 13.0449C 10.2135 13.0449 11.1236 13.9551 11.1236 15.0674C 11.1236 16.1798 10.2135 17.0899 9.10112 17.0899ZM 15.1685 11.0225C 14.0562 11.0225 13.1461 10.1124 13.1461 9C 13.1461 7.88764 14.0562 6.97753 15.1685 6.97753C 16.2809 6.97753 17.191 7.88764 17.191 9C 17.191 10.1124 16.2809 11.0225 15.1685 11.0225Z"
+            id="I"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Package /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 18"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1885 710)"
+        transform="translate(-1885 710)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(1885 -710)"
-          xlinkHref="#J"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(1885 -710)"
+                xlinkHref="#J"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 12.9 2.5L 8.5 0L 0 4.79999L 0 13.2L 8.5 18L 17 13.2L 17 4.79999L 12.9 2.5ZM 15 4.79999L 8.5 8.5L 5.4 6.79999L 11.9 3.10001L 15 4.79999ZM 10.9 2.5L 4.4 6.10001L 2 4.79999L 8.5 1.10001L 10.9 2.5ZM 1 5.39999L 4 7.10001L 4 9L 5 10L 5 7.60001L 8 9.29999L 8 16.6L 1 12.6L 1 5.39999ZM 16 5.39999L 16 12.6L 9 16.6L 9 9.29999L 16 5.39999Z"
-        id="J"
-      />
+        <path
+            d="M 12.9 2.5L 8.5 0L 0 4.79999L 0 13.2L 8.5 18L 17 13.2L 17 4.79999L 12.9 2.5ZM 15 4.79999L 8.5 8.5L 5.4 6.79999L 11.9 3.10001L 15 4.79999ZM 10.9 2.5L 4.4 6.10001L 2 4.79999L 8.5 1.10001L 10.9 2.5ZM 1 5.39999L 4 7.10001L 4 9L 5 10L 5 7.60001L 8 9.29999L 8 16.6L 1 12.6L 1 5.39999ZM 16 5.39999L 16 12.6L 9 16.6L 9 9.29999L 16 5.39999Z"
+            id="J"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 18"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1885 710)"
+        transform="translate(-1885 710)"
     >
-      <g>
-        <use
-          fill="#FFF"
-          transform="translate(1885 -710)"
-          xlinkHref="#J"
-        />
-      </g>
+        <g>
+            <use
+                fill="#FFF"
+                transform="translate(1885 -710)"
+                xlinkHref="#J"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 12.9 2.5L 8.5 0L 0 4.79999L 0 13.2L 8.5 18L 17 13.2L 17 4.79999L 12.9 2.5ZM 15 4.79999L 8.5 8.5L 5.4 6.79999L 11.9 3.10001L 15 4.79999ZM 10.9 2.5L 4.4 6.10001L 2 4.79999L 8.5 1.10001L 10.9 2.5ZM 1 5.39999L 4 7.10001L 4 9L 5 10L 5 7.60001L 8 9.29999L 8 16.6L 1 12.6L 1 5.39999ZM 16 5.39999L 16 12.6L 9 16.6L 9 9.29999L 16 5.39999Z"
-        id="J"
-      />
+        <path
+            d="M 12.9 2.5L 8.5 0L 0 4.79999L 0 13.2L 8.5 18L 17 13.2L 17 4.79999L 12.9 2.5ZM 15 4.79999L 8.5 8.5L 5.4 6.79999L 11.9 3.10001L 15 4.79999ZM 10.9 2.5L 4.4 6.10001L 2 4.79999L 8.5 1.10001L 10.9 2.5ZM 1 5.39999L 4 7.10001L 4 9L 5 10L 5 7.60001L 8 9.29999L 8 16.6L 1 12.6L 1 5.39999ZM 16 5.39999L 16 12.6L 9 16.6L 9 9.29999L 16 5.39999Z"
+            id="J"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 18"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1885 710)"
+        transform="translate(-1885 710)"
     >
-      <g>
-        <use
-          fill={true}
-          transform="translate(1885 -710)"
-          xlinkHref="#J"
-        />
-      </g>
+        <g>
+            <use
+                fill={undefined}
+                transform="translate(1885 -710)"
+                xlinkHref="#J"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 12.9 2.5L 8.5 0L 0 4.79999L 0 13.2L 8.5 18L 17 13.2L 17 4.79999L 12.9 2.5ZM 15 4.79999L 8.5 8.5L 5.4 6.79999L 11.9 3.10001L 15 4.79999ZM 10.9 2.5L 4.4 6.10001L 2 4.79999L 8.5 1.10001L 10.9 2.5ZM 1 5.39999L 4 7.10001L 4 9L 5 10L 5 7.60001L 8 9.29999L 8 16.6L 1 12.6L 1 5.39999ZM 16 5.39999L 16 12.6L 9 16.6L 9 9.29999L 16 5.39999Z"
-        id="J"
-      />
+        <path
+            d="M 12.9 2.5L 8.5 0L 0 4.79999L 0 13.2L 8.5 18L 17 13.2L 17 4.79999L 12.9 2.5ZM 15 4.79999L 8.5 8.5L 5.4 6.79999L 11.9 3.10001L 15 4.79999ZM 10.9 2.5L 4.4 6.10001L 2 4.79999L 8.5 1.10001L 10.9 2.5ZM 1 5.39999L 4 7.10001L 4 9L 5 10L 5 7.60001L 8 9.29999L 8 16.6L 1 12.6L 1 5.39999ZM 16 5.39999L 16 12.6L 9 16.6L 9 9.29999L 16 5.39999Z"
+            id="J"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 18"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1885 710)"
+        transform="translate(-1885 710)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(1885 -710)"
-          xlinkHref="#J"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(1885 -710)"
+                xlinkHref="#J"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 12.9 2.5L 8.5 0L 0 4.79999L 0 13.2L 8.5 18L 17 13.2L 17 4.79999L 12.9 2.5ZM 15 4.79999L 8.5 8.5L 5.4 6.79999L 11.9 3.10001L 15 4.79999ZM 10.9 2.5L 4.4 6.10001L 2 4.79999L 8.5 1.10001L 10.9 2.5ZM 1 5.39999L 4 7.10001L 4 9L 5 10L 5 7.60001L 8 9.29999L 8 16.6L 1 12.6L 1 5.39999ZM 16 5.39999L 16 12.6L 9 16.6L 9 9.29999L 16 5.39999Z"
-        id="J"
-      />
+        <path
+            d="M 12.9 2.5L 8.5 0L 0 4.79999L 0 13.2L 8.5 18L 17 13.2L 17 4.79999L 12.9 2.5ZM 15 4.79999L 8.5 8.5L 5.4 6.79999L 11.9 3.10001L 15 4.79999ZM 10.9 2.5L 4.4 6.10001L 2 4.79999L 8.5 1.10001L 10.9 2.5ZM 1 5.39999L 4 7.10001L 4 9L 5 10L 5 7.60001L 8 9.29999L 8 16.6L 1 12.6L 1 5.39999ZM 16 5.39999L 16 12.6L 9 16.6L 9 9.29999L 16 5.39999Z"
+            id="J"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 18"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1885 710)"
+        transform="translate(-1885 710)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(1885 -710)"
-          xlinkHref="#J"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(1885 -710)"
+                xlinkHref="#J"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 12.9 2.5L 8.5 0L 0 4.79999L 0 13.2L 8.5 18L 17 13.2L 17 4.79999L 12.9 2.5ZM 15 4.79999L 8.5 8.5L 5.4 6.79999L 11.9 3.10001L 15 4.79999ZM 10.9 2.5L 4.4 6.10001L 2 4.79999L 8.5 1.10001L 10.9 2.5ZM 1 5.39999L 4 7.10001L 4 9L 5 10L 5 7.60001L 8 9.29999L 8 16.6L 1 12.6L 1 5.39999ZM 16 5.39999L 16 12.6L 9 16.6L 9 9.29999L 16 5.39999Z"
-        id="J"
-      />
+        <path
+            d="M 12.9 2.5L 8.5 0L 0 4.79999L 0 13.2L 8.5 18L 17 13.2L 17 4.79999L 12.9 2.5ZM 15 4.79999L 8.5 8.5L 5.4 6.79999L 11.9 3.10001L 15 4.79999ZM 10.9 2.5L 4.4 6.10001L 2 4.79999L 8.5 1.10001L 10.9 2.5ZM 1 5.39999L 4 7.10001L 4 9L 5 10L 5 7.60001L 8 9.29999L 8 16.6L 1 12.6L 1 5.39999ZM 16 5.39999L 16 12.6L 9 16.6L 9 9.29999L 16 5.39999Z"
+            id="J"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 18"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1885 710)"
+        transform="translate(-1885 710)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(1885 -710)"
-          xlinkHref="#J"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(1885 -710)"
+                xlinkHref="#J"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 12.9 2.5L 8.5 0L 0 4.79999L 0 13.2L 8.5 18L 17 13.2L 17 4.79999L 12.9 2.5ZM 15 4.79999L 8.5 8.5L 5.4 6.79999L 11.9 3.10001L 15 4.79999ZM 10.9 2.5L 4.4 6.10001L 2 4.79999L 8.5 1.10001L 10.9 2.5ZM 1 5.39999L 4 7.10001L 4 9L 5 10L 5 7.60001L 8 9.29999L 8 16.6L 1 12.6L 1 5.39999ZM 16 5.39999L 16 12.6L 9 16.6L 9 9.29999L 16 5.39999Z"
-        id="J"
-      />
+        <path
+            d="M 12.9 2.5L 8.5 0L 0 4.79999L 0 13.2L 8.5 18L 17 13.2L 17 4.79999L 12.9 2.5ZM 15 4.79999L 8.5 8.5L 5.4 6.79999L 11.9 3.10001L 15 4.79999ZM 10.9 2.5L 4.4 6.10001L 2 4.79999L 8.5 1.10001L 10.9 2.5ZM 1 5.39999L 4 7.10001L 4 9L 5 10L 5 7.60001L 8 9.29999L 8 16.6L 1 12.6L 1 5.39999ZM 16 5.39999L 16 12.6L 9 16.6L 9 9.29999L 16 5.39999Z"
+            id="J"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="18"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 17 18"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(-1885 710)"
+        transform="translate(-1885 710)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="translate(1885 -710)"
-          xlinkHref="#J"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="translate(1885 -710)"
+                xlinkHref="#J"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 12.9 2.5L 8.5 0L 0 4.79999L 0 13.2L 8.5 18L 17 13.2L 17 4.79999L 12.9 2.5ZM 15 4.79999L 8.5 8.5L 5.4 6.79999L 11.9 3.10001L 15 4.79999ZM 10.9 2.5L 4.4 6.10001L 2 4.79999L 8.5 1.10001L 10.9 2.5ZM 1 5.39999L 4 7.10001L 4 9L 5 10L 5 7.60001L 8 9.29999L 8 16.6L 1 12.6L 1 5.39999ZM 16 5.39999L 16 12.6L 9 16.6L 9 9.29999L 16 5.39999Z"
-        id="J"
-      />
+        <path
+            d="M 12.9 2.5L 8.5 0L 0 4.79999L 0 13.2L 8.5 18L 17 13.2L 17 4.79999L 12.9 2.5ZM 15 4.79999L 8.5 8.5L 5.4 6.79999L 11.9 3.10001L 15 4.79999ZM 10.9 2.5L 4.4 6.10001L 2 4.79999L 8.5 1.10001L 10.9 2.5ZM 1 5.39999L 4 7.10001L 4 9L 5 10L 5 7.60001L 8 9.29999L 8 16.6L 1 12.6L 1 5.39999ZM 16 5.39999L 16 12.6L 9 16.6L 9 9.29999L 16 5.39999Z"
+            id="J"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Plus /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="8"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 8 8"
     width="8"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M3 3H0v2h3v3h2V5h3V3H5V0H3v3z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M3 3H0v2h3v3h2V5h3V3H5V0H3v3z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="8"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 8 8"
     width="8"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M3 3H0v2h3v3h2V5h3V3H5V0H3v3z"
-      fill="#FFF"
-      fillRule="evenodd"
+        d="M3 3H0v2h3v3h2V5h3V3H5V0H3v3z"
+        fill="#FFF"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="8"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 8 8"
     width="8"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M3 3H0v2h3v3h2V5h3V3H5V0H3v3z"
-      fill={true}
-      fillRule="evenodd"
+        d="M3 3H0v2h3v3h2V5h3V3H5V0H3v3z"
+        fill={undefined}
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="8"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 8 8"
     width="8"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M3 3H0v2h3v3h2V5h3V3H5V0H3v3z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M3 3H0v2h3v3h2V5h3V3H5V0H3v3z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="8"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 8 8"
     width="8"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M3 3H0v2h3v3h2V5h3V3H5V0H3v3z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M3 3H0v2h3v3h2V5h3V3H5V0H3v3z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="8"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 8 8"
     width="8"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M3 3H0v2h3v3h2V5h3V3H5V0H3v3z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M3 3H0v2h3v3h2V5h3V3H5V0H3v3z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="8"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 8 8"
     width="8"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M3 3H0v2h3v3h2V5h3V3H5V0H3v3z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M3 3H0v2h3v3h2V5h3V3H5V0H3v3z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Private /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 16"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M10,6V4A4,4,0,0,0,2,4V6H2A2,2,0,0,0,0,8v6a2,2,0,0,0,2,2h8a2,2,0,0,0,2-2V8A2,2,0,0,0,10,6ZM4,4c0-1.65.35-2,2-2s2,.35,2,2V6H4Zm6,9a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V9A1,1,0,0,1,3,8H9a1,1,0,0,1,1,1ZM6,13H6a1,1,0,0,1-1-1V10A1,1,0,0,1,6,9H6a1,1,0,0,1,1,1v2A1,1,0,0,1,6,13Z"
-      fill="#464646"
+        d="M10,6V4A4,4,0,0,0,2,4V6H2A2,2,0,0,0,0,8v6a2,2,0,0,0,2,2h8a2,2,0,0,0,2-2V8A2,2,0,0,0,10,6ZM4,4c0-1.65.35-2,2-2s2,.35,2,2V6H4Zm6,9a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V9A1,1,0,0,1,3,8H9a1,1,0,0,1,1,1ZM6,13H6a1,1,0,0,1-1-1V10A1,1,0,0,1,6,9H6a1,1,0,0,1,1,1v2A1,1,0,0,1,6,13Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 16"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M10,6V4A4,4,0,0,0,2,4V6H2A2,2,0,0,0,0,8v6a2,2,0,0,0,2,2h8a2,2,0,0,0,2-2V8A2,2,0,0,0,10,6ZM4,4c0-1.65.35-2,2-2s2,.35,2,2V6H4Zm6,9a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V9A1,1,0,0,1,3,8H9a1,1,0,0,1,1,1ZM6,13H6a1,1,0,0,1-1-1V10A1,1,0,0,1,6,9H6a1,1,0,0,1,1,1v2A1,1,0,0,1,6,13Z"
-      fill="#FFF"
+        d="M10,6V4A4,4,0,0,0,2,4V6H2A2,2,0,0,0,0,8v6a2,2,0,0,0,2,2h8a2,2,0,0,0,2-2V8A2,2,0,0,0,10,6ZM4,4c0-1.65.35-2,2-2s2,.35,2,2V6H4Zm6,9a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V9A1,1,0,0,1,3,8H9a1,1,0,0,1,1,1ZM6,13H6a1,1,0,0,1-1-1V10A1,1,0,0,1,6,9H6a1,1,0,0,1,1,1v2A1,1,0,0,1,6,13Z"
+        fill="#FFF"
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 16"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M10,6V4A4,4,0,0,0,2,4V6H2A2,2,0,0,0,0,8v6a2,2,0,0,0,2,2h8a2,2,0,0,0,2-2V8A2,2,0,0,0,10,6ZM4,4c0-1.65.35-2,2-2s2,.35,2,2V6H4Zm6,9a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V9A1,1,0,0,1,3,8H9a1,1,0,0,1,1,1ZM6,13H6a1,1,0,0,1-1-1V10A1,1,0,0,1,6,9H6a1,1,0,0,1,1,1v2A1,1,0,0,1,6,13Z"
-      fill={true}
+        d="M10,6V4A4,4,0,0,0,2,4V6H2A2,2,0,0,0,0,8v6a2,2,0,0,0,2,2h8a2,2,0,0,0,2-2V8A2,2,0,0,0,10,6ZM4,4c0-1.65.35-2,2-2s2,.35,2,2V6H4Zm6,9a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V9A1,1,0,0,1,3,8H9a1,1,0,0,1,1,1ZM6,13H6a1,1,0,0,1-1-1V10A1,1,0,0,1,6,9H6a1,1,0,0,1,1,1v2A1,1,0,0,1,6,13Z"
+        fill={undefined}
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 12 16"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M10,6V4A4,4,0,0,0,2,4V6H2A2,2,0,0,0,0,8v6a2,2,0,0,0,2,2h8a2,2,0,0,0,2-2V8A2,2,0,0,0,10,6ZM4,4c0-1.65.35-2,2-2s2,.35,2,2V6H4Zm6,9a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V9A1,1,0,0,1,3,8H9a1,1,0,0,1,1,1ZM6,13H6a1,1,0,0,1-1-1V10A1,1,0,0,1,6,9H6a1,1,0,0,1,1,1v2A1,1,0,0,1,6,13Z"
-      fill="#464646"
+        d="M10,6V4A4,4,0,0,0,2,4V6H2A2,2,0,0,0,0,8v6a2,2,0,0,0,2,2h8a2,2,0,0,0,2-2V8A2,2,0,0,0,10,6ZM4,4c0-1.65.35-2,2-2s2,.35,2,2V6H4Zm6,9a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V9A1,1,0,0,1,3,8H9a1,1,0,0,1,1,1ZM6,13H6a1,1,0,0,1-1-1V10A1,1,0,0,1,6,9H6a1,1,0,0,1,1,1v2A1,1,0,0,1,6,13Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 12 16"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M10,6V4A4,4,0,0,0,2,4V6H2A2,2,0,0,0,0,8v6a2,2,0,0,0,2,2h8a2,2,0,0,0,2-2V8A2,2,0,0,0,10,6ZM4,4c0-1.65.35-2,2-2s2,.35,2,2V6H4Zm6,9a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V9A1,1,0,0,1,3,8H9a1,1,0,0,1,1,1ZM6,13H6a1,1,0,0,1-1-1V10A1,1,0,0,1,6,9H6a1,1,0,0,1,1,1v2A1,1,0,0,1,6,13Z"
-      fill="#464646"
+        d="M10,6V4A4,4,0,0,0,2,4V6H2A2,2,0,0,0,0,8v6a2,2,0,0,0,2,2h8a2,2,0,0,0,2-2V8A2,2,0,0,0,10,6ZM4,4c0-1.65.35-2,2-2s2,.35,2,2V6H4Zm6,9a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V9A1,1,0,0,1,3,8H9a1,1,0,0,1,1,1ZM6,13H6a1,1,0,0,1-1-1V10A1,1,0,0,1,6,9H6a1,1,0,0,1,1,1v2A1,1,0,0,1,6,13Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 12 16"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M10,6V4A4,4,0,0,0,2,4V6H2A2,2,0,0,0,0,8v6a2,2,0,0,0,2,2h8a2,2,0,0,0,2-2V8A2,2,0,0,0,10,6ZM4,4c0-1.65.35-2,2-2s2,.35,2,2V6H4Zm6,9a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V9A1,1,0,0,1,3,8H9a1,1,0,0,1,1,1ZM6,13H6a1,1,0,0,1-1-1V10A1,1,0,0,1,6,9H6a1,1,0,0,1,1,1v2A1,1,0,0,1,6,13Z"
-      fill="#464646"
+        d="M10,6V4A4,4,0,0,0,2,4V6H2A2,2,0,0,0,0,8v6a2,2,0,0,0,2,2h8a2,2,0,0,0,2-2V8A2,2,0,0,0,10,6ZM4,4c0-1.65.35-2,2-2s2,.35,2,2V6H4Zm6,9a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V9A1,1,0,0,1,3,8H9a1,1,0,0,1,1,1ZM6,13H6a1,1,0,0,1-1-1V10A1,1,0,0,1,6,9H6a1,1,0,0,1,1,1v2A1,1,0,0,1,6,13Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 16"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M10,6V4A4,4,0,0,0,2,4V6H2A2,2,0,0,0,0,8v6a2,2,0,0,0,2,2h8a2,2,0,0,0,2-2V8A2,2,0,0,0,10,6ZM4,4c0-1.65.35-2,2-2s2,.35,2,2V6H4Zm6,9a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V9A1,1,0,0,1,3,8H9a1,1,0,0,1,1,1ZM6,13H6a1,1,0,0,1-1-1V10A1,1,0,0,1,6,9H6a1,1,0,0,1,1,1v2A1,1,0,0,1,6,13Z"
-      fill="#464646"
+        d="M10,6V4A4,4,0,0,0,2,4V6H2A2,2,0,0,0,0,8v6a2,2,0,0,0,2,2h8a2,2,0,0,0,2-2V8A2,2,0,0,0,10,6ZM4,4c0-1.65.35-2,2-2s2,.35,2,2V6H4Zm6,9a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V9A1,1,0,0,1,3,8H9a1,1,0,0,1,1,1ZM6,13H6a1,1,0,0,1-1-1V10A1,1,0,0,1,6,9H6a1,1,0,0,1,1,1v2A1,1,0,0,1,6,13Z"
+        fill="#464646"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Public /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 16"
     width="12"
-  >
+>
     <g>
-      <path
-        d="M6 13a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1 1 1 0 0 1 1 1v2a1 1 0 0 1-1 1zm4-7V4a4 4 0 0 0-8 0h2c0-1.65.35-2 2-2s2 .35 2 2v2H2a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2zm0 7a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1z"
-        fill="#464646"
-      />
+        <path
+            d="M6 13a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1 1 1 0 0 1 1 1v2a1 1 0 0 1-1 1zm4-7V4a4 4 0 0 0-8 0h2c0-1.65.35-2 2-2s2 .35 2 2v2H2a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2zm0 7a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1z"
+            fill="#464646"
+        />
     </g>
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 16"
     width="12"
-  >
+>
     <g>
-      <path
-        d="M6 13a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1 1 1 0 0 1 1 1v2a1 1 0 0 1-1 1zm4-7V4a4 4 0 0 0-8 0h2c0-1.65.35-2 2-2s2 .35 2 2v2H2a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2zm0 7a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1z"
-        fill="#FFF"
-      />
+        <path
+            d="M6 13a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1 1 1 0 0 1 1 1v2a1 1 0 0 1-1 1zm4-7V4a4 4 0 0 0-8 0h2c0-1.65.35-2 2-2s2 .35 2 2v2H2a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2zm0 7a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1z"
+            fill="#FFF"
+        />
     </g>
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 16"
     width="12"
-  >
+>
     <g>
-      <path
-        d="M6 13a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1 1 1 0 0 1 1 1v2a1 1 0 0 1-1 1zm4-7V4a4 4 0 0 0-8 0h2c0-1.65.35-2 2-2s2 .35 2 2v2H2a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2zm0 7a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1z"
-        fill={true}
-      />
+        <path
+            d="M6 13a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1 1 1 0 0 1 1 1v2a1 1 0 0 1-1 1zm4-7V4a4 4 0 0 0-8 0h2c0-1.65.35-2 2-2s2 .35 2 2v2H2a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2zm0 7a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1z"
+            fill={undefined}
+        />
     </g>
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 12 16"
     width="12"
-  >
+>
     <g>
-      <path
-        d="M6 13a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1 1 1 0 0 1 1 1v2a1 1 0 0 1-1 1zm4-7V4a4 4 0 0 0-8 0h2c0-1.65.35-2 2-2s2 .35 2 2v2H2a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2zm0 7a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1z"
-        fill="#464646"
-      />
+        <path
+            d="M6 13a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1 1 1 0 0 1 1 1v2a1 1 0 0 1-1 1zm4-7V4a4 4 0 0 0-8 0h2c0-1.65.35-2 2-2s2 .35 2 2v2H2a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2zm0 7a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1z"
+            fill="#464646"
+        />
     </g>
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 12 16"
     width="12"
-  >
+>
     <g>
-      <path
-        d="M6 13a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1 1 1 0 0 1 1 1v2a1 1 0 0 1-1 1zm4-7V4a4 4 0 0 0-8 0h2c0-1.65.35-2 2-2s2 .35 2 2v2H2a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2zm0 7a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1z"
-        fill="#464646"
-      />
+        <path
+            d="M6 13a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1 1 1 0 0 1 1 1v2a1 1 0 0 1-1 1zm4-7V4a4 4 0 0 0-8 0h2c0-1.65.35-2 2-2s2 .35 2 2v2H2a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2zm0 7a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1z"
+            fill="#464646"
+        />
     </g>
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 12 16"
     width="12"
-  >
+>
     <g>
-      <path
-        d="M6 13a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1 1 1 0 0 1 1 1v2a1 1 0 0 1-1 1zm4-7V4a4 4 0 0 0-8 0h2c0-1.65.35-2 2-2s2 .35 2 2v2H2a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2zm0 7a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1z"
-        fill="#464646"
-      />
+        <path
+            d="M6 13a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1 1 1 0 0 1 1 1v2a1 1 0 0 1-1 1zm4-7V4a4 4 0 0 0-8 0h2c0-1.65.35-2 2-2s2 .35 2 2v2H2a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2zm0 7a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1z"
+            fill="#464646"
+        />
     </g>
-  </svg>
+</svg>,
   <svg
     height="16"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 16"
     width="12"
-  >
+>
     <g>
-      <path
-        d="M6 13a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1 1 1 0 0 1 1 1v2a1 1 0 0 1-1 1zm4-7V4a4 4 0 0 0-8 0h2c0-1.65.35-2 2-2s2 .35 2 2v2H2a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2zm0 7a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1z"
-        fill="#464646"
-      />
+        <path
+            d="M6 13a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1 1 1 0 0 1 1 1v2a1 1 0 0 1-1 1zm4-7V4a4 4 0 0 0-8 0h2c0-1.65.35-2 2-2s2 .35 2 2v2H2a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2zm0 7a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1z"
+            fill="#464646"
+        />
     </g>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Randomize /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18.22 18.22"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <path
-      d="M6.32,1l4.55,5.31L5.56,10.87,1,5.56,6.32,1m0-1a1,1,0,0,0-.65.24L.35,4.8A1,1,0,0,0,.24,6.21L4.8,11.52a1,1,0,0,0,1.41.11l5.31-4.56a1,1,0,0,0,.11-1.4L7.07.35A1,1,0,0,0,6.32,0Zm4.14,8.65,6.76,1.81-1.8,6.76-6.77-1.8,1.81-6.77m0-1a1,1,0,0,0-1,.74l-1.8,6.77a1,1,0,0,0,.7,1.22l6.77,1.81a1.09,1.09,0,0,0,.26,0,1,1,0,0,0,1-.74l1.81-6.77a1,1,0,0,0-.71-1.22l-6.77-1.8a.73.73,0,0,0-.25,0ZM6.86,3.17a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.86,3.17Zm2,2.28A1,1,0,1,0,8.7,6.86,1,1,0,0,0,8.81,5.45Zm-2.28,2a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.53,7.4ZM4.58,5.12a1,1,0,1,0-.11,1.41A1,1,0,0,0,4.58,5.12Zm6.33,5.72a1,1,0,1,0,1.22-.71A1,1,0,0,0,10.91,10.84ZM13,14.51A1,1,0,1,0,15,15,1,1,0,0,0,13,14.51Z"
-      fill="#464646"
+        d="M6.32,1l4.55,5.31L5.56,10.87,1,5.56,6.32,1m0-1a1,1,0,0,0-.65.24L.35,4.8A1,1,0,0,0,.24,6.21L4.8,11.52a1,1,0,0,0,1.41.11l5.31-4.56a1,1,0,0,0,.11-1.4L7.07.35A1,1,0,0,0,6.32,0Zm4.14,8.65,6.76,1.81-1.8,6.76-6.77-1.8,1.81-6.77m0-1a1,1,0,0,0-1,.74l-1.8,6.77a1,1,0,0,0,.7,1.22l6.77,1.81a1.09,1.09,0,0,0,.26,0,1,1,0,0,0,1-.74l1.81-6.77a1,1,0,0,0-.71-1.22l-6.77-1.8a.73.73,0,0,0-.25,0ZM6.86,3.17a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.86,3.17Zm2,2.28A1,1,0,1,0,8.7,6.86,1,1,0,0,0,8.81,5.45Zm-2.28,2a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.53,7.4ZM4.58,5.12a1,1,0,1,0-.11,1.41A1,1,0,0,0,4.58,5.12Zm6.33,5.72a1,1,0,1,0,1.22-.71A1,1,0,0,0,10.91,10.84ZM13,14.51A1,1,0,1,0,15,15,1,1,0,0,0,13,14.51Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18.22 18.22"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <path
-      d="M6.32,1l4.55,5.31L5.56,10.87,1,5.56,6.32,1m0-1a1,1,0,0,0-.65.24L.35,4.8A1,1,0,0,0,.24,6.21L4.8,11.52a1,1,0,0,0,1.41.11l5.31-4.56a1,1,0,0,0,.11-1.4L7.07.35A1,1,0,0,0,6.32,0Zm4.14,8.65,6.76,1.81-1.8,6.76-6.77-1.8,1.81-6.77m0-1a1,1,0,0,0-1,.74l-1.8,6.77a1,1,0,0,0,.7,1.22l6.77,1.81a1.09,1.09,0,0,0,.26,0,1,1,0,0,0,1-.74l1.81-6.77a1,1,0,0,0-.71-1.22l-6.77-1.8a.73.73,0,0,0-.25,0ZM6.86,3.17a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.86,3.17Zm2,2.28A1,1,0,1,0,8.7,6.86,1,1,0,0,0,8.81,5.45Zm-2.28,2a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.53,7.4ZM4.58,5.12a1,1,0,1,0-.11,1.41A1,1,0,0,0,4.58,5.12Zm6.33,5.72a1,1,0,1,0,1.22-.71A1,1,0,0,0,10.91,10.84ZM13,14.51A1,1,0,1,0,15,15,1,1,0,0,0,13,14.51Z"
-      fill="#FFF"
+        d="M6.32,1l4.55,5.31L5.56,10.87,1,5.56,6.32,1m0-1a1,1,0,0,0-.65.24L.35,4.8A1,1,0,0,0,.24,6.21L4.8,11.52a1,1,0,0,0,1.41.11l5.31-4.56a1,1,0,0,0,.11-1.4L7.07.35A1,1,0,0,0,6.32,0Zm4.14,8.65,6.76,1.81-1.8,6.76-6.77-1.8,1.81-6.77m0-1a1,1,0,0,0-1,.74l-1.8,6.77a1,1,0,0,0,.7,1.22l6.77,1.81a1.09,1.09,0,0,0,.26,0,1,1,0,0,0,1-.74l1.81-6.77a1,1,0,0,0-.71-1.22l-6.77-1.8a.73.73,0,0,0-.25,0ZM6.86,3.17a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.86,3.17Zm2,2.28A1,1,0,1,0,8.7,6.86,1,1,0,0,0,8.81,5.45Zm-2.28,2a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.53,7.4ZM4.58,5.12a1,1,0,1,0-.11,1.41A1,1,0,0,0,4.58,5.12Zm6.33,5.72a1,1,0,1,0,1.22-.71A1,1,0,0,0,10.91,10.84ZM13,14.51A1,1,0,1,0,15,15,1,1,0,0,0,13,14.51Z"
+        fill="#FFF"
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18.22 18.22"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <path
-      d="M6.32,1l4.55,5.31L5.56,10.87,1,5.56,6.32,1m0-1a1,1,0,0,0-.65.24L.35,4.8A1,1,0,0,0,.24,6.21L4.8,11.52a1,1,0,0,0,1.41.11l5.31-4.56a1,1,0,0,0,.11-1.4L7.07.35A1,1,0,0,0,6.32,0Zm4.14,8.65,6.76,1.81-1.8,6.76-6.77-1.8,1.81-6.77m0-1a1,1,0,0,0-1,.74l-1.8,6.77a1,1,0,0,0,.7,1.22l6.77,1.81a1.09,1.09,0,0,0,.26,0,1,1,0,0,0,1-.74l1.81-6.77a1,1,0,0,0-.71-1.22l-6.77-1.8a.73.73,0,0,0-.25,0ZM6.86,3.17a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.86,3.17Zm2,2.28A1,1,0,1,0,8.7,6.86,1,1,0,0,0,8.81,5.45Zm-2.28,2a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.53,7.4ZM4.58,5.12a1,1,0,1,0-.11,1.41A1,1,0,0,0,4.58,5.12Zm6.33,5.72a1,1,0,1,0,1.22-.71A1,1,0,0,0,10.91,10.84ZM13,14.51A1,1,0,1,0,15,15,1,1,0,0,0,13,14.51Z"
-      fill={true}
+        d="M6.32,1l4.55,5.31L5.56,10.87,1,5.56,6.32,1m0-1a1,1,0,0,0-.65.24L.35,4.8A1,1,0,0,0,.24,6.21L4.8,11.52a1,1,0,0,0,1.41.11l5.31-4.56a1,1,0,0,0,.11-1.4L7.07.35A1,1,0,0,0,6.32,0Zm4.14,8.65,6.76,1.81-1.8,6.76-6.77-1.8,1.81-6.77m0-1a1,1,0,0,0-1,.74l-1.8,6.77a1,1,0,0,0,.7,1.22l6.77,1.81a1.09,1.09,0,0,0,.26,0,1,1,0,0,0,1-.74l1.81-6.77a1,1,0,0,0-.71-1.22l-6.77-1.8a.73.73,0,0,0-.25,0ZM6.86,3.17a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.86,3.17Zm2,2.28A1,1,0,1,0,8.7,6.86,1,1,0,0,0,8.81,5.45Zm-2.28,2a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.53,7.4ZM4.58,5.12a1,1,0,1,0-.11,1.41A1,1,0,0,0,4.58,5.12Zm6.33,5.72a1,1,0,1,0,1.22-.71A1,1,0,0,0,10.91,10.84ZM13,14.51A1,1,0,1,0,15,15,1,1,0,0,0,13,14.51Z"
+        fill={undefined}
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18.22 18.22"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <path
-      d="M6.32,1l4.55,5.31L5.56,10.87,1,5.56,6.32,1m0-1a1,1,0,0,0-.65.24L.35,4.8A1,1,0,0,0,.24,6.21L4.8,11.52a1,1,0,0,0,1.41.11l5.31-4.56a1,1,0,0,0,.11-1.4L7.07.35A1,1,0,0,0,6.32,0Zm4.14,8.65,6.76,1.81-1.8,6.76-6.77-1.8,1.81-6.77m0-1a1,1,0,0,0-1,.74l-1.8,6.77a1,1,0,0,0,.7,1.22l6.77,1.81a1.09,1.09,0,0,0,.26,0,1,1,0,0,0,1-.74l1.81-6.77a1,1,0,0,0-.71-1.22l-6.77-1.8a.73.73,0,0,0-.25,0ZM6.86,3.17a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.86,3.17Zm2,2.28A1,1,0,1,0,8.7,6.86,1,1,0,0,0,8.81,5.45Zm-2.28,2a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.53,7.4ZM4.58,5.12a1,1,0,1,0-.11,1.41A1,1,0,0,0,4.58,5.12Zm6.33,5.72a1,1,0,1,0,1.22-.71A1,1,0,0,0,10.91,10.84ZM13,14.51A1,1,0,1,0,15,15,1,1,0,0,0,13,14.51Z"
-      fill="#464646"
+        d="M6.32,1l4.55,5.31L5.56,10.87,1,5.56,6.32,1m0-1a1,1,0,0,0-.65.24L.35,4.8A1,1,0,0,0,.24,6.21L4.8,11.52a1,1,0,0,0,1.41.11l5.31-4.56a1,1,0,0,0,.11-1.4L7.07.35A1,1,0,0,0,6.32,0Zm4.14,8.65,6.76,1.81-1.8,6.76-6.77-1.8,1.81-6.77m0-1a1,1,0,0,0-1,.74l-1.8,6.77a1,1,0,0,0,.7,1.22l6.77,1.81a1.09,1.09,0,0,0,.26,0,1,1,0,0,0,1-.74l1.81-6.77a1,1,0,0,0-.71-1.22l-6.77-1.8a.73.73,0,0,0-.25,0ZM6.86,3.17a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.86,3.17Zm2,2.28A1,1,0,1,0,8.7,6.86,1,1,0,0,0,8.81,5.45Zm-2.28,2a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.53,7.4ZM4.58,5.12a1,1,0,1,0-.11,1.41A1,1,0,0,0,4.58,5.12Zm6.33,5.72a1,1,0,1,0,1.22-.71A1,1,0,0,0,10.91,10.84ZM13,14.51A1,1,0,1,0,15,15,1,1,0,0,0,13,14.51Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18.22 18.22"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <path
-      d="M6.32,1l4.55,5.31L5.56,10.87,1,5.56,6.32,1m0-1a1,1,0,0,0-.65.24L.35,4.8A1,1,0,0,0,.24,6.21L4.8,11.52a1,1,0,0,0,1.41.11l5.31-4.56a1,1,0,0,0,.11-1.4L7.07.35A1,1,0,0,0,6.32,0Zm4.14,8.65,6.76,1.81-1.8,6.76-6.77-1.8,1.81-6.77m0-1a1,1,0,0,0-1,.74l-1.8,6.77a1,1,0,0,0,.7,1.22l6.77,1.81a1.09,1.09,0,0,0,.26,0,1,1,0,0,0,1-.74l1.81-6.77a1,1,0,0,0-.71-1.22l-6.77-1.8a.73.73,0,0,0-.25,0ZM6.86,3.17a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.86,3.17Zm2,2.28A1,1,0,1,0,8.7,6.86,1,1,0,0,0,8.81,5.45Zm-2.28,2a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.53,7.4ZM4.58,5.12a1,1,0,1,0-.11,1.41A1,1,0,0,0,4.58,5.12Zm6.33,5.72a1,1,0,1,0,1.22-.71A1,1,0,0,0,10.91,10.84ZM13,14.51A1,1,0,1,0,15,15,1,1,0,0,0,13,14.51Z"
-      fill="#464646"
+        d="M6.32,1l4.55,5.31L5.56,10.87,1,5.56,6.32,1m0-1a1,1,0,0,0-.65.24L.35,4.8A1,1,0,0,0,.24,6.21L4.8,11.52a1,1,0,0,0,1.41.11l5.31-4.56a1,1,0,0,0,.11-1.4L7.07.35A1,1,0,0,0,6.32,0Zm4.14,8.65,6.76,1.81-1.8,6.76-6.77-1.8,1.81-6.77m0-1a1,1,0,0,0-1,.74l-1.8,6.77a1,1,0,0,0,.7,1.22l6.77,1.81a1.09,1.09,0,0,0,.26,0,1,1,0,0,0,1-.74l1.81-6.77a1,1,0,0,0-.71-1.22l-6.77-1.8a.73.73,0,0,0-.25,0ZM6.86,3.17a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.86,3.17Zm2,2.28A1,1,0,1,0,8.7,6.86,1,1,0,0,0,8.81,5.45Zm-2.28,2a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.53,7.4ZM4.58,5.12a1,1,0,1,0-.11,1.41A1,1,0,0,0,4.58,5.12Zm6.33,5.72a1,1,0,1,0,1.22-.71A1,1,0,0,0,10.91,10.84ZM13,14.51A1,1,0,1,0,15,15,1,1,0,0,0,13,14.51Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18.22 18.22"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <path
-      d="M6.32,1l4.55,5.31L5.56,10.87,1,5.56,6.32,1m0-1a1,1,0,0,0-.65.24L.35,4.8A1,1,0,0,0,.24,6.21L4.8,11.52a1,1,0,0,0,1.41.11l5.31-4.56a1,1,0,0,0,.11-1.4L7.07.35A1,1,0,0,0,6.32,0Zm4.14,8.65,6.76,1.81-1.8,6.76-6.77-1.8,1.81-6.77m0-1a1,1,0,0,0-1,.74l-1.8,6.77a1,1,0,0,0,.7,1.22l6.77,1.81a1.09,1.09,0,0,0,.26,0,1,1,0,0,0,1-.74l1.81-6.77a1,1,0,0,0-.71-1.22l-6.77-1.8a.73.73,0,0,0-.25,0ZM6.86,3.17a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.86,3.17Zm2,2.28A1,1,0,1,0,8.7,6.86,1,1,0,0,0,8.81,5.45Zm-2.28,2a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.53,7.4ZM4.58,5.12a1,1,0,1,0-.11,1.41A1,1,0,0,0,4.58,5.12Zm6.33,5.72a1,1,0,1,0,1.22-.71A1,1,0,0,0,10.91,10.84ZM13,14.51A1,1,0,1,0,15,15,1,1,0,0,0,13,14.51Z"
-      fill="#464646"
+        d="M6.32,1l4.55,5.31L5.56,10.87,1,5.56,6.32,1m0-1a1,1,0,0,0-.65.24L.35,4.8A1,1,0,0,0,.24,6.21L4.8,11.52a1,1,0,0,0,1.41.11l5.31-4.56a1,1,0,0,0,.11-1.4L7.07.35A1,1,0,0,0,6.32,0Zm4.14,8.65,6.76,1.81-1.8,6.76-6.77-1.8,1.81-6.77m0-1a1,1,0,0,0-1,.74l-1.8,6.77a1,1,0,0,0,.7,1.22l6.77,1.81a1.09,1.09,0,0,0,.26,0,1,1,0,0,0,1-.74l1.81-6.77a1,1,0,0,0-.71-1.22l-6.77-1.8a.73.73,0,0,0-.25,0ZM6.86,3.17a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.86,3.17Zm2,2.28A1,1,0,1,0,8.7,6.86,1,1,0,0,0,8.81,5.45Zm-2.28,2a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.53,7.4ZM4.58,5.12a1,1,0,1,0-.11,1.41A1,1,0,0,0,4.58,5.12Zm6.33,5.72a1,1,0,1,0,1.22-.71A1,1,0,0,0,10.91,10.84ZM13,14.51A1,1,0,1,0,15,15,1,1,0,0,0,13,14.51Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="17"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 18.22 18.22"
     width="17"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <path
-      d="M6.32,1l4.55,5.31L5.56,10.87,1,5.56,6.32,1m0-1a1,1,0,0,0-.65.24L.35,4.8A1,1,0,0,0,.24,6.21L4.8,11.52a1,1,0,0,0,1.41.11l5.31-4.56a1,1,0,0,0,.11-1.4L7.07.35A1,1,0,0,0,6.32,0Zm4.14,8.65,6.76,1.81-1.8,6.76-6.77-1.8,1.81-6.77m0-1a1,1,0,0,0-1,.74l-1.8,6.77a1,1,0,0,0,.7,1.22l6.77,1.81a1.09,1.09,0,0,0,.26,0,1,1,0,0,0,1-.74l1.81-6.77a1,1,0,0,0-.71-1.22l-6.77-1.8a.73.73,0,0,0-.25,0ZM6.86,3.17a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.86,3.17Zm2,2.28A1,1,0,1,0,8.7,6.86,1,1,0,0,0,8.81,5.45Zm-2.28,2a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.53,7.4ZM4.58,5.12a1,1,0,1,0-.11,1.41A1,1,0,0,0,4.58,5.12Zm6.33,5.72a1,1,0,1,0,1.22-.71A1,1,0,0,0,10.91,10.84ZM13,14.51A1,1,0,1,0,15,15,1,1,0,0,0,13,14.51Z"
-      fill="#464646"
+        d="M6.32,1l4.55,5.31L5.56,10.87,1,5.56,6.32,1m0-1a1,1,0,0,0-.65.24L.35,4.8A1,1,0,0,0,.24,6.21L4.8,11.52a1,1,0,0,0,1.41.11l5.31-4.56a1,1,0,0,0,.11-1.4L7.07.35A1,1,0,0,0,6.32,0Zm4.14,8.65,6.76,1.81-1.8,6.76-6.77-1.8,1.81-6.77m0-1a1,1,0,0,0-1,.74l-1.8,6.77a1,1,0,0,0,.7,1.22l6.77,1.81a1.09,1.09,0,0,0,.26,0,1,1,0,0,0,1-.74l1.81-6.77a1,1,0,0,0-.71-1.22l-6.77-1.8a.73.73,0,0,0-.25,0ZM6.86,3.17a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.86,3.17Zm2,2.28A1,1,0,1,0,8.7,6.86,1,1,0,0,0,8.81,5.45Zm-2.28,2a1,1,0,1,0-.11,1.41A1,1,0,0,0,6.53,7.4ZM4.58,5.12a1,1,0,1,0-.11,1.41A1,1,0,0,0,4.58,5.12Zm6.33,5.72a1,1,0,1,0,1.22-.71A1,1,0,0,0,10.91,10.84ZM13,14.51A1,1,0,1,0,15,15,1,1,0,0,0,13,14.51Z"
+        fill="#464646"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Reset /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="21"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 20 21"
     width="20"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17997 -18577)"
+        transform="translate(17997 -18577)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
-          xlinkHref="#K"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
+                xlinkHref="#K"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
-        fillRule="evenodd"
-        id="K"
-      />
+        <path
+            d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
+            fillRule="evenodd"
+            id="K"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="21"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 20 21"
     width="20"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17997 -18577)"
+        transform="translate(17997 -18577)"
     >
-      <g>
-        <use
-          fill="#FFF"
-          transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
-          xlinkHref="#K"
-        />
-      </g>
+        <g>
+            <use
+                fill="#FFF"
+                transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
+                xlinkHref="#K"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
-        fillRule="evenodd"
-        id="K"
-      />
+        <path
+            d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
+            fillRule="evenodd"
+            id="K"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="21"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 20 21"
     width="20"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17997 -18577)"
+        transform="translate(17997 -18577)"
     >
-      <g>
-        <use
-          fill={true}
-          transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
-          xlinkHref="#K"
-        />
-      </g>
+        <g>
+            <use
+                fill={undefined}
+                transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
+                xlinkHref="#K"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
-        fillRule="evenodd"
-        id="K"
-      />
+        <path
+            d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
+            fillRule="evenodd"
+            id="K"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="21"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 20 21"
     width="20"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17997 -18577)"
+        transform="translate(17997 -18577)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
-          xlinkHref="#K"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
+                xlinkHref="#K"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
-        fillRule="evenodd"
-        id="K"
-      />
+        <path
+            d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
+            fillRule="evenodd"
+            id="K"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="21"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 20 21"
     width="20"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17997 -18577)"
+        transform="translate(17997 -18577)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
-          xlinkHref="#K"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
+                xlinkHref="#K"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
-        fillRule="evenodd"
-        id="K"
-      />
+        <path
+            d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
+            fillRule="evenodd"
+            id="K"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="21"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 20 21"
     width="20"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17997 -18577)"
+        transform="translate(17997 -18577)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
-          xlinkHref="#K"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
+                xlinkHref="#K"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
-        fillRule="evenodd"
-        id="K"
-      />
+        <path
+            d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
+            fillRule="evenodd"
+            id="K"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="21"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 20 21"
     width="20"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(17997 -18577)"
+        transform="translate(17997 -18577)"
     >
-      <g>
-        <use
-          fill="#464646"
-          transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
-          xlinkHref="#K"
-        />
-      </g>
+        <g>
+            <use
+                fill="#464646"
+                transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
+                xlinkHref="#K"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
-        fillRule="evenodd"
-        id="K"
-      />
+        <path
+            d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
+            fillRule="evenodd"
+            id="K"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Restart /> without throwing 1`] = `
-<div>
+Array [
   <svg
+    colors={
+        Object {
+            "green": "#009858",
+            "greenDark": "#008138",
+            "orange": "#e38200",
+            "primary": "#3b46cc",
+            "text": "#464646",
+            "white": "#FFF",
+          }
+    }
     height="19"
     version="1.1"
     viewBox="0 0 16 19"
     width="16"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M 6.67853 4.42272L 6.67879 6.61018L 12.4032 3.30519L 6.67874 0L 6.67829 2.4743C 2.88206 3.15051 -0.000481996 6.46786 6.04528e-08 10.4594C -1.2363e-05 14.9384 3.63041 18.5685 8.10965 18.5692C 12.588 18.5682 16.2192 14.9381 16.2192 10.4592L 14.3115 10.46C 14.3108 13.8839 11.535 16.6615 8.10976 16.6612C 4.68462 16.6608 1.90795 13.8842 1.90764 10.4586C 1.90797 7.52657 3.94309 5.06834 6.67853 4.42272Z"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "rotate(30deg) translateX(1px) translateY(-1px)",
-          "transformOrigin": "50%",
+        colors={
+            Object {
+                "green": "#009858",
+                "greenDark": "#008138",
+                "orange": "#e38200",
+                "primary": "#3b46cc",
+                "text": "#464646",
+                "white": "#FFF",
+              }
         }
-      }
-      transform={true}
+        d="M 6.67853 4.42272L 6.67879 6.61018L 12.4032 3.30519L 6.67874 0L 6.67829 2.4743C 2.88206 3.15051 -0.000481996 6.46786 6.04528e-08 10.4594C -1.2363e-05 14.9384 3.63041 18.5685 8.10965 18.5692C 12.588 18.5682 16.2192 14.9381 16.2192 10.4592L 14.3115 10.46C 14.3108 13.8839 11.535 16.6615 8.10976 16.6612C 4.68462 16.6608 1.90795 13.8842 1.90764 10.4586C 1.90797 7.52657 3.94309 5.06834 6.67853 4.42272Z"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "rotate(30deg) translateX(1px) translateY(-1px)",
+                "transformOrigin": "50%",
+              }
+        }
+        transform={true}
     />
-  </svg>
+</svg>,
   <svg
+    colors={
+        Object {
+            "green": "#009858",
+            "greenDark": "#008138",
+            "orange": "#e38200",
+            "primary": "#3b46cc",
+            "text": "#464646",
+            "white": "#FFF",
+          }
+    }
     height="19"
     light={true}
     version="1.1"
     viewBox="0 0 16 19"
     width="16"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M 6.67853 4.42272L 6.67879 6.61018L 12.4032 3.30519L 6.67874 0L 6.67829 2.4743C 2.88206 3.15051 -0.000481996 6.46786 6.04528e-08 10.4594C -1.2363e-05 14.9384 3.63041 18.5685 8.10965 18.5692C 12.588 18.5682 16.2192 14.9381 16.2192 10.4592L 14.3115 10.46C 14.3108 13.8839 11.535 16.6615 8.10976 16.6612C 4.68462 16.6608 1.90795 13.8842 1.90764 10.4586C 1.90797 7.52657 3.94309 5.06834 6.67853 4.42272Z"
-      fill-rule="evenodd"
-      light={true}
-      style={
-        Object {
-          "transform": "rotate(30deg) translateX(1px) translateY(-1px)",
-          "transformOrigin": "50%",
+        colors={
+            Object {
+                "green": "#009858",
+                "greenDark": "#008138",
+                "orange": "#e38200",
+                "primary": "#3b46cc",
+                "text": "#464646",
+                "white": "#FFF",
+              }
         }
-      }
-      transform={true}
+        d="M 6.67853 4.42272L 6.67879 6.61018L 12.4032 3.30519L 6.67874 0L 6.67829 2.4743C 2.88206 3.15051 -0.000481996 6.46786 6.04528e-08 10.4594C -1.2363e-05 14.9384 3.63041 18.5685 8.10965 18.5692C 12.588 18.5682 16.2192 14.9381 16.2192 10.4592L 14.3115 10.46C 14.3108 13.8839 11.535 16.6615 8.10976 16.6612C 4.68462 16.6608 1.90795 13.8842 1.90764 10.4586C 1.90797 7.52657 3.94309 5.06834 6.67853 4.42272Z"
+        fill-rule="evenodd"
+        light={true}
+        style={
+            Object {
+                "transform": "rotate(30deg) translateX(1px) translateY(-1px)",
+                "transformOrigin": "50%",
+              }
+        }
+        transform={true}
     />
-  </svg>
+</svg>,
   <svg
+    colors={
+        Object {
+            "green": "#009858",
+            "greenDark": "#008138",
+            "orange": "#e38200",
+            "primary": "#3b46cc",
+            "text": "#464646",
+            "white": "#FFF",
+          }
+    }
     disabled={true}
     height="19"
     version="1.1"
     viewBox="0 0 16 19"
     width="16"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M 6.67853 4.42272L 6.67879 6.61018L 12.4032 3.30519L 6.67874 0L 6.67829 2.4743C 2.88206 3.15051 -0.000481996 6.46786 6.04528e-08 10.4594C -1.2363e-05 14.9384 3.63041 18.5685 8.10965 18.5692C 12.588 18.5682 16.2192 14.9381 16.2192 10.4592L 14.3115 10.46C 14.3108 13.8839 11.535 16.6615 8.10976 16.6612C 4.68462 16.6608 1.90795 13.8842 1.90764 10.4586C 1.90797 7.52657 3.94309 5.06834 6.67853 4.42272Z"
-      disabled={true}
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "rotate(30deg) translateX(1px) translateY(-1px)",
-          "transformOrigin": "50%",
+        colors={
+            Object {
+                "green": "#009858",
+                "greenDark": "#008138",
+                "orange": "#e38200",
+                "primary": "#3b46cc",
+                "text": "#464646",
+                "white": "#FFF",
+              }
         }
-      }
-      transform={true}
+        d="M 6.67853 4.42272L 6.67879 6.61018L 12.4032 3.30519L 6.67874 0L 6.67829 2.4743C 2.88206 3.15051 -0.000481996 6.46786 6.04528e-08 10.4594C -1.2363e-05 14.9384 3.63041 18.5685 8.10965 18.5692C 12.588 18.5682 16.2192 14.9381 16.2192 10.4592L 14.3115 10.46C 14.3108 13.8839 11.535 16.6615 8.10976 16.6612C 4.68462 16.6608 1.90795 13.8842 1.90764 10.4586C 1.90797 7.52657 3.94309 5.06834 6.67853 4.42272Z"
+        disabled={true}
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "rotate(30deg) translateX(1px) translateY(-1px)",
+                "transformOrigin": "50%",
+              }
+        }
+        transform={true}
     />
-  </svg>
+</svg>,
   <svg
+    colors={
+        Object {
+            "green": "#009858",
+            "greenDark": "#008138",
+            "orange": "#e38200",
+            "primary": "#3b46cc",
+            "text": "#464646",
+            "white": "#FFF",
+          }
+    }
     direction="right"
     height="19"
     version="1.1"
     viewBox="0 0 16 19"
     width="16"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M 6.67853 4.42272L 6.67879 6.61018L 12.4032 3.30519L 6.67874 0L 6.67829 2.4743C 2.88206 3.15051 -0.000481996 6.46786 6.04528e-08 10.4594C -1.2363e-05 14.9384 3.63041 18.5685 8.10965 18.5692C 12.588 18.5682 16.2192 14.9381 16.2192 10.4592L 14.3115 10.46C 14.3108 13.8839 11.535 16.6615 8.10976 16.6612C 4.68462 16.6608 1.90795 13.8842 1.90764 10.4586C 1.90797 7.52657 3.94309 5.06834 6.67853 4.42272Z"
-      direction="right"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "rotate(30deg) translateX(1px) translateY(-1px)",
-          "transformOrigin": "50%",
+        colors={
+            Object {
+                "green": "#009858",
+                "greenDark": "#008138",
+                "orange": "#e38200",
+                "primary": "#3b46cc",
+                "text": "#464646",
+                "white": "#FFF",
+              }
         }
-      }
-      transform={true}
+        d="M 6.67853 4.42272L 6.67879 6.61018L 12.4032 3.30519L 6.67874 0L 6.67829 2.4743C 2.88206 3.15051 -0.000481996 6.46786 6.04528e-08 10.4594C -1.2363e-05 14.9384 3.63041 18.5685 8.10965 18.5692C 12.588 18.5682 16.2192 14.9381 16.2192 10.4592L 14.3115 10.46C 14.3108 13.8839 11.535 16.6615 8.10976 16.6612C 4.68462 16.6608 1.90795 13.8842 1.90764 10.4586C 1.90797 7.52657 3.94309 5.06834 6.67853 4.42272Z"
+        direction="right"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "rotate(30deg) translateX(1px) translateY(-1px)",
+                "transformOrigin": "50%",
+              }
+        }
+        transform={true}
     />
-  </svg>
+</svg>,
   <svg
+    colors={
+        Object {
+            "green": "#009858",
+            "greenDark": "#008138",
+            "orange": "#e38200",
+            "primary": "#3b46cc",
+            "text": "#464646",
+            "white": "#FFF",
+          }
+    }
     direction="up"
     height="19"
     version="1.1"
     viewBox="0 0 16 19"
     width="16"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M 6.67853 4.42272L 6.67879 6.61018L 12.4032 3.30519L 6.67874 0L 6.67829 2.4743C 2.88206 3.15051 -0.000481996 6.46786 6.04528e-08 10.4594C -1.2363e-05 14.9384 3.63041 18.5685 8.10965 18.5692C 12.588 18.5682 16.2192 14.9381 16.2192 10.4592L 14.3115 10.46C 14.3108 13.8839 11.535 16.6615 8.10976 16.6612C 4.68462 16.6608 1.90795 13.8842 1.90764 10.4586C 1.90797 7.52657 3.94309 5.06834 6.67853 4.42272Z"
-      direction="up"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "rotate(30deg) translateX(1px) translateY(-1px)",
-          "transformOrigin": "50%",
+        colors={
+            Object {
+                "green": "#009858",
+                "greenDark": "#008138",
+                "orange": "#e38200",
+                "primary": "#3b46cc",
+                "text": "#464646",
+                "white": "#FFF",
+              }
         }
-      }
-      transform={true}
+        d="M 6.67853 4.42272L 6.67879 6.61018L 12.4032 3.30519L 6.67874 0L 6.67829 2.4743C 2.88206 3.15051 -0.000481996 6.46786 6.04528e-08 10.4594C -1.2363e-05 14.9384 3.63041 18.5685 8.10965 18.5692C 12.588 18.5682 16.2192 14.9381 16.2192 10.4592L 14.3115 10.46C 14.3108 13.8839 11.535 16.6615 8.10976 16.6612C 4.68462 16.6608 1.90795 13.8842 1.90764 10.4586C 1.90797 7.52657 3.94309 5.06834 6.67853 4.42272Z"
+        direction="up"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "rotate(30deg) translateX(1px) translateY(-1px)",
+                "transformOrigin": "50%",
+              }
+        }
+        transform={true}
     />
-  </svg>
+</svg>,
   <svg
+    colors={
+        Object {
+            "green": "#009858",
+            "greenDark": "#008138",
+            "orange": "#e38200",
+            "primary": "#3b46cc",
+            "text": "#464646",
+            "white": "#FFF",
+          }
+    }
     direction="left"
     height="19"
     version="1.1"
     viewBox="0 0 16 19"
     width="16"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M 6.67853 4.42272L 6.67879 6.61018L 12.4032 3.30519L 6.67874 0L 6.67829 2.4743C 2.88206 3.15051 -0.000481996 6.46786 6.04528e-08 10.4594C -1.2363e-05 14.9384 3.63041 18.5685 8.10965 18.5692C 12.588 18.5682 16.2192 14.9381 16.2192 10.4592L 14.3115 10.46C 14.3108 13.8839 11.535 16.6615 8.10976 16.6612C 4.68462 16.6608 1.90795 13.8842 1.90764 10.4586C 1.90797 7.52657 3.94309 5.06834 6.67853 4.42272Z"
-      direction="left"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "rotate(30deg) translateX(1px) translateY(-1px)",
-          "transformOrigin": "50%",
+        colors={
+            Object {
+                "green": "#009858",
+                "greenDark": "#008138",
+                "orange": "#e38200",
+                "primary": "#3b46cc",
+                "text": "#464646",
+                "white": "#FFF",
+              }
         }
-      }
-      transform={true}
+        d="M 6.67853 4.42272L 6.67879 6.61018L 12.4032 3.30519L 6.67874 0L 6.67829 2.4743C 2.88206 3.15051 -0.000481996 6.46786 6.04528e-08 10.4594C -1.2363e-05 14.9384 3.63041 18.5685 8.10965 18.5692C 12.588 18.5682 16.2192 14.9381 16.2192 10.4592L 14.3115 10.46C 14.3108 13.8839 11.535 16.6615 8.10976 16.6612C 4.68462 16.6608 1.90795 13.8842 1.90764 10.4586C 1.90797 7.52657 3.94309 5.06834 6.67853 4.42272Z"
+        direction="left"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "rotate(30deg) translateX(1px) translateY(-1px)",
+                "transformOrigin": "50%",
+              }
+        }
+        transform={true}
     />
-  </svg>
+</svg>,
   <svg
+    colors={
+        Object {
+            "green": "#009858",
+            "greenDark": "#008138",
+            "orange": "#e38200",
+            "primary": "#3b46cc",
+            "text": "#464646",
+            "white": "#FFF",
+          }
+    }
     direction="down"
     height="19"
     version="1.1"
     viewBox="0 0 16 19"
     width="16"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M 6.67853 4.42272L 6.67879 6.61018L 12.4032 3.30519L 6.67874 0L 6.67829 2.4743C 2.88206 3.15051 -0.000481996 6.46786 6.04528e-08 10.4594C -1.2363e-05 14.9384 3.63041 18.5685 8.10965 18.5692C 12.588 18.5682 16.2192 14.9381 16.2192 10.4592L 14.3115 10.46C 14.3108 13.8839 11.535 16.6615 8.10976 16.6612C 4.68462 16.6608 1.90795 13.8842 1.90764 10.4586C 1.90797 7.52657 3.94309 5.06834 6.67853 4.42272Z"
-      direction="down"
-      fill-rule="evenodd"
-      style={
-        Object {
-          "transform": "rotate(30deg) translateX(1px) translateY(-1px)",
-          "transformOrigin": "50%",
+        colors={
+            Object {
+                "green": "#009858",
+                "greenDark": "#008138",
+                "orange": "#e38200",
+                "primary": "#3b46cc",
+                "text": "#464646",
+                "white": "#FFF",
+              }
         }
-      }
-      transform={true}
+        d="M 6.67853 4.42272L 6.67879 6.61018L 12.4032 3.30519L 6.67874 0L 6.67829 2.4743C 2.88206 3.15051 -0.000481996 6.46786 6.04528e-08 10.4594C -1.2363e-05 14.9384 3.63041 18.5685 8.10965 18.5692C 12.588 18.5682 16.2192 14.9381 16.2192 10.4592L 14.3115 10.46C 14.3108 13.8839 11.535 16.6615 8.10976 16.6612C 4.68462 16.6608 1.90795 13.8842 1.90764 10.4586C 1.90797 7.52657 3.94309 5.06834 6.67853 4.42272Z"
+        direction="down"
+        fill-rule="evenodd"
+        style={
+            Object {
+                "transform": "rotate(30deg) translateX(1px) translateY(-1px)",
+                "transformOrigin": "50%",
+              }
+        }
+        transform={true}
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Start /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="15"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     width="15"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(18292 -19563)"
+        transform="translate(18292 -19563)"
     >
-      <mask
-        id="L"
-      >
-        <rect
-          fill="#fff"
-          height={15}
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          width={15}
-          x={-1}
-          y={-1}
-        />
-        <use
-          fill="#000"
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          xlinkHref="#M"
-        />
-      </mask>
-      <g
-        mask="url(#L"
-      >
-        <use
-          fill="#464646"
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          xlinkHref="#N"
-        />
-      </g>
+        <mask
+            id="L"
+        >
+            <rect
+                fill="#fff"
+                height={15}
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                width={15}
+                x={-1}
+                y={-1}
+            />
+            <use
+                fill="#000"
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                xlinkHref="#M"
+            />
+        </mask>
+        <g
+            mask="url(#L"
+        >
+            <use
+                fill="#464646"
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                xlinkHref="#N"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
-        id="M"
-      />
-      <path
-        d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
-        id="N"
-      />
+        <path
+            d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
+            id="M"
+        />
+        <path
+            d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
+            id="N"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="15"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     width="15"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(18292 -19563)"
+        transform="translate(18292 -19563)"
     >
-      <mask
-        id="L"
-      >
-        <rect
-          fill="#fff"
-          height={15}
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          width={15}
-          x={-1}
-          y={-1}
-        />
-        <use
-          fill="#000"
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          xlinkHref="#M"
-        />
-      </mask>
-      <g
-        mask="url(#L"
-      >
-        <use
-          fill="#FFF"
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          xlinkHref="#N"
-        />
-      </g>
+        <mask
+            id="L"
+        >
+            <rect
+                fill="#fff"
+                height={15}
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                width={15}
+                x={-1}
+                y={-1}
+            />
+            <use
+                fill="#000"
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                xlinkHref="#M"
+            />
+        </mask>
+        <g
+            mask="url(#L"
+        >
+            <use
+                fill="#FFF"
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                xlinkHref="#N"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
-        id="M"
-      />
-      <path
-        d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
-        id="N"
-      />
+        <path
+            d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
+            id="M"
+        />
+        <path
+            d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
+            id="N"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="15"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     width="15"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(18292 -19563)"
+        transform="translate(18292 -19563)"
     >
-      <mask
-        id="L"
-      >
-        <rect
-          fill="#fff"
-          height={15}
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          width={15}
-          x={-1}
-          y={-1}
-        />
-        <use
-          fill="#000"
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          xlinkHref="#M"
-        />
-      </mask>
-      <g
-        mask="url(#L"
-      >
-        <use
-          fill={true}
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          xlinkHref="#N"
-        />
-      </g>
+        <mask
+            id="L"
+        >
+            <rect
+                fill="#fff"
+                height={15}
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                width={15}
+                x={-1}
+                y={-1}
+            />
+            <use
+                fill="#000"
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                xlinkHref="#M"
+            />
+        </mask>
+        <g
+            mask="url(#L"
+        >
+            <use
+                fill={undefined}
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                xlinkHref="#N"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
-        id="M"
-      />
-      <path
-        d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
-        id="N"
-      />
+        <path
+            d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
+            id="M"
+        />
+        <path
+            d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
+            id="N"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="15"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     width="15"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(18292 -19563)"
+        transform="translate(18292 -19563)"
     >
-      <mask
-        id="L"
-      >
-        <rect
-          fill="#fff"
-          height={15}
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          width={15}
-          x={-1}
-          y={-1}
-        />
-        <use
-          fill="#000"
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          xlinkHref="#M"
-        />
-      </mask>
-      <g
-        mask="url(#L"
-      >
-        <use
-          fill="#464646"
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          xlinkHref="#N"
-        />
-      </g>
+        <mask
+            id="L"
+        >
+            <rect
+                fill="#fff"
+                height={15}
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                width={15}
+                x={-1}
+                y={-1}
+            />
+            <use
+                fill="#000"
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                xlinkHref="#M"
+            />
+        </mask>
+        <g
+            mask="url(#L"
+        >
+            <use
+                fill="#464646"
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                xlinkHref="#N"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
-        id="M"
-      />
-      <path
-        d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
-        id="N"
-      />
+        <path
+            d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
+            id="M"
+        />
+        <path
+            d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
+            id="N"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="15"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     width="15"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(18292 -19563)"
+        transform="translate(18292 -19563)"
     >
-      <mask
-        id="L"
-      >
-        <rect
-          fill="#fff"
-          height={15}
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          width={15}
-          x={-1}
-          y={-1}
-        />
-        <use
-          fill="#000"
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          xlinkHref="#M"
-        />
-      </mask>
-      <g
-        mask="url(#L"
-      >
-        <use
-          fill="#464646"
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          xlinkHref="#N"
-        />
-      </g>
+        <mask
+            id="L"
+        >
+            <rect
+                fill="#fff"
+                height={15}
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                width={15}
+                x={-1}
+                y={-1}
+            />
+            <use
+                fill="#000"
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                xlinkHref="#M"
+            />
+        </mask>
+        <g
+            mask="url(#L"
+        >
+            <use
+                fill="#464646"
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                xlinkHref="#N"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
-        id="M"
-      />
-      <path
-        d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
-        id="N"
-      />
+        <path
+            d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
+            id="M"
+        />
+        <path
+            d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
+            id="N"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="15"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     width="15"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(18292 -19563)"
+        transform="translate(18292 -19563)"
     >
-      <mask
-        id="L"
-      >
-        <rect
-          fill="#fff"
-          height={15}
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          width={15}
-          x={-1}
-          y={-1}
-        />
-        <use
-          fill="#000"
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          xlinkHref="#M"
-        />
-      </mask>
-      <g
-        mask="url(#L"
-      >
-        <use
-          fill="#464646"
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          xlinkHref="#N"
-        />
-      </g>
+        <mask
+            id="L"
+        >
+            <rect
+                fill="#fff"
+                height={15}
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                width={15}
+                x={-1}
+                y={-1}
+            />
+            <use
+                fill="#000"
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                xlinkHref="#M"
+            />
+        </mask>
+        <g
+            mask="url(#L"
+        >
+            <use
+                fill="#464646"
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                xlinkHref="#N"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
-        id="M"
-      />
-      <path
-        d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
-        id="N"
-      />
+        <path
+            d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
+            id="M"
+        />
+        <path
+            d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
+            id="N"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="15"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     width="15"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(18292 -19563)"
+        transform="translate(18292 -19563)"
     >
-      <mask
-        id="L"
-      >
-        <rect
-          fill="#fff"
-          height={15}
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          width={15}
-          x={-1}
-          y={-1}
-        />
-        <use
-          fill="#000"
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          xlinkHref="#M"
-        />
-      </mask>
-      <g
-        mask="url(#L"
-      >
-        <use
-          fill="#464646"
-          transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-          xlinkHref="#N"
-        />
-      </g>
+        <mask
+            id="L"
+        >
+            <rect
+                fill="#fff"
+                height={15}
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                width={15}
+                x={-1}
+                y={-1}
+            />
+            <use
+                fill="#000"
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                xlinkHref="#M"
+            />
+        </mask>
+        <g
+            mask="url(#L"
+        >
+            <use
+                fill="#464646"
+                transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                xlinkHref="#N"
+            />
+        </g>
     </g>
     <defs>
-      <path
-        d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
-        id="M"
-      />
-      <path
-        d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
-        id="N"
-      />
+        <path
+            d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
+            id="M"
+        />
+        <path
+            d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
+            id="N"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Stop /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="14"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 14 14"
     width="14"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(18113 -18582)"
+        transform="translate(18113 -18582)"
     >
-      <g>
-        <mask
-          id="O"
-        >
-          <use
-            fill="white"
-            transform="translate(-18113 18582)"
-            xlinkHref="#P"
-          />
-        </mask>
-        <g
-          mask="url(#O)"
-        >
-          <use
-            fill="#464646"
-            transform="translate(-18113 18582)"
-            xlinkHref="#Q"
-          />
+        <g>
+            <mask
+                id="O"
+            >
+                <use
+                    fill="white"
+                    transform="translate(-18113 18582)"
+                    xlinkHref="#P"
+                />
+            </mask>
+            <g
+                mask="url(#O)"
+            >
+                <use
+                    fill="#464646"
+                    transform="translate(-18113 18582)"
+                    xlinkHref="#Q"
+                />
+            </g>
         </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
-        id="P"
-      />
-      <path
-        d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
-        id="Q"
-      />
+        <path
+            d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
+            id="P"
+        />
+        <path
+            d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
+            id="Q"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="14"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 14 14"
     width="14"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(18113 -18582)"
+        transform="translate(18113 -18582)"
     >
-      <g>
-        <mask
-          id="O"
-        >
-          <use
-            fill="white"
-            transform="translate(-18113 18582)"
-            xlinkHref="#P"
-          />
-        </mask>
-        <g
-          mask="url(#O)"
-        >
-          <use
-            fill="#FFF"
-            transform="translate(-18113 18582)"
-            xlinkHref="#Q"
-          />
+        <g>
+            <mask
+                id="O"
+            >
+                <use
+                    fill="white"
+                    transform="translate(-18113 18582)"
+                    xlinkHref="#P"
+                />
+            </mask>
+            <g
+                mask="url(#O)"
+            >
+                <use
+                    fill="#FFF"
+                    transform="translate(-18113 18582)"
+                    xlinkHref="#Q"
+                />
+            </g>
         </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
-        id="P"
-      />
-      <path
-        d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
-        id="Q"
-      />
+        <path
+            d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
+            id="P"
+        />
+        <path
+            d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
+            id="Q"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="14"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 14 14"
     width="14"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(18113 -18582)"
+        transform="translate(18113 -18582)"
     >
-      <g>
-        <mask
-          id="O"
-        >
-          <use
-            fill="white"
-            transform="translate(-18113 18582)"
-            xlinkHref="#P"
-          />
-        </mask>
-        <g
-          mask="url(#O)"
-        >
-          <use
-            fill={true}
-            transform="translate(-18113 18582)"
-            xlinkHref="#Q"
-          />
+        <g>
+            <mask
+                id="O"
+            >
+                <use
+                    fill="white"
+                    transform="translate(-18113 18582)"
+                    xlinkHref="#P"
+                />
+            </mask>
+            <g
+                mask="url(#O)"
+            >
+                <use
+                    fill={undefined}
+                    transform="translate(-18113 18582)"
+                    xlinkHref="#Q"
+                />
+            </g>
         </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
-        id="P"
-      />
-      <path
-        d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
-        id="Q"
-      />
+        <path
+            d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
+            id="P"
+        />
+        <path
+            d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
+            id="Q"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="14"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 14 14"
     width="14"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(18113 -18582)"
+        transform="translate(18113 -18582)"
     >
-      <g>
-        <mask
-          id="O"
-        >
-          <use
-            fill="white"
-            transform="translate(-18113 18582)"
-            xlinkHref="#P"
-          />
-        </mask>
-        <g
-          mask="url(#O)"
-        >
-          <use
-            fill="#464646"
-            transform="translate(-18113 18582)"
-            xlinkHref="#Q"
-          />
+        <g>
+            <mask
+                id="O"
+            >
+                <use
+                    fill="white"
+                    transform="translate(-18113 18582)"
+                    xlinkHref="#P"
+                />
+            </mask>
+            <g
+                mask="url(#O)"
+            >
+                <use
+                    fill="#464646"
+                    transform="translate(-18113 18582)"
+                    xlinkHref="#Q"
+                />
+            </g>
         </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
-        id="P"
-      />
-      <path
-        d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
-        id="Q"
-      />
+        <path
+            d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
+            id="P"
+        />
+        <path
+            d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
+            id="Q"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="14"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 14 14"
     width="14"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(18113 -18582)"
+        transform="translate(18113 -18582)"
     >
-      <g>
-        <mask
-          id="O"
-        >
-          <use
-            fill="white"
-            transform="translate(-18113 18582)"
-            xlinkHref="#P"
-          />
-        </mask>
-        <g
-          mask="url(#O)"
-        >
-          <use
-            fill="#464646"
-            transform="translate(-18113 18582)"
-            xlinkHref="#Q"
-          />
+        <g>
+            <mask
+                id="O"
+            >
+                <use
+                    fill="white"
+                    transform="translate(-18113 18582)"
+                    xlinkHref="#P"
+                />
+            </mask>
+            <g
+                mask="url(#O)"
+            >
+                <use
+                    fill="#464646"
+                    transform="translate(-18113 18582)"
+                    xlinkHref="#Q"
+                />
+            </g>
         </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
-        id="P"
-      />
-      <path
-        d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
-        id="Q"
-      />
+        <path
+            d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
+            id="P"
+        />
+        <path
+            d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
+            id="Q"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="14"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 14 14"
     width="14"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(18113 -18582)"
+        transform="translate(18113 -18582)"
     >
-      <g>
-        <mask
-          id="O"
-        >
-          <use
-            fill="white"
-            transform="translate(-18113 18582)"
-            xlinkHref="#P"
-          />
-        </mask>
-        <g
-          mask="url(#O)"
-        >
-          <use
-            fill="#464646"
-            transform="translate(-18113 18582)"
-            xlinkHref="#Q"
-          />
+        <g>
+            <mask
+                id="O"
+            >
+                <use
+                    fill="white"
+                    transform="translate(-18113 18582)"
+                    xlinkHref="#P"
+                />
+            </mask>
+            <g
+                mask="url(#O)"
+            >
+                <use
+                    fill="#464646"
+                    transform="translate(-18113 18582)"
+                    xlinkHref="#Q"
+                />
+            </g>
         </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
-        id="P"
-      />
-      <path
-        d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
-        id="Q"
-      />
+        <path
+            d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
+            id="P"
+        />
+        <path
+            d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
+            id="Q"
+        />
     </defs>
-  </svg>
+</svg>,
   <svg
     height="14"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     version="1.1"
     viewBox="0 0 14 14"
     width="14"
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
-  >
+>
     <g
-      transform="translate(18113 -18582)"
+        transform="translate(18113 -18582)"
     >
-      <g>
-        <mask
-          id="O"
-        >
-          <use
-            fill="white"
-            transform="translate(-18113 18582)"
-            xlinkHref="#P"
-          />
-        </mask>
-        <g
-          mask="url(#O)"
-        >
-          <use
-            fill="#464646"
-            transform="translate(-18113 18582)"
-            xlinkHref="#Q"
-          />
+        <g>
+            <mask
+                id="O"
+            >
+                <use
+                    fill="white"
+                    transform="translate(-18113 18582)"
+                    xlinkHref="#P"
+                />
+            </mask>
+            <g
+                mask="url(#O)"
+            >
+                <use
+                    fill="#464646"
+                    transform="translate(-18113 18582)"
+                    xlinkHref="#Q"
+                />
+            </g>
         </g>
-      </g>
     </g>
     <defs>
-      <path
-        d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
-        id="P"
-      />
-      <path
-        d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
-        id="Q"
-      />
+        <path
+            d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
+            id="P"
+        />
+        <path
+            d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
+            id="Q"
+        />
     </defs>
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Storage /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="22"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 22 22"
     width="22"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M17,16a1,1,0,1,1,1,1A1,1,0,0,1,17,16ZM7,17H8V15H7ZM5,17H6V15H5ZM3,17H4V15H3Zm14-7a1,1,0,1,1,1,1A1,1,0,0,1,17,10ZM7,11H8V9H7ZM5,11H6V9H5ZM3,11H4V9H3ZM19,4a1,1,0,1,1-1-1A1,1,0,0,1,19,4ZM7,5H8V3H7ZM5,5H6V3H5ZM3,5H4V3H3ZM22,2a2,2,0,0,0-2-2H2A2,2,0,0,0,0,2V6A1.91,1.91,0,0,0,.28,7,1.88,1.88,0,0,0,0,8v4a1.91,1.91,0,0,0,.28,1A1.88,1.88,0,0,0,0,14v4a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V14a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,12V8a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,6ZM20,18H2V14H20Zm0-6H2V8H20Zm0-6H2V2H20Z"
-      fill="#464646"
+        d="M17,16a1,1,0,1,1,1,1A1,1,0,0,1,17,16ZM7,17H8V15H7ZM5,17H6V15H5ZM3,17H4V15H3Zm14-7a1,1,0,1,1,1,1A1,1,0,0,1,17,10ZM7,11H8V9H7ZM5,11H6V9H5ZM3,11H4V9H3ZM19,4a1,1,0,1,1-1-1A1,1,0,0,1,19,4ZM7,5H8V3H7ZM5,5H6V3H5ZM3,5H4V3H3ZM22,2a2,2,0,0,0-2-2H2A2,2,0,0,0,0,2V6A1.91,1.91,0,0,0,.28,7,1.88,1.88,0,0,0,0,8v4a1.91,1.91,0,0,0,.28,1A1.88,1.88,0,0,0,0,14v4a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V14a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,12V8a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,6ZM20,18H2V14H20Zm0-6H2V8H20Zm0-6H2V2H20Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="22"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 22 22"
     width="22"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M17,16a1,1,0,1,1,1,1A1,1,0,0,1,17,16ZM7,17H8V15H7ZM5,17H6V15H5ZM3,17H4V15H3Zm14-7a1,1,0,1,1,1,1A1,1,0,0,1,17,10ZM7,11H8V9H7ZM5,11H6V9H5ZM3,11H4V9H3ZM19,4a1,1,0,1,1-1-1A1,1,0,0,1,19,4ZM7,5H8V3H7ZM5,5H6V3H5ZM3,5H4V3H3ZM22,2a2,2,0,0,0-2-2H2A2,2,0,0,0,0,2V6A1.91,1.91,0,0,0,.28,7,1.88,1.88,0,0,0,0,8v4a1.91,1.91,0,0,0,.28,1A1.88,1.88,0,0,0,0,14v4a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V14a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,12V8a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,6ZM20,18H2V14H20Zm0-6H2V8H20Zm0-6H2V2H20Z"
-      fill="#FFF"
+        d="M17,16a1,1,0,1,1,1,1A1,1,0,0,1,17,16ZM7,17H8V15H7ZM5,17H6V15H5ZM3,17H4V15H3Zm14-7a1,1,0,1,1,1,1A1,1,0,0,1,17,10ZM7,11H8V9H7ZM5,11H6V9H5ZM3,11H4V9H3ZM19,4a1,1,0,1,1-1-1A1,1,0,0,1,19,4ZM7,5H8V3H7ZM5,5H6V3H5ZM3,5H4V3H3ZM22,2a2,2,0,0,0-2-2H2A2,2,0,0,0,0,2V6A1.91,1.91,0,0,0,.28,7,1.88,1.88,0,0,0,0,8v4a1.91,1.91,0,0,0,.28,1A1.88,1.88,0,0,0,0,14v4a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V14a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,12V8a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,6ZM20,18H2V14H20Zm0-6H2V8H20Zm0-6H2V2H20Z"
+        fill="#FFF"
     />
-  </svg>
+</svg>,
   <svg
     height="22"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 22 22"
     width="22"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M17,16a1,1,0,1,1,1,1A1,1,0,0,1,17,16ZM7,17H8V15H7ZM5,17H6V15H5ZM3,17H4V15H3Zm14-7a1,1,0,1,1,1,1A1,1,0,0,1,17,10ZM7,11H8V9H7ZM5,11H6V9H5ZM3,11H4V9H3ZM19,4a1,1,0,1,1-1-1A1,1,0,0,1,19,4ZM7,5H8V3H7ZM5,5H6V3H5ZM3,5H4V3H3ZM22,2a2,2,0,0,0-2-2H2A2,2,0,0,0,0,2V6A1.91,1.91,0,0,0,.28,7,1.88,1.88,0,0,0,0,8v4a1.91,1.91,0,0,0,.28,1A1.88,1.88,0,0,0,0,14v4a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V14a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,12V8a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,6ZM20,18H2V14H20Zm0-6H2V8H20Zm0-6H2V2H20Z"
-      fill={true}
+        d="M17,16a1,1,0,1,1,1,1A1,1,0,0,1,17,16ZM7,17H8V15H7ZM5,17H6V15H5ZM3,17H4V15H3Zm14-7a1,1,0,1,1,1,1A1,1,0,0,1,17,10ZM7,11H8V9H7ZM5,11H6V9H5ZM3,11H4V9H3ZM19,4a1,1,0,1,1-1-1A1,1,0,0,1,19,4ZM7,5H8V3H7ZM5,5H6V3H5ZM3,5H4V3H3ZM22,2a2,2,0,0,0-2-2H2A2,2,0,0,0,0,2V6A1.91,1.91,0,0,0,.28,7,1.88,1.88,0,0,0,0,8v4a1.91,1.91,0,0,0,.28,1A1.88,1.88,0,0,0,0,14v4a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V14a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,12V8a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,6ZM20,18H2V14H20Zm0-6H2V8H20Zm0-6H2V2H20Z"
+        fill={undefined}
     />
-  </svg>
+</svg>,
   <svg
     height="22"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 22 22"
     width="22"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M17,16a1,1,0,1,1,1,1A1,1,0,0,1,17,16ZM7,17H8V15H7ZM5,17H6V15H5ZM3,17H4V15H3Zm14-7a1,1,0,1,1,1,1A1,1,0,0,1,17,10ZM7,11H8V9H7ZM5,11H6V9H5ZM3,11H4V9H3ZM19,4a1,1,0,1,1-1-1A1,1,0,0,1,19,4ZM7,5H8V3H7ZM5,5H6V3H5ZM3,5H4V3H3ZM22,2a2,2,0,0,0-2-2H2A2,2,0,0,0,0,2V6A1.91,1.91,0,0,0,.28,7,1.88,1.88,0,0,0,0,8v4a1.91,1.91,0,0,0,.28,1A1.88,1.88,0,0,0,0,14v4a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V14a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,12V8a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,6ZM20,18H2V14H20Zm0-6H2V8H20Zm0-6H2V2H20Z"
-      fill="#464646"
+        d="M17,16a1,1,0,1,1,1,1A1,1,0,0,1,17,16ZM7,17H8V15H7ZM5,17H6V15H5ZM3,17H4V15H3Zm14-7a1,1,0,1,1,1,1A1,1,0,0,1,17,10ZM7,11H8V9H7ZM5,11H6V9H5ZM3,11H4V9H3ZM19,4a1,1,0,1,1-1-1A1,1,0,0,1,19,4ZM7,5H8V3H7ZM5,5H6V3H5ZM3,5H4V3H3ZM22,2a2,2,0,0,0-2-2H2A2,2,0,0,0,0,2V6A1.91,1.91,0,0,0,.28,7,1.88,1.88,0,0,0,0,8v4a1.91,1.91,0,0,0,.28,1A1.88,1.88,0,0,0,0,14v4a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V14a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,12V8a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,6ZM20,18H2V14H20Zm0-6H2V8H20Zm0-6H2V2H20Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="22"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 22 22"
     width="22"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M17,16a1,1,0,1,1,1,1A1,1,0,0,1,17,16ZM7,17H8V15H7ZM5,17H6V15H5ZM3,17H4V15H3Zm14-7a1,1,0,1,1,1,1A1,1,0,0,1,17,10ZM7,11H8V9H7ZM5,11H6V9H5ZM3,11H4V9H3ZM19,4a1,1,0,1,1-1-1A1,1,0,0,1,19,4ZM7,5H8V3H7ZM5,5H6V3H5ZM3,5H4V3H3ZM22,2a2,2,0,0,0-2-2H2A2,2,0,0,0,0,2V6A1.91,1.91,0,0,0,.28,7,1.88,1.88,0,0,0,0,8v4a1.91,1.91,0,0,0,.28,1A1.88,1.88,0,0,0,0,14v4a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V14a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,12V8a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,6ZM20,18H2V14H20Zm0-6H2V8H20Zm0-6H2V2H20Z"
-      fill="#464646"
+        d="M17,16a1,1,0,1,1,1,1A1,1,0,0,1,17,16ZM7,17H8V15H7ZM5,17H6V15H5ZM3,17H4V15H3Zm14-7a1,1,0,1,1,1,1A1,1,0,0,1,17,10ZM7,11H8V9H7ZM5,11H6V9H5ZM3,11H4V9H3ZM19,4a1,1,0,1,1-1-1A1,1,0,0,1,19,4ZM7,5H8V3H7ZM5,5H6V3H5ZM3,5H4V3H3ZM22,2a2,2,0,0,0-2-2H2A2,2,0,0,0,0,2V6A1.91,1.91,0,0,0,.28,7,1.88,1.88,0,0,0,0,8v4a1.91,1.91,0,0,0,.28,1A1.88,1.88,0,0,0,0,14v4a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V14a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,12V8a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,6ZM20,18H2V14H20Zm0-6H2V8H20Zm0-6H2V2H20Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="22"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 22 22"
     width="22"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M17,16a1,1,0,1,1,1,1A1,1,0,0,1,17,16ZM7,17H8V15H7ZM5,17H6V15H5ZM3,17H4V15H3Zm14-7a1,1,0,1,1,1,1A1,1,0,0,1,17,10ZM7,11H8V9H7ZM5,11H6V9H5ZM3,11H4V9H3ZM19,4a1,1,0,1,1-1-1A1,1,0,0,1,19,4ZM7,5H8V3H7ZM5,5H6V3H5ZM3,5H4V3H3ZM22,2a2,2,0,0,0-2-2H2A2,2,0,0,0,0,2V6A1.91,1.91,0,0,0,.28,7,1.88,1.88,0,0,0,0,8v4a1.91,1.91,0,0,0,.28,1A1.88,1.88,0,0,0,0,14v4a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V14a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,12V8a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,6ZM20,18H2V14H20Zm0-6H2V8H20Zm0-6H2V2H20Z"
-      fill="#464646"
+        d="M17,16a1,1,0,1,1,1,1A1,1,0,0,1,17,16ZM7,17H8V15H7ZM5,17H6V15H5ZM3,17H4V15H3Zm14-7a1,1,0,1,1,1,1A1,1,0,0,1,17,10ZM7,11H8V9H7ZM5,11H6V9H5ZM3,11H4V9H3ZM19,4a1,1,0,1,1-1-1A1,1,0,0,1,19,4ZM7,5H8V3H7ZM5,5H6V3H5ZM3,5H4V3H3ZM22,2a2,2,0,0,0-2-2H2A2,2,0,0,0,0,2V6A1.91,1.91,0,0,0,.28,7,1.88,1.88,0,0,0,0,8v4a1.91,1.91,0,0,0,.28,1A1.88,1.88,0,0,0,0,14v4a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V14a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,12V8a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,6ZM20,18H2V14H20Zm0-6H2V8H20Zm0-6H2V2H20Z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="22"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 22 22"
     width="22"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M17,16a1,1,0,1,1,1,1A1,1,0,0,1,17,16ZM7,17H8V15H7ZM5,17H6V15H5ZM3,17H4V15H3Zm14-7a1,1,0,1,1,1,1A1,1,0,0,1,17,10ZM7,11H8V9H7ZM5,11H6V9H5ZM3,11H4V9H3ZM19,4a1,1,0,1,1-1-1A1,1,0,0,1,19,4ZM7,5H8V3H7ZM5,5H6V3H5ZM3,5H4V3H3ZM22,2a2,2,0,0,0-2-2H2A2,2,0,0,0,0,2V6A1.91,1.91,0,0,0,.28,7,1.88,1.88,0,0,0,0,8v4a1.91,1.91,0,0,0,.28,1A1.88,1.88,0,0,0,0,14v4a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V14a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,12V8a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,6ZM20,18H2V14H20Zm0-6H2V8H20Zm0-6H2V2H20Z"
-      fill="#464646"
+        d="M17,16a1,1,0,1,1,1,1A1,1,0,0,1,17,16ZM7,17H8V15H7ZM5,17H6V15H5ZM3,17H4V15H3Zm14-7a1,1,0,1,1,1,1A1,1,0,0,1,17,10ZM7,11H8V9H7ZM5,11H6V9H5ZM3,11H4V9H3ZM19,4a1,1,0,1,1-1-1A1,1,0,0,1,19,4ZM7,5H8V3H7ZM5,5H6V3H5ZM3,5H4V3H3ZM22,2a2,2,0,0,0-2-2H2A2,2,0,0,0,0,2V6A1.91,1.91,0,0,0,.28,7,1.88,1.88,0,0,0,0,8v4a1.91,1.91,0,0,0,.28,1A1.88,1.88,0,0,0,0,14v4a2,2,0,0,0,2,2H20a2,2,0,0,0,2-2V14a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,12V8a1.88,1.88,0,0,0-.28-1A1.91,1.91,0,0,0,22,6ZM20,18H2V14H20Zm0-6H2V8H20Zm0-6H2V2H20Z"
+        fill="#464646"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
 
 exports[`renders <Tags /> without throwing 1`] = `
-<div>
-  <tags />
-  <tags
-    light={true}
-  />
-  <tags
-    disabled={true}
-  />
-  <tags
-    direction="right"
-  />
-  <tags
-    direction="up"
-  />
-  <tags
-    direction="left"
-  />
-  <tags
-    direction="down"
-  />
-</div>
+Array [
+  <svg
+    height="17"
+    style={
+        Object {
+            "transform": "rotate(0deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 17 17"
+    width="17"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <g
+        transform="translate(-1885 974)"
+    >
+        <g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1885 -974)"
+                        xlinkHref="#R"
+                    />
+                </g>
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1888 -971)"
+                    xlinkHref="#S"
+                />
+            </g>
+        </g>
+    </g>
+    <defs>
+        <path
+            d="M 7.7 1L 7.8 1L 15.6 8.79999L 15.6 8.89999L 15.6 9L 9.1 15.5L 9 15.5L 8.9 15.5L 1.1 7.70001L 1.1 7.60001L 1.1 1.10001C 1.1 1.00001 1.2 0.899994 1.3 0.899994L 7.7 1ZM 7.7 0L 1.2 0C 0.599997 0 0 0.500012 0 1.20001L 0 7.70001C 0 8.00001 0.100003 8.3 0.300003 8.5L 8.1 16.3C 8.3 16.5 8.6 16.6 8.9 16.6C 9.2 16.6 9.5 16.5 9.7 16.3L 16.2 9.79999C 16.7 9.29999 16.7 8.60001 16.2 8.20001L 8.4 0.399994C 8.3 0.0999939 8 0 7.7 0Z"
+            id="R"
+        />
+        <path
+            d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
+            id="S"
+        />
+    </defs>
+</svg>,
+  <svg
+    height="17"
+    style={
+        Object {
+            "transform": "rotate(0deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 17 17"
+    width="17"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <g
+        transform="translate(-1885 974)"
+    >
+        <g>
+            <g>
+                <g>
+                    <use
+                        fill="#FFF"
+                        transform="translate(1885 -974)"
+                        xlinkHref="#R"
+                    />
+                </g>
+            </g>
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(1888 -971)"
+                    xlinkHref="#S"
+                />
+            </g>
+        </g>
+    </g>
+    <defs>
+        <path
+            d="M 7.7 1L 7.8 1L 15.6 8.79999L 15.6 8.89999L 15.6 9L 9.1 15.5L 9 15.5L 8.9 15.5L 1.1 7.70001L 1.1 7.60001L 1.1 1.10001C 1.1 1.00001 1.2 0.899994 1.3 0.899994L 7.7 1ZM 7.7 0L 1.2 0C 0.599997 0 0 0.500012 0 1.20001L 0 7.70001C 0 8.00001 0.100003 8.3 0.300003 8.5L 8.1 16.3C 8.3 16.5 8.6 16.6 8.9 16.6C 9.2 16.6 9.5 16.5 9.7 16.3L 16.2 9.79999C 16.7 9.29999 16.7 8.60001 16.2 8.20001L 8.4 0.399994C 8.3 0.0999939 8 0 7.7 0Z"
+            id="R"
+        />
+        <path
+            d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
+            id="S"
+        />
+    </defs>
+</svg>,
+  <svg
+    height="17"
+    style={
+        Object {
+            "transform": "rotate(0deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 17 17"
+    width="17"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <g
+        transform="translate(-1885 974)"
+    >
+        <g>
+            <g>
+                <g>
+                    <use
+                        fill={undefined}
+                        transform="translate(1885 -974)"
+                        xlinkHref="#R"
+                    />
+                </g>
+            </g>
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(1888 -971)"
+                    xlinkHref="#S"
+                />
+            </g>
+        </g>
+    </g>
+    <defs>
+        <path
+            d="M 7.7 1L 7.8 1L 15.6 8.79999L 15.6 8.89999L 15.6 9L 9.1 15.5L 9 15.5L 8.9 15.5L 1.1 7.70001L 1.1 7.60001L 1.1 1.10001C 1.1 1.00001 1.2 0.899994 1.3 0.899994L 7.7 1ZM 7.7 0L 1.2 0C 0.599997 0 0 0.500012 0 1.20001L 0 7.70001C 0 8.00001 0.100003 8.3 0.300003 8.5L 8.1 16.3C 8.3 16.5 8.6 16.6 8.9 16.6C 9.2 16.6 9.5 16.5 9.7 16.3L 16.2 9.79999C 16.7 9.29999 16.7 8.60001 16.2 8.20001L 8.4 0.399994C 8.3 0.0999939 8 0 7.7 0Z"
+            id="R"
+        />
+        <path
+            d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
+            id="S"
+        />
+    </defs>
+</svg>,
+  <svg
+    height="17"
+    style={
+        Object {
+            "transform": "rotate(90deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 17 17"
+    width="17"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <g
+        transform="translate(-1885 974)"
+    >
+        <g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1885 -974)"
+                        xlinkHref="#R"
+                    />
+                </g>
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1888 -971)"
+                    xlinkHref="#S"
+                />
+            </g>
+        </g>
+    </g>
+    <defs>
+        <path
+            d="M 7.7 1L 7.8 1L 15.6 8.79999L 15.6 8.89999L 15.6 9L 9.1 15.5L 9 15.5L 8.9 15.5L 1.1 7.70001L 1.1 7.60001L 1.1 1.10001C 1.1 1.00001 1.2 0.899994 1.3 0.899994L 7.7 1ZM 7.7 0L 1.2 0C 0.599997 0 0 0.500012 0 1.20001L 0 7.70001C 0 8.00001 0.100003 8.3 0.300003 8.5L 8.1 16.3C 8.3 16.5 8.6 16.6 8.9 16.6C 9.2 16.6 9.5 16.5 9.7 16.3L 16.2 9.79999C 16.7 9.29999 16.7 8.60001 16.2 8.20001L 8.4 0.399994C 8.3 0.0999939 8 0 7.7 0Z"
+            id="R"
+        />
+        <path
+            d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
+            id="S"
+        />
+    </defs>
+</svg>,
+  <svg
+    height="17"
+    style={
+        Object {
+            "transform": "rotate(180deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 17 17"
+    width="17"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <g
+        transform="translate(-1885 974)"
+    >
+        <g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1885 -974)"
+                        xlinkHref="#R"
+                    />
+                </g>
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1888 -971)"
+                    xlinkHref="#S"
+                />
+            </g>
+        </g>
+    </g>
+    <defs>
+        <path
+            d="M 7.7 1L 7.8 1L 15.6 8.79999L 15.6 8.89999L 15.6 9L 9.1 15.5L 9 15.5L 8.9 15.5L 1.1 7.70001L 1.1 7.60001L 1.1 1.10001C 1.1 1.00001 1.2 0.899994 1.3 0.899994L 7.7 1ZM 7.7 0L 1.2 0C 0.599997 0 0 0.500012 0 1.20001L 0 7.70001C 0 8.00001 0.100003 8.3 0.300003 8.5L 8.1 16.3C 8.3 16.5 8.6 16.6 8.9 16.6C 9.2 16.6 9.5 16.5 9.7 16.3L 16.2 9.79999C 16.7 9.29999 16.7 8.60001 16.2 8.20001L 8.4 0.399994C 8.3 0.0999939 8 0 7.7 0Z"
+            id="R"
+        />
+        <path
+            d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
+            id="S"
+        />
+    </defs>
+</svg>,
+  <svg
+    height="17"
+    style={
+        Object {
+            "transform": "rotate(-90deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 17 17"
+    width="17"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <g
+        transform="translate(-1885 974)"
+    >
+        <g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1885 -974)"
+                        xlinkHref="#R"
+                    />
+                </g>
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1888 -971)"
+                    xlinkHref="#S"
+                />
+            </g>
+        </g>
+    </g>
+    <defs>
+        <path
+            d="M 7.7 1L 7.8 1L 15.6 8.79999L 15.6 8.89999L 15.6 9L 9.1 15.5L 9 15.5L 8.9 15.5L 1.1 7.70001L 1.1 7.60001L 1.1 1.10001C 1.1 1.00001 1.2 0.899994 1.3 0.899994L 7.7 1ZM 7.7 0L 1.2 0C 0.599997 0 0 0.500012 0 1.20001L 0 7.70001C 0 8.00001 0.100003 8.3 0.300003 8.5L 8.1 16.3C 8.3 16.5 8.6 16.6 8.9 16.6C 9.2 16.6 9.5 16.5 9.7 16.3L 16.2 9.79999C 16.7 9.29999 16.7 8.60001 16.2 8.20001L 8.4 0.399994C 8.3 0.0999939 8 0 7.7 0Z"
+            id="R"
+        />
+        <path
+            d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
+            id="S"
+        />
+    </defs>
+</svg>,
+  <svg
+    height="17"
+    style={
+        Object {
+            "transform": "rotate(0deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 17 17"
+    width="17"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <g
+        transform="translate(-1885 974)"
+    >
+        <g>
+            <g>
+                <g>
+                    <use
+                        fill="#464646"
+                        transform="translate(1885 -974)"
+                        xlinkHref="#R"
+                    />
+                </g>
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(1888 -971)"
+                    xlinkHref="#S"
+                />
+            </g>
+        </g>
+    </g>
+    <defs>
+        <path
+            d="M 7.7 1L 7.8 1L 15.6 8.79999L 15.6 8.89999L 15.6 9L 9.1 15.5L 9 15.5L 8.9 15.5L 1.1 7.70001L 1.1 7.60001L 1.1 1.10001C 1.1 1.00001 1.2 0.899994 1.3 0.899994L 7.7 1ZM 7.7 0L 1.2 0C 0.599997 0 0 0.500012 0 1.20001L 0 7.70001C 0 8.00001 0.100003 8.3 0.300003 8.5L 8.1 16.3C 8.3 16.5 8.6 16.6 8.9 16.6C 9.2 16.6 9.5 16.5 9.7 16.3L 16.2 9.79999C 16.7 9.29999 16.7 8.60001 16.2 8.20001L 8.4 0.399994C 8.3 0.0999939 8 0 7.7 0Z"
+            id="R"
+        />
+        <path
+            d="M 2.5 1C 3.3 1 4 1.7 4 2.5C 4 3.3 3.3 4 2.5 4C 1.7 4 1 3.3 1 2.5C 1 1.7 1.7 1 2.5 1ZM 2.5 0C 1.1 0 0 1.1 0 2.5C 0 3.9 1.1 5 2.5 5C 3.9 5 5 3.9 5 2.5C 5 1.1 3.9 0 2.5 0Z"
+            id="S"
+        />
+    </defs>
+</svg>,
+]
 `;
 
 exports[`renders <Triton /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="19"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 105 19"
     width="105"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M81 9.502C81 4.256 76.747.004 71.5.004V0C66.253.002 62 4.256 62 9.502S66.253 19 71.5 19 81 14.748 81 9.502zM16.227 1H.773A.773.773 0 0 0 0 1.772v3.094c0 .426.346.772.773.772h4.61c.421 0 .765.336.773.756v10.834c0 .426.346.772.773.772h3.093a.773.773 0 0 0 .773-.772V6.394c0-.426.346-.772.773-.772h4.68a.773.773 0 0 0 .752-.76v-3.09A.773.773 0 0 0 16.227 1zM33 1.772v3.094c0 .426-.35.772-.783.772h-6.723a.778.778 0 0 0-.784.773v10.817c0 .426-.35.772-.783.772h-3.14a.788.788 0 0 1-.726-.472.763.763 0 0 1-.061-.3V5.634C20.002 3.074 22.107 1 24.702 1h7.515c.432 0 .783.346.783.772zM40.167 1h-3.334c-.46 0-.833.346-.833.772v15.456c0 .426.373.772.833.772h3.334c.46 0 .833-.346.833-.772V1.772c0-.426-.373-.772-.833-.772zm3.605 0h15.456c.426 0 .772.346.772.772V4.85a.772.772 0 0 1-.772.772h-4.662a.772.772 0 0 0-.772.772v10.833a.772.772 0 0 1-.772.773H49.93a.775.775 0 0 1-.784-.773V6.394a.772.772 0 0 0-.772-.756h-4.6A.772.772 0 0 1 43 4.866V1.772c0-.426.346-.772.772-.772zM84 1.772A.77.77 0 0 1 84.77 1h11.61c2.55 0 4.618 2.074 4.62 4.634v11.594a.77.77 0 0 1-.769.772H97.15a.77.77 0 0 1-.77-.772V6.394a.77.77 0 0 0-.765-.772H89.39a.77.77 0 0 0-.77.772v10.834a.77.77 0 0 1-.769.772h-3.08a.77.77 0 0 1-.77-.772V1.772zM71.5 5a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9zm31.112-3.854H103v.84h.314v-.753l.551.767.253-.014.551-.764v.764H105V1h-.446l-.551.767L103.49 1H102v.146h.388V2h.228l-.004-.854z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M81 9.502C81 4.256 76.747.004 71.5.004V0C66.253.002 62 4.256 62 9.502S66.253 19 71.5 19 81 14.748 81 9.502zM16.227 1H.773A.773.773 0 0 0 0 1.772v3.094c0 .426.346.772.773.772h4.61c.421 0 .765.336.773.756v10.834c0 .426.346.772.773.772h3.093a.773.773 0 0 0 .773-.772V6.394c0-.426.346-.772.773-.772h4.68a.773.773 0 0 0 .752-.76v-3.09A.773.773 0 0 0 16.227 1zM33 1.772v3.094c0 .426-.35.772-.783.772h-6.723a.778.778 0 0 0-.784.773v10.817c0 .426-.35.772-.783.772h-3.14a.788.788 0 0 1-.726-.472.763.763 0 0 1-.061-.3V5.634C20.002 3.074 22.107 1 24.702 1h7.515c.432 0 .783.346.783.772zM40.167 1h-3.334c-.46 0-.833.346-.833.772v15.456c0 .426.373.772.833.772h3.334c.46 0 .833-.346.833-.772V1.772c0-.426-.373-.772-.833-.772zm3.605 0h15.456c.426 0 .772.346.772.772V4.85a.772.772 0 0 1-.772.772h-4.662a.772.772 0 0 0-.772.772v10.833a.772.772 0 0 1-.772.773H49.93a.775.775 0 0 1-.784-.773V6.394a.772.772 0 0 0-.772-.756h-4.6A.772.772 0 0 1 43 4.866V1.772c0-.426.346-.772.772-.772zM84 1.772A.77.77 0 0 1 84.77 1h11.61c2.55 0 4.618 2.074 4.62 4.634v11.594a.77.77 0 0 1-.769.772H97.15a.77.77 0 0 1-.77-.772V6.394a.77.77 0 0 0-.765-.772H89.39a.77.77 0 0 0-.77.772v10.834a.77.77 0 0 1-.769.772h-3.08a.77.77 0 0 1-.77-.772V1.772zM71.5 5a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9zm31.112-3.854H103v.84h.314v-.753l.551.767.253-.014.551-.764v.764H105V1h-.446l-.551.767L103.49 1H102v.146h.388V2h.228l-.004-.854z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="19"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 105 19"
     width="105"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M81 9.502C81 4.256 76.747.004 71.5.004V0C66.253.002 62 4.256 62 9.502S66.253 19 71.5 19 81 14.748 81 9.502zM16.227 1H.773A.773.773 0 0 0 0 1.772v3.094c0 .426.346.772.773.772h4.61c.421 0 .765.336.773.756v10.834c0 .426.346.772.773.772h3.093a.773.773 0 0 0 .773-.772V6.394c0-.426.346-.772.773-.772h4.68a.773.773 0 0 0 .752-.76v-3.09A.773.773 0 0 0 16.227 1zM33 1.772v3.094c0 .426-.35.772-.783.772h-6.723a.778.778 0 0 0-.784.773v10.817c0 .426-.35.772-.783.772h-3.14a.788.788 0 0 1-.726-.472.763.763 0 0 1-.061-.3V5.634C20.002 3.074 22.107 1 24.702 1h7.515c.432 0 .783.346.783.772zM40.167 1h-3.334c-.46 0-.833.346-.833.772v15.456c0 .426.373.772.833.772h3.334c.46 0 .833-.346.833-.772V1.772c0-.426-.373-.772-.833-.772zm3.605 0h15.456c.426 0 .772.346.772.772V4.85a.772.772 0 0 1-.772.772h-4.662a.772.772 0 0 0-.772.772v10.833a.772.772 0 0 1-.772.773H49.93a.775.775 0 0 1-.784-.773V6.394a.772.772 0 0 0-.772-.756h-4.6A.772.772 0 0 1 43 4.866V1.772c0-.426.346-.772.772-.772zM84 1.772A.77.77 0 0 1 84.77 1h11.61c2.55 0 4.618 2.074 4.62 4.634v11.594a.77.77 0 0 1-.769.772H97.15a.77.77 0 0 1-.77-.772V6.394a.77.77 0 0 0-.765-.772H89.39a.77.77 0 0 0-.77.772v10.834a.77.77 0 0 1-.769.772h-3.08a.77.77 0 0 1-.77-.772V1.772zM71.5 5a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9zm31.112-3.854H103v.84h.314v-.753l.551.767.253-.014.551-.764v.764H105V1h-.446l-.551.767L103.49 1H102v.146h.388V2h.228l-.004-.854z"
-      fill="#FFF"
-      fillRule="evenodd"
+        d="M81 9.502C81 4.256 76.747.004 71.5.004V0C66.253.002 62 4.256 62 9.502S66.253 19 71.5 19 81 14.748 81 9.502zM16.227 1H.773A.773.773 0 0 0 0 1.772v3.094c0 .426.346.772.773.772h4.61c.421 0 .765.336.773.756v10.834c0 .426.346.772.773.772h3.093a.773.773 0 0 0 .773-.772V6.394c0-.426.346-.772.773-.772h4.68a.773.773 0 0 0 .752-.76v-3.09A.773.773 0 0 0 16.227 1zM33 1.772v3.094c0 .426-.35.772-.783.772h-6.723a.778.778 0 0 0-.784.773v10.817c0 .426-.35.772-.783.772h-3.14a.788.788 0 0 1-.726-.472.763.763 0 0 1-.061-.3V5.634C20.002 3.074 22.107 1 24.702 1h7.515c.432 0 .783.346.783.772zM40.167 1h-3.334c-.46 0-.833.346-.833.772v15.456c0 .426.373.772.833.772h3.334c.46 0 .833-.346.833-.772V1.772c0-.426-.373-.772-.833-.772zm3.605 0h15.456c.426 0 .772.346.772.772V4.85a.772.772 0 0 1-.772.772h-4.662a.772.772 0 0 0-.772.772v10.833a.772.772 0 0 1-.772.773H49.93a.775.775 0 0 1-.784-.773V6.394a.772.772 0 0 0-.772-.756h-4.6A.772.772 0 0 1 43 4.866V1.772c0-.426.346-.772.772-.772zM84 1.772A.77.77 0 0 1 84.77 1h11.61c2.55 0 4.618 2.074 4.62 4.634v11.594a.77.77 0 0 1-.769.772H97.15a.77.77 0 0 1-.77-.772V6.394a.77.77 0 0 0-.765-.772H89.39a.77.77 0 0 0-.77.772v10.834a.77.77 0 0 1-.769.772h-3.08a.77.77 0 0 1-.77-.772V1.772zM71.5 5a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9zm31.112-3.854H103v.84h.314v-.753l.551.767.253-.014.551-.764v.764H105V1h-.446l-.551.767L103.49 1H102v.146h.388V2h.228l-.004-.854z"
+        fill="#FFF"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="19"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 105 19"
     width="105"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M81 9.502C81 4.256 76.747.004 71.5.004V0C66.253.002 62 4.256 62 9.502S66.253 19 71.5 19 81 14.748 81 9.502zM16.227 1H.773A.773.773 0 0 0 0 1.772v3.094c0 .426.346.772.773.772h4.61c.421 0 .765.336.773.756v10.834c0 .426.346.772.773.772h3.093a.773.773 0 0 0 .773-.772V6.394c0-.426.346-.772.773-.772h4.68a.773.773 0 0 0 .752-.76v-3.09A.773.773 0 0 0 16.227 1zM33 1.772v3.094c0 .426-.35.772-.783.772h-6.723a.778.778 0 0 0-.784.773v10.817c0 .426-.35.772-.783.772h-3.14a.788.788 0 0 1-.726-.472.763.763 0 0 1-.061-.3V5.634C20.002 3.074 22.107 1 24.702 1h7.515c.432 0 .783.346.783.772zM40.167 1h-3.334c-.46 0-.833.346-.833.772v15.456c0 .426.373.772.833.772h3.334c.46 0 .833-.346.833-.772V1.772c0-.426-.373-.772-.833-.772zm3.605 0h15.456c.426 0 .772.346.772.772V4.85a.772.772 0 0 1-.772.772h-4.662a.772.772 0 0 0-.772.772v10.833a.772.772 0 0 1-.772.773H49.93a.775.775 0 0 1-.784-.773V6.394a.772.772 0 0 0-.772-.756h-4.6A.772.772 0 0 1 43 4.866V1.772c0-.426.346-.772.772-.772zM84 1.772A.77.77 0 0 1 84.77 1h11.61c2.55 0 4.618 2.074 4.62 4.634v11.594a.77.77 0 0 1-.769.772H97.15a.77.77 0 0 1-.77-.772V6.394a.77.77 0 0 0-.765-.772H89.39a.77.77 0 0 0-.77.772v10.834a.77.77 0 0 1-.769.772h-3.08a.77.77 0 0 1-.77-.772V1.772zM71.5 5a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9zm31.112-3.854H103v.84h.314v-.753l.551.767.253-.014.551-.764v.764H105V1h-.446l-.551.767L103.49 1H102v.146h.388V2h.228l-.004-.854z"
-      fill={true}
-      fillRule="evenodd"
+        d="M81 9.502C81 4.256 76.747.004 71.5.004V0C66.253.002 62 4.256 62 9.502S66.253 19 71.5 19 81 14.748 81 9.502zM16.227 1H.773A.773.773 0 0 0 0 1.772v3.094c0 .426.346.772.773.772h4.61c.421 0 .765.336.773.756v10.834c0 .426.346.772.773.772h3.093a.773.773 0 0 0 .773-.772V6.394c0-.426.346-.772.773-.772h4.68a.773.773 0 0 0 .752-.76v-3.09A.773.773 0 0 0 16.227 1zM33 1.772v3.094c0 .426-.35.772-.783.772h-6.723a.778.778 0 0 0-.784.773v10.817c0 .426-.35.772-.783.772h-3.14a.788.788 0 0 1-.726-.472.763.763 0 0 1-.061-.3V5.634C20.002 3.074 22.107 1 24.702 1h7.515c.432 0 .783.346.783.772zM40.167 1h-3.334c-.46 0-.833.346-.833.772v15.456c0 .426.373.772.833.772h3.334c.46 0 .833-.346.833-.772V1.772c0-.426-.373-.772-.833-.772zm3.605 0h15.456c.426 0 .772.346.772.772V4.85a.772.772 0 0 1-.772.772h-4.662a.772.772 0 0 0-.772.772v10.833a.772.772 0 0 1-.772.773H49.93a.775.775 0 0 1-.784-.773V6.394a.772.772 0 0 0-.772-.756h-4.6A.772.772 0 0 1 43 4.866V1.772c0-.426.346-.772.772-.772zM84 1.772A.77.77 0 0 1 84.77 1h11.61c2.55 0 4.618 2.074 4.62 4.634v11.594a.77.77 0 0 1-.769.772H97.15a.77.77 0 0 1-.77-.772V6.394a.77.77 0 0 0-.765-.772H89.39a.77.77 0 0 0-.77.772v10.834a.77.77 0 0 1-.769.772h-3.08a.77.77 0 0 1-.77-.772V1.772zM71.5 5a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9zm31.112-3.854H103v.84h.314v-.753l.551.767.253-.014.551-.764v.764H105V1h-.446l-.551.767L103.49 1H102v.146h.388V2h.228l-.004-.854z"
+        fill={undefined}
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="19"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 105 19"
     width="105"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M81 9.502C81 4.256 76.747.004 71.5.004V0C66.253.002 62 4.256 62 9.502S66.253 19 71.5 19 81 14.748 81 9.502zM16.227 1H.773A.773.773 0 0 0 0 1.772v3.094c0 .426.346.772.773.772h4.61c.421 0 .765.336.773.756v10.834c0 .426.346.772.773.772h3.093a.773.773 0 0 0 .773-.772V6.394c0-.426.346-.772.773-.772h4.68a.773.773 0 0 0 .752-.76v-3.09A.773.773 0 0 0 16.227 1zM33 1.772v3.094c0 .426-.35.772-.783.772h-6.723a.778.778 0 0 0-.784.773v10.817c0 .426-.35.772-.783.772h-3.14a.788.788 0 0 1-.726-.472.763.763 0 0 1-.061-.3V5.634C20.002 3.074 22.107 1 24.702 1h7.515c.432 0 .783.346.783.772zM40.167 1h-3.334c-.46 0-.833.346-.833.772v15.456c0 .426.373.772.833.772h3.334c.46 0 .833-.346.833-.772V1.772c0-.426-.373-.772-.833-.772zm3.605 0h15.456c.426 0 .772.346.772.772V4.85a.772.772 0 0 1-.772.772h-4.662a.772.772 0 0 0-.772.772v10.833a.772.772 0 0 1-.772.773H49.93a.775.775 0 0 1-.784-.773V6.394a.772.772 0 0 0-.772-.756h-4.6A.772.772 0 0 1 43 4.866V1.772c0-.426.346-.772.772-.772zM84 1.772A.77.77 0 0 1 84.77 1h11.61c2.55 0 4.618 2.074 4.62 4.634v11.594a.77.77 0 0 1-.769.772H97.15a.77.77 0 0 1-.77-.772V6.394a.77.77 0 0 0-.765-.772H89.39a.77.77 0 0 0-.77.772v10.834a.77.77 0 0 1-.769.772h-3.08a.77.77 0 0 1-.77-.772V1.772zM71.5 5a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9zm31.112-3.854H103v.84h.314v-.753l.551.767.253-.014.551-.764v.764H105V1h-.446l-.551.767L103.49 1H102v.146h.388V2h.228l-.004-.854z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M81 9.502C81 4.256 76.747.004 71.5.004V0C66.253.002 62 4.256 62 9.502S66.253 19 71.5 19 81 14.748 81 9.502zM16.227 1H.773A.773.773 0 0 0 0 1.772v3.094c0 .426.346.772.773.772h4.61c.421 0 .765.336.773.756v10.834c0 .426.346.772.773.772h3.093a.773.773 0 0 0 .773-.772V6.394c0-.426.346-.772.773-.772h4.68a.773.773 0 0 0 .752-.76v-3.09A.773.773 0 0 0 16.227 1zM33 1.772v3.094c0 .426-.35.772-.783.772h-6.723a.778.778 0 0 0-.784.773v10.817c0 .426-.35.772-.783.772h-3.14a.788.788 0 0 1-.726-.472.763.763 0 0 1-.061-.3V5.634C20.002 3.074 22.107 1 24.702 1h7.515c.432 0 .783.346.783.772zM40.167 1h-3.334c-.46 0-.833.346-.833.772v15.456c0 .426.373.772.833.772h3.334c.46 0 .833-.346.833-.772V1.772c0-.426-.373-.772-.833-.772zm3.605 0h15.456c.426 0 .772.346.772.772V4.85a.772.772 0 0 1-.772.772h-4.662a.772.772 0 0 0-.772.772v10.833a.772.772 0 0 1-.772.773H49.93a.775.775 0 0 1-.784-.773V6.394a.772.772 0 0 0-.772-.756h-4.6A.772.772 0 0 1 43 4.866V1.772c0-.426.346-.772.772-.772zM84 1.772A.77.77 0 0 1 84.77 1h11.61c2.55 0 4.618 2.074 4.62 4.634v11.594a.77.77 0 0 1-.769.772H97.15a.77.77 0 0 1-.77-.772V6.394a.77.77 0 0 0-.765-.772H89.39a.77.77 0 0 0-.77.772v10.834a.77.77 0 0 1-.769.772h-3.08a.77.77 0 0 1-.77-.772V1.772zM71.5 5a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9zm31.112-3.854H103v.84h.314v-.753l.551.767.253-.014.551-.764v.764H105V1h-.446l-.551.767L103.49 1H102v.146h.388V2h.228l-.004-.854z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="19"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 105 19"
     width="105"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M81 9.502C81 4.256 76.747.004 71.5.004V0C66.253.002 62 4.256 62 9.502S66.253 19 71.5 19 81 14.748 81 9.502zM16.227 1H.773A.773.773 0 0 0 0 1.772v3.094c0 .426.346.772.773.772h4.61c.421 0 .765.336.773.756v10.834c0 .426.346.772.773.772h3.093a.773.773 0 0 0 .773-.772V6.394c0-.426.346-.772.773-.772h4.68a.773.773 0 0 0 .752-.76v-3.09A.773.773 0 0 0 16.227 1zM33 1.772v3.094c0 .426-.35.772-.783.772h-6.723a.778.778 0 0 0-.784.773v10.817c0 .426-.35.772-.783.772h-3.14a.788.788 0 0 1-.726-.472.763.763 0 0 1-.061-.3V5.634C20.002 3.074 22.107 1 24.702 1h7.515c.432 0 .783.346.783.772zM40.167 1h-3.334c-.46 0-.833.346-.833.772v15.456c0 .426.373.772.833.772h3.334c.46 0 .833-.346.833-.772V1.772c0-.426-.373-.772-.833-.772zm3.605 0h15.456c.426 0 .772.346.772.772V4.85a.772.772 0 0 1-.772.772h-4.662a.772.772 0 0 0-.772.772v10.833a.772.772 0 0 1-.772.773H49.93a.775.775 0 0 1-.784-.773V6.394a.772.772 0 0 0-.772-.756h-4.6A.772.772 0 0 1 43 4.866V1.772c0-.426.346-.772.772-.772zM84 1.772A.77.77 0 0 1 84.77 1h11.61c2.55 0 4.618 2.074 4.62 4.634v11.594a.77.77 0 0 1-.769.772H97.15a.77.77 0 0 1-.77-.772V6.394a.77.77 0 0 0-.765-.772H89.39a.77.77 0 0 0-.77.772v10.834a.77.77 0 0 1-.769.772h-3.08a.77.77 0 0 1-.77-.772V1.772zM71.5 5a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9zm31.112-3.854H103v.84h.314v-.753l.551.767.253-.014.551-.764v.764H105V1h-.446l-.551.767L103.49 1H102v.146h.388V2h.228l-.004-.854z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M81 9.502C81 4.256 76.747.004 71.5.004V0C66.253.002 62 4.256 62 9.502S66.253 19 71.5 19 81 14.748 81 9.502zM16.227 1H.773A.773.773 0 0 0 0 1.772v3.094c0 .426.346.772.773.772h4.61c.421 0 .765.336.773.756v10.834c0 .426.346.772.773.772h3.093a.773.773 0 0 0 .773-.772V6.394c0-.426.346-.772.773-.772h4.68a.773.773 0 0 0 .752-.76v-3.09A.773.773 0 0 0 16.227 1zM33 1.772v3.094c0 .426-.35.772-.783.772h-6.723a.778.778 0 0 0-.784.773v10.817c0 .426-.35.772-.783.772h-3.14a.788.788 0 0 1-.726-.472.763.763 0 0 1-.061-.3V5.634C20.002 3.074 22.107 1 24.702 1h7.515c.432 0 .783.346.783.772zM40.167 1h-3.334c-.46 0-.833.346-.833.772v15.456c0 .426.373.772.833.772h3.334c.46 0 .833-.346.833-.772V1.772c0-.426-.373-.772-.833-.772zm3.605 0h15.456c.426 0 .772.346.772.772V4.85a.772.772 0 0 1-.772.772h-4.662a.772.772 0 0 0-.772.772v10.833a.772.772 0 0 1-.772.773H49.93a.775.775 0 0 1-.784-.773V6.394a.772.772 0 0 0-.772-.756h-4.6A.772.772 0 0 1 43 4.866V1.772c0-.426.346-.772.772-.772zM84 1.772A.77.77 0 0 1 84.77 1h11.61c2.55 0 4.618 2.074 4.62 4.634v11.594a.77.77 0 0 1-.769.772H97.15a.77.77 0 0 1-.77-.772V6.394a.77.77 0 0 0-.765-.772H89.39a.77.77 0 0 0-.77.772v10.834a.77.77 0 0 1-.769.772h-3.08a.77.77 0 0 1-.77-.772V1.772zM71.5 5a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9zm31.112-3.854H103v.84h.314v-.753l.551.767.253-.014.551-.764v.764H105V1h-.446l-.551.767L103.49 1H102v.146h.388V2h.228l-.004-.854z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="19"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 105 19"
     width="105"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M81 9.502C81 4.256 76.747.004 71.5.004V0C66.253.002 62 4.256 62 9.502S66.253 19 71.5 19 81 14.748 81 9.502zM16.227 1H.773A.773.773 0 0 0 0 1.772v3.094c0 .426.346.772.773.772h4.61c.421 0 .765.336.773.756v10.834c0 .426.346.772.773.772h3.093a.773.773 0 0 0 .773-.772V6.394c0-.426.346-.772.773-.772h4.68a.773.773 0 0 0 .752-.76v-3.09A.773.773 0 0 0 16.227 1zM33 1.772v3.094c0 .426-.35.772-.783.772h-6.723a.778.778 0 0 0-.784.773v10.817c0 .426-.35.772-.783.772h-3.14a.788.788 0 0 1-.726-.472.763.763 0 0 1-.061-.3V5.634C20.002 3.074 22.107 1 24.702 1h7.515c.432 0 .783.346.783.772zM40.167 1h-3.334c-.46 0-.833.346-.833.772v15.456c0 .426.373.772.833.772h3.334c.46 0 .833-.346.833-.772V1.772c0-.426-.373-.772-.833-.772zm3.605 0h15.456c.426 0 .772.346.772.772V4.85a.772.772 0 0 1-.772.772h-4.662a.772.772 0 0 0-.772.772v10.833a.772.772 0 0 1-.772.773H49.93a.775.775 0 0 1-.784-.773V6.394a.772.772 0 0 0-.772-.756h-4.6A.772.772 0 0 1 43 4.866V1.772c0-.426.346-.772.772-.772zM84 1.772A.77.77 0 0 1 84.77 1h11.61c2.55 0 4.618 2.074 4.62 4.634v11.594a.77.77 0 0 1-.769.772H97.15a.77.77 0 0 1-.77-.772V6.394a.77.77 0 0 0-.765-.772H89.39a.77.77 0 0 0-.77.772v10.834a.77.77 0 0 1-.769.772h-3.08a.77.77 0 0 1-.77-.772V1.772zM71.5 5a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9zm31.112-3.854H103v.84h.314v-.753l.551.767.253-.014.551-.764v.764H105V1h-.446l-.551.767L103.49 1H102v.146h.388V2h.228l-.004-.854z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M81 9.502C81 4.256 76.747.004 71.5.004V0C66.253.002 62 4.256 62 9.502S66.253 19 71.5 19 81 14.748 81 9.502zM16.227 1H.773A.773.773 0 0 0 0 1.772v3.094c0 .426.346.772.773.772h4.61c.421 0 .765.336.773.756v10.834c0 .426.346.772.773.772h3.093a.773.773 0 0 0 .773-.772V6.394c0-.426.346-.772.773-.772h4.68a.773.773 0 0 0 .752-.76v-3.09A.773.773 0 0 0 16.227 1zM33 1.772v3.094c0 .426-.35.772-.783.772h-6.723a.778.778 0 0 0-.784.773v10.817c0 .426-.35.772-.783.772h-3.14a.788.788 0 0 1-.726-.472.763.763 0 0 1-.061-.3V5.634C20.002 3.074 22.107 1 24.702 1h7.515c.432 0 .783.346.783.772zM40.167 1h-3.334c-.46 0-.833.346-.833.772v15.456c0 .426.373.772.833.772h3.334c.46 0 .833-.346.833-.772V1.772c0-.426-.373-.772-.833-.772zm3.605 0h15.456c.426 0 .772.346.772.772V4.85a.772.772 0 0 1-.772.772h-4.662a.772.772 0 0 0-.772.772v10.833a.772.772 0 0 1-.772.773H49.93a.775.775 0 0 1-.784-.773V6.394a.772.772 0 0 0-.772-.756h-4.6A.772.772 0 0 1 43 4.866V1.772c0-.426.346-.772.772-.772zM84 1.772A.77.77 0 0 1 84.77 1h11.61c2.55 0 4.618 2.074 4.62 4.634v11.594a.77.77 0 0 1-.769.772H97.15a.77.77 0 0 1-.77-.772V6.394a.77.77 0 0 0-.765-.772H89.39a.77.77 0 0 0-.77.772v10.834a.77.77 0 0 1-.769.772h-3.08a.77.77 0 0 1-.77-.772V1.772zM71.5 5a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9zm31.112-3.854H103v.84h.314v-.753l.551.767.253-.014.551-.764v.764H105V1h-.446l-.551.767L103.49 1H102v.146h.388V2h.228l-.004-.854z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
+</svg>,
   <svg
     height="19"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 105 19"
     width="105"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M81 9.502C81 4.256 76.747.004 71.5.004V0C66.253.002 62 4.256 62 9.502S66.253 19 71.5 19 81 14.748 81 9.502zM16.227 1H.773A.773.773 0 0 0 0 1.772v3.094c0 .426.346.772.773.772h4.61c.421 0 .765.336.773.756v10.834c0 .426.346.772.773.772h3.093a.773.773 0 0 0 .773-.772V6.394c0-.426.346-.772.773-.772h4.68a.773.773 0 0 0 .752-.76v-3.09A.773.773 0 0 0 16.227 1zM33 1.772v3.094c0 .426-.35.772-.783.772h-6.723a.778.778 0 0 0-.784.773v10.817c0 .426-.35.772-.783.772h-3.14a.788.788 0 0 1-.726-.472.763.763 0 0 1-.061-.3V5.634C20.002 3.074 22.107 1 24.702 1h7.515c.432 0 .783.346.783.772zM40.167 1h-3.334c-.46 0-.833.346-.833.772v15.456c0 .426.373.772.833.772h3.334c.46 0 .833-.346.833-.772V1.772c0-.426-.373-.772-.833-.772zm3.605 0h15.456c.426 0 .772.346.772.772V4.85a.772.772 0 0 1-.772.772h-4.662a.772.772 0 0 0-.772.772v10.833a.772.772 0 0 1-.772.773H49.93a.775.775 0 0 1-.784-.773V6.394a.772.772 0 0 0-.772-.756h-4.6A.772.772 0 0 1 43 4.866V1.772c0-.426.346-.772.772-.772zM84 1.772A.77.77 0 0 1 84.77 1h11.61c2.55 0 4.618 2.074 4.62 4.634v11.594a.77.77 0 0 1-.769.772H97.15a.77.77 0 0 1-.77-.772V6.394a.77.77 0 0 0-.765-.772H89.39a.77.77 0 0 0-.77.772v10.834a.77.77 0 0 1-.769.772h-3.08a.77.77 0 0 1-.77-.772V1.772zM71.5 5a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9zm31.112-3.854H103v.84h.314v-.753l.551.767.253-.014.551-.764v.764H105V1h-.446l-.551.767L103.49 1H102v.146h.388V2h.228l-.004-.854z"
-      fill="#464646"
-      fillRule="evenodd"
+        d="M81 9.502C81 4.256 76.747.004 71.5.004V0C66.253.002 62 4.256 62 9.502S66.253 19 71.5 19 81 14.748 81 9.502zM16.227 1H.773A.773.773 0 0 0 0 1.772v3.094c0 .426.346.772.773.772h4.61c.421 0 .765.336.773.756v10.834c0 .426.346.772.773.772h3.093a.773.773 0 0 0 .773-.772V6.394c0-.426.346-.772.773-.772h4.68a.773.773 0 0 0 .752-.76v-3.09A.773.773 0 0 0 16.227 1zM33 1.772v3.094c0 .426-.35.772-.783.772h-6.723a.778.778 0 0 0-.784.773v10.817c0 .426-.35.772-.783.772h-3.14a.788.788 0 0 1-.726-.472.763.763 0 0 1-.061-.3V5.634C20.002 3.074 22.107 1 24.702 1h7.515c.432 0 .783.346.783.772zM40.167 1h-3.334c-.46 0-.833.346-.833.772v15.456c0 .426.373.772.833.772h3.334c.46 0 .833-.346.833-.772V1.772c0-.426-.373-.772-.833-.772zm3.605 0h15.456c.426 0 .772.346.772.772V4.85a.772.772 0 0 1-.772.772h-4.662a.772.772 0 0 0-.772.772v10.833a.772.772 0 0 1-.772.773H49.93a.775.775 0 0 1-.784-.773V6.394a.772.772 0 0 0-.772-.756h-4.6A.772.772 0 0 1 43 4.866V1.772c0-.426.346-.772.772-.772zM84 1.772A.77.77 0 0 1 84.77 1h11.61c2.55 0 4.618 2.074 4.62 4.634v11.594a.77.77 0 0 1-.769.772H97.15a.77.77 0 0 1-.77-.772V6.394a.77.77 0 0 0-.765-.772H89.39a.77.77 0 0 0-.77.772v10.834a.77.77 0 0 1-.769.772h-3.08a.77.77 0 0 1-.77-.772V1.772zM71.5 5a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9zm31.112-3.854H103v.84h.314v-.753l.551.767.253-.014.551-.764v.764H105V1h-.446l-.551.767L103.49 1H102v.146h.388V2h.228l-.004-.854z"
+        fill="#464646"
+        fillRule="evenodd"
     />
-  </svg>
-</div>
+</svg>,
+  <svg
+    height="30"
+    style={
+        Object {
+            "transform": "rotate(0deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 105 30"
+    width="105"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <g
+        transform="translate(26223 1404)"
+    >
+        <g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(-26177 -1383)"
+                    xlinkHref="#U"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(-26223 -1404)"
+                    xlinkHref="#V"
+                />
+            </g>
+        </g>
+    </g>
+    <defs>
+        <path
+            d="M 33.7583 0.147461L 35.9766 0.147461C 37.0186 0.147461 37.7723 0.303223 38.2378 0.614746C 38.7033 0.92627 38.936 1.41862 38.936 2.0918C 38.936 2.55729 38.8053 2.94222 38.5439 3.24658C 38.2861 3.54736 37.9084 3.74251 37.4106 3.83203L 37.4106 3.88574C 38.603 4.08984 39.1992 4.71647 39.1992 5.76562C 39.1992 6.46745 38.9611 7.0153 38.4849 7.40918C 38.0122 7.80306 37.3498 8 36.4976 8L 33.7583 8L 33.7583 0.147461ZM 34.6714 3.50977L 36.1753 3.50977C 36.8198 3.50977 37.2835 3.40951 37.5664 3.20898C 37.8493 3.00488 37.9907 2.66292 37.9907 2.18311C 37.9907 1.74268 37.8332 1.42578 37.5181 1.23242C 37.203 1.03548 36.7017 0.937012 36.0142 0.937012L 34.6714 0.937012L 34.6714 3.50977ZM 34.6714 4.2832L 34.6714 7.22119L 36.3096 7.22119C 36.9434 7.22119 37.4196 7.09945 37.7383 6.85596C 38.0605 6.60889 38.2217 6.22396 38.2217 5.70117C 38.2217 5.21419 38.057 4.85612 37.7275 4.62695C 37.4017 4.39779 36.904 4.2832 36.2344 4.2832L 34.6714 4.2832ZM 43.2437 8.10742C 42.3735 8.10742 41.686 7.84245 41.1812 7.3125C 40.6799 6.78255 40.4292 6.04671 40.4292 5.10498C 40.4292 4.15609 40.6619 3.40234 41.1274 2.84375C 41.5965 2.28516 42.2249 2.00586 43.0127 2.00586C 43.7503 2.00586 44.334 2.24935 44.7637 2.73633C 45.1934 3.21973 45.4082 3.85889 45.4082 4.65381L 45.4082 5.21777L 41.353 5.21777C 41.3709 5.90885 41.5446 6.43343 41.874 6.7915C 42.207 7.14958 42.6743 7.32861 43.2759 7.32861C 43.9097 7.32861 44.5363 7.19613 45.1558 6.93115L 45.1558 7.72607C 44.8407 7.86214 44.5417 7.95882 44.2588 8.01611C 43.9795 8.07699 43.6411 8.10742 43.2437 8.10742ZM 43.002 2.75244C 42.5293 2.75244 42.1515 2.90641 41.8687 3.21436C 41.5894 3.5223 41.4246 3.94841 41.3745 4.49268L 44.4521 4.49268C 44.4521 3.9305 44.3268 3.50081 44.0762 3.20361C 43.8255 2.90283 43.4674 2.75244 43.002 2.75244ZM 48.835 7.37158C 48.9925 7.37158 49.1447 7.36084 49.2915 7.33936C 49.4383 7.31429 49.5547 7.28923 49.6406 7.26416L 49.6406 7.94629C 49.5439 7.99284 49.4007 8.03044 49.2109 8.05908C 49.0247 8.09131 48.8564 8.10742 48.7061 8.10742C 47.5674 8.10742 46.998 7.50765 46.998 6.30811L 46.998 2.80615L 46.1548 2.80615L 46.1548 2.37646L 46.998 2.00586L 47.374 0.749023L 47.8896 0.749023L 47.8896 2.11328L 49.5977 2.11328L 49.5977 2.80615L 47.8896 2.80615L 47.8896 6.27051C 47.8896 6.625 47.9738 6.89714 48.1421 7.08691C 48.3104 7.27669 48.5413 7.37158 48.835 7.37158ZM 54.4424 8L 54.2651 7.16211L 54.2222 7.16211C 53.9285 7.53092 53.6349 7.78158 53.3413 7.91406C 53.0513 8.04297 52.6878 8.10742 52.251 8.10742C 51.6673 8.10742 51.209 7.95703 50.876 7.65625C 50.5465 7.35547 50.3818 6.92757 50.3818 6.37256C 50.3818 5.18376 51.3325 4.56071 53.2339 4.50342L 54.2329 4.47119L 54.2329 4.10596C 54.2329 3.64404 54.1326 3.30387 53.9321 3.08545C 53.7352 2.86344 53.4183 2.75244 52.9814 2.75244C 52.4909 2.75244 51.9359 2.90283 51.3164 3.20361L 51.0425 2.52148C 51.3325 2.36393 51.6494 2.2404 51.9932 2.15088C 52.3405 2.06136 52.6878 2.0166 53.0352 2.0166C 53.737 2.0166 54.2562 2.17236 54.5928 2.48389C 54.9329 2.79541 55.103 3.29492 55.103 3.98242L 55.103 8L 54.4424 8ZM 52.4282 7.37158C 52.9832 7.37158 53.4183 7.2194 53.7334 6.91504C 54.0521 6.61068 54.2114 6.18457 54.2114 5.63672L 54.2114 5.10498L 53.3198 5.14258C 52.6108 5.16764 52.0988 5.27865 51.7837 5.47559C 51.4722 5.66895 51.3164 5.97152 51.3164 6.3833C 51.3164 6.70557 51.4131 6.95085 51.6064 7.11914C 51.8034 7.28743 52.0773 7.37158 52.4282 7.37158Z"
+            id="U"
+        />
+        <path
+            d="M 81 9.49793C 81 4.25232 76.7461 5.90949e-07 71.5 5.90949e-07C 66.252 -0.00183046 62 4.25171 62 9.49793C 62 14.7435 66.2539 18.9958 71.5 18.9958C 76.7461 18.9958 81 14.7435 81 9.49793ZM 16.2266 0.99585L 0.773438 0.99585C 0.345703 0.99585 0 1.34168 0 1.76819L 0 4.86169C 0 5.09143 0.0996094 5.29773 0.259766 5.43921C 0.308594 5.48181 0.361328 5.51856 0.417969 5.54822C 0.523438 5.60303 0.644531 5.63403 0.773438 5.63403L 5.38281 5.63403C 5.80469 5.63391 6.14844 5.96997 6.15625 6.39026L 6.15625 17.2235C 6.15625 17.4979 6.29883 17.739 6.51562 17.876C 6.56445 17.9071 6.61719 17.9327 6.67383 17.9523L 6.78906 17.983C 6.83398 17.9915 6.88086 17.9958 6.92969 17.9958L 10.0215 17.9958C 10.4492 17.9958 10.7949 17.65 10.7949 17.2235L 10.7949 6.39026C 10.7949 5.96362 11.1406 5.61792 11.5684 5.61792L 16.248 5.61792C 16.4941 5.61145 16.7109 5.48962 16.8477 5.30469C 16.9414 5.17932 16.998 5.0249 17 4.85767L 17 1.76819C 17 1.34168 16.6543 0.99585 16.2266 0.99585ZM 33 1.76819L 33 4.86169C 33 5.28821 32.6504 5.63403 32.2168 5.63403L 25.4941 5.63403C 25.0605 5.63403 24.7109 5.97986 24.7109 6.40637L 24.7109 17.2235C 24.7109 17.65 24.3594 17.9958 23.9277 17.9958L 20.7871 17.9958C 20.5781 17.9969 20.3789 17.916 20.2305 17.771C 20.084 17.6261 20 17.4291 20 17.2235L 20 5.63001C 20.002 3.06995 22.1074 0.99585 24.7031 0.99585L 32.2168 0.99585C 32.6504 0.99585 33 1.34168 33 1.76819ZM 40.1719 0.99585L 36.834 0.99585C 36.6113 0.99585 36.4102 1.07593 36.2598 1.20654C 36.2188 1.24182 36.1816 1.28076 36.1504 1.32275L 36.0938 1.40906C 36.0352 1.51636 36 1.63855 36 1.76819L 36 17.2235C 36 17.65 36.373 17.9958 36.834 17.9958L 40.166 17.9958C 40.627 17.9958 41 17.65 41 17.2235L 41 1.76819C 41 1.34168 40.627 0.99585 40.1719 0.99585ZM 43.7715 0.99585L 59.2207 0.99585C 59.3535 0.99585 59.4785 1.02844 59.5879 1.08594C 59.7109 1.15112 59.8145 1.24829 59.8867 1.36633C 59.959 1.4834 60 1.62097 60 1.76819L 60 4.84546C 60 5.2721 59.6543 5.6178 59.2285 5.6178L 54.5664 5.6178C 54.1406 5.6178 53.7949 5.96362 53.7949 6.39026L 53.7949 17.2234C 53.7949 17.4678 53.6816 17.6857 53.5039 17.8271C 53.373 17.9326 53.2051 17.9957 53.0215 17.9957L 49.9297 17.9957C 49.7227 17.999 49.5234 17.9191 49.375 17.7739C 49.3105 17.7108 49.2598 17.6377 49.2207 17.5582C 49.1719 17.4547 49.1445 17.3405 49.1445 17.2234L 49.1445 6.39026C 49.1367 5.96997 48.793 5.63391 48.373 5.63403L 43.7715 5.63403C 43.3457 5.63403 43 5.28821 43 4.86169L 43 1.76819C 43 1.34168 43.3457 0.99585 43.7715 0.99585ZM 84 1.76819C 84 1.34168 84.3438 0.99585 84.7695 0.99585L 96.3809 0.99585C 98.9297 0.99585 100.998 3.06995 101 5.63001L 101 17.2235C 101 17.65 100.656 17.9958 100.23 17.9958L 97.1504 17.9958C 97.0039 17.9958 96.8691 17.9552 96.752 17.8846C 96.7148 17.8619 96.6797 17.8362 96.6465 17.8076C 96.584 17.7534 96.5312 17.6895 96.4883 17.618C 96.4199 17.5026 96.3809 17.3677 96.3809 17.2235L 96.3809 6.39026C 96.3809 5.96521 96.0391 5.62012 95.6152 5.61792L 89.3887 5.61792C 88.9648 5.61792 88.6191 5.96362 88.6191 6.39026L 88.6191 17.2235C 88.6191 17.65 88.2754 17.9958 87.8496 17.9958L 84.7695 17.9958C 84.5996 17.9958 84.4434 17.9408 84.3164 17.8474C 84.125 17.7069 84 17.4799 84 17.2235L 84 1.76819ZM 71.5 4.99585C 69.0156 4.99585 67 7.01062 67 9.49585C 67 11.9811 69.0156 13.9959 71.5 13.9959C 73.9844 13.9959 76 11.9811 76 9.49585C 75.998 7.01148 73.9844 4.99817 71.5 4.99585ZM 102.613 1.14209L 103 1.14209L 103 1.98145L 103.314 1.98145L 103.314 1.40503L 103.314 1.22925L 103.865 1.99585L 104.119 1.98145L 104.67 1.21777L 104.67 1.40503L 104.67 1.98145L 105 1.98145L 105 0.99585L 104.555 0.99585L 104.002 1.76245L 103.49 0.99585L 103 0.99585L 102 0.99585L 102 1.14209L 102.387 1.14209L 102.387 1.99585L 102.617 1.99585L 102.613 1.14209Z"
+            fillRule="evenodd"
+            id="V"
+        />
+    </defs>
+</svg>,
+  <svg
+    height="30"
+    style={
+        Object {
+            "transform": "rotate(0deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 105 30"
+    width="105"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <g
+        transform="translate(26223 1404)"
+    >
+        <g>
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(-26177 -1383)"
+                    xlinkHref="#U"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#FFF"
+                    transform="translate(-26223 -1404)"
+                    xlinkHref="#V"
+                />
+            </g>
+        </g>
+    </g>
+    <defs>
+        <path
+            d="M 33.7583 0.147461L 35.9766 0.147461C 37.0186 0.147461 37.7723 0.303223 38.2378 0.614746C 38.7033 0.92627 38.936 1.41862 38.936 2.0918C 38.936 2.55729 38.8053 2.94222 38.5439 3.24658C 38.2861 3.54736 37.9084 3.74251 37.4106 3.83203L 37.4106 3.88574C 38.603 4.08984 39.1992 4.71647 39.1992 5.76562C 39.1992 6.46745 38.9611 7.0153 38.4849 7.40918C 38.0122 7.80306 37.3498 8 36.4976 8L 33.7583 8L 33.7583 0.147461ZM 34.6714 3.50977L 36.1753 3.50977C 36.8198 3.50977 37.2835 3.40951 37.5664 3.20898C 37.8493 3.00488 37.9907 2.66292 37.9907 2.18311C 37.9907 1.74268 37.8332 1.42578 37.5181 1.23242C 37.203 1.03548 36.7017 0.937012 36.0142 0.937012L 34.6714 0.937012L 34.6714 3.50977ZM 34.6714 4.2832L 34.6714 7.22119L 36.3096 7.22119C 36.9434 7.22119 37.4196 7.09945 37.7383 6.85596C 38.0605 6.60889 38.2217 6.22396 38.2217 5.70117C 38.2217 5.21419 38.057 4.85612 37.7275 4.62695C 37.4017 4.39779 36.904 4.2832 36.2344 4.2832L 34.6714 4.2832ZM 43.2437 8.10742C 42.3735 8.10742 41.686 7.84245 41.1812 7.3125C 40.6799 6.78255 40.4292 6.04671 40.4292 5.10498C 40.4292 4.15609 40.6619 3.40234 41.1274 2.84375C 41.5965 2.28516 42.2249 2.00586 43.0127 2.00586C 43.7503 2.00586 44.334 2.24935 44.7637 2.73633C 45.1934 3.21973 45.4082 3.85889 45.4082 4.65381L 45.4082 5.21777L 41.353 5.21777C 41.3709 5.90885 41.5446 6.43343 41.874 6.7915C 42.207 7.14958 42.6743 7.32861 43.2759 7.32861C 43.9097 7.32861 44.5363 7.19613 45.1558 6.93115L 45.1558 7.72607C 44.8407 7.86214 44.5417 7.95882 44.2588 8.01611C 43.9795 8.07699 43.6411 8.10742 43.2437 8.10742ZM 43.002 2.75244C 42.5293 2.75244 42.1515 2.90641 41.8687 3.21436C 41.5894 3.5223 41.4246 3.94841 41.3745 4.49268L 44.4521 4.49268C 44.4521 3.9305 44.3268 3.50081 44.0762 3.20361C 43.8255 2.90283 43.4674 2.75244 43.002 2.75244ZM 48.835 7.37158C 48.9925 7.37158 49.1447 7.36084 49.2915 7.33936C 49.4383 7.31429 49.5547 7.28923 49.6406 7.26416L 49.6406 7.94629C 49.5439 7.99284 49.4007 8.03044 49.2109 8.05908C 49.0247 8.09131 48.8564 8.10742 48.7061 8.10742C 47.5674 8.10742 46.998 7.50765 46.998 6.30811L 46.998 2.80615L 46.1548 2.80615L 46.1548 2.37646L 46.998 2.00586L 47.374 0.749023L 47.8896 0.749023L 47.8896 2.11328L 49.5977 2.11328L 49.5977 2.80615L 47.8896 2.80615L 47.8896 6.27051C 47.8896 6.625 47.9738 6.89714 48.1421 7.08691C 48.3104 7.27669 48.5413 7.37158 48.835 7.37158ZM 54.4424 8L 54.2651 7.16211L 54.2222 7.16211C 53.9285 7.53092 53.6349 7.78158 53.3413 7.91406C 53.0513 8.04297 52.6878 8.10742 52.251 8.10742C 51.6673 8.10742 51.209 7.95703 50.876 7.65625C 50.5465 7.35547 50.3818 6.92757 50.3818 6.37256C 50.3818 5.18376 51.3325 4.56071 53.2339 4.50342L 54.2329 4.47119L 54.2329 4.10596C 54.2329 3.64404 54.1326 3.30387 53.9321 3.08545C 53.7352 2.86344 53.4183 2.75244 52.9814 2.75244C 52.4909 2.75244 51.9359 2.90283 51.3164 3.20361L 51.0425 2.52148C 51.3325 2.36393 51.6494 2.2404 51.9932 2.15088C 52.3405 2.06136 52.6878 2.0166 53.0352 2.0166C 53.737 2.0166 54.2562 2.17236 54.5928 2.48389C 54.9329 2.79541 55.103 3.29492 55.103 3.98242L 55.103 8L 54.4424 8ZM 52.4282 7.37158C 52.9832 7.37158 53.4183 7.2194 53.7334 6.91504C 54.0521 6.61068 54.2114 6.18457 54.2114 5.63672L 54.2114 5.10498L 53.3198 5.14258C 52.6108 5.16764 52.0988 5.27865 51.7837 5.47559C 51.4722 5.66895 51.3164 5.97152 51.3164 6.3833C 51.3164 6.70557 51.4131 6.95085 51.6064 7.11914C 51.8034 7.28743 52.0773 7.37158 52.4282 7.37158Z"
+            id="U"
+        />
+        <path
+            d="M 81 9.49793C 81 4.25232 76.7461 5.90949e-07 71.5 5.90949e-07C 66.252 -0.00183046 62 4.25171 62 9.49793C 62 14.7435 66.2539 18.9958 71.5 18.9958C 76.7461 18.9958 81 14.7435 81 9.49793ZM 16.2266 0.99585L 0.773438 0.99585C 0.345703 0.99585 0 1.34168 0 1.76819L 0 4.86169C 0 5.09143 0.0996094 5.29773 0.259766 5.43921C 0.308594 5.48181 0.361328 5.51856 0.417969 5.54822C 0.523438 5.60303 0.644531 5.63403 0.773438 5.63403L 5.38281 5.63403C 5.80469 5.63391 6.14844 5.96997 6.15625 6.39026L 6.15625 17.2235C 6.15625 17.4979 6.29883 17.739 6.51562 17.876C 6.56445 17.9071 6.61719 17.9327 6.67383 17.9523L 6.78906 17.983C 6.83398 17.9915 6.88086 17.9958 6.92969 17.9958L 10.0215 17.9958C 10.4492 17.9958 10.7949 17.65 10.7949 17.2235L 10.7949 6.39026C 10.7949 5.96362 11.1406 5.61792 11.5684 5.61792L 16.248 5.61792C 16.4941 5.61145 16.7109 5.48962 16.8477 5.30469C 16.9414 5.17932 16.998 5.0249 17 4.85767L 17 1.76819C 17 1.34168 16.6543 0.99585 16.2266 0.99585ZM 33 1.76819L 33 4.86169C 33 5.28821 32.6504 5.63403 32.2168 5.63403L 25.4941 5.63403C 25.0605 5.63403 24.7109 5.97986 24.7109 6.40637L 24.7109 17.2235C 24.7109 17.65 24.3594 17.9958 23.9277 17.9958L 20.7871 17.9958C 20.5781 17.9969 20.3789 17.916 20.2305 17.771C 20.084 17.6261 20 17.4291 20 17.2235L 20 5.63001C 20.002 3.06995 22.1074 0.99585 24.7031 0.99585L 32.2168 0.99585C 32.6504 0.99585 33 1.34168 33 1.76819ZM 40.1719 0.99585L 36.834 0.99585C 36.6113 0.99585 36.4102 1.07593 36.2598 1.20654C 36.2188 1.24182 36.1816 1.28076 36.1504 1.32275L 36.0938 1.40906C 36.0352 1.51636 36 1.63855 36 1.76819L 36 17.2235C 36 17.65 36.373 17.9958 36.834 17.9958L 40.166 17.9958C 40.627 17.9958 41 17.65 41 17.2235L 41 1.76819C 41 1.34168 40.627 0.99585 40.1719 0.99585ZM 43.7715 0.99585L 59.2207 0.99585C 59.3535 0.99585 59.4785 1.02844 59.5879 1.08594C 59.7109 1.15112 59.8145 1.24829 59.8867 1.36633C 59.959 1.4834 60 1.62097 60 1.76819L 60 4.84546C 60 5.2721 59.6543 5.6178 59.2285 5.6178L 54.5664 5.6178C 54.1406 5.6178 53.7949 5.96362 53.7949 6.39026L 53.7949 17.2234C 53.7949 17.4678 53.6816 17.6857 53.5039 17.8271C 53.373 17.9326 53.2051 17.9957 53.0215 17.9957L 49.9297 17.9957C 49.7227 17.999 49.5234 17.9191 49.375 17.7739C 49.3105 17.7108 49.2598 17.6377 49.2207 17.5582C 49.1719 17.4547 49.1445 17.3405 49.1445 17.2234L 49.1445 6.39026C 49.1367 5.96997 48.793 5.63391 48.373 5.63403L 43.7715 5.63403C 43.3457 5.63403 43 5.28821 43 4.86169L 43 1.76819C 43 1.34168 43.3457 0.99585 43.7715 0.99585ZM 84 1.76819C 84 1.34168 84.3438 0.99585 84.7695 0.99585L 96.3809 0.99585C 98.9297 0.99585 100.998 3.06995 101 5.63001L 101 17.2235C 101 17.65 100.656 17.9958 100.23 17.9958L 97.1504 17.9958C 97.0039 17.9958 96.8691 17.9552 96.752 17.8846C 96.7148 17.8619 96.6797 17.8362 96.6465 17.8076C 96.584 17.7534 96.5312 17.6895 96.4883 17.618C 96.4199 17.5026 96.3809 17.3677 96.3809 17.2235L 96.3809 6.39026C 96.3809 5.96521 96.0391 5.62012 95.6152 5.61792L 89.3887 5.61792C 88.9648 5.61792 88.6191 5.96362 88.6191 6.39026L 88.6191 17.2235C 88.6191 17.65 88.2754 17.9958 87.8496 17.9958L 84.7695 17.9958C 84.5996 17.9958 84.4434 17.9408 84.3164 17.8474C 84.125 17.7069 84 17.4799 84 17.2235L 84 1.76819ZM 71.5 4.99585C 69.0156 4.99585 67 7.01062 67 9.49585C 67 11.9811 69.0156 13.9959 71.5 13.9959C 73.9844 13.9959 76 11.9811 76 9.49585C 75.998 7.01148 73.9844 4.99817 71.5 4.99585ZM 102.613 1.14209L 103 1.14209L 103 1.98145L 103.314 1.98145L 103.314 1.40503L 103.314 1.22925L 103.865 1.99585L 104.119 1.98145L 104.67 1.21777L 104.67 1.40503L 104.67 1.98145L 105 1.98145L 105 0.99585L 104.555 0.99585L 104.002 1.76245L 103.49 0.99585L 103 0.99585L 102 0.99585L 102 1.14209L 102.387 1.14209L 102.387 1.99585L 102.617 1.99585L 102.613 1.14209Z"
+            fillRule="evenodd"
+            id="V"
+        />
+    </defs>
+</svg>,
+  <svg
+    height="30"
+    style={
+        Object {
+            "transform": "rotate(0deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 105 30"
+    width="105"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <g
+        transform="translate(26223 1404)"
+    >
+        <g>
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(-26177 -1383)"
+                    xlinkHref="#U"
+                />
+            </g>
+            <g>
+                <use
+                    fill={undefined}
+                    transform="translate(-26223 -1404)"
+                    xlinkHref="#V"
+                />
+            </g>
+        </g>
+    </g>
+    <defs>
+        <path
+            d="M 33.7583 0.147461L 35.9766 0.147461C 37.0186 0.147461 37.7723 0.303223 38.2378 0.614746C 38.7033 0.92627 38.936 1.41862 38.936 2.0918C 38.936 2.55729 38.8053 2.94222 38.5439 3.24658C 38.2861 3.54736 37.9084 3.74251 37.4106 3.83203L 37.4106 3.88574C 38.603 4.08984 39.1992 4.71647 39.1992 5.76562C 39.1992 6.46745 38.9611 7.0153 38.4849 7.40918C 38.0122 7.80306 37.3498 8 36.4976 8L 33.7583 8L 33.7583 0.147461ZM 34.6714 3.50977L 36.1753 3.50977C 36.8198 3.50977 37.2835 3.40951 37.5664 3.20898C 37.8493 3.00488 37.9907 2.66292 37.9907 2.18311C 37.9907 1.74268 37.8332 1.42578 37.5181 1.23242C 37.203 1.03548 36.7017 0.937012 36.0142 0.937012L 34.6714 0.937012L 34.6714 3.50977ZM 34.6714 4.2832L 34.6714 7.22119L 36.3096 7.22119C 36.9434 7.22119 37.4196 7.09945 37.7383 6.85596C 38.0605 6.60889 38.2217 6.22396 38.2217 5.70117C 38.2217 5.21419 38.057 4.85612 37.7275 4.62695C 37.4017 4.39779 36.904 4.2832 36.2344 4.2832L 34.6714 4.2832ZM 43.2437 8.10742C 42.3735 8.10742 41.686 7.84245 41.1812 7.3125C 40.6799 6.78255 40.4292 6.04671 40.4292 5.10498C 40.4292 4.15609 40.6619 3.40234 41.1274 2.84375C 41.5965 2.28516 42.2249 2.00586 43.0127 2.00586C 43.7503 2.00586 44.334 2.24935 44.7637 2.73633C 45.1934 3.21973 45.4082 3.85889 45.4082 4.65381L 45.4082 5.21777L 41.353 5.21777C 41.3709 5.90885 41.5446 6.43343 41.874 6.7915C 42.207 7.14958 42.6743 7.32861 43.2759 7.32861C 43.9097 7.32861 44.5363 7.19613 45.1558 6.93115L 45.1558 7.72607C 44.8407 7.86214 44.5417 7.95882 44.2588 8.01611C 43.9795 8.07699 43.6411 8.10742 43.2437 8.10742ZM 43.002 2.75244C 42.5293 2.75244 42.1515 2.90641 41.8687 3.21436C 41.5894 3.5223 41.4246 3.94841 41.3745 4.49268L 44.4521 4.49268C 44.4521 3.9305 44.3268 3.50081 44.0762 3.20361C 43.8255 2.90283 43.4674 2.75244 43.002 2.75244ZM 48.835 7.37158C 48.9925 7.37158 49.1447 7.36084 49.2915 7.33936C 49.4383 7.31429 49.5547 7.28923 49.6406 7.26416L 49.6406 7.94629C 49.5439 7.99284 49.4007 8.03044 49.2109 8.05908C 49.0247 8.09131 48.8564 8.10742 48.7061 8.10742C 47.5674 8.10742 46.998 7.50765 46.998 6.30811L 46.998 2.80615L 46.1548 2.80615L 46.1548 2.37646L 46.998 2.00586L 47.374 0.749023L 47.8896 0.749023L 47.8896 2.11328L 49.5977 2.11328L 49.5977 2.80615L 47.8896 2.80615L 47.8896 6.27051C 47.8896 6.625 47.9738 6.89714 48.1421 7.08691C 48.3104 7.27669 48.5413 7.37158 48.835 7.37158ZM 54.4424 8L 54.2651 7.16211L 54.2222 7.16211C 53.9285 7.53092 53.6349 7.78158 53.3413 7.91406C 53.0513 8.04297 52.6878 8.10742 52.251 8.10742C 51.6673 8.10742 51.209 7.95703 50.876 7.65625C 50.5465 7.35547 50.3818 6.92757 50.3818 6.37256C 50.3818 5.18376 51.3325 4.56071 53.2339 4.50342L 54.2329 4.47119L 54.2329 4.10596C 54.2329 3.64404 54.1326 3.30387 53.9321 3.08545C 53.7352 2.86344 53.4183 2.75244 52.9814 2.75244C 52.4909 2.75244 51.9359 2.90283 51.3164 3.20361L 51.0425 2.52148C 51.3325 2.36393 51.6494 2.2404 51.9932 2.15088C 52.3405 2.06136 52.6878 2.0166 53.0352 2.0166C 53.737 2.0166 54.2562 2.17236 54.5928 2.48389C 54.9329 2.79541 55.103 3.29492 55.103 3.98242L 55.103 8L 54.4424 8ZM 52.4282 7.37158C 52.9832 7.37158 53.4183 7.2194 53.7334 6.91504C 54.0521 6.61068 54.2114 6.18457 54.2114 5.63672L 54.2114 5.10498L 53.3198 5.14258C 52.6108 5.16764 52.0988 5.27865 51.7837 5.47559C 51.4722 5.66895 51.3164 5.97152 51.3164 6.3833C 51.3164 6.70557 51.4131 6.95085 51.6064 7.11914C 51.8034 7.28743 52.0773 7.37158 52.4282 7.37158Z"
+            id="U"
+        />
+        <path
+            d="M 81 9.49793C 81 4.25232 76.7461 5.90949e-07 71.5 5.90949e-07C 66.252 -0.00183046 62 4.25171 62 9.49793C 62 14.7435 66.2539 18.9958 71.5 18.9958C 76.7461 18.9958 81 14.7435 81 9.49793ZM 16.2266 0.99585L 0.773438 0.99585C 0.345703 0.99585 0 1.34168 0 1.76819L 0 4.86169C 0 5.09143 0.0996094 5.29773 0.259766 5.43921C 0.308594 5.48181 0.361328 5.51856 0.417969 5.54822C 0.523438 5.60303 0.644531 5.63403 0.773438 5.63403L 5.38281 5.63403C 5.80469 5.63391 6.14844 5.96997 6.15625 6.39026L 6.15625 17.2235C 6.15625 17.4979 6.29883 17.739 6.51562 17.876C 6.56445 17.9071 6.61719 17.9327 6.67383 17.9523L 6.78906 17.983C 6.83398 17.9915 6.88086 17.9958 6.92969 17.9958L 10.0215 17.9958C 10.4492 17.9958 10.7949 17.65 10.7949 17.2235L 10.7949 6.39026C 10.7949 5.96362 11.1406 5.61792 11.5684 5.61792L 16.248 5.61792C 16.4941 5.61145 16.7109 5.48962 16.8477 5.30469C 16.9414 5.17932 16.998 5.0249 17 4.85767L 17 1.76819C 17 1.34168 16.6543 0.99585 16.2266 0.99585ZM 33 1.76819L 33 4.86169C 33 5.28821 32.6504 5.63403 32.2168 5.63403L 25.4941 5.63403C 25.0605 5.63403 24.7109 5.97986 24.7109 6.40637L 24.7109 17.2235C 24.7109 17.65 24.3594 17.9958 23.9277 17.9958L 20.7871 17.9958C 20.5781 17.9969 20.3789 17.916 20.2305 17.771C 20.084 17.6261 20 17.4291 20 17.2235L 20 5.63001C 20.002 3.06995 22.1074 0.99585 24.7031 0.99585L 32.2168 0.99585C 32.6504 0.99585 33 1.34168 33 1.76819ZM 40.1719 0.99585L 36.834 0.99585C 36.6113 0.99585 36.4102 1.07593 36.2598 1.20654C 36.2188 1.24182 36.1816 1.28076 36.1504 1.32275L 36.0938 1.40906C 36.0352 1.51636 36 1.63855 36 1.76819L 36 17.2235C 36 17.65 36.373 17.9958 36.834 17.9958L 40.166 17.9958C 40.627 17.9958 41 17.65 41 17.2235L 41 1.76819C 41 1.34168 40.627 0.99585 40.1719 0.99585ZM 43.7715 0.99585L 59.2207 0.99585C 59.3535 0.99585 59.4785 1.02844 59.5879 1.08594C 59.7109 1.15112 59.8145 1.24829 59.8867 1.36633C 59.959 1.4834 60 1.62097 60 1.76819L 60 4.84546C 60 5.2721 59.6543 5.6178 59.2285 5.6178L 54.5664 5.6178C 54.1406 5.6178 53.7949 5.96362 53.7949 6.39026L 53.7949 17.2234C 53.7949 17.4678 53.6816 17.6857 53.5039 17.8271C 53.373 17.9326 53.2051 17.9957 53.0215 17.9957L 49.9297 17.9957C 49.7227 17.999 49.5234 17.9191 49.375 17.7739C 49.3105 17.7108 49.2598 17.6377 49.2207 17.5582C 49.1719 17.4547 49.1445 17.3405 49.1445 17.2234L 49.1445 6.39026C 49.1367 5.96997 48.793 5.63391 48.373 5.63403L 43.7715 5.63403C 43.3457 5.63403 43 5.28821 43 4.86169L 43 1.76819C 43 1.34168 43.3457 0.99585 43.7715 0.99585ZM 84 1.76819C 84 1.34168 84.3438 0.99585 84.7695 0.99585L 96.3809 0.99585C 98.9297 0.99585 100.998 3.06995 101 5.63001L 101 17.2235C 101 17.65 100.656 17.9958 100.23 17.9958L 97.1504 17.9958C 97.0039 17.9958 96.8691 17.9552 96.752 17.8846C 96.7148 17.8619 96.6797 17.8362 96.6465 17.8076C 96.584 17.7534 96.5312 17.6895 96.4883 17.618C 96.4199 17.5026 96.3809 17.3677 96.3809 17.2235L 96.3809 6.39026C 96.3809 5.96521 96.0391 5.62012 95.6152 5.61792L 89.3887 5.61792C 88.9648 5.61792 88.6191 5.96362 88.6191 6.39026L 88.6191 17.2235C 88.6191 17.65 88.2754 17.9958 87.8496 17.9958L 84.7695 17.9958C 84.5996 17.9958 84.4434 17.9408 84.3164 17.8474C 84.125 17.7069 84 17.4799 84 17.2235L 84 1.76819ZM 71.5 4.99585C 69.0156 4.99585 67 7.01062 67 9.49585C 67 11.9811 69.0156 13.9959 71.5 13.9959C 73.9844 13.9959 76 11.9811 76 9.49585C 75.998 7.01148 73.9844 4.99817 71.5 4.99585ZM 102.613 1.14209L 103 1.14209L 103 1.98145L 103.314 1.98145L 103.314 1.40503L 103.314 1.22925L 103.865 1.99585L 104.119 1.98145L 104.67 1.21777L 104.67 1.40503L 104.67 1.98145L 105 1.98145L 105 0.99585L 104.555 0.99585L 104.002 1.76245L 103.49 0.99585L 103 0.99585L 102 0.99585L 102 1.14209L 102.387 1.14209L 102.387 1.99585L 102.617 1.99585L 102.613 1.14209Z"
+            fillRule="evenodd"
+            id="V"
+        />
+    </defs>
+</svg>,
+  <svg
+    height="30"
+    style={
+        Object {
+            "transform": "rotate(90deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 105 30"
+    width="105"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <g
+        transform="translate(26223 1404)"
+    >
+        <g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(-26177 -1383)"
+                    xlinkHref="#U"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(-26223 -1404)"
+                    xlinkHref="#V"
+                />
+            </g>
+        </g>
+    </g>
+    <defs>
+        <path
+            d="M 33.7583 0.147461L 35.9766 0.147461C 37.0186 0.147461 37.7723 0.303223 38.2378 0.614746C 38.7033 0.92627 38.936 1.41862 38.936 2.0918C 38.936 2.55729 38.8053 2.94222 38.5439 3.24658C 38.2861 3.54736 37.9084 3.74251 37.4106 3.83203L 37.4106 3.88574C 38.603 4.08984 39.1992 4.71647 39.1992 5.76562C 39.1992 6.46745 38.9611 7.0153 38.4849 7.40918C 38.0122 7.80306 37.3498 8 36.4976 8L 33.7583 8L 33.7583 0.147461ZM 34.6714 3.50977L 36.1753 3.50977C 36.8198 3.50977 37.2835 3.40951 37.5664 3.20898C 37.8493 3.00488 37.9907 2.66292 37.9907 2.18311C 37.9907 1.74268 37.8332 1.42578 37.5181 1.23242C 37.203 1.03548 36.7017 0.937012 36.0142 0.937012L 34.6714 0.937012L 34.6714 3.50977ZM 34.6714 4.2832L 34.6714 7.22119L 36.3096 7.22119C 36.9434 7.22119 37.4196 7.09945 37.7383 6.85596C 38.0605 6.60889 38.2217 6.22396 38.2217 5.70117C 38.2217 5.21419 38.057 4.85612 37.7275 4.62695C 37.4017 4.39779 36.904 4.2832 36.2344 4.2832L 34.6714 4.2832ZM 43.2437 8.10742C 42.3735 8.10742 41.686 7.84245 41.1812 7.3125C 40.6799 6.78255 40.4292 6.04671 40.4292 5.10498C 40.4292 4.15609 40.6619 3.40234 41.1274 2.84375C 41.5965 2.28516 42.2249 2.00586 43.0127 2.00586C 43.7503 2.00586 44.334 2.24935 44.7637 2.73633C 45.1934 3.21973 45.4082 3.85889 45.4082 4.65381L 45.4082 5.21777L 41.353 5.21777C 41.3709 5.90885 41.5446 6.43343 41.874 6.7915C 42.207 7.14958 42.6743 7.32861 43.2759 7.32861C 43.9097 7.32861 44.5363 7.19613 45.1558 6.93115L 45.1558 7.72607C 44.8407 7.86214 44.5417 7.95882 44.2588 8.01611C 43.9795 8.07699 43.6411 8.10742 43.2437 8.10742ZM 43.002 2.75244C 42.5293 2.75244 42.1515 2.90641 41.8687 3.21436C 41.5894 3.5223 41.4246 3.94841 41.3745 4.49268L 44.4521 4.49268C 44.4521 3.9305 44.3268 3.50081 44.0762 3.20361C 43.8255 2.90283 43.4674 2.75244 43.002 2.75244ZM 48.835 7.37158C 48.9925 7.37158 49.1447 7.36084 49.2915 7.33936C 49.4383 7.31429 49.5547 7.28923 49.6406 7.26416L 49.6406 7.94629C 49.5439 7.99284 49.4007 8.03044 49.2109 8.05908C 49.0247 8.09131 48.8564 8.10742 48.7061 8.10742C 47.5674 8.10742 46.998 7.50765 46.998 6.30811L 46.998 2.80615L 46.1548 2.80615L 46.1548 2.37646L 46.998 2.00586L 47.374 0.749023L 47.8896 0.749023L 47.8896 2.11328L 49.5977 2.11328L 49.5977 2.80615L 47.8896 2.80615L 47.8896 6.27051C 47.8896 6.625 47.9738 6.89714 48.1421 7.08691C 48.3104 7.27669 48.5413 7.37158 48.835 7.37158ZM 54.4424 8L 54.2651 7.16211L 54.2222 7.16211C 53.9285 7.53092 53.6349 7.78158 53.3413 7.91406C 53.0513 8.04297 52.6878 8.10742 52.251 8.10742C 51.6673 8.10742 51.209 7.95703 50.876 7.65625C 50.5465 7.35547 50.3818 6.92757 50.3818 6.37256C 50.3818 5.18376 51.3325 4.56071 53.2339 4.50342L 54.2329 4.47119L 54.2329 4.10596C 54.2329 3.64404 54.1326 3.30387 53.9321 3.08545C 53.7352 2.86344 53.4183 2.75244 52.9814 2.75244C 52.4909 2.75244 51.9359 2.90283 51.3164 3.20361L 51.0425 2.52148C 51.3325 2.36393 51.6494 2.2404 51.9932 2.15088C 52.3405 2.06136 52.6878 2.0166 53.0352 2.0166C 53.737 2.0166 54.2562 2.17236 54.5928 2.48389C 54.9329 2.79541 55.103 3.29492 55.103 3.98242L 55.103 8L 54.4424 8ZM 52.4282 7.37158C 52.9832 7.37158 53.4183 7.2194 53.7334 6.91504C 54.0521 6.61068 54.2114 6.18457 54.2114 5.63672L 54.2114 5.10498L 53.3198 5.14258C 52.6108 5.16764 52.0988 5.27865 51.7837 5.47559C 51.4722 5.66895 51.3164 5.97152 51.3164 6.3833C 51.3164 6.70557 51.4131 6.95085 51.6064 7.11914C 51.8034 7.28743 52.0773 7.37158 52.4282 7.37158Z"
+            id="U"
+        />
+        <path
+            d="M 81 9.49793C 81 4.25232 76.7461 5.90949e-07 71.5 5.90949e-07C 66.252 -0.00183046 62 4.25171 62 9.49793C 62 14.7435 66.2539 18.9958 71.5 18.9958C 76.7461 18.9958 81 14.7435 81 9.49793ZM 16.2266 0.99585L 0.773438 0.99585C 0.345703 0.99585 0 1.34168 0 1.76819L 0 4.86169C 0 5.09143 0.0996094 5.29773 0.259766 5.43921C 0.308594 5.48181 0.361328 5.51856 0.417969 5.54822C 0.523438 5.60303 0.644531 5.63403 0.773438 5.63403L 5.38281 5.63403C 5.80469 5.63391 6.14844 5.96997 6.15625 6.39026L 6.15625 17.2235C 6.15625 17.4979 6.29883 17.739 6.51562 17.876C 6.56445 17.9071 6.61719 17.9327 6.67383 17.9523L 6.78906 17.983C 6.83398 17.9915 6.88086 17.9958 6.92969 17.9958L 10.0215 17.9958C 10.4492 17.9958 10.7949 17.65 10.7949 17.2235L 10.7949 6.39026C 10.7949 5.96362 11.1406 5.61792 11.5684 5.61792L 16.248 5.61792C 16.4941 5.61145 16.7109 5.48962 16.8477 5.30469C 16.9414 5.17932 16.998 5.0249 17 4.85767L 17 1.76819C 17 1.34168 16.6543 0.99585 16.2266 0.99585ZM 33 1.76819L 33 4.86169C 33 5.28821 32.6504 5.63403 32.2168 5.63403L 25.4941 5.63403C 25.0605 5.63403 24.7109 5.97986 24.7109 6.40637L 24.7109 17.2235C 24.7109 17.65 24.3594 17.9958 23.9277 17.9958L 20.7871 17.9958C 20.5781 17.9969 20.3789 17.916 20.2305 17.771C 20.084 17.6261 20 17.4291 20 17.2235L 20 5.63001C 20.002 3.06995 22.1074 0.99585 24.7031 0.99585L 32.2168 0.99585C 32.6504 0.99585 33 1.34168 33 1.76819ZM 40.1719 0.99585L 36.834 0.99585C 36.6113 0.99585 36.4102 1.07593 36.2598 1.20654C 36.2188 1.24182 36.1816 1.28076 36.1504 1.32275L 36.0938 1.40906C 36.0352 1.51636 36 1.63855 36 1.76819L 36 17.2235C 36 17.65 36.373 17.9958 36.834 17.9958L 40.166 17.9958C 40.627 17.9958 41 17.65 41 17.2235L 41 1.76819C 41 1.34168 40.627 0.99585 40.1719 0.99585ZM 43.7715 0.99585L 59.2207 0.99585C 59.3535 0.99585 59.4785 1.02844 59.5879 1.08594C 59.7109 1.15112 59.8145 1.24829 59.8867 1.36633C 59.959 1.4834 60 1.62097 60 1.76819L 60 4.84546C 60 5.2721 59.6543 5.6178 59.2285 5.6178L 54.5664 5.6178C 54.1406 5.6178 53.7949 5.96362 53.7949 6.39026L 53.7949 17.2234C 53.7949 17.4678 53.6816 17.6857 53.5039 17.8271C 53.373 17.9326 53.2051 17.9957 53.0215 17.9957L 49.9297 17.9957C 49.7227 17.999 49.5234 17.9191 49.375 17.7739C 49.3105 17.7108 49.2598 17.6377 49.2207 17.5582C 49.1719 17.4547 49.1445 17.3405 49.1445 17.2234L 49.1445 6.39026C 49.1367 5.96997 48.793 5.63391 48.373 5.63403L 43.7715 5.63403C 43.3457 5.63403 43 5.28821 43 4.86169L 43 1.76819C 43 1.34168 43.3457 0.99585 43.7715 0.99585ZM 84 1.76819C 84 1.34168 84.3438 0.99585 84.7695 0.99585L 96.3809 0.99585C 98.9297 0.99585 100.998 3.06995 101 5.63001L 101 17.2235C 101 17.65 100.656 17.9958 100.23 17.9958L 97.1504 17.9958C 97.0039 17.9958 96.8691 17.9552 96.752 17.8846C 96.7148 17.8619 96.6797 17.8362 96.6465 17.8076C 96.584 17.7534 96.5312 17.6895 96.4883 17.618C 96.4199 17.5026 96.3809 17.3677 96.3809 17.2235L 96.3809 6.39026C 96.3809 5.96521 96.0391 5.62012 95.6152 5.61792L 89.3887 5.61792C 88.9648 5.61792 88.6191 5.96362 88.6191 6.39026L 88.6191 17.2235C 88.6191 17.65 88.2754 17.9958 87.8496 17.9958L 84.7695 17.9958C 84.5996 17.9958 84.4434 17.9408 84.3164 17.8474C 84.125 17.7069 84 17.4799 84 17.2235L 84 1.76819ZM 71.5 4.99585C 69.0156 4.99585 67 7.01062 67 9.49585C 67 11.9811 69.0156 13.9959 71.5 13.9959C 73.9844 13.9959 76 11.9811 76 9.49585C 75.998 7.01148 73.9844 4.99817 71.5 4.99585ZM 102.613 1.14209L 103 1.14209L 103 1.98145L 103.314 1.98145L 103.314 1.40503L 103.314 1.22925L 103.865 1.99585L 104.119 1.98145L 104.67 1.21777L 104.67 1.40503L 104.67 1.98145L 105 1.98145L 105 0.99585L 104.555 0.99585L 104.002 1.76245L 103.49 0.99585L 103 0.99585L 102 0.99585L 102 1.14209L 102.387 1.14209L 102.387 1.99585L 102.617 1.99585L 102.613 1.14209Z"
+            fillRule="evenodd"
+            id="V"
+        />
+    </defs>
+</svg>,
+  <svg
+    height="30"
+    style={
+        Object {
+            "transform": "rotate(180deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 105 30"
+    width="105"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <g
+        transform="translate(26223 1404)"
+    >
+        <g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(-26177 -1383)"
+                    xlinkHref="#U"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(-26223 -1404)"
+                    xlinkHref="#V"
+                />
+            </g>
+        </g>
+    </g>
+    <defs>
+        <path
+            d="M 33.7583 0.147461L 35.9766 0.147461C 37.0186 0.147461 37.7723 0.303223 38.2378 0.614746C 38.7033 0.92627 38.936 1.41862 38.936 2.0918C 38.936 2.55729 38.8053 2.94222 38.5439 3.24658C 38.2861 3.54736 37.9084 3.74251 37.4106 3.83203L 37.4106 3.88574C 38.603 4.08984 39.1992 4.71647 39.1992 5.76562C 39.1992 6.46745 38.9611 7.0153 38.4849 7.40918C 38.0122 7.80306 37.3498 8 36.4976 8L 33.7583 8L 33.7583 0.147461ZM 34.6714 3.50977L 36.1753 3.50977C 36.8198 3.50977 37.2835 3.40951 37.5664 3.20898C 37.8493 3.00488 37.9907 2.66292 37.9907 2.18311C 37.9907 1.74268 37.8332 1.42578 37.5181 1.23242C 37.203 1.03548 36.7017 0.937012 36.0142 0.937012L 34.6714 0.937012L 34.6714 3.50977ZM 34.6714 4.2832L 34.6714 7.22119L 36.3096 7.22119C 36.9434 7.22119 37.4196 7.09945 37.7383 6.85596C 38.0605 6.60889 38.2217 6.22396 38.2217 5.70117C 38.2217 5.21419 38.057 4.85612 37.7275 4.62695C 37.4017 4.39779 36.904 4.2832 36.2344 4.2832L 34.6714 4.2832ZM 43.2437 8.10742C 42.3735 8.10742 41.686 7.84245 41.1812 7.3125C 40.6799 6.78255 40.4292 6.04671 40.4292 5.10498C 40.4292 4.15609 40.6619 3.40234 41.1274 2.84375C 41.5965 2.28516 42.2249 2.00586 43.0127 2.00586C 43.7503 2.00586 44.334 2.24935 44.7637 2.73633C 45.1934 3.21973 45.4082 3.85889 45.4082 4.65381L 45.4082 5.21777L 41.353 5.21777C 41.3709 5.90885 41.5446 6.43343 41.874 6.7915C 42.207 7.14958 42.6743 7.32861 43.2759 7.32861C 43.9097 7.32861 44.5363 7.19613 45.1558 6.93115L 45.1558 7.72607C 44.8407 7.86214 44.5417 7.95882 44.2588 8.01611C 43.9795 8.07699 43.6411 8.10742 43.2437 8.10742ZM 43.002 2.75244C 42.5293 2.75244 42.1515 2.90641 41.8687 3.21436C 41.5894 3.5223 41.4246 3.94841 41.3745 4.49268L 44.4521 4.49268C 44.4521 3.9305 44.3268 3.50081 44.0762 3.20361C 43.8255 2.90283 43.4674 2.75244 43.002 2.75244ZM 48.835 7.37158C 48.9925 7.37158 49.1447 7.36084 49.2915 7.33936C 49.4383 7.31429 49.5547 7.28923 49.6406 7.26416L 49.6406 7.94629C 49.5439 7.99284 49.4007 8.03044 49.2109 8.05908C 49.0247 8.09131 48.8564 8.10742 48.7061 8.10742C 47.5674 8.10742 46.998 7.50765 46.998 6.30811L 46.998 2.80615L 46.1548 2.80615L 46.1548 2.37646L 46.998 2.00586L 47.374 0.749023L 47.8896 0.749023L 47.8896 2.11328L 49.5977 2.11328L 49.5977 2.80615L 47.8896 2.80615L 47.8896 6.27051C 47.8896 6.625 47.9738 6.89714 48.1421 7.08691C 48.3104 7.27669 48.5413 7.37158 48.835 7.37158ZM 54.4424 8L 54.2651 7.16211L 54.2222 7.16211C 53.9285 7.53092 53.6349 7.78158 53.3413 7.91406C 53.0513 8.04297 52.6878 8.10742 52.251 8.10742C 51.6673 8.10742 51.209 7.95703 50.876 7.65625C 50.5465 7.35547 50.3818 6.92757 50.3818 6.37256C 50.3818 5.18376 51.3325 4.56071 53.2339 4.50342L 54.2329 4.47119L 54.2329 4.10596C 54.2329 3.64404 54.1326 3.30387 53.9321 3.08545C 53.7352 2.86344 53.4183 2.75244 52.9814 2.75244C 52.4909 2.75244 51.9359 2.90283 51.3164 3.20361L 51.0425 2.52148C 51.3325 2.36393 51.6494 2.2404 51.9932 2.15088C 52.3405 2.06136 52.6878 2.0166 53.0352 2.0166C 53.737 2.0166 54.2562 2.17236 54.5928 2.48389C 54.9329 2.79541 55.103 3.29492 55.103 3.98242L 55.103 8L 54.4424 8ZM 52.4282 7.37158C 52.9832 7.37158 53.4183 7.2194 53.7334 6.91504C 54.0521 6.61068 54.2114 6.18457 54.2114 5.63672L 54.2114 5.10498L 53.3198 5.14258C 52.6108 5.16764 52.0988 5.27865 51.7837 5.47559C 51.4722 5.66895 51.3164 5.97152 51.3164 6.3833C 51.3164 6.70557 51.4131 6.95085 51.6064 7.11914C 51.8034 7.28743 52.0773 7.37158 52.4282 7.37158Z"
+            id="U"
+        />
+        <path
+            d="M 81 9.49793C 81 4.25232 76.7461 5.90949e-07 71.5 5.90949e-07C 66.252 -0.00183046 62 4.25171 62 9.49793C 62 14.7435 66.2539 18.9958 71.5 18.9958C 76.7461 18.9958 81 14.7435 81 9.49793ZM 16.2266 0.99585L 0.773438 0.99585C 0.345703 0.99585 0 1.34168 0 1.76819L 0 4.86169C 0 5.09143 0.0996094 5.29773 0.259766 5.43921C 0.308594 5.48181 0.361328 5.51856 0.417969 5.54822C 0.523438 5.60303 0.644531 5.63403 0.773438 5.63403L 5.38281 5.63403C 5.80469 5.63391 6.14844 5.96997 6.15625 6.39026L 6.15625 17.2235C 6.15625 17.4979 6.29883 17.739 6.51562 17.876C 6.56445 17.9071 6.61719 17.9327 6.67383 17.9523L 6.78906 17.983C 6.83398 17.9915 6.88086 17.9958 6.92969 17.9958L 10.0215 17.9958C 10.4492 17.9958 10.7949 17.65 10.7949 17.2235L 10.7949 6.39026C 10.7949 5.96362 11.1406 5.61792 11.5684 5.61792L 16.248 5.61792C 16.4941 5.61145 16.7109 5.48962 16.8477 5.30469C 16.9414 5.17932 16.998 5.0249 17 4.85767L 17 1.76819C 17 1.34168 16.6543 0.99585 16.2266 0.99585ZM 33 1.76819L 33 4.86169C 33 5.28821 32.6504 5.63403 32.2168 5.63403L 25.4941 5.63403C 25.0605 5.63403 24.7109 5.97986 24.7109 6.40637L 24.7109 17.2235C 24.7109 17.65 24.3594 17.9958 23.9277 17.9958L 20.7871 17.9958C 20.5781 17.9969 20.3789 17.916 20.2305 17.771C 20.084 17.6261 20 17.4291 20 17.2235L 20 5.63001C 20.002 3.06995 22.1074 0.99585 24.7031 0.99585L 32.2168 0.99585C 32.6504 0.99585 33 1.34168 33 1.76819ZM 40.1719 0.99585L 36.834 0.99585C 36.6113 0.99585 36.4102 1.07593 36.2598 1.20654C 36.2188 1.24182 36.1816 1.28076 36.1504 1.32275L 36.0938 1.40906C 36.0352 1.51636 36 1.63855 36 1.76819L 36 17.2235C 36 17.65 36.373 17.9958 36.834 17.9958L 40.166 17.9958C 40.627 17.9958 41 17.65 41 17.2235L 41 1.76819C 41 1.34168 40.627 0.99585 40.1719 0.99585ZM 43.7715 0.99585L 59.2207 0.99585C 59.3535 0.99585 59.4785 1.02844 59.5879 1.08594C 59.7109 1.15112 59.8145 1.24829 59.8867 1.36633C 59.959 1.4834 60 1.62097 60 1.76819L 60 4.84546C 60 5.2721 59.6543 5.6178 59.2285 5.6178L 54.5664 5.6178C 54.1406 5.6178 53.7949 5.96362 53.7949 6.39026L 53.7949 17.2234C 53.7949 17.4678 53.6816 17.6857 53.5039 17.8271C 53.373 17.9326 53.2051 17.9957 53.0215 17.9957L 49.9297 17.9957C 49.7227 17.999 49.5234 17.9191 49.375 17.7739C 49.3105 17.7108 49.2598 17.6377 49.2207 17.5582C 49.1719 17.4547 49.1445 17.3405 49.1445 17.2234L 49.1445 6.39026C 49.1367 5.96997 48.793 5.63391 48.373 5.63403L 43.7715 5.63403C 43.3457 5.63403 43 5.28821 43 4.86169L 43 1.76819C 43 1.34168 43.3457 0.99585 43.7715 0.99585ZM 84 1.76819C 84 1.34168 84.3438 0.99585 84.7695 0.99585L 96.3809 0.99585C 98.9297 0.99585 100.998 3.06995 101 5.63001L 101 17.2235C 101 17.65 100.656 17.9958 100.23 17.9958L 97.1504 17.9958C 97.0039 17.9958 96.8691 17.9552 96.752 17.8846C 96.7148 17.8619 96.6797 17.8362 96.6465 17.8076C 96.584 17.7534 96.5312 17.6895 96.4883 17.618C 96.4199 17.5026 96.3809 17.3677 96.3809 17.2235L 96.3809 6.39026C 96.3809 5.96521 96.0391 5.62012 95.6152 5.61792L 89.3887 5.61792C 88.9648 5.61792 88.6191 5.96362 88.6191 6.39026L 88.6191 17.2235C 88.6191 17.65 88.2754 17.9958 87.8496 17.9958L 84.7695 17.9958C 84.5996 17.9958 84.4434 17.9408 84.3164 17.8474C 84.125 17.7069 84 17.4799 84 17.2235L 84 1.76819ZM 71.5 4.99585C 69.0156 4.99585 67 7.01062 67 9.49585C 67 11.9811 69.0156 13.9959 71.5 13.9959C 73.9844 13.9959 76 11.9811 76 9.49585C 75.998 7.01148 73.9844 4.99817 71.5 4.99585ZM 102.613 1.14209L 103 1.14209L 103 1.98145L 103.314 1.98145L 103.314 1.40503L 103.314 1.22925L 103.865 1.99585L 104.119 1.98145L 104.67 1.21777L 104.67 1.40503L 104.67 1.98145L 105 1.98145L 105 0.99585L 104.555 0.99585L 104.002 1.76245L 103.49 0.99585L 103 0.99585L 102 0.99585L 102 1.14209L 102.387 1.14209L 102.387 1.99585L 102.617 1.99585L 102.613 1.14209Z"
+            fillRule="evenodd"
+            id="V"
+        />
+    </defs>
+</svg>,
+  <svg
+    height="30"
+    style={
+        Object {
+            "transform": "rotate(-90deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 105 30"
+    width="105"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <g
+        transform="translate(26223 1404)"
+    >
+        <g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(-26177 -1383)"
+                    xlinkHref="#U"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(-26223 -1404)"
+                    xlinkHref="#V"
+                />
+            </g>
+        </g>
+    </g>
+    <defs>
+        <path
+            d="M 33.7583 0.147461L 35.9766 0.147461C 37.0186 0.147461 37.7723 0.303223 38.2378 0.614746C 38.7033 0.92627 38.936 1.41862 38.936 2.0918C 38.936 2.55729 38.8053 2.94222 38.5439 3.24658C 38.2861 3.54736 37.9084 3.74251 37.4106 3.83203L 37.4106 3.88574C 38.603 4.08984 39.1992 4.71647 39.1992 5.76562C 39.1992 6.46745 38.9611 7.0153 38.4849 7.40918C 38.0122 7.80306 37.3498 8 36.4976 8L 33.7583 8L 33.7583 0.147461ZM 34.6714 3.50977L 36.1753 3.50977C 36.8198 3.50977 37.2835 3.40951 37.5664 3.20898C 37.8493 3.00488 37.9907 2.66292 37.9907 2.18311C 37.9907 1.74268 37.8332 1.42578 37.5181 1.23242C 37.203 1.03548 36.7017 0.937012 36.0142 0.937012L 34.6714 0.937012L 34.6714 3.50977ZM 34.6714 4.2832L 34.6714 7.22119L 36.3096 7.22119C 36.9434 7.22119 37.4196 7.09945 37.7383 6.85596C 38.0605 6.60889 38.2217 6.22396 38.2217 5.70117C 38.2217 5.21419 38.057 4.85612 37.7275 4.62695C 37.4017 4.39779 36.904 4.2832 36.2344 4.2832L 34.6714 4.2832ZM 43.2437 8.10742C 42.3735 8.10742 41.686 7.84245 41.1812 7.3125C 40.6799 6.78255 40.4292 6.04671 40.4292 5.10498C 40.4292 4.15609 40.6619 3.40234 41.1274 2.84375C 41.5965 2.28516 42.2249 2.00586 43.0127 2.00586C 43.7503 2.00586 44.334 2.24935 44.7637 2.73633C 45.1934 3.21973 45.4082 3.85889 45.4082 4.65381L 45.4082 5.21777L 41.353 5.21777C 41.3709 5.90885 41.5446 6.43343 41.874 6.7915C 42.207 7.14958 42.6743 7.32861 43.2759 7.32861C 43.9097 7.32861 44.5363 7.19613 45.1558 6.93115L 45.1558 7.72607C 44.8407 7.86214 44.5417 7.95882 44.2588 8.01611C 43.9795 8.07699 43.6411 8.10742 43.2437 8.10742ZM 43.002 2.75244C 42.5293 2.75244 42.1515 2.90641 41.8687 3.21436C 41.5894 3.5223 41.4246 3.94841 41.3745 4.49268L 44.4521 4.49268C 44.4521 3.9305 44.3268 3.50081 44.0762 3.20361C 43.8255 2.90283 43.4674 2.75244 43.002 2.75244ZM 48.835 7.37158C 48.9925 7.37158 49.1447 7.36084 49.2915 7.33936C 49.4383 7.31429 49.5547 7.28923 49.6406 7.26416L 49.6406 7.94629C 49.5439 7.99284 49.4007 8.03044 49.2109 8.05908C 49.0247 8.09131 48.8564 8.10742 48.7061 8.10742C 47.5674 8.10742 46.998 7.50765 46.998 6.30811L 46.998 2.80615L 46.1548 2.80615L 46.1548 2.37646L 46.998 2.00586L 47.374 0.749023L 47.8896 0.749023L 47.8896 2.11328L 49.5977 2.11328L 49.5977 2.80615L 47.8896 2.80615L 47.8896 6.27051C 47.8896 6.625 47.9738 6.89714 48.1421 7.08691C 48.3104 7.27669 48.5413 7.37158 48.835 7.37158ZM 54.4424 8L 54.2651 7.16211L 54.2222 7.16211C 53.9285 7.53092 53.6349 7.78158 53.3413 7.91406C 53.0513 8.04297 52.6878 8.10742 52.251 8.10742C 51.6673 8.10742 51.209 7.95703 50.876 7.65625C 50.5465 7.35547 50.3818 6.92757 50.3818 6.37256C 50.3818 5.18376 51.3325 4.56071 53.2339 4.50342L 54.2329 4.47119L 54.2329 4.10596C 54.2329 3.64404 54.1326 3.30387 53.9321 3.08545C 53.7352 2.86344 53.4183 2.75244 52.9814 2.75244C 52.4909 2.75244 51.9359 2.90283 51.3164 3.20361L 51.0425 2.52148C 51.3325 2.36393 51.6494 2.2404 51.9932 2.15088C 52.3405 2.06136 52.6878 2.0166 53.0352 2.0166C 53.737 2.0166 54.2562 2.17236 54.5928 2.48389C 54.9329 2.79541 55.103 3.29492 55.103 3.98242L 55.103 8L 54.4424 8ZM 52.4282 7.37158C 52.9832 7.37158 53.4183 7.2194 53.7334 6.91504C 54.0521 6.61068 54.2114 6.18457 54.2114 5.63672L 54.2114 5.10498L 53.3198 5.14258C 52.6108 5.16764 52.0988 5.27865 51.7837 5.47559C 51.4722 5.66895 51.3164 5.97152 51.3164 6.3833C 51.3164 6.70557 51.4131 6.95085 51.6064 7.11914C 51.8034 7.28743 52.0773 7.37158 52.4282 7.37158Z"
+            id="U"
+        />
+        <path
+            d="M 81 9.49793C 81 4.25232 76.7461 5.90949e-07 71.5 5.90949e-07C 66.252 -0.00183046 62 4.25171 62 9.49793C 62 14.7435 66.2539 18.9958 71.5 18.9958C 76.7461 18.9958 81 14.7435 81 9.49793ZM 16.2266 0.99585L 0.773438 0.99585C 0.345703 0.99585 0 1.34168 0 1.76819L 0 4.86169C 0 5.09143 0.0996094 5.29773 0.259766 5.43921C 0.308594 5.48181 0.361328 5.51856 0.417969 5.54822C 0.523438 5.60303 0.644531 5.63403 0.773438 5.63403L 5.38281 5.63403C 5.80469 5.63391 6.14844 5.96997 6.15625 6.39026L 6.15625 17.2235C 6.15625 17.4979 6.29883 17.739 6.51562 17.876C 6.56445 17.9071 6.61719 17.9327 6.67383 17.9523L 6.78906 17.983C 6.83398 17.9915 6.88086 17.9958 6.92969 17.9958L 10.0215 17.9958C 10.4492 17.9958 10.7949 17.65 10.7949 17.2235L 10.7949 6.39026C 10.7949 5.96362 11.1406 5.61792 11.5684 5.61792L 16.248 5.61792C 16.4941 5.61145 16.7109 5.48962 16.8477 5.30469C 16.9414 5.17932 16.998 5.0249 17 4.85767L 17 1.76819C 17 1.34168 16.6543 0.99585 16.2266 0.99585ZM 33 1.76819L 33 4.86169C 33 5.28821 32.6504 5.63403 32.2168 5.63403L 25.4941 5.63403C 25.0605 5.63403 24.7109 5.97986 24.7109 6.40637L 24.7109 17.2235C 24.7109 17.65 24.3594 17.9958 23.9277 17.9958L 20.7871 17.9958C 20.5781 17.9969 20.3789 17.916 20.2305 17.771C 20.084 17.6261 20 17.4291 20 17.2235L 20 5.63001C 20.002 3.06995 22.1074 0.99585 24.7031 0.99585L 32.2168 0.99585C 32.6504 0.99585 33 1.34168 33 1.76819ZM 40.1719 0.99585L 36.834 0.99585C 36.6113 0.99585 36.4102 1.07593 36.2598 1.20654C 36.2188 1.24182 36.1816 1.28076 36.1504 1.32275L 36.0938 1.40906C 36.0352 1.51636 36 1.63855 36 1.76819L 36 17.2235C 36 17.65 36.373 17.9958 36.834 17.9958L 40.166 17.9958C 40.627 17.9958 41 17.65 41 17.2235L 41 1.76819C 41 1.34168 40.627 0.99585 40.1719 0.99585ZM 43.7715 0.99585L 59.2207 0.99585C 59.3535 0.99585 59.4785 1.02844 59.5879 1.08594C 59.7109 1.15112 59.8145 1.24829 59.8867 1.36633C 59.959 1.4834 60 1.62097 60 1.76819L 60 4.84546C 60 5.2721 59.6543 5.6178 59.2285 5.6178L 54.5664 5.6178C 54.1406 5.6178 53.7949 5.96362 53.7949 6.39026L 53.7949 17.2234C 53.7949 17.4678 53.6816 17.6857 53.5039 17.8271C 53.373 17.9326 53.2051 17.9957 53.0215 17.9957L 49.9297 17.9957C 49.7227 17.999 49.5234 17.9191 49.375 17.7739C 49.3105 17.7108 49.2598 17.6377 49.2207 17.5582C 49.1719 17.4547 49.1445 17.3405 49.1445 17.2234L 49.1445 6.39026C 49.1367 5.96997 48.793 5.63391 48.373 5.63403L 43.7715 5.63403C 43.3457 5.63403 43 5.28821 43 4.86169L 43 1.76819C 43 1.34168 43.3457 0.99585 43.7715 0.99585ZM 84 1.76819C 84 1.34168 84.3438 0.99585 84.7695 0.99585L 96.3809 0.99585C 98.9297 0.99585 100.998 3.06995 101 5.63001L 101 17.2235C 101 17.65 100.656 17.9958 100.23 17.9958L 97.1504 17.9958C 97.0039 17.9958 96.8691 17.9552 96.752 17.8846C 96.7148 17.8619 96.6797 17.8362 96.6465 17.8076C 96.584 17.7534 96.5312 17.6895 96.4883 17.618C 96.4199 17.5026 96.3809 17.3677 96.3809 17.2235L 96.3809 6.39026C 96.3809 5.96521 96.0391 5.62012 95.6152 5.61792L 89.3887 5.61792C 88.9648 5.61792 88.6191 5.96362 88.6191 6.39026L 88.6191 17.2235C 88.6191 17.65 88.2754 17.9958 87.8496 17.9958L 84.7695 17.9958C 84.5996 17.9958 84.4434 17.9408 84.3164 17.8474C 84.125 17.7069 84 17.4799 84 17.2235L 84 1.76819ZM 71.5 4.99585C 69.0156 4.99585 67 7.01062 67 9.49585C 67 11.9811 69.0156 13.9959 71.5 13.9959C 73.9844 13.9959 76 11.9811 76 9.49585C 75.998 7.01148 73.9844 4.99817 71.5 4.99585ZM 102.613 1.14209L 103 1.14209L 103 1.98145L 103.314 1.98145L 103.314 1.40503L 103.314 1.22925L 103.865 1.99585L 104.119 1.98145L 104.67 1.21777L 104.67 1.40503L 104.67 1.98145L 105 1.98145L 105 0.99585L 104.555 0.99585L 104.002 1.76245L 103.49 0.99585L 103 0.99585L 102 0.99585L 102 1.14209L 102.387 1.14209L 102.387 1.99585L 102.617 1.99585L 102.613 1.14209Z"
+            fillRule="evenodd"
+            id="V"
+        />
+    </defs>
+</svg>,
+  <svg
+    height="30"
+    style={
+        Object {
+            "transform": "rotate(0deg)",
+          }
+    }
+    version="1.1"
+    viewBox="0 0 105 30"
+    width="105"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+>
+    <g
+        transform="translate(26223 1404)"
+    >
+        <g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(-26177 -1383)"
+                    xlinkHref="#U"
+                />
+            </g>
+            <g>
+                <use
+                    fill="#464646"
+                    transform="translate(-26223 -1404)"
+                    xlinkHref="#V"
+                />
+            </g>
+        </g>
+    </g>
+    <defs>
+        <path
+            d="M 33.7583 0.147461L 35.9766 0.147461C 37.0186 0.147461 37.7723 0.303223 38.2378 0.614746C 38.7033 0.92627 38.936 1.41862 38.936 2.0918C 38.936 2.55729 38.8053 2.94222 38.5439 3.24658C 38.2861 3.54736 37.9084 3.74251 37.4106 3.83203L 37.4106 3.88574C 38.603 4.08984 39.1992 4.71647 39.1992 5.76562C 39.1992 6.46745 38.9611 7.0153 38.4849 7.40918C 38.0122 7.80306 37.3498 8 36.4976 8L 33.7583 8L 33.7583 0.147461ZM 34.6714 3.50977L 36.1753 3.50977C 36.8198 3.50977 37.2835 3.40951 37.5664 3.20898C 37.8493 3.00488 37.9907 2.66292 37.9907 2.18311C 37.9907 1.74268 37.8332 1.42578 37.5181 1.23242C 37.203 1.03548 36.7017 0.937012 36.0142 0.937012L 34.6714 0.937012L 34.6714 3.50977ZM 34.6714 4.2832L 34.6714 7.22119L 36.3096 7.22119C 36.9434 7.22119 37.4196 7.09945 37.7383 6.85596C 38.0605 6.60889 38.2217 6.22396 38.2217 5.70117C 38.2217 5.21419 38.057 4.85612 37.7275 4.62695C 37.4017 4.39779 36.904 4.2832 36.2344 4.2832L 34.6714 4.2832ZM 43.2437 8.10742C 42.3735 8.10742 41.686 7.84245 41.1812 7.3125C 40.6799 6.78255 40.4292 6.04671 40.4292 5.10498C 40.4292 4.15609 40.6619 3.40234 41.1274 2.84375C 41.5965 2.28516 42.2249 2.00586 43.0127 2.00586C 43.7503 2.00586 44.334 2.24935 44.7637 2.73633C 45.1934 3.21973 45.4082 3.85889 45.4082 4.65381L 45.4082 5.21777L 41.353 5.21777C 41.3709 5.90885 41.5446 6.43343 41.874 6.7915C 42.207 7.14958 42.6743 7.32861 43.2759 7.32861C 43.9097 7.32861 44.5363 7.19613 45.1558 6.93115L 45.1558 7.72607C 44.8407 7.86214 44.5417 7.95882 44.2588 8.01611C 43.9795 8.07699 43.6411 8.10742 43.2437 8.10742ZM 43.002 2.75244C 42.5293 2.75244 42.1515 2.90641 41.8687 3.21436C 41.5894 3.5223 41.4246 3.94841 41.3745 4.49268L 44.4521 4.49268C 44.4521 3.9305 44.3268 3.50081 44.0762 3.20361C 43.8255 2.90283 43.4674 2.75244 43.002 2.75244ZM 48.835 7.37158C 48.9925 7.37158 49.1447 7.36084 49.2915 7.33936C 49.4383 7.31429 49.5547 7.28923 49.6406 7.26416L 49.6406 7.94629C 49.5439 7.99284 49.4007 8.03044 49.2109 8.05908C 49.0247 8.09131 48.8564 8.10742 48.7061 8.10742C 47.5674 8.10742 46.998 7.50765 46.998 6.30811L 46.998 2.80615L 46.1548 2.80615L 46.1548 2.37646L 46.998 2.00586L 47.374 0.749023L 47.8896 0.749023L 47.8896 2.11328L 49.5977 2.11328L 49.5977 2.80615L 47.8896 2.80615L 47.8896 6.27051C 47.8896 6.625 47.9738 6.89714 48.1421 7.08691C 48.3104 7.27669 48.5413 7.37158 48.835 7.37158ZM 54.4424 8L 54.2651 7.16211L 54.2222 7.16211C 53.9285 7.53092 53.6349 7.78158 53.3413 7.91406C 53.0513 8.04297 52.6878 8.10742 52.251 8.10742C 51.6673 8.10742 51.209 7.95703 50.876 7.65625C 50.5465 7.35547 50.3818 6.92757 50.3818 6.37256C 50.3818 5.18376 51.3325 4.56071 53.2339 4.50342L 54.2329 4.47119L 54.2329 4.10596C 54.2329 3.64404 54.1326 3.30387 53.9321 3.08545C 53.7352 2.86344 53.4183 2.75244 52.9814 2.75244C 52.4909 2.75244 51.9359 2.90283 51.3164 3.20361L 51.0425 2.52148C 51.3325 2.36393 51.6494 2.2404 51.9932 2.15088C 52.3405 2.06136 52.6878 2.0166 53.0352 2.0166C 53.737 2.0166 54.2562 2.17236 54.5928 2.48389C 54.9329 2.79541 55.103 3.29492 55.103 3.98242L 55.103 8L 54.4424 8ZM 52.4282 7.37158C 52.9832 7.37158 53.4183 7.2194 53.7334 6.91504C 54.0521 6.61068 54.2114 6.18457 54.2114 5.63672L 54.2114 5.10498L 53.3198 5.14258C 52.6108 5.16764 52.0988 5.27865 51.7837 5.47559C 51.4722 5.66895 51.3164 5.97152 51.3164 6.3833C 51.3164 6.70557 51.4131 6.95085 51.6064 7.11914C 51.8034 7.28743 52.0773 7.37158 52.4282 7.37158Z"
+            id="U"
+        />
+        <path
+            d="M 81 9.49793C 81 4.25232 76.7461 5.90949e-07 71.5 5.90949e-07C 66.252 -0.00183046 62 4.25171 62 9.49793C 62 14.7435 66.2539 18.9958 71.5 18.9958C 76.7461 18.9958 81 14.7435 81 9.49793ZM 16.2266 0.99585L 0.773438 0.99585C 0.345703 0.99585 0 1.34168 0 1.76819L 0 4.86169C 0 5.09143 0.0996094 5.29773 0.259766 5.43921C 0.308594 5.48181 0.361328 5.51856 0.417969 5.54822C 0.523438 5.60303 0.644531 5.63403 0.773438 5.63403L 5.38281 5.63403C 5.80469 5.63391 6.14844 5.96997 6.15625 6.39026L 6.15625 17.2235C 6.15625 17.4979 6.29883 17.739 6.51562 17.876C 6.56445 17.9071 6.61719 17.9327 6.67383 17.9523L 6.78906 17.983C 6.83398 17.9915 6.88086 17.9958 6.92969 17.9958L 10.0215 17.9958C 10.4492 17.9958 10.7949 17.65 10.7949 17.2235L 10.7949 6.39026C 10.7949 5.96362 11.1406 5.61792 11.5684 5.61792L 16.248 5.61792C 16.4941 5.61145 16.7109 5.48962 16.8477 5.30469C 16.9414 5.17932 16.998 5.0249 17 4.85767L 17 1.76819C 17 1.34168 16.6543 0.99585 16.2266 0.99585ZM 33 1.76819L 33 4.86169C 33 5.28821 32.6504 5.63403 32.2168 5.63403L 25.4941 5.63403C 25.0605 5.63403 24.7109 5.97986 24.7109 6.40637L 24.7109 17.2235C 24.7109 17.65 24.3594 17.9958 23.9277 17.9958L 20.7871 17.9958C 20.5781 17.9969 20.3789 17.916 20.2305 17.771C 20.084 17.6261 20 17.4291 20 17.2235L 20 5.63001C 20.002 3.06995 22.1074 0.99585 24.7031 0.99585L 32.2168 0.99585C 32.6504 0.99585 33 1.34168 33 1.76819ZM 40.1719 0.99585L 36.834 0.99585C 36.6113 0.99585 36.4102 1.07593 36.2598 1.20654C 36.2188 1.24182 36.1816 1.28076 36.1504 1.32275L 36.0938 1.40906C 36.0352 1.51636 36 1.63855 36 1.76819L 36 17.2235C 36 17.65 36.373 17.9958 36.834 17.9958L 40.166 17.9958C 40.627 17.9958 41 17.65 41 17.2235L 41 1.76819C 41 1.34168 40.627 0.99585 40.1719 0.99585ZM 43.7715 0.99585L 59.2207 0.99585C 59.3535 0.99585 59.4785 1.02844 59.5879 1.08594C 59.7109 1.15112 59.8145 1.24829 59.8867 1.36633C 59.959 1.4834 60 1.62097 60 1.76819L 60 4.84546C 60 5.2721 59.6543 5.6178 59.2285 5.6178L 54.5664 5.6178C 54.1406 5.6178 53.7949 5.96362 53.7949 6.39026L 53.7949 17.2234C 53.7949 17.4678 53.6816 17.6857 53.5039 17.8271C 53.373 17.9326 53.2051 17.9957 53.0215 17.9957L 49.9297 17.9957C 49.7227 17.999 49.5234 17.9191 49.375 17.7739C 49.3105 17.7108 49.2598 17.6377 49.2207 17.5582C 49.1719 17.4547 49.1445 17.3405 49.1445 17.2234L 49.1445 6.39026C 49.1367 5.96997 48.793 5.63391 48.373 5.63403L 43.7715 5.63403C 43.3457 5.63403 43 5.28821 43 4.86169L 43 1.76819C 43 1.34168 43.3457 0.99585 43.7715 0.99585ZM 84 1.76819C 84 1.34168 84.3438 0.99585 84.7695 0.99585L 96.3809 0.99585C 98.9297 0.99585 100.998 3.06995 101 5.63001L 101 17.2235C 101 17.65 100.656 17.9958 100.23 17.9958L 97.1504 17.9958C 97.0039 17.9958 96.8691 17.9552 96.752 17.8846C 96.7148 17.8619 96.6797 17.8362 96.6465 17.8076C 96.584 17.7534 96.5312 17.6895 96.4883 17.618C 96.4199 17.5026 96.3809 17.3677 96.3809 17.2235L 96.3809 6.39026C 96.3809 5.96521 96.0391 5.62012 95.6152 5.61792L 89.3887 5.61792C 88.9648 5.61792 88.6191 5.96362 88.6191 6.39026L 88.6191 17.2235C 88.6191 17.65 88.2754 17.9958 87.8496 17.9958L 84.7695 17.9958C 84.5996 17.9958 84.4434 17.9408 84.3164 17.8474C 84.125 17.7069 84 17.4799 84 17.2235L 84 1.76819ZM 71.5 4.99585C 69.0156 4.99585 67 7.01062 67 9.49585C 67 11.9811 69.0156 13.9959 71.5 13.9959C 73.9844 13.9959 76 11.9811 76 9.49585C 75.998 7.01148 73.9844 4.99817 71.5 4.99585ZM 102.613 1.14209L 103 1.14209L 103 1.98145L 103.314 1.98145L 103.314 1.40503L 103.314 1.22925L 103.865 1.99585L 104.119 1.98145L 104.67 1.21777L 104.67 1.40503L 104.67 1.98145L 105 1.98145L 105 0.99585L 104.555 0.99585L 104.002 1.76245L 103.49 0.99585L 103 0.99585L 102 0.99585L 102 1.14209L 102.387 1.14209L 102.387 1.99585L 102.617 1.99585L 102.613 1.14209Z"
+            fillRule="evenodd"
+            id="V"
+        />
+    </defs>
+</svg>,
+]
 `;
 
 exports[`renders <User /> without throwing 1`] = `
-<div>
+Array [
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4A3.204 3.204 0 0 0 5.62 0z"
-      fill="#464646"
+        d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4A3.204 3.204 0 0 0 5.62 0z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4A3.204 3.204 0 0 0 5.62 0z"
-      fill="#FFF"
+        d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4A3.204 3.204 0 0 0 5.62 0z"
+        fill="#FFF"
     />
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4A3.204 3.204 0 0 0 5.62 0z"
-      fill={true}
+        d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4A3.204 3.204 0 0 0 5.62 0z"
+        fill={undefined}
     />
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(90deg)",
-      }
+        Object {
+            "transform": "rotate(90deg)",
+          }
     }
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4A3.204 3.204 0 0 0 5.62 0z"
-      fill="#464646"
+        d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4A3.204 3.204 0 0 0 5.62 0z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(180deg)",
-      }
+        Object {
+            "transform": "rotate(180deg)",
+          }
     }
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4A3.204 3.204 0 0 0 5.62 0z"
-      fill="#464646"
+        d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4A3.204 3.204 0 0 0 5.62 0z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(-90deg)",
-      }
+        Object {
+            "transform": "rotate(-90deg)",
+          }
     }
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4A3.204 3.204 0 0 0 5.62 0z"
-      fill="#464646"
+        d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4A3.204 3.204 0 0 0 5.62 0z"
+        fill="#464646"
     />
-  </svg>
+</svg>,
   <svg
     height="12"
     style={
-      Object {
-        "transform": "rotate(0deg)",
-      }
+        Object {
+            "transform": "rotate(0deg)",
+          }
     }
     viewBox="0 0 12 12"
     width="12"
     xmlns="http://www.w3.org/2000/svg"
-  >
+>
     <path
-      d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4A3.204 3.204 0 0 0 5.62 0z"
-      fill="#464646"
+        d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4A3.204 3.204 0 0 0 5.62 0z"
+        fill="#464646"
     />
-  </svg>
-</div>
+</svg>,
+]
 `;
diff --git a/packages/icons/src/__tests__/icons.spec.js b/packages/icons/src/__tests__/icons.spec.js
index 7ca8bdf0..228150d2 100644
--- a/packages/icons/src/__tests__/icons.spec.js
+++ b/packages/icons/src/__tests__/icons.spec.js
@@ -1,8 +1,7 @@
-import React from 'react';
+import React, { Fragment } from 'react';
 import { ThemeProvider } from 'styled-components';
 import renderer from 'react-test-renderer';
 import 'jest-styled-components';
-import { colors } from '../colors';
 
 import {
   Actions,
@@ -51,21 +50,28 @@ import {
   User
 } from '..';
 
+const colors = {
+  white: '#FFF',
+  text: '#464646',
+  greenDark: '#008138',
+  green: '#009858',
+  orange: '#e38200',
+  primary: '#3b46cc'
+};
+
 it('renders <Actions /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Actions />
-            <Actions light />
-            <Actions disabled />
-            <Actions direction="right" />
-            <Actions direction="up" />
-            <Actions direction="left" />
-            <Actions direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Actions colors={colors} />
+          <Actions colors={colors} light />
+          <Actions colors={colors} disabled />
+          <Actions colors={colors} direction="right" />
+          <Actions colors={colors} direction="up" />
+          <Actions colors={colors} direction="left" />
+          <Actions colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -75,17 +81,15 @@ it('renders <Affinity /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Affinity />
-            <Affinity light />
-            <Affinity disabled />
-            <Affinity direction="right" />
-            <Affinity direction="up" />
-            <Affinity direction="left" />
-            <Affinity direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Affinity colors={colors} />
+          <Affinity colors={colors} light />
+          <Affinity colors={colors} disabled />
+          <Affinity colors={colors} direction="right" />
+          <Affinity colors={colors} direction="up" />
+          <Affinity colors={colors} direction="left" />
+          <Affinity colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -95,17 +99,15 @@ it('renders <Arrow /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Arrow />
-            <Arrow light />
-            <Arrow disabled />
-            <Arrow direction="right" />
-            <Arrow direction="up" />
-            <Arrow direction="left" />
-            <Arrow direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Arrow colors={colors} />
+          <Arrow colors={colors} light />
+          <Arrow colors={colors} disabled />
+          <Arrow colors={colors} direction="right" />
+          <Arrow colors={colors} direction="up" />
+          <Arrow colors={colors} direction="left" />
+          <Arrow colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -115,17 +117,15 @@ it('renders <Bin /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Bin />
-            <Bin light />
-            <Bin disabled />
-            <Bin direction="right" />
-            <Bin direction="up" />
-            <Bin direction="left" />
-            <Bin direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Bin colors={colors} />
+          <Bin colors={colors} light />
+          <Bin colors={colors} disabled />
+          <Bin colors={colors} direction="right" />
+          <Bin colors={colors} direction="up" />
+          <Bin colors={colors} direction="left" />
+          <Bin colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -135,17 +135,15 @@ it('renders <Checkcircle /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Checkcircle />
-            <Checkcircle light />
-            <Checkcircle disabled />
-            <Checkcircle direction="right" />
-            <Checkcircle direction="up" />
-            <Checkcircle direction="left" />
-            <Checkcircle direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Checkcircle colors={colors} />
+          <Checkcircle colors={colors} light />
+          <Checkcircle colors={colors} disabled />
+          <Checkcircle colors={colors} direction="right" />
+          <Checkcircle colors={colors} direction="up" />
+          <Checkcircle colors={colors} direction="left" />
+          <Checkcircle colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -155,17 +153,15 @@ it('renders <Clipboard /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Clipboard />
-            <Clipboard light />
-            <Clipboard disabled />
-            <Clipboard direction="right" />
-            <Clipboard direction="up" />
-            <Clipboard direction="left" />
-            <Clipboard direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Clipboard colors={colors} />
+          <Clipboard colors={colors} light />
+          <Clipboard colors={colors} disabled />
+          <Clipboard colors={colors} direction="right" />
+          <Clipboard colors={colors} direction="up" />
+          <Clipboard colors={colors} direction="left" />
+          <Clipboard colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -175,17 +171,15 @@ it('renders <Close /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Close />
-            <Close light />
-            <Close disabled />
-            <Close direction="right" />
-            <Close direction="up" />
-            <Close direction="left" />
-            <Close direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Close colors={colors} />
+          <Close colors={colors} light />
+          <Close colors={colors} disabled />
+          <Close colors={colors} direction="right" />
+          <Close colors={colors} direction="up" />
+          <Close colors={colors} direction="left" />
+          <Close colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -195,17 +189,15 @@ it('renders <Cns /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Cns />
-            <Cns light />
-            <Cns disabled />
-            <Cns direction="right" />
-            <Cns direction="up" />
-            <Cns direction="left" />
-            <Cns direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Cns colors={colors} />
+          <Cns colors={colors} light />
+          <Cns colors={colors} disabled />
+          <Cns colors={colors} direction="right" />
+          <Cns colors={colors} direction="up" />
+          <Cns colors={colors} direction="left" />
+          <Cns colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -215,17 +207,15 @@ it('renders <Copy /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Copy />
-            <Copy light />
-            <Copy disabled />
-            <Copy direction="right" />
-            <Copy direction="up" />
-            <Copy direction="left" />
-            <Copy direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Copy colors={colors} />
+          <Copy colors={colors} light />
+          <Copy colors={colors} disabled />
+          <Copy colors={colors} direction="right" />
+          <Copy colors={colors} direction="up" />
+          <Copy colors={colors} direction="left" />
+          <Copy colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -235,17 +225,15 @@ it('renders <Cpu /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Cpu />
-            <Cpu light />
-            <Cpu disabled />
-            <Cpu direction="right" />
-            <Cpu direction="up" />
-            <Cpu direction="left" />
-            <Cpu direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Cpu colors={colors} />
+          <Cpu colors={colors} light />
+          <Cpu colors={colors} disabled />
+          <Cpu colors={colors} direction="right" />
+          <Cpu colors={colors} direction="up" />
+          <Cpu colors={colors} direction="left" />
+          <Cpu colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -255,17 +243,15 @@ it('renders <DataCenter /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <DataCenter />
-            <DataCenter light />
-            <DataCenter disabled />
-            <DataCenter direction="right" />
-            <DataCenter direction="up" />
-            <DataCenter direction="left" />
-            <DataCenter direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <DataCenter colors={colors} />
+          <DataCenter colors={colors} light />
+          <DataCenter colors={colors} disabled />
+          <DataCenter colors={colors} direction="right" />
+          <DataCenter colors={colors} direction="up" />
+          <DataCenter colors={colors} direction="left" />
+          <DataCenter colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -275,17 +261,15 @@ it('renders <Delete /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Delete />
-            <Delete light />
-            <Delete disabled />
-            <Delete direction="right" />
-            <Delete direction="up" />
-            <Delete direction="left" />
-            <Delete direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Delete colors={colors} />
+          <Delete colors={colors} light />
+          <Delete colors={colors} disabled />
+          <Delete colors={colors} direction="right" />
+          <Delete colors={colors} direction="up" />
+          <Delete colors={colors} direction="left" />
+          <Delete colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -295,17 +279,15 @@ it('renders <Dot /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Dot />
-            <Dot light />
-            <Dot disabled />
-            <Dot direction="right" />
-            <Dot direction="up" />
-            <Dot direction="left" />
-            <Dot direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Dot colors={colors} />
+          <Dot colors={colors} light />
+          <Dot colors={colors} disabled />
+          <Dot colors={colors} direction="right" />
+          <Dot colors={colors} direction="up" />
+          <Dot colors={colors} direction="left" />
+          <Dot colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -315,17 +297,15 @@ it('renders <Duplicate /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Duplicate />
-            <Duplicate light />
-            <Duplicate disabled />
-            <Duplicate direction="right" />
-            <Duplicate direction="up" />
-            <Duplicate direction="left" />
-            <Duplicate direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Duplicate colors={colors} />
+          <Duplicate colors={colors} light />
+          <Duplicate colors={colors} disabled />
+          <Duplicate colors={colors} direction="right" />
+          <Duplicate colors={colors} direction="up" />
+          <Duplicate colors={colors} direction="left" />
+          <Duplicate colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -335,17 +315,15 @@ it('renders <Edit /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Edit />
-            <Edit light />
-            <Edit disabled />
-            <Edit direction="right" />
-            <Edit direction="up" />
-            <Edit direction="left" />
-            <Edit direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Edit colors={colors} />
+          <Edit colors={colors} light />
+          <Edit colors={colors} disabled />
+          <Edit colors={colors} direction="right" />
+          <Edit colors={colors} direction="up" />
+          <Edit colors={colors} direction="left" />
+          <Edit colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -355,17 +333,15 @@ it('renders <Fabric /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Fabric />
-            <Fabric light />
-            <Fabric disabled />
-            <Fabric direction="right" />
-            <Fabric direction="up" />
-            <Fabric direction="left" />
-            <Fabric direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Fabric colors={colors} />
+          <Fabric colors={colors} light />
+          <Fabric colors={colors} disabled />
+          <Fabric colors={colors} direction="right" />
+          <Fabric colors={colors} direction="up" />
+          <Fabric colors={colors} direction="left" />
+          <Fabric colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -375,17 +351,15 @@ it('renders <Firewall /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Firewall />
-            <Firewall light />
-            <Firewall disabled />
-            <Firewall direction="right" />
-            <Firewall direction="up" />
-            <Firewall direction="left" />
-            <Firewall direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Firewall colors={colors} />
+          <Firewall colors={colors} light />
+          <Firewall colors={colors} disabled />
+          <Firewall colors={colors} direction="right" />
+          <Firewall colors={colors} direction="up" />
+          <Firewall colors={colors} direction="left" />
+          <Firewall colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -395,17 +369,15 @@ it('renders <General /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <General />
-            <General light />
-            <General disabled />
-            <General direction="right" />
-            <General direction="up" />
-            <General direction="left" />
-            <General direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <General colors={colors} />
+          <General colors={colors} light />
+          <General colors={colors} disabled />
+          <General colors={colors} direction="right" />
+          <General colors={colors} direction="up" />
+          <General colors={colors} direction="left" />
+          <General colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -415,17 +387,15 @@ it('renders <Health /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Health />
-            <Health light />
-            <Health disabled />
-            <Health direction="right" />
-            <Health direction="up" />
-            <Health direction="left" />
-            <Health direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Health colors={colors} />
+          <Health colors={colors} light />
+          <Health colors={colors} disabled />
+          <Health colors={colors} direction="right" />
+          <Health colors={colors} direction="up" />
+          <Health colors={colors} direction="left" />
+          <Health colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -435,17 +405,15 @@ it('renders <Id /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Id />
-            <Id light />
-            <Id disabled />
-            <Id direction="right" />
-            <Id direction="up" />
-            <Id direction="left" />
-            <Id direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Id colors={colors} />
+          <Id colors={colors} light />
+          <Id colors={colors} disabled />
+          <Id colors={colors} direction="right" />
+          <Id colors={colors} direction="up" />
+          <Id colors={colors} direction="left" />
+          <Id colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -455,17 +423,15 @@ it('renders <Import /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Import />
-            <Import light />
-            <Import disabled />
-            <Import direction="right" />
-            <Import direction="up" />
-            <Import direction="left" />
-            <Import direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Import colors={colors} />
+          <Import colors={colors} light />
+          <Import colors={colors} disabled />
+          <Import colors={colors} direction="right" />
+          <Import colors={colors} direction="up" />
+          <Import colors={colors} direction="left" />
+          <Import colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -475,17 +441,15 @@ it('renders <InstanceCount /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <InstanceCount />
-            <InstanceCount light />
-            <InstanceCount disabled />
-            <InstanceCount direction="right" />
-            <InstanceCount direction="up" />
-            <InstanceCount direction="left" />
-            <InstanceCount direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <InstanceCount colors={colors} />
+          <InstanceCount colors={colors} light />
+          <InstanceCount colors={colors} disabled />
+          <InstanceCount colors={colors} direction="right" />
+          <InstanceCount colors={colors} direction="up" />
+          <InstanceCount colors={colors} direction="left" />
+          <InstanceCount colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -495,17 +459,15 @@ it('renders <InstanceType /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <InstanceType />
-            <InstanceType light />
-            <InstanceType disabled />
-            <InstanceType direction="right" />
-            <InstanceType direction="up" />
-            <InstanceType direction="left" />
-            <InstanceType direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <InstanceType colors={colors} />
+          <InstanceType colors={colors} light />
+          <InstanceType colors={colors} disabled />
+          <InstanceType colors={colors} direction="right" />
+          <InstanceType colors={colors} direction="up" />
+          <InstanceType colors={colors} direction="left" />
+          <InstanceType colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -515,17 +477,15 @@ it('renders <Instances /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Instances />
-            <Instances light />
-            <Instances disabled />
-            <Instances direction="right" />
-            <Instances direction="up" />
-            <Instances direction="left" />
-            <Instances direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Instances colors={colors} />
+          <Instances colors={colors} light />
+          <Instances colors={colors} disabled />
+          <Instances colors={colors} direction="right" />
+          <Instances colors={colors} direction="up" />
+          <Instances colors={colors} direction="left" />
+          <Instances colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -535,17 +495,15 @@ it('renders <Loading /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Loading />
-            <Loading light />
-            <Loading disabled />
-            <Loading direction="right" />
-            <Loading direction="up" />
-            <Loading direction="left" />
-            <Loading direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Loading colors={colors} />
+          <Loading colors={colors} light />
+          <Loading colors={colors} disabled />
+          <Loading colors={colors} direction="right" />
+          <Loading colors={colors} direction="up" />
+          <Loading colors={colors} direction="left" />
+          <Loading colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -555,17 +513,15 @@ it('renders <Login /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Login />
-            <Login light />
-            <Login disabled />
-            <Login direction="right" />
-            <Login direction="up" />
-            <Login direction="left" />
-            <Login direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Login colors={colors} />
+          <Login colors={colors} light />
+          <Login colors={colors} disabled />
+          <Login colors={colors} direction="right" />
+          <Login colors={colors} direction="up" />
+          <Login colors={colors} direction="left" />
+          <Login colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -575,17 +531,15 @@ it('renders <Memory /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Memory />
-            <Memory light />
-            <Memory disabled />
-            <Memory direction="right" />
-            <Memory direction="up" />
-            <Memory direction="left" />
-            <Memory direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Memory colors={colors} />
+          <Memory colors={colors} light />
+          <Memory colors={colors} disabled />
+          <Memory colors={colors} direction="right" />
+          <Memory colors={colors} direction="up" />
+          <Memory colors={colors} direction="left" />
+          <Memory colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -595,17 +549,15 @@ it('renders <Metadata /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Metadata />
-            <Metadata light />
-            <Metadata disabled />
-            <Metadata direction="right" />
-            <Metadata direction="up" />
-            <Metadata direction="left" />
-            <Metadata direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Metadata colors={colors} />
+          <Metadata colors={colors} light />
+          <Metadata colors={colors} disabled />
+          <Metadata colors={colors} direction="right" />
+          <Metadata colors={colors} direction="up" />
+          <Metadata colors={colors} direction="left" />
+          <Metadata colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -615,17 +567,15 @@ it('renders <Minus /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Minus />
-            <Minus light />
-            <Minus disabled />
-            <Minus direction="right" />
-            <Minus direction="up" />
-            <Minus direction="left" />
-            <Minus direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Minus colors={colors} />
+          <Minus colors={colors} light />
+          <Minus colors={colors} disabled />
+          <Minus colors={colors} direction="right" />
+          <Minus colors={colors} direction="up" />
+          <Minus colors={colors} direction="left" />
+          <Minus colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -635,17 +585,15 @@ it('renders <Name /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <name />
-            <name light />
-            <name disabled />
-            <name direction="right" />
-            <name direction="up" />
-            <name direction="left" />
-            <name direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Name colors={colors} />
+          <Name colors={colors} light />
+          <Name colors={colors} disabled />
+          <Name colors={colors} direction="right" />
+          <Name colors={colors} direction="up" />
+          <Name colors={colors} direction="left" />
+          <Name colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -655,17 +603,15 @@ it('renders <Network /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Network />
-            <Network light />
-            <Network disabled />
-            <Network direction="right" />
-            <Network direction="up" />
-            <Network direction="left" />
-            <Network direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Network colors={colors} />
+          <Network colors={colors} light />
+          <Network colors={colors} disabled />
+          <Network colors={colors} direction="right" />
+          <Network colors={colors} direction="up" />
+          <Network colors={colors} direction="left" />
+          <Network colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -675,17 +621,15 @@ it('renders <Package /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Package />
-            <Package light />
-            <Package disabled />
-            <Package direction="right" />
-            <Package direction="up" />
-            <Package direction="left" />
-            <Package direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Package colors={colors} />
+          <Package colors={colors} light />
+          <Package colors={colors} disabled />
+          <Package colors={colors} direction="right" />
+          <Package colors={colors} direction="up" />
+          <Package colors={colors} direction="left" />
+          <Package colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -695,17 +639,15 @@ it('renders <Plus /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Plus />
-            <Plus light />
-            <Plus disabled />
-            <Plus direction="right" />
-            <Plus direction="up" />
-            <Plus direction="left" />
-            <Plus direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Plus colors={colors} />
+          <Plus colors={colors} light />
+          <Plus colors={colors} disabled />
+          <Plus colors={colors} direction="right" />
+          <Plus colors={colors} direction="up" />
+          <Plus colors={colors} direction="left" />
+          <Plus colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -715,17 +657,15 @@ it('renders <Private /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Private />
-            <Private light />
-            <Private disabled />
-            <Private direction="right" />
-            <Private direction="up" />
-            <Private direction="left" />
-            <Private direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Private colors={colors} />
+          <Private colors={colors} light />
+          <Private colors={colors} disabled />
+          <Private colors={colors} direction="right" />
+          <Private colors={colors} direction="up" />
+          <Private colors={colors} direction="left" />
+          <Private colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -735,17 +675,15 @@ it('renders <Public /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Public />
-            <Public light />
-            <Public disabled />
-            <Public direction="right" />
-            <Public direction="up" />
-            <Public direction="left" />
-            <Public direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Public colors={colors} />
+          <Public colors={colors} light />
+          <Public colors={colors} disabled />
+          <Public colors={colors} direction="right" />
+          <Public colors={colors} direction="up" />
+          <Public colors={colors} direction="left" />
+          <Public colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -755,17 +693,15 @@ it('renders <Randomize /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Randomize />
-            <Randomize light />
-            <Randomize disabled />
-            <Randomize direction="right" />
-            <Randomize direction="up" />
-            <Randomize direction="left" />
-            <Randomize direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Randomize colors={colors} />
+          <Randomize colors={colors} light />
+          <Randomize colors={colors} disabled />
+          <Randomize colors={colors} direction="right" />
+          <Randomize colors={colors} direction="up" />
+          <Randomize colors={colors} direction="left" />
+          <Randomize colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -775,17 +711,15 @@ it('renders <Reset /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Reset />
-            <Reset light />
-            <Reset disabled />
-            <Reset direction="right" />
-            <Reset direction="up" />
-            <Reset direction="left" />
-            <Reset direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Reset colors={colors} />
+          <Reset colors={colors} light />
+          <Reset colors={colors} disabled />
+          <Reset colors={colors} direction="right" />
+          <Reset colors={colors} direction="up" />
+          <Reset colors={colors} direction="left" />
+          <Reset colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -795,17 +729,15 @@ it('renders <Restart /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Restart />
-            <Restart light />
-            <Restart disabled />
-            <Restart direction="right" />
-            <Restart direction="up" />
-            <Restart direction="left" />
-            <Restart direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Restart colors={colors} />
+          <Restart colors={colors} light />
+          <Restart colors={colors} disabled />
+          <Restart colors={colors} direction="right" />
+          <Restart colors={colors} direction="up" />
+          <Restart colors={colors} direction="left" />
+          <Restart colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -815,17 +747,15 @@ it('renders <Start /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Start />
-            <Start light />
-            <Start disabled />
-            <Start direction="right" />
-            <Start direction="up" />
-            <Start direction="left" />
-            <Start direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Start colors={colors} />
+          <Start colors={colors} light />
+          <Start colors={colors} disabled />
+          <Start colors={colors} direction="right" />
+          <Start colors={colors} direction="up" />
+          <Start colors={colors} direction="left" />
+          <Start colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -835,17 +765,15 @@ it('renders <Stop /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Stop />
-            <Stop light />
-            <Stop disabled />
-            <Stop direction="right" />
-            <Stop direction="up" />
-            <Stop direction="left" />
-            <Stop direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Stop colors={colors} />
+          <Stop colors={colors} light />
+          <Stop colors={colors} disabled />
+          <Stop colors={colors} direction="right" />
+          <Stop colors={colors} direction="up" />
+          <Stop colors={colors} direction="left" />
+          <Stop colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -855,17 +783,15 @@ it('renders <Storage /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Storage />
-            <Storage light />
-            <Storage disabled />
-            <Storage direction="right" />
-            <Storage direction="up" />
-            <Storage direction="left" />
-            <Storage direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Storage colors={colors} />
+          <Storage colors={colors} light />
+          <Storage colors={colors} disabled />
+          <Storage colors={colors} direction="right" />
+          <Storage colors={colors} direction="up" />
+          <Storage colors={colors} direction="left" />
+          <Storage colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -875,17 +801,15 @@ it('renders <Tags /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <tags />
-            <tags light />
-            <tags disabled />
-            <tags direction="right" />
-            <tags direction="up" />
-            <tags direction="left" />
-            <tags direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Tags colors={colors} />
+          <Tags colors={colors} light />
+          <Tags colors={colors} disabled />
+          <Tags colors={colors} direction="right" />
+          <Tags colors={colors} direction="up" />
+          <Tags colors={colors} direction="left" />
+          <Tags colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -895,17 +819,22 @@ it('renders <Triton /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <Triton />
-            <Triton light />
-            <Triton disabled />
-            <Triton direction="right" />
-            <Triton direction="up" />
-            <Triton direction="left" />
-            <Triton direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <Triton colors={colors} />
+          <Triton colors={colors} light />
+          <Triton colors={colors} disabled />
+          <Triton colors={colors} direction="right" />
+          <Triton colors={colors} direction="up" />
+          <Triton colors={colors} direction="left" />
+          <Triton colors={colors} direction="down" />
+          <Triton colors={colors} beta />
+          <Triton colors={colors} beta light />
+          <Triton colors={colors} beta disabled />
+          <Triton colors={colors} beta direction="right" />
+          <Triton colors={colors} beta direction="up" />
+          <Triton colors={colors} beta direction="left" />
+          <Triton colors={colors} beta direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
@@ -915,17 +844,15 @@ it('renders <User /> without throwing', () => {
   expect(
     renderer
       .create(
-        <ThemeProvider theme={colors}>
-          <div>
-            <User />
-            <User light />
-            <User disabled />
-            <User direction="right" />
-            <User direction="up" />
-            <User direction="left" />
-            <User direction="down" />
-          </div>
-        </ThemeProvider>
+        <Fragment>
+          <User colors={colors} />
+          <User colors={colors} light />
+          <User colors={colors} disabled />
+          <User colors={colors} direction="right" />
+          <User colors={colors} direction="up" />
+          <User colors={colors} direction="left" />
+          <User colors={colors} direction="down" />
+        </Fragment>
       )
       .toJSON()
   ).toMatchSnapshot();
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/affinity.spec.js.snap b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/affinity.spec.js.snap
index 3516bedd..c7f8c6ae 100644
--- a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/affinity.spec.js.snap
+++ b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/affinity.spec.js.snap
@@ -75,6 +75,27 @@ exports[`renders <Rule/> without throwing 1`] = `
   align-items: center;
 }
 
+.c5 {
+  position: relative;
+  padding: 0.75rem;
+  padding-right: 1.5625rem;
+  width: auto;
+  border: none;
+  border-bottom: 0.0625rem solid rgba(73,73,73,1);
+  border-radius: 0;
+  background: transparent;
+  padding: 0;
+  padding-right: 0.75rem;
+  display: inline;
+  height: 1.5rem;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  min-height: 0;
+  color: rgb(216,216,216);
+  margin: 0 0.375rem;
+}
+
 .c2 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -314,27 +335,6 @@ exports[`renders <Rule/> without throwing 1`] = `
   outline: 0;
 }
 
-.c5 {
-  position: relative;
-  padding: 0.75rem;
-  padding-right: 1.5625rem;
-  width: auto;
-  border: none;
-  border-bottom: 0.0625rem solid rgba(73,73,73,1);
-  border-radius: 0;
-  background: transparent;
-  padding: 0;
-  padding-right: 0.75rem;
-  display: inline;
-  height: 1.5rem;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-  min-height: 0;
-  color: rgb(216,216,216);
-  margin: 0 0.375rem;
-}
-
 <div
   className="c0"
 >
@@ -348,7 +348,7 @@ exports[`renders <Rule/> without throwing 1`] = `
       The instance
     </h4>
     <div
-      className="c3"
+      className="baseline-jVaZNU kXgQxt c3"
       name="rule-instance-conditional"
       role="group"
       style={undefined}
@@ -381,7 +381,7 @@ exports[`renders <Rule/> without throwing 1`] = `
       be on
     </h4>
     <div
-      className="c3"
+      className="baseline-jVaZNU kXgQxt c3"
       name="rule-instance-placement"
       role="group"
       style={undefined}
@@ -414,7 +414,7 @@ exports[`renders <Rule/> without throwing 1`] = `
       node as the instance(s) identified by the
     </h4>
     <div
-      className="c3"
+      className="baseline-jVaZNU kXgQxt c3"
       name="rule-type"
       role="group"
       style={undefined}
@@ -442,7 +442,7 @@ exports[`renders <Rule/> without throwing 1`] = `
       </div>
     </div>
     <div
-      className="c3"
+      className="baseline-jVaZNU kXgQxt c3"
       name="rule-instance-name-pattern"
       role="group"
       style={undefined}
@@ -489,7 +489,7 @@ exports[`renders <Rule/> without throwing 1`] = `
       </div>
     </div>
     <div
-      className="c3"
+      className="baseline-jVaZNU kXgQxt c3"
       name="rule-instance-name"
       role="group"
       style={undefined}
@@ -543,6 +543,27 @@ exports[`renders <Rule/> without throwing 2`] = `
   align-items: center;
 }
 
+.c5 {
+  position: relative;
+  padding: 0.75rem;
+  padding-right: 1.5625rem;
+  width: auto;
+  border: none;
+  border-bottom: 0.0625rem solid rgba(73,73,73,1);
+  border-radius: 0;
+  background: transparent;
+  padding: 0;
+  padding-right: 0.75rem;
+  display: inline;
+  height: 1.5rem;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  min-height: 0;
+  color: rgb(216,216,216);
+  margin: 0 0.375rem;
+}
+
 .c2 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -782,27 +803,6 @@ exports[`renders <Rule/> without throwing 2`] = `
   outline: 0;
 }
 
-.c5 {
-  position: relative;
-  padding: 0.75rem;
-  padding-right: 1.5625rem;
-  width: auto;
-  border: none;
-  border-bottom: 0.0625rem solid rgba(73,73,73,1);
-  border-radius: 0;
-  background: transparent;
-  padding: 0;
-  padding-right: 0.75rem;
-  display: inline;
-  height: 1.5rem;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-  min-height: 0;
-  color: rgb(216,216,216);
-  margin: 0 0.375rem;
-}
-
 <div
   className="c0"
 >
@@ -816,7 +816,7 @@ exports[`renders <Rule/> without throwing 2`] = `
       The instance
     </h4>
     <div
-      className="c3"
+      className="baseline-jVaZNU kXgQxt c3"
       name="rule-instance-conditional"
       role="group"
       style={undefined}
@@ -849,7 +849,7 @@ exports[`renders <Rule/> without throwing 2`] = `
       be on
     </h4>
     <div
-      className="c3"
+      className="baseline-jVaZNU kXgQxt c3"
       name="rule-instance-placement"
       role="group"
       style={undefined}
@@ -882,7 +882,7 @@ exports[`renders <Rule/> without throwing 2`] = `
       node as the instance(s) identified by the
     </h4>
     <div
-      className="c3"
+      className="baseline-jVaZNU kXgQxt c3"
       name="rule-type"
       role="group"
       style={undefined}
@@ -910,7 +910,7 @@ exports[`renders <Rule/> without throwing 2`] = `
       </div>
     </div>
     <div
-      className="c3"
+      className="baseline-jVaZNU kXgQxt c3"
       name="rule-instance-name-pattern"
       role="group"
       style={undefined}
@@ -957,7 +957,7 @@ exports[`renders <Rule/> without throwing 2`] = `
       </div>
     </div>
     <div
-      className="c3"
+      className="baseline-jVaZNU kXgQxt c3"
       name="rule-instance-name"
       role="group"
       style={undefined}
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/cns.spec.js.snap b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/cns.spec.js.snap
index 28ec6ee4..9bea5909 100644
--- a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/cns.spec.js.snap
+++ b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/cns.spec.js.snap
@@ -131,6 +131,19 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
   pointer-events: none;
 }
 
+.c2 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
 .c1 {
   display: inline-block;
   margin: 0;
@@ -209,19 +222,6 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
   outline: 0;
 }
 
-.c2 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 <form
   onSubmit={undefined}
 >
@@ -229,7 +229,7 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
     className="c0"
   >
     <div
-      className="c1"
+      className="baseline-jVaZNU kXgQxt c1"
       name="name"
       role="group"
       style={undefined}
@@ -416,6 +416,19 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
   border-color: rgb(250,250,250);
 }
 
+.c2 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
 .c1 {
   display: inline-block;
   margin: 0;
@@ -494,19 +507,6 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
   outline: 0;
 }
 
-.c2 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 <form
   onSubmit={undefined}
 >
@@ -514,7 +514,7 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
     className="c0"
   >
     <div
-      className="c1"
+      className="baseline-jVaZNU kXgQxt c1"
       name="name"
       role="group"
       style={undefined}
@@ -797,6 +797,7 @@ exports[`renders <Hostname values /> without throwing 1`] = `
         <svg
           className=""
           height="16"
+          innerRef={undefined}
           style={
             Object {
               "transform": "rotate(0deg)",
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/images.spec.js.snap b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/images.spec.js.snap
index 9faced99..0ab4e13d 100644
--- a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/images.spec.js.snap
+++ b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/images.spec.js.snap
@@ -77,26 +77,6 @@ exports[`renders <Images expanded /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c3 {
-  color: rgba(73,73,73,1);
-  line-height: 1.5rem;
-  font-size: 0.9375rem;
-  margin: 0;
-}
-
-.c3 + p,
-.c3 + small,
-.c3 + h1,
-.c3 + h2,
-.c3 + label,
-.c3 + h3,
-.c3 + h4,
-.c3 + h5,
-.c3 + div,
-.c3 + span {
-  padding-bottom: 2.25rem;
-}
-
 .c14 {
   font-family: sans-serif;
   font-size: 100%;
@@ -129,6 +109,26 @@ exports[`renders <Images expanded /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c3 {
+  color: rgba(73,73,73,1);
+  line-height: 1.5rem;
+  font-size: 0.9375rem;
+  margin: 0;
+}
+
+.c3 + p,
+.c3 + small,
+.c3 + h1,
+.c3 + h2,
+.c3 + label,
+.c3 + h3,
+.c3 + h4,
+.c3 + h5,
+.c3 + div,
+.c3 + span {
+  padding-bottom: 2.25rem;
+}
+
 .c13 {
   display: inline-block;
 }
@@ -221,6 +221,19 @@ exports[`renders <Images expanded /> without throwing 1`] = `
   border-color: rgb(250,250,250);
 }
 
+.c7 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
 .c5 {
   display: inline-block;
   margin: 0;
@@ -236,19 +249,6 @@ exports[`renders <Images expanded /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c7 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 .c8 {
   position: relative;
   vertical-align: text-bottom;
@@ -406,7 +406,7 @@ exports[`renders <Images expanded /> without throwing 1`] = `
     className="c4"
   >
     <div
-      className="c5"
+      className="baseline-jVaZNU kXgQxt c5"
       name="vms"
       role="group"
       style={undefined}
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/name.spec.js.snap b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/name.spec.js.snap
index d9143fd5..a03492c0 100644
--- a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/name.spec.js.snap
+++ b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/name.spec.js.snap
@@ -44,26 +44,6 @@ exports[`renders <Name expanded /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c3 {
-  color: rgba(73,73,73,1);
-  line-height: 1.5rem;
-  font-size: 0.9375rem;
-  margin: 0;
-}
-
-.c3 + p,
-.c3 + small,
-.c3 + h1,
-.c3 + h2,
-.c3 + label,
-.c3 + h3,
-.c3 + h4,
-.c3 + h5,
-.c3 + div,
-.c3 + span {
-  padding-bottom: 2.25rem;
-}
-
 .c11 {
   font-family: sans-serif;
   font-size: 100%;
@@ -96,6 +76,26 @@ exports[`renders <Name expanded /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c3 {
+  color: rgba(73,73,73,1);
+  line-height: 1.5rem;
+  font-size: 0.9375rem;
+  margin: 0;
+}
+
+.c3 + p,
+.c3 + small,
+.c3 + h1,
+.c3 + h2,
+.c3 + label,
+.c3 + h3,
+.c3 + h4,
+.c3 + h5,
+.c3 + div,
+.c3 + span {
+  padding-bottom: 2.25rem;
+}
+
 .c10 {
   display: inline-block;
 }
@@ -166,6 +166,32 @@ exports[`renders <Name expanded /> without throwing 1`] = `
   pointer-events: none;
 }
 
+.c5 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c7 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c4 {
   display: inline-block;
   margin: 0;
@@ -245,32 +271,6 @@ exports[`renders <Name expanded /> without throwing 1`] = `
   outline: 0;
 }
 
-.c5 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c7 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 @media only screen and (min-width:0em) {
   .c1 {
     -webkit-flex-basis: 100%;
@@ -312,7 +312,7 @@ exports[`renders <Name expanded /> without throwing 1`] = `
     </div>
   </div>
   <div
-    className="c4"
+    className="baseline-jVaZNU kXgQxt c4"
     name="name"
     role="group"
     style={undefined}
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/network.spec.js.snap b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/network.spec.js.snap
index 0e8f8e9f..e1d4de9f 100644
--- a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/network.spec.js.snap
+++ b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/network.spec.js.snap
@@ -105,6 +105,68 @@ exports[`renders <Network /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
+.c9 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c9[type='checkbox'],
+.c9[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c9[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c9::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c9:checked + label::after {
+  opacity: 1;
+}
+
+.c9:selected + label::after {
+  opacity: 1;
+}
+
+.c9:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
 .c20 {
   color: rgba(73,73,73,1);
   line-height: 1.5rem;
@@ -169,50 +231,6 @@ exports[`renders <Network /> without throwing 1`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c13 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c13 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c13 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c4 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -364,66 +382,48 @@ exports[`renders <Network /> without throwing 1`] = `
   color: inherit;
 }
 
-.c9 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c9[type='checkbox'],
-.c9[type='radio'] {
+.c13 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
   box-sizing: border-box;
-  padding: 0;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
 }
 
-.c9[type='number']::-webkit-inner-spin-button,
-.c9[type='number']::-webkit-outer-spin-button {
-  height: auto;
+.c13 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
 }
 
-.c9[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
-}
-
-.c9[type='search']::-webkit-search-cancel-button,
-.c9[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c9::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c9:checked + label::after {
-  opacity: 1;
-}
-
-.c9:selected + label::after {
-  opacity: 1;
-}
-
-.c9:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c9:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c9:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
+.c13 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
 }
 
 .c10 {
@@ -546,7 +546,7 @@ exports[`renders <Network /> without throwing 1`] = `
             name="card-header-box"
           >
             <div
-              className="c6"
+              className="baseline-jVaZNU kXgQxt c6"
               name={undefined}
               role="group"
               style={undefined}
@@ -614,6 +614,7 @@ exports[`renders <Network /> without throwing 1`] = `
                         <svg
                           className=""
                           height="16"
+                          innerRef={undefined}
                           style={
                             Object {
                               "transform": "rotate(0deg)",
@@ -660,6 +661,7 @@ exports[`renders <Network /> without throwing 1`] = `
                         <svg
                           className=""
                           height="13"
+                          innerRef={undefined}
                           style={
                             Object {
                               "transform": "rotate(0deg)",
@@ -946,6 +948,7 @@ exports[`renders <Network /> without throwing 2`] = `
                           <svg
                             className=""
                             height="16"
+                            innerRef={undefined}
                             style={
                               Object {
                                 "transform": "rotate(0deg)",
@@ -992,6 +995,7 @@ exports[`renders <Network /> without throwing 2`] = `
                           <svg
                             className=""
                             height="13"
+                            innerRef={undefined}
                             style={
                               Object {
                                 "transform": "rotate(0deg)",
@@ -1140,6 +1144,68 @@ exports[`renders <Network {...network} /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
+.c9 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c9[type='checkbox'],
+.c9[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c9[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c9::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c9:checked + label::after {
+  opacity: 1;
+}
+
+.c9:selected + label::after {
+  opacity: 1;
+}
+
+.c9:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
 .c16 {
   color: rgba(73,73,73,1);
   line-height: 1.5rem;
@@ -1204,50 +1270,6 @@ exports[`renders <Network {...network} /> without throwing 1`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c13 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c13 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c13 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c4 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -1399,66 +1421,48 @@ exports[`renders <Network {...network} /> without throwing 1`] = `
   color: inherit;
 }
 
-.c9 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c9[type='checkbox'],
-.c9[type='radio'] {
+.c13 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
   box-sizing: border-box;
-  padding: 0;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
 }
 
-.c9[type='number']::-webkit-inner-spin-button,
-.c9[type='number']::-webkit-outer-spin-button {
-  height: auto;
+.c13 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
 }
 
-.c9[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
-}
-
-.c9[type='search']::-webkit-search-cancel-button,
-.c9[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c9::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c9:checked + label::after {
-  opacity: 1;
-}
-
-.c9:selected + label::after {
-  opacity: 1;
-}
-
-.c9:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c9:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c9:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
+.c13 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
 }
 
 .c10 {
@@ -1581,7 +1585,7 @@ exports[`renders <Network {...network} /> without throwing 1`] = `
             name="card-header-box"
           >
             <div
-              className="c6"
+              className="baseline-jVaZNU kXgQxt c6"
               name="1"
               role="group"
               style={undefined}
@@ -1660,6 +1664,7 @@ exports[`renders <Network {...network} /> without throwing 1`] = `
                         <svg
                           className=""
                           height="16"
+                          innerRef={undefined}
                           style={
                             Object {
                               "transform": "rotate(0deg)",
@@ -1706,6 +1711,7 @@ exports[`renders <Network {...network} /> without throwing 1`] = `
                         <svg
                           className=""
                           height="13"
+                          innerRef={undefined}
                           style={
                             Object {
                               "transform": "rotate(0deg)",
@@ -1994,6 +2000,7 @@ exports[`renders <Network {...network} /> without throwing 2`] = `
                           <svg
                             className=""
                             height="16"
+                            innerRef={undefined}
                             style={
                               Object {
                                 "transform": "rotate(0deg)",
@@ -2040,6 +2047,7 @@ exports[`renders <Network {...network} /> without throwing 2`] = `
                           <svg
                             className=""
                             height="13"
+                            innerRef={undefined}
                             style={
                               Object {
                                 "transform": "rotate(0deg)",
@@ -2188,6 +2196,68 @@ exports[`renders <Network {...network} /> without throwing 3`] = `
   padding-left: 0.5rem;
 }
 
+.c9 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c9[type='checkbox'],
+.c9[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c9[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c9::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c9:checked + label::after {
+  opacity: 1;
+}
+
+.c9:selected + label::after {
+  opacity: 1;
+}
+
+.c9:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
 .c16 {
   color: rgba(73,73,73,1);
   line-height: 1.5rem;
@@ -2252,50 +2322,6 @@ exports[`renders <Network {...network} /> without throwing 3`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c13 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c13 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c13 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c4 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -2447,66 +2473,48 @@ exports[`renders <Network {...network} /> without throwing 3`] = `
   color: inherit;
 }
 
-.c9 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c9[type='checkbox'],
-.c9[type='radio'] {
+.c13 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
   box-sizing: border-box;
-  padding: 0;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
 }
 
-.c9[type='number']::-webkit-inner-spin-button,
-.c9[type='number']::-webkit-outer-spin-button {
-  height: auto;
+.c13 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
 }
 
-.c9[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
-}
-
-.c9[type='search']::-webkit-search-cancel-button,
-.c9[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c9::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c9:checked + label::after {
-  opacity: 1;
-}
-
-.c9:selected + label::after {
-  opacity: 1;
-}
-
-.c9:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c9:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c9:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
+.c13 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
 }
 
 .c10 {
@@ -2629,7 +2637,7 @@ exports[`renders <Network {...network} /> without throwing 3`] = `
             name="card-header-box"
           >
             <div
-              className="c6"
+              className="baseline-jVaZNU kXgQxt c6"
               name="1"
               role="group"
               style={undefined}
@@ -2708,6 +2716,7 @@ exports[`renders <Network {...network} /> without throwing 3`] = `
                         <svg
                           className=""
                           height="16"
+                          innerRef={undefined}
                           style={
                             Object {
                               "transform": "rotate(0deg)",
@@ -2754,6 +2763,7 @@ exports[`renders <Network {...network} /> without throwing 3`] = `
                         <svg
                           className=""
                           height="13"
+                          innerRef={undefined}
                           style={
                             Object {
                               "transform": "rotate(0deg)",
@@ -3042,6 +3052,7 @@ exports[`renders <Network {...network} /> without throwing 4`] = `
                           <svg
                             className=""
                             height="16"
+                            innerRef={undefined}
                             style={
                               Object {
                                 "transform": "rotate(0deg)",
@@ -3088,6 +3099,7 @@ exports[`renders <Network {...network} /> without throwing 4`] = `
                           <svg
                             className=""
                             height="13"
+                            innerRef={undefined}
                             style={
                               Object {
                                 "transform": "rotate(0deg)",
@@ -3245,6 +3257,68 @@ exports[`renders <Network {...network} fabric /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
+.c9 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c9[type='checkbox'],
+.c9[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c9[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c9::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c9:checked + label::after {
+  opacity: 1;
+}
+
+.c9:selected + label::after {
+  opacity: 1;
+}
+
+.c9:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
 .c16 {
   color: rgba(73,73,73,1);
   line-height: 1.5rem;
@@ -3309,78 +3383,6 @@ exports[`renders <Network {...network} fabric /> without throwing 1`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c23 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  cursor: pointer;
-  min-height: auto;
-  height: 2.875rem;
-  -webkit-flex: 0 0 2.875rem;
-  -ms-flex: 0 0 2.875rem;
-  flex: 0 0 2.875rem;
-}
-
-.c13 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c13 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c13 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c4 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -3421,49 +3423,6 @@ exports[`renders <Network {...network} fabric /> without throwing 1`] = `
   margin-top: 0;
 }
 
-.c24 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  cursor: pointer;
-  min-height: auto;
-  height: 2.875rem;
-  -webkit-flex: 0 0 2.875rem;
-  -ms-flex: 0 0 2.875rem;
-  flex: 0 0 2.875rem;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  z-index: 1;
-  line-height: 1.5rem;
-  height: auto;
-  max-width: 100%;
-  margin: -0.0625rem -0.0625rem 0 -0.0625rem;
-  margin: -0.0625rem;
-  box-shadow: none;
-}
-
-.c24 button {
-  margin-bottom: 0;
-  margin-top: 0;
-}
-
 .c5 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -3575,6 +3534,121 @@ exports[`renders <Network {...network} fabric /> without throwing 1`] = `
   color: inherit;
 }
 
+.c13 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c13 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c13 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
+.c23 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: pointer;
+  min-height: auto;
+  height: 2.875rem;
+  -webkit-flex: 0 0 2.875rem;
+  -ms-flex: 0 0 2.875rem;
+  flex: 0 0 2.875rem;
+}
+
+.c24 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: pointer;
+  min-height: auto;
+  height: 2.875rem;
+  -webkit-flex: 0 0 2.875rem;
+  -ms-flex: 0 0 2.875rem;
+  flex: 0 0 2.875rem;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  z-index: 1;
+  line-height: 1.5rem;
+  height: auto;
+  max-width: 100%;
+  margin: -0.0625rem -0.0625rem 0 -0.0625rem;
+  margin: -0.0625rem;
+  box-shadow: none;
+}
+
+.c24 button {
+  margin-bottom: 0;
+  margin-top: 0;
+}
+
 .c25 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -3634,68 +3708,6 @@ exports[`renders <Network {...network} fabric /> without throwing 1`] = `
   color: inherit;
 }
 
-.c9 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c9[type='checkbox'],
-.c9[type='radio'] {
-  box-sizing: border-box;
-  padding: 0;
-}
-
-.c9[type='number']::-webkit-inner-spin-button,
-.c9[type='number']::-webkit-outer-spin-button {
-  height: auto;
-}
-
-.c9[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
-}
-
-.c9[type='search']::-webkit-search-cancel-button,
-.c9[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c9::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c9:checked + label::after {
-  opacity: 1;
-}
-
-.c9:selected + label::after {
-  opacity: 1;
-}
-
-.c9:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c9:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c9:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
-}
-
 .c10 {
   color: rgb(100,100,100);
   position: absolute;
@@ -3816,7 +3828,7 @@ exports[`renders <Network {...network} fabric /> without throwing 1`] = `
             name="card-header-box"
           >
             <div
-              className="c6"
+              className="baseline-jVaZNU kXgQxt c6"
               name="1"
               role="group"
               style={undefined}
@@ -3895,6 +3907,7 @@ exports[`renders <Network {...network} fabric /> without throwing 1`] = `
                         <svg
                           className=""
                           height="16"
+                          innerRef={undefined}
                           style={
                             Object {
                               "transform": "rotate(0deg)",
@@ -3941,6 +3954,7 @@ exports[`renders <Network {...network} fabric /> without throwing 1`] = `
                         <svg
                           className=""
                           height="17"
+                          innerRef={undefined}
                           style={
                             Object {
                               "transform": "rotate(0deg)",
@@ -4009,6 +4023,7 @@ exports[`renders <Network {...network} fabric /> without throwing 1`] = `
                     <svg
                       className=""
                       height="6"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -4286,6 +4301,7 @@ exports[`renders <Network {...network} fabric /> without throwing 2`] = `
                           <svg
                             className=""
                             height="16"
+                            innerRef={undefined}
                             style={
                               Object {
                                 "transform": "rotate(0deg)",
@@ -4332,6 +4348,7 @@ exports[`renders <Network {...network} fabric /> without throwing 2`] = `
                           <svg
                             className=""
                             height="17"
+                            innerRef={undefined}
                             style={
                               Object {
                                 "transform": "rotate(0deg)",
@@ -4517,6 +4534,68 @@ exports[`renders <Network {...network} infoExpanded /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
+.c9 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c9[type='checkbox'],
+.c9[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c9[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c9::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c9:checked + label::after {
+  opacity: 1;
+}
+
+.c9:selected + label::after {
+  opacity: 1;
+}
+
+.c9:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
 .c16 {
   color: rgba(73,73,73,1);
   line-height: 1.5rem;
@@ -4537,6 +4616,19 @@ exports[`renders <Network {...network} infoExpanded /> without throwing 1`] = `
   padding-bottom: 2.25rem;
 }
 
+.c27 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
 .c12 {
   color: rgba(73,73,73,1);
   font-weight: 600;
@@ -4581,72 +4673,6 @@ exports[`renders <Network {...network} infoExpanded /> without throwing 1`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c23 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c13 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c13 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c13 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c4 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -4798,66 +4824,70 @@ exports[`renders <Network {...network} infoExpanded /> without throwing 1`] = `
   color: inherit;
 }
 
-.c9 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c9[type='checkbox'],
-.c9[type='radio'] {
+.c13 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
   box-sizing: border-box;
-  padding: 0;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
 }
 
-.c9[type='number']::-webkit-inner-spin-button,
-.c9[type='number']::-webkit-outer-spin-button {
-  height: auto;
+.c13 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
 }
 
-.c9[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
+.c13 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
 }
 
-.c9[type='search']::-webkit-search-cancel-button,
-.c9[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c9::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c9:checked + label::after {
-  opacity: 1;
-}
-
-.c9:selected + label::after {
-  opacity: 1;
-}
-
-.c9:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c9:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c9:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
+.c23 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
 }
 
 .c10 {
@@ -5015,19 +5045,6 @@ exports[`renders <Network {...network} infoExpanded /> without throwing 1`] = `
   outline: 0;
 }
 
-.c27 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 @media only screen and (min-width:0em) {
   .c1 {
     -webkit-flex-basis: 100%;
@@ -5073,7 +5090,7 @@ exports[`renders <Network {...network} infoExpanded /> without throwing 1`] = `
             name="card-header-box"
           >
             <div
-              className="c6"
+              className="baseline-jVaZNU kXgQxt c6"
               name="1"
               role="group"
               style={undefined}
@@ -5152,6 +5169,7 @@ exports[`renders <Network {...network} infoExpanded /> without throwing 1`] = `
                         <svg
                           className=""
                           height="16"
+                          innerRef={undefined}
                           style={
                             Object {
                               "transform": "rotate(0deg)",
@@ -5198,6 +5216,7 @@ exports[`renders <Network {...network} infoExpanded /> without throwing 1`] = `
                         <svg
                           className=""
                           height="17"
+                          innerRef={undefined}
                           style={
                             Object {
                               "transform": "rotate(0deg)",
@@ -5266,6 +5285,7 @@ exports[`renders <Network {...network} infoExpanded /> without throwing 1`] = `
                     <svg
                       className=""
                       height="6"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(180deg)",
@@ -5297,7 +5317,7 @@ exports[`renders <Network {...network} infoExpanded /> without throwing 1`] = `
                         className="c19"
                       >
                         <div
-                          className="c6"
+                          className="baseline-jVaZNU kXgQxt c6"
                           name="id"
                           role="group"
                           style={undefined}
@@ -5320,7 +5340,7 @@ exports[`renders <Network {...network} infoExpanded /> without throwing 1`] = `
                         className="c19"
                       >
                         <div
-                          className="c6"
+                          className="baseline-jVaZNU kXgQxt c6"
                           name="subnet"
                           role="group"
                           style={undefined}
@@ -5343,7 +5363,7 @@ exports[`renders <Network {...network} infoExpanded /> without throwing 1`] = `
                         className="c19"
                       >
                         <div
-                          className="c6"
+                          className="baseline-jVaZNU kXgQxt c6"
                           name="ip-range"
                           role="group"
                           style={undefined}
@@ -5625,6 +5645,7 @@ exports[`renders <Network {...network} infoExpanded /> without throwing 2`] = `
                           <svg
                             className=""
                             height="16"
+                            innerRef={undefined}
                             style={
                               Object {
                                 "transform": "rotate(0deg)",
@@ -5671,6 +5692,7 @@ exports[`renders <Network {...network} infoExpanded /> without throwing 2`] = `
                           <svg
                             className=""
                             height="17"
+                            innerRef={undefined}
                             style={
                               Object {
                                 "transform": "rotate(0deg)",
@@ -5820,6 +5842,68 @@ exports[`renders <Network {...network} public /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
+.c9 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c9[type='checkbox'],
+.c9[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c9[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c9::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c9:checked + label::after {
+  opacity: 1;
+}
+
+.c9:selected + label::after {
+  opacity: 1;
+}
+
+.c9:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
 .c16 {
   color: rgba(73,73,73,1);
   line-height: 1.5rem;
@@ -5884,50 +5968,6 @@ exports[`renders <Network {...network} public /> without throwing 1`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c13 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c13 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c13 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c4 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -6079,66 +6119,48 @@ exports[`renders <Network {...network} public /> without throwing 1`] = `
   color: inherit;
 }
 
-.c9 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c9[type='checkbox'],
-.c9[type='radio'] {
+.c13 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
   box-sizing: border-box;
-  padding: 0;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
 }
 
-.c9[type='number']::-webkit-inner-spin-button,
-.c9[type='number']::-webkit-outer-spin-button {
-  height: auto;
+.c13 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
 }
 
-.c9[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
-}
-
-.c9[type='search']::-webkit-search-cancel-button,
-.c9[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c9::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c9:checked + label::after {
-  opacity: 1;
-}
-
-.c9:selected + label::after {
-  opacity: 1;
-}
-
-.c9:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c9:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c9:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
+.c13 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
 }
 
 .c10 {
@@ -6261,7 +6283,7 @@ exports[`renders <Network {...network} public /> without throwing 1`] = `
             name="card-header-box"
           >
             <div
-              className="c6"
+              className="baseline-jVaZNU kXgQxt c6"
               name="1"
               role="group"
               style={undefined}
@@ -6340,6 +6362,7 @@ exports[`renders <Network {...network} public /> without throwing 1`] = `
                         <svg
                           className=""
                           height="16"
+                          innerRef={undefined}
                           style={
                             Object {
                               "transform": "rotate(0deg)",
@@ -6387,6 +6410,7 @@ exports[`renders <Network {...network} public /> without throwing 1`] = `
                         <svg
                           className=""
                           height="13"
+                          innerRef={undefined}
                           style={
                             Object {
                               "transform": "rotate(0deg)",
@@ -6675,6 +6699,7 @@ exports[`renders <Network {...network} public /> without throwing 2`] = `
                           <svg
                             className=""
                             height="16"
+                            innerRef={undefined}
                             style={
                               Object {
                                 "transform": "rotate(0deg)",
@@ -6722,6 +6747,7 @@ exports[`renders <Network {...network} public /> without throwing 2`] = `
                           <svg
                             className=""
                             height="13"
+                            innerRef={undefined}
                             style={
                               Object {
                                 "transform": "rotate(0deg)",
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/package.spec.js.snap b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/package.spec.js.snap
index 60af8521..36a32c09 100644
--- a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/package.spec.js.snap
+++ b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/package.spec.js.snap
@@ -105,6 +105,68 @@ exports[`renders <Filters /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c6 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c6[type='checkbox'],
+.c6[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c6[type='number']::-webkit-inner-spin-button,
+.c6[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c6[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c6[type='search']::-webkit-search-cancel-button,
+.c6[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c6::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c6:checked + label::after {
+  opacity: 1;
+}
+
+.c6:selected + label::after {
+  opacity: 1;
+}
+
+.c6:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c6:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c6:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
 .c15 {
   display: inline-block;
 }
@@ -226,68 +288,6 @@ exports[`renders <Filters /> without throwing 1`] = `
   margin-top: 0.75rem;
 }
 
-.c6 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c6[type='checkbox'],
-.c6[type='radio'] {
-  box-sizing: border-box;
-  padding: 0;
-}
-
-.c6[type='number']::-webkit-inner-spin-button,
-.c6[type='number']::-webkit-outer-spin-button {
-  height: auto;
-}
-
-.c6[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
-}
-
-.c6[type='search']::-webkit-search-cancel-button,
-.c6[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c6::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c6:checked + label::after {
-  opacity: 1;
-}
-
-.c6:selected + label::after {
-  opacity: 1;
-}
-
-.c6:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c6:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c6:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
-}
-
 .c7 {
   color: rgb(100,100,100);
   position: absolute;
@@ -381,7 +381,7 @@ exports[`renders <Filters /> without throwing 1`] = `
     className="c2"
   >
     <div
-      className="c3"
+      className="baseline-jVaZNU kXgQxt c3"
       name="compute-optimized"
       role="group"
       style={undefined}
@@ -424,6 +424,7 @@ exports[`renders <Filters /> without throwing 1`] = `
               <svg
                 className=""
                 height="24"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -449,7 +450,7 @@ exports[`renders <Filters /> without throwing 1`] = `
       </li>
     </div>
     <div
-      className="c3"
+      className="baseline-jVaZNU kXgQxt c3"
       name="memory-optimized"
       role="group"
       style={undefined}
@@ -492,6 +493,7 @@ exports[`renders <Filters /> without throwing 1`] = `
               <svg
                 className=""
                 height="21.68"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -517,7 +519,7 @@ exports[`renders <Filters /> without throwing 1`] = `
       </li>
     </div>
     <div
-      className="c3"
+      className="baseline-jVaZNU kXgQxt c3"
       name="general-purpose"
       role="group"
       style={undefined}
@@ -560,6 +562,7 @@ exports[`renders <Filters /> without throwing 1`] = `
               <svg
                 className=""
                 height="20"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -585,7 +588,7 @@ exports[`renders <Filters /> without throwing 1`] = `
       </li>
     </div>
     <div
-      className="c3"
+      className="baseline-jVaZNU kXgQxt c3"
       name="storage-optimized"
       role="group"
       style={undefined}
@@ -628,6 +631,7 @@ exports[`renders <Filters /> without throwing 1`] = `
               <svg
                 className=""
                 height="22"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -653,7 +657,7 @@ exports[`renders <Filters /> without throwing 1`] = `
       </li>
     </div>
     <div
-      className="c3"
+      className="baseline-jVaZNU kXgQxt c3"
       name="ssd"
       role="group"
       style={undefined}
@@ -1220,15 +1224,6 @@ exports[`renders <Package /> without throwing 1`] = `
   align-items: center;
 }
 
-.c10 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-}
-
 .c5 {
   font-family: sans-serif;
   font-size: 100%;
@@ -1291,6 +1286,15 @@ exports[`renders <Package /> without throwing 1`] = `
   cursor: not-allowed;
 }
 
+.c10 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+}
+
 .c6 {
   color: rgb(100,100,100);
   position: absolute;
@@ -1419,7 +1423,7 @@ exports[`renders <Package /> without throwing 1`] = `
     selected={false}
   >
     <div
-      className="c2"
+      className="baseline-jVaZNU kXgQxt c2"
       name="package"
       role="group"
       style={undefined}
@@ -1573,6 +1577,11 @@ exports[`renders <Packages expanded /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c4 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
 .c15 {
   display: inline-block;
 }
@@ -1664,11 +1673,6 @@ exports[`renders <Packages expanded /> without throwing 1`] = `
   margin-top: 1.5rem;
 }
 
-.c4 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
 .c7 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -1840,6 +1844,7 @@ exports[`renders <Packages expanded /> without throwing 1`] = `
           <svg
             className="c4"
             height="6"
+            innerRef={undefined}
             marginBottom="0.125rem"
             marginLeft="0.5625rem"
             style={
@@ -2018,6 +2023,11 @@ exports[`renders <Packages isVmSelected /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c4 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
 .c15 {
   display: inline-block;
 }
@@ -2109,11 +2119,6 @@ exports[`renders <Packages isVmSelected /> without throwing 1`] = `
   margin-top: 1.5rem;
 }
 
-.c4 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
 .c7 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -2285,6 +2290,7 @@ exports[`renders <Packages isVmSelected /> without throwing 1`] = `
           <svg
             className="c4"
             height="6"
+            innerRef={undefined}
             marginBottom="0.125rem"
             marginLeft="0.5625rem"
             style={
@@ -2463,6 +2469,11 @@ exports[`renders <Packages loading /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c4 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
 .c15 {
   display: inline-block;
 }
@@ -2554,11 +2565,6 @@ exports[`renders <Packages loading /> without throwing 1`] = `
   margin-top: 1.5rem;
 }
 
-.c4 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
 .c7 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -2730,6 +2736,7 @@ exports[`renders <Packages loading /> without throwing 1`] = `
           <svg
             className="c4"
             height="6"
+            innerRef={undefined}
             marginBottom="0.125rem"
             marginLeft="0.5625rem"
             style={
@@ -2869,6 +2876,11 @@ exports[`renders <Packages packages=[{name: stuff, imageName: stuff}] /> without
   margin-left: 0.375rem;
 }
 
+.c4 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
 .c9 {
   display: inline-block;
 }
@@ -2939,11 +2951,6 @@ exports[`renders <Packages packages=[{name: stuff, imageName: stuff}] /> without
   pointer-events: none;
 }
 
-.c4 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
 .c0 {
   overflow: hidden;
   border-spacing: 0;
@@ -3089,6 +3096,7 @@ exports[`renders <Packages packages=[{name: stuff, imageName: stuff}] /> without
           <svg
             className="c4"
             height="6"
+            innerRef={undefined}
             marginBottom="0.125rem"
             marginLeft="0.5625rem"
             style={
@@ -3240,6 +3248,11 @@ exports[`renders <Packages pristine={false} /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c4 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
 .c15 {
   display: inline-block;
 }
@@ -3331,11 +3344,6 @@ exports[`renders <Packages pristine={false} /> without throwing 1`] = `
   margin-top: 1.5rem;
 }
 
-.c4 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
 .c7 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -3507,6 +3515,7 @@ exports[`renders <Packages pristine={false} /> without throwing 1`] = `
           <svg
             className="c4"
             height="6"
+            innerRef={undefined}
             marginBottom="0.125rem"
             marginLeft="0.5625rem"
             style={
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/title.spec.js.snap b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/title.spec.js.snap
index 4115dd66..e4f37b92 100644
--- a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/title.spec.js.snap
+++ b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/title.spec.js.snap
@@ -196,6 +196,7 @@ Array [
             <svg
                 className=""
                 height="17"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
@@ -338,6 +339,7 @@ Array [
             <svg
                 className=""
                 height="17"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/key-value.spec.js.snap b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/key-value.spec.js.snap
index b53071b0..b3f5a687 100644
--- a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/key-value.spec.js.snap
+++ b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/key-value.spec.js.snap
@@ -451,6 +451,32 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c5 {
   color: rgba(73,73,73,1);
   font-weight: 600;
@@ -495,50 +521,6 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c6 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c6 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c6 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c1 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -637,6 +619,50 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   color: inherit;
 }
 
+.c6 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c6 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c6 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
 .c10 {
   display: inline-block;
   margin: 0;
@@ -665,7 +691,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   background-color: rgb(255,255,255);
   border: 0.0625rem solid rgb(216,216,216);
   color: rgba(73,73,73,1);
-  max-width: 18.75rem;
+  max-width: 22.1875rem;
   text-overflow: ellipsis;
   font-size: 0.9375rem;
   line-height: normal !important;
@@ -716,32 +742,6 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   outline: 0;
 }
 
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c2 {
   word-wrap: break-word;
   overflow-wrap: break-word;
@@ -824,7 +824,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
           className="c9"
         >
           <div
-            className="c10"
+            className="baseline-jVaZNU kXgQxt c10"
             name="name"
             role="group"
             style={undefined}
@@ -853,7 +853,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
           className="c9"
         >
           <div
-            className="c10"
+            className="baseline-jVaZNU kXgQxt c10"
             name="value"
             role="group"
             style={undefined}
@@ -918,6 +918,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
             <svg
               className=""
               height="12"
+              innerRef={undefined}
               style={
                 Object {
                   "transform": "rotate(0deg)",
@@ -986,6 +987,64 @@ exports[`renders <KeyValue expanded={false} /> without throwing 1`] = `
   margin-top: 0.75rem;
 }
 
+.c4 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  min-height: auto;
+  height: 2.875rem;
+  -webkit-flex: 0 0 2.875rem;
+  -ms-flex: 0 0 2.875rem;
+  flex: 0 0 2.875rem;
+  box-sizing: border-box;
+  min-height: 2.9375rem;
+  max-width: 100%;
+  width: auto;
+  height: auto;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: stretch;
+  -webkit-box-align: stretch;
+  -ms-flex-align: stretch;
+  align-items: stretch;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+  overflow: hidden;
+  background-color: transparent;
+  border-width: 0;
+  box-shadow: none;
+  color: inherit;
+}
+
 .c0 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -1057,64 +1116,6 @@ exports[`renders <KeyValue expanded={false} /> without throwing 1`] = `
   margin-top: 0;
 }
 
-.c4 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  min-height: auto;
-  height: 2.875rem;
-  -webkit-flex: 0 0 2.875rem;
-  -ms-flex: 0 0 2.875rem;
-  flex: 0 0 2.875rem;
-  box-sizing: border-box;
-  min-height: 2.9375rem;
-  max-width: 100%;
-  width: auto;
-  height: auto;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: stretch;
-  -webkit-box-align: stretch;
-  -ms-flex-align: stretch;
-  align-items: stretch;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-  overflow: hidden;
-  background-color: transparent;
-  border-width: 0;
-  box-shadow: none;
-  color: inherit;
-}
-
 .c2 {
   word-wrap: break-word;
   overflow-wrap: break-word;
@@ -1603,6 +1604,32 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c5 {
   color: rgba(73,73,73,1);
   font-weight: 600;
@@ -1647,50 +1674,6 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c6 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c6 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c6 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c1 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -1789,6 +1772,50 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   color: inherit;
 }
 
+.c6 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c6 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c6 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
 .c10 {
   display: inline-block;
   margin: 0;
@@ -1817,7 +1844,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   background-color: rgb(255,255,255);
   border: 0.0625rem solid rgb(216,216,216);
   color: rgba(73,73,73,1);
-  max-width: 18.75rem;
+  max-width: 22.1875rem;
   text-overflow: ellipsis;
   font-size: 0.9375rem;
   line-height: normal !important;
@@ -1868,32 +1895,6 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   outline: 0;
 }
 
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c2 {
   word-wrap: break-word;
   overflow-wrap: break-word;
@@ -1976,7 +1977,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
           className="c9"
         >
           <div
-            className="c10"
+            className="baseline-jVaZNU kXgQxt c10"
             name="name"
             role="group"
             style={undefined}
@@ -2005,7 +2006,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
           className="c9"
         >
           <div
-            className="c10"
+            className="baseline-jVaZNU kXgQxt c10"
             name="value"
             role="group"
             style={undefined}
@@ -2070,6 +2071,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
             <svg
               className=""
               height="12"
+              innerRef={undefined}
               style={
                 Object {
                   "transform": "rotate(0deg)",
@@ -2209,6 +2211,18 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c15 {
+  position: relative;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  width: 100%;
+}
+
 .c19 {
   display: inline-block;
 }
@@ -2516,6 +2530,32 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c5 {
   color: rgba(73,73,73,1);
   font-weight: 600;
@@ -2567,50 +2607,6 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c6 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c6 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c6 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c1 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -2709,6 +2705,50 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   color: inherit;
 }
 
+.c6 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c6 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c6 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
 .c10 {
   display: inline-block;
   margin: 0;
@@ -2737,7 +2777,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   background-color: rgb(255,255,255);
   border: 0.0625rem solid rgb(216,216,216);
   color: rgba(73,73,73,1);
-  max-width: 18.75rem;
+  max-width: 22.1875rem;
   text-overflow: ellipsis;
   font-size: 0.9375rem;
   line-height: normal !important;
@@ -2852,44 +2892,6 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   outline: 0;
 }
 
-.c15 {
-  position: relative;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  width: 100%;
-}
-
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c2 {
   word-wrap: break-word;
   overflow-wrap: break-word;
@@ -2972,7 +2974,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
           className="c9"
         >
           <div
-            className="c10"
+            className="baseline-jVaZNU kXgQxt c10"
             name="name"
             role="group"
             style={undefined}
@@ -3006,7 +3008,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
           className="c9"
         >
           <div
-            className="c10"
+            className="baseline-jVaZNU kXgQxt c10"
             name="value"
             role="group"
             style={undefined}
@@ -3075,6 +3077,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
             <svg
               className=""
               height="12"
+              innerRef={undefined}
               style={
                 Object {
                   "transform": "rotate(0deg)",
@@ -3567,6 +3570,32 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c5 {
   color: rgba(73,73,73,1);
   font-weight: 600;
@@ -3611,50 +3640,6 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c6 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c6 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c6 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c1 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -3753,6 +3738,50 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   color: inherit;
 }
 
+.c6 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c6 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c6 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
 .c10 {
   display: inline-block;
   margin: 0;
@@ -3781,7 +3810,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   background-color: rgb(255,255,255);
   border: 0.0625rem solid rgb(216,216,216);
   color: rgba(73,73,73,1);
-  max-width: 18.75rem;
+  max-width: 22.1875rem;
   text-overflow: ellipsis;
   font-size: 0.9375rem;
   line-height: normal !important;
@@ -3832,32 +3861,6 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   outline: 0;
 }
 
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c2 {
   word-wrap: break-word;
   overflow-wrap: break-word;
@@ -3940,7 +3943,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
           className="c9"
         >
           <div
-            className="c10"
+            className="baseline-jVaZNU kXgQxt c10"
             name="name"
             role="group"
             style={undefined}
@@ -3969,7 +3972,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
           className="c9"
         >
           <div
-            className="c10"
+            className="baseline-jVaZNU kXgQxt c10"
             name="value"
             role="group"
             style={undefined}
@@ -4034,6 +4037,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
             <svg
               className=""
               height="12"
+              innerRef={undefined}
               style={
                 Object {
                   "transform": "rotate(0deg)",
@@ -4526,6 +4530,32 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c0 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -4721,7 +4751,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   background-color: rgb(255,255,255);
   border: 0.0625rem solid rgb(216,216,216);
   color: rgba(73,73,73,1);
-  max-width: 18.75rem;
+  max-width: 22.1875rem;
   text-overflow: ellipsis;
   font-size: 0.9375rem;
   line-height: normal !important;
@@ -4772,32 +4802,6 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   outline: 0;
 }
 
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c5 {
   word-break: break-all;
   line-height: 1.5;
@@ -4891,7 +4895,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
           className="c9"
         >
           <div
-            className="c10"
+            className="baseline-jVaZNU kXgQxt c10"
             name="name"
             role="group"
             style={undefined}
@@ -4920,7 +4924,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
           className="c9"
         >
           <div
-            className="c10"
+            className="baseline-jVaZNU kXgQxt c10"
             name="value"
             role="group"
             style={undefined}
@@ -4985,6 +4989,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
             <svg
               className=""
               height="12"
+              innerRef={undefined}
               style={
                 Object {
                   "transform": "rotate(0deg)",
@@ -5138,6 +5143,38 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   flex-basis: 0.75rem;
 }
 
+.c19 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  text-transform: none;
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  min-width: 7.5rem;
+}
+
+.c19::-moz-focus-inner,
+.c19[type='button']::-moz-focus-inner,
+.c19[type='reset']::-moz-focus-inner,
+.c19[type='submit']::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+.c19:-moz-focusring,
+.c19[type='button']:-moz-focusring,
+.c19[type='reset']:-moz-focusring,
+.c19[type='submit']:-moz-focusring {
+  outline: 0.0625rem dotted ButtonText;
+}
+
+.c19 + button {
+  margin-left: 0.375rem;
+}
+
 .c24 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
@@ -5191,38 +5228,6 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   flex: 1 0 auto;
 }
 
-.c19 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  text-transform: none;
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  min-width: 7.5rem;
-}
-
-.c19::-moz-focus-inner,
-.c19[type='button']::-moz-focus-inner,
-.c19[type='reset']::-moz-focus-inner,
-.c19[type='submit']::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-
-.c19:-moz-focusring,
-.c19[type='button']:-moz-focusring,
-.c19[type='reset']:-moz-focusring,
-.c19[type='submit']:-moz-focusring {
-  outline: 0.0625rem dotted ButtonText;
-}
-
-.c19 + button {
-  margin-left: 0.375rem;
-}
-
 .c18 {
   display: inline-block;
 }
@@ -5552,6 +5557,32 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c5 {
   color: rgba(73,73,73,1);
   font-weight: 600;
@@ -5596,50 +5627,6 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c6 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c6 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c6 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c1 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -5738,6 +5725,50 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   color: inherit;
 }
 
+.c6 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c6 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c6 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
 .c10 {
   display: inline-block;
   margin: 0;
@@ -5766,7 +5797,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   background-color: rgb(255,255,255);
   border: 0.0625rem solid rgb(216,216,216);
   color: rgba(73,73,73,1);
-  max-width: 18.75rem;
+  max-width: 22.1875rem;
   text-overflow: ellipsis;
   font-size: 0.9375rem;
   line-height: normal !important;
@@ -5817,32 +5848,6 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   outline: 0;
 }
 
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c2 {
   word-wrap: break-word;
   overflow-wrap: break-word;
@@ -5925,7 +5930,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
           className="c9"
         >
           <div
-            className="c10"
+            className="baseline-jVaZNU kXgQxt c10"
             name="name"
             role="group"
             style={undefined}
@@ -5954,7 +5959,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
           className="c9"
         >
           <div
-            className="c10"
+            className="baseline-jVaZNU kXgQxt c10"
             name="value"
             role="group"
             style={undefined}
@@ -6166,6 +6171,38 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   flex-basis: 0.75rem;
 }
 
+.c19 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  text-transform: none;
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  min-width: 7.5rem;
+}
+
+.c19::-moz-focus-inner,
+.c19[type='button']::-moz-focus-inner,
+.c19[type='reset']::-moz-focus-inner,
+.c19[type='submit']::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+.c19:-moz-focusring,
+.c19[type='button']:-moz-focusring,
+.c19[type='reset']:-moz-focusring,
+.c19[type='submit']:-moz-focusring {
+  outline: 0.0625rem dotted ButtonText;
+}
+
+.c19 + button {
+  margin-left: 0.375rem;
+}
+
 .c22 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
@@ -6219,38 +6256,6 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   flex: 1 0 auto;
 }
 
-.c19 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  text-transform: none;
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  min-width: 7.5rem;
-}
-
-.c19::-moz-focus-inner,
-.c19[type='button']::-moz-focus-inner,
-.c19[type='reset']::-moz-focus-inner,
-.c19[type='submit']::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-
-.c19:-moz-focusring,
-.c19[type='button']:-moz-focusring,
-.c19[type='reset']:-moz-focusring,
-.c19[type='submit']:-moz-focusring {
-  outline: 0.0625rem dotted ButtonText;
-}
-
-.c19 + button {
-  margin-left: 0.375rem;
-}
-
 .c18 {
   display: inline-block;
 }
@@ -6602,6 +6607,32 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   border-color: rgb(250,250,250);
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c5 {
   color: rgba(73,73,73,1);
   font-weight: 600;
@@ -6646,50 +6677,6 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c6 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c6 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c6 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c1 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -6788,6 +6775,50 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   color: inherit;
 }
 
+.c6 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c6 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c6 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
 .c10 {
   display: inline-block;
   margin: 0;
@@ -6819,7 +6850,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
-  max-width: 18.75rem;
+  max-width: 22.1875rem;
   text-overflow: ellipsis;
   font-size: 0.9375rem;
   line-height: normal !important;
@@ -6882,32 +6913,6 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   outline: 0;
 }
 
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c2 {
   word-wrap: break-word;
   overflow-wrap: break-word;
@@ -6990,7 +6995,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
           className="c9"
         >
           <div
-            className="c10"
+            className="baseline-jVaZNU kXgQxt c10"
             name="name"
             role="group"
             style={undefined}
@@ -7019,7 +7024,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
           className="c9"
         >
           <div
-            className="c10"
+            className="baseline-jVaZNU kXgQxt c10"
             name="value"
             role="group"
             style={undefined}
@@ -7111,6 +7116,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
             <svg
               className=""
               height="12"
+              innerRef={undefined}
               style={
                 Object {
                   "transform": "rotate(0deg)",
@@ -7603,6 +7609,32 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c5 {
   color: rgba(73,73,73,1);
   font-weight: 600;
@@ -7647,50 +7679,6 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c6 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c6 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c6 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c1 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -7789,6 +7777,50 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   color: inherit;
 }
 
+.c6 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c6 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c6 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
 .c10 {
   display: inline-block;
   margin: 0;
@@ -7817,7 +7849,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   background-color: rgb(255,255,255);
   border: 0.0625rem solid rgb(216,216,216);
   color: rgba(73,73,73,1);
-  max-width: 18.75rem;
+  max-width: 22.1875rem;
   text-overflow: ellipsis;
   font-size: 0.9375rem;
   line-height: normal !important;
@@ -7868,32 +7900,6 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   outline: 0;
 }
 
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c2 {
   word-wrap: break-word;
   overflow-wrap: break-word;
@@ -7976,7 +7982,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
           className="c9"
         >
           <div
-            className="c10"
+            className="baseline-jVaZNU kXgQxt c10"
             name="name"
             role="group"
             style={undefined}
@@ -8005,7 +8011,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
           className="c9"
         >
           <div
-            className="c10"
+            className="baseline-jVaZNU kXgQxt c10"
             name="value"
             role="group"
             style={undefined}
@@ -8070,6 +8076,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
             <svg
               className=""
               height="12"
+              innerRef={undefined}
               style={
                 Object {
                   "transform": "rotate(0deg)",
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/list.spec.js.snap b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/list.spec.js.snap
index 46da5009..fce795d1 100644
--- a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/list.spec.js.snap
+++ b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/list.spec.js.snap
@@ -1,12 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders <InstanceList /> without throwing 1`] = `
-.c13 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
-.c10 {
+.c9 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -15,60 +10,78 @@ exports[`renders <InstanceList /> without throwing 1`] = `
   display: none;
 }
 
-.c10[type='checkbox'],
-.c10[type='radio'] {
+.c9[type='checkbox'],
+.c9[type='radio'] {
   box-sizing: border-box;
   padding: 0;
 }
 
-.c10[type='number']::-webkit-inner-spin-button,
-.c10[type='number']::-webkit-outer-spin-button {
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
   height: auto;
 }
 
-.c10[type='search'] {
+.c9[type='search'] {
   -webkit-appearance: textfield;
   -moz-appearance: textfield;
   appearance: textfield;
   outline-offset: -0.125rem;
 }
 
-.c10[type='search']::-webkit-search-cancel-button,
-.c10[type='search']::-webkit-search-decoration {
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
 }
 
-.c10::-webkit-file-upload-button {
+.c9::-webkit-file-upload-button {
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   font: inherit;
 }
 
-.c10:checked + label::after {
+.c9:checked + label::after {
   opacity: 1;
 }
 
-.c10:selected + label::after {
+.c9:selected + label::after {
   opacity: 1;
 }
 
-.c10:checked + label {
+.c9:checked + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:selected + label {
+.c9:selected + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:disabled + label {
+.c9:disabled + label {
   background-color: rgb(249,249,249);
   cursor: not-allowed;
 }
 
-.c11 {
+.c3 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c5 {
+  padding-top: 0.25rem;
+}
+
+.c16 {
+  padding: 0rem;
+}
+
+.c12 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c10 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -86,7 +99,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c11::after {
+.c10::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -103,7 +116,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c9 {
+.c8 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -112,7 +125,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c8 {
+.c7 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -124,11 +137,11 @@ exports[`renders <InstanceList /> without throwing 1`] = `
   align-items: center;
 }
 
-.c8 label {
+.c7 label {
   font-weight: 400;
 }
 
-.c7 {
+.c6 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -143,14 +156,6 @@ exports[`renders <InstanceList /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c6 {
-  padding-top: 0.25rem;
-}
-
-.c5 {
-  padding-top: 0.25rem;
-}
-
 .c0 {
   overflow: hidden;
   border-spacing: 0;
@@ -173,11 +178,11 @@ exports[`renders <InstanceList /> without throwing 1`] = `
   border-top-right-radius: 0.25rem;
 }
 
-.c19 {
+.c18 {
   width: 100%;
 }
 
-.c19 tr:first-child td {
+.c18 tr:first-child td {
   border-top: none;
 }
 
@@ -207,7 +212,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c12 {
+.c11 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -230,11 +235,42 @@ exports[`renders <InstanceList /> without throwing 1`] = `
   font-weight: bold;
 }
 
-.c12:not(:first-child) {
+.c11:not(:first-child) {
   border-left-width: 0;
 }
 
-.c12:not(:last-child) {
+.c11:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c13 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 9.375rem;
+  display: table-cell;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c13:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c13:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -247,8 +283,8 @@ exports[`renders <InstanceList /> without throwing 1`] = `
   box-sizing: border-box;
   padding: 0 1.5rem;
   height: 3.75rem;
-  width: 9.375rem;
-  display: table-cell;
+  width: 0rem;
+  display: none;
   cursor: pointer;
   -webkit-user-select: none;
   -moz-user-select: none;
@@ -300,38 +336,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c16 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c16:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c16:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c18 {
+.c17 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -347,11 +352,11 @@ exports[`renders <InstanceList /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c18:not(:first-child) {
+.c17:not(:first-child) {
   border-left-width: 0;
 }
 
-.c18:not(:last-child) {
+.c17:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -375,24 +380,15 @@ exports[`renders <InstanceList /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c3 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c17 {
-  padding: 0rem;
-}
-
 @media only screen and (min-width:47.9375rem) {
-  .c15 {
+  .c14 {
     width: 10rem;
     display: table-cell;
   }
 }
 
 @media only screen and (min-width:47.9375rem) {
-  .c16 {
+  .c15 {
     width: 8.125rem;
     display: table-cell;
   }
@@ -421,16 +417,16 @@ exports[`renders <InstanceList /> without throwing 1`] = `
           selected={undefined}
         >
           <div
-            className="c5 c6 c7"
+            className="c5 baseline-jVaZNU c5 c6"
             role="group"
             style={undefined}
           >
             <li
-              className="c8"
+              className="c7"
             >
               <div
                 checked={false}
-                className="c9"
+                className="c8"
                 disabled={false}
                 id="bh"
                 onChange={[Function]}
@@ -438,14 +434,14 @@ exports[`renders <InstanceList /> without throwing 1`] = `
               >
                 <input
                   checked={false}
-                  className="c10"
+                  className="c9"
                   disabled={false}
                   id="bi"
                   onChange={[Function]}
                   type="checkbox"
                 />
                 <label
-                  className="c11"
+                  className="c10"
                   htmlFor="bi"
                 />
               </div>
@@ -453,7 +449,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
           </div>
         </th>
         <th
-          className="c12"
+          className="c11"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -463,8 +459,9 @@ exports[`renders <InstanceList /> without throwing 1`] = `
             Name 
           </span>
           <svg
-            className="c13"
+            className="c12"
             height="6"
+            innerRef={undefined}
             marginBottom="0.125rem"
             marginLeft="0.5625rem"
             style={
@@ -484,7 +481,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
           </svg>
         </th>
         <th
-          className="c14"
+          className="c13"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -495,7 +492,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
           </span>
         </th>
         <th
-          className="c15"
+          className="c14"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -506,7 +503,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
           </span>
         </th>
         <th
-          className="c16"
+          className="c15"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -517,7 +514,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
           </span>
         </th>
         <th
-          className="c17 c18"
+          className="c16 c17"
           disabled={undefined}
           name="th"
           selected={undefined}
@@ -525,7 +522,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
       </tr>
     </thead>
     <tbody
-      className="c19"
+      className="c18"
       disabled={undefined}
       name="tbody"
       selected={undefined}
@@ -535,12 +532,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
 `;
 
 exports[`renders <InstanceList allSelected /> without throwing 1`] = `
-.c13 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
-.c10 {
+.c9 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -549,60 +541,78 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
   display: none;
 }
 
-.c10[type='checkbox'],
-.c10[type='radio'] {
+.c9[type='checkbox'],
+.c9[type='radio'] {
   box-sizing: border-box;
   padding: 0;
 }
 
-.c10[type='number']::-webkit-inner-spin-button,
-.c10[type='number']::-webkit-outer-spin-button {
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
   height: auto;
 }
 
-.c10[type='search'] {
+.c9[type='search'] {
   -webkit-appearance: textfield;
   -moz-appearance: textfield;
   appearance: textfield;
   outline-offset: -0.125rem;
 }
 
-.c10[type='search']::-webkit-search-cancel-button,
-.c10[type='search']::-webkit-search-decoration {
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
 }
 
-.c10::-webkit-file-upload-button {
+.c9::-webkit-file-upload-button {
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   font: inherit;
 }
 
-.c10:checked + label::after {
+.c9:checked + label::after {
   opacity: 1;
 }
 
-.c10:selected + label::after {
+.c9:selected + label::after {
   opacity: 1;
 }
 
-.c10:checked + label {
+.c9:checked + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:selected + label {
+.c9:selected + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:disabled + label {
+.c9:disabled + label {
   background-color: rgb(249,249,249);
   cursor: not-allowed;
 }
 
-.c11 {
+.c3 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c5 {
+  padding-top: 0.25rem;
+}
+
+.c16 {
+  padding: 0rem;
+}
+
+.c12 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c10 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -620,7 +630,7 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c11::after {
+.c10::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -637,7 +647,7 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c9 {
+.c8 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -646,7 +656,7 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c8 {
+.c7 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -658,11 +668,11 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
   align-items: center;
 }
 
-.c8 label {
+.c7 label {
   font-weight: 400;
 }
 
-.c7 {
+.c6 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -677,14 +687,6 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c6 {
-  padding-top: 0.25rem;
-}
-
-.c5 {
-  padding-top: 0.25rem;
-}
-
 .c0 {
   overflow: hidden;
   border-spacing: 0;
@@ -707,11 +709,11 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
   border-top-right-radius: 0.25rem;
 }
 
-.c19 {
+.c18 {
   width: 100%;
 }
 
-.c19 tr:first-child td {
+.c18 tr:first-child td {
   border-top: none;
 }
 
@@ -741,7 +743,7 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c12 {
+.c11 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -764,11 +766,42 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
   font-weight: bold;
 }
 
-.c12:not(:first-child) {
+.c11:not(:first-child) {
   border-left-width: 0;
 }
 
-.c12:not(:last-child) {
+.c11:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c13 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 9.375rem;
+  display: table-cell;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c13:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c13:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -781,8 +814,8 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
   box-sizing: border-box;
   padding: 0 1.5rem;
   height: 3.75rem;
-  width: 9.375rem;
-  display: table-cell;
+  width: 0rem;
+  display: none;
   cursor: pointer;
   -webkit-user-select: none;
   -moz-user-select: none;
@@ -834,38 +867,7 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c16 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c16:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c16:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c18 {
+.c17 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -881,11 +883,11 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c18:not(:first-child) {
+.c17:not(:first-child) {
   border-left-width: 0;
 }
 
-.c18:not(:last-child) {
+.c17:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -909,24 +911,15 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c3 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c17 {
-  padding: 0rem;
-}
-
 @media only screen and (min-width:47.9375rem) {
-  .c15 {
+  .c14 {
     width: 10rem;
     display: table-cell;
   }
 }
 
 @media only screen and (min-width:47.9375rem) {
-  .c16 {
+  .c15 {
     width: 8.125rem;
     display: table-cell;
   }
@@ -955,16 +948,16 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
           selected={undefined}
         >
           <div
-            className="c5 c6 c7"
+            className="c5 baseline-jVaZNU c5 c6"
             role="group"
             style={undefined}
           >
             <li
-              className="c8"
+              className="c7"
             >
               <div
                 checked={true}
-                className="c9"
+                className="c8"
                 disabled={false}
                 id="bt"
                 onChange={[Function]}
@@ -972,14 +965,14 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
               >
                 <input
                   checked={true}
-                  className="c10"
+                  className="c9"
                   disabled={false}
                   id="bu"
                   onChange={[Function]}
                   type="checkbox"
                 />
                 <label
-                  className="c11"
+                  className="c10"
                   htmlFor="bu"
                 />
               </div>
@@ -987,7 +980,7 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
           </div>
         </th>
         <th
-          className="c12"
+          className="c11"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -996,9 +989,552 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
           <span>
             Name 
           </span>
+          <svg
+            className="c12"
+            height="6"
+            innerRef={undefined}
+            marginBottom="0.125rem"
+            marginLeft="0.5625rem"
+            style={
+              Object {
+                "transform": "rotate(180deg)",
+              }
+            }
+            viewBox="0 0 9 6"
+            width="9"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
+              fill="rgba(73, 73, 73, 1)"
+              fillRule="evenodd"
+            />
+          </svg>
+        </th>
+        <th
+          className="c13"
+          disabled={undefined}
+          name="th"
+          onClick={[Function]}
+          selected={undefined}
+        >
+          <span>
+            Status 
+          </span>
+        </th>
+        <th
+          className="c14"
+          disabled={undefined}
+          name="th"
+          onClick={[Function]}
+          selected={undefined}
+        >
+          <span>
+            Created 
+          </span>
+        </th>
+        <th
+          className="c15"
+          disabled={undefined}
+          name="th"
+          onClick={[Function]}
+          selected={undefined}
+        >
+          <span>
+            Short ID 
+          </span>
+        </th>
+        <th
+          className="c16 c17"
+          disabled={undefined}
+          name="th"
+          selected={undefined}
+        />
+      </tr>
+    </thead>
+    <tbody
+      className="c18"
+      disabled={undefined}
+      name="tbody"
+      selected={undefined}
+    />
+  </table>
+</form>
+`;
+
+exports[`renders <InstanceList sortBy /> without throwing 1`] = `
+.c9 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c9[type='checkbox'],
+.c9[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c9[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c9::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c9:checked + label::after {
+  opacity: 1;
+}
+
+.c9:selected + label::after {
+  opacity: 1;
+}
+
+.c9:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
+.c3 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c5 {
+  padding-top: 0.25rem;
+}
+
+.c16 {
+  padding: 0rem;
+}
+
+.c13 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c10 {
+  color: rgb(100,100,100);
+  position: absolute;
+  width: 1.125rem;
+  height: 1.125rem;
+  box-sizing: border-box;
+  top: 0;
+  right: 0;
+  cursor: pointer;
+  background-color: rgb(255,255,255);
+  box-shadow: none;
+  border: 0.0625rem solid rgb(216,216,216);
+  cursor: pointer;
+  border-radius: 0.25rem;
+  width: 1.125rem;
+  height: 1.125rem;
+}
+
+.c10::after {
+  opacity: 0;
+  content: '';
+  position: absolute;
+  width: 0.375rem;
+  height: 0.125rem;
+  background: transparent;
+  top: 0.3125rem;
+  left: 0.25rem;
+  border: 0.125rem solid rgb(45,45,45);
+  border-top: none;
+  border-right: none;
+  -webkit-transform: rotate(-45deg);
+  -ms-transform: rotate(-45deg);
+  transform: rotate(-45deg);
+}
+
+.c8 {
+  display: inline-block;
+  vertical-align: text-bottom;
+  width: 1.125rem;
+  height: 1.125rem;
+  position: relative;
+  cursor: pointer;
+}
+
+.c7 {
+  list-style-type: none;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c7 label {
+  font-weight: 400;
+}
+
+.c6 {
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  border: none;
+  overflow: hidden;
+  height: auto;
+  -webkit-margin-start: 0;
+  -webkit-margin-end: 0;
+  -webkit-padding-before: 0;
+  -webkit-padding-start: 0;
+  -webkit-padding-end: 0;
+  -webkit-padding-after: 0;
+}
+
+.c0 {
+  overflow: hidden;
+  border-spacing: 0;
+  border-collapse: separate;
+  table-layout: fixed;
+  width: 100%;
+  max-width: 100%;
+}
+
+.c1 {
+  width: 100%;
+  background: rgb(250,250,250);
+}
+
+.c1 th:first-child {
+  border-top-left-radius: 0.25rem;
+}
+
+.c1 th:last-child {
+  border-top-right-radius: 0.25rem;
+}
+
+.c18 {
+  width: 100%;
+}
+
+.c18 tr:first-child td {
+  border-top: none;
+}
+
+.c4 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 2rem;
+  display: table-cell;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c4:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c4:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c14 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 0rem;
+  display: none;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c14:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c14:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c15 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 0rem;
+  display: none;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c15:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c15:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c17 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 3.75rem;
+  display: table-cell;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c17:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c17:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c11 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c11:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c11:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c12 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 9.375rem;
+  display: table-cell;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+  color: rgba(73,73,73,1);
+  font-weight: bold;
+}
+
+.c12:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c12:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c2 {
+  display: table-row;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  box-shadow: 0 0.125rem 0 rgba(0,0,0,0.05);
+  box-sizing: border-box;
+  color: rgba(73,73,73,1);
+  background-color: transparent;
+  border: none;
+  box-shadow: none;
+}
+
+.c2:last-child {
+  box-shadow: none;
+}
+
+.c2:last-child td {
+  border-bottom-width: 0.0625rem;
+}
+
+@media only screen and (min-width:47.9375rem) {
+  .c14 {
+    width: 10rem;
+    display: table-cell;
+  }
+}
+
+@media only screen and (min-width:47.9375rem) {
+  .c15 {
+    width: 8.125rem;
+    display: table-cell;
+  }
+}
+
+<form>
+  <table
+    className="c0"
+  >
+    <thead
+      className="c1"
+      disabled={undefined}
+      name="thdead"
+      selected={undefined}
+    >
+      <tr
+        className="c2"
+        disabled={undefined}
+        name="tr"
+        selected={undefined}
+      >
+        <th
+          className="c3 c4"
+          disabled={undefined}
+          name="th"
+          selected={undefined}
+        >
+          <div
+            className="c5 baseline-jVaZNU c5 c6"
+            role="group"
+            style={undefined}
+          >
+            <li
+              className="c7"
+            >
+              <div
+                checked={false}
+                className="c8"
+                disabled={false}
+                id="bk"
+                onChange={[Function]}
+                type="checkbox"
+              >
+                <input
+                  checked={false}
+                  className="c9"
+                  disabled={false}
+                  id="bl"
+                  onChange={[Function]}
+                  type="checkbox"
+                />
+                <label
+                  className="c10"
+                  htmlFor="bl"
+                />
+              </div>
+            </li>
+          </div>
+        </th>
+        <th
+          className="c11"
+          disabled={undefined}
+          name="th"
+          onClick={[Function]}
+          selected={undefined}
+        >
+          <span>
+            Name 
+          </span>
+        </th>
+        <th
+          className="c12"
+          disabled={undefined}
+          name="th"
+          onClick={[Function]}
+          selected={undefined}
+        >
+          <span>
+            Status 
+          </span>
           <svg
             className="c13"
             height="6"
+            innerRef={undefined}
             marginBottom="0.125rem"
             marginLeft="0.5625rem"
             style={
@@ -1025,7 +1561,7 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
           selected={undefined}
         >
           <span>
-            Status 
+            Created 
           </span>
         </th>
         <th
@@ -1034,24 +1570,13 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
           name="th"
           onClick={[Function]}
           selected={undefined}
-        >
-          <span>
-            Created 
-          </span>
-        </th>
-        <th
-          className="c16"
-          disabled={undefined}
-          name="th"
-          onClick={[Function]}
-          selected={undefined}
         >
           <span>
             Short ID 
           </span>
         </th>
         <th
-          className="c17 c18"
+          className="c16 c17"
           disabled={undefined}
           name="th"
           selected={undefined}
@@ -1059,541 +1584,7 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
       </tr>
     </thead>
     <tbody
-      className="c19"
-      disabled={undefined}
-      name="tbody"
-      selected={undefined}
-    />
-  </table>
-</form>
-`;
-
-exports[`renders <InstanceList sortBy /> without throwing 1`] = `
-.c14 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
-.c10 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c10[type='checkbox'],
-.c10[type='radio'] {
-  box-sizing: border-box;
-  padding: 0;
-}
-
-.c10[type='number']::-webkit-inner-spin-button,
-.c10[type='number']::-webkit-outer-spin-button {
-  height: auto;
-}
-
-.c10[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
-}
-
-.c10[type='search']::-webkit-search-cancel-button,
-.c10[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c10::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c10:checked + label::after {
-  opacity: 1;
-}
-
-.c10:selected + label::after {
-  opacity: 1;
-}
-
-.c10:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c10:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c10:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
-}
-
-.c11 {
-  color: rgb(100,100,100);
-  position: absolute;
-  width: 1.125rem;
-  height: 1.125rem;
-  box-sizing: border-box;
-  top: 0;
-  right: 0;
-  cursor: pointer;
-  background-color: rgb(255,255,255);
-  box-shadow: none;
-  border: 0.0625rem solid rgb(216,216,216);
-  cursor: pointer;
-  border-radius: 0.25rem;
-  width: 1.125rem;
-  height: 1.125rem;
-}
-
-.c11::after {
-  opacity: 0;
-  content: '';
-  position: absolute;
-  width: 0.375rem;
-  height: 0.125rem;
-  background: transparent;
-  top: 0.3125rem;
-  left: 0.25rem;
-  border: 0.125rem solid rgb(45,45,45);
-  border-top: none;
-  border-right: none;
-  -webkit-transform: rotate(-45deg);
-  -ms-transform: rotate(-45deg);
-  transform: rotate(-45deg);
-}
-
-.c9 {
-  display: inline-block;
-  vertical-align: text-bottom;
-  width: 1.125rem;
-  height: 1.125rem;
-  position: relative;
-  cursor: pointer;
-}
-
-.c8 {
-  list-style-type: none;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.c8 label {
-  font-weight: 400;
-}
-
-.c7 {
-  display: inline-block;
-  margin: 0;
-  padding: 0;
-  border: none;
-  overflow: hidden;
-  height: auto;
-  -webkit-margin-start: 0;
-  -webkit-margin-end: 0;
-  -webkit-padding-before: 0;
-  -webkit-padding-start: 0;
-  -webkit-padding-end: 0;
-  -webkit-padding-after: 0;
-}
-
-.c6 {
-  padding-top: 0.25rem;
-}
-
-.c5 {
-  padding-top: 0.25rem;
-}
-
-.c0 {
-  overflow: hidden;
-  border-spacing: 0;
-  border-collapse: separate;
-  table-layout: fixed;
-  width: 100%;
-  max-width: 100%;
-}
-
-.c1 {
-  width: 100%;
-  background: rgb(250,250,250);
-}
-
-.c1 th:first-child {
-  border-top-left-radius: 0.25rem;
-}
-
-.c1 th:last-child {
-  border-top-right-radius: 0.25rem;
-}
-
-.c19 {
-  width: 100%;
-}
-
-.c19 tr:first-child td {
-  border-top: none;
-}
-
-.c4 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 2rem;
-  display: table-cell;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c4:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c4:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c15 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c15:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c15:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c16 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c16:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c16:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c18 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 3.75rem;
-  display: table-cell;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c18:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c18:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c12 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c12:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c12:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c13 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 9.375rem;
-  display: table-cell;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-  color: rgba(73,73,73,1);
-  font-weight: bold;
-}
-
-.c13:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c13:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c2 {
-  display: table-row;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  box-shadow: 0 0.125rem 0 rgba(0,0,0,0.05);
-  box-sizing: border-box;
-  color: rgba(73,73,73,1);
-  background-color: transparent;
-  border: none;
-  box-shadow: none;
-}
-
-.c2:last-child {
-  box-shadow: none;
-}
-
-.c2:last-child td {
-  border-bottom-width: 0.0625rem;
-}
-
-.c3 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c17 {
-  padding: 0rem;
-}
-
-@media only screen and (min-width:47.9375rem) {
-  .c15 {
-    width: 10rem;
-    display: table-cell;
-  }
-}
-
-@media only screen and (min-width:47.9375rem) {
-  .c16 {
-    width: 8.125rem;
-    display: table-cell;
-  }
-}
-
-<form>
-  <table
-    className="c0"
-  >
-    <thead
-      className="c1"
-      disabled={undefined}
-      name="thdead"
-      selected={undefined}
-    >
-      <tr
-        className="c2"
-        disabled={undefined}
-        name="tr"
-        selected={undefined}
-      >
-        <th
-          className="c3 c4"
-          disabled={undefined}
-          name="th"
-          selected={undefined}
-        >
-          <div
-            className="c5 c6 c7"
-            role="group"
-            style={undefined}
-          >
-            <li
-              className="c8"
-            >
-              <div
-                checked={false}
-                className="c9"
-                disabled={false}
-                id="bk"
-                onChange={[Function]}
-                type="checkbox"
-              >
-                <input
-                  checked={false}
-                  className="c10"
-                  disabled={false}
-                  id="bl"
-                  onChange={[Function]}
-                  type="checkbox"
-                />
-                <label
-                  className="c11"
-                  htmlFor="bl"
-                />
-              </div>
-            </li>
-          </div>
-        </th>
-        <th
-          className="c12"
-          disabled={undefined}
-          name="th"
-          onClick={[Function]}
-          selected={undefined}
-        >
-          <span>
-            Name 
-          </span>
-        </th>
-        <th
-          className="c13"
-          disabled={undefined}
-          name="th"
-          onClick={[Function]}
-          selected={undefined}
-        >
-          <span>
-            Status 
-          </span>
-          <svg
-            className="c14"
-            height="6"
-            marginBottom="0.125rem"
-            marginLeft="0.5625rem"
-            style={
-              Object {
-                "transform": "rotate(180deg)",
-              }
-            }
-            viewBox="0 0 9 6"
-            width="9"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
-              fill="rgba(73, 73, 73, 1)"
-              fillRule="evenodd"
-            />
-          </svg>
-        </th>
-        <th
-          className="c15"
-          disabled={undefined}
-          name="th"
-          onClick={[Function]}
-          selected={undefined}
-        >
-          <span>
-            Created 
-          </span>
-        </th>
-        <th
-          className="c16"
-          disabled={undefined}
-          name="th"
-          onClick={[Function]}
-          selected={undefined}
-        >
-          <span>
-            Short ID 
-          </span>
-        </th>
-        <th
-          className="c17 c18"
-          disabled={undefined}
-          name="th"
-          selected={undefined}
-        />
-      </tr>
-    </thead>
-    <tbody
-      className="c19"
+      className="c18"
       disabled={undefined}
       name="tbody"
       selected={undefined}
@@ -1603,12 +1594,7 @@ exports[`renders <InstanceList sortBy /> without throwing 1`] = `
 `;
 
 exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
-.c14 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
-.c10 {
+.c9 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -1617,60 +1603,78 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
   display: none;
 }
 
-.c10[type='checkbox'],
-.c10[type='radio'] {
+.c9[type='checkbox'],
+.c9[type='radio'] {
   box-sizing: border-box;
   padding: 0;
 }
 
-.c10[type='number']::-webkit-inner-spin-button,
-.c10[type='number']::-webkit-outer-spin-button {
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
   height: auto;
 }
 
-.c10[type='search'] {
+.c9[type='search'] {
   -webkit-appearance: textfield;
   -moz-appearance: textfield;
   appearance: textfield;
   outline-offset: -0.125rem;
 }
 
-.c10[type='search']::-webkit-search-cancel-button,
-.c10[type='search']::-webkit-search-decoration {
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
 }
 
-.c10::-webkit-file-upload-button {
+.c9::-webkit-file-upload-button {
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   font: inherit;
 }
 
-.c10:checked + label::after {
+.c9:checked + label::after {
   opacity: 1;
 }
 
-.c10:selected + label::after {
+.c9:selected + label::after {
   opacity: 1;
 }
 
-.c10:checked + label {
+.c9:checked + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:selected + label {
+.c9:selected + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:disabled + label {
+.c9:disabled + label {
   background-color: rgb(249,249,249);
   cursor: not-allowed;
 }
 
-.c11 {
+.c3 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c5 {
+  padding-top: 0.25rem;
+}
+
+.c16 {
+  padding: 0rem;
+}
+
+.c13 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c10 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -1688,7 +1692,7 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c11::after {
+.c10::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -1705,7 +1709,7 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c9 {
+.c8 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -1714,7 +1718,7 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c8 {
+.c7 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1726,11 +1730,11 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
   align-items: center;
 }
 
-.c8 label {
+.c7 label {
   font-weight: 400;
 }
 
-.c7 {
+.c6 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -1745,14 +1749,6 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c6 {
-  padding-top: 0.25rem;
-}
-
-.c5 {
-  padding-top: 0.25rem;
-}
-
 .c0 {
   overflow: hidden;
   border-spacing: 0;
@@ -1775,11 +1771,11 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
   border-top-right-radius: 0.25rem;
 }
 
-.c19 {
+.c18 {
   width: 100%;
 }
 
-.c19 tr:first-child td {
+.c18 tr:first-child td {
   border-top: none;
 }
 
@@ -1809,6 +1805,37 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
   border-right-width: 0;
 }
 
+.c14 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 0rem;
+  display: none;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c14:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c14:not(:last-child) {
+  border-right-width: 0;
+}
+
 .c15 {
   border-width: 0.0625rem;
   border-style: solid;
@@ -1840,38 +1867,7 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c16 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c16:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c16:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c18 {
+.c17 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -1887,15 +1883,15 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c18:not(:first-child) {
+.c17:not(:first-child) {
   border-left-width: 0;
 }
 
-.c18:not(:last-child) {
+.c17:not(:last-child) {
   border-right-width: 0;
 }
 
-.c12 {
+.c11 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -1916,15 +1912,15 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c12:not(:first-child) {
+.c11:not(:first-child) {
   border-left-width: 0;
 }
 
-.c12:not(:last-child) {
+.c11:not(:last-child) {
   border-right-width: 0;
 }
 
-.c13 {
+.c12 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -1949,11 +1945,11 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
   font-weight: bold;
 }
 
-.c13:not(:first-child) {
+.c12:not(:first-child) {
   border-left-width: 0;
 }
 
-.c13:not(:last-child) {
+.c12:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -1977,24 +1973,15 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c3 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c17 {
-  padding: 0rem;
-}
-
 @media only screen and (min-width:47.9375rem) {
-  .c15 {
+  .c14 {
     width: 10rem;
     display: table-cell;
   }
 }
 
 @media only screen and (min-width:47.9375rem) {
-  .c16 {
+  .c15 {
     width: 8.125rem;
     display: table-cell;
   }
@@ -2023,16 +2010,16 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
           selected={undefined}
         >
           <div
-            className="c5 c6 c7"
+            className="c5 baseline-jVaZNU c5 c6"
             role="group"
             style={undefined}
           >
             <li
-              className="c8"
+              className="c7"
             >
               <div
                 checked={false}
-                className="c9"
+                className="c8"
                 disabled={false}
                 id="bn"
                 onChange={[Function]}
@@ -2040,14 +2027,14 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
               >
                 <input
                   checked={false}
-                  className="c10"
+                  className="c9"
                   disabled={false}
                   id="bo"
                   onChange={[Function]}
                   type="checkbox"
                 />
                 <label
-                  className="c11"
+                  className="c10"
                   htmlFor="bo"
                 />
               </div>
@@ -2055,7 +2042,7 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
           </div>
         </th>
         <th
-          className="c12"
+          className="c11"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -2066,7 +2053,7 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
           </span>
         </th>
         <th
-          className="c13"
+          className="c12"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -2076,8 +2063,9 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
             Status 
           </span>
           <svg
-            className="c14"
+            className="c13"
             height="6"
+            innerRef={undefined}
             marginBottom="0.125rem"
             marginLeft="0.5625rem"
             style={
@@ -2097,7 +2085,7 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
           </svg>
         </th>
         <th
-          className="c15"
+          className="c14"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -2108,7 +2096,7 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
           </span>
         </th>
         <th
-          className="c16"
+          className="c15"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -2119,7 +2107,7 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
           </span>
         </th>
         <th
-          className="c17 c18"
+          className="c16 c17"
           disabled={undefined}
           name="th"
           selected={undefined}
@@ -2127,7 +2115,7 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
       </tr>
     </thead>
     <tbody
-      className="c19"
+      className="c18"
       disabled={undefined}
       name="tbody"
       selected={undefined}
@@ -2137,12 +2125,7 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
 `;
 
 exports[`renders <InstanceList submitting /> without throwing 1`] = `
-.c13 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
-.c10 {
+.c9 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -2151,60 +2134,78 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
   display: none;
 }
 
-.c10[type='checkbox'],
-.c10[type='radio'] {
+.c9[type='checkbox'],
+.c9[type='radio'] {
   box-sizing: border-box;
   padding: 0;
 }
 
-.c10[type='number']::-webkit-inner-spin-button,
-.c10[type='number']::-webkit-outer-spin-button {
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
   height: auto;
 }
 
-.c10[type='search'] {
+.c9[type='search'] {
   -webkit-appearance: textfield;
   -moz-appearance: textfield;
   appearance: textfield;
   outline-offset: -0.125rem;
 }
 
-.c10[type='search']::-webkit-search-cancel-button,
-.c10[type='search']::-webkit-search-decoration {
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
 }
 
-.c10::-webkit-file-upload-button {
+.c9::-webkit-file-upload-button {
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   font: inherit;
 }
 
-.c10:checked + label::after {
+.c9:checked + label::after {
   opacity: 1;
 }
 
-.c10:selected + label::after {
+.c9:selected + label::after {
   opacity: 1;
 }
 
-.c10:checked + label {
+.c9:checked + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:selected + label {
+.c9:selected + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:disabled + label {
+.c9:disabled + label {
   background-color: rgb(249,249,249);
   cursor: not-allowed;
 }
 
-.c11 {
+.c3 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c5 {
+  padding-top: 0.25rem;
+}
+
+.c16 {
+  padding: 0rem;
+}
+
+.c12 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c10 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -2222,7 +2223,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c11::after {
+.c10::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -2239,7 +2240,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c9 {
+.c8 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -2248,7 +2249,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c8 {
+.c7 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -2260,11 +2261,11 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
   align-items: center;
 }
 
-.c8 label {
+.c7 label {
   font-weight: 400;
 }
 
-.c7 {
+.c6 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -2279,14 +2280,6 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c6 {
-  padding-top: 0.25rem;
-}
-
-.c5 {
-  padding-top: 0.25rem;
-}
-
 .c0 {
   overflow: hidden;
   border-spacing: 0;
@@ -2309,11 +2302,11 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
   border-top-right-radius: 0.25rem;
 }
 
-.c19 {
+.c18 {
   width: 100%;
 }
 
-.c19 tr:first-child td {
+.c18 tr:first-child td {
   border-top: none;
 }
 
@@ -2343,7 +2336,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c12 {
+.c11 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -2366,11 +2359,42 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
   font-weight: bold;
 }
 
-.c12:not(:first-child) {
+.c11:not(:first-child) {
   border-left-width: 0;
 }
 
-.c12:not(:last-child) {
+.c11:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c13 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 9.375rem;
+  display: table-cell;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c13:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c13:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -2383,8 +2407,8 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
   box-sizing: border-box;
   padding: 0 1.5rem;
   height: 3.75rem;
-  width: 9.375rem;
-  display: table-cell;
+  width: 0rem;
+  display: none;
   cursor: pointer;
   -webkit-user-select: none;
   -moz-user-select: none;
@@ -2436,38 +2460,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c16 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c16:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c16:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c18 {
+.c17 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -2483,11 +2476,11 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c18:not(:first-child) {
+.c17:not(:first-child) {
   border-left-width: 0;
 }
 
-.c18:not(:last-child) {
+.c17:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -2511,24 +2504,15 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c3 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c17 {
-  padding: 0rem;
-}
-
 @media only screen and (min-width:47.9375rem) {
-  .c15 {
+  .c14 {
     width: 10rem;
     display: table-cell;
   }
 }
 
 @media only screen and (min-width:47.9375rem) {
-  .c16 {
+  .c15 {
     width: 8.125rem;
     display: table-cell;
   }
@@ -2557,16 +2541,16 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
           selected={undefined}
         >
           <div
-            className="c5 c6 c7"
+            className="c5 baseline-jVaZNU c5 c6"
             role="group"
             style={undefined}
           >
             <li
-              className="c8"
+              className="c7"
             >
               <div
                 checked={false}
-                className="c9"
+                className="c8"
                 disabled={true}
                 id="bq"
                 onChange={[Function]}
@@ -2574,14 +2558,14 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
               >
                 <input
                   checked={false}
-                  className="c10"
+                  className="c9"
                   disabled={true}
                   id="br"
                   onChange={[Function]}
                   type="checkbox"
                 />
                 <label
-                  className="c11"
+                  className="c10"
                   htmlFor="br"
                 />
               </div>
@@ -2589,7 +2573,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
           </div>
         </th>
         <th
-          className="c12"
+          className="c11"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -2599,8 +2583,9 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
             Name 
           </span>
           <svg
-            className="c13"
+            className="c12"
             height="6"
+            innerRef={undefined}
             marginBottom="0.125rem"
             marginLeft="0.5625rem"
             style={
@@ -2620,7 +2605,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
           </svg>
         </th>
         <th
-          className="c14"
+          className="c13"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -2631,7 +2616,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
           </span>
         </th>
         <th
-          className="c15"
+          className="c14"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -2642,7 +2627,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
           </span>
         </th>
         <th
-          className="c16"
+          className="c15"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -2653,7 +2638,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
           </span>
         </th>
         <th
-          className="c17 c18"
+          className="c16 c17"
           disabled={undefined}
           name="th"
           selected={undefined}
@@ -2661,7 +2646,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
       </tr>
     </thead>
     <tbody
-      className="c19"
+      className="c18"
       disabled={undefined}
       name="tbody"
       selected={undefined}
@@ -2671,12 +2656,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
 `;
 
 exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] = `
-.c13 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
-.c10 {
+.c9 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -2685,60 +2665,78 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
   display: none;
 }
 
-.c10[type='checkbox'],
-.c10[type='radio'] {
+.c9[type='checkbox'],
+.c9[type='radio'] {
   box-sizing: border-box;
   padding: 0;
 }
 
-.c10[type='number']::-webkit-inner-spin-button,
-.c10[type='number']::-webkit-outer-spin-button {
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
   height: auto;
 }
 
-.c10[type='search'] {
+.c9[type='search'] {
   -webkit-appearance: textfield;
   -moz-appearance: textfield;
   appearance: textfield;
   outline-offset: -0.125rem;
 }
 
-.c10[type='search']::-webkit-search-cancel-button,
-.c10[type='search']::-webkit-search-decoration {
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
 }
 
-.c10::-webkit-file-upload-button {
+.c9::-webkit-file-upload-button {
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   font: inherit;
 }
 
-.c10:checked + label::after {
+.c9:checked + label::after {
   opacity: 1;
 }
 
-.c10:selected + label::after {
+.c9:selected + label::after {
   opacity: 1;
 }
 
-.c10:checked + label {
+.c9:checked + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:selected + label {
+.c9:selected + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:disabled + label {
+.c9:disabled + label {
   background-color: rgb(249,249,249);
   cursor: not-allowed;
 }
 
-.c11 {
+.c3 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c5 {
+  padding-top: 0.25rem;
+}
+
+.c16 {
+  padding: 0rem;
+}
+
+.c12 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c10 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -2756,7 +2754,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
   height: 1.125rem;
 }
 
-.c11::after {
+.c10::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -2773,7 +2771,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
   transform: rotate(-45deg);
 }
 
-.c9 {
+.c8 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -2782,7 +2780,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
   cursor: pointer;
 }
 
-.c8 {
+.c7 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -2794,11 +2792,11 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
   align-items: center;
 }
 
-.c8 label {
+.c7 label {
   font-weight: 400;
 }
 
-.c7 {
+.c6 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -2813,14 +2811,6 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
   -webkit-padding-after: 0;
 }
 
-.c6 {
-  padding-top: 0.25rem;
-}
-
-.c5 {
-  padding-top: 0.25rem;
-}
-
 .c0 {
   overflow: hidden;
   border-spacing: 0;
@@ -2843,11 +2833,11 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
   border-top-right-radius: 0.25rem;
 }
 
-.c19 {
+.c18 {
   width: 100%;
 }
 
-.c19 tr:first-child td {
+.c18 tr:first-child td {
   border-top: none;
 }
 
@@ -2877,7 +2867,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
   border-right-width: 0;
 }
 
-.c12 {
+.c11 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -2900,11 +2890,42 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
   font-weight: bold;
 }
 
-.c12:not(:first-child) {
+.c11:not(:first-child) {
   border-left-width: 0;
 }
 
-.c12:not(:last-child) {
+.c11:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c13 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 9.375rem;
+  display: table-cell;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c13:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c13:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -2917,8 +2938,8 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
   box-sizing: border-box;
   padding: 0 1.5rem;
   height: 3.75rem;
-  width: 9.375rem;
-  display: table-cell;
+  width: 0rem;
+  display: none;
   cursor: pointer;
   -webkit-user-select: none;
   -moz-user-select: none;
@@ -2970,38 +2991,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
   border-right-width: 0;
 }
 
-.c16 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c16:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c16:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c18 {
+.c17 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -3017,11 +3007,11 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
   font-weight: 500;
 }
 
-.c18:not(:first-child) {
+.c17:not(:first-child) {
   border-left-width: 0;
 }
 
-.c18:not(:last-child) {
+.c17:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -3045,24 +3035,15 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
   border-bottom-width: 0.0625rem;
 }
 
-.c3 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c17 {
-  padding: 0rem;
-}
-
 @media only screen and (min-width:47.9375rem) {
-  .c15 {
+  .c14 {
     width: 10rem;
     display: table-cell;
   }
 }
 
 @media only screen and (min-width:47.9375rem) {
-  .c16 {
+  .c15 {
     width: 8.125rem;
     display: table-cell;
   }
@@ -3091,16 +3072,16 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
           selected={undefined}
         >
           <div
-            className="c5 c6 c7"
+            className="c5 baseline-jVaZNU c5 c6"
             role="group"
             style={undefined}
           >
             <li
-              className="c8"
+              className="c7"
             >
               <div
                 checked={false}
-                className="c9"
+                className="c8"
                 disabled={false}
                 id="bw"
                 onChange={[Function]}
@@ -3108,14 +3089,14 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
               >
                 <input
                   checked={false}
-                  className="c10"
+                  className="c9"
                   disabled={false}
                   id="bx"
                   onChange={[Function]}
                   type="checkbox"
                 />
                 <label
-                  className="c11"
+                  className="c10"
                   htmlFor="bx"
                 />
               </div>
@@ -3123,7 +3104,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
           </div>
         </th>
         <th
-          className="c12"
+          className="c11"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -3133,8 +3114,9 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
             Name 
           </span>
           <svg
-            className="c13"
+            className="c12"
             height="6"
+            innerRef={undefined}
             marginBottom="0.125rem"
             marginLeft="0.5625rem"
             style={
@@ -3154,7 +3136,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
           </svg>
         </th>
         <th
-          className="c14"
+          className="c13"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -3165,7 +3147,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
           </span>
         </th>
         <th
-          className="c15"
+          className="c14"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -3176,7 +3158,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
           </span>
         </th>
         <th
-          className="c16"
+          className="c15"
           disabled={undefined}
           name="th"
           onClick={[Function]}
@@ -3187,7 +3169,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
           </span>
         </th>
         <th
-          className="c17 c18"
+          className="c16 c17"
           disabled={undefined}
           name="th"
           selected={undefined}
@@ -3195,7 +3177,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
       </tr>
     </thead>
     <tbody
-      className="c19"
+      className="c18"
       disabled={undefined}
       name="tbody"
       selected={undefined}
@@ -3209,32 +3191,12 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
 `;
 
 exports[`renders <Item /> without throwing 1`] = `
-.c13 {
+.c12 {
   background-color: transparent;
   text-decoration-skip: objects;
 }
 
-.c12 {
-  color: rgb(59,70,204);
-  -webkit-text-fill-color: currentcolor;
-}
-
-.c12:hover {
-  text-decoration: none;
-}
-
-.c14 {
-  width: 0.375rem;
-  height: 0.375rem;
-  border-radius: 50%;
-  background-color: rgb(0,152,88);
-  display: inline-block;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 0.6875rem;
-}
-
-.c10 {
+.c9 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -3243,60 +3205,96 @@ exports[`renders <Item /> without throwing 1`] = `
   display: none;
 }
 
-.c10[type='checkbox'],
-.c10[type='radio'] {
+.c9[type='checkbox'],
+.c9[type='radio'] {
   box-sizing: border-box;
   padding: 0;
 }
 
-.c10[type='number']::-webkit-inner-spin-button,
-.c10[type='number']::-webkit-outer-spin-button {
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
   height: auto;
 }
 
-.c10[type='search'] {
+.c9[type='search'] {
   -webkit-appearance: textfield;
   -moz-appearance: textfield;
   appearance: textfield;
   outline-offset: -0.125rem;
 }
 
-.c10[type='search']::-webkit-search-cancel-button,
-.c10[type='search']::-webkit-search-decoration {
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
 }
 
-.c10::-webkit-file-upload-button {
+.c9::-webkit-file-upload-button {
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   font: inherit;
 }
 
-.c10:checked + label::after {
+.c9:checked + label::after {
   opacity: 1;
 }
 
-.c10:selected + label::after {
+.c9:selected + label::after {
   opacity: 1;
 }
 
-.c10:checked + label {
+.c9:checked + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:selected + label {
+.c9:selected + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:disabled + label {
+.c9:disabled + label {
   background-color: rgb(249,249,249);
   cursor: not-allowed;
 }
 
 .c11 {
+  color: rgb(59,70,204);
+  -webkit-text-fill-color: currentcolor;
+}
+
+.c11:hover {
+  text-decoration: none;
+}
+
+.c3 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c5 {
+  padding-top: 0.25rem;
+}
+
+.c13 {
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 0.6875rem;
+}
+
+.c17 {
+  padding: 0rem;
+}
+
+.c14 {
+  width: 0.375rem;
+  height: 0.375rem;
+  border-radius: 50%;
+  background-color: rgb(0,152,88);
+  display: inline-block;
+}
+
+.c10 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -3314,7 +3312,7 @@ exports[`renders <Item /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c11::after {
+.c10::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -3331,7 +3329,7 @@ exports[`renders <Item /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c9 {
+.c8 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -3340,7 +3338,7 @@ exports[`renders <Item /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c8 {
+.c7 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -3352,11 +3350,11 @@ exports[`renders <Item /> without throwing 1`] = `
   align-items: center;
 }
 
-.c8 label {
+.c7 label {
   font-weight: 400;
 }
 
-.c7 {
+.c6 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -3371,14 +3369,6 @@ exports[`renders <Item /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c6 {
-  padding-top: 0.25rem;
-}
-
-.c5 {
-  padding-top: 0.25rem;
-}
-
 .c19 {
   cursor: pointer;
   height: 100%;
@@ -3521,15 +3511,6 @@ exports[`renders <Item /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c3 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c17 {
-  padding: 0rem;
-}
-
 @media only screen and (min-width:47.9375rem) {
   .c15 {
     width: 10rem;
@@ -3566,30 +3547,30 @@ exports[`renders <Item /> without throwing 1`] = `
         selected={undefined}
       >
         <div
-          className="c5 c6 c7"
+          className="c5 baseline-jVaZNU c5 c6"
           name=""
           role="group"
           style={undefined}
         >
           <li
-            className="c8"
+            className="c7"
           >
             <div
               checked={false}
-              className="c9"
+              className="c8"
               disabled={false}
               id="Y"
               type="checkbox"
             >
               <input
                 checked={false}
-                className="c10"
+                className="c9"
                 disabled={false}
                 id="Z"
                 type="checkbox"
               />
               <label
-                className="c11"
+                className="c10"
                 htmlFor="Z"
               />
             </div>
@@ -3603,7 +3584,7 @@ exports[`renders <Item /> without throwing 1`] = `
         selected={undefined}
       >
         <a
-          className="c12 c13"
+          className="c11 c12"
           to="/instances/undefined"
         />
       </td>
@@ -3615,7 +3596,7 @@ exports[`renders <Item /> without throwing 1`] = `
       >
         <span>
           <span
-            className="c14"
+            className="c13 c14"
             color="green"
             height="0.6875rem"
             width="0.6875rem"
@@ -3659,6 +3640,7 @@ exports[`renders <Item /> without throwing 1`] = `
           <svg
             className=""
             height="16"
+            innerRef={undefined}
             style={
               Object {
                 "transform": "rotate(0deg)",
@@ -3702,32 +3684,12 @@ exports[`renders <Item /> without throwing 1`] = `
 `;
 
 exports[`renders <Item {...item} /> without throwing 1`] = `
-.c13 {
+.c12 {
   background-color: transparent;
   text-decoration-skip: objects;
 }
 
-.c12 {
-  color: rgb(59,70,204);
-  -webkit-text-fill-color: currentcolor;
-}
-
-.c12:hover {
-  text-decoration: none;
-}
-
-.c14 {
-  width: 0.375rem;
-  height: 0.375rem;
-  border-radius: 50%;
-  background-color: rgb(59,70,204);
-  display: inline-block;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 0.6875rem;
-}
-
-.c10 {
+.c9 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -3736,60 +3698,96 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
   display: none;
 }
 
-.c10[type='checkbox'],
-.c10[type='radio'] {
+.c9[type='checkbox'],
+.c9[type='radio'] {
   box-sizing: border-box;
   padding: 0;
 }
 
-.c10[type='number']::-webkit-inner-spin-button,
-.c10[type='number']::-webkit-outer-spin-button {
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
   height: auto;
 }
 
-.c10[type='search'] {
+.c9[type='search'] {
   -webkit-appearance: textfield;
   -moz-appearance: textfield;
   appearance: textfield;
   outline-offset: -0.125rem;
 }
 
-.c10[type='search']::-webkit-search-cancel-button,
-.c10[type='search']::-webkit-search-decoration {
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
 }
 
-.c10::-webkit-file-upload-button {
+.c9::-webkit-file-upload-button {
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   font: inherit;
 }
 
-.c10:checked + label::after {
+.c9:checked + label::after {
   opacity: 1;
 }
 
-.c10:selected + label::after {
+.c9:selected + label::after {
   opacity: 1;
 }
 
-.c10:checked + label {
+.c9:checked + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:selected + label {
+.c9:selected + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:disabled + label {
+.c9:disabled + label {
   background-color: rgb(249,249,249);
   cursor: not-allowed;
 }
 
 .c11 {
+  color: rgb(59,70,204);
+  -webkit-text-fill-color: currentcolor;
+}
+
+.c11:hover {
+  text-decoration: none;
+}
+
+.c3 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c5 {
+  padding-top: 0.25rem;
+}
+
+.c13 {
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 0.6875rem;
+}
+
+.c17 {
+  padding: 0rem;
+}
+
+.c14 {
+  width: 0.375rem;
+  height: 0.375rem;
+  border-radius: 50%;
+  background-color: rgb(59,70,204);
+  display: inline-block;
+}
+
+.c10 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -3807,7 +3805,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c11::after {
+.c10::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -3824,7 +3822,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c9 {
+.c8 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -3833,7 +3831,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c8 {
+.c7 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -3845,11 +3843,11 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
   align-items: center;
 }
 
-.c8 label {
+.c7 label {
   font-weight: 400;
 }
 
-.c7 {
+.c6 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -3864,14 +3862,6 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c6 {
-  padding-top: 0.25rem;
-}
-
-.c5 {
-  padding-top: 0.25rem;
-}
-
 .c19 {
   cursor: pointer;
   height: 100%;
@@ -4014,15 +4004,6 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c3 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c17 {
-  padding: 0rem;
-}
-
 @media only screen and (min-width:47.9375rem) {
   .c15 {
     width: 10rem;
@@ -4059,30 +4040,30 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
         selected={undefined}
       >
         <div
-          className="c5 c6 c7"
+          className="c5 baseline-jVaZNU c5 c6"
           name="id"
           role="group"
           style={undefined}
         >
           <li
-            className="c8"
+            className="c7"
           >
             <div
               checked={false}
-              className="c9"
+              className="c8"
               disabled={false}
               id="be"
               type="checkbox"
             >
               <input
                 checked={false}
-                className="c10"
+                className="c9"
                 disabled={false}
                 id="bf"
                 type="checkbox"
               />
               <label
-                className="c11"
+                className="c10"
                 htmlFor="bf"
               />
             </div>
@@ -4096,7 +4077,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
         selected={undefined}
       >
         <a
-          className="c12 c13"
+          className="c11 c12"
           to="/instances/name"
         >
           name
@@ -4110,7 +4091,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
       >
         <span>
           <span
-            className="c14"
+            className="c13 c14"
             color="primary"
             height="0.6875rem"
             width="0.6875rem"
@@ -4154,6 +4135,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
           <svg
             className=""
             height="16"
+            innerRef={undefined}
             style={
               Object {
                 "transform": "rotate(0deg)",
@@ -4197,32 +4179,12 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
 `;
 
 exports[`renders <Item allowedActions /> without throwing 1`] = `
-.c13 {
+.c12 {
   background-color: transparent;
   text-decoration-skip: objects;
 }
 
-.c12 {
-  color: rgb(59,70,204);
-  -webkit-text-fill-color: currentcolor;
-}
-
-.c12:hover {
-  text-decoration: none;
-}
-
-.c14 {
-  width: 0.375rem;
-  height: 0.375rem;
-  border-radius: 50%;
-  background-color: rgb(0,152,88);
-  display: inline-block;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 0.6875rem;
-}
-
-.c10 {
+.c9 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -4231,60 +4193,96 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
   display: none;
 }
 
-.c10[type='checkbox'],
-.c10[type='radio'] {
+.c9[type='checkbox'],
+.c9[type='radio'] {
   box-sizing: border-box;
   padding: 0;
 }
 
-.c10[type='number']::-webkit-inner-spin-button,
-.c10[type='number']::-webkit-outer-spin-button {
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
   height: auto;
 }
 
-.c10[type='search'] {
+.c9[type='search'] {
   -webkit-appearance: textfield;
   -moz-appearance: textfield;
   appearance: textfield;
   outline-offset: -0.125rem;
 }
 
-.c10[type='search']::-webkit-search-cancel-button,
-.c10[type='search']::-webkit-search-decoration {
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
 }
 
-.c10::-webkit-file-upload-button {
+.c9::-webkit-file-upload-button {
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   font: inherit;
 }
 
-.c10:checked + label::after {
+.c9:checked + label::after {
   opacity: 1;
 }
 
-.c10:selected + label::after {
+.c9:selected + label::after {
   opacity: 1;
 }
 
-.c10:checked + label {
+.c9:checked + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:selected + label {
+.c9:selected + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:disabled + label {
+.c9:disabled + label {
   background-color: rgb(249,249,249);
   cursor: not-allowed;
 }
 
 .c11 {
+  color: rgb(59,70,204);
+  -webkit-text-fill-color: currentcolor;
+}
+
+.c11:hover {
+  text-decoration: none;
+}
+
+.c3 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c5 {
+  padding-top: 0.25rem;
+}
+
+.c13 {
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 0.6875rem;
+}
+
+.c17 {
+  padding: 0rem;
+}
+
+.c14 {
+  width: 0.375rem;
+  height: 0.375rem;
+  border-radius: 50%;
+  background-color: rgb(0,152,88);
+  display: inline-block;
+}
+
+.c10 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -4302,7 +4300,7 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c11::after {
+.c10::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -4319,7 +4317,7 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c9 {
+.c8 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -4328,7 +4326,7 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c8 {
+.c7 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -4340,11 +4338,11 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
   align-items: center;
 }
 
-.c8 label {
+.c7 label {
   font-weight: 400;
 }
 
-.c7 {
+.c6 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -4359,14 +4357,6 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c6 {
-  padding-top: 0.25rem;
-}
-
-.c5 {
-  padding-top: 0.25rem;
-}
-
 .c19 {
   cursor: pointer;
   height: 100%;
@@ -4509,15 +4499,6 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c3 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c17 {
-  padding: 0rem;
-}
-
 @media only screen and (min-width:47.9375rem) {
   .c15 {
     width: 10rem;
@@ -4554,30 +4535,30 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
         selected={undefined}
       >
         <div
-          className="c5 c6 c7"
+          className="c5 baseline-jVaZNU c5 c6"
           name=""
           role="group"
           style={undefined}
         >
           <li
-            className="c8"
+            className="c7"
           >
             <div
               checked={false}
-              className="c9"
+              className="c8"
               disabled={false}
               id="bc"
               type="checkbox"
             >
               <input
                 checked={false}
-                className="c10"
+                className="c9"
                 disabled={false}
                 id="bd"
                 type="checkbox"
               />
               <label
-                className="c11"
+                className="c10"
                 htmlFor="bd"
               />
             </div>
@@ -4591,7 +4572,7 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
         selected={undefined}
       >
         <a
-          className="c12 c13"
+          className="c11 c12"
           to="/instances/undefined"
         />
       </td>
@@ -4603,7 +4584,7 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
       >
         <span>
           <span
-            className="c14"
+            className="c13 c14"
             color="green"
             height="0.6875rem"
             width="0.6875rem"
@@ -4647,6 +4628,7 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
           <svg
             className=""
             height="16"
+            innerRef={undefined}
             style={
               Object {
                 "transform": "rotate(0deg)",
@@ -4690,28 +4672,103 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
 `;
 
 exports[`renders <Item mutating /> without throwing 1`] = `
-.c13 {
+.c12 {
   background-color: transparent;
   text-decoration-skip: objects;
 }
 
-.c12 {
+.c9 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c9[type='checkbox'],
+.c9[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c9[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c9::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c9:checked + label::after {
+  opacity: 1;
+}
+
+.c9:selected + label::after {
+  opacity: 1;
+}
+
+.c9:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
+.c11 {
   color: rgb(59,70,204);
   -webkit-text-fill-color: currentcolor;
 }
 
-.c12:hover {
+.c11:hover {
   text-decoration: none;
 }
 
-.c15 {
+.c3 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c5 {
+  padding-top: 0.25rem;
+}
+
+.c19 {
+  padding: 0rem;
+}
+
+.c14 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
   animation: iCqDak 1.5s ease-out 0s infinite;
 }
 
-.c16 {
+.c15 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@@ -4720,7 +4777,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
   animation-delay: 0.5s;
 }
 
-.c17 {
+.c16 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@@ -4729,7 +4786,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
   animation-delay: 1s;
 }
 
-.c14 {
+.c13 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -4758,68 +4815,6 @@ exports[`renders <Item mutating /> without throwing 1`] = `
 }
 
 .c10 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c10[type='checkbox'],
-.c10[type='radio'] {
-  box-sizing: border-box;
-  padding: 0;
-}
-
-.c10[type='number']::-webkit-inner-spin-button,
-.c10[type='number']::-webkit-outer-spin-button {
-  height: auto;
-}
-
-.c10[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
-}
-
-.c10[type='search']::-webkit-search-cancel-button,
-.c10[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c10::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c10:checked + label::after {
-  opacity: 1;
-}
-
-.c10:selected + label::after {
-  opacity: 1;
-}
-
-.c10:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c10:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c10:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
-}
-
-.c11 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -4837,7 +4832,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c11::after {
+.c10::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -4854,7 +4849,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c9 {
+.c8 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -4863,7 +4858,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c8 {
+.c7 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -4875,11 +4870,11 @@ exports[`renders <Item mutating /> without throwing 1`] = `
   align-items: center;
 }
 
-.c8 label {
+.c7 label {
   font-weight: 400;
 }
 
-.c7 {
+.c6 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -4894,14 +4889,6 @@ exports[`renders <Item mutating /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c6 {
-  padding-top: 0.25rem;
-}
-
-.c5 {
-  padding-top: 0.25rem;
-}
-
 .c0 {
   overflow: hidden;
   border-spacing: 0;
@@ -4941,6 +4928,30 @@ exports[`renders <Item mutating /> without throwing 1`] = `
   border-right-width: 0;
 }
 
+.c17 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 0rem;
+  display: none;
+  vertical-align: middle;
+  text-align: left;
+  border-bottom-width: 0;
+}
+
+.c17:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c17:not(:last-child) {
+  border-right-width: 0;
+}
+
 .c18 {
   border-width: 0.0625rem;
   border-style: solid;
@@ -4965,31 +4976,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c19 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  vertical-align: middle;
-  text-align: left;
-  border-bottom-width: 0;
-}
-
-.c19:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c19:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c21 {
+.c20 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -5004,11 +4991,11 @@ exports[`renders <Item mutating /> without throwing 1`] = `
   border-left-width: 0.0625rem !important;
 }
 
-.c21:not(:first-child) {
+.c20:not(:first-child) {
   border-left-width: 0;
 }
 
-.c21:not(:last-child) {
+.c20:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -5028,24 +5015,15 @@ exports[`renders <Item mutating /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c3 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c20 {
-  padding: 0rem;
-}
-
 @media only screen and (min-width:47.9375rem) {
-  .c18 {
+  .c17 {
     width: 10rem;
     display: table-cell;
   }
 }
 
 @media only screen and (min-width:47.9375rem) {
-  .c19 {
+  .c18 {
     width: 8.125rem;
     display: table-cell;
   }
@@ -5073,30 +5051,30 @@ exports[`renders <Item mutating /> without throwing 1`] = `
         selected={undefined}
       >
         <div
-          className="c5 c6 c7"
+          className="c5 baseline-jVaZNU c5 c6"
           name=""
           role="group"
           style={undefined}
         >
           <li
-            className="c8"
+            className="c7"
           >
             <div
               checked={false}
-              className="c9"
+              className="c8"
               disabled={false}
               id="a"
               type="checkbox"
             >
               <input
                 checked={false}
-                className="c10"
+                className="c9"
                 disabled={false}
                 id="bb"
                 type="checkbox"
               />
               <label
-                className="c11"
+                className="c10"
                 htmlFor="bb"
               />
             </div>
@@ -5110,7 +5088,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
         selected={undefined}
       >
         <a
-          className="c12 c13"
+          className="c11 c12"
           to="/instances/undefined"
         />
       </td>
@@ -5121,28 +5099,28 @@ exports[`renders <Item mutating /> without throwing 1`] = `
         selected={undefined}
       >
         <div
-          className="c14"
+          className="c13"
         >
           <svg
             height="10"
             width="28"
           >
             <rect
-              className="c15"
+              className="c14"
               height="6"
               width="6"
               x="2"
               y="2"
             />
             <rect
-              className="c16"
+              className="c15"
               height="6"
               width="6"
               x="11"
               y="2"
             />
             <rect
-              className="c17"
+              className="c16"
               height="6"
               width="6"
               x="20"
@@ -5152,7 +5130,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
         </div>
       </td>
       <td
-        className="c18"
+        className="c17"
         disabled={undefined}
         name="td"
         selected={undefined}
@@ -5160,7 +5138,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
         almost NaN years
       </td>
       <td
-        className="c19"
+        className="c18"
         disabled={undefined}
         name="td"
         selected={undefined}
@@ -5170,7 +5148,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
         </code>
       </td>
       <td
-        className="c20 c21"
+        className="c19 c20"
         disabled={undefined}
         name="td"
         selected={undefined}
@@ -5178,6 +5156,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
         <svg
           className=""
           height="16"
+          innerRef={undefined}
           style={
             Object {
               "transform": "rotate(0deg)",
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/metadata.spec.js.snap b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/metadata.spec.js.snap
index fd19bf5c..0cd98df7 100644
--- a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/metadata.spec.js.snap
+++ b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/metadata.spec.js.snap
@@ -98,6 +98,18 @@ exports[`renders <AddForm /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c15 {
+  position: relative;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  width: 100%;
+}
+
 .c19 {
   display: inline-block;
 }
@@ -405,6 +417,32 @@ exports[`renders <AddForm /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c5 {
   color: rgba(73,73,73,1);
   font-weight: 600;
@@ -463,50 +501,6 @@ exports[`renders <AddForm /> without throwing 1`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c6 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c6 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c6 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c1 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -605,6 +599,50 @@ exports[`renders <AddForm /> without throwing 1`] = `
   color: inherit;
 }
 
+.c6 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c6 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c6 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
 .c10 {
   display: inline-block;
   margin: 0;
@@ -748,44 +786,6 @@ exports[`renders <AddForm /> without throwing 1`] = `
   outline: 0;
 }
 
-.c15 {
-  position: relative;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  width: 100%;
-}
-
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c2 {
   word-wrap: break-word;
   overflow-wrap: break-word;
@@ -871,7 +871,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
             className="c9"
           >
             <div
-              className="c10"
+              className="baseline-jVaZNU kXgQxt c10"
               name="name"
               role="group"
               style={undefined}
@@ -905,7 +905,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
             className="c9"
           >
             <div
-              className="c10"
+              className="baseline-jVaZNU kXgQxt c10"
               name="value"
               role="group"
               style={undefined}
@@ -974,6 +974,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
               <svg
                 className=""
                 height="12"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -1127,6 +1128,18 @@ exports[`renders <EditForm /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c15 {
+  position: relative;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  width: 100%;
+}
+
 .c20 {
   display: inline-block;
 }
@@ -1434,6 +1447,32 @@ exports[`renders <EditForm /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c14 {
   background-color: rgb(216,216,216);
   margin: 0;
@@ -1758,44 +1797,6 @@ exports[`renders <EditForm /> without throwing 1`] = `
   outline: 0;
 }
 
-.c15 {
-  position: relative;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  width: 100%;
-}
-
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c5 {
   word-break: break-all;
   line-height: 1.5;
@@ -1902,7 +1903,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
             className="c9"
           >
             <div
-              className="c10"
+              className="baseline-jVaZNU kXgQxt c10"
               name="name"
               role="group"
               style={undefined}
@@ -1936,7 +1937,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
             className="c9"
           >
             <div
-              className="c10"
+              className="baseline-jVaZNU kXgQxt c10"
               name="value"
               role="group"
               style={undefined}
@@ -2005,6 +2006,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
               <svg
                 className=""
                 height="12"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/snapshots.spec.js.snap b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/snapshots.spec.js.snap
index a454e591..c7b19b43 100644
--- a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/snapshots.spec.js.snap
+++ b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/snapshots.spec.js.snap
@@ -1,12 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders <Actions /> without throwing 1`] = `
-.c13 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
-.c10 {
+.c9 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -15,60 +10,78 @@ exports[`renders <Actions /> without throwing 1`] = `
   display: none;
 }
 
-.c10[type='checkbox'],
-.c10[type='radio'] {
+.c9[type='checkbox'],
+.c9[type='radio'] {
   box-sizing: border-box;
   padding: 0;
 }
 
-.c10[type='number']::-webkit-inner-spin-button,
-.c10[type='number']::-webkit-outer-spin-button {
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
   height: auto;
 }
 
-.c10[type='search'] {
+.c9[type='search'] {
   -webkit-appearance: textfield;
   -moz-appearance: textfield;
   appearance: textfield;
   outline-offset: -0.125rem;
 }
 
-.c10[type='search']::-webkit-search-cancel-button,
-.c10[type='search']::-webkit-search-decoration {
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
 }
 
-.c10::-webkit-file-upload-button {
+.c9::-webkit-file-upload-button {
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   font: inherit;
 }
 
-.c10:checked + label::after {
+.c9:checked + label::after {
   opacity: 1;
 }
 
-.c10:selected + label::after {
+.c9:selected + label::after {
   opacity: 1;
 }
 
-.c10:checked + label {
+.c9:checked + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:selected + label {
+.c9:selected + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:disabled + label {
+.c9:disabled + label {
   background-color: rgb(249,249,249);
   cursor: not-allowed;
 }
 
-.c11 {
+.c3 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c5 {
+  padding-top: 0.25rem;
+}
+
+.c15 {
+  padding: 0rem;
+}
+
+.c12 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c10 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -86,7 +99,7 @@ exports[`renders <Actions /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c11::after {
+.c10::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -103,7 +116,7 @@ exports[`renders <Actions /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c9 {
+.c8 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -112,7 +125,7 @@ exports[`renders <Actions /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c8 {
+.c7 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -124,11 +137,11 @@ exports[`renders <Actions /> without throwing 1`] = `
   align-items: center;
 }
 
-.c8 label {
+.c7 label {
   font-weight: 400;
 }
 
-.c7 {
+.c6 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -143,14 +156,6 @@ exports[`renders <Actions /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c6 {
-  padding-top: 0.25rem;
-}
-
-.c5 {
-  padding-top: 0.25rem;
-}
-
 .c0 {
   overflow: hidden;
   border-spacing: 0;
@@ -173,11 +178,11 @@ exports[`renders <Actions /> without throwing 1`] = `
   border-top-right-radius: 0.25rem;
 }
 
-.c18 {
+.c17 {
   width: 100%;
 }
 
-.c18 tr:first-child td {
+.c17 tr:first-child td {
   border-top: none;
 }
 
@@ -207,7 +212,7 @@ exports[`renders <Actions /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c12 {
+.c11 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -230,15 +235,15 @@ exports[`renders <Actions /> without throwing 1`] = `
   font-weight: bold;
 }
 
-.c12:not(:first-child) {
+.c11:not(:first-child) {
   border-left-width: 0;
 }
 
-.c12:not(:last-child) {
+.c11:not(:last-child) {
   border-right-width: 0;
 }
 
-.c14 {
+.c13 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -261,15 +266,15 @@ exports[`renders <Actions /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c14:not(:first-child) {
+.c13:not(:first-child) {
   border-left-width: 0;
 }
 
-.c14:not(:last-child) {
+.c13:not(:last-child) {
   border-right-width: 0;
 }
 
-.c15 {
+.c14 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -292,15 +297,15 @@ exports[`renders <Actions /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c15:not(:first-child) {
+.c14:not(:first-child) {
   border-left-width: 0;
 }
 
-.c15:not(:last-child) {
+.c14:not(:last-child) {
   border-right-width: 0;
 }
 
-.c17 {
+.c16 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -316,11 +321,11 @@ exports[`renders <Actions /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c17:not(:first-child) {
+.c16:not(:first-child) {
   border-left-width: 0;
 }
 
-.c17:not(:last-child) {
+.c16:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -344,17 +349,8 @@ exports[`renders <Actions /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c3 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c16 {
-  padding: 0rem;
-}
-
 @media only screen and (min-width:47.9375rem) {
-  .c15 {
+  .c14 {
     width: 10rem;
     display: table-cell;
   }
@@ -382,16 +378,16 @@ exports[`renders <Actions /> without throwing 1`] = `
         selected={undefined}
       >
         <div
-          className="c5 c6 c7"
+          className="c5 baseline-jVaZNU c5 c6"
           role="group"
           style={undefined}
         >
           <li
-            className="c8"
+            className="c7"
           >
             <div
               checked={false}
-              className="c9"
+              className="c8"
               disabled={false}
               id="bh"
               onChange={[Function]}
@@ -399,14 +395,14 @@ exports[`renders <Actions /> without throwing 1`] = `
             >
               <input
                 checked={false}
-                className="c10"
+                className="c9"
                 disabled={false}
                 id="bi"
                 onChange={[Function]}
                 type="checkbox"
               />
               <label
-                className="c11"
+                className="c10"
                 htmlFor="bi"
               />
             </div>
@@ -414,7 +410,7 @@ exports[`renders <Actions /> without throwing 1`] = `
         </div>
       </th>
       <th
-        className="c12"
+        className="c11"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -424,8 +420,9 @@ exports[`renders <Actions /> without throwing 1`] = `
           Name 
         </span>
         <svg
-          className="c13"
+          className="c12"
           height="6"
+          innerRef={undefined}
           marginBottom="0.125rem"
           marginLeft="0.5625rem"
           style={
@@ -445,7 +442,7 @@ exports[`renders <Actions /> without throwing 1`] = `
         </svg>
       </th>
       <th
-        className="c14"
+        className="c13"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -456,7 +453,7 @@ exports[`renders <Actions /> without throwing 1`] = `
         </span>
       </th>
       <th
-        className="c15"
+        className="c14"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -467,7 +464,7 @@ exports[`renders <Actions /> without throwing 1`] = `
         </span>
       </th>
       <th
-        className="c15"
+        className="c14"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -478,7 +475,7 @@ exports[`renders <Actions /> without throwing 1`] = `
         </span>
       </th>
       <th
-        className="c16 c17"
+        className="c15 c16"
         disabled={undefined}
         name="th"
         selected={undefined}
@@ -486,7 +483,7 @@ exports[`renders <Actions /> without throwing 1`] = `
     </tr>
   </thead>
   <tbody
-    className="c18"
+    className="c17"
     disabled={undefined}
     name="tbody"
     selected={undefined}
@@ -495,17 +492,7 @@ exports[`renders <Actions /> without throwing 1`] = `
 `;
 
 exports[`renders <Item /> without throwing 1`] = `
-.c10 {
-  width: 0.375rem;
-  height: 0.375rem;
-  border-radius: 50%;
-  display: inline-block;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 0.6875rem;
-}
-
-.c8 {
+.c7 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -514,60 +501,86 @@ exports[`renders <Item /> without throwing 1`] = `
   display: none;
 }
 
-.c8[type='checkbox'],
-.c8[type='radio'] {
+.c7[type='checkbox'],
+.c7[type='radio'] {
   box-sizing: border-box;
   padding: 0;
 }
 
-.c8[type='number']::-webkit-inner-spin-button,
-.c8[type='number']::-webkit-outer-spin-button {
+.c7[type='number']::-webkit-inner-spin-button,
+.c7[type='number']::-webkit-outer-spin-button {
   height: auto;
 }
 
-.c8[type='search'] {
+.c7[type='search'] {
   -webkit-appearance: textfield;
   -moz-appearance: textfield;
   appearance: textfield;
   outline-offset: -0.125rem;
 }
 
-.c8[type='search']::-webkit-search-cancel-button,
-.c8[type='search']::-webkit-search-decoration {
+.c7[type='search']::-webkit-search-cancel-button,
+.c7[type='search']::-webkit-search-decoration {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
 }
 
-.c8::-webkit-file-upload-button {
+.c7::-webkit-file-upload-button {
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   font: inherit;
 }
 
-.c8:checked + label::after {
+.c7:checked + label::after {
   opacity: 1;
 }
 
-.c8:selected + label::after {
+.c7:selected + label::after {
   opacity: 1;
 }
 
-.c8:checked + label {
+.c7:checked + label {
   border-color: rgb(59,70,204);
 }
 
-.c8:selected + label {
+.c7:selected + label {
   border-color: rgb(59,70,204);
 }
 
-.c8:disabled + label {
+.c7:disabled + label {
   background-color: rgb(249,249,249);
   cursor: not-allowed;
 }
 
+.c1 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c3 {
+  padding-top: 0.25rem;
+}
+
 .c9 {
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 0.6875rem;
+}
+
+.c12 {
+  padding: 0rem;
+}
+
+.c10 {
+  width: 0.375rem;
+  height: 0.375rem;
+  border-radius: 50%;
+  display: inline-block;
+}
+
+.c8 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -585,7 +598,7 @@ exports[`renders <Item /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c9::after {
+.c8::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -602,7 +615,7 @@ exports[`renders <Item /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c7 {
+.c6 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -611,7 +624,7 @@ exports[`renders <Item /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c6 {
+.c5 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -623,11 +636,11 @@ exports[`renders <Item /> without throwing 1`] = `
   align-items: center;
 }
 
-.c6 label {
+.c5 label {
   font-weight: 400;
 }
 
-.c5 {
+.c4 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -642,14 +655,6 @@ exports[`renders <Item /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c4 {
-  padding-top: 0.25rem;
-}
-
-.c3 {
-  padding-top: 0.25rem;
-}
-
 .c14 {
   cursor: pointer;
   height: 100%;
@@ -751,15 +756,6 @@ exports[`renders <Item /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c1 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c12 {
-  padding: 0rem;
-}
-
 @media only screen and (min-width:47.9375rem) {
   .c11 {
     width: 10rem;
@@ -780,30 +776,30 @@ exports[`renders <Item /> without throwing 1`] = `
     selected={undefined}
   >
     <div
-      className="c3 c4 c5"
+      className="c3 baseline-jVaZNU c3 c4"
       name={undefined}
       role="group"
       style={undefined}
     >
       <li
-        className="c6"
+        className="c5"
       >
         <div
           checked={false}
-          className="c7"
+          className="c6"
           disabled={false}
           id="Z"
           type="checkbox"
         >
           <input
             checked={false}
-            className="c8"
+            className="c7"
             disabled={false}
             id="a"
             type="checkbox"
           />
           <label
-            className="c9"
+            className="c8"
             htmlFor="a"
           />
         </div>
@@ -823,7 +819,7 @@ exports[`renders <Item /> without throwing 1`] = `
     selected={undefined}
   >
     <span
-      className="c10"
+      className="c9 c10"
       color={undefined}
       height="0.6875rem"
       width="0.6875rem"
@@ -864,6 +860,7 @@ exports[`renders <Item /> without throwing 1`] = `
       <svg
         className=""
         height="16"
+        innerRef={undefined}
         style={
           Object {
             "transform": "rotate(0deg)",
@@ -905,17 +902,7 @@ exports[`renders <Item /> without throwing 1`] = `
 `;
 
 exports[`renders <Item {...item} /> without throwing 1`] = `
-.c10 {
-  width: 0.375rem;
-  height: 0.375rem;
-  border-radius: 50%;
-  display: inline-block;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 0.6875rem;
-}
-
-.c8 {
+.c7 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -924,60 +911,86 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
   display: none;
 }
 
-.c8[type='checkbox'],
-.c8[type='radio'] {
+.c7[type='checkbox'],
+.c7[type='radio'] {
   box-sizing: border-box;
   padding: 0;
 }
 
-.c8[type='number']::-webkit-inner-spin-button,
-.c8[type='number']::-webkit-outer-spin-button {
+.c7[type='number']::-webkit-inner-spin-button,
+.c7[type='number']::-webkit-outer-spin-button {
   height: auto;
 }
 
-.c8[type='search'] {
+.c7[type='search'] {
   -webkit-appearance: textfield;
   -moz-appearance: textfield;
   appearance: textfield;
   outline-offset: -0.125rem;
 }
 
-.c8[type='search']::-webkit-search-cancel-button,
-.c8[type='search']::-webkit-search-decoration {
+.c7[type='search']::-webkit-search-cancel-button,
+.c7[type='search']::-webkit-search-decoration {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
 }
 
-.c8::-webkit-file-upload-button {
+.c7::-webkit-file-upload-button {
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   font: inherit;
 }
 
-.c8:checked + label::after {
+.c7:checked + label::after {
   opacity: 1;
 }
 
-.c8:selected + label::after {
+.c7:selected + label::after {
   opacity: 1;
 }
 
-.c8:checked + label {
+.c7:checked + label {
   border-color: rgb(59,70,204);
 }
 
-.c8:selected + label {
+.c7:selected + label {
   border-color: rgb(59,70,204);
 }
 
-.c8:disabled + label {
+.c7:disabled + label {
   background-color: rgb(249,249,249);
   cursor: not-allowed;
 }
 
+.c1 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c3 {
+  padding-top: 0.25rem;
+}
+
 .c9 {
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 0.6875rem;
+}
+
+.c12 {
+  padding: 0rem;
+}
+
+.c10 {
+  width: 0.375rem;
+  height: 0.375rem;
+  border-radius: 50%;
+  display: inline-block;
+}
+
+.c8 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -995,7 +1008,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c9::after {
+.c8::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -1012,7 +1025,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c7 {
+.c6 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -1021,7 +1034,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c6 {
+.c5 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1033,11 +1046,11 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
   align-items: center;
 }
 
-.c6 label {
+.c5 label {
   font-weight: 400;
 }
 
-.c5 {
+.c4 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -1052,14 +1065,6 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c4 {
-  padding-top: 0.25rem;
-}
-
-.c3 {
-  padding-top: 0.25rem;
-}
-
 .c14 {
   cursor: pointer;
   height: 100%;
@@ -1161,15 +1166,6 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c1 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c12 {
-  padding: 0rem;
-}
-
 @media only screen and (min-width:47.9375rem) {
   .c11 {
     width: 10rem;
@@ -1190,30 +1186,30 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
     selected={undefined}
   >
     <div
-      className="c3 c4 c5"
+      className="c3 baseline-jVaZNU c3 c4"
       name="name"
       role="group"
       style={undefined}
     >
       <li
-        className="c6"
+        className="c5"
       >
         <div
           checked={false}
-          className="c7"
+          className="c6"
           disabled={false}
           id="bb"
           type="checkbox"
         >
           <input
             checked={false}
-            className="c8"
+            className="c7"
             disabled={false}
             id="bc"
             type="checkbox"
           />
           <label
-            className="c9"
+            className="c8"
             htmlFor="bc"
           />
         </div>
@@ -1235,7 +1231,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
     selected={undefined}
   >
     <span
-      className="c10"
+      className="c9 c10"
       color={undefined}
       height="0.6875rem"
       width="0.6875rem"
@@ -1276,6 +1272,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
       <svg
         className=""
         height="16"
+        innerRef={undefined}
         style={
           Object {
             "transform": "rotate(0deg)",
@@ -1342,34 +1339,6 @@ exports[`renders <Item mutating /> without throwing 1`] = `
   animation-delay: 1s;
 }
 
-.c4 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-content: center;
-  -ms-flex-line-pack: center;
-  align-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 1.25rem;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-}
-
 .c8 {
   color: rgba(73,73,73,1);
   line-height: 1.5rem;
@@ -1399,6 +1368,34 @@ exports[`renders <Item mutating /> without throwing 1`] = `
   padding-bottom: 2.25rem;
 }
 
+.c4 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-content: center;
+  -ms-flex-line-pack: center;
+  align-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 1.25rem;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+}
+
 .c0 {
   overflow: hidden;
   border-spacing: 0;
@@ -1516,12 +1513,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
 `;
 
 exports[`renders <SnapshotList /> without throwing 1`] = `
-.c13 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
-.c10 {
+.c9 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -1530,60 +1522,78 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
   display: none;
 }
 
-.c10[type='checkbox'],
-.c10[type='radio'] {
+.c9[type='checkbox'],
+.c9[type='radio'] {
   box-sizing: border-box;
   padding: 0;
 }
 
-.c10[type='number']::-webkit-inner-spin-button,
-.c10[type='number']::-webkit-outer-spin-button {
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
   height: auto;
 }
 
-.c10[type='search'] {
+.c9[type='search'] {
   -webkit-appearance: textfield;
   -moz-appearance: textfield;
   appearance: textfield;
   outline-offset: -0.125rem;
 }
 
-.c10[type='search']::-webkit-search-cancel-button,
-.c10[type='search']::-webkit-search-decoration {
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
 }
 
-.c10::-webkit-file-upload-button {
+.c9::-webkit-file-upload-button {
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   font: inherit;
 }
 
-.c10:checked + label::after {
+.c9:checked + label::after {
   opacity: 1;
 }
 
-.c10:selected + label::after {
+.c9:selected + label::after {
   opacity: 1;
 }
 
-.c10:checked + label {
+.c9:checked + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:selected + label {
+.c9:selected + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:disabled + label {
+.c9:disabled + label {
   background-color: rgb(249,249,249);
   cursor: not-allowed;
 }
 
-.c11 {
+.c3 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c5 {
+  padding-top: 0.25rem;
+}
+
+.c15 {
+  padding: 0rem;
+}
+
+.c12 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c10 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -1601,7 +1611,7 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c11::after {
+.c10::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -1618,7 +1628,7 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c9 {
+.c8 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -1627,7 +1637,7 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c8 {
+.c7 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1639,11 +1649,11 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
   align-items: center;
 }
 
-.c8 label {
+.c7 label {
   font-weight: 400;
 }
 
-.c7 {
+.c6 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -1658,14 +1668,6 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c6 {
-  padding-top: 0.25rem;
-}
-
-.c5 {
-  padding-top: 0.25rem;
-}
-
 .c0 {
   overflow: hidden;
   border-spacing: 0;
@@ -1688,11 +1690,11 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
   border-top-right-radius: 0.25rem;
 }
 
-.c18 {
+.c17 {
   width: 100%;
 }
 
-.c18 tr:first-child td {
+.c17 tr:first-child td {
   border-top: none;
 }
 
@@ -1722,7 +1724,7 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c12 {
+.c11 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -1745,15 +1747,15 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
   font-weight: bold;
 }
 
-.c12:not(:first-child) {
+.c11:not(:first-child) {
   border-left-width: 0;
 }
 
-.c12:not(:last-child) {
+.c11:not(:last-child) {
   border-right-width: 0;
 }
 
-.c14 {
+.c13 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -1776,15 +1778,15 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c14:not(:first-child) {
+.c13:not(:first-child) {
   border-left-width: 0;
 }
 
-.c14:not(:last-child) {
+.c13:not(:last-child) {
   border-right-width: 0;
 }
 
-.c15 {
+.c14 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -1807,15 +1809,15 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c15:not(:first-child) {
+.c14:not(:first-child) {
   border-left-width: 0;
 }
 
-.c15:not(:last-child) {
+.c14:not(:last-child) {
   border-right-width: 0;
 }
 
-.c17 {
+.c16 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -1831,11 +1833,11 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c17:not(:first-child) {
+.c16:not(:first-child) {
   border-left-width: 0;
 }
 
-.c17:not(:last-child) {
+.c16:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -1859,17 +1861,8 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c3 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c16 {
-  padding: 0rem;
-}
-
 @media only screen and (min-width:47.9375rem) {
-  .c15 {
+  .c14 {
     width: 10rem;
     display: table-cell;
   }
@@ -1897,16 +1890,16 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
         selected={undefined}
       >
         <div
-          className="c5 c6 c7"
+          className="c5 baseline-jVaZNU c5 c6"
           role="group"
           style={undefined}
         >
           <li
-            className="c8"
+            className="c7"
           >
             <div
               checked={false}
-              className="c9"
+              className="c8"
               disabled={false}
               id="be"
               onChange={[Function]}
@@ -1914,14 +1907,14 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
             >
               <input
                 checked={false}
-                className="c10"
+                className="c9"
                 disabled={false}
                 id="bf"
                 onChange={[Function]}
                 type="checkbox"
               />
               <label
-                className="c11"
+                className="c10"
                 htmlFor="bf"
               />
             </div>
@@ -1929,7 +1922,7 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
         </div>
       </th>
       <th
-        className="c12"
+        className="c11"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -1939,8 +1932,9 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
           Name 
         </span>
         <svg
-          className="c13"
+          className="c12"
           height="6"
+          innerRef={undefined}
           marginBottom="0.125rem"
           marginLeft="0.5625rem"
           style={
@@ -1960,7 +1954,7 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
         </svg>
       </th>
       <th
-        className="c14"
+        className="c13"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -1971,7 +1965,7 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
         </span>
       </th>
       <th
-        className="c15"
+        className="c14"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -1982,7 +1976,7 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
         </span>
       </th>
       <th
-        className="c15"
+        className="c14"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -1993,7 +1987,7 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
         </span>
       </th>
       <th
-        className="c16 c17"
+        className="c15 c16"
         disabled={undefined}
         name="th"
         selected={undefined}
@@ -2001,7 +1995,7 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
     </tr>
   </thead>
   <tbody
-    className="c18"
+    className="c17"
     disabled={undefined}
     name="tbody"
     selected={undefined}
@@ -2010,12 +2004,7 @@ exports[`renders <SnapshotList /> without throwing 1`] = `
 `;
 
 exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
-.c13 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
-.c10 {
+.c9 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -2024,60 +2013,78 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
   display: none;
 }
 
-.c10[type='checkbox'],
-.c10[type='radio'] {
+.c9[type='checkbox'],
+.c9[type='radio'] {
   box-sizing: border-box;
   padding: 0;
 }
 
-.c10[type='number']::-webkit-inner-spin-button,
-.c10[type='number']::-webkit-outer-spin-button {
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
   height: auto;
 }
 
-.c10[type='search'] {
+.c9[type='search'] {
   -webkit-appearance: textfield;
   -moz-appearance: textfield;
   appearance: textfield;
   outline-offset: -0.125rem;
 }
 
-.c10[type='search']::-webkit-search-cancel-button,
-.c10[type='search']::-webkit-search-decoration {
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
 }
 
-.c10::-webkit-file-upload-button {
+.c9::-webkit-file-upload-button {
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   font: inherit;
 }
 
-.c10:checked + label::after {
+.c9:checked + label::after {
   opacity: 1;
 }
 
-.c10:selected + label::after {
+.c9:selected + label::after {
   opacity: 1;
 }
 
-.c10:checked + label {
+.c9:checked + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:selected + label {
+.c9:selected + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:disabled + label {
+.c9:disabled + label {
   background-color: rgb(249,249,249);
   cursor: not-allowed;
 }
 
-.c11 {
+.c3 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c5 {
+  padding-top: 0.25rem;
+}
+
+.c15 {
+  padding: 0rem;
+}
+
+.c12 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c10 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -2095,7 +2102,7 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c11::after {
+.c10::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -2112,7 +2119,7 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c9 {
+.c8 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -2121,7 +2128,7 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c8 {
+.c7 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -2133,11 +2140,11 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
   align-items: center;
 }
 
-.c8 label {
+.c7 label {
   font-weight: 400;
 }
 
-.c7 {
+.c6 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -2152,14 +2159,6 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c6 {
-  padding-top: 0.25rem;
-}
-
-.c5 {
-  padding-top: 0.25rem;
-}
-
 .c0 {
   overflow: hidden;
   border-spacing: 0;
@@ -2182,11 +2181,11 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
   border-top-right-radius: 0.25rem;
 }
 
-.c18 {
+.c17 {
   width: 100%;
 }
 
-.c18 tr:first-child td {
+.c17 tr:first-child td {
   border-top: none;
 }
 
@@ -2216,7 +2215,7 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c12 {
+.c11 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -2239,15 +2238,15 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
   font-weight: bold;
 }
 
-.c12:not(:first-child) {
+.c11:not(:first-child) {
   border-left-width: 0;
 }
 
-.c12:not(:last-child) {
+.c11:not(:last-child) {
   border-right-width: 0;
 }
 
-.c14 {
+.c13 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -2270,15 +2269,15 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c14:not(:first-child) {
+.c13:not(:first-child) {
   border-left-width: 0;
 }
 
-.c14:not(:last-child) {
+.c13:not(:last-child) {
   border-right-width: 0;
 }
 
-.c15 {
+.c14 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -2301,15 +2300,15 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c15:not(:first-child) {
+.c14:not(:first-child) {
   border-left-width: 0;
 }
 
-.c15:not(:last-child) {
+.c14:not(:last-child) {
   border-right-width: 0;
 }
 
-.c17 {
+.c16 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -2325,11 +2324,11 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c17:not(:first-child) {
+.c16:not(:first-child) {
   border-left-width: 0;
 }
 
-.c17:not(:last-child) {
+.c16:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -2353,17 +2352,8 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c3 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c16 {
-  padding: 0rem;
-}
-
 @media only screen and (min-width:47.9375rem) {
-  .c15 {
+  .c14 {
     width: 10rem;
     display: table-cell;
   }
@@ -2391,16 +2381,16 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
         selected={undefined}
       >
         <div
-          className="c5 c6 c7"
+          className="c5 baseline-jVaZNU c5 c6"
           role="group"
           style={undefined}
         >
           <li
-            className="c8"
+            className="c7"
           >
             <div
               checked={true}
-              className="c9"
+              className="c8"
               disabled={false}
               id="bt"
               onChange={[Function]}
@@ -2408,14 +2398,14 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
             >
               <input
                 checked={true}
-                className="c10"
+                className="c9"
                 disabled={false}
                 id="bu"
                 onChange={[Function]}
                 type="checkbox"
               />
               <label
-                className="c11"
+                className="c10"
                 htmlFor="bu"
               />
             </div>
@@ -2423,7 +2413,7 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
         </div>
       </th>
       <th
-        className="c12"
+        className="c11"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -2432,9 +2422,512 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
         <span>
           Name 
         </span>
+        <svg
+          className="c12"
+          height="6"
+          innerRef={undefined}
+          marginBottom="0.125rem"
+          marginLeft="0.5625rem"
+          style={
+            Object {
+              "transform": "rotate(180deg)",
+            }
+          }
+          viewBox="0 0 9 6"
+          width="9"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <path
+            d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
+            fill="rgba(73, 73, 73, 1)"
+            fillRule="evenodd"
+          />
+        </svg>
+      </th>
+      <th
+        className="c13"
+        disabled={undefined}
+        name="th"
+        onClick={[Function]}
+        selected={undefined}
+      >
+        <span>
+          Status 
+        </span>
+      </th>
+      <th
+        className="c14"
+        disabled={undefined}
+        name="th"
+        onClick={[Function]}
+        selected={undefined}
+      >
+        <span>
+          Created 
+        </span>
+      </th>
+      <th
+        className="c14"
+        disabled={undefined}
+        name="th"
+        onClick={[Function]}
+        selected={undefined}
+      >
+        <span>
+          Updated 
+        </span>
+      </th>
+      <th
+        className="c15 c16"
+        disabled={undefined}
+        name="th"
+        selected={undefined}
+      />
+    </tr>
+  </thead>
+  <tbody
+    className="c17"
+    disabled={undefined}
+    name="tbody"
+    selected={undefined}
+  />
+</table>
+`;
+
+exports[`renders <SnapshotList sortBy /> without throwing 1`] = `
+.c9 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c9[type='checkbox'],
+.c9[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c9[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c9::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c9:checked + label::after {
+  opacity: 1;
+}
+
+.c9:selected + label::after {
+  opacity: 1;
+}
+
+.c9:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
+.c3 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c5 {
+  padding-top: 0.25rem;
+}
+
+.c15 {
+  padding: 0rem;
+}
+
+.c13 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c10 {
+  color: rgb(100,100,100);
+  position: absolute;
+  width: 1.125rem;
+  height: 1.125rem;
+  box-sizing: border-box;
+  top: 0;
+  right: 0;
+  cursor: pointer;
+  background-color: rgb(255,255,255);
+  box-shadow: none;
+  border: 0.0625rem solid rgb(216,216,216);
+  cursor: pointer;
+  border-radius: 0.25rem;
+  width: 1.125rem;
+  height: 1.125rem;
+}
+
+.c10::after {
+  opacity: 0;
+  content: '';
+  position: absolute;
+  width: 0.375rem;
+  height: 0.125rem;
+  background: transparent;
+  top: 0.3125rem;
+  left: 0.25rem;
+  border: 0.125rem solid rgb(45,45,45);
+  border-top: none;
+  border-right: none;
+  -webkit-transform: rotate(-45deg);
+  -ms-transform: rotate(-45deg);
+  transform: rotate(-45deg);
+}
+
+.c8 {
+  display: inline-block;
+  vertical-align: text-bottom;
+  width: 1.125rem;
+  height: 1.125rem;
+  position: relative;
+  cursor: pointer;
+}
+
+.c7 {
+  list-style-type: none;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c7 label {
+  font-weight: 400;
+}
+
+.c6 {
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  border: none;
+  overflow: hidden;
+  height: auto;
+  -webkit-margin-start: 0;
+  -webkit-margin-end: 0;
+  -webkit-padding-before: 0;
+  -webkit-padding-start: 0;
+  -webkit-padding-end: 0;
+  -webkit-padding-after: 0;
+}
+
+.c0 {
+  overflow: hidden;
+  border-spacing: 0;
+  border-collapse: separate;
+  table-layout: fixed;
+  width: 100%;
+  max-width: 100%;
+}
+
+.c1 {
+  width: 100%;
+  background: rgb(250,250,250);
+}
+
+.c1 th:first-child {
+  border-top-left-radius: 0.25rem;
+}
+
+.c1 th:last-child {
+  border-top-right-radius: 0.25rem;
+}
+
+.c17 {
+  width: 100%;
+}
+
+.c17 tr:first-child td {
+  border-top: none;
+}
+
+.c4 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 2rem;
+  display: table-cell;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c4:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c4:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c14 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 0rem;
+  display: none;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c14:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c14:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c16 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 3.75rem;
+  display: table-cell;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c16:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c16:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c11 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c11:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c11:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c12 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 9.375rem;
+  display: table-cell;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+  color: rgba(73,73,73,1);
+  font-weight: bold;
+}
+
+.c12:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c12:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c2 {
+  display: table-row;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  box-shadow: 0 0.125rem 0 rgba(0,0,0,0.05);
+  box-sizing: border-box;
+  color: rgba(73,73,73,1);
+  background-color: transparent;
+  border: none;
+  box-shadow: none;
+}
+
+.c2:last-child {
+  box-shadow: none;
+}
+
+.c2:last-child td {
+  border-bottom-width: 0.0625rem;
+}
+
+@media only screen and (min-width:47.9375rem) {
+  .c14 {
+    width: 10rem;
+    display: table-cell;
+  }
+}
+
+<table
+  className="c0"
+>
+  <thead
+    className="c1"
+    disabled={undefined}
+    name="thdead"
+    selected={undefined}
+  >
+    <tr
+      className="c2"
+      disabled={undefined}
+      name="tr"
+      selected={undefined}
+    >
+      <th
+        className="c3 c4"
+        disabled={undefined}
+        name="th"
+        selected={undefined}
+      >
+        <div
+          className="c5 baseline-jVaZNU c5 c6"
+          role="group"
+          style={undefined}
+        >
+          <li
+            className="c7"
+          >
+            <div
+              checked={false}
+              className="c8"
+              disabled={false}
+              id="bk"
+              onChange={[Function]}
+              type="checkbox"
+            >
+              <input
+                checked={false}
+                className="c9"
+                disabled={false}
+                id="bl"
+                onChange={[Function]}
+                type="checkbox"
+              />
+              <label
+                className="c10"
+                htmlFor="bl"
+              />
+            </div>
+          </li>
+        </div>
+      </th>
+      <th
+        className="c11"
+        disabled={undefined}
+        name="th"
+        onClick={[Function]}
+        selected={undefined}
+      >
+        <span>
+          Name 
+        </span>
+      </th>
+      <th
+        className="c12"
+        disabled={undefined}
+        name="th"
+        onClick={[Function]}
+        selected={undefined}
+      >
+        <span>
+          Status 
+        </span>
         <svg
           className="c13"
           height="6"
+          innerRef={undefined}
           marginBottom="0.125rem"
           marginLeft="0.5625rem"
           style={
@@ -2459,24 +2952,13 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
         name="th"
         onClick={[Function]}
         selected={undefined}
-      >
-        <span>
-          Status 
-        </span>
-      </th>
-      <th
-        className="c15"
-        disabled={undefined}
-        name="th"
-        onClick={[Function]}
-        selected={undefined}
       >
         <span>
           Created 
         </span>
       </th>
       <th
-        className="c15"
+        className="c14"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -2487,7 +2969,7 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
         </span>
       </th>
       <th
-        className="c16 c17"
+        className="c15 c16"
         disabled={undefined}
         name="th"
         selected={undefined}
@@ -2495,501 +2977,7 @@ exports[`renders <SnapshotList allSelected /> without throwing 1`] = `
     </tr>
   </thead>
   <tbody
-    className="c18"
-    disabled={undefined}
-    name="tbody"
-    selected={undefined}
-  />
-</table>
-`;
-
-exports[`renders <SnapshotList sortBy /> without throwing 1`] = `
-.c14 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
-.c10 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c10[type='checkbox'],
-.c10[type='radio'] {
-  box-sizing: border-box;
-  padding: 0;
-}
-
-.c10[type='number']::-webkit-inner-spin-button,
-.c10[type='number']::-webkit-outer-spin-button {
-  height: auto;
-}
-
-.c10[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
-}
-
-.c10[type='search']::-webkit-search-cancel-button,
-.c10[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c10::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c10:checked + label::after {
-  opacity: 1;
-}
-
-.c10:selected + label::after {
-  opacity: 1;
-}
-
-.c10:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c10:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c10:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
-}
-
-.c11 {
-  color: rgb(100,100,100);
-  position: absolute;
-  width: 1.125rem;
-  height: 1.125rem;
-  box-sizing: border-box;
-  top: 0;
-  right: 0;
-  cursor: pointer;
-  background-color: rgb(255,255,255);
-  box-shadow: none;
-  border: 0.0625rem solid rgb(216,216,216);
-  cursor: pointer;
-  border-radius: 0.25rem;
-  width: 1.125rem;
-  height: 1.125rem;
-}
-
-.c11::after {
-  opacity: 0;
-  content: '';
-  position: absolute;
-  width: 0.375rem;
-  height: 0.125rem;
-  background: transparent;
-  top: 0.3125rem;
-  left: 0.25rem;
-  border: 0.125rem solid rgb(45,45,45);
-  border-top: none;
-  border-right: none;
-  -webkit-transform: rotate(-45deg);
-  -ms-transform: rotate(-45deg);
-  transform: rotate(-45deg);
-}
-
-.c9 {
-  display: inline-block;
-  vertical-align: text-bottom;
-  width: 1.125rem;
-  height: 1.125rem;
-  position: relative;
-  cursor: pointer;
-}
-
-.c8 {
-  list-style-type: none;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.c8 label {
-  font-weight: 400;
-}
-
-.c7 {
-  display: inline-block;
-  margin: 0;
-  padding: 0;
-  border: none;
-  overflow: hidden;
-  height: auto;
-  -webkit-margin-start: 0;
-  -webkit-margin-end: 0;
-  -webkit-padding-before: 0;
-  -webkit-padding-start: 0;
-  -webkit-padding-end: 0;
-  -webkit-padding-after: 0;
-}
-
-.c6 {
-  padding-top: 0.25rem;
-}
-
-.c5 {
-  padding-top: 0.25rem;
-}
-
-.c0 {
-  overflow: hidden;
-  border-spacing: 0;
-  border-collapse: separate;
-  table-layout: fixed;
-  width: 100%;
-  max-width: 100%;
-}
-
-.c1 {
-  width: 100%;
-  background: rgb(250,250,250);
-}
-
-.c1 th:first-child {
-  border-top-left-radius: 0.25rem;
-}
-
-.c1 th:last-child {
-  border-top-right-radius: 0.25rem;
-}
-
-.c18 {
-  width: 100%;
-}
-
-.c18 tr:first-child td {
-  border-top: none;
-}
-
-.c4 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 2rem;
-  display: table-cell;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c4:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c4:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c15 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c15:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c15:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c17 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 3.75rem;
-  display: table-cell;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c17:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c17:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c12 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c12:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c12:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c13 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 9.375rem;
-  display: table-cell;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-  color: rgba(73,73,73,1);
-  font-weight: bold;
-}
-
-.c13:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c13:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c2 {
-  display: table-row;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  box-shadow: 0 0.125rem 0 rgba(0,0,0,0.05);
-  box-sizing: border-box;
-  color: rgba(73,73,73,1);
-  background-color: transparent;
-  border: none;
-  box-shadow: none;
-}
-
-.c2:last-child {
-  box-shadow: none;
-}
-
-.c2:last-child td {
-  border-bottom-width: 0.0625rem;
-}
-
-.c3 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c16 {
-  padding: 0rem;
-}
-
-@media only screen and (min-width:47.9375rem) {
-  .c15 {
-    width: 10rem;
-    display: table-cell;
-  }
-}
-
-<table
-  className="c0"
->
-  <thead
-    className="c1"
-    disabled={undefined}
-    name="thdead"
-    selected={undefined}
-  >
-    <tr
-      className="c2"
-      disabled={undefined}
-      name="tr"
-      selected={undefined}
-    >
-      <th
-        className="c3 c4"
-        disabled={undefined}
-        name="th"
-        selected={undefined}
-      >
-        <div
-          className="c5 c6 c7"
-          role="group"
-          style={undefined}
-        >
-          <li
-            className="c8"
-          >
-            <div
-              checked={false}
-              className="c9"
-              disabled={false}
-              id="bk"
-              onChange={[Function]}
-              type="checkbox"
-            >
-              <input
-                checked={false}
-                className="c10"
-                disabled={false}
-                id="bl"
-                onChange={[Function]}
-                type="checkbox"
-              />
-              <label
-                className="c11"
-                htmlFor="bl"
-              />
-            </div>
-          </li>
-        </div>
-      </th>
-      <th
-        className="c12"
-        disabled={undefined}
-        name="th"
-        onClick={[Function]}
-        selected={undefined}
-      >
-        <span>
-          Name 
-        </span>
-      </th>
-      <th
-        className="c13"
-        disabled={undefined}
-        name="th"
-        onClick={[Function]}
-        selected={undefined}
-      >
-        <span>
-          Status 
-        </span>
-        <svg
-          className="c14"
-          height="6"
-          marginBottom="0.125rem"
-          marginLeft="0.5625rem"
-          style={
-            Object {
-              "transform": "rotate(180deg)",
-            }
-          }
-          viewBox="0 0 9 6"
-          width="9"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
-            fill="rgba(73, 73, 73, 1)"
-            fillRule="evenodd"
-          />
-        </svg>
-      </th>
-      <th
-        className="c15"
-        disabled={undefined}
-        name="th"
-        onClick={[Function]}
-        selected={undefined}
-      >
-        <span>
-          Created 
-        </span>
-      </th>
-      <th
-        className="c15"
-        disabled={undefined}
-        name="th"
-        onClick={[Function]}
-        selected={undefined}
-      >
-        <span>
-          Updated 
-        </span>
-      </th>
-      <th
-        className="c16 c17"
-        disabled={undefined}
-        name="th"
-        selected={undefined}
-      />
-    </tr>
-  </thead>
-  <tbody
-    className="c18"
+    className="c17"
     disabled={undefined}
     name="tbody"
     selected={undefined}
@@ -2998,12 +2986,7 @@ exports[`renders <SnapshotList sortBy /> without throwing 1`] = `
 `;
 
 exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
-.c14 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
-.c10 {
+.c9 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -3012,60 +2995,78 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
   display: none;
 }
 
-.c10[type='checkbox'],
-.c10[type='radio'] {
+.c9[type='checkbox'],
+.c9[type='radio'] {
   box-sizing: border-box;
   padding: 0;
 }
 
-.c10[type='number']::-webkit-inner-spin-button,
-.c10[type='number']::-webkit-outer-spin-button {
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
   height: auto;
 }
 
-.c10[type='search'] {
+.c9[type='search'] {
   -webkit-appearance: textfield;
   -moz-appearance: textfield;
   appearance: textfield;
   outline-offset: -0.125rem;
 }
 
-.c10[type='search']::-webkit-search-cancel-button,
-.c10[type='search']::-webkit-search-decoration {
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
 }
 
-.c10::-webkit-file-upload-button {
+.c9::-webkit-file-upload-button {
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   font: inherit;
 }
 
-.c10:checked + label::after {
+.c9:checked + label::after {
   opacity: 1;
 }
 
-.c10:selected + label::after {
+.c9:selected + label::after {
   opacity: 1;
 }
 
-.c10:checked + label {
+.c9:checked + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:selected + label {
+.c9:selected + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:disabled + label {
+.c9:disabled + label {
   background-color: rgb(249,249,249);
   cursor: not-allowed;
 }
 
-.c11 {
+.c3 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c5 {
+  padding-top: 0.25rem;
+}
+
+.c15 {
+  padding: 0rem;
+}
+
+.c13 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c10 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -3083,7 +3084,7 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c11::after {
+.c10::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -3100,7 +3101,7 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c9 {
+.c8 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -3109,7 +3110,7 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c8 {
+.c7 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -3121,11 +3122,11 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
   align-items: center;
 }
 
-.c8 label {
+.c7 label {
   font-weight: 400;
 }
 
-.c7 {
+.c6 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -3140,14 +3141,6 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c6 {
-  padding-top: 0.25rem;
-}
-
-.c5 {
-  padding-top: 0.25rem;
-}
-
 .c0 {
   overflow: hidden;
   border-spacing: 0;
@@ -3170,11 +3163,11 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
   border-top-right-radius: 0.25rem;
 }
 
-.c18 {
+.c17 {
   width: 100%;
 }
 
-.c18 tr:first-child td {
+.c17 tr:first-child td {
   border-top: none;
 }
 
@@ -3204,7 +3197,7 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c15 {
+.c14 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -3227,15 +3220,15 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c15:not(:first-child) {
+.c14:not(:first-child) {
   border-left-width: 0;
 }
 
-.c15:not(:last-child) {
+.c14:not(:last-child) {
   border-right-width: 0;
 }
 
-.c17 {
+.c16 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -3251,15 +3244,15 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c17:not(:first-child) {
+.c16:not(:first-child) {
   border-left-width: 0;
 }
 
-.c17:not(:last-child) {
+.c16:not(:last-child) {
   border-right-width: 0;
 }
 
-.c12 {
+.c11 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -3280,15 +3273,15 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c12:not(:first-child) {
+.c11:not(:first-child) {
   border-left-width: 0;
 }
 
-.c12:not(:last-child) {
+.c11:not(:last-child) {
   border-right-width: 0;
 }
 
-.c13 {
+.c12 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -3313,11 +3306,11 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
   font-weight: bold;
 }
 
-.c13:not(:first-child) {
+.c12:not(:first-child) {
   border-left-width: 0;
 }
 
-.c13:not(:last-child) {
+.c12:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -3341,17 +3334,8 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c3 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c16 {
-  padding: 0rem;
-}
-
 @media only screen and (min-width:47.9375rem) {
-  .c15 {
+  .c14 {
     width: 10rem;
     display: table-cell;
   }
@@ -3379,16 +3363,16 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
         selected={undefined}
       >
         <div
-          className="c5 c6 c7"
+          className="c5 baseline-jVaZNU c5 c6"
           role="group"
           style={undefined}
         >
           <li
-            className="c8"
+            className="c7"
           >
             <div
               checked={false}
-              className="c9"
+              className="c8"
               disabled={false}
               id="bn"
               onChange={[Function]}
@@ -3396,14 +3380,14 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
             >
               <input
                 checked={false}
-                className="c10"
+                className="c9"
                 disabled={false}
                 id="bo"
                 onChange={[Function]}
                 type="checkbox"
               />
               <label
-                className="c11"
+                className="c10"
                 htmlFor="bo"
               />
             </div>
@@ -3411,7 +3395,7 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
         </div>
       </th>
       <th
-        className="c12"
+        className="c11"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -3422,7 +3406,7 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
         </span>
       </th>
       <th
-        className="c13"
+        className="c12"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -3432,8 +3416,9 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
           Status 
         </span>
         <svg
-          className="c14"
+          className="c13"
           height="6"
+          innerRef={undefined}
           marginBottom="0.125rem"
           marginLeft="0.5625rem"
           style={
@@ -3453,7 +3438,7 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
         </svg>
       </th>
       <th
-        className="c15"
+        className="c14"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -3464,7 +3449,7 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
         </span>
       </th>
       <th
-        className="c15"
+        className="c14"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -3475,7 +3460,7 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
         </span>
       </th>
       <th
-        className="c16 c17"
+        className="c15 c16"
         disabled={undefined}
         name="th"
         selected={undefined}
@@ -3483,7 +3468,7 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
     </tr>
   </thead>
   <tbody
-    className="c18"
+    className="c17"
     disabled={undefined}
     name="tbody"
     selected={undefined}
@@ -3492,12 +3477,7 @@ exports[`renders <SnapshotList sortBy sortOrder /> without throwing 1`] = `
 `;
 
 exports[`renders <SnapshotList submitting /> without throwing 1`] = `
-.c13 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
-.c10 {
+.c9 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -3506,60 +3486,78 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
   display: none;
 }
 
-.c10[type='checkbox'],
-.c10[type='radio'] {
+.c9[type='checkbox'],
+.c9[type='radio'] {
   box-sizing: border-box;
   padding: 0;
 }
 
-.c10[type='number']::-webkit-inner-spin-button,
-.c10[type='number']::-webkit-outer-spin-button {
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
   height: auto;
 }
 
-.c10[type='search'] {
+.c9[type='search'] {
   -webkit-appearance: textfield;
   -moz-appearance: textfield;
   appearance: textfield;
   outline-offset: -0.125rem;
 }
 
-.c10[type='search']::-webkit-search-cancel-button,
-.c10[type='search']::-webkit-search-decoration {
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
 }
 
-.c10::-webkit-file-upload-button {
+.c9::-webkit-file-upload-button {
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   font: inherit;
 }
 
-.c10:checked + label::after {
+.c9:checked + label::after {
   opacity: 1;
 }
 
-.c10:selected + label::after {
+.c9:selected + label::after {
   opacity: 1;
 }
 
-.c10:checked + label {
+.c9:checked + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:selected + label {
+.c9:selected + label {
   border-color: rgb(59,70,204);
 }
 
-.c10:disabled + label {
+.c9:disabled + label {
   background-color: rgb(249,249,249);
   cursor: not-allowed;
 }
 
-.c11 {
+.c3 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c5 {
+  padding-top: 0.25rem;
+}
+
+.c15 {
+  padding: 0rem;
+}
+
+.c12 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c10 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -3577,7 +3575,7 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c11::after {
+.c10::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -3594,7 +3592,7 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c9 {
+.c8 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -3603,7 +3601,7 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c8 {
+.c7 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -3615,11 +3613,11 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
   align-items: center;
 }
 
-.c8 label {
+.c7 label {
   font-weight: 400;
 }
 
-.c7 {
+.c6 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -3634,14 +3632,6 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c6 {
-  padding-top: 0.25rem;
-}
-
-.c5 {
-  padding-top: 0.25rem;
-}
-
 .c0 {
   overflow: hidden;
   border-spacing: 0;
@@ -3664,11 +3654,11 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
   border-top-right-radius: 0.25rem;
 }
 
-.c18 {
+.c17 {
   width: 100%;
 }
 
-.c18 tr:first-child td {
+.c17 tr:first-child td {
   border-top: none;
 }
 
@@ -3698,7 +3688,7 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c12 {
+.c11 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -3721,15 +3711,15 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
   font-weight: bold;
 }
 
-.c12:not(:first-child) {
+.c11:not(:first-child) {
   border-left-width: 0;
 }
 
-.c12:not(:last-child) {
+.c11:not(:last-child) {
   border-right-width: 0;
 }
 
-.c14 {
+.c13 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -3752,15 +3742,15 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c14:not(:first-child) {
+.c13:not(:first-child) {
   border-left-width: 0;
 }
 
-.c14:not(:last-child) {
+.c13:not(:last-child) {
   border-right-width: 0;
 }
 
-.c15 {
+.c14 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -3783,15 +3773,15 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c15:not(:first-child) {
+.c14:not(:first-child) {
   border-left-width: 0;
 }
 
-.c15:not(:last-child) {
+.c14:not(:last-child) {
   border-right-width: 0;
 }
 
-.c17 {
+.c16 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -3807,11 +3797,11 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c17:not(:first-child) {
+.c16:not(:first-child) {
   border-left-width: 0;
 }
 
-.c17:not(:last-child) {
+.c16:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -3835,17 +3825,8 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c3 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c16 {
-  padding: 0rem;
-}
-
 @media only screen and (min-width:47.9375rem) {
-  .c15 {
+  .c14 {
     width: 10rem;
     display: table-cell;
   }
@@ -3873,16 +3854,16 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
         selected={undefined}
       >
         <div
-          className="c5 c6 c7"
+          className="c5 baseline-jVaZNU c5 c6"
           role="group"
           style={undefined}
         >
           <li
-            className="c8"
+            className="c7"
           >
             <div
               checked={false}
-              className="c9"
+              className="c8"
               disabled={true}
               id="bq"
               onChange={[Function]}
@@ -3890,14 +3871,14 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
             >
               <input
                 checked={false}
-                className="c10"
+                className="c9"
                 disabled={true}
                 id="br"
                 onChange={[Function]}
                 type="checkbox"
               />
               <label
-                className="c11"
+                className="c10"
                 htmlFor="br"
               />
             </div>
@@ -3905,7 +3886,7 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
         </div>
       </th>
       <th
-        className="c12"
+        className="c11"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -3915,8 +3896,9 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
           Name 
         </span>
         <svg
-          className="c13"
+          className="c12"
           height="6"
+          innerRef={undefined}
           marginBottom="0.125rem"
           marginLeft="0.5625rem"
           style={
@@ -3936,7 +3918,7 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
         </svg>
       </th>
       <th
-        className="c14"
+        className="c13"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -3947,7 +3929,7 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
         </span>
       </th>
       <th
-        className="c15"
+        className="c14"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -3958,7 +3940,7 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
         </span>
       </th>
       <th
-        className="c15"
+        className="c14"
         disabled={undefined}
         name="th"
         onClick={[Function]}
@@ -3969,7 +3951,7 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
         </span>
       </th>
       <th
-        className="c16 c17"
+        className="c15 c16"
         disabled={undefined}
         name="th"
         selected={undefined}
@@ -3977,7 +3959,7 @@ exports[`renders <SnapshotList submitting /> without throwing 1`] = `
     </tr>
   </thead>
   <tbody
-    className="c18"
+    className="c17"
     disabled={undefined}
     name="tbody"
     selected={undefined}
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/summary.spec.js.snap b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/summary.spec.js.snap
index c49a7b52..6d83756e 100644
--- a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/summary.spec.js.snap
+++ b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/summary.spec.js.snap
@@ -39,7 +39,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   margin-left: -0.5rem;
 }
 
-.c15 {
+.c16 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -76,7 +76,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -85,7 +85,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -94,7 +94,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -108,11 +108,11 @@ exports[`renders <Summary /> without throwing 1`] = `
   margin-bottom: 1rem;
 }
 
-.c13 {
+.c14 {
   margin-top: 0.25rem;
 }
 
-.c24 {
+.c25 {
   margin-top: 2rem;
   margin-bottom: 4rem;
 }
@@ -121,7 +121,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   padding: 2rem;
 }
 
-.c19 {
+.c20 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -134,30 +134,38 @@ exports[`renders <Summary /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c19::-moz-focus-inner,
-.c19[type='button']::-moz-focus-inner,
-.c19[type='reset']::-moz-focus-inner,
-.c19[type='submit']::-moz-focus-inner {
+.c20::-moz-focus-inner,
+.c20[type='button']::-moz-focus-inner,
+.c20[type='reset']::-moz-focus-inner,
+.c20[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c19:-moz-focusring,
-.c19[type='button']:-moz-focusring,
-.c19[type='reset']:-moz-focusring,
-.c19[type='submit']:-moz-focusring {
+.c20:-moz-focusring,
+.c20[type='button']:-moz-focusring,
+.c20[type='reset']:-moz-focusring,
+.c20[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c19 + button {
+.c20 + button {
   margin-left: 0.375rem;
 }
 
-.c18 {
+.c12 {
+  margin-top: 0.0625rem;
+  margin-right: 0.375rem;
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 50%;
+}
+
+.c19 {
   display: inline-block;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -217,75 +225,75 @@ exports[`renders <Summary /> without throwing 1`] = `
   align-items: center;
 }
 
-.c17:focus {
+.c18:focus {
   outline: 0;
   text-decoration: none;
   background-color: rgb(59,70,204);
   border-color: rgb(45,56,132);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c17[disabled] {
+.c18[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c17 svg + span {
+.c18 svg + span {
   margin-left: 0.75rem;
 }
 
-.c17 svg {
+.c18 svg {
   max-height: 1.125rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -343,221 +351,71 @@ exports[`renders <Summary /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c20:focus {
+.c21:focus {
   outline: 0;
   text-decoration: none;
   background-color: rgb(59,70,204);
   border-color: rgb(45,56,132);
 }
 
-.c20:hover {
+.c21:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
+.c21:active,
+.c21:active:hover,
+.c21:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c20[disabled] {
+.c21[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c20:focus {
+.c21:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c20:hover {
+.c21:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
+.c21:active,
+.c21:active:hover,
+.c21:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c20:focus {
+.c21:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c20:hover {
+.c21:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
+.c21:active,
+.c21:active:hover,
+.c21:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c20 svg + span {
+.c21 svg + span {
   margin-left: 0.75rem;
 }
 
-.c20 svg {
-  max-height: 1.125rem;
-}
-
-.c22 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  float: right;
-}
-
-.c22:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c22:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c22[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c22:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c22:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c22:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-}
-
-.c22:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(210,67,58);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(210,67,58);
-}
-
-.c22:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c22:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c22 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c22 svg {
+.c21 svg {
   max-height: 1.125rem;
 }
 
@@ -612,6 +470,9 @@ exports[`renders <Summary /> without throwing 1`] = `
   color: rgb(216,216,216);
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -620,7 +481,6 @@ exports[`renders <Summary /> without throwing 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
   float: right;
 }
 
@@ -709,6 +569,154 @@ exports[`renders <Summary /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c24 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+  float: right;
+}
+
+.c24:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c24:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c24[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c24:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c24:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c24:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+}
+
+.c24:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(210,67,58);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(210,67,58);
+}
+
+.c24:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c24:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c24 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c24 svg {
+  max-height: 1.125rem;
+}
+
 .c10 {
   font-size: 0.9375rem;
   font-style: normal;
@@ -718,6 +726,19 @@ exports[`renders <Summary /> without throwing 1`] = `
   text-align: left;
 }
 
+.c28 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
 .c7 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -739,22 +760,17 @@ exports[`renders <Summary /> without throwing 1`] = `
   margin-top: 1.5rem;
 }
 
-.c25 {
+.c26 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c12 {
+.c13 {
   width: 0.375rem;
   height: 0.375rem;
   border-radius: 50%;
   display: inline-block;
-  margin-top: 0.0625rem;
-  margin-right: 0.375rem;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 50%;
 }
 
 .c2 {
@@ -823,7 +839,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c29 {
+.c30 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -847,46 +863,46 @@ exports[`renders <Summary /> without throwing 1`] = `
   outline: 0;
 }
 
-.c29::-webkit-input-placeholder {
+.c30::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c29::-moz-placeholder {
+.c30::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c29:-ms-input-placeholder {
+.c30:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c29:invalid {
+.c30:invalid {
   box-shadow: none;
 }
 
-.c29:disabled {
+.c30:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c29:disabled::-webkit-input-placeholder {
+.c30:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c29:disabled::-moz-placeholder {
+.c30:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c29:disabled:-ms-input-placeholder {
+.c30:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c29:focus {
+.c30:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c31 {
+.c32 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -909,59 +925,46 @@ exports[`renders <Summary /> without throwing 1`] = `
   outline: 0;
 }
 
-.c31::-webkit-input-placeholder {
+.c32::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31::-moz-placeholder {
+.c32::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:-ms-input-placeholder {
+.c32:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:invalid {
+.c32:invalid {
   box-shadow: none;
 }
 
-.c31:disabled {
+.c32:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c31:disabled::-webkit-input-placeholder {
+.c32:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:disabled::-moz-placeholder {
+.c32:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:disabled:-ms-input-placeholder {
+.c32:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:focus {
+.c32:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c27 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c14 {
+.c15 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
@@ -981,7 +984,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   justify-content: flex-start;
 }
 
-.c28 {
+.c29 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -993,11 +996,11 @@ exports[`renders <Summary /> without throwing 1`] = `
   align-items: center;
 }
 
-.c28 input {
+.c29 input {
   padding-right: 1.875rem;
 }
 
-.c28 div {
+.c29 div {
   position: relative;
   left: -1.625rem;
 }
@@ -1016,7 +1019,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   margin: 0 1.125rem;
 }
 
-.c30 {
+.c31 {
   cursor: pointer;
 }
 
@@ -1030,7 +1033,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c15 {
+  .c16 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -1079,7 +1082,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -1089,7 +1092,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -1099,7 +1102,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c26 {
+  .c27 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -1109,7 +1112,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c26 {
+  .c27 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -1185,7 +1188,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 className="c9"
               >
                 <span
-                  className="c12"
+                  className="c12 c13"
                   color={undefined}
                   height="0.6875rem"
                   width="0.6875rem"
@@ -1194,7 +1197,7 @@ exports[`renders <Summary /> without throwing 1`] = `
               </div>
             </div>
             <div
-              className="c13"
+              className="c14"
             >
               <div
                 className="c9"
@@ -1203,7 +1206,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c10"
                   >
                     Created: 
                   </label>
@@ -1222,7 +1225,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c10"
                   >
                     Updated: 
                   </label>
@@ -1238,17 +1241,17 @@ exports[`renders <Summary /> without throwing 1`] = `
             </div>
           </div>
           <div
-            className="c15"
+            className="c16"
           >
             <div
-              className="c16"
+              className="c17"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c17 c18 c19"
+                  className="c18 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1258,6 +1261,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   <svg
                     className=""
                     height="15"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -1315,7 +1319,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c20 c18 c19"
+                  className="c21 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1325,6 +1329,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   <svg
                     className=""
                     height="15"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -1385,7 +1390,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c17 c18 c19"
+                  className="c18 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1395,6 +1400,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   <svg
                     className=""
                     height="14"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -1448,7 +1454,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c20 c18 c19"
+                  className="c21 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1458,6 +1464,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   <svg
                     className=""
                     height="14"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -1514,7 +1521,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c17 c18 c19"
+                  className="c18 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1524,6 +1531,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   <svg
                     className=""
                     height="21"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -1561,7 +1569,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c20 c18 c19"
+                  className="c21 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1571,6 +1579,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   <svg
                     className=""
                     height="21"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -1608,14 +1617,14 @@ exports[`renders <Summary /> without throwing 1`] = `
               </span>
             </div>
             <div
-              className="c21"
+              className="c22"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c18 c19"
+                  className="c23 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1625,6 +1634,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   <svg
                     className=""
                     height="12"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -1662,7 +1672,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c23 c18 c19"
+                  className="c24 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1672,6 +1682,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   <svg
                     className=""
                     height="12"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -1710,10 +1721,10 @@ exports[`renders <Summary /> without throwing 1`] = `
             </div>
           </div>
           <div
-            className="c24"
+            className="c25"
           >
             <div
-              className="c25 c0"
+              className="c26 c0"
               height="0.0625rem"
             />
           </div>
@@ -1721,19 +1732,19 @@ exports[`renders <Summary /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c26"
+              className="c27"
             >
               <label
-                className="c27"
+                className="c28"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c28"
+                className="c29"
               >
                 <input
-                  className="c29"
+                  className="c30"
                   disabled={false}
                   id=""
                   value=""
@@ -1745,8 +1756,9 @@ exports[`renders <Summary /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c30 "
+                    className="c31 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -1790,19 +1802,19 @@ exports[`renders <Summary /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c26"
+              className="c27"
             >
               <label
-                className="c27"
+                className="c28"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c28"
+                className="c29"
               >
                 <input
-                  className="c29"
+                  className="c30"
                   disabled={false}
                   id=""
                   value={undefined}
@@ -1814,8 +1826,9 @@ exports[`renders <Summary /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c30 "
+                    className="c31 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -1859,19 +1872,19 @@ exports[`renders <Summary /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c26"
+              className="c27"
             >
               <label
-                className="c27"
+                className="c28"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c28"
+                className="c29"
               >
                 <input
-                  className="c29"
+                  className="c30"
                   disabled={false}
                   id=""
                   value={undefined}
@@ -1883,8 +1896,9 @@ exports[`renders <Summary /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c30 "
+                    className="c31 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -1928,19 +1942,19 @@ exports[`renders <Summary /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c26"
+              className="c27"
             >
               <label
-                className="c27"
+                className="c28"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c28"
+                className="c29"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value="ssh root@undefined"
@@ -1952,8 +1966,9 @@ exports[`renders <Summary /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c30 "
+                    className="c31 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -2039,7 +2054,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   margin-left: -0.5rem;
 }
 
-.c15 {
+.c16 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -2076,7 +2091,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -2085,7 +2100,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c23 {
+.c24 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -2094,7 +2109,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c28 {
+.c29 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -2108,11 +2123,11 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   margin-bottom: 1rem;
 }
 
-.c13 {
+.c14 {
   margin-top: 0.25rem;
 }
 
-.c26 {
+.c27 {
   margin-top: 2rem;
   margin-bottom: 4rem;
 }
@@ -2121,7 +2136,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   padding: 2rem;
 }
 
-.c19 {
+.c20 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -2134,30 +2149,38 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c19::-moz-focus-inner,
-.c19[type='button']::-moz-focus-inner,
-.c19[type='reset']::-moz-focus-inner,
-.c19[type='submit']::-moz-focus-inner {
+.c20::-moz-focus-inner,
+.c20[type='button']::-moz-focus-inner,
+.c20[type='reset']::-moz-focus-inner,
+.c20[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c19:-moz-focusring,
-.c19[type='button']:-moz-focusring,
-.c19[type='reset']:-moz-focusring,
-.c19[type='submit']:-moz-focusring {
+.c20:-moz-focusring,
+.c20[type='button']:-moz-focusring,
+.c20[type='reset']:-moz-focusring,
+.c20[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c19 + button {
+.c20 + button {
   margin-left: 0.375rem;
 }
 
-.c18 {
+.c12 {
+  margin-top: 0.0625rem;
+  margin-right: 0.375rem;
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 50%;
+}
+
+.c19 {
   display: inline-block;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2217,75 +2240,75 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   align-items: center;
 }
 
-.c17:focus {
+.c18:focus {
   outline: 0;
   text-decoration: none;
   background-color: rgb(59,70,204);
   border-color: rgb(45,56,132);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c17[disabled] {
+.c18[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c17 svg + span {
+.c18 svg + span {
   margin-left: 0.75rem;
 }
 
-.c17 svg {
+.c18 svg {
   max-height: 1.125rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2343,129 +2366,6 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c20:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c20:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c20[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c20:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c20:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c20:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c20:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c20 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c20 svg {
-  max-height: 1.125rem;
-}
-
-.c21 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
 .c21:focus {
   outline: 0;
   text-decoration: none;
@@ -2509,6 +2409,23 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   border-color: rgb(216,216,216);
 }
 
+.c21:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c21:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c21:active,
+.c21:active:hover,
+.c21:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
 .c21 svg + span {
   margin-left: 0.75rem;
 }
@@ -2559,6 +2476,9 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -2567,7 +2487,6 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
 }
 
 .c22:focus {
@@ -2621,7 +2540,111 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c24 {
+.c23 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+}
+
+.c23:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c23:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c23[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c23:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c23:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c23 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c23 svg {
+  max-height: 1.125rem;
+}
+
+.c25 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2681,132 +2704,6 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   float: right;
 }
 
-.c24:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c24:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c24[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c24:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c24:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c24:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-}
-
-.c24:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(210,67,58);
-}
-
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(210,67,58);
-}
-
-.c24 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c24 svg {
-  max-height: 1.125rem;
-}
-
-.c25 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  font-weight: 500;
-  float: right;
-}
-
 .c25:focus {
   outline: 0;
   text-decoration: none;
@@ -2875,6 +2772,132 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c26 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+  float: right;
+}
+
+.c26:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c26:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c26[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c26:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c26:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c26:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+}
+
+.c26:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(210,67,58);
+}
+
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(210,67,58);
+}
+
+.c26 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c26 svg {
+  max-height: 1.125rem;
+}
+
 .c10 {
   font-size: 0.9375rem;
   font-style: normal;
@@ -2884,6 +2907,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   text-align: left;
 }
 
+.c30 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
 .c7 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -2905,23 +2941,18 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   margin-top: 1.5rem;
 }
 
-.c27 {
+.c28 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c12 {
+.c13 {
   width: 0.375rem;
   height: 0.375rem;
   border-radius: 50%;
   background-color: rgb(0,152,88);
   display: inline-block;
-  margin-top: 0.0625rem;
-  margin-right: 0.375rem;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 50%;
 }
 
 .c2 {
@@ -2990,7 +3021,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c31 {
+.c32 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -3013,59 +3044,46 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   outline: 0;
 }
 
-.c31::-webkit-input-placeholder {
+.c32::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31::-moz-placeholder {
+.c32::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:-ms-input-placeholder {
+.c32:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:invalid {
+.c32:invalid {
   box-shadow: none;
 }
 
-.c31:disabled {
+.c32:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c31:disabled::-webkit-input-placeholder {
+.c32:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:disabled::-moz-placeholder {
+.c32:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:disabled:-ms-input-placeholder {
+.c32:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:focus {
+.c32:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c29 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c14 {
+.c15 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
@@ -3085,7 +3103,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   justify-content: flex-start;
 }
 
-.c30 {
+.c31 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -3097,16 +3115,16 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   align-items: center;
 }
 
-.c30 input {
+.c31 input {
   padding-right: 1.875rem;
 }
 
-.c30 div {
+.c31 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c33 {
+.c34 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -3119,11 +3137,11 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   margin-bottom: 0rem;
 }
 
-.c33 input {
+.c34 input {
   padding-right: 1.875rem;
 }
 
-.c33 div {
+.c34 div {
   position: relative;
   left: -1.625rem;
 }
@@ -3142,7 +3160,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   margin: 0 1.125rem;
 }
 
-.c32 {
+.c33 {
   cursor: pointer;
 }
 
@@ -3156,7 +3174,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c15 {
+  .c16 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -3205,7 +3223,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -3215,7 +3233,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c23 {
+  .c24 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -3225,7 +3243,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c28 {
+  .c29 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -3235,7 +3253,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c28 {
+  .c29 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -3313,7 +3331,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 className="c9"
               >
                 <span
-                  className="c12"
+                  className="c12 c13"
                   color="green"
                   height="0.6875rem"
                   width="0.6875rem"
@@ -3322,7 +3340,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
               </div>
             </div>
             <div
-              className="c13"
+              className="c14"
             >
               <div
                 className="c9"
@@ -3331,7 +3349,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c10"
                   >
                     Created: 
                   </label>
@@ -3350,7 +3368,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c10"
                   >
                     Updated: 
                   </label>
@@ -3366,17 +3384,17 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             </div>
           </div>
           <div
-            className="c15"
+            className="c16"
           >
             <div
-              className="c16"
+              className="c17"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c17 c18 c19"
+                  className="c18 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -3386,6 +3404,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   <svg
                     className=""
                     height="15"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -3443,7 +3462,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c20 c18 c19"
+                  className="c21 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -3453,6 +3472,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   <svg
                     className=""
                     height="15"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -3513,7 +3533,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c21 c18 c19"
+                  className="c22 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3523,6 +3543,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   <svg
                     className=""
                     height="14"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -3576,7 +3597,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c22 c18 c19"
+                  className="c23 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3586,6 +3607,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   <svg
                     className=""
                     height="14"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -3642,7 +3664,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c21 c18 c19"
+                  className="c22 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3652,6 +3674,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   <svg
                     className=""
                     height="21"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -3689,7 +3712,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c22 c18 c19"
+                  className="c23 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3699,6 +3722,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   <svg
                     className=""
                     height="21"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -3736,14 +3760,14 @@ exports[`renders <Summary instance /> without throwing 1`] = `
               </span>
             </div>
             <div
-              className="c23"
+              className="c24"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c24 c18 c19"
+                  className="c25 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3753,6 +3777,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   <svg
                     className=""
                     height="12"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -3790,7 +3815,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c25 c18 c19"
+                  className="c26 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3800,6 +3825,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   <svg
                     className=""
                     height="12"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -3838,10 +3864,10 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             </div>
           </div>
           <div
-            className="c26"
+            className="c27"
           >
             <div
-              className="c27 c0"
+              className="c28 c0"
               height="0.0625rem"
             />
           </div>
@@ -3849,19 +3875,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value="2252839a"
@@ -3873,8 +3899,9 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -3918,19 +3945,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value="2252839a-e698-ceec-afac-9549ad0c6624"
@@ -3942,8 +3969,9 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -3987,19 +4015,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value="70bb1cee-dba3-11e3-a799-002590e4f2b0"
@@ -4011,8 +4039,9 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -4056,19 +4085,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 Image UUID
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value="19aa3328-0025-11e7-a19a-c39077bfd4cf"
@@ -4080,8 +4109,9 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -4125,19 +4155,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value="ssh root@72.2.119.146"
@@ -4149,8 +4179,9 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -4194,19 +4225,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 IP address 1
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value="72.2.119.146"
@@ -4218,8 +4249,9 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -4263,19 +4295,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 IP address 2
               </label>
               <div
-                className="c33"
+                className="c34"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value="10.112.5.63"
@@ -4287,8 +4319,9 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -4374,7 +4407,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   margin-left: -0.5rem;
 }
 
-.c15 {
+.c16 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -4411,7 +4444,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   padding-left: 0.5rem;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -4420,7 +4453,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   padding-left: 0.5rem;
 }
 
-.c23 {
+.c24 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -4429,7 +4462,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   padding-left: 0.5rem;
 }
 
-.c28 {
+.c29 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -4443,11 +4476,11 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   margin-bottom: 1rem;
 }
 
-.c13 {
+.c14 {
   margin-top: 0.25rem;
 }
 
-.c26 {
+.c27 {
   margin-top: 2rem;
   margin-bottom: 4rem;
 }
@@ -4456,7 +4489,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   padding: 2rem;
 }
 
-.c19 {
+.c20 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -4469,30 +4502,38 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   min-width: 7.5rem;
 }
 
-.c19::-moz-focus-inner,
-.c19[type='button']::-moz-focus-inner,
-.c19[type='reset']::-moz-focus-inner,
-.c19[type='submit']::-moz-focus-inner {
+.c20::-moz-focus-inner,
+.c20[type='button']::-moz-focus-inner,
+.c20[type='reset']::-moz-focus-inner,
+.c20[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c19:-moz-focusring,
-.c19[type='button']:-moz-focusring,
-.c19[type='reset']:-moz-focusring,
-.c19[type='submit']:-moz-focusring {
+.c20:-moz-focusring,
+.c20[type='button']:-moz-focusring,
+.c20[type='reset']:-moz-focusring,
+.c20[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c19 + button {
+.c20 + button {
   margin-left: 0.375rem;
 }
 
-.c18 {
+.c12 {
+  margin-top: 0.0625rem;
+  margin-right: 0.375rem;
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 50%;
+}
+
+.c19 {
   display: inline-block;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4552,75 +4593,75 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   align-items: center;
 }
 
-.c17:focus {
+.c18:focus {
   outline: 0;
   text-decoration: none;
   background-color: rgb(59,70,204);
   border-color: rgb(45,56,132);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c17[disabled] {
+.c18[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c17 svg + span {
+.c18 svg + span {
   margin-left: 0.75rem;
 }
 
-.c17 svg {
+.c18 svg {
   max-height: 1.125rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4678,129 +4719,6 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   font-weight: 500;
 }
 
-.c20:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c20:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c20[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c20:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c20:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c20:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c20:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c20 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c20 svg {
-  max-height: 1.125rem;
-}
-
-.c21 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
 .c21:focus {
   outline: 0;
   text-decoration: none;
@@ -4844,6 +4762,23 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   border-color: rgb(216,216,216);
 }
 
+.c21:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c21:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c21:active,
+.c21:active:hover,
+.c21:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
 .c21 svg + span {
   margin-left: 0.75rem;
 }
@@ -4894,6 +4829,9 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -4902,7 +4840,6 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
 }
 
 .c22:focus {
@@ -4956,7 +4893,111 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   max-height: 1.125rem;
 }
 
-.c24 {
+.c23 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+}
+
+.c23:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c23:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c23[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c23:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c23:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c23 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c23 svg {
+  max-height: 1.125rem;
+}
+
+.c25 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -5016,132 +5057,6 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   float: right;
 }
 
-.c24:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c24:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c24[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c24:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c24:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c24:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-}
-
-.c24:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(210,67,58);
-}
-
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(210,67,58);
-}
-
-.c24 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c24 svg {
-  max-height: 1.125rem;
-}
-
-.c25 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  font-weight: 500;
-  float: right;
-}
-
 .c25:focus {
   outline: 0;
   text-decoration: none;
@@ -5210,6 +5125,132 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   max-height: 1.125rem;
 }
 
+.c26 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+  float: right;
+}
+
+.c26:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c26:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c26[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c26:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c26:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c26:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+}
+
+.c26:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(210,67,58);
+}
+
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(210,67,58);
+}
+
+.c26 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c26 svg {
+  max-height: 1.125rem;
+}
+
 .c10 {
   font-size: 0.9375rem;
   font-style: normal;
@@ -5219,6 +5260,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   text-align: left;
 }
 
+.c30 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
 .c7 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -5240,23 +5294,18 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   margin-top: 1.5rem;
 }
 
-.c27 {
+.c28 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c12 {
+.c13 {
   width: 0.375rem;
   height: 0.375rem;
   border-radius: 50%;
   background-color: rgb(0,152,88);
   display: inline-block;
-  margin-top: 0.0625rem;
-  margin-right: 0.375rem;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 50%;
 }
 
 .c2 {
@@ -5325,7 +5374,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c31 {
+.c32 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -5348,59 +5397,46 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   outline: 0;
 }
 
-.c31::-webkit-input-placeholder {
+.c32::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31::-moz-placeholder {
+.c32::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:-ms-input-placeholder {
+.c32:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:invalid {
+.c32:invalid {
   box-shadow: none;
 }
 
-.c31:disabled {
+.c32:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c31:disabled::-webkit-input-placeholder {
+.c32:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:disabled::-moz-placeholder {
+.c32:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:disabled:-ms-input-placeholder {
+.c32:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:focus {
+.c32:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c29 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c14 {
+.c15 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
@@ -5420,7 +5456,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   justify-content: flex-start;
 }
 
-.c30 {
+.c31 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -5432,16 +5468,16 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   align-items: center;
 }
 
-.c30 input {
+.c31 input {
   padding-right: 1.875rem;
 }
 
-.c30 div {
+.c31 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c33 {
+.c34 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -5454,11 +5490,11 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   margin-bottom: 0rem;
 }
 
-.c33 input {
+.c34 input {
   padding-right: 1.875rem;
 }
 
-.c33 div {
+.c34 div {
   position: relative;
   left: -1.625rem;
 }
@@ -5477,7 +5513,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   margin: 0 1.125rem;
 }
 
-.c32 {
+.c33 {
   cursor: pointer;
 }
 
@@ -5491,7 +5527,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c15 {
+  .c16 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -5540,7 +5576,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -5550,7 +5586,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c23 {
+  .c24 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -5560,7 +5596,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c28 {
+  .c29 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -5570,7 +5606,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c28 {
+  .c29 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -5648,7 +5684,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 className="c9"
               >
                 <span
-                  className="c12"
+                  className="c12 c13"
                   color="green"
                   height="0.6875rem"
                   width="0.6875rem"
@@ -5657,7 +5693,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
               </div>
             </div>
             <div
-              className="c13"
+              className="c14"
             >
               <div
                 className="c9"
@@ -5666,7 +5702,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c10"
                   >
                     Created: 
                   </label>
@@ -5685,7 +5721,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c10"
                   >
                     Updated: 
                   </label>
@@ -5701,17 +5737,17 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             </div>
           </div>
           <div
-            className="c15"
+            className="c16"
           >
             <div
-              className="c16"
+              className="c17"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c17 c18 c19"
+                  className="c18 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -5721,6 +5757,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   <svg
                     className=""
                     height="15"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -5778,7 +5815,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c20 c18 c19"
+                  className="c21 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -5788,6 +5825,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   <svg
                     className=""
                     height="15"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -5848,7 +5886,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c21 c18 c19"
+                  className="c22 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -5858,6 +5896,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   <svg
                     className=""
                     height="14"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -5911,7 +5950,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c22 c18 c19"
+                  className="c23 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -5921,6 +5960,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   <svg
                     className=""
                     height="14"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -5977,7 +6017,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c21 c18 c19"
+                  className="c22 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -5987,6 +6027,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   <svg
                     className=""
                     height="21"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -6024,7 +6065,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c22 c18 c19"
+                  className="c23 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -6034,6 +6075,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   <svg
                     className=""
                     height="21"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -6071,14 +6113,14 @@ exports[`renders <Summary instance /> without throwing 2`] = `
               </span>
             </div>
             <div
-              className="c23"
+              className="c24"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c24 c18 c19"
+                  className="c25 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -6088,6 +6130,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   <svg
                     className=""
                     height="12"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -6125,7 +6168,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c25 c18 c19"
+                  className="c26 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -6135,6 +6178,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   <svg
                     className=""
                     height="12"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -6173,10 +6217,10 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             </div>
           </div>
           <div
-            className="c26"
+            className="c27"
           >
             <div
-              className="c27 c0"
+              className="c28 c0"
               height="0.0625rem"
             />
           </div>
@@ -6184,19 +6228,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value="2252839a"
@@ -6208,8 +6252,9 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -6253,19 +6298,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value="2252839a-e698-ceec-afac-9549ad0c6624"
@@ -6277,8 +6322,9 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -6322,19 +6368,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value="70bb1cee-dba3-11e3-a799-002590e4f2b0"
@@ -6346,8 +6392,9 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -6391,19 +6438,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 Image UUID
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value="19aa3328-0025-11e7-a19a-c39077bfd4cf"
@@ -6415,8 +6462,9 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -6460,19 +6508,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value="ssh root@72.2.119.146"
@@ -6484,8 +6532,9 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -6529,19 +6578,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 IP address 1
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value="72.2.119.146"
@@ -6553,8 +6602,9 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -6598,19 +6648,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 IP address 2
               </label>
               <div
-                className="c33"
+                className="c34"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value="10.112.5.63"
@@ -6622,8 +6672,9 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -6709,7 +6760,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-left: -0.5rem;
 }
 
-.c15 {
+.c16 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -6746,7 +6797,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding-left: 0.5rem;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -6755,7 +6806,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding-left: 0.5rem;
 }
 
-.c25 {
+.c26 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -6764,7 +6815,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding-left: 0.5rem;
 }
 
-.c30 {
+.c31 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -6778,11 +6829,11 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 1rem;
 }
 
-.c13 {
+.c14 {
   margin-top: 0.25rem;
 }
 
-.c28 {
+.c29 {
   margin-top: 2rem;
   margin-bottom: 4rem;
 }
@@ -6791,14 +6842,54 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding: 2rem;
 }
 
-.c21 {
+.c20 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  text-transform: none;
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  min-width: 7.5rem;
+}
+
+.c20::-moz-focus-inner,
+.c20[type='button']::-moz-focus-inner,
+.c20[type='reset']::-moz-focus-inner,
+.c20[type='submit']::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+.c20:-moz-focusring,
+.c20[type='button']:-moz-focusring,
+.c20[type='reset']:-moz-focusring,
+.c20[type='submit']:-moz-focusring {
+  outline: 0.0625rem dotted ButtonText;
+}
+
+.c20 + button {
+  margin-left: 0.375rem;
+}
+
+.c12 {
+  margin-top: 0.0625rem;
+  margin-right: 0.375rem;
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 50%;
+}
+
+.c22 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
   animation: iCqDak 1.5s ease-out 0s infinite;
 }
 
-.c22 {
+.c23 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@@ -6807,7 +6898,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   animation-delay: 0.5s;
 }
 
-.c23 {
+.c24 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
   -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@@ -6816,7 +6907,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   animation-delay: 1s;
 }
 
-.c20 {
+.c21 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -6845,42 +6936,10 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 .c19 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  text-transform: none;
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  min-width: 7.5rem;
-}
-
-.c19::-moz-focus-inner,
-.c19[type='button']::-moz-focus-inner,
-.c19[type='reset']::-moz-focus-inner,
-.c19[type='submit']::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-
-.c19:-moz-focusring,
-.c19[type='button']:-moz-focusring,
-.c19[type='reset']:-moz-focusring,
-.c19[type='submit']:-moz-focusring {
-  outline: 0.0625rem dotted ButtonText;
-}
-
-.c19 + button {
-  margin-left: 0.375rem;
-}
-
-.c18 {
   display: inline-block;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -6940,75 +6999,75 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   align-items: center;
 }
 
-.c17:focus {
+.c18:focus {
   outline: 0;
   text-decoration: none;
   background-color: rgb(59,70,204);
   border-color: rgb(45,56,132);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c17[disabled] {
+.c18[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c17 svg + span {
+.c18 svg + span {
   margin-left: 0.75rem;
 }
 
-.c17 svg {
+.c18 svg {
   max-height: 1.125rem;
 }
 
-.c24 {
+.c25 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -7066,221 +7125,71 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   font-weight: 500;
 }
 
-.c24:focus {
+.c25:focus {
   outline: 0;
   text-decoration: none;
   background-color: rgb(59,70,204);
   border-color: rgb(45,56,132);
 }
 
-.c24:hover {
+.c25:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c24[disabled] {
+.c25[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c24:focus {
+.c25:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c24:hover {
+.c25:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c24:focus {
+.c25:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c24:hover {
+.c25:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c24 svg + span {
+.c25 svg + span {
   margin-left: 0.75rem;
 }
 
-.c24 svg {
-  max-height: 1.125rem;
-}
-
-.c26 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  float: right;
-}
-
-.c26:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c26:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c26[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c26:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c26:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c26:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-}
-
-.c26:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(210,67,58);
-}
-
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(210,67,58);
-}
-
-.c26:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c26:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c26 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c26 svg {
+.c25 svg {
   max-height: 1.125rem;
 }
 
@@ -7335,6 +7244,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   color: rgb(216,216,216);
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -7343,7 +7255,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
   float: right;
 }
 
@@ -7432,6 +7343,154 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   max-height: 1.125rem;
 }
 
+.c28 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+  float: right;
+}
+
+.c28:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c28:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c28[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c28:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c28:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c28:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+}
+
+.c28:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(210,67,58);
+}
+
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(210,67,58);
+}
+
+.c28:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c28:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c28 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c28 svg {
+  max-height: 1.125rem;
+}
+
 .c10 {
   font-size: 0.9375rem;
   font-style: normal;
@@ -7441,6 +7500,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   text-align: left;
 }
 
+.c32 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
 .c7 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -7462,22 +7534,17 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-top: 1.5rem;
 }
 
-.c29 {
+.c30 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c12 {
+.c13 {
   width: 0.375rem;
   height: 0.375rem;
   border-radius: 50%;
   display: inline-block;
-  margin-top: 0.0625rem;
-  margin-right: 0.375rem;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 50%;
 }
 
 .c2 {
@@ -7546,7 +7613,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0.4375rem;
 }
 
-.c33 {
+.c34 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -7570,46 +7637,46 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   outline: 0;
 }
 
-.c33::-webkit-input-placeholder {
+.c34::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33::-moz-placeholder {
+.c34::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:-ms-input-placeholder {
+.c34:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:invalid {
+.c34:invalid {
   box-shadow: none;
 }
 
-.c33:disabled {
+.c34:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c33:disabled::-webkit-input-placeholder {
+.c34:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled::-moz-placeholder {
+.c34:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled:-ms-input-placeholder {
+.c34:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:focus {
+.c34:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c35 {
+.c36 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -7632,59 +7699,46 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   outline: 0;
 }
 
-.c35::-webkit-input-placeholder {
+.c36::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35::-moz-placeholder {
+.c36::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:-ms-input-placeholder {
+.c36:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:invalid {
+.c36:invalid {
   box-shadow: none;
 }
 
-.c35:disabled {
+.c36:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c35:disabled::-webkit-input-placeholder {
+.c36:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled::-moz-placeholder {
+.c36:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:disabled:-ms-input-placeholder {
+.c36:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c35:focus {
+.c36:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c31 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c14 {
+.c15 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
@@ -7704,7 +7758,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   justify-content: flex-start;
 }
 
-.c32 {
+.c33 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -7716,11 +7770,11 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   align-items: center;
 }
 
-.c32 input {
+.c33 input {
   padding-right: 1.875rem;
 }
 
-.c32 div {
+.c33 div {
   position: relative;
   left: -1.625rem;
 }
@@ -7739,7 +7793,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin: 0 1.125rem;
 }
 
-.c34 {
+.c35 {
   cursor: pointer;
 }
 
@@ -7753,7 +7807,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c15 {
+  .c16 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -7802,7 +7856,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -7812,7 +7866,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c25 {
+  .c26 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -7822,7 +7876,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c30 {
+  .c31 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -7832,7 +7886,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:64em) {
-  .c30 {
+  .c31 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -7908,7 +7962,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 className="c9"
               >
                 <span
-                  className="c12"
+                  className="c12 c13"
                   color={undefined}
                   height="0.6875rem"
                   width="0.6875rem"
@@ -7917,7 +7971,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               </div>
             </div>
             <div
-              className="c13"
+              className="c14"
             >
               <div
                 className="c9"
@@ -7926,7 +7980,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c10"
                   >
                     Created: 
                   </label>
@@ -7945,7 +7999,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c10"
                   >
                     Updated: 
                   </label>
@@ -7961,17 +8015,17 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
             </div>
           </div>
           <div
-            className="c15"
+            className="c16"
           >
             <div
-              className="c16"
+              className="c17"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c17 c18 c19"
+                  className="c18 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -7979,28 +8033,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   type="button"
                 >
                   <div
-                    className="c20"
+                    className="c21"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c21"
+                        className="c22"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c22"
+                        className="c23"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c23"
+                        className="c24"
                         height="6"
                         width="6"
                         x="20"
@@ -8015,7 +8069,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c24 c18 c19"
+                  className="c25 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -8023,28 +8077,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   type="button"
                 >
                   <div
-                    className="c20"
+                    className="c21"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c21"
+                        className="c22"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c22"
+                        className="c23"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c23"
+                        className="c24"
                         height="6"
                         width="6"
                         x="20"
@@ -8059,7 +8113,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c17 c18 c19"
+                  className="c18 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -8067,28 +8121,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   type="button"
                 >
                   <div
-                    className="c20"
+                    className="c21"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c21"
+                        className="c22"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c22"
+                        className="c23"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c23"
+                        className="c24"
                         height="6"
                         width="6"
                         x="20"
@@ -8103,7 +8157,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c24 c18 c19"
+                  className="c25 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -8111,28 +8165,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   type="button"
                 >
                   <div
-                    className="c20"
+                    className="c21"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c21"
+                        className="c22"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c22"
+                        className="c23"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c23"
+                        className="c24"
                         height="6"
                         width="6"
                         x="20"
@@ -8147,7 +8201,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c17 c18 c19"
+                  className="c18 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -8155,28 +8209,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   type="button"
                 >
                   <div
-                    className="c20"
+                    className="c21"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c21"
+                        className="c22"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c22"
+                        className="c23"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c23"
+                        className="c24"
                         height="6"
                         width="6"
                         x="20"
@@ -8191,7 +8245,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c24 c18 c19"
+                  className="c25 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -8199,28 +8253,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   type="button"
                 >
                   <div
-                    className="c20"
+                    className="c21"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c21"
+                        className="c22"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c22"
+                        className="c23"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c23"
+                        className="c24"
                         height="6"
                         width="6"
                         x="20"
@@ -8232,14 +8286,14 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               </span>
             </div>
             <div
-              className="c25"
+              className="c26"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c26 c18 c19"
+                  className="c27 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -8247,28 +8301,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   type="button"
                 >
                   <div
-                    className="c20"
+                    className="c21"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c21"
+                        className="c22"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c22"
+                        className="c23"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c23"
+                        className="c24"
                         height="6"
                         width="6"
                         x="20"
@@ -8283,7 +8337,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c27 c18 c19"
+                  className="c28 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -8291,28 +8345,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   type="button"
                 >
                   <div
-                    className="c20"
+                    className="c21"
                   >
                     <svg
                       height="10"
                       width="28"
                     >
                       <rect
-                        className="c21"
+                        className="c22"
                         height="6"
                         width="6"
                         x="2"
                         y="2"
                       />
                       <rect
-                        className="c22"
+                        className="c23"
                         height="6"
                         width="6"
                         x="11"
                         y="2"
                       />
                       <rect
-                        className="c23"
+                        className="c24"
                         height="6"
                         width="6"
                         x="20"
@@ -8325,10 +8379,10 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
             </div>
           </div>
           <div
-            className="c28"
+            className="c29"
           >
             <div
-              className="c29 c0"
+              className="c30 c0"
               height="0.0625rem"
             />
           </div>
@@ -8336,19 +8390,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
             className="c0"
           >
             <div
-              className="c30"
+              className="c31"
             >
               <label
-                className="c31"
+                className="c32"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c32"
+                className="c33"
               >
                 <input
-                  className="c33"
+                  className="c34"
                   disabled={false}
                   id=""
                   value=""
@@ -8360,8 +8414,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   tag={false}
                 >
                   <svg
-                    className="c34 "
+                    className="c35 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -8405,19 +8460,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
             className="c0"
           >
             <div
-              className="c30"
+              className="c31"
             >
               <label
-                className="c31"
+                className="c32"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c32"
+                className="c33"
               >
                 <input
-                  className="c33"
+                  className="c34"
                   disabled={false}
                   id=""
                   value={undefined}
@@ -8429,8 +8484,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   tag={false}
                 >
                   <svg
-                    className="c34 "
+                    className="c35 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -8474,19 +8530,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
             className="c0"
           >
             <div
-              className="c30"
+              className="c31"
             >
               <label
-                className="c31"
+                className="c32"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c32"
+                className="c33"
               >
                 <input
-                  className="c33"
+                  className="c34"
                   disabled={false}
                   id=""
                   value={undefined}
@@ -8498,8 +8554,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   tag={false}
                 >
                   <svg
-                    className="c34 "
+                    className="c35 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -8543,19 +8600,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
             className="c0"
           >
             <div
-              className="c30"
+              className="c31"
             >
               <label
-                className="c31"
+                className="c32"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c32"
+                className="c33"
               >
                 <input
-                  className="c35"
+                  className="c36"
                   disabled={false}
                   id=""
                   value="ssh root@undefined"
@@ -8567,8 +8624,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   tag={false}
                 >
                   <svg
-                    className="c34 "
+                    className="c35 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -8654,7 +8712,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   margin-left: -0.5rem;
 }
 
-.c15 {
+.c16 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -8691,7 +8749,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -8700,7 +8758,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c23 {
+.c24 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -8709,7 +8767,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c28 {
+.c29 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -8723,11 +8781,11 @@ exports[`renders <Summary state /> without throwing 1`] = `
   margin-bottom: 1rem;
 }
 
-.c13 {
+.c14 {
   margin-top: 0.25rem;
 }
 
-.c26 {
+.c27 {
   margin-top: 2rem;
   margin-bottom: 4rem;
 }
@@ -8736,7 +8794,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   padding: 2rem;
 }
 
-.c19 {
+.c20 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -8749,30 +8807,38 @@ exports[`renders <Summary state /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c19::-moz-focus-inner,
-.c19[type='button']::-moz-focus-inner,
-.c19[type='reset']::-moz-focus-inner,
-.c19[type='submit']::-moz-focus-inner {
+.c20::-moz-focus-inner,
+.c20[type='button']::-moz-focus-inner,
+.c20[type='reset']::-moz-focus-inner,
+.c20[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c19:-moz-focusring,
-.c19[type='button']:-moz-focusring,
-.c19[type='reset']:-moz-focusring,
-.c19[type='submit']:-moz-focusring {
+.c20:-moz-focusring,
+.c20[type='button']:-moz-focusring,
+.c20[type='reset']:-moz-focusring,
+.c20[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c19 + button {
+.c20 + button {
   margin-left: 0.375rem;
 }
 
-.c18 {
+.c12 {
+  margin-top: 0.0625rem;
+  margin-right: 0.375rem;
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 50%;
+}
+
+.c19 {
   display: inline-block;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -8832,75 +8898,75 @@ exports[`renders <Summary state /> without throwing 1`] = `
   align-items: center;
 }
 
-.c17:focus {
+.c18:focus {
   outline: 0;
   text-decoration: none;
   background-color: rgb(59,70,204);
   border-color: rgb(45,56,132);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c17[disabled] {
+.c18[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c17 svg + span {
+.c18 svg + span {
   margin-left: 0.75rem;
 }
 
-.c17 svg {
+.c18 svg {
   max-height: 1.125rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -8958,129 +9024,6 @@ exports[`renders <Summary state /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c20:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c20:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c20[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c20:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c20:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c20:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c20:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c20 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c20 svg {
-  max-height: 1.125rem;
-}
-
-.c21 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
 .c21:focus {
   outline: 0;
   text-decoration: none;
@@ -9124,6 +9067,23 @@ exports[`renders <Summary state /> without throwing 1`] = `
   border-color: rgb(216,216,216);
 }
 
+.c21:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c21:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c21:active,
+.c21:active:hover,
+.c21:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
 .c21 svg + span {
   margin-left: 0.75rem;
 }
@@ -9174,6 +9134,9 @@ exports[`renders <Summary state /> without throwing 1`] = `
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -9182,7 +9145,6 @@ exports[`renders <Summary state /> without throwing 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
 }
 
 .c22:focus {
@@ -9236,7 +9198,111 @@ exports[`renders <Summary state /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c24 {
+.c23 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+}
+
+.c23:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c23:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c23[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c23:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c23:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c23 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c23 svg {
+  max-height: 1.125rem;
+}
+
+.c25 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -9296,132 +9362,6 @@ exports[`renders <Summary state /> without throwing 1`] = `
   float: right;
 }
 
-.c24:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c24:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c24[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c24:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c24:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c24:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-}
-
-.c24:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(210,67,58);
-}
-
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(210,67,58);
-}
-
-.c24 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c24 svg {
-  max-height: 1.125rem;
-}
-
-.c25 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  font-weight: 500;
-  float: right;
-}
-
 .c25:focus {
   outline: 0;
   text-decoration: none;
@@ -9490,6 +9430,132 @@ exports[`renders <Summary state /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c26 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+  float: right;
+}
+
+.c26:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c26:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c26[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c26:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c26:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c26:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+}
+
+.c26:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(210,67,58);
+}
+
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(210,67,58);
+}
+
+.c26 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c26 svg {
+  max-height: 1.125rem;
+}
+
 .c10 {
   font-size: 0.9375rem;
   font-style: normal;
@@ -9499,6 +9565,19 @@ exports[`renders <Summary state /> without throwing 1`] = `
   text-align: left;
 }
 
+.c30 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
 .c7 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -9520,23 +9599,18 @@ exports[`renders <Summary state /> without throwing 1`] = `
   margin-top: 1.5rem;
 }
 
-.c27 {
+.c28 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c12 {
+.c13 {
   width: 0.375rem;
   height: 0.375rem;
   border-radius: 50%;
   background-color: rgb(0,152,88);
   display: inline-block;
-  margin-top: 0.0625rem;
-  margin-right: 0.375rem;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 50%;
 }
 
 .c2 {
@@ -9605,7 +9679,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c31 {
+.c32 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -9629,46 +9703,46 @@ exports[`renders <Summary state /> without throwing 1`] = `
   outline: 0;
 }
 
-.c31::-webkit-input-placeholder {
+.c32::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31::-moz-placeholder {
+.c32::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:-ms-input-placeholder {
+.c32:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:invalid {
+.c32:invalid {
   box-shadow: none;
 }
 
-.c31:disabled {
+.c32:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c31:disabled::-webkit-input-placeholder {
+.c32:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:disabled::-moz-placeholder {
+.c32:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:disabled:-ms-input-placeholder {
+.c32:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:focus {
+.c32:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c33 {
+.c34 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -9691,59 +9765,46 @@ exports[`renders <Summary state /> without throwing 1`] = `
   outline: 0;
 }
 
-.c33::-webkit-input-placeholder {
+.c34::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33::-moz-placeholder {
+.c34::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:-ms-input-placeholder {
+.c34:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:invalid {
+.c34:invalid {
   box-shadow: none;
 }
 
-.c33:disabled {
+.c34:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c33:disabled::-webkit-input-placeholder {
+.c34:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled::-moz-placeholder {
+.c34:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled:-ms-input-placeholder {
+.c34:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:focus {
+.c34:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c29 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c14 {
+.c15 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
@@ -9763,7 +9824,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   justify-content: flex-start;
 }
 
-.c30 {
+.c31 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -9775,11 +9836,11 @@ exports[`renders <Summary state /> without throwing 1`] = `
   align-items: center;
 }
 
-.c30 input {
+.c31 input {
   padding-right: 1.875rem;
 }
 
-.c30 div {
+.c31 div {
   position: relative;
   left: -1.625rem;
 }
@@ -9798,7 +9859,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
   margin: 0 1.125rem;
 }
 
-.c32 {
+.c33 {
   cursor: pointer;
 }
 
@@ -9812,7 +9873,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c15 {
+  .c16 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -9861,7 +9922,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -9871,7 +9932,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c23 {
+  .c24 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -9881,7 +9942,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c28 {
+  .c29 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -9891,7 +9952,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c28 {
+  .c29 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -9967,7 +10028,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                 className="c9"
               >
                 <span
-                  className="c12"
+                  className="c12 c13"
                   color="green"
                   height="0.6875rem"
                   width="0.6875rem"
@@ -9976,7 +10037,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
               </div>
             </div>
             <div
-              className="c13"
+              className="c14"
             >
               <div
                 className="c9"
@@ -9985,7 +10046,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c10"
                   >
                     Created: 
                   </label>
@@ -10004,7 +10065,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c10"
                   >
                     Updated: 
                   </label>
@@ -10020,17 +10081,17 @@ exports[`renders <Summary state /> without throwing 1`] = `
             </div>
           </div>
           <div
-            className="c15"
+            className="c16"
           >
             <div
-              className="c16"
+              className="c17"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c17 c18 c19"
+                  className="c18 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -10040,6 +10101,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   <svg
                     className=""
                     height="15"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -10097,7 +10159,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c20 c18 c19"
+                  className="c21 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -10107,6 +10169,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   <svg
                     className=""
                     height="15"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -10167,7 +10230,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c21 c18 c19"
+                  className="c22 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -10177,6 +10240,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   <svg
                     className=""
                     height="14"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -10230,7 +10294,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c22 c18 c19"
+                  className="c23 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -10240,6 +10304,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   <svg
                     className=""
                     height="14"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -10296,7 +10361,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c21 c18 c19"
+                  className="c22 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -10306,6 +10371,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   <svg
                     className=""
                     height="21"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -10343,7 +10409,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c22 c18 c19"
+                  className="c23 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -10353,6 +10419,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   <svg
                     className=""
                     height="21"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -10390,14 +10457,14 @@ exports[`renders <Summary state /> without throwing 1`] = `
               </span>
             </div>
             <div
-              className="c23"
+              className="c24"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c24 c18 c19"
+                  className="c25 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -10407,6 +10474,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   <svg
                     className=""
                     height="12"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -10444,7 +10512,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c25 c18 c19"
+                  className="c26 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -10454,6 +10522,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   <svg
                     className=""
                     height="12"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -10492,10 +10561,10 @@ exports[`renders <Summary state /> without throwing 1`] = `
             </div>
           </div>
           <div
-            className="c26"
+            className="c27"
           >
             <div
-              className="c27 c0"
+              className="c28 c0"
               height="0.0625rem"
             />
           </div>
@@ -10503,19 +10572,19 @@ exports[`renders <Summary state /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value=""
@@ -10527,8 +10596,9 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -10572,19 +10642,19 @@ exports[`renders <Summary state /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value={undefined}
@@ -10596,8 +10666,9 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -10641,19 +10712,19 @@ exports[`renders <Summary state /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value={undefined}
@@ -10665,8 +10736,9 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -10710,19 +10782,19 @@ exports[`renders <Summary state /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c33"
+                  className="c34"
                   disabled={false}
                   id=""
                   value="ssh root@undefined"
@@ -10734,8 +10806,9 @@ exports[`renders <Summary state /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -10821,7 +10894,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   margin-left: -0.5rem;
 }
 
-.c15 {
+.c16 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -10858,7 +10931,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   padding-left: 0.5rem;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -10867,7 +10940,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   padding-left: 0.5rem;
 }
 
-.c23 {
+.c24 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -10876,7 +10949,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   padding-left: 0.5rem;
 }
 
-.c28 {
+.c29 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -10890,11 +10963,11 @@ exports[`renders <Summary state /> without throwing 2`] = `
   margin-bottom: 1rem;
 }
 
-.c13 {
+.c14 {
   margin-top: 0.25rem;
 }
 
-.c26 {
+.c27 {
   margin-top: 2rem;
   margin-bottom: 4rem;
 }
@@ -10903,7 +10976,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   padding: 2rem;
 }
 
-.c19 {
+.c20 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -10916,30 +10989,38 @@ exports[`renders <Summary state /> without throwing 2`] = `
   min-width: 7.5rem;
 }
 
-.c19::-moz-focus-inner,
-.c19[type='button']::-moz-focus-inner,
-.c19[type='reset']::-moz-focus-inner,
-.c19[type='submit']::-moz-focus-inner {
+.c20::-moz-focus-inner,
+.c20[type='button']::-moz-focus-inner,
+.c20[type='reset']::-moz-focus-inner,
+.c20[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c19:-moz-focusring,
-.c19[type='button']:-moz-focusring,
-.c19[type='reset']:-moz-focusring,
-.c19[type='submit']:-moz-focusring {
+.c20:-moz-focusring,
+.c20[type='button']:-moz-focusring,
+.c20[type='reset']:-moz-focusring,
+.c20[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c19 + button {
+.c20 + button {
   margin-left: 0.375rem;
 }
 
-.c18 {
+.c12 {
+  margin-top: 0.0625rem;
+  margin-right: 0.375rem;
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 50%;
+}
+
+.c19 {
   display: inline-block;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -10999,132 +11080,6 @@ exports[`renders <Summary state /> without throwing 2`] = `
   align-items: center;
 }
 
-.c21:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c21:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c21[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c21:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c21:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c21:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c21:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c21 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c21 svg {
-  max-height: 1.125rem;
-}
-
-.c22 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  font-weight: 500;
-}
-
 .c22:focus {
   outline: 0;
   text-decoration: none;
@@ -11193,7 +11148,133 @@ exports[`renders <Summary state /> without throwing 2`] = `
   max-height: 1.125rem;
 }
 
-.c17 {
+.c23 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+}
+
+.c23:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c23:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c23[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c23:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c23:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c23:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c23:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c23 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c23 svg {
+  max-height: 1.125rem;
+}
+
+.c18 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -11248,58 +11329,58 @@ exports[`renders <Summary state /> without throwing 2`] = `
   align-items: center;
 }
 
-.c17:focus {
+.c18:focus {
   outline: 0;
   text-decoration: none;
   background-color: rgb(59,70,204);
   border-color: rgb(45,56,132);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c17[disabled] {
+.c18[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c17 svg + span {
+.c18 svg + span {
   margin-left: 0.75rem;
 }
 
-.c17 svg {
+.c18 svg {
   max-height: 1.125rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -11352,182 +11433,54 @@ exports[`renders <Summary state /> without throwing 2`] = `
   font-weight: 500;
 }
 
-.c20:focus {
+.c21:focus {
   outline: 0;
   text-decoration: none;
   background-color: rgb(59,70,204);
   border-color: rgb(45,56,132);
 }
 
-.c20:hover {
+.c21:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
+.c21:active,
+.c21:active:hover,
+.c21:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c20[disabled] {
+.c21[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c20:focus {
+.c21:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c20:hover {
+.c21:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
+.c21:active,
+.c21:active:hover,
+.c21:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c20 svg + span {
+.c21 svg + span {
   margin-left: 0.75rem;
 }
 
-.c20 svg {
-  max-height: 1.125rem;
-}
-
-.c24 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  float: right;
-}
-
-.c24:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c24:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c24[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c24:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c24:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c24:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-}
-
-.c24:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(210,67,58);
-}
-
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(210,67,58);
-}
-
-.c24 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c24 svg {
+.c21 svg {
   max-height: 1.125rem;
 }
 
@@ -11577,6 +11530,9 @@ exports[`renders <Summary state /> without throwing 2`] = `
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(210,67,58);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -11585,7 +11541,6 @@ exports[`renders <Summary state /> without throwing 2`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
   float: right;
 }
 
@@ -11657,6 +11612,132 @@ exports[`renders <Summary state /> without throwing 2`] = `
   max-height: 1.125rem;
 }
 
+.c26 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+  float: right;
+}
+
+.c26:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c26:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c26[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c26:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c26:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c26:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+}
+
+.c26:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(210,67,58);
+}
+
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(210,67,58);
+}
+
+.c26 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c26 svg {
+  max-height: 1.125rem;
+}
+
 .c10 {
   font-size: 0.9375rem;
   font-style: normal;
@@ -11666,6 +11747,19 @@ exports[`renders <Summary state /> without throwing 2`] = `
   text-align: left;
 }
 
+.c30 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
 .c7 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -11687,23 +11781,18 @@ exports[`renders <Summary state /> without throwing 2`] = `
   margin-top: 1.5rem;
 }
 
-.c27 {
+.c28 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c12 {
+.c13 {
   width: 0.375rem;
   height: 0.375rem;
   border-radius: 50%;
   background-color: rgb(216,216,216);
   display: inline-block;
-  margin-top: 0.0625rem;
-  margin-right: 0.375rem;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 50%;
 }
 
 .c2 {
@@ -11772,7 +11861,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c31 {
+.c32 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -11796,46 +11885,46 @@ exports[`renders <Summary state /> without throwing 2`] = `
   outline: 0;
 }
 
-.c31::-webkit-input-placeholder {
+.c32::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31::-moz-placeholder {
+.c32::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:-ms-input-placeholder {
+.c32:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:invalid {
+.c32:invalid {
   box-shadow: none;
 }
 
-.c31:disabled {
+.c32:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c31:disabled::-webkit-input-placeholder {
+.c32:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:disabled::-moz-placeholder {
+.c32:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:disabled:-ms-input-placeholder {
+.c32:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:focus {
+.c32:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c33 {
+.c34 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -11858,59 +11947,46 @@ exports[`renders <Summary state /> without throwing 2`] = `
   outline: 0;
 }
 
-.c33::-webkit-input-placeholder {
+.c34::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33::-moz-placeholder {
+.c34::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:-ms-input-placeholder {
+.c34:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:invalid {
+.c34:invalid {
   box-shadow: none;
 }
 
-.c33:disabled {
+.c34:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c33:disabled::-webkit-input-placeholder {
+.c34:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled::-moz-placeholder {
+.c34:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled:-ms-input-placeholder {
+.c34:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:focus {
+.c34:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c29 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c14 {
+.c15 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
@@ -11930,7 +12006,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   justify-content: flex-start;
 }
 
-.c30 {
+.c31 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -11942,11 +12018,11 @@ exports[`renders <Summary state /> without throwing 2`] = `
   align-items: center;
 }
 
-.c30 input {
+.c31 input {
   padding-right: 1.875rem;
 }
 
-.c30 div {
+.c31 div {
   position: relative;
   left: -1.625rem;
 }
@@ -11965,7 +12041,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   margin: 0 1.125rem;
 }
 
-.c32 {
+.c33 {
   cursor: pointer;
 }
 
@@ -11979,7 +12055,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c15 {
+  .c16 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -12028,7 +12104,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -12038,7 +12114,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c23 {
+  .c24 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -12048,7 +12124,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c28 {
+  .c29 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -12058,7 +12134,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c28 {
+  .c29 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -12134,7 +12210,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 className="c9"
               >
                 <span
-                  className="c12"
+                  className="c12 c13"
                   color="grey"
                   height="0.6875rem"
                   width="0.6875rem"
@@ -12143,7 +12219,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
               </div>
             </div>
             <div
-              className="c13"
+              className="c14"
             >
               <div
                 className="c9"
@@ -12152,7 +12228,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c10"
                   >
                     Created: 
                   </label>
@@ -12171,7 +12247,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c10"
                   >
                     Updated: 
                   </label>
@@ -12187,17 +12263,17 @@ exports[`renders <Summary state /> without throwing 2`] = `
             </div>
           </div>
           <div
-            className="c15"
+            className="c16"
           >
             <div
-              className="c16"
+              className="c17"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c17 c18 c19"
+                  className="c18 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -12207,6 +12283,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   <svg
                     className=""
                     height="15"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -12264,7 +12341,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c20 c18 c19"
+                  className="c21 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -12274,6 +12351,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   <svg
                     className=""
                     height="15"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -12334,7 +12412,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c21 c18 c19"
+                  className="c22 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -12344,6 +12422,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   <svg
                     className=""
                     height="14"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -12397,7 +12476,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c22 c18 c19"
+                  className="c23 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -12407,6 +12486,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   <svg
                     className=""
                     height="14"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -12463,7 +12543,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c21 c18 c19"
+                  className="c22 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -12473,6 +12553,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   <svg
                     className=""
                     height="21"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -12510,7 +12591,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c22 c18 c19"
+                  className="c23 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -12520,6 +12601,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   <svg
                     className=""
                     height="21"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -12557,14 +12639,14 @@ exports[`renders <Summary state /> without throwing 2`] = `
               </span>
             </div>
             <div
-              className="c23"
+              className="c24"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c24 c18 c19"
+                  className="c25 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -12574,6 +12656,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   <svg
                     className=""
                     height="12"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -12611,7 +12694,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c25 c18 c19"
+                  className="c26 c19 c20"
                   disabled={false}
                   href=""
                   icon={true}
@@ -12621,6 +12704,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   <svg
                     className=""
                     height="12"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -12659,10 +12743,10 @@ exports[`renders <Summary state /> without throwing 2`] = `
             </div>
           </div>
           <div
-            className="c26"
+            className="c27"
           >
             <div
-              className="c27 c0"
+              className="c28 c0"
               height="0.0625rem"
             />
           </div>
@@ -12670,19 +12754,19 @@ exports[`renders <Summary state /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value=""
@@ -12694,8 +12778,9 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -12739,19 +12824,19 @@ exports[`renders <Summary state /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value={undefined}
@@ -12763,8 +12848,9 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -12808,19 +12894,19 @@ exports[`renders <Summary state /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value={undefined}
@@ -12832,8 +12918,9 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -12877,19 +12964,19 @@ exports[`renders <Summary state /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c28"
+              className="c29"
             >
               <label
-                className="c29"
+                className="c30"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c30"
+                className="c31"
               >
                 <input
-                  className="c33"
+                  className="c34"
                   disabled={false}
                   id=""
                   value="ssh root@undefined"
@@ -12901,8 +12988,9 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c32 "
+                    className="c33 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -12988,7 +13076,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   margin-left: -0.5rem;
 }
 
-.c15 {
+.c16 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -13025,7 +13113,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   padding-left: 0.5rem;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -13034,7 +13122,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   padding-left: 0.5rem;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -13043,7 +13131,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   padding-left: 0.5rem;
 }
 
-.c26 {
+.c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -13057,11 +13145,11 @@ exports[`renders <Summary state /> without throwing 3`] = `
   margin-bottom: 1rem;
 }
 
-.c13 {
+.c14 {
   margin-top: 0.25rem;
 }
 
-.c24 {
+.c25 {
   margin-top: 2rem;
   margin-bottom: 4rem;
 }
@@ -13070,7 +13158,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   padding: 2rem;
 }
 
-.c19 {
+.c20 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -13083,30 +13171,38 @@ exports[`renders <Summary state /> without throwing 3`] = `
   min-width: 7.5rem;
 }
 
-.c19::-moz-focus-inner,
-.c19[type='button']::-moz-focus-inner,
-.c19[type='reset']::-moz-focus-inner,
-.c19[type='submit']::-moz-focus-inner {
+.c20::-moz-focus-inner,
+.c20[type='button']::-moz-focus-inner,
+.c20[type='reset']::-moz-focus-inner,
+.c20[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c19:-moz-focusring,
-.c19[type='button']:-moz-focusring,
-.c19[type='reset']:-moz-focusring,
-.c19[type='submit']:-moz-focusring {
+.c20:-moz-focusring,
+.c20[type='button']:-moz-focusring,
+.c20[type='reset']:-moz-focusring,
+.c20[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c19 + button {
+.c20 + button {
   margin-left: 0.375rem;
 }
 
-.c18 {
+.c12 {
+  margin-top: 0.0625rem;
+  margin-right: 0.375rem;
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 50%;
+}
+
+.c19 {
   display: inline-block;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -13166,75 +13262,75 @@ exports[`renders <Summary state /> without throwing 3`] = `
   align-items: center;
 }
 
-.c17:focus {
+.c18:focus {
   outline: 0;
   text-decoration: none;
   background-color: rgb(59,70,204);
   border-color: rgb(45,56,132);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c17[disabled] {
+.c18[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c17:focus {
+.c18:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c17:hover {
+.c18:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c17:active,
-.c17:active:hover,
-.c17:active:focus {
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c17 svg + span {
+.c18 svg + span {
   margin-left: 0.75rem;
 }
 
-.c17 svg {
+.c18 svg {
   max-height: 1.125rem;
 }
 
-.c20 {
+.c21 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -13292,221 +13388,71 @@ exports[`renders <Summary state /> without throwing 3`] = `
   font-weight: 500;
 }
 
-.c20:focus {
+.c21:focus {
   outline: 0;
   text-decoration: none;
   background-color: rgb(59,70,204);
   border-color: rgb(45,56,132);
 }
 
-.c20:hover {
+.c21:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
+.c21:active,
+.c21:active:hover,
+.c21:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c20[disabled] {
+.c21[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c20:focus {
+.c21:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c20:hover {
+.c21:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
+.c21:active,
+.c21:active:hover,
+.c21:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c20:focus {
+.c21:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c20:hover {
+.c21:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c20:active,
-.c20:active:hover,
-.c20:active:focus {
+.c21:active,
+.c21:active:hover,
+.c21:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c20 svg + span {
+.c21 svg + span {
   margin-left: 0.75rem;
 }
 
-.c20 svg {
-  max-height: 1.125rem;
-}
-
-.c22 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  float: right;
-}
-
-.c22:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c22:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c22[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c22:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c22:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c22:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-}
-
-.c22:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(210,67,58);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(210,67,58);
-}
-
-.c22:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c22:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c22 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c22 svg {
+.c21 svg {
   max-height: 1.125rem;
 }
 
@@ -13561,6 +13507,9 @@ exports[`renders <Summary state /> without throwing 3`] = `
   color: rgb(216,216,216);
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -13569,7 +13518,6 @@ exports[`renders <Summary state /> without throwing 3`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
   float: right;
 }
 
@@ -13658,6 +13606,154 @@ exports[`renders <Summary state /> without throwing 3`] = `
   max-height: 1.125rem;
 }
 
+.c24 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+  float: right;
+}
+
+.c24:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c24:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c24[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c24:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c24:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c24:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+}
+
+.c24:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(210,67,58);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(210,67,58);
+}
+
+.c24:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c24:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c24 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c24 svg {
+  max-height: 1.125rem;
+}
+
 .c10 {
   font-size: 0.9375rem;
   font-style: normal;
@@ -13667,6 +13763,19 @@ exports[`renders <Summary state /> without throwing 3`] = `
   text-align: left;
 }
 
+.c28 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
 .c7 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -13688,23 +13797,18 @@ exports[`renders <Summary state /> without throwing 3`] = `
   margin-top: 1.5rem;
 }
 
-.c25 {
+.c26 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c12 {
+.c13 {
   width: 0.375rem;
   height: 0.375rem;
   border-radius: 50%;
   background-color: rgb(59,70,204);
   display: inline-block;
-  margin-top: 0.0625rem;
-  margin-right: 0.375rem;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 50%;
 }
 
 .c2 {
@@ -13773,7 +13877,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c29 {
+.c30 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -13797,46 +13901,46 @@ exports[`renders <Summary state /> without throwing 3`] = `
   outline: 0;
 }
 
-.c29::-webkit-input-placeholder {
+.c30::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c29::-moz-placeholder {
+.c30::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c29:-ms-input-placeholder {
+.c30:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c29:invalid {
+.c30:invalid {
   box-shadow: none;
 }
 
-.c29:disabled {
+.c30:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c29:disabled::-webkit-input-placeholder {
+.c30:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c29:disabled::-moz-placeholder {
+.c30:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c29:disabled:-ms-input-placeholder {
+.c30:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c29:focus {
+.c30:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c31 {
+.c32 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -13859,59 +13963,46 @@ exports[`renders <Summary state /> without throwing 3`] = `
   outline: 0;
 }
 
-.c31::-webkit-input-placeholder {
+.c32::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31::-moz-placeholder {
+.c32::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:-ms-input-placeholder {
+.c32:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:invalid {
+.c32:invalid {
   box-shadow: none;
 }
 
-.c31:disabled {
+.c32:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c31:disabled::-webkit-input-placeholder {
+.c32:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:disabled::-moz-placeholder {
+.c32:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:disabled:-ms-input-placeholder {
+.c32:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c31:focus {
+.c32:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c27 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c14 {
+.c15 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
@@ -13931,7 +14022,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   justify-content: flex-start;
 }
 
-.c28 {
+.c29 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -13943,11 +14034,11 @@ exports[`renders <Summary state /> without throwing 3`] = `
   align-items: center;
 }
 
-.c28 input {
+.c29 input {
   padding-right: 1.875rem;
 }
 
-.c28 div {
+.c29 div {
   position: relative;
   left: -1.625rem;
 }
@@ -13966,7 +14057,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   margin: 0 1.125rem;
 }
 
-.c30 {
+.c31 {
   cursor: pointer;
 }
 
@@ -13980,7 +14071,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c15 {
+  .c16 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -14029,7 +14120,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -14039,7 +14130,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c21 {
+  .c22 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -14049,7 +14140,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c26 {
+  .c27 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -14059,7 +14150,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c26 {
+  .c27 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -14135,7 +14226,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 className="c9"
               >
                 <span
-                  className="c12"
+                  className="c12 c13"
                   color="primary"
                   height="0.6875rem"
                   width="0.6875rem"
@@ -14144,7 +14235,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
               </div>
             </div>
             <div
-              className="c13"
+              className="c14"
             >
               <div
                 className="c9"
@@ -14153,7 +14244,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c10"
                   >
                     Created: 
                   </label>
@@ -14172,7 +14263,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   className="c9"
                 >
                   <label
-                    className="c14 c10"
+                    className="c15 c10"
                   >
                     Updated: 
                   </label>
@@ -14188,17 +14279,17 @@ exports[`renders <Summary state /> without throwing 3`] = `
             </div>
           </div>
           <div
-            className="c15"
+            className="c16"
           >
             <div
-              className="c16"
+              className="c17"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c17 c18 c19"
+                  className="c18 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -14208,6 +14299,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   <svg
                     className=""
                     height="15"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -14265,7 +14357,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c20 c18 c19"
+                  className="c21 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -14275,6 +14367,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   <svg
                     className=""
                     height="15"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -14335,7 +14428,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c17 c18 c19"
+                  className="c18 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -14345,6 +14438,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   <svg
                     className=""
                     height="14"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -14398,7 +14492,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c20 c18 c19"
+                  className="c21 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -14408,6 +14502,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   <svg
                     className=""
                     height="14"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -14464,7 +14559,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c17 c18 c19"
+                  className="c18 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -14474,6 +14569,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   <svg
                     className=""
                     height="21"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -14511,7 +14607,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c20 c18 c19"
+                  className="c21 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -14521,6 +14617,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   <svg
                     className=""
                     height="21"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -14558,14 +14655,14 @@ exports[`renders <Summary state /> without throwing 3`] = `
               </span>
             </div>
             <div
-              className="c21"
+              className="c22"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c18 c19"
+                  className="c23 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -14575,6 +14672,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   <svg
                     className=""
                     height="12"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -14612,7 +14710,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c23 c18 c19"
+                  className="c24 c19 c20"
                   disabled={true}
                   href=""
                   icon={true}
@@ -14622,6 +14720,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   <svg
                     className=""
                     height="12"
+                    innerRef={undefined}
                     style={
                       Object {
                         "transform": "rotate(0deg)",
@@ -14660,10 +14759,10 @@ exports[`renders <Summary state /> without throwing 3`] = `
             </div>
           </div>
           <div
-            className="c24"
+            className="c25"
           >
             <div
-              className="c25 c0"
+              className="c26 c0"
               height="0.0625rem"
             />
           </div>
@@ -14671,19 +14770,19 @@ exports[`renders <Summary state /> without throwing 3`] = `
             className="c0"
           >
             <div
-              className="c26"
+              className="c27"
             >
               <label
-                className="c27"
+                className="c28"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c28"
+                className="c29"
               >
                 <input
-                  className="c29"
+                  className="c30"
                   disabled={false}
                   id=""
                   value=""
@@ -14695,8 +14794,9 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   tag={false}
                 >
                   <svg
-                    className="c30 "
+                    className="c31 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -14740,19 +14840,19 @@ exports[`renders <Summary state /> without throwing 3`] = `
             className="c0"
           >
             <div
-              className="c26"
+              className="c27"
             >
               <label
-                className="c27"
+                className="c28"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c28"
+                className="c29"
               >
                 <input
-                  className="c29"
+                  className="c30"
                   disabled={false}
                   id=""
                   value={undefined}
@@ -14764,8 +14864,9 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   tag={false}
                 >
                   <svg
-                    className="c30 "
+                    className="c31 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -14809,19 +14910,19 @@ exports[`renders <Summary state /> without throwing 3`] = `
             className="c0"
           >
             <div
-              className="c26"
+              className="c27"
             >
               <label
-                className="c27"
+                className="c28"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c28"
+                className="c29"
               >
                 <input
-                  className="c29"
+                  className="c30"
                   disabled={false}
                   id=""
                   value={undefined}
@@ -14833,8 +14934,9 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   tag={false}
                 >
                   <svg
-                    className="c30 "
+                    className="c31 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
@@ -14878,19 +14980,19 @@ exports[`renders <Summary state /> without throwing 3`] = `
             className="c0"
           >
             <div
-              className="c26"
+              className="c27"
             >
               <label
-                className="c27"
+                className="c28"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c28"
+                className="c29"
               >
                 <input
-                  className="c31"
+                  className="c32"
                   disabled={false}
                   id=""
                   value="ssh root@undefined"
@@ -14902,8 +15004,9 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   tag={false}
                 >
                   <svg
-                    className="c30 "
+                    className="c31 "
                     height="16"
+                    innerRef={undefined}
                     onClick={[Function]}
                     style={
                       Object {
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/tags.spec.js.snap b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/tags.spec.js.snap
index 16e5f300..7f96af74 100644
--- a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/tags.spec.js.snap
+++ b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/tags.spec.js.snap
@@ -349,6 +349,32 @@ exports[`renders <AddForm /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c15 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -456,50 +482,6 @@ exports[`renders <AddForm /> without throwing 1`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c6 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c6 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c6 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c1 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -598,6 +580,50 @@ exports[`renders <AddForm /> without throwing 1`] = `
   color: inherit;
 }
 
+.c6 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c6 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c6 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
 .c10 {
   display: inline-block;
   margin: 0;
@@ -677,59 +703,6 @@ exports[`renders <AddForm /> without throwing 1`] = `
   outline: 0;
 }
 
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
-.c8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-}
-
 .c9 {
   -webkit-order: 0;
   -ms-flex-order: 0;
@@ -768,6 +741,33 @@ exports[`renders <AddForm /> without throwing 1`] = `
   flex-basis: 0.75rem;
 }
 
+.c8 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+}
+
 .c2 {
   word-wrap: break-word;
   overflow-wrap: break-word;
@@ -853,7 +853,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
             className="c9"
           >
             <div
-              className="c10"
+              className="baseline-jVaZNU kXgQxt c10"
               name="name"
               role="group"
               style={undefined}
@@ -882,7 +882,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
             className="c9"
           >
             <div
-              className="c10"
+              className="baseline-jVaZNU kXgQxt c10"
               name="value"
               role="group"
               style={undefined}
@@ -947,6 +947,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
               <svg
                 className=""
                 height="12"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -1342,6 +1343,32 @@ exports[`renders <EditForm /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c15 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -1651,59 +1678,6 @@ exports[`renders <EditForm /> without throwing 1`] = `
   outline: 0;
 }
 
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
-.c8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-}
-
 .c9 {
   -webkit-order: 0;
   -ms-flex-order: 0;
@@ -1742,6 +1716,33 @@ exports[`renders <EditForm /> without throwing 1`] = `
   flex-basis: 0.75rem;
 }
 
+.c8 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+}
+
 .c5 {
   word-break: break-all;
   line-height: 1.5;
@@ -1838,7 +1839,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
             className="c9"
           >
             <div
-              className="c10"
+              className="baseline-jVaZNU kXgQxt c10"
               name="name"
               role="group"
               style={undefined}
@@ -1867,7 +1868,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
             className="c9"
           >
             <div
-              className="c10"
+              className="baseline-jVaZNU kXgQxt c10"
               name="value"
               role="group"
               style={undefined}
@@ -1932,6 +1933,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
               <svg
                 className=""
                 height="12"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/toolbar.spec.js.snap b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/toolbar.spec.js.snap
index d38bf59a..34ff0519 100644
--- a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/toolbar.spec.js.snap
+++ b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/toolbar.spec.js.snap
@@ -121,22 +121,17 @@ exports[`renders <Toolbar /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c5 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
+.c3 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
 }
 
 .c0 {
@@ -161,6 +156,24 @@ exports[`renders <Toolbar /> without throwing 1`] = `
   flex: 1 1 auto;
 }
 
+.c1 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c5 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
 .c2 {
   display: inline-block;
   margin: 0;
@@ -256,19 +269,6 @@ exports[`renders <Toolbar /> without throwing 1`] = `
   outline: 0;
 }
 
-.c3 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 @media only screen and (min-width:0em) {
   .c1 {
     -webkit-flex-basis: 58.333333333333336%;
@@ -316,7 +316,7 @@ exports[`renders <Toolbar /> without throwing 1`] = `
     className="c1"
   >
     <div
-      className="c2"
+      className="baseline-jVaZNU kXgQxt c2"
       name="filter"
       role="group"
       style={undefined}
@@ -339,7 +339,7 @@ exports[`renders <Toolbar /> without throwing 1`] = `
     className="c5"
   >
     <div
-      className="c6"
+      className="baseline-jVaZNU kXgQxt c6"
       role="group"
       style={undefined}
     >
@@ -485,22 +485,17 @@ exports[`renders <Toolbar actionLabel /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c5 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
+.c3 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
 }
 
 .c0 {
@@ -525,6 +520,24 @@ exports[`renders <Toolbar actionLabel /> without throwing 1`] = `
   flex: 1 1 auto;
 }
 
+.c1 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c5 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
 .c2 {
   display: inline-block;
   margin: 0;
@@ -620,19 +633,6 @@ exports[`renders <Toolbar actionLabel /> without throwing 1`] = `
   outline: 0;
 }
 
-.c3 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 @media only screen and (min-width:0em) {
   .c1 {
     -webkit-flex-basis: 58.333333333333336%;
@@ -680,7 +680,7 @@ exports[`renders <Toolbar actionLabel /> without throwing 1`] = `
     className="c1"
   >
     <div
-      className="c2"
+      className="baseline-jVaZNU kXgQxt c2"
       name="filter"
       role="group"
       style={undefined}
@@ -703,7 +703,7 @@ exports[`renders <Toolbar actionLabel /> without throwing 1`] = `
     className="c5"
   >
     <div
-      className="c6"
+      className="baseline-jVaZNU kXgQxt c6"
       role="group"
       style={undefined}
     >
@@ -871,22 +871,17 @@ exports[`renders <Toolbar actionable /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c5 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
+.c3 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
 }
 
 .c0 {
@@ -911,6 +906,24 @@ exports[`renders <Toolbar actionable /> without throwing 1`] = `
   flex: 1 1 auto;
 }
 
+.c1 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c5 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
 .c2 {
   display: inline-block;
   margin: 0;
@@ -1006,19 +1019,6 @@ exports[`renders <Toolbar actionable /> without throwing 1`] = `
   outline: 0;
 }
 
-.c3 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 @media only screen and (min-width:0em) {
   .c1 {
     -webkit-flex-basis: 58.333333333333336%;
@@ -1066,7 +1066,7 @@ exports[`renders <Toolbar actionable /> without throwing 1`] = `
     className="c1"
   >
     <div
-      className="c2"
+      className="baseline-jVaZNU kXgQxt c2"
       name="filter"
       role="group"
       style={undefined}
@@ -1089,7 +1089,7 @@ exports[`renders <Toolbar actionable /> without throwing 1`] = `
     className="c5"
   >
     <div
-      className="c6"
+      className="baseline-jVaZNU kXgQxt c6"
       role="group"
       style={undefined}
     >
@@ -1235,22 +1235,17 @@ exports[`renders <Toolbar onActionClick /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c5 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
+.c3 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
 }
 
 .c0 {
@@ -1275,6 +1270,24 @@ exports[`renders <Toolbar onActionClick /> without throwing 1`] = `
   flex: 1 1 auto;
 }
 
+.c1 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c5 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
 .c2 {
   display: inline-block;
   margin: 0;
@@ -1370,19 +1383,6 @@ exports[`renders <Toolbar onActionClick /> without throwing 1`] = `
   outline: 0;
 }
 
-.c3 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 @media only screen and (min-width:0em) {
   .c1 {
     -webkit-flex-basis: 58.333333333333336%;
@@ -1430,7 +1430,7 @@ exports[`renders <Toolbar onActionClick /> without throwing 1`] = `
     className="c1"
   >
     <div
-      className="c2"
+      className="baseline-jVaZNU kXgQxt c2"
       name="filter"
       role="group"
       style={undefined}
@@ -1453,7 +1453,7 @@ exports[`renders <Toolbar onActionClick /> without throwing 1`] = `
     className="c5"
   >
     <div
-      className="c6"
+      className="baseline-jVaZNU kXgQxt c6"
       role="group"
       style={undefined}
     >
@@ -1599,22 +1599,17 @@ exports[`renders <Toolbar searchLabel /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c5 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
+.c3 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
 }
 
 .c0 {
@@ -1639,6 +1634,24 @@ exports[`renders <Toolbar searchLabel /> without throwing 1`] = `
   flex: 1 1 auto;
 }
 
+.c1 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c5 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
 .c2 {
   display: inline-block;
   margin: 0;
@@ -1734,19 +1747,6 @@ exports[`renders <Toolbar searchLabel /> without throwing 1`] = `
   outline: 0;
 }
 
-.c3 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 @media only screen and (min-width:0em) {
   .c1 {
     -webkit-flex-basis: 58.333333333333336%;
@@ -1794,7 +1794,7 @@ exports[`renders <Toolbar searchLabel /> without throwing 1`] = `
     className="c1"
   >
     <div
-      className="c2"
+      className="baseline-jVaZNU kXgQxt c2"
       name="filter"
       role="group"
       style={undefined}
@@ -1817,7 +1817,7 @@ exports[`renders <Toolbar searchLabel /> without throwing 1`] = `
     className="c5"
   >
     <div
-      className="c6"
+      className="baseline-jVaZNU kXgQxt c6"
       role="group"
       style={undefined}
     >
@@ -1963,22 +1963,17 @@ exports[`renders <Toolbar searchPlaceholder /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c5 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
+.c3 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
 }
 
 .c0 {
@@ -2003,6 +1998,24 @@ exports[`renders <Toolbar searchPlaceholder /> without throwing 1`] = `
   flex: 1 1 auto;
 }
 
+.c1 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c5 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
 .c2 {
   display: inline-block;
   margin: 0;
@@ -2098,19 +2111,6 @@ exports[`renders <Toolbar searchPlaceholder /> without throwing 1`] = `
   outline: 0;
 }
 
-.c3 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 @media only screen and (min-width:0em) {
   .c1 {
     -webkit-flex-basis: 58.333333333333336%;
@@ -2158,7 +2158,7 @@ exports[`renders <Toolbar searchPlaceholder /> without throwing 1`] = `
     className="c1"
   >
     <div
-      className="c2"
+      className="baseline-jVaZNU kXgQxt c2"
       name="filter"
       role="group"
       style={undefined}
@@ -2181,7 +2181,7 @@ exports[`renders <Toolbar searchPlaceholder /> without throwing 1`] = `
     className="c5"
   >
     <div
-      className="c6"
+      className="baseline-jVaZNU kXgQxt c6"
       role="group"
       style={undefined}
     >
@@ -2349,22 +2349,17 @@ exports[`renders <Toolbar searchable /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c5 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
+.c3 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
 }
 
 .c0 {
@@ -2389,6 +2384,24 @@ exports[`renders <Toolbar searchable /> without throwing 1`] = `
   flex: 1 1 auto;
 }
 
+.c1 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c5 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
 .c2 {
   display: inline-block;
   margin: 0;
@@ -2499,19 +2512,6 @@ exports[`renders <Toolbar searchable /> without throwing 1`] = `
   outline: 0;
 }
 
-.c3 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 @media only screen and (min-width:0em) {
   .c1 {
     -webkit-flex-basis: 58.333333333333336%;
@@ -2559,7 +2559,7 @@ exports[`renders <Toolbar searchable /> without throwing 1`] = `
     className="c1"
   >
     <div
-      className="c2"
+      className="baseline-jVaZNU kXgQxt c2"
       name="filter"
       role="group"
       style={undefined}
@@ -2582,7 +2582,7 @@ exports[`renders <Toolbar searchable /> without throwing 1`] = `
     className="c5"
   >
     <div
-      className="c6"
+      className="baseline-jVaZNU kXgQxt c6"
       role="group"
       style={undefined}
     >
diff --git a/packages/my-joy-beta/src/components/navigation/__tests__/__snapshots__/header.spec.js.snap b/packages/my-joy-beta/src/components/navigation/__tests__/__snapshots__/header.spec.js.snap
deleted file mode 100644
index 8981d8ac..00000000
--- a/packages/my-joy-beta/src/components/navigation/__tests__/__snapshots__/header.spec.js.snap
+++ /dev/null
@@ -1,384 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`renders <Header /> without throwing 1`] = `
-.c6 {
-  background-color: transparent;
-  text-decoration-skip: objects;
-}
-
-.c5 {
-  color: rgb(59,70,204);
-  -webkit-text-fill-color: currentcolor;
-}
-
-.c5:hover {
-  text-decoration: none;
-}
-
-.c10 {
-  color: rgba(73,73,73,1);
-  line-height: 1.5rem;
-  font-size: 0.9375rem;
-  margin: 0;
-  text-align: center;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  margin: 0;
-}
-
-.c10 + p,
-.c10 + small,
-.c10 + h1,
-.c10 + h2,
-.c10 + label,
-.c10 + h3,
-.c10 + h4,
-.c10 + h5,
-.c10 + div,
-.c10 + span {
-  padding-bottom: 2.25rem;
-}
-
-.c9 {
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-align-self: auto;
-  -ms-flex-item-align: auto;
-  align-self: auto;
-  -webkit-order: 0;
-  -ms-flex-order: 0;
-  order: 0;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  padding: 0 1.125rem;
-}
-
-.c9 svg {
-  margin-right: 0.375rem;
-}
-
-.c9:not(:last-of-type) {
-  border-right: 0.0625rem solid rgba(255,255,255,0.15);
-}
-
-.c9:first-of-type {
-  margin-left: auto;
-}
-
-.c9:hover,
-.c9.active {
-  background: rgba(255,255,255,0.15);
-}
-
-.c4 {
-  padding: 0.9375rem 0;
-  line-height: 1.5rem;
-  font-size: 0.9375rem;
-  color: rgb(255,255,255);
-  text-decoration: none;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-transition: all 200ms ease;
-  transition: all 200ms ease;
-  max-height: 3.3125rem;
-  min-height: 3.3125rem;
-  box-sizing: border-box;
-}
-
-.c3 {
-  color: rgba(73,73,73,1);
-  font-weight: normal;
-  line-height: 1.875rem;
-  font-size: 1.5rem;
-  margin: 0;
-  text-transform: uppercase;
-  color: rgb(255,255,255);
-  font-size: 1.8125rem;
-  margin: 0 auto;
-}
-
-.c3 + p,
-.c3 + small,
-.c3 + h1,
-.c3 + h2,
-.c3 + label,
-.c3 + h3,
-.c3 + h4,
-.c3 + h5,
-.c3 + div,
-.c3 + span {
-  margin-top: 1.5rem;
-}
-
-.c2 {
-  -webkit-align-self: stretch;
-  -ms-flex-item-align: stretch;
-  align-self: stretch;
-  -webkit-order: 0;
-  -ms-flex-order: 0;
-  order: 0;
-  width: 9.375rem;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-}
-
-.c2:hover,
-.c2.active {
-  background: rgba(255,255,255,0.15);
-}
-
-.c8 {
-  padding: 0;
-  margin: 0;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  list-style: none;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-}
-
-.c1 {
-  margin-right: auto;
-  margin-left: auto;
-  padding-right: 2rem;
-  padding-left: 2rem;
-  box-sizing: border-box;
-  width: 100%;
-  padding-left: 0;
-  padding-right: 0;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-  -webkit-align-items: stretch;
-  -webkit-box-align: stretch;
-  -ms-flex-align: stretch;
-  align-items: stretch;
-}
-
-.c0 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-  -webkit-align-items: stretch;
-  -webkit-box-align: stretch;
-  -ms-flex-align: stretch;
-  align-items: stretch;
-  background-color: rgb(30,49,59);
-  max-height: 3.3125rem;
-  min-height: 3.3125rem;
-  line-height: 1.5625rem;
-}
-
-.c7 {
-  padding-top: 0.6875rem;
-}
-
-<div
-  className="c0"
->
-  <div
-    className="c1"
-  >
-    <div
-      className="c2"
-    >
-      <h2
-        className="c3"
-      >
-        <a
-          className="c4 c5 c6"
-          to="/"
-        >
-          <svg
-            alt="Triton"
-            className="c7 "
-            height="30"
-            style={
-              Object {
-                "transform": "rotate(0deg)",
-              }
-            }
-            version="1.1"
-            viewBox="0 0 105 30"
-            width="105"
-            xmlns="http://www.w3.org/2000/svg"
-            xmlnsXlink="http://www.w3.org/1999/xlink"
-          >
-            <g
-              transform="translate(26223 1404)"
-            >
-              <g>
-                <g>
-                  <use
-                    fill="rgb(255, 255, 255)"
-                    transform="translate(-26177 -1383)"
-                    xlinkHref="#U"
-                  />
-                </g>
-                <g>
-                  <use
-                    fill="rgb(255, 255, 255)"
-                    transform="translate(-26223 -1404)"
-                    xlinkHref="#V"
-                  />
-                </g>
-              </g>
-            </g>
-            <defs>
-              <path
-                d="M 33.7583 0.147461L 35.9766 0.147461C 37.0186 0.147461 37.7723 0.303223 38.2378 0.614746C 38.7033 0.92627 38.936 1.41862 38.936 2.0918C 38.936 2.55729 38.8053 2.94222 38.5439 3.24658C 38.2861 3.54736 37.9084 3.74251 37.4106 3.83203L 37.4106 3.88574C 38.603 4.08984 39.1992 4.71647 39.1992 5.76562C 39.1992 6.46745 38.9611 7.0153 38.4849 7.40918C 38.0122 7.80306 37.3498 8 36.4976 8L 33.7583 8L 33.7583 0.147461ZM 34.6714 3.50977L 36.1753 3.50977C 36.8198 3.50977 37.2835 3.40951 37.5664 3.20898C 37.8493 3.00488 37.9907 2.66292 37.9907 2.18311C 37.9907 1.74268 37.8332 1.42578 37.5181 1.23242C 37.203 1.03548 36.7017 0.937012 36.0142 0.937012L 34.6714 0.937012L 34.6714 3.50977ZM 34.6714 4.2832L 34.6714 7.22119L 36.3096 7.22119C 36.9434 7.22119 37.4196 7.09945 37.7383 6.85596C 38.0605 6.60889 38.2217 6.22396 38.2217 5.70117C 38.2217 5.21419 38.057 4.85612 37.7275 4.62695C 37.4017 4.39779 36.904 4.2832 36.2344 4.2832L 34.6714 4.2832ZM 43.2437 8.10742C 42.3735 8.10742 41.686 7.84245 41.1812 7.3125C 40.6799 6.78255 40.4292 6.04671 40.4292 5.10498C 40.4292 4.15609 40.6619 3.40234 41.1274 2.84375C 41.5965 2.28516 42.2249 2.00586 43.0127 2.00586C 43.7503 2.00586 44.334 2.24935 44.7637 2.73633C 45.1934 3.21973 45.4082 3.85889 45.4082 4.65381L 45.4082 5.21777L 41.353 5.21777C 41.3709 5.90885 41.5446 6.43343 41.874 6.7915C 42.207 7.14958 42.6743 7.32861 43.2759 7.32861C 43.9097 7.32861 44.5363 7.19613 45.1558 6.93115L 45.1558 7.72607C 44.8407 7.86214 44.5417 7.95882 44.2588 8.01611C 43.9795 8.07699 43.6411 8.10742 43.2437 8.10742ZM 43.002 2.75244C 42.5293 2.75244 42.1515 2.90641 41.8687 3.21436C 41.5894 3.5223 41.4246 3.94841 41.3745 4.49268L 44.4521 4.49268C 44.4521 3.9305 44.3268 3.50081 44.0762 3.20361C 43.8255 2.90283 43.4674 2.75244 43.002 2.75244ZM 48.835 7.37158C 48.9925 7.37158 49.1447 7.36084 49.2915 7.33936C 49.4383 7.31429 49.5547 7.28923 49.6406 7.26416L 49.6406 7.94629C 49.5439 7.99284 49.4007 8.03044 49.2109 8.05908C 49.0247 8.09131 48.8564 8.10742 48.7061 8.10742C 47.5674 8.10742 46.998 7.50765 46.998 6.30811L 46.998 2.80615L 46.1548 2.80615L 46.1548 2.37646L 46.998 2.00586L 47.374 0.749023L 47.8896 0.749023L 47.8896 2.11328L 49.5977 2.11328L 49.5977 2.80615L 47.8896 2.80615L 47.8896 6.27051C 47.8896 6.625 47.9738 6.89714 48.1421 7.08691C 48.3104 7.27669 48.5413 7.37158 48.835 7.37158ZM 54.4424 8L 54.2651 7.16211L 54.2222 7.16211C 53.9285 7.53092 53.6349 7.78158 53.3413 7.91406C 53.0513 8.04297 52.6878 8.10742 52.251 8.10742C 51.6673 8.10742 51.209 7.95703 50.876 7.65625C 50.5465 7.35547 50.3818 6.92757 50.3818 6.37256C 50.3818 5.18376 51.3325 4.56071 53.2339 4.50342L 54.2329 4.47119L 54.2329 4.10596C 54.2329 3.64404 54.1326 3.30387 53.9321 3.08545C 53.7352 2.86344 53.4183 2.75244 52.9814 2.75244C 52.4909 2.75244 51.9359 2.90283 51.3164 3.20361L 51.0425 2.52148C 51.3325 2.36393 51.6494 2.2404 51.9932 2.15088C 52.3405 2.06136 52.6878 2.0166 53.0352 2.0166C 53.737 2.0166 54.2562 2.17236 54.5928 2.48389C 54.9329 2.79541 55.103 3.29492 55.103 3.98242L 55.103 8L 54.4424 8ZM 52.4282 7.37158C 52.9832 7.37158 53.4183 7.2194 53.7334 6.91504C 54.0521 6.61068 54.2114 6.18457 54.2114 5.63672L 54.2114 5.10498L 53.3198 5.14258C 52.6108 5.16764 52.0988 5.27865 51.7837 5.47559C 51.4722 5.66895 51.3164 5.97152 51.3164 6.3833C 51.3164 6.70557 51.4131 6.95085 51.6064 7.11914C 51.8034 7.28743 52.0773 7.37158 52.4282 7.37158Z"
-                id="U"
-              />
-              <path
-                d="M 81 9.49793C 81 4.25232 76.7461 5.90949e-07 71.5 5.90949e-07C 66.252 -0.00183046 62 4.25171 62 9.49793C 62 14.7435 66.2539 18.9958 71.5 18.9958C 76.7461 18.9958 81 14.7435 81 9.49793ZM 16.2266 0.99585L 0.773438 0.99585C 0.345703 0.99585 0 1.34168 0 1.76819L 0 4.86169C 0 5.09143 0.0996094 5.29773 0.259766 5.43921C 0.308594 5.48181 0.361328 5.51856 0.417969 5.54822C 0.523438 5.60303 0.644531 5.63403 0.773438 5.63403L 5.38281 5.63403C 5.80469 5.63391 6.14844 5.96997 6.15625 6.39026L 6.15625 17.2235C 6.15625 17.4979 6.29883 17.739 6.51562 17.876C 6.56445 17.9071 6.61719 17.9327 6.67383 17.9523L 6.78906 17.983C 6.83398 17.9915 6.88086 17.9958 6.92969 17.9958L 10.0215 17.9958C 10.4492 17.9958 10.7949 17.65 10.7949 17.2235L 10.7949 6.39026C 10.7949 5.96362 11.1406 5.61792 11.5684 5.61792L 16.248 5.61792C 16.4941 5.61145 16.7109 5.48962 16.8477 5.30469C 16.9414 5.17932 16.998 5.0249 17 4.85767L 17 1.76819C 17 1.34168 16.6543 0.99585 16.2266 0.99585ZM 33 1.76819L 33 4.86169C 33 5.28821 32.6504 5.63403 32.2168 5.63403L 25.4941 5.63403C 25.0605 5.63403 24.7109 5.97986 24.7109 6.40637L 24.7109 17.2235C 24.7109 17.65 24.3594 17.9958 23.9277 17.9958L 20.7871 17.9958C 20.5781 17.9969 20.3789 17.916 20.2305 17.771C 20.084 17.6261 20 17.4291 20 17.2235L 20 5.63001C 20.002 3.06995 22.1074 0.99585 24.7031 0.99585L 32.2168 0.99585C 32.6504 0.99585 33 1.34168 33 1.76819ZM 40.1719 0.99585L 36.834 0.99585C 36.6113 0.99585 36.4102 1.07593 36.2598 1.20654C 36.2188 1.24182 36.1816 1.28076 36.1504 1.32275L 36.0938 1.40906C 36.0352 1.51636 36 1.63855 36 1.76819L 36 17.2235C 36 17.65 36.373 17.9958 36.834 17.9958L 40.166 17.9958C 40.627 17.9958 41 17.65 41 17.2235L 41 1.76819C 41 1.34168 40.627 0.99585 40.1719 0.99585ZM 43.7715 0.99585L 59.2207 0.99585C 59.3535 0.99585 59.4785 1.02844 59.5879 1.08594C 59.7109 1.15112 59.8145 1.24829 59.8867 1.36633C 59.959 1.4834 60 1.62097 60 1.76819L 60 4.84546C 60 5.2721 59.6543 5.6178 59.2285 5.6178L 54.5664 5.6178C 54.1406 5.6178 53.7949 5.96362 53.7949 6.39026L 53.7949 17.2234C 53.7949 17.4678 53.6816 17.6857 53.5039 17.8271C 53.373 17.9326 53.2051 17.9957 53.0215 17.9957L 49.9297 17.9957C 49.7227 17.999 49.5234 17.9191 49.375 17.7739C 49.3105 17.7108 49.2598 17.6377 49.2207 17.5582C 49.1719 17.4547 49.1445 17.3405 49.1445 17.2234L 49.1445 6.39026C 49.1367 5.96997 48.793 5.63391 48.373 5.63403L 43.7715 5.63403C 43.3457 5.63403 43 5.28821 43 4.86169L 43 1.76819C 43 1.34168 43.3457 0.99585 43.7715 0.99585ZM 84 1.76819C 84 1.34168 84.3438 0.99585 84.7695 0.99585L 96.3809 0.99585C 98.9297 0.99585 100.998 3.06995 101 5.63001L 101 17.2235C 101 17.65 100.656 17.9958 100.23 17.9958L 97.1504 17.9958C 97.0039 17.9958 96.8691 17.9552 96.752 17.8846C 96.7148 17.8619 96.6797 17.8362 96.6465 17.8076C 96.584 17.7534 96.5312 17.6895 96.4883 17.618C 96.4199 17.5026 96.3809 17.3677 96.3809 17.2235L 96.3809 6.39026C 96.3809 5.96521 96.0391 5.62012 95.6152 5.61792L 89.3887 5.61792C 88.9648 5.61792 88.6191 5.96362 88.6191 6.39026L 88.6191 17.2235C 88.6191 17.65 88.2754 17.9958 87.8496 17.9958L 84.7695 17.9958C 84.5996 17.9958 84.4434 17.9408 84.3164 17.8474C 84.125 17.7069 84 17.4799 84 17.2235L 84 1.76819ZM 71.5 4.99585C 69.0156 4.99585 67 7.01062 67 9.49585C 67 11.9811 69.0156 13.9959 71.5 13.9959C 73.9844 13.9959 76 11.9811 76 9.49585C 75.998 7.01148 73.9844 4.99817 71.5 4.99585ZM 102.613 1.14209L 103 1.14209L 103 1.98145L 103.314 1.98145L 103.314 1.40503L 103.314 1.22925L 103.865 1.99585L 104.119 1.98145L 104.67 1.21777L 104.67 1.40503L 104.67 1.98145L 105 1.98145L 105 0.99585L 104.555 0.99585L 104.002 1.76245L 103.49 0.99585L 103 0.99585L 102 0.99585L 102 1.14209L 102.387 1.14209L 102.387 1.99585L 102.617 1.99585L 102.613 1.14209Z"
-                fillRule="evenodd"
-                id="V"
-              />
-            </defs>
-          </svg>
-        </a>
-      </h2>
-    </div>
-    <span
-      name="react-responsive-mock"
-      query="only screen and (min-width: 48rem)"
-    >
-      <ul
-        className="c8"
-      >
-        <li>
-          <a
-            className="c4 c5 c6"
-            to="/"
-          >
-            Compute
-          </a>
-        </li>
-      </ul>
-    </span>
-    <span
-      name="react-responsive-mock"
-      query="only screen and (min-width: 48rem)"
-    >
-      <section
-        className="c9"
-      >
-        <p
-          className="c10"
-        >
-          <a
-            className="c4 c5 c6"
-            href="https://my.joyent.com"
-          >
-            Return to existing portal
-          </a>
-        </p>
-      </section>
-    </span>
-    <section
-      className="c9"
-    >
-      <p
-        className="c10"
-      >
-        <a
-          className="c4 c5 c6"
-        >
-          <svg
-            className=""
-            height="13"
-            style={
-              Object {
-                "transform": "rotate(0deg)",
-              }
-            }
-            viewBox="0 0 9 13"
-            width="9"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M0 13h9V0H0v13zm2-2h5V2H2v9zm1-7h3.001V3H3v1zm0 2h3.001V5H3v1zm0 2h3.001V7H3v1z"
-              fill="rgb(255, 255, 255)"
-              fillRule="evenodd"
-            />
-          </svg>
-          eu-east-1
-        </a>
-      </p>
-    </section>
-    <span
-      name="react-responsive-mock"
-      query="only screen and (min-width: 48rem)"
-    >
-      <section
-        className="c9"
-      >
-        <p
-          className="c10"
-        >
-          <a
-            className="c4 c5 c6"
-          >
-            <svg
-              className=""
-              height="12"
-              style={
-                Object {
-                  "transform": "rotate(0deg)",
-                }
-              }
-              viewBox="0 0 12 12"
-              width="12"
-              xmlns="http://www.w3.org/2000/svg"
-            >
-              <path
-                d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4A3.204 3.204 0 0 0 5.62 0z"
-                fill="rgb(255, 255, 255)"
-              />
-            </svg>
-            Nicola
-          </a>
-        </p>
-      </section>
-    </span>
-  </div>
-</div>
-`;
diff --git a/packages/my-joy-beta/src/components/navigation/__tests__/__snapshots__/menu.spec.js.snap b/packages/my-joy-beta/src/components/navigation/__tests__/__snapshots__/menu.spec.js.snap
index bf9b286e..8818c9a5 100644
--- a/packages/my-joy-beta/src/components/navigation/__tests__/__snapshots__/menu.spec.js.snap
+++ b/packages/my-joy-beta/src/components/navigation/__tests__/__snapshots__/menu.spec.js.snap
@@ -29,13 +29,6 @@ exports[`renders <Menu links /> without throwing 1`] = `
   max-width: 62.5rem;
 }
 
-.c3 {
-  display: inline-block;
-  font-size: 0.9375rem;
-  line-height: 1.6;
-  margin-right: 1.4375rem;
-}
-
 .c4 {
   color: rgb(70,70,70);
   text-decoration: none;
@@ -47,6 +40,13 @@ exports[`renders <Menu links /> without throwing 1`] = `
   cursor: default;
 }
 
+.c3 {
+  display: inline-block;
+  font-size: 0.9375rem;
+  line-height: 1.6;
+  margin-right: 1.4375rem;
+}
+
 .c2 {
   list-style-type: none;
   padding: 0;
diff --git a/packages/my-joy-beta/src/components/navigation/__tests__/header.spec.js b/packages/my-joy-beta/src/components/navigation/__tests__/header.spec.js
deleted file mode 100644
index 34fa9247..00000000
--- a/packages/my-joy-beta/src/components/navigation/__tests__/header.spec.js
+++ /dev/null
@@ -1,18 +0,0 @@
-import React from 'react';
-import renderer from 'react-test-renderer';
-import 'jest-styled-components';
-
-import Header from '../header';
-import Theme from '@mocks/theme';
-
-it('renders <Header /> without throwing', () => {
-  expect(
-    renderer
-      .create(
-        <Theme>
-          <Header />
-        </Theme>
-      )
-      .toJSON()
-  ).toMatchSnapshot();
-});
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/metadata.spec.js.snap b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/metadata.spec.js.snap
index bfa39ff1..f1927fcd 100644
--- a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/metadata.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/metadata.spec.js.snap
@@ -74,6 +74,7 @@ Array [
             <svg
                 className=""
                 height="11"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
@@ -260,6 +261,7 @@ Array [
             <svg
                 className=""
                 height="11"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
@@ -496,6 +498,18 @@ Array [
   margin-left: 0.375rem;
 }
 
+.c15 {
+  position: relative;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  width: 100%;
+}
+
 .c19 {
   display: inline-block;
 }
@@ -803,6 +817,32 @@ Array [
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c8 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -1087,7 +1127,7 @@ Array [
   background-color: rgb(255,255,255);
   border: 0.0625rem solid rgb(216,216,216);
   color: rgba(73,73,73,1);
-  max-width: 18.75rem;
+  max-width: 22.1875rem;
   text-overflow: ellipsis;
   font-size: 0.9375rem;
   line-height: normal !important;
@@ -1202,44 +1242,6 @@ Array [
   outline: 0;
 }
 
-.c15 {
-  position: relative;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  width: 100%;
-}
-
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c3 {
   padding-right: 1rem;
   padding-left: 1rem;
@@ -1334,7 +1336,7 @@ Array [
                         className="c9"
                     >
                         <div
-                            className="c10"
+                            className="baseline-jVaZNU kXgQxt c10"
                             name="name"
                             role="group"
                             style={undefined}
@@ -1368,7 +1370,7 @@ Array [
                         className="c9"
                     >
                         <div
-                            className="c10"
+                            className="baseline-jVaZNU kXgQxt c10"
                             name="value"
                             role="group"
                             style={undefined}
@@ -1437,6 +1439,7 @@ Array [
                             <svg
                                 className=""
                                 height="12"
+                                innerRef={undefined}
                                 style={
                                     Object {
                                         "transform": "rotate(0deg)",
@@ -1773,6 +1776,7 @@ Array [
             <svg
                 className=""
                 height="11"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
@@ -2269,6 +2273,7 @@ Array [
             <svg
                 className=""
                 height="11"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
@@ -2409,6 +2414,18 @@ Array [
   margin-left: 0.375rem;
 }
 
+.c15 {
+  position: relative;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  width: 100%;
+}
+
 .c20 {
   display: inline-block;
 }
@@ -2716,6 +2733,32 @@ Array [
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c8 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -2818,50 +2861,6 @@ Array [
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c6 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c6 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c6 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c1 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -2962,6 +2961,50 @@ Array [
   color: inherit;
 }
 
+.c6 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c6 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c6 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
 .c10 {
   display: inline-block;
   margin: 0;
@@ -2990,7 +3033,7 @@ Array [
   background-color: rgb(255,255,255);
   border: 0.0625rem solid rgb(216,216,216);
   color: rgba(73,73,73,1);
-  max-width: 18.75rem;
+  max-width: 22.1875rem;
   text-overflow: ellipsis;
   font-size: 0.9375rem;
   line-height: normal !important;
@@ -3105,44 +3148,6 @@ Array [
   outline: 0;
 }
 
-.c15 {
-  position: relative;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  width: 100%;
-}
-
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c3 {
   padding-right: 1rem;
   padding-left: 1rem;
@@ -3265,7 +3270,7 @@ Array [
                         className="c9"
                     >
                         <div
-                            className="c10"
+                            className="baseline-jVaZNU kXgQxt c10"
                             name="name"
                             role="group"
                             style={undefined}
@@ -3299,7 +3304,7 @@ Array [
                         className="c9"
                     >
                         <div
-                            className="c10"
+                            className="baseline-jVaZNU kXgQxt c10"
                             name="value"
                             role="group"
                             style={undefined}
@@ -3368,6 +3373,7 @@ Array [
                             <svg
                                 className=""
                                 height="12"
+                                innerRef={undefined}
                                 style={
                                     Object {
                                         "transform": "rotate(0deg)",
@@ -3444,6 +3450,18 @@ Array [
   margin-left: 0.375rem;
 }
 
+.c15 {
+  position: relative;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  width: 100%;
+}
+
 .c20 {
   display: inline-block;
 }
@@ -3751,6 +3769,32 @@ Array [
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c8 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -3853,50 +3897,6 @@ Array [
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c6 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c6 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c6 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c1 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -3997,6 +3997,50 @@ Array [
   color: inherit;
 }
 
+.c6 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c6 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c6 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
 .c10 {
   display: inline-block;
   margin: 0;
@@ -4025,7 +4069,7 @@ Array [
   background-color: rgb(255,255,255);
   border: 0.0625rem solid rgb(216,216,216);
   color: rgba(73,73,73,1);
-  max-width: 18.75rem;
+  max-width: 22.1875rem;
   text-overflow: ellipsis;
   font-size: 0.9375rem;
   line-height: normal !important;
@@ -4140,44 +4184,6 @@ Array [
   outline: 0;
 }
 
-.c15 {
-  position: relative;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  width: 100%;
-}
-
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c3 {
   padding-right: 1rem;
   padding-left: 1rem;
@@ -4300,7 +4306,7 @@ Array [
                         className="c9"
                     >
                         <div
-                            className="c10"
+                            className="baseline-jVaZNU kXgQxt c10"
                             name="name"
                             role="group"
                             style={undefined}
@@ -4334,7 +4340,7 @@ Array [
                         className="c9"
                     >
                         <div
-                            className="c10"
+                            className="baseline-jVaZNU kXgQxt c10"
                             name="value"
                             role="group"
                             style={undefined}
@@ -4403,6 +4409,7 @@ Array [
                             <svg
                                 className=""
                                 height="12"
+                                innerRef={undefined}
                                 style={
                                     Object {
                                         "transform": "rotate(0deg)",
@@ -4525,6 +4532,7 @@ Array [
             <svg
                 className=""
                 height="11"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
@@ -4761,6 +4769,18 @@ Array [
   margin-left: 0.375rem;
 }
 
+.c15 {
+  position: relative;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  width: 100%;
+}
+
 .c20 {
   display: inline-block;
 }
@@ -5068,6 +5088,32 @@ Array [
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c8 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -5170,50 +5216,6 @@ Array [
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c6 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c6 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c6 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c1 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -5314,6 +5316,50 @@ Array [
   color: inherit;
 }
 
+.c6 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c6 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c6 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
 .c10 {
   display: inline-block;
   margin: 0;
@@ -5342,7 +5388,7 @@ Array [
   background-color: rgb(255,255,255);
   border: 0.0625rem solid rgb(216,216,216);
   color: rgba(73,73,73,1);
-  max-width: 18.75rem;
+  max-width: 22.1875rem;
   text-overflow: ellipsis;
   font-size: 0.9375rem;
   line-height: normal !important;
@@ -5457,44 +5503,6 @@ Array [
   outline: 0;
 }
 
-.c15 {
-  position: relative;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  width: 100%;
-}
-
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c3 {
   padding-right: 1rem;
   padding-left: 1rem;
@@ -5617,7 +5625,7 @@ Array [
                         className="c9"
                     >
                         <div
-                            className="c10"
+                            className="baseline-jVaZNU kXgQxt c10"
                             name="name"
                             role="group"
                             style={undefined}
@@ -5651,7 +5659,7 @@ Array [
                         className="c9"
                     >
                         <div
-                            className="c10"
+                            className="baseline-jVaZNU kXgQxt c10"
                             name="value"
                             role="group"
                             style={undefined}
@@ -5720,6 +5728,7 @@ Array [
                             <svg
                                 className=""
                                 height="12"
+                                innerRef={undefined}
                                 style={
                                     Object {
                                         "transform": "rotate(0deg)",
@@ -5796,6 +5805,18 @@ Array [
   margin-left: 0.375rem;
 }
 
+.c15 {
+  position: relative;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  width: 100%;
+}
+
 .c20 {
   display: inline-block;
 }
@@ -6103,6 +6124,32 @@ Array [
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c8 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -6205,50 +6252,6 @@ Array [
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c6 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c6 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c6 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c1 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -6349,6 +6352,50 @@ Array [
   color: inherit;
 }
 
+.c6 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c6 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c6 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
 .c10 {
   display: inline-block;
   margin: 0;
@@ -6377,7 +6424,7 @@ Array [
   background-color: rgb(255,255,255);
   border: 0.0625rem solid rgb(216,216,216);
   color: rgba(73,73,73,1);
-  max-width: 18.75rem;
+  max-width: 22.1875rem;
   text-overflow: ellipsis;
   font-size: 0.9375rem;
   line-height: normal !important;
@@ -6492,44 +6539,6 @@ Array [
   outline: 0;
 }
 
-.c15 {
-  position: relative;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  width: 100%;
-}
-
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c3 {
   padding-right: 1rem;
   padding-left: 1rem;
@@ -6652,7 +6661,7 @@ Array [
                         className="c9"
                     >
                         <div
-                            className="c10"
+                            className="baseline-jVaZNU kXgQxt c10"
                             name="name"
                             role="group"
                             style={undefined}
@@ -6686,7 +6695,7 @@ Array [
                         className="c9"
                     >
                         <div
-                            className="c10"
+                            className="baseline-jVaZNU kXgQxt c10"
                             name="value"
                             role="group"
                             style={undefined}
@@ -6755,6 +6764,7 @@ Array [
                             <svg
                                 className=""
                                 height="12"
+                                innerRef={undefined}
                                 style={
                                     Object {
                                         "transform": "rotate(0deg)",
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/networks.spec.js.snap b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/networks.spec.js.snap
index b740b8c2..5fa9063b 100644
--- a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/networks.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/networks.spec.js.snap
@@ -74,6 +74,7 @@ Array [
             <svg
                 className=""
                 height="18"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
@@ -239,6 +240,7 @@ Array [
             <svg
                 className=""
                 height="18"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
@@ -403,6 +405,7 @@ Array [
             <svg
                 className=""
                 height="18"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
@@ -604,34 +607,6 @@ Array [
   animation-delay: 1s;
 }
 
-.c0 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-content: center;
-  -ms-flex-line-pack: center;
-  align-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 1.25rem;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-}
-
 .c4 {
   color: rgba(73,73,73,1);
   line-height: 1.5rem;
@@ -661,6 +636,34 @@ Array [
   padding-bottom: 2.25rem;
 }
 
+.c0 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-content: center;
+  -ms-flex-line-pack: center;
+  align-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 1.25rem;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+}
+
 <div
     className="c0"
 >
@@ -914,6 +917,7 @@ Array [
             <svg
                 className=""
                 height="18"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
@@ -1048,6 +1052,22 @@ Array [
   height: 0.0625rem;
 }
 
+.c5 {
+  -webkit-order: 0;
+  -ms-flex-order: 0;
+  order: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 1;
+  -ms-flex-negative: 1;
+  flex-shrink: 1;
+}
+
 .c12 {
   margin-right: 0.25rem;
 }
@@ -1136,22 +1156,6 @@ Array [
   align-items: center;
 }
 
-.c5 {
-  -webkit-order: 0;
-  -ms-flex-order: 0;
-  order: 0;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-box-flex: 0;
-  -webkit-flex-grow: 0;
-  -ms-flex-positive: 0;
-  flex-grow: 0;
-  -webkit-flex-shrink: 1;
-  -ms-flex-negative: 1;
-  flex-shrink: 1;
-}
-
 .c3 {
   display: inline-block;
   background-color: rgb(255,255,255);
@@ -1244,6 +1248,7 @@ Array [
                                                         <svg
                                                             className=""
                                                             height="16"
+                                                            innerRef={undefined}
                                                             style={
                                                                 Object {
                                                                     "transform": "rotate(0deg)",
@@ -1290,6 +1295,7 @@ Array [
                                                         <svg
                                                             className=""
                                                             height="13"
+                                                            innerRef={undefined}
                                                             style={
                                                                 Object {
                                                                     "transform": "rotate(0deg)",
@@ -1412,6 +1418,7 @@ Array [
             <svg
                 className=""
                 height="18"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
@@ -1588,7 +1595,69 @@ Array [
         </div>
     </div>
 </div>,
-  .c16 {
+  .c9 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c9[type='checkbox'],
+.c9[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c9[type='number']::-webkit-inner-spin-button,
+.c9[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c9[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c9[type='search']::-webkit-search-cancel-button,
+.c9[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c9::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c9:checked + label::after {
+  opacity: 1;
+}
+
+.c9:selected + label::after {
+  opacity: 1;
+}
+
+.c9:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c9:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
+.c16 {
   color: rgba(73,73,73,1);
   line-height: 1.5rem;
   font-size: 0.9375rem;
@@ -1703,78 +1772,6 @@ Array [
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c23 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  cursor: pointer;
-  min-height: auto;
-  height: 2.875rem;
-  -webkit-flex: 0 0 2.875rem;
-  -ms-flex: 0 0 2.875rem;
-  flex: 0 0 2.875rem;
-}
-
-.c13 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c13 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c13 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c4 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -1815,92 +1812,6 @@ Array [
   margin-top: 0;
 }
 
-.c24 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  cursor: pointer;
-  min-height: auto;
-  height: 2.875rem;
-  -webkit-flex: 0 0 2.875rem;
-  -ms-flex: 0 0 2.875rem;
-  flex: 0 0 2.875rem;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  z-index: 1;
-  line-height: 1.5rem;
-  height: auto;
-  max-width: 100%;
-  margin: -0.0625rem -0.0625rem 0 -0.0625rem;
-  margin: -0.0625rem;
-  box-shadow: none;
-}
-
-.c24 button {
-  margin-bottom: 0;
-  margin-top: 0;
-}
-
-.c27 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(255,255,255);
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-  min-height: auto;
-  height: 2.875rem;
-  -webkit-flex: 0 0 2.875rem;
-  -ms-flex: 0 0 2.875rem;
-  flex: 0 0 2.875rem;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  z-index: 1;
-  line-height: 1.5rem;
-  height: auto;
-  max-width: 100%;
-  margin: -0.0625rem -0.0625rem 0 -0.0625rem;
-}
-
-.c27 button {
-  margin-bottom: 0;
-  margin-top: 0;
-}
-
 .c5 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -1954,62 +1865,6 @@ Array [
   box-shadow: none;
 }
 
-.c28 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(255,255,255);
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-  min-height: auto;
-  height: 2.875rem;
-  -webkit-flex: 0 0 2.875rem;
-  -ms-flex: 0 0 2.875rem;
-  flex: 0 0 2.875rem;
-  width: 2.875rem;
-  min-width: 2.875rem;
-  min-height: 2.875rem;
-  max-width: 100%;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  background-color: transparent;
-  border-width: 0;
-  border-radius: 0;
-  box-shadow: none;
-}
-
 .c11 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -2068,6 +1923,121 @@ Array [
   color: inherit;
 }
 
+.c13 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c13 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c13 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
+.c23 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: pointer;
+  min-height: auto;
+  height: 2.875rem;
+  -webkit-flex: 0 0 2.875rem;
+  -ms-flex: 0 0 2.875rem;
+  flex: 0 0 2.875rem;
+}
+
+.c24 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: pointer;
+  min-height: auto;
+  height: 2.875rem;
+  -webkit-flex: 0 0 2.875rem;
+  -ms-flex: 0 0 2.875rem;
+  flex: 0 0 2.875rem;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  z-index: 1;
+  line-height: 1.5rem;
+  height: auto;
+  max-width: 100%;
+  margin: -0.0625rem -0.0625rem 0 -0.0625rem;
+  margin: -0.0625rem;
+  box-shadow: none;
+}
+
+.c24 button {
+  margin-bottom: 0;
+  margin-top: 0;
+}
+
 .c25 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -2127,6 +2097,105 @@ Array [
   color: inherit;
 }
 
+.c27 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(255,255,255);
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+  min-height: auto;
+  height: 2.875rem;
+  -webkit-flex: 0 0 2.875rem;
+  -ms-flex: 0 0 2.875rem;
+  flex: 0 0 2.875rem;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  z-index: 1;
+  line-height: 1.5rem;
+  height: auto;
+  max-width: 100%;
+  margin: -0.0625rem -0.0625rem 0 -0.0625rem;
+}
+
+.c27 button {
+  margin-bottom: 0;
+  margin-top: 0;
+}
+
+.c28 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(255,255,255);
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+  min-height: auto;
+  height: 2.875rem;
+  -webkit-flex: 0 0 2.875rem;
+  -ms-flex: 0 0 2.875rem;
+  flex: 0 0 2.875rem;
+  width: 2.875rem;
+  min-width: 2.875rem;
+  min-height: 2.875rem;
+  max-width: 100%;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  background-color: transparent;
+  border-width: 0;
+  border-radius: 0;
+  box-shadow: none;
+}
+
 .c29 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -2188,68 +2257,6 @@ Array [
   color: inherit;
 }
 
-.c9 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c9[type='checkbox'],
-.c9[type='radio'] {
-  box-sizing: border-box;
-  padding: 0;
-}
-
-.c9[type='number']::-webkit-inner-spin-button,
-.c9[type='number']::-webkit-outer-spin-button {
-  height: auto;
-}
-
-.c9[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
-}
-
-.c9[type='search']::-webkit-search-cancel-button,
-.c9[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c9::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c9:checked + label::after {
-  opacity: 1;
-}
-
-.c9:selected + label::after {
-  opacity: 1;
-}
-
-.c9:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c9:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c9:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
-}
-
 .c10 {
   color: rgb(100,100,100);
   position: absolute;
@@ -2325,6 +2332,22 @@ Array [
   -webkit-padding-after: 0;
 }
 
+.c19 {
+  -webkit-order: 0;
+  -ms-flex-order: 0;
+  order: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 1;
+  -ms-flex-negative: 1;
+  flex-shrink: 1;
+}
+
 .c21 {
   margin-right: 0.25rem;
 }
@@ -2398,22 +2421,6 @@ Array [
   align-items: center;
 }
 
-.c19 {
-  -webkit-order: 0;
-  -ms-flex-order: 0;
-  order: 0;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-box-flex: 0;
-  -webkit-flex-grow: 0;
-  -ms-flex-positive: 0;
-  flex-grow: 0;
-  -webkit-flex-shrink: 1;
-  -ms-flex-negative: 1;
-  flex-shrink: 1;
-}
-
 @media only screen and (min-width:0em) {
   .c1 {
     -webkit-flex-basis: 100%;
@@ -2460,7 +2467,7 @@ Array [
                             name="card-header-box"
                         >
                             <div
-                                className="c6"
+                                className="baseline-jVaZNU kXgQxt c6"
                                 name="1"
                                 role="group"
                                 style={undefined}
@@ -2539,6 +2546,7 @@ Array [
                                                     <svg
                                                         className=""
                                                         height="16"
+                                                        innerRef={undefined}
                                                         style={
                                                             Object {
                                                                 "transform": "rotate(0deg)",
@@ -2585,6 +2593,7 @@ Array [
                                                     <svg
                                                         className=""
                                                         height="17"
+                                                        innerRef={undefined}
                                                         style={
                                                             Object {
                                                                 "transform": "rotate(0deg)",
@@ -2653,6 +2662,7 @@ Array [
                                             <svg
                                                 className=""
                                                 height="6"
+                                                innerRef={undefined}
                                                 style={
                                                     Object {
                                                         "transform": "rotate(0deg)",
@@ -2703,7 +2713,7 @@ Array [
                             name="card-header-box"
                         >
                             <div
-                                className="c6"
+                                className="baseline-jVaZNU kXgQxt c6"
                                 name="2"
                                 role="group"
                                 style={undefined}
@@ -2782,6 +2792,7 @@ Array [
                                                     <svg
                                                         className=""
                                                         height="16"
+                                                        innerRef={undefined}
                                                         style={
                                                             Object {
                                                                 "transform": "rotate(0deg)",
@@ -2828,6 +2839,7 @@ Array [
                                                     <svg
                                                         className=""
                                                         height="13"
+                                                        innerRef={undefined}
                                                         style={
                                                             Object {
                                                                 "transform": "rotate(0deg)",
@@ -3061,6 +3073,7 @@ Array [
             <svg
                 className=""
                 height="18"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
@@ -3224,6 +3237,22 @@ Array [
   height: 0.0625rem;
 }
 
+.c5 {
+  -webkit-order: 0;
+  -ms-flex-order: 0;
+  order: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 1;
+  -ms-flex-negative: 1;
+  flex-shrink: 1;
+}
+
 .c12 {
   margin-right: 0.25rem;
 }
@@ -3312,22 +3341,6 @@ Array [
   align-items: center;
 }
 
-.c5 {
-  -webkit-order: 0;
-  -ms-flex-order: 0;
-  order: 0;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-box-flex: 0;
-  -webkit-flex-grow: 0;
-  -ms-flex-positive: 0;
-  flex-grow: 0;
-  -webkit-flex-shrink: 1;
-  -ms-flex-negative: 1;
-  flex-shrink: 1;
-}
-
 .c3 {
   display: inline-block;
   background-color: rgb(255,255,255);
@@ -3420,6 +3433,7 @@ Array [
                                                         <svg
                                                             className=""
                                                             height="16"
+                                                            innerRef={undefined}
                                                             style={
                                                                 Object {
                                                                     "transform": "rotate(0deg)",
@@ -3466,6 +3480,7 @@ Array [
                                                         <svg
                                                             className=""
                                                             height="13"
+                                                            innerRef={undefined}
                                                             style={
                                                                 Object {
                                                                     "transform": "rotate(0deg)",
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/tag.spec.js.snap b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/tag.spec.js.snap
index 8a4c6ab0..260ee4ce 100644
--- a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/tag.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/tag.spec.js.snap
@@ -74,6 +74,7 @@ Array [
             <svg
                 className=""
                 height="17"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
@@ -247,6 +248,7 @@ Array [
             <svg
                 className=""
                 height="17"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
@@ -793,6 +795,32 @@ Array [
   max-height: 1.125rem;
 }
 
+.c11 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c13 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
 .c24 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -900,50 +928,6 @@ Array [
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c6 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c6 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c6 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c1 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -1042,6 +1026,50 @@ Array [
   color: inherit;
 }
 
+.c6 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c6 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c6 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
 .c10 {
   display: inline-block;
   margin: 0;
@@ -1121,68 +1149,6 @@ Array [
   outline: 0;
 }
 
-.c11 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c13 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
-.c3 {
-  padding-right: 1rem;
-  padding-left: 1rem;
-}
-
-.c7 {
-  padding: 1rem;
-}
-
-.c8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-}
-
 .c9 {
   -webkit-order: 0;
   -ms-flex-order: 0;
@@ -1221,6 +1187,42 @@ Array [
   flex-basis: 0.75rem;
 }
 
+.c3 {
+  padding-right: 1rem;
+  padding-left: 1rem;
+}
+
+.c7 {
+  padding: 1rem;
+}
+
+.c8 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+}
+
 .c2 {
   word-wrap: break-word;
   overflow-wrap: break-word;
@@ -1306,7 +1308,7 @@ Array [
                         className="c9"
                     >
                         <div
-                            className="c10"
+                            className="baseline-jVaZNU kXgQxt c10"
                             name="name"
                             role="group"
                             style={undefined}
@@ -1335,7 +1337,7 @@ Array [
                         className="c9"
                     >
                         <div
-                            className="c10"
+                            className="baseline-jVaZNU kXgQxt c10"
                             name="value"
                             role="group"
                             style={undefined}
@@ -1400,6 +1402,7 @@ Array [
                             <svg
                                 className=""
                                 height="12"
+                                innerRef={undefined}
                                 style={
                                     Object {
                                         "transform": "rotate(0deg)",
@@ -1736,6 +1739,7 @@ Array [
             <svg
                 className=""
                 height="17"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
@@ -2235,6 +2239,7 @@ Array [
             <svg
                 className=""
                 height="17"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
@@ -2408,6 +2413,7 @@ Array [
             <svg
                 className=""
                 height="17"
+                innerRef={undefined}
                 style={
                     Object {
                         "transform": "rotate(0deg)",
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/list.spec.js.snap b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/list.spec.js.snap
index 762d34a1..94562064 100644
--- a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/list.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/list.spec.js.snap
@@ -33,6 +33,86 @@ exports[`renders <List /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c22 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c22[type='checkbox'],
+.c22[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c22[type='number']::-webkit-inner-spin-button,
+.c22[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c22[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c22[type='search']::-webkit-search-cancel-button,
+.c22[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c22::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c22:checked + label::after {
+  opacity: 1;
+}
+
+.c22:selected + label::after {
+  opacity: 1;
+}
+
+.c22:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c22:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c22:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
+.c16 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c18 {
+  padding-top: 0.25rem;
+}
+
+.c25 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c29 {
+  padding: 0rem;
+}
+
 .c11 {
   display: inline-block;
 }
@@ -121,6 +201,28 @@ exports[`renders <List /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c6 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
 .c2 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -140,40 +242,6 @@ exports[`renders <List /> without throwing 1`] = `
   margin-left: -0.5rem;
 }
 
-.c4 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c8 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
-.c1 {
-  background-color: rgb(216,216,216);
-  margin: 0;
-  background-color: transparent;
-  height: 1.875rem;
-}
-
 .c3 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -196,74 +264,32 @@ exports[`renders <List /> without throwing 1`] = `
   flex: 1 1 auto;
 }
 
-.c26 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
+.c4 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c8 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c1 {
+  background-color: rgb(216,216,216);
+  margin: 0;
+  background-color: transparent;
+  height: 1.875rem;
 }
 
 .c23 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c23[type='checkbox'],
-.c23[type='radio'] {
-  box-sizing: border-box;
-  padding: 0;
-}
-
-.c23[type='number']::-webkit-inner-spin-button,
-.c23[type='number']::-webkit-outer-spin-button {
-  height: auto;
-}
-
-.c23[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
-}
-
-.c23[type='search']::-webkit-search-cancel-button,
-.c23[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c23::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c23:checked + label::after {
-  opacity: 1;
-}
-
-.c23:selected + label::after {
-  opacity: 1;
-}
-
-.c23:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c23:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c23:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
-}
-
-.c24 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -281,7 +307,7 @@ exports[`renders <List /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c24::after {
+.c23::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -298,7 +324,7 @@ exports[`renders <List /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c22 {
+.c21 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -307,7 +333,7 @@ exports[`renders <List /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c21 {
+.c20 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -319,7 +345,7 @@ exports[`renders <List /> without throwing 1`] = `
   align-items: center;
 }
 
-.c21 label {
+.c20 label {
   font-weight: 400;
 }
 
@@ -355,7 +381,7 @@ exports[`renders <List /> without throwing 1`] = `
   float: right;
 }
 
-.c20 {
+.c19 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -370,14 +396,6 @@ exports[`renders <List /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c19 {
-  padding-top: 0.25rem;
-}
-
-.c18 {
-  padding-top: 0.25rem;
-}
-
 .c7 {
   box-sizing: border-box;
   width: 18.75rem;
@@ -441,19 +459,6 @@ exports[`renders <List /> without throwing 1`] = `
   outline: 0;
 }
 
-.c6 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 .c13 {
   overflow: hidden;
   border-spacing: 0;
@@ -476,11 +481,11 @@ exports[`renders <List /> without throwing 1`] = `
   border-top-right-radius: 0.25rem;
 }
 
-.c32 {
+.c31 {
   width: 100%;
 }
 
-.c32 tr:first-child td {
+.c31 tr:first-child td {
   border-top: none;
 }
 
@@ -510,7 +515,7 @@ exports[`renders <List /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c25 {
+.c24 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -533,11 +538,42 @@ exports[`renders <List /> without throwing 1`] = `
   font-weight: bold;
 }
 
-.c25:not(:first-child) {
+.c24:not(:first-child) {
   border-left-width: 0;
 }
 
-.c25:not(:last-child) {
+.c24:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c26 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 9.375rem;
+  display: table-cell;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c26:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c26:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -550,8 +586,8 @@ exports[`renders <List /> without throwing 1`] = `
   box-sizing: border-box;
   padding: 0 1.5rem;
   height: 3.75rem;
-  width: 9.375rem;
-  display: table-cell;
+  width: 0rem;
+  display: none;
   cursor: pointer;
   -webkit-user-select: none;
   -moz-user-select: none;
@@ -603,38 +639,7 @@ exports[`renders <List /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c29 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c29:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c29:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c31 {
+.c30 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -650,11 +655,11 @@ exports[`renders <List /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c31:not(:first-child) {
+.c30:not(:first-child) {
   border-left-width: 0;
 }
 
-.c31:not(:last-child) {
+.c30:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -678,55 +683,6 @@ exports[`renders <List /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c16 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c30 {
-  padding: 0rem;
-}
-
-@media only screen and (min-width:0em) {
-  .c4 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c4 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c8 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c8 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
 @media only screen and (min-width:48em) {
   .c0 {
     width: 46rem;
@@ -752,15 +708,55 @@ exports[`renders <List /> without throwing 1`] = `
   }
 }
 
+@media only screen and (min-width:0em) {
+  .c4 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c4 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c8 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c8 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
 @media only screen and (min-width:47.9375rem) {
-  .c28 {
+  .c27 {
     width: 10rem;
     display: table-cell;
   }
 }
 
 @media only screen and (min-width:47.9375rem) {
-  .c29 {
+  .c28 {
     width: 8.125rem;
     display: table-cell;
   }
@@ -783,7 +779,7 @@ exports[`renders <List /> without throwing 1`] = `
         className="c4"
       >
         <div
-          className="c5"
+          className="baseline-jVaZNU kXgQxt c5"
           name="filter"
           role="group"
           style={undefined}
@@ -806,7 +802,7 @@ exports[`renders <List /> without throwing 1`] = `
         className="c8"
       >
         <div
-          className="c9"
+          className="baseline-jVaZNU kXgQxt c9"
           role="group"
           style={undefined}
         >
@@ -853,16 +849,16 @@ exports[`renders <List /> without throwing 1`] = `
             selected={undefined}
           >
             <div
-              className="c18 c19 c20"
+              className="c18 baseline-jVaZNU c18 c19"
               role="group"
               style={undefined}
             >
               <li
-                className="c21"
+                className="c20"
               >
                 <div
                   checked={0}
-                  className="c22"
+                  className="c21"
                   disabled={false}
                   id="bc"
                   onChange={[Function]}
@@ -870,14 +866,14 @@ exports[`renders <List /> without throwing 1`] = `
                 >
                   <input
                     checked={false}
-                    className="c23"
+                    className="c22"
                     disabled={false}
                     id="bd"
                     onChange={[Function]}
                     type="checkbox"
                   />
                   <label
-                    className="c24"
+                    className="c23"
                     htmlFor="bd"
                   />
                 </div>
@@ -885,7 +881,7 @@ exports[`renders <List /> without throwing 1`] = `
             </div>
           </th>
           <th
-            className="c25"
+            className="c24"
             disabled={undefined}
             name="th"
             onClick={[Function]}
@@ -895,8 +891,9 @@ exports[`renders <List /> without throwing 1`] = `
               Name 
             </span>
             <svg
-              className="c26"
+              className="c25"
               height="6"
+              innerRef={undefined}
               marginBottom="0.125rem"
               marginLeft="0.5625rem"
               style={
@@ -916,7 +913,7 @@ exports[`renders <List /> without throwing 1`] = `
             </svg>
           </th>
           <th
-            className="c27"
+            className="c26"
             disabled={undefined}
             name="th"
             onClick={[Function]}
@@ -927,7 +924,7 @@ exports[`renders <List /> without throwing 1`] = `
             </span>
           </th>
           <th
-            className="c28"
+            className="c27"
             disabled={undefined}
             name="th"
             onClick={[Function]}
@@ -938,7 +935,7 @@ exports[`renders <List /> without throwing 1`] = `
             </span>
           </th>
           <th
-            className="c29"
+            className="c28"
             disabled={undefined}
             name="th"
             onClick={[Function]}
@@ -949,7 +946,7 @@ exports[`renders <List /> without throwing 1`] = `
             </span>
           </th>
           <th
-            className="c30 c31"
+            className="c29 c30"
             disabled={undefined}
             name="th"
             selected={undefined}
@@ -957,7 +954,7 @@ exports[`renders <List /> without throwing 1`] = `
         </tr>
       </thead>
       <tbody
-        className="c32"
+        className="c31"
         disabled={undefined}
         name="tbody"
         selected={undefined}
@@ -968,26 +965,6 @@ exports[`renders <List /> without throwing 1`] = `
 `;
 
 exports[`renders <List error /> without throwing 1`] = `
-.c17 {
-  color: rgba(73,73,73,1);
-  line-height: 1.5rem;
-  font-size: 0.9375rem;
-  margin: 0;
-}
-
-.c17 + p,
-.c17 + small,
-.c17 + h1,
-.c17 + h2,
-.c17 + label,
-.c17 + h3,
-.c17 + h4,
-.c17 + h5,
-.c17 + div,
-.c17 + span {
-  padding-bottom: 2.25rem;
-}
-
 .c12 {
   font-family: sans-serif;
   font-size: 100%;
@@ -1020,6 +997,106 @@ exports[`renders <List error /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c28 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c28[type='checkbox'],
+.c28[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c28[type='number']::-webkit-inner-spin-button,
+.c28[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c28[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c28[type='search']::-webkit-search-cancel-button,
+.c28[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c28::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c28:checked + label::after {
+  opacity: 1;
+}
+
+.c28:selected + label::after {
+  opacity: 1;
+}
+
+.c28:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c28:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c28:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
+.c22 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c24 {
+  padding-top: 0.25rem;
+}
+
+.c31 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c35 {
+  padding: 0rem;
+}
+
+.c17 {
+  color: rgba(73,73,73,1);
+  line-height: 1.5rem;
+  font-size: 0.9375rem;
+  margin: 0;
+}
+
+.c17 + p,
+.c17 + small,
+.c17 + h1,
+.c17 + h2,
+.c17 + label,
+.c17 + h3,
+.c17 + h4,
+.c17 + h5,
+.c17 + div,
+.c17 + span {
+  padding-bottom: 2.25rem;
+}
+
 .c11 {
   display: inline-block;
 }
@@ -1108,6 +1185,28 @@ exports[`renders <List error /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c6 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
 .c2 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -1127,6 +1226,28 @@ exports[`renders <List error /> without throwing 1`] = `
   margin-left: -0.5rem;
 }
 
+.c3 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
 .c4 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
@@ -1145,15 +1266,6 @@ exports[`renders <List error /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
 .c16 {
   color: rgba(73,73,73,1);
   font-weight: 600;
@@ -1182,96 +1294,7 @@ exports[`renders <List error /> without throwing 1`] = `
   height: 1.875rem;
 }
 
-.c3 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
-.c32 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
 .c29 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c29[type='checkbox'],
-.c29[type='radio'] {
-  box-sizing: border-box;
-  padding: 0;
-}
-
-.c29[type='number']::-webkit-inner-spin-button,
-.c29[type='number']::-webkit-outer-spin-button {
-  height: auto;
-}
-
-.c29[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
-}
-
-.c29[type='search']::-webkit-search-cancel-button,
-.c29[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c29::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c29:checked + label::after {
-  opacity: 1;
-}
-
-.c29:selected + label::after {
-  opacity: 1;
-}
-
-.c29:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c29:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c29:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
-}
-
-.c30 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -1289,7 +1312,7 @@ exports[`renders <List error /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c30::after {
+.c29::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -1306,7 +1329,7 @@ exports[`renders <List error /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c28 {
+.c27 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -1315,7 +1338,7 @@ exports[`renders <List error /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c27 {
+.c26 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1327,7 +1350,7 @@ exports[`renders <List error /> without throwing 1`] = `
   align-items: center;
 }
 
-.c27 label {
+.c26 label {
   font-weight: 400;
 }
 
@@ -1363,7 +1386,7 @@ exports[`renders <List error /> without throwing 1`] = `
   float: right;
 }
 
-.c26 {
+.c25 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -1378,14 +1401,6 @@ exports[`renders <List error /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c25 {
-  padding-top: 0.25rem;
-}
-
-.c24 {
-  padding-top: 0.25rem;
-}
-
 .c7 {
   box-sizing: border-box;
   width: 18.75rem;
@@ -1449,19 +1464,6 @@ exports[`renders <List error /> without throwing 1`] = `
   outline: 0;
 }
 
-.c6 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 .c13 {
   position: relative;
   margin-bottom: 0.75rem;
@@ -1515,11 +1517,11 @@ exports[`renders <List error /> without throwing 1`] = `
   border-top-right-radius: 0.25rem;
 }
 
-.c38 {
+.c37 {
   width: 100%;
 }
 
-.c38 tr:first-child td {
+.c37 tr:first-child td {
   border-top: none;
 }
 
@@ -1549,7 +1551,7 @@ exports[`renders <List error /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c31 {
+.c30 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -1572,11 +1574,42 @@ exports[`renders <List error /> without throwing 1`] = `
   font-weight: bold;
 }
 
-.c31:not(:first-child) {
+.c30:not(:first-child) {
   border-left-width: 0;
 }
 
-.c31:not(:last-child) {
+.c30:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c32 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 9.375rem;
+  display: table-cell;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c32:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c32:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -1589,8 +1622,8 @@ exports[`renders <List error /> without throwing 1`] = `
   box-sizing: border-box;
   padding: 0 1.5rem;
   height: 3.75rem;
-  width: 9.375rem;
-  display: table-cell;
+  width: 0rem;
+  display: none;
   cursor: pointer;
   -webkit-user-select: none;
   -moz-user-select: none;
@@ -1642,38 +1675,7 @@ exports[`renders <List error /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c35 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c35:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c35:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c37 {
+.c36 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -1689,11 +1691,11 @@ exports[`renders <List error /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c37:not(:first-child) {
+.c36:not(:first-child) {
   border-left-width: 0;
 }
 
-.c37:not(:last-child) {
+.c36:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -1717,55 +1719,6 @@ exports[`renders <List error /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c22 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c36 {
-  padding: 0rem;
-}
-
-@media only screen and (min-width:0em) {
-  .c4 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c4 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c8 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c8 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
 @media only screen and (min-width:48em) {
   .c0 {
     width: 46rem;
@@ -1791,15 +1744,55 @@ exports[`renders <List error /> without throwing 1`] = `
   }
 }
 
+@media only screen and (min-width:0em) {
+  .c4 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c4 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c8 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c8 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
 @media only screen and (min-width:47.9375rem) {
-  .c34 {
+  .c33 {
     width: 10rem;
     display: table-cell;
   }
 }
 
 @media only screen and (min-width:47.9375rem) {
-  .c35 {
+  .c34 {
     width: 8.125rem;
     display: table-cell;
   }
@@ -1822,7 +1815,7 @@ exports[`renders <List error /> without throwing 1`] = `
         className="c4"
       >
         <div
-          className="c5"
+          className="baseline-jVaZNU kXgQxt c5"
           name="filter"
           role="group"
           style={undefined}
@@ -1845,7 +1838,7 @@ exports[`renders <List error /> without throwing 1`] = `
         className="c8"
       >
         <div
-          className="c9"
+          className="baseline-jVaZNU kXgQxt c9"
           role="group"
           style={undefined}
         >
@@ -1892,6 +1885,7 @@ exports[`renders <List error /> without throwing 1`] = `
     <svg
       className="c18 "
       height="12"
+      innerRef={undefined}
       onClick={[Function]}
       style={
         Object {
@@ -1932,16 +1926,16 @@ exports[`renders <List error /> without throwing 1`] = `
             selected={undefined}
           >
             <div
-              className="c24 c25 c26"
+              className="c24 baseline-jVaZNU c24 c25"
               role="group"
               style={undefined}
             >
               <li
-                className="c27"
+                className="c26"
               >
                 <div
                   checked={0}
-                  className="c28"
+                  className="c27"
                   disabled={false}
                   id="bl"
                   onChange={[Function]}
@@ -1949,14 +1943,14 @@ exports[`renders <List error /> without throwing 1`] = `
                 >
                   <input
                     checked={false}
-                    className="c29"
+                    className="c28"
                     disabled={false}
                     id="bm"
                     onChange={[Function]}
                     type="checkbox"
                   />
                   <label
-                    className="c30"
+                    className="c29"
                     htmlFor="bm"
                   />
                 </div>
@@ -1964,7 +1958,7 @@ exports[`renders <List error /> without throwing 1`] = `
             </div>
           </th>
           <th
-            className="c31"
+            className="c30"
             disabled={undefined}
             name="th"
             onClick={[Function]}
@@ -1974,8 +1968,9 @@ exports[`renders <List error /> without throwing 1`] = `
               Name 
             </span>
             <svg
-              className="c32"
+              className="c31"
               height="6"
+              innerRef={undefined}
               marginBottom="0.125rem"
               marginLeft="0.5625rem"
               style={
@@ -1995,7 +1990,7 @@ exports[`renders <List error /> without throwing 1`] = `
             </svg>
           </th>
           <th
-            className="c33"
+            className="c32"
             disabled={undefined}
             name="th"
             onClick={[Function]}
@@ -2006,7 +2001,7 @@ exports[`renders <List error /> without throwing 1`] = `
             </span>
           </th>
           <th
-            className="c34"
+            className="c33"
             disabled={undefined}
             name="th"
             onClick={[Function]}
@@ -2017,7 +2012,7 @@ exports[`renders <List error /> without throwing 1`] = `
             </span>
           </th>
           <th
-            className="c35"
+            className="c34"
             disabled={undefined}
             name="th"
             onClick={[Function]}
@@ -2028,7 +2023,7 @@ exports[`renders <List error /> without throwing 1`] = `
             </span>
           </th>
           <th
-            className="c36 c37"
+            className="c35 c36"
             disabled={undefined}
             name="th"
             selected={undefined}
@@ -2036,7 +2031,7 @@ exports[`renders <List error /> without throwing 1`] = `
         </tr>
       </thead>
       <tbody
-        className="c38"
+        className="c37"
         disabled={undefined}
         name="tbody"
         selected={undefined}
@@ -2047,20 +2042,11 @@ exports[`renders <List error /> without throwing 1`] = `
 `;
 
 exports[`renders <List instances /> without throwing 1`] = `
-.c37 {
+.c35 {
   background-color: transparent;
   text-decoration-skip: objects;
 }
 
-.c36 {
-  color: rgb(59,70,204);
-  -webkit-text-fill-color: currentcolor;
-}
-
-.c36:hover {
-  text-decoration: none;
-}
-
 .c12 {
   font-family: sans-serif;
   font-size: 100%;
@@ -2093,6 +2079,101 @@ exports[`renders <List instances /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c22 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c22[type='checkbox'],
+.c22[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c22[type='number']::-webkit-inner-spin-button,
+.c22[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c22[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c22[type='search']::-webkit-search-cancel-button,
+.c22[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c22::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c22:checked + label::after {
+  opacity: 1;
+}
+
+.c22:selected + label::after {
+  opacity: 1;
+}
+
+.c22:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c22:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c22:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
+.c34 {
+  color: rgb(59,70,204);
+  -webkit-text-fill-color: currentcolor;
+}
+
+.c34:hover {
+  text-decoration: none;
+}
+
+.c16 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c18 {
+  padding-top: 0.25rem;
+}
+
+.c25 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c29 {
+  padding: 0rem;
+}
+
+.c36 {
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 0.6875rem;
+}
+
 .c11 {
   display: inline-block;
 }
@@ -2181,6 +2262,28 @@ exports[`renders <List instances /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c6 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
 .c2 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -2200,40 +2303,6 @@ exports[`renders <List instances /> without throwing 1`] = `
   margin-left: -0.5rem;
 }
 
-.c4 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c8 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
-.c1 {
-  background-color: rgb(216,216,216);
-  margin: 0;
-  background-color: transparent;
-  height: 1.875rem;
-}
-
 .c3 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -2256,85 +2325,40 @@ exports[`renders <List instances /> without throwing 1`] = `
   flex: 1 1 auto;
 }
 
-.c26 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
+.c4 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
 }
 
-.c38 {
+.c8 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c1 {
+  background-color: rgb(216,216,216);
+  margin: 0;
+  background-color: transparent;
+  height: 1.875rem;
+}
+
+.c37 {
   width: 0.375rem;
   height: 0.375rem;
-  border-radius: 0.1875rem;
+  border-radius: 50%;
   background-color: rgb(0,152,88);
   display: inline-block;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 0.6875rem;
 }
 
 .c23 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c23[type='checkbox'],
-.c23[type='radio'] {
-  box-sizing: border-box;
-  padding: 0;
-}
-
-.c23[type='number']::-webkit-inner-spin-button,
-.c23[type='number']::-webkit-outer-spin-button {
-  height: auto;
-}
-
-.c23[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
-}
-
-.c23[type='search']::-webkit-search-cancel-button,
-.c23[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c23::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c23:checked + label::after {
-  opacity: 1;
-}
-
-.c23:selected + label::after {
-  opacity: 1;
-}
-
-.c23:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c23:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c23:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
-}
-
-.c24 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -2352,7 +2376,7 @@ exports[`renders <List instances /> without throwing 1`] = `
   height: 1.125rem;
 }
 
-.c24::after {
+.c23::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -2369,7 +2393,7 @@ exports[`renders <List instances /> without throwing 1`] = `
   transform: rotate(-45deg);
 }
 
-.c22 {
+.c21 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -2378,7 +2402,7 @@ exports[`renders <List instances /> without throwing 1`] = `
   cursor: pointer;
 }
 
-.c21 {
+.c20 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -2390,7 +2414,7 @@ exports[`renders <List instances /> without throwing 1`] = `
   align-items: center;
 }
 
-.c21 label {
+.c20 label {
   font-weight: 400;
 }
 
@@ -2426,7 +2450,7 @@ exports[`renders <List instances /> without throwing 1`] = `
   float: right;
 }
 
-.c20 {
+.c19 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -2441,14 +2465,6 @@ exports[`renders <List instances /> without throwing 1`] = `
   -webkit-padding-after: 0;
 }
 
-.c19 {
-  padding-top: 0.25rem;
-}
-
-.c18 {
-  padding-top: 0.25rem;
-}
-
 .c7 {
   box-sizing: border-box;
   width: 18.75rem;
@@ -2512,20 +2528,7 @@ exports[`renders <List instances /> without throwing 1`] = `
   outline: 0;
 }
 
-.c6 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c43 {
+.c41 {
   cursor: pointer;
   height: 100%;
   width: 100%;
@@ -2565,11 +2568,11 @@ exports[`renders <List instances /> without throwing 1`] = `
   border-top-right-radius: 0.25rem;
 }
 
-.c32 {
+.c31 {
   width: 100%;
 }
 
-.c32 tr:first-child td {
+.c31 tr:first-child td {
   border-top: none;
 }
 
@@ -2599,7 +2602,7 @@ exports[`renders <List instances /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c25 {
+.c24 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -2622,11 +2625,42 @@ exports[`renders <List instances /> without throwing 1`] = `
   font-weight: bold;
 }
 
-.c25:not(:first-child) {
+.c24:not(:first-child) {
   border-left-width: 0;
 }
 
-.c25:not(:last-child) {
+.c24:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c26 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 9.375rem;
+  display: table-cell;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c26:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c26:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -2639,8 +2673,8 @@ exports[`renders <List instances /> without throwing 1`] = `
   box-sizing: border-box;
   padding: 0 1.5rem;
   height: 3.75rem;
-  width: 9.375rem;
-  display: table-cell;
+  width: 0rem;
+  display: none;
   cursor: pointer;
   -webkit-user-select: none;
   -moz-user-select: none;
@@ -2692,38 +2726,7 @@ exports[`renders <List instances /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c29 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c29:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c29:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c31 {
+.c30 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -2739,15 +2742,15 @@ exports[`renders <List instances /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c31:not(:first-child) {
+.c30:not(:first-child) {
   border-left-width: 0;
 }
 
-.c31:not(:last-child) {
+.c30:not(:last-child) {
   border-right-width: 0;
 }
 
-.c35 {
+.c33 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -2761,11 +2764,35 @@ exports[`renders <List instances /> without throwing 1`] = `
   border-bottom-width: 0;
 }
 
-.c35:not(:first-child) {
+.c33:not(:first-child) {
   border-left-width: 0;
 }
 
-.c35:not(:last-child) {
+.c33:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c38 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 0rem;
+  display: none;
+  vertical-align: middle;
+  text-align: left;
+  border-bottom-width: 0;
+}
+
+.c38:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c38:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -2802,11 +2829,8 @@ exports[`renders <List instances /> without throwing 1`] = `
   box-sizing: border-box;
   padding: 0 1.5rem;
   height: 3.75rem;
-  width: 0rem;
-  display: none;
-  vertical-align: middle;
-  text-align: left;
   border-bottom-width: 0;
+  border-left-width: 0.0625rem !important;
 }
 
 .c40:not(:first-child) {
@@ -2817,27 +2841,6 @@ exports[`renders <List instances /> without throwing 1`] = `
   border-right-width: 0;
 }
 
-.c42 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  border-bottom-width: 0;
-  border-left-width: 0.0625rem !important;
-}
-
-.c42:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c42:not(:last-child) {
-  border-right-width: 0;
-}
-
 .c15 {
   display: table-row;
   color: rgba(73,73,73,1);
@@ -2858,7 +2861,7 @@ exports[`renders <List instances /> without throwing 1`] = `
   border-bottom-width: 0.0625rem;
 }
 
-.c33 {
+.c32 {
   display: table-row;
   color: rgba(73,73,73,1);
   background-color: rgb(255,255,255);
@@ -2866,72 +2869,14 @@ exports[`renders <List instances /> without throwing 1`] = `
   box-sizing: border-box;
 }
 
-.c33:last-child {
+.c32:last-child {
   box-shadow: none;
 }
 
-.c33:last-child td {
+.c32:last-child td {
   border-bottom-width: 0.0625rem;
 }
 
-.c16 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c30 {
-  padding: 0rem;
-}
-
-.c34 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c41 {
-  padding: 0rem;
-}
-
-@media only screen and (min-width:0em) {
-  .c4 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c4 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c8 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c8 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
 @media only screen and (min-width:48em) {
   .c0 {
     width: 46rem;
@@ -2957,29 +2902,69 @@ exports[`renders <List instances /> without throwing 1`] = `
   }
 }
 
+@media only screen and (min-width:0em) {
+  .c4 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c4 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c8 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c8 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
 @media only screen and (min-width:47.9375rem) {
-  .c28 {
+  .c27 {
     width: 10rem;
     display: table-cell;
   }
 }
 
 @media only screen and (min-width:47.9375rem) {
-  .c29 {
+  .c28 {
     width: 8.125rem;
     display: table-cell;
   }
 }
 
 @media only screen and (min-width:47.9375rem) {
-  .c39 {
+  .c38 {
     width: 10rem;
     display: table-cell;
   }
 }
 
 @media only screen and (min-width:47.9375rem) {
-  .c40 {
+  .c39 {
     width: 8.125rem;
     display: table-cell;
   }
@@ -3002,7 +2987,7 @@ exports[`renders <List instances /> without throwing 1`] = `
         className="c4"
       >
         <div
-          className="c5"
+          className="baseline-jVaZNU kXgQxt c5"
           name="filter"
           role="group"
           style={undefined}
@@ -3025,7 +3010,7 @@ exports[`renders <List instances /> without throwing 1`] = `
         className="c8"
       >
         <div
-          className="c9"
+          className="baseline-jVaZNU kXgQxt c9"
           role="group"
           style={undefined}
         >
@@ -3072,16 +3057,16 @@ exports[`renders <List instances /> without throwing 1`] = `
             selected={undefined}
           >
             <div
-              className="c18 c19 c20"
+              className="c18 baseline-jVaZNU c18 c19"
               role="group"
               style={undefined}
             >
               <li
-                className="c21"
+                className="c20"
               >
                 <div
                   checked={false}
-                  className="c22"
+                  className="c21"
                   disabled={false}
                   id="br"
                   onChange={[Function]}
@@ -3089,14 +3074,14 @@ exports[`renders <List instances /> without throwing 1`] = `
                 >
                   <input
                     checked={false}
-                    className="c23"
+                    className="c22"
                     disabled={false}
                     id="bs"
                     onChange={[Function]}
                     type="checkbox"
                   />
                   <label
-                    className="c24"
+                    className="c23"
                     htmlFor="bs"
                   />
                 </div>
@@ -3104,7 +3089,7 @@ exports[`renders <List instances /> without throwing 1`] = `
             </div>
           </th>
           <th
-            className="c25"
+            className="c24"
             disabled={undefined}
             name="th"
             onClick={[Function]}
@@ -3114,8 +3099,9 @@ exports[`renders <List instances /> without throwing 1`] = `
               Name 
             </span>
             <svg
-              className="c26"
+              className="c25"
               height="6"
+              innerRef={undefined}
               marginBottom="0.125rem"
               marginLeft="0.5625rem"
               style={
@@ -3135,7 +3121,7 @@ exports[`renders <List instances /> without throwing 1`] = `
             </svg>
           </th>
           <th
-            className="c27"
+            className="c26"
             disabled={undefined}
             name="th"
             onClick={[Function]}
@@ -3146,7 +3132,7 @@ exports[`renders <List instances /> without throwing 1`] = `
             </span>
           </th>
           <th
-            className="c28"
+            className="c27"
             disabled={undefined}
             name="th"
             onClick={[Function]}
@@ -3157,7 +3143,7 @@ exports[`renders <List instances /> without throwing 1`] = `
             </span>
           </th>
           <th
-            className="c29"
+            className="c28"
             disabled={undefined}
             name="th"
             onClick={[Function]}
@@ -3168,7 +3154,7 @@ exports[`renders <List instances /> without throwing 1`] = `
             </span>
           </th>
           <th
-            className="c30 c31"
+            className="c29 c30"
             disabled={undefined}
             name="th"
             selected={undefined}
@@ -3176,48 +3162,48 @@ exports[`renders <List instances /> without throwing 1`] = `
         </tr>
       </thead>
       <tbody
-        className="c32"
+        className="c31"
         disabled={undefined}
         name="tbody"
         selected={undefined}
       >
         <tr
-          className="c33"
+          className="c32"
           disabled={undefined}
           name="tr"
           selected={undefined}
         >
           <td
-            className="c34 c35"
+            className="c16 c33"
             disabled={undefined}
             name="td"
             selected={undefined}
           >
             <div
-              className="c18 c19 c20"
+              className="c18 baseline-jVaZNU c18 c19"
               name=""
               role="group"
               style={undefined}
             >
               <li
-                className="c21"
+                className="c20"
               >
                 <div
                   checked={false}
-                  className="c22"
+                  className="c21"
                   disabled={false}
                   id="bt"
                   type="checkbox"
                 >
                   <input
                     checked={false}
-                    className="c23"
+                    className="c22"
                     disabled={false}
                     id="bu"
                     type="checkbox"
                   />
                   <label
-                    className="c24"
+                    className="c23"
                     htmlFor="bu"
                   />
                 </div>
@@ -3225,27 +3211,27 @@ exports[`renders <List instances /> without throwing 1`] = `
             </div>
           </td>
           <td
-            className="c35"
+            className="c33"
             disabled={undefined}
             name="td"
             selected={undefined}
           >
             <a
-              className="c36 c37"
+              className="c34 c35"
               to="/instances/2252839a"
             >
               2252839a
             </a>
           </td>
           <td
-            className="c35"
+            className="c33"
             disabled={undefined}
             name="td"
             selected={undefined}
           >
             <span>
               <span
-                className="c38"
+                className="c36 c37"
                 color="green"
                 height="0.6875rem"
                 width="0.6875rem"
@@ -3255,7 +3241,7 @@ exports[`renders <List instances /> without throwing 1`] = `
             </span>
           </td>
           <td
-            className="c39"
+            className="c38"
             disabled={undefined}
             name="td"
             selected={undefined}
@@ -3263,7 +3249,7 @@ exports[`renders <List instances /> without throwing 1`] = `
             almost NaN years
           </td>
           <td
-            className="c40"
+            className="c39"
             disabled={undefined}
             name="td"
             selected={undefined}
@@ -3273,14 +3259,14 @@ exports[`renders <List instances /> without throwing 1`] = `
             </code>
           </td>
           <td
-            className="c41 c42"
+            className="c29 c40"
             disabled={undefined}
             name="td"
             selected={undefined}
           >
             <div
               box={true}
-              className="c43"
+              className="c41"
               onClick={[Function]}
               onMouseEnter={undefined}
               onMouseLeave={undefined}
@@ -3289,6 +3275,7 @@ exports[`renders <List instances /> without throwing 1`] = `
               <svg
                 className=""
                 height="16"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -3328,42 +3315,42 @@ exports[`renders <List instances /> without throwing 1`] = `
           </td>
         </tr>
         <tr
-          className="c33"
+          className="c32"
           disabled={undefined}
           name="tr"
           selected={undefined}
         >
           <td
-            className="c34 c35"
+            className="c16 c33"
             disabled={undefined}
             name="td"
             selected={undefined}
           >
             <div
-              className="c18 c19 c20"
+              className="c18 baseline-jVaZNU c18 c19"
               name=""
               role="group"
               style={undefined}
             >
               <li
-                className="c21"
+                className="c20"
               >
                 <div
                   checked={false}
-                  className="c22"
+                  className="c21"
                   disabled={false}
                   id="bv"
                   type="checkbox"
                 >
                   <input
                     checked={false}
-                    className="c23"
+                    className="c22"
                     disabled={false}
                     id="bw"
                     type="checkbox"
                   />
                   <label
-                    className="c24"
+                    className="c23"
                     htmlFor="bw"
                   />
                 </div>
@@ -3371,27 +3358,27 @@ exports[`renders <List instances /> without throwing 1`] = `
             </div>
           </td>
           <td
-            className="c35"
+            className="c33"
             disabled={undefined}
             name="td"
             selected={undefined}
           >
             <a
-              className="c36 c37"
+              className="c34 c35"
               to="/instances/f1bd1730"
             >
               f1bd1730
             </a>
           </td>
           <td
-            className="c35"
+            className="c33"
             disabled={undefined}
             name="td"
             selected={undefined}
           >
             <span>
               <span
-                className="c38"
+                className="c36 c37"
                 color="green"
                 height="0.6875rem"
                 width="0.6875rem"
@@ -3401,7 +3388,7 @@ exports[`renders <List instances /> without throwing 1`] = `
             </span>
           </td>
           <td
-            className="c39"
+            className="c38"
             disabled={undefined}
             name="td"
             selected={undefined}
@@ -3409,7 +3396,7 @@ exports[`renders <List instances /> without throwing 1`] = `
             almost NaN years
           </td>
           <td
-            className="c40"
+            className="c39"
             disabled={undefined}
             name="td"
             selected={undefined}
@@ -3419,14 +3406,14 @@ exports[`renders <List instances /> without throwing 1`] = `
             </code>
           </td>
           <td
-            className="c41 c42"
+            className="c29 c40"
             disabled={undefined}
             name="td"
             selected={undefined}
           >
             <div
               box={true}
-              className="c43"
+              className="c41"
               onClick={[Function]}
               onMouseEnter={undefined}
               onMouseLeave={undefined}
@@ -3435,6 +3422,7 @@ exports[`renders <List instances /> without throwing 1`] = `
               <svg
                 className=""
                 height="16"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -3480,20 +3468,11 @@ exports[`renders <List instances /> without throwing 1`] = `
 `;
 
 exports[`renders <List instances selected /> without throwing 1`] = `
-.c37 {
+.c35 {
   background-color: transparent;
   text-decoration-skip: objects;
 }
 
-.c36 {
-  color: rgb(59,70,204);
-  -webkit-text-fill-color: currentcolor;
-}
-
-.c36:hover {
-  text-decoration: none;
-}
-
 .c12 {
   font-family: sans-serif;
   font-size: 100%;
@@ -3526,6 +3505,108 @@ exports[`renders <List instances selected /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c22 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c22[type='checkbox'],
+.c22[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c22[type='number']::-webkit-inner-spin-button,
+.c22[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c22[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c22[type='search']::-webkit-search-cancel-button,
+.c22[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c22::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c22:checked + label::after {
+  opacity: 1;
+}
+
+.c22:selected + label::after {
+  opacity: 1;
+}
+
+.c22:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c22:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c22:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
+.c34 {
+  color: rgb(59,70,204);
+  -webkit-text-fill-color: currentcolor;
+}
+
+.c34:hover {
+  text-decoration: none;
+}
+
+.c16 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c18 {
+  padding-top: 0.25rem;
+}
+
+.c25 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c29 {
+  padding: 0rem;
+}
+
+.c36 {
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 0.6875rem;
+}
+
+.c42 {
+  background-color: rgba(241,241,241,1);
+  border-top: 0.0625rem solid rgb(216,216,216);
+  height: 4.375rem;
+  max-height: 4.375rem;
+}
+
 .c11 {
   display: inline-block;
 }
@@ -3614,7 +3695,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c49 {
+.c47 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3674,75 +3755,75 @@ exports[`renders <List instances selected /> without throwing 1`] = `
   align-items: center;
 }
 
-.c49:focus {
+.c47:focus {
   outline: 0;
   text-decoration: none;
   background-color: rgb(59,70,204);
   border-color: rgb(45,56,132);
 }
 
-.c49:hover {
+.c47:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c49:active,
-.c49:active:hover,
-.c49:active:focus {
+.c47:active,
+.c47:active:hover,
+.c47:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c49[disabled] {
+.c47[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c49:focus {
+.c47:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c49:hover {
+.c47:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c49:active,
-.c49:active:hover,
-.c49:active:focus {
+.c47:active,
+.c47:active:hover,
+.c47:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c49:focus {
+.c47:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c49:hover {
+.c47:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c49:active,
-.c49:active:hover,
-.c49:active:focus {
+.c47:active,
+.c47:active:hover,
+.c47:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c49 svg + span {
+.c47 svg + span {
   margin-left: 0.75rem;
 }
 
-.c49 svg {
+.c47 svg {
   max-height: 1.125rem;
 }
 
-.c50 {
+.c48 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3799,6 +3880,139 @@ exports[`renders <List instances selected /> without throwing 1`] = `
   align-items: center;
 }
 
+.c48:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c48:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c48:active,
+.c48:active:hover,
+.c48:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c48[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c48:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c48:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c48:active,
+.c48:active:hover,
+.c48:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c48:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c48:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c48:active,
+.c48:active:hover,
+.c48:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c48 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c48 svg {
+  max-height: 1.125rem;
+}
+
+.c50 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  float: right;
+}
+
 .c50:focus {
   outline: 0;
   text-decoration: none;
@@ -3843,2626 +4057,20 @@ exports[`renders <List instances selected /> without throwing 1`] = `
 }
 
 .c50:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c50:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c50:active,
-.c50:active:hover,
-.c50:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c50 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c50 svg {
-  max-height: 1.125rem;
-}
-
-.c52 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(210,67,58);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  float: right;
-}
-
-.c52:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c52:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c52:active,
-.c52:active:hover,
-.c52:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c52[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c52:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c52:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c52:active,
-.c52:active:hover,
-.c52:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c52:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-}
-
-.c52:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(210,67,58);
-}
-
-.c52:active,
-.c52:active:hover,
-.c52:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(210,67,58);
-}
-
-.c52:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c52:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c52:active,
-.c52:active:hover,
-.c52:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c52 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c52 svg {
-  max-height: 1.125rem;
-}
-
-.c53 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  float: right;
-}
-
-.c53:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c53:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c53:active,
-.c53:active:hover,
-.c53:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c53[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c53:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c53:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c53:active,
-.c53:active:hover,
-.c53:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c53:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-}
-
-.c53:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(210,67,58);
-}
-
-.c53:active,
-.c53:active:hover,
-.c53:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(210,67,58);
-}
-
-.c53:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c53:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c53:active,
-.c53:active:hover,
-.c53:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c53 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c53 svg {
-  max-height: 1.125rem;
-}
-
-.c2 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-}
-
-.c4 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c8 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c48 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c51 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
-.c1 {
-  background-color: rgb(216,216,216);
-  margin: 0;
-  background-color: transparent;
-  height: 1.875rem;
-}
-
-.c46 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-  -webkit-align-items: stretch;
-  -webkit-box-align: stretch;
-  -ms-flex-align: stretch;
-  align-items: stretch;
-}
-
-.c45 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-  -webkit-align-items: stretch;
-  -webkit-box-align: stretch;
-  -ms-flex-align: stretch;
-  align-items: stretch;
-  background-color: rgb(30,49,59);
-  max-height: 3.3125rem;
-  min-height: 3.3125rem;
-  line-height: 1.5625rem;
-  position: fixed;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-
-.c44 {
-  background-color: rgba(241,241,241,1);
-  border-top: 0.0625rem solid rgb(216,216,216);
-  height: 4.375rem;
-  max-height: 4.375rem;
-}
-
-.c3 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
-.c47 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
-.c26 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
-.c38 {
-  width: 0.375rem;
-  height: 0.375rem;
-  border-radius: 0.1875rem;
-  background-color: rgb(0,152,88);
-  display: inline-block;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 0.6875rem;
-}
-
-.c23 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c23[type='checkbox'],
-.c23[type='radio'] {
-  box-sizing: border-box;
-  padding: 0;
-}
-
-.c23[type='number']::-webkit-inner-spin-button,
-.c23[type='number']::-webkit-outer-spin-button {
-  height: auto;
-}
-
-.c23[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
-}
-
-.c23[type='search']::-webkit-search-cancel-button,
-.c23[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c23::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c23:checked + label::after {
-  opacity: 1;
-}
-
-.c23:selected + label::after {
-  opacity: 1;
-}
-
-.c23:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c23:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c23:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
-}
-
-.c24 {
-  color: rgb(100,100,100);
-  position: absolute;
-  width: 1.125rem;
-  height: 1.125rem;
-  box-sizing: border-box;
-  top: 0;
-  right: 0;
-  cursor: pointer;
-  background-color: rgb(255,255,255);
-  box-shadow: none;
-  border: 0.0625rem solid rgb(216,216,216);
-  cursor: pointer;
-  border-radius: 0.25rem;
-  width: 1.125rem;
-  height: 1.125rem;
-}
-
-.c24::after {
-  opacity: 0;
-  content: '';
-  position: absolute;
-  width: 0.375rem;
-  height: 0.125rem;
-  background: transparent;
-  top: 0.3125rem;
-  left: 0.25rem;
-  border: 0.125rem solid rgb(45,45,45);
-  border-top: none;
-  border-right: none;
-  -webkit-transform: rotate(-45deg);
-  -ms-transform: rotate(-45deg);
-  transform: rotate(-45deg);
-}
-
-.c22 {
-  display: inline-block;
-  vertical-align: text-bottom;
-  width: 1.125rem;
-  height: 1.125rem;
-  position: relative;
-  cursor: pointer;
-}
-
-.c21 {
-  list-style-type: none;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.c21 label {
-  font-weight: 400;
-}
-
-.c5 {
-  display: inline-block;
-  margin: 0;
-  padding: 0;
-  border: none;
-  overflow: hidden;
-  height: auto;
-  -webkit-margin-start: 0;
-  -webkit-margin-end: 0;
-  -webkit-padding-before: 0;
-  -webkit-padding-start: 0;
-  -webkit-padding-end: 0;
-  -webkit-padding-after: 0;
-  width: 100%;
-}
-
-.c9 {
-  display: inline-block;
-  margin: 0;
-  padding: 0;
-  border: none;
-  overflow: hidden;
-  height: auto;
-  -webkit-margin-start: 0;
-  -webkit-margin-end: 0;
-  -webkit-padding-before: 0;
-  -webkit-padding-start: 0;
-  -webkit-padding-end: 0;
-  -webkit-padding-after: 0;
-  float: right;
-}
-
-.c20 {
-  display: inline-block;
-  margin: 0;
-  padding: 0;
-  border: none;
-  overflow: hidden;
-  height: auto;
-  -webkit-margin-start: 0;
-  -webkit-margin-end: 0;
-  -webkit-padding-before: 0;
-  -webkit-padding-start: 0;
-  -webkit-padding-end: 0;
-  -webkit-padding-after: 0;
-}
-
-.c19 {
-  padding-top: 0.25rem;
-}
-
-.c18 {
-  padding-top: 0.25rem;
-}
-
-.c7 {
-  box-sizing: border-box;
-  width: 18.75rem;
-  height: 3rem;
-  min-height: 3rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.8125rem 1.125rem;
-  border-radius: 0.25rem;
-  background-color: rgb(255,255,255);
-  border: 0.0625rem solid rgb(216,216,216);
-  color: rgba(73,73,73,1);
-  width: 100%;
-  text-overflow: ellipsis;
-  font-size: 0.9375rem;
-  line-height: normal !important;
-  font-style: normal;
-  font-stretch: normal;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-  outline: 0;
-}
-
-.c7::-webkit-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c7::-moz-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c7:-ms-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c7:invalid {
-  box-shadow: none;
-}
-
-.c7:disabled {
-  background-color: rgb(250,250,250);
-  color: rgb(216,216,216);
-  cursor: not-allowed;
-}
-
-.c7:disabled::-webkit-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c7:disabled::-moz-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c7:disabled:-ms-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c7:focus {
-  border-color: rgb(59,70,204);
-  outline: 0;
-}
-
-.c6 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c43 {
-  cursor: pointer;
-  height: 100%;
-  width: 100%;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.c13 {
-  overflow: hidden;
-  border-spacing: 0;
-  border-collapse: separate;
-  table-layout: fixed;
-  width: 100%;
-  max-width: 100%;
-}
-
-.c14 {
-  width: 100%;
-  background: rgb(250,250,250);
-}
-
-.c14 th:first-child {
-  border-top-left-radius: 0.25rem;
-}
-
-.c14 th:last-child {
-  border-top-right-radius: 0.25rem;
-}
-
-.c32 {
-  width: 100%;
-}
-
-.c32 tr:first-child td {
-  border-top: none;
-}
-
-.c17 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 2rem;
-  display: table-cell;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c17:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c17:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c25 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-  color: rgba(73,73,73,1);
-  font-weight: bold;
-}
-
-.c25:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c25:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c27 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 9.375rem;
-  display: table-cell;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c27:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c27:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c28 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c28:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c28:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c29 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c29:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c29:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c31 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 3.75rem;
-  display: table-cell;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c31:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c31:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c35 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  vertical-align: middle;
-  text-align: left;
-  border-bottom-width: 0;
-}
-
-.c35:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c35:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c39 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  vertical-align: middle;
-  text-align: left;
-  border-bottom-width: 0;
-}
-
-.c39:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c39:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c40 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  vertical-align: middle;
-  text-align: left;
-  border-bottom-width: 0;
-}
-
-.c40:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c40:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c42 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  border-bottom-width: 0;
-  border-left-width: 0.0625rem !important;
-}
-
-.c42:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c42:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c15 {
-  display: table-row;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  box-shadow: 0 0.125rem 0 rgba(0,0,0,0.05);
-  box-sizing: border-box;
-  color: rgba(73,73,73,1);
-  background-color: transparent;
-  border: none;
-  box-shadow: none;
-}
-
-.c15:last-child {
-  box-shadow: none;
-}
-
-.c15:last-child td {
-  border-bottom-width: 0.0625rem;
-}
-
-.c33 {
-  display: table-row;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  box-shadow: 0 0.125rem 0 rgba(0,0,0,0.05);
-  box-sizing: border-box;
-}
-
-.c33:last-child {
-  box-shadow: none;
-}
-
-.c33:last-child td {
-  border-bottom-width: 0.0625rem;
-}
-
-.c16 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c30 {
-  padding: 0rem;
-}
-
-.c34 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c41 {
-  padding: 0rem;
-}
-
-@media only screen and (min-width:0em) {
-  .c4 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c4 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c8 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c8 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c48 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c51 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c0 {
-    width: 46rem;
-  }
-}
-
-@media only screen and (min-width:64em) {
-  .c0 {
-    width: 61rem;
-  }
-}
-
-@media only screen and (min-width:75em) {
-  .c0 {
-    width: 76rem;
-  }
-}
-
-@media only screen and (max-width:47.9375rem) {
-  .c0 {
-    padding-left: 0.375rem;
-    padding-right: 0.375rem;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c46 {
-    width: 46rem;
-  }
-}
-
-@media only screen and (min-width:64em) {
-  .c46 {
-    width: 61rem;
-  }
-}
-
-@media only screen and (min-width:75em) {
-  .c46 {
-    width: 76rem;
-  }
-}
-
-@media only screen and (max-width:47.9375rem) {
-  .c46 {
-    padding-left: 0.375rem;
-    padding-right: 0.375rem;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c47 {
-    -webkit-align-items: center;
-    -webkit-box-align: center;
-    -ms-flex-align: center;
-    align-items: center;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c47 {
-    -webkit-box-pack: justify;
-    -webkit-justify-content: space-between;
-    -ms-flex-pack: justify;
-    justify-content: space-between;
-  }
-}
-
-@media only screen and (min-width:47.9375rem) {
-  .c28 {
-    width: 10rem;
-    display: table-cell;
-  }
-}
-
-@media only screen and (min-width:47.9375rem) {
-  .c29 {
-    width: 8.125rem;
-    display: table-cell;
-  }
-}
-
-@media only screen and (min-width:47.9375rem) {
-  .c39 {
-    width: 10rem;
-    display: table-cell;
-  }
-}
-
-@media only screen and (min-width:47.9375rem) {
-  .c40 {
-    width: 8.125rem;
-    display: table-cell;
-  }
-}
-
-<div
-  className="c0"
->
-  <div
-    className="c1 c2"
-    height="1.875rem"
-  />
-  <form
-    onSubmit={undefined}
-  >
-    <div
-      className="c3"
-    >
-      <div
-        className="c4"
-      >
-        <div
-          className="c5"
-          name="filter"
-          role="group"
-          style={undefined}
-        >
-          <label
-            className="c6"
-            htmlFor="bx"
-          >
-            Filter instances
-          </label>
-          <input
-            className="c7"
-            disabled={false}
-            id="bx"
-            placeholder="Search for name, state, tags, etc..."
-          />
-        </div>
-      </div>
-      <div
-        className="c8"
-      >
-        <div
-          className="c9"
-          role="group"
-          style={undefined}
-        >
-          <label
-            className="c6"
-            htmlFor="bz"
-          >
-            ⁣
-          </label>
-          <button
-            className="c10 c11 c12"
-            disabled={false}
-            href=""
-            icon={true}
-            onClick={[Function]}
-            type="button"
-          >
-            Create Instance
-          </button>
-        </div>
-      </div>
-    </div>
-  </form>
-  <form>
-    <table
-      className="c13"
-    >
-      <thead
-        className="c14"
-        disabled={undefined}
-        name="thdead"
-        selected={undefined}
-      >
-        <tr
-          className="c15"
-          disabled={undefined}
-          name="tr"
-          selected={undefined}
-        >
-          <th
-            className="c16 c17"
-            disabled={undefined}
-            name="th"
-            selected={undefined}
-          >
-            <div
-              className="c18 c19 c20"
-              role="group"
-              style={undefined}
-            >
-              <li
-                className="c21"
-              >
-                <div
-                  checked={false}
-                  className="c22"
-                  disabled={false}
-                  id="bB"
-                  onChange={[Function]}
-                  type="checkbox"
-                >
-                  <input
-                    checked={false}
-                    className="c23"
-                    disabled={false}
-                    id="bC"
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                  <label
-                    className="c24"
-                    htmlFor="bC"
-                  />
-                </div>
-              </li>
-            </div>
-          </th>
-          <th
-            className="c25"
-            disabled={undefined}
-            name="th"
-            onClick={[Function]}
-            selected={undefined}
-          >
-            <span>
-              Name 
-            </span>
-            <svg
-              className="c26"
-              height="6"
-              marginBottom="0.125rem"
-              marginLeft="0.5625rem"
-              style={
-                Object {
-                  "transform": "rotate(180deg)",
-                }
-              }
-              viewBox="0 0 9 6"
-              width="9"
-              xmlns="http://www.w3.org/2000/svg"
-            >
-              <path
-                d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
-                fill="rgba(73, 73, 73, 1)"
-                fillRule="evenodd"
-              />
-            </svg>
-          </th>
-          <th
-            className="c27"
-            disabled={undefined}
-            name="th"
-            onClick={[Function]}
-            selected={undefined}
-          >
-            <span>
-              Status 
-            </span>
-          </th>
-          <th
-            className="c28"
-            disabled={undefined}
-            name="th"
-            onClick={[Function]}
-            selected={undefined}
-          >
-            <span>
-              Created 
-            </span>
-          </th>
-          <th
-            className="c29"
-            disabled={undefined}
-            name="th"
-            onClick={[Function]}
-            selected={undefined}
-          >
-            <span>
-              Short ID 
-            </span>
-          </th>
-          <th
-            className="c30 c31"
-            disabled={undefined}
-            name="th"
-            selected={undefined}
-          />
-        </tr>
-      </thead>
-      <tbody
-        className="c32"
-        disabled={undefined}
-        name="tbody"
-        selected={undefined}
-      >
-        <tr
-          className="c33"
-          disabled={undefined}
-          name="tr"
-          selected={undefined}
-        >
-          <td
-            className="c34 c35"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <div
-              className="c18 c19 c20"
-              name="2252839a-e698-ceec-afac-9549ad0c6624"
-              role="group"
-              style={undefined}
-            >
-              <li
-                className="c21"
-              >
-                <div
-                  checked={false}
-                  className="c22"
-                  disabled={false}
-                  id="bD"
-                  type="checkbox"
-                >
-                  <input
-                    checked={false}
-                    className="c23"
-                    disabled={false}
-                    id="bE"
-                    type="checkbox"
-                  />
-                  <label
-                    className="c24"
-                    htmlFor="bE"
-                  />
-                </div>
-              </li>
-            </div>
-          </td>
-          <td
-            className="c35"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <a
-              className="c36 c37"
-              to="/instances/2252839a"
-            >
-              2252839a
-            </a>
-          </td>
-          <td
-            className="c35"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <span>
-              <span
-                className="c38"
-                color="green"
-                height="0.6875rem"
-                width="0.6875rem"
-              />
-               
-              Running
-            </span>
-          </td>
-          <td
-            className="c39"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            almost NaN years
-          </td>
-          <td
-            className="c40"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <code>
-              2252839
-            </code>
-          </td>
-          <td
-            className="c41 c42"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <div
-              box={true}
-              className="c43"
-              onClick={[Function]}
-              onMouseEnter={undefined}
-              onMouseLeave={undefined}
-              tag="div"
-            >
-              <svg
-                className=""
-                height="16"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                viewBox="0 0 4 16"
-                width="4"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-                  fill="rgba(73, 73, 73, 1)"
-                  fill-rule="evenodd"
-                />
-                <path
-                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-                  fill="rgba(73, 73, 73, 1)"
-                  fill-rule="evenodd"
-                  style={
-                    Object {
-                      "transform": "translateY(0.375rem)",
-                    }
-                  }
-                />
-                <path
-                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-                  fill="rgba(73, 73, 73, 1)"
-                  fill-rule="evenodd"
-                  style={
-                    Object {
-                      "transform": "translateY(0.75rem)",
-                    }
-                  }
-                />
-              </svg>
-            </div>
-          </td>
-        </tr>
-        <tr
-          className="c33"
-          disabled={undefined}
-          name="tr"
-          selected={undefined}
-        >
-          <td
-            className="c34 c35"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <div
-              className="c18 c19 c20"
-              name="f1bd1730-e8a6-4956-e738-d8e85cc6aa04"
-              role="group"
-              style={undefined}
-            >
-              <li
-                className="c21"
-              >
-                <div
-                  checked={false}
-                  className="c22"
-                  disabled={false}
-                  id="bF"
-                  type="checkbox"
-                >
-                  <input
-                    checked={false}
-                    className="c23"
-                    disabled={false}
-                    id="bG"
-                    type="checkbox"
-                  />
-                  <label
-                    className="c24"
-                    htmlFor="bG"
-                  />
-                </div>
-              </li>
-            </div>
-          </td>
-          <td
-            className="c35"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <a
-              className="c36 c37"
-              to="/instances/f1bd1730"
-            >
-              f1bd1730
-            </a>
-          </td>
-          <td
-            className="c35"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <span>
-              <span
-                className="c38"
-                color="green"
-                height="0.6875rem"
-                width="0.6875rem"
-              />
-               
-              Running
-            </span>
-          </td>
-          <td
-            className="c39"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            almost NaN years
-          </td>
-          <td
-            className="c40"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <code>
-              f1bd173
-            </code>
-          </td>
-          <td
-            className="c41 c42"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <div
-              box={true}
-              className="c43"
-              onClick={[Function]}
-              onMouseEnter={undefined}
-              onMouseLeave={undefined}
-              tag="div"
-            >
-              <svg
-                className=""
-                height="16"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                viewBox="0 0 4 16"
-                width="4"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-                  fill="rgba(73, 73, 73, 1)"
-                  fill-rule="evenodd"
-                />
-                <path
-                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-                  fill="rgba(73, 73, 73, 1)"
-                  fill-rule="evenodd"
-                  style={
-                    Object {
-                      "transform": "translateY(0.375rem)",
-                    }
-                  }
-                />
-                <path
-                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-                  fill="rgba(73, 73, 73, 1)"
-                  fill-rule="evenodd"
-                  style={
-                    Object {
-                      "transform": "translateY(0.75rem)",
-                    }
-                  }
-                />
-              </svg>
-            </div>
-          </td>
-        </tr>
-      </tbody>
-    </table>
-  </form>
-  <div
-    className="c44 c45"
-  >
-    <div
-      className="c46"
-    >
-      <div
-        className="c47"
-      >
-        <div
-          className="c48"
-        >
-          <span
-            name="react-responsive-mock"
-            query="only screen and (max-width: 47.9375rem)"
-          >
-            <button
-              className="c49 c11 c12"
-              disabled={true}
-              href=""
-              icon={true}
-              onClick={[Function]}
-              type="button"
-            >
-              <svg
-                className=""
-                height="15"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                version="1.1"
-                width="15"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
-              >
-                <g
-                  transform="translate(18292 -19563)"
-                >
-                  <mask
-                    id="L"
-                  >
-                    <rect
-                      fill="#fff"
-                      height={15}
-                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-                      width={15}
-                      x={-1}
-                      y={-1}
-                    />
-                    <use
-                      fill="#000"
-                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-                      xlinkHref="#M"
-                    />
-                  </mask>
-                  <g
-                    mask="url(#L"
-                  >
-                    <use
-                      fill="rgb(216, 216, 216)"
-                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-                      xlinkHref="#N"
-                    />
-                  </g>
-                </g>
-                <defs>
-                  <path
-                    d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
-                    id="M"
-                  />
-                  <path
-                    d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
-                    id="N"
-                  />
-                </defs>
-              </svg>
-            </button>
-          </span>
-          <span
-            name="react-responsive-mock"
-            query="only screen and (min-width: 48rem)"
-          >
-            <button
-              className="c50 c11 c12"
-              disabled={true}
-              href=""
-              icon={true}
-              onClick={[Function]}
-              type="button"
-            >
-              <svg
-                className=""
-                height="15"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                version="1.1"
-                width="15"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
-              >
-                <g
-                  transform="translate(18292 -19563)"
-                >
-                  <mask
-                    id="L"
-                  >
-                    <rect
-                      fill="#fff"
-                      height={15}
-                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-                      width={15}
-                      x={-1}
-                      y={-1}
-                    />
-                    <use
-                      fill="#000"
-                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-                      xlinkHref="#M"
-                    />
-                  </mask>
-                  <g
-                    mask="url(#L"
-                  >
-                    <use
-                      fill="rgb(216, 216, 216)"
-                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-                      xlinkHref="#N"
-                    />
-                  </g>
-                </g>
-                <defs>
-                  <path
-                    d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
-                    id="M"
-                  />
-                  <path
-                    d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
-                    id="N"
-                  />
-                </defs>
-              </svg>
-              <span>
-                Start
-              </span>
-            </button>
-          </span>
-          <span
-            name="react-responsive-mock"
-            query="only screen and (max-width: 47.9375rem)"
-          >
-            <button
-              className="c49 c11 c12"
-              disabled={true}
-              href=""
-              icon={true}
-              onClick={[Function]}
-              type="button"
-            >
-              <svg
-                className=""
-                height="14"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                version="1.1"
-                viewBox="0 0 14 14"
-                width="14"
-                xmlns="http://www.w3.org/2000/svg"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
-              >
-                <g
-                  transform="translate(18113 -18582)"
-                >
-                  <g>
-                    <mask
-                      id="O"
-                    >
-                      <use
-                        fill="white"
-                        transform="translate(-18113 18582)"
-                        xlinkHref="#P"
-                      />
-                    </mask>
-                    <g
-                      mask="url(#O)"
-                    >
-                      <use
-                        fill="rgb(216, 216, 216)"
-                        transform="translate(-18113 18582)"
-                        xlinkHref="#Q"
-                      />
-                    </g>
-                  </g>
-                </g>
-                <defs>
-                  <path
-                    d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
-                    id="P"
-                  />
-                  <path
-                    d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
-                    id="Q"
-                  />
-                </defs>
-              </svg>
-            </button>
-          </span>
-          <span
-            name="react-responsive-mock"
-            query="only screen and (min-width: 48rem)"
-          >
-            <button
-              className="c50 c11 c12"
-              disabled={true}
-              href=""
-              icon={true}
-              onClick={[Function]}
-              type="button"
-            >
-              <svg
-                className=""
-                height="14"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                version="1.1"
-                viewBox="0 0 14 14"
-                width="14"
-                xmlns="http://www.w3.org/2000/svg"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
-              >
-                <g
-                  transform="translate(18113 -18582)"
-                >
-                  <g>
-                    <mask
-                      id="O"
-                    >
-                      <use
-                        fill="white"
-                        transform="translate(-18113 18582)"
-                        xlinkHref="#P"
-                      />
-                    </mask>
-                    <g
-                      mask="url(#O)"
-                    >
-                      <use
-                        fill="rgb(216, 216, 216)"
-                        transform="translate(-18113 18582)"
-                        xlinkHref="#Q"
-                      />
-                    </g>
-                  </g>
-                </g>
-                <defs>
-                  <path
-                    d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
-                    id="P"
-                  />
-                  <path
-                    d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
-                    id="Q"
-                  />
-                </defs>
-              </svg>
-              <span>
-                Stop
-              </span>
-            </button>
-          </span>
-          <span
-            name="react-responsive-mock"
-            query="only screen and (max-width: 47.9375rem)"
-          >
-            <button
-              className="c49 c11 c12"
-              disabled={true}
-              href=""
-              icon={true}
-              onClick={[Function]}
-              type="button"
-            >
-              <svg
-                className=""
-                height="21"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                version="1.1"
-                viewBox="0 0 20 21"
-                width="20"
-                xmlns="http://www.w3.org/2000/svg"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
-              >
-                <g
-                  transform="translate(17997 -18577)"
-                >
-                  <g>
-                    <use
-                      fill="rgb(216, 216, 216)"
-                      transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
-                      xlinkHref="#K"
-                    />
-                  </g>
-                </g>
-                <defs>
-                  <path
-                    d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
-                    fillRule="evenodd"
-                    id="K"
-                  />
-                </defs>
-              </svg>
-            </button>
-          </span>
-          <span
-            name="react-responsive-mock"
-            query="only screen and (min-width: 48rem)"
-          >
-            <button
-              className="c50 c11 c12"
-              disabled={true}
-              href=""
-              icon={true}
-              onClick={[Function]}
-              type="button"
-            >
-              <svg
-                className=""
-                height="21"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                version="1.1"
-                viewBox="0 0 20 21"
-                width="20"
-                xmlns="http://www.w3.org/2000/svg"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
-              >
-                <g
-                  transform="translate(17997 -18577)"
-                >
-                  <g>
-                    <use
-                      fill="rgb(216, 216, 216)"
-                      transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
-                      xlinkHref="#K"
-                    />
-                  </g>
-                </g>
-                <defs>
-                  <path
-                    d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
-                    fillRule="evenodd"
-                    id="K"
-                  />
-                </defs>
-              </svg>
-              <span>
-                Reboot
-              </span>
-            </button>
-          </span>
-        </div>
-        <div
-          className="c51"
-        >
-          <span
-            name="react-responsive-mock"
-            query="only screen and (max-width: 47.9375rem)"
-          >
-            <button
-              className="c52 c11 c12"
-              disabled={true}
-              href=""
-              icon={true}
-              onClick={[Function]}
-              type="button"
-            >
-              <svg
-                className=""
-                height="12"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                version="1.1"
-                viewBox="0 0 9 12"
-                width="9"
-                xmlns="http://www.w3.org/2000/svg"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
-              >
-                <g
-                  transform="translate(17403 -18583)"
-                >
-                  <g>
-                    <use
-                      fill="rgba(73, 73, 73, 1)"
-                      transform="translate(-17403 18583)"
-                      xlinkHref="#j"
-                    />
-                  </g>
-                </g>
-                <defs>
-                  <path
-                    d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
-                    fillRule="evenodd"
-                    id="j"
-                  />
-                </defs>
-              </svg>
-            </button>
-          </span>
-          <span
-            name="react-responsive-mock"
-            query="only screen and (min-width: 48rem)"
-          >
-            <button
-              className="c53 c11 c12"
-              disabled={true}
-              href=""
-              icon={true}
-              onClick={[Function]}
-              type="button"
-            >
-              <svg
-                className=""
-                height="12"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                version="1.1"
-                viewBox="0 0 9 12"
-                width="9"
-                xmlns="http://www.w3.org/2000/svg"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
-              >
-                <g
-                  transform="translate(17403 -18583)"
-                >
-                  <g>
-                    <use
-                      fill="rgb(216, 216, 216)"
-                      transform="translate(-17403 18583)"
-                      xlinkHref="#j"
-                    />
-                  </g>
-                </g>
-                <defs>
-                  <path
-                    d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
-                    fillRule="evenodd"
-                    id="j"
-                  />
-                </defs>
-              </svg>
-              <span>
-                Remove
-              </span>
-            </button>
-          </span>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`renders <List instances selected=all /> without throwing 1`] = `
-.c37 {
-  background-color: transparent;
-  text-decoration-skip: objects;
-}
-
-.c36 {
-  color: rgb(59,70,204);
-  -webkit-text-fill-color: currentcolor;
-}
-
-.c36:hover {
-  text-decoration: none;
-}
-
-.c12 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  text-transform: none;
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  min-width: 7.5rem;
-}
-
-.c12::-moz-focus-inner,
-.c12[type='button']::-moz-focus-inner,
-.c12[type='reset']::-moz-focus-inner,
-.c12[type='submit']::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-
-.c12:-moz-focusring,
-.c12[type='button']:-moz-focusring,
-.c12[type='reset']:-moz-focusring,
-.c12[type='submit']:-moz-focusring {
-  outline: 0.0625rem dotted ButtonText;
-}
-
-.c12 + button {
-  margin-left: 0.375rem;
-}
-
-.c11 {
-  display: inline-block;
-}
-
-.c10 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  width: 100%;
-  max-width: 100%;
-}
-
-.c10:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c10:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c10:active,
-.c10:active:hover,
-.c10:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c10[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c10 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c10 svg {
-  max-height: 1.125rem;
-}
-
-.c49 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.c49:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c49:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c49:active,
-.c49:active:hover,
-.c49:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c49[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c49:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c49:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c49:active,
-.c49:active:hover,
-.c49:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c49:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c49:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c49:active,
-.c49:active:hover,
-.c49:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c49 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c49 svg {
-  max-height: 1.125rem;
-}
-
-.c50 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.c50:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c50:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c50:active,
-.c50:active:hover,
-.c50:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c50[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c50:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
 }
 
 .c50:hover {
   background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
+  border-color: rgb(210,67,58);
 }
 
 .c50:active,
 .c50:active:hover,
 .c50:active:focus {
   background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
+  border-color: rgb(210,67,58);
 }
 
 .c50:focus {
@@ -6490,157 +4098,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c52 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  float: right;
-}
-
-.c52:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c52:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c52:active,
-.c52:active:hover,
-.c52:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c52[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c52:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c52:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c52:active,
-.c52:active:hover,
-.c52:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c52:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-}
-
-.c52:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(210,67,58);
-}
-
-.c52:active,
-.c52:active:hover,
-.c52:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(210,67,58);
-}
-
-.c52:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c52:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c52:active,
-.c52:active:hover,
-.c52:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c52 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c52 svg {
-  max-height: 1.125rem;
-}
-
-.c53 {
+.c51 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -6702,2224 +4160,6 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
   float: right;
 }
 
-.c53:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c53:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c53:active,
-.c53:active:hover,
-.c53:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c53[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c53:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c53:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c53:active,
-.c53:active:hover,
-.c53:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c53:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-}
-
-.c53:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(210,67,58);
-}
-
-.c53:active,
-.c53:active:hover,
-.c53:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(210,67,58);
-}
-
-.c53:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c53:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c53:active,
-.c53:active:hover,
-.c53:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c53 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c53 svg {
-  max-height: 1.125rem;
-}
-
-.c2 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-}
-
-.c4 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c8 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c48 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c51 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
-.c1 {
-  background-color: rgb(216,216,216);
-  margin: 0;
-  background-color: transparent;
-  height: 1.875rem;
-}
-
-.c46 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-  -webkit-align-items: stretch;
-  -webkit-box-align: stretch;
-  -ms-flex-align: stretch;
-  align-items: stretch;
-}
-
-.c45 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-align-content: stretch;
-  -ms-flex-line-pack: stretch;
-  align-content: stretch;
-  -webkit-align-items: stretch;
-  -webkit-box-align: stretch;
-  -ms-flex-align: stretch;
-  align-items: stretch;
-  background-color: rgb(30,49,59);
-  max-height: 3.3125rem;
-  min-height: 3.3125rem;
-  line-height: 1.5625rem;
-  position: fixed;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-
-.c44 {
-  background-color: rgba(241,241,241,1);
-  border-top: 0.0625rem solid rgb(216,216,216);
-  height: 4.375rem;
-  max-height: 4.375rem;
-}
-
-.c3 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
-.c47 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
-.c26 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
-.c38 {
-  width: 0.375rem;
-  height: 0.375rem;
-  border-radius: 0.1875rem;
-  background-color: rgb(0,152,88);
-  display: inline-block;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 0.6875rem;
-}
-
-.c23 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c23[type='checkbox'],
-.c23[type='radio'] {
-  box-sizing: border-box;
-  padding: 0;
-}
-
-.c23[type='number']::-webkit-inner-spin-button,
-.c23[type='number']::-webkit-outer-spin-button {
-  height: auto;
-}
-
-.c23[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
-}
-
-.c23[type='search']::-webkit-search-cancel-button,
-.c23[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c23::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c23:checked + label::after {
-  opacity: 1;
-}
-
-.c23:selected + label::after {
-  opacity: 1;
-}
-
-.c23:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c23:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c23:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
-}
-
-.c24 {
-  color: rgb(100,100,100);
-  position: absolute;
-  width: 1.125rem;
-  height: 1.125rem;
-  box-sizing: border-box;
-  top: 0;
-  right: 0;
-  cursor: pointer;
-  background-color: rgb(255,255,255);
-  box-shadow: none;
-  border: 0.0625rem solid rgb(216,216,216);
-  cursor: pointer;
-  border-radius: 0.25rem;
-  width: 1.125rem;
-  height: 1.125rem;
-}
-
-.c24::after {
-  opacity: 0;
-  content: '';
-  position: absolute;
-  width: 0.375rem;
-  height: 0.125rem;
-  background: transparent;
-  top: 0.3125rem;
-  left: 0.25rem;
-  border: 0.125rem solid rgb(45,45,45);
-  border-top: none;
-  border-right: none;
-  -webkit-transform: rotate(-45deg);
-  -ms-transform: rotate(-45deg);
-  transform: rotate(-45deg);
-}
-
-.c22 {
-  display: inline-block;
-  vertical-align: text-bottom;
-  width: 1.125rem;
-  height: 1.125rem;
-  position: relative;
-  cursor: pointer;
-}
-
-.c21 {
-  list-style-type: none;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.c21 label {
-  font-weight: 400;
-}
-
-.c5 {
-  display: inline-block;
-  margin: 0;
-  padding: 0;
-  border: none;
-  overflow: hidden;
-  height: auto;
-  -webkit-margin-start: 0;
-  -webkit-margin-end: 0;
-  -webkit-padding-before: 0;
-  -webkit-padding-start: 0;
-  -webkit-padding-end: 0;
-  -webkit-padding-after: 0;
-  width: 100%;
-}
-
-.c9 {
-  display: inline-block;
-  margin: 0;
-  padding: 0;
-  border: none;
-  overflow: hidden;
-  height: auto;
-  -webkit-margin-start: 0;
-  -webkit-margin-end: 0;
-  -webkit-padding-before: 0;
-  -webkit-padding-start: 0;
-  -webkit-padding-end: 0;
-  -webkit-padding-after: 0;
-  float: right;
-}
-
-.c20 {
-  display: inline-block;
-  margin: 0;
-  padding: 0;
-  border: none;
-  overflow: hidden;
-  height: auto;
-  -webkit-margin-start: 0;
-  -webkit-margin-end: 0;
-  -webkit-padding-before: 0;
-  -webkit-padding-start: 0;
-  -webkit-padding-end: 0;
-  -webkit-padding-after: 0;
-}
-
-.c19 {
-  padding-top: 0.25rem;
-}
-
-.c18 {
-  padding-top: 0.25rem;
-}
-
-.c7 {
-  box-sizing: border-box;
-  width: 18.75rem;
-  height: 3rem;
-  min-height: 3rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.8125rem 1.125rem;
-  border-radius: 0.25rem;
-  background-color: rgb(255,255,255);
-  border: 0.0625rem solid rgb(216,216,216);
-  color: rgba(73,73,73,1);
-  width: 100%;
-  text-overflow: ellipsis;
-  font-size: 0.9375rem;
-  line-height: normal !important;
-  font-style: normal;
-  font-stretch: normal;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-  outline: 0;
-}
-
-.c7::-webkit-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c7::-moz-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c7:-ms-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c7:invalid {
-  box-shadow: none;
-}
-
-.c7:disabled {
-  background-color: rgb(250,250,250);
-  color: rgb(216,216,216);
-  cursor: not-allowed;
-}
-
-.c7:disabled::-webkit-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c7:disabled::-moz-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c7:disabled:-ms-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c7:focus {
-  border-color: rgb(59,70,204);
-  outline: 0;
-}
-
-.c6 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c43 {
-  cursor: pointer;
-  height: 100%;
-  width: 100%;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.c13 {
-  overflow: hidden;
-  border-spacing: 0;
-  border-collapse: separate;
-  table-layout: fixed;
-  width: 100%;
-  max-width: 100%;
-}
-
-.c14 {
-  width: 100%;
-  background: rgb(250,250,250);
-}
-
-.c14 th:first-child {
-  border-top-left-radius: 0.25rem;
-}
-
-.c14 th:last-child {
-  border-top-right-radius: 0.25rem;
-}
-
-.c32 {
-  width: 100%;
-}
-
-.c32 tr:first-child td {
-  border-top: none;
-}
-
-.c17 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 2rem;
-  display: table-cell;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c17:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c17:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c25 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-  color: rgba(73,73,73,1);
-  font-weight: bold;
-}
-
-.c25:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c25:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c27 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 9.375rem;
-  display: table-cell;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c27:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c27:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c28 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c28:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c28:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c29 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c29:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c29:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c31 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 3.75rem;
-  display: table-cell;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c31:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c31:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c35 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  vertical-align: middle;
-  text-align: left;
-  border-bottom-width: 0;
-}
-
-.c35:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c35:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c39 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  vertical-align: middle;
-  text-align: left;
-  border-bottom-width: 0;
-}
-
-.c39:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c39:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c40 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  vertical-align: middle;
-  text-align: left;
-  border-bottom-width: 0;
-}
-
-.c40:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c40:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c42 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  border-bottom-width: 0;
-  border-left-width: 0.0625rem !important;
-}
-
-.c42:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c42:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c15 {
-  display: table-row;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  box-shadow: 0 0.125rem 0 rgba(0,0,0,0.05);
-  box-sizing: border-box;
-  color: rgba(73,73,73,1);
-  background-color: transparent;
-  border: none;
-  box-shadow: none;
-}
-
-.c15:last-child {
-  box-shadow: none;
-}
-
-.c15:last-child td {
-  border-bottom-width: 0.0625rem;
-}
-
-.c33 {
-  display: table-row;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  box-shadow: 0 0.125rem 0 rgba(0,0,0,0.05);
-  box-sizing: border-box;
-}
-
-.c33:last-child {
-  box-shadow: none;
-}
-
-.c33:last-child td {
-  border-bottom-width: 0.0625rem;
-}
-
-.c16 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c30 {
-  padding: 0rem;
-}
-
-.c34 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c41 {
-  padding: 0rem;
-}
-
-@media only screen and (min-width:0em) {
-  .c4 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c4 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c8 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c8 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c48 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c51 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c0 {
-    width: 46rem;
-  }
-}
-
-@media only screen and (min-width:64em) {
-  .c0 {
-    width: 61rem;
-  }
-}
-
-@media only screen and (min-width:75em) {
-  .c0 {
-    width: 76rem;
-  }
-}
-
-@media only screen and (max-width:47.9375rem) {
-  .c0 {
-    padding-left: 0.375rem;
-    padding-right: 0.375rem;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c46 {
-    width: 46rem;
-  }
-}
-
-@media only screen and (min-width:64em) {
-  .c46 {
-    width: 61rem;
-  }
-}
-
-@media only screen and (min-width:75em) {
-  .c46 {
-    width: 76rem;
-  }
-}
-
-@media only screen and (max-width:47.9375rem) {
-  .c46 {
-    padding-left: 0.375rem;
-    padding-right: 0.375rem;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c47 {
-    -webkit-align-items: center;
-    -webkit-box-align: center;
-    -ms-flex-align: center;
-    align-items: center;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c47 {
-    -webkit-box-pack: justify;
-    -webkit-justify-content: space-between;
-    -ms-flex-pack: justify;
-    justify-content: space-between;
-  }
-}
-
-@media only screen and (min-width:47.9375rem) {
-  .c28 {
-    width: 10rem;
-    display: table-cell;
-  }
-}
-
-@media only screen and (min-width:47.9375rem) {
-  .c29 {
-    width: 8.125rem;
-    display: table-cell;
-  }
-}
-
-@media only screen and (min-width:47.9375rem) {
-  .c39 {
-    width: 10rem;
-    display: table-cell;
-  }
-}
-
-@media only screen and (min-width:47.9375rem) {
-  .c40 {
-    width: 8.125rem;
-    display: table-cell;
-  }
-}
-
-<div
-  className="c0"
->
-  <div
-    className="c1 c2"
-    height="1.875rem"
-  />
-  <form
-    onSubmit={undefined}
-  >
-    <div
-      className="c3"
-    >
-      <div
-        className="c4"
-      >
-        <div
-          className="c5"
-          name="filter"
-          role="group"
-          style={undefined}
-        >
-          <label
-            className="c6"
-            htmlFor="bH"
-          >
-            Filter instances
-          </label>
-          <input
-            className="c7"
-            disabled={false}
-            id="bH"
-            placeholder="Search for name, state, tags, etc..."
-          />
-        </div>
-      </div>
-      <div
-        className="c8"
-      >
-        <div
-          className="c9"
-          role="group"
-          style={undefined}
-        >
-          <label
-            className="c6"
-            htmlFor="bJ"
-          >
-            ⁣
-          </label>
-          <button
-            className="c10 c11 c12"
-            disabled={false}
-            href=""
-            icon={true}
-            onClick={[Function]}
-            type="button"
-          >
-            Create Instance
-          </button>
-        </div>
-      </div>
-    </div>
-  </form>
-  <form>
-    <table
-      className="c13"
-    >
-      <thead
-        className="c14"
-        disabled={undefined}
-        name="thdead"
-        selected={undefined}
-      >
-        <tr
-          className="c15"
-          disabled={undefined}
-          name="tr"
-          selected={undefined}
-        >
-          <th
-            className="c16 c17"
-            disabled={undefined}
-            name="th"
-            selected={undefined}
-          >
-            <div
-              className="c18 c19 c20"
-              role="group"
-              style={undefined}
-            >
-              <li
-                className="c21"
-              >
-                <div
-                  checked={true}
-                  className="c22"
-                  disabled={false}
-                  id="bL"
-                  onChange={[Function]}
-                  type="checkbox"
-                >
-                  <input
-                    checked={true}
-                    className="c23"
-                    disabled={false}
-                    id="bM"
-                    onChange={[Function]}
-                    type="checkbox"
-                  />
-                  <label
-                    className="c24"
-                    htmlFor="bM"
-                  />
-                </div>
-              </li>
-            </div>
-          </th>
-          <th
-            className="c25"
-            disabled={undefined}
-            name="th"
-            onClick={[Function]}
-            selected={undefined}
-          >
-            <span>
-              Name 
-            </span>
-            <svg
-              className="c26"
-              height="6"
-              marginBottom="0.125rem"
-              marginLeft="0.5625rem"
-              style={
-                Object {
-                  "transform": "rotate(180deg)",
-                }
-              }
-              viewBox="0 0 9 6"
-              width="9"
-              xmlns="http://www.w3.org/2000/svg"
-            >
-              <path
-                d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
-                fill="rgba(73, 73, 73, 1)"
-                fillRule="evenodd"
-              />
-            </svg>
-          </th>
-          <th
-            className="c27"
-            disabled={undefined}
-            name="th"
-            onClick={[Function]}
-            selected={undefined}
-          >
-            <span>
-              Status 
-            </span>
-          </th>
-          <th
-            className="c28"
-            disabled={undefined}
-            name="th"
-            onClick={[Function]}
-            selected={undefined}
-          >
-            <span>
-              Created 
-            </span>
-          </th>
-          <th
-            className="c29"
-            disabled={undefined}
-            name="th"
-            onClick={[Function]}
-            selected={undefined}
-          >
-            <span>
-              Short ID 
-            </span>
-          </th>
-          <th
-            className="c30 c31"
-            disabled={undefined}
-            name="th"
-            selected={undefined}
-          />
-        </tr>
-      </thead>
-      <tbody
-        className="c32"
-        disabled={undefined}
-        name="tbody"
-        selected={undefined}
-      >
-        <tr
-          className="c33"
-          disabled={undefined}
-          name="tr"
-          selected={undefined}
-        >
-          <td
-            className="c34 c35"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <div
-              className="c18 c19 c20"
-              name="2252839a-e698-ceec-afac-9549ad0c6624"
-              role="group"
-              style={undefined}
-            >
-              <li
-                className="c21"
-              >
-                <div
-                  checked={false}
-                  className="c22"
-                  disabled={false}
-                  id="bN"
-                  type="checkbox"
-                >
-                  <input
-                    checked={false}
-                    className="c23"
-                    disabled={false}
-                    id="bO"
-                    type="checkbox"
-                  />
-                  <label
-                    className="c24"
-                    htmlFor="bO"
-                  />
-                </div>
-              </li>
-            </div>
-          </td>
-          <td
-            className="c35"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <a
-              className="c36 c37"
-              to="/instances/2252839a"
-            >
-              2252839a
-            </a>
-          </td>
-          <td
-            className="c35"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <span>
-              <span
-                className="c38"
-                color="green"
-                height="0.6875rem"
-                width="0.6875rem"
-              />
-               
-              Running
-            </span>
-          </td>
-          <td
-            className="c39"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            almost NaN years
-          </td>
-          <td
-            className="c40"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <code>
-              2252839
-            </code>
-          </td>
-          <td
-            className="c41 c42"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <div
-              box={true}
-              className="c43"
-              onClick={[Function]}
-              onMouseEnter={undefined}
-              onMouseLeave={undefined}
-              tag="div"
-            >
-              <svg
-                className=""
-                height="16"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                viewBox="0 0 4 16"
-                width="4"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-                  fill="rgba(73, 73, 73, 1)"
-                  fill-rule="evenodd"
-                />
-                <path
-                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-                  fill="rgba(73, 73, 73, 1)"
-                  fill-rule="evenodd"
-                  style={
-                    Object {
-                      "transform": "translateY(0.375rem)",
-                    }
-                  }
-                />
-                <path
-                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-                  fill="rgba(73, 73, 73, 1)"
-                  fill-rule="evenodd"
-                  style={
-                    Object {
-                      "transform": "translateY(0.75rem)",
-                    }
-                  }
-                />
-              </svg>
-            </div>
-          </td>
-        </tr>
-        <tr
-          className="c33"
-          disabled={undefined}
-          name="tr"
-          selected={undefined}
-        >
-          <td
-            className="c34 c35"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <div
-              className="c18 c19 c20"
-              name="f1bd1730-e8a6-4956-e738-d8e85cc6aa04"
-              role="group"
-              style={undefined}
-            >
-              <li
-                className="c21"
-              >
-                <div
-                  checked={false}
-                  className="c22"
-                  disabled={false}
-                  id="bP"
-                  type="checkbox"
-                >
-                  <input
-                    checked={false}
-                    className="c23"
-                    disabled={false}
-                    id="bQ"
-                    type="checkbox"
-                  />
-                  <label
-                    className="c24"
-                    htmlFor="bQ"
-                  />
-                </div>
-              </li>
-            </div>
-          </td>
-          <td
-            className="c35"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <a
-              className="c36 c37"
-              to="/instances/f1bd1730"
-            >
-              f1bd1730
-            </a>
-          </td>
-          <td
-            className="c35"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <span>
-              <span
-                className="c38"
-                color="green"
-                height="0.6875rem"
-                width="0.6875rem"
-              />
-               
-              Running
-            </span>
-          </td>
-          <td
-            className="c39"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            almost NaN years
-          </td>
-          <td
-            className="c40"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <code>
-              f1bd173
-            </code>
-          </td>
-          <td
-            className="c41 c42"
-            disabled={undefined}
-            name="td"
-            selected={undefined}
-          >
-            <div
-              box={true}
-              className="c43"
-              onClick={[Function]}
-              onMouseEnter={undefined}
-              onMouseLeave={undefined}
-              tag="div"
-            >
-              <svg
-                className=""
-                height="16"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                viewBox="0 0 4 16"
-                width="4"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-                  fill="rgba(73, 73, 73, 1)"
-                  fill-rule="evenodd"
-                />
-                <path
-                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-                  fill="rgba(73, 73, 73, 1)"
-                  fill-rule="evenodd"
-                  style={
-                    Object {
-                      "transform": "translateY(0.375rem)",
-                    }
-                  }
-                />
-                <path
-                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
-                  fill="rgba(73, 73, 73, 1)"
-                  fill-rule="evenodd"
-                  style={
-                    Object {
-                      "transform": "translateY(0.75rem)",
-                    }
-                  }
-                />
-              </svg>
-            </div>
-          </td>
-        </tr>
-      </tbody>
-    </table>
-  </form>
-  <div
-    className="c44 c45"
-  >
-    <div
-      className="c46"
-    >
-      <div
-        className="c47"
-      >
-        <div
-          className="c48"
-        >
-          <span
-            name="react-responsive-mock"
-            query="only screen and (max-width: 47.9375rem)"
-          >
-            <button
-              className="c49 c11 c12"
-              disabled={true}
-              href=""
-              icon={true}
-              onClick={[Function]}
-              type="button"
-            >
-              <svg
-                className=""
-                height="15"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                version="1.1"
-                width="15"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
-              >
-                <g
-                  transform="translate(18292 -19563)"
-                >
-                  <mask
-                    id="L"
-                  >
-                    <rect
-                      fill="#fff"
-                      height={15}
-                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-                      width={15}
-                      x={-1}
-                      y={-1}
-                    />
-                    <use
-                      fill="#000"
-                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-                      xlinkHref="#M"
-                    />
-                  </mask>
-                  <g
-                    mask="url(#L"
-                  >
-                    <use
-                      fill="rgb(216, 216, 216)"
-                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-                      xlinkHref="#N"
-                    />
-                  </g>
-                </g>
-                <defs>
-                  <path
-                    d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
-                    id="M"
-                  />
-                  <path
-                    d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
-                    id="N"
-                  />
-                </defs>
-              </svg>
-            </button>
-          </span>
-          <span
-            name="react-responsive-mock"
-            query="only screen and (min-width: 48rem)"
-          >
-            <button
-              className="c50 c11 c12"
-              disabled={true}
-              href=""
-              icon={true}
-              onClick={[Function]}
-              type="button"
-            >
-              <svg
-                className=""
-                height="15"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                version="1.1"
-                width="15"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
-              >
-                <g
-                  transform="translate(18292 -19563)"
-                >
-                  <mask
-                    id="L"
-                  >
-                    <rect
-                      fill="#fff"
-                      height={15}
-                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-                      width={15}
-                      x={-1}
-                      y={-1}
-                    />
-                    <use
-                      fill="#000"
-                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-                      xlinkHref="#M"
-                    />
-                  </mask>
-                  <g
-                    mask="url(#L"
-                  >
-                    <use
-                      fill="rgb(216, 216, 216)"
-                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
-                      xlinkHref="#N"
-                    />
-                  </g>
-                </g>
-                <defs>
-                  <path
-                    d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
-                    id="M"
-                  />
-                  <path
-                    d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
-                    id="N"
-                  />
-                </defs>
-              </svg>
-              <span>
-                Start
-              </span>
-            </button>
-          </span>
-          <span
-            name="react-responsive-mock"
-            query="only screen and (max-width: 47.9375rem)"
-          >
-            <button
-              className="c49 c11 c12"
-              disabled={true}
-              href=""
-              icon={true}
-              onClick={[Function]}
-              type="button"
-            >
-              <svg
-                className=""
-                height="14"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                version="1.1"
-                viewBox="0 0 14 14"
-                width="14"
-                xmlns="http://www.w3.org/2000/svg"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
-              >
-                <g
-                  transform="translate(18113 -18582)"
-                >
-                  <g>
-                    <mask
-                      id="O"
-                    >
-                      <use
-                        fill="white"
-                        transform="translate(-18113 18582)"
-                        xlinkHref="#P"
-                      />
-                    </mask>
-                    <g
-                      mask="url(#O)"
-                    >
-                      <use
-                        fill="rgb(216, 216, 216)"
-                        transform="translate(-18113 18582)"
-                        xlinkHref="#Q"
-                      />
-                    </g>
-                  </g>
-                </g>
-                <defs>
-                  <path
-                    d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
-                    id="P"
-                  />
-                  <path
-                    d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
-                    id="Q"
-                  />
-                </defs>
-              </svg>
-            </button>
-          </span>
-          <span
-            name="react-responsive-mock"
-            query="only screen and (min-width: 48rem)"
-          >
-            <button
-              className="c50 c11 c12"
-              disabled={true}
-              href=""
-              icon={true}
-              onClick={[Function]}
-              type="button"
-            >
-              <svg
-                className=""
-                height="14"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                version="1.1"
-                viewBox="0 0 14 14"
-                width="14"
-                xmlns="http://www.w3.org/2000/svg"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
-              >
-                <g
-                  transform="translate(18113 -18582)"
-                >
-                  <g>
-                    <mask
-                      id="O"
-                    >
-                      <use
-                        fill="white"
-                        transform="translate(-18113 18582)"
-                        xlinkHref="#P"
-                      />
-                    </mask>
-                    <g
-                      mask="url(#O)"
-                    >
-                      <use
-                        fill="rgb(216, 216, 216)"
-                        transform="translate(-18113 18582)"
-                        xlinkHref="#Q"
-                      />
-                    </g>
-                  </g>
-                </g>
-                <defs>
-                  <path
-                    d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
-                    id="P"
-                  />
-                  <path
-                    d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
-                    id="Q"
-                  />
-                </defs>
-              </svg>
-              <span>
-                Stop
-              </span>
-            </button>
-          </span>
-          <span
-            name="react-responsive-mock"
-            query="only screen and (max-width: 47.9375rem)"
-          >
-            <button
-              className="c49 c11 c12"
-              disabled={true}
-              href=""
-              icon={true}
-              onClick={[Function]}
-              type="button"
-            >
-              <svg
-                className=""
-                height="21"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                version="1.1"
-                viewBox="0 0 20 21"
-                width="20"
-                xmlns="http://www.w3.org/2000/svg"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
-              >
-                <g
-                  transform="translate(17997 -18577)"
-                >
-                  <g>
-                    <use
-                      fill="rgb(216, 216, 216)"
-                      transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
-                      xlinkHref="#K"
-                    />
-                  </g>
-                </g>
-                <defs>
-                  <path
-                    d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
-                    fillRule="evenodd"
-                    id="K"
-                  />
-                </defs>
-              </svg>
-            </button>
-          </span>
-          <span
-            name="react-responsive-mock"
-            query="only screen and (min-width: 48rem)"
-          >
-            <button
-              className="c50 c11 c12"
-              disabled={true}
-              href=""
-              icon={true}
-              onClick={[Function]}
-              type="button"
-            >
-              <svg
-                className=""
-                height="21"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                version="1.1"
-                viewBox="0 0 20 21"
-                width="20"
-                xmlns="http://www.w3.org/2000/svg"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
-              >
-                <g
-                  transform="translate(17997 -18577)"
-                >
-                  <g>
-                    <use
-                      fill="rgb(216, 216, 216)"
-                      transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
-                      xlinkHref="#K"
-                    />
-                  </g>
-                </g>
-                <defs>
-                  <path
-                    d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
-                    fillRule="evenodd"
-                    id="K"
-                  />
-                </defs>
-              </svg>
-              <span>
-                Reboot
-              </span>
-            </button>
-          </span>
-        </div>
-        <div
-          className="c51"
-        >
-          <span
-            name="react-responsive-mock"
-            query="only screen and (max-width: 47.9375rem)"
-          >
-            <button
-              className="c52 c11 c12"
-              disabled={true}
-              href=""
-              icon={true}
-              onClick={[Function]}
-              type="button"
-            >
-              <svg
-                className=""
-                height="12"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                version="1.1"
-                viewBox="0 0 9 12"
-                width="9"
-                xmlns="http://www.w3.org/2000/svg"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
-              >
-                <g
-                  transform="translate(17403 -18583)"
-                >
-                  <g>
-                    <use
-                      fill="rgba(73, 73, 73, 1)"
-                      transform="translate(-17403 18583)"
-                      xlinkHref="#j"
-                    />
-                  </g>
-                </g>
-                <defs>
-                  <path
-                    d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
-                    fillRule="evenodd"
-                    id="j"
-                  />
-                </defs>
-              </svg>
-            </button>
-          </span>
-          <span
-            name="react-responsive-mock"
-            query="only screen and (min-width: 48rem)"
-          >
-            <button
-              className="c53 c11 c12"
-              disabled={true}
-              href=""
-              icon={true}
-              onClick={[Function]}
-              type="button"
-            >
-              <svg
-                className=""
-                height="12"
-                style={
-                  Object {
-                    "transform": "rotate(0deg)",
-                  }
-                }
-                version="1.1"
-                viewBox="0 0 9 12"
-                width="9"
-                xmlns="http://www.w3.org/2000/svg"
-                xmlnsXlink="http://www.w3.org/1999/xlink"
-              >
-                <g
-                  transform="translate(17403 -18583)"
-                >
-                  <g>
-                    <use
-                      fill="rgb(216, 216, 216)"
-                      transform="translate(-17403 18583)"
-                      xlinkHref="#j"
-                    />
-                  </g>
-                </g>
-                <defs>
-                  <path
-                    d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
-                    fillRule="evenodd"
-                    id="j"
-                  />
-                </defs>
-              </svg>
-              <span>
-                Remove
-              </span>
-            </button>
-          </span>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`renders <List instances selected=all allowedActions /> without throwing 1`] = `
-.c37 {
-  background-color: transparent;
-  text-decoration-skip: objects;
-}
-
-.c36 {
-  color: rgb(59,70,204);
-  -webkit-text-fill-color: currentcolor;
-}
-
-.c36:hover {
-  text-decoration: none;
-}
-
-.c12 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  text-transform: none;
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  min-width: 7.5rem;
-}
-
-.c12::-moz-focus-inner,
-.c12[type='button']::-moz-focus-inner,
-.c12[type='reset']::-moz-focus-inner,
-.c12[type='submit']::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-
-.c12:-moz-focusring,
-.c12[type='button']:-moz-focusring,
-.c12[type='reset']:-moz-focusring,
-.c12[type='submit']:-moz-focusring {
-  outline: 0.0625rem dotted ButtonText;
-}
-
-.c12 + button {
-  margin-left: 0.375rem;
-}
-
-.c11 {
-  display: inline-block;
-}
-
-.c10 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  width: 100%;
-  max-width: 100%;
-}
-
-.c10:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c10:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c10:active,
-.c10:active:hover,
-.c10:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c10[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c10 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c10 svg {
-  max-height: 1.125rem;
-}
-
-.c51 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
 .c51:focus {
   outline: 0;
   text-decoration: none;
@@ -8963,6 +4203,23 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   border-color: rgb(216,216,216);
 }
 
+.c51:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+}
+
+.c51:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(210,67,58);
+}
+
+.c51:active,
+.c51:active:hover,
+.c51:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(210,67,58);
+}
+
 .c51:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
@@ -8988,690 +4245,17 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   max-height: 1.125rem;
 }
 
-.c52 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
+.c6 {
   font-size: 0.9375rem;
-  text-align: center;
   font-style: normal;
   font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
+  display: block;
   color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.c52:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c52:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c52:active,
-.c52:active:hover,
-.c52:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c52[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c52:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c52:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c52:active,
-.c52:active:hover,
-.c52:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c52:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c52:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c52:active,
-.c52:active:hover,
-.c52:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c52 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c52 svg {
-  max-height: 1.125rem;
-}
-
-.c54 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
   font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  float: right;
-}
-
-.c54:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c54:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c54:active,
-.c54:active:hover,
-.c54:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c54[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c54:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c54:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c54:active,
-.c54:active:hover,
-.c54:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c54:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-}
-
-.c54:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(210,67,58);
-}
-
-.c54:active,
-.c54:active:hover,
-.c54:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(210,67,58);
-}
-
-.c54:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c54:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c54:active,
-.c54:active:hover,
-.c54:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c54 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c54 svg {
-  max-height: 1.125rem;
-}
-
-.c55 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  float: right;
-}
-
-.c55:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c55:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c55:active,
-.c55:active:hover,
-.c55:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c55[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c55:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c55:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c55:active,
-.c55:active:hover,
-.c55:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c55:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-}
-
-.c55:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(210,67,58);
-}
-
-.c55:active,
-.c55:active:hover,
-.c55:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(210,67,58);
-}
-
-.c55:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c55:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c55:active,
-.c55:active:hover,
-.c55:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c55 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c55 svg {
-  max-height: 1.125rem;
-}
-
-.c49 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.c49:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c49:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c49:active,
-.c49:active:hover,
-.c49:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c49[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c49:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c49:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c49:active,
-.c49:active:hover,
-.c49:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c49 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c49 svg {
-  max-height: 1.125rem;
-}
-
-.c50 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.c50:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c50:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c50:active,
-.c50:active:hover,
-.c50:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c50[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c50:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c50:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c50:active,
-.c50:active:hover,
-.c50:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c50 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c50 svg {
-  max-height: 1.125rem;
-}
-
-.c2 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-}
-
-.c4 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c8 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c48 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c53 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
 }
 
 .c0 {
@@ -9683,14 +4267,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   padding-bottom: 1.125rem;
 }
 
-.c1 {
-  background-color: rgb(216,216,216);
-  margin: 0;
-  background-color: transparent;
-  height: 1.875rem;
-}
-
-.c46 {
+.c44 {
   margin-right: auto;
   margin-left: auto;
   box-sizing: border-box;
@@ -9712,7 +4289,113 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   align-items: stretch;
 }
 
+.c2 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+}
+
+.c3 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
 .c45 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
+.c4 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c8 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c46 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c49 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c1 {
+  background-color: rgb(216,216,216);
+  margin: 0;
+  background-color: transparent;
+  height: 1.875rem;
+}
+
+.c43 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -9740,136 +4423,15 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   bottom: 0;
 }
 
-.c44 {
-  background-color: rgba(241,241,241,1);
-  border-top: 0.0625rem solid rgb(216,216,216);
-  height: 4.375rem;
-  max-height: 4.375rem;
-}
-
-.c3 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
-.c47 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
-.c26 {
-  margin-bottom: 0.125rem;
-  margin-left: 0.5625rem;
-}
-
-.c38 {
+.c37 {
   width: 0.375rem;
   height: 0.375rem;
-  border-radius: 0.1875rem;
+  border-radius: 50%;
   background-color: rgb(0,152,88);
   display: inline-block;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 0.6875rem;
 }
 
 .c23 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  display: none;
-}
-
-.c23[type='checkbox'],
-.c23[type='radio'] {
-  box-sizing: border-box;
-  padding: 0;
-}
-
-.c23[type='number']::-webkit-inner-spin-button,
-.c23[type='number']::-webkit-outer-spin-button {
-  height: auto;
-}
-
-.c23[type='search'] {
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-  outline-offset: -0.125rem;
-}
-
-.c23[type='search']::-webkit-search-cancel-button,
-.c23[type='search']::-webkit-search-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-}
-
-.c23::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  font: inherit;
-}
-
-.c23:checked + label::after {
-  opacity: 1;
-}
-
-.c23:selected + label::after {
-  opacity: 1;
-}
-
-.c23:checked + label {
-  border-color: rgb(59,70,204);
-}
-
-.c23:selected + label {
-  border-color: rgb(59,70,204);
-}
-
-.c23:disabled + label {
-  background-color: rgb(249,249,249);
-  cursor: not-allowed;
-}
-
-.c24 {
   color: rgb(100,100,100);
   position: absolute;
   width: 1.125rem;
@@ -9887,7 +4449,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   height: 1.125rem;
 }
 
-.c24::after {
+.c23::after {
   opacity: 0;
   content: '';
   position: absolute;
@@ -9904,7 +4466,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   transform: rotate(-45deg);
 }
 
-.c22 {
+.c21 {
   display: inline-block;
   vertical-align: text-bottom;
   width: 1.125rem;
@@ -9913,7 +4475,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   cursor: pointer;
 }
 
-.c21 {
+.c20 {
   list-style-type: none;
   display: -webkit-box;
   display: -webkit-flex;
@@ -9925,7 +4487,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   align-items: center;
 }
 
-.c21 label {
+.c20 label {
   font-weight: 400;
 }
 
@@ -9961,7 +4523,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   float: right;
 }
 
-.c20 {
+.c19 {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -9976,14 +4538,6 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   -webkit-padding-after: 0;
 }
 
-.c19 {
-  padding-top: 0.25rem;
-}
-
-.c18 {
-  padding-top: 0.25rem;
-}
-
 .c7 {
   box-sizing: border-box;
   width: 18.75rem;
@@ -10047,20 +4601,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   outline: 0;
 }
 
-.c6 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c43 {
+.c41 {
   cursor: pointer;
   height: 100%;
   width: 100%;
@@ -10100,11 +4641,11 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   border-top-right-radius: 0.25rem;
 }
 
-.c32 {
+.c31 {
   width: 100%;
 }
 
-.c32 tr:first-child td {
+.c31 tr:first-child td {
   border-top: none;
 }
 
@@ -10134,7 +4675,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   border-right-width: 0;
 }
 
-.c25 {
+.c24 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -10157,11 +4698,42 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   font-weight: bold;
 }
 
-.c25:not(:first-child) {
+.c24:not(:first-child) {
   border-left-width: 0;
 }
 
-.c25:not(:last-child) {
+.c24:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c26 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 9.375rem;
+  display: table-cell;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c26:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c26:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -10174,8 +4746,8 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   box-sizing: border-box;
   padding: 0 1.5rem;
   height: 3.75rem;
-  width: 9.375rem;
-  display: table-cell;
+  width: 0rem;
+  display: none;
   cursor: pointer;
   -webkit-user-select: none;
   -moz-user-select: none;
@@ -10227,38 +4799,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   border-right-width: 0;
 }
 
-.c29 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  width: 0rem;
-  display: none;
-  cursor: pointer;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  vertical-align: middle;
-  text-align: left;
-  height: 2.625rem;
-  color: rgb(189,189,189);
-  font-weight: 500;
-}
-
-.c29:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c29:not(:last-child) {
-  border-right-width: 0;
-}
-
-.c31 {
+.c30 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -10274,15 +4815,15 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   font-weight: 500;
 }
 
-.c31:not(:first-child) {
+.c30:not(:first-child) {
   border-left-width: 0;
 }
 
-.c31:not(:last-child) {
+.c30:not(:last-child) {
   border-right-width: 0;
 }
 
-.c35 {
+.c33 {
   border-width: 0.0625rem;
   border-style: solid;
   border-color: rgb(216,216,216);
@@ -10296,11 +4837,35 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   border-bottom-width: 0;
 }
 
-.c35:not(:first-child) {
+.c33:not(:first-child) {
   border-left-width: 0;
 }
 
-.c35:not(:last-child) {
+.c33:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c38 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 0rem;
+  display: none;
+  vertical-align: middle;
+  text-align: left;
+  border-bottom-width: 0;
+}
+
+.c38:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c38:not(:last-child) {
   border-right-width: 0;
 }
 
@@ -10337,11 +4902,8 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   box-sizing: border-box;
   padding: 0 1.5rem;
   height: 3.75rem;
-  width: 0rem;
-  display: none;
-  vertical-align: middle;
-  text-align: left;
   border-bottom-width: 0;
+  border-left-width: 0.0625rem !important;
 }
 
 .c40:not(:first-child) {
@@ -10352,27 +4914,6 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   border-right-width: 0;
 }
 
-.c42 {
-  border-width: 0.0625rem;
-  border-style: solid;
-  border-color: rgb(216,216,216);
-  border-spacing: 0;
-  white-space: nowrap;
-  box-sizing: border-box;
-  padding: 0 1.5rem;
-  height: 3.75rem;
-  border-bottom-width: 0;
-  border-left-width: 0.0625rem !important;
-}
-
-.c42:not(:first-child) {
-  border-left-width: 0;
-}
-
-.c42:not(:last-child) {
-  border-right-width: 0;
-}
-
 .c15 {
   display: table-row;
   color: rgba(73,73,73,1);
@@ -10393,7 +4934,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   border-bottom-width: 0.0625rem;
 }
 
-.c33 {
+.c32 {
   display: table-row;
   color: rgba(73,73,73,1);
   background-color: rgb(255,255,255);
@@ -10401,92 +4942,14 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   box-sizing: border-box;
 }
 
-.c33:last-child {
+.c32:last-child {
   box-shadow: none;
 }
 
-.c33:last-child td {
+.c32:last-child td {
   border-bottom-width: 0.0625rem;
 }
 
-.c16 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c30 {
-  padding: 0rem;
-}
-
-.c34 {
-  padding: 0rem;
-  padding-left: 0.75rem;
-}
-
-.c41 {
-  padding: 0rem;
-}
-
-@media only screen and (min-width:0em) {
-  .c4 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c4 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c8 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c8 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c48 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c53 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
 @media only screen and (min-width:48em) {
   .c0 {
     width: 46rem;
@@ -10513,32 +4976,32 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
 }
 
 @media only screen and (min-width:48em) {
-  .c46 {
+  .c44 {
     width: 46rem;
   }
 }
 
 @media only screen and (min-width:64em) {
-  .c46 {
+  .c44 {
     width: 61rem;
   }
 }
 
 @media only screen and (min-width:75em) {
-  .c46 {
+  .c44 {
     width: 76rem;
   }
 }
 
 @media only screen and (max-width:47.9375rem) {
-  .c46 {
+  .c44 {
     padding-left: 0.375rem;
     padding-right: 0.375rem;
   }
 }
 
 @media only screen and (min-width:0em) {
-  .c47 {
+  .c45 {
     -webkit-align-items: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
@@ -10547,7 +5010,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
 }
 
 @media only screen and (min-width:0em) {
-  .c47 {
+  .c45 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -10555,29 +5018,89 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   }
 }
 
+@media only screen and (min-width:0em) {
+  .c4 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c4 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c8 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c8 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c46 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c49 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
 @media only screen and (min-width:47.9375rem) {
-  .c28 {
+  .c27 {
     width: 10rem;
     display: table-cell;
   }
 }
 
 @media only screen and (min-width:47.9375rem) {
-  .c29 {
+  .c28 {
     width: 8.125rem;
     display: table-cell;
   }
 }
 
 @media only screen and (min-width:47.9375rem) {
-  .c39 {
+  .c38 {
     width: 10rem;
     display: table-cell;
   }
 }
 
 @media only screen and (min-width:47.9375rem) {
-  .c40 {
+  .c39 {
     width: 8.125rem;
     display: table-cell;
   }
@@ -10600,7 +5123,5464 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
         className="c4"
       >
         <div
-          className="c5"
+          className="baseline-jVaZNU kXgQxt c5"
+          name="filter"
+          role="group"
+          style={undefined}
+        >
+          <label
+            className="c6"
+            htmlFor="bx"
+          >
+            Filter instances
+          </label>
+          <input
+            className="c7"
+            disabled={false}
+            id="bx"
+            placeholder="Search for name, state, tags, etc..."
+          />
+        </div>
+      </div>
+      <div
+        className="c8"
+      >
+        <div
+          className="baseline-jVaZNU kXgQxt c9"
+          role="group"
+          style={undefined}
+        >
+          <label
+            className="c6"
+            htmlFor="bz"
+          >
+            ⁣
+          </label>
+          <button
+            className="c10 c11 c12"
+            disabled={false}
+            href=""
+            icon={true}
+            onClick={[Function]}
+            type="button"
+          >
+            Create Instance
+          </button>
+        </div>
+      </div>
+    </div>
+  </form>
+  <form>
+    <table
+      className="c13"
+    >
+      <thead
+        className="c14"
+        disabled={undefined}
+        name="thdead"
+        selected={undefined}
+      >
+        <tr
+          className="c15"
+          disabled={undefined}
+          name="tr"
+          selected={undefined}
+        >
+          <th
+            className="c16 c17"
+            disabled={undefined}
+            name="th"
+            selected={undefined}
+          >
+            <div
+              className="c18 baseline-jVaZNU c18 c19"
+              role="group"
+              style={undefined}
+            >
+              <li
+                className="c20"
+              >
+                <div
+                  checked={false}
+                  className="c21"
+                  disabled={false}
+                  id="bB"
+                  onChange={[Function]}
+                  type="checkbox"
+                >
+                  <input
+                    checked={false}
+                    className="c22"
+                    disabled={false}
+                    id="bC"
+                    onChange={[Function]}
+                    type="checkbox"
+                  />
+                  <label
+                    className="c23"
+                    htmlFor="bC"
+                  />
+                </div>
+              </li>
+            </div>
+          </th>
+          <th
+            className="c24"
+            disabled={undefined}
+            name="th"
+            onClick={[Function]}
+            selected={undefined}
+          >
+            <span>
+              Name 
+            </span>
+            <svg
+              className="c25"
+              height="6"
+              innerRef={undefined}
+              marginBottom="0.125rem"
+              marginLeft="0.5625rem"
+              style={
+                Object {
+                  "transform": "rotate(180deg)",
+                }
+              }
+              viewBox="0 0 9 6"
+              width="9"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
+                fill="rgba(73, 73, 73, 1)"
+                fillRule="evenodd"
+              />
+            </svg>
+          </th>
+          <th
+            className="c26"
+            disabled={undefined}
+            name="th"
+            onClick={[Function]}
+            selected={undefined}
+          >
+            <span>
+              Status 
+            </span>
+          </th>
+          <th
+            className="c27"
+            disabled={undefined}
+            name="th"
+            onClick={[Function]}
+            selected={undefined}
+          >
+            <span>
+              Created 
+            </span>
+          </th>
+          <th
+            className="c28"
+            disabled={undefined}
+            name="th"
+            onClick={[Function]}
+            selected={undefined}
+          >
+            <span>
+              Short ID 
+            </span>
+          </th>
+          <th
+            className="c29 c30"
+            disabled={undefined}
+            name="th"
+            selected={undefined}
+          />
+        </tr>
+      </thead>
+      <tbody
+        className="c31"
+        disabled={undefined}
+        name="tbody"
+        selected={undefined}
+      >
+        <tr
+          className="c32"
+          disabled={undefined}
+          name="tr"
+          selected={undefined}
+        >
+          <td
+            className="c16 c33"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <div
+              className="c18 baseline-jVaZNU c18 c19"
+              name="2252839a-e698-ceec-afac-9549ad0c6624"
+              role="group"
+              style={undefined}
+            >
+              <li
+                className="c20"
+              >
+                <div
+                  checked={false}
+                  className="c21"
+                  disabled={false}
+                  id="bD"
+                  type="checkbox"
+                >
+                  <input
+                    checked={false}
+                    className="c22"
+                    disabled={false}
+                    id="bE"
+                    type="checkbox"
+                  />
+                  <label
+                    className="c23"
+                    htmlFor="bE"
+                  />
+                </div>
+              </li>
+            </div>
+          </td>
+          <td
+            className="c33"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <a
+              className="c34 c35"
+              to="/instances/2252839a"
+            >
+              2252839a
+            </a>
+          </td>
+          <td
+            className="c33"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <span>
+              <span
+                className="c36 c37"
+                color="green"
+                height="0.6875rem"
+                width="0.6875rem"
+              />
+               
+              Running
+            </span>
+          </td>
+          <td
+            className="c38"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            almost NaN years
+          </td>
+          <td
+            className="c39"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <code>
+              2252839
+            </code>
+          </td>
+          <td
+            className="c29 c40"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <div
+              box={true}
+              className="c41"
+              onClick={[Function]}
+              onMouseEnter={undefined}
+              onMouseLeave={undefined}
+              tag="div"
+            >
+              <svg
+                className=""
+                height="16"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                viewBox="0 0 4 16"
+                width="4"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+                  fill="rgba(73, 73, 73, 1)"
+                  fill-rule="evenodd"
+                />
+                <path
+                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+                  fill="rgba(73, 73, 73, 1)"
+                  fill-rule="evenodd"
+                  style={
+                    Object {
+                      "transform": "translateY(0.375rem)",
+                    }
+                  }
+                />
+                <path
+                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+                  fill="rgba(73, 73, 73, 1)"
+                  fill-rule="evenodd"
+                  style={
+                    Object {
+                      "transform": "translateY(0.75rem)",
+                    }
+                  }
+                />
+              </svg>
+            </div>
+          </td>
+        </tr>
+        <tr
+          className="c32"
+          disabled={undefined}
+          name="tr"
+          selected={undefined}
+        >
+          <td
+            className="c16 c33"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <div
+              className="c18 baseline-jVaZNU c18 c19"
+              name="f1bd1730-e8a6-4956-e738-d8e85cc6aa04"
+              role="group"
+              style={undefined}
+            >
+              <li
+                className="c20"
+              >
+                <div
+                  checked={false}
+                  className="c21"
+                  disabled={false}
+                  id="bF"
+                  type="checkbox"
+                >
+                  <input
+                    checked={false}
+                    className="c22"
+                    disabled={false}
+                    id="bG"
+                    type="checkbox"
+                  />
+                  <label
+                    className="c23"
+                    htmlFor="bG"
+                  />
+                </div>
+              </li>
+            </div>
+          </td>
+          <td
+            className="c33"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <a
+              className="c34 c35"
+              to="/instances/f1bd1730"
+            >
+              f1bd1730
+            </a>
+          </td>
+          <td
+            className="c33"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <span>
+              <span
+                className="c36 c37"
+                color="green"
+                height="0.6875rem"
+                width="0.6875rem"
+              />
+               
+              Running
+            </span>
+          </td>
+          <td
+            className="c38"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            almost NaN years
+          </td>
+          <td
+            className="c39"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <code>
+              f1bd173
+            </code>
+          </td>
+          <td
+            className="c29 c40"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <div
+              box={true}
+              className="c41"
+              onClick={[Function]}
+              onMouseEnter={undefined}
+              onMouseLeave={undefined}
+              tag="div"
+            >
+              <svg
+                className=""
+                height="16"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                viewBox="0 0 4 16"
+                width="4"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+                  fill="rgba(73, 73, 73, 1)"
+                  fill-rule="evenodd"
+                />
+                <path
+                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+                  fill="rgba(73, 73, 73, 1)"
+                  fill-rule="evenodd"
+                  style={
+                    Object {
+                      "transform": "translateY(0.375rem)",
+                    }
+                  }
+                />
+                <path
+                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+                  fill="rgba(73, 73, 73, 1)"
+                  fill-rule="evenodd"
+                  style={
+                    Object {
+                      "transform": "translateY(0.75rem)",
+                    }
+                  }
+                />
+              </svg>
+            </div>
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </form>
+  <div
+    className="c42 c43"
+  >
+    <div
+      className="c44"
+    >
+      <div
+        className="c45"
+      >
+        <div
+          className="c46"
+        >
+          <span
+            name="react-responsive-mock"
+            query="only screen and (max-width: 47.9375rem)"
+          >
+            <button
+              className="c47 c11 c12"
+              disabled={true}
+              href=""
+              icon={true}
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                className=""
+                height="15"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                version="1.1"
+                width="15"
+                xmlnsXlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  transform="translate(18292 -19563)"
+                >
+                  <mask
+                    id="L"
+                  >
+                    <rect
+                      fill="#fff"
+                      height={15}
+                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                      width={15}
+                      x={-1}
+                      y={-1}
+                    />
+                    <use
+                      fill="#000"
+                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                      xlinkHref="#M"
+                    />
+                  </mask>
+                  <g
+                    mask="url(#L"
+                  >
+                    <use
+                      fill="rgb(216, 216, 216)"
+                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                      xlinkHref="#N"
+                    />
+                  </g>
+                </g>
+                <defs>
+                  <path
+                    d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
+                    id="M"
+                  />
+                  <path
+                    d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
+                    id="N"
+                  />
+                </defs>
+              </svg>
+            </button>
+          </span>
+          <span
+            name="react-responsive-mock"
+            query="only screen and (min-width: 48rem)"
+          >
+            <button
+              className="c48 c11 c12"
+              disabled={true}
+              href=""
+              icon={true}
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                className=""
+                height="15"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                version="1.1"
+                width="15"
+                xmlnsXlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  transform="translate(18292 -19563)"
+                >
+                  <mask
+                    id="L"
+                  >
+                    <rect
+                      fill="#fff"
+                      height={15}
+                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                      width={15}
+                      x={-1}
+                      y={-1}
+                    />
+                    <use
+                      fill="#000"
+                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                      xlinkHref="#M"
+                    />
+                  </mask>
+                  <g
+                    mask="url(#L"
+                  >
+                    <use
+                      fill="rgb(216, 216, 216)"
+                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                      xlinkHref="#N"
+                    />
+                  </g>
+                </g>
+                <defs>
+                  <path
+                    d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
+                    id="M"
+                  />
+                  <path
+                    d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
+                    id="N"
+                  />
+                </defs>
+              </svg>
+              <span>
+                Start
+              </span>
+            </button>
+          </span>
+          <span
+            name="react-responsive-mock"
+            query="only screen and (max-width: 47.9375rem)"
+          >
+            <button
+              className="c47 c11 c12"
+              disabled={true}
+              href=""
+              icon={true}
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                className=""
+                height="14"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                version="1.1"
+                viewBox="0 0 14 14"
+                width="14"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlnsXlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  transform="translate(18113 -18582)"
+                >
+                  <g>
+                    <mask
+                      id="O"
+                    >
+                      <use
+                        fill="white"
+                        transform="translate(-18113 18582)"
+                        xlinkHref="#P"
+                      />
+                    </mask>
+                    <g
+                      mask="url(#O)"
+                    >
+                      <use
+                        fill="rgb(216, 216, 216)"
+                        transform="translate(-18113 18582)"
+                        xlinkHref="#Q"
+                      />
+                    </g>
+                  </g>
+                </g>
+                <defs>
+                  <path
+                    d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
+                    id="P"
+                  />
+                  <path
+                    d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
+                    id="Q"
+                  />
+                </defs>
+              </svg>
+            </button>
+          </span>
+          <span
+            name="react-responsive-mock"
+            query="only screen and (min-width: 48rem)"
+          >
+            <button
+              className="c48 c11 c12"
+              disabled={true}
+              href=""
+              icon={true}
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                className=""
+                height="14"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                version="1.1"
+                viewBox="0 0 14 14"
+                width="14"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlnsXlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  transform="translate(18113 -18582)"
+                >
+                  <g>
+                    <mask
+                      id="O"
+                    >
+                      <use
+                        fill="white"
+                        transform="translate(-18113 18582)"
+                        xlinkHref="#P"
+                      />
+                    </mask>
+                    <g
+                      mask="url(#O)"
+                    >
+                      <use
+                        fill="rgb(216, 216, 216)"
+                        transform="translate(-18113 18582)"
+                        xlinkHref="#Q"
+                      />
+                    </g>
+                  </g>
+                </g>
+                <defs>
+                  <path
+                    d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
+                    id="P"
+                  />
+                  <path
+                    d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
+                    id="Q"
+                  />
+                </defs>
+              </svg>
+              <span>
+                Stop
+              </span>
+            </button>
+          </span>
+          <span
+            name="react-responsive-mock"
+            query="only screen and (max-width: 47.9375rem)"
+          >
+            <button
+              className="c47 c11 c12"
+              disabled={true}
+              href=""
+              icon={true}
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                className=""
+                height="21"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                version="1.1"
+                viewBox="0 0 20 21"
+                width="20"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlnsXlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  transform="translate(17997 -18577)"
+                >
+                  <g>
+                    <use
+                      fill="rgb(216, 216, 216)"
+                      transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
+                      xlinkHref="#K"
+                    />
+                  </g>
+                </g>
+                <defs>
+                  <path
+                    d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
+                    fillRule="evenodd"
+                    id="K"
+                  />
+                </defs>
+              </svg>
+            </button>
+          </span>
+          <span
+            name="react-responsive-mock"
+            query="only screen and (min-width: 48rem)"
+          >
+            <button
+              className="c48 c11 c12"
+              disabled={true}
+              href=""
+              icon={true}
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                className=""
+                height="21"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                version="1.1"
+                viewBox="0 0 20 21"
+                width="20"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlnsXlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  transform="translate(17997 -18577)"
+                >
+                  <g>
+                    <use
+                      fill="rgb(216, 216, 216)"
+                      transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
+                      xlinkHref="#K"
+                    />
+                  </g>
+                </g>
+                <defs>
+                  <path
+                    d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
+                    fillRule="evenodd"
+                    id="K"
+                  />
+                </defs>
+              </svg>
+              <span>
+                Reboot
+              </span>
+            </button>
+          </span>
+        </div>
+        <div
+          className="c49"
+        >
+          <span
+            name="react-responsive-mock"
+            query="only screen and (max-width: 47.9375rem)"
+          >
+            <button
+              className="c50 c11 c12"
+              disabled={true}
+              href=""
+              icon={true}
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                className=""
+                height="12"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                version="1.1"
+                viewBox="0 0 9 12"
+                width="9"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlnsXlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  transform="translate(17403 -18583)"
+                >
+                  <g>
+                    <use
+                      fill="rgba(73, 73, 73, 1)"
+                      transform="translate(-17403 18583)"
+                      xlinkHref="#j"
+                    />
+                  </g>
+                </g>
+                <defs>
+                  <path
+                    d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
+                    fillRule="evenodd"
+                    id="j"
+                  />
+                </defs>
+              </svg>
+            </button>
+          </span>
+          <span
+            name="react-responsive-mock"
+            query="only screen and (min-width: 48rem)"
+          >
+            <button
+              className="c51 c11 c12"
+              disabled={true}
+              href=""
+              icon={true}
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                className=""
+                height="12"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                version="1.1"
+                viewBox="0 0 9 12"
+                width="9"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlnsXlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  transform="translate(17403 -18583)"
+                >
+                  <g>
+                    <use
+                      fill="rgb(216, 216, 216)"
+                      transform="translate(-17403 18583)"
+                      xlinkHref="#j"
+                    />
+                  </g>
+                </g>
+                <defs>
+                  <path
+                    d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
+                    fillRule="evenodd"
+                    id="j"
+                  />
+                </defs>
+              </svg>
+              <span>
+                Remove
+              </span>
+            </button>
+          </span>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`renders <List instances selected=all /> without throwing 1`] = `
+.c35 {
+  background-color: transparent;
+  text-decoration-skip: objects;
+}
+
+.c12 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  text-transform: none;
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  min-width: 7.5rem;
+}
+
+.c12::-moz-focus-inner,
+.c12[type='button']::-moz-focus-inner,
+.c12[type='reset']::-moz-focus-inner,
+.c12[type='submit']::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+.c12:-moz-focusring,
+.c12[type='button']:-moz-focusring,
+.c12[type='reset']:-moz-focusring,
+.c12[type='submit']:-moz-focusring {
+  outline: 0.0625rem dotted ButtonText;
+}
+
+.c12 + button {
+  margin-left: 0.375rem;
+}
+
+.c22 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c22[type='checkbox'],
+.c22[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c22[type='number']::-webkit-inner-spin-button,
+.c22[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c22[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c22[type='search']::-webkit-search-cancel-button,
+.c22[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c22::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c22:checked + label::after {
+  opacity: 1;
+}
+
+.c22:selected + label::after {
+  opacity: 1;
+}
+
+.c22:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c22:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c22:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
+.c34 {
+  color: rgb(59,70,204);
+  -webkit-text-fill-color: currentcolor;
+}
+
+.c34:hover {
+  text-decoration: none;
+}
+
+.c16 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c18 {
+  padding-top: 0.25rem;
+}
+
+.c25 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c29 {
+  padding: 0rem;
+}
+
+.c36 {
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 0.6875rem;
+}
+
+.c42 {
+  background-color: rgba(241,241,241,1);
+  border-top: 0.0625rem solid rgb(216,216,216);
+  height: 4.375rem;
+  max-height: 4.375rem;
+}
+
+.c11 {
+  display: inline-block;
+}
+
+.c10 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  width: 100%;
+  max-width: 100%;
+}
+
+.c10:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c10:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c10:active,
+.c10:active:hover,
+.c10:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c10[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c10 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c10 svg {
+  max-height: 1.125rem;
+}
+
+.c47 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c47:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c47:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c47:active,
+.c47:active:hover,
+.c47:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c47[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c47:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c47:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c47:active,
+.c47:active:hover,
+.c47:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c47:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c47:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c47:active,
+.c47:active:hover,
+.c47:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c47 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c47 svg {
+  max-height: 1.125rem;
+}
+
+.c48 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c48:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c48:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c48:active,
+.c48:active:hover,
+.c48:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c48[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c48:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c48:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c48:active,
+.c48:active:hover,
+.c48:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c48:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c48:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c48:active,
+.c48:active:hover,
+.c48:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c48 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c48 svg {
+  max-height: 1.125rem;
+}
+
+.c50 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  float: right;
+}
+
+.c50:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c50:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c50:active,
+.c50:active:hover,
+.c50:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c50[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c50:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c50:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c50:active,
+.c50:active:hover,
+.c50:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c50:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+}
+
+.c50:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(210,67,58);
+}
+
+.c50:active,
+.c50:active:hover,
+.c50:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(210,67,58);
+}
+
+.c50:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c50:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c50:active,
+.c50:active:hover,
+.c50:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c50 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c50 svg {
+  max-height: 1.125rem;
+}
+
+.c51 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  float: right;
+}
+
+.c51:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c51:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c51:active,
+.c51:active:hover,
+.c51:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c51[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c51:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c51:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c51:active,
+.c51:active:hover,
+.c51:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c51:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+}
+
+.c51:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(210,67,58);
+}
+
+.c51:active,
+.c51:active:hover,
+.c51:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(210,67,58);
+}
+
+.c51:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c51:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c51:active,
+.c51:active:hover,
+.c51:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c51 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c51 svg {
+  max-height: 1.125rem;
+}
+
+.c6 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
+.c44 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+  -webkit-align-items: stretch;
+  -webkit-box-align: stretch;
+  -ms-flex-align: stretch;
+  align-items: stretch;
+}
+
+.c2 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+}
+
+.c3 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
+.c45 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
+.c4 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c8 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c46 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c49 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c1 {
+  background-color: rgb(216,216,216);
+  margin: 0;
+  background-color: transparent;
+  height: 1.875rem;
+}
+
+.c43 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+  -webkit-align-items: stretch;
+  -webkit-box-align: stretch;
+  -ms-flex-align: stretch;
+  align-items: stretch;
+  background-color: rgb(30,49,59);
+  max-height: 3.3125rem;
+  min-height: 3.3125rem;
+  line-height: 1.5625rem;
+  position: fixed;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
+
+.c37 {
+  width: 0.375rem;
+  height: 0.375rem;
+  border-radius: 50%;
+  background-color: rgb(0,152,88);
+  display: inline-block;
+}
+
+.c23 {
+  color: rgb(100,100,100);
+  position: absolute;
+  width: 1.125rem;
+  height: 1.125rem;
+  box-sizing: border-box;
+  top: 0;
+  right: 0;
+  cursor: pointer;
+  background-color: rgb(255,255,255);
+  box-shadow: none;
+  border: 0.0625rem solid rgb(216,216,216);
+  cursor: pointer;
+  border-radius: 0.25rem;
+  width: 1.125rem;
+  height: 1.125rem;
+}
+
+.c23::after {
+  opacity: 0;
+  content: '';
+  position: absolute;
+  width: 0.375rem;
+  height: 0.125rem;
+  background: transparent;
+  top: 0.3125rem;
+  left: 0.25rem;
+  border: 0.125rem solid rgb(45,45,45);
+  border-top: none;
+  border-right: none;
+  -webkit-transform: rotate(-45deg);
+  -ms-transform: rotate(-45deg);
+  transform: rotate(-45deg);
+}
+
+.c21 {
+  display: inline-block;
+  vertical-align: text-bottom;
+  width: 1.125rem;
+  height: 1.125rem;
+  position: relative;
+  cursor: pointer;
+}
+
+.c20 {
+  list-style-type: none;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c20 label {
+  font-weight: 400;
+}
+
+.c5 {
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  border: none;
+  overflow: hidden;
+  height: auto;
+  -webkit-margin-start: 0;
+  -webkit-margin-end: 0;
+  -webkit-padding-before: 0;
+  -webkit-padding-start: 0;
+  -webkit-padding-end: 0;
+  -webkit-padding-after: 0;
+  width: 100%;
+}
+
+.c9 {
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  border: none;
+  overflow: hidden;
+  height: auto;
+  -webkit-margin-start: 0;
+  -webkit-margin-end: 0;
+  -webkit-padding-before: 0;
+  -webkit-padding-start: 0;
+  -webkit-padding-end: 0;
+  -webkit-padding-after: 0;
+  float: right;
+}
+
+.c19 {
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  border: none;
+  overflow: hidden;
+  height: auto;
+  -webkit-margin-start: 0;
+  -webkit-margin-end: 0;
+  -webkit-padding-before: 0;
+  -webkit-padding-start: 0;
+  -webkit-padding-end: 0;
+  -webkit-padding-after: 0;
+}
+
+.c7 {
+  box-sizing: border-box;
+  width: 18.75rem;
+  height: 3rem;
+  min-height: 3rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.8125rem 1.125rem;
+  border-radius: 0.25rem;
+  background-color: rgb(255,255,255);
+  border: 0.0625rem solid rgb(216,216,216);
+  color: rgba(73,73,73,1);
+  width: 100%;
+  text-overflow: ellipsis;
+  font-size: 0.9375rem;
+  line-height: normal !important;
+  font-style: normal;
+  font-stretch: normal;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  outline: 0;
+}
+
+.c7::-webkit-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c7::-moz-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c7:-ms-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c7:invalid {
+  box-shadow: none;
+}
+
+.c7:disabled {
+  background-color: rgb(250,250,250);
+  color: rgb(216,216,216);
+  cursor: not-allowed;
+}
+
+.c7:disabled::-webkit-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c7:disabled::-moz-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c7:disabled:-ms-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c7:focus {
+  border-color: rgb(59,70,204);
+  outline: 0;
+}
+
+.c41 {
+  cursor: pointer;
+  height: 100%;
+  width: 100%;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c13 {
+  overflow: hidden;
+  border-spacing: 0;
+  border-collapse: separate;
+  table-layout: fixed;
+  width: 100%;
+  max-width: 100%;
+}
+
+.c14 {
+  width: 100%;
+  background: rgb(250,250,250);
+}
+
+.c14 th:first-child {
+  border-top-left-radius: 0.25rem;
+}
+
+.c14 th:last-child {
+  border-top-right-radius: 0.25rem;
+}
+
+.c31 {
+  width: 100%;
+}
+
+.c31 tr:first-child td {
+  border-top: none;
+}
+
+.c17 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 2rem;
+  display: table-cell;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c17:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c17:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c24 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+  color: rgba(73,73,73,1);
+  font-weight: bold;
+}
+
+.c24:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c24:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c26 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 9.375rem;
+  display: table-cell;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c26:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c26:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c27 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 0rem;
+  display: none;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c27:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c27:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c28 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 0rem;
+  display: none;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c28:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c28:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c30 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 3.75rem;
+  display: table-cell;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c30:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c30:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c33 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  vertical-align: middle;
+  text-align: left;
+  border-bottom-width: 0;
+}
+
+.c33:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c33:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c38 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 0rem;
+  display: none;
+  vertical-align: middle;
+  text-align: left;
+  border-bottom-width: 0;
+}
+
+.c38:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c38:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c39 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 0rem;
+  display: none;
+  vertical-align: middle;
+  text-align: left;
+  border-bottom-width: 0;
+}
+
+.c39:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c39:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c40 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  border-bottom-width: 0;
+  border-left-width: 0.0625rem !important;
+}
+
+.c40:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c40:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c15 {
+  display: table-row;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  box-shadow: 0 0.125rem 0 rgba(0,0,0,0.05);
+  box-sizing: border-box;
+  color: rgba(73,73,73,1);
+  background-color: transparent;
+  border: none;
+  box-shadow: none;
+}
+
+.c15:last-child {
+  box-shadow: none;
+}
+
+.c15:last-child td {
+  border-bottom-width: 0.0625rem;
+}
+
+.c32 {
+  display: table-row;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  box-shadow: 0 0.125rem 0 rgba(0,0,0,0.05);
+  box-sizing: border-box;
+}
+
+.c32:last-child {
+  box-shadow: none;
+}
+
+.c32:last-child td {
+  border-bottom-width: 0.0625rem;
+}
+
+@media only screen and (min-width:48em) {
+  .c0 {
+    width: 46rem;
+  }
+}
+
+@media only screen and (min-width:64em) {
+  .c0 {
+    width: 61rem;
+  }
+}
+
+@media only screen and (min-width:75em) {
+  .c0 {
+    width: 76rem;
+  }
+}
+
+@media only screen and (max-width:47.9375rem) {
+  .c0 {
+    padding-left: 0.375rem;
+    padding-right: 0.375rem;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c44 {
+    width: 46rem;
+  }
+}
+
+@media only screen and (min-width:64em) {
+  .c44 {
+    width: 61rem;
+  }
+}
+
+@media only screen and (min-width:75em) {
+  .c44 {
+    width: 76rem;
+  }
+}
+
+@media only screen and (max-width:47.9375rem) {
+  .c44 {
+    padding-left: 0.375rem;
+    padding-right: 0.375rem;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c45 {
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c45 {
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+    -ms-flex-pack: justify;
+    justify-content: space-between;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c4 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c4 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c8 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c8 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c46 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c49 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:47.9375rem) {
+  .c27 {
+    width: 10rem;
+    display: table-cell;
+  }
+}
+
+@media only screen and (min-width:47.9375rem) {
+  .c28 {
+    width: 8.125rem;
+    display: table-cell;
+  }
+}
+
+@media only screen and (min-width:47.9375rem) {
+  .c38 {
+    width: 10rem;
+    display: table-cell;
+  }
+}
+
+@media only screen and (min-width:47.9375rem) {
+  .c39 {
+    width: 8.125rem;
+    display: table-cell;
+  }
+}
+
+<div
+  className="c0"
+>
+  <div
+    className="c1 c2"
+    height="1.875rem"
+  />
+  <form
+    onSubmit={undefined}
+  >
+    <div
+      className="c3"
+    >
+      <div
+        className="c4"
+      >
+        <div
+          className="baseline-jVaZNU kXgQxt c5"
+          name="filter"
+          role="group"
+          style={undefined}
+        >
+          <label
+            className="c6"
+            htmlFor="bH"
+          >
+            Filter instances
+          </label>
+          <input
+            className="c7"
+            disabled={false}
+            id="bH"
+            placeholder="Search for name, state, tags, etc..."
+          />
+        </div>
+      </div>
+      <div
+        className="c8"
+      >
+        <div
+          className="baseline-jVaZNU kXgQxt c9"
+          role="group"
+          style={undefined}
+        >
+          <label
+            className="c6"
+            htmlFor="bJ"
+          >
+            ⁣
+          </label>
+          <button
+            className="c10 c11 c12"
+            disabled={false}
+            href=""
+            icon={true}
+            onClick={[Function]}
+            type="button"
+          >
+            Create Instance
+          </button>
+        </div>
+      </div>
+    </div>
+  </form>
+  <form>
+    <table
+      className="c13"
+    >
+      <thead
+        className="c14"
+        disabled={undefined}
+        name="thdead"
+        selected={undefined}
+      >
+        <tr
+          className="c15"
+          disabled={undefined}
+          name="tr"
+          selected={undefined}
+        >
+          <th
+            className="c16 c17"
+            disabled={undefined}
+            name="th"
+            selected={undefined}
+          >
+            <div
+              className="c18 baseline-jVaZNU c18 c19"
+              role="group"
+              style={undefined}
+            >
+              <li
+                className="c20"
+              >
+                <div
+                  checked={true}
+                  className="c21"
+                  disabled={false}
+                  id="bL"
+                  onChange={[Function]}
+                  type="checkbox"
+                >
+                  <input
+                    checked={true}
+                    className="c22"
+                    disabled={false}
+                    id="bM"
+                    onChange={[Function]}
+                    type="checkbox"
+                  />
+                  <label
+                    className="c23"
+                    htmlFor="bM"
+                  />
+                </div>
+              </li>
+            </div>
+          </th>
+          <th
+            className="c24"
+            disabled={undefined}
+            name="th"
+            onClick={[Function]}
+            selected={undefined}
+          >
+            <span>
+              Name 
+            </span>
+            <svg
+              className="c25"
+              height="6"
+              innerRef={undefined}
+              marginBottom="0.125rem"
+              marginLeft="0.5625rem"
+              style={
+                Object {
+                  "transform": "rotate(180deg)",
+                }
+              }
+              viewBox="0 0 9 6"
+              width="9"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M9 1.386L7.648 0 4.5 3.228 1.352 0 0 1.386 4.5 6z"
+                fill="rgba(73, 73, 73, 1)"
+                fillRule="evenodd"
+              />
+            </svg>
+          </th>
+          <th
+            className="c26"
+            disabled={undefined}
+            name="th"
+            onClick={[Function]}
+            selected={undefined}
+          >
+            <span>
+              Status 
+            </span>
+          </th>
+          <th
+            className="c27"
+            disabled={undefined}
+            name="th"
+            onClick={[Function]}
+            selected={undefined}
+          >
+            <span>
+              Created 
+            </span>
+          </th>
+          <th
+            className="c28"
+            disabled={undefined}
+            name="th"
+            onClick={[Function]}
+            selected={undefined}
+          >
+            <span>
+              Short ID 
+            </span>
+          </th>
+          <th
+            className="c29 c30"
+            disabled={undefined}
+            name="th"
+            selected={undefined}
+          />
+        </tr>
+      </thead>
+      <tbody
+        className="c31"
+        disabled={undefined}
+        name="tbody"
+        selected={undefined}
+      >
+        <tr
+          className="c32"
+          disabled={undefined}
+          name="tr"
+          selected={undefined}
+        >
+          <td
+            className="c16 c33"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <div
+              className="c18 baseline-jVaZNU c18 c19"
+              name="2252839a-e698-ceec-afac-9549ad0c6624"
+              role="group"
+              style={undefined}
+            >
+              <li
+                className="c20"
+              >
+                <div
+                  checked={false}
+                  className="c21"
+                  disabled={false}
+                  id="bN"
+                  type="checkbox"
+                >
+                  <input
+                    checked={false}
+                    className="c22"
+                    disabled={false}
+                    id="bO"
+                    type="checkbox"
+                  />
+                  <label
+                    className="c23"
+                    htmlFor="bO"
+                  />
+                </div>
+              </li>
+            </div>
+          </td>
+          <td
+            className="c33"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <a
+              className="c34 c35"
+              to="/instances/2252839a"
+            >
+              2252839a
+            </a>
+          </td>
+          <td
+            className="c33"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <span>
+              <span
+                className="c36 c37"
+                color="green"
+                height="0.6875rem"
+                width="0.6875rem"
+              />
+               
+              Running
+            </span>
+          </td>
+          <td
+            className="c38"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            almost NaN years
+          </td>
+          <td
+            className="c39"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <code>
+              2252839
+            </code>
+          </td>
+          <td
+            className="c29 c40"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <div
+              box={true}
+              className="c41"
+              onClick={[Function]}
+              onMouseEnter={undefined}
+              onMouseLeave={undefined}
+              tag="div"
+            >
+              <svg
+                className=""
+                height="16"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                viewBox="0 0 4 16"
+                width="4"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+                  fill="rgba(73, 73, 73, 1)"
+                  fill-rule="evenodd"
+                />
+                <path
+                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+                  fill="rgba(73, 73, 73, 1)"
+                  fill-rule="evenodd"
+                  style={
+                    Object {
+                      "transform": "translateY(0.375rem)",
+                    }
+                  }
+                />
+                <path
+                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+                  fill="rgba(73, 73, 73, 1)"
+                  fill-rule="evenodd"
+                  style={
+                    Object {
+                      "transform": "translateY(0.75rem)",
+                    }
+                  }
+                />
+              </svg>
+            </div>
+          </td>
+        </tr>
+        <tr
+          className="c32"
+          disabled={undefined}
+          name="tr"
+          selected={undefined}
+        >
+          <td
+            className="c16 c33"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <div
+              className="c18 baseline-jVaZNU c18 c19"
+              name="f1bd1730-e8a6-4956-e738-d8e85cc6aa04"
+              role="group"
+              style={undefined}
+            >
+              <li
+                className="c20"
+              >
+                <div
+                  checked={false}
+                  className="c21"
+                  disabled={false}
+                  id="bP"
+                  type="checkbox"
+                >
+                  <input
+                    checked={false}
+                    className="c22"
+                    disabled={false}
+                    id="bQ"
+                    type="checkbox"
+                  />
+                  <label
+                    className="c23"
+                    htmlFor="bQ"
+                  />
+                </div>
+              </li>
+            </div>
+          </td>
+          <td
+            className="c33"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <a
+              className="c34 c35"
+              to="/instances/f1bd1730"
+            >
+              f1bd1730
+            </a>
+          </td>
+          <td
+            className="c33"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <span>
+              <span
+                className="c36 c37"
+                color="green"
+                height="0.6875rem"
+                width="0.6875rem"
+              />
+               
+              Running
+            </span>
+          </td>
+          <td
+            className="c38"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            almost NaN years
+          </td>
+          <td
+            className="c39"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <code>
+              f1bd173
+            </code>
+          </td>
+          <td
+            className="c29 c40"
+            disabled={undefined}
+            name="td"
+            selected={undefined}
+          >
+            <div
+              box={true}
+              className="c41"
+              onClick={[Function]}
+              onMouseEnter={undefined}
+              onMouseLeave={undefined}
+              tag="div"
+            >
+              <svg
+                className=""
+                height="16"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                viewBox="0 0 4 16"
+                width="4"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+                  fill="rgba(73, 73, 73, 1)"
+                  fill-rule="evenodd"
+                />
+                <path
+                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+                  fill="rgba(73, 73, 73, 1)"
+                  fill-rule="evenodd"
+                  style={
+                    Object {
+                      "transform": "translateY(0.375rem)",
+                    }
+                  }
+                />
+                <path
+                  d="M2 4a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"
+                  fill="rgba(73, 73, 73, 1)"
+                  fill-rule="evenodd"
+                  style={
+                    Object {
+                      "transform": "translateY(0.75rem)",
+                    }
+                  }
+                />
+              </svg>
+            </div>
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </form>
+  <div
+    className="c42 c43"
+  >
+    <div
+      className="c44"
+    >
+      <div
+        className="c45"
+      >
+        <div
+          className="c46"
+        >
+          <span
+            name="react-responsive-mock"
+            query="only screen and (max-width: 47.9375rem)"
+          >
+            <button
+              className="c47 c11 c12"
+              disabled={true}
+              href=""
+              icon={true}
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                className=""
+                height="15"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                version="1.1"
+                width="15"
+                xmlnsXlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  transform="translate(18292 -19563)"
+                >
+                  <mask
+                    id="L"
+                  >
+                    <rect
+                      fill="#fff"
+                      height={15}
+                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                      width={15}
+                      x={-1}
+                      y={-1}
+                    />
+                    <use
+                      fill="#000"
+                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                      xlinkHref="#M"
+                    />
+                  </mask>
+                  <g
+                    mask="url(#L"
+                  >
+                    <use
+                      fill="rgb(216, 216, 216)"
+                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                      xlinkHref="#N"
+                    />
+                  </g>
+                </g>
+                <defs>
+                  <path
+                    d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
+                    id="M"
+                  />
+                  <path
+                    d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
+                    id="N"
+                  />
+                </defs>
+              </svg>
+            </button>
+          </span>
+          <span
+            name="react-responsive-mock"
+            query="only screen and (min-width: 48rem)"
+          >
+            <button
+              className="c48 c11 c12"
+              disabled={true}
+              href=""
+              icon={true}
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                className=""
+                height="15"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                version="1.1"
+                width="15"
+                xmlnsXlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  transform="translate(18292 -19563)"
+                >
+                  <mask
+                    id="L"
+                  >
+                    <rect
+                      fill="#fff"
+                      height={15}
+                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                      width={15}
+                      x={-1}
+                      y={-1}
+                    />
+                    <use
+                      fill="#000"
+                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                      xlinkHref="#M"
+                    />
+                  </mask>
+                  <g
+                    mask="url(#L"
+                  >
+                    <use
+                      fill="rgb(216, 216, 216)"
+                      transform="matrix(6.12323e-17 1 -1 6.12323e-17 -18278 19564)"
+                      xlinkHref="#N"
+                    />
+                  </g>
+                </g>
+                <defs>
+                  <path
+                    d="M5.595 1.93a1 1 0 0 1 1.81 0l4.056 8.645A1 1 0 0 1 10.556 12H2.444a1 1 0 0 1-.905-1.425L5.595 1.93z"
+                    id="M"
+                  />
+                  <path
+                    d="M1.54 10.575l-1.812-.85 1.811.85zM7.404 1.93l-1.81.85 1.81-.85zm-1.81.85l4.055 8.645 3.621-1.7-4.055-8.644-3.621 1.698zm4.96 7.22h-8.11v4h8.11v-4zM3.35 11.425l4.055-8.646-3.621-1.698-4.056 8.645 3.622 1.699zM2.444 10a1 1 0 0 1 .906 1.425l-3.622-1.7C-1.205 11.716.247 14 2.444 14v-4zm7.206 1.425A1 1 0 0 1 10.555 10v4c2.198 0 3.65-2.285 2.716-4.274l-3.62 1.699zM9.216 1.08c-1.08-2.302-4.353-2.302-5.432 0l3.621 1.698a1 1 0 0 1-1.81 0l3.621-1.698z"
+                    id="N"
+                  />
+                </defs>
+              </svg>
+              <span>
+                Start
+              </span>
+            </button>
+          </span>
+          <span
+            name="react-responsive-mock"
+            query="only screen and (max-width: 47.9375rem)"
+          >
+            <button
+              className="c47 c11 c12"
+              disabled={true}
+              href=""
+              icon={true}
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                className=""
+                height="14"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                version="1.1"
+                viewBox="0 0 14 14"
+                width="14"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlnsXlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  transform="translate(18113 -18582)"
+                >
+                  <g>
+                    <mask
+                      id="O"
+                    >
+                      <use
+                        fill="white"
+                        transform="translate(-18113 18582)"
+                        xlinkHref="#P"
+                      />
+                    </mask>
+                    <g
+                      mask="url(#O)"
+                    >
+                      <use
+                        fill="rgb(216, 216, 216)"
+                        transform="translate(-18113 18582)"
+                        xlinkHref="#Q"
+                      />
+                    </g>
+                  </g>
+                </g>
+                <defs>
+                  <path
+                    d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
+                    id="P"
+                  />
+                  <path
+                    d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
+                    id="Q"
+                  />
+                </defs>
+              </svg>
+            </button>
+          </span>
+          <span
+            name="react-responsive-mock"
+            query="only screen and (min-width: 48rem)"
+          >
+            <button
+              className="c48 c11 c12"
+              disabled={true}
+              href=""
+              icon={true}
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                className=""
+                height="14"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                version="1.1"
+                viewBox="0 0 14 14"
+                width="14"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlnsXlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  transform="translate(18113 -18582)"
+                >
+                  <g>
+                    <mask
+                      id="O"
+                    >
+                      <use
+                        fill="white"
+                        transform="translate(-18113 18582)"
+                        xlinkHref="#P"
+                      />
+                    </mask>
+                    <g
+                      mask="url(#O)"
+                    >
+                      <use
+                        fill="rgb(216, 216, 216)"
+                        transform="translate(-18113 18582)"
+                        xlinkHref="#Q"
+                      />
+                    </g>
+                  </g>
+                </g>
+                <defs>
+                  <path
+                    d="M 0 2C 0 0.895431 0.895431 0 2 0L 12 0C 13.1046 0 14 0.895431 14 2L 14 12C 14 13.1046 13.1046 14 12 14L 2 14C 0.895431 14 0 13.1046 0 12L 0 2Z"
+                    id="P"
+                  />
+                  <path
+                    d="M 2 2L 12 2L 12 -2L 2 -2L 2 2ZM 12 2L 12 12L 16 12L 16 2L 12 2ZM 12 12L 2 12L 2 16L 12 16L 12 12ZM 2 12L 2 2L -2 2L -2 12L 2 12ZM 2 12L 2 12L -2 12C -2 14.2091 -0.209139 16 2 16L 2 12ZM 12 12L 12 12L 12 16C 14.2091 16 16 14.2091 16 12L 12 12ZM 12 2L 12 2L 16 2C 16 -0.209139 14.2091 -2 12 -2L 12 2ZM 2 -2C -0.209139 -2 -2 -0.209139 -2 2L 2 2L 2 2L 2 -2Z"
+                    id="Q"
+                  />
+                </defs>
+              </svg>
+              <span>
+                Stop
+              </span>
+            </button>
+          </span>
+          <span
+            name="react-responsive-mock"
+            query="only screen and (max-width: 47.9375rem)"
+          >
+            <button
+              className="c47 c11 c12"
+              disabled={true}
+              href=""
+              icon={true}
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                className=""
+                height="21"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                version="1.1"
+                viewBox="0 0 20 21"
+                width="20"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlnsXlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  transform="translate(17997 -18577)"
+                >
+                  <g>
+                    <use
+                      fill="rgb(216, 216, 216)"
+                      transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
+                      xlinkHref="#K"
+                    />
+                  </g>
+                </g>
+                <defs>
+                  <path
+                    d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
+                    fillRule="evenodd"
+                    id="K"
+                  />
+                </defs>
+              </svg>
+            </button>
+          </span>
+          <span
+            name="react-responsive-mock"
+            query="only screen and (min-width: 48rem)"
+          >
+            <button
+              className="c48 c11 c12"
+              disabled={true}
+              href=""
+              icon={true}
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                className=""
+                height="21"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                version="1.1"
+                viewBox="0 0 20 21"
+                width="20"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlnsXlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  transform="translate(17997 -18577)"
+                >
+                  <g>
+                    <use
+                      fill="rgb(216, 216, 216)"
+                      transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
+                      xlinkHref="#K"
+                    />
+                  </g>
+                </g>
+                <defs>
+                  <path
+                    d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
+                    fillRule="evenodd"
+                    id="K"
+                  />
+                </defs>
+              </svg>
+              <span>
+                Reboot
+              </span>
+            </button>
+          </span>
+        </div>
+        <div
+          className="c49"
+        >
+          <span
+            name="react-responsive-mock"
+            query="only screen and (max-width: 47.9375rem)"
+          >
+            <button
+              className="c50 c11 c12"
+              disabled={true}
+              href=""
+              icon={true}
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                className=""
+                height="12"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                version="1.1"
+                viewBox="0 0 9 12"
+                width="9"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlnsXlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  transform="translate(17403 -18583)"
+                >
+                  <g>
+                    <use
+                      fill="rgba(73, 73, 73, 1)"
+                      transform="translate(-17403 18583)"
+                      xlinkHref="#j"
+                    />
+                  </g>
+                </g>
+                <defs>
+                  <path
+                    d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
+                    fillRule="evenodd"
+                    id="j"
+                  />
+                </defs>
+              </svg>
+            </button>
+          </span>
+          <span
+            name="react-responsive-mock"
+            query="only screen and (min-width: 48rem)"
+          >
+            <button
+              className="c51 c11 c12"
+              disabled={true}
+              href=""
+              icon={true}
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                className=""
+                height="12"
+                innerRef={undefined}
+                style={
+                  Object {
+                    "transform": "rotate(0deg)",
+                  }
+                }
+                version="1.1"
+                viewBox="0 0 9 12"
+                width="9"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlnsXlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  transform="translate(17403 -18583)"
+                >
+                  <g>
+                    <use
+                      fill="rgb(216, 216, 216)"
+                      transform="translate(-17403 18583)"
+                      xlinkHref="#j"
+                    />
+                  </g>
+                </g>
+                <defs>
+                  <path
+                    d="M 2 0L 2 1L 0 1L 0 2L 9 2L 9 1L 7 1L 7 0L 2 0ZM 0 3L 1 12L 8 12L 9 3L 0 3ZM 6 4L 7.882 4L 7.104 11L 6 11L 6 4ZM 4 11L 5.001 11L 5.001 4L 4 4L 4 11ZM 1.11719 4L 3.00019 4L 3.00019 11L 1.89619 11L 1.11719 4Z"
+                    fillRule="evenodd"
+                    id="j"
+                  />
+                </defs>
+              </svg>
+              <span>
+                Remove
+              </span>
+            </button>
+          </span>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`renders <List instances selected=all allowedActions /> without throwing 1`] = `
+.c35 {
+  background-color: transparent;
+  text-decoration-skip: objects;
+}
+
+.c12 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  text-transform: none;
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  min-width: 7.5rem;
+}
+
+.c12::-moz-focus-inner,
+.c12[type='button']::-moz-focus-inner,
+.c12[type='reset']::-moz-focus-inner,
+.c12[type='submit']::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+.c12:-moz-focusring,
+.c12[type='button']:-moz-focusring,
+.c12[type='reset']:-moz-focusring,
+.c12[type='submit']:-moz-focusring {
+  outline: 0.0625rem dotted ButtonText;
+}
+
+.c12 + button {
+  margin-left: 0.375rem;
+}
+
+.c22 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  display: none;
+}
+
+.c22[type='checkbox'],
+.c22[type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+.c22[type='number']::-webkit-inner-spin-button,
+.c22[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+
+.c22[type='search'] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  appearance: textfield;
+  outline-offset: -0.125rem;
+}
+
+.c22[type='search']::-webkit-search-cancel-button,
+.c22[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.c22::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  font: inherit;
+}
+
+.c22:checked + label::after {
+  opacity: 1;
+}
+
+.c22:selected + label::after {
+  opacity: 1;
+}
+
+.c22:checked + label {
+  border-color: rgb(59,70,204);
+}
+
+.c22:selected + label {
+  border-color: rgb(59,70,204);
+}
+
+.c22:disabled + label {
+  background-color: rgb(249,249,249);
+  cursor: not-allowed;
+}
+
+.c34 {
+  color: rgb(59,70,204);
+  -webkit-text-fill-color: currentcolor;
+}
+
+.c34:hover {
+  text-decoration: none;
+}
+
+.c16 {
+  padding: 0rem;
+  padding-left: 0.75rem;
+}
+
+.c18 {
+  padding-top: 0.25rem;
+}
+
+.c25 {
+  margin-bottom: 0.125rem;
+  margin-left: 0.5625rem;
+}
+
+.c29 {
+  padding: 0rem;
+}
+
+.c36 {
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 0.6875rem;
+}
+
+.c42 {
+  background-color: rgba(241,241,241,1);
+  border-top: 0.0625rem solid rgb(216,216,216);
+  height: 4.375rem;
+  max-height: 4.375rem;
+}
+
+.c11 {
+  display: inline-block;
+}
+
+.c10 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  width: 100%;
+  max-width: 100%;
+}
+
+.c10:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c10:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c10:active,
+.c10:active:hover,
+.c10:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c10[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c10 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c10 svg {
+  max-height: 1.125rem;
+}
+
+.c49 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c49:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c49:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c49:active,
+.c49:active:hover,
+.c49:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c49[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c49:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c49:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c49:active,
+.c49:active:hover,
+.c49:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c49:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c49:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c49:active,
+.c49:active:hover,
+.c49:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c49 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c49 svg {
+  max-height: 1.125rem;
+}
+
+.c50 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c50:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c50:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c50:active,
+.c50:active:hover,
+.c50:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c50[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c50:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c50:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c50:active,
+.c50:active:hover,
+.c50:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c50:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c50:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c50:active,
+.c50:active:hover,
+.c50:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c50 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c50 svg {
+  max-height: 1.125rem;
+}
+
+.c52 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  float: right;
+}
+
+.c52:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c52:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c52:active,
+.c52:active:hover,
+.c52:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c52[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c52:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c52:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c52:active,
+.c52:active:hover,
+.c52:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c52:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+}
+
+.c52:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(210,67,58);
+}
+
+.c52:active,
+.c52:active:hover,
+.c52:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(210,67,58);
+}
+
+.c52:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c52:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c52:active,
+.c52:active:hover,
+.c52:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c52 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c52 svg {
+  max-height: 1.125rem;
+}
+
+.c53 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  float: right;
+}
+
+.c53:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c53:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c53:active,
+.c53:active:hover,
+.c53:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c53[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c53:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c53:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c53:active,
+.c53:active:hover,
+.c53:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c53:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+}
+
+.c53:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(210,67,58);
+}
+
+.c53:active,
+.c53:active:hover,
+.c53:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(210,67,58);
+}
+
+.c53:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c53:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c53:active,
+.c53:active:hover,
+.c53:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c53 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c53 svg {
+  max-height: 1.125rem;
+}
+
+.c47 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c47:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c47:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c47:active,
+.c47:active:hover,
+.c47:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c47[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c47:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c47:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c47:active,
+.c47:active:hover,
+.c47:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c47 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c47 svg {
+  max-height: 1.125rem;
+}
+
+.c48 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c48:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c48:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c48:active,
+.c48:active:hover,
+.c48:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c48[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c48:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c48:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c48:active,
+.c48:active:hover,
+.c48:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c48 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c48 svg {
+  max-height: 1.125rem;
+}
+
+.c6 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
+.c44 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+  -webkit-align-items: stretch;
+  -webkit-box-align: stretch;
+  -ms-flex-align: stretch;
+  align-items: stretch;
+}
+
+.c2 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+}
+
+.c3 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
+.c45 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
+.c4 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c8 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c46 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c51 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c1 {
+  background-color: rgb(216,216,216);
+  margin: 0;
+  background-color: transparent;
+  height: 1.875rem;
+}
+
+.c43 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-align-content: stretch;
+  -ms-flex-line-pack: stretch;
+  align-content: stretch;
+  -webkit-align-items: stretch;
+  -webkit-box-align: stretch;
+  -ms-flex-align: stretch;
+  align-items: stretch;
+  background-color: rgb(30,49,59);
+  max-height: 3.3125rem;
+  min-height: 3.3125rem;
+  line-height: 1.5625rem;
+  position: fixed;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
+
+.c37 {
+  width: 0.375rem;
+  height: 0.375rem;
+  border-radius: 50%;
+  background-color: rgb(0,152,88);
+  display: inline-block;
+}
+
+.c23 {
+  color: rgb(100,100,100);
+  position: absolute;
+  width: 1.125rem;
+  height: 1.125rem;
+  box-sizing: border-box;
+  top: 0;
+  right: 0;
+  cursor: pointer;
+  background-color: rgb(255,255,255);
+  box-shadow: none;
+  border: 0.0625rem solid rgb(216,216,216);
+  cursor: pointer;
+  border-radius: 0.25rem;
+  width: 1.125rem;
+  height: 1.125rem;
+}
+
+.c23::after {
+  opacity: 0;
+  content: '';
+  position: absolute;
+  width: 0.375rem;
+  height: 0.125rem;
+  background: transparent;
+  top: 0.3125rem;
+  left: 0.25rem;
+  border: 0.125rem solid rgb(45,45,45);
+  border-top: none;
+  border-right: none;
+  -webkit-transform: rotate(-45deg);
+  -ms-transform: rotate(-45deg);
+  transform: rotate(-45deg);
+}
+
+.c21 {
+  display: inline-block;
+  vertical-align: text-bottom;
+  width: 1.125rem;
+  height: 1.125rem;
+  position: relative;
+  cursor: pointer;
+}
+
+.c20 {
+  list-style-type: none;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c20 label {
+  font-weight: 400;
+}
+
+.c5 {
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  border: none;
+  overflow: hidden;
+  height: auto;
+  -webkit-margin-start: 0;
+  -webkit-margin-end: 0;
+  -webkit-padding-before: 0;
+  -webkit-padding-start: 0;
+  -webkit-padding-end: 0;
+  -webkit-padding-after: 0;
+  width: 100%;
+}
+
+.c9 {
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  border: none;
+  overflow: hidden;
+  height: auto;
+  -webkit-margin-start: 0;
+  -webkit-margin-end: 0;
+  -webkit-padding-before: 0;
+  -webkit-padding-start: 0;
+  -webkit-padding-end: 0;
+  -webkit-padding-after: 0;
+  float: right;
+}
+
+.c19 {
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  border: none;
+  overflow: hidden;
+  height: auto;
+  -webkit-margin-start: 0;
+  -webkit-margin-end: 0;
+  -webkit-padding-before: 0;
+  -webkit-padding-start: 0;
+  -webkit-padding-end: 0;
+  -webkit-padding-after: 0;
+}
+
+.c7 {
+  box-sizing: border-box;
+  width: 18.75rem;
+  height: 3rem;
+  min-height: 3rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.8125rem 1.125rem;
+  border-radius: 0.25rem;
+  background-color: rgb(255,255,255);
+  border: 0.0625rem solid rgb(216,216,216);
+  color: rgba(73,73,73,1);
+  width: 100%;
+  text-overflow: ellipsis;
+  font-size: 0.9375rem;
+  line-height: normal !important;
+  font-style: normal;
+  font-stretch: normal;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  outline: 0;
+}
+
+.c7::-webkit-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c7::-moz-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c7:-ms-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c7:invalid {
+  box-shadow: none;
+}
+
+.c7:disabled {
+  background-color: rgb(250,250,250);
+  color: rgb(216,216,216);
+  cursor: not-allowed;
+}
+
+.c7:disabled::-webkit-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c7:disabled::-moz-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c7:disabled:-ms-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c7:focus {
+  border-color: rgb(59,70,204);
+  outline: 0;
+}
+
+.c41 {
+  cursor: pointer;
+  height: 100%;
+  width: 100%;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c13 {
+  overflow: hidden;
+  border-spacing: 0;
+  border-collapse: separate;
+  table-layout: fixed;
+  width: 100%;
+  max-width: 100%;
+}
+
+.c14 {
+  width: 100%;
+  background: rgb(250,250,250);
+}
+
+.c14 th:first-child {
+  border-top-left-radius: 0.25rem;
+}
+
+.c14 th:last-child {
+  border-top-right-radius: 0.25rem;
+}
+
+.c31 {
+  width: 100%;
+}
+
+.c31 tr:first-child td {
+  border-top: none;
+}
+
+.c17 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 2rem;
+  display: table-cell;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c17:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c17:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c24 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+  color: rgba(73,73,73,1);
+  font-weight: bold;
+}
+
+.c24:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c24:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c26 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 9.375rem;
+  display: table-cell;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c26:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c26:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c27 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 0rem;
+  display: none;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c27:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c27:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c28 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 0rem;
+  display: none;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  text-align: left;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c28:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c28:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c30 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 3.75rem;
+  display: table-cell;
+  height: 2.625rem;
+  color: rgb(189,189,189);
+  font-weight: 500;
+}
+
+.c30:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c30:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c33 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  vertical-align: middle;
+  text-align: left;
+  border-bottom-width: 0;
+}
+
+.c33:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c33:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c38 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 0rem;
+  display: none;
+  vertical-align: middle;
+  text-align: left;
+  border-bottom-width: 0;
+}
+
+.c38:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c38:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c39 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  width: 0rem;
+  display: none;
+  vertical-align: middle;
+  text-align: left;
+  border-bottom-width: 0;
+}
+
+.c39:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c39:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c40 {
+  border-width: 0.0625rem;
+  border-style: solid;
+  border-color: rgb(216,216,216);
+  border-spacing: 0;
+  white-space: nowrap;
+  box-sizing: border-box;
+  padding: 0 1.5rem;
+  height: 3.75rem;
+  border-bottom-width: 0;
+  border-left-width: 0.0625rem !important;
+}
+
+.c40:not(:first-child) {
+  border-left-width: 0;
+}
+
+.c40:not(:last-child) {
+  border-right-width: 0;
+}
+
+.c15 {
+  display: table-row;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  box-shadow: 0 0.125rem 0 rgba(0,0,0,0.05);
+  box-sizing: border-box;
+  color: rgba(73,73,73,1);
+  background-color: transparent;
+  border: none;
+  box-shadow: none;
+}
+
+.c15:last-child {
+  box-shadow: none;
+}
+
+.c15:last-child td {
+  border-bottom-width: 0.0625rem;
+}
+
+.c32 {
+  display: table-row;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  box-shadow: 0 0.125rem 0 rgba(0,0,0,0.05);
+  box-sizing: border-box;
+}
+
+.c32:last-child {
+  box-shadow: none;
+}
+
+.c32:last-child td {
+  border-bottom-width: 0.0625rem;
+}
+
+@media only screen and (min-width:48em) {
+  .c0 {
+    width: 46rem;
+  }
+}
+
+@media only screen and (min-width:64em) {
+  .c0 {
+    width: 61rem;
+  }
+}
+
+@media only screen and (min-width:75em) {
+  .c0 {
+    width: 76rem;
+  }
+}
+
+@media only screen and (max-width:47.9375rem) {
+  .c0 {
+    padding-left: 0.375rem;
+    padding-right: 0.375rem;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c44 {
+    width: 46rem;
+  }
+}
+
+@media only screen and (min-width:64em) {
+  .c44 {
+    width: 61rem;
+  }
+}
+
+@media only screen and (min-width:75em) {
+  .c44 {
+    width: 76rem;
+  }
+}
+
+@media only screen and (max-width:47.9375rem) {
+  .c44 {
+    padding-left: 0.375rem;
+    padding-right: 0.375rem;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c45 {
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c45 {
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+    -ms-flex-pack: justify;
+    justify-content: space-between;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c4 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c4 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c8 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c8 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c46 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c51 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:47.9375rem) {
+  .c27 {
+    width: 10rem;
+    display: table-cell;
+  }
+}
+
+@media only screen and (min-width:47.9375rem) {
+  .c28 {
+    width: 8.125rem;
+    display: table-cell;
+  }
+}
+
+@media only screen and (min-width:47.9375rem) {
+  .c38 {
+    width: 10rem;
+    display: table-cell;
+  }
+}
+
+@media only screen and (min-width:47.9375rem) {
+  .c39 {
+    width: 8.125rem;
+    display: table-cell;
+  }
+}
+
+<div
+  className="c0"
+>
+  <div
+    className="c1 c2"
+    height="1.875rem"
+  />
+  <form
+    onSubmit={undefined}
+  >
+    <div
+      className="c3"
+    >
+      <div
+        className="c4"
+      >
+        <div
+          className="baseline-jVaZNU kXgQxt c5"
           name="filter"
           role="group"
           style={undefined}
@@ -10623,7 +10603,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
         className="c8"
       >
         <div
-          className="c9"
+          className="baseline-jVaZNU kXgQxt c9"
           role="group"
           style={undefined}
         >
@@ -10670,16 +10650,16 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             selected={undefined}
           >
             <div
-              className="c18 c19 c20"
+              className="c18 baseline-jVaZNU c18 c19"
               role="group"
               style={undefined}
             >
               <li
-                className="c21"
+                className="c20"
               >
                 <div
                   checked={true}
-                  className="c22"
+                  className="c21"
                   disabled={false}
                   id="bV"
                   onChange={[Function]}
@@ -10687,14 +10667,14 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
                 >
                   <input
                     checked={true}
-                    className="c23"
+                    className="c22"
                     disabled={false}
                     id="bW"
                     onChange={[Function]}
                     type="checkbox"
                   />
                   <label
-                    className="c24"
+                    className="c23"
                     htmlFor="bW"
                   />
                 </div>
@@ -10702,7 +10682,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             </div>
           </th>
           <th
-            className="c25"
+            className="c24"
             disabled={undefined}
             name="th"
             onClick={[Function]}
@@ -10712,8 +10692,9 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
               Name 
             </span>
             <svg
-              className="c26"
+              className="c25"
               height="6"
+              innerRef={undefined}
               marginBottom="0.125rem"
               marginLeft="0.5625rem"
               style={
@@ -10733,7 +10714,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             </svg>
           </th>
           <th
-            className="c27"
+            className="c26"
             disabled={undefined}
             name="th"
             onClick={[Function]}
@@ -10744,7 +10725,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             </span>
           </th>
           <th
-            className="c28"
+            className="c27"
             disabled={undefined}
             name="th"
             onClick={[Function]}
@@ -10755,7 +10736,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             </span>
           </th>
           <th
-            className="c29"
+            className="c28"
             disabled={undefined}
             name="th"
             onClick={[Function]}
@@ -10766,7 +10747,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             </span>
           </th>
           <th
-            className="c30 c31"
+            className="c29 c30"
             disabled={undefined}
             name="th"
             selected={undefined}
@@ -10774,48 +10755,48 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
         </tr>
       </thead>
       <tbody
-        className="c32"
+        className="c31"
         disabled={undefined}
         name="tbody"
         selected={undefined}
       >
         <tr
-          className="c33"
+          className="c32"
           disabled={undefined}
           name="tr"
           selected={undefined}
         >
           <td
-            className="c34 c35"
+            className="c16 c33"
             disabled={undefined}
             name="td"
             selected={undefined}
           >
             <div
-              className="c18 c19 c20"
+              className="c18 baseline-jVaZNU c18 c19"
               name="2252839a-e698-ceec-afac-9549ad0c6624"
               role="group"
               style={undefined}
             >
               <li
-                className="c21"
+                className="c20"
               >
                 <div
                   checked={false}
-                  className="c22"
+                  className="c21"
                   disabled={false}
                   id="bX"
                   type="checkbox"
                 >
                   <input
                     checked={false}
-                    className="c23"
+                    className="c22"
                     disabled={false}
                     id="bY"
                     type="checkbox"
                   />
                   <label
-                    className="c24"
+                    className="c23"
                     htmlFor="bY"
                   />
                 </div>
@@ -10823,27 +10804,27 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             </div>
           </td>
           <td
-            className="c35"
+            className="c33"
             disabled={undefined}
             name="td"
             selected={undefined}
           >
             <a
-              className="c36 c37"
+              className="c34 c35"
               to="/instances/2252839a"
             >
               2252839a
             </a>
           </td>
           <td
-            className="c35"
+            className="c33"
             disabled={undefined}
             name="td"
             selected={undefined}
           >
             <span>
               <span
-                className="c38"
+                className="c36 c37"
                 color="green"
                 height="0.6875rem"
                 width="0.6875rem"
@@ -10853,7 +10834,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             </span>
           </td>
           <td
-            className="c39"
+            className="c38"
             disabled={undefined}
             name="td"
             selected={undefined}
@@ -10861,7 +10842,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             almost NaN years
           </td>
           <td
-            className="c40"
+            className="c39"
             disabled={undefined}
             name="td"
             selected={undefined}
@@ -10871,14 +10852,14 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             </code>
           </td>
           <td
-            className="c41 c42"
+            className="c29 c40"
             disabled={undefined}
             name="td"
             selected={undefined}
           >
             <div
               box={true}
-              className="c43"
+              className="c41"
               onClick={[Function]}
               onMouseEnter={undefined}
               onMouseLeave={undefined}
@@ -10887,6 +10868,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
               <svg
                 className=""
                 height="16"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -10926,42 +10908,42 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
           </td>
         </tr>
         <tr
-          className="c33"
+          className="c32"
           disabled={undefined}
           name="tr"
           selected={undefined}
         >
           <td
-            className="c34 c35"
+            className="c16 c33"
             disabled={undefined}
             name="td"
             selected={undefined}
           >
             <div
-              className="c18 c19 c20"
+              className="c18 baseline-jVaZNU c18 c19"
               name="f1bd1730-e8a6-4956-e738-d8e85cc6aa04"
               role="group"
               style={undefined}
             >
               <li
-                className="c21"
+                className="c20"
               >
                 <div
                   checked={false}
-                  className="c22"
+                  className="c21"
                   disabled={false}
                   id="bZ"
                   type="checkbox"
                 >
                   <input
                     checked={false}
-                    className="c23"
+                    className="c22"
                     disabled={false}
                     id="ca"
                     type="checkbox"
                   />
                   <label
-                    className="c24"
+                    className="c23"
                     htmlFor="ca"
                   />
                 </div>
@@ -10969,27 +10951,27 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             </div>
           </td>
           <td
-            className="c35"
+            className="c33"
             disabled={undefined}
             name="td"
             selected={undefined}
           >
             <a
-              className="c36 c37"
+              className="c34 c35"
               to="/instances/f1bd1730"
             >
               f1bd1730
             </a>
           </td>
           <td
-            className="c35"
+            className="c33"
             disabled={undefined}
             name="td"
             selected={undefined}
           >
             <span>
               <span
-                className="c38"
+                className="c36 c37"
                 color="green"
                 height="0.6875rem"
                 width="0.6875rem"
@@ -10999,7 +10981,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             </span>
           </td>
           <td
-            className="c39"
+            className="c38"
             disabled={undefined}
             name="td"
             selected={undefined}
@@ -11007,7 +10989,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             almost NaN years
           </td>
           <td
-            className="c40"
+            className="c39"
             disabled={undefined}
             name="td"
             selected={undefined}
@@ -11017,14 +10999,14 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             </code>
           </td>
           <td
-            className="c41 c42"
+            className="c29 c40"
             disabled={undefined}
             name="td"
             selected={undefined}
           >
             <div
               box={true}
-              className="c43"
+              className="c41"
               onClick={[Function]}
               onMouseEnter={undefined}
               onMouseLeave={undefined}
@@ -11033,6 +11015,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
               <svg
                 className=""
                 height="16"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -11075,23 +11058,23 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
     </table>
   </form>
   <div
-    className="c44 c45"
+    className="c42 c43"
   >
     <div
-      className="c46"
+      className="c44"
     >
       <div
-        className="c47"
+        className="c45"
       >
         <div
-          className="c48"
+          className="c46"
         >
           <span
             name="react-responsive-mock"
             query="only screen and (max-width: 47.9375rem)"
           >
             <button
-              className="c49 c11 c12"
+              className="c47 c11 c12"
               disabled={false}
               href=""
               icon={true}
@@ -11101,6 +11084,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
               <svg
                 className=""
                 height="15"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -11158,7 +11142,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             query="only screen and (min-width: 48rem)"
           >
             <button
-              className="c50 c11 c12"
+              className="c48 c11 c12"
               disabled={false}
               href=""
               icon={true}
@@ -11168,6 +11152,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
               <svg
                 className=""
                 height="15"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -11228,7 +11213,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             query="only screen and (max-width: 47.9375rem)"
           >
             <button
-              className="c51 c11 c12"
+              className="c49 c11 c12"
               disabled={true}
               href=""
               icon={true}
@@ -11238,6 +11223,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
               <svg
                 className=""
                 height="14"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -11291,7 +11277,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             query="only screen and (min-width: 48rem)"
           >
             <button
-              className="c52 c11 c12"
+              className="c50 c11 c12"
               disabled={true}
               href=""
               icon={true}
@@ -11301,6 +11287,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
               <svg
                 className=""
                 height="14"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -11357,7 +11344,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             query="only screen and (max-width: 47.9375rem)"
           >
             <button
-              className="c51 c11 c12"
+              className="c49 c11 c12"
               disabled={true}
               href=""
               icon={true}
@@ -11367,6 +11354,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
               <svg
                 className=""
                 height="21"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -11404,7 +11392,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             query="only screen and (min-width: 48rem)"
           >
             <button
-              className="c52 c11 c12"
+              className="c50 c11 c12"
               disabled={true}
               href=""
               icon={true}
@@ -11414,6 +11402,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
               <svg
                 className=""
                 height="21"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -11451,14 +11440,14 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
           </span>
         </div>
         <div
-          className="c53"
+          className="c51"
         >
           <span
             name="react-responsive-mock"
             query="only screen and (max-width: 47.9375rem)"
           >
             <button
-              className="c54 c11 c12"
+              className="c52 c11 c12"
               disabled={true}
               href=""
               icon={true}
@@ -11468,6 +11457,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
               <svg
                 className=""
                 height="12"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -11505,7 +11495,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
             query="only screen and (min-width: 48rem)"
           >
             <button
-              className="c55 c11 c12"
+              className="c53 c11 c12"
               disabled={true}
               href=""
               icon={true}
@@ -11515,6 +11505,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
               <svg
                 className=""
                 height="12"
+                innerRef={undefined}
                 style={
                   Object {
                     "transform": "rotate(0deg)",
@@ -11558,6 +11549,38 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
 `;
 
 exports[`renders <List loading /> without throwing 1`] = `
+.c12 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  text-transform: none;
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  min-width: 7.5rem;
+}
+
+.c12::-moz-focus-inner,
+.c12[type='button']::-moz-focus-inner,
+.c12[type='reset']::-moz-focus-inner,
+.c12[type='submit']::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+.c12:-moz-focusring,
+.c12[type='button']:-moz-focusring,
+.c12[type='reset']:-moz-focusring,
+.c12[type='submit']:-moz-focusring {
+  outline: 0.0625rem dotted ButtonText;
+}
+
+.c12 + button {
+  margin-left: 0.375rem;
+}
+
 .c14 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
@@ -11583,34 +11606,6 @@ exports[`renders <List loading /> without throwing 1`] = `
   animation-delay: 1s;
 }
 
-.c13 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-content: center;
-  -ms-flex-line-pack: center;
-  align-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 1.25rem;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-}
-
 .c17 {
   color: rgba(73,73,73,1);
   line-height: 1.5rem;
@@ -11640,36 +11635,32 @@ exports[`renders <List loading /> without throwing 1`] = `
   padding-bottom: 2.25rem;
 }
 
-.c12 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  text-transform: none;
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  min-width: 7.5rem;
-}
-
-.c12::-moz-focus-inner,
-.c12[type='button']::-moz-focus-inner,
-.c12[type='reset']::-moz-focus-inner,
-.c12[type='submit']::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-
-.c12:-moz-focusring,
-.c12[type='button']:-moz-focusring,
-.c12[type='reset']:-moz-focusring,
-.c12[type='submit']:-moz-focusring {
-  outline: 0.0625rem dotted ButtonText;
-}
-
-.c12 + button {
-  margin-left: 0.375rem;
+.c13 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-content: center;
+  -ms-flex-line-pack: center;
+  align-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 1.25rem;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
 }
 
 .c11 {
@@ -11782,6 +11773,28 @@ exports[`renders <List loading /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c6 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
 .c2 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -11801,40 +11814,6 @@ exports[`renders <List loading /> without throwing 1`] = `
   margin-left: -0.5rem;
 }
 
-.c4 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c8 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.5rem;
-  padding-left: 0.5rem;
-}
-
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
-.c1 {
-  background-color: rgb(216,216,216);
-  margin: 0;
-  background-color: transparent;
-  height: 1.875rem;
-}
-
 .c3 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -11857,6 +11836,31 @@ exports[`renders <List loading /> without throwing 1`] = `
   flex: 1 1 auto;
 }
 
+.c4 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c8 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+
+.c1 {
+  background-color: rgb(216,216,216);
+  margin: 0;
+  background-color: transparent;
+  height: 1.875rem;
+}
+
 .c5 {
   display: inline-block;
   margin: 0;
@@ -11967,59 +11971,6 @@ exports[`renders <List loading /> without throwing 1`] = `
   outline: 0;
 }
 
-.c6 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-@media only screen and (min-width:0em) {
-  .c4 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c4 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c8 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c8 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
 @media only screen and (min-width:48em) {
   .c0 {
     width: 46rem;
@@ -12045,6 +11996,46 @@ exports[`renders <List loading /> without throwing 1`] = `
   }
 }
 
+@media only screen and (min-width:0em) {
+  .c4 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c4 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c8 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c8 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
 <div
   className="c0"
 >
@@ -12062,7 +12053,7 @@ exports[`renders <List loading /> without throwing 1`] = `
         className="c4"
       >
         <div
-          className="c5"
+          className="baseline-jVaZNU kXgQxt c5"
           name="filter"
           role="group"
           style={undefined}
@@ -12085,7 +12076,7 @@ exports[`renders <List loading /> without throwing 1`] = `
         className="c8"
       >
         <div
-          className="c9"
+          className="baseline-jVaZNU kXgQxt c9"
           role="group"
           style={undefined}
         >
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/metadata.spec.js.snap b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/metadata.spec.js.snap
index d198699f..7051137e 100644
--- a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/metadata.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/metadata.spec.js.snap
@@ -125,6 +125,50 @@ exports[`renders <Metadata /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c4 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
+.c1 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
 .c12 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -162,15 +206,6 @@ exports[`renders <Metadata /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
 .c16 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -212,28 +247,6 @@ exports[`renders <Metadata /> without throwing 1`] = `
   height: 1.5rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
 .c3 {
   display: inline-block;
   margin: 0;
@@ -329,59 +342,6 @@ exports[`renders <Metadata /> without throwing 1`] = `
   outline: 0;
 }
 
-.c4 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-@media only screen and (min-width:0em) {
-  .c2 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c2 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c6 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c6 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
 @media only screen and (min-width:48em) {
   .c0 {
     width: 46rem;
@@ -407,6 +367,46 @@ exports[`renders <Metadata /> without throwing 1`] = `
   }
 }
 
+@media only screen and (min-width:0em) {
+  .c2 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c2 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c6 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c6 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
 <div
   className="c0"
 >
@@ -420,7 +420,7 @@ exports[`renders <Metadata /> without throwing 1`] = `
         className="c2"
       >
         <div
-          className="c3"
+          className="baseline-jVaZNU kXgQxt c3"
           name="filter"
           role="group"
           style={undefined}
@@ -443,7 +443,7 @@ exports[`renders <Metadata /> without throwing 1`] = `
         className="c6"
       >
         <div
-          className="c7"
+          className="baseline-jVaZNU kXgQxt c7"
           role="group"
           style={undefined}
         >
@@ -540,6 +540,18 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c27 {
+  position: relative;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  width: 100%;
+}
+
 .c9 {
   display: inline-block;
 }
@@ -931,6 +943,63 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c4 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c25 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
+.c1 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
 .c12 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -1005,15 +1074,6 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
 .c36 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -1090,28 +1150,6 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   height: 0.8125rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
 .c15 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -1135,50 +1173,6 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c21 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c21 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c21 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c16 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -1277,6 +1271,50 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   color: inherit;
 }
 
+.c21 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c21 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c21 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
 .c3 {
   display: inline-block;
   margin: 0;
@@ -1499,44 +1537,6 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   outline: 0;
 }
 
-.c27 {
-  position: relative;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  width: 100%;
-}
-
-.c4 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c25 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c17 {
   word-wrap: break-word;
   overflow-wrap: break-word;
@@ -1544,6 +1544,31 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   box-sizing: border-box;
 }
 
+@media only screen and (min-width:48em) {
+  .c0 {
+    width: 46rem;
+  }
+}
+
+@media only screen and (min-width:64em) {
+  .c0 {
+    width: 61rem;
+  }
+}
+
+@media only screen and (min-width:75em) {
+  .c0 {
+    width: 76rem;
+  }
+}
+
+@media only screen and (max-width:47.9375rem) {
+  .c0 {
+    padding-left: 0.375rem;
+    padding-right: 0.375rem;
+  }
+}
+
 @media only screen and (min-width:0em) {
   .c29 {
     -webkit-align-items: center;
@@ -1618,31 +1643,6 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   }
 }
 
-@media only screen and (min-width:48em) {
-  .c0 {
-    width: 46rem;
-  }
-}
-
-@media only screen and (min-width:64em) {
-  .c0 {
-    width: 61rem;
-  }
-}
-
-@media only screen and (min-width:75em) {
-  .c0 {
-    width: 76rem;
-  }
-}
-
-@media only screen and (max-width:47.9375rem) {
-  .c0 {
-    padding-left: 0.375rem;
-    padding-right: 0.375rem;
-  }
-}
-
 <div
   className="c0"
 >
@@ -1656,7 +1656,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
         className="c2"
       >
         <div
-          className="c3"
+          className="baseline-jVaZNU kXgQxt c3"
           name="filter"
           role="group"
           style={undefined}
@@ -1679,7 +1679,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
         className="c6"
       >
         <div
-          className="c7"
+          className="baseline-jVaZNU kXgQxt c7"
           role="group"
           style={undefined}
         >
@@ -1759,7 +1759,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
               className="c23"
             >
               <div
-                className="c3"
+                className="baseline-jVaZNU kXgQxt c3"
                 name="name"
                 role="group"
                 style={undefined}
@@ -1793,7 +1793,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
               className="c23"
             >
               <div
-                className="c3"
+                className="baseline-jVaZNU kXgQxt c3"
                 name="value"
                 role="group"
                 style={undefined}
@@ -1862,6 +1862,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
                 <svg
                   className=""
                   height="12"
+                  innerRef={undefined}
                   style={
                     Object {
                       "transform": "rotate(0deg)",
@@ -1925,26 +1926,6 @@ exports[`renders <Metadata error /> without throwing 1`] = `
   margin-bottom: 2rem;
 }
 
-.c19 {
-  color: rgba(73,73,73,1);
-  line-height: 1.5rem;
-  font-size: 0.9375rem;
-  margin: 0;
-}
-
-.c19 + p,
-.c19 + small,
-.c19 + h1,
-.c19 + h2,
-.c19 + label,
-.c19 + h3,
-.c19 + h4,
-.c19 + h5,
-.c19 + div,
-.c19 + span {
-  padding-bottom: 2.25rem;
-}
-
 .c10 {
   font-family: sans-serif;
   font-size: 100%;
@@ -1977,6 +1958,26 @@ exports[`renders <Metadata error /> without throwing 1`] = `
   margin-left: 0.375rem;
 }
 
+.c19 {
+  color: rgba(73,73,73,1);
+  line-height: 1.5rem;
+  font-size: 0.9375rem;
+  margin: 0;
+}
+
+.c19 + p,
+.c19 + small,
+.c19 + h1,
+.c19 + h2,
+.c19 + label,
+.c19 + h3,
+.c19 + h4,
+.c19 + h5,
+.c19 + div,
+.c19 + span {
+  padding-bottom: 2.25rem;
+}
+
 .c9 {
   display: inline-block;
 }
@@ -2065,6 +2066,50 @@ exports[`renders <Metadata error /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c4 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
+.c1 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
 .c12 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -2102,15 +2147,6 @@ exports[`renders <Metadata error /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
 .c22 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -2173,28 +2209,6 @@ exports[`renders <Metadata error /> without throwing 1`] = `
   height: 1.5rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
 .c3 {
   display: inline-block;
   margin: 0;
@@ -2290,19 +2304,6 @@ exports[`renders <Metadata error /> without throwing 1`] = `
   outline: 0;
 }
 
-.c4 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 .c15 {
   position: relative;
   margin-bottom: 0.75rem;
@@ -2334,46 +2335,6 @@ exports[`renders <Metadata error /> without throwing 1`] = `
   margin: 0;
 }
 
-@media only screen and (min-width:0em) {
-  .c2 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c2 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c6 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c6 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
 @media only screen and (min-width:48em) {
   .c0 {
     width: 46rem;
@@ -2399,6 +2360,46 @@ exports[`renders <Metadata error /> without throwing 1`] = `
   }
 }
 
+@media only screen and (min-width:0em) {
+  .c2 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c2 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c6 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c6 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
 <div
   className="c0"
 >
@@ -2412,7 +2413,7 @@ exports[`renders <Metadata error /> without throwing 1`] = `
         className="c2"
       >
         <div
-          className="c3"
+          className="baseline-jVaZNU kXgQxt c3"
           name="filter"
           role="group"
           style={undefined}
@@ -2435,7 +2436,7 @@ exports[`renders <Metadata error /> without throwing 1`] = `
         className="c6"
       >
         <div
-          className="c7"
+          className="baseline-jVaZNU kXgQxt c7"
           role="group"
           style={undefined}
         >
@@ -2494,6 +2495,7 @@ exports[`renders <Metadata error /> without throwing 1`] = `
     <svg
       className="c20 "
       height="12"
+      innerRef={undefined}
       onClick={[Function]}
       style={
         Object {
@@ -2526,6 +2528,38 @@ exports[`renders <Metadata error /> without throwing 1`] = `
 `;
 
 exports[`renders <Metadata loading /> without throwing 1`] = `
+.c10 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  text-transform: none;
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  min-width: 7.5rem;
+}
+
+.c10::-moz-focus-inner,
+.c10[type='button']::-moz-focus-inner,
+.c10[type='reset']::-moz-focus-inner,
+.c10[type='submit']::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+.c10:-moz-focusring,
+.c10[type='button']:-moz-focusring,
+.c10[type='reset']:-moz-focusring,
+.c10[type='submit']:-moz-focusring {
+  outline: 0.0625rem dotted ButtonText;
+}
+
+.c10 + button {
+  margin-left: 0.375rem;
+}
+
 .c14 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
@@ -2551,34 +2585,6 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
   animation-delay: 1s;
 }
 
-.c13 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-content: center;
-  -ms-flex-line-pack: center;
-  align-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 1.25rem;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-}
-
 .c17 {
   color: rgba(73,73,73,1);
   line-height: 1.5rem;
@@ -2608,36 +2614,32 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
   padding-bottom: 2.25rem;
 }
 
-.c10 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  text-transform: none;
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  min-width: 7.5rem;
-}
-
-.c10::-moz-focus-inner,
-.c10[type='button']::-moz-focus-inner,
-.c10[type='reset']::-moz-focus-inner,
-.c10[type='submit']::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-
-.c10:-moz-focusring,
-.c10[type='button']:-moz-focusring,
-.c10[type='reset']:-moz-focusring,
-.c10[type='submit']:-moz-focusring {
-  outline: 0.0625rem dotted ButtonText;
-}
-
-.c10 + button {
-  margin-left: 0.375rem;
+.c13 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-content: center;
+  -ms-flex-line-pack: center;
+  align-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 1.25rem;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
 }
 
 .c9 {
@@ -2750,6 +2752,50 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c4 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
+.c1 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
 .c12 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -2787,15 +2833,6 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
 .c11 {
   background-color: rgb(216,216,216);
   margin: 0;
@@ -2803,28 +2840,6 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
   height: 0.6875rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
 .c3 {
   display: inline-block;
   margin: 0;
@@ -2935,59 +2950,6 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
   outline: 0;
 }
 
-.c4 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-@media only screen and (min-width:0em) {
-  .c2 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c2 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c6 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c6 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
 @media only screen and (min-width:48em) {
   .c0 {
     width: 46rem;
@@ -3013,6 +2975,46 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
   }
 }
 
+@media only screen and (min-width:0em) {
+  .c2 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c2 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c6 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c6 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
 <div
   className="c0"
 >
@@ -3026,7 +3028,7 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
         className="c2"
       >
         <div
-          className="c3"
+          className="baseline-jVaZNU kXgQxt c3"
           name="filter"
           role="group"
           style={undefined}
@@ -3049,7 +3051,7 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
         className="c6"
       >
         <div
-          className="c7"
+          className="baseline-jVaZNU kXgQxt c7"
           role="group"
           style={undefined}
         >
@@ -3129,6 +3131,50 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   padding: 1rem;
 }
 
+.c10 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  text-transform: none;
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  min-width: 7.5rem;
+}
+
+.c10::-moz-focus-inner,
+.c10[type='button']::-moz-focus-inner,
+.c10[type='reset']::-moz-focus-inner,
+.c10[type='submit']::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+.c10:-moz-focusring,
+.c10[type='button']:-moz-focusring,
+.c10[type='reset']:-moz-focusring,
+.c10[type='submit']:-moz-focusring {
+  outline: 0.0625rem dotted ButtonText;
+}
+
+.c10 + button {
+  margin-left: 0.375rem;
+}
+
+.c29 {
+  position: relative;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  width: 100%;
+}
+
 .c40 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
@@ -3182,38 +3228,6 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   flex: 1 0 auto;
 }
 
-.c10 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  text-transform: none;
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  min-width: 7.5rem;
-}
-
-.c10::-moz-focus-inner,
-.c10[type='button']::-moz-focus-inner,
-.c10[type='reset']::-moz-focus-inner,
-.c10[type='submit']::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-
-.c10:-moz-focusring,
-.c10[type='button']:-moz-focusring,
-.c10[type='reset']:-moz-focusring,
-.c10[type='submit']:-moz-focusring {
-  outline: 0.0625rem dotted ButtonText;
-}
-
-.c10 + button {
-  margin-left: 0.375rem;
-}
-
 .c9 {
   display: inline-block;
 }
@@ -3753,6 +3767,63 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c4 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c27 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
+.c1 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
 .c12 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -3836,15 +3907,6 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
 .c16 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -3900,28 +3962,6 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   height: 0.8125rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
 .c17 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -4311,44 +4351,6 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   outline: 0;
 }
 
-.c29 {
-  position: relative;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  width: 100%;
-}
-
-.c4 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c27 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
-}
-
 .c22 {
   word-break: break-all;
   line-height: 1.5;
@@ -4365,6 +4367,31 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   box-sizing: border-box;
 }
 
+@media only screen and (min-width:48em) {
+  .c0 {
+    width: 46rem;
+  }
+}
+
+@media only screen and (min-width:64em) {
+  .c0 {
+    width: 61rem;
+  }
+}
+
+@media only screen and (min-width:75em) {
+  .c0 {
+    width: 76rem;
+  }
+}
+
+@media only screen and (max-width:47.9375rem) {
+  .c0 {
+    padding-left: 0.375rem;
+    padding-right: 0.375rem;
+  }
+}
+
 @media only screen and (min-width:0em) {
   .c31 {
     -webkit-align-items: center;
@@ -4453,31 +4480,6 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   }
 }
 
-@media only screen and (min-width:48em) {
-  .c0 {
-    width: 46rem;
-  }
-}
-
-@media only screen and (min-width:64em) {
-  .c0 {
-    width: 61rem;
-  }
-}
-
-@media only screen and (min-width:75em) {
-  .c0 {
-    width: 76rem;
-  }
-}
-
-@media only screen and (max-width:47.9375rem) {
-  .c0 {
-    padding-left: 0.375rem;
-    padding-right: 0.375rem;
-  }
-}
-
 <div
   className="c0"
 >
@@ -4491,7 +4493,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
         className="c2"
       >
         <div
-          className="c3"
+          className="baseline-jVaZNU kXgQxt c3"
           name="filter"
           role="group"
           style={undefined}
@@ -4514,7 +4516,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
         className="c6"
       >
         <div
-          className="c7"
+          className="baseline-jVaZNU kXgQxt c7"
           role="group"
           style={undefined}
         >
@@ -4603,7 +4605,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
               className="c25"
             >
               <div
-                className="c3"
+                className="baseline-jVaZNU kXgQxt c3"
                 name="name"
                 role="group"
                 style={undefined}
@@ -4637,7 +4639,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
               className="c25"
             >
               <div
-                className="c3"
+                className="baseline-jVaZNU kXgQxt c3"
                 name="value"
                 role="group"
                 style={undefined}
@@ -4706,6 +4708,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                 <svg
                   className=""
                   height="12"
+                  innerRef={undefined}
                   style={
                     Object {
                       "transform": "rotate(0deg)",
@@ -4792,7 +4795,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
               className="c25"
             >
               <div
-                className="c3"
+                className="baseline-jVaZNU kXgQxt c3"
                 name="name"
                 role="group"
                 style={undefined}
@@ -4826,7 +4829,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
               className="c25"
             >
               <div
-                className="c3"
+                className="baseline-jVaZNU kXgQxt c3"
                 name="value"
                 role="group"
                 style={undefined}
@@ -4895,6 +4898,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
                 <svg
                   className=""
                   height="12"
+                  innerRef={undefined}
                   style={
                     Object {
                       "transform": "rotate(0deg)",
@@ -4981,7 +4985,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
               className="c25"
             >
               <div
-                className="c3"
+                className="baseline-jVaZNU kXgQxt c3"
                 name="name"
                 role="group"
                 style={undefined}
@@ -5015,7 +5019,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
               className="c25"
             >
               <div
-                className="c3"
+                className="baseline-jVaZNU kXgQxt c3"
                 name="value"
                 role="group"
                 style={undefined}
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/summary.spec.js.snap b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/summary.spec.js.snap
index dbd8ca36..0ea41dad 100644
--- a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/summary.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/summary.spec.js.snap
@@ -66,34 +66,6 @@ exports[`renders <Summary loading /> without throwing 1`] = `
   animation-delay: 1s;
 }
 
-.c1 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-content: center;
-  -ms-flex-line-pack: center;
-  align-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 1.25rem;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-}
-
 .c5 {
   color: rgba(73,73,73,1);
   line-height: 1.5rem;
@@ -123,6 +95,34 @@ exports[`renders <Summary loading /> without throwing 1`] = `
   padding-bottom: 2.25rem;
 }
 
+.c1 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-content: center;
+  -ms-flex-line-pack: center;
+  align-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 1.25rem;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+}
+
 .c0 {
   margin-right: auto;
   margin-left: auto;
@@ -352,6 +352,7 @@ exports[`renders <Summary loadingError /> without throwing 1`] = `
     <svg
       className="c6 "
       height="12"
+      innerRef={undefined}
       onClick={[Function]}
       style={
         Object {
@@ -505,6 +506,7 @@ exports[`renders <Summary mutationError /> without throwing 1`] = `
     <svg
       className="c6 "
       height="12"
+      innerRef={undefined}
       onClick={[Function]}
       style={
         Object {
@@ -566,7 +568,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 `;
 
 exports[`renders <Summary starting stopping rebooting removing /> without throwing 2`] = `
-.c20 {
+.c21 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -579,30 +581,38 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   min-width: 7.5rem;
 }
 
-.c20::-moz-focus-inner,
-.c20[type='button']::-moz-focus-inner,
-.c20[type='reset']::-moz-focus-inner,
-.c20[type='submit']::-moz-focus-inner {
+.c21::-moz-focus-inner,
+.c21[type='button']::-moz-focus-inner,
+.c21[type='reset']::-moz-focus-inner,
+.c21[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c20:-moz-focusring,
-.c20[type='button']:-moz-focusring,
-.c20[type='reset']:-moz-focusring,
-.c20[type='submit']:-moz-focusring {
+.c21:-moz-focusring,
+.c21[type='button']:-moz-focusring,
+.c21[type='reset']:-moz-focusring,
+.c21[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c20 + button {
+.c21 + button {
   margin-left: 0.375rem;
 }
 
-.c19 {
+.c13 {
+  margin-top: 0.0625rem;
+  margin-right: 0.375rem;
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 50%;
+}
+
+.c20 {
   display: inline-block;
 }
 
-.c18 {
+.c19 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -662,75 +672,75 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   align-items: center;
 }
 
-.c18:focus {
+.c19:focus {
   outline: 0;
   text-decoration: none;
   background-color: rgb(59,70,204);
   border-color: rgb(45,56,132);
 }
 
-.c18:hover {
+.c19:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
+.c19:active,
+.c19:active:hover,
+.c19:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c18[disabled] {
+.c19[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c18:focus {
+.c19:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c18:hover {
+.c19:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
+.c19:active,
+.c19:active:hover,
+.c19:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c18:focus {
+.c19:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c18:hover {
+.c19:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
+.c19:active,
+.c19:active:hover,
+.c19:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c18 svg + span {
+.c19 svg + span {
   margin-left: 0.75rem;
 }
 
-.c18 svg {
+.c19 svg {
   max-height: 1.125rem;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -788,129 +798,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   font-weight: 500;
 }
 
-.c21:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c21:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c21[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c21:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c21:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c21:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c21:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c21 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c21 svg {
-  max-height: 1.125rem;
-}
-
-.c22 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
 .c22:focus {
   outline: 0;
   text-decoration: none;
@@ -954,6 +841,23 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(216,216,216);
 }
 
+.c22:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c22:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
 .c22 svg + span {
   margin-left: 0.75rem;
 }
@@ -1004,6 +908,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -1012,7 +919,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
 }
 
 .c23:focus {
@@ -1066,7 +972,111 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   max-height: 1.125rem;
 }
 
-.c25 {
+.c24 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+}
+
+.c24:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c24:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c24[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c24:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c24:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c24 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c24 svg {
+  max-height: 1.125rem;
+}
+
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1126,132 +1136,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   float: right;
 }
 
-.c25:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c25:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c25[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c25:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c25:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c25:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-}
-
-.c25:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(210,67,58);
-}
-
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(210,67,58);
-}
-
-.c25 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c25 svg {
-  max-height: 1.125rem;
-}
-
-.c26 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  font-weight: 500;
-  float: right;
-}
-
 .c26:focus {
   outline: 0;
   text-decoration: none;
@@ -1320,6 +1204,132 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   max-height: 1.125rem;
 }
 
+.c27 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+  float: right;
+}
+
+.c27:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c27:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c27[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c27:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c27:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c27:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+}
+
+.c27:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(210,67,58);
+}
+
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(210,67,58);
+}
+
+.c27 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c27 svg {
+  max-height: 1.125rem;
+}
+
 .c11 {
   font-size: 0.9375rem;
   font-style: normal;
@@ -1329,6 +1339,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   text-align: left;
 }
 
+.c31 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
 .c1 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -1367,7 +1399,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-left: -0.5rem;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1404,7 +1436,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding-left: 0.5rem;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1413,7 +1445,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding-left: 0.5rem;
 }
 
-.c24 {
+.c25 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1422,7 +1454,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding-left: 0.5rem;
 }
 
-.c29 {
+.c30 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1431,15 +1463,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding-left: 0.5rem;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
 .c8 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -1461,23 +1484,18 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-top: 1.5rem;
 }
 
-.c28 {
+.c29 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c13 {
+.c14 {
   width: 0.375rem;
   height: 0.375rem;
   border-radius: 50%;
   background-color: rgb(0,152,88);
   display: inline-block;
-  margin-top: 0.0625rem;
-  margin-right: 0.375rem;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 50%;
 }
 
 .c3 {
@@ -1546,7 +1564,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0.4375rem;
 }
 
-.c32 {
+.c33 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -1569,68 +1587,55 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   outline: 0;
 }
 
-.c32::-webkit-input-placeholder {
+.c33::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32::-moz-placeholder {
+.c33::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:-ms-input-placeholder {
+.c33:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:invalid {
+.c33:invalid {
   box-shadow: none;
 }
 
-.c32:disabled {
+.c33:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c32:disabled::-webkit-input-placeholder {
+.c33:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:disabled::-moz-placeholder {
+.c33:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:disabled:-ms-input-placeholder {
+.c33:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:focus {
+.c33:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c30 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 .c9 {
   margin-top: 0.5rem;
   margin-bottom: 1rem;
 }
 
-.c14 {
+.c15 {
   margin-top: 0.25rem;
 }
 
-.c27 {
+.c28 {
   margin-top: 2rem;
   margin-bottom: 4rem;
 }
@@ -1639,7 +1644,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding: 2rem;
 }
 
-.c15 {
+.c16 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
@@ -1659,7 +1664,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   justify-content: flex-start;
 }
 
-.c31 {
+.c32 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -1671,16 +1676,16 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   align-items: center;
 }
 
-.c31 input {
+.c32 input {
   padding-right: 1.875rem;
 }
 
-.c31 div {
+.c32 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c34 {
+.c35 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -1693,11 +1698,11 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0rem;
 }
 
-.c34 input {
+.c35 input {
   padding-right: 1.875rem;
 }
 
-.c34 div {
+.c35 div {
   position: relative;
   left: -1.625rem;
 }
@@ -1716,10 +1721,35 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin: 0 1.125rem;
 }
 
-.c33 {
+.c34 {
   cursor: pointer;
 }
 
+@media only screen and (min-width:48em) {
+  .c0 {
+    width: 46rem;
+  }
+}
+
+@media only screen and (min-width:64em) {
+  .c0 {
+    width: 61rem;
+  }
+}
+
+@media only screen and (min-width:75em) {
+  .c0 {
+    width: 76rem;
+  }
+}
+
+@media only screen and (max-width:47.9375rem) {
+  .c0 {
+    padding-left: 0.375rem;
+    padding-right: 0.375rem;
+  }
+}
+
 @media only screen and (min-width:0em) {
   .c6 {
     -webkit-align-items: center;
@@ -1730,7 +1760,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -1779,7 +1809,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c17 {
+  .c18 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -1789,7 +1819,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c24 {
+  .c25 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -1799,7 +1829,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c29 {
+  .c30 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -1809,7 +1839,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:64em) {
-  .c29 {
+  .c30 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -1818,31 +1848,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   }
 }
 
-@media only screen and (min-width:48em) {
-  .c0 {
-    width: 46rem;
-  }
-}
-
-@media only screen and (min-width:64em) {
-  .c0 {
-    width: 61rem;
-  }
-}
-
-@media only screen and (min-width:75em) {
-  .c0 {
-    width: 76rem;
-  }
-}
-
-@media only screen and (max-width:47.9375rem) {
-  .c0 {
-    padding-left: 0.375rem;
-    padding-right: 0.375rem;
-  }
-}
-
 @media (max-width:47.9375rem) {
   .c10 {
     display: block;
@@ -1915,7 +1920,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   className="c10"
                 >
                   <span
-                    className="c13"
+                    className="c13 c14"
                     color="green"
                     height="0.6875rem"
                     width="0.6875rem"
@@ -1924,7 +1929,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 </div>
               </div>
               <div
-                className="c14"
+                className="c15"
               >
                 <div
                   className="c10"
@@ -1933,7 +1938,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     className="c10"
                   >
                     <label
-                      className="c15 c11"
+                      className="c16 c11"
                     >
                       Created: 
                     </label>
@@ -1952,7 +1957,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     className="c10"
                   >
                     <label
-                      className="c15 c11"
+                      className="c16 c11"
                     >
                       Updated: 
                     </label>
@@ -1968,17 +1973,17 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               </div>
             </div>
             <div
-              className="c16"
+              className="c17"
             >
               <div
-                className="c17"
+                className="c18"
               >
                 <span
                   name="react-responsive-mock"
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c18 c19 c20"
+                    className="c19 c20 c21"
                     disabled={true}
                     href=""
                     icon={true}
@@ -1988,6 +1993,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     <svg
                       className=""
                       height="15"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -2045,7 +2051,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c21 c19 c20"
+                    className="c22 c20 c21"
                     disabled={true}
                     href=""
                     icon={true}
@@ -2055,6 +2061,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     <svg
                       className=""
                       height="15"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -2115,7 +2122,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c22 c19 c20"
+                    className="c23 c20 c21"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2125,6 +2132,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     <svg
                       className=""
                       height="14"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -2178,7 +2186,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c23 c19 c20"
+                    className="c24 c20 c21"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2188,6 +2196,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     <svg
                       className=""
                       height="14"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -2244,7 +2253,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c22 c19 c20"
+                    className="c23 c20 c21"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2254,6 +2263,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     <svg
                       className=""
                       height="21"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -2291,7 +2301,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c23 c19 c20"
+                    className="c24 c20 c21"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2301,6 +2311,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     <svg
                       className=""
                       height="21"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -2338,14 +2349,14 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 </span>
               </div>
               <div
-                className="c24"
+                className="c25"
               >
                 <span
                   name="react-responsive-mock"
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c25 c19 c20"
+                    className="c26 c20 c21"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2355,6 +2366,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     <svg
                       className=""
                       height="12"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -2392,7 +2404,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c26 c19 c20"
+                    className="c27 c20 c21"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2402,6 +2414,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     <svg
                       className=""
                       height="12"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -2440,10 +2453,10 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               </div>
             </div>
             <div
-              className="c27"
+              className="c28"
             >
               <div
-                className="c28 c1"
+                className="c29 c1"
                 height="0.0625rem"
               />
             </div>
@@ -2451,19 +2464,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c29"
+                className="c30"
               >
                 <label
-                  className="c30"
+                  className="c31"
                   htmlFor=""
                 >
                   Short ID
                 </label>
                 <div
-                  className="c31"
+                  className="c32"
                 >
                   <input
-                    className="c32"
+                    className="c33"
                     disabled={false}
                     id=""
                     value="2252839a"
@@ -2475,8 +2488,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c33 "
+                      className="c34 "
                       height="16"
+                      innerRef={undefined}
                       onClick={[Function]}
                       style={
                         Object {
@@ -2520,19 +2534,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c29"
+                className="c30"
               >
                 <label
-                  className="c30"
+                  className="c31"
                   htmlFor=""
                 >
                   ID
                 </label>
                 <div
-                  className="c31"
+                  className="c32"
                 >
                   <input
-                    className="c32"
+                    className="c33"
                     disabled={false}
                     id=""
                     value="2252839a-e698-ceec-afac-9549ad0c6624"
@@ -2544,8 +2558,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c33 "
+                      className="c34 "
                       height="16"
+                      innerRef={undefined}
                       onClick={[Function]}
                       style={
                         Object {
@@ -2589,19 +2604,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c29"
+                className="c30"
               >
                 <label
-                  className="c30"
+                  className="c31"
                   htmlFor=""
                 >
                   CN UUID
                 </label>
                 <div
-                  className="c31"
+                  className="c32"
                 >
                   <input
-                    className="c32"
+                    className="c33"
                     disabled={false}
                     id=""
                     value="70bb1cee-dba3-11e3-a799-002590e4f2b0"
@@ -2613,8 +2628,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c33 "
+                      className="c34 "
                       height="16"
+                      innerRef={undefined}
                       onClick={[Function]}
                       style={
                         Object {
@@ -2658,19 +2674,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c29"
+                className="c30"
               >
                 <label
-                  className="c30"
+                  className="c31"
                   htmlFor=""
                 >
                   Image UUID
                 </label>
                 <div
-                  className="c31"
+                  className="c32"
                 >
                   <input
-                    className="c32"
+                    className="c33"
                     disabled={false}
                     id=""
                     value="19aa3328-0025-11e7-a19a-c39077bfd4cf"
@@ -2682,8 +2698,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c33 "
+                      className="c34 "
                       height="16"
+                      innerRef={undefined}
                       onClick={[Function]}
                       style={
                         Object {
@@ -2727,19 +2744,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c29"
+                className="c30"
               >
                 <label
-                  className="c30"
+                  className="c31"
                   htmlFor=""
                 >
                   Login
                 </label>
                 <div
-                  className="c31"
+                  className="c32"
                 >
                   <input
-                    className="c32"
+                    className="c33"
                     disabled={false}
                     id=""
                     value="ssh root@72.2.119.146"
@@ -2751,8 +2768,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c33 "
+                      className="c34 "
                       height="16"
+                      innerRef={undefined}
                       onClick={[Function]}
                       style={
                         Object {
@@ -2796,19 +2814,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c29"
+                className="c30"
               >
                 <label
-                  className="c30"
+                  className="c31"
                   htmlFor=""
                 >
                   IP address 1
                 </label>
                 <div
-                  className="c31"
+                  className="c32"
                 >
                   <input
-                    className="c32"
+                    className="c33"
                     disabled={false}
                     id=""
                     value="72.2.119.146"
@@ -2820,8 +2838,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c33 "
+                      className="c34 "
                       height="16"
+                      innerRef={undefined}
                       onClick={[Function]}
                       style={
                         Object {
@@ -2865,19 +2884,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c29"
+                className="c30"
               >
                 <label
-                  className="c30"
+                  className="c31"
                   htmlFor=""
                 >
                   IP address 2
                 </label>
                 <div
-                  className="c34"
+                  className="c35"
                 >
                   <input
-                    className="c32"
+                    className="c33"
                     disabled={false}
                     id=""
                     value="10.112.5.63"
@@ -2889,8 +2908,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c33 "
+                      className="c34 "
                       height="16"
+                      innerRef={undefined}
                       onClick={[Function]}
                       style={
                         Object {
@@ -2939,7 +2959,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 `;
 
 exports[`renders <Summary starting stopping rebooting removing /> without throwing 3`] = `
-.c20 {
+.c21 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -2952,30 +2972,38 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   min-width: 7.5rem;
 }
 
-.c20::-moz-focus-inner,
-.c20[type='button']::-moz-focus-inner,
-.c20[type='reset']::-moz-focus-inner,
-.c20[type='submit']::-moz-focus-inner {
+.c21::-moz-focus-inner,
+.c21[type='button']::-moz-focus-inner,
+.c21[type='reset']::-moz-focus-inner,
+.c21[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c20:-moz-focusring,
-.c20[type='button']:-moz-focusring,
-.c20[type='reset']:-moz-focusring,
-.c20[type='submit']:-moz-focusring {
+.c21:-moz-focusring,
+.c21[type='button']:-moz-focusring,
+.c21[type='reset']:-moz-focusring,
+.c21[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c20 + button {
+.c21 + button {
   margin-left: 0.375rem;
 }
 
-.c19 {
+.c13 {
+  margin-top: 0.0625rem;
+  margin-right: 0.375rem;
+  height: 0.6875rem;
+  width: 0.6875rem;
+  border-radius: 50%;
+}
+
+.c20 {
   display: inline-block;
 }
 
-.c18 {
+.c19 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3035,75 +3063,75 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   align-items: center;
 }
 
-.c18:focus {
+.c19:focus {
   outline: 0;
   text-decoration: none;
   background-color: rgb(59,70,204);
   border-color: rgb(45,56,132);
 }
 
-.c18:hover {
+.c19:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
+.c19:active,
+.c19:active:hover,
+.c19:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c18[disabled] {
+.c19[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c18:focus {
+.c19:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c18:hover {
+.c19:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
+.c19:active,
+.c19:active:hover,
+.c19:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c18:focus {
+.c19:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c18:hover {
+.c19:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
+.c19:active,
+.c19:active:hover,
+.c19:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c18 svg + span {
+.c19 svg + span {
   margin-left: 0.75rem;
 }
 
-.c18 svg {
+.c19 svg {
   max-height: 1.125rem;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3161,129 +3189,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   font-weight: 500;
 }
 
-.c21:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c21:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c21[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c21:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c21:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c21:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c21:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c21 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c21 svg {
-  max-height: 1.125rem;
-}
-
-.c22 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
 .c22:focus {
   outline: 0;
   text-decoration: none;
@@ -3327,6 +3232,23 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(216,216,216);
 }
 
+.c22:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c22:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
 .c22 svg + span {
   margin-left: 0.75rem;
 }
@@ -3377,6 +3299,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -3385,7 +3310,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  font-weight: 500;
 }
 
 .c23:focus {
@@ -3439,7 +3363,111 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   max-height: 1.125rem;
 }
 
-.c25 {
+.c24 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+}
+
+.c24:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c24:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c24[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c24:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c24:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c24 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c24 svg {
+  max-height: 1.125rem;
+}
+
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3499,132 +3527,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   float: right;
 }
 
-.c25:focus {
-  outline: 0;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c25:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c25[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c25:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c25:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c25:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-}
-
-.c25:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(210,67,58);
-}
-
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(210,67,58);
-}
-
-.c25 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c25 svg {
-  max-height: 1.125rem;
-}
-
-.c26 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-size: 0.9375rem;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  font-weight: 500;
-  float: right;
-}
-
 .c26:focus {
   outline: 0;
   text-decoration: none;
@@ -3693,6 +3595,132 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   max-height: 1.125rem;
 }
 
+.c27 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-size: 0.9375rem;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+  float: right;
+}
+
+.c27:focus {
+  outline: 0;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c27:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c27[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c27:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c27:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c27:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+}
+
+.c27:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(210,67,58);
+}
+
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(210,67,58);
+}
+
+.c27 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c27 svg {
+  max-height: 1.125rem;
+}
+
 .c11 {
   font-size: 0.9375rem;
   font-style: normal;
@@ -3702,6 +3730,28 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   text-align: left;
 }
 
+.c31 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
 .c1 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -3740,7 +3790,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-left: -0.5rem;
 }
 
-.c16 {
+.c17 {
   box-sizing: border-box;
   display: -webkit-box;
   display: -webkit-flex;
@@ -3777,7 +3827,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding-left: 0.5rem;
 }
 
-.c17 {
+.c18 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -3786,7 +3836,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding-left: 0.5rem;
 }
 
-.c24 {
+.c25 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -3795,7 +3845,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding-left: 0.5rem;
 }
 
-.c29 {
+.c30 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -3804,15 +3854,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding-left: 0.5rem;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
 .c8 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -3834,23 +3875,18 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-top: 1.5rem;
 }
 
-.c28 {
+.c29 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
 }
 
-.c13 {
+.c14 {
   width: 0.375rem;
   height: 0.375rem;
   border-radius: 50%;
   background-color: rgb(0,152,88);
   display: inline-block;
-  margin-top: 0.0625rem;
-  margin-right: 0.375rem;
-  height: 0.6875rem;
-  width: 0.6875rem;
-  border-radius: 50%;
 }
 
 .c3 {
@@ -3919,7 +3955,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0.4375rem;
 }
 
-.c32 {
+.c33 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -3942,68 +3978,55 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   outline: 0;
 }
 
-.c32::-webkit-input-placeholder {
+.c33::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32::-moz-placeholder {
+.c33::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:-ms-input-placeholder {
+.c33:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:invalid {
+.c33:invalid {
   box-shadow: none;
 }
 
-.c32:disabled {
+.c33:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c32:disabled::-webkit-input-placeholder {
+.c33:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:disabled::-moz-placeholder {
+.c33:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:disabled:-ms-input-placeholder {
+.c33:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:focus {
+.c33:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c30 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 .c9 {
   margin-top: 0.5rem;
   margin-bottom: 1rem;
 }
 
-.c14 {
+.c15 {
   margin-top: 0.25rem;
 }
 
-.c27 {
+.c28 {
   margin-top: 2rem;
   margin-bottom: 4rem;
 }
@@ -4012,7 +4035,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding: 2rem;
 }
 
-.c15 {
+.c16 {
   opacity: 0.5;
   padding-right: 0.1875rem;
 }
@@ -4032,7 +4055,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   justify-content: flex-start;
 }
 
-.c31 {
+.c32 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -4044,16 +4067,16 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   align-items: center;
 }
 
-.c31 input {
+.c32 input {
   padding-right: 1.875rem;
 }
 
-.c31 div {
+.c32 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c34 {
+.c35 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -4066,11 +4089,11 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0rem;
 }
 
-.c34 input {
+.c35 input {
   padding-right: 1.875rem;
 }
 
-.c34 div {
+.c35 div {
   position: relative;
   left: -1.625rem;
 }
@@ -4089,10 +4112,35 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin: 0 1.125rem;
 }
 
-.c33 {
+.c34 {
   cursor: pointer;
 }
 
+@media only screen and (min-width:48em) {
+  .c0 {
+    width: 46rem;
+  }
+}
+
+@media only screen and (min-width:64em) {
+  .c0 {
+    width: 61rem;
+  }
+}
+
+@media only screen and (min-width:75em) {
+  .c0 {
+    width: 76rem;
+  }
+}
+
+@media only screen and (max-width:47.9375rem) {
+  .c0 {
+    padding-left: 0.375rem;
+    padding-right: 0.375rem;
+  }
+}
+
 @media only screen and (min-width:0em) {
   .c6 {
     -webkit-align-items: center;
@@ -4103,7 +4151,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c16 {
+  .c17 {
     -webkit-box-pack: justify;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
@@ -4152,7 +4200,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c17 {
+  .c18 {
     -webkit-flex-basis: 75%;
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
@@ -4162,7 +4210,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c24 {
+  .c25 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -4172,7 +4220,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c29 {
+  .c30 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -4182,7 +4230,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:64em) {
-  .c29 {
+  .c30 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -4191,31 +4239,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   }
 }
 
-@media only screen and (min-width:48em) {
-  .c0 {
-    width: 46rem;
-  }
-}
-
-@media only screen and (min-width:64em) {
-  .c0 {
-    width: 61rem;
-  }
-}
-
-@media only screen and (min-width:75em) {
-  .c0 {
-    width: 76rem;
-  }
-}
-
-@media only screen and (max-width:47.9375rem) {
-  .c0 {
-    padding-left: 0.375rem;
-    padding-right: 0.375rem;
-  }
-}
-
 @media (max-width:47.9375rem) {
   .c10 {
     display: block;
@@ -4288,7 +4311,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   className="c10"
                 >
                   <span
-                    className="c13"
+                    className="c13 c14"
                     color="green"
                     height="0.6875rem"
                     width="0.6875rem"
@@ -4297,7 +4320,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 </div>
               </div>
               <div
-                className="c14"
+                className="c15"
               >
                 <div
                   className="c10"
@@ -4306,7 +4329,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     className="c10"
                   >
                     <label
-                      className="c15 c11"
+                      className="c16 c11"
                     >
                       Created: 
                     </label>
@@ -4325,7 +4348,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     className="c10"
                   >
                     <label
-                      className="c15 c11"
+                      className="c16 c11"
                     >
                       Updated: 
                     </label>
@@ -4341,17 +4364,17 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               </div>
             </div>
             <div
-              className="c16"
+              className="c17"
             >
               <div
-                className="c17"
+                className="c18"
               >
                 <span
                   name="react-responsive-mock"
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c18 c19 c20"
+                    className="c19 c20 c21"
                     disabled={true}
                     href=""
                     icon={true}
@@ -4361,6 +4384,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     <svg
                       className=""
                       height="15"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -4418,7 +4442,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c21 c19 c20"
+                    className="c22 c20 c21"
                     disabled={true}
                     href=""
                     icon={true}
@@ -4428,6 +4452,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     <svg
                       className=""
                       height="15"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -4488,7 +4513,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c22 c19 c20"
+                    className="c23 c20 c21"
                     disabled={false}
                     href=""
                     icon={true}
@@ -4498,6 +4523,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     <svg
                       className=""
                       height="14"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -4551,7 +4577,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c23 c19 c20"
+                    className="c24 c20 c21"
                     disabled={false}
                     href=""
                     icon={true}
@@ -4561,6 +4587,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     <svg
                       className=""
                       height="14"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -4617,7 +4644,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c22 c19 c20"
+                    className="c23 c20 c21"
                     disabled={false}
                     href=""
                     icon={true}
@@ -4627,6 +4654,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     <svg
                       className=""
                       height="21"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -4664,7 +4692,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c23 c19 c20"
+                    className="c24 c20 c21"
                     disabled={false}
                     href=""
                     icon={true}
@@ -4674,6 +4702,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     <svg
                       className=""
                       height="21"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -4711,14 +4740,14 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 </span>
               </div>
               <div
-                className="c24"
+                className="c25"
               >
                 <span
                   name="react-responsive-mock"
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c25 c19 c20"
+                    className="c26 c20 c21"
                     disabled={false}
                     href=""
                     icon={true}
@@ -4728,6 +4757,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     <svg
                       className=""
                       height="12"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -4765,7 +4795,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c26 c19 c20"
+                    className="c27 c20 c21"
                     disabled={false}
                     href=""
                     icon={true}
@@ -4775,6 +4805,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     <svg
                       className=""
                       height="12"
+                      innerRef={undefined}
                       style={
                         Object {
                           "transform": "rotate(0deg)",
@@ -4813,10 +4844,10 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               </div>
             </div>
             <div
-              className="c27"
+              className="c28"
             >
               <div
-                className="c28 c1"
+                className="c29 c1"
                 height="0.0625rem"
               />
             </div>
@@ -4824,19 +4855,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c29"
+                className="c30"
               >
                 <label
-                  className="c30"
+                  className="c31"
                   htmlFor=""
                 >
                   Short ID
                 </label>
                 <div
-                  className="c31"
+                  className="c32"
                 >
                   <input
-                    className="c32"
+                    className="c33"
                     disabled={false}
                     id=""
                     value="2252839a"
@@ -4848,8 +4879,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c33 "
+                      className="c34 "
                       height="16"
+                      innerRef={undefined}
                       onClick={[Function]}
                       style={
                         Object {
@@ -4893,19 +4925,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c29"
+                className="c30"
               >
                 <label
-                  className="c30"
+                  className="c31"
                   htmlFor=""
                 >
                   ID
                 </label>
                 <div
-                  className="c31"
+                  className="c32"
                 >
                   <input
-                    className="c32"
+                    className="c33"
                     disabled={false}
                     id=""
                     value="2252839a-e698-ceec-afac-9549ad0c6624"
@@ -4917,8 +4949,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c33 "
+                      className="c34 "
                       height="16"
+                      innerRef={undefined}
                       onClick={[Function]}
                       style={
                         Object {
@@ -4962,19 +4995,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c29"
+                className="c30"
               >
                 <label
-                  className="c30"
+                  className="c31"
                   htmlFor=""
                 >
                   CN UUID
                 </label>
                 <div
-                  className="c31"
+                  className="c32"
                 >
                   <input
-                    className="c32"
+                    className="c33"
                     disabled={false}
                     id=""
                     value="70bb1cee-dba3-11e3-a799-002590e4f2b0"
@@ -4986,8 +5019,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c33 "
+                      className="c34 "
                       height="16"
+                      innerRef={undefined}
                       onClick={[Function]}
                       style={
                         Object {
@@ -5031,19 +5065,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c29"
+                className="c30"
               >
                 <label
-                  className="c30"
+                  className="c31"
                   htmlFor=""
                 >
                   Image UUID
                 </label>
                 <div
-                  className="c31"
+                  className="c32"
                 >
                   <input
-                    className="c32"
+                    className="c33"
                     disabled={false}
                     id=""
                     value="19aa3328-0025-11e7-a19a-c39077bfd4cf"
@@ -5055,8 +5089,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c33 "
+                      className="c34 "
                       height="16"
+                      innerRef={undefined}
                       onClick={[Function]}
                       style={
                         Object {
@@ -5100,19 +5135,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c29"
+                className="c30"
               >
                 <label
-                  className="c30"
+                  className="c31"
                   htmlFor=""
                 >
                   Login
                 </label>
                 <div
-                  className="c31"
+                  className="c32"
                 >
                   <input
-                    className="c32"
+                    className="c33"
                     disabled={false}
                     id=""
                     value="ssh root@72.2.119.146"
@@ -5124,8 +5159,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c33 "
+                      className="c34 "
                       height="16"
+                      innerRef={undefined}
                       onClick={[Function]}
                       style={
                         Object {
@@ -5169,19 +5205,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c29"
+                className="c30"
               >
                 <label
-                  className="c30"
+                  className="c31"
                   htmlFor=""
                 >
                   IP address 1
                 </label>
                 <div
-                  className="c31"
+                  className="c32"
                 >
                   <input
-                    className="c32"
+                    className="c33"
                     disabled={false}
                     id=""
                     value="72.2.119.146"
@@ -5193,8 +5229,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c33 "
+                      className="c34 "
                       height="16"
+                      innerRef={undefined}
                       onClick={[Function]}
                       style={
                         Object {
@@ -5238,19 +5275,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c29"
+                className="c30"
               >
                 <label
-                  className="c30"
+                  className="c31"
                   htmlFor=""
                 >
                   IP address 2
                 </label>
                 <div
-                  className="c34"
+                  className="c35"
                 >
                   <input
-                    className="c32"
+                    className="c33"
                     disabled={false}
                     id=""
                     value="10.112.5.63"
@@ -5262,8 +5299,9 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c33 "
+                      className="c34 "
                       height="16"
+                      innerRef={undefined}
                       onClick={[Function]}
                       style={
                         Object {
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/tags.spec.js.snap b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/tags.spec.js.snap
index 296fd231..3a78be90 100644
--- a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/tags.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/tags.spec.js.snap
@@ -125,6 +125,50 @@ exports[`renders <Tags /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c4 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
+.c1 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
 .c12 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -162,15 +206,6 @@ exports[`renders <Tags /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
 .c16 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -212,28 +247,6 @@ exports[`renders <Tags /> without throwing 1`] = `
   height: 1.5rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
 .c3 {
   display: inline-block;
   margin: 0;
@@ -329,19 +342,6 @@ exports[`renders <Tags /> without throwing 1`] = `
   outline: 0;
 }
 
-.c4 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 .c17 {
   margin: 0;
   padding: 0;
@@ -355,46 +355,6 @@ exports[`renders <Tags /> without throwing 1`] = `
   flex-wrap: wrap;
 }
 
-@media only screen and (min-width:0em) {
-  .c2 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c2 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c6 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c6 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
 @media only screen and (min-width:48em) {
   .c0 {
     width: 46rem;
@@ -420,6 +380,46 @@ exports[`renders <Tags /> without throwing 1`] = `
   }
 }
 
+@media only screen and (min-width:0em) {
+  .c2 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c2 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c6 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c6 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
 <div
   className="c0"
 >
@@ -433,7 +433,7 @@ exports[`renders <Tags /> without throwing 1`] = `
         className="c2"
       >
         <div
-          className="c3"
+          className="baseline-jVaZNU kXgQxt c3"
           name="filter"
           role="group"
           style={undefined}
@@ -456,7 +456,7 @@ exports[`renders <Tags /> without throwing 1`] = `
         className="c6"
       >
         <div
-          className="c7"
+          className="baseline-jVaZNU kXgQxt c7"
           role="group"
           style={undefined}
         >
@@ -947,6 +947,63 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c4 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c26 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
+.c1 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
 .c12 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -1021,15 +1078,6 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
 .c36 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -1099,28 +1147,6 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   height: 0.8125rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
 .c15 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -1144,50 +1170,6 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
 }
 
-.c21 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c21 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c21 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
 .c16 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -1286,6 +1268,50 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   color: inherit;
 }
 
+.c21 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c21 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c21 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
 .c3 {
   display: inline-block;
   margin: 0;
@@ -1444,30 +1470,42 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   outline: 0;
 }
 
-.c4 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
+.c24 {
+  -webkit-order: 0;
+  -ms-flex-order: 0;
+  order: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 1;
+  -ms-flex-negative: 1;
+  flex-shrink: 1;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
 }
 
-.c26 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
+.c27 {
+  -webkit-order: 0;
+  -ms-flex-order: 0;
+  order: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 1;
+  -ms-flex-negative: 1;
+  flex-shrink: 1;
+  -webkit-flex-basis: 0.75rem;
+  -ms-flex-preferred-size: 0.75rem;
+  flex-basis: 0.75rem;
 }
 
 .c37 {
@@ -1510,44 +1548,6 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   align-content: stretch;
 }
 
-.c24 {
-  -webkit-order: 0;
-  -ms-flex-order: 0;
-  order: 0;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-box-flex: 0;
-  -webkit-flex-grow: 0;
-  -ms-flex-positive: 0;
-  flex-grow: 0;
-  -webkit-flex-shrink: 1;
-  -ms-flex-negative: 1;
-  flex-shrink: 1;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-}
-
-.c27 {
-  -webkit-order: 0;
-  -ms-flex-order: 0;
-  order: 0;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-box-flex: 0;
-  -webkit-flex-grow: 0;
-  -ms-flex-positive: 0;
-  flex-grow: 0;
-  -webkit-flex-shrink: 1;
-  -ms-flex-negative: 1;
-  flex-shrink: 1;
-  -webkit-flex-basis: 0.75rem;
-  -ms-flex-preferred-size: 0.75rem;
-  flex-basis: 0.75rem;
-}
-
 .c17 {
   word-wrap: break-word;
   overflow-wrap: break-word;
@@ -1555,6 +1555,31 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   box-sizing: border-box;
 }
 
+@media only screen and (min-width:48em) {
+  .c0 {
+    width: 46rem;
+  }
+}
+
+@media only screen and (min-width:64em) {
+  .c0 {
+    width: 61rem;
+  }
+}
+
+@media only screen and (min-width:75em) {
+  .c0 {
+    width: 76rem;
+  }
+}
+
+@media only screen and (max-width:47.9375rem) {
+  .c0 {
+    padding-left: 0.375rem;
+    padding-right: 0.375rem;
+  }
+}
+
 @media only screen and (min-width:0em) {
   .c28 {
     -webkit-align-items: center;
@@ -1629,31 +1654,6 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   }
 }
 
-@media only screen and (min-width:48em) {
-  .c0 {
-    width: 46rem;
-  }
-}
-
-@media only screen and (min-width:64em) {
-  .c0 {
-    width: 61rem;
-  }
-}
-
-@media only screen and (min-width:75em) {
-  .c0 {
-    width: 76rem;
-  }
-}
-
-@media only screen and (max-width:47.9375rem) {
-  .c0 {
-    padding-left: 0.375rem;
-    padding-right: 0.375rem;
-  }
-}
-
 <div
   className="c0"
 >
@@ -1667,7 +1667,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
         className="c2"
       >
         <div
-          className="c3"
+          className="baseline-jVaZNU kXgQxt c3"
           name="filter"
           role="group"
           style={undefined}
@@ -1690,7 +1690,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
         className="c6"
       >
         <div
-          className="c7"
+          className="baseline-jVaZNU kXgQxt c7"
           role="group"
           style={undefined}
         >
@@ -1770,7 +1770,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
               className="c24"
             >
               <div
-                className="c3"
+                className="baseline-jVaZNU kXgQxt c3"
                 name="name"
                 role="group"
                 style={undefined}
@@ -1799,7 +1799,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
               className="c24"
             >
               <div
-                className="c3"
+                className="baseline-jVaZNU kXgQxt c3"
                 name="value"
                 role="group"
                 style={undefined}
@@ -1864,6 +1864,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
                 <svg
                   className=""
                   height="12"
+                  innerRef={undefined}
                   style={
                     Object {
                       "transform": "rotate(0deg)",
@@ -2050,6 +2051,50 @@ exports[`renders <Tags editable /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c4 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
+.c1 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
 .c12 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -2087,15 +2132,6 @@ exports[`renders <Tags editable /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
 .c16 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -2137,28 +2173,6 @@ exports[`renders <Tags editable /> without throwing 1`] = `
   height: 1.5rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
 .c3 {
   display: inline-block;
   margin: 0;
@@ -2254,19 +2268,6 @@ exports[`renders <Tags editable /> without throwing 1`] = `
   outline: 0;
 }
 
-.c4 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 .c17 {
   margin: 0;
   padding: 0;
@@ -2280,46 +2281,6 @@ exports[`renders <Tags editable /> without throwing 1`] = `
   flex-wrap: wrap;
 }
 
-@media only screen and (min-width:0em) {
-  .c2 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c2 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c6 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c6 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
 @media only screen and (min-width:48em) {
   .c0 {
     width: 46rem;
@@ -2345,6 +2306,46 @@ exports[`renders <Tags editable /> without throwing 1`] = `
   }
 }
 
+@media only screen and (min-width:0em) {
+  .c2 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c2 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c6 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c6 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
 <div
   className="c0"
 >
@@ -2358,7 +2359,7 @@ exports[`renders <Tags editable /> without throwing 1`] = `
         className="c2"
       >
         <div
-          className="c3"
+          className="baseline-jVaZNU kXgQxt c3"
           name="filter"
           role="group"
           style={undefined}
@@ -2381,7 +2382,7 @@ exports[`renders <Tags editable /> without throwing 1`] = `
         className="c6"
       >
         <div
-          className="c7"
+          className="baseline-jVaZNU kXgQxt c7"
           role="group"
           style={undefined}
         >
@@ -2893,6 +2894,63 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c4 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c26 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
+.c1 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
 .c12 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -2967,15 +3025,6 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
 .c36 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -3024,28 +3073,6 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   height: 0.8125rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
 .c15 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -3371,30 +3398,42 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   outline: 0;
 }
 
-.c4 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
+.c24 {
+  -webkit-order: 0;
+  -ms-flex-order: 0;
+  order: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 1;
+  -ms-flex-negative: 1;
+  flex-shrink: 1;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
 }
 
-.c26 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
+.c27 {
+  -webkit-order: 0;
+  -ms-flex-order: 0;
+  order: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 1;
+  -ms-flex-negative: 1;
+  flex-shrink: 1;
+  -webkit-flex-basis: 0.75rem;
+  -ms-flex-preferred-size: 0.75rem;
+  flex-basis: 0.75rem;
 }
 
 .c37 {
@@ -3437,44 +3476,6 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   align-content: stretch;
 }
 
-.c24 {
-  -webkit-order: 0;
-  -ms-flex-order: 0;
-  order: 0;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-box-flex: 0;
-  -webkit-flex-grow: 0;
-  -ms-flex-positive: 0;
-  flex-grow: 0;
-  -webkit-flex-shrink: 1;
-  -ms-flex-negative: 1;
-  flex-shrink: 1;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-}
-
-.c27 {
-  -webkit-order: 0;
-  -ms-flex-order: 0;
-  order: 0;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-box-flex: 0;
-  -webkit-flex-grow: 0;
-  -ms-flex-positive: 0;
-  flex-grow: 0;
-  -webkit-flex-shrink: 1;
-  -ms-flex-negative: 1;
-  flex-shrink: 1;
-  -webkit-flex-basis: 0.75rem;
-  -ms-flex-preferred-size: 0.75rem;
-  flex-basis: 0.75rem;
-}
-
 .c20 {
   word-break: break-all;
   line-height: 1.5;
@@ -3491,6 +3492,31 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   box-sizing: border-box;
 }
 
+@media only screen and (min-width:48em) {
+  .c0 {
+    width: 46rem;
+  }
+}
+
+@media only screen and (min-width:64em) {
+  .c0 {
+    width: 61rem;
+  }
+}
+
+@media only screen and (min-width:75em) {
+  .c0 {
+    width: 76rem;
+  }
+}
+
+@media only screen and (max-width:47.9375rem) {
+  .c0 {
+    padding-left: 0.375rem;
+    padding-right: 0.375rem;
+  }
+}
+
 @media only screen and (min-width:0em) {
   .c28 {
     -webkit-align-items: center;
@@ -3569,31 +3595,6 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   }
 }
 
-@media only screen and (min-width:48em) {
-  .c0 {
-    width: 46rem;
-  }
-}
-
-@media only screen and (min-width:64em) {
-  .c0 {
-    width: 61rem;
-  }
-}
-
-@media only screen and (min-width:75em) {
-  .c0 {
-    width: 76rem;
-  }
-}
-
-@media only screen and (max-width:47.9375rem) {
-  .c0 {
-    padding-left: 0.375rem;
-    padding-right: 0.375rem;
-  }
-}
-
 <div
   className="c0"
 >
@@ -3607,7 +3608,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
         className="c2"
       >
         <div
-          className="c3"
+          className="baseline-jVaZNU kXgQxt c3"
           name="filter"
           role="group"
           style={undefined}
@@ -3630,7 +3631,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
         className="c6"
       >
         <div
-          className="c7"
+          className="baseline-jVaZNU kXgQxt c7"
           role="group"
           style={undefined}
         >
@@ -3715,7 +3716,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
               className="c24"
             >
               <div
-                className="c3"
+                className="baseline-jVaZNU kXgQxt c3"
                 name="name"
                 role="group"
                 style={undefined}
@@ -3744,7 +3745,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
               className="c24"
             >
               <div
-                className="c3"
+                className="baseline-jVaZNU kXgQxt c3"
                 name="value"
                 role="group"
                 style={undefined}
@@ -3809,6 +3810,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
                 <svg
                   className=""
                   height="12"
+                  innerRef={undefined}
                   style={
                     Object {
                       "transform": "rotate(0deg)",
@@ -3884,6 +3886,38 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   padding: 1rem;
 }
 
+.c10 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  text-transform: none;
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  min-width: 7.5rem;
+}
+
+.c10::-moz-focus-inner,
+.c10[type='button']::-moz-focus-inner,
+.c10[type='reset']::-moz-focus-inner,
+.c10[type='submit']::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+.c10:-moz-focusring,
+.c10[type='button']:-moz-focusring,
+.c10[type='reset']:-moz-focusring,
+.c10[type='submit']:-moz-focusring {
+  outline: 0.0625rem dotted ButtonText;
+}
+
+.c10 + button {
+  margin-left: 0.375rem;
+}
+
 .c35 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
@@ -3937,38 +3971,6 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   flex: 1 0 auto;
 }
 
-.c10 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  text-transform: none;
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  min-width: 7.5rem;
-}
-
-.c10::-moz-focus-inner,
-.c10[type='button']::-moz-focus-inner,
-.c10[type='reset']::-moz-focus-inner,
-.c10[type='submit']::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-
-.c10:-moz-focusring,
-.c10[type='button']:-moz-focusring,
-.c10[type='reset']:-moz-focusring,
-.c10[type='submit']:-moz-focusring {
-  outline: 0.0625rem dotted ButtonText;
-}
-
-.c10 + button {
-  margin-left: 0.375rem;
-}
-
 .c9 {
   display: inline-block;
 }
@@ -4404,6 +4406,63 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c4 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c26 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  float: right;
+  font-size: 0.8125rem;
+  float: none;
+  margin-left: 1.75rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
+.c1 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
 .c12 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -4478,15 +4537,6 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
 .c40 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -4535,28 +4585,6 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   height: 0.8125rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
 .c15 {
   box-sizing: content-box;
   display: -webkit-box;
@@ -4882,30 +4910,42 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   outline: 0;
 }
 
-.c4 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
+.c24 {
+  -webkit-order: 0;
+  -ms-flex-order: 0;
+  order: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 1;
+  -ms-flex-negative: 1;
+  flex-shrink: 1;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
 }
 
-.c26 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  float: right;
-  font-size: 0.8125rem;
-  float: none;
-  margin-left: 1.75rem;
+.c27 {
+  -webkit-order: 0;
+  -ms-flex-order: 0;
+  order: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 1;
+  -ms-flex-negative: 1;
+  flex-shrink: 1;
+  -webkit-flex-basis: 0.75rem;
+  -ms-flex-preferred-size: 0.75rem;
+  flex-basis: 0.75rem;
 }
 
 .c41 {
@@ -4948,44 +4988,6 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   align-content: stretch;
 }
 
-.c24 {
-  -webkit-order: 0;
-  -ms-flex-order: 0;
-  order: 0;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-box-flex: 0;
-  -webkit-flex-grow: 0;
-  -ms-flex-positive: 0;
-  flex-grow: 0;
-  -webkit-flex-shrink: 1;
-  -ms-flex-negative: 1;
-  flex-shrink: 1;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-}
-
-.c27 {
-  -webkit-order: 0;
-  -ms-flex-order: 0;
-  order: 0;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-box-flex: 0;
-  -webkit-flex-grow: 0;
-  -ms-flex-positive: 0;
-  flex-grow: 0;
-  -webkit-flex-shrink: 1;
-  -ms-flex-negative: 1;
-  flex-shrink: 1;
-  -webkit-flex-basis: 0.75rem;
-  -ms-flex-preferred-size: 0.75rem;
-  flex-basis: 0.75rem;
-}
-
 .c20 {
   word-break: break-all;
   line-height: 1.5;
@@ -5002,6 +5004,31 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   box-sizing: border-box;
 }
 
+@media only screen and (min-width:48em) {
+  .c0 {
+    width: 46rem;
+  }
+}
+
+@media only screen and (min-width:64em) {
+  .c0 {
+    width: 61rem;
+  }
+}
+
+@media only screen and (min-width:75em) {
+  .c0 {
+    width: 76rem;
+  }
+}
+
+@media only screen and (max-width:47.9375rem) {
+  .c0 {
+    padding-left: 0.375rem;
+    padding-right: 0.375rem;
+  }
+}
+
 @media only screen and (min-width:0em) {
   .c28 {
     -webkit-align-items: center;
@@ -5080,31 +5107,6 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   }
 }
 
-@media only screen and (min-width:48em) {
-  .c0 {
-    width: 46rem;
-  }
-}
-
-@media only screen and (min-width:64em) {
-  .c0 {
-    width: 61rem;
-  }
-}
-
-@media only screen and (min-width:75em) {
-  .c0 {
-    width: 76rem;
-  }
-}
-
-@media only screen and (max-width:47.9375rem) {
-  .c0 {
-    padding-left: 0.375rem;
-    padding-right: 0.375rem;
-  }
-}
-
 <div
   className="c0"
 >
@@ -5118,7 +5120,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
         className="c2"
       >
         <div
-          className="c3"
+          className="baseline-jVaZNU kXgQxt c3"
           name="filter"
           role="group"
           style={undefined}
@@ -5141,7 +5143,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
         className="c6"
       >
         <div
-          className="c7"
+          className="baseline-jVaZNU kXgQxt c7"
           role="group"
           style={undefined}
         >
@@ -5226,7 +5228,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
               className="c24"
             >
               <div
-                className="c3"
+                className="baseline-jVaZNU kXgQxt c3"
                 name="name"
                 role="group"
                 style={undefined}
@@ -5255,7 +5257,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
               className="c24"
             >
               <div
-                className="c3"
+                className="baseline-jVaZNU kXgQxt c3"
                 name="value"
                 role="group"
                 style={undefined}
@@ -5500,6 +5502,50 @@ exports[`renders <Tags error /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c4 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
+.c1 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
 .c12 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -5537,15 +5583,6 @@ exports[`renders <Tags error /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
 .c16 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -5587,28 +5624,6 @@ exports[`renders <Tags error /> without throwing 1`] = `
   height: 1.5rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
 .c3 {
   display: inline-block;
   margin: 0;
@@ -5704,19 +5719,6 @@ exports[`renders <Tags error /> without throwing 1`] = `
   outline: 0;
 }
 
-.c4 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
 .c17 {
   margin: 0;
   padding: 0;
@@ -5730,46 +5732,6 @@ exports[`renders <Tags error /> without throwing 1`] = `
   flex-wrap: wrap;
 }
 
-@media only screen and (min-width:0em) {
-  .c2 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c2 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c6 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c6 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
 @media only screen and (min-width:48em) {
   .c0 {
     width: 46rem;
@@ -5795,6 +5757,46 @@ exports[`renders <Tags error /> without throwing 1`] = `
   }
 }
 
+@media only screen and (min-width:0em) {
+  .c2 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c2 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c6 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c6 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
 <div
   className="c0"
 >
@@ -5808,7 +5810,7 @@ exports[`renders <Tags error /> without throwing 1`] = `
         className="c2"
       >
         <div
-          className="c3"
+          className="baseline-jVaZNU kXgQxt c3"
           name="filter"
           role="group"
           style={undefined}
@@ -5831,7 +5833,7 @@ exports[`renders <Tags error /> without throwing 1`] = `
         className="c6"
       >
         <div
-          className="c7"
+          className="baseline-jVaZNU kXgQxt c7"
           role="group"
           style={undefined}
         >
@@ -5885,6 +5887,38 @@ exports[`renders <Tags error /> without throwing 1`] = `
 `;
 
 exports[`renders <Tags loading /> without throwing 1`] = `
+.c10 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  text-transform: none;
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  min-width: 7.5rem;
+}
+
+.c10::-moz-focus-inner,
+.c10[type='button']::-moz-focus-inner,
+.c10[type='reset']::-moz-focus-inner,
+.c10[type='submit']::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+.c10:-moz-focusring,
+.c10[type='button']:-moz-focusring,
+.c10[type='reset']:-moz-focusring,
+.c10[type='submit']:-moz-focusring {
+  outline: 0.0625rem dotted ButtonText;
+}
+
+.c10 + button {
+  margin-left: 0.375rem;
+}
+
 .c14 {
   fill: rgb(59,70,204);
   stroke: rgb(59,70,204);
@@ -5910,34 +5944,6 @@ exports[`renders <Tags loading /> without throwing 1`] = `
   animation-delay: 1s;
 }
 
-.c13 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-content: center;
-  -ms-flex-line-pack: center;
-  align-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 1.25rem;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-}
-
 .c17 {
   color: rgba(73,73,73,1);
   line-height: 1.5rem;
@@ -5967,36 +5973,32 @@ exports[`renders <Tags loading /> without throwing 1`] = `
   padding-bottom: 2.25rem;
 }
 
-.c10 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  text-transform: none;
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  min-width: 7.5rem;
-}
-
-.c10::-moz-focus-inner,
-.c10[type='button']::-moz-focus-inner,
-.c10[type='reset']::-moz-focus-inner,
-.c10[type='submit']::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-
-.c10:-moz-focusring,
-.c10[type='button']:-moz-focusring,
-.c10[type='reset']:-moz-focusring,
-.c10[type='submit']:-moz-focusring {
-  outline: 0.0625rem dotted ButtonText;
-}
-
-.c10 + button {
-  margin-left: 0.375rem;
+.c13 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-content: center;
+  -ms-flex-line-pack: center;
+  align-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 1.25rem;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
 }
 
 .c9 {
@@ -6109,6 +6111,50 @@ exports[`renders <Tags loading /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c4 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
+.c1 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
 .c12 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -6146,15 +6192,6 @@ exports[`renders <Tags loading /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
 .c11 {
   background-color: rgb(216,216,216);
   margin: 0;
@@ -6162,28 +6199,6 @@ exports[`renders <Tags loading /> without throwing 1`] = `
   height: 0.6875rem;
 }
 
-.c1 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-}
-
 .c3 {
   display: inline-block;
   margin: 0;
@@ -6294,59 +6309,6 @@ exports[`renders <Tags loading /> without throwing 1`] = `
   outline: 0;
 }
 
-.c4 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-@media only screen and (min-width:0em) {
-  .c2 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c2 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c6 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c6 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
 @media only screen and (min-width:48em) {
   .c0 {
     width: 46rem;
@@ -6372,6 +6334,46 @@ exports[`renders <Tags loading /> without throwing 1`] = `
   }
 }
 
+@media only screen and (min-width:0em) {
+  .c2 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c2 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c6 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c6 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
 <div
   className="c0"
 >
@@ -6385,7 +6387,7 @@ exports[`renders <Tags loading /> without throwing 1`] = `
         className="c2"
       >
         <div
-          className="c3"
+          className="baseline-jVaZNU kXgQxt c3"
           name="filter"
           role="group"
           style={undefined}
@@ -6408,7 +6410,7 @@ exports[`renders <Tags loading /> without throwing 1`] = `
         className="c6"
       >
         <div
-          className="c7"
+          className="baseline-jVaZNU kXgQxt c7"
           role="group"
           style={undefined}
         >
@@ -6604,6 +6606,50 @@ exports[`renders <Tags tags /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
+.c4 {
+  font-size: 0.9375rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: bold;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+  padding-bottom: 1.125rem;
+}
+
+.c1 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
 .c12 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -6641,15 +6687,6 @@ exports[`renders <Tags tags /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-  padding-bottom: 1.125rem;
-}
-
 .c16 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -6691,26 +6728,19 @@ exports[`renders <Tags tags /> without throwing 1`] = `
   height: 1.5rem;
 }
 
-.c1 {
-  box-sizing: border-box;
+.c19 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex: 0 1 auto;
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.5rem;
-  margin-left: -0.5rem;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-flex: 1;
+  -webkit-flex-grow: 1;
+  -ms-flex-positive: 1;
+  flex-grow: 1;
 }
 
 .c3 {
@@ -6808,34 +6838,6 @@ exports[`renders <Tags tags /> without throwing 1`] = `
   outline: 0;
 }
 
-.c4 {
-  font-size: 0.9375rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: bold;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c19 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-box-flex: 1;
-  -webkit-flex-grow: 1;
-  -ms-flex-positive: 1;
-  flex-grow: 1;
-}
-
 .c20 {
   border: 0.0625rem solid rgb(216,216,216);
   box-sizing: border-box;
@@ -6870,46 +6872,6 @@ exports[`renders <Tags tags /> without throwing 1`] = `
   flex-wrap: wrap;
 }
 
-@media only screen and (min-width:0em) {
-  .c2 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c2 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c6 {
-    -webkit-flex-basis: 41.66666666666667%;
-    -ms-flex-preferred-size: 41.66666666666667%;
-    flex-basis: 41.66666666666667%;
-    max-width: 41.66666666666667%;
-    display: block;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c6 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-    display: block;
-  }
-}
-
 @media only screen and (min-width:48em) {
   .c0 {
     width: 46rem;
@@ -6935,6 +6897,46 @@ exports[`renders <Tags tags /> without throwing 1`] = `
   }
 }
 
+@media only screen and (min-width:0em) {
+  .c2 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c2 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c6 {
+    -webkit-flex-basis: 41.66666666666667%;
+    -ms-flex-preferred-size: 41.66666666666667%;
+    flex-basis: 41.66666666666667%;
+    max-width: 41.66666666666667%;
+    display: block;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c6 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+    display: block;
+  }
+}
+
 <div
   className="c0"
 >
@@ -6948,7 +6950,7 @@ exports[`renders <Tags tags /> without throwing 1`] = `
         className="c2"
       >
         <div
-          className="c3"
+          className="baseline-jVaZNU kXgQxt c3"
           name="filter"
           role="group"
           style={undefined}
@@ -6971,7 +6973,7 @@ exports[`renders <Tags tags /> without throwing 1`] = `
         className="c6"
       >
         <div
-          className="c7"
+          className="baseline-jVaZNU kXgQxt c7"
           role="group"
           style={undefined}
         >
diff --git a/packages/my-joy-beta/src/containers/navigation/__tests__/__snapshots__/breadcrumb.spec.js.snap b/packages/my-joy-beta/src/containers/navigation/__tests__/__snapshots__/breadcrumb.spec.js.snap
index a1269d78..a2b6a5f3 100644
--- a/packages/my-joy-beta/src/containers/navigation/__tests__/__snapshots__/breadcrumb.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/navigation/__tests__/__snapshots__/breadcrumb.spec.js.snap
@@ -1,6 +1,26 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders <Breadcrumb /> without throwing 1`] = `
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  padding-right: 2rem;
+  padding-left: 2rem;
+  box-sizing: border-box;
+  width: 100%;
+  padding-left: 0;
+  padding-right: 0;
+  border-bottom: 0.0625rem solid rgb(216,216,216);
+}
+
+.c1 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+}
+
 .c2 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -29,14 +49,6 @@ exports[`renders <Breadcrumb /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c1 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-}
-
 .c5 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -75,28 +87,6 @@ exports[`renders <Breadcrumb /> without throwing 1`] = `
   align-items: center;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  padding-right: 2rem;
-  padding-left: 2rem;
-  box-sizing: border-box;
-  width: 100%;
-  padding-left: 0;
-  padding-right: 0;
-  border-bottom: 0.0625rem solid rgb(216,216,216);
-}
-
-@media only screen and (min-width:0em) {
-  .c3 {
-    -webkit-flex-basis: 100%;
-    -ms-flex-preferred-size: 100%;
-    flex-basis: 100%;
-    max-width: 100%;
-    display: block;
-  }
-}
-
 @media only screen and (min-width:48em) {
   .c1 {
     width: 46rem;
@@ -122,6 +112,16 @@ exports[`renders <Breadcrumb /> without throwing 1`] = `
   }
 }
 
+@media only screen and (min-width:0em) {
+  .c3 {
+    -webkit-flex-basis: 100%;
+    -ms-flex-preferred-size: 100%;
+    flex-basis: 100%;
+    max-width: 100%;
+    display: block;
+  }
+}
+
 <div
   className="c0"
 >
@@ -147,6 +147,7 @@ exports[`renders <Breadcrumb /> without throwing 1`] = `
           <svg
             className="c6 "
             height="6"
+            innerRef={undefined}
             style={
               Object {
                 "transform": "rotate(-90deg)",
@@ -170,6 +171,26 @@ exports[`renders <Breadcrumb /> without throwing 1`] = `
 `;
 
 exports[`renders <Breadcrumb match /> without throwing 1`] = `
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  padding-right: 2rem;
+  padding-left: 2rem;
+  box-sizing: border-box;
+  width: 100%;
+  padding-left: 0;
+  padding-right: 0;
+  border-bottom: 0.0625rem solid rgb(216,216,216);
+}
+
+.c1 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+}
+
 .c2 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -198,14 +219,6 @@ exports[`renders <Breadcrumb match /> without throwing 1`] = `
   padding-left: 0.5rem;
 }
 
-.c1 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-}
-
 .c5 {
   color: rgba(73,73,73,1);
   font-weight: normal;
@@ -244,28 +257,6 @@ exports[`renders <Breadcrumb match /> without throwing 1`] = `
   align-items: center;
 }
 
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  padding-right: 2rem;
-  padding-left: 2rem;
-  box-sizing: border-box;
-  width: 100%;
-  padding-left: 0;
-  padding-right: 0;
-  border-bottom: 0.0625rem solid rgb(216,216,216);
-}
-
-@media only screen and (min-width:0em) {
-  .c3 {
-    -webkit-flex-basis: 100%;
-    -ms-flex-preferred-size: 100%;
-    flex-basis: 100%;
-    max-width: 100%;
-    display: block;
-  }
-}
-
 @media only screen and (min-width:48em) {
   .c1 {
     width: 46rem;
@@ -291,6 +282,16 @@ exports[`renders <Breadcrumb match /> without throwing 1`] = `
   }
 }
 
+@media only screen and (min-width:0em) {
+  .c3 {
+    -webkit-flex-basis: 100%;
+    -ms-flex-preferred-size: 100%;
+    flex-basis: 100%;
+    max-width: 100%;
+    display: block;
+  }
+}
+
 <div
   className="c0"
 >
@@ -316,6 +317,7 @@ exports[`renders <Breadcrumb match /> without throwing 1`] = `
           <svg
             className="c6 "
             height="6"
+            innerRef={undefined}
             style={
               Object {
                 "transform": "rotate(-90deg)",
@@ -344,6 +346,7 @@ exports[`renders <Breadcrumb match /> without throwing 1`] = `
           <svg
             className="c6 "
             height="6"
+            innerRef={undefined}
             style={
               Object {
                 "transform": "rotate(-90deg)",
diff --git a/packages/ui-toolkit/src/breadcrumb/__tests__/__snapshots__/index.spec.js.snap b/packages/ui-toolkit/src/breadcrumb/__tests__/__snapshots__/index.spec.js.snap
index 21aedc86..cecc8105 100644
--- a/packages/ui-toolkit/src/breadcrumb/__tests__/__snapshots__/index.spec.js.snap
+++ b/packages/ui-toolkit/src/breadcrumb/__tests__/__snapshots__/index.spec.js.snap
@@ -39,6 +39,26 @@ exports[`Breadcrumb Default Breadcrumb 1`] = `
   align-items: center;
 }
 
+.c0 {
+  margin-right: auto;
+  margin-left: auto;
+  padding-right: 2rem;
+  padding-left: 2rem;
+  box-sizing: border-box;
+  width: 100%;
+  padding-left: 0;
+  padding-right: 0;
+  border-bottom: 0.0625rem solid rgb(216,216,216);
+}
+
+.c1 {
+  margin-right: auto;
+  margin-left: auto;
+  box-sizing: border-box;
+  width: 100%;
+  max-width: 62.5rem;
+}
+
 .c2 {
   box-sizing: border-box;
   display: -webkit-box;
@@ -67,36 +87,6 @@ exports[`Breadcrumb Default Breadcrumb 1`] = `
   padding-left: 0.5rem;
 }
 
-.c1 {
-  margin-right: auto;
-  margin-left: auto;
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 62.5rem;
-}
-
-.c0 {
-  margin-right: auto;
-  margin-left: auto;
-  padding-right: 2rem;
-  padding-left: 2rem;
-  box-sizing: border-box;
-  width: 100%;
-  padding-left: 0;
-  padding-right: 0;
-  border-bottom: 0.0625rem solid rgb(216,216,216);
-}
-
-@media only screen and (min-width:0em) {
-  .c3 {
-    -webkit-flex-basis: 100%;
-    -ms-flex-preferred-size: 100%;
-    flex-basis: 100%;
-    max-width: 100%;
-    display: block;
-  }
-}
-
 @media only screen and (min-width:48em) {
   .c1 {
     width: 46rem;
@@ -122,6 +112,16 @@ exports[`Breadcrumb Default Breadcrumb 1`] = `
   }
 }
 
+@media only screen and (min-width:0em) {
+  .c3 {
+    -webkit-flex-basis: 100%;
+    -ms-flex-preferred-size: 100%;
+    flex-basis: 100%;
+    max-width: 100%;
+    display: block;
+  }
+}
+
 <div
   className="c0"
 >
@@ -147,6 +147,7 @@ exports[`Breadcrumb Default Breadcrumb 1`] = `
           <svg
             className="c6 "
             height="6"
+            innerRef={undefined}
             style={
               Object {
                 "transform": "rotate(-90deg)",
@@ -175,6 +176,7 @@ exports[`Breadcrumb Default Breadcrumb 1`] = `
           <svg
             className="c6 "
             height="6"
+            innerRef={undefined}
             style={
               Object {
                 "transform": "rotate(-90deg)",
@@ -203,6 +205,7 @@ exports[`Breadcrumb Default Breadcrumb 1`] = `
           <svg
             className="c6 "
             height="6"
+            innerRef={undefined}
             style={
               Object {
                 "transform": "rotate(-90deg)",
@@ -231,6 +234,7 @@ exports[`Breadcrumb Default Breadcrumb 1`] = `
           <svg
             className="c6 "
             height="6"
+            innerRef={undefined}
             style={
               Object {
                 "transform": "rotate(-90deg)",
@@ -304,6 +308,7 @@ exports[`Breadcrumb Default Item 1`] = `
   <svg
     className="c2 "
     height="6"
+    innerRef={undefined}
     style={
       Object {
         "transform": "rotate(-90deg)",
diff --git a/packages/ui-toolkit/src/footer/__tests__/__snapshots__/footer.spec.js.snap b/packages/ui-toolkit/src/footer/__tests__/__snapshots__/footer.spec.js.snap
index 60f15f05..4e9dc32e 100644
--- a/packages/ui-toolkit/src/footer/__tests__/__snapshots__/footer.spec.js.snap
+++ b/packages/ui-toolkit/src/footer/__tests__/__snapshots__/footer.spec.js.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Footer Footer 1`] = `
-.c2 {
+.c1 {
   margin-right: auto;
   margin-left: auto;
   box-sizing: border-box;
@@ -23,7 +23,7 @@ exports[`Footer Footer 1`] = `
   align-items: stretch;
 }
 
-.c1 {
+.c0 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -41,49 +41,45 @@ exports[`Footer Footer 1`] = `
   -webkit-box-align: stretch;
   -ms-flex-align: stretch;
   align-items: stretch;
-  background-color: rgb(30,49,59);
+  background-color: rgba(241,241,241,1);
+  border-top: 0.0625rem solid rgb(216,216,216);
   max-height: 3.3125rem;
   min-height: 3.3125rem;
   line-height: 1.5625rem;
-}
-
-.c0 {
-  background-color: rgba(241,241,241,1);
-  border-top: 0.0625rem solid rgb(216,216,216);
   height: 4.375rem;
   max-height: 4.375rem;
 }
 
 @media only screen and (min-width:48em) {
-  .c2 {
+  .c1 {
     width: 46rem;
   }
 }
 
 @media only screen and (min-width:64em) {
-  .c2 {
+  .c1 {
     width: 61rem;
   }
 }
 
 @media only screen and (min-width:75em) {
-  .c2 {
+  .c1 {
     width: 76rem;
   }
 }
 
 @media only screen and (max-width:47.9375rem) {
-  .c2 {
+  .c1 {
     padding-left: 0.375rem;
     padding-right: 0.375rem;
   }
 }
 
 <div
-  className="c0 c1"
+  className="c0"
 >
   <div
-    className="c2"
+    className="c1"
   />
 </div>
 `;
diff --git a/packages/ui-toolkit/src/footer/index.js b/packages/ui-toolkit/src/footer/index.js
index e9481ba9..f0ff7692 100644
--- a/packages/ui-toolkit/src/footer/index.js
+++ b/packages/ui-toolkit/src/footer/index.js
@@ -1,10 +1,46 @@
+import React from 'react';
+import styled from 'styled-components';
 import remcalc from 'remcalc';
-import Header from '../header';
+import is from 'styled-is';
 
-export default Header.extend`
+import Baseline from '../baseline';
+import { ViewContainer } from '../layout';
+
+const Container = ViewContainer.extend`
+  display: flex;
+  flex-wrap: nowrap;
+  align-content: stretch;
+  align-items: stretch;
+`;
+
+const Footer = styled.div`
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-content: stretch;
+  align-items: stretch;
   background-color: rgba(241, 241, 241, 1);
   border-top: ${remcalc(1)} solid ${props => props.theme.grey};
+  max-height: ${remcalc(53)};
+  min-height: ${remcalc(53)};
+  line-height: ${remcalc(25)};
 
   height: ${remcalc(70)};
   max-height: ${remcalc(70)};
+
+  ${is('fixed')`
+    position: fixed;
+    left: 0;
+    right: 0;
+  `};
+
+  ${is('bottom', 'fixed')`
+    bottom: 0;
+  `};
 `;
+
+export default Baseline(({ children, fluid, ...rest }) => (
+  <Footer {...rest}>
+    <Container fluid={fluid}>{children}</Container>
+  </Footer>
+));
diff --git a/packages/ui-toolkit/src/form/__tests__/__snapshots__/form.spec.js.snap b/packages/ui-toolkit/src/form/__tests__/__snapshots__/form.spec.js.snap
index 3cfa05d0..78381b1d 100644
--- a/packages/ui-toolkit/src/form/__tests__/__snapshots__/form.spec.js.snap
+++ b/packages/ui-toolkit/src/form/__tests__/__snapshots__/form.spec.js.snap
@@ -882,8 +882,8 @@ exports[`Form Toggle 1`] = `
   left: 0;
   border-radius: 2em;
   background: rgb(255,255,255);
-  -webkit-transition: left 0.3s cubic-bezier(0.175,0.885,0.32,1.275),padding 0.3s ease, margin 0.3s ease,box-shadow 0.3s ease;
-  transition: left 0.3s cubic-bezier(0.175,0.885,0.32,1.275),padding 0.3s ease, margin 0.3s ease,box-shadow 0.3s ease;
+  -webkit-transition: left 0.3s cubic-bezier(0.175,0.885,0.32,1.275), padding 0.3s ease,margin 0.3s ease,box-shadow 0.3s ease;
+  transition: left 0.3s cubic-bezier(0.175,0.885,0.32,1.275), padding 0.3s ease,margin 0.3s ease,box-shadow 0.3s ease;
   box-shadow: 0 0 0 0.0625rem rgb(216,216,216);
 }
 
diff --git a/packages/ui-toolkit/src/message/__tests__/__snapshots__/message.spec.js.snap b/packages/ui-toolkit/src/message/__tests__/__snapshots__/message.spec.js.snap
index 04d0a8eb..3f20bff9 100644
--- a/packages/ui-toolkit/src/message/__tests__/__snapshots__/message.spec.js.snap
+++ b/packages/ui-toolkit/src/message/__tests__/__snapshots__/message.spec.js.snap
@@ -123,6 +123,7 @@ exports[`Message Message 1`] = `
   <svg
     className="c5 "
     height="12"
+    innerRef={undefined}
     onClick={[Function]}
     style={
       Object {
@@ -238,6 +239,7 @@ exports[`Message Message Error 1`] = `
   <svg
     className="c5 "
     height="12"
+    innerRef={undefined}
     onClick={[Function]}
     style={
       Object {
@@ -353,6 +355,7 @@ exports[`Message Message Warning 1`] = `
   <svg
     className="c5 "
     height="12"
+    innerRef={undefined}
     onClick={[Function]}
     style={
       Object {