fix(my-joy-beta): fix multiple small issues

2018-02-09 12:41:54 +00:00 · 2018-02-09 12:41:54 +00:00 · a5eb142dcc
commit a5eb142dcc
parent bf5f0463e7
63 changed files with 1280 additions and 81 deletions
--- a/packages/my-joy-beta/src/components/tests/__image_snapshots__/key-value-ui-js-key-value-submitting-1-snap.png
+++ b/packages/my-joy-beta/src/components/tests/__image_snapshots__/key-value-ui-js-key-value-submitting-1-snap.png
--- a/packages/my-joy-beta/src/components/tests/snapshots/cns.spec.js.snap
+++ b/packages/my-joy-beta/src/components/tests/snapshots/cns.spec.js.snap
@ -59,6 +59,7 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -107,6 +108,7 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -115,6 +117,7 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -130,6 +133,7 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
 .c7:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -161,6 +165,7 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -220,6 +225,7 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -388,6 +394,7 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -436,6 +443,7 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -444,6 +452,7 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -459,6 +468,7 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
 .c7:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -490,6 +500,7 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -549,6 +560,7 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
--- a/packages/my-joy-beta/src/components/tests/snapshots/firewall.spec.js.snap
+++ b/packages/my-joy-beta/src/components/tests/snapshots/firewall.spec.js.snap
@ -5401,6 +5401,7 @@ exports[`renders <ToggleFirewallForm /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -5605,6 +5606,7 @@ exports[`renders <ToggleFirewallForm submitting /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -5619,6 +5621,7 @@ exports[`renders <ToggleFirewallForm submitting /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -5850,6 +5853,7 @@ exports[`renders <ToggleInactiveForm /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
--- a/packages/my-joy-beta/src/components/tests/snapshots/key-value.spec.js.snap
+++ b/packages/my-joy-beta/src/components/tests/snapshots/key-value.spec.js.snap
@ -7,6 +7,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -55,6 +56,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -63,6 +65,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -83,6 +86,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -142,6 +146,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -150,6 +155,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -171,6 +177,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -230,6 +237,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -238,6 +246,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -271,6 +280,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -346,6 +356,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -360,6 +371,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -738,6 +750,7 @@ exports[`renders <KeyValue /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1263,6 +1276,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -1311,6 +1325,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1319,6 +1334,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1339,6 +1355,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1398,6 +1415,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1406,6 +1424,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1427,6 +1446,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1486,6 +1506,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1494,6 +1515,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1527,6 +1549,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1602,6 +1625,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -1616,6 +1640,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -1994,6 +2019,7 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -2280,6 +2306,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -2341,6 +2368,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2349,6 +2377,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2369,6 +2398,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
 .c22:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2428,6 +2458,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2436,6 +2467,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2457,6 +2489,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
 .c25:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2516,6 +2549,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2524,6 +2558,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2557,6 +2592,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
 .c27:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2632,6 +2668,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -2646,6 +2683,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -2980,6 +3018,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -3043,6 +3082,7 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  resize: vertical;
  font-size: 0.9375rem;
@ -3354,6 +3394,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -3402,6 +3443,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3410,6 +3452,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3430,6 +3473,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3489,6 +3533,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3497,6 +3542,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3518,6 +3564,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3577,6 +3624,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3585,6 +3633,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3618,6 +3667,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3693,6 +3743,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -3707,6 +3758,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -4085,6 +4137,7 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -4371,6 +4424,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -4419,6 +4473,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4427,6 +4482,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4447,6 +4503,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4506,6 +4563,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4514,6 +4572,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4535,6 +4594,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4594,6 +4654,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4602,6 +4663,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4635,6 +4697,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4710,6 +4773,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -4724,6 +4788,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -5083,6 +5148,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -5138,6 +5204,7 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: block;
 }
@ -5398,6 +5465,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -5499,6 +5567,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -5507,6 +5576,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -5527,6 +5597,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -5586,6 +5657,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -5594,6 +5666,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -5615,6 +5688,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -5674,6 +5748,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -5682,6 +5757,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -5720,6 +5796,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -5812,6 +5889,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -5826,6 +5904,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -6204,6 +6283,7 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -6499,6 +6579,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -6600,6 +6681,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6608,6 +6690,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6629,6 +6712,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6688,6 +6772,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6696,6 +6781,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6734,6 +6820,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
 .c30:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6837,6 +6924,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6845,6 +6933,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6870,6 +6959,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6935,6 +7025,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -6949,6 +7040,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -7330,6 +7422,7 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
  color: rgb(216,216,216);
  cursor: not-allowed;
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -7655,6 +7748,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -7703,6 +7797,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -7711,6 +7806,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -7731,6 +7827,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -7790,6 +7887,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -7798,6 +7896,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -7819,6 +7918,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -7878,6 +7978,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -7886,6 +7987,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -7919,6 +8021,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -7994,6 +8097,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -8008,6 +8112,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -8386,6 +8491,7 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
--- a/packages/my-joy-beta/src/components/tests/snapshots/network.spec.js.snap
+++ b/packages/my-joy-beta/src/components/tests/snapshots/network.spec.js.snap
@ -4637,6 +4637,7 @@ exports[`renders <Network {...network} infoExpanded /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
--- a/packages/my-joy-beta/src/components/tests/snapshots/tags.spec.js.snap
+++ b/packages/my-joy-beta/src/components/tests/snapshots/tags.spec.js.snap
@ -24,6 +24,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -72,6 +73,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -80,6 +82,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -100,6 +103,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -159,6 +163,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -167,6 +172,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -188,6 +194,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -247,6 +254,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -255,6 +263,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -288,6 +297,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -363,6 +373,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -377,6 +388,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -738,6 +750,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1041,6 +1054,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -1089,6 +1103,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1097,6 +1112,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1117,6 +1133,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1176,6 +1193,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1184,6 +1202,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1205,6 +1224,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1264,6 +1284,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1272,6 +1293,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1305,6 +1327,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1380,6 +1403,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -1394,6 +1418,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -1736,6 +1761,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1791,6 +1817,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: block;
 }
--- a/packages/my-joy-beta/src/components/create-instance/tests/__image_snapshots__/images-ui-js-images-images-name-stuff-image-name-stuff-1-snap.png
+++ b/packages/my-joy-beta/src/components/create-instance/tests/__image_snapshots__/images-ui-js-images-images-name-stuff-image-name-stuff-1-snap.png
--- a/packages/my-joy-beta/src/components/create-instance/tests/__image_snapshots__/package-ui-js-packages-expanded-1-snap.png
+++ b/packages/my-joy-beta/src/components/create-instance/tests/__image_snapshots__/package-ui-js-packages-expanded-1-snap.png
--- a/packages/my-joy-beta/src/components/create-instance/tests/__image_snapshots__/package-ui-js-packages-is-vm-selected-1-snap.png
+++ b/packages/my-joy-beta/src/components/create-instance/tests/__image_snapshots__/package-ui-js-packages-is-vm-selected-1-snap.png
--- a/packages/my-joy-beta/src/components/create-instance/tests/__image_snapshots__/package-ui-js-packages-loading-1-snap.png
+++ b/packages/my-joy-beta/src/components/create-instance/tests/__image_snapshots__/package-ui-js-packages-loading-1-snap.png
--- a/packages/my-joy-beta/src/components/create-instance/tests/__image_snapshots__/package-ui-js-packages-pristine-false-1-snap.png
+++ b/packages/my-joy-beta/src/components/create-instance/tests/__image_snapshots__/package-ui-js-packages-pristine-false-1-snap.png
--- 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
@ -225,6 +225,7 @@ exports[`renders <Rule/> without throwing 1`] = `
  appearance: none;
  min-height: 0;
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -365,6 +366,7 @@ exports[`renders <Rule/> without throwing 1`] = `
  max-width: 22.1875rem;
  width: 4.125rem;
  max-width: 4.125rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -440,6 +442,7 @@ exports[`renders <Rule/> without throwing 1`] = `
  max-width: 22.1875rem;
  width: 5.625rem;
  max-width: 5.625rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -515,6 +518,7 @@ exports[`renders <Rule/> without throwing 1`] = `
  max-width: 22.1875rem;
  width: 7.5rem;
  max-width: 7.5rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -590,6 +594,7 @@ exports[`renders <Rule/> without throwing 1`] = `
  max-width: 22.1875rem;
  width: 8.125rem;
  max-width: 8.125rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1083,6 +1088,7 @@ exports[`renders <Rule/> without throwing 2`] = `
  appearance: none;
  min-height: 0;
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1223,6 +1229,7 @@ exports[`renders <Rule/> without throwing 2`] = `
  max-width: 22.1875rem;
  width: 4.125rem;
  max-width: 4.125rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1298,6 +1305,7 @@ exports[`renders <Rule/> without throwing 2`] = `
  max-width: 22.1875rem;
  width: 5.625rem;
  max-width: 5.625rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1373,6 +1381,7 @@ exports[`renders <Rule/> without throwing 2`] = `
  max-width: 22.1875rem;
  width: 7.5rem;
  max-width: 7.5rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1448,6 +1457,7 @@ exports[`renders <Rule/> without throwing 2`] = `
  max-width: 22.1875rem;
  width: 8.125rem;
  max-width: 8.125rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
--- 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
@ -225,6 +225,7 @@ exports[`renders <Images images=[{name: stuff, imageName: stuff}] /> without thr
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
--- 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
@ -76,6 +76,7 @@ exports[`renders <Name /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -124,6 +125,7 @@ exports[`renders <Name /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -132,6 +134,7 @@ exports[`renders <Name /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -161,6 +164,7 @@ exports[`renders <Name /> without throwing 1`] = `
 .c11:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -217,6 +221,7 @@ exports[`renders <Name /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -231,6 +236,7 @@ exports[`renders <Name /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -290,6 +296,7 @@ exports[`renders <Name /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -499,6 +506,7 @@ exports[`renders <Name expanded /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -547,6 +555,7 @@ exports[`renders <Name expanded /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -555,6 +564,7 @@ exports[`renders <Name expanded /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -584,6 +594,7 @@ exports[`renders <Name expanded /> without throwing 1`] = `
 .c11:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -640,6 +651,7 @@ exports[`renders <Name expanded /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -654,6 +666,7 @@ exports[`renders <Name expanded /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -713,6 +726,7 @@ exports[`renders <Name expanded /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -922,6 +936,7 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -970,6 +985,7 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -978,6 +994,7 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1007,6 +1024,7 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
 .c11:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1063,6 +1081,7 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -1077,6 +1096,7 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -1136,6 +1156,7 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1345,6 +1366,7 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -1393,6 +1415,7 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1401,6 +1424,7 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1430,6 +1454,7 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
 .c11:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1486,6 +1511,7 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -1500,6 +1526,7 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -1559,6 +1586,7 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
--- 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
@ -82,6 +82,7 @@ exports[`renders <Filters /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -193,6 +194,7 @@ exports[`renders <Filters /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -201,6 +203,7 @@ exports[`renders <Filters /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -220,6 +223,7 @@ exports[`renders <Filters /> without throwing 1`] = `
 .c14:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -268,6 +272,7 @@ exports[`renders <Filters /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -1013,6 +1018,7 @@ exports[`renders <Package /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -1103,6 +1109,7 @@ exports[`renders <Package /> without throwing 1`] = `
  box-sizing: border-box;
  padding: 0 1.5rem;
  height: 3.75rem;
  -webkit-text-align: right;
  text-align: right;
  border-bottom-width: 0;
 }
@ -1363,6 +1370,7 @@ exports[`renders <Packages expanded /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1396,6 +1404,7 @@ exports[`renders <Packages expanded /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: right;
  text-align: right;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1432,6 +1441,7 @@ exports[`renders <Packages expanded /> without throwing 1`] = `
 .c12 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
@ -1909,6 +1919,7 @@ exports[`renders <Packages isVmSelected /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1942,6 +1953,7 @@ exports[`renders <Packages isVmSelected /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: right;
  text-align: right;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1978,6 +1990,7 @@ exports[`renders <Packages isVmSelected /> without throwing 1`] = `
 .c12 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
@ -2455,6 +2468,7 @@ exports[`renders <Packages loading /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2488,6 +2502,7 @@ exports[`renders <Packages loading /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: right;
  text-align: right;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2524,6 +2539,7 @@ exports[`renders <Packages loading /> without throwing 1`] = `
 .c12 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
@ -2919,6 +2935,7 @@ exports[`renders <Packages packages=[{name: stuff, imageName: stuff}] /> without
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2952,6 +2969,7 @@ exports[`renders <Packages packages=[{name: stuff, imageName: stuff}] /> without
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: right;
  text-align: right;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -3209,6 +3227,7 @@ exports[`renders <Packages pristine={false} /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -3242,6 +3261,7 @@ exports[`renders <Packages pristine={false} /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: right;
  text-align: right;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -3278,6 +3298,7 @@ exports[`renders <Packages pristine={false} /> without throwing 1`] = `
 .c12 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
--- a/packages/my-joy-beta/src/components/instances/tests/__image_snapshots__/snapshots-ui-js-item-mutating-1-snap.png
+++ b/packages/my-joy-beta/src/components/instances/tests/__image_snapshots__/snapshots-ui-js-item-mutating-1-snap.png
--- a/packages/my-joy-beta/src/components/instances/tests/__image_snapshots__/snapshots-ui-js-snapshot-list-1-snap.png
+++ b/packages/my-joy-beta/src/components/instances/tests/__image_snapshots__/snapshots-ui-js-snapshot-list-1-snap.png
--- a/packages/my-joy-beta/src/components/instances/tests/__image_snapshots__/snapshots-ui-js-snapshot-list-all-selected-1-snap.png
+++ b/packages/my-joy-beta/src/components/instances/tests/__image_snapshots__/snapshots-ui-js-snapshot-list-all-selected-1-snap.png
--- a/packages/my-joy-beta/src/components/instances/tests/__image_snapshots__/snapshots-ui-js-snapshot-list-sort-by-1-snap.png
+++ b/packages/my-joy-beta/src/components/instances/tests/__image_snapshots__/snapshots-ui-js-snapshot-list-sort-by-1-snap.png
--- a/packages/my-joy-beta/src/components/instances/tests/__image_snapshots__/snapshots-ui-js-snapshot-list-sort-by-sort-order-1-snap.png
+++ b/packages/my-joy-beta/src/components/instances/tests/__image_snapshots__/snapshots-ui-js-snapshot-list-sort-by-sort-order-1-snap.png
--- a/packages/my-joy-beta/src/components/instances/tests/__image_snapshots__/snapshots-ui-js-snapshot-list-submitting-1-snap.png
+++ b/packages/my-joy-beta/src/components/instances/tests/__image_snapshots__/snapshots-ui-js-snapshot-list-submitting-1-snap.png
--- a/packages/my-joy-beta/src/components/instances/tests/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png
+++ b/packages/my-joy-beta/src/components/instances/tests/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png
--- 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
@ -195,6 +195,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -224,6 +225,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -257,6 +259,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -288,6 +291,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -319,6 +323,7 @@ exports[`renders <InstanceList /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -724,6 +729,7 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -753,6 +759,7 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -786,6 +793,7 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -817,6 +825,7 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -848,6 +857,7 @@ exports[`renders <InstanceList allSelected /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1253,6 +1263,7 @@ exports[`renders <InstanceList sortBy /> without throwing 1`] = `
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1284,6 +1295,7 @@ exports[`renders <InstanceList sortBy /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1315,6 +1327,7 @@ exports[`renders <InstanceList sortBy /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1368,6 +1381,7 @@ exports[`renders <InstanceList sortBy /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1399,6 +1413,7 @@ exports[`renders <InstanceList sortBy /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1782,6 +1797,7 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1813,6 +1829,7 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1844,6 +1861,7 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1897,6 +1915,7 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1928,6 +1947,7 @@ exports[`renders <InstanceList sortBy sortOrder /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2311,6 +2331,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2340,6 +2361,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2373,6 +2395,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2404,6 +2427,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2435,6 +2459,7 @@ exports[`renders <InstanceList submitting /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2840,6 +2865,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2869,6 +2895,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2902,6 +2929,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2933,6 +2961,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2964,6 +2993,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -3181,6 +3211,7 @@ exports[`renders <InstanceList>{children}</InstanceList> without throwing 1`] =
 exports[`renders <Item /> without throwing 1`] = `
 .c13 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -3254,6 +3285,7 @@ exports[`renders <Item /> without throwing 1`] = `
 }
 .c12:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
@ -3396,6 +3428,7 @@ exports[`renders <Item /> without throwing 1`] = `
  padding: 0 1.5rem;
  height: 3.75rem;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -3420,6 +3453,7 @@ exports[`renders <Item /> without throwing 1`] = `
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -3444,6 +3478,7 @@ exports[`renders <Item /> without throwing 1`] = `
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -3495,6 +3530,7 @@ exports[`renders <Item /> without throwing 1`] = `
 .c11 {
  color: rgba(73,73,73,1);
  -webkit-text-decoration: none;
  text-decoration: none;
  font-weight: 600;
 }
@ -3654,6 +3690,7 @@ exports[`renders <Item /> without throwing 1`] = `
 exports[`renders <Item {...item} /> without throwing 1`] = `
 .c13 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -3727,6 +3764,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
 }
 .c12:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
@ -3869,6 +3907,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
  padding: 0 1.5rem;
  height: 3.75rem;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -3893,6 +3932,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -3917,6 +3957,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -3968,6 +4009,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
 .c11 {
  color: rgba(73,73,73,1);
  -webkit-text-decoration: none;
  text-decoration: none;
  font-weight: 600;
 }
@ -4129,6 +4171,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
 exports[`renders <Item allowedActions /> without throwing 1`] = `
 .c13 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -4202,6 +4245,7 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
 }
 .c12:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
@ -4344,6 +4388,7 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
  padding: 0 1.5rem;
  height: 3.75rem;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -4368,6 +4413,7 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -4392,6 +4438,7 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -4443,6 +4490,7 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
 .c11 {
  color: rgba(73,73,73,1);
  -webkit-text-decoration: none;
  text-decoration: none;
  font-weight: 600;
 }
@ -4602,6 +4650,7 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
 exports[`renders <Item mutating /> without throwing 1`] = `
 .c13 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -4675,6 +4724,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
 }
 .c12:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
@ -4842,6 +4892,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
  padding: 0 1.5rem;
  height: 3.75rem;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -4866,6 +4917,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -4890,6 +4942,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -4912,6 +4965,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
  padding: 0 1.5rem;
  height: 3.75rem;
  vertical-align: middle;
  -webkit-text-align: center;
  text-align: center;
  border-bottom-width: 0;
  border-left-width: 0.0625rem !important;
@ -4943,6 +4997,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
 .c11 {
  color: rgba(73,73,73,1);
  -webkit-text-decoration: none;
  text-decoration: none;
  font-weight: 600;
 }
--- 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
@ -7,6 +7,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -68,6 +69,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -76,6 +78,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -96,6 +99,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
 .c22:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -155,6 +159,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -163,6 +168,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -184,6 +190,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
 .c25:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -243,6 +250,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -251,6 +259,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -284,6 +293,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
 .c27:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -359,6 +369,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -373,6 +384,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -707,6 +719,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -770,6 +783,7 @@ exports[`renders <AddForm /> without throwing 1`] = `
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  resize: vertical;
  font-size: 0.9375rem;
@ -1081,6 +1095,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -1142,6 +1157,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1150,6 +1166,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1170,6 +1187,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
 .c23:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1229,6 +1247,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1237,6 +1256,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1258,6 +1278,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1317,6 +1338,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1325,6 +1347,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1358,6 +1381,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
 .c28:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1433,6 +1457,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -1447,6 +1472,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -1772,6 +1798,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1835,6 +1862,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  resize: vertical;
  font-size: 0.9375rem;
@ -1907,6 +1935,7 @@ exports[`renders <EditForm /> without throwing 1`] = `
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: block;
 }
--- 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
@ -196,6 +196,7 @@ Array [
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -225,6 +226,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -258,6 +260,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -289,6 +292,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -572,6 +576,7 @@ Array [
 .c5 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
@ -1018,6 +1023,7 @@ exports[`renders <Item /> without throwing 1`] = `
  padding: 0 1.5rem;
  height: 3.75rem;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -1042,6 +1048,7 @@ exports[`renders <Item /> without throwing 1`] = `
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -1405,6 +1412,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
  padding: 0 1.5rem;
  height: 3.75rem;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -1429,6 +1437,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -1642,6 +1651,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  -webkit-text-align: center;
  text-align: center;
  margin-bottom: 0;
  margin-left: 0.375rem;
@ -1983,6 +1993,7 @@ Array [
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2012,6 +2023,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2045,6 +2057,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2076,6 +2089,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2359,6 +2373,7 @@ Array [
 .c5 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
@ -2812,6 +2827,7 @@ Array [
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2841,6 +2857,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2874,6 +2891,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2905,6 +2923,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -3188,6 +3207,7 @@ Array [
 .c5 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
@ -3641,6 +3661,7 @@ Array [
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -3672,6 +3693,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -3725,6 +3747,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -3756,6 +3779,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -4017,6 +4041,7 @@ Array [
 .c5 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
@ -4470,6 +4495,7 @@ Array [
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -4501,6 +4527,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -4554,6 +4581,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -4585,6 +4613,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -4846,6 +4875,7 @@ Array [
 .c5 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
@ -5299,6 +5329,7 @@ Array [
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -5328,6 +5359,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -5361,6 +5393,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -5392,6 +5425,7 @@ Array [
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -5675,6 +5709,7 @@ Array [
 .c5 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
--- 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
@ -132,6 +132,7 @@ exports[`renders <Summary /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -188,6 +189,7 @@ exports[`renders <Summary /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -196,6 +198,7 @@ exports[`renders <Summary /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -231,6 +234,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 .c18:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -315,6 +319,7 @@ exports[`renders <Summary /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -323,6 +328,7 @@ exports[`renders <Summary /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -356,6 +362,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -440,6 +447,7 @@ exports[`renders <Summary /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -448,6 +456,7 @@ exports[`renders <Summary /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -488,6 +497,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 .c23:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -591,6 +601,7 @@ exports[`renders <Summary /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -599,6 +610,7 @@ exports[`renders <Summary /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -637,6 +649,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -729,6 +742,7 @@ exports[`renders <Summary /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
 }
@ -739,6 +753,7 @@ exports[`renders <Summary /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -861,6 +876,7 @@ exports[`renders <Summary /> without throwing 1`] = `
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1931,6 +1947,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -1987,6 +2004,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1995,6 +2013,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2030,6 +2049,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 .c18:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2114,6 +2134,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2122,6 +2143,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2155,6 +2177,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2239,6 +2262,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2247,6 +2271,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2277,6 +2302,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 .c22:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2344,6 +2370,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2352,6 +2379,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2380,6 +2408,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 .c23:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2447,6 +2476,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2455,6 +2485,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2490,6 +2521,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 .c25:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2576,6 +2608,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2584,6 +2617,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2617,6 +2651,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2692,6 +2727,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
 }
@ -2702,6 +2738,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -3993,6 +4030,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -4049,6 +4087,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4057,6 +4096,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4092,6 +4132,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 .c18:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4176,6 +4217,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4184,6 +4226,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4217,6 +4260,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4301,6 +4345,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4309,6 +4354,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4339,6 +4385,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 .c22:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4406,6 +4453,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4414,6 +4462,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4442,6 +4491,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 .c23:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4509,6 +4559,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4517,6 +4568,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4552,6 +4604,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 .c25:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4638,6 +4691,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4646,6 +4700,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4679,6 +4734,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4754,6 +4810,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
 }
@ -4764,6 +4821,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -6055,6 +6113,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -6164,6 +6223,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6172,6 +6232,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6207,6 +6268,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 .c18:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6291,6 +6353,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6299,6 +6362,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6332,6 +6396,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 .c25:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6416,6 +6481,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6424,6 +6490,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6464,6 +6531,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 .c27:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6567,6 +6635,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6575,6 +6644,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6613,6 +6683,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 .c28:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6705,6 +6776,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
 }
@ -6715,6 +6787,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -6837,6 +6910,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -7959,6 +8033,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -8015,6 +8090,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -8023,6 +8099,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -8058,6 +8135,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 .c18:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -8142,6 +8220,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -8150,6 +8229,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -8183,6 +8263,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -8267,6 +8348,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -8275,6 +8357,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -8305,6 +8388,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 .c22:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -8372,6 +8456,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -8380,6 +8465,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -8408,6 +8494,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 .c23:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -8475,6 +8562,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -8483,6 +8571,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -8518,6 +8607,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 .c25:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -8604,6 +8694,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -8612,6 +8703,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -8645,6 +8737,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -8720,6 +8813,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
 }
@ -8730,6 +8824,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -8853,6 +8948,7 @@ exports[`renders <Summary state /> without throwing 1`] = `
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -9923,6 +10019,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -9979,6 +10076,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -9987,6 +10085,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -10022,6 +10121,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 .c22:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -10106,6 +10206,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -10114,6 +10215,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -10147,6 +10249,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 .c23:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -10231,6 +10334,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -10239,6 +10343,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -10269,6 +10374,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 .c18:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -10336,6 +10442,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -10344,6 +10451,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -10372,6 +10480,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -10439,6 +10548,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -10447,6 +10557,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -10482,6 +10593,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 .c25:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -10568,6 +10680,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -10576,6 +10689,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -10609,6 +10723,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -10684,6 +10799,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
 }
@ -10694,6 +10810,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -10817,6 +10934,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -11887,6 +12005,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -11943,6 +12062,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -11951,6 +12071,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -11986,6 +12107,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 .c18:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -12070,6 +12192,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -12078,6 +12201,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -12111,6 +12235,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -12195,6 +12320,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -12203,6 +12329,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -12243,6 +12370,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 .c23:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -12346,6 +12474,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -12354,6 +12483,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -12392,6 +12522,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -12484,6 +12615,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
 }
@ -12494,6 +12626,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -12617,6 +12750,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
--- 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
@ -35,6 +35,7 @@ exports[`renders <Toolbar /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -83,6 +84,7 @@ exports[`renders <Toolbar /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -91,6 +93,7 @@ exports[`renders <Toolbar /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -116,6 +119,7 @@ exports[`renders <Toolbar /> without throwing 1`] = `
 .c8:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -155,6 +159,7 @@ exports[`renders <Toolbar /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -230,6 +235,7 @@ exports[`renders <Toolbar /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -365,6 +371,7 @@ exports[`renders <Toolbar actionLabel /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -413,6 +420,7 @@ exports[`renders <Toolbar actionLabel /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -421,6 +429,7 @@ exports[`renders <Toolbar actionLabel /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -446,6 +455,7 @@ exports[`renders <Toolbar actionLabel /> without throwing 1`] = `
 .c8:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -485,6 +495,7 @@ exports[`renders <Toolbar actionLabel /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -560,6 +571,7 @@ exports[`renders <Toolbar actionLabel /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -695,6 +707,7 @@ exports[`renders <Toolbar actionable /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -743,6 +756,7 @@ exports[`renders <Toolbar actionable /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -751,6 +765,7 @@ exports[`renders <Toolbar actionable /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -781,6 +796,7 @@ exports[`renders <Toolbar actionable /> without throwing 1`] = `
 .c8:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -837,6 +853,7 @@ exports[`renders <Toolbar actionable /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -912,6 +929,7 @@ exports[`renders <Toolbar actionable /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1047,6 +1065,7 @@ exports[`renders <Toolbar onActionClick /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -1095,6 +1114,7 @@ exports[`renders <Toolbar onActionClick /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1103,6 +1123,7 @@ exports[`renders <Toolbar onActionClick /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1128,6 +1149,7 @@ exports[`renders <Toolbar onActionClick /> without throwing 1`] = `
 .c8:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1167,6 +1189,7 @@ exports[`renders <Toolbar onActionClick /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -1242,6 +1265,7 @@ exports[`renders <Toolbar onActionClick /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1377,6 +1401,7 @@ exports[`renders <Toolbar searchLabel /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -1425,6 +1450,7 @@ exports[`renders <Toolbar searchLabel /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1433,6 +1459,7 @@ exports[`renders <Toolbar searchLabel /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1458,6 +1485,7 @@ exports[`renders <Toolbar searchLabel /> without throwing 1`] = `
 .c8:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1497,6 +1525,7 @@ exports[`renders <Toolbar searchLabel /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -1572,6 +1601,7 @@ exports[`renders <Toolbar searchLabel /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1707,6 +1737,7 @@ exports[`renders <Toolbar searchPlaceholder /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -1755,6 +1786,7 @@ exports[`renders <Toolbar searchPlaceholder /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1763,6 +1795,7 @@ exports[`renders <Toolbar searchPlaceholder /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1788,6 +1821,7 @@ exports[`renders <Toolbar searchPlaceholder /> without throwing 1`] = `
 .c8:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1827,6 +1861,7 @@ exports[`renders <Toolbar searchPlaceholder /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -1902,6 +1937,7 @@ exports[`renders <Toolbar searchPlaceholder /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -2037,6 +2073,7 @@ exports[`renders <Toolbar searchable /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -2085,6 +2122,7 @@ exports[`renders <Toolbar searchable /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2093,6 +2131,7 @@ exports[`renders <Toolbar searchable /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2118,6 +2157,7 @@ exports[`renders <Toolbar searchable /> without throwing 1`] = `
 .c8:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2157,6 +2197,7 @@ exports[`renders <Toolbar searchable /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -2235,6 +2276,7 @@ exports[`renders <Toolbar searchable /> without throwing 1`] = `
  color: rgb(216,216,216);
  cursor: not-allowed;
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
--- a/packages/my-joy-beta/src/components/navigation/tests/snapshots/footer.spec..js.snap
+++ b/packages/my-joy-beta/src/components/navigation/tests/snapshots/footer.spec..js.snap
@ -30,6 +30,7 @@ exports[`renders <Footer/> without throwing 1`] = `
 .c2 {
  color: rgb(151,151,151);
  -webkit-text-decoration: none;
  text-decoration: none;
 }
--- 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
@ -9,6 +9,7 @@ exports[`renders <Menu links /> without throwing 1`] = `
 .c6 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -19,6 +20,7 @@ exports[`renders <Menu links /> without throwing 1`] = `
 }
 .c5:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
@ -39,6 +41,7 @@ exports[`renders <Menu links /> without throwing 1`] = `
 .c4 {
  color: rgb(70,70,70);
  -webkit-text-decoration: none;
  text-decoration: none;
  cursor: pointer;
 }
--- a/packages/my-joy-beta/src/containers/create-instance/tests/__image_snapshots__/networks-ui-js-networks-loading-expanded-1-snap.png
+++ b/packages/my-joy-beta/src/containers/create-instance/tests/__image_snapshots__/networks-ui-js-networks-loading-expanded-1-snap.png
--- 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
@ -424,6 +424,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -485,6 +486,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -493,6 +495,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -513,6 +516,7 @@ Array [
 .c22:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -572,6 +576,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -580,6 +585,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -601,6 +607,7 @@ Array [
 .c25:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -660,6 +667,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -668,6 +676,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -701,6 +710,7 @@ Array [
 .c27:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -776,6 +786,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -790,6 +801,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -1124,6 +1136,7 @@ Array [
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1187,6 +1200,7 @@ Array [
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  resize: vertical;
  font-size: 0.9375rem;
@ -1525,6 +1539,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -1573,6 +1588,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1581,6 +1597,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1600,6 +1617,7 @@ Array [
 .c1:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1659,6 +1677,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1667,6 +1686,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1682,6 +1702,7 @@ Array [
 .c4:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2008,6 +2029,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -2056,6 +2078,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2064,6 +2087,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2083,6 +2107,7 @@ Array [
 .c1:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2142,6 +2167,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2150,6 +2176,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2165,6 +2192,7 @@ Array [
 .c4:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2372,6 +2400,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -2433,6 +2462,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2441,6 +2471,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2461,6 +2492,7 @@ Array [
 .c23:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2520,6 +2552,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2528,6 +2561,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2549,6 +2583,7 @@ Array [
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2608,6 +2643,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2616,6 +2652,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2649,6 +2686,7 @@ Array [
 .c28:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2724,6 +2762,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -2738,6 +2777,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -3063,6 +3103,7 @@ Array [
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -3126,6 +3167,7 @@ Array [
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  resize: vertical;
  font-size: 0.9375rem;
@ -3198,6 +3240,7 @@ Array [
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: block;
 }
@ -3490,6 +3533,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -3551,6 +3595,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3559,6 +3604,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3579,6 +3625,7 @@ Array [
 .c23:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3638,6 +3685,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3646,6 +3694,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3667,6 +3716,7 @@ Array [
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3726,6 +3776,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3734,6 +3785,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3767,6 +3819,7 @@ Array [
 .c28:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3842,6 +3895,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -3856,6 +3910,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -4181,6 +4236,7 @@ Array [
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -4244,6 +4300,7 @@ Array [
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  resize: vertical;
  font-size: 0.9375rem;
@ -4316,6 +4373,7 @@ Array [
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: block;
 }
@ -4879,6 +4937,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -4940,6 +4999,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4948,6 +5008,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4968,6 +5029,7 @@ Array [
 .c23:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -5027,6 +5089,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -5035,6 +5098,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -5056,6 +5120,7 @@ Array [
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -5115,6 +5180,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -5123,6 +5189,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -5156,6 +5223,7 @@ Array [
 .c28:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -5231,6 +5299,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -5245,6 +5314,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -5570,6 +5640,7 @@ Array [
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -5633,6 +5704,7 @@ Array [
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  resize: vertical;
  font-size: 0.9375rem;
@ -5705,6 +5777,7 @@ Array [
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: block;
 }
@ -6016,6 +6089,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -6077,6 +6151,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6085,6 +6160,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6105,6 +6181,7 @@ Array [
 .c23:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6164,6 +6241,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6172,6 +6250,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6193,6 +6272,7 @@ Array [
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6252,6 +6332,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6260,6 +6341,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6293,6 +6375,7 @@ Array [
 .c28:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6368,6 +6451,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -6382,6 +6466,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -6707,6 +6792,7 @@ Array [
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -6770,6 +6856,7 @@ Array [
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  resize: vertical;
  font-size: 0.9375rem;
@ -6842,6 +6929,7 @@ Array [
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: block;
 }
@ -7153,6 +7241,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -7201,6 +7290,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -7209,6 +7299,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -7228,6 +7319,7 @@ Array [
 .c1:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -7287,6 +7379,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -7295,6 +7388,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -7310,6 +7404,7 @@ Array [
 .c4:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
--- 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
@ -550,6 +550,7 @@ Array [
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  -webkit-text-align: center;
  text-align: center;
  margin-bottom: 0;
  margin-left: 0.375rem;
@ -2254,6 +2255,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -2302,6 +2304,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2310,6 +2313,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2325,6 +2329,7 @@ Array [
 .c1:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2824,6 +2829,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -2872,6 +2878,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2880,6 +2887,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2899,6 +2907,7 @@ Array [
 .c1:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
--- 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
@ -426,6 +426,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -474,6 +475,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -482,6 +484,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -502,6 +505,7 @@ Array [
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -561,6 +565,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -569,6 +574,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -590,6 +596,7 @@ Array [
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -649,6 +656,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -657,6 +665,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -690,6 +699,7 @@ Array [
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -765,6 +775,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -779,6 +790,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -1157,6 +1169,7 @@ Array [
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1470,6 +1483,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -1518,6 +1532,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1526,6 +1541,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1545,6 +1561,7 @@ Array [
 .c1:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1604,6 +1621,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1612,6 +1630,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1627,6 +1646,7 @@ Array [
 .c4:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1962,6 +1982,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -2010,6 +2031,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2018,6 +2040,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2037,6 +2060,7 @@ Array [
 .c1:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2096,6 +2120,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2104,6 +2129,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2119,6 +2145,7 @@ Array [
 .c4:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2597,6 +2624,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -2645,6 +2673,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2653,6 +2682,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2672,6 +2702,7 @@ Array [
 .c1:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2731,6 +2762,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2739,6 +2771,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2754,6 +2787,7 @@ Array [
 .c4:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
--- a/packages/my-joy-beta/src/containers/create-instance/tests/snapshots/user-script.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/create-instance/tests/snapshots/user-script.spec.js.snap
@ -148,6 +148,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -209,6 +210,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -217,6 +219,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -237,6 +240,7 @@ Array [
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -296,6 +300,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -304,6 +309,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -325,6 +331,7 @@ Array [
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -384,6 +391,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -392,6 +400,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -425,6 +434,7 @@ Array [
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -500,6 +510,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -514,6 +525,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -850,6 +862,7 @@ Array [
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  resize: vertical;
  font-size: 0.9375rem;
@ -1339,6 +1352,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -1400,6 +1414,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1408,6 +1423,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1428,6 +1444,7 @@ Array [
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1487,6 +1504,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1495,6 +1513,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1516,6 +1535,7 @@ Array [
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1575,6 +1595,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1583,6 +1604,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1616,6 +1638,7 @@ Array [
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1691,6 +1714,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -1705,6 +1729,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -2041,6 +2066,7 @@ Array [
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  resize: vertical;
  font-size: 0.9375rem;
@ -2310,6 +2336,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -2358,6 +2385,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2366,6 +2394,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2385,6 +2414,7 @@ Array [
 .c1:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2444,6 +2474,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2452,6 +2483,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2467,6 +2499,7 @@ Array [
 .c4:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2742,6 +2775,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -2790,6 +2824,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2798,6 +2833,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2817,6 +2853,7 @@ Array [
 .c1:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2876,6 +2913,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2884,6 +2922,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2899,6 +2938,7 @@ Array [
 .c4:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3174,6 +3214,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -3235,6 +3276,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3243,6 +3285,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3263,6 +3306,7 @@ Array [
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3322,6 +3366,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3330,6 +3375,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3351,6 +3397,7 @@ Array [
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3410,6 +3457,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3418,6 +3466,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3451,6 +3500,7 @@ Array [
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3526,6 +3576,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -3540,6 +3591,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -3876,6 +3928,7 @@ Array [
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  resize: vertical;
  font-size: 0.9375rem;
@ -4145,6 +4198,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -4193,6 +4247,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4201,6 +4256,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4216,6 +4272,7 @@ Array [
 .c1:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4483,6 +4540,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -4544,6 +4602,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4552,6 +4611,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4572,6 +4632,7 @@ Array [
 .c22:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4631,6 +4692,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4639,6 +4701,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4660,6 +4723,7 @@ Array [
 .c25:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4719,6 +4783,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4727,6 +4792,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4760,6 +4826,7 @@ Array [
 .c27:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4835,6 +4902,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -4849,6 +4917,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -5176,6 +5245,7 @@ Array [
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  resize: vertical;
  font-size: 0.9375rem;
@ -5248,6 +5318,7 @@ Array [
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: block;
 }
@ -5483,6 +5554,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -5531,6 +5603,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -5539,6 +5612,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -5554,6 +5628,7 @@ Array [
 .c1:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -5821,6 +5896,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -5882,6 +5958,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -5890,6 +5967,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -5910,6 +5988,7 @@ Array [
 .c22:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -5969,6 +6048,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -5977,6 +6057,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -5998,6 +6079,7 @@ Array [
 .c25:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6057,6 +6139,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6065,6 +6148,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6098,6 +6182,7 @@ Array [
 .c27:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6173,6 +6258,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -6187,6 +6273,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -6514,6 +6601,7 @@ Array [
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  resize: vertical;
  font-size: 0.9375rem;
@ -6586,6 +6674,7 @@ Array [
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: block;
 }
@ -6821,6 +6910,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -6869,6 +6959,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6877,6 +6968,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6892,6 +6984,7 @@ Array [
 .c1:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -7084,6 +7177,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -7145,6 +7239,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -7153,6 +7248,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -7173,6 +7269,7 @@ Array [
 .c21:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -7232,6 +7329,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -7240,6 +7338,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -7261,6 +7360,7 @@ Array [
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -7320,6 +7420,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -7328,6 +7429,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -7361,6 +7463,7 @@ Array [
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -7436,6 +7539,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -7450,6 +7554,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -7786,6 +7891,7 @@ Array [
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  resize: vertical;
  font-size: 0.9375rem;
@ -8055,6 +8161,7 @@ Array [
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -8103,6 +8210,7 @@ Array [
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -8111,6 +8219,7 @@ Array [
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -8130,6 +8239,7 @@ Array [
 .c1:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
--- a/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/firewall-ui-js-firewall-1-snap.png
+++ b/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/firewall-ui-js-firewall-1-snap.png
--- a/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/firewall-ui-js-firewall-inactive-1-snap.png
+++ b/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/firewall-ui-js-firewall-inactive-1-snap.png
--- a/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/firewall-ui-js-firewall-loading-1-snap.png
+++ b/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/firewall-ui-js-firewall-loading-1-snap.png
--- a/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/firewall-ui-js-firewall-loading-error-1-snap.png
+++ b/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/firewall-ui-js-firewall-loading-error-1-snap.png
--- a/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/firewall-ui-js-firewall-mutation-error-1-snap.png
+++ b/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/firewall-ui-js-firewall-mutation-error-1-snap.png
--- a/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/list-ui-js-list-1-snap.png
+++ b/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/list-ui-js-list-1-snap.png
--- a/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/list-ui-js-list-error-1-snap.png
+++ b/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/list-ui-js-list-error-1-snap.png
--- a/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/list-ui-js-list-loading-1-snap.png
+++ b/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/list-ui-js-list-loading-1-snap.png
--- a/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/metadata-ui-js-metadata-loading-1-snap.png
+++ b/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/metadata-ui-js-metadata-loading-1-snap.png
--- a/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/networks-ui-js-networks-loading-1-snap.png
+++ b/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/networks-ui-js-networks-loading-1-snap.png
--- a/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/summary-ui-js-summary-loading-1-snap.png
+++ b/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/summary-ui-js-summary-loading-1-snap.png
--- a/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/summary-ui-js-summary-mutation-error-1-snap.png
+++ b/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/summary-ui-js-summary-mutation-error-1-snap.png
--- a/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png
+++ b/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png
--- a/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/tags-ui-js-tags-editing-removing-1-snap.png
+++ b/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/tags-ui-js-tags-editing-removing-1-snap.png
--- a/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/tags-ui-js-tags-loading-1-snap.png
+++ b/packages/my-joy-beta/src/containers/instances/tests/__image_snapshots__/tags-ui-js-tags-loading-1-snap.png
--- a/packages/my-joy-beta/src/containers/instances/tests/snapshots/cns.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/instances/tests/snapshots/cns.spec.js.snap
@ -44,6 +44,7 @@ exports[`renders <Cns /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -99,6 +100,7 @@ exports[`renders <Cns /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -107,6 +109,7 @@ exports[`renders <Cns /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -122,6 +125,7 @@ exports[`renders <Cns /> without throwing 1`] = `
 .c22:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -153,6 +157,7 @@ exports[`renders <Cns /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -371,6 +376,7 @@ exports[`renders <Cns /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -810,6 +816,7 @@ exports[`renders <Cns disabled /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -1196,6 +1203,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -1255,6 +1263,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1263,6 +1272,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1278,6 +1288,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
 .c31:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1309,6 +1320,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -1557,6 +1569,7 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -2763,6 +2776,7 @@ exports[`renders <Cns loading /> without throwing 1`] = `
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  -webkit-text-align: center;
  text-align: center;
  margin-bottom: 0;
  margin-left: 0.375rem;
@ -2991,6 +3005,7 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -3055,6 +3070,7 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3063,6 +3079,7 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3078,6 +3095,7 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
 .c27:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3109,6 +3127,7 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -3337,6 +3356,7 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -3690,6 +3710,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -3749,6 +3770,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3757,6 +3779,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3772,6 +3795,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
 .c36:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3803,6 +3827,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -3817,6 +3842,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -4162,6 +4188,7 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
  color: rgb(216,216,216);
  cursor: not-allowed;
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -5416,6 +5443,7 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -5480,6 +5508,7 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -5488,6 +5517,7 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -5503,6 +5533,7 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
 .c27:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -5534,6 +5565,7 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -5786,6 +5818,7 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -6276,6 +6309,7 @@ exports[`renders <Cns services /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -6336,6 +6370,7 @@ exports[`renders <Cns services /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6344,6 +6379,7 @@ exports[`renders <Cns services /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6359,6 +6395,7 @@ exports[`renders <Cns services /> without throwing 1`] = `
 .c28:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6390,6 +6427,7 @@ exports[`renders <Cns services /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -6608,6 +6646,7 @@ exports[`renders <Cns services /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -7215,6 +7254,7 @@ exports[`renders <Cns services hostnames /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
--- a/packages/my-joy-beta/src/containers/instances/tests/snapshots/firewall.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/instances/tests/snapshots/firewall.spec.js.snap
@ -40,6 +40,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -304,6 +305,7 @@ Array [
 .c20 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
@ -738,6 +740,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -1002,6 +1005,7 @@ Array [
 .c21 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
@ -1481,6 +1485,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -1745,6 +1750,7 @@ Array [
 .c20 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
@ -2179,6 +2185,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -2443,6 +2450,7 @@ Array [
 .c21 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
@ -2935,6 +2943,7 @@ Array [
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  -webkit-text-align: center;
  text-align: center;
  margin-bottom: 0;
  margin-left: 0.375rem;
@ -3168,6 +3177,7 @@ Array [
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  -webkit-text-align: center;
  text-align: center;
  margin-bottom: 0;
  margin-left: 0.375rem;
@ -3405,6 +3415,7 @@ exports[`renders <Firewall loadingError /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -3703,6 +3714,7 @@ exports[`renders <Firewall loadingError /> without throwing 1`] = `
 .c26 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
@ -4174,6 +4186,7 @@ exports[`renders <Firewall mutationError /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -4472,6 +4485,7 @@ exports[`renders <Firewall mutationError /> without throwing 1`] = `
 .c26 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
@ -4919,6 +4933,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -5267,6 +5282,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -5656,6 +5672,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -6507,6 +6524,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -6855,6 +6873,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -7244,6 +7263,7 @@ Array [
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
--- 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
@ -19,6 +19,7 @@ exports[`renders <List /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -148,6 +149,7 @@ exports[`renders <List /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -156,6 +158,7 @@ exports[`renders <List /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -181,6 +184,7 @@ exports[`renders <List /> without throwing 1`] = `
 .c10:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -220,6 +224,7 @@ exports[`renders <List /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -476,6 +481,7 @@ exports[`renders <List /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -564,6 +570,7 @@ exports[`renders <List /> without throwing 1`] = `
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -593,6 +600,7 @@ exports[`renders <List /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -626,6 +634,7 @@ exports[`renders <List /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -657,6 +666,7 @@ exports[`renders <List /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -688,6 +698,7 @@ exports[`renders <List /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -748,6 +759,7 @@ exports[`renders <List /> without throwing 1`] = `
 .c37 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
@ -1268,6 +1280,7 @@ exports[`renders <List error /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -1406,6 +1419,7 @@ exports[`renders <List error /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1414,6 +1428,7 @@ exports[`renders <List error /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1439,6 +1454,7 @@ exports[`renders <List error /> without throwing 1`] = `
 .c10:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1478,6 +1494,7 @@ exports[`renders <List error /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -1768,6 +1785,7 @@ exports[`renders <List error /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1856,6 +1874,7 @@ exports[`renders <List error /> without throwing 1`] = `
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1885,6 +1904,7 @@ exports[`renders <List error /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1918,6 +1938,7 @@ exports[`renders <List error /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1949,6 +1970,7 @@ exports[`renders <List error /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -1980,6 +2002,7 @@ exports[`renders <List error /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -2040,6 +2063,7 @@ exports[`renders <List error /> without throwing 1`] = `
 .c43 {
  color: rgb(151,151,151);
  -webkit-text-align: center;
  text-align: center;
 }
@ -2569,6 +2593,7 @@ exports[`renders <List instances /> without throwing 1`] = `
 .c36 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -2579,6 +2604,7 @@ exports[`renders <List instances /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -2674,6 +2700,7 @@ exports[`renders <List instances /> without throwing 1`] = `
 }
 .c35:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
@ -2717,6 +2744,7 @@ exports[`renders <List instances /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2725,6 +2753,7 @@ exports[`renders <List instances /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2750,6 +2779,7 @@ exports[`renders <List instances /> without throwing 1`] = `
 .c10:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2789,6 +2819,7 @@ exports[`renders <List instances /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -2981,6 +3012,7 @@ exports[`renders <List instances /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -3087,6 +3119,7 @@ exports[`renders <List instances /> without throwing 1`] = `
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -3116,6 +3149,7 @@ exports[`renders <List instances /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -3149,6 +3183,7 @@ exports[`renders <List instances /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -3180,6 +3215,7 @@ exports[`renders <List instances /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -3211,6 +3247,7 @@ exports[`renders <List instances /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -3259,6 +3296,7 @@ exports[`renders <List instances /> without throwing 1`] = `
  padding: 0 1.5rem;
  height: 3.75rem;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -3283,6 +3321,7 @@ exports[`renders <List instances /> without throwing 1`] = `
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -3307,6 +3346,7 @@ exports[`renders <List instances /> without throwing 1`] = `
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -3378,6 +3418,7 @@ exports[`renders <List instances /> without throwing 1`] = `
 .c34 {
  color: rgba(73,73,73,1);
  -webkit-text-decoration: none;
  text-decoration: none;
  font-weight: 600;
 }
@ -3899,6 +3940,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
 .c36 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -3909,6 +3951,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -4004,6 +4047,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
 }
 .c35:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
@ -4047,6 +4091,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4055,6 +4100,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4080,6 +4126,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
 .c10:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4130,6 +4177,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4138,6 +4186,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4173,6 +4222,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
 .c46:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4257,6 +4307,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4265,6 +4316,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4297,6 +4349,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
 .c47:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4381,6 +4434,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4389,6 +4443,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4429,6 +4484,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
 .c49:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4532,6 +4588,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4540,6 +4597,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4577,6 +4635,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
 .c50:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4669,6 +4728,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -4954,6 +5014,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -5060,6 +5121,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -5089,6 +5151,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -5122,6 +5185,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -5153,6 +5217,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -5184,6 +5249,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -5232,6 +5298,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  padding: 0 1.5rem;
  height: 3.75rem;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -5256,6 +5323,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -5280,6 +5348,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -5351,6 +5420,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
 .c34 {
  color: rgba(73,73,73,1);
  -webkit-text-decoration: none;
  text-decoration: none;
  font-weight: 600;
 }
@ -6253,6 +6323,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
 .c36 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -6263,6 +6334,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -6358,6 +6430,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
 }
 .c35:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
@ -6401,6 +6474,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6409,6 +6483,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6434,6 +6509,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
 .c10:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6484,6 +6560,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6492,6 +6569,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6527,6 +6605,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
 .c46:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6611,6 +6690,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6619,6 +6699,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6651,6 +6732,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
 .c47:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6735,6 +6817,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6743,6 +6826,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6783,6 +6867,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
 .c49:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6886,6 +6971,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6894,6 +6980,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6931,6 +7018,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
 .c50:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -7023,6 +7111,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -7308,6 +7397,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -7414,6 +7504,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -7443,6 +7534,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -7476,6 +7568,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -7507,6 +7600,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -7538,6 +7632,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -7586,6 +7681,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  padding: 0 1.5rem;
  height: 3.75rem;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -7610,6 +7706,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -7634,6 +7731,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -7705,6 +7803,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
 .c34 {
  color: rgba(73,73,73,1);
  -webkit-text-decoration: none;
  text-decoration: none;
  font-weight: 600;
 }
@ -8607,6 +8706,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
 .c36 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -8617,6 +8717,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -8712,6 +8813,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
 }
 .c35:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
@ -8755,6 +8857,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -8763,6 +8866,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -8788,6 +8892,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
 .c10:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -8838,6 +8943,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -8846,6 +8952,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -8881,6 +8988,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
 .c48:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -8965,6 +9073,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -8973,6 +9082,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -9005,6 +9115,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
 .c49:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -9089,6 +9200,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -9097,6 +9209,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -9137,6 +9250,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
 .c51:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -9240,6 +9354,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -9248,6 +9363,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -9285,6 +9401,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
 .c52:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -9388,6 +9505,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -9396,6 +9514,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -9426,6 +9545,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
 .c46:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -9493,6 +9613,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -9501,6 +9622,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -9528,6 +9650,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
 .c47:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -9584,6 +9707,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -9869,6 +9993,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -9975,6 +10100,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  width: 2rem;
  display: table-cell;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -10004,6 +10130,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -10037,6 +10164,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -10068,6 +10196,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -10099,6 +10228,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  height: 2.625rem;
  color: rgb(189,189,189);
@ -10147,6 +10277,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  padding: 0 1.5rem;
  height: 3.75rem;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -10171,6 +10302,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -10195,6 +10327,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
  width: 0rem;
  display: none;
  vertical-align: middle;
  -webkit-text-align: left;
  text-align: left;
  border-bottom-width: 0;
 }
@ -10266,6 +10399,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
 .c34 {
  color: rgba(73,73,73,1);
  -webkit-text-decoration: none;
  text-decoration: none;
  font-weight: 600;
 }
@ -11172,6 +11306,7 @@ exports[`renders <List loading /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -11234,6 +11369,7 @@ exports[`renders <List loading /> without throwing 1`] = `
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  -webkit-text-align: center;
  text-align: center;
  margin-bottom: 0;
  margin-left: 0.375rem;
@ -11289,6 +11425,7 @@ exports[`renders <List loading /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -11297,6 +11434,7 @@ exports[`renders <List loading /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -11322,6 +11460,7 @@ exports[`renders <List loading /> without throwing 1`] = `
 .c10:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -11361,6 +11500,7 @@ exports[`renders <List loading /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -11486,6 +11626,7 @@ exports[`renders <List loading /> without throwing 1`] = `
  color: rgb(216,216,216);
  cursor: not-allowed;
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
--- 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
@ -15,6 +15,7 @@ exports[`renders <Metadata /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -63,6 +64,7 @@ exports[`renders <Metadata /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -71,6 +73,7 @@ exports[`renders <Metadata /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -96,6 +99,7 @@ exports[`renders <Metadata /> without throwing 1`] = `
 .c9:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -135,6 +139,7 @@ exports[`renders <Metadata /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -291,6 +296,7 @@ exports[`renders <Metadata /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -480,6 +486,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -541,6 +548,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -549,6 +557,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -574,6 +583,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
 .c9:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -624,6 +634,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -632,6 +643,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -652,6 +664,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
 .c34:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -711,6 +724,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -719,6 +733,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -740,6 +755,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
 .c35:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -799,6 +815,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -807,6 +824,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -840,6 +858,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
 .c37:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -915,6 +934,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -929,6 +949,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -1365,6 +1386,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1428,6 +1450,7 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  resize: vertical;
  font-size: 0.9375rem;
@ -1855,6 +1878,7 @@ exports[`renders <Metadata error /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -1912,6 +1936,7 @@ exports[`renders <Metadata error /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1920,6 +1945,7 @@ exports[`renders <Metadata error /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1945,6 +1971,7 @@ exports[`renders <Metadata error /> without throwing 1`] = `
 .c9:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1984,6 +2011,7 @@ exports[`renders <Metadata error /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -2174,6 +2202,7 @@ exports[`renders <Metadata error /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -2370,6 +2399,7 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -2432,6 +2462,7 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  -webkit-text-align: center;
  text-align: center;
  margin-bottom: 0;
  margin-left: 0.375rem;
@ -2487,6 +2518,7 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2495,6 +2527,7 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2525,6 +2558,7 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
 .c9:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2581,6 +2615,7 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -2706,6 +2741,7 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
  color: rgb(216,216,216);
  cursor: not-allowed;
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -2926,6 +2962,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -3040,6 +3077,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3048,6 +3086,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3073,6 +3112,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
 .c9:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3123,6 +3163,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3131,6 +3172,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3151,6 +3193,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
 .c38:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3210,6 +3253,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3218,6 +3262,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3239,6 +3284,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
 .c39:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3298,6 +3344,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3306,6 +3353,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3339,6 +3387,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
 .c41:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3425,6 +3474,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3433,6 +3483,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3471,6 +3522,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
 .c42:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3563,6 +3615,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -3577,6 +3630,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -4004,6 +4058,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -4067,6 +4122,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
  font-family: "Roboto Mono",monospace;
  width: 100%;
  min-width: 100%;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  resize: vertical;
  font-size: 0.9375rem;
@ -4139,6 +4195,7 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: block;
 }
--- a/packages/my-joy-beta/src/containers/instances/tests/snapshots/networks.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/instances/tests/snapshots/networks.spec.js.snap
@ -438,6 +438,7 @@ exports[`renders <Networks loading /> without throwing 1`] = `
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  -webkit-text-align: center;
  text-align: center;
  margin-bottom: 0;
  margin-left: 0.375rem;
--- 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
@ -37,6 +37,7 @@ exports[`renders <Summary /> without throwing 1`] = `
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  -webkit-text-align: center;
  text-align: center;
  margin-bottom: 0;
  margin-left: 0.375rem;
@ -203,6 +204,7 @@ exports[`renders <Summary loading /> without throwing 1`] = `
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  -webkit-text-align: center;
  text-align: center;
  margin-bottom: 0;
  margin-left: 0.375rem;
@ -369,6 +371,7 @@ exports[`renders <Summary loadingError /> without throwing 1`] = `
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  -webkit-text-align: center;
  text-align: center;
  margin-bottom: 0;
  margin-left: 0.375rem;
@ -535,6 +538,7 @@ exports[`renders <Summary mutationError /> without throwing 1`] = `
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  -webkit-text-align: center;
  text-align: center;
  margin-bottom: 0;
  margin-left: 0.375rem;
@ -765,6 +769,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  -webkit-text-align: center;
  text-align: center;
  margin-bottom: 0;
  margin-left: 0.375rem;
@ -919,6 +924,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -975,6 +981,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -983,6 +990,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1018,6 +1026,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 .c19:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1102,6 +1111,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1110,6 +1120,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1143,6 +1154,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 .c22:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1227,6 +1239,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1235,6 +1248,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1265,6 +1279,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 .c23:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1332,6 +1347,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1340,6 +1356,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1368,6 +1385,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1435,6 +1453,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1443,6 +1462,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1478,6 +1498,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1564,6 +1585,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1572,6 +1594,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1605,6 +1628,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 .c27:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1680,6 +1704,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
 }
@ -1690,6 +1715,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -3019,6 +3045,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -3075,6 +3102,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3083,6 +3111,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3118,6 +3147,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 .c19:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3202,6 +3232,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3210,6 +3241,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3243,6 +3275,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 .c22:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3327,6 +3360,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3335,6 +3369,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3365,6 +3400,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 .c23:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3432,6 +3468,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3440,6 +3477,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3468,6 +3506,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 .c24:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3535,6 +3574,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3543,6 +3583,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3578,6 +3619,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 .c26:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3664,6 +3706,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3672,6 +3715,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3705,6 +3749,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 .c27:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3780,6 +3825,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
 }
@ -3790,6 +3836,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
--- 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
@ -16,6 +16,7 @@ exports[`renders <Tags /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -64,6 +65,7 @@ exports[`renders <Tags /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -72,6 +74,7 @@ exports[`renders <Tags /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -97,6 +100,7 @@ exports[`renders <Tags /> without throwing 1`] = `
 .c9:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -136,6 +140,7 @@ exports[`renders <Tags /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -292,6 +297,7 @@ exports[`renders <Tags /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -497,6 +503,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -545,6 +552,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -553,6 +561,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -578,6 +587,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
 .c9:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -628,6 +638,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -636,6 +647,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -656,6 +668,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
 .c34:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -715,6 +728,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -723,6 +737,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -744,6 +759,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
 .c35:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -803,6 +819,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -811,6 +828,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -844,6 +862,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
 .c37:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -919,6 +938,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -933,6 +953,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -1432,6 +1453,7 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -1851,6 +1873,7 @@ exports[`renders <Tags editable /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -1899,6 +1922,7 @@ exports[`renders <Tags editable /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -1907,6 +1931,7 @@ exports[`renders <Tags editable /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -1932,6 +1957,7 @@ exports[`renders <Tags editable /> without throwing 1`] = `
 .c9:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -1971,6 +1997,7 @@ exports[`renders <Tags editable /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -2127,6 +2154,7 @@ exports[`renders <Tags editable /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -2332,6 +2360,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -2380,6 +2409,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2388,6 +2418,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2408,6 +2439,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
 .c34:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2467,6 +2499,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2475,6 +2508,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2496,6 +2530,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
 .c35:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2555,6 +2590,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2563,6 +2599,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2596,6 +2633,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
 .c37:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2682,6 +2720,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -2690,6 +2729,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -2720,6 +2760,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
 .c9:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -2776,6 +2817,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -2790,6 +2832,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -3270,6 +3313,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -3325,6 +3369,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: block;
 }
@ -3738,6 +3783,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -3839,6 +3885,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3847,6 +3894,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3867,6 +3915,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
 .c34:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -3926,6 +3975,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -3934,6 +3984,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -3955,6 +4006,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
 .c35:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4014,6 +4066,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4022,6 +4075,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4052,6 +4106,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
 .c9:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4119,6 +4174,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -4127,6 +4183,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -4165,6 +4222,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
 .c37:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -4257,6 +4315,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -4271,6 +4330,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  font-size: 0.8125rem;
@ -4751,6 +4811,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -4806,6 +4867,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: block;
 }
@ -5215,6 +5277,7 @@ exports[`renders <Tags error /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -5263,6 +5326,7 @@ exports[`renders <Tags error /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -5271,6 +5335,7 @@ exports[`renders <Tags error /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -5296,6 +5361,7 @@ exports[`renders <Tags error /> without throwing 1`] = `
 .c9:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -5335,6 +5401,7 @@ exports[`renders <Tags error /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -5491,6 +5558,7 @@ exports[`renders <Tags error /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -5678,6 +5746,7 @@ exports[`renders <Tags loading /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -5740,6 +5809,7 @@ exports[`renders <Tags loading /> without throwing 1`] = `
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  -webkit-text-align: center;
  text-align: center;
  margin-bottom: 0;
  margin-left: 0.375rem;
@ -5795,6 +5865,7 @@ exports[`renders <Tags loading /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -5803,6 +5874,7 @@ exports[`renders <Tags loading /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -5828,6 +5900,7 @@ exports[`renders <Tags loading /> without throwing 1`] = `
 .c9:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -5867,6 +5940,7 @@ exports[`renders <Tags loading /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -5992,6 +6066,7 @@ exports[`renders <Tags loading /> without throwing 1`] = `
  color: rgb(216,216,216);
  cursor: not-allowed;
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -6201,6 +6276,7 @@ exports[`renders <Tags tags /> without throwing 1`] = `
  line-height: 1.15;
  margin: 0;
  overflow: visible;
  -webkit-text-transform: none;
  text-transform: none;
  -webkit-appearance: button;
  -moz-appearance: button;
@ -6249,6 +6325,7 @@ exports[`renders <Tags tags /> without throwing 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -6257,6 +6334,7 @@ exports[`renders <Tags tags /> without throwing 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -6282,6 +6360,7 @@ exports[`renders <Tags tags /> without throwing 1`] = `
 .c9:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -6321,6 +6400,7 @@ exports[`renders <Tags tags /> without throwing 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -6477,6 +6557,7 @@ exports[`renders <Tags tags /> without throwing 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
--- a/packages/ui-toolkit/src/anchor/tests_/snapshots/anchor.spec.js.snap
+++ b/packages/ui-toolkit/src/anchor/tests_/snapshots/anchor.spec.js.snap
@ -3,6 +3,7 @@
 exports[`Anchor Default Anchor 1`] = `
 .c1 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -13,6 +14,7 @@ exports[`Anchor Default Anchor 1`] = `
 }
 .c0:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
@ -27,6 +29,7 @@ exports[`Anchor Default Anchor 1`] = `
 exports[`Anchor Disabled Anchor 1`] = `
 .c1 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -40,10 +43,12 @@ exports[`Anchor Disabled Anchor 1`] = `
 }
 .c0:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
 .c0:hover {
  -webkit-text-decoration: underline;
  text-decoration: underline;
 }
@ -59,6 +64,7 @@ exports[`Anchor Disabled Anchor 1`] = `
 exports[`Anchor Reversed Anchor 1`] = `
 .c1 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -71,6 +77,7 @@ exports[`Anchor Reversed Anchor 1`] = `
 }
 .c0:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
--- a/packages/ui-toolkit/src/button/tests_/snapshots/button.spec.js.snap
+++ b/packages/ui-toolkit/src/button/tests_/snapshots/button.spec.js.snap
@ -3,6 +3,7 @@
 exports[`Button Default Button 1`] = `
 .c3 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -13,6 +14,7 @@ exports[`Button Default Button 1`] = `
 }
 .c2:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
@ -38,6 +40,7 @@ exports[`Button Default Button 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -46,6 +49,7 @@ exports[`Button Default Button 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -61,6 +65,7 @@ exports[`Button Default Button 1`] = `
 .c0:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -96,6 +101,7 @@ exports[`Button Default Button 1`] = `
 exports[`Button Disabled Button 1`] = `
 .c3 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -109,10 +115,12 @@ exports[`Button Disabled Button 1`] = `
 }
 .c2:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
 .c2:hover {
  -webkit-text-decoration: underline;
  text-decoration: underline;
 }
@ -138,6 +146,7 @@ exports[`Button Disabled Button 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -146,6 +155,7 @@ exports[`Button Disabled Button 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -166,6 +176,7 @@ exports[`Button Disabled Button 1`] = `
 .c0:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -219,6 +230,7 @@ exports[`Button Disabled Button 1`] = `
 exports[`Button Error Button 1`] = `
 .c3 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -229,6 +241,7 @@ exports[`Button Error Button 1`] = `
 }
 .c2:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
@ -254,6 +267,7 @@ exports[`Button Error Button 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -262,6 +276,7 @@ exports[`Button Error Button 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -281,6 +296,7 @@ exports[`Button Error Button 1`] = `
 .c0:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -335,6 +351,7 @@ exports[`Button Error Button 1`] = `
 exports[`Button Loading Button 1`] = `
 .c3 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -348,10 +365,12 @@ exports[`Button Loading Button 1`] = `
 }
 .c2:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
 .c2:hover {
  -webkit-text-decoration: underline;
  text-decoration: underline;
 }
@ -377,6 +396,7 @@ exports[`Button Loading Button 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -385,6 +405,7 @@ exports[`Button Loading Button 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -405,6 +426,7 @@ exports[`Button Loading Button 1`] = `
 .c0:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
@ -458,6 +480,7 @@ exports[`Button Loading Button 1`] = `
 exports[`Button Secondary Button 1`] = `
 .c3 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -470,6 +493,7 @@ exports[`Button Secondary Button 1`] = `
 }
 .c2:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
@ -495,6 +519,7 @@ exports[`Button Secondary Button 1`] = `
  position: relative;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
  font-size: 0.9375rem;
  -webkit-text-align: center;
  text-align: center;
  font-style: normal;
  font-stretch: normal;
@ -503,6 +528,7 @@ exports[`Button Secondary Button 1`] = `
  -moz-letter-spacing: normal;
  -ms-letter-spacing: normal;
  letter-spacing: normal;
  -webkit-text-decoration: none;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
@ -522,6 +548,7 @@ exports[`Button Secondary Button 1`] = `
 .c0:focus {
  outline: 0;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgb(59,70,204);
  border-color: rgb(45,56,132);
--- a/packages/ui-toolkit/src/form/tests/snapshots/form.spec.js.snap
+++ b/packages/ui-toolkit/src/form/tests/snapshots/form.spec.js.snap
@ -137,6 +137,7 @@ exports[`Form Checkbox 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -217,6 +218,7 @@ exports[`Form FormLabel 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -240,6 +242,7 @@ exports[`Form FormMeta 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  color: rgb(210,67,58);
@ -255,6 +258,7 @@ exports[`Form FormMeta 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  color: rgb(227,130,0);
@ -270,6 +274,7 @@ exports[`Form FormMeta 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  float: right;
  color: rgb(0,152,88);
@ -309,6 +314,7 @@ exports[`Form Input 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -506,6 +512,7 @@ exports[`Form Radio 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
@ -603,6 +610,7 @@ exports[`Form Select 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -707,6 +715,7 @@ exports[`Form Textarea 1`] = `
  border: 0.0625rem solid rgb(216,216,216);
  color: rgba(73,73,73,1);
  max-width: 22.1875rem;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  line-height: normal !important;
@ -796,6 +805,7 @@ exports[`Form Toggle 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
  margin-right: 0.75rem;
  font-weight: 600;
--- a/packages/ui-toolkit/src/label/test/snapshots/label.spec.js.snap
+++ b/packages/ui-toolkit/src/label/test/snapshots/label.spec.js.snap
@ -8,6 +8,7 @@ exports[`label label 1`] = `
  font-stretch: normal;
  display: block;
  color: rgb(70,70,70);
  -webkit-text-align: left;
  text-align: left;
 }
--- a/packages/ui-toolkit/src/section-list/tests/snapshots/section.spec.js.snap
+++ b/packages/ui-toolkit/src/section-list/tests/snapshots/section.spec.js.snap
@ -3,6 +3,7 @@
 exports[`SectionList Anchor 1`] = `
 .c2 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -13,11 +14,13 @@ exports[`SectionList Anchor 1`] = `
 }
 .c1:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
 .c0 {
  color: rgb(70,70,70);
  -webkit-text-decoration: none;
  text-decoration: none;
  cursor: pointer;
 }
@ -37,6 +40,7 @@ exports[`SectionList Anchor 1`] = `
 exports[`SectionList Anchor 2`] = `
 .c2 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -47,11 +51,13 @@ exports[`SectionList Anchor 2`] = `
 }
 .c1:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
 .c0 {
  color: rgb(70,70,70);
  -webkit-text-decoration: none;
  text-decoration: none;
  cursor: pointer;
  color: rgb(59,70,204);
@ -73,6 +79,7 @@ exports[`SectionList Anchor 2`] = `
 exports[`SectionList Item 1`] = `
 .c3 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -83,6 +90,7 @@ exports[`SectionList Item 1`] = `
 }
 .c2:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
@ -95,6 +103,7 @@ exports[`SectionList Item 1`] = `
 .c1 {
  color: rgb(70,70,70);
  -webkit-text-decoration: none;
  text-decoration: none;
  cursor: pointer;
 }
@ -118,6 +127,7 @@ exports[`SectionList Item 1`] = `
 exports[`SectionList SectionList 1`] = `
 .c4 {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
 }
@ -128,6 +138,7 @@ exports[`SectionList SectionList 1`] = `
 }
 .c3:hover {
  -webkit-text-decoration: none;
  text-decoration: none;
 }
@ -140,6 +151,7 @@ exports[`SectionList SectionList 1`] = `
 .c2 {
  color: rgb(70,70,70);
  -webkit-text-decoration: none;
  text-decoration: none;
  cursor: pointer;
  color: rgb(59,70,204);
@ -153,6 +165,7 @@ exports[`SectionList SectionList 1`] = `
 .c5 {
  color: rgb(70,70,70);
  -webkit-text-decoration: none;
  text-decoration: none;
  cursor: pointer;
 }
--- a/packages/ui-toolkit/src/status-loader/tests/snapshots/loading.spec.js.snap
+++ b/packages/ui-toolkit/src/status-loader/tests/snapshots/loading.spec.js.snap
@ -65,6 +65,7 @@ exports[`StatusLoader StatusLoader 1`] = `
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  -webkit-text-align: center;
  text-align: center;
  margin-bottom: 0;
  margin-left: 0.375rem;
--- a/yarn.lock
+++ b/yarn.lock
@ -367,28 +367,28 @@ anymatch@^2.0.0:
    normalize-path "^2.1.1"
 apollo-cache-inmemory@^1.1.5, apollo-cache-inmemory@^1.1.7:
-  version "1.1.7"
+  version "1.1.9"
-  resolved "https://registry.yarnpkg.com/apollo-cache-inmemory/-/apollo-cache-inmemory-1.1.7.tgz#15e6200f70431414d29bd5f20e86d81739e26430"
+  resolved "https://registry.yarnpkg.com/apollo-cache-inmemory/-/apollo-cache-inmemory-1.1.9.tgz#8bcd05e8ec4e7dc5ffda7f68252244cab3197b71"
  dependencies:
-    apollo-cache "^1.1.2"
+    apollo-cache "^1.1.4"
-    apollo-utilities "^1.0.6"
+    apollo-utilities "^1.0.8"
-    graphql-anywhere "^4.1.3"
+    graphql-anywhere "^4.1.5"
-apollo-cache@^1.1.2:
+apollo-cache@^1.1.4:
-  version "1.1.2"
+  version "1.1.4"
-  resolved "https://registry.yarnpkg.com/apollo-cache/-/apollo-cache-1.1.2.tgz#b1843a0e01d3837239e9925cfaa1d786599b77a9"
+  resolved "https://registry.yarnpkg.com/apollo-cache/-/apollo-cache-1.1.4.tgz#a06544fdf4d946114168660961cf7a1fd340d8d6"
  dependencies:
-    apollo-utilities "^1.0.6"
+    apollo-utilities "^1.0.8"
 apollo-client@^2.2.0, apollo-client@^2.2.3:
-  version "2.2.3"
+  version "2.2.5"
-  resolved "https://registry.yarnpkg.com/apollo-client/-/apollo-client-2.2.3.tgz#a8df51c9ff89acb0d98de81b911e56b1ce468ca3"
+  resolved "https://registry.yarnpkg.com/apollo-client/-/apollo-client-2.2.5.tgz#bc00704aa181d0ec299fd5bb2b72d0b44800f5d0"
  dependencies:
    "@types/zen-observable" "^0.5.3"
-    apollo-cache "^1.1.2"
+    apollo-cache "^1.1.4"
    apollo-link "^1.0.0"
    apollo-link-dedup "^1.0.0"
-    apollo-utilities "^1.0.6"
+    apollo-utilities "^1.0.8"
    symbol-observable "^1.0.2"
    zen-observable "^0.7.0"
  optionalDependencies:
@ -425,7 +425,7 @@ apollo-server-module-graphiql@^1.3.2:
  version "1.3.2"
  resolved "https://registry.yarnpkg.com/apollo-server-module-graphiql/-/apollo-server-module-graphiql-1.3.2.tgz#0a9e4c48dece3af904fee333f95f7b9817335ca7"
-apollo-utilities@1.0.4, apollo-utilities@^1.0.0, apollo-utilities@^1.0.1, apollo-utilities@^1.0.6:
+apollo-utilities@1.0.4, apollo-utilities@^1.0.0, apollo-utilities@^1.0.1, apollo-utilities@^1.0.8:
  version "1.0.4"
  resolved "https://registry.yarnpkg.com/apollo-utilities/-/apollo-utilities-1.0.4.tgz#560009ea5541b9fdc4ee07ebb1714ee319a76c15"
@ -555,8 +555,8 @@ are-we-there-yet@~1.1.2:
    readable-stream "^2.0.6"
 argparse@^1.0.7:
-  version "1.0.9"
+  version "1.0.10"
-  resolved "https://registry.yarnpkg.com/argparse/-/argparse-1.0.9.tgz#73d83bc263f86e97f8cc4f6bae1b0e90a7d22c86"
+  resolved "https://registry.yarnpkg.com/argparse/-/argparse-1.0.10.tgz#bcd6791ea5ae09725e17e5ad988134cd40b3d911"
  dependencies:
    sprintf-js "~1.0.2"
@ -1738,8 +1738,8 @@ balanced-match@^1.0.0:
  resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.0.tgz#89b4d199ab2bee49de164ea02b89ce462d71b767"
 base64-js@^1.0.2:
-  version "1.2.1"
+  version "1.2.3"
-  resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.2.1.tgz#a91947da1f4a516ea38e5b4ec0ec3773675e0886"
+  resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.2.3.tgz#fb13668233d9614cf5fb4bce95a9ba4096cdf801"
 base@^0.11.1:
  version "0.11.2"
@ -2039,8 +2039,8 @@ buffer@^4.3.0:
    isarray "^1.0.0"
 buffer@^5.0.3:
-  version "5.0.8"
+  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/buffer/-/buffer-5.0.8.tgz#84daa52e7cf2fa8ce4195bc5cf0f7809e0930b24"
+  resolved "https://registry.yarnpkg.com/buffer/-/buffer-5.1.0.tgz#c913e43678c7cb7c8bd16afbcddb6c5505e8f9fe"
  dependencies:
    base64-js "^1.0.2"
    ieee754 "^1.1.4"
@ -2733,7 +2733,7 @@ conventional-changelog-atom@^0.2.2:
  dependencies:
    q "^1.4.1"
-conventional-changelog-cli@^1.3.2:
+conventional-changelog-cli@^1.3.13:
  version "1.3.13"
  resolved "https://registry.yarnpkg.com/conventional-changelog-cli/-/conventional-changelog-cli-1.3.13.tgz#8cb5855bc3c684aa8f5dc96e848d1fa5a82eee1e"
  dependencies:
@ -2858,7 +2858,7 @@ conventional-commits-parser@^2.1.1, conventional-commits-parser@^2.1.3:
    through2 "^2.0.0"
    trim-off-newlines "^1.0.0"
-conventional-recommended-bump@^1.0.1:
+conventional-recommended-bump@^1.2.1:
  version "1.2.1"
  resolved "https://registry.yarnpkg.com/conventional-recommended-bump/-/conventional-recommended-bump-1.2.1.tgz#1b7137efb5091f99fe009e2fe9ddb7cc490e9375"
  dependencies:
@ -3699,8 +3699,8 @@ envir@^1.0.0:
    jessy "^2.0.0"
 errno@^0.1.3, errno@^0.1.4:
-  version "0.1.6"
+  version "0.1.7"
-  resolved "https://registry.yarnpkg.com/errno/-/errno-0.1.6.tgz#c386ce8a6283f14fc09563b71560908c9bf53026"
+  resolved "https://registry.yarnpkg.com/errno/-/errno-0.1.7.tgz#4684d71779ad39af177e3f007996f7c67c852618"
  dependencies:
    prr "~1.0.1"
@ -3735,8 +3735,8 @@ es-to-primitive@^1.1.1:
    is-symbol "^1.0.1"
 es5-ext@^0.10.14, es5-ext@^0.10.35, es5-ext@^0.10.9, es5-ext@~0.10.14:
-  version "0.10.38"
+  version "0.10.39"
-  resolved "https://registry.yarnpkg.com/es5-ext/-/es5-ext-0.10.38.tgz#fa7d40d65bbc9bb8a67e1d3f9cc656a00530eed3"
+  resolved "https://registry.yarnpkg.com/es5-ext/-/es5-ext-0.10.39.tgz#fca21b67559277ca4ac1a1ed7048b107b6f76d87"
  dependencies:
    es6-iterator "~2.0.3"
    es6-symbol "~3.1.1"
@ -4946,11 +4946,11 @@ graphi@^5.3.0:
    graphql-server-module-graphiql "1.3.x"
    lodash.merge "4.6.x"
-graphql-anywhere@^4.1.0-alpha.0, graphql-anywhere@^4.1.3:
+graphql-anywhere@^4.1.0-alpha.0, graphql-anywhere@^4.1.5:
-  version "4.1.3"
+  version "4.1.5"
-  resolved "https://registry.yarnpkg.com/graphql-anywhere/-/graphql-anywhere-4.1.3.tgz#ddd857d45d1538f55e8364c6c7a9016817a5ea92"
+  resolved "https://registry.yarnpkg.com/graphql-anywhere/-/graphql-anywhere-4.1.5.tgz#552ccd27b79a13a899022e20f658a2c2cb75e251"
  dependencies:
-    apollo-utilities "^1.0.6"
+    apollo-utilities "^1.0.8"
 graphql-config@~1.0.9:
  version "1.0.9"
@ -5219,8 +5219,8 @@ hoek@2.x.x:
  resolved "https://registry.yarnpkg.com/hoek/-/hoek-2.16.3.tgz#20bb7403d3cea398e91dc4710a8ff1b8274a25ed"
 hoek@4.x.x:
-  version "4.2.0"
+  version "4.2.1"
-  resolved "https://registry.yarnpkg.com/hoek/-/hoek-4.2.0.tgz#72d9d0754f7fe25ca2d01ad8f8f9a9449a89526d"
+  resolved "https://registry.yarnpkg.com/hoek/-/hoek-4.2.1.tgz#9634502aa12c445dd5a7c5734b572bb8738aacbb"
 hoek@5.0.x, hoek@5.x.x:
  version "5.0.3"
@ -5433,8 +5433,8 @@ ignore@^3.3.3, ignore@^3.3.5:
  resolved "https://registry.yarnpkg.com/ignore/-/ignore-3.3.7.tgz#612289bfb3c220e186a58118618d5be8c1bab021"
 immutability-helper@^2.1.2:
-  version "2.6.4"
+  version "2.6.5"
-  resolved "https://registry.yarnpkg.com/immutability-helper/-/immutability-helper-2.6.4.tgz#a931aef97257fcb6d2b5456de652ab6e3bba8408"
+  resolved "https://registry.yarnpkg.com/immutability-helper/-/immutability-helper-2.6.5.tgz#94a10f18f1196244b2dea92d46522d2b4dce7b73"
  dependencies:
    invariant "^2.2.0"
@ -6051,8 +6051,8 @@ iterall@1.1.3:
  resolved "https://registry.yarnpkg.com/iterall/-/iterall-1.1.3.tgz#1cbbff96204056dde6656e2ed2e2226d0e6d72c9"
 iterall@^1.1.3:
-  version "1.1.4"
+  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/iterall/-/iterall-1.1.4.tgz#0db40d38fdcf53ae14dc8ec674e62ab190d52cfc"
+  resolved "https://registry.yarnpkg.com/iterall/-/iterall-1.2.0.tgz#434e9f41f0b99911ab9c3d49d95f0e079176a2a2"
 javascript-stringify@^1.6.0:
  version "1.6.0"
@ -6598,16 +6598,16 @@ lcid@^1.0.0:
    invert-kv "^1.0.0"
 lerna@^2.4.0:
-  version "2.8.0"
+  version "2.9.0"
-  resolved "https://registry.yarnpkg.com/lerna/-/lerna-2.8.0.tgz#309a816fca5c73ea38f9f20e314a836e99b54cf0"
+  resolved "https://registry.yarnpkg.com/lerna/-/lerna-2.9.0.tgz#303f70bc50b1c4541bdcf54eda13c36fe54401f3"
  dependencies:
    async "^1.5.0"
    chalk "^2.1.0"
    cmd-shim "^2.0.2"
    columnify "^1.5.4"
    command-join "^2.0.0"
-    conventional-changelog-cli "^1.3.2"
+    conventional-changelog-cli "^1.3.13"
-    conventional-recommended-bump "^1.0.1"
+    conventional-recommended-bump "^1.2.1"
    dedent "^0.7.0"
    execa "^0.8.0"
    find-up "^2.1.0"
@ -7176,19 +7176,15 @@ miller-rabin@^4.0.0:
    bn.js "^4.0.0"
    brorand "^1.0.1"
-mime-db@1.x.x, "mime-db@>= 1.30.0 < 2":
+mime-db@1.x.x, "mime-db@>= 1.30.0 < 2", mime-db@~1.33.0:
-  version "1.32.0"
+  version "1.33.0"
-  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.32.0.tgz#485b3848b01a3cda5f968b4882c0771e58e09414"
+  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.33.0.tgz#a3492050a5cb9b63450541e39d9788d2272783db"
 mime-db@~1.30.0:
  version "1.30.0"
  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.30.0.tgz#74c643da2dd9d6a45399963465b26d5ca7d71f01"
 mime-types@^2.1.12, mime-types@~2.1.15, mime-types@~2.1.16, mime-types@~2.1.17, mime-types@~2.1.7:
-  version "2.1.17"
+  version "2.1.18"
-  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.17.tgz#09d7a393f03e995a79f8af857b70a9e0ab16557a"
+  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.18.tgz#6f323f60a83d11146f831ff11fd66e2fe5503bb8"
  dependencies:
-    mime-db "~1.30.0"
+    mime-db "~1.33.0"
 mime@1.4.1:
  version "1.4.1"
@ -7770,8 +7766,8 @@ os-tmpdir@^1.0.0, os-tmpdir@^1.0.1, os-tmpdir@~1.0.2:
  resolved "https://registry.yarnpkg.com/os-tmpdir/-/os-tmpdir-1.0.2.tgz#bbe67406c79aa85c5cfec766fe5734555dfa1274"
 osenv@^0.1.4:
-  version "0.1.4"
+  version "0.1.5"
-  resolved "https://registry.yarnpkg.com/osenv/-/osenv-0.1.4.tgz#42fe6d5953df06c8064be6f176c3d05aaaa34644"
+  resolved "https://registry.yarnpkg.com/osenv/-/osenv-0.1.5.tgz#85cdfafaeb28e8677f416e287592b5f3f49ea410"
  dependencies:
    os-homedir "^1.0.0"
    os-tmpdir "^1.0.0"
@ -8052,8 +8048,8 @@ pluralize@^7.0.0:
  resolved "https://registry.yarnpkg.com/pluralize/-/pluralize-7.0.0.tgz#298b89df8b93b0221dbf421ad2b1b1ea23fc6777"
 pngjs@^3.0.0, pngjs@^3.3.0:
-  version "3.3.1"
+  version "3.3.2"
-  resolved "https://registry.yarnpkg.com/pngjs/-/pngjs-3.3.1.tgz#8e14e6679ee7424b544334c3b2d21cea6d8c209a"
+  resolved "https://registry.yarnpkg.com/pngjs/-/pngjs-3.3.2.tgz#097c3c2a75feb223eadddea6bc9f0050cf830bc3"
 podium@3.x.x:
  version "3.1.2"
@ -8361,12 +8357,12 @@ postcss@^5.0.10, postcss@^5.0.11, postcss@^5.0.12, postcss@^5.0.13, postcss@^5.0
    supports-color "^3.2.3"
 postcss@^6.0.0, postcss@^6.0.1, postcss@^6.0.13:
-  version "6.0.17"
+  version "6.0.18"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-6.0.17.tgz#e259a051ca513f81e9afd0c21f7f82eda50c65c5"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-6.0.18.tgz#370f5f44d47f3a205f0eb2f6262bbf202df2a80e"
  dependencies:
-    chalk "^2.3.0"
+    chalk "^2.3.1"
    source-map "^0.6.1"
-    supports-color "^5.1.0"
+    supports-color "^5.2.0"
 preact-compat@^3.18.0:
  version "3.18.0"
@ -8559,8 +8555,8 @@ punycode@^1.2.4, punycode@^1.4.1:
  resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.4.1.tgz#c0d5a63b2718800ad8e1eb0fa5269c84dd41845e"
 puppeteer@^1.0.0:
-  version "1.0.0"
+  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/puppeteer/-/puppeteer-1.0.0.tgz#20f3bb6ad6c6778b4d1fb750e808a29fec0a88a4"
+  resolved "https://registry.yarnpkg.com/puppeteer/-/puppeteer-1.1.0.tgz#97fbc2fbbf9ab659e7e202a68ac1ba54b8bc0a25"
  dependencies:
    debug "^2.6.8"
    extract-zip "^1.6.5"
@ -8683,8 +8679,8 @@ randombytes@^2.0.0, randombytes@^2.0.1, randombytes@^2.0.5:
    safe-buffer "^5.1.0"
 randomfill@^1.0.3:
-  version "1.0.3"
+  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/randomfill/-/randomfill-1.0.3.tgz#b96b7df587f01dd91726c418f30553b1418e3d62"
+  resolved "https://registry.yarnpkg.com/randomfill/-/randomfill-1.0.4.tgz#c92196fc86ab42be983f1bf31778224931d61458"
  dependencies:
    randombytes "^2.0.5"
    safe-buffer "^5.1.0"
@ -8727,11 +8723,11 @@ react-apollo@^2.0.4:
    prop-types "^15.5.8"
 react-bundle@^1.0.4:
-  version "1.0.4"
+  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/react-bundle/-/react-bundle-1.0.4.tgz#ea03cae97be357ff8e290e785f4e30d0e065b920"
+  resolved "https://registry.yarnpkg.com/react-bundle/-/react-bundle-1.1.0.tgz#d243de62ecb28639440dfb35d25bc5721d93a9b1"
  dependencies:
    ispromise "^1.1.0"
-    prop-types "^15.5.10"
+    prop-types "^15.6.0"
 react-codemirror2@^3.0.7:
  version "3.0.7"
@ -9209,8 +9205,8 @@ redent@^1.0.0:
    strip-indent "^1.0.1"
 redrun@^5.10.0, redrun@^5.9.18:
-  version "5.10.2"
+  version "5.10.3"
-  resolved "https://registry.yarnpkg.com/redrun/-/redrun-5.10.2.tgz#ee4f476acf3999522483449b75176d96bb40d60b"
+  resolved "https://registry.yarnpkg.com/redrun/-/redrun-5.10.3.tgz#9f5fff319c5171c304e60b05ac6e10df3fb33daa"
  dependencies:
    all-object-keys "^1.0.0"
    currify "^2.0.0"
@ -9220,7 +9216,7 @@ redrun@^5.10.0, redrun@^5.9.18:
    jessy "^2.0.0"
    mapsome "^1.0.0"
    readjson "^1.1.3"
-    squad "^1.1.3"
+    squad "^2.0.0"
    try-catch "^2.0.0"
    yargs-parser "^9.0.2"
@ -10012,8 +10008,8 @@ sherlock@1.0.0:
  resolved "https://registry.yarnpkg.com/sherlock/-/sherlock-1.0.0.tgz#e246eacfd72c0e3b3e8243a6c9e55340d80c854e"
 shot@4.x.x:
-  version "4.0.4"
+  version "4.0.5"
-  resolved "https://registry.yarnpkg.com/shot/-/shot-4.0.4.tgz#cb0d3f61f6588ee23c3eb077f87b17a100d581a2"
+  resolved "https://registry.yarnpkg.com/shot/-/shot-4.0.5.tgz#c7e7455d11d60f6b6cd3c43e15a3b431c17e5566"
  dependencies:
    hoek "5.x.x"
    joi "13.x.x"
@ -10250,9 +10246,9 @@ sprintf-js@~1.0.2:
  version "1.0.3"
  resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.0.3.tgz#04e6926f662895354f3dd015203633b857297e2c"
-squad@^1.1.3:
+squad@^2.0.0:
-  version "1.1.3"
+  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/squad/-/squad-1.1.3.tgz#da09f68d1e0b0a60dca172878fe1f3c9e5272401"
+  resolved "https://registry.yarnpkg.com/squad/-/squad-2.0.0.tgz#2e04c757a8804d8f927c7417594800abda4aa9bd"
 sshpk@^1.7.0:
  version "1.13.1"
@ -10269,8 +10265,8 @@ sshpk@^1.7.0:
    tweetnacl "~0.14.0"
 ssri@^5.0.0:
-  version "5.2.1"
+  version "5.2.2"
-  resolved "https://registry.yarnpkg.com/ssri/-/ssri-5.2.1.tgz#8b6eb873688759bd3c75a88dee74593d179bb73c"
+  resolved "https://registry.yarnpkg.com/ssri/-/ssri-5.2.2.tgz#797be390aefe03996e4d961657a946121e2feacf"
  dependencies:
    safe-buffer "^5.1.1"
@ -10500,8 +10496,8 @@ stylis-rule-sheet@0.0.7, stylis-rule-sheet@^0.0.5, stylis-rule-sheet@^0.0.7:
  resolved "https://registry.yarnpkg.com/stylis-rule-sheet/-/stylis-rule-sheet-0.0.7.tgz#5c51dc879141a61821c2094ba91d2cbcf2469c6c"
 stylis@^3.0.0, stylis@^3.3.2, stylis@^3.4.0:
-  version "3.4.8"
+  version "3.4.9"
-  resolved "https://registry.yarnpkg.com/stylis/-/stylis-3.4.8.tgz#94380babbcd4c75726215794ca985b38ec96d1a3"
+  resolved "https://registry.yarnpkg.com/stylis/-/stylis-3.4.9.tgz#2e1403c06264bde8dbf1eb8fd82b2cfd1c4b31cc"
 subtext@6.x.x:
  version "6.0.7"
@ -10841,8 +10837,8 @@ traverse-chain@~0.1.0:
  resolved "https://registry.yarnpkg.com/traverse-chain/-/traverse-chain-0.1.0.tgz#61dbc2d53b69ff6091a12a168fd7d433107e40f1"
 treeify@^1.0.1:
-  version "1.0.1"
+  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/treeify/-/treeify-1.0.1.tgz#69b3cd022022a168424e7cfa1ced44c939d3eb2f"
+  resolved "https://registry.yarnpkg.com/treeify/-/treeify-1.1.0.tgz#4e31c6a463accd0943879f30667c4fdaff411bb8"
 trim-newlines@^1.0.0:
  version "1.0.0"
@ -10930,8 +10926,8 @@ uglify-es@^3.3.4:
    source-map "~0.6.1"
 uglify-js@3.3.x, uglify-js@^3.0.13:
-  version "3.3.10"
+  version "3.3.11"
-  resolved "https://registry.yarnpkg.com/uglify-js/-/uglify-js-3.3.10.tgz#8e47821d4cf28e14c1826a0078ba0825ed094da8"
+  resolved "https://registry.yarnpkg.com/uglify-js/-/uglify-js-3.3.11.tgz#e9d058b20715138bb4e8e5cae2ea581686bdaae3"
  dependencies:
    commander "~2.14.1"
    source-map "~0.6.1"