@sparrowengg/integrations-templates-frontend 1.3.0 → 1.3.2

package/dist/es/integration-template/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/integration-template/index.tsx"],"sourcesContent":["import {\n  Box,\n  Flex,\n  Heading,\n  Text,\n  ThemeProvider,\n  TooltipProvider\n} from \"@sparrowengg/twigs-react\";\nimport React, { ReactNode, useEffect, useState } from \"react\";\nimport CursorIcon from \"../commons/icons/cursor\";\nimport MappingIcon from \"../commons/icons/mapping\";\nimport Dashboard from \"./components/dashboard\";\n\nexport const IntegrationTemplate = ({\n  mappingComponent,\n  mapping,\n  triggerComponent,\n  trigger,\n  integrationName,\n  singleMappingComponent,\n  onDeleteHandler,\n  toggleDashboardField\n}: {\n  mappingComponent?: any;\n  singleMappingComponent?: any;\n  mapping: {\n    mappedFields: {\n      type: string;\n      fields: any;\n    };\n    setMappedFields: React.Dispatch<React.SetStateAction<any>>;\n  };\n  triggerComponent: any;\n  trigger: {\n    mappedFields: Array<any>;\n    setMappedFields: React.Dispatch<React.SetStateAction<any>>;\n  };\n  integrationName: string;\n  onDeleteHandler?: (id?: string | number) => void;\n  toggleDashboardField?: (id?: string | number) => void;\n}) => {\n  const [hasDashboardPage, setHasDashboardPage] = useState(\n    !!mapping?.mappedFields?.fields?.length || !!trigger?.mappedFields?.length\n  );\n  const [hasConfgurationType, setHasConfigurationType] = useState(\n    (!!mappingComponent || !!singleMappingComponent) && !!triggerComponent\n  );\n  const [currentConfigurationType, setCurrentConfigurationType] = useState(\n    !hasConfgurationType\n      ? !!mappingComponent || !!singleMappingComponent\n        ? \"MAPPING\"\n        : \"TRIGGER\"\n      : null\n  ); // automatically switch to mapping or trigger screen if any one type is present\n  const [editField, setEditField] = useState({});\n  const [isMappingPage, setIsMappingPage] = useState(false);\n\n  const navigateMappingPage = (value: boolean) =>\n    setIsMappingPage(value ?? !isMappingPage);\n\n  const hasMultiAccounts = mappingComponent?.props?.accounts?.hasAccounts;\n  const isSingleAccountMappingCompleted =\n  !hasMultiAccounts && !!mapping?.mappedFields?.fields.length;\nconst isSingleAccountTriggerCompleted =\n  !hasMultiAccounts && !!trigger?.mappedFields?.length;\n\n  const handleEditField = (field: any) => {\n    setEditField({\n      type: field.type,\n      fieldValues: field.values,\n      id: field.id\n    });\n  };\n\n  const previousMappingHandler = () => {\n    if (!isSingleAccountMappingCompleted && !isSingleAccountTriggerCompleted) {\n      setHasConfigurationType(true);\n      setCurrentConfigurationType(null);\n      setHasDashboardPage(false);\n      return;\n    }\n    setHasDashboardPage(true);\n  };\n\n  const mappingClonedElementProps = {\n    previousMappingHandler: previousMappingHandler,\n    editField: editField,\n    integrationName,\n    isMappingPage,\n    navigateMappingPage,\n    onSaveHandler: (editId?: string | number) => {\n      const navigate = mappingComponent?.props?.onSaveHandler(editId);\n      if (navigate) setHasDashboardPage(true);\n    },\n    hasPreviousMapping: mappingComponent?.props?.hasPreviousMapping ?? (!isSingleAccountMappingCompleted && !isSingleAccountTriggerCompleted) \n  };\n\n  const clonedSingleMappingProps = {\n    editField: editField,\n    previousMappingHandler,\n    onSaveHandler: async (editId?: string | number) => {\n      const navigate =\n        await singleMappingComponent?.props?.onSaveHandler(editId);\n      if (navigate) setHasDashboardPage(true);\n    },\n    hasPreviousMapping: mappingComponent?.props?.hasPreviousMapping ?? (!isSingleAccountMappingCompleted && !isSingleAccountTriggerCompleted) \n  };\n\n  const triggerClonedProps = {\n    editField,\n    previousMappingHandler,\n    onSaveHandler: async (editId?: string | number) => {\n      const navigate =\n        await triggerComponent?.props?.onSaveHandler(editId);\n      if (navigate) setHasDashboardPage(true);\n    },\n    hasPreviousMapping: mappingComponent?.props?.hasPreviousMapping ?? (!isSingleAccountMappingCompleted && !isSingleAccountTriggerCompleted) \n  }\n\n  const ClonedMappingComponent = !!mappingComponent\n    ? React.cloneElement(mappingComponent, mappingClonedElementProps)\n    : mappingComponent;\n  const ClonedSingleMappingComponent = !!singleMappingComponent\n    ? React.cloneElement(singleMappingComponent, clonedSingleMappingProps)\n    : singleMappingComponent;\n\n    const ClonedtriggerComponent = !!triggerComponent ? React.cloneElement(triggerComponent, triggerClonedProps) : triggerComponent;\n\n    useEffect(() => {\n      if (!isSingleAccountMappingCompleted && !isSingleAccountTriggerCompleted && hasDashboardPage) {\n        setHasDashboardPage(false);\n        setHasConfigurationType(true);\n        setCurrentConfigurationType(null);\n      }\n    }, [mapping?.mappedFields?.fields, trigger?.mappedFields])\n\n  return (\n    <ThemeProvider\n      theme={{\n        fonts: {\n          body: \"DM Sans, Roboto Mono, sans-serif\",\n          heading: \"DM Sans, Roboto Mono, sans-serif\"\n        }\n      }}\n    >\n      <TooltipProvider delayDuration={300}>\n      <Box css={{ width: \"100%\" }}>\n        {hasDashboardPage ? (\n          <Dashboard\n            hasMultiAccounts={hasMultiAccounts}\n            dashboardDescription=\"Manage your entities in Dynamics 365 with SurveySparrow Survey\"\n            integrationName={integrationName}\n            mappingFields={mapping?.mappedFields}\n            triggerFields={trigger?.mappedFields}\n            handleConfigurationType={(value: string) =>\n              setCurrentConfigurationType(value)\n            }\n            handleEditField={handleEditField}\n            deleteFieldHandler={onDeleteHandler}\n            toggleDashboardField={toggleDashboardField}\n            handleDashboardPage={(value: boolean, type: string) => {\n              setHasDashboardPage(value as boolean);\n              setCurrentConfigurationType(type);\n              setHasConfigurationType(false);\n            }}\n          />\n        ) : (\n          <>\n            {hasConfgurationType &&\n            ![\"MAPPING\", \"TRIGGER\"].includes(`${currentConfigurationType}`) ? (\n              <ConfigureTemplate\n                handleConfigurationType={(value: string) =>\n                  setCurrentConfigurationType(value)\n                }\n              />\n            ) : (\n              <>\n                {currentConfigurationType === \"MAPPING\" &&\n                !!singleMappingComponent\n                  ? ClonedSingleMappingComponent\n                  : null}\n                {currentConfigurationType === \"MAPPING\" && !!mappingComponent\n                  ? ClonedMappingComponent\n                  : null}\n                {currentConfigurationType !== \"MAPPING\" && !!triggerComponent\n                  ? ClonedtriggerComponent\n                  : null}\n              </>\n            )}\n          </>\n        )}\n      </Box>\n      </TooltipProvider>\n    </ThemeProvider>\n  );\n};\n\nconst ConfigureTemplate = ({\n  handleConfigurationType\n}: {\n  handleConfigurationType: (value: string) => void;\n}) => {\n  return (\n    <Box css={{ width: \"100%\", paddingTop: \"$48\" }}>\n      <Flex flexDirection=\"column\" alignItems=\"center\">\n        <Heading size=\"h5\" css={{ color: \"$neutral900\" }}>\n          Select Configuration Type\n        </Heading>\n        <Text\n          size=\"sm\"\n          css={{ color: \"$neutral600\", lineHeight: \"$sm\", marginTop: \"$2\" }}\n        >\n          Choose either Mapping or Triggering to configure their respective\n          actions.\n        </Text>\n      </Flex>\n      <Flex alignItems=\"center\" justifyContent=\"center\">\n        <Flex\n          css={{ maxWidth: 960, width: \"100%\", marginTop: \"$36\" }}\n          alignItems=\"center\"\n          justifyContent=\"center\"\n          gap=\"$20\"\n        >\n          <TemplateCard\n            icon={<CursorIcon />}\n            heading=\"Trigger\"\n            description=\"Trigger survey when an event happens in HubSpot\"\n            onClickHandler={() => handleConfigurationType(\"TRIGGER\")}\n          />\n          <TemplateCard\n            icon={<MappingIcon />}\n            heading=\"Mapping\"\n            description=\"Sync survey responses to HubSpot\"\n            onClickHandler={() => handleConfigurationType(\"MAPPING\")}\n          />\n        </Flex>\n      </Flex>\n    </Box>\n  );\n};\n\nconst TemplateCard = ({\n  icon,\n  heading,\n  description,\n  onClickHandler\n}: {\n  icon: ReactNode;\n  heading: string;\n  description: string;\n  onClickHandler: () => void;\n}) => {\n  return (\n    <Flex\n      flexDirection=\"column\"\n      alignItems=\"center\"\n      onClick={onClickHandler}\n      css={{\n        width: 350,\n        height: 300,\n        outline: \"$borderWidths$xs solid $neutral200\",\n        borderRadius: \"$4xl\",\n        position: \"relative\",\n        cursor: \"pointer\",\n        filter: \"drop-shadow(0 4px 8px rgba(0, 0, 0, 0.06))\",\n        overflow: \"auto\",\n        \"&:hover\": {\n          outline: \"$borderWidths$md solid $primary400\",\n          \"& svg circle, rect, path\": {\n            stroke: \"$primary500\"\n          },\n          \"& #ellipse\": {\n            opacity: \"10%\"\n          }\n        }\n      }}\n    >\n      <Box\n        id=\"ellipse\"\n        css={{\n          position: \"absolute\",\n          top: \"-23%\",\n          filter: \"blur(25px)\",\n          transition: \"all .4s ease\",\n          width: 334,\n          height: \"$25\",\n          opacity: \"0%\",\n          background: \"$primary400\",\n          borderRadius: \"50%\"\n        }}\n      />\n      <Box css={{ marginBlock: \"$32 $16\" }}>{icon}</Box>\n      <Heading size=\"h6\" css={{ color: \"$neutral900\" }}>\n        {heading}\n      </Heading>\n      <Text\n        size=\"md\"\n        css={{\n          marginTop: \"$8\",\n          color: \"$neutral800\",\n          width: 222,\n          textAlign: \"center\"\n        }}\n      >\n        {description}\n      </Text>\n    </Flex>\n  );\n};\n"],"names":["_a","React"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/integration-template/index.tsx"],"sourcesContent":["import {\n  Box,\n  Flex,\n  Heading,\n  Text,\n  ThemeProvider,\n  TooltipProvider\n} from \"@sparrowengg/twigs-react\";\nimport React, { ReactNode, useEffect, useState } from \"react\";\nimport CursorIcon from \"../commons/icons/cursor\";\nimport MappingIcon from \"../commons/icons/mapping\";\nimport Dashboard from \"./components/dashboard\";\n\nexport const IntegrationTemplate = ({\n  mappingComponent,\n  mapping,\n  triggerComponent,\n  trigger,\n  integrationName,\n  singleMappingComponent,\n  onDeleteHandler,\n  toggleDashboardField,\n  dashboardDescription\n}: {\n  mappingComponent?: any;\n  singleMappingComponent?: any;\n  mapping: {\n    mappedFields: {\n      type: string;\n      fields: any;\n    };\n    setMappedFields: React.Dispatch<React.SetStateAction<any>>;\n  };\n  triggerComponent: any;\n  trigger: {\n    mappedFields: Array<any>;\n    setMappedFields: React.Dispatch<React.SetStateAction<any>>;\n  };\n  integrationName: string;\n  onDeleteHandler?: (id?: string | number) => void;\n  toggleDashboardField?: (id?: string | number) => void;\n  dashboardDescription: string;\n}) => {\n  const hasMultiAccounts = mappingComponent?.props?.accounts?.hasAccounts;\n  const isMappingFieldCompleted = !!mapping?.mappedFields?.fields.length;\n  const isTiggerFieldCompleted = !!trigger?.mappedFields?.length;\n  const [hasDashboardPage, setHasDashboardPage] = useState(\n    !!mapping?.mappedFields?.fields?.length || !!trigger?.mappedFields?.length\n  );\n  const [hasConfgurationType, setHasConfigurationType] = useState(\n    (!!mappingComponent || !!singleMappingComponent) && !!triggerComponent\n  );\n  const [currentConfigurationType, setCurrentConfigurationType] = useState(\n    !hasConfgurationType\n      ? !!mappingComponent || !!singleMappingComponent\n        ? \"MAPPING\"\n        : \"TRIGGER\"\n      : null\n  ); // automatically switch to mapping or trigger screen if any one type is present\n  const [editField, setEditField] = useState({});\n  const [isMappingPage, setIsMappingPage] = useState(false);\n\n  // temporary previous mapping state to handle within integration template wrapper\n  const [tempPreviousMapping, setTempPreviousMapping] = useState(\n    !(isMappingFieldCompleted && isTiggerFieldCompleted)\n  );\n\n  const navigateMappingPage = (value: boolean) =>\n    setIsMappingPage(value ?? !isMappingPage);\n\n  const handleEditField = (field: any) => {\n    setEditField({\n      type: field.type,\n      fieldValues: field.values,\n      id: field.id\n    });\n  };\n\n  const previousMappingHandler = () => {\n    if (!(isMappingFieldCompleted || isTiggerFieldCompleted)) {\n      setHasConfigurationType(true);\n      setCurrentConfigurationType(null);\n      setHasDashboardPage(false);\n      setEditField({});\n      return;\n    }\n    setHasDashboardPage(true);\n  };\n\n  const mappingClonedElementProps = {\n    previousMappingHandler,\n    editField: editField,\n    integrationName,\n    isMappingPage,\n    navigateMappingPage,\n    onSaveHandler: (editId?: string | number) => {\n      const navigate = mappingComponent?.props?.onSaveHandler(editId);\n      if (navigate) setHasDashboardPage(true);\n    },\n    hasPreviousMapping:\n      tempPreviousMapping ?? mappingComponent?.props?.hasPreviousMapping\n  };\n  const clonedSingleMappingProps = {\n    editField: editField,\n    previousMappingHandler,\n    integrationName,\n    onSaveHandler: async (editId?: string | number) => {\n      const navigate =\n        await singleMappingComponent?.props?.onSaveHandler(editId);\n      if (navigate) setHasDashboardPage(true);\n    },\n    hasPreviousMapping:\n      tempPreviousMapping ?? singleMappingComponent?.props?.hasPreviousMapping\n  };\n\n  const triggerClonedProps = {\n    editField,\n    previousMappingHandler,\n    integrationName,\n    onSaveHandler: async (editId?: string | number) => {\n      const navigate = await triggerComponent?.props?.onSaveHandler(editId);\n      if (navigate) setHasDashboardPage(true);\n    },\n    previousMapping:\n      tempPreviousMapping ?? triggerComponent?.props?.hasPreviousMapping\n  };\n\n  const ClonedMappingComponent = !!mappingComponent\n    ? React.cloneElement(mappingComponent, mappingClonedElementProps)\n    : mappingComponent;\n  const ClonedSingleMappingComponent = !!singleMappingComponent\n    ? React.cloneElement(singleMappingComponent, clonedSingleMappingProps)\n    : singleMappingComponent;\n\n  const ClonedTriggerComponent = !!triggerComponent\n    ? React.cloneElement(triggerComponent, triggerClonedProps)\n    : triggerComponent;\n\n  useEffect(() => {\n    if (\n      !isMappingFieldCompleted &&\n      !isTiggerFieldCompleted &&\n      hasDashboardPage\n    ) {\n      setHasDashboardPage(false);\n      setHasConfigurationType(true);\n      setCurrentConfigurationType(null);\n    }\n  }, [mapping?.mappedFields?.fields, trigger?.mappedFields]);\n\n  return (\n    <ThemeProvider\n      theme={{\n        fonts: {\n          body: \"DM Sans, Roboto Mono, sans-serif\",\n          heading: \"DM Sans, Roboto Mono, sans-serif\"\n        }\n      }}\n    >\n      <TooltipProvider delayDuration={300}>\n        <Box css={{ width: \"100%\" }}>\n          {hasDashboardPage ? (\n            <Dashboard\n              hasDropdownComponents={{\n                mapping: !!ClonedMappingComponent || !!clonedSingleMappingProps,\n                trigger: !!ClonedTriggerComponent\n              }}\n              hasMultiAccounts={hasMultiAccounts}\n              dashboardDescription={dashboardDescription}\n              integrationName={integrationName}\n              mappingFields={mapping?.mappedFields}\n              triggerFields={trigger?.mappedFields}\n              handleConfigurationType={(value: string) => {\n                setCurrentConfigurationType(value);\n                setHasDashboardPage(false);\n                setTempPreviousMapping(true);\n                setEditField({});\n              }}\n              handleEditField={handleEditField}\n              deleteFieldHandler={onDeleteHandler}\n              toggleDashboardField={toggleDashboardField}\n              handleDashboardPage={(value: boolean, type: string) => {\n                setHasDashboardPage(value as boolean);\n                setCurrentConfigurationType(type);\n                setHasConfigurationType(false);\n              }}\n            />\n          ) : (\n            <>\n              {hasConfgurationType &&\n              ![\"MAPPING\", \"TRIGGER\"].includes(\n                `${currentConfigurationType}`\n              ) ? (\n                <ConfigureTemplate\n                  handleConfigurationType={(value: string) =>\n                    setCurrentConfigurationType(value)\n                  }\n                />\n              ) : (\n                <>\n                  {currentConfigurationType === \"MAPPING\" &&\n                  !!singleMappingComponent\n                    ? ClonedSingleMappingComponent\n                    : null}\n                  {currentConfigurationType === \"MAPPING\" && !!mappingComponent\n                    ? ClonedMappingComponent\n                    : null}\n                  {currentConfigurationType !== \"MAPPING\" && !!triggerComponent\n                    ? ClonedTriggerComponent\n                    : null}\n                </>\n              )}\n            </>\n          )}\n        </Box>\n      </TooltipProvider>\n    </ThemeProvider>\n  );\n};\n\nconst ConfigureTemplate = ({\n  handleConfigurationType\n}: {\n  handleConfigurationType: (value: string) => void;\n}) => {\n  return (\n    <Box css={{ width: \"100%\", paddingTop: \"$48\" }}>\n      <Flex flexDirection=\"column\" alignItems=\"center\">\n        <Heading size=\"h5\" css={{ color: \"$neutral900\" }}>\n          Select Configuration Type\n        </Heading>\n        <Text\n          size=\"sm\"\n          css={{ color: \"$neutral600\", lineHeight: \"$sm\", marginTop: \"$2\" }}\n        >\n          Choose either Mapping or Triggering to configure their respective\n          actions.\n        </Text>\n      </Flex>\n      <Flex alignItems=\"center\" justifyContent=\"center\">\n        <Flex\n          css={{ maxWidth: 960, width: \"100%\", marginTop: \"$36\" }}\n          alignItems=\"center\"\n          justifyContent=\"center\"\n          gap=\"$20\"\n        >\n          <TemplateCard\n            icon={<CursorIcon />}\n            heading=\"Trigger\"\n            description=\"Trigger survey when an event happens in HubSpot\"\n            onClickHandler={() => handleConfigurationType(\"TRIGGER\")}\n          />\n          <TemplateCard\n            icon={<MappingIcon />}\n            heading=\"Mapping\"\n            description=\"Sync survey responses to HubSpot\"\n            onClickHandler={() => handleConfigurationType(\"MAPPING\")}\n          />\n        </Flex>\n      </Flex>\n    </Box>\n  );\n};\n\nconst TemplateCard = ({\n  icon,\n  heading,\n  description,\n  onClickHandler\n}: {\n  icon: ReactNode;\n  heading: string;\n  description: string;\n  onClickHandler: () => void;\n}) => {\n  return (\n    <Flex\n      flexDirection=\"column\"\n      alignItems=\"center\"\n      onClick={onClickHandler}\n      css={{\n        width: 350,\n        height: 300,\n        outline: \"$borderWidths$xs solid $neutral200\",\n        borderRadius: \"$4xl\",\n        position: \"relative\",\n        cursor: \"pointer\",\n        filter: \"drop-shadow(0 4px 8px rgba(0, 0, 0, 0.06))\",\n        overflow: \"auto\",\n        \"&:hover\": {\n          outline: \"$borderWidths$md solid $primary400\",\n          \"& svg circle, rect, path\": {\n            stroke: \"$primary500\"\n          },\n          \"& #ellipse\": {\n            opacity: \"10%\"\n          }\n        }\n      }}\n    >\n      <Box\n        id=\"ellipse\"\n        css={{\n          position: \"absolute\",\n          top: \"-23%\",\n          filter: \"blur(25px)\",\n          transition: \"all .4s ease\",\n          width: 334,\n          height: \"$25\",\n          opacity: \"0%\",\n          background: \"$primary400\",\n          borderRadius: \"50%\"\n        }}\n      />\n      <Box css={{ marginBlock: \"$32 $16\" }}>{icon}</Box>\n      <Heading size=\"h6\" css={{ color: \"$neutral900\" }}>\n        {heading}\n      </Heading>\n      <Text\n        size=\"md\"\n        css={{\n          marginTop: \"$8\",\n          color: \"$neutral800\",\n          width: 222,\n          textAlign: \"center\"\n        }}\n      >\n        {description}\n      </Text>\n    </Flex>\n  );\n};\n"],"names":["_a","React"],"mappings":"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"}

