@erpsquad/common 1.8.40 → 1.8.41

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

@@ -1,30 +1,30 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("react"),t=require("@mui/material"),a=require("@mui/icons-material"),i=require("@mui/icons-material/Close"),o=,/* empty css                                              */n=,/* empty css                                        */r=,/* empty css                                                  */d=,/* empty css                                                  */s=;/* empty css                     */function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}};/* empty css                            */var c=/* @__PURE__ */u(i);function h(i){const[u,h]=l.useState(!1),{handlePropertyValueUpdate:m,handleSelectOptionValueUpdate:p,handleColumnSelect:x,handleWidthChange:f}=i,j=[1,2,3,4,5,6],[b,y]=l.useState(i.element.options||[]),[v,C]=l.useState(i.element),g="radioButton"!==v.field_type,[_,S]=l.useState({label:"",value:"",is_checked:!1}),q=e=>{const l=e.target.name,t=e.target.value,a={..._};a[l]=t,S(a)},F=e=>{v.default_value=e.target.value,m(null,null,e.target.value)};return l.useEffect(()=>{C(i.element),y(i.element.options||[])},[i.element]),l.useEffect(()=>{S({label:"",value:"",is_checked:!1}),h(!1),p(b)},[b]),/* @__PURE__ */e.jsxs(t.Box,{className:"formSection--FieldContainer",children:[
-/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(s.default,{variant:"outlined",onChange:e=>{v.field_type=e.target.value,m(null,null,null,e.target.value)},defaultValue:v.field_type,label:"Field Type",disabled:"system"===v.type||!v.is_new},v.id)},v.id),
-/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(r.default,{fullWidth:!0,label:"Label",is_required:!0,name:"label",type:"text",onChange:m,defaultValue:v.label},v.id)},v.id),
-/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(t.Select,{variant:"outlined",fullWidth:!0,placeholder:"Select Default",size:"small",name:"options",onChange:()=>F,defaultValue:v.default_value,label:"Default",disabled:!b.length,children:null==b?void 0:b.map((l,a)=>/* @__PURE__ */e.jsx(t.MenuItem,{value:l.value,children:l.label},a))},v.id)},v.id),
-/* @__PURE__ */e.jsx(t.FormControl,{children:/* @__PURE__ */e.jsx(t.Select,{fullWidth:!0,placeholder:"Select Column Per Row",size:"small",onChange:x,label:"Select Column Per Row",name:"option",variant:"outlined",children:null==j?void 0:j.map((l,a)=>/* @__PURE__ */e.jsx(t.MenuItem,{value:l,children:l},a))},v.id)}),
-/* @__PURE__ */e.jsxs(t.Box,{children:[
-/* @__PURE__ */e.jsx(d.Typography,{sx:{color:"black"},children:"Adjust Width:"}),
-/* @__PURE__ */e.jsx(t.Slider,{value:null==v?void 0:v.custom_width,name:"custom_width",min:1,max:12,step:1,onChange:(e,l)=>f(l),"aria-labelledby":"width-slider",sx:{color:"#4AC08C"}})]}),
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("react"),a=,/* empty css                                                        */t=,/* empty css                                              */i=,/* empty css                                        */d=,/* empty css                                                  */o=,/* empty css                                                  */n=;/* empty css                     */;/* empty css                            */var s=,/* empty css                                                    */r=,/* empty css                                                          */u=,/* empty css                                                              */c=,/* empty css                                                                    */m=,/* empty css                                                          */h=,/* empty css                                                          */x=,/* empty css                                                          */f=,/* empty css                                                                  */p=;/* empty css                                                                              */function j(j){const[y,b]=l.useState(!1),{handlePropertyValueUpdate:v,handleSelectOptionValueUpdate:g,handleColumnSelect:_,handleWidthChange:C}=j,q=[1,2,3,4,5,6],[S,w]=l.useState(j.element.options||[]),[k,V]=l.useState(j.element),P="radioButton"!==k.field_type,[W,F]=l.useState({label:"",value:"",is_checked:!1}),O=e=>{const l=e.target.name,a=e.target.value,t={...W};t[l]=a,F(t)},T=e=>{k.default_value=e.target.value,v(null,null,e.target.value)};return l.useEffect(()=>{V(j.element),w(j.element.options||[])},[j.element]),l.useEffect(()=>{F({label:"",value:"",is_checked:!1}),b(!1),g(S)},[S]),/* @__PURE__ */e.jsxs(s.default,{className:"formSection--FieldContainer",children:[
+/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(n.default,{variant:"outlined",onChange:e=>{k.field_type=e.target.value,v(null,null,null,e.target.value)},defaultValue:k.field_type,label:"Field Type",disabled:"system"===k.type||!k.is_new},k.id)},k.id),
+/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(d.default,{fullWidth:!0,label:"Label",is_required:!0,name:"label",type:"text",onChange:v,defaultValue:k.label},k.id)},k.id),
+/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(r.default,{variant:"outlined",fullWidth:!0,placeholder:"Select Default",size:"small",name:"options",onChange:()=>T,defaultValue:k.default_value,label:"Default",disabled:!S.length,children:null==S?void 0:S.map((l,a)=>/* @__PURE__ */e.jsx(u.default,{value:l.value,children:l.label},a))},k.id)},k.id),
+/* @__PURE__ */e.jsx(c.default,{children:/* @__PURE__ */e.jsx(r.default,{fullWidth:!0,placeholder:"Select Column Per Row",size:"small",onChange:_,label:"Select Column Per Row",name:"option",variant:"outlined",children:null==q?void 0:q.map((l,a)=>/* @__PURE__ */e.jsx(u.default,{value:l,children:l},a))},k.id)}),
+/* @__PURE__ */e.jsxs(s.default,{children:[
+/* @__PURE__ */e.jsx(o.Typography,{sx:{color:"black"},children:"Adjust Width:"}),
+/* @__PURE__ */e.jsx(m.default,{value:null==k?void 0:k.custom_width,name:"custom_width",min:1,max:12,step:1,onChange:(e,l)=>C(l),"aria-labelledby":"width-slider",sx:{color:"#4AC08C"}})]}),
 /* @__PURE__ */e.jsxs("div",{className:"formSection--SelectOption",children:[
-/* @__PURE__ */e.jsx(d.Typography,{type:"s5",weight:"medium",color:"theme.secondary.800",children:"Options"}),b.map((l,t)=>/* @__PURE__ */e.jsxs("div",{className:"formSection--MultiOptions",children:[
-/* @__PURE__ */e.jsx(r.default,{fullWidth:!0,value:`${l.label} (${l.value})`,InputProps:{readOnly:!0}},t),
-/* @__PURE__ */e.jsx(c.default,{style:{fontSize:"1rem",color:"#656669"},onClick:()=>{y([...b.filter((e,l)=>l!==t)])}})]}))]}),u?/* @__PURE__ */e.jsxs("div",{className:"formSection--SelectOption",children:[
-/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(r.default,{fullWidth:!0,label:"Label",is_required:!0,name:"label",type:"text",placeholder:"Label",defaultValue:_.label,onChange:q})}),
-/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(r.default,{fullWidth:!0,label:"Value",placeholder:"Value",is_required:!0,name:"value",type:"text",defaultValue:_.value,onChange:q})}),
-/* @__PURE__ */e.jsx(t.Button,{onClick:()=>y([...b,{..._}]),disabled:!!b.find(e=>e.value===_.value),variant:"text",className:"formSection--Button",startIcon:/* @__PURE__ */e.jsx(a.Add,{}),children:"Add"})]}):/* @__PURE__ */e.jsx(t.Button,{onClick:()=>h(!0),variant:"text",className:"formSection--Button",startIcon:/* @__PURE__ */e.jsx(a.Add,{}),children:"Add Option"}),
-/* @__PURE__ */e.jsxs(t.FormControl,{children:[
-/* @__PURE__ */e.jsx(d.Typography,{type:"s4",color:"theme.secondary.800",children:"Display style"}),
-/* @__PURE__ */e.jsxs(t.RadioGroup,{row:!0,"aria-labelledby":"demo-radio-buttons-group-label",name:"display",onChange:m,defaultValue:v.display,children:[
-/* @__PURE__ */e.jsx(t.FormControlLabel,{value:"row",control:/* @__PURE__ */e.jsx(n.default,{size:"small"}),label:"Row",slotProps:{typography:{variant:"body2"}}}),
-/* @__PURE__ */e.jsx(t.FormControlLabel,{value:"column",control:/* @__PURE__ */e.jsx(n.default,{size:"small"}),label:"Column",slotProps:{typography:{variant:"body2"}}})]},v.id)]}),
-/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(r.default,{fullWidth:!0,label:"Title",is_required:!0,name:"title",type:"text",onChange:m,defaultValue:v.title},v.id)},v.id),
-/* @__PURE__ */e.jsxs(t.FormControl,{disabled:!g,children:[
-/* @__PURE__ */e.jsx(d.Typography,{type:"s4",color:"theme.secondary.800",children:"Title Position"}),
-/* @__PURE__ */e.jsxs(t.RadioGroup,{row:!0,"aria-labelledby":"demo-radio-buttons-group-label",name:"title_position",onChange:m,defaultValue:g?"end":"",children:[
-/* @__PURE__ */e.jsx(t.FormControlLabel,{value:"start",control:/* @__PURE__ */e.jsx(n.default,{size:"small"}),label:"Start",slotProps:{typography:{variant:"body2"}}}),
-/* @__PURE__ */e.jsx(t.FormControlLabel,{value:"end",control:/* @__PURE__ */e.jsx(n.default,{size:"small"}),label:"End",slotProps:{typography:{variant:"body2"}}})]},v.id)]}),
-/* @__PURE__ */e.jsx(t.FormControlLabel,{name:"is_required",control:/* @__PURE__ */e.jsx(o.default,{}),onChange:m,checked:v.is_required,label:"This field is required"},v.id),
-/* @__PURE__ */e.jsx(t.FormControlLabel,{name:"is_unique",control:/* @__PURE__ */e.jsx(o.default,{}),onChange:m,checked:v.is_unique,label:"Is Unique"},v.id),
-/* @__PURE__ */e.jsx(t.FormControlLabel,{name:"is_fullwidth",control:/* @__PURE__ */e.jsx(o.default,{}),onChange:m,checked:null==v?void 0:v.is_fullwidth,label:"Full Width "},v.id)]},v.id)}exports.CheckboxEditForm=h,exports.default=h;
+/* @__PURE__ */e.jsx(o.Typography,{type:"s5",weight:"medium",color:"theme.secondary.800",children:"Options"}),S.map((l,t)=>/* @__PURE__ */e.jsxs("div",{className:"formSection--MultiOptions",children:[
+/* @__PURE__ */e.jsx(d.default,{fullWidth:!0,value:`${l.label} (${l.value})`,InputProps:{readOnly:!0}},t),
+/* @__PURE__ */e.jsx(a.default,{style:{fontSize:"1rem",color:"#656669"},onClick:()=>{w([...S.filter((e,l)=>l!==t)])}})]}))]}),y?/* @__PURE__ */e.jsxs("div",{className:"formSection--SelectOption",children:[
+/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(d.default,{fullWidth:!0,label:"Label",is_required:!0,name:"label",type:"text",placeholder:"Label",defaultValue:W.label,onChange:O})}),
+/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(d.default,{fullWidth:!0,label:"Value",placeholder:"Value",is_required:!0,name:"value",type:"text",defaultValue:W.value,onChange:O})}),
+/* @__PURE__ */e.jsx(h.default,{onClick:()=>w([...S,{...W}]),disabled:!!S.find(e=>e.value===W.value),variant:"text",className:"formSection--Button",startIcon:/* @__PURE__ */e.jsx(x.default,{}),children:"Add"})]}):/* @__PURE__ */e.jsx(h.default,{onClick:()=>b(!0),variant:"text",className:"formSection--Button",startIcon:/* @__PURE__ */e.jsx(x.default,{}),children:"Add Option"}),
+/* @__PURE__ */e.jsxs(c.default,{children:[
+/* @__PURE__ */e.jsx(o.Typography,{type:"s4",color:"theme.secondary.800",children:"Display style"}),
+/* @__PURE__ */e.jsxs(f.default,{row:!0,"aria-labelledby":"demo-radio-buttons-group-label",name:"display",onChange:v,defaultValue:k.display,children:[
+/* @__PURE__ */e.jsx(p.default,{value:"row",control:/* @__PURE__ */e.jsx(i.default,{size:"small"}),label:"Row",slotProps:{typography:{variant:"body2"}}}),
+/* @__PURE__ */e.jsx(p.default,{value:"column",control:/* @__PURE__ */e.jsx(i.default,{size:"small"}),label:"Column",slotProps:{typography:{variant:"body2"}}})]},k.id)]}),
+/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(d.default,{fullWidth:!0,label:"Title",is_required:!0,name:"title",type:"text",onChange:v,defaultValue:k.title},k.id)},k.id),
+/* @__PURE__ */e.jsxs(c.default,{disabled:!P,children:[
+/* @__PURE__ */e.jsx(o.Typography,{type:"s4",color:"theme.secondary.800",children:"Title Position"}),
+/* @__PURE__ */e.jsxs(f.default,{row:!0,"aria-labelledby":"demo-radio-buttons-group-label",name:"title_position",onChange:v,defaultValue:P?"end":"",children:[
+/* @__PURE__ */e.jsx(p.default,{value:"start",control:/* @__PURE__ */e.jsx(i.default,{size:"small"}),label:"Start",slotProps:{typography:{variant:"body2"}}}),
+/* @__PURE__ */e.jsx(p.default,{value:"end",control:/* @__PURE__ */e.jsx(i.default,{size:"small"}),label:"End",slotProps:{typography:{variant:"body2"}}})]},k.id)]}),
+/* @__PURE__ */e.jsx(p.default,{name:"is_required",control:/* @__PURE__ */e.jsx(t.default,{}),onChange:v,checked:k.is_required,label:"This field is required"},k.id),
+/* @__PURE__ */e.jsx(p.default,{name:"is_unique",control:/* @__PURE__ */e.jsx(t.default,{}),onChange:v,checked:k.is_unique,label:"Is Unique"},k.id),
+/* @__PURE__ */e.jsx(p.default,{name:"is_fullwidth",control:/* @__PURE__ */e.jsx(t.default,{}),onChange:v,checked:null==k?void 0:k.is_fullwidth,label:"Full Width "},k.id)]},k.id)}exports.CheckboxEditForm=j,exports.default=j;
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/views/form-builder/element-edit-forms/checkbox.tsx"],"sourcesContent":["// React imports\r\nimport { useEffect, useState } from \"react\";\r\n\r\n// Material UI imports\r\nimport {\r\n  MenuItem,\r\n  Box,\r\n  FormControlLabel,\r\n  FormControl,\r\n  RadioGroup,\r\n  Button,\r\n  Select,\r\n  InputLabel,\r\n  Slider,\r\n} from \"@mui/material\";\r\nimport { Add } from \"@mui/icons-material\";\r\nimport CloseIcon from \"@mui/icons-material/Close\";\r\n\r\n// ERP Common imports\r\nimport Checkbox from \"@/components/checkbox/checkbox\";\r\nimport Radio from \"@/components/radio/radio\";\r\nimport TextField from \"@/components/text-field/text-field\";\r\nimport Typography from \"@/components/typography/typography\";\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  is_checked: boolean;\r\n  [key: string]: string | boolean; // Index signature to allow any string property\r\n}\r\n\r\nexport function CheckboxEditForm(props: any) {\r\n  const [isAddSelectOption, setAddSelectOption] = useState(false);\r\n  const { handlePropertyValueUpdate, handleSelectOptionValueUpdate , handleColumnSelect ,  handleWidthChange  } = props;\r\n  const columnPerRowOptions = [1, 2, 3, 4, 5, 6];\r\n  const [selectOptions, setSelectOptions] = useState(\r\n    props.element.options || [],\r\n  );\r\n  const [elementJSON, setElementJSON] = useState(props.element);\r\n\r\n  const allowLabelPositionModification =\r\n    elementJSON.field_type !== \"radioButton\";\r\n\r\n  const [newOptions, setNewOptions] = useState<Option>({\r\n    label: \"\",\r\n    value: \"\",\r\n    is_checked: false,\r\n  });\r\n\r\n\r\n\r\n  const handleAddNewOption = (e: any) => {\r\n    const label: string = e.target.name;\r\n    const value: string = e.target.value;\r\n    const option: Option = { ...newOptions };\r\n    option[label] = value;\r\n    setNewOptions(option);\r\n  };\r\n\r\n  const handleFieldUpdate = (e: any) => {\r\n    elementJSON.field_type = e.target.value;\r\n    handlePropertyValueUpdate(null, null, null, e.target.value);\r\n  };\r\n\r\n  const handleSelectUpdate = (e: any) => {\r\n    elementJSON.default_value = e.target.value;\r\n    handlePropertyValueUpdate(null, null, e.target.value);\r\n  };\r\n\r\n  useEffect(() => {\r\n    setElementJSON(props.element);\r\n    setSelectOptions(props.element.options || []);\r\n  }, [props.element]);\r\n\r\n  useEffect(() => {\r\n    setNewOptions({ label: \"\", value: \"\", is_checked: false });\r\n    setAddSelectOption(false);\r\n    handleSelectOptionValueUpdate(selectOptions);\r\n    // eslint-disable-next-line\r\n  }, [selectOptions]);\r\n\r\n  return (\r\n    <Box className=\"formSection--FieldContainer\" key={elementJSON.id}>\r\n      <div key={elementJSON.id}>\r\n        <FieldSelect\r\n          key={elementJSON.id}\r\n          variant=\"outlined\"\r\n          onChange={handleFieldUpdate}\r\n          defaultValue={elementJSON.field_type}\r\n          label=\"Field Type\"\r\n          disabled={elementJSON.type === \"system\" || !elementJSON.is_new}\r\n        />\r\n      </div>\r\n      <div key={elementJSON.id}>\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\r\n      <div key={elementJSON.id}>\r\n        <Select\r\n          variant=\"outlined\"\r\n          key={elementJSON.id}\r\n          fullWidth\r\n          placeholder=\"Select Default\"\r\n          size=\"small\"\r\n          name=\"options\"\r\n          onChange={() => handleSelectUpdate}\r\n          defaultValue={elementJSON.default_value}\r\n          label=\"Default\"\r\n          disabled={!selectOptions.length}\r\n        >\r\n          {selectOptions?.map((option: any, index: number) => (\r\n            <MenuItem key={index} value={option.value}>\r\n              {option.label}\r\n            </MenuItem>\r\n          ))}\r\n        </Select>\r\n      </div>\r\n      <FormControl>\r\n        <Select\r\n          key={elementJSON.id}\r\n          fullWidth\r\n          placeholder=\"Select Column Per Row\"\r\n          size=\"small\"\r\n          onChange={handleColumnSelect} // need to change\r\n          // defaultValue= {} // need to change\r\n          label=\"Select Column Per Row\"\r\n          name=\"option\"\r\n          variant=\"outlined\"\r\n        >\r\n          {columnPerRowOptions?.map((option: any, index: number) => (\r\n            <MenuItem key={index} value={option}>\r\n              {option}\r\n            </MenuItem>\r\n          ))}\r\n        </Select>\r\n      </FormControl>\r\n      <Box>\r\n        <Typography sx={{ color: 'black' }}>Adjust Width:</Typography>\r\n        <Slider\r\n          value = {elementJSON?.custom_width}\r\n          name = \"custom_width\"\r\n          min={1}\r\n          max={12}\r\n          step={1}\r\n          onChange={(_, newValue) => handleWidthChange(newValue)}\r\n          aria-labelledby=\"width-slider\"\r\n          sx = {{color : \"#4AC08C\"}}\r\n        />\r\n      </Box>\r\n    \r\n\r\n      <div className=\"formSection--SelectOption\">\r\n        <Typography type=\"s5\" weight={\"medium\"} color={\"theme.secondary.800\"}>\r\n          Options\r\n        </Typography>\r\n        {selectOptions.map((option: any, index: number) => (\r\n          <div className=\"formSection--MultiOptions\">\r\n            <TextField\r\n              fullWidth\r\n              key={index}\r\n              value={`${option.label} (${option.value})`}\r\n              InputProps={{\r\n                readOnly: true,\r\n              }}\r\n            />\r\n            <CloseIcon\r\n              style={{ fontSize: \"1rem\", color: \"#656669\" }}\r\n              onClick={() => {\r\n                setSelectOptions([\r\n                  ...selectOptions.filter(\r\n                    (_: any, filterIndex: number) => filterIndex !== index,\r\n                  ),\r\n                ]);\r\n              }}\r\n            />\r\n          </div>\r\n        ))}\r\n      </div>\r\n      {isAddSelectOption ? (\r\n        <div className=\"formSection--SelectOption\">\r\n          <div>\r\n            <TextField\r\n              fullWidth\r\n              label=\"Label\"\r\n              is_required\r\n              name=\"label\"\r\n              type=\"text\"\r\n              placeholder=\"Label\"\r\n              defaultValue={newOptions.label}\r\n              onChange={handleAddNewOption}\r\n            />\r\n          </div>\r\n          <div>\r\n            <TextField\r\n              fullWidth\r\n              label=\"Value\"\r\n              placeholder=\"Value\"\r\n              is_required\r\n              name=\"value\"\r\n              type=\"text\"\r\n              defaultValue={newOptions.value}\r\n              onChange={handleAddNewOption}\r\n            />\r\n          </div>\r\n          <Button\r\n            onClick={() =>\r\n              setSelectOptions([...selectOptions, { ...newOptions }])\r\n            }\r\n            disabled={\r\n              !!selectOptions.find(\r\n                (ele: Option) => ele.value === newOptions.value,\r\n              )\r\n            }\r\n            variant=\"text\"\r\n            className=\"formSection--Button\"\r\n            startIcon={<Add />}\r\n          >\r\n            Add\r\n          </Button>\r\n        </div>\r\n      ) : (\r\n        <Button\r\n          onClick={() => setAddSelectOption(true)}\r\n          variant=\"text\"\r\n          className=\"formSection--Button\"\r\n          startIcon={<Add />}\r\n        >\r\n          Add Option\r\n        </Button>\r\n      )}\r\n\r\n      <FormControl>\r\n        <Typography type=\"s4\" color=\"theme.secondary.800\">\r\n          Display style\r\n        </Typography>\r\n        <RadioGroup\r\n          key={elementJSON.id}\r\n          row\r\n          aria-labelledby=\"demo-radio-buttons-group-label\"\r\n          name=\"display\"\r\n          onChange={handlePropertyValueUpdate}\r\n          defaultValue={elementJSON.display}\r\n        >\r\n          <FormControlLabel\r\n            value=\"row\"\r\n            control={<Radio size=\"small\" />}\r\n            label=\"Row\"\r\n            slotProps={{ typography: { variant: \"body2\" } }}\r\n          />\r\n          <FormControlLabel\r\n            value=\"column\"\r\n            control={<Radio size=\"small\" />}\r\n            label=\"Column\"\r\n            slotProps={{ typography: { variant: \"body2\" } }}\r\n          />\r\n        </RadioGroup>\r\n      </FormControl>\r\n\r\n      <div key={elementJSON.id}>\r\n        <TextField\r\n          key={elementJSON.id}\r\n          fullWidth\r\n          label=\"Title\"\r\n          is_required\r\n          name=\"title\"\r\n          type=\"text\"\r\n          onChange={handlePropertyValueUpdate}\r\n          defaultValue={elementJSON.title}\r\n        />\r\n      </div>\r\n\r\n      <FormControl disabled={!allowLabelPositionModification}>\r\n        <Typography type=\"s4\" color=\"theme.secondary.800\">\r\n          Title Position\r\n        </Typography>\r\n        <RadioGroup\r\n          key={elementJSON.id}\r\n          row\r\n          aria-labelledby=\"demo-radio-buttons-group-label\"\r\n          name=\"title_position\"\r\n          onChange={handlePropertyValueUpdate}\r\n          defaultValue={allowLabelPositionModification ? \"end\" : \"\"}\r\n        >\r\n          <FormControlLabel\r\n            value=\"start\"\r\n            control={<Radio size=\"small\" />}\r\n            label=\"Start\"\r\n            slotProps={{ typography: { variant: \"body2\" } }}\r\n          />\r\n          <FormControlLabel\r\n            value=\"end\"\r\n            control={<Radio size=\"small\" />}\r\n            label=\"End\"\r\n            slotProps={{ typography: { variant: \"body2\" } }}\r\n          />\r\n        </RadioGroup>\r\n      </FormControl>\r\n\r\n      <FormControlLabel\r\n        key={elementJSON.id}\r\n        name=\"is_required\"\r\n        control={<Checkbox />}\r\n        onChange={handlePropertyValueUpdate}\r\n        checked={elementJSON.is_required}\r\n        label=\"This field is required\"\r\n      />\r\n      <FormControlLabel\r\n        key={elementJSON.id}\r\n        name=\"is_unique\"\r\n        control={<Checkbox />}\r\n        onChange={handlePropertyValueUpdate}\r\n        checked={elementJSON.is_unique}\r\n        label=\"Is Unique\"\r\n      />\r\n\r\n      <FormControlLabel\r\n        key={elementJSON.id}\r\n        name=\"is_fullwidth\"\r\n        control={<Checkbox />}\r\n        onChange={handlePropertyValueUpdate} // need to change this\r\n        checked={elementJSON?.is_fullwidth}// need to change \r\n        label=\"Full Width \"\r\n      />\r\n    </Box>\r\n  );\r\n}\r\n\r\nexport default CheckboxEditForm;\r\n"],"names":["CheckboxEditForm","props","isAddSelectOption","setAddSelectOption","useState","handlePropertyValueUpdate","handleSelectOptionValueUpdate","handleColumnSelect","handleWidthChange","columnPerRowOptions","selectOptions","setSelectOptions","element","options","elementJSON","setElementJSON","allowLabelPositionModification","field_type","newOptions","setNewOptions","label","value","is_checked","handleAddNewOption","e","target","name","option","handleSelectUpdate","default_value","useEffect","jsxs","Box","className","children","jsx","FieldSelect","variant","onChange","defaultValue","disabled","type","is_new","id","TextField","fullWidth","is_required","Select","placeholder","size","length","map","index","MenuItem","FormControl","Typography","sx","color","Slider","custom_width","min","max","step","_","newValue","weight","InputProps","readOnly","CloseIcon","style","fontSize","onClick","filter","filterIndex","Button","find","ele","startIcon","Add","RadioGroup","row","display","FormControlLabel","control","Radio","slotProps","typography","title","Checkbox","checked","is_unique","is_fullwidth"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/views/form-builder/element-edit-forms/checkbox.tsx"],"sourcesContent":["// React imports\r\nimport { useEffect, useState } from \"react\";\r\n\r\n// Material UI imports\r\nimport {\r\n  MenuItem,\r\n  Box,\r\n  FormControlLabel,\r\n  FormControl,\r\n  RadioGroup,\r\n  Button,\r\n  Select,\r\n  InputLabel,\r\n  Slider,\r\n} from \"@mui/material\";\r\nimport { Add } from \"@mui/icons-material\";\r\nimport CloseIcon from \"@mui/icons-material/Close\";\r\n\r\n// ERP Common imports\r\nimport Checkbox from \"@/components/checkbox/checkbox\";\r\nimport Radio from \"@/components/radio/radio\";\r\nimport TextField from \"@/components/text-field/text-field\";\r\nimport Typography from \"@/components/typography/typography\";\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  is_checked: boolean;\r\n  [key: string]: string | boolean; // Index signature to allow any string property\r\n}\r\n\r\nexport function CheckboxEditForm(props: any) {\r\n  const [isAddSelectOption, setAddSelectOption] = useState(false);\r\n  const { handlePropertyValueUpdate, handleSelectOptionValueUpdate , handleColumnSelect ,  handleWidthChange  } = props;\r\n  const columnPerRowOptions = [1, 2, 3, 4, 5, 6];\r\n  const [selectOptions, setSelectOptions] = useState(\r\n    props.element.options || [],\r\n  );\r\n  const [elementJSON, setElementJSON] = useState(props.element);\r\n\r\n  const allowLabelPositionModification =\r\n    elementJSON.field_type !== \"radioButton\";\r\n\r\n  const [newOptions, setNewOptions] = useState<Option>({\r\n    label: \"\",\r\n    value: \"\",\r\n    is_checked: false,\r\n  });\r\n\r\n\r\n\r\n  const handleAddNewOption = (e: any) => {\r\n    const label: string = e.target.name;\r\n    const value: string = e.target.value;\r\n    const option: Option = { ...newOptions };\r\n    option[label] = value;\r\n    setNewOptions(option);\r\n  };\r\n\r\n  const handleFieldUpdate = (e: any) => {\r\n    elementJSON.field_type = e.target.value;\r\n    handlePropertyValueUpdate(null, null, null, e.target.value);\r\n  };\r\n\r\n  const handleSelectUpdate = (e: any) => {\r\n    elementJSON.default_value = e.target.value;\r\n    handlePropertyValueUpdate(null, null, e.target.value);\r\n  };\r\n\r\n  useEffect(() => {\r\n    setElementJSON(props.element);\r\n    setSelectOptions(props.element.options || []);\r\n  }, [props.element]);\r\n\r\n  useEffect(() => {\r\n    setNewOptions({ label: \"\", value: \"\", is_checked: false });\r\n    setAddSelectOption(false);\r\n    handleSelectOptionValueUpdate(selectOptions);\r\n    // eslint-disable-next-line\r\n  }, [selectOptions]);\r\n\r\n  return (\r\n    <Box className=\"formSection--FieldContainer\" key={elementJSON.id}>\r\n      <div key={elementJSON.id}>\r\n        <FieldSelect\r\n          key={elementJSON.id}\r\n          variant=\"outlined\"\r\n          onChange={handleFieldUpdate}\r\n          defaultValue={elementJSON.field_type}\r\n          label=\"Field Type\"\r\n          disabled={elementJSON.type === \"system\" || !elementJSON.is_new}\r\n        />\r\n      </div>\r\n      <div key={elementJSON.id}>\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\r\n      <div key={elementJSON.id}>\r\n        <Select\r\n          variant=\"outlined\"\r\n          key={elementJSON.id}\r\n          fullWidth\r\n          placeholder=\"Select Default\"\r\n          size=\"small\"\r\n          name=\"options\"\r\n          onChange={() => handleSelectUpdate}\r\n          defaultValue={elementJSON.default_value}\r\n          label=\"Default\"\r\n          disabled={!selectOptions.length}\r\n        >\r\n          {selectOptions?.map((option: any, index: number) => (\r\n            <MenuItem key={index} value={option.value}>\r\n              {option.label}\r\n            </MenuItem>\r\n          ))}\r\n        </Select>\r\n      </div>\r\n      <FormControl>\r\n        <Select\r\n          key={elementJSON.id}\r\n          fullWidth\r\n          placeholder=\"Select Column Per Row\"\r\n          size=\"small\"\r\n          onChange={handleColumnSelect} // need to change\r\n          // defaultValue= {} // need to change\r\n          label=\"Select Column Per Row\"\r\n          name=\"option\"\r\n          variant=\"outlined\"\r\n        >\r\n          {columnPerRowOptions?.map((option: any, index: number) => (\r\n            <MenuItem key={index} value={option}>\r\n              {option}\r\n            </MenuItem>\r\n          ))}\r\n        </Select>\r\n      </FormControl>\r\n      <Box>\r\n        <Typography sx={{ color: 'black' }}>Adjust Width:</Typography>\r\n        <Slider\r\n          value = {elementJSON?.custom_width}\r\n          name = \"custom_width\"\r\n          min={1}\r\n          max={12}\r\n          step={1}\r\n          onChange={(_, newValue) => handleWidthChange(newValue)}\r\n          aria-labelledby=\"width-slider\"\r\n          sx = {{color : \"#4AC08C\"}}\r\n        />\r\n      </Box>\r\n    \r\n\r\n      <div className=\"formSection--SelectOption\">\r\n        <Typography type=\"s5\" weight={\"medium\"} color={\"theme.secondary.800\"}>\r\n          Options\r\n        </Typography>\r\n        {selectOptions.map((option: any, index: number) => (\r\n          <div className=\"formSection--MultiOptions\">\r\n            <TextField\r\n              fullWidth\r\n              key={index}\r\n              value={`${option.label} (${option.value})`}\r\n              InputProps={{\r\n                readOnly: true,\r\n              }}\r\n            />\r\n            <CloseIcon\r\n              style={{ fontSize: \"1rem\", color: \"#656669\" }}\r\n              onClick={() => {\r\n                setSelectOptions([\r\n                  ...selectOptions.filter(\r\n                    (_: any, filterIndex: number) => filterIndex !== index,\r\n                  ),\r\n                ]);\r\n              }}\r\n            />\r\n          </div>\r\n        ))}\r\n      </div>\r\n      {isAddSelectOption ? (\r\n        <div className=\"formSection--SelectOption\">\r\n          <div>\r\n            <TextField\r\n              fullWidth\r\n              label=\"Label\"\r\n              is_required\r\n              name=\"label\"\r\n              type=\"text\"\r\n              placeholder=\"Label\"\r\n              defaultValue={newOptions.label}\r\n              onChange={handleAddNewOption}\r\n            />\r\n          </div>\r\n          <div>\r\n            <TextField\r\n              fullWidth\r\n              label=\"Value\"\r\n              placeholder=\"Value\"\r\n              is_required\r\n              name=\"value\"\r\n              type=\"text\"\r\n              defaultValue={newOptions.value}\r\n              onChange={handleAddNewOption}\r\n            />\r\n          </div>\r\n          <Button\r\n            onClick={() =>\r\n              setSelectOptions([...selectOptions, { ...newOptions }])\r\n            }\r\n            disabled={\r\n              !!selectOptions.find(\r\n                (ele: Option) => ele.value === newOptions.value,\r\n              )\r\n            }\r\n            variant=\"text\"\r\n            className=\"formSection--Button\"\r\n            startIcon={<Add />}\r\n          >\r\n            Add\r\n          </Button>\r\n        </div>\r\n      ) : (\r\n        <Button\r\n          onClick={() => setAddSelectOption(true)}\r\n          variant=\"text\"\r\n          className=\"formSection--Button\"\r\n          startIcon={<Add />}\r\n        >\r\n          Add Option\r\n        </Button>\r\n      )}\r\n\r\n      <FormControl>\r\n        <Typography type=\"s4\" color=\"theme.secondary.800\">\r\n          Display style\r\n        </Typography>\r\n        <RadioGroup\r\n          key={elementJSON.id}\r\n          row\r\n          aria-labelledby=\"demo-radio-buttons-group-label\"\r\n          name=\"display\"\r\n          onChange={handlePropertyValueUpdate}\r\n          defaultValue={elementJSON.display}\r\n        >\r\n          <FormControlLabel\r\n            value=\"row\"\r\n            control={<Radio size=\"small\" />}\r\n            label=\"Row\"\r\n            slotProps={{ typography: { variant: \"body2\" } }}\r\n          />\r\n          <FormControlLabel\r\n            value=\"column\"\r\n            control={<Radio size=\"small\" />}\r\n            label=\"Column\"\r\n            slotProps={{ typography: { variant: \"body2\" } }}\r\n          />\r\n        </RadioGroup>\r\n      </FormControl>\r\n\r\n      <div key={elementJSON.id}>\r\n        <TextField\r\n          key={elementJSON.id}\r\n          fullWidth\r\n          label=\"Title\"\r\n          is_required\r\n          name=\"title\"\r\n          type=\"text\"\r\n          onChange={handlePropertyValueUpdate}\r\n          defaultValue={elementJSON.title}\r\n        />\r\n      </div>\r\n\r\n      <FormControl disabled={!allowLabelPositionModification}>\r\n        <Typography type=\"s4\" color=\"theme.secondary.800\">\r\n          Title Position\r\n        </Typography>\r\n        <RadioGroup\r\n          key={elementJSON.id}\r\n          row\r\n          aria-labelledby=\"demo-radio-buttons-group-label\"\r\n          name=\"title_position\"\r\n          onChange={handlePropertyValueUpdate}\r\n          defaultValue={allowLabelPositionModification ? \"end\" : \"\"}\r\n        >\r\n          <FormControlLabel\r\n            value=\"start\"\r\n            control={<Radio size=\"small\" />}\r\n            label=\"Start\"\r\n            slotProps={{ typography: { variant: \"body2\" } }}\r\n          />\r\n          <FormControlLabel\r\n            value=\"end\"\r\n            control={<Radio size=\"small\" />}\r\n            label=\"End\"\r\n            slotProps={{ typography: { variant: \"body2\" } }}\r\n          />\r\n        </RadioGroup>\r\n      </FormControl>\r\n\r\n      <FormControlLabel\r\n        key={elementJSON.id}\r\n        name=\"is_required\"\r\n        control={<Checkbox />}\r\n        onChange={handlePropertyValueUpdate}\r\n        checked={elementJSON.is_required}\r\n        label=\"This field is required\"\r\n      />\r\n      <FormControlLabel\r\n        key={elementJSON.id}\r\n        name=\"is_unique\"\r\n        control={<Checkbox />}\r\n        onChange={handlePropertyValueUpdate}\r\n        checked={elementJSON.is_unique}\r\n        label=\"Is Unique\"\r\n      />\r\n\r\n      <FormControlLabel\r\n        key={elementJSON.id}\r\n        name=\"is_fullwidth\"\r\n        control={<Checkbox />}\r\n        onChange={handlePropertyValueUpdate} // need to change this\r\n        checked={elementJSON?.is_fullwidth}// need to change \r\n        label=\"Full Width \"\r\n      />\r\n    </Box>\r\n  );\r\n}\r\n\r\nexport default CheckboxEditForm;\r\n"],"names":["CheckboxEditForm","props","isAddSelectOption","setAddSelectOption","useState","handlePropertyValueUpdate","handleSelectOptionValueUpdate","handleColumnSelect","handleWidthChange","columnPerRowOptions","selectOptions","setSelectOptions","element","options","elementJSON","setElementJSON","allowLabelPositionModification","field_type","newOptions","setNewOptions","label","value","is_checked","handleAddNewOption","e","target","name","option","handleSelectUpdate","default_value","useEffect","jsxs","Box","className","children","jsx","FieldSelect","variant","onChange","defaultValue","disabled","type","is_new","id","TextField","fullWidth","is_required","Select","placeholder","size","length","map","index","MenuItem","FormControl","Typography","sx","color","Slider","custom_width","min","max","step","_","newValue","weight","InputProps","readOnly","CloseIcon","style","fontSize","onClick","filter","filterIndex","Button","find","ele","startIcon","Add","RadioGroup","row","display","FormControlLabel","control","Radio","slotProps","typography","title","Checkbox","checked","is_unique","is_fullwidth"],"mappings":"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"}

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

