@erpsquad/common 1.8.46 → 1.8.48

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

@@ -0,0 +1,89 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+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";
+import { Hashtag } from "../../../../components/icons/hashtag/index.esm.js";
+import { ArrowCircleDown } from "../../../../components/icons/arrow-circle-down/index.esm.js";
+import { Calendar } from "../../../../components/icons/calendar/index.esm.js";
+import { PaperClip } from "../../../../components/icons/paper-clip/index.esm.js";
+import { Link } from "../../../../components/icons/link/index.esm.js";
+import { Email } from "../../../../components/icons/email/index.esm.js";
+import { Phone } from "../../../../components/icons/phone/index.esm.js";
+import { DollarCircle } from "../../../../components/icons/dollar-circle/index.esm.js";
+import { Clock } from "../../../../components/icons/clock/index.esm.js";
+import { Grid } from "../../../../components/icons/grid/index.esm.js";
+import { Location } from "../../../../components/icons/location/index.esm.js";
+import { CheckboxSquare } from "../../../../components/icons/checkbox-square/index.esm.js";
+import { Image } from "../../../../components/icons/image/index.esm.js";
+import { LinkHorizontal } from "../../../../components/icons/link-horizontal/index.esm.js";
+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 },
+  { label: "Select", value: "select", icon: ArrowCircleDown },
+  { label: "Date", value: "date", icon: Calendar },
+  { label: "Files & Media", value: "file", icon: PaperClip },
+  { label: "URL", value: "url", icon: Link },
+  { label: "Email", value: "email", icon: Email },
+  { label: "Phone", value: "phone", icon: Phone },
+  { label: "Currency", value: "currency", icon: DollarCircle },
+  { label: "Time", value: "time", icon: Clock },
+  { label: "Table", value: "table", icon: Grid },
+  { label: "Geolocation", value: "geoLocation", icon: Location },
+  { label: "Check Box", value: "checkbox", icon: CheckboxSquare },
+  { label: "Image Upload", value: "image", icon: Image },
+  { label: "Relation Field", value: "relation", icon: LinkHorizontal },
+  { label: "Info Card", value: "info", icon: InfoCircle },
+  { label: "Toggle Button", value: "toggleButton", icon: ToggleSwitch },
+  { label: "Radio Button", value: "radioButton", icon: RadioButton },
+  { label: "tagsInput", value: "tagsInput", icon: Paragraph }
+];
+const FieldSelect = (props) => {
+  const [selectFields, setSelectFields] = useState(fields);
+  const [search, setSearch] = useState("");
+  const handleSearch = (event) => {
+    setSearch(event.target.value);
+  };
+  const handleSearchFields = (searchVal) => {
+    if (searchVal) {
+      setSelectFields([
+        ...fields.filter((field) => field.value.includes(searchVal))
+      ]);
+    } else {
+      setSelectFields(fields);
+    }
+  };
+  useEffect(() => {
+    handleSearchFields(search);
+  }, [search]);
+  return /* @__PURE__ */ jsx(
+    Select,
+    {
+      fullWidth: true,
+      placeholder: "Select Field",
+      size: "small",
+      labelName: "Field Type",
+      renderValue: (value) => {
+        var _a;
+        return (_a = fields.find((field) => field.value === value)) == null ? void 0 : _a.label;
+      },
+      handleSearch: () => handleSearch,
+      searchPlaceholder: "Search Attributes",
+      searchValue: search,
+      ...props,
+      children: selectFields.map((field) => /* @__PURE__ */ jsx(MenuItem, { value: field.value, onKeyDown: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [
+        field.icon && /* @__PURE__ */ jsx(field.icon, { fontSize: "small" }),
+        /* @__PURE__ */ jsx(Typography, { type: "s3", color: "theme.secondary.1000", children: field.label })
+      ] }) }))
+    }
+  );
+};
+export {
+  FieldSelect as default
+};
+//# sourceMappingURL=index.esm.js.map

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

@@ -0,0 +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;"}

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

@@ -0,0 +1,3 @@
+"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.Select,{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