package/dist/es/mapping/components/field.js

@@ -0,0 +1,277 @@
+import React__default from 'react';
+import Trash from '../../commons/icons/trash.js';
+import CustomMenu from './custom-menu.js';
+import { mappingType, subMenuOptions } from '../../commons/constants/index.js';
+import { handleMappingOptions } from '../../commons/helpers/index.js';
+import Arrow from '../../commons/icons/arrow.js';
+import CustomDateMenu from './custom-date-menu.js';
+import CustomOption from './custom-option.js';
+import PlaceholderSpan from './placeholder-span.js';
+import { Flex } from '../../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js';
+import { Text } from '../../node_modules/@sparrowengg/twigs-react/dist/es/text/text.js';
+import { FormLabel } from '../../node_modules/@sparrowengg/twigs-react/dist/es/form-label/form-label.js';
+import { Select } from '../../node_modules/@sparrowengg/twigs-react/dist/es/select/select.js';
+import { Box } from '../../node_modules/@sparrowengg/twigs-react/dist/es/box/box.js';
+import { IconButton } from '../../node_modules/@sparrowengg/twigs-react/dist/es/button/icon-button.js';
+import { Input } from '../../node_modules/@sparrowengg/twigs-react/dist/es/input/input.js';
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const customStyles = {
+  menuList: (prevStyles) => __spreadProps(__spreadValues({}, prevStyles), {
+    maxHeight: 176
+  })
+};
+const subMenuCustomStyles = {
+  menu: (prevStyles) => __spreadProps(__spreadValues({}, prevStyles), {
+    width: 260,
+    right: 0
+  })
+};
+const Field = ({
+  field,
+  isFirstField,
+  handleFieldValue,
+  ssMappingData,
+  integrationFields,
+  integrationName,
+  hasCustomMenuProperty,
+  isBtnDisabled,
+  removeField,
+  showCustomPropertyModal
+}) => {
+  var _a, _b, _c, _d;
+  return /* @__PURE__ */ React__default.createElement(Flex, { flexDirection: "column", gap: "$8" }, (field == null ? void 0 : field.essentialFieldLabel) && /* @__PURE__ */ React__default.createElement(Text, { size: "sm", weight: "bold" }, field.essentialFieldLabel, /* @__PURE__ */ React__default.createElement(PlaceholderSpan, { color: "$negative500" }, "*")), /* @__PURE__ */ React__default.createElement(
+    Flex,
+    {
+      key: field.id,
+      css: {
+        width: "100%",
+        "&:hover": {
+          "& button": {
+            opacity: 1
+          },
+          "& #arrow path": {
+            fill: "$secondary500"
+          }
+        }
+      },
+      alignItems: "center",
+      gap: "$6"
+    },
+    /* @__PURE__ */ React__default.createElement(Flex, { flexDirection: "column", gap: "$2", css: { width: 144 } }, (isFirstField || field.isEssentialField) && /* @__PURE__ */ React__default.createElement(FormLabel, { size: "xs", css: { fontWeight: "$5" } }, "Type"), /* @__PURE__ */ React__default.createElement(
+      Select,
+      {
+        placeholder: "Choose",
+        size: "lg",
+        isSearchable: false,
+        value: field == null ? void 0 : field.mappedType,
+        options: mappingType,
+        onChange: (type) => handleFieldValue(field == null ? void 0 : field.id, "type", type),
+        styles: customStyles
+      }
+    )),
+    /* @__PURE__ */ React__default.createElement(Flex, { alignItems: "center", css: { flex: 1 }, gap: "11px" }, /* @__PURE__ */ React__default.createElement(Flex, { flexDirection: "column", gap: "$2", css: { width: "100%" } }, (isFirstField || field.isEssentialField) && /* @__PURE__ */ React__default.createElement(FormLabel, { size: "xs", css: { fontWeight: "$5" } }, "SurveySparrow Field"), /* @__PURE__ */ React__default.createElement(
+      Select,
+      {
+        size: "lg",
+        placeholder: "Choose",
+        value: field == null ? void 0 : field.surveySparrowField,
+        onChange: (ssField) => handleFieldValue(field == null ? void 0 : field.id, "surveySparrowField", ssField),
+        options: handleMappingOptions(
+          (_b = (_a = field == null ? void 0 : field.mappedType) == null ? void 0 : _a.value) != null ? _b : "QUESTION",
+          ssMappingData.questions,
+          ssMappingData.contactProperties,
+          ssMappingData.variables,
+          ssMappingData.expressions
+        ),
+        styles: customStyles
+      }
+    )), /* @__PURE__ */ React__default.createElement(
+      Box,
+      {
+        as: "span",
+        id: "arrow",
+        css: {
+          paddingTop: isFirstField || field.isEssentialField ? "$9" : 0
+        }
+      },
+      /* @__PURE__ */ React__default.createElement(Arrow, null)
+    ), /* @__PURE__ */ React__default.createElement(Flex, { flexDirection: "column", gap: "$2", css: { width: "100%" } }, (isFirstField || field.isEssentialField) && /* @__PURE__ */ React__default.createElement(FormLabel, { size: "xs", css: { fontWeight: "$5" } }, `${integrationName} Field`), /* @__PURE__ */ React__default.createElement(Flex, { alignItems: "center" }, /* @__PURE__ */ React__default.createElement(
+      Select,
+      {
+        placeholder: "Choose",
+        size: "lg",
+        value: field == null ? void 0 : field.integrationField,
+        onChange: (integration) => handleFieldValue(field == null ? void 0 : field.id, "integrationField", integration),
+        css: {
+          width: 260,
+          "& .twigs-select__control": {
+            borderTopRightRadius: 0,
+            borderBottomRightRadius: 0
+          }
+        },
+        options: integrationFields,
+        styles: customStyles,
+        components: __spreadValues({}, hasCustomMenuProperty && {
+          Menu: (props) => /* @__PURE__ */ React__default.createElement(
+            CustomMenu,
+            __spreadProps(__spreadValues({}, props), {
+              customOnClick: showCustomPropertyModal
+            })
+          )
+        })
+      }
+    ), /* @__PURE__ */ React__default.createElement(
+      Select,
+      {
+        css: {
+          width: 112,
+          "& .twigs-select__control": {
+            borderTopLeftRadius: 0,
+            borderBottomLeftRadius: 0,
+            border: "$borderWidths$xs solid $neutral200"
+          }
+        },
+        isDisabled: !((_c = field == null ? void 0 : field.integrationField) == null ? void 0 : _c.value),
+        value: field == null ? void 0 : field.integrationFieldType,
+        onChange: (integration) => handleFieldValue(
+          field == null ? void 0 : field.id,
+          "integrationFieldType",
+          integration
+        ),
+        styles: subMenuCustomStyles,
+        options: subMenuOptions,
+        closeMenuOnSelect: true,
+        noneOptionHandler: (value) => handleFieldValue(field == null ? void 0 : field.id, "integrationFieldType", value),
+        components: { Menu: CustomMenu, Option: CustomOption },
+        placeholder: "Choose",
+        size: "lg"
+      }
+    ))), /* @__PURE__ */ React__default.createElement(
+      Flex,
+      {
+        flexDirection: "column",
+        gap: "$2",
+        css: { maxWidth: 180, width: "100%" }
+      },
+      (isFirstField || field.isEssentialField) && /* @__PURE__ */ React__default.createElement(FormLabel, { size: "xs", css: { fontWeight: "$5" } }, "Default Value (Optional)"),
+      /* @__PURE__ */ React__default.createElement(
+        DefaultField,
+        {
+          handleFieldValue: (value) => {
+            handleFieldValue(field == null ? void 0 : field.id, "defaultValue", value);
+          },
+          integrationFieldType: field == null ? void 0 : field.integrationFieldType,
+          value: (_d = field == null ? void 0 : field.defaultValue) == null ? void 0 : _d.value
+        }
+      )
+    )),
+    !field.isEssentialField && /* @__PURE__ */ React__default.createElement(
+      IconButton,
+      {
+        css: {
+          transition: "all .3s ease",
+          marginTop: isFirstField ? "$11" : 0
+        },
+        size: "sm",
+        icon: /* @__PURE__ */ React__default.createElement(Trash, null),
+        variant: "ghost",
+        color: "default",
+        disabled: isBtnDisabled,
+        onClick: removeField
+      }
+    )
+  ));
+};
+const DefaultField = ({
+  integrationFieldType,
+  handleFieldValue,
+  value
+}) => {
+  switch (`${integrationFieldType == null ? void 0 : integrationFieldType.value}`) {
+    case "BOOLEAN":
+      return /* @__PURE__ */ React__default.createElement(
+        Select,
+        {
+          options: [
+            {
+              label: "true",
+              value: "TRUE"
+            },
+            {
+              label: "false",
+              value: "FALSE"
+            }
+          ],
+          size: "lg",
+          value,
+          placeholder: "",
+          onChange: (booleanValue) => handleFieldValue({
+            type: "BOOLEAN",
+            value: booleanValue
+          })
+        }
+      );
+    case "DATE_TIME":
+      return /* @__PURE__ */ React__default.createElement(
+        CustomDateMenu,
+        {
+          value,
+          onChangeHandler: (dateValue) => {
+            handleFieldValue({
+              type: "DATE_TIME",
+              value: dateValue
+            });
+          }
+        }
+      );
+    case "NUMBER":
+      return /* @__PURE__ */ React__default.createElement(
+        Input,
+        {
+          size: "lg",
+          type: "number",
+          placeholder: "",
+          value,
+          onChange: (e) => handleFieldValue({
+            type: "NUMBER",
+            value: e.currentTarget.value
+          })
+        }
+      );
+    default:
+      return /* @__PURE__ */ React__default.createElement(
+        Input,
+        {
+          size: "lg",
+          placeholder: "",
+          value,
+          onChange: (e) => handleFieldValue({
+            type: "STRING",
+            value: e.currentTarget.value
+          })
+        }
+      );
+  }
+};
+
+export { Field as default };
+//# sourceMappingURL=field.js.map

