labellife-design-tool 2.3.1 → 2.3.3

package/dist/esm/index.js

@@ -11279,47 +11279,68 @@ var SingleFieldDialog = function SingleFieldDialog(_ref) {
           })]
         });
       case 'radio':
-        return /*#__PURE__*/jsx(RadioGroup, {
-          value: value,
-          onChange: function onChange(e) {
-            return setValue(e.target.value);
-          },
+        return /*#__PURE__*/jsx(Box, {
           sx: {
             mt: 1,
-            gap: 1
+            flex: 1,
+            minHeight: 0,
+            overflowY: 'auto',
+            pr: 0.5,
+            '&::-webkit-scrollbar': {
+              width: 6
+            },
+            '&::-webkit-scrollbar-track': {
+              background: 'transparent'
+            },
+            '&::-webkit-scrollbar-thumb': {
+              background: '#d0d5dd',
+              borderRadius: 3
+            },
+            '&::-webkit-scrollbar-thumb:hover': {
+              background: '#aaa'
+            }
           },
-          children: options.map(function (opt) {
-            return /*#__PURE__*/jsx(FormControlLabel, {
-              value: opt,
-              control: /*#__PURE__*/jsx(Radio, {
-                sx: {
-                  color: '#d0d5dd',
-                  '&.Mui-checked': {
-                    color: accentColor
+          children: /*#__PURE__*/jsx(RadioGroup, {
+            value: value,
+            onChange: function onChange(e) {
+              return setValue(e.target.value);
+            },
+            sx: {
+              gap: 1
+            },
+            children: options.map(function (opt) {
+              return /*#__PURE__*/jsx(FormControlLabel, {
+                value: opt,
+                control: /*#__PURE__*/jsx(Radio, {
+                  sx: {
+                    color: '#d0d5dd',
+                    '&.Mui-checked': {
+                      color: accentColor
+                    }
                   }
-                }
-              }),
-              label: /*#__PURE__*/jsx(Typography, {
+                }),
+                label: /*#__PURE__*/jsx(Typography, {
+                  sx: {
+                    fontSize: 18
+                  },
+                  children: opt
+                }),
                 sx: {
-                  fontSize: 18
-                },
-                children: opt
-              }),
-              sx: {
-                m: 0,
-                border: '1px solid',
-                borderColor: value === opt ? accentColor : '#d0d5dd',
-                borderRadius: '8px',
-                px: 2,
-                py: 0.75,
-                transition: 'all 0.15s ease',
-                backgroundColor: value === opt ? 'rgba(13,131,205,0.04)' : 'transparent',
-                '&:hover': {
-                  borderColor: accentColor,
-                  backgroundColor: 'rgba(13,131,205,0.03)'
+                  m: 0,
+                  border: '1px solid',
+                  borderColor: value === opt ? accentColor : '#d0d5dd',
+                  borderRadius: '8px',
+                  px: 2,
+                  py: 0.75,
+                  transition: 'all 0.15s ease',
+                  backgroundColor: value === opt ? 'rgba(13,131,205,0.04)' : 'transparent',
+                  '&:hover': {
+                    borderColor: accentColor,
+                    backgroundColor: 'rgba(13,131,205,0.03)'
+                  }
                 }
-              }
-            }, opt);
+              }, opt);
+            })
           })
         });
       case 'list':
@@ -11327,11 +11348,32 @@ var SingleFieldDialog = function SingleFieldDialog(_ref) {
           var isAtMax = maxSelections > 0 && selectedItems.length >= maxSelections;
           return /*#__PURE__*/jsxs(Box, {
             sx: {
-              mt: 1
+              mt: 1,
+              flex: 1,
+              minHeight: 0,
+              display: 'flex',
+              flexDirection: 'column'
             },
             children: [/*#__PURE__*/jsx(FormGroup, {
               sx: {
-                gap: 1
+                gap: 1,
+                flex: 1,
+                minHeight: 0,
+                overflowY: 'auto',
+                pr: 0.5,
+                '&::-webkit-scrollbar': {
+                  width: 6
+                },
+                '&::-webkit-scrollbar-track': {
+                  background: 'transparent'
+                },
+                '&::-webkit-scrollbar-thumb': {
+                  background: '#d0d5dd',
+                  borderRadius: 3
+                },
+                '&::-webkit-scrollbar-thumb:hover': {
+                  background: '#aaa'
+                }
               },
               children: options.map(function (opt) {
                 var checked = selectedItems.includes(opt);
@@ -11469,18 +11511,23 @@ var SingleFieldDialog = function SingleFieldDialog(_ref) {
       sx: {
         flex: 1,
         display: 'flex',
-        alignItems: 'center',
-        justifyContent: 'center',
+        flexDirection: 'column',
+        overflow: 'hidden',
         p: {
           xs: 3,
           sm: 5
-        },
-        overflowY: 'auto'
+        }
       },
       children: /*#__PURE__*/jsxs(Box, {
         sx: {
           width: '100%',
-          maxWidth: 750
+          maxWidth: 750,
+          mx: 'auto',
+          display: 'flex',
+          flexDirection: 'column',
+          flex: 1,
+          minHeight: 0,
+          justifyContent: 'center'
         },
         children: [/*#__PURE__*/jsx(Typography, {
           sx: {
@@ -11509,7 +11556,8 @@ var SingleFieldDialog = function SingleFieldDialog(_ref) {
             display: 'flex',
             alignItems: 'center',
             gap: 2,
-            mt: 4.5
+            mt: 4.5,
+            flexShrink: 0
           },
           children: [canGoBack && /*#__PURE__*/jsx(Button, {
             variant: "outlined",