@sparrowengg/integrations-templates-frontend 1.3.0 → 1.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -96,7 +96,6 @@ const ContactImportMapping = ({
96
96
  ]
97
97
  }));
98
98
  };
99
- console.log(contactImportField);
100
99
  return /* @__PURE__ */ React.createElement(flex.Flex, { justifyContent: "center" }, /* @__PURE__ */ React.createElement(box.Box, { css: { marginTop: "$40", maxWidth: 1176, width: "100%" } }, /* @__PURE__ */ React.createElement(
101
100
  box.Box,
102
101
  {
@@ -1 +1 @@
1
- {"version":3,"file":"contact-import-mapping.js","sources":["../../../../src/contact-import/components/contact-import-mapping.tsx"],"sourcesContent":["import {\n Box,\n Button,\n Flex,\n FormInput,\n FormLabel,\n Heading,\n IconButton,\n Select,\n Table,\n Tbody,\n Td,\n Text,\n Th,\n Thead,\n Tr\n} from \"@sparrowengg/twigs-react\";\nimport { DeleteIcon, PlusIcon } from \"@sparrowengg/twigs-react-icons\";\nimport React, { useEffect, useRef } from \"react\";\nconst defaultFieldValue = {\n integrationField: null,\n surveySparrowField: \"\",\n property: \"custom\"\n};\n\nconst ContactImportMapping = ({\n contactImportField,\n setContactImportField,\n integrationName,\n contactProperties,\n}: any) => {\n const customPropertyRef = useRef<HTMLDivElement | null>(null);\n const initialRenderRef = useRef(true);\n const errorFieldRef = useRef(false);\n\n useEffect(() => {\n if (initialRenderRef.current) {\n //to skip scroll on initial mounting\n initialRenderRef.current = false;\n } else {\n if (customPropertyRef?.current) {\n customPropertyRef.current.scrollIntoView({\n behavior: \"smooth\",\n block: \"end\"\n });\n }\n }\n }, []);\n\n const customFieldHandler = (\n id: string | number,\n property: string,\n value: any\n ) => {\n setContactImportField({\n ...contactImportField,\n fields: contactImportField.fields.map((field: any) => {\n if (field.id === id) {\n return { ...field, [property]: value };\n } else {\n return { ...field };\n }\n })\n });\n };\n\n const updateSurveySparrowField = (\n value: any,\n id: string | number,\n manuallyMapped: boolean\n ) => {\n setContactImportField({\n ...contactImportField,\n fields: contactImportField?.fields.map((field: any) => {\n if (field.id === id) {\n return {\n ...field,\n surveySparrowField: value,\n ...(manuallyMapped && { mapped: manuallyMapped })\n };\n } else {\n return { ...field };\n }\n })\n });\n };\n\n const addCustomProperty = () => {\n setContactImportField({\n ...contactImportField,\n fields: [\n ...contactImportField.fields,\n {\n id: contactImportField.fields?.length\n ? contactImportField.fields[contactImportField.fields?.length - 1]\n .id + 1\n : 1,\n ...defaultFieldValue\n }\n ]\n });\n };\n console.log(contactImportField);\n\n return (\n <Flex justifyContent=\"center\">\n <Box css={{ marginTop: \"$40\", maxWidth: 1176, width: \"100%\" }}>\n <Box\n css={{\n paddingLeft: \"$28\"\n }}\n >\n <Heading size=\"h5\">Map Contact Properties</Heading>\n <Text css={{ marginTop: \"$4\", color: \"$neutral600\" }} size=\"md\">\n Review these mappings before importing. Unmapped columns will be\n ignored.\n </Text>\n </Box>\n <Box\n css={{\n height: \"calc(100vh - 241px)\",\n paddingTop: \"$16\",\n overflowY: \"auto\",\n position: \"relative\",\n background: \"$white900\",\n paddingLeft: \"$28\"\n }}\n >\n <Table\n css={{\n width: \"100%\",\n background: \"$white900\",\n borderRadius: \"5px\",\n borderCollapse: \"collapse\"\n }}\n >\n <Thead\n css={{\n zIndex: 5,\n position: \"sticky\",\n top: \"-31px\",\n \"& th\": {\n textAlign: \"left\",\n fontWeight: 700,\n paddingBlock: \"$6\",\n lineHeight: \"$sm\",\n background: \"$white900\",\n boxShadow: '0 1px 0 rgba(0,0,0,0.1)',\n borderBlock: \"$borderWidths$xs solid $neutral200\",\n }\n }}\n >\n <Th>{`${integrationName} Profile Fields Data`}</Th>\n <Th css={{ borderLeft: \"$borderWidths$xs solid $neutral100\" }}>SurveySparrow Mapping</Th>\n </Thead>\n <Tbody\n css={{\n \"& tr\": {\n borderBottom: \"$borderWidths$xs solid $neutral200\"\n }\n }}\n >\n {contactImportField.fields.map((field: any) => {\n const hasSurveyFieldValue = contactProperties.some(\n (contact: any) => contact.value === field.surveySparrowField\n );\n return (\n <Tr\n key={field.id}\n css={{\n position: \"relative\",\n \"& td\": {\n paddingBlock: \"$8 $12\",\n paddingInline: \"$6\",\n verticalAlign: \"top\"\n }\n }}\n >\n <Td\n css={{\n width: 560,\n \"& > p\": {\n lineHeight: \"$sm\",\n color: \"$neutral600\"\n }\n }}\n >\n {field.property !== \"custom\" ? (\n <>\n <Text\n size=\"sm\"\n css={{\n color: \"$neutral900 !important\"\n }}\n weight=\"medium\"\n >\n {(\n field?.integrationField?.charAt(0).toUpperCase() +\n field?.integrationField.slice(1)\n ).replace(\"_\", \" \")}\n </Text>\n {field?.sampleData.length ? (\n <>\n {field.sampleData.map((sample: any) => (\n <Text\n size=\"xs\"\n css={{\n color: \"$neutral600\",\n lineHeight: \"$xs !important\"\n }}\n >\n {sample.length > 40\n ? sample.slice(0, 40) + \"...\"\n : sample}\n </Text>\n ))}\n </>\n ) : null}\n </>\n ) : (\n <Box css={{ position: \"relative\" }}>\n <FormInput\n size=\"lg\"\n onChange={(event) =>\n customFieldHandler(\n field.id,\n \"integrationField\",\n event.currentTarget.value\n )\n }\n />\n <FormLabel\n css={{ marginTop: \"$4\", color: \"$neutral400\" }}\n >\n Enter the exact custom property name for accurate\n mapping. It is case-sensitive.\n </FormLabel>\n {field.property === \"custom\" ? (\n <IconButton\n css={{\n position: \"absolute\",\n top: \"0\",\n left: \"-70px\"\n }}\n size=\"lg\"\n variant=\"ghost\"\n color=\"secondary\"\n onClick={() => {\n setContactImportField({\n ...contactImportField,\n fields: contactImportField?.fields.filter((currentField: any) => currentField?.id !== field?.id)\n })\n }}\n icon={<DeleteIcon />}\n />\n ) : null}\n </Box>\n )}\n </Td>\n <Td\n css={{\n width: 560,\n borderLeft: \"$borderWidths$xs solid $neutral100\"\n }}\n >\n <>\n <Select\n size=\"lg\"\n placeholder=\"--Choose Property--\"\n value={\n field.surveySparrowField\n ? {\n label: contactProperties.find(\n (contact: any) =>\n contact.value === field.surveySparrowField\n )?.label,\n value: field.surveySparrowField\n }\n : null\n }\n options={contactProperties.filter(\n (contact: any) => contact.type !== \"DEPENDENT_FIELD\"\n )}\n onChange={(currentField: any) => {\n updateSurveySparrowField(\n currentField.value,\n field.id,\n true\n );\n }}\n css={{\n marginBottom:\n !hasSurveyFieldValue &&\n !field.surveySparrowFieldError &&\n field.property === \"custom\"\n ? \"$12\"\n : 0,\n ...(!field.surveySparrowField &&\n field.surveySparrowFieldError && {\n \"& .twigs-select__control, & .twigs-select__control:hover\":\n {\n boxShadow: \"0px 1.5px 0px 0px #f65633\",\n borderBottom: 0\n }\n })\n }}\n />\n {hasSurveyFieldValue ? (\n <FormLabel\n css={{\n color: field?.mapped ? \"$neutral600\" : \"#0F966C\",\n marginBlock: \"$4 $12\"\n }}\n size=\"xs\"\n >\n {field?.mapped\n ? \"Manually mapped by you\"\n : \"Automatically mapped\"}\n </FormLabel>\n ) : null}\n {!field.surveySparrowField &&\n field.surveySparrowFieldError && (\n <FormLabel\n css={{\n color: \"$negative500\",\n marginTop: \"$4\"\n }}\n size=\"xs\"\n >\n Please select the property\n </FormLabel>\n )}\n </>\n </Td>\n </Tr>\n );\n })}\n\n <Tr\n css={{\n borderBottom: \"none !important\",\n \"&:hover\": {\n background: \"$white900\"\n }\n }}\n >\n <Td colSpan={2}>\n <Button\n size=\"md\"\n variant=\"ghost\"\n leftIcon={<PlusIcon />}\n onClick={addCustomProperty}\n >\n Add Custom Property\n </Button>\n </Td>\n </Tr>\n </Tbody>\n </Table>\n </Box>\n </Box>\n </Flex>\n );\n};\n\nexport default ContactImportMapping;\n"],"names":["useRef","useEffect","Flex","Box","Heading","Text","Table","Thead","Th","Tbody","Tr","Td","FormInput","FormLabel","IconButton","DeleteIcon","Select","Button","PlusIcon"],"mappings":"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"}
1
+ {"version":3,"file":"contact-import-mapping.js","sources":["../../../../src/contact-import/components/contact-import-mapping.tsx"],"sourcesContent":["import {\n Box,\n Button,\n Flex,\n FormInput,\n FormLabel,\n Heading,\n IconButton,\n Select,\n Table,\n Tbody,\n Td,\n Text,\n Th,\n Thead,\n Tr\n} from \"@sparrowengg/twigs-react\";\nimport { DeleteIcon, PlusIcon } from \"@sparrowengg/twigs-react-icons\";\nimport React, { useEffect, useRef } from \"react\";\nconst defaultFieldValue = {\n integrationField: null,\n surveySparrowField: \"\",\n property: \"custom\"\n};\n\nconst ContactImportMapping = ({\n contactImportField,\n setContactImportField,\n integrationName,\n contactProperties,\n}: any) => {\n const customPropertyRef = useRef<HTMLDivElement | null>(null);\n const initialRenderRef = useRef(true);\n const errorFieldRef = useRef(false);\n\n useEffect(() => {\n if (initialRenderRef.current) {\n //to skip scroll on initial mounting\n initialRenderRef.current = false;\n } else {\n if (customPropertyRef?.current) {\n customPropertyRef.current.scrollIntoView({\n behavior: \"smooth\",\n block: \"end\"\n });\n }\n }\n }, []);\n\n const customFieldHandler = (\n id: string | number,\n property: string,\n value: any\n ) => {\n setContactImportField({\n ...contactImportField,\n fields: contactImportField.fields.map((field: any) => {\n if (field.id === id) {\n return { ...field, [property]: value };\n } else {\n return { ...field };\n }\n })\n });\n };\n\n const updateSurveySparrowField = (\n value: any,\n id: string | number,\n manuallyMapped: boolean\n ) => {\n setContactImportField({\n ...contactImportField,\n fields: contactImportField?.fields.map((field: any) => {\n if (field.id === id) {\n return {\n ...field,\n surveySparrowField: value,\n ...(manuallyMapped && { mapped: manuallyMapped })\n };\n } else {\n return { ...field };\n }\n })\n });\n };\n\n const addCustomProperty = () => {\n setContactImportField({\n ...contactImportField,\n fields: [\n ...contactImportField.fields,\n {\n id: contactImportField.fields?.length\n ? contactImportField.fields[contactImportField.fields?.length - 1]\n .id + 1\n : 1,\n ...defaultFieldValue\n }\n ]\n });\n };\n\n return (\n <Flex justifyContent=\"center\">\n <Box css={{ marginTop: \"$40\", maxWidth: 1176, width: \"100%\" }}>\n <Box\n css={{\n paddingLeft: \"$28\"\n }}\n >\n <Heading size=\"h5\">Map Contact Properties</Heading>\n <Text css={{ marginTop: \"$4\", color: \"$neutral600\" }} size=\"md\">\n Review these mappings before importing. Unmapped columns will be\n ignored.\n </Text>\n </Box>\n <Box\n css={{\n height: \"calc(100vh - 241px)\",\n paddingTop: \"$16\",\n overflowY: \"auto\",\n position: \"relative\",\n background: \"$white900\",\n paddingLeft: \"$28\"\n }}\n >\n <Table\n css={{\n width: \"100%\",\n background: \"$white900\",\n borderRadius: \"5px\",\n borderCollapse: \"collapse\"\n }}\n >\n <Thead\n css={{\n zIndex: 5,\n position: \"sticky\",\n top: \"-31px\",\n \"& th\": {\n textAlign: \"left\",\n fontWeight: 700,\n paddingBlock: \"$6\",\n lineHeight: \"$sm\",\n background: \"$white900\",\n boxShadow: '0 1px 0 rgba(0,0,0,0.1)',\n borderBlock: \"$borderWidths$xs solid $neutral200\",\n }\n }}\n >\n <Th>{`${integrationName} Profile Fields Data`}</Th>\n <Th css={{ borderLeft: \"$borderWidths$xs solid $neutral100\" }}>SurveySparrow Mapping</Th>\n </Thead>\n <Tbody\n css={{\n \"& tr\": {\n borderBottom: \"$borderWidths$xs solid $neutral200\"\n }\n }}\n >\n {contactImportField.fields.map((field: any) => {\n const hasSurveyFieldValue = contactProperties.some(\n (contact: any) => contact.value === field.surveySparrowField\n );\n return (\n <Tr\n key={field.id}\n css={{\n position: \"relative\",\n \"& td\": {\n paddingBlock: \"$8 $12\",\n paddingInline: \"$6\",\n verticalAlign: \"top\"\n }\n }}\n >\n <Td\n css={{\n width: 560,\n \"& > p\": {\n lineHeight: \"$sm\",\n color: \"$neutral600\"\n }\n }}\n >\n {field.property !== \"custom\" ? (\n <>\n <Text\n size=\"sm\"\n css={{\n color: \"$neutral900 !important\"\n }}\n weight=\"medium\"\n >\n {(\n field?.integrationField?.charAt(0).toUpperCase() +\n field?.integrationField.slice(1)\n ).replace(\"_\", \" \")}\n </Text>\n {field?.sampleData.length ? (\n <>\n {field.sampleData.map((sample: any) => (\n <Text\n size=\"xs\"\n css={{\n color: \"$neutral600\",\n lineHeight: \"$xs !important\"\n }}\n >\n {sample.length > 40\n ? sample.slice(0, 40) + \"...\"\n : sample}\n </Text>\n ))}\n </>\n ) : null}\n </>\n ) : (\n <Box css={{ position: \"relative\" }}>\n <FormInput\n size=\"lg\"\n onChange={(event) =>\n customFieldHandler(\n field.id,\n \"integrationField\",\n event.currentTarget.value\n )\n }\n />\n <FormLabel\n css={{ marginTop: \"$4\", color: \"$neutral400\" }}\n >\n Enter the exact custom property name for accurate\n mapping. It is case-sensitive.\n </FormLabel>\n {field.property === \"custom\" ? (\n <IconButton\n css={{\n position: \"absolute\",\n top: \"0\",\n left: \"-70px\"\n }}\n size=\"lg\"\n variant=\"ghost\"\n color=\"secondary\"\n onClick={() => {\n setContactImportField({\n ...contactImportField,\n fields: contactImportField?.fields.filter((currentField: any) => currentField?.id !== field?.id)\n })\n }}\n icon={<DeleteIcon />}\n />\n ) : null}\n </Box>\n )}\n </Td>\n <Td\n css={{\n width: 560,\n borderLeft: \"$borderWidths$xs solid $neutral100\"\n }}\n >\n <>\n <Select\n size=\"lg\"\n placeholder=\"--Choose Property--\"\n value={\n field.surveySparrowField\n ? {\n label: contactProperties.find(\n (contact: any) =>\n contact.value === field.surveySparrowField\n )?.label,\n value: field.surveySparrowField\n }\n : null\n }\n options={contactProperties.filter(\n (contact: any) => contact.type !== \"DEPENDENT_FIELD\"\n )}\n onChange={(currentField: any) => {\n updateSurveySparrowField(\n currentField.value,\n field.id,\n true\n );\n }}\n css={{\n marginBottom:\n !hasSurveyFieldValue &&\n !field.surveySparrowFieldError &&\n field.property === \"custom\"\n ? \"$12\"\n : 0,\n ...(!field.surveySparrowField &&\n field.surveySparrowFieldError && {\n \"& .twigs-select__control, & .twigs-select__control:hover\":\n {\n boxShadow: \"0px 1.5px 0px 0px #f65633\",\n borderBottom: 0\n }\n })\n }}\n />\n {hasSurveyFieldValue ? (\n <FormLabel\n css={{\n color: field?.mapped ? \"$neutral600\" : \"#0F966C\",\n marginBlock: \"$4 $12\"\n }}\n size=\"xs\"\n >\n {field?.mapped\n ? \"Manually mapped by you\"\n : \"Automatically mapped\"}\n </FormLabel>\n ) : null}\n {!field.surveySparrowField &&\n field.surveySparrowFieldError && (\n <FormLabel\n css={{\n color: \"$negative500\",\n marginTop: \"$4\"\n }}\n size=\"xs\"\n >\n Please select the property\n </FormLabel>\n )}\n </>\n </Td>\n </Tr>\n );\n })}\n\n <Tr\n css={{\n borderBottom: \"none !important\",\n \"&:hover\": {\n background: \"$white900\"\n }\n }}\n >\n <Td colSpan={2}>\n <Button\n size=\"md\"\n variant=\"ghost\"\n leftIcon={<PlusIcon />}\n onClick={addCustomProperty}\n >\n Add Custom Property\n </Button>\n </Td>\n </Tr>\n </Tbody>\n </Table>\n </Box>\n </Box>\n </Flex>\n );\n};\n\nexport default ContactImportMapping;\n"],"names":["useRef","useEffect","Flex","Box","Heading","Text","Table","Thead","Th","Tbody","Tr","Td","FormInput","FormLabel","IconButton","DeleteIcon","Select","Button","PlusIcon"],"mappings":"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"}
@@ -37,7 +37,8 @@ const Dashboard = ({
37
37
  handleEditField,
38
38
  handleDashboardPage,
39
39
  deleteFieldHandler,
40
- toggleDashboardField
40
+ toggleDashboardField,
41
+ hasDropdownComponents
41
42
  }) => {
42
43
  const isSingleAccountMappingCompleted = !hasMultiAccounts && !!(mappingFields == null ? void 0 : mappingFields.fields.length);
43
44
  const isSingleAccountTriggerCompleted = !hasMultiAccounts && !!(triggerFields == null ? void 0 : triggerFields.length);
@@ -56,7 +57,7 @@ const Dashboard = ({
56
57
  align: "start",
57
58
  css: { maxWidth: 240, zIndex: 10 }
58
59
  },
59
- /* @__PURE__ */ React.createElement(
60
+ hasDropdownComponents.trigger ? /* @__PURE__ */ React.createElement(
60
61
  DropdownItem,
61
62
  {
62
63
  icon: /* @__PURE__ */ React.createElement(cursor.default, { size: 24, color: "#6A6A6A" }),
@@ -65,8 +66,8 @@ const Dashboard = ({
65
66
  isDisabled: isSingleAccountTriggerCompleted,
66
67
  onClickHandler: () => handleConfigurationType("TRIGGER")
67
68
  }
68
- ),
69
- /* @__PURE__ */ React.createElement(
69
+ ) : null,
70
+ hasDropdownComponents.mapping ? /* @__PURE__ */ React.createElement(
70
71
  DropdownItem,
71
72
  {
72
73
  icon: /* @__PURE__ */ React.createElement(mapping.default, { size: 24, color: "#6A6A6A" }),
@@ -75,7 +76,7 @@ const Dashboard = ({
75
76
  description: `Create/Update record in ${integrationName} from survey responses`,
76
77
  onClickHandler: () => handleConfigurationType("MAPPING")
77
78
  }
78
- )
79
+ ) : null
79
80
  )))
80
81
  ), hasMultiAccounts ? /* @__PURE__ */ React.createElement(
81
82
  MultiAccountDashboard,
@@ -278,7 +279,16 @@ const MultiAccountFallback = ({
278
279
  },
279
280
  "Creating one is as easy as a breeze. Just a click away to get started."
280
281
  ),
281
- /* @__PURE__ */ React.createElement(button.Button, { size: "lg", leftIcon: /* @__PURE__ */ React.createElement(plus.PlusIcon, null), variant: "outline", onClick: onClickHandler }, `New ${title}`)
282
+ /* @__PURE__ */ React.createElement(
283
+ button.Button,
284
+ {
285
+ size: "lg",
286
+ leftIcon: /* @__PURE__ */ React.createElement(plus.PlusIcon, null),
287
+ variant: "outline",
288
+ onClick: onClickHandler
289
+ },
290
+ `New ${title}`
291
+ )
282
292
  );
283
293
  };
284
294
  const SingleAccountDashboard = ({
@@ -859,186 +869,179 @@ const DashboardItem = ({
859
869
  }
860
870
  return field;
861
871
  };
862
- return /* @__PURE__ */ React.createElement(
872
+ return /* @__PURE__ */ React.createElement(flex.Flex, { flexDirection: "column" }, /* @__PURE__ */ React.createElement(
863
873
  flex.Flex,
864
874
  {
865
- flexDirection: "column"
875
+ css: {
876
+ border: isMappingDisplayed ? "$borderWidths$xs solid $black400" : "$borderWidths$xs solid $neutral200",
877
+ borderRadius: isMappingDisplayed ? "$2xl $2xl 0 0" : "$2xl",
878
+ padding: "$10 $12",
879
+ width: "100%",
880
+ backgroundColor: isMappingDisplayed ? "rgba(100, 116, 139, 0.04)" : "$white900"
881
+ },
882
+ justifyContent: "space-between",
883
+ alignItems: "center"
866
884
  },
867
885
  /* @__PURE__ */ React.createElement(
868
886
  flex.Flex,
869
887
  {
870
- css: {
871
- border: isMappingDisplayed ? "$borderWidths$xs solid $black400" : "$borderWidths$xs solid $neutral200",
872
- borderRadius: isMappingDisplayed ? "$2xl $2xl 0 0" : "$2xl",
873
- padding: "$10 $12",
874
- width: "100%",
875
- backgroundColor: isMappingDisplayed ? "rgba(100, 116, 139, 0.04)" : "$white900"
876
- },
877
- justifyContent: "space-between",
878
- alignItems: "center"
888
+ alignItems: "center",
889
+ gap: "$4",
890
+ css: { cursor: "pointer" },
891
+ onClick: () => setIsMappingDisplayed(!isMappingDisplayed)
892
+ },
893
+ isMappingDisplayed ? /* @__PURE__ */ React.createElement(chevronDown.ChevronDownIcon, { size: 40, color: "#848484" }) : /* @__PURE__ */ React.createElement(chevronRight.ChevronRightIcon, { size: 40, color: "#848484" }),
894
+ /* @__PURE__ */ React.createElement(flex.Flex, { alignItems: "center", gap: "$4" }, icon, /* @__PURE__ */ React.createElement(flex.Flex, { gap: "$1", flexDirection: "column" }, /* @__PURE__ */ React.createElement(text.Text, { size: "md", weight: "bold" }, heading), /* @__PURE__ */ React.createElement(text.Text, { size: "sm", css: { color: "$neutral600" } }, description)))
895
+ ),
896
+ /* @__PURE__ */ React.createElement(flex.Flex, { alignItems: "center", gap: "$12" }, /* @__PURE__ */ React.createElement(
897
+ _switch.Switch,
898
+ {
899
+ size: "md",
900
+ checked: isEnabled,
901
+ onChange: (value) => toggleDashboardField(id, value)
902
+ }
903
+ ), /* @__PURE__ */ React.createElement(dropdown.DropdownMenu, null, /* @__PURE__ */ React.createElement(dropdown.DropdownMenuTrigger, { asChild: true }, /* @__PURE__ */ React.createElement(
904
+ iconButton.IconButton,
905
+ {
906
+ variant: "ghost",
907
+ color: "default",
908
+ size: "lg",
909
+ icon: /* @__PURE__ */ React.createElement(ellipsisVertical.EllipsisVerticalIcon, null)
910
+ }
911
+ )), /* @__PURE__ */ React.createElement(
912
+ dropdown.DropdownMenuContent,
913
+ {
914
+ css: { minWidth: 180, zIndex: 10 },
915
+ sideOffset: 4,
916
+ align: "end"
879
917
  },
880
918
  /* @__PURE__ */ React.createElement(
881
- flex.Flex,
919
+ dropdown.DropdownMenuItem,
882
920
  {
883
- alignItems: "center",
884
- gap: "$4",
885
- css: { cursor: "pointer" },
886
- onClick: () => setIsMappingDisplayed(!isMappingDisplayed)
921
+ onClick: () => {
922
+ handleEditField({
923
+ type,
924
+ values: fields,
925
+ id
926
+ });
927
+ handleDashboardPage(false, type);
928
+ }
887
929
  },
888
- isMappingDisplayed ? /* @__PURE__ */ React.createElement(chevronDown.ChevronDownIcon, { size: 40, color: "#848484" }) : /* @__PURE__ */ React.createElement(chevronRight.ChevronRightIcon, { size: 40, color: "#848484" }),
889
- /* @__PURE__ */ React.createElement(flex.Flex, { alignItems: "center", gap: "$4" }, icon, /* @__PURE__ */ React.createElement(flex.Flex, { gap: "$1", flexDirection: "column" }, /* @__PURE__ */ React.createElement(text.Text, { size: "md", weight: "bold" }, heading), /* @__PURE__ */ React.createElement(text.Text, { size: "sm", css: { color: "$neutral600" } }, description)))
930
+ /* @__PURE__ */ React.createElement(flex.Flex, { alignItems: "center", gap: "$2" }, /* @__PURE__ */ React.createElement(pencil.PencilIcon, { color: "#6A6A6A", size: 20 }), /* @__PURE__ */ React.createElement(text.Text, { size: "sm" }, "Edit"))
890
931
  ),
891
- /* @__PURE__ */ React.createElement(flex.Flex, { alignItems: "center", gap: "$12" }, /* @__PURE__ */ React.createElement(
892
- _switch.Switch,
893
- {
894
- size: "md",
895
- checked: isEnabled,
896
- onChange: (value) => toggleDashboardField(id, value)
897
- }
898
- ), /* @__PURE__ */ React.createElement(dropdown.DropdownMenu, null, /* @__PURE__ */ React.createElement(dropdown.DropdownMenuTrigger, { asChild: true }, /* @__PURE__ */ React.createElement(
899
- iconButton.IconButton,
900
- {
901
- variant: "ghost",
902
- color: "default",
903
- size: "lg",
904
- icon: /* @__PURE__ */ React.createElement(ellipsisVertical.EllipsisVerticalIcon, null)
905
- }
906
- )), /* @__PURE__ */ React.createElement(
907
- dropdown.DropdownMenuContent,
908
- {
909
- css: { minWidth: 180, zIndex: 10 },
910
- sideOffset: 4,
911
- align: "end"
912
- },
913
- /* @__PURE__ */ React.createElement(
914
- dropdown.DropdownMenuItem,
915
- {
916
- onClick: () => {
917
- handleEditField({
918
- type,
919
- values: fields,
920
- id
921
- });
922
- handleDashboardPage(false, type);
923
- }
924
- },
925
- /* @__PURE__ */ React.createElement(flex.Flex, { alignItems: "center", gap: "$2" }, /* @__PURE__ */ React.createElement(pencil.PencilIcon, { color: "#6A6A6A", size: 20 }), /* @__PURE__ */ React.createElement(text.Text, { size: "sm" }, "Edit"))
926
- ),
927
- /* @__PURE__ */ React.createElement(dropdown.DropdownMenuItem, { onClick: () => deleteFieldHandler(id) }, /* @__PURE__ */ React.createElement(flex.Flex, { alignItems: "center", gap: "$2" }, /* @__PURE__ */ React.createElement(_delete.DeleteIcon, { color: "#6A6A6A", size: 20 }), /* @__PURE__ */ React.createElement(text.Text, { size: "sm" }, "Delete")))
928
- )))
929
- ),
932
+ /* @__PURE__ */ React.createElement(dropdown.DropdownMenuItem, { onClick: () => deleteFieldHandler(id) }, /* @__PURE__ */ React.createElement(flex.Flex, { alignItems: "center", gap: "$2" }, /* @__PURE__ */ React.createElement(_delete.DeleteIcon, { color: "#6A6A6A", size: 20 }), /* @__PURE__ */ React.createElement(text.Text, { size: "sm" }, "Delete")))
933
+ )))
934
+ ), /* @__PURE__ */ React.createElement(
935
+ box.Box,
936
+ {
937
+ css: {
938
+ height: isMappingDisplayed ? "100%" : 0
939
+ }
940
+ },
930
941
  /* @__PURE__ */ React.createElement(
931
942
  box.Box,
932
943
  {
933
944
  css: {
934
- height: isMappingDisplayed ? "100%" : 0
945
+ borderInline: "$borderWidths$xs solid $black400",
946
+ maxHeight: 432,
947
+ height: "100%",
948
+ position: "relative",
949
+ overflow: "auto"
935
950
  }
936
951
  },
937
- /* @__PURE__ */ React.createElement(
938
- box.Box,
952
+ (fields == null ? void 0 : fields.length) ? /* @__PURE__ */ React.createElement(table.Table, { css: { borderCollapse: "collapse", width: "100%" } }, /* @__PURE__ */ React.createElement(
953
+ table.Thead,
939
954
  {
940
955
  css: {
941
- borderInline: "$borderWidths$xs solid $black400",
942
- maxHeight: 432,
943
- height: "100%",
944
- position: "relative",
945
- overflow: "auto"
956
+ background: "$white900",
957
+ "& th": {
958
+ padding: "$7 $8",
959
+ fontSize: "$sm",
960
+ lineHeight: "$sm",
961
+ textAlign: "left",
962
+ borderInline: "none"
963
+ },
964
+ borderBottom: "$borderWidths$xs solid $neutral100",
965
+ position: "sticky",
966
+ top: 0,
967
+ zIndex: 10
946
968
  }
947
969
  },
948
- (fields == null ? void 0 : fields.length) ? /* @__PURE__ */ React.createElement(table.Table, { css: { borderCollapse: "collapse", width: "100%" } }, /* @__PURE__ */ React.createElement(
949
- table.Thead,
950
- {
951
- css: {
952
- background: "$white900",
953
- "& th": {
954
- padding: "$7 $8",
955
- fontSize: "$sm",
956
- lineHeight: "$sm",
957
- textAlign: "left",
958
- borderInline: "none"
959
- },
960
- borderBottom: "$borderWidths$xs solid $neutral100",
961
- position: "sticky",
962
- top: 0,
963
- zIndex: 10
964
- }
965
- },
966
- /* @__PURE__ */ React.createElement(table.Th, { css: { paddingLeft: "$38 !important" } }, "Type"),
967
- /* @__PURE__ */ React.createElement(table.Th, null, "SurveySparrow Field"),
968
- /* @__PURE__ */ React.createElement(table.Th, null, `${integrationName} Field`),
969
- /* @__PURE__ */ React.createElement(table.Th, { css: { paddingRight: "$20 !important" } }, "Default Value")
970
- ), /* @__PURE__ */ React.createElement(
971
- table.Tbody,
972
- {
973
- css: {
974
- "& tr:last-child": {
975
- borderBottom: 0,
976
- "& td": {
977
- borderBottom: 0
978
- }
979
- }
980
- }
981
- },
982
- fields.map((field) => {
983
- var _a, _b, _c, _d, _e, _f, _g;
984
- return /* @__PURE__ */ React.createElement(
985
- table.Tr,
986
- {
987
- css: {
988
- borderBottom: "$borderWidths$xs solid $neutral100",
989
- "& td": {
990
- padding: "$7 $8",
991
- fontSize: "$sm",
992
- lineHeight: "$sm",
993
- borderInline: "none"
994
- },
995
- "& td:first-child": {
996
- paddingLeft: "$38 !important"
997
- },
998
- "& td:last-child": {
999
- paddingRight: "$20 !important"
1000
- }
1001
- }
1002
- },
1003
- /* @__PURE__ */ React.createElement(table.Td, null, (_b = (_a = field.mappedType) == null ? void 0 : _a.label) != null ? _b : "--"),
1004
- /* @__PURE__ */ React.createElement(table.Td, null, (_d = (_c = field.surveySparrowField) == null ? void 0 : _c.label) != null ? _d : "--"),
1005
- /* @__PURE__ */ React.createElement(table.Td, null, (_f = (_e = field.integrationField) == null ? void 0 : _e.label) != null ? _f : "--"),
1006
- /* @__PURE__ */ React.createElement(table.Td, null, (_g = getDefaultFieldValue(field.defaultValue)) != null ? _g : "--")
1007
- );
1008
- })
1009
- )) : null
1010
- ),
1011
- isMappingDisplayed && /* @__PURE__ */ React.createElement(
1012
- box.Box,
970
+ /* @__PURE__ */ React.createElement(table.Th, { css: { paddingLeft: "$38 !important" } }, "Type"),
971
+ /* @__PURE__ */ React.createElement(table.Th, null, "SurveySparrow Field"),
972
+ /* @__PURE__ */ React.createElement(table.Th, null, `${integrationName} Field`),
973
+ /* @__PURE__ */ React.createElement(table.Th, { css: { paddingRight: "$20 !important" } }, "Default Value")
974
+ ), /* @__PURE__ */ React.createElement(
975
+ table.Tbody,
1013
976
  {
1014
977
  css: {
1015
- padding: "$8 $32",
1016
- border: "$borderWidths$xs solid $black400",
1017
- borderRadius: "0 0 $2xl $2xl",
1018
- height: "100%"
978
+ "& tr:last-child": {
979
+ borderBottom: 0,
980
+ "& td": {
981
+ borderBottom: 0
982
+ }
983
+ }
1019
984
  }
1020
985
  },
1021
- /* @__PURE__ */ React.createElement(
1022
- button.Button,
1023
- {
1024
- size: "sm",
1025
- onClick: () => {
1026
- handleEditField({
1027
- type,
1028
- values: fields,
1029
- id
1030
- });
1031
- handleDashboardPage(false, type);
986
+ fields.map((field) => {
987
+ var _a, _b, _c, _d, _e, _f, _g;
988
+ return /* @__PURE__ */ React.createElement(
989
+ table.Tr,
990
+ {
991
+ css: {
992
+ borderBottom: "$borderWidths$xs solid $neutral100",
993
+ "& td": {
994
+ padding: "$7 $8",
995
+ fontSize: "$sm",
996
+ lineHeight: "$sm",
997
+ borderInline: "none"
998
+ },
999
+ "& td:first-child": {
1000
+ paddingLeft: "$38 !important"
1001
+ },
1002
+ "& td:last-child": {
1003
+ paddingRight: "$20 !important"
1004
+ }
1005
+ }
1032
1006
  },
1033
- leftIcon: /* @__PURE__ */ React.createElement(pencil.PencilIcon, null),
1034
- color: "primary",
1035
- variant: "ghost"
1007
+ /* @__PURE__ */ React.createElement(table.Td, null, (_b = (_a = field.mappedType) == null ? void 0 : _a.label) != null ? _b : "--"),
1008
+ /* @__PURE__ */ React.createElement(table.Td, null, (_d = (_c = field.surveySparrowField) == null ? void 0 : _c.label) != null ? _d : "--"),
1009
+ /* @__PURE__ */ React.createElement(table.Td, null, (_f = (_e = field.integrationField) == null ? void 0 : _e.label) != null ? _f : "--"),
1010
+ /* @__PURE__ */ React.createElement(table.Td, null, (_g = getDefaultFieldValue(field.defaultValue)) != null ? _g : "--")
1011
+ );
1012
+ })
1013
+ )) : null
1014
+ ),
1015
+ isMappingDisplayed && /* @__PURE__ */ React.createElement(
1016
+ box.Box,
1017
+ {
1018
+ css: {
1019
+ padding: "$8 $32",
1020
+ border: "$borderWidths$xs solid $black400",
1021
+ borderRadius: "0 0 $2xl $2xl",
1022
+ height: "100%"
1023
+ }
1024
+ },
1025
+ /* @__PURE__ */ React.createElement(
1026
+ button.Button,
1027
+ {
1028
+ size: "sm",
1029
+ onClick: () => {
1030
+ handleEditField({
1031
+ type,
1032
+ values: fields,
1033
+ id
1034
+ });
1035
+ handleDashboardPage(false, type);
1036
1036
  },
1037
- `Edit ${heading}`
1038
- )
1037
+ leftIcon: /* @__PURE__ */ React.createElement(pencil.PencilIcon, null),
1038
+ color: "primary",
1039
+ variant: "ghost"
1040
+ },
1041
+ `Edit ${heading}`
1039
1042
  )
1040
1043
  )
1041
- );
1044
+ ));
1042
1045
  };
1043
1046
  const DropdownItem = ({
1044
1047
  icon,