package/dist/es/mapping/components/field.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"field.js","sources":["../../../../src/mapping/components/field.tsx"],"sourcesContent":["import {\n  Box,\n  Flex,\n  FormLabel,\n  IconButton,\n  Input,\n  Select,\n  Text\n} from \"@sparrowengg/twigs-react\";\nimport React from \"react\";\nimport Trash from \"../../commons/icons/trash\";\nimport CustomMenu from \"./custom-menu\";\nimport { mappingType, subMenuOptions } from \"../../commons/constants\";\nimport { handleMappingOptions } from \"../../commons/helpers\";\nimport Arrow from \"../../commons/icons/arrow\";\nimport { FieldProps } from \"../types\";\nimport CustomDateMenu from \"./custom-date-menu\";\nimport CustomOption from \"./custom-option\";\nimport PlaceholderSpan from \"./placeholder-span\";\nimport { DateValue } from \"@internationalized/date\";\n\n\n\nconst customStyles = {\n  menuList: (prevStyles: any) => ({\n    ...prevStyles,\n    maxHeight: 176\n  })\n};\n\nconst subMenuCustomStyles = {\n  menu: (prevStyles: any) => ({\n    ...prevStyles,\n    width: 260,\n    right: 0\n  })\n};\n\nconst Field = ({\n  field,\n  isFirstField,\n  handleFieldValue,\n  ssMappingData,\n  integrationFields,\n  integrationName,\n  hasCustomMenuProperty,\n  isBtnDisabled,\n  removeField,\n  showCustomPropertyModal\n}: FieldProps) => {\n  return (\n    <Flex flexDirection=\"column\" gap=\"$8\">\n      {field?.essentialFieldLabel && (\n        <Text size=\"sm\" weight=\"bold\">\n          {field.essentialFieldLabel}\n          <PlaceholderSpan color=\"$negative500\">*</PlaceholderSpan>\n        </Text>\n      )}\n      <Flex\n        key={field.id}\n        css={{\n          width: \"100%\",\n          \"&:hover\": {\n            \"& button\": {\n              opacity: 1\n            },\n            \"& #arrow path\": {\n              fill: \"$secondary500\"\n            }\n          }\n        }}\n        alignItems=\"center\"\n        gap=\"$6\"\n      >\n        <Flex flexDirection=\"column\" gap=\"$2\" css={{ width: 144 }}>\n          {(isFirstField || field.isEssentialField) && (\n            <FormLabel size=\"xs\" css={{ fontWeight: \"$5\" }}>\n              Type\n            </FormLabel>\n          )}\n          <Select\n            placeholder=\"Choose\"\n            size=\"lg\"\n            isSearchable={false}\n            value={field?.mappedType}\n            options={mappingType}\n            onChange={(type: any) => handleFieldValue(field?.id, \"type\", type)}\n            styles={customStyles}\n          />\n        </Flex>\n        <Flex alignItems=\"center\" css={{ flex: 1 }} gap=\"11px\">\n          <Flex flexDirection=\"column\" gap=\"$2\" css={{ width: \"100%\" }}>\n            {(isFirstField || field.isEssentialField) && (\n              <FormLabel size=\"xs\" css={{ fontWeight: \"$5\" }}>\n                SurveySparrow Field\n              </FormLabel>\n            )}\n            <Select\n              size=\"lg\"\n              placeholder=\"Choose\"\n              value={field?.surveySparrowField}\n              onChange={(ssField) =>\n                handleFieldValue(field?.id, \"surveySparrowField\", ssField)\n              }\n              options={handleMappingOptions(\n                field?.mappedType?.value ?? \"QUESTION\",\n                ssMappingData.questions,\n                ssMappingData.contactProperties,\n                ssMappingData.variables,\n                ssMappingData.expressions\n              )}\n              styles={customStyles}\n            />\n          </Flex>\n          <Box\n            as=\"span\"\n            id=\"arrow\"\n            css={{\n              paddingTop: isFirstField || field.isEssentialField ? \"$9\" : 0\n            }}\n          >\n            <Arrow />\n          </Box>\n          <Flex flexDirection=\"column\" gap=\"$2\" css={{ width: \"100%\" }}>\n            {(isFirstField || field.isEssentialField) && (\n              <FormLabel size=\"xs\" css={{ fontWeight: \"$5\" }}>\n                {`${integrationName} Field`}\n              </FormLabel>\n            )}\n            <Flex alignItems=\"center\">\n              <Select\n                placeholder=\"Choose\"\n                size=\"lg\"\n                value={field?.integrationField}\n                onChange={(integration) =>\n                  handleFieldValue(field?.id, \"integrationField\", integration)\n                }\n                css={{\n                  width: 260,\n                  \"& .twigs-select__control\": {\n                    borderTopRightRadius: 0,\n                    borderBottomRightRadius: 0\n                  }\n                }}\n                options={integrationFields}\n                styles={customStyles}\n                components={{\n                  ...(hasCustomMenuProperty && {\n                    Menu: (props) => (\n                      <CustomMenu\n                        {...props}\n                        customOnClick={showCustomPropertyModal}\n                      />\n                    )\n                  })\n                }}\n              />\n              <Select\n                css={{\n                  width: 112,\n                  \"& .twigs-select__control\": {\n                    borderTopLeftRadius: 0,\n                    borderBottomLeftRadius: 0,\n                    border: \"$borderWidths$xs solid $neutral200\"\n                  }\n                }}\n                isDisabled={!field?.integrationField?.value}\n                value={field?.integrationFieldType}\n                onChange={(integration) =>\n                  handleFieldValue(\n                    field?.id,\n                    \"integrationFieldType\",\n                    integration\n                  )\n                }\n                styles={subMenuCustomStyles}\n                options={subMenuOptions}\n                closeMenuOnSelect\n                // @ts-ignore\n                noneOptionHandler={(value) =>\n                  handleFieldValue(field?.id, \"integrationFieldType\", value)\n                }\n                components={{ Menu: CustomMenu, Option: CustomOption }}\n                placeholder=\"Choose\"\n                size=\"lg\"\n              />\n            </Flex>\n          </Flex>\n          <Flex\n            flexDirection=\"column\"\n            gap=\"$2\"\n            css={{ maxWidth: 180, width: \"100%\" }}\n          >\n            {(isFirstField || field.isEssentialField) && (\n              <FormLabel size=\"xs\" css={{ fontWeight: \"$5\" }}>\n                {\"Default Value (Optional)\"}\n              </FormLabel>\n            )}\n            <DefaultField\n              handleFieldValue={(value: any) => {\n                handleFieldValue(field?.id, \"defaultValue\", value);\n              }}\n              integrationFieldType={field?.integrationFieldType}\n              value={field?.defaultValue?.value}\n            />\n          </Flex>\n        </Flex>\n        {!field.isEssentialField && (\n          <IconButton\n            css={{\n              transition: \"all .3s ease\",\n              marginTop: isFirstField ? \"$11\" : 0\n            }}\n            size=\"sm\"\n            icon={<Trash />}\n            variant=\"ghost\"\n            color=\"default\"\n            disabled={isBtnDisabled}\n            onClick={removeField}\n          />\n        )}\n      </Flex>\n    </Flex>\n  );\n};\n\nexport default Field;\n\nconst DefaultField = ({\n  integrationFieldType,\n  handleFieldValue,\n  value\n}: {\n  integrationFieldType: { label: string; value: string } | null;\n  handleFieldValue: (value: any) => void;\n  value: any;\n}) => {\n  switch (`${integrationFieldType?.value}`) {\n    case \"BOOLEAN\":\n      return (\n        <Select\n          options={[\n            {\n              label: \"true\",\n              value: \"TRUE\"\n            },\n            {\n              label: \"false\",\n              value: \"FALSE\"\n            }\n          ]}\n          size=\"lg\"\n          value={value}\n          placeholder=\"\"\n          onChange={(booleanValue) =>\n            handleFieldValue({\n              type: \"BOOLEAN\",\n              value: booleanValue\n            })\n          }\n        />\n      );\n    case \"DATE_TIME\":\n      return (\n        <CustomDateMenu\n          value={value}\n          onChangeHandler={(dateValue: DateValue) => {\n            handleFieldValue({\n              type: \"DATE_TIME\",\n              value: dateValue\n            });\n          }}\n        />\n      );\n    case \"NUMBER\":\n      return (\n        <Input\n          size=\"lg\"\n          type=\"number\"\n          placeholder=\"\"\n          value={value}\n          onChange={(e) =>\n            handleFieldValue({\n              type: \"NUMBER\",\n              value: e.currentTarget.value\n            })\n          }\n        />\n      );\n    default:\n      return (\n        <Input\n          size=\"lg\"\n          placeholder=\"\"\n          value={value}\n          onChange={(e) =>\n            handleFieldValue({\n              type: \"STRING\",\n              value: e.currentTarget.value\n            })\n          }\n        />\n      );\n  }\n};\n"],"names":["React"],"mappings":"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"}