@@ -0,0 +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":"89CAoCA,MAAMA,EAAmB,CACvB,CAAEC,MAAO,OAAQC,MAAO,OAAQC,KAAMC,EAAAA,WACtC,CAAEH,MAAO,SAAUC,MAAO,SAAUC,KAAME,EAAAA,SAC1C,CAAEJ,MAAO,SAAUC,MAAO,SAAUC,KAAMG,EAAAA,iBAC1C,CAAEL,MAAO,OAAQC,MAAO,OAAQC,KAAMI,EAAAA,UACtC,CAAEN,MAAO,gBAAiBC,MAAO,OAAQC,KAAMK,EAAAA,WAC/C,CAAEP,MAAO,MAAOC,MAAO,MAAOC,KAAMM,EAAAA,MACpC,CAAER,MAAO,QAASC,MAAO,QAASC,KAAMO,EAAAA,OACxC,CAAET,MAAO,QAASC,MAAO,QAASC,KAAMQ,EAAAA,OACxC,CAAEV,MAAO,WAAYC,MAAO,WAAYC,KAAMS,EAAAA,cAC9C,CAAEX,MAAO,OAAQC,MAAO,OAAQC,KAAMU,EAAAA,OACtC,CAAEZ,MAAO,QAASC,MAAO,QAASC,KAAMW,EAAAA,MACxC,CAAEb,MAAO,cAAeC,MAAO,cAAeC,KAAMY,EAAAA,UACpD,CAAEd,MAAO,YAAaC,MAAO,WAAYC,KAAMa,EAAAA,gBAC/C,CAAEf,MAAO,eAAgBC,MAAO,QAASC,KAAMc,EAAAA,OAC/C,CAAEhB,MAAO,iBAAkBC,MAAO,WAAYC,KAAMe,EAAAA,gBACpD,CAAEjB,MAAO,YAAaC,MAAO,OAAQC,KAAMgB,EAAAA,YAC3C,CAAElB,MAAO,gBAAiBC,MAAO,eAAgBC,KAAMiB,EAAAA,cACvD,CAAEnB,MAAO,eAAgBC,MAAO,cAAeC,KAAMkB,EAAAA,aACrD,CAAEpB,MAAO,YAAaC,MAAO,YAAaC,KAAMC,EAAAA,4BAGNkB,IAC1C,MAAOC,EAAcC,GAAmBC,EAAAA,SAAmBzB,IACpD0B,EAAQC,GAAaF,EAAAA,SAAiB,IAEvCG,EAAgBC,IACpBF,EAAUE,EAAMC,OAAO5B,QAiBzB,OAJA6B,EAAAA,UAAU,KAViB,IAACC,EAExBR,GAFwBQ,EAWPN,GATD,IACX1B,EAAOiC,OAAQC,GAAUA,EAAMhC,MAAMiC,SAASH,KAGnChC,IAMjB,CAAC0B,mBAGFU,EAAAA,IAACC,EAAAA,OAAA,CACCC,WAAS,EACTC,YAAY,eACZC,KAAK,QACLC,UAAU,aACVC,YAAcxC,UACZ,OAAA,OAAAyC,EAAA3C,EAAO4C,KAAMV,GAAUA,EAAMhC,QAAUA,SAAvC,EAAAyC,EAA+C1C,OAEjD2B,aAAc,IAAMA,EACpBiB,kBAAkB,oBAClBC,YAAapB,KACTJ,EAEHyB,SAAAxB,EAAayB,IAAKd,wBAChBe,UAAA,CAAS/C,MAAOgC,EAAMhC,MAAOgD,UAAYC,GAAMA,EAAEC,kBAChDL,wBAAAM,EAAAA,KAACC,EAAAA,QAAA,CAAMC,UAAU,MAAMC,QAAS,EAAGC,WAAW,SAC3CV,SAAA,CAAAb,EAAM/B,qBAAQiC,MAACF,EAAM/B,KAAN,CAAWuD,SAAS;qBACnCC,EAAAA,WAAA,CAAWC,KAAK,KAAKC,MAAM,uBACzBd,WAAM9C"}

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

