@erpsquad/common 1.8.79 → 1.8.81

package/dist/views/form-builder/element-edit-forms/column-width/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/form-builder/element-edit-forms/column-width.tsx"],"sourcesContent":["// React imports\nimport React, { useEffect, useState } from 'react';\n\n// Material UI imports\nimport { Box, IconButton, TextField, InputAdornment } from '@mui/material';\nimport { Add, Remove } from '@mui/icons-material';\n\nexport interface IColumnWidthProps {\n  onChange: (value: number) => void;\n}\n\nexport const ColumnWidth = ({onChange}: IColumnWidthProps) => {\n  const [value, setValue] = useState(6);\n\n  const handleIncrement = () => {\n    setValue(prev => prev + 1);\n  };\n\n  const handleDecrement = () => {\n    setValue(prev => Math.max(0, prev - 1)); // Prevent negative values\n  };\n\n  const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const newValue = Number.parseInt(event.target.value) || 0;\n    setValue(Math.max(0, newValue));\n  };\n\n  useEffect(() => {\n    onChange(value);\n  }, [value]);\n\n  return (\n    <Box sx={{ display: 'flex', alignItems: 'center', gap: 2, p: 4 }}>\n      <TextField\n        value={value}\n        onChange={handleInputChange}\n        name='custom_width'\n        size=\"small\"\n        sx={{\n          width: '120px',\n          '& .MuiOutlinedInput-root': {\n            paddingLeft: 0,\n            paddingRight: 0,\n            '& input': {\n              textAlign: 'center',\n              padding: '8px 4px',\n            }\n          }\n        }}\n        InputProps={{\n          startAdornment: (\n            <InputAdornment position=\"start\">\n              <IconButton\n                onClick={handleDecrement}\n                size=\"small\"\n                sx={{\n                  marginLeft: '-4px',\n                  borderRadius: '4px 0 0 4px',\n                  border: 'none',\n                  '&:hover': {\n                    backgroundColor: 'rgba(0, 0, 0, 0.04)'\n                  }\n                }}\n              >\n                <Remove fontSize=\"small\" />\n              </IconButton>\n            </InputAdornment>\n          ),\n          endAdornment: (\n            <InputAdornment position=\"end\">\n              <IconButton\n                onClick={handleIncrement}\n                size=\"small\"\n                sx={{\n                  marginRight: '-4px',\n                  borderRadius: '0 4px 4px 0',\n                  border: 'none',\n                  '&:hover': {\n                    backgroundColor: 'rgba(0, 0, 0, 0.04)'\n                  }\n                }}\n              >\n                <Add fontSize=\"small\" />\n              </IconButton>\n            </InputAdornment>\n          ),\n        }}\n        inputProps={{\n          type: 'number',\n          min: 0,\n        }}\n      />\n      \n      <Box sx={{ ml: 2, color: 'text.secondary' }}>\n        Current value: {value}\n      </Box>\n    </Box>\n  );\n};\n\nexport default ColumnWidth;"],"names":[],"mappings":";;;;;;;;AAWO,MAAM,cAAc,CAAC,EAAC,eAAiC;AAC5D,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,CAAC;AAEpC,QAAM,kBAAkB,MAAM;AAC5B,aAAS,CAAA,SAAQ,OAAO,CAAC;AAAA,EAC3B;AAEA,QAAM,kBAAkB,MAAM;AAC5B,aAAS,UAAQ,KAAK,IAAI,GAAG,OAAO,CAAC,CAAC;AAAA,EACxC;AAEA,QAAM,oBAAoB,CAAC,UAA+C;AACxE,UAAM,WAAW,OAAO,SAAS,MAAM,OAAO,KAAK,KAAK;AACxD,aAAS,KAAK,IAAI,GAAG,QAAQ,CAAC;AAAA,EAChC;AAEA,YAAU,MAAM;AACd,aAAS,KAAK;AAAA,EAChB,GAAG,CAAC,KAAK,CAAC;AAEV,SACE,qBAAC,KAAA,EAAI,IAAI,EAAE,SAAS,QAAQ,YAAY,UAAU,KAAK,GAAG,GAAG,EAAA,GAC3D,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,UAAU;AAAA,QACV,MAAK;AAAA,QACL,MAAK;AAAA,QACL,IAAI;AAAA,UACF,OAAO;AAAA,UACP,4BAA4B;AAAA,YAC1B,aAAa;AAAA,YACb,cAAc;AAAA,YACd,WAAW;AAAA,cACT,WAAW;AAAA,cACX,SAAS;AAAA,YAAA;AAAA,UACX;AAAA,QACF;AAAA,QAEF,YAAY;AAAA,UACV,gBACE,oBAAC,gBAAA,EAAe,UAAS,SACvB,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,SAAS;AAAA,cACT,MAAK;AAAA,cACL,IAAI;AAAA,gBACF,YAAY;AAAA,gBACZ,cAAc;AAAA,gBACd,QAAQ;AAAA,gBACR,WAAW;AAAA,kBACT,iBAAiB;AAAA,gBAAA;AAAA,cACnB;AAAA,cAGF,UAAA,oBAAC,QAAA,EAAO,UAAS,QAAA,CAAQ;AAAA,YAAA;AAAA,UAAA,GAE7B;AAAA,UAEF,cACE,oBAAC,gBAAA,EAAe,UAAS,OACvB,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,SAAS;AAAA,cACT,MAAK;AAAA,cACL,IAAI;AAAA,gBACF,aAAa;AAAA,gBACb,cAAc;AAAA,gBACd,QAAQ;AAAA,gBACR,WAAW;AAAA,kBACT,iBAAiB;AAAA,gBAAA;AAAA,cACnB;AAAA,cAGF,UAAA,oBAAC,KAAA,EAAI,UAAS,QAAA,CAAQ;AAAA,YAAA;AAAA,UAAA,EACxB,CACF;AAAA,QAAA;AAAA,QAGJ,YAAY;AAAA,UACV,MAAM;AAAA,UACN,KAAK;AAAA,QAAA;AAAA,MACP;AAAA,IAAA;AAAA,IAGF,qBAAC,OAAI,IAAI,EAAE,IAAI,GAAG,OAAO,oBAAoB,UAAA;AAAA,MAAA;AAAA,MAC3B;AAAA,IAAA,EAAA,CAClB;AAAA,EAAA,GACF;AAEJ;"}
+{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/form-builder/element-edit-forms/column-width.tsx"],"sourcesContent":["// React imports\r\nimport React, { useEffect, useState } from 'react';\r\n\r\n// Material UI imports\r\nimport { Box, IconButton, TextField, InputAdornment } from '@mui/material';\r\nimport { Add, Remove } from '@mui/icons-material';\r\n\r\nexport interface IColumnWidthProps {\r\n  onChange: (value: number) => void;\r\n}\r\n\r\nexport const ColumnWidth = ({onChange}: IColumnWidthProps) => {\r\n  const [value, setValue] = useState(6);\r\n\r\n  const handleIncrement = () => {\r\n    setValue(prev => prev + 1);\r\n  };\r\n\r\n  const handleDecrement = () => {\r\n    setValue(prev => Math.max(0, prev - 1)); // Prevent negative values\r\n  };\r\n\r\n  const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n    const newValue = Number.parseInt(event.target.value) || 0;\r\n    setValue(Math.max(0, newValue));\r\n  };\r\n\r\n  useEffect(() => {\r\n    onChange(value);\r\n  }, [value]);\r\n\r\n  return (\r\n    <Box sx={{ display: 'flex', alignItems: 'center', gap: 2, p: 4 }}>\r\n      <TextField\r\n        value={value}\r\n        onChange={handleInputChange}\r\n        name='custom_width'\r\n        size=\"small\"\r\n        sx={{\r\n          width: '120px',\r\n          '& .MuiOutlinedInput-root': {\r\n            paddingLeft: 0,\r\n            paddingRight: 0,\r\n            '& input': {\r\n              textAlign: 'center',\r\n              padding: '8px 4px',\r\n            }\r\n          }\r\n        }}\r\n        InputProps={{\r\n          startAdornment: (\r\n            <InputAdornment position=\"start\">\r\n              <IconButton\r\n                onClick={handleDecrement}\r\n                size=\"small\"\r\n                sx={{\r\n                  marginLeft: '-4px',\r\n                  borderRadius: '4px 0 0 4px',\r\n                  border: 'none',\r\n                  '&:hover': {\r\n                    backgroundColor: 'rgba(0, 0, 0, 0.04)'\r\n                  }\r\n                }}\r\n              >\r\n                <Remove fontSize=\"small\" />\r\n              </IconButton>\r\n            </InputAdornment>\r\n          ),\r\n          endAdornment: (\r\n            <InputAdornment position=\"end\">\r\n              <IconButton\r\n                onClick={handleIncrement}\r\n                size=\"small\"\r\n                sx={{\r\n                  marginRight: '-4px',\r\n                  borderRadius: '0 4px 4px 0',\r\n                  border: 'none',\r\n                  '&:hover': {\r\n                    backgroundColor: 'rgba(0, 0, 0, 0.04)'\r\n                  }\r\n                }}\r\n              >\r\n                <Add fontSize=\"small\" />\r\n              </IconButton>\r\n            </InputAdornment>\r\n          ),\r\n        }}\r\n        inputProps={{\r\n          type: 'number',\r\n          min: 0,\r\n        }}\r\n      />\r\n      \r\n      <Box sx={{ ml: 2, color: 'text.secondary' }}>\r\n        Current value: {value}\r\n      </Box>\r\n    </Box>\r\n  );\r\n};\r\n\r\nexport default ColumnWidth;"],"names":[],"mappings":";;;;;;;;AAWO,MAAM,cAAc,CAAC,EAAC,eAAiC;AAC5D,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,CAAC;AAEpC,QAAM,kBAAkB,MAAM;AAC5B,aAAS,CAAA,SAAQ,OAAO,CAAC;AAAA,EAC3B;AAEA,QAAM,kBAAkB,MAAM;AAC5B,aAAS,UAAQ,KAAK,IAAI,GAAG,OAAO,CAAC,CAAC;AAAA,EACxC;AAEA,QAAM,oBAAoB,CAAC,UAA+C;AACxE,UAAM,WAAW,OAAO,SAAS,MAAM,OAAO,KAAK,KAAK;AACxD,aAAS,KAAK,IAAI,GAAG,QAAQ,CAAC;AAAA,EAChC;AAEA,YAAU,MAAM;AACd,aAAS,KAAK;AAAA,EAChB,GAAG,CAAC,KAAK,CAAC;AAEV,SACE,qBAAC,KAAA,EAAI,IAAI,EAAE,SAAS,QAAQ,YAAY,UAAU,KAAK,GAAG,GAAG,EAAA,GAC3D,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,UAAU;AAAA,QACV,MAAK;AAAA,QACL,MAAK;AAAA,QACL,IAAI;AAAA,UACF,OAAO;AAAA,UACP,4BAA4B;AAAA,YAC1B,aAAa;AAAA,YACb,cAAc;AAAA,YACd,WAAW;AAAA,cACT,WAAW;AAAA,cACX,SAAS;AAAA,YAAA;AAAA,UACX;AAAA,QACF;AAAA,QAEF,YAAY;AAAA,UACV,gBACE,oBAAC,gBAAA,EAAe,UAAS,SACvB,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,SAAS;AAAA,cACT,MAAK;AAAA,cACL,IAAI;AAAA,gBACF,YAAY;AAAA,gBACZ,cAAc;AAAA,gBACd,QAAQ;AAAA,gBACR,WAAW;AAAA,kBACT,iBAAiB;AAAA,gBAAA;AAAA,cACnB;AAAA,cAGF,UAAA,oBAAC,QAAA,EAAO,UAAS,QAAA,CAAQ;AAAA,YAAA;AAAA,UAAA,GAE7B;AAAA,UAEF,cACE,oBAAC,gBAAA,EAAe,UAAS,OACvB,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,SAAS;AAAA,cACT,MAAK;AAAA,cACL,IAAI;AAAA,gBACF,aAAa;AAAA,gBACb,cAAc;AAAA,gBACd,QAAQ;AAAA,gBACR,WAAW;AAAA,kBACT,iBAAiB;AAAA,gBAAA;AAAA,cACnB;AAAA,cAGF,UAAA,oBAAC,KAAA,EAAI,UAAS,QAAA,CAAQ;AAAA,YAAA;AAAA,UAAA,EACxB,CACF;AAAA,QAAA;AAAA,QAGJ,YAAY;AAAA,UACV,MAAM;AAAA,UACN,KAAK;AAAA,QAAA;AAAA,MACP;AAAA,IAAA;AAAA,IAGF,qBAAC,OAAI,IAAI,EAAE,IAAI,GAAG,OAAO,oBAAoB,UAAA;AAAA,MAAA;AAAA,MAC3B;AAAA,IAAA,EAAA,CAClB;AAAA,EAAA,GACF;AAEJ;"}

package/dist/views/form-builder/element-edit-forms/column-width/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/views/form-builder/element-edit-forms/column-width.tsx"],"sourcesContent":["// React imports\nimport React, { useEffect, useState } from 'react';\n\n// Material UI imports\nimport { Box, IconButton, TextField, InputAdornment } from '@mui/material';\nimport { Add, Remove } from '@mui/icons-material';\n\nexport interface IColumnWidthProps {\n  onChange: (value: number) => void;\n}\n\nexport const ColumnWidth = ({onChange}: IColumnWidthProps) => {\n  const [value, setValue] = useState(6);\n\n  const handleIncrement = () => {\n    setValue(prev => prev + 1);\n  };\n\n  const handleDecrement = () => {\n    setValue(prev => Math.max(0, prev - 1)); // Prevent negative values\n  };\n\n  const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const newValue = Number.parseInt(event.target.value) || 0;\n    setValue(Math.max(0, newValue));\n  };\n\n  useEffect(() => {\n    onChange(value);\n  }, [value]);\n\n  return (\n    <Box sx={{ display: 'flex', alignItems: 'center', gap: 2, p: 4 }}>\n      <TextField\n        value={value}\n        onChange={handleInputChange}\n        name='custom_width'\n        size=\"small\"\n        sx={{\n          width: '120px',\n          '& .MuiOutlinedInput-root': {\n            paddingLeft: 0,\n            paddingRight: 0,\n            '& input': {\n              textAlign: 'center',\n              padding: '8px 4px',\n            }\n          }\n        }}\n        InputProps={{\n          startAdornment: (\n            <InputAdornment position=\"start\">\n              <IconButton\n                onClick={handleDecrement}\n                size=\"small\"\n                sx={{\n                  marginLeft: '-4px',\n                  borderRadius: '4px 0 0 4px',\n                  border: 'none',\n                  '&:hover': {\n                    backgroundColor: 'rgba(0, 0, 0, 0.04)'\n                  }\n                }}\n              >\n                <Remove fontSize=\"small\" />\n              </IconButton>\n            </InputAdornment>\n          ),\n          endAdornment: (\n            <InputAdornment position=\"end\">\n              <IconButton\n                onClick={handleIncrement}\n                size=\"small\"\n                sx={{\n                  marginRight: '-4px',\n                  borderRadius: '0 4px 4px 0',\n                  border: 'none',\n                  '&:hover': {\n                    backgroundColor: 'rgba(0, 0, 0, 0.04)'\n                  }\n                }}\n              >\n                <Add fontSize=\"small\" />\n              </IconButton>\n            </InputAdornment>\n          ),\n        }}\n        inputProps={{\n          type: 'number',\n          min: 0,\n        }}\n      />\n      \n      <Box sx={{ ml: 2, color: 'text.secondary' }}>\n        Current value: {value}\n      </Box>\n    </Box>\n  );\n};\n\nexport default ColumnWidth;"],"names":["ColumnWidth","onChange","value","setValue","useState","useEffect","jsxs","Box","sx","display","alignItems","gap","p","children","jsx","TextField","event","newValue","Number","parseInt","target","Math","max","name","size","width","paddingLeft","paddingRight","textAlign","padding","InputProps","startAdornment","InputAdornment","position","IconButton","onClick","prev","marginLeft","borderRadius","border","backgroundColor","Remove","fontSize","endAdornment","marginRight","Add","inputProps","type","min","ml","color"],"mappings":"ulBAWO,MAAMA,EAAc,EAAEC,eAC3B,MAAOC,EAAOC,GAAYC,EAAAA,SAAS,GAmBnC,OAJAC,EAAAA,UAAU,KACRJ,EAASC,IACR,CAACA,qBAGFI,KAACC,EAAAA,QAAA,CAAIC,GAAI,CAAEC,QAAS,OAAQC,WAAY,SAAUC,IAAK,EAAGC,EAAG,GAC3DC,SAAA;eAAAC,EAAAA,IAACC,EAAAA,QAAA,CACCb,QACAD,SAbqBe,IACzB,MAAMC,EAAWC,OAAOC,SAASH,EAAMI,OAAOlB,QAAU,EACxDC,EAASkB,KAAKC,IAAI,EAAGL,KAYjBM,KAAK,eACLC,KAAK,QACLhB,GAAI,CACFiB,MAAO,QACP,2BAA4B,CAC1BC,YAAa,EACbC,aAAc,EACd,UAAW,CACTC,UAAW,SACXC,QAAS,aAIfC,WAAY,CACVC,gCACEjB,IAACkB,EAAAA,QAAA,CAAeC,SAAS,QACvBpB,wBAAAC,EAAAA,IAACoB,EAAAA,QAAA,CACCC,QAnCU,KACtBhC,KAAiBkB,KAAKC,IAAI,EAAGc,EAAO,KAmCxBZ,KAAK,QACLhB,GAAI,CACF6B,WAAY,OACZC,aAAc,cACdC,OAAQ,OACR,UAAW,CACTC,gBAAiB,wBAIrB3B,0BAAAC,IAAC2B,EAAAA,QAAA,CAAOC,SAAS,cAIvBC,8BACE7B,IAACkB,EAAAA,QAAA,CAAeC,SAAS,MACvBpB,wBAAAC,EAAAA,IAACoB,EAAAA,QAAA,CACCC,QAzDU,KACtBhC,EAASiC,GAAQA,EAAO,IAyDZZ,KAAK,QACLhB,GAAI,CACFoC,YAAa,OACbN,aAAc,cACdC,OAAQ,OACR,UAAW,CACTC,gBAAiB,wBAIrB3B,0BAAAC,IAAC+B,EAAAA,QAAA,CAAIH,SAAS,eAKtBI,WAAY,CACVC,KAAM,SACNC,IAAK;eAIT1C,OAACC,EAAAA,SAAIC,GAAI,CAAEyC,GAAI,EAAGC,MAAO,kBAAoBrC,SAAA,CAAA,kBAC3BX"}
+{"version":3,"file":"index.js","sources":["../../../../../src/views/form-builder/element-edit-forms/column-width.tsx"],"sourcesContent":["// React imports\r\nimport React, { useEffect, useState } from 'react';\r\n\r\n// Material UI imports\r\nimport { Box, IconButton, TextField, InputAdornment } from '@mui/material';\r\nimport { Add, Remove } from '@mui/icons-material';\r\n\r\nexport interface IColumnWidthProps {\r\n  onChange: (value: number) => void;\r\n}\r\n\r\nexport const ColumnWidth = ({onChange}: IColumnWidthProps) => {\r\n  const [value, setValue] = useState(6);\r\n\r\n  const handleIncrement = () => {\r\n    setValue(prev => prev + 1);\r\n  };\r\n\r\n  const handleDecrement = () => {\r\n    setValue(prev => Math.max(0, prev - 1)); // Prevent negative values\r\n  };\r\n\r\n  const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n    const newValue = Number.parseInt(event.target.value) || 0;\r\n    setValue(Math.max(0, newValue));\r\n  };\r\n\r\n  useEffect(() => {\r\n    onChange(value);\r\n  }, [value]);\r\n\r\n  return (\r\n    <Box sx={{ display: 'flex', alignItems: 'center', gap: 2, p: 4 }}>\r\n      <TextField\r\n        value={value}\r\n        onChange={handleInputChange}\r\n        name='custom_width'\r\n        size=\"small\"\r\n        sx={{\r\n          width: '120px',\r\n          '& .MuiOutlinedInput-root': {\r\n            paddingLeft: 0,\r\n            paddingRight: 0,\r\n            '& input': {\r\n              textAlign: 'center',\r\n              padding: '8px 4px',\r\n            }\r\n          }\r\n        }}\r\n        InputProps={{\r\n          startAdornment: (\r\n            <InputAdornment position=\"start\">\r\n              <IconButton\r\n                onClick={handleDecrement}\r\n                size=\"small\"\r\n                sx={{\r\n                  marginLeft: '-4px',\r\n                  borderRadius: '4px 0 0 4px',\r\n                  border: 'none',\r\n                  '&:hover': {\r\n                    backgroundColor: 'rgba(0, 0, 0, 0.04)'\r\n                  }\r\n                }}\r\n              >\r\n                <Remove fontSize=\"small\" />\r\n              </IconButton>\r\n            </InputAdornment>\r\n          ),\r\n          endAdornment: (\r\n            <InputAdornment position=\"end\">\r\n              <IconButton\r\n                onClick={handleIncrement}\r\n                size=\"small\"\r\n                sx={{\r\n                  marginRight: '-4px',\r\n                  borderRadius: '0 4px 4px 0',\r\n                  border: 'none',\r\n                  '&:hover': {\r\n                    backgroundColor: 'rgba(0, 0, 0, 0.04)'\r\n                  }\r\n                }}\r\n              >\r\n                <Add fontSize=\"small\" />\r\n              </IconButton>\r\n            </InputAdornment>\r\n          ),\r\n        }}\r\n        inputProps={{\r\n          type: 'number',\r\n          min: 0,\r\n        }}\r\n      />\r\n      \r\n      <Box sx={{ ml: 2, color: 'text.secondary' }}>\r\n        Current value: {value}\r\n      </Box>\r\n    </Box>\r\n  );\r\n};\r\n\r\nexport default ColumnWidth;"],"names":["ColumnWidth","onChange","value","setValue","useState","useEffect","jsxs","Box","sx","display","alignItems","gap","p","children","jsx","TextField","event","newValue","Number","parseInt","target","Math","max","name","size","width","paddingLeft","paddingRight","textAlign","padding","InputProps","startAdornment","InputAdornment","position","IconButton","onClick","prev","marginLeft","borderRadius","border","backgroundColor","Remove","fontSize","endAdornment","marginRight","Add","inputProps","type","min","ml","color"],"mappings":"ulBAWO,MAAMA,EAAc,EAAEC,eAC3B,MAAOC,EAAOC,GAAYC,EAAAA,SAAS,GAmBnC,OAJAC,EAAAA,UAAU,KACRJ,EAASC,IACR,CAACA,qBAGFI,KAACC,EAAAA,QAAA,CAAIC,GAAI,CAAEC,QAAS,OAAQC,WAAY,SAAUC,IAAK,EAAGC,EAAG,GAC3DC,SAAA;eAAAC,EAAAA,IAACC,EAAAA,QAAA,CACCb,QACAD,SAbqBe,IACzB,MAAMC,EAAWC,OAAOC,SAASH,EAAMI,OAAOlB,QAAU,EACxDC,EAASkB,KAAKC,IAAI,EAAGL,KAYjBM,KAAK,eACLC,KAAK,QACLhB,GAAI,CACFiB,MAAO,QACP,2BAA4B,CAC1BC,YAAa,EACbC,aAAc,EACd,UAAW,CACTC,UAAW,SACXC,QAAS,aAIfC,WAAY,CACVC,gCACEjB,IAACkB,EAAAA,QAAA,CAAeC,SAAS,QACvBpB,wBAAAC,EAAAA,IAACoB,EAAAA,QAAA,CACCC,QAnCU,KACtBhC,KAAiBkB,KAAKC,IAAI,EAAGc,EAAO,KAmCxBZ,KAAK,QACLhB,GAAI,CACF6B,WAAY,OACZC,aAAc,cACdC,OAAQ,OACR,UAAW,CACTC,gBAAiB,wBAIrB3B,0BAAAC,IAAC2B,EAAAA,QAAA,CAAOC,SAAS,cAIvBC,8BACE7B,IAACkB,EAAAA,QAAA,CAAeC,SAAS,MACvBpB,wBAAAC,EAAAA,IAACoB,EAAAA,QAAA,CACCC,QAzDU,KACtBhC,EAASiC,GAAQA,EAAO,IAyDZZ,KAAK,QACLhB,GAAI,CACFoC,YAAa,OACbN,aAAc,cACdC,OAAQ,OACR,UAAW,CACTC,gBAAiB,wBAIrB3B,0BAAAC,IAAC+B,EAAAA,QAAA,CAAIH,SAAS,eAKtBI,WAAY,CACVC,KAAM,SACNC,IAAK;eAIT1C,OAACC,EAAAA,SAAIC,GAAI,CAAEyC,GAAI,EAAGC,MAAO,kBAAoBrC,SAAA,CAAA,kBAC3BX"}

package/dist/views/form-builder/element-edit-forms/field-select/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/form-builder/element-edit-forms/field-select.tsx"],"sourcesContent":["// React imports\nimport { useEffect, useState } from \"react\";\n\n// Material UI imports\nimport { MenuItem, SelectProps, Stack } from \"@mui/material\";\n\n// ERP Common imports\nimport {\n  ArrowCircleDown,\n  Calendar,\n  CheckboxSquare,\n  Clock,\n  DollarCircle,\n  Email,\n  Grid,\n  Hashtag,\n  Image,\n  InfoCircle,\n  Link,\n  LinkHorizontal,\n  Location,\n  PaperClip,\n  Paragraph,\n  Phone,\n  RadioButton,\n  ToggleSwitch,\n} from \"@/components/icons\";\nimport Select from \"@/components/select/select\";\nimport Typography from \"@/components/typography/typography\";\n\ninterface IField {\n  label: string;\n  value: string;\n  icon: typeof Paragraph | string;\n}\n\nconst fields: IField[] = [\n  { label: \"Text\", value: \"text\", icon: Paragraph },\n  { label: \"Number\", value: \"number\", icon: Hashtag },\n  { label: \"Select\", value: \"select\", icon: ArrowCircleDown },\n  { label: \"Date\", value: \"date\", icon: Calendar },\n  { label: \"Files & Media\", value: \"file\", icon: PaperClip },\n  { label: \"URL\", value: \"url\", icon: Link },\n  { label: \"Email\", value: \"email\", icon: Email },\n  { label: \"Phone\", value: \"phone\", icon: Phone },\n  { label: \"Currency\", value: \"currency\", icon: DollarCircle },\n  { label: \"Time\", value: \"time\", icon: Clock },\n  { label: \"Table\", value: \"table\", icon: Grid },\n  { label: \"Geolocation\", value: \"geoLocation\", icon: Location },\n  { label: \"Check Box\", value: \"checkbox\", icon: CheckboxSquare },\n  { label: \"Image Upload\", value: \"image\", icon: Image },\n  { label: \"Relation Field\", value: \"relation\", icon: LinkHorizontal },\n  { label: \"Info Card\", value: \"info\", icon: InfoCircle },\n  { label: \"Toggle Button\", value: \"toggleButton\", icon: ToggleSwitch },\n  { label: \"Radio Button\", value: \"radioButton\", icon: RadioButton },\n  { label: \"tagsInput\", value: \"tagsInput\", icon: Paragraph },\n];\n\nconst FieldSelect: React.FC<SelectProps> = (props) => {\n  const [selectFields, setSelectFields] = useState<IField[]>(fields);\n  const [search, setSearch] = useState<string>(\"\");\n\n  const handleSearch = (event: React.ChangeEvent<HTMLInputElement>) => {\n    setSearch(event.target.value);\n  };\n\n  const handleSearchFields = (searchVal: string) => {\n    if (searchVal) {\n      setSelectFields([\n        ...fields.filter((field) => field.value.includes(searchVal)),\n      ]);\n    } else {\n      setSelectFields(fields);\n    }\n  };\n\n  useEffect(() => {\n    handleSearchFields(search);\n  }, [search]);\n\n  return (\n    <Select\n      fullWidth\n      placeholder=\"Select Field\"\n      size=\"small\"\n      labelName=\"Field Type\"\n      renderValue={(value: string) =>\n        fields.find((field) => field.value === value)?.label\n      }\n      handleSearch={() => handleSearch}\n      searchPlaceholder=\"Search Attributes\"\n      searchValue={search}\n      {...props}\n    >\n      {selectFields.map((field) => (\n        <MenuItem value={field.value} onKeyDown={(e) => e.stopPropagation()}>\n          <Stack direction=\"row\" spacing={1} alignItems=\"center\">\n            {field.icon && <field.icon fontSize=\"small\" />}\n            <Typography type=\"s3\" color=\"theme.secondary.1000\">\n              {field.label}\n            </Typography>\n          </Stack>\n        </MenuItem>\n      ))}\n    </Select>\n  );\n};\n\nexport default FieldSelect;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAoCA,MAAM,SAAmB;AAAA,EACvB,EAAE,OAAO,QAAQ,OAAO,QAAQ,MAAM,UAAA;AAAA,EACtC,EAAE,OAAO,UAAU,OAAO,UAAU,MAAM,QAAA;AAAA,EAC1C,EAAE,OAAO,UAAU,OAAO,UAAU,MAAM,gBAAA;AAAA,EAC1C,EAAE,OAAO,QAAQ,OAAO,QAAQ,MAAM,SAAA;AAAA,EACtC,EAAE,OAAO,iBAAiB,OAAO,QAAQ,MAAM,UAAA;AAAA,EAC/C,EAAE,OAAO,OAAO,OAAO,OAAO,MAAM,KAAA;AAAA,EACpC,EAAE,OAAO,SAAS,OAAO,SAAS,MAAM,MAAA;AAAA,EACxC,EAAE,OAAO,SAAS,OAAO,SAAS,MAAM,MAAA;AAAA,EACxC,EAAE,OAAO,YAAY,OAAO,YAAY,MAAM,aAAA;AAAA,EAC9C,EAAE,OAAO,QAAQ,OAAO,QAAQ,MAAM,MAAA;AAAA,EACtC,EAAE,OAAO,SAAS,OAAO,SAAS,MAAM,KAAA;AAAA,EACxC,EAAE,OAAO,eAAe,OAAO,eAAe,MAAM,SAAA;AAAA,EACpD,EAAE,OAAO,aAAa,OAAO,YAAY,MAAM,eAAA;AAAA,EAC/C,EAAE,OAAO,gBAAgB,OAAO,SAAS,MAAM,MAAA;AAAA,EAC/C,EAAE,OAAO,kBAAkB,OAAO,YAAY,MAAM,eAAA;AAAA,EACpD,EAAE,OAAO,aAAa,OAAO,QAAQ,MAAM,WAAA;AAAA,EAC3C,EAAE,OAAO,iBAAiB,OAAO,gBAAgB,MAAM,aAAA;AAAA,EACvD,EAAE,OAAO,gBAAgB,OAAO,eAAe,MAAM,YAAA;AAAA,EACrD,EAAE,OAAO,aAAa,OAAO,aAAa,MAAM,UAAA;AAClD;AAEA,MAAM,cAAqC,CAAC,UAAU;AACpD,QAAM,CAAC,cAAc,eAAe,IAAI,SAAmB,MAAM;AACjE,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAiB,EAAE;AAE/C,QAAM,eAAe,CAAC,UAA+C;AACnE,cAAU,MAAM,OAAO,KAAK;AAAA,EAC9B;AAEA,QAAM,qBAAqB,CAAC,cAAsB;AAChD,QAAI,WAAW;AACb,sBAAgB;AAAA,QACd,GAAG,OAAO,OAAO,CAAC,UAAU,MAAM,MAAM,SAAS,SAAS,CAAC;AAAA,MAAA,CAC5D;AAAA,IACH,OAAO;AACL,sBAAgB,MAAM;AAAA,IACxB;AAAA,EACF;AAEA,YAAU,MAAM;AACd,uBAAmB,MAAM;AAAA,EAC3B,GAAG,CAAC,MAAM,CAAC;AAEX,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAS;AAAA,MACT,aAAY;AAAA,MACZ,MAAK;AAAA,MACL,WAAU;AAAA,MACV,aAAa,CAAC,UAAA;;AACZ,4BAAO,KAAK,CAAC,UAAU,MAAM,UAAU,KAAK,MAA5C,mBAA+C;AAAA;AAAA,MAEjD,cAAc,MAAM;AAAA,MACpB,mBAAkB;AAAA,MAClB,aAAa;AAAA,MACZ,GAAG;AAAA,MAEH,UAAA,aAAa,IAAI,CAAC,8BAChB,UAAA,EAAS,OAAO,MAAM,OAAO,WAAW,CAAC,MAAM,EAAE,mBAChD,UAAA,qBAAC,OAAA,EAAM,WAAU,OAAM,SAAS,GAAG,YAAW,UAC3C,UAAA;AAAA,QAAA,MAAM,QAAQ,oBAAC,MAAM,MAAN,EAAW,UAAS,SAAQ;AAAA,4BAC3C,YAAA,EAAW,MAAK,MAAK,OAAM,wBACzB,gBAAM,MAAA,CACT;AAAA,MAAA,EAAA,CACF,GACF,CACD;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/form-builder/element-edit-forms/field-select.tsx"],"sourcesContent":["// React imports\r\nimport { useEffect, useState } from \"react\";\r\n\r\n// Material UI imports\r\nimport { MenuItem, SelectProps, Stack } from \"@mui/material\";\r\n\r\n// ERP Common imports\r\nimport {\r\n  ArrowCircleDown,\r\n  Calendar,\r\n  CheckboxSquare,\r\n  Clock,\r\n  DollarCircle,\r\n  Email,\r\n  Grid,\r\n  Hashtag,\r\n  Image,\r\n  InfoCircle,\r\n  Link,\r\n  LinkHorizontal,\r\n  Location,\r\n  PaperClip,\r\n  Paragraph,\r\n  Phone,\r\n  RadioButton,\r\n  ToggleSwitch,\r\n} from \"@/components/icons\";\r\nimport Select from \"@/components/select/select\";\r\nimport Typography from \"@/components/typography/typography\";\r\n\r\ninterface IField {\r\n  label: string;\r\n  value: string;\r\n  icon: typeof Paragraph | string;\r\n}\r\n\r\nconst fields: IField[] = [\r\n  { label: \"Text\", value: \"text\", icon: Paragraph },\r\n  { label: \"Number\", value: \"number\", icon: Hashtag },\r\n  { label: \"Select\", value: \"select\", icon: ArrowCircleDown },\r\n  { label: \"Date\", value: \"date\", icon: Calendar },\r\n  { label: \"Files & Media\", value: \"file\", icon: PaperClip },\r\n  { label: \"URL\", value: \"url\", icon: Link },\r\n  { label: \"Email\", value: \"email\", icon: Email },\r\n  { label: \"Phone\", value: \"phone\", icon: Phone },\r\n  { label: \"Currency\", value: \"currency\", icon: DollarCircle },\r\n  { label: \"Time\", value: \"time\", icon: Clock },\r\n  { label: \"Table\", value: \"table\", icon: Grid },\r\n  { label: \"Geolocation\", value: \"geoLocation\", icon: Location },\r\n  { label: \"Check Box\", value: \"checkbox\", icon: CheckboxSquare },\r\n  { label: \"Image Upload\", value: \"image\", icon: Image },\r\n  { label: \"Relation Field\", value: \"relation\", icon: LinkHorizontal },\r\n  { label: \"Info Card\", value: \"info\", icon: InfoCircle },\r\n  { label: \"Toggle Button\", value: \"toggleButton\", icon: ToggleSwitch },\r\n  { label: \"Radio Button\", value: \"radioButton\", icon: RadioButton },\r\n  { label: \"tagsInput\", value: \"tagsInput\", icon: Paragraph },\r\n];\r\n\r\nconst FieldSelect: React.FC<SelectProps> = (props) => {\r\n  const [selectFields, setSelectFields] = useState<IField[]>(fields);\r\n  const [search, setSearch] = useState<string>(\"\");\r\n\r\n  const handleSearch = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n    setSearch(event.target.value);\r\n  };\r\n\r\n  const handleSearchFields = (searchVal: string) => {\r\n    if (searchVal) {\r\n      setSelectFields([\r\n        ...fields.filter((field) => field.value.includes(searchVal)),\r\n      ]);\r\n    } else {\r\n      setSelectFields(fields);\r\n    }\r\n  };\r\n\r\n  useEffect(() => {\r\n    handleSearchFields(search);\r\n  }, [search]);\r\n\r\n  return (\r\n    <Select\r\n      fullWidth\r\n      placeholder=\"Select Field\"\r\n      size=\"small\"\r\n      labelName=\"Field Type\"\r\n      renderValue={(value: string) =>\r\n        fields.find((field) => field.value === value)?.label\r\n      }\r\n      handleSearch={() => handleSearch}\r\n      searchPlaceholder=\"Search Attributes\"\r\n      searchValue={search}\r\n      {...props}\r\n    >\r\n      {selectFields.map((field) => (\r\n        <MenuItem value={field.value} onKeyDown={(e) => e.stopPropagation()}>\r\n          <Stack direction=\"row\" spacing={1} alignItems=\"center\">\r\n            {field.icon && <field.icon fontSize=\"small\" />}\r\n            <Typography type=\"s3\" color=\"theme.secondary.1000\">\r\n              {field.label}\r\n            </Typography>\r\n          </Stack>\r\n        </MenuItem>\r\n      ))}\r\n    </Select>\r\n  );\r\n};\r\n\r\nexport default FieldSelect;\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAoCA,MAAM,SAAmB;AAAA,EACvB,EAAE,OAAO,QAAQ,OAAO,QAAQ,MAAM,UAAA;AAAA,EACtC,EAAE,OAAO,UAAU,OAAO,UAAU,MAAM,QAAA;AAAA,EAC1C,EAAE,OAAO,UAAU,OAAO,UAAU,MAAM,gBAAA;AAAA,EAC1C,EAAE,OAAO,QAAQ,OAAO,QAAQ,MAAM,SAAA;AAAA,EACtC,EAAE,OAAO,iBAAiB,OAAO,QAAQ,MAAM,UAAA;AAAA,EAC/C,EAAE,OAAO,OAAO,OAAO,OAAO,MAAM,KAAA;AAAA,EACpC,EAAE,OAAO,SAAS,OAAO,SAAS,MAAM,MAAA;AAAA,EACxC,EAAE,OAAO,SAAS,OAAO,SAAS,MAAM,MAAA;AAAA,EACxC,EAAE,OAAO,YAAY,OAAO,YAAY,MAAM,aAAA;AAAA,EAC9C,EAAE,OAAO,QAAQ,OAAO,QAAQ,MAAM,MAAA;AAAA,EACtC,EAAE,OAAO,SAAS,OAAO,SAAS,MAAM,KAAA;AAAA,EACxC,EAAE,OAAO,eAAe,OAAO,eAAe,MAAM,SAAA;AAAA,EACpD,EAAE,OAAO,aAAa,OAAO,YAAY,MAAM,eAAA;AAAA,EAC/C,EAAE,OAAO,gBAAgB,OAAO,SAAS,MAAM,MAAA;AAAA,EAC/C,EAAE,OAAO,kBAAkB,OAAO,YAAY,MAAM,eAAA;AAAA,EACpD,EAAE,OAAO,aAAa,OAAO,QAAQ,MAAM,WAAA;AAAA,EAC3C,EAAE,OAAO,iBAAiB,OAAO,gBAAgB,MAAM,aAAA;AAAA,EACvD,EAAE,OAAO,gBAAgB,OAAO,eAAe,MAAM,YAAA;AAAA,EACrD,EAAE,OAAO,aAAa,OAAO,aAAa,MAAM,UAAA;AAClD;AAEA,MAAM,cAAqC,CAAC,UAAU;AACpD,QAAM,CAAC,cAAc,eAAe,IAAI,SAAmB,MAAM;AACjE,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAiB,EAAE;AAE/C,QAAM,eAAe,CAAC,UAA+C;AACnE,cAAU,MAAM,OAAO,KAAK;AAAA,EAC9B;AAEA,QAAM,qBAAqB,CAAC,cAAsB;AAChD,QAAI,WAAW;AACb,sBAAgB;AAAA,QACd,GAAG,OAAO,OAAO,CAAC,UAAU,MAAM,MAAM,SAAS,SAAS,CAAC;AAAA,MAAA,CAC5D;AAAA,IACH,OAAO;AACL,sBAAgB,MAAM;AAAA,IACxB;AAAA,EACF;AAEA,YAAU,MAAM;AACd,uBAAmB,MAAM;AAAA,EAC3B,GAAG,CAAC,MAAM,CAAC;AAEX,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAS;AAAA,MACT,aAAY;AAAA,MACZ,MAAK;AAAA,MACL,WAAU;AAAA,MACV,aAAa,CAAC,UAAA;;AACZ,4BAAO,KAAK,CAAC,UAAU,MAAM,UAAU,KAAK,MAA5C,mBAA+C;AAAA;AAAA,MAEjD,cAAc,MAAM;AAAA,MACpB,mBAAkB;AAAA,MAClB,aAAa;AAAA,MACZ,GAAG;AAAA,MAEH,UAAA,aAAa,IAAI,CAAC,8BAChB,UAAA,EAAS,OAAO,MAAM,OAAO,WAAW,CAAC,MAAM,EAAE,mBAChD,UAAA,qBAAC,OAAA,EAAM,WAAU,OAAM,SAAS,GAAG,YAAW,UAC3C,UAAA;AAAA,QAAA,MAAM,QAAQ,oBAAC,MAAM,MAAN,EAAW,UAAS,SAAQ;AAAA,4BAC3C,YAAA,EAAW,MAAK,MAAK,OAAM,wBACzB,gBAAM,MAAA,CACT;AAAA,MAAA,EAAA,CACF,GACF,CACD;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/views/form-builder/element-edit-forms/field-select/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/views/form-builder/element-edit-forms/field-select.tsx"],"sourcesContent":["// React imports\nimport { useEffect, useState } from \"react\";\n\n// Material UI imports\nimport { MenuItem, SelectProps, Stack } from \"@mui/material\";\n\n// ERP Common imports\nimport {\n  ArrowCircleDown,\n  Calendar,\n  CheckboxSquare,\n  Clock,\n  DollarCircle,\n  Email,\n  Grid,\n  Hashtag,\n  Image,\n  InfoCircle,\n  Link,\n  LinkHorizontal,\n  Location,\n  PaperClip,\n  Paragraph,\n  Phone,\n  RadioButton,\n  ToggleSwitch,\n} from \"@/components/icons\";\nimport Select from \"@/components/select/select\";\nimport Typography from \"@/components/typography/typography\";\n\ninterface IField {\n  label: string;\n  value: string;\n  icon: typeof Paragraph | string;\n}\n\nconst fields: IField[] = [\n  { label: \"Text\", value: \"text\", icon: Paragraph },\n  { label: \"Number\", value: \"number\", icon: Hashtag },\n  { label: \"Select\", value: \"select\", icon: ArrowCircleDown },\n  { label: \"Date\", value: \"date\", icon: Calendar },\n  { label: \"Files & Media\", value: \"file\", icon: PaperClip },\n  { label: \"URL\", value: \"url\", icon: Link },\n  { label: \"Email\", value: \"email\", icon: Email },\n  { label: \"Phone\", value: \"phone\", icon: Phone },\n  { label: \"Currency\", value: \"currency\", icon: DollarCircle },\n  { label: \"Time\", value: \"time\", icon: Clock },\n  { label: \"Table\", value: \"table\", icon: Grid },\n  { label: \"Geolocation\", value: \"geoLocation\", icon: Location },\n  { label: \"Check Box\", value: \"checkbox\", icon: CheckboxSquare },\n  { label: \"Image Upload\", value: \"image\", icon: Image },\n  { label: \"Relation Field\", value: \"relation\", icon: LinkHorizontal },\n  { label: \"Info Card\", value: \"info\", icon: InfoCircle },\n  { label: \"Toggle Button\", value: \"toggleButton\", icon: ToggleSwitch },\n  { label: \"Radio Button\", value: \"radioButton\", icon: RadioButton },\n  { label: \"tagsInput\", value: \"tagsInput\", icon: Paragraph },\n];\n\nconst FieldSelect: React.FC<SelectProps> = (props) => {\n  const [selectFields, setSelectFields] = useState<IField[]>(fields);\n  const [search, setSearch] = useState<string>(\"\");\n\n  const handleSearch = (event: React.ChangeEvent<HTMLInputElement>) => {\n    setSearch(event.target.value);\n  };\n\n  const handleSearchFields = (searchVal: string) => {\n    if (searchVal) {\n      setSelectFields([\n        ...fields.filter((field) => field.value.includes(searchVal)),\n      ]);\n    } else {\n      setSelectFields(fields);\n    }\n  };\n\n  useEffect(() => {\n    handleSearchFields(search);\n  }, [search]);\n\n  return (\n    <Select\n      fullWidth\n      placeholder=\"Select Field\"\n      size=\"small\"\n      labelName=\"Field Type\"\n      renderValue={(value: string) =>\n        fields.find((field) => field.value === value)?.label\n      }\n      handleSearch={() => handleSearch}\n      searchPlaceholder=\"Search Attributes\"\n      searchValue={search}\n      {...props}\n    >\n      {selectFields.map((field) => (\n        <MenuItem value={field.value} onKeyDown={(e) => e.stopPropagation()}>\n          <Stack direction=\"row\" spacing={1} alignItems=\"center\">\n            {field.icon && <field.icon fontSize=\"small\" />}\n            <Typography type=\"s3\" color=\"theme.secondary.1000\">\n              {field.label}\n            </Typography>\n          </Stack>\n        </MenuItem>\n      ))}\n    </Select>\n  );\n};\n\nexport default FieldSelect;\n"],"names":["fields","label","value","icon","Paragraph","Hashtag","ArrowCircleDown","Calendar","PaperClip","Link","Email","Phone","DollarCircle","Clock","Grid","Location","CheckboxSquare","Image","LinkHorizontal","InfoCircle","ToggleSwitch","RadioButton","props","selectFields","setSelectFields","useState","search","setSearch","handleSearch","event","target","useEffect","searchVal","filter","field","includes","jsx","Select","fullWidth","placeholder","size","labelName","renderValue","_a","find","searchPlaceholder","searchValue","children","map","MenuItem","onKeyDown","e","stopPropagation","jsxs","Stack","direction","spacing","alignItems","fontSize","Typography","type","color"],"mappings":"89CAoCA,MAAMA,EAAmB,CACvB,CAAEC,MAAO,OAAQC,MAAO,OAAQC,KAAMC,EAAAA,WACtC,CAAEH,MAAO,SAAUC,MAAO,SAAUC,KAAME,EAAAA,SAC1C,CAAEJ,MAAO,SAAUC,MAAO,SAAUC,KAAMG,EAAAA,iBAC1C,CAAEL,MAAO,OAAQC,MAAO,OAAQC,KAAMI,EAAAA,UACtC,CAAEN,MAAO,gBAAiBC,MAAO,OAAQC,KAAMK,EAAAA,WAC/C,CAAEP,MAAO,MAAOC,MAAO,MAAOC,KAAMM,EAAAA,MACpC,CAAER,MAAO,QAASC,MAAO,QAASC,KAAMO,EAAAA,OACxC,CAAET,MAAO,QAASC,MAAO,QAASC,KAAMQ,EAAAA,OACxC,CAAEV,MAAO,WAAYC,MAAO,WAAYC,KAAMS,EAAAA,cAC9C,CAAEX,MAAO,OAAQC,MAAO,OAAQC,KAAMU,EAAAA,OACtC,CAAEZ,MAAO,QAASC,MAAO,QAASC,KAAMW,EAAAA,MACxC,CAAEb,MAAO,cAAeC,MAAO,cAAeC,KAAMY,EAAAA,UACpD,CAAEd,MAAO,YAAaC,MAAO,WAAYC,KAAMa,EAAAA,gBAC/C,CAAEf,MAAO,eAAgBC,MAAO,QAASC,KAAMc,EAAAA,OAC/C,CAAEhB,MAAO,iBAAkBC,MAAO,WAAYC,KAAMe,EAAAA,gBACpD,CAAEjB,MAAO,YAAaC,MAAO,OAAQC,KAAMgB,EAAAA,YAC3C,CAAElB,MAAO,gBAAiBC,MAAO,eAAgBC,KAAMiB,EAAAA,cACvD,CAAEnB,MAAO,eAAgBC,MAAO,cAAeC,KAAMkB,EAAAA,aACrD,CAAEpB,MAAO,YAAaC,MAAO,YAAaC,KAAMC,EAAAA,4BAGNkB,IAC1C,MAAOC,EAAcC,GAAmBC,EAAAA,SAAmBzB,IACpD0B,EAAQC,GAAaF,EAAAA,SAAiB,IAEvCG,EAAgBC,IACpBF,EAAUE,EAAMC,OAAO5B,QAiBzB,OAJA6B,EAAAA,UAAU,KAViB,IAACC,EAExBR,GAFwBQ,EAWPN,GATD,IACX1B,EAAOiC,OAAQC,GAAUA,EAAMhC,MAAMiC,SAASH,KAGnChC,IAMjB,CAAC0B,mBAGFU,EAAAA,IAACC,EAAAA,OAAA,CACCC,WAAS,EACTC,YAAY,eACZC,KAAK,QACLC,UAAU,aACVC,YAAcxC,UACZ,OAAA,OAAAyC,EAAA3C,EAAO4C,KAAMV,GAAUA,EAAMhC,QAAUA,SAAvC,EAAAyC,EAA+C1C,OAEjD2B,aAAc,IAAMA,EACpBiB,kBAAkB,oBAClBC,YAAapB,KACTJ,EAEHyB,SAAAxB,EAAayB,IAAKd,wBAChBe,UAAA,CAAS/C,MAAOgC,EAAMhC,MAAOgD,UAAYC,GAAMA,EAAEC,kBAChDL,wBAAAM,EAAAA,KAACC,EAAAA,QAAA,CAAMC,UAAU,MAAMC,QAAS,EAAGC,WAAW,SAC3CV,SAAA,CAAAb,EAAM/B,qBAAQiC,MAACF,EAAM/B,KAAN,CAAWuD,SAAS;qBACnCC,EAAAA,WAAA,CAAWC,KAAK,KAAKC,MAAM,uBACzBd,WAAM9C"}
+{"version":3,"file":"index.js","sources":["../../../../../src/views/form-builder/element-edit-forms/field-select.tsx"],"sourcesContent":["// React imports\r\nimport { useEffect, useState } from \"react\";\r\n\r\n// Material UI imports\r\nimport { MenuItem, SelectProps, Stack } from \"@mui/material\";\r\n\r\n// ERP Common imports\r\nimport {\r\n  ArrowCircleDown,\r\n  Calendar,\r\n  CheckboxSquare,\r\n  Clock,\r\n  DollarCircle,\r\n  Email,\r\n  Grid,\r\n  Hashtag,\r\n  Image,\r\n  InfoCircle,\r\n  Link,\r\n  LinkHorizontal,\r\n  Location,\r\n  PaperClip,\r\n  Paragraph,\r\n  Phone,\r\n  RadioButton,\r\n  ToggleSwitch,\r\n} from \"@/components/icons\";\r\nimport Select from \"@/components/select/select\";\r\nimport Typography from \"@/components/typography/typography\";\r\n\r\ninterface IField {\r\n  label: string;\r\n  value: string;\r\n  icon: typeof Paragraph | string;\r\n}\r\n\r\nconst fields: IField[] = [\r\n  { label: \"Text\", value: \"text\", icon: Paragraph },\r\n  { label: \"Number\", value: \"number\", icon: Hashtag },\r\n  { label: \"Select\", value: \"select\", icon: ArrowCircleDown },\r\n  { label: \"Date\", value: \"date\", icon: Calendar },\r\n  { label: \"Files & Media\", value: \"file\", icon: PaperClip },\r\n  { label: \"URL\", value: \"url\", icon: Link },\r\n  { label: \"Email\", value: \"email\", icon: Email },\r\n  { label: \"Phone\", value: \"phone\", icon: Phone },\r\n  { label: \"Currency\", value: \"currency\", icon: DollarCircle },\r\n  { label: \"Time\", value: \"time\", icon: Clock },\r\n  { label: \"Table\", value: \"table\", icon: Grid },\r\n  { label: \"Geolocation\", value: \"geoLocation\", icon: Location },\r\n  { label: \"Check Box\", value: \"checkbox\", icon: CheckboxSquare },\r\n  { label: \"Image Upload\", value: \"image\", icon: Image },\r\n  { label: \"Relation Field\", value: \"relation\", icon: LinkHorizontal },\r\n  { label: \"Info Card\", value: \"info\", icon: InfoCircle },\r\n  { label: \"Toggle Button\", value: \"toggleButton\", icon: ToggleSwitch },\r\n  { label: \"Radio Button\", value: \"radioButton\", icon: RadioButton },\r\n  { label: \"tagsInput\", value: \"tagsInput\", icon: Paragraph },\r\n];\r\n\r\nconst FieldSelect: React.FC<SelectProps> = (props) => {\r\n  const [selectFields, setSelectFields] = useState<IField[]>(fields);\r\n  const [search, setSearch] = useState<string>(\"\");\r\n\r\n  const handleSearch = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n    setSearch(event.target.value);\r\n  };\r\n\r\n  const handleSearchFields = (searchVal: string) => {\r\n    if (searchVal) {\r\n      setSelectFields([\r\n        ...fields.filter((field) => field.value.includes(searchVal)),\r\n      ]);\r\n    } else {\r\n      setSelectFields(fields);\r\n    }\r\n  };\r\n\r\n  useEffect(() => {\r\n    handleSearchFields(search);\r\n  }, [search]);\r\n\r\n  return (\r\n    <Select\r\n      fullWidth\r\n      placeholder=\"Select Field\"\r\n      size=\"small\"\r\n      labelName=\"Field Type\"\r\n      renderValue={(value: string) =>\r\n        fields.find((field) => field.value === value)?.label\r\n      }\r\n      handleSearch={() => handleSearch}\r\n      searchPlaceholder=\"Search Attributes\"\r\n      searchValue={search}\r\n      {...props}\r\n    >\r\n      {selectFields.map((field) => (\r\n        <MenuItem value={field.value} onKeyDown={(e) => e.stopPropagation()}>\r\n          <Stack direction=\"row\" spacing={1} alignItems=\"center\">\r\n            {field.icon && <field.icon fontSize=\"small\" />}\r\n            <Typography type=\"s3\" color=\"theme.secondary.1000\">\r\n              {field.label}\r\n            </Typography>\r\n          </Stack>\r\n        </MenuItem>\r\n      ))}\r\n    </Select>\r\n  );\r\n};\r\n\r\nexport default FieldSelect;\r\n"],"names":["fields","label","value","icon","Paragraph","Hashtag","ArrowCircleDown","Calendar","PaperClip","Link","Email","Phone","DollarCircle","Clock","Grid","Location","CheckboxSquare","Image","LinkHorizontal","InfoCircle","ToggleSwitch","RadioButton","props","selectFields","setSelectFields","useState","search","setSearch","handleSearch","event","target","useEffect","searchVal","filter","field","includes","jsx","Select","fullWidth","placeholder","size","labelName","renderValue","_a","find","searchPlaceholder","searchValue","children","map","MenuItem","onKeyDown","e","stopPropagation","jsxs","Stack","direction","spacing","alignItems","fontSize","Typography","type","color"],"mappings":"89CAoCA,MAAMA,EAAmB,CACvB,CAAEC,MAAO,OAAQC,MAAO,OAAQC,KAAMC,EAAAA,WACtC,CAAEH,MAAO,SAAUC,MAAO,SAAUC,KAAME,EAAAA,SAC1C,CAAEJ,MAAO,SAAUC,MAAO,SAAUC,KAAMG,EAAAA,iBAC1C,CAAEL,MAAO,OAAQC,MAAO,OAAQC,KAAMI,EAAAA,UACtC,CAAEN,MAAO,gBAAiBC,MAAO,OAAQC,KAAMK,EAAAA,WAC/C,CAAEP,MAAO,MAAOC,MAAO,MAAOC,KAAMM,EAAAA,MACpC,CAAER,MAAO,QAASC,MAAO,QAASC,KAAMO,EAAAA,OACxC,CAAET,MAAO,QAASC,MAAO,QAASC,KAAMQ,EAAAA,OACxC,CAAEV,MAAO,WAAYC,MAAO,WAAYC,KAAMS,EAAAA,cAC9C,CAAEX,MAAO,OAAQC,MAAO,OAAQC,KAAMU,EAAAA,OACtC,CAAEZ,MAAO,QAASC,MAAO,QAASC,KAAMW,EAAAA,MACxC,CAAEb,MAAO,cAAeC,MAAO,cAAeC,KAAMY,EAAAA,UACpD,CAAEd,MAAO,YAAaC,MAAO,WAAYC,KAAMa,EAAAA,gBAC/C,CAAEf,MAAO,eAAgBC,MAAO,QAASC,KAAMc,EAAAA,OAC/C,CAAEhB,MAAO,iBAAkBC,MAAO,WAAYC,KAAMe,EAAAA,gBACpD,CAAEjB,MAAO,YAAaC,MAAO,OAAQC,KAAMgB,EAAAA,YAC3C,CAAElB,MAAO,gBAAiBC,MAAO,eAAgBC,KAAMiB,EAAAA,cACvD,CAAEnB,MAAO,eAAgBC,MAAO,cAAeC,KAAMkB,EAAAA,aACrD,CAAEpB,MAAO,YAAaC,MAAO,YAAaC,KAAMC,EAAAA,4BAGNkB,IAC1C,MAAOC,EAAcC,GAAmBC,EAAAA,SAAmBzB,IACpD0B,EAAQC,GAAaF,EAAAA,SAAiB,IAEvCG,EAAgBC,IACpBF,EAAUE,EAAMC,OAAO5B,QAiBzB,OAJA6B,EAAAA,UAAU,KAViB,IAACC,EAExBR,GAFwBQ,EAWPN,GATD,IACX1B,EAAOiC,OAAQC,GAAUA,EAAMhC,MAAMiC,SAASH,KAGnChC,IAMjB,CAAC0B,mBAGFU,EAAAA,IAACC,EAAAA,OAAA,CACCC,WAAS,EACTC,YAAY,eACZC,KAAK,QACLC,UAAU,aACVC,YAAcxC,UACZ,OAAA,OAAAyC,EAAA3C,EAAO4C,KAAMV,GAAUA,EAAMhC,QAAUA,SAAvC,EAAAyC,EAA+C1C,OAEjD2B,aAAc,IAAMA,EACpBiB,kBAAkB,oBAClBC,YAAapB,KACTJ,EAEHyB,SAAAxB,EAAayB,IAAKd,wBAChBe,UAAA,CAAS/C,MAAOgC,EAAMhC,MAAOgD,UAAYC,GAAMA,EAAEC,kBAChDL,wBAAAM,EAAAA,KAACC,EAAAA,QAAA,CAAMC,UAAU,MAAMC,QAAS,EAAGC,WAAW,SAC3CV,SAAA,CAAAb,EAAM/B,qBAAQiC,MAACF,EAAM/B,KAAN,CAAWuD,SAAS;qBACnCC,EAAAA,WAAA,CAAWC,KAAK,KAAKC,MAAM,uBACzBd,WAAM9C"}

package/dist/views/form-builder/element-edit-forms/section/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/form-builder/element-edit-forms/section.tsx"],"sourcesContent":["// React imports\nimport { useEffect, useMemo, useState } from \"react\";\n\n// Material UI imports\nimport { MenuItem, Box, FormControlLabel } from \"@mui/material\";\nimport CloseIcon from \"@mui/icons-material/Close\";\nimport { Add } from \"@mui/icons-material\";\n\n// ERP Common imports\nimport Select from \"@/components/select/select\";\nimport Button from \"@/components/button/button\";\nimport Typography from \"@/components/typography/typography\";\nimport TextField from \"@/components/text-field/text-field\";\nimport Checkbox from \"@/components/checkbox/checkbox\";\nimport { generateRandomId } from \"@/utils/common\";\nimport { SECTION_TYPES } from \"@/utils/constant\";\n\n// Local imports\nimport { ISwitcherForms } from \"../field_properties\";\nimport \"../custom-form.scss\";\n\nconst SectionEditForm = (props: any) => {\n  const { handlePropertyValueUpdate } = props;\n  const [elementJSON, setElementJSON] = useState(props.element);\n  const [addForm, setAddForm] = useState<boolean>(false);\n  const [newForm, setNewForm] = useState<string>(\"\");\n  const selectOption = [\"section\"];\n\n  const isDuplicateFormName = useMemo(\n    () =>\n      elementJSON.switcher_forms?.map((ele: any) => ele.name).includes(newForm),\n    [elementJSON.switcher_forms, newForm]\n  );\n\n  useEffect(() => {\n    setElementJSON(props.element);\n  }, [props.element]);\n\n  return (\n    <Box className=\"formSection--FieldContainer\" key={elementJSON.id}>\n      <div>\n        <Select\n          key={elementJSON.id}\n          fullWidth\n          placeholder=\"Select Field\"\n          size=\"small\"\n          disabled\n          defaultValue={elementJSON.field_type}\n          label=\"Field Type\"\n          variant=\"outlined\"\n        >\n          {selectOption?.map((item) => (\n            <MenuItem value={item}>{item}</MenuItem>\n          ))}\n        </Select>\n      </div>\n      <div>\n        <Select\n          key={elementJSON.id}\n          fullWidth\n          placeholder=\"Select Field\"\n          size=\"small\"\n          name=\"section_type\"\n          defaultValue={elementJSON.section_type}\n          label=\"Section Type\"\n          variant=\"outlined\"\n          onChange={(e: any) => handlePropertyValueUpdate(e)}\n        >\n          {Object.values(SECTION_TYPES).map((type) => {\n            return (\n              <MenuItem key={type} value={type}>\n                {type}\n              </MenuItem>\n            );\n          })}\n        </Select>\n      </div>\n      <div>\n        <TextField\n          fullWidth\n          label=\"Label\"\n          is_required\n          key={elementJSON.id}\n          name=\"label\"\n          type=\"text\"\n          onChange={handlePropertyValueUpdate}\n          defaultValue={elementJSON.label}\n        />\n      </div>\n      <FormControlLabel\n        key={elementJSON.id}\n        name=\"is_accordion\"\n        control={<Checkbox />}\n        onChange={handlePropertyValueUpdate}\n        checked={elementJSON.is_accordion}\n        label=\"Is Accordion\"\n      />\n      {elementJSON.section_type === SECTION_TYPES.FORM_SWITCH_SECTION ? (\n        <div className=\"formSection--SubFieldContainer\">\n          <div>\n            <TextField\n              fullWidth\n              label=\"Form label\"\n              is_required\n              key={elementJSON.id}\n              name=\"form_switcher_label\"\n              type=\"text\"\n              onChange={handlePropertyValueUpdate}\n              defaultValue={elementJSON.form_switcher_label}\n            />\n          </div>\n          <div>\n            <Typography\n              type=\"s5\"\n              weight={\"medium\"}\n              color={\"theme.secondary.800\"}\n            >\n              Forms\n            </Typography>\n            {elementJSON?.switcher_forms?.map(\n              (ele: ISwitcherForms) => (\n                <div className=\"formSection--MultiOptions\" key={elementJSON.id}>\n                  <TextField\n                    fullWidth\n                    key={ele.id}\n                    value={ele.name}\n                    style={{ marginBottom: \"10px\" }}\n                    name=\"switcher_forms\"\n                    onChange={(e: any) => {\n                      const newVal = elementJSON.switcher_forms?.map(\n                        (formEle: ISwitcherForms) =>\n                          ele.id === formEle.id\n                            ? { ...formEle, name: e.target.value }\n                            : { ...formEle }\n                      );\n\n                      handlePropertyValueUpdate(e, newVal);\n                    }}\n                  />\n                  <CloseIcon\n                    style={{ fontSize: \"1rem\", color: \"#656669\" }}\n                    onClick={(e: any) => {\n                      const newVal = [...elementJSON.switcher_forms].filter(\n                        (item) => item.id !== ele.id\n                      );\n                      e.target.name = \"switcher_forms\";\n                      handlePropertyValueUpdate(e, newVal);\n                    }}\n                  />\n                </div>\n              )\n            )}\n          </div>\n          {addForm ? (\n            <div>\n              <div\n                className=\"formSection--MultiOptions formSection--FullWidth\"\n                key={elementJSON.id}\n              >\n                <div className=\"formSection--FullWidth\">\n                  <TextField\n                    fullWidth\n                    label=\"Form section name\"\n                    placeholder=\"Form section name\"\n                    is_required\n                    key={elementJSON.id}\n                    type=\"text\"\n                    value={newForm}\n                    error={isDuplicateFormName}\n                    helperText={\n                      isDuplicateFormName\n                        ? \"Form section name can not duplicate\"\n                        : \"\"\n                    }\n                    onChange={(e: any) => setNewForm(e.target.value)}\n                  />\n                </div>\n                <CloseIcon\n                  style={{ fontSize: \"1rem\", color: \"#656669\" }}\n                  onClick={() => {\n                    setAddForm(false);\n                    setNewForm(\"\");\n                  }}\n                />\n              </div>\n              <Button\n                onClick={(e: any) => {\n                  const { uniqueStringId: id } = generateRandomId();\n                  const newVal = [\n                    ...elementJSON.switcher_forms,\n                    { name: newForm, id },\n                  ];\n                  handlePropertyValueUpdate(e, newVal);\n                  setNewForm(\"\");\n                  setAddForm(false);\n                }}\n                name=\"switcher_forms\"\n                variant=\"text\"\n                className=\"formSection--Button\"\n                disabled={isDuplicateFormName || !newForm}\n                startIcon={<Add />}\n              >\n                Add\n              </Button>\n            </div>\n          ) : null}\n          {!addForm ? (\n            <Button\n              onClick={() => setAddForm(true)}\n              variant=\"text\"\n              className=\"formSection--Button\"\n              startIcon={<Add />}\n            >\n              Add forms\n            </Button>\n          ) : null}\n        </div>\n      ) : null}\n    </Box>\n  );\n};\n\nexport { SectionEditForm };\nexport default SectionEditForm;\n"],"names":["_a","CloseIcon"],"mappings":"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"}
+{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/form-builder/element-edit-forms/section.tsx"],"sourcesContent":["// React imports\r\nimport { useEffect, useMemo, useState } from \"react\";\r\n\r\n// Material UI imports\r\nimport { MenuItem, Box, FormControlLabel } from \"@mui/material\";\r\nimport CloseIcon from \"@mui/icons-material/Close\";\r\nimport { Add } from \"@mui/icons-material\";\r\n\r\n// ERP Common imports\r\nimport Select from \"@/components/select/select\";\r\nimport Button from \"@/components/button/button\";\r\nimport Typography from \"@/components/typography/typography\";\r\nimport TextField from \"@/components/text-field/text-field\";\r\nimport Checkbox from \"@/components/checkbox/checkbox\";\r\nimport { generateRandomId } from \"@/utils/common\";\r\nimport { SECTION_TYPES } from \"@/utils/constant\";\r\n\r\n// Local imports\r\nimport { ISwitcherForms } from \"../field_properties\";\r\nimport \"../custom-form.scss\";\r\n\r\nconst SectionEditForm = (props: any) => {\r\n  const { handlePropertyValueUpdate } = props;\r\n  const [elementJSON, setElementJSON] = useState(props.element);\r\n  const [addForm, setAddForm] = useState<boolean>(false);\r\n  const [newForm, setNewForm] = useState<string>(\"\");\r\n  const selectOption = [\"section\"];\r\n\r\n  const isDuplicateFormName = useMemo(\r\n    () =>\r\n      elementJSON.switcher_forms?.map((ele: any) => ele.name).includes(newForm),\r\n    [elementJSON.switcher_forms, newForm]\r\n  );\r\n\r\n  useEffect(() => {\r\n    setElementJSON(props.element);\r\n  }, [props.element]);\r\n\r\n  return (\r\n    <Box className=\"formSection--FieldContainer\" key={elementJSON.id}>\r\n      <div>\r\n        <Select\r\n          key={elementJSON.id}\r\n          fullWidth\r\n          placeholder=\"Select Field\"\r\n          size=\"small\"\r\n          disabled\r\n          defaultValue={elementJSON.field_type}\r\n          label=\"Field Type\"\r\n          variant=\"outlined\"\r\n        >\r\n          {selectOption?.map((item) => (\r\n            <MenuItem value={item}>{item}</MenuItem>\r\n          ))}\r\n        </Select>\r\n      </div>\r\n      <div>\r\n        <Select\r\n          key={elementJSON.id}\r\n          fullWidth\r\n          placeholder=\"Select Field\"\r\n          size=\"small\"\r\n          name=\"section_type\"\r\n          defaultValue={elementJSON.section_type}\r\n          label=\"Section Type\"\r\n          variant=\"outlined\"\r\n          onChange={(e: any) => handlePropertyValueUpdate(e)}\r\n        >\r\n          {Object.values(SECTION_TYPES).map((type) => {\r\n            return (\r\n              <MenuItem key={type} value={type}>\r\n                {type}\r\n              </MenuItem>\r\n            );\r\n          })}\r\n        </Select>\r\n      </div>\r\n      <div>\r\n        <TextField\r\n          fullWidth\r\n          label=\"Label\"\r\n          is_required\r\n          key={elementJSON.id}\r\n          name=\"label\"\r\n          type=\"text\"\r\n          onChange={handlePropertyValueUpdate}\r\n          defaultValue={elementJSON.label}\r\n        />\r\n      </div>\r\n      <FormControlLabel\r\n        key={elementJSON.id}\r\n        name=\"is_accordion\"\r\n        control={<Checkbox />}\r\n        onChange={handlePropertyValueUpdate}\r\n        checked={elementJSON.is_accordion}\r\n        label=\"Is Accordion\"\r\n      />\r\n      {elementJSON.section_type === SECTION_TYPES.FORM_SWITCH_SECTION ? (\r\n        <div className=\"formSection--SubFieldContainer\">\r\n          <div>\r\n            <TextField\r\n              fullWidth\r\n              label=\"Form label\"\r\n              is_required\r\n              key={elementJSON.id}\r\n              name=\"form_switcher_label\"\r\n              type=\"text\"\r\n              onChange={handlePropertyValueUpdate}\r\n              defaultValue={elementJSON.form_switcher_label}\r\n            />\r\n          </div>\r\n          <div>\r\n            <Typography\r\n              type=\"s5\"\r\n              weight={\"medium\"}\r\n              color={\"theme.secondary.800\"}\r\n            >\r\n              Forms\r\n            </Typography>\r\n            {elementJSON?.switcher_forms?.map(\r\n              (ele: ISwitcherForms) => (\r\n                <div className=\"formSection--MultiOptions\" key={elementJSON.id}>\r\n                  <TextField\r\n                    fullWidth\r\n                    key={ele.id}\r\n                    value={ele.name}\r\n                    style={{ marginBottom: \"10px\" }}\r\n                    name=\"switcher_forms\"\r\n                    onChange={(e: any) => {\r\n                      const newVal = elementJSON.switcher_forms?.map(\r\n                        (formEle: ISwitcherForms) =>\r\n                          ele.id === formEle.id\r\n                            ? { ...formEle, name: e.target.value }\r\n                            : { ...formEle }\r\n                      );\r\n\r\n                      handlePropertyValueUpdate(e, newVal);\r\n                    }}\r\n                  />\r\n                  <CloseIcon\r\n                    style={{ fontSize: \"1rem\", color: \"#656669\" }}\r\n                    onClick={(e: any) => {\r\n                      const newVal = [...elementJSON.switcher_forms].filter(\r\n                        (item) => item.id !== ele.id\r\n                      );\r\n                      e.target.name = \"switcher_forms\";\r\n                      handlePropertyValueUpdate(e, newVal);\r\n                    }}\r\n                  />\r\n                </div>\r\n              )\r\n            )}\r\n          </div>\r\n          {addForm ? (\r\n            <div>\r\n              <div\r\n                className=\"formSection--MultiOptions formSection--FullWidth\"\r\n                key={elementJSON.id}\r\n              >\r\n                <div className=\"formSection--FullWidth\">\r\n                  <TextField\r\n                    fullWidth\r\n                    label=\"Form section name\"\r\n                    placeholder=\"Form section name\"\r\n                    is_required\r\n                    key={elementJSON.id}\r\n                    type=\"text\"\r\n                    value={newForm}\r\n                    error={isDuplicateFormName}\r\n                    helperText={\r\n                      isDuplicateFormName\r\n                        ? \"Form section name can not duplicate\"\r\n                        : \"\"\r\n                    }\r\n                    onChange={(e: any) => setNewForm(e.target.value)}\r\n                  />\r\n                </div>\r\n                <CloseIcon\r\n                  style={{ fontSize: \"1rem\", color: \"#656669\" }}\r\n                  onClick={() => {\r\n                    setAddForm(false);\r\n                    setNewForm(\"\");\r\n                  }}\r\n                />\r\n              </div>\r\n              <Button\r\n                onClick={(e: any) => {\r\n                  const { uniqueStringId: id } = generateRandomId();\r\n                  const newVal = [\r\n                    ...elementJSON.switcher_forms,\r\n                    { name: newForm, id },\r\n                  ];\r\n                  handlePropertyValueUpdate(e, newVal);\r\n                  setNewForm(\"\");\r\n                  setAddForm(false);\r\n                }}\r\n                name=\"switcher_forms\"\r\n                variant=\"text\"\r\n                className=\"formSection--Button\"\r\n                disabled={isDuplicateFormName || !newForm}\r\n                startIcon={<Add />}\r\n              >\r\n                Add\r\n              </Button>\r\n            </div>\r\n          ) : null}\r\n          {!addForm ? (\r\n            <Button\r\n              onClick={() => setAddForm(true)}\r\n              variant=\"text\"\r\n              className=\"formSection--Button\"\r\n              startIcon={<Add />}\r\n            >\r\n              Add forms\r\n            </Button>\r\n          ) : null}\r\n        </div>\r\n      ) : null}\r\n    </Box>\r\n  );\r\n};\r\n\r\nexport { SectionEditForm };\nexport default SectionEditForm;\r\n"],"names":["_a","CloseIcon"],"mappings":"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"}

package/dist/views/form-builder/element-edit-forms/section/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/views/form-builder/element-edit-forms/section.tsx"],"sourcesContent":["// React imports\nimport { useEffect, useMemo, useState } from \"react\";\n\n// Material UI imports\nimport { MenuItem, Box, FormControlLabel } from \"@mui/material\";\nimport CloseIcon from \"@mui/icons-material/Close\";\nimport { Add } from \"@mui/icons-material\";\n\n// ERP Common imports\nimport Select from \"@/components/select/select\";\nimport Button from \"@/components/button/button\";\nimport Typography from \"@/components/typography/typography\";\nimport TextField from \"@/components/text-field/text-field\";\nimport Checkbox from \"@/components/checkbox/checkbox\";\nimport { generateRandomId } from \"@/utils/common\";\nimport { SECTION_TYPES } from \"@/utils/constant\";\n\n// Local imports\nimport { ISwitcherForms } from \"../field_properties\";\nimport \"../custom-form.scss\";\n\nconst SectionEditForm = (props: any) => {\n  const { handlePropertyValueUpdate } = props;\n  const [elementJSON, setElementJSON] = useState(props.element);\n  const [addForm, setAddForm] = useState<boolean>(false);\n  const [newForm, setNewForm] = useState<string>(\"\");\n  const selectOption = [\"section\"];\n\n  const isDuplicateFormName = useMemo(\n    () =>\n      elementJSON.switcher_forms?.map((ele: any) => ele.name).includes(newForm),\n    [elementJSON.switcher_forms, newForm]\n  );\n\n  useEffect(() => {\n    setElementJSON(props.element);\n  }, [props.element]);\n\n  return (\n    <Box className=\"formSection--FieldContainer\" key={elementJSON.id}>\n      <div>\n        <Select\n          key={elementJSON.id}\n          fullWidth\n          placeholder=\"Select Field\"\n          size=\"small\"\n          disabled\n          defaultValue={elementJSON.field_type}\n          label=\"Field Type\"\n          variant=\"outlined\"\n        >\n          {selectOption?.map((item) => (\n            <MenuItem value={item}>{item}</MenuItem>\n          ))}\n        </Select>\n      </div>\n      <div>\n        <Select\n          key={elementJSON.id}\n          fullWidth\n          placeholder=\"Select Field\"\n          size=\"small\"\n          name=\"section_type\"\n          defaultValue={elementJSON.section_type}\n          label=\"Section Type\"\n          variant=\"outlined\"\n          onChange={(e: any) => handlePropertyValueUpdate(e)}\n        >\n          {Object.values(SECTION_TYPES).map((type) => {\n            return (\n              <MenuItem key={type} value={type}>\n                {type}\n              </MenuItem>\n            );\n          })}\n        </Select>\n      </div>\n      <div>\n        <TextField\n          fullWidth\n          label=\"Label\"\n          is_required\n          key={elementJSON.id}\n          name=\"label\"\n          type=\"text\"\n          onChange={handlePropertyValueUpdate}\n          defaultValue={elementJSON.label}\n        />\n      </div>\n      <FormControlLabel\n        key={elementJSON.id}\n        name=\"is_accordion\"\n        control={<Checkbox />}\n        onChange={handlePropertyValueUpdate}\n        checked={elementJSON.is_accordion}\n        label=\"Is Accordion\"\n      />\n      {elementJSON.section_type === SECTION_TYPES.FORM_SWITCH_SECTION ? (\n        <div className=\"formSection--SubFieldContainer\">\n          <div>\n            <TextField\n              fullWidth\n              label=\"Form label\"\n              is_required\n              key={elementJSON.id}\n              name=\"form_switcher_label\"\n              type=\"text\"\n              onChange={handlePropertyValueUpdate}\n              defaultValue={elementJSON.form_switcher_label}\n            />\n          </div>\n          <div>\n            <Typography\n              type=\"s5\"\n              weight={\"medium\"}\n              color={\"theme.secondary.800\"}\n            >\n              Forms\n            </Typography>\n            {elementJSON?.switcher_forms?.map(\n              (ele: ISwitcherForms) => (\n                <div className=\"formSection--MultiOptions\" key={elementJSON.id}>\n                  <TextField\n                    fullWidth\n                    key={ele.id}\n                    value={ele.name}\n                    style={{ marginBottom: \"10px\" }}\n                    name=\"switcher_forms\"\n                    onChange={(e: any) => {\n                      const newVal = elementJSON.switcher_forms?.map(\n                        (formEle: ISwitcherForms) =>\n                          ele.id === formEle.id\n                            ? { ...formEle, name: e.target.value }\n                            : { ...formEle }\n                      );\n\n                      handlePropertyValueUpdate(e, newVal);\n                    }}\n                  />\n                  <CloseIcon\n                    style={{ fontSize: \"1rem\", color: \"#656669\" }}\n                    onClick={(e: any) => {\n                      const newVal = [...elementJSON.switcher_forms].filter(\n                        (item) => item.id !== ele.id\n                      );\n                      e.target.name = \"switcher_forms\";\n                      handlePropertyValueUpdate(e, newVal);\n                    }}\n                  />\n                </div>\n              )\n            )}\n          </div>\n          {addForm ? (\n            <div>\n              <div\n                className=\"formSection--MultiOptions formSection--FullWidth\"\n                key={elementJSON.id}\n              >\n                <div className=\"formSection--FullWidth\">\n                  <TextField\n                    fullWidth\n                    label=\"Form section name\"\n                    placeholder=\"Form section name\"\n                    is_required\n                    key={elementJSON.id}\n                    type=\"text\"\n                    value={newForm}\n                    error={isDuplicateFormName}\n                    helperText={\n                      isDuplicateFormName\n                        ? \"Form section name can not duplicate\"\n                        : \"\"\n                    }\n                    onChange={(e: any) => setNewForm(e.target.value)}\n                  />\n                </div>\n                <CloseIcon\n                  style={{ fontSize: \"1rem\", color: \"#656669\" }}\n                  onClick={() => {\n                    setAddForm(false);\n                    setNewForm(\"\");\n                  }}\n                />\n              </div>\n              <Button\n                onClick={(e: any) => {\n                  const { uniqueStringId: id } = generateRandomId();\n                  const newVal = [\n                    ...elementJSON.switcher_forms,\n                    { name: newForm, id },\n                  ];\n                  handlePropertyValueUpdate(e, newVal);\n                  setNewForm(\"\");\n                  setAddForm(false);\n                }}\n                name=\"switcher_forms\"\n                variant=\"text\"\n                className=\"formSection--Button\"\n                disabled={isDuplicateFormName || !newForm}\n                startIcon={<Add />}\n              >\n                Add\n              </Button>\n            </div>\n          ) : null}\n          {!addForm ? (\n            <Button\n              onClick={() => setAddForm(true)}\n              variant=\"text\"\n              className=\"formSection--Button\"\n              startIcon={<Add />}\n            >\n              Add forms\n            </Button>\n          ) : null}\n        </div>\n      ) : null}\n    </Box>\n  );\n};\n\nexport { SectionEditForm };\nexport default SectionEditForm;\n"],"names":["SectionEditForm","props","handlePropertyValueUpdate","elementJSON","setElementJSON","useState","element","addForm","setAddForm","newForm","setNewForm","selectOption","isDuplicateFormName","useMemo","_a","switcher_forms","map","ele","name","includes","useEffect","jsxs","Box","className","children","jsx","Select","fullWidth","placeholder","size","disabled","defaultValue","field_type","label","variant","item","MenuItem","value","id","section_type","onChange","e","values","SECTION_TYPES","type","TextField","is_required","FormControlLabel","control","Checkbox","checked","is_accordion","FORM_SWITCH_SECTION","form_switcher_label","Typography","weight","color","style","marginBottom","newVal","formEle","target","CloseIcon","fontSize","onClick","filter","error","helperText","Button","uniqueStringId","generateRandomId","startIcon","Add"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/views/form-builder/element-edit-forms/section.tsx"],"sourcesContent":["// React imports\r\nimport { useEffect, useMemo, useState } from \"react\";\r\n\r\n// Material UI imports\r\nimport { MenuItem, Box, FormControlLabel } from \"@mui/material\";\r\nimport CloseIcon from \"@mui/icons-material/Close\";\r\nimport { Add } from \"@mui/icons-material\";\r\n\r\n// ERP Common imports\r\nimport Select from \"@/components/select/select\";\r\nimport Button from \"@/components/button/button\";\r\nimport Typography from \"@/components/typography/typography\";\r\nimport TextField from \"@/components/text-field/text-field\";\r\nimport Checkbox from \"@/components/checkbox/checkbox\";\r\nimport { generateRandomId } from \"@/utils/common\";\r\nimport { SECTION_TYPES } from \"@/utils/constant\";\r\n\r\n// Local imports\r\nimport { ISwitcherForms } from \"../field_properties\";\r\nimport \"../custom-form.scss\";\r\n\r\nconst SectionEditForm = (props: any) => {\r\n  const { handlePropertyValueUpdate } = props;\r\n  const [elementJSON, setElementJSON] = useState(props.element);\r\n  const [addForm, setAddForm] = useState<boolean>(false);\r\n  const [newForm, setNewForm] = useState<string>(\"\");\r\n  const selectOption = [\"section\"];\r\n\r\n  const isDuplicateFormName = useMemo(\r\n    () =>\r\n      elementJSON.switcher_forms?.map((ele: any) => ele.name).includes(newForm),\r\n    [elementJSON.switcher_forms, newForm]\r\n  );\r\n\r\n  useEffect(() => {\r\n    setElementJSON(props.element);\r\n  }, [props.element]);\r\n\r\n  return (\r\n    <Box className=\"formSection--FieldContainer\" key={elementJSON.id}>\r\n      <div>\r\n        <Select\r\n          key={elementJSON.id}\r\n          fullWidth\r\n          placeholder=\"Select Field\"\r\n          size=\"small\"\r\n          disabled\r\n          defaultValue={elementJSON.field_type}\r\n          label=\"Field Type\"\r\n          variant=\"outlined\"\r\n        >\r\n          {selectOption?.map((item) => (\r\n            <MenuItem value={item}>{item}</MenuItem>\r\n          ))}\r\n        </Select>\r\n      </div>\r\n      <div>\r\n        <Select\r\n          key={elementJSON.id}\r\n          fullWidth\r\n          placeholder=\"Select Field\"\r\n          size=\"small\"\r\n          name=\"section_type\"\r\n          defaultValue={elementJSON.section_type}\r\n          label=\"Section Type\"\r\n          variant=\"outlined\"\r\n          onChange={(e: any) => handlePropertyValueUpdate(e)}\r\n        >\r\n          {Object.values(SECTION_TYPES).map((type) => {\r\n            return (\r\n              <MenuItem key={type} value={type}>\r\n                {type}\r\n              </MenuItem>\r\n            );\r\n          })}\r\n        </Select>\r\n      </div>\r\n      <div>\r\n        <TextField\r\n          fullWidth\r\n          label=\"Label\"\r\n          is_required\r\n          key={elementJSON.id}\r\n          name=\"label\"\r\n          type=\"text\"\r\n          onChange={handlePropertyValueUpdate}\r\n          defaultValue={elementJSON.label}\r\n        />\r\n      </div>\r\n      <FormControlLabel\r\n        key={elementJSON.id}\r\n        name=\"is_accordion\"\r\n        control={<Checkbox />}\r\n        onChange={handlePropertyValueUpdate}\r\n        checked={elementJSON.is_accordion}\r\n        label=\"Is Accordion\"\r\n      />\r\n      {elementJSON.section_type === SECTION_TYPES.FORM_SWITCH_SECTION ? (\r\n        <div className=\"formSection--SubFieldContainer\">\r\n          <div>\r\n            <TextField\r\n              fullWidth\r\n              label=\"Form label\"\r\n              is_required\r\n              key={elementJSON.id}\r\n              name=\"form_switcher_label\"\r\n              type=\"text\"\r\n              onChange={handlePropertyValueUpdate}\r\n              defaultValue={elementJSON.form_switcher_label}\r\n            />\r\n          </div>\r\n          <div>\r\n            <Typography\r\n              type=\"s5\"\r\n              weight={\"medium\"}\r\n              color={\"theme.secondary.800\"}\r\n            >\r\n              Forms\r\n            </Typography>\r\n            {elementJSON?.switcher_forms?.map(\r\n              (ele: ISwitcherForms) => (\r\n                <div className=\"formSection--MultiOptions\" key={elementJSON.id}>\r\n                  <TextField\r\n                    fullWidth\r\n                    key={ele.id}\r\n                    value={ele.name}\r\n                    style={{ marginBottom: \"10px\" }}\r\n                    name=\"switcher_forms\"\r\n                    onChange={(e: any) => {\r\n                      const newVal = elementJSON.switcher_forms?.map(\r\n                        (formEle: ISwitcherForms) =>\r\n                          ele.id === formEle.id\r\n                            ? { ...formEle, name: e.target.value }\r\n                            : { ...formEle }\r\n                      );\r\n\r\n                      handlePropertyValueUpdate(e, newVal);\r\n                    }}\r\n                  />\r\n                  <CloseIcon\r\n                    style={{ fontSize: \"1rem\", color: \"#656669\" }}\r\n                    onClick={(e: any) => {\r\n                      const newVal = [...elementJSON.switcher_forms].filter(\r\n                        (item) => item.id !== ele.id\r\n                      );\r\n                      e.target.name = \"switcher_forms\";\r\n                      handlePropertyValueUpdate(e, newVal);\r\n                    }}\r\n                  />\r\n                </div>\r\n              )\r\n            )}\r\n          </div>\r\n          {addForm ? (\r\n            <div>\r\n              <div\r\n                className=\"formSection--MultiOptions formSection--FullWidth\"\r\n                key={elementJSON.id}\r\n              >\r\n                <div className=\"formSection--FullWidth\">\r\n                  <TextField\r\n                    fullWidth\r\n                    label=\"Form section name\"\r\n                    placeholder=\"Form section name\"\r\n                    is_required\r\n                    key={elementJSON.id}\r\n                    type=\"text\"\r\n                    value={newForm}\r\n                    error={isDuplicateFormName}\r\n                    helperText={\r\n                      isDuplicateFormName\r\n                        ? \"Form section name can not duplicate\"\r\n                        : \"\"\r\n                    }\r\n                    onChange={(e: any) => setNewForm(e.target.value)}\r\n                  />\r\n                </div>\r\n                <CloseIcon\r\n                  style={{ fontSize: \"1rem\", color: \"#656669\" }}\r\n                  onClick={() => {\r\n                    setAddForm(false);\r\n                    setNewForm(\"\");\r\n                  }}\r\n                />\r\n              </div>\r\n              <Button\r\n                onClick={(e: any) => {\r\n                  const { uniqueStringId: id } = generateRandomId();\r\n                  const newVal = [\r\n                    ...elementJSON.switcher_forms,\r\n                    { name: newForm, id },\r\n                  ];\r\n                  handlePropertyValueUpdate(e, newVal);\r\n                  setNewForm(\"\");\r\n                  setAddForm(false);\r\n                }}\r\n                name=\"switcher_forms\"\r\n                variant=\"text\"\r\n                className=\"formSection--Button\"\r\n                disabled={isDuplicateFormName || !newForm}\r\n                startIcon={<Add />}\r\n              >\r\n                Add\r\n              </Button>\r\n            </div>\r\n          ) : null}\r\n          {!addForm ? (\r\n            <Button\r\n              onClick={() => setAddForm(true)}\r\n              variant=\"text\"\r\n              className=\"formSection--Button\"\r\n              startIcon={<Add />}\r\n            >\r\n              Add forms\r\n            </Button>\r\n          ) : null}\r\n        </div>\r\n      ) : null}\r\n    </Box>\r\n  );\r\n};\r\n\r\nexport { SectionEditForm };\nexport default SectionEditForm;\r\n"],"names":["SectionEditForm","props","handlePropertyValueUpdate","elementJSON","setElementJSON","useState","element","addForm","setAddForm","newForm","setNewForm","selectOption","isDuplicateFormName","useMemo","_a","switcher_forms","map","ele","name","includes","useEffect","jsxs","Box","className","children","jsx","Select","fullWidth","placeholder","size","disabled","defaultValue","field_type","label","variant","item","MenuItem","value","id","section_type","onChange","e","values","SECTION_TYPES","type","TextField","is_required","FormControlLabel","control","Checkbox","checked","is_accordion","FORM_SWITCH_SECTION","form_switcher_label","Typography","weight","color","style","marginBottom","newVal","formEle","target","CloseIcon","fontSize","onClick","filter","error","helperText","Button","uniqueStringId","generateRandomId","startIcon","Add"],"mappings":"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"}

package/dist/views/form-builder/element-edit-forms/select/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/form-builder/element-edit-forms/select.tsx"],"sourcesContent":["// React imports\nimport React, { useEffect, useState, useCallback, useMemo } from \"react\";\n\n// Material UI imports\nimport { \n  MenuItem, \n  Box, \n  FormControlLabel, \n  Slider, \n  FormControl, \n  IconButton\n} from \"@mui/material\";\nimport { Add } from \"@mui/icons-material\";\n\n// Third-party imports\nimport { enqueueSnackbar } from \"notistack\";\n\n// ERP Common imports\nimport Checkbox from \"@/components/checkbox/checkbox\";\nimport Select from \"@/components/select/select\";\nimport TextField from \"@/components/text-field/text-field\";\nimport Typography from \"@/components/typography/typography\";\nimport Button from \"@/components/button/button\";\nimport { Trash } from \"@/components/icons\";\n\n// Local imports\nimport FieldSelect from \"./field-select\";\nimport \"../custom-form.scss\";\n\ninterface Option {\n  label: string;\n  value: string;\n  [key: string]: string;\n}\n\ninterface ElementJSON {\n  id: string;\n  field_type: string;\n  label: string;\n  placeholder: string;\n  default_value: string | null;\n  is_multiselect: boolean;\n  is_required: boolean;\n  is_unique: boolean;\n  is_fullwidth: boolean;\n  custom_width: number;\n  type?: string;\n  is_new?: boolean;\n  options: Option[];\n}\n\ninterface SelectEditFormProps {\n  element: ElementJSON;\n  handlePropertyValueUpdate: (\n    event: React.ChangeEvent<HTMLInputElement> | null,\n    name?: string | null,\n    value?: any,\n    fieldType?: string\n  ) => void;\n  handleSelectOptionValueUpdate: (options: Option[]) => void;\n  handleColumnSelect: (event: React.ChangeEvent<{ value: unknown }>) => void;\n  handleWidthChange: (value: number | number[]) => void;\n}\n\nconst COLUMN_PER_ROW_OPTIONS = [1, 2, 3, 4, 5, 6] as const;\n\nexport const SelectEditForm: React.FC<SelectEditFormProps> = React.memo(({\n  element,\n  handlePropertyValueUpdate,\n  handleSelectOptionValueUpdate,\n  handleColumnSelect,\n  handleWidthChange\n}) => {\n  // Local state management\n  const [selectOptions, setSelectOptions] = useState<Option[]>(element.options || []);\n  const [newOption, setNewOption] = useState<Option>({ label: \"\", value: \"\" });\n  const [isAddingOption, setIsAddingOption] = useState(false);\n\n  // Sync options with parent element when element changes\n  useEffect(() => {\n    if (JSON.stringify(selectOptions) !== JSON.stringify(element.options || [])) {\n      setSelectOptions(element.options || []);\n    }\n  }, [element.options, selectOptions]);\n\n  // Memoized computed values\n  const isFieldDisabled = useMemo(() => \n    element.type === \"system\" || !element.is_new, \n    [element.type, element.is_new]\n  );\n\n  const selectedOptionLabel = useMemo(() => {\n    const selectedOption = selectOptions.find(option => option.value === element.default_value);\n    return selectedOption?.label || \"Select Default\";\n  }, [selectOptions, element.default_value]);\n\n  // Optimized event handlers with useCallback\n  const handleFieldUpdate = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\n    handlePropertyValueUpdate(null, null, null, e.target.value);\n  }, [handlePropertyValueUpdate]);\n\n  const handleSelectUpdate = useCallback((e: React.ChangeEvent<{ value: unknown }>) => {\n    handlePropertyValueUpdate(null, null, e.target.value);\n  }, [handlePropertyValueUpdate]);\n\n  const handleMultiSelect = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\n    const isChecked = e.target.checked;\n    // Reset default value when enabling multiselect\n    const defaultValue = isChecked ? null : element.default_value;\n    \n    // Create a synthetic event for the property update\n    const syntheticEvent = {\n      target: {\n        name: 'is_multiselect',\n        checked: isChecked,\n        value: isChecked\n      }\n    } as React.ChangeEvent<HTMLInputElement>;\n    \n    handlePropertyValueUpdate(syntheticEvent);\n    \n    // If enabling multiselect, also clear the default value\n    if (isChecked && element.default_value) {\n      handlePropertyValueUpdate(null, 'default_value', null);\n    }\n  }, [handlePropertyValueUpdate, element.default_value]);\n\n  const handleNewOptionChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\n    const { name, value } = e.target;\n    setNewOption(prev => ({ ...prev, [name]: value }));\n  }, []);\n\n  const handleAddOption = useCallback(() => {\n    if (!newOption.label.trim() || !newOption.value.trim()) {\n      return; // Don't add empty options\n    }\n\n    // Check for duplicate values\n    const isDuplicate = selectOptions.some(option => \n      option.value === newOption.value || option.label === newOption.label\n    );\n    \n    if (isDuplicate) {\n      // Could show an error message here\n      enqueueSnackbar(\"Option with this value or label already exists.\", { variant: \"error\" });\n      return;\n    }\n\n    const updatedOptions = [...selectOptions, { ...newOption }];\n    setSelectOptions(updatedOptions);\n    handleSelectOptionValueUpdate(updatedOptions);\n    \n    // Reset form\n    setNewOption({ label: \"\", value: \"\" });\n    setIsAddingOption(false);\n  }, [newOption, selectOptions, handleSelectOptionValueUpdate]);\n\n  const handleRemoveOption = useCallback((indexToRemove: number) => {\n    const updatedOptions = selectOptions.filter((_, index) => index !== indexToRemove);\n    setSelectOptions(updatedOptions);\n    handleSelectOptionValueUpdate(updatedOptions);\n    \n    // Clear default value if the removed option was selected\n    const removedOption = selectOptions[indexToRemove];\n    if (element.default_value === removedOption?.value) {\n      handlePropertyValueUpdate(null, 'default_value', null);\n    }\n  }, [selectOptions, handleSelectOptionValueUpdate, element.default_value, handlePropertyValueUpdate]);\n\n  const handleWidthChangeCallback = useCallback((\n    _: Event, \n    newValue: number | number[]\n  ) => {\n    handleWidthChange(newValue);\n  }, [handleWidthChange]);\n\n  return (\n    <Box className=\"formSection--FieldContainer\">\n      {/* Field Type Selection */}\n      <Box>\n        <FieldSelect\n          variant=\"outlined\"\n          onChange={handleFieldUpdate}\n          defaultValue={element.field_type}\n          label=\"Field Type\"\n          disabled={isFieldDisabled}\n        />\n      </Box>\n\n      {/* Label Field */}\n      <Box>\n        <TextField\n          fullWidth\n          label=\"Label\"\n          is_required\n          name=\"label\"\n          type=\"text\"\n          onChange={handlePropertyValueUpdate}\n          defaultValue={element.label}\n        />\n      </Box>\n\n      {/* Placeholder Field */}\n      <Box>\n        <TextField\n          fullWidth\n          label=\"Placeholder\"\n          is_required\n          name=\"placeholder\"\n          type=\"text\"\n          onChange={handlePropertyValueUpdate}\n          defaultValue={element.placeholder}\n        />\n      </Box>\n\n      {/* Default Value Selection */}\n      <Box>\n        <Select\n          fullWidth\n          placeholder=\"Select Default\"\n          size=\"small\"\n          name=\"default_value\"\n          onChange={handleSelectUpdate}\n          value={element.default_value || \"\"}\n          label=\"Default\"\n          variant=\"outlined\"\n          disabled={element.is_multiselect}\n          renderValue={() => selectedOptionLabel}\n        >\n          {selectOptions.map((option, index) => (\n            <MenuItem key={`${option.value}-${index}`} value={option.value}>\n              {option.label}\n            </MenuItem>\n          ))}\n        </Select>\n      </Box>\n\n      {/* Column Per Row Selection */}\n      <Box>\n        <FormControl fullWidth>\n          <Select\n            fullWidth\n            placeholder=\"Select Column Per Row\"\n            size=\"small\"\n            onChange={handleColumnSelect}\n            label=\"Select Column Per Row\"\n            name=\"columnPerRow\"\n            variant=\"outlined\"\n          >\n            {COLUMN_PER_ROW_OPTIONS.map((option) => (\n              <MenuItem key={option} value={option}>\n                {option}\n              </MenuItem>\n            ))}\n          </Select>\n        </FormControl>\n      </Box>\n\n      {/* Width Slider */}\n      <Box>\n        <Typography sx={{ color: 'black', mb: 1 }}>\n          Adjust Width:\n        </Typography>\n        <Box pr={2}>\n          <Slider\n            value={element.custom_width || 6}\n            min={1}\n            max={12}\n            step={1}\n            onChange={handleWidthChangeCallback}\n            aria-labelledby=\"width-slider\"\n            sx={{ color: \"#4AC08C\" }}\n            marks\n            valueLabelDisplay=\"auto\"\n          />\n        </Box>\n      </Box>\n\n      {/* Options Management */}\n      <Box className=\"formSection--SelectOption\">\n        <Typography \n          type=\"s5\" \n          weight=\"medium\" \n          color=\"theme.secondary.800\"\n          sx={{ mb: 0.5 }}\n        >\n          Options\n        </Typography>\n        \n        {/* Existing Options */}\n        {selectOptions.map((option, index) => (\n          <Box key={`option-${index}`} sx={{ mb: 1, display: 'flex', gap: 1 }}>\n            <TextField\n              fullWidth\n              value={`${option.label} (${option.value})`}\n              InputProps={{ readOnly: true }}\n            />\n            <IconButton\n              color=\"error\"\n              size=\"small\"\n              onClick={() => handleRemoveOption(index)}\n            >\n              <Trash />\n            </IconButton>\n          </Box>\n        ))}\n\n        {/* Add New Option Form */}\n        {isAddingOption && (\n          <Box className=\"formSection--SelectOption\" sx={{ mt:0.5, p: 2, border: '1px solid #ddd', borderRadius: 1 }}>\n            <Box sx={{ mb: 2 }}>\n              <TextField\n                fullWidth\n                label=\"Option Label\"\n                is_required\n                name=\"label\"\n                type=\"text\"\n                placeholder=\"Enter option label\"\n                value={newOption.label}\n                onChange={handleNewOptionChange}\n              />\n            </Box>\n            <Box sx={{ mb: 2 }}>\n              <TextField\n                fullWidth\n                label=\"Option Value\"\n                placeholder=\"Enter option value\"\n                is_required\n                name=\"value\"\n                type=\"text\"\n                value={newOption.value}\n                onChange={handleNewOptionChange}\n              />\n            </Box>\n            <Box sx={{ display: 'flex', gap: 1 }}>\n              <Button\n                onClick={handleAddOption}\n                // className=\"formSection--Button\"\n                startIcon={<Add />}\n                disabled={!newOption.label.trim() || !newOption.value.trim()}\n              >\n                Add Option\n              </Button>\n              <Button\n                onClick={() => {\n                  setIsAddingOption(false);\n                  setNewOption({ label: \"\", value: \"\" });\n                }}\n                variant=\"outlined\"\n              >\n                Cancel\n              </Button>\n            </Box>\n          </Box>\n        )}\n\n        {/* Add Option Button */}\n        {!isAddingOption && (\n          <Button\n            onClick={() => setIsAddingOption(true)}\n            variant=\"outlined\"\n            className=\"formSection--Button\"\n            startIcon={<Add />}\n            sx={{ mt: 1 }}\n          >\n            Add Option\n          </Button>\n        )}\n      </Box>\n\n      {/* Form Controls */}\n      <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1 }}>\n        <FormControlLabel\n          name=\"is_multiselect\"\n          control={<Checkbox />}\n          onChange={handleMultiSelect}\n          checked={element.is_multiselect}\n          label=\"Enable Multi Select\"\n        />\n\n        <FormControlLabel\n          name=\"is_required\"\n          control={<Checkbox />}\n          onChange={handlePropertyValueUpdate}\n          checked={element.is_required}\n          label=\"This field is required\"\n        />\n\n        <FormControlLabel\n          name=\"is_unique\"\n          control={<Checkbox />}\n          onChange={handlePropertyValueUpdate}\n          checked={element.is_unique}\n          label=\"Is Unique\"\n        />\n\n        <FormControlLabel\n          name=\"is_fullwidth\"\n          control={<Checkbox />}\n          onChange={handlePropertyValueUpdate}\n          checked={element.is_fullwidth}\n          label=\"Full Width\"\n        />\n      </Box>\n    </Box>\n  );\n});\n\nSelectEditForm.displayName = 'SelectEditForm';\n\nexport default SelectEditForm;"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/form-builder/element-edit-forms/select.tsx"],"sourcesContent":["// React imports\r\nimport React, { useEffect, useState, useCallback, useMemo } from \"react\";\r\n\r\n// Material UI imports\r\nimport { \r\n  MenuItem, \r\n  Box, \r\n  FormControlLabel, \r\n  Slider, \r\n  FormControl, \r\n  IconButton\r\n} from \"@mui/material\";\r\nimport { Add } from \"@mui/icons-material\";\r\n\r\n// Third-party imports\r\nimport { enqueueSnackbar } from \"notistack\";\r\n\r\n// ERP Common imports\r\nimport Checkbox from \"@/components/checkbox/checkbox\";\r\nimport Select from \"@/components/select/select\";\r\nimport TextField from \"@/components/text-field/text-field\";\r\nimport Typography from \"@/components/typography/typography\";\r\nimport Button from \"@/components/button/button\";\r\nimport { Trash } from \"@/components/icons\";\r\n\r\n// Local imports\r\nimport FieldSelect from \"./field-select\";\r\nimport \"../custom-form.scss\";\r\n\r\ninterface Option {\r\n  label: string;\r\n  value: string;\r\n  [key: string]: string;\r\n}\r\n\r\ninterface ElementJSON {\r\n  id: string;\r\n  field_type: string;\r\n  label: string;\r\n  placeholder: string;\r\n  default_value: string | null;\r\n  is_multiselect: boolean;\r\n  is_required: boolean;\r\n  is_unique: boolean;\r\n  is_fullwidth: boolean;\r\n  custom_width: number;\r\n  type?: string;\r\n  is_new?: boolean;\r\n  options: Option[];\r\n}\r\n\r\ninterface SelectEditFormProps {\r\n  element: ElementJSON;\r\n  handlePropertyValueUpdate: (\r\n    event: React.ChangeEvent<HTMLInputElement> | null,\r\n    name?: string | null,\r\n    value?: any,\r\n    fieldType?: string\r\n  ) => void;\r\n  handleSelectOptionValueUpdate: (options: Option[]) => void;\r\n  handleColumnSelect: (event: React.ChangeEvent<{ value: unknown }>) => void;\r\n  handleWidthChange: (value: number | number[]) => void;\r\n}\r\n\r\nconst COLUMN_PER_ROW_OPTIONS = [1, 2, 3, 4, 5, 6] as const;\r\n\r\nexport const SelectEditForm: React.FC<SelectEditFormProps> = React.memo(({\r\n  element,\r\n  handlePropertyValueUpdate,\r\n  handleSelectOptionValueUpdate,\r\n  handleColumnSelect,\r\n  handleWidthChange\r\n}) => {\r\n  // Local state management\r\n  const [selectOptions, setSelectOptions] = useState<Option[]>(element.options || []);\r\n  const [newOption, setNewOption] = useState<Option>({ label: \"\", value: \"\" });\r\n  const [isAddingOption, setIsAddingOption] = useState(false);\r\n\r\n  // Sync options with parent element when element changes\r\n  useEffect(() => {\r\n    if (JSON.stringify(selectOptions) !== JSON.stringify(element.options || [])) {\r\n      setSelectOptions(element.options || []);\r\n    }\r\n  }, [element.options, selectOptions]);\r\n\r\n  // Memoized computed values\r\n  const isFieldDisabled = useMemo(() => \r\n    element.type === \"system\" || !element.is_new, \r\n    [element.type, element.is_new]\r\n  );\r\n\r\n  const selectedOptionLabel = useMemo(() => {\r\n    const selectedOption = selectOptions.find(option => option.value === element.default_value);\r\n    return selectedOption?.label || \"Select Default\";\r\n  }, [selectOptions, element.default_value]);\r\n\r\n  // Optimized event handlers with useCallback\r\n  const handleFieldUpdate = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\r\n    handlePropertyValueUpdate(null, null, null, e.target.value);\r\n  }, [handlePropertyValueUpdate]);\r\n\r\n  const handleSelectUpdate = useCallback((e: React.ChangeEvent<{ value: unknown }>) => {\r\n    handlePropertyValueUpdate(null, null, e.target.value);\r\n  }, [handlePropertyValueUpdate]);\r\n\r\n  const handleMultiSelect = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\r\n    const isChecked = e.target.checked;\r\n    // Reset default value when enabling multiselect\r\n    const defaultValue = isChecked ? null : element.default_value;\r\n    \r\n    // Create a synthetic event for the property update\r\n    const syntheticEvent = {\r\n      target: {\r\n        name: 'is_multiselect',\r\n        checked: isChecked,\r\n        value: isChecked\r\n      }\r\n    } as React.ChangeEvent<HTMLInputElement>;\r\n    \r\n    handlePropertyValueUpdate(syntheticEvent);\r\n    \r\n    // If enabling multiselect, also clear the default value\r\n    if (isChecked && element.default_value) {\r\n      handlePropertyValueUpdate(null, 'default_value', null);\r\n    }\r\n  }, [handlePropertyValueUpdate, element.default_value]);\r\n\r\n  const handleNewOptionChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\r\n    const { name, value } = e.target;\r\n    setNewOption(prev => ({ ...prev, [name]: value }));\r\n  }, []);\r\n\r\n  const handleAddOption = useCallback(() => {\r\n    if (!newOption.label.trim() || !newOption.value.trim()) {\r\n      return; // Don't add empty options\r\n    }\r\n\r\n    // Check for duplicate values\r\n    const isDuplicate = selectOptions.some(option => \r\n      option.value === newOption.value || option.label === newOption.label\r\n    );\r\n    \r\n    if (isDuplicate) {\r\n      // Could show an error message here\r\n      enqueueSnackbar(\"Option with this value or label already exists.\", { variant: \"error\" });\r\n      return;\r\n    }\r\n\r\n    const updatedOptions = [...selectOptions, { ...newOption }];\r\n    setSelectOptions(updatedOptions);\r\n    handleSelectOptionValueUpdate(updatedOptions);\r\n    \r\n    // Reset form\r\n    setNewOption({ label: \"\", value: \"\" });\r\n    setIsAddingOption(false);\r\n  }, [newOption, selectOptions, handleSelectOptionValueUpdate]);\r\n\r\n  const handleRemoveOption = useCallback((indexToRemove: number) => {\r\n    const updatedOptions = selectOptions.filter((_, index) => index !== indexToRemove);\r\n    setSelectOptions(updatedOptions);\r\n    handleSelectOptionValueUpdate(updatedOptions);\r\n    \r\n    // Clear default value if the removed option was selected\r\n    const removedOption = selectOptions[indexToRemove];\r\n    if (element.default_value === removedOption?.value) {\r\n      handlePropertyValueUpdate(null, 'default_value', null);\r\n    }\r\n  }, [selectOptions, handleSelectOptionValueUpdate, element.default_value, handlePropertyValueUpdate]);\r\n\r\n  const handleWidthChangeCallback = useCallback((\r\n    _: Event, \r\n    newValue: number | number[]\r\n  ) => {\r\n    handleWidthChange(newValue);\r\n  }, [handleWidthChange]);\r\n\r\n  return (\r\n    <Box className=\"formSection--FieldContainer\">\r\n      {/* Field Type Selection */}\r\n      <Box>\r\n        <FieldSelect\r\n          variant=\"outlined\"\r\n          onChange={handleFieldUpdate}\r\n          defaultValue={element.field_type}\r\n          label=\"Field Type\"\r\n          disabled={isFieldDisabled}\r\n        />\r\n      </Box>\r\n\r\n      {/* Label Field */}\r\n      <Box>\r\n        <TextField\r\n          fullWidth\r\n          label=\"Label\"\r\n          is_required\r\n          name=\"label\"\r\n          type=\"text\"\r\n          onChange={handlePropertyValueUpdate}\r\n          defaultValue={element.label}\r\n        />\r\n      </Box>\r\n\r\n      {/* Placeholder Field */}\r\n      <Box>\r\n        <TextField\r\n          fullWidth\r\n          label=\"Placeholder\"\r\n          is_required\r\n          name=\"placeholder\"\r\n          type=\"text\"\r\n          onChange={handlePropertyValueUpdate}\r\n          defaultValue={element.placeholder}\r\n        />\r\n      </Box>\r\n\r\n      {/* Default Value Selection */}\r\n      <Box>\r\n        <Select\r\n          fullWidth\r\n          placeholder=\"Select Default\"\r\n          size=\"small\"\r\n          name=\"default_value\"\r\n          onChange={handleSelectUpdate}\r\n          value={element.default_value || \"\"}\r\n          label=\"Default\"\r\n          variant=\"outlined\"\r\n          disabled={element.is_multiselect}\r\n          renderValue={() => selectedOptionLabel}\r\n        >\r\n          {selectOptions.map((option, index) => (\r\n            <MenuItem key={`${option.value}-${index}`} value={option.value}>\r\n              {option.label}\r\n            </MenuItem>\r\n          ))}\r\n        </Select>\r\n      </Box>\r\n\r\n      {/* Column Per Row Selection */}\r\n      <Box>\r\n        <FormControl fullWidth>\r\n          <Select\r\n            fullWidth\r\n            placeholder=\"Select Column Per Row\"\r\n            size=\"small\"\r\n            onChange={handleColumnSelect}\r\n            label=\"Select Column Per Row\"\r\n            name=\"columnPerRow\"\r\n            variant=\"outlined\"\r\n          >\r\n            {COLUMN_PER_ROW_OPTIONS.map((option) => (\r\n              <MenuItem key={option} value={option}>\r\n                {option}\r\n              </MenuItem>\r\n            ))}\r\n          </Select>\r\n        </FormControl>\r\n      </Box>\r\n\r\n      {/* Width Slider */}\r\n      <Box>\r\n        <Typography sx={{ color: 'black', mb: 1 }}>\r\n          Adjust Width:\r\n        </Typography>\r\n        <Box pr={2}>\r\n          <Slider\r\n            value={element.custom_width || 6}\r\n            min={1}\r\n            max={12}\r\n            step={1}\r\n            onChange={handleWidthChangeCallback}\r\n            aria-labelledby=\"width-slider\"\r\n            sx={{ color: \"#4AC08C\" }}\r\n            marks\r\n            valueLabelDisplay=\"auto\"\r\n          />\r\n        </Box>\r\n      </Box>\r\n\r\n      {/* Options Management */}\r\n      <Box className=\"formSection--SelectOption\">\r\n        <Typography \r\n          type=\"s5\" \r\n          weight=\"medium\" \r\n          color=\"theme.secondary.800\"\r\n          sx={{ mb: 0.5 }}\r\n        >\r\n          Options\r\n        </Typography>\r\n        \r\n        {/* Existing Options */}\r\n        {selectOptions.map((option, index) => (\r\n          <Box key={`option-${index}`} sx={{ mb: 1, display: 'flex', gap: 1 }}>\r\n            <TextField\r\n              fullWidth\r\n              value={`${option.label} (${option.value})`}\r\n              InputProps={{ readOnly: true }}\r\n            />\r\n            <IconButton\r\n              color=\"error\"\r\n              size=\"small\"\r\n              onClick={() => handleRemoveOption(index)}\r\n            >\r\n              <Trash />\r\n            </IconButton>\r\n          </Box>\r\n        ))}\r\n\r\n        {/* Add New Option Form */}\r\n        {isAddingOption && (\r\n          <Box className=\"formSection--SelectOption\" sx={{ mt:0.5, p: 2, border: '1px solid #ddd', borderRadius: 1 }}>\r\n            <Box sx={{ mb: 2 }}>\r\n              <TextField\r\n                fullWidth\r\n                label=\"Option Label\"\r\n                is_required\r\n                name=\"label\"\r\n                type=\"text\"\r\n                placeholder=\"Enter option label\"\r\n                value={newOption.label}\r\n                onChange={handleNewOptionChange}\r\n              />\r\n            </Box>\r\n            <Box sx={{ mb: 2 }}>\r\n              <TextField\r\n                fullWidth\r\n                label=\"Option Value\"\r\n                placeholder=\"Enter option value\"\r\n                is_required\r\n                name=\"value\"\r\n                type=\"text\"\r\n                value={newOption.value}\r\n                onChange={handleNewOptionChange}\r\n              />\r\n            </Box>\r\n            <Box sx={{ display: 'flex', gap: 1 }}>\r\n              <Button\r\n                onClick={handleAddOption}\r\n                // className=\"formSection--Button\"\r\n                startIcon={<Add />}\r\n                disabled={!newOption.label.trim() || !newOption.value.trim()}\r\n              >\r\n                Add Option\r\n              </Button>\r\n              <Button\r\n                onClick={() => {\r\n                  setIsAddingOption(false);\r\n                  setNewOption({ label: \"\", value: \"\" });\r\n                }}\r\n                variant=\"outlined\"\r\n              >\r\n                Cancel\r\n              </Button>\r\n            </Box>\r\n          </Box>\r\n        )}\r\n\r\n        {/* Add Option Button */}\r\n        {!isAddingOption && (\r\n          <Button\r\n            onClick={() => setIsAddingOption(true)}\r\n            variant=\"outlined\"\r\n            className=\"formSection--Button\"\r\n            startIcon={<Add />}\r\n            sx={{ mt: 1 }}\r\n          >\r\n            Add Option\r\n          </Button>\r\n        )}\r\n      </Box>\r\n\r\n      {/* Form Controls */}\r\n      <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1 }}>\r\n        <FormControlLabel\r\n          name=\"is_multiselect\"\r\n          control={<Checkbox />}\r\n          onChange={handleMultiSelect}\r\n          checked={element.is_multiselect}\r\n          label=\"Enable Multi Select\"\r\n        />\r\n\r\n        <FormControlLabel\r\n          name=\"is_required\"\r\n          control={<Checkbox />}\r\n          onChange={handlePropertyValueUpdate}\r\n          checked={element.is_required}\r\n          label=\"This field is required\"\r\n        />\r\n\r\n        <FormControlLabel\r\n          name=\"is_unique\"\r\n          control={<Checkbox />}\r\n          onChange={handlePropertyValueUpdate}\r\n          checked={element.is_unique}\r\n          label=\"Is Unique\"\r\n        />\r\n\r\n        <FormControlLabel\r\n          name=\"is_fullwidth\"\r\n          control={<Checkbox />}\r\n          onChange={handlePropertyValueUpdate}\r\n          checked={element.is_fullwidth}\r\n          label=\"Full Width\"\r\n        />\r\n      </Box>\r\n    </Box>\r\n  );\r\n});\r\n\r\nSelectEditForm.displayName = 'SelectEditForm';\r\n\r\nexport default SelectEditForm;"],"names":["React"],"mappings":"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"}

package/dist/views/form-builder/element-edit-forms/select/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/views/form-builder/element-edit-forms/select.tsx"],"sourcesContent":["// React imports\nimport React, { useEffect, useState, useCallback, useMemo } from \"react\";\n\n// Material UI imports\nimport { \n  MenuItem, \n  Box, \n  FormControlLabel, \n  Slider, \n  FormControl, \n  IconButton\n} from \"@mui/material\";\nimport { Add } from \"@mui/icons-material\";\n\n// Third-party imports\nimport { enqueueSnackbar } from \"notistack\";\n\n// ERP Common imports\nimport Checkbox from \"@/components/checkbox/checkbox\";\nimport Select from \"@/components/select/select\";\nimport TextField from \"@/components/text-field/text-field\";\nimport Typography from \"@/components/typography/typography\";\nimport Button from \"@/components/button/button\";\nimport { Trash } from \"@/components/icons\";\n\n// Local imports\nimport FieldSelect from \"./field-select\";\nimport \"../custom-form.scss\";\n\ninterface Option {\n  label: string;\n  value: string;\n  [key: string]: string;\n}\n\ninterface ElementJSON {\n  id: string;\n  field_type: string;\n  label: string;\n  placeholder: string;\n  default_value: string | null;\n  is_multiselect: boolean;\n  is_required: boolean;\n  is_unique: boolean;\n  is_fullwidth: boolean;\n  custom_width: number;\n  type?: string;\n  is_new?: boolean;\n  options: Option[];\n}\n\ninterface SelectEditFormProps {\n  element: ElementJSON;\n  handlePropertyValueUpdate: (\n    event: React.ChangeEvent<HTMLInputElement> | null,\n    name?: string | null,\n    value?: any,\n    fieldType?: string\n  ) => void;\n  handleSelectOptionValueUpdate: (options: Option[]) => void;\n  handleColumnSelect: (event: React.ChangeEvent<{ value: unknown }>) => void;\n  handleWidthChange: (value: number | number[]) => void;\n}\n\nconst COLUMN_PER_ROW_OPTIONS = [1, 2, 3, 4, 5, 6] as const;\n\nexport const SelectEditForm: React.FC<SelectEditFormProps> = React.memo(({\n  element,\n  handlePropertyValueUpdate,\n  handleSelectOptionValueUpdate,\n  handleColumnSelect,\n  handleWidthChange\n}) => {\n  // Local state management\n  const [selectOptions, setSelectOptions] = useState<Option[]>(element.options || []);\n  const [newOption, setNewOption] = useState<Option>({ label: \"\", value: \"\" });\n  const [isAddingOption, setIsAddingOption] = useState(false);\n\n  // Sync options with parent element when element changes\n  useEffect(() => {\n    if (JSON.stringify(selectOptions) !== JSON.stringify(element.options || [])) {\n      setSelectOptions(element.options || []);\n    }\n  }, [element.options, selectOptions]);\n\n  // Memoized computed values\n  const isFieldDisabled = useMemo(() => \n    element.type === \"system\" || !element.is_new, \n    [element.type, element.is_new]\n  );\n\n  const selectedOptionLabel = useMemo(() => {\n    const selectedOption = selectOptions.find(option => option.value === element.default_value);\n    return selectedOption?.label || \"Select Default\";\n  }, [selectOptions, element.default_value]);\n\n  // Optimized event handlers with useCallback\n  const handleFieldUpdate = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\n    handlePropertyValueUpdate(null, null, null, e.target.value);\n  }, [handlePropertyValueUpdate]);\n\n  const handleSelectUpdate = useCallback((e: React.ChangeEvent<{ value: unknown }>) => {\n    handlePropertyValueUpdate(null, null, e.target.value);\n  }, [handlePropertyValueUpdate]);\n\n  const handleMultiSelect = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\n    const isChecked = e.target.checked;\n    // Reset default value when enabling multiselect\n    const defaultValue = isChecked ? null : element.default_value;\n    \n    // Create a synthetic event for the property update\n    const syntheticEvent = {\n      target: {\n        name: 'is_multiselect',\n        checked: isChecked,\n        value: isChecked\n      }\n    } as React.ChangeEvent<HTMLInputElement>;\n    \n    handlePropertyValueUpdate(syntheticEvent);\n    \n    // If enabling multiselect, also clear the default value\n    if (isChecked && element.default_value) {\n      handlePropertyValueUpdate(null, 'default_value', null);\n    }\n  }, [handlePropertyValueUpdate, element.default_value]);\n\n  const handleNewOptionChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\n    const { name, value } = e.target;\n    setNewOption(prev => ({ ...prev, [name]: value }));\n  }, []);\n\n  const handleAddOption = useCallback(() => {\n    if (!newOption.label.trim() || !newOption.value.trim()) {\n      return; // Don't add empty options\n    }\n\n    // Check for duplicate values\n    const isDuplicate = selectOptions.some(option => \n      option.value === newOption.value || option.label === newOption.label\n    );\n    \n    if (isDuplicate) {\n      // Could show an error message here\n      enqueueSnackbar(\"Option with this value or label already exists.\", { variant: \"error\" });\n      return;\n    }\n\n    const updatedOptions = [...selectOptions, { ...newOption }];\n    setSelectOptions(updatedOptions);\n    handleSelectOptionValueUpdate(updatedOptions);\n    \n    // Reset form\n    setNewOption({ label: \"\", value: \"\" });\n    setIsAddingOption(false);\n  }, [newOption, selectOptions, handleSelectOptionValueUpdate]);\n\n  const handleRemoveOption = useCallback((indexToRemove: number) => {\n    const updatedOptions = selectOptions.filter((_, index) => index !== indexToRemove);\n    setSelectOptions(updatedOptions);\n    handleSelectOptionValueUpdate(updatedOptions);\n    \n    // Clear default value if the removed option was selected\n    const removedOption = selectOptions[indexToRemove];\n    if (element.default_value === removedOption?.value) {\n      handlePropertyValueUpdate(null, 'default_value', null);\n    }\n  }, [selectOptions, handleSelectOptionValueUpdate, element.default_value, handlePropertyValueUpdate]);\n\n  const handleWidthChangeCallback = useCallback((\n    _: Event, \n    newValue: number | number[]\n  ) => {\n    handleWidthChange(newValue);\n  }, [handleWidthChange]);\n\n  return (\n    <Box className=\"formSection--FieldContainer\">\n      {/* Field Type Selection */}\n      <Box>\n        <FieldSelect\n          variant=\"outlined\"\n          onChange={handleFieldUpdate}\n          defaultValue={element.field_type}\n          label=\"Field Type\"\n          disabled={isFieldDisabled}\n        />\n      </Box>\n\n      {/* Label Field */}\n      <Box>\n        <TextField\n          fullWidth\n          label=\"Label\"\n          is_required\n          name=\"label\"\n          type=\"text\"\n          onChange={handlePropertyValueUpdate}\n          defaultValue={element.label}\n        />\n      </Box>\n\n      {/* Placeholder Field */}\n      <Box>\n        <TextField\n          fullWidth\n          label=\"Placeholder\"\n          is_required\n          name=\"placeholder\"\n          type=\"text\"\n          onChange={handlePropertyValueUpdate}\n          defaultValue={element.placeholder}\n        />\n      </Box>\n\n      {/* Default Value Selection */}\n      <Box>\n        <Select\n          fullWidth\n          placeholder=\"Select Default\"\n          size=\"small\"\n          name=\"default_value\"\n          onChange={handleSelectUpdate}\n          value={element.default_value || \"\"}\n          label=\"Default\"\n          variant=\"outlined\"\n          disabled={element.is_multiselect}\n          renderValue={() => selectedOptionLabel}\n        >\n          {selectOptions.map((option, index) => (\n            <MenuItem key={`${option.value}-${index}`} value={option.value}>\n              {option.label}\n            </MenuItem>\n          ))}\n        </Select>\n      </Box>\n\n      {/* Column Per Row Selection */}\n      <Box>\n        <FormControl fullWidth>\n          <Select\n            fullWidth\n            placeholder=\"Select Column Per Row\"\n            size=\"small\"\n            onChange={handleColumnSelect}\n            label=\"Select Column Per Row\"\n            name=\"columnPerRow\"\n            variant=\"outlined\"\n          >\n            {COLUMN_PER_ROW_OPTIONS.map((option) => (\n              <MenuItem key={option} value={option}>\n                {option}\n              </MenuItem>\n            ))}\n          </Select>\n        </FormControl>\n      </Box>\n\n      {/* Width Slider */}\n      <Box>\n        <Typography sx={{ color: 'black', mb: 1 }}>\n          Adjust Width:\n        </Typography>\n        <Box pr={2}>\n          <Slider\n            value={element.custom_width || 6}\n            min={1}\n            max={12}\n            step={1}\n            onChange={handleWidthChangeCallback}\n            aria-labelledby=\"width-slider\"\n            sx={{ color: \"#4AC08C\" }}\n            marks\n            valueLabelDisplay=\"auto\"\n          />\n        </Box>\n      </Box>\n\n      {/* Options Management */}\n      <Box className=\"formSection--SelectOption\">\n        <Typography \n          type=\"s5\" \n          weight=\"medium\" \n          color=\"theme.secondary.800\"\n          sx={{ mb: 0.5 }}\n        >\n          Options\n        </Typography>\n        \n        {/* Existing Options */}\n        {selectOptions.map((option, index) => (\n          <Box key={`option-${index}`} sx={{ mb: 1, display: 'flex', gap: 1 }}>\n            <TextField\n              fullWidth\n              value={`${option.label} (${option.value})`}\n              InputProps={{ readOnly: true }}\n            />\n            <IconButton\n              color=\"error\"\n              size=\"small\"\n              onClick={() => handleRemoveOption(index)}\n            >\n              <Trash />\n            </IconButton>\n          </Box>\n        ))}\n\n        {/* Add New Option Form */}\n        {isAddingOption && (\n          <Box className=\"formSection--SelectOption\" sx={{ mt:0.5, p: 2, border: '1px solid #ddd', borderRadius: 1 }}>\n            <Box sx={{ mb: 2 }}>\n              <TextField\n                fullWidth\n                label=\"Option Label\"\n                is_required\n                name=\"label\"\n                type=\"text\"\n                placeholder=\"Enter option label\"\n                value={newOption.label}\n                onChange={handleNewOptionChange}\n              />\n            </Box>\n            <Box sx={{ mb: 2 }}>\n              <TextField\n                fullWidth\n                label=\"Option Value\"\n                placeholder=\"Enter option value\"\n                is_required\n                name=\"value\"\n                type=\"text\"\n                value={newOption.value}\n                onChange={handleNewOptionChange}\n              />\n            </Box>\n            <Box sx={{ display: 'flex', gap: 1 }}>\n              <Button\n                onClick={handleAddOption}\n                // className=\"formSection--Button\"\n                startIcon={<Add />}\n                disabled={!newOption.label.trim() || !newOption.value.trim()}\n              >\n                Add Option\n              </Button>\n              <Button\n                onClick={() => {\n                  setIsAddingOption(false);\n                  setNewOption({ label: \"\", value: \"\" });\n                }}\n                variant=\"outlined\"\n              >\n                Cancel\n              </Button>\n            </Box>\n          </Box>\n        )}\n\n        {/* Add Option Button */}\n        {!isAddingOption && (\n          <Button\n            onClick={() => setIsAddingOption(true)}\n            variant=\"outlined\"\n            className=\"formSection--Button\"\n            startIcon={<Add />}\n            sx={{ mt: 1 }}\n          >\n            Add Option\n          </Button>\n        )}\n      </Box>\n\n      {/* Form Controls */}\n      <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1 }}>\n        <FormControlLabel\n          name=\"is_multiselect\"\n          control={<Checkbox />}\n          onChange={handleMultiSelect}\n          checked={element.is_multiselect}\n          label=\"Enable Multi Select\"\n        />\n\n        <FormControlLabel\n          name=\"is_required\"\n          control={<Checkbox />}\n          onChange={handlePropertyValueUpdate}\n          checked={element.is_required}\n          label=\"This field is required\"\n        />\n\n        <FormControlLabel\n          name=\"is_unique\"\n          control={<Checkbox />}\n          onChange={handlePropertyValueUpdate}\n          checked={element.is_unique}\n          label=\"Is Unique\"\n        />\n\n        <FormControlLabel\n          name=\"is_fullwidth\"\n          control={<Checkbox />}\n          onChange={handlePropertyValueUpdate}\n          checked={element.is_fullwidth}\n          label=\"Full Width\"\n        />\n      </Box>\n    </Box>\n  );\n});\n\nSelectEditForm.displayName = 'SelectEditForm';\n\nexport default SelectEditForm;"],"names":["COLUMN_PER_ROW_OPTIONS","SelectEditForm","React","memo","element","handlePropertyValueUpdate","handleSelectOptionValueUpdate","handleColumnSelect","handleWidthChange","selectOptions","setSelectOptions","useState","options","newOption","setNewOption","label","value","isAddingOption","setIsAddingOption","useEffect","JSON","stringify","isFieldDisabled","useMemo","type","is_new","selectedOptionLabel","selectedOption","find","option","default_value","handleFieldUpdate","useCallback","e","target","handleSelectUpdate","handleMultiSelect","isChecked","checked","name","handleNewOptionChange","prev","handleAddOption","trim","some","enqueueSnackbar","variant","updatedOptions","handleRemoveOption","indexToRemove","filter","_","index","removedOption","handleWidthChangeCallback","newValue","jsxs","Box","className","children","jsx","FieldSelect","onChange","defaultValue","field_type","disabled","TextField","fullWidth","is_required","placeholder","Select","size","is_multiselect","renderValue","map","MenuItem","FormControl","Typography","sx","color","mb","pr","Slider","custom_width","min","max","step","marks","valueLabelDisplay","weight","display","gap","InputProps","readOnly","IconButton","onClick","Trash","mt","p","border","borderRadius","Button","startIcon","Add","flexDirection","FormControlLabel","control","Checkbox","is_unique","is_fullwidth","displayName"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/views/form-builder/element-edit-forms/select.tsx"],"sourcesContent":["// React imports\r\nimport React, { useEffect, useState, useCallback, useMemo } from \"react\";\r\n\r\n// Material UI imports\r\nimport { \r\n  MenuItem, \r\n  Box, \r\n  FormControlLabel, \r\n  Slider, \r\n  FormControl, \r\n  IconButton\r\n} from \"@mui/material\";\r\nimport { Add } from \"@mui/icons-material\";\r\n\r\n// Third-party imports\r\nimport { enqueueSnackbar } from \"notistack\";\r\n\r\n// ERP Common imports\r\nimport Checkbox from \"@/components/checkbox/checkbox\";\r\nimport Select from \"@/components/select/select\";\r\nimport TextField from \"@/components/text-field/text-field\";\r\nimport Typography from \"@/components/typography/typography\";\r\nimport Button from \"@/components/button/button\";\r\nimport { Trash } from \"@/components/icons\";\r\n\r\n// Local imports\r\nimport FieldSelect from \"./field-select\";\r\nimport \"../custom-form.scss\";\r\n\r\ninterface Option {\r\n  label: string;\r\n  value: string;\r\n  [key: string]: string;\r\n}\r\n\r\ninterface ElementJSON {\r\n  id: string;\r\n  field_type: string;\r\n  label: string;\r\n  placeholder: string;\r\n  default_value: string | null;\r\n  is_multiselect: boolean;\r\n  is_required: boolean;\r\n  is_unique: boolean;\r\n  is_fullwidth: boolean;\r\n  custom_width: number;\r\n  type?: string;\r\n  is_new?: boolean;\r\n  options: Option[];\r\n}\r\n\r\ninterface SelectEditFormProps {\r\n  element: ElementJSON;\r\n  handlePropertyValueUpdate: (\r\n    event: React.ChangeEvent<HTMLInputElement> | null,\r\n    name?: string | null,\r\n    value?: any,\r\n    fieldType?: string\r\n  ) => void;\r\n  handleSelectOptionValueUpdate: (options: Option[]) => void;\r\n  handleColumnSelect: (event: React.ChangeEvent<{ value: unknown }>) => void;\r\n  handleWidthChange: (value: number | number[]) => void;\r\n}\r\n\r\nconst COLUMN_PER_ROW_OPTIONS = [1, 2, 3, 4, 5, 6] as const;\r\n\r\nexport const SelectEditForm: React.FC<SelectEditFormProps> = React.memo(({\r\n  element,\r\n  handlePropertyValueUpdate,\r\n  handleSelectOptionValueUpdate,\r\n  handleColumnSelect,\r\n  handleWidthChange\r\n}) => {\r\n  // Local state management\r\n  const [selectOptions, setSelectOptions] = useState<Option[]>(element.options || []);\r\n  const [newOption, setNewOption] = useState<Option>({ label: \"\", value: \"\" });\r\n  const [isAddingOption, setIsAddingOption] = useState(false);\r\n\r\n  // Sync options with parent element when element changes\r\n  useEffect(() => {\r\n    if (JSON.stringify(selectOptions) !== JSON.stringify(element.options || [])) {\r\n      setSelectOptions(element.options || []);\r\n    }\r\n  }, [element.options, selectOptions]);\r\n\r\n  // Memoized computed values\r\n  const isFieldDisabled = useMemo(() => \r\n    element.type === \"system\" || !element.is_new, \r\n    [element.type, element.is_new]\r\n  );\r\n\r\n  const selectedOptionLabel = useMemo(() => {\r\n    const selectedOption = selectOptions.find(option => option.value === element.default_value);\r\n    return selectedOption?.label || \"Select Default\";\r\n  }, [selectOptions, element.default_value]);\r\n\r\n  // Optimized event handlers with useCallback\r\n  const handleFieldUpdate = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\r\n    handlePropertyValueUpdate(null, null, null, e.target.value);\r\n  }, [handlePropertyValueUpdate]);\r\n\r\n  const handleSelectUpdate = useCallback((e: React.ChangeEvent<{ value: unknown }>) => {\r\n    handlePropertyValueUpdate(null, null, e.target.value);\r\n  }, [handlePropertyValueUpdate]);\r\n\r\n  const handleMultiSelect = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\r\n    const isChecked = e.target.checked;\r\n    // Reset default value when enabling multiselect\r\n    const defaultValue = isChecked ? null : element.default_value;\r\n    \r\n    // Create a synthetic event for the property update\r\n    const syntheticEvent = {\r\n      target: {\r\n        name: 'is_multiselect',\r\n        checked: isChecked,\r\n        value: isChecked\r\n      }\r\n    } as React.ChangeEvent<HTMLInputElement>;\r\n    \r\n    handlePropertyValueUpdate(syntheticEvent);\r\n    \r\n    // If enabling multiselect, also clear the default value\r\n    if (isChecked && element.default_value) {\r\n      handlePropertyValueUpdate(null, 'default_value', null);\r\n    }\r\n  }, [handlePropertyValueUpdate, element.default_value]);\r\n\r\n  const handleNewOptionChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\r\n    const { name, value } = e.target;\r\n    setNewOption(prev => ({ ...prev, [name]: value }));\r\n  }, []);\r\n\r\n  const handleAddOption = useCallback(() => {\r\n    if (!newOption.label.trim() || !newOption.value.trim()) {\r\n      return; // Don't add empty options\r\n    }\r\n\r\n    // Check for duplicate values\r\n    const isDuplicate = selectOptions.some(option => \r\n      option.value === newOption.value || option.label === newOption.label\r\n    );\r\n    \r\n    if (isDuplicate) {\r\n      // Could show an error message here\r\n      enqueueSnackbar(\"Option with this value or label already exists.\", { variant: \"error\" });\r\n      return;\r\n    }\r\n\r\n    const updatedOptions = [...selectOptions, { ...newOption }];\r\n    setSelectOptions(updatedOptions);\r\n    handleSelectOptionValueUpdate(updatedOptions);\r\n    \r\n    // Reset form\r\n    setNewOption({ label: \"\", value: \"\" });\r\n    setIsAddingOption(false);\r\n  }, [newOption, selectOptions, handleSelectOptionValueUpdate]);\r\n\r\n  const handleRemoveOption = useCallback((indexToRemove: number) => {\r\n    const updatedOptions = selectOptions.filter((_, index) => index !== indexToRemove);\r\n    setSelectOptions(updatedOptions);\r\n    handleSelectOptionValueUpdate(updatedOptions);\r\n    \r\n    // Clear default value if the removed option was selected\r\n    const removedOption = selectOptions[indexToRemove];\r\n    if (element.default_value === removedOption?.value) {\r\n      handlePropertyValueUpdate(null, 'default_value', null);\r\n    }\r\n  }, [selectOptions, handleSelectOptionValueUpdate, element.default_value, handlePropertyValueUpdate]);\r\n\r\n  const handleWidthChangeCallback = useCallback((\r\n    _: Event, \r\n    newValue: number | number[]\r\n  ) => {\r\n    handleWidthChange(newValue);\r\n  }, [handleWidthChange]);\r\n\r\n  return (\r\n    <Box className=\"formSection--FieldContainer\">\r\n      {/* Field Type Selection */}\r\n      <Box>\r\n        <FieldSelect\r\n          variant=\"outlined\"\r\n          onChange={handleFieldUpdate}\r\n          defaultValue={element.field_type}\r\n          label=\"Field Type\"\r\n          disabled={isFieldDisabled}\r\n        />\r\n      </Box>\r\n\r\n      {/* Label Field */}\r\n      <Box>\r\n        <TextField\r\n          fullWidth\r\n          label=\"Label\"\r\n          is_required\r\n          name=\"label\"\r\n          type=\"text\"\r\n          onChange={handlePropertyValueUpdate}\r\n          defaultValue={element.label}\r\n        />\r\n      </Box>\r\n\r\n      {/* Placeholder Field */}\r\n      <Box>\r\n        <TextField\r\n          fullWidth\r\n          label=\"Placeholder\"\r\n          is_required\r\n          name=\"placeholder\"\r\n          type=\"text\"\r\n          onChange={handlePropertyValueUpdate}\r\n          defaultValue={element.placeholder}\r\n        />\r\n      </Box>\r\n\r\n      {/* Default Value Selection */}\r\n      <Box>\r\n        <Select\r\n          fullWidth\r\n          placeholder=\"Select Default\"\r\n          size=\"small\"\r\n          name=\"default_value\"\r\n          onChange={handleSelectUpdate}\r\n          value={element.default_value || \"\"}\r\n          label=\"Default\"\r\n          variant=\"outlined\"\r\n          disabled={element.is_multiselect}\r\n          renderValue={() => selectedOptionLabel}\r\n        >\r\n          {selectOptions.map((option, index) => (\r\n            <MenuItem key={`${option.value}-${index}`} value={option.value}>\r\n              {option.label}\r\n            </MenuItem>\r\n          ))}\r\n        </Select>\r\n      </Box>\r\n\r\n      {/* Column Per Row Selection */}\r\n      <Box>\r\n        <FormControl fullWidth>\r\n          <Select\r\n            fullWidth\r\n            placeholder=\"Select Column Per Row\"\r\n            size=\"small\"\r\n            onChange={handleColumnSelect}\r\n            label=\"Select Column Per Row\"\r\n            name=\"columnPerRow\"\r\n            variant=\"outlined\"\r\n          >\r\n            {COLUMN_PER_ROW_OPTIONS.map((option) => (\r\n              <MenuItem key={option} value={option}>\r\n                {option}\r\n              </MenuItem>\r\n            ))}\r\n          </Select>\r\n        </FormControl>\r\n      </Box>\r\n\r\n      {/* Width Slider */}\r\n      <Box>\r\n        <Typography sx={{ color: 'black', mb: 1 }}>\r\n          Adjust Width:\r\n        </Typography>\r\n        <Box pr={2}>\r\n          <Slider\r\n            value={element.custom_width || 6}\r\n            min={1}\r\n            max={12}\r\n            step={1}\r\n            onChange={handleWidthChangeCallback}\r\n            aria-labelledby=\"width-slider\"\r\n            sx={{ color: \"#4AC08C\" }}\r\n            marks\r\n            valueLabelDisplay=\"auto\"\r\n          />\r\n        </Box>\r\n      </Box>\r\n\r\n      {/* Options Management */}\r\n      <Box className=\"formSection--SelectOption\">\r\n        <Typography \r\n          type=\"s5\" \r\n          weight=\"medium\" \r\n          color=\"theme.secondary.800\"\r\n          sx={{ mb: 0.5 }}\r\n        >\r\n          Options\r\n        </Typography>\r\n        \r\n        {/* Existing Options */}\r\n        {selectOptions.map((option, index) => (\r\n          <Box key={`option-${index}`} sx={{ mb: 1, display: 'flex', gap: 1 }}>\r\n            <TextField\r\n              fullWidth\r\n              value={`${option.label} (${option.value})`}\r\n              InputProps={{ readOnly: true }}\r\n            />\r\n            <IconButton\r\n              color=\"error\"\r\n              size=\"small\"\r\n              onClick={() => handleRemoveOption(index)}\r\n            >\r\n              <Trash />\r\n            </IconButton>\r\n          </Box>\r\n        ))}\r\n\r\n        {/* Add New Option Form */}\r\n        {isAddingOption && (\r\n          <Box className=\"formSection--SelectOption\" sx={{ mt:0.5, p: 2, border: '1px solid #ddd', borderRadius: 1 }}>\r\n            <Box sx={{ mb: 2 }}>\r\n              <TextField\r\n                fullWidth\r\n                label=\"Option Label\"\r\n                is_required\r\n                name=\"label\"\r\n                type=\"text\"\r\n                placeholder=\"Enter option label\"\r\n                value={newOption.label}\r\n                onChange={handleNewOptionChange}\r\n              />\r\n            </Box>\r\n            <Box sx={{ mb: 2 }}>\r\n              <TextField\r\n                fullWidth\r\n                label=\"Option Value\"\r\n                placeholder=\"Enter option value\"\r\n                is_required\r\n                name=\"value\"\r\n                type=\"text\"\r\n                value={newOption.value}\r\n                onChange={handleNewOptionChange}\r\n              />\r\n            </Box>\r\n            <Box sx={{ display: 'flex', gap: 1 }}>\r\n              <Button\r\n                onClick={handleAddOption}\r\n                // className=\"formSection--Button\"\r\n                startIcon={<Add />}\r\n                disabled={!newOption.label.trim() || !newOption.value.trim()}\r\n              >\r\n                Add Option\r\n              </Button>\r\n              <Button\r\n                onClick={() => {\r\n                  setIsAddingOption(false);\r\n                  setNewOption({ label: \"\", value: \"\" });\r\n                }}\r\n                variant=\"outlined\"\r\n              >\r\n                Cancel\r\n              </Button>\r\n            </Box>\r\n          </Box>\r\n        )}\r\n\r\n        {/* Add Option Button */}\r\n        {!isAddingOption && (\r\n          <Button\r\n            onClick={() => setIsAddingOption(true)}\r\n            variant=\"outlined\"\r\n            className=\"formSection--Button\"\r\n            startIcon={<Add />}\r\n            sx={{ mt: 1 }}\r\n          >\r\n            Add Option\r\n          </Button>\r\n        )}\r\n      </Box>\r\n\r\n      {/* Form Controls */}\r\n      <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1 }}>\r\n        <FormControlLabel\r\n          name=\"is_multiselect\"\r\n          control={<Checkbox />}\r\n          onChange={handleMultiSelect}\r\n          checked={element.is_multiselect}\r\n          label=\"Enable Multi Select\"\r\n        />\r\n\r\n        <FormControlLabel\r\n          name=\"is_required\"\r\n          control={<Checkbox />}\r\n          onChange={handlePropertyValueUpdate}\r\n          checked={element.is_required}\r\n          label=\"This field is required\"\r\n        />\r\n\r\n        <FormControlLabel\r\n          name=\"is_unique\"\r\n          control={<Checkbox />}\r\n          onChange={handlePropertyValueUpdate}\r\n          checked={element.is_unique}\r\n          label=\"Is Unique\"\r\n        />\r\n\r\n        <FormControlLabel\r\n          name=\"is_fullwidth\"\r\n          control={<Checkbox />}\r\n          onChange={handlePropertyValueUpdate}\r\n          checked={element.is_fullwidth}\r\n          label=\"Full Width\"\r\n        />\r\n      </Box>\r\n    </Box>\r\n  );\r\n});\r\n\r\nSelectEditForm.displayName = 'SelectEditForm';\r\n\r\nexport default SelectEditForm;"],"names":["COLUMN_PER_ROW_OPTIONS","SelectEditForm","React","memo","element","handlePropertyValueUpdate","handleSelectOptionValueUpdate","handleColumnSelect","handleWidthChange","selectOptions","setSelectOptions","useState","options","newOption","setNewOption","label","value","isAddingOption","setIsAddingOption","useEffect","JSON","stringify","isFieldDisabled","useMemo","type","is_new","selectedOptionLabel","selectedOption","find","option","default_value","handleFieldUpdate","useCallback","e","target","handleSelectUpdate","handleMultiSelect","isChecked","checked","name","handleNewOptionChange","prev","handleAddOption","trim","some","enqueueSnackbar","variant","updatedOptions","handleRemoveOption","indexToRemove","filter","_","index","removedOption","handleWidthChangeCallback","newValue","jsxs","Box","className","children","jsx","FieldSelect","onChange","defaultValue","field_type","disabled","TextField","fullWidth","is_required","placeholder","Select","size","is_multiselect","renderValue","map","MenuItem","FormControl","Typography","sx","color","mb","pr","Slider","custom_width","min","max","step","marks","valueLabelDisplay","weight","display","gap","InputProps","readOnly","IconButton","onClick","Trash","mt","p","border","borderRadius","Button","startIcon","Add","flexDirection","FormControlLabel","control","Checkbox","is_unique","is_fullwidth","displayName"],"mappings":"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"}

package/dist/views/form-builder/element-edit-forms/table-form/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/form-builder/element-edit-forms/table-form.tsx"],"sourcesContent":["// React imports\nimport React, { useEffect, useState } from 'react';\n\n// Material UI imports\nimport { MenuItem, Box, SelectChangeEvent } from '@mui/material';\n\n// Third-party imports\nimport { MRT_ColumnDef, MRT_RowData } from 'material-react-table';\n\n// ERP Common imports\nimport Select from '@/components/select/select';\nimport TextField from '@/components/text-field/text-field';\nimport formatText from '@/utils/format-text';\n\n// Local imports\nimport { IElementJson } from '../custom-form';\nimport { ApiFormFields } from '../../Redux/state';\nimport FieldSelect from './field-select';\nimport '../custom-form.scss';\n\ninterface ITableEditForm {\n\thandlePropertyValueUpdate: (\n\t\tevent?: any,\n\t\tnumberValue?: any,\n\t\tval?: any,\n\t\tfieldType?: any\n\t) => void;\n\thandleColumnsUpdate: (columns: MRT_ColumnDef<MRT_RowData>[]) => void;\n\telement: IElementJson | null;\n\tfields: ApiFormFields | null;\n}\n\ninterface TableOption {\n\tlabel: string;\n\tvalue: string;\n}\n\nconst TableEditForm: React.FC<ITableEditForm> = ({\n\thandlePropertyValueUpdate,\n\telement,\n\thandleColumnsUpdate,\n\tfields\n}) => {\n\t/* Local States */\n\tconst [elementJSON, setElementJSON] = useState<IElementJson | null>(element);\n\tconst [tables, setTables] = useState<TableOption[]>([]);\n\n\t/* Local Functions */\n\tconst handleFieldUpdate = (event: SelectChangeEvent<unknown>) => {\n\t\tif (elementJSON) {\n\t\t\telementJSON.field_type = event.target.value as string;\n\t\t\thandlePropertyValueUpdate(null, null, null, event.target.value as string);\n\t\t}\n\t};\n\tconst handleTableSelect = (event: SelectChangeEvent<unknown>) => {\n\t\thandlePropertyValueUpdate(event);\n\t};\n\n\t/* Use Effects */\n\tuseEffect(() => {\n\t\tsetElementJSON(element);\n\t}, [element]);\n\tuseEffect(() => {\n\t\tif (elementJSON && elementJSON.table && fields) {\n\t\t\tconst fieldsArr = fields[elementJSON.table];\n\t\t\tlet columns: any[] = [];\n\t\t\tif (fieldsArr && fieldsArr?.length) {\n\t\t\t\tcolumns = fieldsArr.map((field, index) => ({\n\t\t\t\t\theader: formatText(field.field),\n\t\t\t\t\taccessorKey: field.field,\n\t\t\t\t\tvisible: index > 3 ? false : true,\n\t\t\t\t\ttype: field.type\n\t\t\t\t}));\n\t\t\t} else {\n\t\t\t\tcolumns = [\n\t\t\t\t\t{ header: 'Column 1', accessorKey: 'column_1', visible: true },\n\t\t\t\t\t{ header: 'Column 2', accessorKey: 'column_1', visible: true }\n\t\t\t\t];\n\t\t\t}\n\t\t\tcolumns && handleColumnsUpdate(columns);\n\t\t}\n\t}, [elementJSON?.table]);\n\tuseEffect(() => {\n\t\tif (fields) {\n\t\t\tconst options = Object.keys(fields).map((key) => ({\n\t\t\t\tlabel: formatText(key),\n\t\t\t\tvalue: key\n\t\t\t}));\n\t\t\tsetTables(options);\n\t\t}\n\t}, [fields]);\n\n\tif (!elementJSON) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Box className='formSection--FieldContainer' key={elementJSON.id}>\n\t\t\t<div key={elementJSON.id}>\n\t\t\t\t<FieldSelect\n\t\t\t\t\tkey={elementJSON.id}\n\t\t\t\t\tvariant='outlined'\n\t\t\t\t\tonChange={handleFieldUpdate}\n\t\t\t\t\tdefaultValue={elementJSON.field_type}\n\t\t\t\t\tdisabled={elementJSON.type === 'system' || !elementJSON.is_new}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t\t<div key={elementJSON.id}>\n\t\t\t\t<TextField\n\t\t\t\t\tfullWidth\n\t\t\t\t\tlabel='Label'\n\t\t\t\t\tis_required\n\t\t\t\t\tkey={elementJSON.id}\n\t\t\t\t\tname='label'\n\t\t\t\t\ttype='text'\n\t\t\t\t\tonChange={handlePropertyValueUpdate}\n\t\t\t\t\tdefaultValue={elementJSON.label}\n\t\t\t\t/>\n\t\t\t</div>\n\n\t\t\t<div key={elementJSON.id}>\n\t\t\t\t<Select\n\t\t\t\t\tkey={elementJSON.id}\n\t\t\t\t\tvariant='outlined'\n\t\t\t\t\tlabel='Table'\n\t\t\t\t\tfullWidth\n\t\t\t\t\tplaceholder='Select Table'\n\t\t\t\t\tsize='small'\n\t\t\t\t\tname='table'\n\t\t\t\t\tdefaultValue={elementJSON.table}\n\t\t\t\t\tdisabled={elementJSON.type === 'system'}\n\t\t\t\t\tonChange={handleTableSelect}\n\t\t\t\t\trenderValue={(value: string) =>\n\t\t\t\t\t\ttables.find((option) => option.value === value)?.label\n\t\t\t\t\t}>\n\t\t\t\t\t{tables?.map((item) => (\n\t\t\t\t\t\t<MenuItem value={item.value}>{item.label}</MenuItem>\n\t\t\t\t\t))}\n\t\t\t\t</Select>\n\t\t\t</div>\n\t\t</Box>\n\t);\n};\n\nexport default TableEditForm;\n"],"names":[],"mappings":";;;;;;;;;AAqCA,MAAM,gBAA0C,CAAC;AAAA,EAChD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,MAAM;AAEL,QAAM,CAAC,aAAa,cAAc,IAAI,SAA8B,OAAO;AAC3E,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAwB,CAAA,CAAE;AAGtD,QAAM,oBAAoB,CAAC,UAAsC;AAChE,QAAI,aAAa;AAChB,kBAAY,aAAa,MAAM,OAAO;AACtC,gCAA0B,MAAM,MAAM,MAAM,MAAM,OAAO,KAAe;AAAA,IACzE;AAAA,EACD;AACA,QAAM,oBAAoB,CAAC,UAAsC;AAChE,8BAA0B,KAAK;AAAA,EAChC;AAGA,YAAU,MAAM;AACf,mBAAe,OAAO;AAAA,EACvB,GAAG,CAAC,OAAO,CAAC;AACZ,YAAU,MAAM;AACf,QAAI,eAAe,YAAY,SAAS,QAAQ;AAC/C,YAAM,YAAY,OAAO,YAAY,KAAK;AAC1C,UAAI,UAAiB,CAAA;AACrB,UAAI,cAAa,uCAAW,SAAQ;AACnC,kBAAU,UAAU,IAAI,CAAC,OAAO,WAAW;AAAA,UAC1C,QAAQ,WAAW,MAAM,KAAK;AAAA,UAC9B,aAAa,MAAM;AAAA,UACnB,SAAS,QAAQ,IAAI,QAAQ;AAAA,UAC7B,MAAM,MAAM;AAAA,QAAA,EACX;AAAA,MACH,OAAO;AACN,kBAAU;AAAA,UACT,EAAE,QAAQ,YAAY,aAAa,YAAY,SAAS,KAAA;AAAA,UACxD,EAAE,QAAQ,YAAY,aAAa,YAAY,SAAS,KAAA;AAAA,QAAK;AAAA,MAE/D;AACA,iBAAW,oBAAoB,OAAO;AAAA,IACvC;AAAA,EACD,GAAG,CAAC,2CAAa,KAAK,CAAC;AACvB,YAAU,MAAM;AACf,QAAI,QAAQ;AACX,YAAM,UAAU,OAAO,KAAK,MAAM,EAAE,IAAI,CAAC,SAAS;AAAA,QACjD,OAAO,WAAW,GAAG;AAAA,QACrB,OAAO;AAAA,MAAA,EACN;AACF,gBAAU,OAAO;AAAA,IAClB;AAAA,EACD,GAAG,CAAC,MAAM,CAAC;AAEX,MAAI,CAAC,aAAa;AACjB,WAAO;AAAA,EACR;AAEA,SACC,qBAAC,KAAA,EAAI,WAAU,+BACd,UAAA;AAAA,IAAA,oBAAC,OAAA,EACA,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QAEA,SAAQ;AAAA,QACR,UAAU;AAAA,QACV,cAAc,YAAY;AAAA,QAC1B,UAAU,YAAY,SAAS,YAAY,CAAC,YAAY;AAAA,MAAA;AAAA,MAJnD,YAAY;AAAA,IAAA,EAKlB,GAPS,YAAY,EAQtB;AAAA,wBACC,OAAA,EACA,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACA,WAAS;AAAA,QACT,OAAM;AAAA,QACN,aAAW;AAAA,QAEX,MAAK;AAAA,QACL,MAAK;AAAA,QACL,UAAU;AAAA,QACV,cAAc,YAAY;AAAA,MAAA;AAAA,MAJrB,YAAY;AAAA,IAAA,EAKlB,GAVS,YAAY,EAWtB;AAAA,wBAEC,OAAA,EACA,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QAEA,SAAQ;AAAA,QACR,OAAM;AAAA,QACN,WAAS;AAAA,QACT,aAAY;AAAA,QACZ,MAAK;AAAA,QACL,MAAK;AAAA,QACL,cAAc,YAAY;AAAA,QAC1B,UAAU,YAAY,SAAS;AAAA,QAC/B,UAAU;AAAA,QACV,aAAa,CAAC,UAAA;;AACb,8BAAO,KAAK,CAAC,WAAW,OAAO,UAAU,KAAK,MAA9C,mBAAiD;AAAA;AAAA,QAEjD,UAAA,iCAAQ,IAAI,CAAC,SACb,oBAAC,UAAA,EAAS,OAAO,KAAK,OAAQ,UAAA,KAAK,MAAA,CAAM;AAAA,MACzC;AAAA,MAfI,YAAY;AAAA,IAAA,EAgBlB,GAlBS,YAAY,EAmBtB;AAAA,EAAA,EAAA,GA1CiD,YAAY,EA2C9D;AAEF;"}
+{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/form-builder/element-edit-forms/table-form.tsx"],"sourcesContent":["// React imports\r\nimport React, { useEffect, useState } from 'react';\r\n\r\n// Material UI imports\r\nimport { MenuItem, Box, SelectChangeEvent } from '@mui/material';\r\n\r\n// Third-party imports\r\nimport { MRT_ColumnDef, MRT_RowData } from 'material-react-table';\r\n\r\n// ERP Common imports\r\nimport Select from '@/components/select/select';\r\nimport TextField from '@/components/text-field/text-field';\r\nimport formatText from '@/utils/format-text';\r\n\r\n// Local imports\r\nimport { IElementJson } from '../custom-form';\r\nimport { ApiFormFields } from '../../Redux/state';\r\nimport FieldSelect from './field-select';\r\nimport '../custom-form.scss';\r\n\r\ninterface ITableEditForm {\r\n\thandlePropertyValueUpdate: (\r\n\t\tevent?: any,\r\n\t\tnumberValue?: any,\r\n\t\tval?: any,\r\n\t\tfieldType?: any\r\n\t) => void;\r\n\thandleColumnsUpdate: (columns: MRT_ColumnDef<MRT_RowData>[]) => void;\r\n\telement: IElementJson | null;\r\n\tfields: ApiFormFields | null;\r\n}\r\n\r\ninterface TableOption {\r\n\tlabel: string;\r\n\tvalue: string;\r\n}\r\n\r\nconst TableEditForm: React.FC<ITableEditForm> = ({\r\n\thandlePropertyValueUpdate,\r\n\telement,\r\n\thandleColumnsUpdate,\r\n\tfields\r\n}) => {\r\n\t/* Local States */\r\n\tconst [elementJSON, setElementJSON] = useState<IElementJson | null>(element);\r\n\tconst [tables, setTables] = useState<TableOption[]>([]);\r\n\r\n\t/* Local Functions */\r\n\tconst handleFieldUpdate = (event: SelectChangeEvent<unknown>) => {\r\n\t\tif (elementJSON) {\r\n\t\t\telementJSON.field_type = event.target.value as string;\r\n\t\t\thandlePropertyValueUpdate(null, null, null, event.target.value as string);\r\n\t\t}\r\n\t};\r\n\tconst handleTableSelect = (event: SelectChangeEvent<unknown>) => {\r\n\t\thandlePropertyValueUpdate(event);\r\n\t};\r\n\r\n\t/* Use Effects */\r\n\tuseEffect(() => {\r\n\t\tsetElementJSON(element);\r\n\t}, [element]);\r\n\tuseEffect(() => {\r\n\t\tif (elementJSON && elementJSON.table && fields) {\r\n\t\t\tconst fieldsArr = fields[elementJSON.table];\r\n\t\t\tlet columns: any[] = [];\r\n\t\t\tif (fieldsArr && fieldsArr?.length) {\r\n\t\t\t\tcolumns = fieldsArr.map((field, index) => ({\r\n\t\t\t\t\theader: formatText(field.field),\r\n\t\t\t\t\taccessorKey: field.field,\r\n\t\t\t\t\tvisible: index > 3 ? false : true,\r\n\t\t\t\t\ttype: field.type\r\n\t\t\t\t}));\r\n\t\t\t} else {\r\n\t\t\t\tcolumns = [\r\n\t\t\t\t\t{ header: 'Column 1', accessorKey: 'column_1', visible: true },\r\n\t\t\t\t\t{ header: 'Column 2', accessorKey: 'column_1', visible: true }\r\n\t\t\t\t];\r\n\t\t\t}\r\n\t\t\tcolumns && handleColumnsUpdate(columns);\r\n\t\t}\r\n\t}, [elementJSON?.table]);\r\n\tuseEffect(() => {\r\n\t\tif (fields) {\r\n\t\t\tconst options = Object.keys(fields).map((key) => ({\r\n\t\t\t\tlabel: formatText(key),\r\n\t\t\t\tvalue: key\r\n\t\t\t}));\r\n\t\t\tsetTables(options);\r\n\t\t}\r\n\t}, [fields]);\r\n\r\n\tif (!elementJSON) {\r\n\t\treturn null;\r\n\t}\r\n\r\n\treturn (\r\n\t\t<Box className='formSection--FieldContainer' key={elementJSON.id}>\r\n\t\t\t<div key={elementJSON.id}>\r\n\t\t\t\t<FieldSelect\r\n\t\t\t\t\tkey={elementJSON.id}\r\n\t\t\t\t\tvariant='outlined'\r\n\t\t\t\t\tonChange={handleFieldUpdate}\r\n\t\t\t\t\tdefaultValue={elementJSON.field_type}\r\n\t\t\t\t\tdisabled={elementJSON.type === 'system' || !elementJSON.is_new}\r\n\t\t\t\t/>\r\n\t\t\t</div>\r\n\t\t\t<div key={elementJSON.id}>\r\n\t\t\t\t<TextField\r\n\t\t\t\t\tfullWidth\r\n\t\t\t\t\tlabel='Label'\r\n\t\t\t\t\tis_required\r\n\t\t\t\t\tkey={elementJSON.id}\r\n\t\t\t\t\tname='label'\r\n\t\t\t\t\ttype='text'\r\n\t\t\t\t\tonChange={handlePropertyValueUpdate}\r\n\t\t\t\t\tdefaultValue={elementJSON.label}\r\n\t\t\t\t/>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div key={elementJSON.id}>\r\n\t\t\t\t<Select\r\n\t\t\t\t\tkey={elementJSON.id}\r\n\t\t\t\t\tvariant='outlined'\r\n\t\t\t\t\tlabel='Table'\r\n\t\t\t\t\tfullWidth\r\n\t\t\t\t\tplaceholder='Select Table'\r\n\t\t\t\t\tsize='small'\r\n\t\t\t\t\tname='table'\r\n\t\t\t\t\tdefaultValue={elementJSON.table}\r\n\t\t\t\t\tdisabled={elementJSON.type === 'system'}\r\n\t\t\t\t\tonChange={handleTableSelect}\r\n\t\t\t\t\trenderValue={(value: string) =>\r\n\t\t\t\t\t\ttables.find((option) => option.value === value)?.label\r\n\t\t\t\t\t}>\r\n\t\t\t\t\t{tables?.map((item) => (\r\n\t\t\t\t\t\t<MenuItem value={item.value}>{item.label}</MenuItem>\r\n\t\t\t\t\t))}\r\n\t\t\t\t</Select>\r\n\t\t\t</div>\r\n\t\t</Box>\r\n\t);\r\n};\r\n\r\nexport default TableEditForm;\r\n"],"names":[],"mappings":"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"}

package/dist/views/form-builder/element-edit-forms/table-form/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/views/form-builder/element-edit-forms/table-form.tsx"],"sourcesContent":["// React imports\nimport React, { useEffect, useState } from 'react';\n\n// Material UI imports\nimport { MenuItem, Box, SelectChangeEvent } from '@mui/material';\n\n// Third-party imports\nimport { MRT_ColumnDef, MRT_RowData } from 'material-react-table';\n\n// ERP Common imports\nimport Select from '@/components/select/select';\nimport TextField from '@/components/text-field/text-field';\nimport formatText from '@/utils/format-text';\n\n// Local imports\nimport { IElementJson } from '../custom-form';\nimport { ApiFormFields } from '../../Redux/state';\nimport FieldSelect from './field-select';\nimport '../custom-form.scss';\n\ninterface ITableEditForm {\n\thandlePropertyValueUpdate: (\n\t\tevent?: any,\n\t\tnumberValue?: any,\n\t\tval?: any,\n\t\tfieldType?: any\n\t) => void;\n\thandleColumnsUpdate: (columns: MRT_ColumnDef<MRT_RowData>[]) => void;\n\telement: IElementJson | null;\n\tfields: ApiFormFields | null;\n}\n\ninterface TableOption {\n\tlabel: string;\n\tvalue: string;\n}\n\nconst TableEditForm: React.FC<ITableEditForm> = ({\n\thandlePropertyValueUpdate,\n\telement,\n\thandleColumnsUpdate,\n\tfields\n}) => {\n\t/* Local States */\n\tconst [elementJSON, setElementJSON] = useState<IElementJson | null>(element);\n\tconst [tables, setTables] = useState<TableOption[]>([]);\n\n\t/* Local Functions */\n\tconst handleFieldUpdate = (event: SelectChangeEvent<unknown>) => {\n\t\tif (elementJSON) {\n\t\t\telementJSON.field_type = event.target.value as string;\n\t\t\thandlePropertyValueUpdate(null, null, null, event.target.value as string);\n\t\t}\n\t};\n\tconst handleTableSelect = (event: SelectChangeEvent<unknown>) => {\n\t\thandlePropertyValueUpdate(event);\n\t};\n\n\t/* Use Effects */\n\tuseEffect(() => {\n\t\tsetElementJSON(element);\n\t}, [element]);\n\tuseEffect(() => {\n\t\tif (elementJSON && elementJSON.table && fields) {\n\t\t\tconst fieldsArr = fields[elementJSON.table];\n\t\t\tlet columns: any[] = [];\n\t\t\tif (fieldsArr && fieldsArr?.length) {\n\t\t\t\tcolumns = fieldsArr.map((field, index) => ({\n\t\t\t\t\theader: formatText(field.field),\n\t\t\t\t\taccessorKey: field.field,\n\t\t\t\t\tvisible: index > 3 ? false : true,\n\t\t\t\t\ttype: field.type\n\t\t\t\t}));\n\t\t\t} else {\n\t\t\t\tcolumns = [\n\t\t\t\t\t{ header: 'Column 1', accessorKey: 'column_1', visible: true },\n\t\t\t\t\t{ header: 'Column 2', accessorKey: 'column_1', visible: true }\n\t\t\t\t];\n\t\t\t}\n\t\t\tcolumns && handleColumnsUpdate(columns);\n\t\t}\n\t}, [elementJSON?.table]);\n\tuseEffect(() => {\n\t\tif (fields) {\n\t\t\tconst options = Object.keys(fields).map((key) => ({\n\t\t\t\tlabel: formatText(key),\n\t\t\t\tvalue: key\n\t\t\t}));\n\t\t\tsetTables(options);\n\t\t}\n\t}, [fields]);\n\n\tif (!elementJSON) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Box className='formSection--FieldContainer' key={elementJSON.id}>\n\t\t\t<div key={elementJSON.id}>\n\t\t\t\t<FieldSelect\n\t\t\t\t\tkey={elementJSON.id}\n\t\t\t\t\tvariant='outlined'\n\t\t\t\t\tonChange={handleFieldUpdate}\n\t\t\t\t\tdefaultValue={elementJSON.field_type}\n\t\t\t\t\tdisabled={elementJSON.type === 'system' || !elementJSON.is_new}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t\t<div key={elementJSON.id}>\n\t\t\t\t<TextField\n\t\t\t\t\tfullWidth\n\t\t\t\t\tlabel='Label'\n\t\t\t\t\tis_required\n\t\t\t\t\tkey={elementJSON.id}\n\t\t\t\t\tname='label'\n\t\t\t\t\ttype='text'\n\t\t\t\t\tonChange={handlePropertyValueUpdate}\n\t\t\t\t\tdefaultValue={elementJSON.label}\n\t\t\t\t/>\n\t\t\t</div>\n\n\t\t\t<div key={elementJSON.id}>\n\t\t\t\t<Select\n\t\t\t\t\tkey={elementJSON.id}\n\t\t\t\t\tvariant='outlined'\n\t\t\t\t\tlabel='Table'\n\t\t\t\t\tfullWidth\n\t\t\t\t\tplaceholder='Select Table'\n\t\t\t\t\tsize='small'\n\t\t\t\t\tname='table'\n\t\t\t\t\tdefaultValue={elementJSON.table}\n\t\t\t\t\tdisabled={elementJSON.type === 'system'}\n\t\t\t\t\tonChange={handleTableSelect}\n\t\t\t\t\trenderValue={(value: string) =>\n\t\t\t\t\t\ttables.find((option) => option.value === value)?.label\n\t\t\t\t\t}>\n\t\t\t\t\t{tables?.map((item) => (\n\t\t\t\t\t\t<MenuItem value={item.value}>{item.label}</MenuItem>\n\t\t\t\t\t))}\n\t\t\t\t</Select>\n\t\t\t</div>\n\t\t</Box>\n\t);\n};\n\nexport default TableEditForm;\n"],"names":["handlePropertyValueUpdate","element","handleColumnsUpdate","fields","elementJSON","setElementJSON","useState","tables","setTables","useEffect","table","fieldsArr","columns","length","map","field","index","header","formatText","accessorKey","visible","type","options","Object","keys","key","label","value","jsxs","Box","className","children","jsx","FieldSelect","variant","onChange","event","field_type","target","defaultValue","disabled","is_new","id","TextField","fullWidth","is_required","name","Select","placeholder","size","renderValue","_a","find","option","item","MenuItem"],"mappings":"qiBAqCgD,EAC/CA,4BACAC,UACAC,sBACAC,aAGA,MAAOC,EAAaC,GAAkBC,EAAAA,SAA8BL,IAC7DM,EAAQC,GAAaF,EAAAA,SAAwB,IA+CpD,OAjCAG,EAAAA,UAAU,KACTJ,EAAeJ,IACb,CAACA,IACJQ,EAAAA,UAAU,KACT,GAAIL,GAAeA,EAAYM,OAASP,EAAQ,CAC/C,MAAMQ,EAAYR,EAAOC,EAAYM,OACrC,IAAIE,EAAiB,GAEpBA,EADGD,UAAaA,WAAWE,QACjBF,EAAUG,IAAI,CAACC,EAAOC,KAAA,CAC/BC,OAAQC,EAAAA,WAAWH,EAAMA,OACzBI,YAAaJ,EAAMA,MACnBK,UAASJ,EAAQ,GACjBK,KAAMN,EAAMM,QAGH,CACT,CAAEJ,OAAQ,WAAYE,YAAa,WAAYC,SAAS,GACxD,CAAEH,OAAQ,WAAYE,YAAa,WAAYC,SAAS,IAG1DR,GAAWV,EAAoBU,EAChC,GACE,CAAC,MAAAR,OAAA,EAAAA,EAAaM,QACjBD,EAAAA,UAAU,KACT,GAAIN,EAAQ,CACX,MAAMmB,EAAUC,OAAOC,KAAKrB,GAAQW,IAAKW,IAAA,CACxCC,MAAOR,EAAAA,WAAWO,GAClBE,MAAOF,KAERjB,EAAUc,EACX,GACE,CAACnB,IAECC,mBAKJwB,KAACC,EAAAA,QAAA,CAAIC,UAAU,8BACdC,SAAA;eAAAC,MAAC,MAAA,CACAD,wBAAAC,EAAAA,IAACC,EAAAA,QAAA,CAEAC,QAAQ,WACRC,SAtDuBC,IACtBhC,IACHA,EAAYiC,WAAaD,EAAME,OAAOX,MACtC3B,EAA0B,KAAM,KAAM,KAAMoC,EAAME,OAAOX,SAoDvDY,aAAcnC,EAAYiC,WAC1BG,SAA+B,WAArBpC,EAAYiB,OAAsBjB,EAAYqC,QAJnDrC,EAAYsC,KAFTtC,EAAYsC;qBASrB,MAAA,CACAX,wBAAAC,EAAAA,IAACW,EAAAA,UAAA,CACAC,WAAS,EACTlB,MAAM,QACNmB,aAAW,EAEXC,KAAK,QACLzB,KAAK,OACLc,SAAUnC,EACVuC,aAAcnC,EAAYsB,OAJrBtB,EAAYsC,KALTtC,EAAYsC;qBAarB,MAAA,CACAX,wBAAAC,EAAAA,IAACe,EAAAA,OAAA,CAEAb,QAAQ,WACRR,MAAM,QACNkB,WAAS,EACTI,YAAY,eACZC,KAAK,QACLH,KAAK,QACLP,aAAcnC,EAAYM,MAC1B8B,SAA+B,WAArBpC,EAAYiB,KACtBc,SA7EuBC,IAC1BpC,EAA0BoC,IA6EvBc,YAAcvB,UACb,OAAA,OAAAwB,EAAA5C,EAAO6C,KAAMC,GAAWA,EAAO1B,QAAUA,SAAzC,EAAAwB,EAAiDzB,OAEjDK,SAAA,MAAAxB,OAAA,EAAAA,EAAQO,IAAKwC,oBACbtB,IAACuB,EAAAA,QAAA,CAAS5B,MAAO2B,EAAK3B,MAAQI,SAAAuB,EAAK5B,UAd/BtB,EAAYsC,KAFTtC,EAAYsC,MAvB2BtC,EAAYsC,IAJvD"}
+{"version":3,"file":"index.js","sources":["../../../../../src/views/form-builder/element-edit-forms/table-form.tsx"],"sourcesContent":["// React imports\r\nimport React, { useEffect, useState } from 'react';\r\n\r\n// Material UI imports\r\nimport { MenuItem, Box, SelectChangeEvent } from '@mui/material';\r\n\r\n// Third-party imports\r\nimport { MRT_ColumnDef, MRT_RowData } from 'material-react-table';\r\n\r\n// ERP Common imports\r\nimport Select from '@/components/select/select';\r\nimport TextField from '@/components/text-field/text-field';\r\nimport formatText from '@/utils/format-text';\r\n\r\n// Local imports\r\nimport { IElementJson } from '../custom-form';\r\nimport { ApiFormFields } from '../../Redux/state';\r\nimport FieldSelect from './field-select';\r\nimport '../custom-form.scss';\r\n\r\ninterface ITableEditForm {\r\n\thandlePropertyValueUpdate: (\r\n\t\tevent?: any,\r\n\t\tnumberValue?: any,\r\n\t\tval?: any,\r\n\t\tfieldType?: any\r\n\t) => void;\r\n\thandleColumnsUpdate: (columns: MRT_ColumnDef<MRT_RowData>[]) => void;\r\n\telement: IElementJson | null;\r\n\tfields: ApiFormFields | null;\r\n}\r\n\r\ninterface TableOption {\r\n\tlabel: string;\r\n\tvalue: string;\r\n}\r\n\r\nconst TableEditForm: React.FC<ITableEditForm> = ({\r\n\thandlePropertyValueUpdate,\r\n\telement,\r\n\thandleColumnsUpdate,\r\n\tfields\r\n}) => {\r\n\t/* Local States */\r\n\tconst [elementJSON, setElementJSON] = useState<IElementJson | null>(element);\r\n\tconst [tables, setTables] = useState<TableOption[]>([]);\r\n\r\n\t/* Local Functions */\r\n\tconst handleFieldUpdate = (event: SelectChangeEvent<unknown>) => {\r\n\t\tif (elementJSON) {\r\n\t\t\telementJSON.field_type = event.target.value as string;\r\n\t\t\thandlePropertyValueUpdate(null, null, null, event.target.value as string);\r\n\t\t}\r\n\t};\r\n\tconst handleTableSelect = (event: SelectChangeEvent<unknown>) => {\r\n\t\thandlePropertyValueUpdate(event);\r\n\t};\r\n\r\n\t/* Use Effects */\r\n\tuseEffect(() => {\r\n\t\tsetElementJSON(element);\r\n\t}, [element]);\r\n\tuseEffect(() => {\r\n\t\tif (elementJSON && elementJSON.table && fields) {\r\n\t\t\tconst fieldsArr = fields[elementJSON.table];\r\n\t\t\tlet columns: any[] = [];\r\n\t\t\tif (fieldsArr && fieldsArr?.length) {\r\n\t\t\t\tcolumns = fieldsArr.map((field, index) => ({\r\n\t\t\t\t\theader: formatText(field.field),\r\n\t\t\t\t\taccessorKey: field.field,\r\n\t\t\t\t\tvisible: index > 3 ? false : true,\r\n\t\t\t\t\ttype: field.type\r\n\t\t\t\t}));\r\n\t\t\t} else {\r\n\t\t\t\tcolumns = [\r\n\t\t\t\t\t{ header: 'Column 1', accessorKey: 'column_1', visible: true },\r\n\t\t\t\t\t{ header: 'Column 2', accessorKey: 'column_1', visible: true }\r\n\t\t\t\t];\r\n\t\t\t}\r\n\t\t\tcolumns && handleColumnsUpdate(columns);\r\n\t\t}\r\n\t}, [elementJSON?.table]);\r\n\tuseEffect(() => {\r\n\t\tif (fields) {\r\n\t\t\tconst options = Object.keys(fields).map((key) => ({\r\n\t\t\t\tlabel: formatText(key),\r\n\t\t\t\tvalue: key\r\n\t\t\t}));\r\n\t\t\tsetTables(options);\r\n\t\t}\r\n\t}, [fields]);\r\n\r\n\tif (!elementJSON) {\r\n\t\treturn null;\r\n\t}\r\n\r\n\treturn (\r\n\t\t<Box className='formSection--FieldContainer' key={elementJSON.id}>\r\n\t\t\t<div key={elementJSON.id}>\r\n\t\t\t\t<FieldSelect\r\n\t\t\t\t\tkey={elementJSON.id}\r\n\t\t\t\t\tvariant='outlined'\r\n\t\t\t\t\tonChange={handleFieldUpdate}\r\n\t\t\t\t\tdefaultValue={elementJSON.field_type}\r\n\t\t\t\t\tdisabled={elementJSON.type === 'system' || !elementJSON.is_new}\r\n\t\t\t\t/>\r\n\t\t\t</div>\r\n\t\t\t<div key={elementJSON.id}>\r\n\t\t\t\t<TextField\r\n\t\t\t\t\tfullWidth\r\n\t\t\t\t\tlabel='Label'\r\n\t\t\t\t\tis_required\r\n\t\t\t\t\tkey={elementJSON.id}\r\n\t\t\t\t\tname='label'\r\n\t\t\t\t\ttype='text'\r\n\t\t\t\t\tonChange={handlePropertyValueUpdate}\r\n\t\t\t\t\tdefaultValue={elementJSON.label}\r\n\t\t\t\t/>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div key={elementJSON.id}>\r\n\t\t\t\t<Select\r\n\t\t\t\t\tkey={elementJSON.id}\r\n\t\t\t\t\tvariant='outlined'\r\n\t\t\t\t\tlabel='Table'\r\n\t\t\t\t\tfullWidth\r\n\t\t\t\t\tplaceholder='Select Table'\r\n\t\t\t\t\tsize='small'\r\n\t\t\t\t\tname='table'\r\n\t\t\t\t\tdefaultValue={elementJSON.table}\r\n\t\t\t\t\tdisabled={elementJSON.type === 'system'}\r\n\t\t\t\t\tonChange={handleTableSelect}\r\n\t\t\t\t\trenderValue={(value: string) =>\r\n\t\t\t\t\t\ttables.find((option) => option.value === value)?.label\r\n\t\t\t\t\t}>\r\n\t\t\t\t\t{tables?.map((item) => (\r\n\t\t\t\t\t\t<MenuItem value={item.value}>{item.label}</MenuItem>\r\n\t\t\t\t\t))}\r\n\t\t\t\t</Select>\r\n\t\t\t</div>\r\n\t\t</Box>\r\n\t);\r\n};\r\n\r\nexport default TableEditForm;\r\n"],"names":["handlePropertyValueUpdate","element","handleColumnsUpdate","fields","elementJSON","setElementJSON","useState","tables","setTables","useEffect","table","fieldsArr","columns","length","map","field","index","header","formatText","accessorKey","visible","type","options","Object","keys","key","label","value","jsxs","Box","className","children","jsx","FieldSelect","variant","onChange","event","field_type","target","defaultValue","disabled","is_new","id","TextField","fullWidth","is_required","name","Select","placeholder","size","renderValue","_a","find","option","item","MenuItem"],"mappings":"qiBAqCgD,EAC/CA,4BACAC,UACAC,sBACAC,aAGA,MAAOC,EAAaC,GAAkBC,EAAAA,SAA8BL,IAC7DM,EAAQC,GAAaF,EAAAA,SAAwB,IA+CpD,OAjCAG,EAAAA,UAAU,KACTJ,EAAeJ,IACb,CAACA,IACJQ,EAAAA,UAAU,KACT,GAAIL,GAAeA,EAAYM,OAASP,EAAQ,CAC/C,MAAMQ,EAAYR,EAAOC,EAAYM,OACrC,IAAIE,EAAiB,GAEpBA,EADGD,UAAaA,WAAWE,QACjBF,EAAUG,IAAI,CAACC,EAAOC,KAAA,CAC/BC,OAAQC,EAAAA,WAAWH,EAAMA,OACzBI,YAAaJ,EAAMA,MACnBK,UAASJ,EAAQ,GACjBK,KAAMN,EAAMM,QAGH,CACT,CAAEJ,OAAQ,WAAYE,YAAa,WAAYC,SAAS,GACxD,CAAEH,OAAQ,WAAYE,YAAa,WAAYC,SAAS,IAG1DR,GAAWV,EAAoBU,EAChC,GACE,CAAC,MAAAR,OAAA,EAAAA,EAAaM,QACjBD,EAAAA,UAAU,KACT,GAAIN,EAAQ,CACX,MAAMmB,EAAUC,OAAOC,KAAKrB,GAAQW,IAAKW,IAAA,CACxCC,MAAOR,EAAAA,WAAWO,GAClBE,MAAOF,KAERjB,EAAUc,EACX,GACE,CAACnB,IAECC,mBAKJwB,KAACC,EAAAA,QAAA,CAAIC,UAAU,8BACdC,SAAA;eAAAC,MAAC,MAAA,CACAD,wBAAAC,EAAAA,IAACC,EAAAA,QAAA,CAEAC,QAAQ,WACRC,SAtDuBC,IACtBhC,IACHA,EAAYiC,WAAaD,EAAME,OAAOX,MACtC3B,EAA0B,KAAM,KAAM,KAAMoC,EAAME,OAAOX,SAoDvDY,aAAcnC,EAAYiC,WAC1BG,SAA+B,WAArBpC,EAAYiB,OAAsBjB,EAAYqC,QAJnDrC,EAAYsC,KAFTtC,EAAYsC;qBASrB,MAAA,CACAX,wBAAAC,EAAAA,IAACW,EAAAA,UAAA,CACAC,WAAS,EACTlB,MAAM,QACNmB,aAAW,EAEXC,KAAK,QACLzB,KAAK,OACLc,SAAUnC,EACVuC,aAAcnC,EAAYsB,OAJrBtB,EAAYsC,KALTtC,EAAYsC;qBAarB,MAAA,CACAX,wBAAAC,EAAAA,IAACe,EAAAA,OAAA,CAEAb,QAAQ,WACRR,MAAM,QACNkB,WAAS,EACTI,YAAY,eACZC,KAAK,QACLH,KAAK,QACLP,aAAcnC,EAAYM,MAC1B8B,SAA+B,WAArBpC,EAAYiB,KACtBc,SA7EuBC,IAC1BpC,EAA0BoC,IA6EvBc,YAAcvB,UACb,OAAA,OAAAwB,EAAA5C,EAAO6C,KAAMC,GAAWA,EAAO1B,QAAUA,SAAzC,EAAAwB,EAAiDzB,OAEjDK,SAAA,MAAAxB,OAAA,EAAAA,EAAQO,IAAKwC,oBACbtB,IAACuB,EAAAA,QAAA,CAAS5B,MAAO2B,EAAK3B,MAAQI,SAAAuB,EAAK5B,UAd/BtB,EAAYsC,KAFTtC,EAAYsC,MAvB2BtC,EAAYsC,IAJvD"}