package/dist/es/mapping/components/mapping.js

@@ -3,7 +3,7 @@ import { surveySparrowURL, defaultFieldValue } from '../../commons/constants/ind
 import { fetchSurveyQuestions, fetchSurveyVariables, fetchContactProperties, fetchSurveyExpression } from '../services/index.js';
 import ImportModal from '../../commons/components/import-modal.js';
 import { Spinner } from '../../commons/components/spinner.js';
-import Field from '../field.js';
+import Field from './field.js';
 import PlaceholderSpan from './placeholder-span.js';
 import v4 from '../../node_modules/uuid/dist/esm-browser/v4.js';
 import { Flex } from '../../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js';

package/dist/es/mapping/components/mapping.js.map

@@ -1 +1 @@
-{"version":3,"file":"mapping.js","sources":["../../../../src/mapping/components/mapping.tsx"],"sourcesContent":["import {\n  Box,\n  Button,\n  Checkbox,\n  Flex,\n  FormLabel,\n  Heading,\n  Select,\n  Text\n} from \"@sparrowengg/twigs-react\";\nimport React, { useEffect, useState } from \"react\";\nimport { PlusIcon } from \"@sparrowengg/twigs-react-icons\";\nimport { defaultFieldValue, surveySparrowURL } from \"../../commons/constants\";\nimport { v4 as uuid } from \"uuid\";\nimport {\n  fetchContactProperties,\n  fetchSurveyQuestions,\n  fetchSurveyVariables,\n  fetchSurveyExpression\n} from \"../services\";\nimport { MappingTypeProps, ssMappingDataResponse } from \"../types\";\nimport ImportModal from \"../../commons/components/import-modal\";\nimport { Spinner } from \"../../commons/components/spinner\";\nimport Field from \"../field\";\nimport PlaceholderSpan from \"./placeholder-span\";\n\nexport const Mapping = ({\n  integrationName,\n  surveyId,\n  fields,\n  setFields,\n  integrationFields,\n  hasCustomMenuProperty,\n  setIntegrationFields,\n  apiURL = surveySparrowURL,\n  token,\n  surveyDetails,\n  customList,\n  oldResponse\n}: MappingTypeProps) => {\n  const [ssMappingData, setSSMappingData] = useState<\n    ssMappingDataResponse<any>\n  >({\n    questions: [],\n    variables: [],\n    contactProperties: [],\n    expressions: []\n  });\n  const [showCustomPropertyModal, setShowCustomPropertyModal] = useState(false);\n  const [customPropertyField, setCustomPropertyField] = useState(\"\");\n  const [loader, setLoader] = useState(true);\n  const essentialFields = fields?.filter((field) => field?.isEssentialField);\n  const commonFields = fields?.filter((field) => !field?.isEssentialField);\n\n  const handleFieldValue = (id: string, property: string, value: any) => {\n    setFields(\n      fields?.map((field) => {\n        if (field.id === id) {\n          return property === \"type\"\n            ? { ...field, surveySparrowField: null, mappedType: value, id } :\n            property === \"integrationFieldType\" ? { ...field, defaultValue: null, [property]: value }\n            : { ...field, [property]: value };\n        } else {\n          return { ...field };\n        }\n      })\n    );\n  };\n  const hasRequiredProps = () =>\n    !!fields &&\n    !!setFields &&\n    !!integrationFields &&\n    !!setIntegrationFields &&\n    !!token;\n\n  const fetchInitalMappingData = async () => {\n    setLoader(true);\n    try {\n      const [questions, variables, contactProperties, expressions] =\n        await Promise.all([\n          fetchSurveyQuestions(apiURL, surveyId, token),\n          fetchSurveyVariables(apiURL, surveyId, token),\n          fetchContactProperties(apiURL, token),\n          fetchSurveyExpression(apiURL, surveyId, token)\n        ]);\n      setSSMappingData({\n        questions,\n        contactProperties,\n        variables,\n        expressions\n      });\n    } catch (error) {\n      console.error(error);\n    } finally {\n      setLoader(false);\n    }\n  };\n\n  const getEssentailFieldsNumber = (length: number): string => {\n    const numberMapping: any = {\n      1: 'one',\n      2: 'two',\n      3: 'three',\n      4: 'four',\n      5: 'five',\n      6: 'six',\n      7: 'seven',\n      8: 'eight',\n      9: 'nine',\n      10: 'ten'\n    };\n    return numberMapping[length] ?? 'These';\n  }\n\n  useEffect(() => {\n    setFields(\n      fields?.length === 0\n        ? [{ ...defaultFieldValue }]\n        : fields?.map((field) => ({ ...field, id: uuid() }))\n    );\n    if (!!token && token?.length > 60 && !!surveyId) {\n      fetchInitalMappingData();\n    } else {\n      setLoader(false);\n    }\n  }, [token, surveyId]);\n\n  return (\n    <Flex alignItems=\"center\" justifyContent=\"center\">\n      {hasRequiredProps() ? (\n        <>\n          {loader ? (\n            <Flex\n              alignItems=\"center\"\n              justifyContent=\"center\"\n              css={{ height: \"calc(100vh - 57px)\" }}\n            >\n              <Spinner />\n            </Flex>\n          ) : (\n            <Box css={{ maxWidth: 1120, width: \"100%\", marginBlock: \"$40\" }}>\n              <Heading\n                size=\"h5\"\n                css={{ color: \"$neutral900\" }}\n              >{`Map to ${integrationName}`}</Heading>\n              <Flex gap=\"$2\" css={{ marginTop: \"$4\" }}>\n                <Text size=\"sm\" css={{ color: \"$neutral500\" }}>\n                  Survey Name:\n                </Text>\n                <Text size=\"sm\" css={{ color: \"$neutral800\" }}>\n                  {surveyDetails.surveyName}\n                </Text>\n              </Flex>\n              {!!essentialFields?.length && (\n                <Box\n                  css={{\n                    width: \"100%\",\n                    paddingBlock: \"$12 $20\",\n                    borderBottom: \"$borderWidths$xs dashed $neutral200\",\n                    maxWidth: 1084\n                  }}\n                >\n                  <Text\n                    size=\"md\"\n                    css={{\n                      color: \"$neutral500\",\n                      lineHeight: \"$md\",\n                      marginTop: \"$4\"\n                    }}\n                  >\n                    This connection requires{\" \"}\n                    <PlaceholderSpan color=\"$neutral600\">{getEssentailFieldsNumber(essentialFields?.length)}</PlaceholderSpan>\n                    <PlaceholderSpan color=\"$negative500\">\n                      *\n                    </PlaceholderSpan>{\" \"}\n                    Essential mapping\n                  </Text>\n                  <Flex\n                    flexDirection=\"column\"\n                    gap=\"$20\"\n                    css={{ marginTop: \"$12\" }}\n                  >\n                    {essentialFields?.map((field, idx) => (\n                      <Field\n                        key={field.id}\n                        field={field}\n                        integrationName={integrationName}\n                        handleFieldValue={(id, property, value) =>\n                          handleFieldValue(id, property, value)\n                        }\n                        hasCustomMenuProperty={hasCustomMenuProperty}\n                        integrationFields={integrationFields}\n                        isBtnDisabled={commonFields.length === 1}\n                        isFirstField={idx === 0}\n                        ssMappingData={ssMappingData}\n                        showCustomPropertyModal={() => {\n                          setShowCustomPropertyModal(true);\n                        }}\n                      />\n                    ))}\n                  </Flex>\n                </Box>\n              )}\n              <Flex flexDirection=\"column\" gap=\"$16\" css={{ marginTop: \"$16\" }}>\n                {commonFields?.map((field, idx) => {\n                  return (\n                    <Field\n                      key={field.id}\n                      field={field}\n                      integrationName={integrationName}\n                      removeField={() => {\n                        setFields((prev) =>\n                          prev.filter(\n                            (currentField) => currentField.id !== field.id\n                          )\n                        );\n                      }}\n                      handleFieldValue={(id, property, value) =>\n                        handleFieldValue(id, property, value)\n                      }\n                      hasCustomMenuProperty={hasCustomMenuProperty}\n                      integrationFields={integrationFields}\n                      isBtnDisabled={commonFields.length === 1}\n                      isFirstField={idx === 0}\n                      ssMappingData={ssMappingData}\n                      showCustomPropertyModal={() => {\n                        setShowCustomPropertyModal(true);\n                      }}\n                    />\n                  );\n                })}\n              </Flex>\n              {!!commonFields.length && (\n                <Button\n                  leftIcon={<PlusIcon />}\n                  color=\"default\"\n                  css={{ marginTop: \"$10\" }}\n                  onClick={() =>\n                    setFields([\n                      ...fields,\n                      {\n                        ...defaultFieldValue,\n                        id: uuid()\n                      }\n                    ])\n                  }\n                  size=\"md\"\n                >\n                  New mapping field\n                </Button>\n              )}\n\n              {/* Custom List */}\n              {customList?.hasCustomList && (\n                <Flex\n                  css={{ marginTop: \"$40\" }}\n                  flexDirection=\"column\"\n                  gap=\"$8\"\n                >\n                  <Flex flexDirection=\"column\" gap=\"$3\">\n                    <Heading size=\"h5\">Choose a List</Heading>\n                    <Text css={{ color: \"$neutral500\" }} size=\"sm\">\n                      Pick a list to save mapped fields; If not, they'll be\n                      saved under all profiles.\n                    </Text>\n                  </Flex>\n                  <Select\n                    css={{ maxWidth: 400, width: \"100%\" }}\n                    size=\"lg\"\n                    options={customList.options}\n                    value={customList.value}\n                    placeholder=\"\"\n                    onChange={(value) => customList.onChangeHandler(value)}\n                  />\n                </Flex>\n              )}\n              {/* Old Response */}\n              {oldResponse?.hasOldResponse && (\n                <Checkbox\n                  onChange={(value) => oldResponse.onChangeHandler(value)}\n                  css={{ marginBlock: \"$8\", cursor: \"pointer\" }}\n                  checked={oldResponse.value as boolean}\n                >\n                  <FormLabel size=\"sm\">Import Old Response</FormLabel>\n                </Checkbox>\n              )}\n              {showCustomPropertyModal && (\n                <ImportModal\n                  onCloseHandler={() => setShowCustomPropertyModal(false)}\n                  onInputHandler={(value) => setCustomPropertyField(value)}\n                  onSaveHandler={() => {\n                    setIntegrationFields &&\n                      setIntegrationFields((prev) => [\n                        ...prev,\n                        {\n                          label: customPropertyField,\n                          value: customPropertyField\n                        }\n                      ]);\n                    setShowCustomPropertyModal(false);\n                  }}\n                />\n              )}\n            </Box>\n          )}\n        </>\n      ) : (\n        <Flex\n          alignItems=\"center\"\n          justifyContent=\"center\"\n          css={{ height: \"100%\" }}\n        >\n          <Heading size=\"h4\" weight=\"bold\">\n            Provide the needed props to import Mapping Template\n          </Heading>\n        </Flex>\n      )}\n    </Flex>\n  );\n};\n"],"names":["uuid","React"],"mappings":"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"}
+{"version":3,"file":"mapping.js","sources":["../../../../src/mapping/components/mapping.tsx"],"sourcesContent":["import {\n  Box,\n  Button,\n  Checkbox,\n  Flex,\n  FormLabel,\n  Heading,\n  Select,\n  Text\n} from \"@sparrowengg/twigs-react\";\nimport React, { useEffect, useState } from \"react\";\nimport { PlusIcon } from \"@sparrowengg/twigs-react-icons\";\nimport { defaultFieldValue, surveySparrowURL } from \"../../commons/constants\";\nimport { v4 as uuid } from \"uuid\";\nimport {\n  fetchContactProperties,\n  fetchSurveyQuestions,\n  fetchSurveyVariables,\n  fetchSurveyExpression\n} from \"../services\";\nimport { MappingTypeProps, ssMappingDataResponse } from \"../types\";\nimport ImportModal from \"../../commons/components/import-modal\";\nimport { Spinner } from \"../../commons/components/spinner\";\nimport Field from \"./field\";\nimport PlaceholderSpan from \"./placeholder-span\";\n\nexport const Mapping = ({\n  integrationName,\n  surveyId,\n  fields,\n  setFields,\n  integrationFields,\n  hasCustomMenuProperty,\n  setIntegrationFields,\n  apiURL = surveySparrowURL,\n  token,\n  surveyDetails,\n  customList,\n  oldResponse\n}: MappingTypeProps) => {\n  const [ssMappingData, setSSMappingData] = useState<\n    ssMappingDataResponse<any>\n  >({\n    questions: [],\n    variables: [],\n    contactProperties: [],\n    expressions: []\n  });\n  const [showCustomPropertyModal, setShowCustomPropertyModal] = useState(false);\n  const [customPropertyField, setCustomPropertyField] = useState(\"\");\n  const [loader, setLoader] = useState(true);\n  const essentialFields = fields?.filter((field) => field?.isEssentialField);\n  const commonFields = fields?.filter((field) => !field?.isEssentialField);\n\n  const handleFieldValue = (id: string, property: string, value: any) => {\n    setFields(\n      fields?.map((field) => {\n        if (field.id === id) {\n          return property === \"type\"\n            ? { ...field, surveySparrowField: null, mappedType: value, id } :\n            property === \"integrationFieldType\" ? { ...field, defaultValue: null, [property]: value }\n            : { ...field, [property]: value };\n        } else {\n          return { ...field };\n        }\n      })\n    );\n  };\n  const hasRequiredProps = () =>\n    !!fields &&\n    !!setFields &&\n    !!integrationFields &&\n    !!setIntegrationFields &&\n    !!token;\n\n  const fetchInitalMappingData = async () => {\n    setLoader(true);\n    try {\n      const [questions, variables, contactProperties, expressions] =\n        await Promise.all([\n          fetchSurveyQuestions(apiURL, surveyId, token),\n          fetchSurveyVariables(apiURL, surveyId, token),\n          fetchContactProperties(apiURL, token),\n          fetchSurveyExpression(apiURL, surveyId, token)\n        ]);\n      setSSMappingData({\n        questions,\n        contactProperties,\n        variables,\n        expressions\n      });\n    } catch (error) {\n      console.error(error);\n    } finally {\n      setLoader(false);\n    }\n  };\n\n  const getEssentailFieldsNumber = (length: number): string => {\n    const numberMapping: any = {\n      1: 'one',\n      2: 'two',\n      3: 'three',\n      4: 'four',\n      5: 'five',\n      6: 'six',\n      7: 'seven',\n      8: 'eight',\n      9: 'nine',\n      10: 'ten'\n    };\n    return numberMapping[length] ?? 'These';\n  }\n\n  useEffect(() => {\n    setFields(\n      fields?.length === 0\n        ? [{ ...defaultFieldValue }]\n        : fields?.map((field) => ({ ...field, id: uuid() }))\n    );\n    if (!!token && token?.length > 60 && !!surveyId) {\n      fetchInitalMappingData();\n    } else {\n      setLoader(false);\n    }\n  }, [token, surveyId]);\n\n  return (\n    <Flex alignItems=\"center\" justifyContent=\"center\">\n      {hasRequiredProps() ? (\n        <>\n          {loader ? (\n            <Flex\n              alignItems=\"center\"\n              justifyContent=\"center\"\n              css={{ height: \"calc(100vh - 57px)\" }}\n            >\n              <Spinner />\n            </Flex>\n          ) : (\n            <Box css={{ maxWidth: 1120, width: \"100%\", marginBlock: \"$40\" }}>\n              <Heading\n                size=\"h5\"\n                css={{ color: \"$neutral900\" }}\n              >{`Map to ${integrationName}`}</Heading>\n              <Flex gap=\"$2\" css={{ marginTop: \"$4\" }}>\n                <Text size=\"sm\" css={{ color: \"$neutral500\" }}>\n                  Survey Name:\n                </Text>\n                <Text size=\"sm\" css={{ color: \"$neutral800\" }}>\n                  {surveyDetails.surveyName}\n                </Text>\n              </Flex>\n              {!!essentialFields?.length && (\n                <Box\n                  css={{\n                    width: \"100%\",\n                    paddingBlock: \"$12 $20\",\n                    borderBottom: \"$borderWidths$xs dashed $neutral200\",\n                    maxWidth: 1084\n                  }}\n                >\n                  <Text\n                    size=\"md\"\n                    css={{\n                      color: \"$neutral500\",\n                      lineHeight: \"$md\",\n                      marginTop: \"$4\"\n                    }}\n                  >\n                    This connection requires{\" \"}\n                    <PlaceholderSpan color=\"$neutral600\">{getEssentailFieldsNumber(essentialFields?.length)}</PlaceholderSpan>\n                    <PlaceholderSpan color=\"$negative500\">\n                      *\n                    </PlaceholderSpan>{\" \"}\n                    Essential mapping\n                  </Text>\n                  <Flex\n                    flexDirection=\"column\"\n                    gap=\"$20\"\n                    css={{ marginTop: \"$12\" }}\n                  >\n                    {essentialFields?.map((field, idx) => (\n                      <Field\n                        key={field.id}\n                        field={field}\n                        integrationName={integrationName}\n                        handleFieldValue={(id, property, value) =>\n                          handleFieldValue(id, property, value)\n                        }\n                        hasCustomMenuProperty={hasCustomMenuProperty}\n                        integrationFields={integrationFields}\n                        isBtnDisabled={commonFields.length === 1}\n                        isFirstField={idx === 0}\n                        ssMappingData={ssMappingData}\n                        showCustomPropertyModal={() => {\n                          setShowCustomPropertyModal(true);\n                        }}\n                      />\n                    ))}\n                  </Flex>\n                </Box>\n              )}\n              <Flex flexDirection=\"column\" gap=\"$16\" css={{ marginTop: \"$16\" }}>\n                {commonFields?.map((field, idx) => {\n                  return (\n                    <Field\n                      key={field.id}\n                      field={field}\n                      integrationName={integrationName}\n                      removeField={() => {\n                        setFields((prev) =>\n                          prev.filter(\n                            (currentField) => currentField.id !== field.id\n                          )\n                        );\n                      }}\n                      handleFieldValue={(id, property, value) =>\n                        handleFieldValue(id, property, value)\n                      }\n                      hasCustomMenuProperty={hasCustomMenuProperty}\n                      integrationFields={integrationFields}\n                      isBtnDisabled={commonFields.length === 1}\n                      isFirstField={idx === 0}\n                      ssMappingData={ssMappingData}\n                      showCustomPropertyModal={() => {\n                        setShowCustomPropertyModal(true);\n                      }}\n                    />\n                  );\n                })}\n              </Flex>\n              {!!commonFields.length && (\n                <Button\n                  leftIcon={<PlusIcon />}\n                  color=\"default\"\n                  css={{ marginTop: \"$10\" }}\n                  onClick={() =>\n                    setFields([\n                      ...fields,\n                      {\n                        ...defaultFieldValue,\n                        id: uuid()\n                      }\n                    ])\n                  }\n                  size=\"md\"\n                >\n                  New mapping field\n                </Button>\n              )}\n\n              {/* Custom List */}\n              {customList?.hasCustomList && (\n                <Flex\n                  css={{ marginTop: \"$40\" }}\n                  flexDirection=\"column\"\n                  gap=\"$8\"\n                >\n                  <Flex flexDirection=\"column\" gap=\"$3\">\n                    <Heading size=\"h5\">Choose a List</Heading>\n                    <Text css={{ color: \"$neutral500\" }} size=\"sm\">\n                      Pick a list to save mapped fields; If not, they'll be\n                      saved under all profiles.\n                    </Text>\n                  </Flex>\n                  <Select\n                    css={{ maxWidth: 400, width: \"100%\" }}\n                    size=\"lg\"\n                    options={customList.options}\n                    value={customList.value}\n                    placeholder=\"\"\n                    onChange={(value) => customList.onChangeHandler(value)}\n                  />\n                </Flex>\n              )}\n              {/* Old Response */}\n              {oldResponse?.hasOldResponse && (\n                <Checkbox\n                  onChange={(value) => oldResponse.onChangeHandler(value)}\n                  css={{ marginBlock: \"$8\", cursor: \"pointer\" }}\n                  checked={oldResponse.value as boolean}\n                >\n                  <FormLabel size=\"sm\">Import Old Response</FormLabel>\n                </Checkbox>\n              )}\n              {showCustomPropertyModal && (\n                <ImportModal\n                  onCloseHandler={() => setShowCustomPropertyModal(false)}\n                  onInputHandler={(value) => setCustomPropertyField(value)}\n                  onSaveHandler={() => {\n                    setIntegrationFields &&\n                      setIntegrationFields((prev) => [\n                        ...prev,\n                        {\n                          label: customPropertyField,\n                          value: customPropertyField\n                        }\n                      ]);\n                    setShowCustomPropertyModal(false);\n                  }}\n                />\n              )}\n            </Box>\n          )}\n        </>\n      ) : (\n        <Flex\n          alignItems=\"center\"\n          justifyContent=\"center\"\n          css={{ height: \"100%\" }}\n        >\n          <Heading size=\"h4\" weight=\"bold\">\n            Provide the needed props to import Mapping Template\n          </Heading>\n        </Flex>\n      )}\n    </Flex>\n  );\n};\n"],"names":["uuid","React"],"mappings":"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"}