@@ -1,7 +1,11 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
-import { Box, TextField, InputAdornment, IconButton } from "@mui/material";
-import { Add, Remove } from "@mui/icons-material";
+import Box from "../../../../node_modules/@mui/material/Box/Box/index.esm.js";
+import TextField from "../../../../node_modules/@mui/material/TextField/TextField/index.esm.js";
+import InputAdornment from "../../../../node_modules/@mui/material/InputAdornment/InputAdornment/index.esm.js";
+import IconButton from "../../../../node_modules/@mui/material/IconButton/IconButton/index.esm.js";
+import Add from "../../../../node_modules/@mui/icons-material/esm/Add/index.esm.js";
+import Remove from "../../../../node_modules/@mui/icons-material/esm/Remove/index.esm.js";
 function ColumnWidth({ onChange }) {
   const [value, setValue] = useState(6);
   const handleIncrement = () => {

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\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 default function ColumnWidth({onChange}) {\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) => {\r\n    const newValue = 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}"],"names":[],"mappings":";;;;AAOA,SAAwB,YAAY,EAAC,YAAW;AAC9C,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,UAAU;AACnC,UAAM,WAAW,SAAS,MAAM,OAAO,KAAK,KAAK;AACjD,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 default function ColumnWidth({onChange}) {\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) => {\r\n    const newValue = 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}"],"names":[],"mappings":";;;;;;;;AAOA,SAAwB,YAAY,EAAC,YAAW;AAC9C,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,UAAU;AACnC,UAAM,WAAW,SAAS,MAAM,OAAO,KAAK,KAAK;AACjD,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

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("react"),t=require("@mui/material"),r=require("@mui/icons-material");exports.default=function({onChange:o}){const[i,s]=n.useState(6);return n.useEffect(()=>{o(i)},[i]),/* @__PURE__ */e.jsxs(t.Box,{sx:{display:"flex",alignItems:"center",gap:2,p:4},children:[
-/* @__PURE__ */e.jsx(t.TextField,{value:i,onChange:e=>{const n=parseInt(e.target.value)||0;s(Math.max(0,n))},name:"custom_width",size:"small",sx:{width:"120px","& .MuiOutlinedInput-root":{paddingLeft:0,paddingRight:0,"& input":{textAlign:"center",padding:"8px 4px"}}},InputProps:{startAdornment:/* @__PURE__ */e.jsx(t.InputAdornment,{position:"start",children:/* @__PURE__ */e.jsx(t.IconButton,{onClick:()=>{s(e=>Math.max(0,e-1))},size:"small",sx:{marginLeft:"-4px",borderRadius:"4px 0 0 4px",border:"none","&:hover":{backgroundColor:"rgba(0, 0, 0, 0.04)"}},children:/* @__PURE__ */e.jsx(r.Remove,{fontSize:"small"})})}),endAdornment:/* @__PURE__ */e.jsx(t.InputAdornment,{position:"end",children:/* @__PURE__ */e.jsx(t.IconButton,{onClick:()=>{s(e=>e+1)},size:"small",sx:{marginRight:"-4px",borderRadius:"0 4px 4px 0",border:"none","&:hover":{backgroundColor:"rgba(0, 0, 0, 0.04)"}},children:/* @__PURE__ */e.jsx(r.Add,{fontSize:"small"})})})},inputProps:{type:"number",min:0}}),
-/* @__PURE__ */e.jsxs(t.Box,{sx:{ml:2,color:"text.secondary"},children:["Current value: ",i]})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("react"),t=require("../../../../node_modules/@mui/material/Box/Box/index.js"),r=require("../../../../node_modules/@mui/material/TextField/TextField/index.js"),i=require("../../../../node_modules/@mui/material/InputAdornment/InputAdornment/index.js"),d=require("../../../../node_modules/@mui/material/IconButton/IconButton/index.js"),o=require("../../../../node_modules/@mui/icons-material/esm/Add/index.js"),s=require("../../../../node_modules/@mui/icons-material/esm/Remove/index.js");exports.default=function({onChange:a}){const[u,l]=n.useState(6);return n.useEffect(()=>{a(u)},[u]),/* @__PURE__ */e.jsxs(t.default,{sx:{display:"flex",alignItems:"center",gap:2,p:4},children:[
+/* @__PURE__ */e.jsx(r.default,{value:u,onChange:e=>{const n=parseInt(e.target.value)||0;l(Math.max(0,n))},name:"custom_width",size:"small",sx:{width:"120px","& .MuiOutlinedInput-root":{paddingLeft:0,paddingRight:0,"& input":{textAlign:"center",padding:"8px 4px"}}},InputProps:{startAdornment:/* @__PURE__ */e.jsx(i.default,{position:"start",children:/* @__PURE__ */e.jsx(d.default,{onClick:()=>{l(e=>Math.max(0,e-1))},size:"small",sx:{marginLeft:"-4px",borderRadius:"4px 0 0 4px",border:"none","&:hover":{backgroundColor:"rgba(0, 0, 0, 0.04)"}},children:/* @__PURE__ */e.jsx(s.default,{fontSize:"small"})})}),endAdornment:/* @__PURE__ */e.jsx(i.default,{position:"end",children:/* @__PURE__ */e.jsx(d.default,{onClick:()=>{l(e=>e+1)},size:"small",sx:{marginRight:"-4px",borderRadius:"0 4px 4px 0",border:"none","&:hover":{backgroundColor:"rgba(0, 0, 0, 0.04)"}},children:/* @__PURE__ */e.jsx(o.default,{fontSize:"small"})})})},inputProps:{type:"number",min:0}}),
+/* @__PURE__ */e.jsxs(t.default,{sx:{ml:2,color:"text.secondary"},children:["Current value: ",u]})]})};
 //# sourceMappingURL=index.js.map

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\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 default function ColumnWidth({onChange}) {\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) => {\r\n    const newValue = 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}"],"names":["onChange","value","setValue","useState","useEffect","jsxs","Box","sx","display","alignItems","gap","p","children","jsx","TextField","event","newValue","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":"sMAOA,UAAoCA,SAACA,IACnC,MAAOC,EAAOC,GAAYC,EAAAA,SAAS,GAmBnC,OAJAC,EAAAA,UAAU,KACRJ,EAASC,IACR,CAACA,qBAGFI,KAACC,EAAAA,IAAA,CAAIC,GAAI,CAAEC,QAAS,OAAQC,WAAY,SAAUC,IAAK,EAAGC,EAAG,GAC3DC,SAAA;eAAAC,EAAAA,IAACC,EAAAA,UAAA,CACCb,QACAD,SAbqBe,IACzB,MAAMC,EAAWC,SAASF,EAAMG,OAAOjB,QAAU,EACjDC,EAASiB,KAAKC,IAAI,EAAGJ,KAYjBK,KAAK,eACLC,KAAK,QACLf,GAAI,CACFgB,MAAO,QACP,2BAA4B,CAC1BC,YAAa,EACbC,aAAc,EACd,UAAW,CACTC,UAAW,SACXC,QAAS,aAIfC,WAAY,CACVC,gCACEhB,IAACiB,EAAAA,eAAA,CAAeC,SAAS,QACvBnB,wBAAAC,EAAAA,IAACmB,EAAAA,WAAA,CACCC,QAnCU,KACtB/B,KAAiBiB,KAAKC,IAAI,EAAGc,EAAO,KAmCxBZ,KAAK,QACLf,GAAI,CACF4B,WAAY,OACZC,aAAc,cACdC,OAAQ,OACR,UAAW,CACTC,gBAAiB,wBAIrB1B,0BAAAC,IAAC0B,EAAAA,OAAA,CAAOC,SAAS,cAIvBC,8BACE5B,IAACiB,EAAAA,eAAA,CAAeC,SAAS,MACvBnB,wBAAAC,EAAAA,IAACmB,EAAAA,WAAA,CACCC,QAzDU,KACtB/B,EAASgC,GAAQA,EAAO,IAyDZZ,KAAK,QACLf,GAAI,CACFmC,YAAa,OACbN,aAAc,cACdC,OAAQ,OACR,UAAW,CACTC,gBAAiB,wBAIrB1B,0BAAAC,IAAC8B,EAAAA,IAAA,CAAIH,SAAS,eAKtBI,WAAY,CACVC,KAAM,SACNC,IAAK;eAITzC,OAACC,EAAAA,KAAIC,GAAI,CAAEwC,GAAI,EAAGC,MAAO,kBAAoBpC,SAAA,CAAA,kBAC3BX,OAIxB"}
+{"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 default function ColumnWidth({onChange}) {\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) => {\r\n    const newValue = 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}"],"names":["onChange","value","setValue","useState","useEffect","jsxs","Box","sx","display","alignItems","gap","p","children","jsx","TextField","event","newValue","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":"umBAOA,UAAoCA,SAACA,IACnC,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,SAASF,EAAMG,OAAOjB,QAAU,EACjDC,EAASiB,KAAKC,IAAI,EAAGJ,KAYjBK,KAAK,eACLC,KAAK,QACLf,GAAI,CACFgB,MAAO,QACP,2BAA4B,CAC1BC,YAAa,EACbC,aAAc,EACd,UAAW,CACTC,UAAW,SACXC,QAAS,aAIfC,WAAY,CACVC,gCACEhB,IAACiB,EAAAA,QAAA,CAAeC,SAAS,QACvBnB,wBAAAC,EAAAA,IAACmB,EAAAA,QAAA,CACCC,QAnCU,KACtB/B,KAAiBiB,KAAKC,IAAI,EAAGc,EAAO,KAmCxBZ,KAAK,QACLf,GAAI,CACF4B,WAAY,OACZC,aAAc,cACdC,OAAQ,OACR,UAAW,CACTC,gBAAiB,wBAIrB1B,0BAAAC,IAAC0B,EAAAA,QAAA,CAAOC,SAAS,cAIvBC,8BACE5B,IAACiB,EAAAA,QAAA,CAAeC,SAAS,MACvBnB,wBAAAC,EAAAA,IAACmB,EAAAA,QAAA,CACCC,QAzDU,KACtB/B,EAASgC,GAAQA,EAAO,IAyDZZ,KAAK,QACLf,GAAI,CACFmC,YAAa,OACbN,aAAc,cACdC,OAAQ,OACR,UAAW,CACTC,gBAAiB,wBAIrB1B,0BAAAC,IAAC8B,EAAAA,QAAA,CAAIH,SAAS,eAKtBI,WAAY,CACVC,KAAM,SACNC,IAAK;eAITzC,OAACC,EAAAA,SAAIC,GAAI,CAAEwC,GAAI,EAAGC,MAAO,kBAAoBpC,SAAA,CAAA,kBAC3BX,OAIxB"}

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

@@ -1,6 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
-import { MenuItem, Stack } from "@mui/material";
 import Select from "../../../../components/select/select/index.esm.js";
 import { Typography } from "../../../../components/typography/typography/index.esm.js";
 import { Paragraph } from "../../../../components/icons/paragraph/index.esm.js";
@@ -21,6 +20,8 @@ import { LinkHorizontal } from "../../../../components/icons/link-horizontal/ind
 import { InfoCircle } from "../../../../components/icons/info-circle/index.esm.js";
 import { ToggleSwitch } from "../../../../components/icons/toggle-switch/index.esm.js";
 import { RadioButton } from "../../../../components/icons/radio-button/index.esm.js";
+import MenuItem from "../../../../node_modules/@mui/material/MenuItem/MenuItem/index.esm.js";
+import Stack from "../../../../node_modules/@mui/material/Stack/Stack/index.esm.js";
 const fields = [
   { label: "Text", value: "text", icon: Paragraph },
   { label: "Number", value: "number", icon: Hashtag },

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\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;"}
+{"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

@@ -1,3 +1,3 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("react"),o=require("@mui/material"),i=require("../../../../components/select/select/index.js"),l=require("../../../../components/typography/typography/index.js"),a=require("../../../../components/icons/paragraph/index.js"),r=require("../../../../components/icons/hashtag/index.js"),c=require("../../../../components/icons/arrow-circle-down/index.js"),t=require("../../../../components/icons/calendar/index.js"),s=require("../../../../components/icons/paper-clip/index.js"),u=require("../../../../components/icons/link/index.js"),d=require("../../../../components/icons/email/index.js"),p=require("../../../../components/icons/phone/index.js"),m=require("../../../../components/icons/dollar-circle/index.js"),x=require("../../../../components/icons/clock/index.js"),h=require("../../../../components/icons/grid/index.js"),b=require("../../../../components/icons/location/index.js"),v=require("../../../../components/icons/checkbox-square/index.js"),g=require("../../../../components/icons/image/index.js"),j=require("../../../../components/icons/link-horizontal/index.js"),q=require("../../../../components/icons/info-circle/index.js"),f=require("../../../../components/icons/toggle-switch/index.js"),y=require("../../../../components/icons/radio-button/index.js");const k=[{label:"Text",value:"text",icon:a.Paragraph},{label:"Number",value:"number",icon:r.Hashtag},{label:"Select",value:"select",icon:c.ArrowCircleDown},{label:"Date",value:"date",icon:t.Calendar},{label:"Files & Media",value:"file",icon:s.PaperClip},{label:"URL",value:"url",icon:u.Link},{label:"Email",value:"email",icon:d.Email},{label:"Phone",value:"phone",icon:p.Phone},{label:"Currency",value:"currency",icon:m.DollarCircle},{label:"Time",value:"time",icon:x.Clock},{label:"Table",value:"table",icon:h.Grid},{label:"Geolocation",value:"geoLocation",icon:b.Location},{label:"Check Box",value:"checkbox",icon:v.CheckboxSquare},{label:"Image Upload",value:"image",icon:g.Image},{label:"Relation Field",value:"relation",icon:j.LinkHorizontal},{label:"Info Card",value:"info",icon:q.InfoCircle},{label:"Toggle Button",value:"toggleButton",icon:f.ToggleSwitch},{label:"Radio Button",value:"radioButton",icon:y.RadioButton},{label:"tagsInput",value:"tagsInput",icon:a.Paragraph}];exports.default=a=>{const[r,c]=n.useState(k),[t,s]=n.useState(""),u=e=>{s(e.target.value)};return n.useEffect(()=>{var e;c((e=t)?[...k.filter(n=>n.value.includes(e))]:k)},[t]),/* @__PURE__ */e.jsx(i.default,{fullWidth:!0,placeholder:"Select Field",size:"small",labelName:"Field Type",renderValue:e=>{var n;return null==(n=k.find(n=>n.value===e))?void 0:n.label},handleSearch:()=>u,searchPlaceholder:"Search Attributes",searchValue:t,...a,children:r.map(n=>/* @__PURE__ */e.jsx(o.MenuItem,{value:n.value,onKeyDown:e=>e.stopPropagation(),children:/* @__PURE__ */e.jsxs(o.Stack,{direction:"row",spacing:1,alignItems:"center",children:[n.icon&&/* @__PURE__ */e.jsx(n.icon,{fontSize:"small"}),
-/* @__PURE__ */e.jsx(l.Typography,{type:"s3",color:"theme.secondary.1000",children:n.label})]})}))})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("react"),o=require("../../../../components/select/select/index.js"),i=require("../../../../components/typography/typography/index.js"),l=require("../../../../components/icons/paragraph/index.js"),a=require("../../../../components/icons/hashtag/index.js"),r=require("../../../../components/icons/arrow-circle-down/index.js"),c=require("../../../../components/icons/calendar/index.js"),t=require("../../../../components/icons/paper-clip/index.js"),s=require("../../../../components/icons/link/index.js"),u=require("../../../../components/icons/email/index.js"),d=require("../../../../components/icons/phone/index.js"),p=require("../../../../components/icons/dollar-circle/index.js"),m=require("../../../../components/icons/clock/index.js"),x=require("../../../../components/icons/grid/index.js"),h=require("../../../../components/icons/location/index.js"),b=require("../../../../components/icons/checkbox-square/index.js"),j=require("../../../../components/icons/image/index.js"),v=require("../../../../components/icons/link-horizontal/index.js"),g=require("../../../../components/icons/info-circle/index.js"),q=require("../../../../components/icons/toggle-switch/index.js"),f=require("../../../../components/icons/radio-button/index.js"),y=require("../../../../node_modules/@mui/material/MenuItem/MenuItem/index.js"),k=require("../../../../node_modules/@mui/material/Stack/Stack/index.js");const S=[{label:"Text",value:"text",icon:l.Paragraph},{label:"Number",value:"number",icon:a.Hashtag},{label:"Select",value:"select",icon:r.ArrowCircleDown},{label:"Date",value:"date",icon:c.Calendar},{label:"Files & Media",value:"file",icon:t.PaperClip},{label:"URL",value:"url",icon:s.Link},{label:"Email",value:"email",icon:u.Email},{label:"Phone",value:"phone",icon:d.Phone},{label:"Currency",value:"currency",icon:p.DollarCircle},{label:"Time",value:"time",icon:m.Clock},{label:"Table",value:"table",icon:x.Grid},{label:"Geolocation",value:"geoLocation",icon:h.Location},{label:"Check Box",value:"checkbox",icon:b.CheckboxSquare},{label:"Image Upload",value:"image",icon:j.Image},{label:"Relation Field",value:"relation",icon:v.LinkHorizontal},{label:"Info Card",value:"info",icon:g.InfoCircle},{label:"Toggle Button",value:"toggleButton",icon:q.ToggleSwitch},{label:"Radio Button",value:"radioButton",icon:f.RadioButton},{label:"tagsInput",value:"tagsInput",icon:l.Paragraph}];exports.default=l=>{const[a,r]=n.useState(S),[c,t]=n.useState(""),s=e=>{t(e.target.value)};return n.useEffect(()=>{var e;r((e=c)?[...S.filter(n=>n.value.includes(e))]:S)},[c]),/* @__PURE__ */e.jsx(o.default,{fullWidth:!0,placeholder:"Select Field",size:"small",labelName:"Field Type",renderValue:e=>{var n;return null==(n=S.find(n=>n.value===e))?void 0:n.label},handleSearch:()=>s,searchPlaceholder:"Search Attributes",searchValue:c,...l,children:a.map(n=>/* @__PURE__ */e.jsx(y.default,{value:n.value,onKeyDown:e=>e.stopPropagation(),children:/* @__PURE__ */e.jsxs(k.default,{direction:"row",spacing:1,alignItems:"center",children:[n.icon&&/* @__PURE__ */e.jsx(n.icon,{fontSize:"small"}),
+/* @__PURE__ */e.jsx(i.Typography,{type:"s3",color:"theme.secondary.1000",children:n.label})]})}))})};
 //# sourceMappingURL=index.js.map

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\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":"i2CAoCA,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,QAAA,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,WAAA,CAAS/C,MAAOgC,EAAMhC,MAAOgD,UAAYC,GAAMA,EAAEC,kBAChDL,wBAAAM,EAAAA,KAACC,EAAAA,MAAA,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,QAAA,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

@@ -1,8 +1,6 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useState, useMemo, useEffect } from "react";
-import { Box, MenuItem, FormControlLabel } from "@mui/material";
-import CloseIcon from "@mui/icons-material/Close";
-import { Add } from "@mui/icons-material";
+import default_1 from "../../../../node_modules/@mui/icons-material/Close/index.esm.js";
 import Select from "../../../../components/select/select/index.esm.js";
 import Button from "../../../../components/button/button/index.esm.js";
 import { Typography } from "../../../../components/typography/typography/index.esm.js";
@@ -11,6 +9,10 @@ import Checkbox from "../../../../components/checkbox/checkbox/index.esm.js";
 import { generateRandomId } from "../../../../utils/common/index.esm.js";
 import { SECTION_TYPES } from "../../../../utils/constant/index.esm.js";
 /* empty css                               */
+import Box from "../../../../node_modules/@mui/material/Box/Box/index.esm.js";
+import MenuItem from "../../../../node_modules/@mui/material/MenuItem/MenuItem/index.esm.js";
+import FormControlLabel from "../../../../node_modules/@mui/material/FormControlLabel/FormControlLabel/index.esm.js";
+import Add from "../../../../node_modules/@mui/icons-material/esm/Add/index.esm.js";
 const SectionEditForm = (props) => {
   var _a;
   const { handlePropertyValueUpdate } = props;
@@ -128,7 +130,7 @@ const SectionEditForm = (props) => {
               ele.id
             ),
             /* @__PURE__ */ jsx(
-              CloseIcon,
+              default_1,
               {
                 style: { fontSize: "1rem", color: "#656669" },
                 onClick: (e) => {
@@ -165,7 +167,7 @@ const SectionEditForm = (props) => {
                 elementJSON.id
               ) }),
               /* @__PURE__ */ jsx(
-                CloseIcon,
+                default_1,
                 {
                   style: { fontSize: "1rem", color: "#656669" },
                   onClick: () => {

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\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 default SectionEditForm;\r\n"],"names":["_a"],"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 default SectionEditForm;\r\n"],"names":["_a","CloseIcon"],"mappings":"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"}

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

@@ -1,15 +1,15 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("@mui/material"),l=require("@mui/icons-material/Close"),r=require("@mui/icons-material"),n=,/* empty css                                          */s=,/* empty css                                          */a=,/* empty css                                                  */o=,/* empty css                                                  */d=,/* empty css                                              */c=,/* empty css                              */u=;/* empty css                                */function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}};/* empty css                            */var f=/* @__PURE__ */m(l);exports.default=l=>{var m;const{handlePropertyValueUpdate:h}=l,[x,j]=t.useState(l.element),[p,v]=t.useState(!1),[_,S]=t.useState(""),b=["section"],y=t.useMemo(()=>{var e;return null==(e=x.switcher_forms)?void 0:e.map(e=>e.name).includes(_)},[x.switcher_forms,_]);return t.useEffect(()=>{j(l.element)},[l.element]),/* @__PURE__ */e.jsxs(i.Box,{className:"formSection--FieldContainer",children:[
-/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(n.default,{fullWidth:!0,placeholder:"Select Field",size:"small",disabled:!0,defaultValue:x.field_type,label:"Field Type",variant:"outlined",children:null==b?void 0:b.map(t=>/* @__PURE__ */e.jsx(i.MenuItem,{value:t,children:t}))},x.id)}),
-/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(n.default,{fullWidth:!0,placeholder:"Select Field",size:"small",name:"section_type",defaultValue:x.section_type,label:"Section Type",variant:"outlined",onChange:e=>h(e),children:Object.values(u.SECTION_TYPES).map(t=>/* @__PURE__ */e.jsx(i.MenuItem,{value:t,children:t},t))},x.id)}),
-/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(o.default,{fullWidth:!0,label:"Label",is_required:!0,name:"label",type:"text",onChange:h,defaultValue:x.label},x.id)}),
-/* @__PURE__ */e.jsx(i.FormControlLabel,{name:"is_accordion",control:/* @__PURE__ */e.jsx(d.default,{}),onChange:h,checked:x.is_accordion,label:"Is Accordion"},x.id),x.section_type===u.SECTION_TYPES.FORM_SWITCH_SECTION?/* @__PURE__ */e.jsxs("div",{className:"formSection--SubFieldContainer",children:[
-/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(o.default,{fullWidth:!0,label:"Form label",is_required:!0,name:"form_switcher_label",type:"text",onChange:h,defaultValue:x.form_switcher_label},x.id)}),
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("react"),t=,/* empty css                                                        */i=,/* empty css                                          */n=,/* empty css                                          */r=,/* empty css                                                  */s=,/* empty css                                                  */a=,/* empty css                                              */o=,/* empty css                              */d=;/* empty css                                */;/* empty css                            */var u=,/* empty css                                                    */c=,/* empty css                                                              */m=,/* empty css                                                                              */f=;/* empty css                                                          */exports.default=x=>{var h;const{handlePropertyValueUpdate:j}=x,[p,_]=l.useState(x.element),[v,S]=l.useState(!1),[b,y]=l.useState(""),q=["section"],C=l.useMemo(()=>{var e;return null==(e=p.switcher_forms)?void 0:e.map(e=>e.name).includes(b)},[p.switcher_forms,b]);return l.useEffect(()=>{_(x.element)},[x.element]),/* @__PURE__ */e.jsxs(u.default,{className:"formSection--FieldContainer",children:[
+/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(i.default,{fullWidth:!0,placeholder:"Select Field",size:"small",disabled:!0,defaultValue:p.field_type,label:"Field Type",variant:"outlined",children:null==q?void 0:q.map(l=>/* @__PURE__ */e.jsx(c.default,{value:l,children:l}))},p.id)}),
+/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(i.default,{fullWidth:!0,placeholder:"Select Field",size:"small",name:"section_type",defaultValue:p.section_type,label:"Section Type",variant:"outlined",onChange:e=>j(e),children:Object.values(d.SECTION_TYPES).map(l=>/* @__PURE__ */e.jsx(c.default,{value:l,children:l},l))},p.id)}),
+/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(s.default,{fullWidth:!0,label:"Label",is_required:!0,name:"label",type:"text",onChange:j,defaultValue:p.label},p.id)}),
+/* @__PURE__ */e.jsx(m.default,{name:"is_accordion",control:/* @__PURE__ */e.jsx(a.default,{}),onChange:j,checked:p.is_accordion,label:"Is Accordion"},p.id),p.section_type===d.SECTION_TYPES.FORM_SWITCH_SECTION?/* @__PURE__ */e.jsxs("div",{className:"formSection--SubFieldContainer",children:[
+/* @__PURE__ */e.jsx("div",{children:/* @__PURE__ */e.jsx(s.default,{fullWidth:!0,label:"Form label",is_required:!0,name:"form_switcher_label",type:"text",onChange:j,defaultValue:p.form_switcher_label},p.id)}),
 /* @__PURE__ */e.jsxs("div",{children:[
-/* @__PURE__ */e.jsx(a.Typography,{type:"s5",weight:"medium",color:"theme.secondary.800",children:"Forms"}),null==(m=null==x?void 0:x.switcher_forms)?void 0:m.map(t=>/* @__PURE__ */e.jsxs("div",{className:"formSection--MultiOptions",children:[
-/* @__PURE__ */e.jsx(o.default,{fullWidth:!0,value:t.name,style:{marginBottom:"10px"},name:"switcher_forms",onChange:e=>{var i;const l=null==(i=x.switcher_forms)?void 0:i.map(i=>t.id===i.id?{...i,name:e.target.value}:{...i});h(e,l)}},t.id),
-/* @__PURE__ */e.jsx(f.default,{style:{fontSize:"1rem",color:"#656669"},onClick:e=>{const i=[...x.switcher_forms].filter(e=>e.id!==t.id);e.target.name="switcher_forms",h(e,i)}})]},x.id))]}),p?/* @__PURE__ */e.jsxs("div",{children:[
+/* @__PURE__ */e.jsx(r.Typography,{type:"s5",weight:"medium",color:"theme.secondary.800",children:"Forms"}),null==(h=null==p?void 0:p.switcher_forms)?void 0:h.map(l=>/* @__PURE__ */e.jsxs("div",{className:"formSection--MultiOptions",children:[
+/* @__PURE__ */e.jsx(s.default,{fullWidth:!0,value:l.name,style:{marginBottom:"10px"},name:"switcher_forms",onChange:e=>{var t;const i=null==(t=p.switcher_forms)?void 0:t.map(t=>l.id===t.id?{...t,name:e.target.value}:{...t});j(e,i)}},l.id),
+/* @__PURE__ */e.jsx(t.default,{style:{fontSize:"1rem",color:"#656669"},onClick:e=>{const t=[...p.switcher_forms].filter(e=>e.id!==l.id);e.target.name="switcher_forms",j(e,t)}})]},p.id))]}),v?/* @__PURE__ */e.jsxs("div",{children:[
 /* @__PURE__ */e.jsxs("div",{className:"formSection--MultiOptions formSection--FullWidth",children:[
-/* @__PURE__ */e.jsx("div",{className:"formSection--FullWidth",children:/* @__PURE__ */e.jsx(o.default,{fullWidth:!0,label:"Form section name",placeholder:"Form section name",is_required:!0,type:"text",value:_,error:y,helperText:y?"Form section name can not duplicate":"",onChange:e=>S(e.target.value)},x.id)}),
-/* @__PURE__ */e.jsx(f.default,{style:{fontSize:"1rem",color:"#656669"},onClick:()=>{v(!1),S("")}})]},x.id),
-/* @__PURE__ */e.jsx(s.default,{onClick:e=>{const{uniqueStringId:t}=c.generateRandomId(),i=[...x.switcher_forms,{name:_,id:t}];h(e,i),S(""),v(!1)},name:"switcher_forms",variant:"text",className:"formSection--Button",disabled:y||!_,startIcon:/* @__PURE__ */e.jsx(r.Add,{}),children:"Add"})]}):null,p?null:/* @__PURE__ */e.jsx(s.default,{onClick:()=>v(!0),variant:"text",className:"formSection--Button",startIcon:/* @__PURE__ */e.jsx(r.Add,{}),children:"Add forms"})]}):null]},x.id)};
+/* @__PURE__ */e.jsx("div",{className:"formSection--FullWidth",children:/* @__PURE__ */e.jsx(s.default,{fullWidth:!0,label:"Form section name",placeholder:"Form section name",is_required:!0,type:"text",value:b,error:C,helperText:C?"Form section name can not duplicate":"",onChange:e=>y(e.target.value)},p.id)}),
+/* @__PURE__ */e.jsx(t.default,{style:{fontSize:"1rem",color:"#656669"},onClick:()=>{S(!1),y("")}})]},p.id),
+/* @__PURE__ */e.jsx(n.default,{onClick:e=>{const{uniqueStringId:l}=o.generateRandomId(),t=[...p.switcher_forms,{name:b,id:l}];j(e,t),y(""),S(!1)},name:"switcher_forms",variant:"text",className:"formSection--Button",disabled:C||!b,startIcon:/* @__PURE__ */e.jsx(f.default,{}),children:"Add"})]}):null,v?null:/* @__PURE__ */e.jsx(n.default,{onClick:()=>S(!0),variant:"text",className:"formSection--Button",startIcon:/* @__PURE__ */e.jsx(f.default,{}),children:"Add forms"})]}):null]},p.id)};
 //# sourceMappingURL=index.js.map