@@ -0,0 +1,222 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useMemo, useEffect } from "react";
+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";
+import { TextField } from "../../../../components/text-field/text-field/index.esm.js";
+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;
+  const [elementJSON, setElementJSON] = useState(props.element);
+  const [addForm, setAddForm] = useState(false);
+  const [newForm, setNewForm] = useState("");
+  const selectOption = ["section"];
+  const isDuplicateFormName = useMemo(
+    () => {
+      var _a2;
+      return (_a2 = elementJSON.switcher_forms) == null ? void 0 : _a2.map((ele) => ele.name).includes(newForm);
+    },
+    [elementJSON.switcher_forms, newForm]
+  );
+  useEffect(() => {
+    setElementJSON(props.element);
+  }, [props.element]);
+  return /* @__PURE__ */ jsxs(Box, { className: "formSection--FieldContainer", children: [
+    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+      Select,
+      {
+        fullWidth: true,
+        placeholder: "Select Field",
+        size: "small",
+        disabled: true,
+        defaultValue: elementJSON.field_type,
+        label: "Field Type",
+        variant: "outlined",
+        children: selectOption == null ? void 0 : selectOption.map((item) => /* @__PURE__ */ jsx(MenuItem, { value: item, children: item }))
+      },
+      elementJSON.id
+    ) }),
+    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+      Select,
+      {
+        fullWidth: true,
+        placeholder: "Select Field",
+        size: "small",
+        name: "section_type",
+        defaultValue: elementJSON.section_type,
+        label: "Section Type",
+        variant: "outlined",
+        onChange: (e) => handlePropertyValueUpdate(e),
+        children: Object.values(SECTION_TYPES).map((type) => {
+          return /* @__PURE__ */ jsx(MenuItem, { value: type, children: type }, type);
+        })
+      },
+      elementJSON.id
+    ) }),
+    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+      TextField,
+      {
+        fullWidth: true,
+        label: "Label",
+        is_required: true,
+        name: "label",
+        type: "text",
+        onChange: handlePropertyValueUpdate,
+        defaultValue: elementJSON.label
+      },
+      elementJSON.id
+    ) }),
+    /* @__PURE__ */ jsx(
+      FormControlLabel,
+      {
+        name: "is_accordion",
+        control: /* @__PURE__ */ jsx(Checkbox, {}),
+        onChange: handlePropertyValueUpdate,
+        checked: elementJSON.is_accordion,
+        label: "Is Accordion"
+      },
+      elementJSON.id
+    ),
+    elementJSON.section_type === SECTION_TYPES.FORM_SWITCH_SECTION ? /* @__PURE__ */ jsxs("div", { className: "formSection--SubFieldContainer", children: [
+      /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+        TextField,
+        {
+          fullWidth: true,
+          label: "Form label",
+          is_required: true,
+          name: "form_switcher_label",
+          type: "text",
+          onChange: handlePropertyValueUpdate,
+          defaultValue: elementJSON.form_switcher_label
+        },
+        elementJSON.id
+      ) }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx(
+          Typography,
+          {
+            type: "s5",
+            weight: "medium",
+            color: "theme.secondary.800",
+            children: "Forms"
+          }
+        ),
+        (_a = elementJSON == null ? void 0 : elementJSON.switcher_forms) == null ? void 0 : _a.map(
+          (ele) => /* @__PURE__ */ jsxs("div", { className: "formSection--MultiOptions", children: [
+            /* @__PURE__ */ jsx(
+              TextField,
+              {
+                fullWidth: true,
+                value: ele.name,
+                style: { marginBottom: "10px" },
+                name: "switcher_forms",
+                onChange: (e) => {
+                  var _a2;
+                  const newVal = (_a2 = elementJSON.switcher_forms) == null ? void 0 : _a2.map(
+                    (formEle) => ele.id === formEle.id ? { ...formEle, name: e.target.value } : { ...formEle }
+                  );
+                  handlePropertyValueUpdate(e, newVal);
+                }
+              },
+              ele.id
+            ),
+            /* @__PURE__ */ jsx(
+              default_1,
+              {
+                style: { fontSize: "1rem", color: "#656669" },
+                onClick: (e) => {
+                  const newVal = [...elementJSON.switcher_forms].filter(
+                    (item) => item.id !== ele.id
+                  );
+                  e.target.name = "switcher_forms";
+                  handlePropertyValueUpdate(e, newVal);
+                }
+              }
+            )
+          ] }, elementJSON.id)
+        )
+      ] }),
+      addForm ? /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "formSection--MultiOptions formSection--FullWidth",
+            children: [
+              /* @__PURE__ */ jsx("div", { className: "formSection--FullWidth", children: /* @__PURE__ */ jsx(
+                TextField,
+                {
+                  fullWidth: true,
+                  label: "Form section name",
+                  placeholder: "Form section name",
+                  is_required: true,
+                  type: "text",
+                  value: newForm,
+                  error: isDuplicateFormName,
+                  helperText: isDuplicateFormName ? "Form section name can not duplicate" : "",
+                  onChange: (e) => setNewForm(e.target.value)
+                },
+                elementJSON.id
+              ) }),
+              /* @__PURE__ */ jsx(
+                default_1,
+                {
+                  style: { fontSize: "1rem", color: "#656669" },
+                  onClick: () => {
+                    setAddForm(false);
+                    setNewForm("");
+                  }
+                }
+              )
+            ]
+          },
+          elementJSON.id
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            onClick: (e) => {
+              const { uniqueStringId: id } = generateRandomId();
+              const newVal = [
+                ...elementJSON.switcher_forms,
+                { name: newForm, id }
+              ];
+              handlePropertyValueUpdate(e, newVal);
+              setNewForm("");
+              setAddForm(false);
+            },
+            name: "switcher_forms",
+            variant: "text",
+            className: "formSection--Button",
+            disabled: isDuplicateFormName || !newForm,
+            startIcon: /* @__PURE__ */ jsx(Add, {}),
+            children: "Add"
+          }
+        )
+      ] }) : null,
+      !addForm ? /* @__PURE__ */ jsx(
+        Button,
+        {
+          onClick: () => setAddForm(true),
+          variant: "text",
+          className: "formSection--Button",
+          startIcon: /* @__PURE__ */ jsx(Add, {}),
+          children: "Add forms"
+        }
+      ) : null
+    ] }) : null
+  ] }, elementJSON.id);
+};
+export {
+  SectionEditForm,
+  SectionEditForm as default
+};
+//# sourceMappingURL=index.esm.js.map

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

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

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

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

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

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