package/dist/es/mapping/index.js

@@ -136,6 +136,7 @@ const EventSetup = ({
       Button,
       {
         size: "lg",
+        disabled: !actions.value && !events.value || !accounts.value,
         rightIcon: /* @__PURE__ */ React__default.createElement(ChevronRightIcon, null),
         css: { marginTop: "$16" },
         onClick: () => navigateMappingPage()

package/dist/es/mapping/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/mapping/index.tsx"],"sourcesContent":["import {\n  Box,\n  Button,\n  Flex,\n  FormLabel,\n  Heading,\n  IconButton,\n  Select,\n  Text,\n  ThemeProvider\n} from \"@sparrowengg/twigs-react\";\nimport {\n  ArrowLeftIcon,\n  ChevronRightIcon\n} from \"@sparrowengg/twigs-react-icons\";\nimport React, { useEffect, useState } from \"react\";\nimport Arrow from \"../commons/icons/arrow\";\nimport { Mapping as FieldMapping } from \"./components/mapping\";\nimport { surveySparrowURL } from \"../commons/constants\";\nimport { CustomListFieldType, FieldType, OldResponseFieldType } from \"./types\";\n\ntype FieldMappingPropsType = {\n  surveyDetails: {\n    surveyName: string;\n    surveyId: string | number;\n  };\n  integrationName: string;\n  fields: Array<FieldType>;\n  setFields: React.Dispatch<React.SetStateAction<Array<FieldType>>>;\n  integrationFields: any;\n  setIntegrationFields: React.Dispatch<React.SetStateAction<any>>;\n  apiURL: string;\n  token: string;\n  accounts: {\n    hasAccounts: boolean;\n    options: Array<any>;\n    value: { label: string; value: string } | null | boolean;\n    onChangeHandler: (value: any) => void;\n  };\n  events: {\n    hasEvents: boolean;\n    options: Array<any>;\n    value: { label: string; value: string } | null | boolean;\n    onChangeHandler: (value: any) => void;\n  };\n  actions: {\n    hasActions: boolean;\n    options: Array<any>;\n    value: { label: string; value: string } | null | boolean;\n    onChangeHandler: (value: any) => void;\n  };\n  isMappingPage: boolean;\n  navigateMappingPage: (value?: boolean) => void;\n  customList: CustomListFieldType;\n  oldResponse: OldResponseFieldType;\n  hasPreviousMapping: boolean;\n  onSaveHandler: () => void;\n  editField: any;\n  previousMappingHandler: (value?: boolean) => void;\n  onDeleteHandler?: (id: string | number) => void;\n};\n\nexport const Mapping = ({\n  surveyDetails,\n  integrationName,\n  fields,\n  setFields,\n  integrationFields,\n  setIntegrationFields,\n  apiURL = surveySparrowURL,\n  token,\n  accounts,\n  events,\n  actions,\n  isMappingPage,\n  navigateMappingPage,\n  customList,\n  oldResponse,\n  hasPreviousMapping,\n  onSaveHandler,\n  editField,\n  previousMappingHandler\n}: FieldMappingPropsType) => {\n\n  const [previousMapping, setPreviousMapping] = useState(hasPreviousMapping ?? false);\n\n  useEffect(() => {\n    if (!!editField?.id) {\n      navigateMappingPage(true);\n      setFields(editField.fieldValues);\n      setPreviousMapping(true);\n    }\n  }, []);\n\n  return (\n    <ThemeProvider\n      theme={{\n        fonts: {\n          body: \"DM Sans, Roboto Mono, sans-serif\",\n          heading: \"DM Sans, Roboto Mono,  sans-serif\"\n        }\n      }}\n    >\n      <Box css={{ height: \"100vh\", width: \"100vw\" }}>\n        <MappingHeader\n          hasPreviousMapping={previousMapping}\n          isMappingPage={isMappingPage}\n          fields={fields}\n          editFieldId={editField?.id}\n          onSaveHandler={onSaveHandler}\n          navigateEventPage={() => navigateMappingPage(false)}\n          previousMappingHandler={previousMappingHandler}\n        />\n        {!isMappingPage ? (\n          <EventSetup\n            surveyDetails={surveyDetails}\n            accounts={accounts}\n            events={events}\n            actions={actions}\n            navigateMappingPage={navigateMappingPage}\n          />\n        ) : (\n          <FieldMapping\n            fields={fields}\n            setFields={setFields}\n            surveyDetails={surveyDetails}\n            integrationFields={integrationFields}\n            setIntegrationFields={setIntegrationFields}\n            surveyId={surveyDetails.surveyId}\n            token={token}\n            apiURL={apiURL}\n            integrationName={integrationName}\n            customList={customList}\n            oldResponse={oldResponse}\n          />\n        )}\n      </Box>\n    </ThemeProvider>\n  );\n};\n\ntype EventSetupProps = {\n  surveyDetails: {\n    surveyName: string;\n    surveyId: number | string;\n  };\n  accounts: {\n    hasAccounts: boolean;\n    options: Array<any>;\n    value: { label: string; value: string } | null | boolean;\n    onChangeHandler: (value: any) => void;\n  };\n  events: {\n    hasEvents: boolean;\n    options: Array<any>;\n    value: { label: string; value: string } | null | boolean;\n    onChangeHandler: (value: any) => void;\n  };\n  actions: {\n    hasActions: boolean;\n    options: Array<any>;\n    value: { label: string; value: string } | null | boolean;\n    onChangeHandler: (value: any) => void;\n  };\n  navigateMappingPage: (value?: boolean) => void;\n};\n\nconst EventSetup = ({\n  surveyDetails,\n  accounts,\n  events,\n  actions,\n  navigateMappingPage\n}: EventSetupProps) => {\n  return (\n    <Flex\n      css={{ paddingTop: \"$40\" }}\n      alignItems=\"center\"\n      justifyContent=\"center\"\n    >\n      <Box css={{ width: 488 }}>\n        <Heading size=\"h5\">Account Details</Heading>\n        <Flex gap=\"$2\" css={{ marginTop: \"$4\" }}>\n          <Text size=\"sm\" css={{ color: \"$neutral500\" }}>\n            Survey Name:\n          </Text>\n          <Text size=\"sm\" css={{ color: \"$neutral800\" }}>\n            {surveyDetails.surveyName}\n          </Text>\n        </Flex>\n        <Flex flexDirection=\"column\" gap=\"$8\" css={{ marginTop: \"$16\" }}>\n          {accounts?.hasAccounts && (\n            <Flex gap=\"$2\" flexDirection=\"column\">\n              <FormLabel size=\"xs\" css={{ fontWeight: \"$5\" }}>\n                Choose Account\n              </FormLabel>\n              <Select\n                value={accounts.value}\n                options={accounts.options}\n                placeholder=\"\"\n                onChange={(value) => accounts.onChangeHandler(value)}\n                size=\"lg\"\n              />\n            </Flex>\n          )}\n          {events?.hasEvents && (\n            <Flex gap=\"$2\" flexDirection=\"column\">\n              <FormLabel size=\"xs\" css={{ fontWeight: \"$5\" }}>\n                Choose Object\n              </FormLabel>\n              <Select\n                options={events.options}\n                value={events.value}\n                placeholder=\"\"\n                onChange={(value) => events.onChangeHandler(value)}\n                size=\"lg\"\n              />\n            </Flex>\n          )}\n          {actions?.hasActions && (\n            <Flex gap=\"$2\" flexDirection=\"column\">\n              <FormLabel size=\"xs\" css={{ fontWeight: \"$5\" }}>\n                Choose Action\n              </FormLabel>\n              <Select\n                size=\"lg\"\n                options={actions.options}\n                value={actions.value}\n                placeholder=\"\"\n                onChange={(value) => actions.onChangeHandler(value)}\n              />\n            </Flex>\n          )}\n        </Flex>\n        <Button\n          size=\"lg\"\n          rightIcon={<ChevronRightIcon />}\n          css={{ marginTop: \"$16\" }}\n          onClick={() => navigateMappingPage()}\n        >\n          Continue, Mapping\n        </Button>\n      </Box>\n    </Flex>\n  );\n};\n\ntype MappingHeaderProps = {\n  hasPreviousMapping: boolean;\n  isMappingPage: boolean;\n  fields: Array<FieldType>;\n  navigateEventPage: () => void;\n  onSaveHandler: (editFieldId?: string | number) => void;\n  previousMappingHandler: (value?: boolean) => void;\n  editFieldId: string | number;\n};\n\nconst MappingHeader = ({\n  hasPreviousMapping,\n  isMappingPage,\n  fields,\n  navigateEventPage,\n  onSaveHandler,\n  previousMappingHandler,\n  editFieldId\n}: MappingHeaderProps) => {\n  \n  const hasAllValues = (field: FieldType) => {\n    return (\n      field?.surveySparrowField !== null &&\n      field?.integrationField !== null &&\n      field?.integrationFieldType !== null\n    );\n  };\n\n  return (\n    <Flex\n      alignItems=\"center\"\n      justifyContent=\"space-between\"\n      css={{\n        borderBottom: \"$borderWidths$xs solid $neutral200\",\n        padding: \"$8 $12\"\n      }}\n    >\n      <Flex\n        gap=\"$6\"\n        alignItems=\"center\"\n        css={{ visibility: hasPreviousMapping ? \"visible\" : \"hidden\" }}\n      >\n        <IconButton onClick={() => previousMappingHandler()} color=\"default\" icon={<ArrowLeftIcon />} size=\"lg\" />\n        <Heading size=\"h6\">New Mapping</Heading>\n      </Flex>\n      <Flex\n        alignItems=\"center\"\n        gap=\"$4\"\n        css={{\n          \"& button\": { background: \"transparent !important\", fontSize: \"$md\" }\n        }}\n      >\n        <Button\n          css={{ color: !isMappingPage ? \"$neutral900\" : \"$neutral800\" }}\n          color=\"default\"\n          variant=\"ghost\"\n          size=\"md\"\n          onClick={() => isMappingPage && navigateEventPage()}\n        >\n          Event Setup\n        </Button>\n        <Arrow />\n        <Button\n          css={{ color: isMappingPage ? \"$neutral900\" : \"$neutral800\" }}\n          color=\"default\"\n          variant=\"ghost\"\n          size=\"md\"\n        >\n          Mapping\n        </Button>\n      </Flex>\n      <Button\n        size=\"lg\"\n        disabled={!fields.some(hasAllValues)}\n        onClick={() => onSaveHandler(editFieldId)}\n        css={{ visibility: isMappingPage ? \"visible\" : \"hidden\" }}\n      >\n        Save Mapping\n      </Button>\n    </Flex>\n  );\n};\n"],"names":["React","FieldMapping"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/mapping/index.tsx"],"sourcesContent":["import {\n  Box,\n  Button,\n  Flex,\n  FormLabel,\n  Heading,\n  IconButton,\n  Select,\n  Text,\n  ThemeProvider\n} from \"@sparrowengg/twigs-react\";\nimport {\n  ArrowLeftIcon,\n  ChevronRightIcon\n} from \"@sparrowengg/twigs-react-icons\";\nimport React, { useEffect, useState } from \"react\";\nimport Arrow from \"../commons/icons/arrow\";\nimport { Mapping as FieldMapping } from \"./components/mapping\";\nimport { surveySparrowURL } from \"../commons/constants\";\nimport { CustomListFieldType, FieldType, OldResponseFieldType } from \"./types\";\n\ntype FieldMappingPropsType = {\n  surveyDetails: {\n    surveyName: string;\n    surveyId: string | number;\n  };\n  integrationName: string;\n  fields: Array<FieldType>;\n  setFields: React.Dispatch<React.SetStateAction<Array<FieldType>>>;\n  integrationFields: any;\n  setIntegrationFields: React.Dispatch<React.SetStateAction<any>>;\n  apiURL: string;\n  token: string;\n  accounts: {\n    hasAccounts: boolean;\n    options: Array<any>;\n    value: { label: string; value: string } | null | boolean;\n    onChangeHandler: (value: any) => void;\n  };\n  events: {\n    hasEvents: boolean;\n    options: Array<any>;\n    value: { label: string; value: string } | null | boolean;\n    onChangeHandler: (value: any) => void;\n  };\n  actions: {\n    hasActions: boolean;\n    options: Array<any>;\n    value: { label: string; value: string } | null | boolean;\n    onChangeHandler: (value: any) => void;\n  };\n  isMappingPage: boolean;\n  navigateMappingPage: (value?: boolean) => void;\n  customList: CustomListFieldType;\n  oldResponse: OldResponseFieldType;\n  hasPreviousMapping: boolean;\n  onSaveHandler: () => void;\n  editField: any;\n  previousMappingHandler: (value?: boolean) => void;\n  onDeleteHandler?: (id: string | number) => void;\n};\n\nexport const Mapping = ({\n  surveyDetails,\n  integrationName,\n  fields,\n  setFields,\n  integrationFields,\n  setIntegrationFields,\n  apiURL = surveySparrowURL,\n  token,\n  accounts,\n  events,\n  actions,\n  isMappingPage,\n  navigateMappingPage,\n  customList,\n  oldResponse,\n  hasPreviousMapping,\n  onSaveHandler,\n  editField,\n  previousMappingHandler\n}: FieldMappingPropsType) => {\n\n  const [previousMapping, setPreviousMapping] = useState(hasPreviousMapping ?? false);\n\n  useEffect(() => {\n    if (!!editField?.id) {\n      navigateMappingPage(true);\n      setFields(editField.fieldValues);\n      setPreviousMapping(true);\n    }\n  }, []);\n\n  return (\n    <ThemeProvider\n      theme={{\n        fonts: {\n          body: \"DM Sans, Roboto Mono, sans-serif\",\n          heading: \"DM Sans, Roboto Mono,  sans-serif\"\n        }\n      }}\n    >\n      <Box css={{ height: \"100vh\", width: \"100vw\" }}>\n        <MappingHeader\n          hasPreviousMapping={previousMapping}\n          isMappingPage={isMappingPage}\n          fields={fields}\n          editFieldId={editField?.id}\n          onSaveHandler={onSaveHandler}\n          navigateEventPage={() => navigateMappingPage(false)}\n          previousMappingHandler={previousMappingHandler}\n        />\n        {!isMappingPage ? (\n          <EventSetup\n            surveyDetails={surveyDetails}\n            accounts={accounts}\n            events={events}\n            actions={actions}\n            navigateMappingPage={navigateMappingPage}\n          />\n        ) : (\n          <FieldMapping\n            fields={fields}\n            setFields={setFields}\n            surveyDetails={surveyDetails}\n            integrationFields={integrationFields}\n            setIntegrationFields={setIntegrationFields}\n            surveyId={surveyDetails.surveyId}\n            token={token}\n            apiURL={apiURL}\n            integrationName={integrationName}\n            customList={customList}\n            oldResponse={oldResponse}\n          />\n        )}\n      </Box>\n    </ThemeProvider>\n  );\n};\n\ntype EventSetupProps = {\n  surveyDetails: {\n    surveyName: string;\n    surveyId: number | string;\n  };\n  accounts: {\n    hasAccounts: boolean;\n    options: Array<any>;\n    value: { label: string; value: string } | null | boolean;\n    onChangeHandler: (value: any) => void;\n  };\n  events: {\n    hasEvents: boolean;\n    options: Array<any>;\n    value: { label: string; value: string } | null | boolean;\n    onChangeHandler: (value: any) => void;\n  };\n  actions: {\n    hasActions: boolean;\n    options: Array<any>;\n    value: { label: string; value: string } | null | boolean;\n    onChangeHandler: (value: any) => void;\n  };\n  navigateMappingPage: (value?: boolean) => void;\n};\n\nconst EventSetup = ({\n  surveyDetails,\n  accounts,\n  events,\n  actions,\n  navigateMappingPage\n}: EventSetupProps) => {\n  return (\n    <Flex\n      css={{ paddingTop: \"$40\" }}\n      alignItems=\"center\"\n      justifyContent=\"center\"\n    >\n      <Box css={{ width: 488 }}>\n        <Heading size=\"h5\">Account Details</Heading>\n        <Flex gap=\"$2\" css={{ marginTop: \"$4\" }}>\n          <Text size=\"sm\" css={{ color: \"$neutral500\" }}>\n            Survey Name:\n          </Text>\n          <Text size=\"sm\" css={{ color: \"$neutral800\" }}>\n            {surveyDetails.surveyName}\n          </Text>\n        </Flex>\n        <Flex flexDirection=\"column\" gap=\"$8\" css={{ marginTop: \"$16\" }}>\n          {accounts?.hasAccounts && (\n            <Flex gap=\"$2\" flexDirection=\"column\">\n              <FormLabel size=\"xs\" css={{ fontWeight: \"$5\" }}>\n                Choose Account\n              </FormLabel>\n              <Select\n                value={accounts.value}\n                options={accounts.options}\n                placeholder=\"\"\n                onChange={(value) => accounts.onChangeHandler(value)}\n                size=\"lg\"\n              />\n            </Flex>\n          )}\n          {events?.hasEvents && (\n            <Flex gap=\"$2\" flexDirection=\"column\">\n              <FormLabel size=\"xs\" css={{ fontWeight: \"$5\" }}>\n                Choose Object\n              </FormLabel>\n              <Select\n                options={events.options}\n                value={events.value}\n                placeholder=\"\"\n                onChange={(value) => events.onChangeHandler(value)}\n                size=\"lg\"\n              />\n            </Flex>\n          )}\n          {actions?.hasActions && (\n            <Flex gap=\"$2\" flexDirection=\"column\">\n              <FormLabel size=\"xs\" css={{ fontWeight: \"$5\" }}>\n                Choose Action\n              </FormLabel>\n              <Select\n                size=\"lg\"\n                options={actions.options}\n                value={actions.value}\n                placeholder=\"\"\n                onChange={(value) => actions.onChangeHandler(value)}\n              />\n            </Flex>\n          )}\n        </Flex>\n        <Button\n          size=\"lg\"\n          disabled={!actions.value && !events.value || !accounts.value}\n          rightIcon={<ChevronRightIcon />}\n          css={{ marginTop: \"$16\" }}\n          onClick={() => navigateMappingPage()}\n        >\n          Continue, Mapping\n        </Button>\n      </Box>\n    </Flex>\n  );\n};\n\ntype MappingHeaderProps = {\n  hasPreviousMapping: boolean;\n  isMappingPage: boolean;\n  fields: Array<FieldType>;\n  navigateEventPage: () => void;\n  onSaveHandler: (editFieldId?: string | number) => void;\n  previousMappingHandler: (value?: boolean) => void;\n  editFieldId: string | number;\n};\n\nconst MappingHeader = ({\n  hasPreviousMapping,\n  isMappingPage,\n  fields,\n  navigateEventPage,\n  onSaveHandler,\n  previousMappingHandler,\n  editFieldId\n}: MappingHeaderProps) => {\n  \n  const hasAllValues = (field: FieldType) => {\n    return (\n      field?.surveySparrowField !== null &&\n      field?.integrationField !== null &&\n      field?.integrationFieldType !== null\n    );\n  };\n\n  return (\n    <Flex\n      alignItems=\"center\"\n      justifyContent=\"space-between\"\n      css={{\n        borderBottom: \"$borderWidths$xs solid $neutral200\",\n        padding: \"$8 $12\"\n      }}\n    >\n      <Flex\n        gap=\"$6\"\n        alignItems=\"center\"\n        css={{ visibility: hasPreviousMapping ? \"visible\" : \"hidden\" }}\n      >\n        <IconButton onClick={() => previousMappingHandler()} color=\"default\" icon={<ArrowLeftIcon />} size=\"lg\" />\n        <Heading size=\"h6\">New Mapping</Heading>\n      </Flex>\n      <Flex\n        alignItems=\"center\"\n        gap=\"$4\"\n        css={{\n          \"& button\": { background: \"transparent !important\", fontSize: \"$md\" }\n        }}\n      >\n        <Button\n          css={{ color: !isMappingPage ? \"$neutral900\" : \"$neutral800\" }}\n          color=\"default\"\n          variant=\"ghost\"\n          size=\"md\"\n          onClick={() => isMappingPage && navigateEventPage()}\n        >\n          Event Setup\n        </Button>\n        <Arrow />\n        <Button\n          css={{ color: isMappingPage ? \"$neutral900\" : \"$neutral800\" }}\n          color=\"default\"\n          variant=\"ghost\"\n          size=\"md\"\n        >\n          Mapping\n        </Button>\n      </Flex>\n      <Button\n        size=\"lg\"\n        disabled={!fields.some(hasAllValues)}\n        onClick={() => onSaveHandler(editFieldId)}\n        css={{ visibility: isMappingPage ? \"visible\" : \"hidden\" }}\n      >\n        Save Mapping\n      </Button>\n    </Flex>\n  );\n};\n"],"names":["React","FieldMapping"],"mappings":"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"}