make target area of label smaller so that empty space doesn't trigger…

… the field focus

packages/wonder-blocks-labeled-field/src/components/labeled-field.tsx

@@ -258,7 +258,7 @@ export default function LabeledField(props: Props) {
     }
 
     return (
-        <View style={style}>
+        <View style={[styles.container, style]}>
             {renderLabel()}
             {maybeRenderDescription()}
             <Strut size={spacing.xSmall_8} />
@@ -269,6 +269,12 @@ export default function LabeledField(props: Props) {
 }
 
 const styles = StyleSheet.create({
+    container: {
+        // Prevent flex items from stretching. This prevents the label from
+        // being the full width so that only clicking on the label text will
+        // focus on the field
+        alignItems: "flex-start",
+    },
     label: {
         color: semanticColor.text.primary,
     },