Move htmlFor to correct label in FieldInline (#913)

Author: mdodgelooker

CHANGELOG.md

@@ -5,6 +5,12 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [UNRELEASED]
+
+### Fixed
+
+- `FieldInline` `for` attribute moved to the correct `label`
+
 ## [0.7.30] - 2020-05-07
 
 ### Added

packages/components/src/Form/Fields/FieldCheckbox/__snapshots__/FieldCheckbox.test.tsx.snap

@@ -97,13 +97,13 @@ exports[`A FieldCheckbox 1`] = `
 
 <label
   className="c0 "
+  htmlFor="FieldCheckboxID"
 >
   <span
     className="c1 c2"
     color="palette.charcoal700"
     fontSize="xsmall"
     fontWeight="semiBold"
-    htmlFor="FieldCheckboxID"
   >
     👍
   </span>
@@ -247,13 +247,13 @@ exports[`A FieldCheckbox with checked value 1`] = `
 
 <label
   className="c0 "
+  htmlFor="FieldCheckboxID"
 >
   <span
     className="c1 c2"
     color="palette.charcoal700"
     fontSize="xsmall"
     fontWeight="semiBold"
-    htmlFor="FieldCheckboxID"
   >
     👍
   </span>

packages/components/src/Form/Fields/FieldInline.tsx

@@ -54,8 +54,8 @@ const FieldInlineLayout: FC<Omit<
   validationMessage,
 }) => {
   return (
-    <label className={className}>
-      <Label as="span" fontSize={labelFontSize} htmlFor={id}>
+    <label className={className} htmlFor={id}>
+      <Label as="span" fontSize={labelFontSize}>
         {label}
         {required && <RequiredStar />}
       </Label>

packages/components/src/Form/Fields/FieldRadio/__snapshots__/FieldRadio.test.tsx.snap

@@ -102,13 +102,13 @@ exports[`A FieldRadio 1`] = `
 
 <label
   className="c0 "
+  htmlFor="FieldRadioID"
 >
   <span
     className="c1 c2"
     color="palette.charcoal700"
     fontSize="xsmall"
     fontWeight="semiBold"
-    htmlFor="FieldRadioID"
   >
     👍
   </span>
@@ -238,13 +238,13 @@ exports[`A FieldRadio checked 1`] = `
 
 <label
   className="c0 "
+  htmlFor="FieldRadioID"
 >
   <span
     className="c1 c2"
     color="palette.charcoal700"
     fontSize="xsmall"
     fontWeight="semiBold"
-    htmlFor="FieldRadioID"
   >
     👍
   </span>

packages/components/src/Form/Fields/FieldToggleSwitch/__snapshots__/FieldToggleSwitch.test.tsx.snap

@@ -84,13 +84,13 @@ exports[`A FieldToggleSwitch 1`] = `
 
 <label
   className="c0 "
+  htmlFor="FieldToggleSwitchID"
 >
   <span
     className="c1 c2"
     color="palette.charcoal700"
     fontSize="xsmall"
     fontWeight="semiBold"
-    htmlFor="FieldToggleSwitchID"
   >
     👍
   </span>
@@ -209,13 +209,13 @@ exports[`A FieldToggleSwitch turned on 1`] = `
 
 <label
   className="c0 "
+  htmlFor="FieldToggleSwitchID"
 >
   <span
     className="c1 c2"
     color="palette.charcoal700"
     fontSize="xsmall"
     fontWeight="semiBold"
-    htmlFor="FieldToggleSwitchID"
   >
     👍
   </span>