Merge pull request #125 from indec-it/style/radioTable

style(radioTable): wrap text when is too long
indec-it · Aug 12, 2024 · d90e198 · d90e198
2 parents f023886 + cc4c3c3
commit d90e198
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 6 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@indec/form-builder",
-  "version": "3.5.4",
+  "version": "3.5.5",
   "description": "Form builder",
   "main": "index.js",
   "private": false,

diff --git a/src/components/RadioTable/RadioTable.js b/src/components/RadioTable/RadioTable.js
@@ -46,11 +46,9 @@ function RadioTable({options, label, form, field, disabled, warnings}) {
       <InputLabel warnings={warnings} form={form} field={field} label={label} disabled={disabled} />
       {options.map(option => (
         <Box key={option.id}>
-          <Stack direction={{xs: 'column', sm: 'row'}}>
-            <Box sx={{minWidth: '400px', maxWidth: '400px'}}>
-              <Typography noWrap sx={{opacity: disabled ? 0.5 : 1}}>
-                {option.title}
-              </Typography>
+          <Stack direction={{xs: 'column', sm: 'row'}} spacing={2}>
+            <Box sx={{minWidth: '400px', maxWidth: '400px', overflow: 'hidden'}}>
+              <Typography sx={{opacity: disabled ? 0.5 : 1, whiteSpace: 'normal'}}>{option.title}</Typography>
             </Box>
             <Stack direction="row" flexWrap="wrap">
               {option.subOptions.map(subOption => (