diff --git a/.changeset/chatty-games-heal.md b/.changeset/chatty-games-heal.md
new file mode 100644
index 000000000..3887aab34
--- /dev/null
+++ b/.changeset/chatty-games-heal.md
@@ -0,0 +1,5 @@
+---
+'@autoguru/overdrive': minor
+---
+
+Adds grid display to box pros
diff --git a/packages/overdrive/lib/components/Actions/__snapshots__/Actions.spec.jsx.snap b/packages/overdrive/lib/components/Actions/__snapshots__/Actions.spec.jsx.snap
index 0fbd9a652..c9f4c82d2 100644
--- a/packages/overdrive/lib/components/Actions/__snapshots__/Actions.spec.jsx.snap
+++ b/packages/overdrive/lib/components/Actions/__snapshots__/Actions.spec.jsx.snap
@@ -2,6 +2,6 @@
 
 exports[`<Actions /> should match the snapshot 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq8 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y48 Columns_align_stretch__wkgcjh2b Columns_wrapping_wrap__wkgcjh28"
+  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq8 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y48 Columns_align_stretch__wkgcjh2b Columns_wrapping_wrap__wkgcjh28"
 />
 `;
diff --git a/packages/overdrive/lib/components/Alert/__snapshots__/Alert.spec.jsx.snap b/packages/overdrive/lib/components/Alert/__snapshots__/Alert.spec.jsx.snap
index ae82380a4..2e188d2bb 100644
--- a/packages/overdrive/lib/components/Alert/__snapshots__/Alert.spec.jsx.snap
+++ b/packages/overdrive/lib/components/Alert/__snapshots__/Alert.spec.jsx.snap
@@ -9,10 +9,10 @@ exports[`<Alert /> should match the snapshot 1`] = `
     class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_success__7o6k06el IntentStripe_intentBox__1g1aih90"
   />
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y410 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y411 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y412 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y413 Columns_align_stretch__wkgcjh2b Columns_wrapping_noWrap__wkgcjh29"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y410 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y411 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y412 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y413 Columns_align_stretch__wkgcjh2b Columns_wrapping_noWrap__wkgcjh29"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjh4 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_align_top__2660ru19"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjh4 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_align_top__2660ru19"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
@@ -36,25 +36,25 @@ exports[`<Alert /> should match the snapshot 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06go Columns_makeResponsiveStyle_key_bp__wkgcjh4 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_makeResponsiveStyle_key_bp__2660ru14 Column_align_centre__2660ru1a"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjh4 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_makeResponsiveStyle_key_bp__2660ru14 Column_align_centre__2660ru1a"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_dark__w6to7ie"
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjh4 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_align_top__2660ru19"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjh4 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_align_top__2660ru19"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
       >
         <button
           aria-label="close"
-          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_minimal_defaults__11v3fwxp Button_minimalStates_secondary__11v3fwxs Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_enabled__11v3fwx4"
+          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_minimal_defaults__11v3fwxp Button_minimalStates_secondary__11v3fwxs Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_enabled__11v3fwx4"
           type="button"
         >
           <div
-            class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+            class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
           >
             <i
               class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_muted__w6to7ig"
diff --git a/packages/overdrive/lib/components/Anchor/__snapshots__/Anchor.spec.jsx.snap b/packages/overdrive/lib/components/Anchor/__snapshots__/Anchor.spec.jsx.snap
index 06def86b7..e1318f6c6 100644
--- a/packages/overdrive/lib/components/Anchor/__snapshots__/Anchor.spec.jsx.snap
+++ b/packages/overdrive/lib/components/Anchor/__snapshots__/Anchor.spec.jsx.snap
@@ -2,14 +2,14 @@
 
 exports[`<Anchor /> should match snapshot with label, icon and to props 1`] = `
 <a
-  class="Anchor_root__1pk80wh0 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_link__w6to7id reset_cursorPointer__6swfds1 reset_a__6swfds9 useBoxStyles_display_inline__7o6k06fd"
+  class="Anchor_root__1pk80wh0 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_link__w6to7id reset_cursorPointer__6swfds1 reset_a__6swfds9 useBoxStyles_display_inline__7o6k06fe"
   href="https://www.autoguru.com.au"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
     >
       <i
         class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q60 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_link__w6to7id"
@@ -27,7 +27,7 @@ exports[`<Anchor /> should match snapshot with label, icon and to props 1`] = `
       </i>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
     >
       <span
         class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_link__w6to7id useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_4__w6to7i4"
@@ -41,7 +41,7 @@ exports[`<Anchor /> should match snapshot with label, icon and to props 1`] = `
 
 exports[`<Anchor /> should match snapshot without label 1`] = `
 <a
-  class="Anchor_root__1pk80wh0 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_link__w6to7id reset_cursorPointer__6swfds1 reset_a__6swfds9 useBoxStyles_display_inline__7o6k06fd"
+  class="Anchor_root__1pk80wh0 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_link__w6to7id reset_cursorPointer__6swfds1 reset_a__6swfds9 useBoxStyles_display_inline__7o6k06fe"
 >
   <span
     class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_link__w6to7id useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_4__w6to7i4"
@@ -51,17 +51,17 @@ exports[`<Anchor /> should match snapshot without label 1`] = `
 
 exports[`<Anchor /> when custom component should match snapshot with label, icon custom component 1`] = `
 <button
-  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4 Anchor_root__1pk80wh0 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_link__w6to7id reset_block__6swfds3 useBoxStyles_display_inline__7o6k06fd"
+  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4 Anchor_root__1pk80wh0 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_link__w6to7id reset_block__6swfds3 useBoxStyles_display_inline__7o6k06fe"
   type="button"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+        class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
       >
         <i
           class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q60 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_link__w6to7id"
@@ -79,7 +79,7 @@ exports[`<Anchor /> when custom component should match snapshot with label, icon
         </i>
       </div>
       <div
-        class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+        class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
       >
         <span
           class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_link__w6to7id useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_4__w6to7i4"
diff --git a/packages/overdrive/lib/components/Box/useBoxStyles.css.ts b/packages/overdrive/lib/components/Box/useBoxStyles.css.ts
index e92745aa4..1ddffce2d 100644
--- a/packages/overdrive/lib/components/Box/useBoxStyles.css.ts
+++ b/packages/overdrive/lib/components/Box/useBoxStyles.css.ts
@@ -154,6 +154,7 @@ export const display = styleVariants(
 			contents: 'contents',
 			block: 'block',
 			flex: 'flex',
+			grid: 'grid',
 			inlineFlex: 'inline-flex',
 			inline: 'inline',
 			inlineBlock: 'inline-block',
diff --git a/packages/overdrive/lib/components/BulletText/__snapshots__/BulletText.spec.jsx.snap b/packages/overdrive/lib/components/BulletText/__snapshots__/BulletText.spec.jsx.snap
index fa573adbf..e63c18319 100644
--- a/packages/overdrive/lib/components/BulletText/__snapshots__/BulletText.spec.jsx.snap
+++ b/packages/overdrive/lib/components/BulletText/__snapshots__/BulletText.spec.jsx.snap
@@ -2,13 +2,13 @@
 
 exports[`<BulletText /> should match snapshot for custom bullet text 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y48 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq8"
+  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y48 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq8"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 useBoxStyles_flexShrink_0__7o6k06gp"
+      class="reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 useBoxStyles_flexShrink_0__7o6k06gq"
     >
       <span>
         <i
@@ -31,10 +31,10 @@ exports[`<BulletText /> should match snapshot for custom bullet text 1`] = `
     </div>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06go"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06gp"
     >
       <span
         class="reset_inlineText__6swfds2 useBoxStyles_display_block__7o6k06fa useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -48,13 +48,13 @@ exports[`<BulletText /> should match snapshot for custom bullet text 1`] = `
 
 exports[`<BulletText /> should match snapshot for default bullet text 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y48 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq8"
+  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y48 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq8"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw BulletText_bullet__1yojba90 BulletText_primary__1yojba91"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx BulletText_bullet__1yojba90 BulletText_primary__1yojba91"
     >
       <span
         class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_2__w6to7i2 BulletText_primaryText__1yojba93"
@@ -64,10 +64,10 @@ exports[`<BulletText /> should match snapshot for default bullet text 1`] = `
     </div>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06go"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06gp"
     >
       <span
         class="reset_inlineText__6swfds2 useBoxStyles_display_block__7o6k06fa useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -81,13 +81,13 @@ exports[`<BulletText /> should match snapshot for default bullet text 1`] = `
 
 exports[`<BulletText /> should match snapshot for ordered bullet text 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y48 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq8"
+  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y48 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq8"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw BulletText_bullet__1yojba90 BulletText_primary__1yojba91"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx BulletText_bullet__1yojba90 BulletText_primary__1yojba91"
     >
       <span
         class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_2__w6to7i2 BulletText_primaryText__1yojba93"
@@ -97,10 +97,10 @@ exports[`<BulletText /> should match snapshot for ordered bullet text 1`] = `
     </div>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06go"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06gp"
     >
       <span
         class="reset_inlineText__6swfds2 useBoxStyles_display_block__7o6k06fa useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -114,13 +114,13 @@ exports[`<BulletText /> should match snapshot for ordered bullet text 1`] = `
 
 exports[`<BulletText /> should match snapshot for primary bullet text with custom bullet character 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y48 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq8"
+  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y48 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq8"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw BulletText_bullet__1yojba90 BulletText_primary__1yojba91"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx BulletText_bullet__1yojba90 BulletText_primary__1yojba91"
     >
       <span
         class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_2__w6to7i2 BulletText_primaryText__1yojba93"
@@ -130,10 +130,10 @@ exports[`<BulletText /> should match snapshot for primary bullet text with custo
     </div>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06go"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06gp"
     >
       <span
         class="reset_inlineText__6swfds2 useBoxStyles_display_block__7o6k06fa useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -147,13 +147,13 @@ exports[`<BulletText /> should match snapshot for primary bullet text with custo
 
 exports[`<BulletText /> should match snapshot for secondary bullet text with custom bullet character 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y48 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq8"
+  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y48 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq8"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw BulletText_bullet__1yojba90 BulletText_secondary__1yojba92"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx BulletText_bullet__1yojba90 BulletText_secondary__1yojba92"
     >
       <span
         class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_2__w6to7i2 BulletText_secondaryText__1yojba94"
@@ -163,10 +163,10 @@ exports[`<BulletText /> should match snapshot for secondary bullet text with cus
     </div>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06go"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06gp"
     >
       <span
         class="reset_inlineText__6swfds2 useBoxStyles_display_block__7o6k06fa useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
diff --git a/packages/overdrive/lib/components/Button/__snapshots__/Button.spec.jsx.snap b/packages/overdrive/lib/components/Button/__snapshots__/Button.spec.jsx.snap
index 7ef14da4d..2021517be 100644
--- a/packages/overdrive/lib/components/Button/__snapshots__/Button.spec.jsx.snap
+++ b/packages/overdrive/lib/components/Button/__snapshots__/Button.spec.jsx.snap
@@ -2,92 +2,92 @@
 
 exports[`<Button /> should match snapshot for default button 1`] = `
 <button
-  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
+  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
   type="button"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
   />
 </button>
 `;
 
 exports[`<Button /> when as button should use html button element by default 1`] = `
 <button
-  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
+  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
   type="button"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
   />
 </button>
 `;
 
 exports[`<Button /> when colour variants should match snapshot for Danger button 1`] = `
 <button
-  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_danger__11v3fwxl Button_variant_danger__11v3fwxf Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
+  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_danger__11v3fwxl Button_variant_danger__11v3fwxf Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
   type="button"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
   />
 </button>
 `;
 
 exports[`<Button /> when colour variants should match snapshot for Primary button 1`] = `
 <button
-  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_primary__11v3fwxj Button_variant_primary__11v3fwxd Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
+  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_primary__11v3fwxj Button_variant_primary__11v3fwxd Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
   type="button"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
   />
 </button>
 `;
 
 exports[`<Button /> when colour variants should match snapshot for Secondary button 1`] = `
 <button
-  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
+  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
   type="button"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
   />
 </button>
 `;
 
 exports[`<Button /> when custom component should use html anchor element if href value exists 1`] = `
 <a
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
   href="abc"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
   />
 </a>
 `;
 
 exports[`<Button /> when isFullWidth should match snapshot 1`] = `
 <button
-  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_width_full__7o6k06ew useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
+  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_width_full__7o6k06ew useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
   type="button"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
   />
 </button>
 `;
 
 exports[`<Button /> when loading should match snapshot for default button 1`] = `
 <button
-  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_loading__11v3fwx3"
+  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_loading__11v3fwx3"
   disabled=""
   type="button"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
     >
       <div
         class="reset_block__6swfds3 ProgressSpinner_size_medium_circular__5j3teub ProgressSpinner_colours_secondary__5j3teu6 Button_spinner__11v3fwx6"
@@ -116,15 +116,15 @@ exports[`<Button /> when loading should match snapshot for default button 1`] =
 
 exports[`<Button /> when loading should match snapshot for medium button 1`] = `
 <button
-  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_loading__11v3fwx3"
+  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_loading__11v3fwx3"
   disabled=""
   type="button"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
     >
       <div
         class="reset_block__6swfds3 ProgressSpinner_size_medium_circular__5j3teub ProgressSpinner_colours_secondary__5j3teu6 Button_spinner__11v3fwx6"
@@ -153,15 +153,15 @@ exports[`<Button /> when loading should match snapshot for medium button 1`] = `
 
 exports[`<Button /> when loading should match snapshot for small button 1`] = `
 <button
-  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_variant_secondary__11v3fwxe Button_size_small_default__11v3fwx7 Button_loading__11v3fwx3"
+  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_variant_secondary__11v3fwxe Button_size_small_default__11v3fwx7 Button_loading__11v3fwx3"
   disabled=""
   type="button"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
     >
       <div
         class="reset_block__6swfds3 ProgressSpinner_size_medium_circular__5j3teub ProgressSpinner_colours_secondary__5j3teu6 Button_spinner__11v3fwx6"
@@ -190,33 +190,33 @@ exports[`<Button /> when loading should match snapshot for small button 1`] = `
 
 exports[`<Button /> when rounded should match snapshot 1`] = `
 <button
-  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_size_medium_rounded__11v3fwxb Button_enabled__11v3fwx4"
+  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_size_medium_rounded__11v3fwxb Button_enabled__11v3fwx4"
   type="button"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
   />
 </button>
 `;
 
 exports[`<Button /> when size variant should match snapshot for medium button 1`] = `
 <button
-  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
+  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
   type="button"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
   />
 </button>
 `;
 
 exports[`<Button /> when size variant should match snapshot for small button 1`] = `
 <button
-  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_small_default__11v3fwx7 Button_enabled__11v3fwx4"
+  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_small_default__11v3fwx7 Button_enabled__11v3fwx4"
   type="button"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
   />
 </button>
 `;
diff --git a/packages/overdrive/lib/components/CheckBox/__snapshots__/CheckBox.spec.jsx.snap b/packages/overdrive/lib/components/CheckBox/__snapshots__/CheckBox.spec.jsx.snap
index 2481dfea7..638690ced 100644
--- a/packages/overdrive/lib/components/CheckBox/__snapshots__/CheckBox.spec.jsx.snap
+++ b/packages/overdrive/lib/components/CheckBox/__snapshots__/CheckBox.spec.jsx.snap
@@ -2,7 +2,7 @@
 
 exports[`<CheckBox /> should match the snapshot for a checked check 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
 >
   <input
     checked=""
@@ -12,7 +12,7 @@ exports[`<CheckBox /> should match the snapshot for a checked check 1`] = `
     value="1"
   />
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
   >
     <i
       class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q60 CheckBox_icon__xnhrlp0 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez"
@@ -48,10 +48,10 @@ exports[`<CheckBox /> should match the snapshot for a checked check 1`] = `
 
 exports[`<CheckBox /> should match the snapshot for a disable checkbox 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 CheckableBase_disabled__v1tznp6"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 CheckableBase_disabled__v1tznp6"
 >
   <input
-    class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 CheckableBase_nativeInput_default__v1tznp2"
+    class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 CheckableBase_nativeInput_default__v1tznp2"
     disabled=""
     name=""
     tabindex="-1"
@@ -59,14 +59,14 @@ exports[`<CheckBox /> should match the snapshot for a disable checkbox 1`] = `
     value="1"
   />
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
   >
     <div
       class="reset_block__6swfds3 useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ax useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bt useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c9 CheckableBase_checkableItem__v1tznp5 CheckBox_base_default__xnhrlp1"
     />
   </div>
   <label
-    class="reset_inlineText__6swfds2 useBoxStyles_width_full__7o6k06ew useBoxStyles_pointerEvents_none__7o6k06hc reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_sizes_4__w6to7i4 CheckableBase_label_disabled__v1tznp1"
+    class="reset_inlineText__6swfds2 useBoxStyles_width_full__7o6k06ew useBoxStyles_pointerEvents_none__7o6k06hd reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_sizes_4__w6to7i4 CheckableBase_label_disabled__v1tznp1"
   >
     <span
       class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -79,7 +79,7 @@ exports[`<CheckBox /> should match the snapshot for a disable checkbox 1`] = `
 
 exports[`<CheckBox /> should match the snapshot for a single check 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
 >
   <input
     class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 CheckableBase_nativeInput_default__v1tznp2"
@@ -88,7 +88,7 @@ exports[`<CheckBox /> should match the snapshot for a single check 1`] = `
     value="1"
   />
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
   >
     <div
       class="reset_block__6swfds3 useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ax useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bt useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c9 CheckableBase_checkableItem__v1tznp5 CheckBox_base_default__xnhrlp1"
@@ -108,7 +108,7 @@ exports[`<CheckBox /> should match the snapshot for a single check 1`] = `
 
 exports[`<CheckBox /> should match the snapshot for a single check with no value or label 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
 >
   <input
     class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 CheckableBase_nativeInput_default__v1tznp2"
@@ -117,7 +117,7 @@ exports[`<CheckBox /> should match the snapshot for a single check with no value
     value=""
   />
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
   >
     <div
       class="reset_block__6swfds3 useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ax useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bt useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c9 CheckableBase_checkableItem__v1tznp5 CheckBox_base_default__xnhrlp1"
@@ -128,7 +128,7 @@ exports[`<CheckBox /> should match the snapshot for a single check with no value
 
 exports[`<CheckBox /> when with component child should match the snapshot 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
 >
   <input
     class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 CheckableBase_nativeInput_default__v1tznp2"
@@ -137,7 +137,7 @@ exports[`<CheckBox /> when with component child should match the snapshot 1`] =
     value="1"
   />
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
   >
     <div
       class="reset_block__6swfds3 useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ax useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bt useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c9 CheckableBase_checkableItem__v1tznp5 CheckBox_base_default__xnhrlp1"
diff --git a/packages/overdrive/lib/components/ColourInput/__snapshots__/ColourInput.spec.jsx.snap b/packages/overdrive/lib/components/ColourInput/__snapshots__/ColourInput.spec.jsx.snap
index a9631eeb4..3f9d7ed7b 100644
--- a/packages/overdrive/lib/components/ColourInput/__snapshots__/ColourInput.spec.jsx.snap
+++ b/packages/overdrive/lib/components/ColourInput/__snapshots__/ColourInput.spec.jsx.snap
@@ -11,10 +11,10 @@ exports[`<ColourInput /> should have some hintText 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h8 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
+          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h9 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl"
@@ -28,7 +28,7 @@ exports[`<ColourInput /> should have some hintText 1`] = `
         </span>
         <input
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06go ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06gp ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
           id="id"
           type="color"
           value="#6c1111"
@@ -36,7 +36,7 @@ exports[`<ColourInput /> should have some hintText 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -50,7 +50,7 @@ exports[`<ColourInput /> should have some hintText 1`] = `
           placeholder
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
           for="id"
         >
           placeholder
@@ -80,10 +80,10 @@ exports[`<ColourInput /> should match snapshot 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h8 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
+          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h9 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl"
@@ -97,7 +97,7 @@ exports[`<ColourInput /> should match snapshot 1`] = `
         </span>
         <input
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06go ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06gp ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
           id="id"
           type="color"
           value="#6c1111"
@@ -105,7 +105,7 @@ exports[`<ColourInput /> should match snapshot 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -119,7 +119,7 @@ exports[`<ColourInput /> should match snapshot 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
           for="id"
         >
           placeholder something
@@ -144,10 +144,10 @@ exports[`<ColourInput /> should match snapshot when active 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h8 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
+          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h9 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl"
@@ -161,14 +161,14 @@ exports[`<ColourInput /> should match snapshot when active 1`] = `
         </span>
         <input
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06go ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06gp ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
           type="color"
           value="#ec4040"
         />
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_activeBorderColour__9z39d71"
@@ -182,7 +182,7 @@ exports[`<ColourInput /> should match snapshot when active 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_activeColour__9z39d70 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_activeColour__9z39d70 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
@@ -206,7 +206,7 @@ exports[`<ColourInput /> should match snapshot when loading 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <div
-        class="reset_block__6swfds3 ProgressSpinner_size_medium_circular__5j3teub ProgressSpinner_colours_primary__5j3teu5 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="reset_block__6swfds3 ProgressSpinner_size_medium_circular__5j3teub ProgressSpinner_colours_primary__5j3teu5 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
       >
         <svg
           class="useBoxStyles_display_block__7o6k06fa useBoxStyles_overflow_hidden__7o6k06f5 ProgressSpinner_circular__5j3teu1"
@@ -223,10 +223,10 @@ exports[`<ColourInput /> should match snapshot when loading 1`] = `
         </svg>
       </div>
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h8 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
+          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h9 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl"
@@ -241,14 +241,14 @@ exports[`<ColourInput /> should match snapshot when loading 1`] = `
         <input
           aria-busy="true"
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06go ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida undefined withEnhancedInput_inputItselfSize_medium_suffixed_any__bd4oidd"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06gp ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida undefined withEnhancedInput_inputItselfSize_medium_suffixed_any__bd4oidd"
           type="color"
           value="#6c1111"
         />
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -262,7 +262,7 @@ exports[`<ColourInput /> should match snapshot when loading 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
@@ -286,10 +286,10 @@ exports[`<ColourInput /> should match snapshot when touched 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h8 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
+          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h9 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl"
@@ -303,14 +303,14 @@ exports[`<ColourInput /> should match snapshot when touched 1`] = `
         </span>
         <input
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06go ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06gp ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
           type="color"
           value="#6c1111"
         />
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_error_default_borderColour__9z39d7d"
@@ -324,7 +324,7 @@ exports[`<ColourInput /> should match snapshot when touched 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_error_default_colour__9z39d7c useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_error_default_colour__9z39d7c useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
@@ -348,10 +348,10 @@ exports[`<ColourInput /> should match snapshot when touched and invalid 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h8 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
+          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h9 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl"
@@ -365,14 +365,14 @@ exports[`<ColourInput /> should match snapshot when touched and invalid 1`] = `
         </span>
         <input
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06go ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06gp ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
           type="color"
           value="#6c1111"
         />
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_error_default_borderColour__9z39d7d"
@@ -386,7 +386,7 @@ exports[`<ColourInput /> should match snapshot when touched and invalid 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_error_default_colour__9z39d7c useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_error_default_colour__9z39d7c useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
@@ -410,10 +410,10 @@ exports[`<ColourInput /> should match snapshot when touched and valid 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h8 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
+          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h9 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl"
@@ -427,14 +427,14 @@ exports[`<ColourInput /> should match snapshot when touched and valid 1`] = `
         </span>
         <input
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06go ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06gp ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
           type="color"
           value="#6c1111"
         />
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_success_default_borderColour__9z39d77"
@@ -448,7 +448,7 @@ exports[`<ColourInput /> should match snapshot when touched and valid 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_success_default_colour__9z39d76 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_success_default_colour__9z39d76 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
@@ -472,7 +472,7 @@ exports[`<ColourInput /> should match snapshot with both icons 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <i
-        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
         role="presentation"
       >
         <svg
@@ -486,10 +486,10 @@ exports[`<ColourInput /> should match snapshot with both icons 1`] = `
         </svg>
       </i>
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h8 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
+          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h9 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl"
@@ -503,14 +503,14 @@ exports[`<ColourInput /> should match snapshot with both icons 1`] = `
         </span>
         <input
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06go ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida undefined withEnhancedInput_inputItselfSize_medium_suffixed_any__bd4oidd"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06gp ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida undefined withEnhancedInput_inputItselfSize_medium_suffixed_any__bd4oidd"
           type="color"
           value="#6c1111"
         />
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -524,7 +524,7 @@ exports[`<ColourInput /> should match snapshot with both icons 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
@@ -548,7 +548,7 @@ exports[`<ColourInput /> should match snapshot with suffix icon 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <i
-        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
         role="presentation"
       >
         <svg
@@ -562,10 +562,10 @@ exports[`<ColourInput /> should match snapshot with suffix icon 1`] = `
         </svg>
       </i>
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h8 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
+          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h9 ColourInput_colouredBoxHolder__1c82wdf1 ColourInput_colouredBoxHolderSize_medium__1c82wdf3"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl"
@@ -579,14 +579,14 @@ exports[`<ColourInput /> should match snapshot with suffix icon 1`] = `
         </span>
         <input
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06go ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida undefined withEnhancedInput_inputItselfSize_medium_suffixed_any__bd4oidd"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_flexGrow_1__7o6k06gp ColourInput_input__1c82wdf0 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida undefined withEnhancedInput_inputItselfSize_medium_suffixed_any__bd4oidd"
           type="color"
           value="#6c1111"
         />
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -600,7 +600,7 @@ exports[`<ColourInput /> should match snapshot with suffix icon 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
diff --git a/packages/overdrive/lib/components/DateInput/__snapshots__/DateInput.spec.jsx.snap b/packages/overdrive/lib/components/DateInput/__snapshots__/DateInput.spec.jsx.snap
index 8561bdfd4..035990cb4 100644
--- a/packages/overdrive/lib/components/DateInput/__snapshots__/DateInput.spec.jsx.snap
+++ b/packages/overdrive/lib/components/DateInput/__snapshots__/DateInput.spec.jsx.snap
@@ -19,7 +19,7 @@ exports[`<DateInput /> should have some hintText 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -33,7 +33,7 @@ exports[`<DateInput /> should have some hintText 1`] = `
           placeholder
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
           for="id"
         >
           placeholder
@@ -71,7 +71,7 @@ exports[`<DateInput /> should match snapshot 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -85,7 +85,7 @@ exports[`<DateInput /> should match snapshot 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
           for="id"
         >
           placeholder something
@@ -117,7 +117,7 @@ exports[`<DateInput /> should match snapshot when active 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_activeBorderColour__9z39d71"
@@ -131,7 +131,7 @@ exports[`<DateInput /> should match snapshot when active 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_activeColour__9z39d70 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_activeColour__9z39d70 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
@@ -155,7 +155,7 @@ exports[`<DateInput /> should match snapshot when loading 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <i
-        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_prefixIcon__bd4oidf withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_prefixIcon__bd4oidf withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
         role="presentation"
       >
         <svg
@@ -169,7 +169,7 @@ exports[`<DateInput /> should match snapshot when loading 1`] = `
         </svg>
       </i>
       <div
-        class="reset_block__6swfds3 ProgressSpinner_size_medium_circular__5j3teub ProgressSpinner_colours_primary__5j3teu5 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="reset_block__6swfds3 ProgressSpinner_size_medium_circular__5j3teub ProgressSpinner_colours_primary__5j3teu5 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
       >
         <svg
           class="useBoxStyles_display_block__7o6k06fa useBoxStyles_overflow_hidden__7o6k06f5 ProgressSpinner_circular__5j3teu1"
@@ -194,7 +194,7 @@ exports[`<DateInput /> should match snapshot when loading 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -208,7 +208,7 @@ exports[`<DateInput /> should match snapshot when loading 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
@@ -239,7 +239,7 @@ exports[`<DateInput /> should match snapshot when touched 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_error_default_borderColour__9z39d7d"
@@ -253,7 +253,7 @@ exports[`<DateInput /> should match snapshot when touched 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_error_default_colour__9z39d7c useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_error_default_colour__9z39d7c useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
@@ -284,7 +284,7 @@ exports[`<DateInput /> should match snapshot when touched and invalid 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_error_default_borderColour__9z39d7d"
@@ -298,7 +298,7 @@ exports[`<DateInput /> should match snapshot when touched and invalid 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_error_default_colour__9z39d7c useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_error_default_colour__9z39d7c useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
@@ -329,7 +329,7 @@ exports[`<DateInput /> should match snapshot when touched and valid 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_success_default_borderColour__9z39d77"
@@ -343,7 +343,7 @@ exports[`<DateInput /> should match snapshot when touched and valid 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_success_default_colour__9z39d76 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_success_default_colour__9z39d76 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
@@ -367,7 +367,7 @@ exports[`<DateInput /> should match snapshot with both icons 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <i
-        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_prefixIcon__bd4oidf withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_prefixIcon__bd4oidf withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
         role="presentation"
       >
         <svg
@@ -381,7 +381,7 @@ exports[`<DateInput /> should match snapshot with both icons 1`] = `
         </svg>
       </i>
       <i
-        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
         role="presentation"
       >
         <svg
@@ -402,7 +402,7 @@ exports[`<DateInput /> should match snapshot with both icons 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -416,7 +416,7 @@ exports[`<DateInput /> should match snapshot with both icons 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
@@ -440,7 +440,7 @@ exports[`<DateInput /> should match snapshot with prefix icon 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <i
-        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_prefixIcon__bd4oidf withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_prefixIcon__bd4oidf withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
         role="presentation"
       >
         <svg
@@ -461,7 +461,7 @@ exports[`<DateInput /> should match snapshot with prefix icon 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -475,7 +475,7 @@ exports[`<DateInput /> should match snapshot with prefix icon 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
@@ -499,7 +499,7 @@ exports[`<DateInput /> should match snapshot with suffix icon 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <i
-        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
         role="presentation"
       >
         <svg
@@ -520,7 +520,7 @@ exports[`<DateInput /> should match snapshot with suffix icon 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -534,7 +534,7 @@ exports[`<DateInput /> should match snapshot with suffix icon 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_natural_default_colour__9z39d74 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
diff --git a/packages/overdrive/lib/components/DropDown/__snapshots__/DropDown.spec.jsx.snap b/packages/overdrive/lib/components/DropDown/__snapshots__/DropDown.spec.jsx.snap
index fa62f9ac6..7f55dd4a5 100644
--- a/packages/overdrive/lib/components/DropDown/__snapshots__/DropDown.spec.jsx.snap
+++ b/packages/overdrive/lib/components/DropDown/__snapshots__/DropDown.spec.jsx.snap
@@ -2,11 +2,11 @@
 
 exports[`<DropDown /> should match the snapshot 1`] = `
 <button
-  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
+  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
   type="button"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
   >
     Attachment
     <i
@@ -31,11 +31,11 @@ exports[`<DropDown /> should match the snapshot 1`] = `
 
 exports[`<DropDown /> should match the snapshot as Primary variant 1`] = `
 <button
-  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_primary__11v3fwxj Button_variant_primary__11v3fwxd Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
+  class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_primary__11v3fwxj Button_variant_primary__11v3fwxd Button_size_medium_default__11v3fwxa Button_enabled__11v3fwx4"
   type="button"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+    class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
   >
     Attachment
     <i
diff --git a/packages/overdrive/lib/components/EditableText/__snapshots__/EditableText.spec.jsx.snap b/packages/overdrive/lib/components/EditableText/__snapshots__/EditableText.spec.jsx.snap
index f507510e3..9d303e232 100644
--- a/packages/overdrive/lib/components/EditableText/__snapshots__/EditableText.spec.jsx.snap
+++ b/packages/overdrive/lib/components/EditableText/__snapshots__/EditableText.spec.jsx.snap
@@ -2,7 +2,7 @@
 
 exports[`<EditableText /> should match snapshot as date input 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_position_relative__7o6k06f1 EditableText_root__n0hvwi0"
+  class="reset_block__6swfds3 useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_position_relative__7o6k06f1 EditableText_root__n0hvwi0"
   tabindex="0"
 >
   <span
@@ -15,7 +15,7 @@ exports[`<EditableText /> should match snapshot as date input 1`] = `
 
 exports[`<EditableText /> should match snapshot for default bullet text 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_position_relative__7o6k06f1 EditableText_root__n0hvwi0"
+  class="reset_block__6swfds3 useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_position_relative__7o6k06f1 EditableText_root__n0hvwi0"
   tabindex="0"
 >
   <span
@@ -28,7 +28,7 @@ exports[`<EditableText /> should match snapshot for default bullet text 1`] = `
 
 exports[`<EditableText /> should match snapshot with custom size 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_position_relative__7o6k06f1 EditableText_root__n0hvwi0"
+  class="reset_block__6swfds3 useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_position_relative__7o6k06f1 EditableText_root__n0hvwi0"
   tabindex="0"
 >
   <span
diff --git a/packages/overdrive/lib/components/HorizontalAutoScroller/__snapshots__/HorizontalAutoScroller.spec.jsx.snap b/packages/overdrive/lib/components/HorizontalAutoScroller/__snapshots__/HorizontalAutoScroller.spec.jsx.snap
index ed744f0d1..eae7abc16 100644
--- a/packages/overdrive/lib/components/HorizontalAutoScroller/__snapshots__/HorizontalAutoScroller.spec.jsx.snap
+++ b/packages/overdrive/lib/components/HorizontalAutoScroller/__snapshots__/HorizontalAutoScroller.spec.jsx.snap
@@ -5,20 +5,20 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
   class="reset_block__6swfds3"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf Stack_child_default__1hhisnca Stack_child_spaces_5__1hhisnc4"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg Stack_child_default__1hhisnca Stack_child_spaces_5__1hhisnc4"
   >
     <div
       class="reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 useBoxStyles_overflow_hidden__7o6k06f5"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_absolute__7o6k06ez useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs HorizontalAutoScroller_controllerBtn__jv39ij0 HorizontalAutoScroller_prevBtn__jv39ij2"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_absolute__7o6k06ez useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt HorizontalAutoScroller_controllerBtn__jv39ij0 HorizontalAutoScroller_prevBtn__jv39ij2"
       >
         <button
-          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_size_medium_rounded__11v3fwxb Button_size_medium_iconOnly__11v3fwxc Button_enabled__11v3fwx4"
+          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_size_medium_rounded__11v3fwxb Button_size_medium_iconOnly__11v3fwxc Button_enabled__11v3fwx4"
           type="button"
         >
           <div
-            class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+            class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
           >
             <i
               class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -40,10 +40,10 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
         </button>
       </div>
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqg useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4g Columns_align_stretch__wkgcjh2b Columns_wrapping_noWrap__wkgcjh29"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqg useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4g Columns_align_stretch__wkgcjh2b Columns_wrapping_noWrap__wkgcjh29"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k"
+          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey HorizontalAutoScroller_controllerCol__jv39ij1"
@@ -52,7 +52,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
           </div>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
+          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
@@ -65,7 +65,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
           </div>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
+          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
@@ -78,7 +78,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
           </div>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
+          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
@@ -91,7 +91,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
           </div>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
+          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
@@ -104,7 +104,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
           </div>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
+          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
@@ -117,7 +117,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
           </div>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
+          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
@@ -130,7 +130,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
           </div>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
+          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
@@ -143,7 +143,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
           </div>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
+          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
@@ -156,7 +156,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
           </div>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k"
+          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey HorizontalAutoScroller_controllerCol__jv39ij1"
@@ -166,14 +166,14 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
         </div>
       </div>
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_absolute__7o6k06ez useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h0 HorizontalAutoScroller_controllerBtn__jv39ij0 HorizontalAutoScroller_nextBtn__jv39ij3"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_absolute__7o6k06ez useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h1 HorizontalAutoScroller_controllerBtn__jv39ij0 HorizontalAutoScroller_nextBtn__jv39ij3"
       >
         <button
-          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_size_medium_rounded__11v3fwxb Button_size_medium_iconOnly__11v3fwxc Button_enabled__11v3fwx4"
+          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_size_medium_rounded__11v3fwxb Button_size_medium_iconOnly__11v3fwxc Button_enabled__11v3fwx4"
           type="button"
         >
           <div
-            class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+            class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
           >
             <i
               class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -197,7 +197,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
     </div>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf Stack_child_default__1hhisnca Stack_child_spaces_5__1hhisnc4"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg Stack_child_default__1hhisnca Stack_child_spaces_5__1hhisnc4"
   >
     <div
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew Section_root__15167c40 Section_width_small__15167c41"
@@ -224,7 +224,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
             class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
           />
           <div
-            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
             style="animation-duration: 10s;"
           />
         </div>
@@ -235,7 +235,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
             class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
           />
           <div
-            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
             style="animation-duration: 10s;"
           />
         </div>
@@ -246,7 +246,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
             class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
           />
           <div
-            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
             style="animation-duration: 10s;"
           />
         </div>
@@ -257,7 +257,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
             class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
           />
           <div
-            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
             style="animation-duration: 10s;"
           />
         </div>
@@ -268,7 +268,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
             class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
           />
           <div
-            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
             style="animation-duration: 10s;"
           />
         </div>
@@ -279,7 +279,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
             class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
           />
           <div
-            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
             style="animation-duration: 10s;"
           />
         </div>
@@ -290,7 +290,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot for 8 items 1`] =
             class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
           />
           <div
-            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_primary__7o6k06ef ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
             style="animation-duration: 10s;"
           />
         </div>
@@ -305,20 +305,20 @@ exports[`<HorizontalAutoScroller /> should match the snapshot with custom slider
   class="reset_block__6swfds3"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf Stack_child_default__1hhisnca Stack_child_spaces_5__1hhisnc4"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg Stack_child_default__1hhisnca Stack_child_spaces_5__1hhisnc4"
   >
     <div
       class="reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 useBoxStyles_overflow_hidden__7o6k06f5"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_absolute__7o6k06ez useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs HorizontalAutoScroller_controllerBtn__jv39ij0 HorizontalAutoScroller_prevBtn__jv39ij2"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_absolute__7o6k06ez useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt HorizontalAutoScroller_controllerBtn__jv39ij0 HorizontalAutoScroller_prevBtn__jv39ij2"
       >
         <button
-          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_size_medium_rounded__11v3fwxb Button_size_medium_iconOnly__11v3fwxc Button_enabled__11v3fwx4"
+          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_size_medium_rounded__11v3fwxb Button_size_medium_iconOnly__11v3fwxc Button_enabled__11v3fwx4"
           type="button"
         >
           <div
-            class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+            class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
           >
             <i
               class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -340,10 +340,10 @@ exports[`<HorizontalAutoScroller /> should match the snapshot with custom slider
         </button>
       </div>
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqg useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4g Columns_align_stretch__wkgcjh2b Columns_wrapping_noWrap__wkgcjh29"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqg useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4g Columns_align_stretch__wkgcjh2b Columns_wrapping_noWrap__wkgcjh29"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k"
+          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey HorizontalAutoScroller_controllerCol__jv39ij1"
@@ -352,7 +352,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot with custom slider
           </div>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
+          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
@@ -365,7 +365,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot with custom slider
           </div>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
+          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
@@ -378,7 +378,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot with custom slider
           </div>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
+          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
@@ -391,7 +391,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot with custom slider
           </div>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
+          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k Column_makeResponsiveStyle_key_bp__2660ru0 Column_align_stretch__2660ru18"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
@@ -404,7 +404,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot with custom slider
           </div>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k"
+          class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjhg Columns_makeResponsiveStyle_key_bp__wkgcjh1k"
         >
           <div
             class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey HorizontalAutoScroller_controllerCol__jv39ij1"
@@ -414,14 +414,14 @@ exports[`<HorizontalAutoScroller /> should match the snapshot with custom slider
         </div>
       </div>
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_absolute__7o6k06ez useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h0 HorizontalAutoScroller_controllerBtn__jv39ij0 HorizontalAutoScroller_nextBtn__jv39ij3"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_absolute__7o6k06ez useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06h1 HorizontalAutoScroller_controllerBtn__jv39ij0 HorizontalAutoScroller_nextBtn__jv39ij3"
       >
         <button
-          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_size_medium_rounded__11v3fwxb Button_size_medium_iconOnly__11v3fwxc Button_enabled__11v3fwx4"
+          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_medium_default__11v3fwxa Button_size_medium_rounded__11v3fwxb Button_size_medium_iconOnly__11v3fwxc Button_enabled__11v3fwx4"
           type="button"
         >
           <div
-            class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+            class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
           >
             <i
               class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -445,7 +445,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot with custom slider
     </div>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf Stack_child_default__1hhisnca Stack_child_spaces_5__1hhisnc4"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg Stack_child_default__1hhisnca Stack_child_spaces_5__1hhisnc4"
   >
     <div
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew Section_root__15167c40 Section_width_small__15167c41"
@@ -472,7 +472,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot with custom slider
             class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_yellow500__7o6k06e0 ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
           />
           <div
-            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_yellow500__7o6k06e0 ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_yellow500__7o6k06e0 ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
             style="animation-duration: 10s;"
           />
         </div>
@@ -483,7 +483,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot with custom slider
             class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_yellow500__7o6k06e0 ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
           />
           <div
-            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_yellow500__7o6k06e0 ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_yellow500__7o6k06e0 ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
             style="animation-duration: 10s;"
           />
         </div>
@@ -494,7 +494,7 @@ exports[`<HorizontalAutoScroller /> should match the snapshot with custom slider
             class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_yellow500__7o6k06e0 ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
           />
           <div
-            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_yellow500__7o6k06e0 ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+            class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_yellow500__7o6k06e0 ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
             style="animation-duration: 10s;"
           />
         </div>
diff --git a/packages/overdrive/lib/components/Inline/__snapshots__/Inline.spec.jsx.snap b/packages/overdrive/lib/components/Inline/__snapshots__/Inline.spec.jsx.snap
index 3f95c2a43..5c16d039c 100644
--- a/packages/overdrive/lib/components/Inline/__snapshots__/Inline.spec.jsx.snap
+++ b/packages/overdrive/lib/components/Inline/__snapshots__/Inline.spec.jsx.snap
@@ -2,10 +2,10 @@
 
 exports[`<Inline /> should match snapshot for custom element dividers 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44"
+  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <span
       class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -21,7 +21,7 @@ exports[`<Inline /> should match snapshot for custom element dividers 1`] = `
     </div>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <span
       class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -37,7 +37,7 @@ exports[`<Inline /> should match snapshot for custom element dividers 1`] = `
     </div>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <span
       class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -50,10 +50,10 @@ exports[`<Inline /> should match snapshot for custom element dividers 1`] = `
 
 exports[`<Inline /> should match snapshot for default dividers 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44"
+  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <span
       class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -71,7 +71,7 @@ exports[`<Inline /> should match snapshot for default dividers 1`] = `
     </div>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <span
       class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -89,7 +89,7 @@ exports[`<Inline /> should match snapshot for default dividers 1`] = `
     </div>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <span
       class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -102,10 +102,10 @@ exports[`<Inline /> should match snapshot for default dividers 1`] = `
 
 exports[`<Inline /> should match snapshot for no dividers 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4"
+  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <span
       class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -114,7 +114,7 @@ exports[`<Inline /> should match snapshot for no dividers 1`] = `
     </span>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <span
       class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -123,7 +123,7 @@ exports[`<Inline /> should match snapshot for no dividers 1`] = `
     </span>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <span
       class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -136,10 +136,10 @@ exports[`<Inline /> should match snapshot for no dividers 1`] = `
 
 exports[`<Inline /> should not be able to render components 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44"
+  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <span
       class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -155,7 +155,7 @@ exports[`<Inline /> should not be able to render components 1`] = `
     </div>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <span
       class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
diff --git a/packages/overdrive/lib/components/Meta/__snapshots__/Meta.spec.jsx.snap b/packages/overdrive/lib/components/Meta/__snapshots__/Meta.spec.jsx.snap
index b50d92753..e33523eca 100644
--- a/packages/overdrive/lib/components/Meta/__snapshots__/Meta.spec.jsx.snap
+++ b/packages/overdrive/lib/components/Meta/__snapshots__/Meta.spec.jsx.snap
@@ -2,10 +2,10 @@
 
 exports[`<Meta /> should match snapshot with label, icon for Primary variant 1`] = `
 <span
-  class="reset_inlineText__6swfds2 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4"
+  class="reset_inlineText__6swfds2 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <i
       class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q60 Meta_variant_primary__1f570jc0"
@@ -23,7 +23,7 @@ exports[`<Meta /> should match snapshot with label, icon for Primary variant 1`]
     </i>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <span
       class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -36,10 +36,10 @@ exports[`<Meta /> should match snapshot with label, icon for Primary variant 1`]
 
 exports[`<Meta /> should match snapshot with label, icon for Secondary variant 1`] = `
 <span
-  class="reset_inlineText__6swfds2 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4"
+  class="reset_inlineText__6swfds2 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <i
       class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q60 Meta_variant_secondary__1f570jc1"
@@ -57,7 +57,7 @@ exports[`<Meta /> should match snapshot with label, icon for Secondary variant 1
     </i>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <span
       class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
diff --git a/packages/overdrive/lib/components/MinimalModal/__snapshots__/MinimalModal.spec.jsx.snap b/packages/overdrive/lib/components/MinimalModal/__snapshots__/MinimalModal.spec.jsx.snap
index 5275a8899..6752305ba 100644
--- a/packages/overdrive/lib/components/MinimalModal/__snapshots__/MinimalModal.spec.jsx.snap
+++ b/packages/overdrive/lib/components/MinimalModal/__snapshots__/MinimalModal.spec.jsx.snap
@@ -27,17 +27,17 @@ exports[`<MinimalModal /> should match snapshot with body 1`] = `
       >
         <div
           aria-hidden="false"
-          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw MinimalModal_container__1psw41b0"
+          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx MinimalModal_container__1psw41b0"
           role="none presentation"
         >
           <article
             aria-labelledby="od-4"
             aria-modal="true"
-            class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf"
+            class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg"
             role="dialog"
           >
             <main
-              class="useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf useBoxStyles_flexGrow_1__7o6k06go MinimalModal_content__1psw41b1"
+              class="useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg useBoxStyles_flexGrow_1__7o6k06gp MinimalModal_content__1psw41b1"
             >
               <p>
                 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis convallis neque a laoreet maximus. Vestibulum hendrerit quam at mi venenatis faucibus at vel nisi. In ut risus et ipsum tincidunt tempor. Suspendisse potenti. Praesent faucibus posuere risus, at congue mauris porttitor ut. Donec sit amet elit vitae purus dictum aliquet quis ut ligula. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vestibulum dui sapien, porttitor ac erat vel, malesuada rutrum mauris. Nam arcu tellus, pretium ut aliquet eget, ultrices vel est. Maecenas dapibus volutpat eros a volutpat.
@@ -83,17 +83,17 @@ exports[`<MinimalModal /> should match snapshot without title and body 1`] = `
       >
         <div
           aria-hidden="false"
-          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw MinimalModal_container__1psw41b0"
+          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx MinimalModal_container__1psw41b0"
           role="none presentation"
         >
           <article
             aria-labelledby="od-3"
             aria-modal="true"
-            class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf"
+            class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg"
             role="dialog"
           >
             <main
-              class="useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf useBoxStyles_flexGrow_1__7o6k06go MinimalModal_content__1psw41b1"
+              class="useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg useBoxStyles_flexGrow_1__7o6k06gp MinimalModal_content__1psw41b1"
             />
           </article>
         </div>
diff --git a/packages/overdrive/lib/components/NumberBubble/__snapshots__/NumberBubble.spec.jsx.snap b/packages/overdrive/lib/components/NumberBubble/__snapshots__/NumberBubble.spec.jsx.snap
index b4058c57e..fa1521b92 100644
--- a/packages/overdrive/lib/components/NumberBubble/__snapshots__/NumberBubble.spec.jsx.snap
+++ b/packages/overdrive/lib/components/NumberBubble/__snapshots__/NumberBubble.spec.jsx.snap
@@ -2,7 +2,7 @@
 
 exports[`<Section /> should match the snapshot for negative value 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k062c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_gray900__7o6k06dd"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k062c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_gray900__7o6k06dd"
 >
   <span
     class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_2__w6to7i2 NumberBubble_bubbleText__pyrcml0 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez"
@@ -14,7 +14,7 @@ exports[`<Section /> should match the snapshot for negative value 1`] = `
 
 exports[`<Section /> should match the snapshot for positive value 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k062c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_gray900__7o6k06dd"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k062c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_gray900__7o6k06dd"
 >
   <span
     class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_2__w6to7i2 NumberBubble_bubbleText__pyrcml0 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez"
diff --git a/packages/overdrive/lib/components/NumberInput/__snapshots__/NumberInput.spec.jsx.snap b/packages/overdrive/lib/components/NumberInput/__snapshots__/NumberInput.spec.jsx.snap
index 7e9615dde..a5f3aff6d 100644
--- a/packages/overdrive/lib/components/NumberInput/__snapshots__/NumberInput.spec.jsx.snap
+++ b/packages/overdrive/lib/components/NumberInput/__snapshots__/NumberInput.spec.jsx.snap
@@ -19,7 +19,7 @@ exports[`<NumberInput /> should have some hintText 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -28,12 +28,12 @@ exports[`<NumberInput /> should have some hintText 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
           for="id"
         >
           placeholder
@@ -71,7 +71,7 @@ exports[`<NumberInput /> should match snapshot 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -80,12 +80,12 @@ exports[`<NumberInput /> should match snapshot 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
           for="id"
         >
           placeholder something
@@ -117,7 +117,7 @@ exports[`<NumberInput /> should match snapshot when active 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_activeBorderColour__9z39d71"
@@ -126,12 +126,12 @@ exports[`<NumberInput /> should match snapshot when active 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_activeBorderColour__9z39d71"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           placeholder something
         </label>
@@ -163,7 +163,7 @@ exports[`<NumberInput /> should match snapshot when loading 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -172,12 +172,12 @@ exports[`<NumberInput /> should match snapshot when loading 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
           for="id"
         >
           placeholder something
@@ -209,7 +209,7 @@ exports[`<NumberInput /> should match snapshot when touched 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_error_default_borderColour__9z39d7d"
@@ -218,12 +218,12 @@ exports[`<NumberInput /> should match snapshot when touched 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_error_default_borderColour__9z39d7d"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           placeholder something
         </label>
@@ -254,7 +254,7 @@ exports[`<NumberInput /> should match snapshot when touched and invalid 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_error_default_borderColour__9z39d7d"
@@ -263,12 +263,12 @@ exports[`<NumberInput /> should match snapshot when touched and invalid 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_error_default_borderColour__9z39d7d"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           placeholder something
         </label>
@@ -299,7 +299,7 @@ exports[`<NumberInput /> should match snapshot when touched and valid 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_success_default_borderColour__9z39d77"
@@ -308,12 +308,12 @@ exports[`<NumberInput /> should match snapshot when touched and valid 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_success_default_borderColour__9z39d77"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           placeholder something
         </label>
@@ -337,7 +337,7 @@ exports[`<NumberInput /> should match snapshot with both icons 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <i
-        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_prefixIcon__bd4oidf withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_prefixIcon__bd4oidf withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
         role="presentation"
       >
         <svg
@@ -351,7 +351,7 @@ exports[`<NumberInput /> should match snapshot with both icons 1`] = `
         </svg>
       </i>
       <i
-        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
         role="presentation"
       >
         <svg
@@ -372,7 +372,7 @@ exports[`<NumberInput /> should match snapshot with both icons 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -381,12 +381,12 @@ exports[`<NumberInput /> should match snapshot with both icons 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_defaultPrefixed__1r7zdxgz"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_defaultPrefixed__1r7zdxgz"
         >
           placeholder something
         </label>
@@ -410,7 +410,7 @@ exports[`<NumberInput /> should match snapshot with prefix icon 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <i
-        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_prefixIcon__bd4oidf withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_prefixIcon__bd4oidf withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
         role="presentation"
       >
         <svg
@@ -431,7 +431,7 @@ exports[`<NumberInput /> should match snapshot with prefix icon 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -440,12 +440,12 @@ exports[`<NumberInput /> should match snapshot with prefix icon 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_defaultPrefixed__1r7zdxgz"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_defaultPrefixed__1r7zdxgz"
         >
           placeholder something
         </label>
@@ -469,7 +469,7 @@ exports[`<NumberInput /> should match snapshot with suffix icon 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <i
-        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
         role="presentation"
       >
         <svg
@@ -490,7 +490,7 @@ exports[`<NumberInput /> should match snapshot with suffix icon 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -499,12 +499,12 @@ exports[`<NumberInput /> should match snapshot with suffix icon 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           placeholder something
         </label>
diff --git a/packages/overdrive/lib/components/Pagination/__snapshots__/Pagination.spec.jsx.snap b/packages/overdrive/lib/components/Pagination/__snapshots__/Pagination.spec.jsx.snap
index 7f45bf581..80d2879f2 100644
--- a/packages/overdrive/lib/components/Pagination/__snapshots__/Pagination.spec.jsx.snap
+++ b/packages/overdrive/lib/components/Pagination/__snapshots__/Pagination.spec.jsx.snap
@@ -2,15 +2,15 @@
 
 exports[`<Pagination /> should match snapshot for loading phase 1`] = `
 <span
-  class="reset_inlineText__6swfds2 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y48 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq8"
+  class="reset_inlineText__6swfds2 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y48 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq8"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <button
       aria-disabled="true"
       aria-label=""
-      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k062c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_userSelect_none__7o6k06fi useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii Pagination_disabled__1ira5ug0"
+      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k062c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_userSelect_none__7o6k06fj useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii Pagination_disabled__1ira5ug0"
     >
       <i
         class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -31,33 +31,33 @@ exports[`<Pagination /> should match snapshot for loading phase 1`] = `
     </button>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <button
-      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_display_flex__7o6k06fb useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_backgroundColours_gray200__7o6k06d6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Pagination_disabled__1ira5ug0 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_3__w6to7i3 Pagination_activeItem__1ira5ug2"
+      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_display_flex__7o6k06fb useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_backgroundColours_gray200__7o6k06d6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Pagination_disabled__1ira5ug0 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_3__w6to7i3 Pagination_activeItem__1ira5ug2"
     />
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <button
-      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_display_flex__7o6k06fb useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_backgroundColours_gray200__7o6k06d6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Pagination_disabled__1ira5ug0 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_3__w6to7i3 Pagination_activeItem__1ira5ug2"
+      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_display_flex__7o6k06fb useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_backgroundColours_gray200__7o6k06d6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Pagination_disabled__1ira5ug0 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_3__w6to7i3 Pagination_activeItem__1ira5ug2"
     />
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <button
-      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_display_flex__7o6k06fb useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_backgroundColours_gray200__7o6k06d6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Pagination_disabled__1ira5ug0 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_3__w6to7i3 Pagination_activeItem__1ira5ug2"
+      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_display_flex__7o6k06fb useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_backgroundColours_gray200__7o6k06d6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Pagination_disabled__1ira5ug0 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_3__w6to7i3 Pagination_activeItem__1ira5ug2"
     />
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <button
       aria-disabled="true"
       aria-label=""
-      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k062c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_userSelect_none__7o6k06fi useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii Pagination_disabled__1ira5ug0"
+      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k062c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_userSelect_none__7o6k06fj useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii Pagination_disabled__1ira5ug0"
     >
       <i
         class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
diff --git a/packages/overdrive/lib/components/ProgressBarGroup/__snapshots__/ProgressBarGroup.spec.jsx.snap b/packages/overdrive/lib/components/ProgressBarGroup/__snapshots__/ProgressBarGroup.spec.jsx.snap
index b061126e5..c06040d3a 100644
--- a/packages/overdrive/lib/components/ProgressBarGroup/__snapshots__/ProgressBarGroup.spec.jsx.snap
+++ b/packages/overdrive/lib/components/ProgressBarGroup/__snapshots__/ProgressBarGroup.spec.jsx.snap
@@ -2,7 +2,7 @@
 
 exports[`<ProgressBarGroup /> should match the snapshot 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz ProgressBarGroup_root__1c7hlxy0"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 ProgressBarGroup_root__1c7hlxy0"
   style="grid-template-columns: 1fr;"
 >
   <span
@@ -52,7 +52,7 @@ exports[`<ProgressBarGroup /> should match the snapshot 1`] = `
 
 exports[`<ProgressBarGroup /> should should ignore extra labels 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz ProgressBarGroup_root__1c7hlxy0"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 ProgressBarGroup_root__1c7hlxy0"
   style="grid-template-columns: auto 1fr;"
 >
   <span
@@ -108,7 +108,7 @@ exports[`<ProgressBarGroup /> should should ignore extra labels 1`] = `
 
 exports[`<ProgressBarGroup /> should should ignore not break when not enough labels 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz ProgressBarGroup_root__1c7hlxy0"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 ProgressBarGroup_root__1c7hlxy0"
   style="grid-template-columns: auto 1fr;"
 >
   <span
@@ -160,7 +160,7 @@ exports[`<ProgressBarGroup /> should should ignore not break when not enough lab
 
 exports[`<ProgressBarGroup /> should should render a prefix for every value 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz ProgressBarGroup_root__1c7hlxy0"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 ProgressBarGroup_root__1c7hlxy0"
   style="grid-template-columns: auto 1fr;"
 >
   <span
diff --git a/packages/overdrive/lib/components/Radio/__snapshots__/Radio.spec.jsx.snap b/packages/overdrive/lib/components/Radio/__snapshots__/Radio.spec.jsx.snap
index 2429ee6aa..b8899bd3e 100644
--- a/packages/overdrive/lib/components/Radio/__snapshots__/Radio.spec.jsx.snap
+++ b/packages/overdrive/lib/components/Radio/__snapshots__/Radio.spec.jsx.snap
@@ -2,10 +2,10 @@
 
 exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot for a checked radio 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
   >
     <input
       class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 CheckableBase_nativeInput_default__v1tznp2"
@@ -14,7 +14,7 @@ exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot f
       value="1"
     />
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ax useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bt useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c9 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct CheckableBase_checkableItem__v1tznp5 Radio_circle_default__lhd8u00 Radio_circle_outer__lhd8u01"
@@ -34,7 +34,7 @@ exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot f
     </label>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
   >
     <input
       class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 CheckableBase_nativeInput_default__v1tznp2"
@@ -43,7 +43,7 @@ exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot f
       value="2"
     />
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ax useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bt useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c9 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct CheckableBase_checkableItem__v1tznp5 Radio_circle_default__lhd8u00 Radio_circle_outer__lhd8u01"
@@ -67,10 +67,10 @@ exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot f
 
 exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot for a group of radios 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
   >
     <input
       checked=""
@@ -80,7 +80,7 @@ exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot f
       value="1"
     />
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ax useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bt useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c9 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct CheckableBase_checkableItem__v1tznp5 Radio_circle_default__lhd8u00 Radio_circle_outer__lhd8u01 Radio_circle_selected__lhd8u04"
@@ -100,7 +100,7 @@ exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot f
     </label>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
   >
     <input
       class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 CheckableBase_nativeInput_default__v1tznp2"
@@ -109,7 +109,7 @@ exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot f
       value="2"
     />
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ax useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bt useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c9 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct CheckableBase_checkableItem__v1tznp5 Radio_circle_default__lhd8u00 Radio_circle_outer__lhd8u01"
@@ -129,7 +129,7 @@ exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot f
     </label>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
   >
     <input
       class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 CheckableBase_nativeInput_default__v1tznp2"
@@ -138,7 +138,7 @@ exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot f
       value="3"
     />
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ax useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bt useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c9 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct CheckableBase_checkableItem__v1tznp5 Radio_circle_default__lhd8u00 Radio_circle_outer__lhd8u01"
@@ -158,7 +158,7 @@ exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot f
     </label>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
   >
     <input
       class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 CheckableBase_nativeInput_default__v1tznp2"
@@ -167,7 +167,7 @@ exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot f
       value="4"
     />
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ax useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bt useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c9 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct CheckableBase_checkableItem__v1tznp5 Radio_circle_default__lhd8u00 Radio_circle_outer__lhd8u01"
@@ -191,10 +191,10 @@ exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot f
 
 exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot for a single radio 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
   >
     <input
       class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 CheckableBase_nativeInput_default__v1tznp2"
@@ -203,7 +203,7 @@ exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot f
       value="1"
     />
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ax useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bt useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c9 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct CheckableBase_checkableItem__v1tznp5 Radio_circle_default__lhd8u00 Radio_circle_outer__lhd8u01"
@@ -227,10 +227,10 @@ exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot f
 
 exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot for a single radio with no value or label 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
   >
     <input
       checked=""
@@ -240,7 +240,7 @@ exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot f
       value=""
     />
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ax useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bt useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c9 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct CheckableBase_checkableItem__v1tznp5 Radio_circle_default__lhd8u00 Radio_circle_outer__lhd8u01 Radio_circle_selected__lhd8u04"
@@ -255,10 +255,10 @@ exports[`<RadioButton /> when nested in a RadioGroup should match the snapshot f
 
 exports[`<RadioButton /> when with component child should match the snapshot 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt CheckableBase_root__v1tznp0 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
   >
     <input
       class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 CheckableBase_nativeInput_default__v1tznp2"
@@ -267,7 +267,7 @@ exports[`<RadioButton /> when with component child should match the snapshot 1`]
       value="1"
     />
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx CheckableBase_checkable__v1tznp4 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ax useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bt useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c9 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct CheckableBase_checkableItem__v1tznp5 Radio_circle_default__lhd8u00 Radio_circle_outer__lhd8u01"
diff --git a/packages/overdrive/lib/components/SelectInput/__snapshots__/SelectInput.spec.jsx.snap b/packages/overdrive/lib/components/SelectInput/__snapshots__/SelectInput.spec.jsx.snap
index 00f0bce05..8e78df0b3 100644
--- a/packages/overdrive/lib/components/SelectInput/__snapshots__/SelectInput.spec.jsx.snap
+++ b/packages/overdrive/lib/components/SelectInput/__snapshots__/SelectInput.spec.jsx.snap
@@ -11,11 +11,11 @@ exports[`<SelectInput /> should have some hintText 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <select
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_select__6swfds7 useBoxStyles_flexGrow_1__7o6k06go SelectInput_input__hhupzp0 SelectInput_paddedInput__hhupzp1 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_select__6swfds7 useBoxStyles_flexGrow_1__7o6k06gp SelectInput_input__hhupzp0 SelectInput_paddedInput__hhupzp1 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
         >
           <option
             value="a"
@@ -34,7 +34,7 @@ exports[`<SelectInput /> should have some hintText 1`] = `
           </option>
         </select>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k065w useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp SelectInput_arrow__hhupzp2"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k065w useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq SelectInput_arrow__hhupzp2"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -56,7 +56,7 @@ exports[`<SelectInput /> should have some hintText 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -65,12 +65,12 @@ exports[`<SelectInput /> should have some hintText 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           Hello World!
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           Hello World!
         </label>
@@ -99,11 +99,11 @@ exports[`<SelectInput /> should match snapshot 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <select
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_select__6swfds7 useBoxStyles_flexGrow_1__7o6k06go SelectInput_input__hhupzp0 SelectInput_paddedInput__hhupzp1 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_select__6swfds7 useBoxStyles_flexGrow_1__7o6k06gp SelectInput_input__hhupzp0 SelectInput_paddedInput__hhupzp1 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
         >
           <option
             value="a"
@@ -122,7 +122,7 @@ exports[`<SelectInput /> should match snapshot 1`] = `
           </option>
         </select>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k065w useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp SelectInput_arrow__hhupzp2"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k065w useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq SelectInput_arrow__hhupzp2"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -144,7 +144,7 @@ exports[`<SelectInput /> should match snapshot 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -153,12 +153,12 @@ exports[`<SelectInput /> should match snapshot 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           Hello World!
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           Hello World!
         </label>
@@ -182,11 +182,11 @@ exports[`<SelectInput /> should match snapshot when active 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <select
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_select__6swfds7 useBoxStyles_flexGrow_1__7o6k06go SelectInput_input__hhupzp0 SelectInput_paddedInput__hhupzp1 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_select__6swfds7 useBoxStyles_flexGrow_1__7o6k06gp SelectInput_input__hhupzp0 SelectInput_paddedInput__hhupzp1 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
         >
           <option
             value="a"
@@ -205,7 +205,7 @@ exports[`<SelectInput /> should match snapshot when active 1`] = `
           </option>
         </select>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k065w useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp SelectInput_arrow__hhupzp2"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k065w useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq SelectInput_arrow__hhupzp2"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -227,7 +227,7 @@ exports[`<SelectInput /> should match snapshot when active 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_activeBorderColour__9z39d71"
@@ -241,7 +241,7 @@ exports[`<SelectInput /> should match snapshot when active 1`] = `
           Hello World!
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_activeColour__9z39d70 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_activeColour__9z39d70 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           Hello World!
         </label>
@@ -265,11 +265,11 @@ exports[`<SelectInput /> should match snapshot when touched 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <select
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_select__6swfds7 useBoxStyles_flexGrow_1__7o6k06go SelectInput_input__hhupzp0 SelectInput_paddedInput__hhupzp1 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_select__6swfds7 useBoxStyles_flexGrow_1__7o6k06gp SelectInput_input__hhupzp0 SelectInput_paddedInput__hhupzp1 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
         >
           <option
             value="a"
@@ -288,7 +288,7 @@ exports[`<SelectInput /> should match snapshot when touched 1`] = `
           </option>
         </select>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k065w useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp SelectInput_arrow__hhupzp2"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k065w useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq SelectInput_arrow__hhupzp2"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -310,7 +310,7 @@ exports[`<SelectInput /> should match snapshot when touched 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_error_default_borderColour__9z39d7d"
@@ -319,12 +319,12 @@ exports[`<SelectInput /> should match snapshot when touched 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_error_default_borderColour__9z39d7d"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           Hello World!
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           Hello World!
         </label>
@@ -348,11 +348,11 @@ exports[`<SelectInput /> should match snapshot when touched and invalid 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <select
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_select__6swfds7 useBoxStyles_flexGrow_1__7o6k06go SelectInput_input__hhupzp0 SelectInput_paddedInput__hhupzp1 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_select__6swfds7 useBoxStyles_flexGrow_1__7o6k06gp SelectInput_input__hhupzp0 SelectInput_paddedInput__hhupzp1 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
         >
           <option
             value="a"
@@ -371,7 +371,7 @@ exports[`<SelectInput /> should match snapshot when touched and invalid 1`] = `
           </option>
         </select>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k065w useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp SelectInput_arrow__hhupzp2"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k065w useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq SelectInput_arrow__hhupzp2"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -393,7 +393,7 @@ exports[`<SelectInput /> should match snapshot when touched and invalid 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_error_default_borderColour__9z39d7d"
@@ -402,12 +402,12 @@ exports[`<SelectInput /> should match snapshot when touched and invalid 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_error_default_borderColour__9z39d7d"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           Hello World!
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           Hello World!
         </label>
@@ -431,11 +431,11 @@ exports[`<SelectInput /> should match snapshot when touched and valid 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <select
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_select__6swfds7 useBoxStyles_flexGrow_1__7o6k06go SelectInput_input__hhupzp0 SelectInput_paddedInput__hhupzp1 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_select__6swfds7 useBoxStyles_flexGrow_1__7o6k06gp SelectInput_input__hhupzp0 SelectInput_paddedInput__hhupzp1 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
         >
           <option
             value="a"
@@ -454,7 +454,7 @@ exports[`<SelectInput /> should match snapshot when touched and valid 1`] = `
           </option>
         </select>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k065w useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp SelectInput_arrow__hhupzp2"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k065w useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq SelectInput_arrow__hhupzp2"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -476,7 +476,7 @@ exports[`<SelectInput /> should match snapshot when touched and valid 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_success_default_borderColour__9z39d77"
@@ -485,12 +485,12 @@ exports[`<SelectInput /> should match snapshot when touched and valid 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_success_default_borderColour__9z39d77"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           Hello World!
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           Hello World!
         </label>
@@ -514,14 +514,14 @@ exports[`<SelectInput /> should match snapshot with custom icon 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <select
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_select__6swfds7 useBoxStyles_flexGrow_1__7o6k06go SelectInput_input__hhupzp0 SelectInput_paddedInput__hhupzp1 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_select__6swfds7 useBoxStyles_flexGrow_1__7o6k06gp SelectInput_input__hhupzp0 SelectInput_paddedInput__hhupzp1 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida"
         />
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k065w useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp SelectInput_arrow__hhupzp2"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k065w useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq SelectInput_arrow__hhupzp2"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -541,7 +541,7 @@ exports[`<SelectInput /> should match snapshot with custom icon 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -550,12 +550,12 @@ exports[`<SelectInput /> should match snapshot with custom icon 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           placeholder something
         </label>
@@ -579,7 +579,7 @@ exports[`<SelectInput /> should match snapshot with prefix icon 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <i
-        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_prefixIcon__bd4oidf withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_prefixIcon__bd4oidf withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
         role="presentation"
       >
         <svg
@@ -593,14 +593,14 @@ exports[`<SelectInput /> should match snapshot with prefix icon 1`] = `
         </svg>
       </i>
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
       >
         <select
           autocomplete="off"
-          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_select__6swfds7 useBoxStyles_flexGrow_1__7o6k06go SelectInput_input__hhupzp0 SelectInput_paddedInput__hhupzp1 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida withEnhancedInput_inputItselfSize_medium_prefixed_any__bd4oidc"
+          class="reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_select__6swfds7 useBoxStyles_flexGrow_1__7o6k06gp SelectInput_input__hhupzp0 SelectInput_paddedInput__hhupzp1 reset_trimmedBlockElement__6swfds5 reset_appearance__6swfds0 reset_input__6swfds8 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_transparent__7o6k06en withEnhancedInput_input_itself_root__bd4oid0 withEnhancedInput_inputItselfSize_medium_root_any__bd4oida withEnhancedInput_inputItselfSize_medium_prefixed_any__bd4oidc"
         />
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k065w useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp SelectInput_arrow__hhupzp2"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k065w useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq SelectInput_arrow__hhupzp2"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -622,7 +622,7 @@ exports[`<SelectInput /> should match snapshot with prefix icon 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -631,12 +631,12 @@ exports[`<SelectInput /> should match snapshot with prefix icon 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_defaultPrefixed__1r7zdxgz"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_defaultPrefixed__1r7zdxgz"
         >
           placeholder something
         </label>
diff --git a/packages/overdrive/lib/components/SimplePagination/__snapshots__/SimplePagination.spec.jsx.snap b/packages/overdrive/lib/components/SimplePagination/__snapshots__/SimplePagination.spec.jsx.snap
index 840bd47b7..81329af2f 100644
--- a/packages/overdrive/lib/components/SimplePagination/__snapshots__/SimplePagination.spec.jsx.snap
+++ b/packages/overdrive/lib/components/SimplePagination/__snapshots__/SimplePagination.spec.jsx.snap
@@ -2,20 +2,20 @@
 
 exports[`<SimplePagination /> should match snapshot for hasNext 1`] = `
 <nav
-  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4k useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqk"
+  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4k useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqk"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063w useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063w useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <button
       aria-label="previous page"
-      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_variant_secondary__11v3fwxe Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_disabled__11v3fwx5"
+      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_variant_secondary__11v3fwxe Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_disabled__11v3fwx5"
       disabled=""
       tabindex="-1"
       type="button"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+        class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
       >
         <i
           class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -37,15 +37,15 @@ exports[`<SimplePagination /> should match snapshot for hasNext 1`] = `
     </button>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063w useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063w useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <button
       aria-label="next page"
-      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_enabled__11v3fwx4"
+      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_enabled__11v3fwx4"
       type="button"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+        class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
       >
         <i
           class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -71,18 +71,18 @@ exports[`<SimplePagination /> should match snapshot for hasNext 1`] = `
 
 exports[`<SimplePagination /> should match snapshot for hasNext and hasPrevious 1`] = `
 <nav
-  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4k useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqk"
+  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4k useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqk"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063w useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063w useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <button
       aria-label="previous page"
-      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_enabled__11v3fwx4"
+      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_enabled__11v3fwx4"
       type="button"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+        class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
       >
         <i
           class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -104,15 +104,15 @@ exports[`<SimplePagination /> should match snapshot for hasNext and hasPrevious
     </button>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063w useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063w useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <button
       aria-label="next page"
-      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_enabled__11v3fwx4"
+      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_enabled__11v3fwx4"
       type="button"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+        class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
       >
         <i
           class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -138,18 +138,18 @@ exports[`<SimplePagination /> should match snapshot for hasNext and hasPrevious
 
 exports[`<SimplePagination /> should match snapshot for hasPrevious 1`] = `
 <nav
-  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4k useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqk"
+  class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4k useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqk"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063w useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063w useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <button
       aria-label="previous page"
-      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_enabled__11v3fwx4"
+      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_defaultStates_secondary__11v3fwxk Button_variant_secondary__11v3fwxe Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_enabled__11v3fwx4"
       type="button"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+        class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
       >
         <i
           class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
@@ -171,17 +171,17 @@ exports[`<SimplePagination /> should match snapshot for hasPrevious 1`] = `
     </button>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063w useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063w useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
   >
     <button
       aria-label="next page"
-      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_variant_secondary__11v3fwxe Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_disabled__11v3fwx5"
+      class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_variant_secondary__11v3fwxe Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_disabled__11v3fwx5"
       disabled=""
       tabindex="-1"
       type="button"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+        class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
       >
         <i
           class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64"
diff --git a/packages/overdrive/lib/components/SliderProgress/__snapshots__/ProgressSteps.spec.jsx.snap b/packages/overdrive/lib/components/SliderProgress/__snapshots__/ProgressSteps.spec.jsx.snap
index 2b660cb1f..5c0f311f2 100644
--- a/packages/overdrive/lib/components/SliderProgress/__snapshots__/ProgressSteps.spec.jsx.snap
+++ b/packages/overdrive/lib/components/SliderProgress/__snapshots__/ProgressSteps.spec.jsx.snap
@@ -9,7 +9,7 @@ exports[`<ProgressStep /> should match the snapshot for 8 items 1`] = `
     class="reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 SliderProgress_step__29afw91"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
+      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
     />
     <div
       class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3 ProgressStep_passed__1sg9vym6"
@@ -34,7 +34,7 @@ exports[`<ProgressStep /> should match the snapshot for 8 items 1`] = `
       class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
     />
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
       style="animation-duration: 1s;"
     />
   </div>
@@ -45,7 +45,7 @@ exports[`<ProgressStep /> should match the snapshot for 8 items 1`] = `
       class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
     />
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
       style="animation-duration: 1s;"
     />
   </div>
@@ -56,7 +56,7 @@ exports[`<ProgressStep /> should match the snapshot for 8 items 1`] = `
       class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
     />
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
       style="animation-duration: 1s;"
     />
   </div>
@@ -67,7 +67,7 @@ exports[`<ProgressStep /> should match the snapshot for 8 items 1`] = `
       class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
     />
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
       style="animation-duration: 1s;"
     />
   </div>
@@ -78,7 +78,7 @@ exports[`<ProgressStep /> should match the snapshot for 8 items 1`] = `
       class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
     />
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
       style="animation-duration: 1s;"
     />
   </div>
@@ -89,7 +89,7 @@ exports[`<ProgressStep /> should match the snapshot for 8 items 1`] = `
       class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
     />
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_white__7o6k06ee ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
       style="animation-duration: 1s;"
     />
   </div>
@@ -105,7 +105,7 @@ exports[`<ProgressStep /> should match the snapshot with custom background 1`] =
     class="reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 SliderProgress_step__29afw91"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_yellow500__7o6k06e0 ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
+      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_yellow500__7o6k06e0 ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
     />
     <div
       class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_yellow500__7o6k06e0 ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3 ProgressStep_passed__1sg9vym6"
@@ -130,7 +130,7 @@ exports[`<ProgressStep /> should match the snapshot with custom background 1`] =
       class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_yellow500__7o6k06e0 ProgressStep_item__1sg9vym2 ProgressStep_empty__1sg9vym0"
     />
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06ff useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_yellow500__7o6k06e0 ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
+      class="reset_block__6swfds3 useBoxStyles_display_none__7o6k06fg useBoxStyles_position_absolute__7o6k06ez useBoxStyles_backgroundColours_yellow500__7o6k06e0 ProgressStep_item__1sg9vym2 ProgressStep_fill__1sg9vym3"
       style="animation-duration: 1s;"
     />
   </div>
diff --git a/packages/overdrive/lib/components/Stack/__snapshots__/Stack.spec.jsx.snap b/packages/overdrive/lib/components/Stack/__snapshots__/Stack.spec.jsx.snap
index 76fa18475..ef3a99094 100644
--- a/packages/overdrive/lib/components/Stack/__snapshots__/Stack.spec.jsx.snap
+++ b/packages/overdrive/lib/components/Stack/__snapshots__/Stack.spec.jsx.snap
@@ -5,35 +5,35 @@ exports[`<Stack /> should correctly handle fragment nodes 1`] = `
   class="reset_block__6swfds3"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf Stack_child_default__1hhisnca Stack_child_spaces_2__1hhisnc1"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg Stack_child_default__1hhisnca Stack_child_spaces_2__1hhisnc1"
   >
     <p>
       line 0
     </p>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf Stack_child_default__1hhisnca Stack_child_spaces_2__1hhisnc1"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg Stack_child_default__1hhisnca Stack_child_spaces_2__1hhisnc1"
   >
     <p>
       Line 1
     </p>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf Stack_child_default__1hhisnca Stack_child_spaces_2__1hhisnc1"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg Stack_child_default__1hhisnca Stack_child_spaces_2__1hhisnc1"
   >
     <p>
       Line 2
     </p>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf Stack_child_default__1hhisnca Stack_child_spaces_2__1hhisnc1"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg Stack_child_default__1hhisnca Stack_child_spaces_2__1hhisnc1"
   >
     <p>
       Line 3
     </p>
   </div>
   <div
-    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf Stack_child_default__1hhisnca Stack_child_spaces_2__1hhisnc1"
+    class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg Stack_child_default__1hhisnca Stack_child_spaces_2__1hhisnc1"
   >
     <p>
       line 4
diff --git a/packages/overdrive/lib/components/StandardModal/__snapshots__/StandardModal.spec.jsx.snap b/packages/overdrive/lib/components/StandardModal/__snapshots__/StandardModal.spec.jsx.snap
index 2e080aa2a..1fc0ae704 100644
--- a/packages/overdrive/lib/components/StandardModal/__snapshots__/StandardModal.spec.jsx.snap
+++ b/packages/overdrive/lib/components/StandardModal/__snapshots__/StandardModal.spec.jsx.snap
@@ -27,20 +27,20 @@ exports[`<StandardModal /> should match snapshot with title and body 1`] = `
       >
         <div
           aria-hidden="false"
-          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw StandardModal_container__1i5jd40"
+          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx StandardModal_container__1i5jd40"
           role="none presentation"
         >
           <article
             aria-labelledby="od-4"
             aria-modal="true"
-            class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0658 useBoxStyles_display_flex__7o6k06fb useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_backgroundColours_white__7o6k06ee useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf StandardModal_modal__1i5jd41 StandardModal_modalSizeStandard__1i5jd44"
+            class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0658 useBoxStyles_display_flex__7o6k06fb useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_backgroundColours_white__7o6k06ee useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg StandardModal_modal__1i5jd41 StandardModal_modalSizeStandard__1i5jd44"
             role="dialog"
           >
             <header
-              class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063s useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_light__7o6k069l useBoxStyles_border_colour_right_light__7o6k069w useBoxStyles_border_colour_bottom_light__7o6k06a7 useBoxStyles_border_colour_left_light__7o6k06ai useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+              class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063s useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_light__7o6k069l useBoxStyles_border_colour_right_light__7o6k069w useBoxStyles_border_colour_bottom_light__7o6k06a7 useBoxStyles_border_colour_left_light__7o6k06ai useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
             >
               <div
-                class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06go"
+                class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06gp"
                 id="od-4"
               >
                 <h4
@@ -51,11 +51,11 @@ exports[`<StandardModal /> should match snapshot with title and body 1`] = `
               </div>
               <button
                 aria-label="close"
-                class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_minimal_defaults__11v3fwxp Button_minimalStates_secondary__11v3fwxs Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_enabled__11v3fwx4"
+                class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_minimal_defaults__11v3fwxp Button_minimalStates_secondary__11v3fwxs Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_enabled__11v3fwx4"
                 type="button"
               >
                 <div
-                  class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+                  class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
                 >
                   <i
                     class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_muted__w6to7ig"
@@ -77,7 +77,7 @@ exports[`<StandardModal /> should match snapshot with title and body 1`] = `
               </button>
             </header>
             <main
-              class="useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf useBoxStyles_flexGrow_1__7o6k06go StandardModal_content__1i5jd46"
+              class="useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg useBoxStyles_flexGrow_1__7o6k06gp StandardModal_content__1i5jd46"
             >
               <p>
                 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis convallis neque a laoreet maximus. Vestibulum hendrerit quam at mi venenatis faucibus at vel nisi. In ut risus et ipsum tincidunt tempor. Suspendisse potenti. Praesent faucibus posuere risus, at congue mauris porttitor ut. Donec sit amet elit vitae purus dictum aliquet quis ut ligula. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vestibulum dui sapien, porttitor ac erat vel, malesuada rutrum mauris. Nam arcu tellus, pretium ut aliquet eget, ultrices vel est. Maecenas dapibus volutpat eros a volutpat.
@@ -123,20 +123,20 @@ exports[`<StandardModal /> should match snapshot without title and body 1`] = `
       >
         <div
           aria-hidden="false"
-          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw StandardModal_container__1i5jd40"
+          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx StandardModal_container__1i5jd40"
           role="none presentation"
         >
           <article
             aria-labelledby="od-3"
             aria-modal="true"
-            class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0658 useBoxStyles_display_flex__7o6k06fb useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_backgroundColours_white__7o6k06ee useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf StandardModal_modal__1i5jd41 StandardModal_modalSizeStandard__1i5jd44"
+            class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0658 useBoxStyles_display_flex__7o6k06fb useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_backgroundColours_white__7o6k06ee useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg StandardModal_modal__1i5jd41 StandardModal_modalSizeStandard__1i5jd44"
             role="dialog"
           >
             <header
-              class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063s useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_light__7o6k069l useBoxStyles_border_colour_right_light__7o6k069w useBoxStyles_border_colour_bottom_light__7o6k06a7 useBoxStyles_border_colour_left_light__7o6k06ai useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_flexShrink_0__7o6k06gp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw"
+              class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063s useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_light__7o6k069l useBoxStyles_border_colour_right_light__7o6k069w useBoxStyles_border_colour_bottom_light__7o6k06a7 useBoxStyles_border_colour_left_light__7o6k06ai useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_flexShrink_0__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx"
             >
               <div
-                class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06go"
+                class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06gp"
                 id="od-3"
               >
                 <h4
@@ -145,11 +145,11 @@ exports[`<StandardModal /> should match snapshot without title and body 1`] = `
               </div>
               <button
                 aria-label="close"
-                class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_minimal_defaults__11v3fwxp Button_minimalStates_secondary__11v3fwxs Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_enabled__11v3fwx4"
+                class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_textAlign_center__7o6k06f3 useBoxStyles_border_style__7o6k069k useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bl useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ch useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_3__w6to7i3 Button_root__11v3fwx0 Button_minimal_defaults__11v3fwxp Button_minimalStates_secondary__11v3fwxs Button_size_small_default__11v3fwx7 Button_size_small_rounded__11v3fwx8 Button_size_small_iconOnly__11v3fwx9 Button_enabled__11v3fwx4"
                 type="button"
               >
                 <div
-                  class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Button_body__11v3fwx1"
+                  class="reset_block__6swfds3 useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Button_body__11v3fwx1"
                 >
                   <i
                     class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_muted__w6to7ig"
@@ -171,7 +171,7 @@ exports[`<StandardModal /> should match snapshot without title and body 1`] = `
               </button>
             </header>
             <main
-              class="useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gf useBoxStyles_flexGrow_1__7o6k06go StandardModal_content__1i5jd46"
+              class="useBoxStyles_display_flex__7o6k06fb useBoxStyles_height_full__7o6k06ey useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gg useBoxStyles_flexGrow_1__7o6k06gp StandardModal_content__1i5jd46"
             />
           </article>
         </div>
diff --git a/packages/overdrive/lib/components/StarRating/__snapshots__/StarRating.spec.jsx.snap b/packages/overdrive/lib/components/StarRating/__snapshots__/StarRating.spec.jsx.snap
index 1f7833d75..49d04f4ee 100644
--- a/packages/overdrive/lib/components/StarRating/__snapshots__/StarRating.spec.jsx.snap
+++ b/packages/overdrive/lib/components/StarRating/__snapshots__/StarRating.spec.jsx.snap
@@ -5,16 +5,16 @@ exports[`<StarRating /> should match snapshot for small size 1`] = `
   class="reset_block__6swfds3"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4c useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqc"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4c useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqc"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y410 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq10"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y410 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq10"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q60 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530"
@@ -34,7 +34,7 @@ exports[`<StarRating /> should match snapshot for small size 1`] = `
           </i>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q60 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530"
@@ -54,7 +54,7 @@ exports[`<StarRating /> should match snapshot for small size 1`] = `
           </i>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q60 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530"
@@ -74,7 +74,7 @@ exports[`<StarRating /> should match snapshot for small size 1`] = `
           </i>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q60 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530"
@@ -94,7 +94,7 @@ exports[`<StarRating /> should match snapshot for small size 1`] = `
           </i>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q60 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530 StarRating_star_empty__feoh531"
@@ -116,7 +116,7 @@ exports[`<StarRating /> should match snapshot for small size 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
     >
       <span
         class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_3__w6to7i3"
@@ -133,16 +133,16 @@ exports[`<StarRating /> should match snapshot with label 1`] = `
   class="reset_block__6swfds3"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4c useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqc"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4c useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqc"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y410 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq10"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y410 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq10"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530"
@@ -162,7 +162,7 @@ exports[`<StarRating /> should match snapshot with label 1`] = `
           </i>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530"
@@ -182,7 +182,7 @@ exports[`<StarRating /> should match snapshot with label 1`] = `
           </i>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530"
@@ -202,7 +202,7 @@ exports[`<StarRating /> should match snapshot with label 1`] = `
           </i>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530"
@@ -222,7 +222,7 @@ exports[`<StarRating /> should match snapshot with label 1`] = `
           </i>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530 StarRating_star_empty__feoh531"
@@ -244,7 +244,7 @@ exports[`<StarRating /> should match snapshot with label 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
     >
       <span
         class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -261,16 +261,16 @@ exports[`<StarRating /> should match snapshot with value 1`] = `
   class="reset_block__6swfds3"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4c useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqc"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4c useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqc"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y410 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq10"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y410 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq10"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530"
@@ -290,7 +290,7 @@ exports[`<StarRating /> should match snapshot with value 1`] = `
           </i>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530"
@@ -310,7 +310,7 @@ exports[`<StarRating /> should match snapshot with value 1`] = `
           </i>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530"
@@ -330,7 +330,7 @@ exports[`<StarRating /> should match snapshot with value 1`] = `
           </i>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530 StarRating_star_empty__feoh531"
@@ -350,7 +350,7 @@ exports[`<StarRating /> should match snapshot with value 1`] = `
           </i>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530 StarRating_star_empty__feoh531"
@@ -372,7 +372,7 @@ exports[`<StarRating /> should match snapshot with value 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
     >
       <span
         class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
@@ -389,16 +389,16 @@ exports[`<StarRating /> should match snapshot without value 1`] = `
   class="reset_block__6swfds3"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4c useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqc"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y4c useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxqc"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y410 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq10"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y410 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq10"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530 StarRating_star_empty__feoh531"
@@ -418,7 +418,7 @@ exports[`<StarRating /> should match snapshot without value 1`] = `
           </i>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530 StarRating_star_empty__feoh531"
@@ -438,7 +438,7 @@ exports[`<StarRating /> should match snapshot without value 1`] = `
           </i>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530 StarRating_star_empty__feoh531"
@@ -458,7 +458,7 @@ exports[`<StarRating /> should match snapshot without value 1`] = `
           </i>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530 StarRating_star_empty__feoh531"
@@ -478,7 +478,7 @@ exports[`<StarRating /> should match snapshot without value 1`] = `
           </i>
         </div>
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
         >
           <i
             class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_relative__7o6k06f1 StarRating_star_default__feoh530 StarRating_star_empty__feoh531"
@@ -500,7 +500,7 @@ exports[`<StarRating /> should match snapshot without value 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+      class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
     >
       <span
         class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_neutral__w6to7ih useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_4__w6to7i4"
diff --git a/packages/overdrive/lib/components/Stepper/__snapshots__/Stepper.spec.jsx.snap b/packages/overdrive/lib/components/Stepper/__snapshots__/Stepper.spec.jsx.snap
index 2cb497a92..e9643ddbd 100644
--- a/packages/overdrive/lib/components/Stepper/__snapshots__/Stepper.spec.jsx.snap
+++ b/packages/overdrive/lib/components/Stepper/__snapshots__/Stepper.spec.jsx.snap
@@ -3,21 +3,21 @@
 exports[`<Stepper /> should match snapshot with label formatter 1`] = `
 <div
   aria-disabled="false"
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_userSelect_none__7o6k06fi useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06at useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b9 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0690 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl Stepper_root__zxjc1f1 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 Stepper_width_default__zxjc1f3"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_userSelect_none__7o6k06fj useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06at useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b9 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0690 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl Stepper_root__zxjc1f1 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 Stepper_width_default__zxjc1f3"
   tabindex="0"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq10 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq11 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq12 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq13 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y410 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y411 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y412 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y413 Columns_align_stretch__wkgcjh2b Columns_wrapping_noWrap__wkgcjh29"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq10 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq11 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq12 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq13 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y410 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y411 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y412 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y413 Columns_align_stretch__wkgcjh2b Columns_wrapping_noWrap__wkgcjh29"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_align_centre__2660ru1a"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_align_centre__2660ru1a"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
       >
         <button
           aria-label="step down"
-          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_primary__7o6k06ef useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Stepper_handle_default__zxjc1f4 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if"
+          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_primary__7o6k06ef useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Stepper_handle_default__zxjc1f4 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if"
           tabindex="-1"
         >
           <i
@@ -40,7 +40,7 @@ exports[`<Stepper /> should match snapshot with label formatter 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06go useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_makeResponsiveStyle_key_bp__2660ru14 Column_align_centre__2660ru1a"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06gp useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_makeResponsiveStyle_key_bp__2660ru14 Column_align_centre__2660ru1a"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
@@ -53,14 +53,14 @@ exports[`<Stepper /> should match snapshot with label formatter 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_align_centre__2660ru1a"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_align_centre__2660ru1a"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
       >
         <button
           aria-label="step up"
-          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_primary__7o6k06ef useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Stepper_handle_default__zxjc1f4 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if"
+          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_primary__7o6k06ef useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Stepper_handle_default__zxjc1f4 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if"
           tabindex="-1"
         >
           <i
@@ -89,21 +89,21 @@ exports[`<Stepper /> should match snapshot with label formatter 1`] = `
 exports[`<Stepper /> should match snapshot with props 1`] = `
 <div
   aria-disabled="false"
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_userSelect_none__7o6k06fi useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06at useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b9 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0690 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl Stepper_root__zxjc1f1 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 Stepper_width_default__zxjc1f3"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_userSelect_none__7o6k06fj useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06at useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b9 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0690 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl Stepper_root__zxjc1f1 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 Stepper_width_default__zxjc1f3"
   tabindex="0"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq10 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq11 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq12 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq13 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y410 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y411 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y412 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y413 Columns_align_stretch__wkgcjh2b Columns_wrapping_noWrap__wkgcjh29"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq10 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq11 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq12 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq13 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y410 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y411 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y412 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y413 Columns_align_stretch__wkgcjh2b Columns_wrapping_noWrap__wkgcjh29"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_align_centre__2660ru1a"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_align_centre__2660ru1a"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
       >
         <button
           aria-label="step down"
-          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_primary__7o6k06ef useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Stepper_handle_default__zxjc1f4 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if"
+          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_primary__7o6k06ef useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Stepper_handle_default__zxjc1f4 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if"
           tabindex="-1"
         >
           <i
@@ -126,7 +126,7 @@ exports[`<Stepper /> should match snapshot with props 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06go useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_makeResponsiveStyle_key_bp__2660ru14 Column_align_centre__2660ru1a"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06gp useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_makeResponsiveStyle_key_bp__2660ru14 Column_align_centre__2660ru1a"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
@@ -139,14 +139,14 @@ exports[`<Stepper /> should match snapshot with props 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_align_centre__2660ru1a"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_align_centre__2660ru1a"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
       >
         <button
           aria-label="step up"
-          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_primary__7o6k06ef useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Stepper_handle_default__zxjc1f4 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if"
+          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_primary__7o6k06ef useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Stepper_handle_default__zxjc1f4 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if"
           tabindex="-1"
         >
           <i
@@ -175,21 +175,21 @@ exports[`<Stepper /> should match snapshot with props 1`] = `
 exports[`<Stepper /> should match snapshot without props 1`] = `
 <div
   aria-disabled="false"
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_userSelect_none__7o6k06fi useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06at useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b9 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0690 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl Stepper_root__zxjc1f1 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 Stepper_width_default__zxjc1f3"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k068 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062g useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_userSelect_none__7o6k06fj useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_top_gray__7o6k069m useBoxStyles_border_colour_right_gray__7o6k069x useBoxStyles_border_colour_bottom_gray__7o6k06a8 useBoxStyles_border_colour_left_gray__7o6k06aj useBoxStyles_makeResponsiveStyle_key_bp__7o6k06at useBoxStyles_makeResponsiveStyle_key_bp__7o6k06b9 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0690 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl Stepper_root__zxjc1f1 reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 Stepper_width_default__zxjc1f3"
   tabindex="0"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq10 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq11 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq12 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq13 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y410 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y411 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y412 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y413 Columns_align_stretch__wkgcjh2b Columns_wrapping_noWrap__wkgcjh29"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq10 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq11 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq12 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq13 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y410 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y411 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y412 useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y413 Columns_align_stretch__wkgcjh2b Columns_wrapping_noWrap__wkgcjh29"
   >
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_align_centre__2660ru1a"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_align_centre__2660ru1a"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
       >
         <button
           aria-label="step down"
-          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_primary__7o6k06ef useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Stepper_handle_default__zxjc1f4 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if"
+          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_primary__7o6k06ef useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Stepper_handle_default__zxjc1f4 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if"
           tabindex="-1"
         >
           <i
@@ -212,7 +212,7 @@ exports[`<Stepper /> should match snapshot without props 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06go useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_makeResponsiveStyle_key_bp__2660ru14 Column_align_centre__2660ru1a"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_1__7o6k06gp useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_makeResponsiveStyle_key_bp__2660ru14 Column_align_centre__2660ru1a"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
@@ -225,14 +225,14 @@ exports[`<Stepper /> should match snapshot without props 1`] = `
       </div>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06gn useBoxStyles_flexShrink_0__7o6k06gp Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_align_centre__2660ru1a"
+      class="reset_block__6swfds3 useBoxStyles_flexGrow_0__7o6k06go useBoxStyles_flexShrink_0__7o6k06gq Columns_makeResponsiveStyle_key_bp__wkgcjh10 Columns_makeResponsiveStyle_key_bp__wkgcjh11 Columns_makeResponsiveStyle_key_bp__wkgcjh12 Columns_makeResponsiveStyle_key_bp__wkgcjh13 Columns_makeResponsiveStyle_key_bp__wkgcjh24 Columns_makeResponsiveStyle_key_bp__wkgcjh25 Columns_makeResponsiveStyle_key_bp__wkgcjh26 Columns_makeResponsiveStyle_key_bp__wkgcjh27 Column_align_centre__2660ru1a"
     >
       <div
         class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
       >
         <button
           aria-label="step up"
-          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_primary__7o6k06ef useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw Stepper_handle_default__zxjc1f4 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if"
+          class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_primary__7o6k06ef useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx Stepper_handle_default__zxjc1f4 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_white__w6to7if"
           tabindex="-1"
         >
           <i
diff --git a/packages/overdrive/lib/components/Table/__snapshots__/Table.spec.js.snap b/packages/overdrive/lib/components/Table/__snapshots__/Table.spec.js.snap
index 7965f4308..cdf186b06 100644
--- a/packages/overdrive/lib/components/Table/__snapshots__/Table.spec.js.snap
+++ b/packages/overdrive/lib/components/Table/__snapshots__/Table.spec.js.snap
@@ -14,7 +14,7 @@ exports[`<Table /> when implemented should match snapshot 1`] = `
       role="row"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k062k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_bottom_light__7o6k06a7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_backgroundColours_gray100__7o6k06d5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs"
+        class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k062k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_bottom_light__7o6k06a7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_backgroundColours_gray100__7o6k06d5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt"
         role="columnheader"
         scope="col"
       >
@@ -26,7 +26,7 @@ exports[`<Table /> when implemented should match snapshot 1`] = `
       </div>
       <div
         aria-sort="ascending"
-        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_bottom_light__7o6k06a7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_backgroundColours_gray100__7o6k06d5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs"
+        class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_bottom_light__7o6k06a7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_backgroundColours_gray100__7o6k06d5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt"
         role="columnheader"
         scope="col"
       >
@@ -35,17 +35,17 @@ exports[`<Table /> when implemented should match snapshot 1`] = `
           tabindex="-1"
         >
           <div
-            class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_wrap__7o6k06gq useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y40 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq0"
+            class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_wrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y40 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq0"
           >
             <div
-              class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k060 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+              class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k060 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
             >
               <span
                 class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_dark__w6to7ie useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_2__w6to7i2 TableHeadCell_text__4skrdd1"
               >
                 col 2
                 <span
-                  class="reset_inlineText__6swfds2 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_userSelect_none__7o6k06fi VisuallyHidden_root__t2xf5v0"
+                  class="reset_inlineText__6swfds2 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_userSelect_none__7o6k06fj VisuallyHidden_root__t2xf5v0"
                 >
                    
                   sorted 
@@ -54,7 +54,7 @@ exports[`<Table /> when implemented should match snapshot 1`] = `
               </span>
             </div>
             <div
-              class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k060 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+              class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k060 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063c useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
             >
               <i
                 class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q60 TableHeadCell_sorterRoot__4skrdd2 TableHeadCell_sorter_root__4skrdd3 TableHeadCell_sorter_asc__4skrdd5"
@@ -87,7 +87,7 @@ exports[`<Table /> when implemented should match snapshot 1`] = `
       role="row"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k062k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_bottom_light__7o6k06a7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs TableCell_root__13mgwvq0"
+        class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k062k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_bottom_light__7o6k06a7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt TableCell_root__13mgwvq0"
         role="gridcell"
         scope="row"
       >
@@ -98,7 +98,7 @@ exports[`<Table /> when implemented should match snapshot 1`] = `
         </span>
       </div>
       <div
-        class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k062k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_bottom_light__7o6k06a7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs TableCell_root__13mgwvq0"
+        class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k062k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_bottom_light__7o6k06a7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt TableCell_root__13mgwvq0"
         role="gridcell"
         scope="row"
       >
@@ -114,7 +114,7 @@ exports[`<Table /> when implemented should match snapshot 1`] = `
       role="row"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k062k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_bottom_light__7o6k06a7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs TableCell_root__13mgwvq0"
+        class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k062k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_bottom_light__7o6k06a7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt TableCell_root__13mgwvq0"
         role="gridcell"
         scope="row"
       >
@@ -125,7 +125,7 @@ exports[`<Table /> when implemented should match snapshot 1`] = `
         </span>
       </div>
       <div
-        class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k062k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_bottom_light__7o6k06a7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gs TableCell_root__13mgwvq0"
+        class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06c useBoxStyles_makeResponsiveStyle_key_bp__7o6k061g useBoxStyles_makeResponsiveStyle_key_bp__7o6k062k useBoxStyles_makeResponsiveStyle_key_bp__7o6k063o useBoxStyles_display_flex__7o6k06fb useBoxStyles_border_style__7o6k069k useBoxStyles_border_colour_bottom_light__7o6k06a7 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06bp useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gt TableCell_root__13mgwvq0"
         role="gridcell"
         scope="row"
       >
diff --git a/packages/overdrive/lib/components/Tabs/__snapshots__/Tabs.spec.jsx.snap b/packages/overdrive/lib/components/Tabs/__snapshots__/Tabs.spec.jsx.snap
index f2541461c..279afb9e9 100644
--- a/packages/overdrive/lib/components/Tabs/__snapshots__/Tabs.spec.jsx.snap
+++ b/packages/overdrive/lib/components/Tabs/__snapshots__/Tabs.spec.jsx.snap
@@ -2,20 +2,20 @@
 
 exports[`<Tabs /> should allow id overriding 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz TabList_root_default__gut0aq0"
+  class="reset_block__6swfds3 useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 TabList_root_default__gut0aq0"
 >
   <div
     class="reset_block__6swfds3"
   >
     <div
       aria-orientation="horizontal"
-      class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_width_full__7o6k06ew useBoxStyles_flexWrap_nowrap__7o6k06gr useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq"
+      class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_width_full__7o6k06ew useBoxStyles_flexWrap_nowrap__7o6k06gs useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq"
       role="tablist"
     >
       <button
         aria-controls="tab-1-title-0"
         aria-selected="true"
-        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fc useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0 Tab_root_active__vlp0oc1"
+        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fd useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0 Tab_root_active__vlp0oc1"
         role="tab"
       >
         <span
@@ -27,7 +27,7 @@ exports[`<Tabs /> should allow id overriding 1`] = `
       <button
         aria-controls="tab-2-title-1"
         aria-selected="false"
-        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fc useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0"
+        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fd useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0"
         role="tab"
         tabindex="-1"
       >
@@ -40,7 +40,7 @@ exports[`<Tabs /> should allow id overriding 1`] = `
       <button
         aria-controls="tab-3-title-2"
         aria-selected="false"
-        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fc useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0"
+        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fd useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0"
         role="tab"
         tabindex="-1"
       >
@@ -57,27 +57,27 @@ exports[`<Tabs /> should allow id overriding 1`] = `
 
 exports[`<Tabs /> should allow rendering indications 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz TabList_root_default__gut0aq0"
+  class="reset_block__6swfds3 useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 TabList_root_default__gut0aq0"
 >
   <div
     class="reset_block__6swfds3"
   >
     <div
       aria-orientation="horizontal"
-      class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_width_full__7o6k06ew useBoxStyles_flexWrap_nowrap__7o6k06gr useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq"
+      class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_width_full__7o6k06ew useBoxStyles_flexWrap_nowrap__7o6k06gs useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq"
       role="tablist"
     >
       <button
         aria-controls="od-11-0-tab"
         aria-selected="true"
-        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fc useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0 Tab_root_active__vlp0oc1"
+        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fd useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0 Tab_root_active__vlp0oc1"
         role="tab"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4"
+          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4"
         >
           <div
-            class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+            class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
           >
             <span
               class="Tab_item__vlp0oc2"
@@ -86,10 +86,10 @@ exports[`<Tabs /> should allow rendering indications 1`] = `
             </span>
           </div>
           <div
-            class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+            class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
           >
             <span
-              class="reset_inlineText__6swfds2 useBoxStyles_display_block__7o6k06fa useBoxStyles_textAlign_center__7o6k06f3 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_2__w6to7i2 Tab_indication_default__vlp0oc3 reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0614 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063c useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct Tab_indication_active__vlp0oc4"
+              class="reset_inlineText__6swfds2 useBoxStyles_display_block__7o6k06fa useBoxStyles_textAlign_center__7o6k06f3 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_2__w6to7i2 Tab_indication_default__vlp0oc3 reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0614 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063c useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct Tab_indication_active__vlp0oc4"
             >
               5
             </span>
@@ -99,15 +99,15 @@ exports[`<Tabs /> should allow rendering indications 1`] = `
       <button
         aria-controls="od-11-1-tab"
         aria-selected="false"
-        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fc useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0"
+        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fd useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0"
         role="tab"
         tabindex="-1"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4"
+          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4"
         >
           <div
-            class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+            class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
           >
             <span
               class="Tab_item__vlp0oc2"
@@ -116,10 +116,10 @@ exports[`<Tabs /> should allow rendering indications 1`] = `
             </span>
           </div>
           <div
-            class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+            class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
           >
             <span
-              class="reset_inlineText__6swfds2 useBoxStyles_display_block__7o6k06fa useBoxStyles_textAlign_center__7o6k06f3 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_dark__w6to7ie useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_2__w6to7i2 Tab_indication_default__vlp0oc3 reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0614 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063c useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct"
+              class="reset_inlineText__6swfds2 useBoxStyles_display_block__7o6k06fa useBoxStyles_textAlign_center__7o6k06f3 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_dark__w6to7ie useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_2__w6to7i2 Tab_indication_default__vlp0oc3 reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0614 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063c useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct"
             >
               5
             </span>
@@ -129,15 +129,15 @@ exports[`<Tabs /> should allow rendering indications 1`] = `
       <button
         aria-controls="od-11-2-tab"
         aria-selected="false"
-        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fc useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0"
+        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fd useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0"
         role="tab"
         tabindex="-1"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4"
+          class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useNegativeMarginTop_makeResponsiveStyle_key_bp__7pu7y44 useNegativeMarginLeft_makeResponsiveStyle_key_bp__18e9yxq4"
         >
           <div
-            class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+            class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
           >
             <span
               class="Tab_item__vlp0oc2"
@@ -146,10 +146,10 @@ exports[`<Tabs /> should allow rendering indications 1`] = `
             </span>
           </div>
           <div
-            class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g7 useBoxStyles_flexWrap_nowrap__7o6k06gr"
+            class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_flex__7o6k06fb useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g8 useBoxStyles_flexWrap_nowrap__7o6k06gs"
           >
             <span
-              class="reset_inlineText__6swfds2 useBoxStyles_display_block__7o6k06fa useBoxStyles_textAlign_center__7o6k06f3 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_dark__w6to7ie useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_2__w6to7i2 Tab_indication_default__vlp0oc3 reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0614 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063c useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct"
+              class="reset_inlineText__6swfds2 useBoxStyles_display_block__7o6k06fa useBoxStyles_textAlign_center__7o6k06f3 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_dark__w6to7ie useTextStyles_fontWeight_bold__w6to7ip useTextStyles_sizes_2__w6to7i2 Tab_indication_default__vlp0oc3 reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0614 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063c useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_makeResponsiveStyle_key_bp__7o6k06ct"
             >
               5
             </span>
@@ -163,20 +163,20 @@ exports[`<Tabs /> should allow rendering indications 1`] = `
 
 exports[`<Tabs /> should match snapshot (high level) 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06fz TabList_root_default__gut0aq0"
+  class="reset_block__6swfds3 useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06g0 TabList_root_default__gut0aq0"
 >
   <div
     class="reset_block__6swfds3"
   >
     <div
       aria-orientation="horizontal"
-      class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_width_full__7o6k06ew useBoxStyles_flexWrap_nowrap__7o6k06gr useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq"
+      class="reset_block__6swfds3 useBoxStyles_display_block__7o6k06fa useBoxStyles_width_full__7o6k06ew useBoxStyles_flexWrap_nowrap__7o6k06gs useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq"
       role="tablist"
     >
       <button
         aria-controls="od-1-0-tab"
         aria-selected="true"
-        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fc useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0 Tab_root_active__vlp0oc1"
+        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fd useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0 Tab_root_active__vlp0oc1"
         role="tab"
       >
         <span
@@ -188,7 +188,7 @@ exports[`<Tabs /> should match snapshot (high level) 1`] = `
       <button
         aria-controls="od-1-1-tab"
         aria-selected="false"
-        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fc useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0"
+        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fd useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0"
         role="tab"
         tabindex="-1"
       >
@@ -201,7 +201,7 @@ exports[`<Tabs /> should match snapshot (high level) 1`] = `
       <button
         aria-controls="od-1-2-tab"
         aria-selected="false"
-        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fc useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gw useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0"
+        class="reset_appearance__6swfds0 reset_cursorPointer__6swfds1 reset_trimmedBlockElement__6swfds5 reset_button__6swfds6 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0664 useBoxStyles_display_inlineFlex__7o6k06fd useBoxStyles_backgroundColours_transparent__7o6k06en useBoxStyles_makeResponsiveStyle_key_bp__7o6k06gx useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_light__w6to7ii useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_3__w6to7i3 Tab_root_default__vlp0oc0"
         role="tab"
         tabindex="-1"
       >
diff --git a/packages/overdrive/lib/components/TextAreaInput/__snapshots__/TextAreaInput.spec.jsx.snap b/packages/overdrive/lib/components/TextAreaInput/__snapshots__/TextAreaInput.spec.jsx.snap
index 0cde04ad0..a1e9c190a 100644
--- a/packages/overdrive/lib/components/TextAreaInput/__snapshots__/TextAreaInput.spec.jsx.snap
+++ b/packages/overdrive/lib/components/TextAreaInput/__snapshots__/TextAreaInput.spec.jsx.snap
@@ -17,7 +17,7 @@ exports[`<TextAreaInput /> should have some hintText 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -26,12 +26,12 @@ exports[`<TextAreaInput /> should have some hintText 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
           for="id"
         >
           placeholder
@@ -67,7 +67,7 @@ exports[`<TextAreaInput /> should match snapshot 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -76,12 +76,12 @@ exports[`<TextAreaInput /> should match snapshot 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
           for="id"
         >
           placeholder something
@@ -113,7 +113,7 @@ exports[`<TextAreaInput /> should match snapshot when active 1`] = `
       </textarea>
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_activeBorderColour__9z39d71"
@@ -127,7 +127,7 @@ exports[`<TextAreaInput /> should match snapshot when active 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_activeColour__9z39d70 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_activeColour__9z39d70 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
@@ -151,7 +151,7 @@ exports[`<TextAreaInput /> should match snapshot when loading 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey withEnhancedInput_inputWrapperSize_medium_root_textarea__bd4oid3"
     >
       <div
-        class="reset_block__6swfds3 ProgressSpinner_size_medium_circular__5j3teub ProgressSpinner_colours_primary__5j3teu5 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="reset_block__6swfds3 ProgressSpinner_size_medium_circular__5j3teub ProgressSpinner_colours_primary__5j3teu5 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
       >
         <svg
           class="useBoxStyles_display_block__7o6k06fa useBoxStyles_overflow_hidden__7o6k06f5 ProgressSpinner_circular__5j3teu1"
@@ -175,7 +175,7 @@ exports[`<TextAreaInput /> should match snapshot when loading 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -184,12 +184,12 @@ exports[`<TextAreaInput /> should match snapshot when loading 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
           for="id"
         >
           placeholder something
@@ -219,7 +219,7 @@ exports[`<TextAreaInput /> should match snapshot when touched 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_error_default_borderColour__9z39d7d"
@@ -228,12 +228,12 @@ exports[`<TextAreaInput /> should match snapshot when touched 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_error_default_borderColour__9z39d7d"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           placeholder something
         </label>
@@ -262,7 +262,7 @@ exports[`<TextAreaInput /> should match snapshot when touched and invalid 1`] =
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_error_default_borderColour__9z39d7d"
@@ -271,12 +271,12 @@ exports[`<TextAreaInput /> should match snapshot when touched and invalid 1`] =
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_error_default_borderColour__9z39d7d"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           placeholder something
         </label>
@@ -305,7 +305,7 @@ exports[`<TextAreaInput /> should match snapshot when touched and valid 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_success_default_borderColour__9z39d77"
@@ -314,12 +314,12 @@ exports[`<TextAreaInput /> should match snapshot when touched and valid 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_success_default_borderColour__9z39d77"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           placeholder something
         </label>
diff --git a/packages/overdrive/lib/components/TextBubble/__snapshots__/TextBubble.spec.jsx.snap b/packages/overdrive/lib/components/TextBubble/__snapshots__/TextBubble.spec.jsx.snap
index 804bff7a8..852b4d3b1 100644
--- a/packages/overdrive/lib/components/TextBubble/__snapshots__/TextBubble.spec.jsx.snap
+++ b/packages/overdrive/lib/components/TextBubble/__snapshots__/TextBubble.spec.jsx.snap
@@ -2,7 +2,7 @@
 
 exports[`<Section /> should match the snapshot background and text colour 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06k useBoxStyles_makeResponsiveStyle_key_bp__7o6k061o useBoxStyles_makeResponsiveStyle_key_bp__7o6k062s useBoxStyles_makeResponsiveStyle_key_bp__7o6k063w useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_gray900__7o6k06dd"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06k useBoxStyles_makeResponsiveStyle_key_bp__7o6k061o useBoxStyles_makeResponsiveStyle_key_bp__7o6k062s useBoxStyles_makeResponsiveStyle_key_bp__7o6k063w useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_gray900__7o6k06dd"
 >
   <span
     class="reset_inlineText__6swfds2 useBoxStyles_textAlign_center__7o6k06f3 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_danger__w6to7ij useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_2__w6to7i2 TextBubble_bubbleText__1s20q2e0 reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0614 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063c useBoxStyles_width_full__7o6k06ew useBoxStyles_position_absolute__7o6k06ez useBoxStyles_overflow_hidden__7o6k06f5"
@@ -14,7 +14,7 @@ exports[`<Section /> should match the snapshot background and text colour 1`] =
 
 exports[`<Section /> should match the snapshot for standard label 1`] = `
 <div
-  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06k useBoxStyles_makeResponsiveStyle_key_bp__7o6k061o useBoxStyles_makeResponsiveStyle_key_bp__7o6k062s useBoxStyles_makeResponsiveStyle_key_bp__7o6k063w useBoxStyles_display_inlineBlock__7o6k06fe useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_gray900__7o6k06dd"
+  class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06k useBoxStyles_makeResponsiveStyle_key_bp__7o6k061o useBoxStyles_makeResponsiveStyle_key_bp__7o6k062s useBoxStyles_makeResponsiveStyle_key_bp__7o6k063w useBoxStyles_display_inlineBlock__7o6k06ff useBoxStyles_position_relative__7o6k06f1 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cx useBoxStyles_backgroundColours_gray900__7o6k06dd"
 >
   <span
     class="reset_inlineText__6swfds2 useBoxStyles_textAlign_center__7o6k06f3 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_bold__w6to7ip useTextStyles_noWrap__w6to7iq useTextStyles_sizes_2__w6to7i2 TextBubble_bubbleText__1s20q2e0 reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0614 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063c useBoxStyles_width_full__7o6k06ew useBoxStyles_position_absolute__7o6k06ez useBoxStyles_overflow_hidden__7o6k06f5"
diff --git a/packages/overdrive/lib/components/TextInput/__snapshots__/TextInput.spec.jsx.snap b/packages/overdrive/lib/components/TextInput/__snapshots__/TextInput.spec.jsx.snap
index 06a7d805f..6d44f96ab 100644
--- a/packages/overdrive/lib/components/TextInput/__snapshots__/TextInput.spec.jsx.snap
+++ b/packages/overdrive/lib/components/TextInput/__snapshots__/TextInput.spec.jsx.snap
@@ -19,7 +19,7 @@ exports[`<TextInput /> should have some hintText 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -28,12 +28,12 @@ exports[`<TextInput /> should have some hintText 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
           for="id"
         >
           placeholder
@@ -71,7 +71,7 @@ exports[`<TextInput /> should match snapshot 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -80,12 +80,12 @@ exports[`<TextInput /> should match snapshot 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
           for="id"
         >
           placeholder something
@@ -117,7 +117,7 @@ exports[`<TextInput /> should match snapshot when active 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_activeBorderColour__9z39d71"
@@ -131,7 +131,7 @@ exports[`<TextInput /> should match snapshot when active 1`] = `
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt InputState_activeColour__9z39d70 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt InputState_activeColour__9z39d70 useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
         >
           placeholder something
         </label>
@@ -155,7 +155,7 @@ exports[`<TextInput /> should match snapshot when loading 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <div
-        class="reset_block__6swfds3 ProgressSpinner_size_medium_circular__5j3teub ProgressSpinner_colours_primary__5j3teu5 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="reset_block__6swfds3 ProgressSpinner_size_medium_circular__5j3teub ProgressSpinner_colours_primary__5j3teu5 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
       >
         <svg
           class="useBoxStyles_display_block__7o6k06fa useBoxStyles_overflow_hidden__7o6k06f5 ProgressSpinner_circular__5j3teu1"
@@ -181,7 +181,7 @@ exports[`<TextInput /> should match snapshot when loading 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -190,12 +190,12 @@ exports[`<TextInput /> should match snapshot when loading 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
           for="id"
         >
           placeholder something
@@ -227,7 +227,7 @@ exports[`<TextInput /> should match snapshot when touched 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_error_default_borderColour__9z39d7d"
@@ -236,12 +236,12 @@ exports[`<TextInput /> should match snapshot when touched 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_error_default_borderColour__9z39d7d"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           placeholder something
         </label>
@@ -272,7 +272,7 @@ exports[`<TextInput /> should match snapshot when touched and invalid 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_error_default_borderColour__9z39d7d"
@@ -281,12 +281,12 @@ exports[`<TextInput /> should match snapshot when touched and invalid 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_error_default_borderColour__9z39d7d"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           placeholder something
         </label>
@@ -317,7 +317,7 @@ exports[`<TextInput /> should match snapshot when touched and valid 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_success_default_borderColour__9z39d77"
@@ -326,12 +326,12 @@ exports[`<TextInput /> should match snapshot when touched and valid 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_success_default_borderColour__9z39d77"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           placeholder something
         </label>
@@ -355,7 +355,7 @@ exports[`<TextInput /> should match snapshot with both icons 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <i
-        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_prefixIcon__bd4oidf withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_prefixIcon__bd4oidf withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
         role="presentation"
       >
         <svg
@@ -369,7 +369,7 @@ exports[`<TextInput /> should match snapshot with both icons 1`] = `
         </svg>
       </i>
       <i
-        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
         role="presentation"
       >
         <svg
@@ -390,7 +390,7 @@ exports[`<TextInput /> should match snapshot with both icons 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -399,12 +399,12 @@ exports[`<TextInput /> should match snapshot with both icons 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_defaultPrefixed__1r7zdxgz"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_defaultPrefixed__1r7zdxgz"
         >
           placeholder something
         </label>
@@ -428,7 +428,7 @@ exports[`<TextInput /> should match snapshot with prefix icon 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <i
-        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_prefixIcon__bd4oidf withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_prefixIcon__bd4oidf withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
         role="presentation"
       >
         <svg
@@ -449,7 +449,7 @@ exports[`<TextInput /> should match snapshot with prefix icon 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -458,12 +458,12 @@ exports[`<TextInput /> should match snapshot with prefix icon 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_defaultPrefixed__1r7zdxgz"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_defaultPrefixed__1r7zdxgz"
         >
           placeholder something
         </label>
@@ -487,7 +487,7 @@ exports[`<TextInput /> should match snapshot with suffix icon 1`] = `
       class="reset_block__6swfds3 useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey"
     >
       <i
-        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
+        class="useBoxStyles_display_block__7o6k06fa Icon_makeResponsiveStyle_key_bp__14sz1q64 reset_block__6swfds3 useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd withEnhancedInput_iconRoot__bd4oide withEnhancedInput_suffixIcon__bd4oidg withEnhancedInput_iconSize_medium__bd4oidi InputState_natural_default_colour__9z39d74"
         role="presentation"
       >
         <svg
@@ -508,7 +508,7 @@ exports[`<TextInput /> should match snapshot with suffix icon 1`] = `
       />
     </div>
     <div
-      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+      class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
     >
       <div
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6 InputState_natural_default_borderColour__9z39d75"
@@ -517,12 +517,12 @@ exports[`<TextInput /> should match snapshot with suffix icon 1`] = `
         class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_middle__1r7zdxg7 InputState_natural_default_borderColour__9z39d75"
       >
         <div
-          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06ff useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
+          class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0618 useBoxStyles_makeResponsiveStyle_key_bp__7o6k063g useBoxStyles_display_none__7o6k06fg useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_notchGapPlaceholder__1r7zdxg3"
         >
           placeholder something
         </div>
         <label
-          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
+          class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholder_mutedLabelStyles__1r7zdxgu NotchedBase_placeholderPlacement_medium_default__1r7zdxgy"
         >
           placeholder something
         </label>
diff --git a/packages/overdrive/lib/components/TextLink/__snapshots__/TextLink.spec.jsx.snap b/packages/overdrive/lib/components/TextLink/__snapshots__/TextLink.spec.jsx.snap
index 0a5f336af..370aae5de 100644
--- a/packages/overdrive/lib/components/TextLink/__snapshots__/TextLink.spec.jsx.snap
+++ b/packages/overdrive/lib/components/TextLink/__snapshots__/TextLink.spec.jsx.snap
@@ -7,7 +7,7 @@ exports[`<TextLink /> should allow as override 1`] = `
   rel="noopener noreferrer"
 >
   <span
-    class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_link__w6to7id useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 reset_inlineText__6swfds2 useBoxStyles_position_relative__7o6k06f1 useBoxStyles_pointerEvents_none__7o6k06hc"
+    class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_link__w6to7id useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 reset_inlineText__6swfds2 useBoxStyles_position_relative__7o6k06f1 useBoxStyles_pointerEvents_none__7o6k06hd"
   >
     Test
   </span>
@@ -20,7 +20,7 @@ exports[`<TextLink /> should match the snapshot 1`] = `
   rel="noopener noreferrer"
 >
   <span
-    class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_link__w6to7id useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 reset_inlineText__6swfds2 useBoxStyles_position_relative__7o6k06f1 useBoxStyles_pointerEvents_none__7o6k06hc"
+    class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_link__w6to7id useTextStyles_fontWeight_semiBold__w6to7io useTextStyles_sizes_4__w6to7i4 reset_inlineText__6swfds2 useBoxStyles_position_relative__7o6k06f1 useBoxStyles_pointerEvents_none__7o6k06hd"
   />
 </a>
 `;
diff --git a/packages/overdrive/lib/components/Tooltip/__snapshots__/Tooltip.spec.jsx.snap b/packages/overdrive/lib/components/Tooltip/__snapshots__/Tooltip.spec.jsx.snap
index 51618c32e..99df4f37e 100644
--- a/packages/overdrive/lib/components/Tooltip/__snapshots__/Tooltip.spec.jsx.snap
+++ b/packages/overdrive/lib/components/Tooltip/__snapshots__/Tooltip.spec.jsx.snap
@@ -38,7 +38,7 @@ exports[`<Tolltip /> should match snapshot when opened 1`] = `
       style="position: absolute; left: 0px; top: 0px; margin: 0px;"
     >
       <div
-        class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_width_full__7o6k06ew useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_userSelect_none__7o6k06fi useBoxStyles_pointerEvents_none__7o6k06hc useBoxStyles_makeResponsiveStyle_key_bp__7o6k0698 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_gray900__7o6k06dd Tooltip_root__1im63pj0"
+        class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064 useBoxStyles_makeResponsiveStyle_key_bp__7o6k061c useBoxStyles_makeResponsiveStyle_key_bp__7o6k062c useBoxStyles_makeResponsiveStyle_key_bp__7o6k063k useBoxStyles_width_full__7o6k06ew useBoxStyles_overflow_hidden__7o6k06f5 useBoxStyles_userSelect_none__7o6k06fj useBoxStyles_pointerEvents_none__7o6k06hd useBoxStyles_makeResponsiveStyle_key_bp__7o6k0698 useBoxStyles_makeResponsiveStyle_key_bp__7o6k06cl useBoxStyles_backgroundColours_gray900__7o6k06dd Tooltip_root__1im63pj0"
       >
         <span
           class="reset_inlineText__6swfds2 useBoxStyles_textAlign_left__7o6k06f2 useTextStyles_root__w6to7i0 reset_inlineText__6swfds2 useTextStyles_colours_white__w6to7if useTextStyles_fontWeight_normal__w6to7in useTextStyles_sizes_2__w6to7i2"
diff --git a/packages/overdrive/lib/components/private/InputBase/__snapshots__/NotchedBase.spec.jsx.snap b/packages/overdrive/lib/components/private/InputBase/__snapshots__/NotchedBase.spec.jsx.snap
index 1fded20bc..832991942 100644
--- a/packages/overdrive/lib/components/private/InputBase/__snapshots__/NotchedBase.spec.jsx.snap
+++ b/packages/overdrive/lib/components/private/InputBase/__snapshots__/NotchedBase.spec.jsx.snap
@@ -5,7 +5,7 @@ exports[`<NotchedBase /> should match snapshot for active notch 1`] = `
   class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 NotchedBase_root__1r7zdxg0"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
   >
     <div
       class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6"
@@ -19,7 +19,7 @@ exports[`<NotchedBase /> should match snapshot for active notch 1`] = `
         placeholder something
       </div>
       <label
-        class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+        class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
       >
         placeholder something
       </label>
@@ -36,7 +36,7 @@ exports[`<NotchedBase /> should match snapshot for default notch 1`] = `
   class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 NotchedBase_root__1r7zdxg0"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
   >
     <div
       class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6"
@@ -50,7 +50,7 @@ exports[`<NotchedBase /> should match snapshot for default notch 1`] = `
         placeholder something
       </div>
       <label
-        class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+        class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
       >
         placeholder something
       </label>
@@ -67,7 +67,7 @@ exports[`<NotchedBase /> should match snapshot for dirty and active notch 1`] =
   class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 NotchedBase_root__1r7zdxg0"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
   >
     <div
       class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6"
@@ -81,7 +81,7 @@ exports[`<NotchedBase /> should match snapshot for dirty and active notch 1`] =
         placeholder something
       </div>
       <label
-        class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+        class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
       >
         placeholder something
       </label>
@@ -98,7 +98,7 @@ exports[`<NotchedBase /> should match snapshot for dirty notch 1`] = `
   class="reset_block__6swfds3 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_width_full__7o6k06ew useBoxStyles_position_relative__7o6k06f1 NotchedBase_root__1r7zdxg0"
 >
   <div
-    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
+    class="reset_block__6swfds3 useBoxStyles_display_flex__7o6k06fb useBoxStyles_width_full__7o6k06ew useBoxStyles_height_full__7o6k06ey useBoxStyles_position_absolute__7o6k06ez useBoxStyles_textAlign_left__7o6k06f2 useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_borderVisualDefaults__1r7zdxg2 NotchedBase_borders_root_default__1r7zdxg4"
   >
     <div
       class="NotchedBase_borderRegionDefaults__1r7zdxg1 NotchedBase_borders_leading__1r7zdxg6"
@@ -112,7 +112,7 @@ exports[`<NotchedBase /> should match snapshot for dirty notch 1`] = `
         placeholder something
       </div>
       <label
-        class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fd useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hc NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
+        class="reset_inlineText__6swfds2 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0610 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0624 useBoxStyles_makeResponsiveStyle_key_bp__7o6k0638 useBoxStyles_makeResponsiveStyle_key_bp__7o6k064c useBoxStyles_makeResponsiveStyle_key_bp__7o6k065g useBoxStyles_makeResponsiveStyle_key_bp__7o6k066k useBoxStyles_makeResponsiveStyle_key_bp__7o6k067o useBoxStyles_makeResponsiveStyle_key_bp__7o6k068s useBoxStyles_display_inline__7o6k06fe useBoxStyles_position_absolute__7o6k06ez useBoxStyles_pointerEvents_none__7o6k06hd NotchedBase_placeholder_default__1r7zdxgt useTextStyles_root__w6to7i0 reset_block__6swfds3 useTextStyles_colours_neutral__w6to7ih useTextStyles_noWrap__w6to7iq useTextStyles_sizes_4__w6to7i4 NotchedBase_placeholderPlacement_medium_shifted__1r7zdxg10"
       >
         placeholder something
       </label>