@sparrowengg/integrations-templates-frontend 2.1.0-notion-release.33 → 2.1.0-notion-release.35

package/dist/cjs/single-mapping/components/ConfigurationField.js

@@ -0,0 +1,243 @@
+'use strict';
+
+var React = require('react');
+var flex = require('../../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js');
+var _switch = require('../../node_modules/@sparrowengg/twigs-react/dist/es/switch/switch.js');
+var text = require('../../node_modules/@sparrowengg/twigs-react/dist/es/text/text.js');
+var checkbox = require('../../node_modules/@sparrowengg/twigs-react/dist/es/checkbox/checkbox.js');
+var box = require('../../node_modules/@sparrowengg/twigs-react/dist/es/box/box.js');
+var formInput = require('../../node_modules/@sparrowengg/twigs-react/dist/es/input/form-input.js');
+var formLabel = require('../../node_modules/@sparrowengg/twigs-react/dist/es/form-label/form-label.js');
+var select = require('../../node_modules/@sparrowengg/twigs-react/dist/es/select/select.js');
+var tooltip = require('../../node_modules/@sparrowengg/twigs-react/dist/es/tooltip/tooltip.js');
+var indexA301f526_esm = require('../../node_modules/react-select/dist/index-a301f526.esm.js');
+var plus = require('../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/plus.js');
+var chip = require('../../node_modules/@sparrowengg/twigs-react/dist/es/chip/chip.js');
+var tickCircleFill = require('../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/tick-circle-fill.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 ConfigurationField = ({
+  field,
+  configuredFields,
+  responseImportType = null
+}) => {
+  var _a, _b, _c;
+  const fieldValue = (_b = (_a = configuredFields == null ? void 0 : configuredFields[field.id]) == null ? void 0 : _a.value) != null ? _b : null;
+  const [error, setError] = React.useState({
+    errorMessage: "",
+    error: false,
+    id: null
+  });
+  const validatePattern = (value) => {
+    if (!field.pattern)
+      return true;
+    const pattern = new RegExp(field.pattern);
+    return pattern.test(value) || value === "";
+  };
+  const handleInputChange = (value) => {
+    if (field.pattern) {
+      const isValid = validatePattern(value);
+      setError({
+        errorMessage: isValid ? "" : field.errorMessage || "Invalid input",
+        error: !isValid,
+        id: isValid ? null : field.id
+      });
+    }
+    field.onChangeHandler({
+      id: field.id,
+      value
+    });
+  };
+  const renderSwitch = () => /* @__PURE__ */ React.createElement(
+    flex.Flex,
+    {
+      gap: "$4",
+      alignItems: "center",
+      css: {
+        marginBlockStart: "$12",
+        borderTop: "$borderWidths$xs solid $neutral200",
+        paddingTop: "$16"
+      }
+    },
+    /* @__PURE__ */ React.createElement(
+      _switch.Switch,
+      {
+        disabled: field == null ? void 0 : field.disabled,
+        size: "sm",
+        checked: !!(field == null ? void 0 : field.value),
+        onChange: (value) => field.onChangeHandler({
+          id: field.id,
+          value
+        })
+      }
+    ),
+    /* @__PURE__ */ React.createElement(text.Text, { size: "md", weight: "regular", css: { color: "$neutral900" } }, field.label)
+  );
+  const renderCheckbox = () => /* @__PURE__ */ React.createElement(flex.Flex, { flexDirection: "column", alignItems: "start", gap: "$4" }, /* @__PURE__ */ React.createElement(flex.Flex, { gap: "$4", alignItems: "center" }, /* @__PURE__ */ React.createElement(
+    checkbox.Checkbox,
+    {
+      disabled: field == null ? void 0 : field.disabled,
+      checked: !!fieldValue,
+      onChange: (value) => field.onChangeHandler({
+        id: field.id,
+        value
+      })
+    }
+  ), /* @__PURE__ */ React.createElement(text.Text, { size: "sm", weight: "regular", css: { color: "$neutral900" } }, field.label)), /* @__PURE__ */ React.createElement(text.Text, { size: "sm", weight: "regular", css: { color: "$neutral500" } }, field.value && field.ifChecked ? field.ifChecked() : field.ifUnchecked ? field.ifUnchecked(responseImportType || "") : ""));
+  const renderInput = (shouldRender = true) => {
+    if (!shouldRender)
+      return null;
+    return /* @__PURE__ */ React.createElement(
+      box.Box,
+      {
+        className: "dm-sans",
+        css: {
+          label: {
+            fontSize: "$xs !important"
+          }
+        }
+      },
+      /* @__PURE__ */ React.createElement(
+        formInput.FormInput,
+        __spreadProps(__spreadValues(__spreadProps(__spreadValues({
+          disabled: field == null ? void 0 : field.disabled
+        }, error.id === field.id && {
+          error: error.errorMessage,
+          errorBorder: error.error
+        }), {
+          label: field.label,
+          value: typeof fieldValue === "object" ? "" : fieldValue || "",
+          size: "lg"
+        }), field.pattern && { pattern: field.pattern }), {
+          onChange: (event) => handleInputChange(event.currentTarget.value)
+        })
+      )
+    );
+  };
+  const renderSelect = (shouldRender = true) => {
+    if (!shouldRender)
+      return null;
+    return /* @__PURE__ */ React.createElement(
+      flex.Flex,
+      {
+        gap: "$2",
+        flexDirection: "column",
+        css: {
+          cursor: "pointer !important",
+          ".twigs-select__indicator": {
+            width: "14px !important",
+            color: "#848484 !important"
+          }
+        }
+      },
+      /* @__PURE__ */ React.createElement(formLabel.FormLabel, { size: "xs", css: { fontWeight: "$5" } }, field.label),
+      /* @__PURE__ */ React.createElement(CustomAddNewSelect, { field })
+    );
+  };
+  const shouldRenderSpreadsheetField = (field == null ? void 0 : field.id) === "spreadsheet" && ((_c = configuredFields == null ? void 0 : configuredFields.action) == null ? void 0 : _c.value);
+  switch (field.fieldType) {
+    case "switch":
+      return renderSwitch();
+    case "checkbox":
+      return renderCheckbox();
+    case "input":
+      return (field == null ? void 0 : field.id) === "spreadsheet" ? renderInput(shouldRenderSpreadsheetField) : renderInput();
+    default:
+      return (field == null ? void 0 : field.id) === "spreadsheet" ? renderSelect(shouldRenderSpreadsheetField) : renderSelect();
+  }
+};
+const CustomAddNewSelect = ({ field }) => {
+  return /* @__PURE__ */ React.createElement(
+    select.Select,
+    {
+      isDisabled: field == null ? void 0 : field.disabled,
+      placeholder: "",
+      size: "lg",
+      css: { cursor: "pointer" },
+      components: {
+        Option: CustomShareOption,
+        SingleValue: CustomSingleValue
+      },
+      styles: {
+        singleValue: (provided) => __spreadProps(__spreadValues({}, provided), {
+          display: "flex",
+          alignItems: "center",
+          cursor: "pointer"
+        })
+      },
+      value: field.value,
+      onChange: (value) => {
+        var _a;
+        field.onChangeHandler({
+          id: (_a = field == null ? void 0 : field.id) != null ? _a : field == null ? void 0 : field.label,
+          value
+        });
+      },
+      options: field.options
+    }
+  );
+};
+const CustomShareOption = (props) => {
+  if (props.data.value === "ADD_NEW") {
+    return /* @__PURE__ */ React.createElement(
+      tooltip.Tooltip,
+      {
+        content: props.data.tooltip || "",
+        css: {
+          zIndex: 999999999,
+          fontFamily: "DM Sans !important"
+        }
+      },
+      /* @__PURE__ */ React.createElement(box.Box, null, /* @__PURE__ */ React.createElement(indexA301f526_esm.c.Option, __spreadValues({}, props), /* @__PURE__ */ React.createElement(flex.Flex, { justifyContent: "center", alignItems: "center", css: { cursor: "pointer", zIndex: 999999999 } }, /* @__PURE__ */ React.createElement(
+        flex.Flex,
+        {
+          gap: "$2",
+          alignItems: "center",
+          css: {
+            color: "$primary500",
+            fontSize: "$sm",
+            fontWeight: "$7"
+          }
+        },
+        /* @__PURE__ */ React.createElement(plus.PlusIcon, { size: 16, color: "#4A9CA6" }),
+        "Add Account"
+      ))))
+    );
+  }
+  return /* @__PURE__ */ React.createElement(indexA301f526_esm.c.Option, __spreadValues({}, props), /* @__PURE__ */ React.createElement(
+    flex.Flex,
+    {
+      css: { cursor: "pointer", zIndex: 999999999 },
+      alignItems: "center",
+      justifyContent: "space-between",
+      gap: "$2"
+    },
+    /* @__PURE__ */ React.createElement(text.Text, { size: "sm" }, props.label),
+    props.data.isAddonAccount && /* @__PURE__ */ React.createElement(chip.Chip, { color: "primary", size: "sm", leftElement: /* @__PURE__ */ React.createElement(tickCircleFill.TickCircleFillIcon, null) }, "In Use (Add-on)")
+  ));
+};
+const CustomSingleValue = (props) => {
+  const icon = props.data.value === "ADD_NEW" ? /* @__PURE__ */ React.createElement(plus.PlusIcon, { size: 16 }) : null;
+  return /* @__PURE__ */ React.createElement(indexA301f526_esm.c.SingleValue, __spreadValues({}, props), /* @__PURE__ */ React.createElement(flex.Flex, { css: { cursor: "pointer" }, alignItems: "center", gap: "$2" }, icon, /* @__PURE__ */ React.createElement(text.Text, { size: "sm" }, props.data.label)));
+};
+
+exports.ConfigurationField = ConfigurationField;
+//# sourceMappingURL=ConfigurationField.js.map

package/dist/cjs/single-mapping/components/ConfigurationField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConfigurationField.js","sources":["../../../../src/single-mapping/components/ConfigurationField.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport {\n  Box,\n  Checkbox,\n  Chip,\n  Flex,\n  FormInput,\n  FormLabel,\n  Select,\n  Switch,\n  Text,\n  Tooltip,\n} from \"@sparrowengg/twigs-react\";\nimport { PlusIcon, TickCircleFillIcon } from \"@sparrowengg/twigs-react-icons\";\nimport { components, OptionProps, SingleValueProps } from \"react-select\";\nimport { ConfigurationFieldType, ValidationErrorType } from \"../types/configuration.types\";\n\ntype ConfigurationFieldProps = {\n  field: ConfigurationFieldType;\n  configuredFields: Record<string, any>;\n  responseImportType?: string | null;\n};\n\n/**\n * Renders a configuration field based on its type\n */\nexport const ConfigurationField: React.FC<ConfigurationFieldProps> = ({\n  field,\n  configuredFields,\n  responseImportType = null,\n}) => {\n  const fieldValue = configuredFields?.[field.id]?.value ?? null;\n  const [error, setError] = useState<ValidationErrorType>({\n    errorMessage: \"\",\n    error: false,\n    id: null,\n  });\n\n  const validatePattern = (value: string): boolean => {\n    if (!field.pattern) return true;\n    const pattern = new RegExp(field.pattern);\n    return pattern.test(value) || value === \"\";\n  };\n\n  const handleInputChange = (value: string) => {\n    if (field.pattern) {\n      const isValid = validatePattern(value);\n      setError({\n        errorMessage: isValid ? \"\" : field.errorMessage || \"Invalid input\",\n        error: !isValid,\n        id: isValid ? null : field.id,\n      });\n    }\n    field.onChangeHandler({\n      id: field.id as string,\n      value: value,\n    });\n  };\n\n  const renderSwitch = () => (\n    <Flex\n      gap=\"$4\"\n      alignItems=\"center\"\n      css={{\n        marginBlockStart: \"$12\",\n        borderTop: \"$borderWidths$xs solid $neutral200\",\n        paddingTop: \"$16\",\n      }}\n    >\n      <Switch\n        disabled={field?.disabled}\n        size=\"sm\"\n        checked={!!field?.value}\n        onChange={(value) =>\n          field.onChangeHandler({\n            id: field.id as string,\n            value: value,\n          })\n        }\n      />\n      <Text size=\"md\" weight=\"regular\" css={{ color: \"$neutral900\" }}>\n        {field.label}\n      </Text>\n    </Flex>\n  );\n\n  const renderCheckbox = () => (\n    <Flex flexDirection=\"column\" alignItems=\"start\" gap=\"$4\">\n      <Flex gap=\"$4\" alignItems=\"center\">\n        <Checkbox\n          disabled={field?.disabled}\n          checked={!!fieldValue}\n          onChange={(value) =>\n            field.onChangeHandler({\n              id: field.id as string,\n              value: value,\n            })\n          }\n        />\n        <Text size=\"sm\" weight=\"regular\" css={{ color: \"$neutral900\" }}>\n          {field.label}\n        </Text>\n      </Flex>\n      <Text size=\"sm\" weight=\"regular\" css={{ color: \"$neutral500\" }}>\n        {field.value && field.ifChecked\n          ? field.ifChecked()\n          : field.ifUnchecked\n            ? field.ifUnchecked(responseImportType || \"\")\n            : \"\"}\n      </Text>\n    </Flex>\n  );\n\n  const renderInput = (shouldRender: boolean = true) => {\n    if (!shouldRender) return null;\n\n    return (\n      <Box\n        className=\"dm-sans\"\n        css={{\n          label: {\n            fontSize: \"$xs !important\",\n          },\n        }}\n      >\n        <FormInput\n          disabled={field?.disabled}\n          {...(error.id === field.id && {\n            error: error.errorMessage,\n            errorBorder: error.error,\n          })}\n          label={field.label}\n          value={typeof fieldValue === \"object\" ? \"\" : fieldValue || \"\"}\n          size=\"lg\"\n          {...(field.pattern && { pattern: field.pattern })}\n          onChange={(event) => handleInputChange(event.currentTarget.value)}\n        />\n      </Box>\n    );\n  };\n\n  const renderSelect = (shouldRender: boolean = true) => {\n    if (!shouldRender) return null;\n\n    return (\n      <Flex\n        gap=\"$2\"\n        flexDirection=\"column\"\n        css={{\n          cursor: \"pointer !important\",\n          \".twigs-select__indicator\": {\n            width: \"14px !important\",\n            color: \"#848484 !important\",\n          },\n        }}\n      >\n        <FormLabel size=\"xs\" css={{ fontWeight: \"$5\" }}>\n          {field.label}\n        </FormLabel>\n        <CustomAddNewSelect field={field} />\n      </Flex>\n    );\n  };\n\n  // Handle conditional rendering for spreadsheet field\n  const shouldRenderSpreadsheetField = field?.id === \"spreadsheet\" && configuredFields?.action?.value;\n\n  switch (field.fieldType) {\n    case \"switch\":\n      return renderSwitch();\n    case \"checkbox\":\n      return renderCheckbox();\n    case \"input\":\n      return field?.id === \"spreadsheet\" ? renderInput(shouldRenderSpreadsheetField) : renderInput();\n    default:\n      return field?.id === \"spreadsheet\" ? renderSelect(shouldRenderSpreadsheetField) : renderSelect();\n  }\n};\n\n/**\n * Custom select component with add new option support\n */\nconst CustomAddNewSelect: React.FC<{ field: ConfigurationFieldType }> = ({ field }) => {\n  return (\n    <Select\n      isDisabled={field?.disabled}\n      placeholder=\"\"\n      size=\"lg\"\n      css={{ cursor: \"pointer\" }}\n      components={{\n        Option: CustomShareOption,\n        SingleValue: CustomSingleValue,\n      }}\n      styles={{\n        singleValue: (provided) => ({\n          ...provided,\n          display: \"flex\",\n          alignItems: \"center\",\n          cursor: \"pointer\",\n        }),\n      }}\n      value={field.value}\n      onChange={(value) => {\n        field.onChangeHandler({\n          id: (field?.id ?? field?.label) as string,\n          value: value as any,\n        });\n      }}\n      options={field.options}\n    />\n  );\n};\n\n/**\n * Custom option component for react-select\n */\nconst CustomShareOption: React.FC<OptionProps<any>> = (props) => {\n  if (props.data.value === \"ADD_NEW\") {\n    return (\n      <Tooltip\n        content={props.data.tooltip || \"\"}\n        css={{\n          zIndex: 999999999,\n          fontFamily: \"DM Sans !important\",\n        }}\n      >\n        <Box>\n          <components.Option {...props}>\n            <Flex justifyContent=\"center\" alignItems=\"center\" css={{ cursor: \"pointer\", zIndex: 999999999 }}>\n              <Flex\n                gap=\"$2\"\n                alignItems=\"center\"\n                css={{\n                  color: \"$primary500\",\n                  fontSize: \"$sm\",\n                  fontWeight: \"$7\",\n                }}\n              >\n                <PlusIcon size={16} color=\"#4A9CA6\" />\n                Add Account\n              </Flex>\n            </Flex>\n          </components.Option>\n        </Box>\n      </Tooltip>\n    );\n  }\n\n  return (\n    <components.Option {...props}>\n      <Flex\n        css={{ cursor: \"pointer\", zIndex: 999999999 }}\n        alignItems=\"center\"\n        justifyContent=\"space-between\"\n        gap=\"$2\"\n      >\n        <Text size=\"sm\">{props.label}</Text>\n        {props.data.isAddonAccount && (\n          <Chip color=\"primary\" size=\"sm\" leftElement={<TickCircleFillIcon />}>\n            In Use (Add-on)\n          </Chip>\n        )}\n      </Flex>\n    </components.Option>\n  );\n};\n\n/**\n * Custom single value component for react-select\n */\nconst CustomSingleValue: React.FC<SingleValueProps<any>> = (props) => {\n  const icon = props.data.value === \"ADD_NEW\" ? <PlusIcon size={16} /> : null;\n\n  return (\n    <components.SingleValue {...props}>\n      <Flex css={{ cursor: \"pointer\" }} alignItems=\"center\" gap=\"$2\">\n        {icon}\n        <Text size=\"sm\">{props.data.label}</Text>\n      </Flex>\n    </components.SingleValue>\n  );\n};\n\n"],"names":["useState","Flex","Switch","Text","Checkbox","Box","FormInput","FormLabel","Select","Tooltip","components","PlusIcon","Chip","TickCircleFillIcon"],"mappings":"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"}

package/dist/cjs/single-mapping/components/ConfigurationSetup.js

@@ -1,9 +1,8 @@
 'use strict';
 
 var React = require('react');
-var Configuration = require('./Configuration.js');
+var ConfigurationField = require('./ConfigurationField.js');
 var CustomDropdown = require('./CustomDropdown.js');
-var index = require('../constants/index.js');
 var box = require('../../node_modules/@sparrowengg/twigs-react/dist/es/box/box.js');
 var heading = require('../../node_modules/@sparrowengg/twigs-react/dist/es/heading/heading.js');
 var flex = require('../../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js');
@@ -15,13 +14,15 @@ const ConfigurationSetup = ({
   surveyName,
   editField
 }) => {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q;
-  return /* @__PURE__ */ React.createElement(box.Box, { css: { maxWidth: index.STYLES.maxConfigWidth, width: "100%" } }, /* @__PURE__ */ React.createElement(heading.Heading, { size: "h5" }, index.UI_LABELS.EVENT_DETAILS), /* @__PURE__ */ React.createElement(flex.Flex, { gap: "$2", css: { marginTop: "$4" } }, /* @__PURE__ */ React.createElement(text.Text, { size: "sm", css: { color: "$neutral500" } }, index.UI_LABELS.SURVEY_NAME), /* @__PURE__ */ React.createElement(
+  var _a, _b, _c, _d;
+  const responseImportTypeValue = (_b = (_a = configuration.configuredFields) == null ? void 0 : _a.responseImportType) == null ? void 0 : _b.value;
+  const showExcludeResponse = configuration.importOptions.excludeResponse && (responseImportTypeValue == null ? void 0 : responseImportTypeValue.type) === "dateRange";
+  return /* @__PURE__ */ React.createElement(box.Box, { css: { maxWidth: 488, width: "100%" } }, /* @__PURE__ */ React.createElement(heading.Heading, { size: "h5" }, "Event Details"), /* @__PURE__ */ React.createElement(flex.Flex, { gap: "$2", css: { marginTop: "$4" } }, /* @__PURE__ */ React.createElement(text.Text, { size: "sm", css: { color: "$neutral500" } }, "Survey Name:"), /* @__PURE__ */ React.createElement(
     tooltip.Tooltip,
     {
       content: (surveyName == null ? void 0 : surveyName.length) > 25 ? surveyName : "",
       css: {
-        zIndex: index.STYLES.zIndexTooltip,
+        zIndex: "9999999 !important",
         fontFamily: "DM Sans !important"
       }
     },
@@ -47,8 +48,8 @@ const ConfigurationSetup = ({
         }
       }
     },
-    (_a = configuration.configurationFields) == null ? void 0 : _a.map((field) => /* @__PURE__ */ React.createElement(
-      Configuration.Configuration,
+    (_c = configuration.configurationFields) == null ? void 0 : _c.map((field) => /* @__PURE__ */ React.createElement(
+      ConfigurationField.ConfigurationField,
       {
         key: field.id,
         field,
@@ -69,26 +70,26 @@ const ConfigurationSetup = ({
         {
           editField,
           data: configuration.importOptions.options,
-          value: (_d = (_c = (_b = configuration == null ? void 0 : configuration.configuredFields) == null ? void 0 : _b.responseImportType) == null ? void 0 : _c.value) != null ? _d : configuration.importOptions.options[0],
+          value: responseImportTypeValue != null ? responseImportTypeValue : configuration.importOptions.options[0],
           onChangeHandler: configuration.importOptions.onChangeHandler
         }
       )
     ),
-    ((_g = (_f = (_e = configuration.configuredFields) == null ? void 0 : _e.responseImportType) == null ? void 0 : _f.value) == null ? void 0 : _g.type) === "date" && /* @__PURE__ */ React.createElement(
+    (responseImportTypeValue == null ? void 0 : responseImportTypeValue.type) === "date" && /* @__PURE__ */ React.createElement(
       text.Text,
       {
         size: "sm",
         weight: "regular",
         css: { color: "$neutral600", marginTop: "-$6" }
       },
-      index.UI_LABELS.EXISTING_RESPONSES_IMPORTED.replace("{date}", (_j = (_i = (_h = configuration.configuredFields) == null ? void 0 : _h.responseImportType) == null ? void 0 : _i.value) == null ? void 0 : _j.value)
+      `Existing responses from ${responseImportTypeValue == null ? void 0 : responseImportTypeValue.value} will be imported`
     ),
-    configuration.importOptions.excludeResponse && ((_m = (_l = (_k = configuration.configuredFields) == null ? void 0 : _k.responseImportType) == null ? void 0 : _l.value) == null ? void 0 : _m.type) === "dateRange" && /* @__PURE__ */ React.createElement(
-      Configuration.Configuration,
+    showExcludeResponse && /* @__PURE__ */ React.createElement(
+      ConfigurationField.ConfigurationField,
       {
         field: configuration.importOptions.excludeResponse,
         configuredFields: configuration.configuredFields,
-        responseImportType: (_q = (_p = (_o = (_n = configuration.configuredFields) == null ? void 0 : _n.responseImportType) == null ? void 0 : _o.value) == null ? void 0 : _p.value) == null ? void 0 : _q.label
+        responseImportType: (_d = responseImportTypeValue == null ? void 0 : responseImportTypeValue.value) == null ? void 0 : _d.label
       }
     )
   ));

package/dist/cjs/single-mapping/components/ConfigurationSetup.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConfigurationSetup.js","sources":["../../../../src/single-mapping/components/ConfigurationSetup.tsx"],"sourcesContent":["import React from \"react\";\nimport { Box, Heading, Flex, Text, Tooltip } from \"@sparrowengg/twigs-react\";\nimport { ConfigurationSetupProps } from \"../types/mapping.types\";\nimport { Configuration } from \"./Configuration\";\nimport { CustomDropdown } from \"./CustomDropdown\";\nimport { STYLES, UI_LABELS } from \"../constants\";\n\nexport const ConfigurationSetup: React.FC<ConfigurationSetupProps> = ({\n  configuration,\n  surveyName,\n  editField,\n}) => {\n  return (\n    <Box css={{ maxWidth: STYLES.maxConfigWidth, width: \"100%\" }}>\n      <Heading size=\"h5\">{UI_LABELS.EVENT_DETAILS}</Heading>\n      <Flex gap=\"$2\" css={{ marginTop: \"$4\" }}>\n        <Text size=\"sm\" css={{ color: \"$neutral500\" }}>\n          {UI_LABELS.SURVEY_NAME}\n        </Text>\n        <Tooltip\n          content={surveyName?.length > 25 ? surveyName : \"\"}\n          css={{\n            zIndex: STYLES.zIndexTooltip,\n            fontFamily: \"DM Sans !important\",\n          }}\n        >\n          <Box>\n            <Text\n              size=\"sm\"\n              weight=\"medium\"\n              truncate\n              css={{ color: \"$neutral800\", maxWidth: \"270px\" }}\n            >\n              {surveyName}\n            </Text>\n          </Box>\n        </Tooltip>\n      </Flex>\n\n      <Flex\n        flexDirection=\"column\"\n        gap=\"$8\"\n        css={{\n          marginTop: \"$12\",\n          \"& label\": {\n            color: \"$neutral800\",\n          },\n        }}\n      >\n        {configuration.configurationFields?.map((field: any) => (\n          <Configuration\n            key={field.id}\n            field={field}\n            configuredFields={configuration.configuredFields}\n          />\n        ))}\n\n        {configuration.importOptions.showImportOptions && (\n          <Flex\n            gap=\"$2\"\n            flexDirection=\"column\"\n            css={{\n              marginTop: \"-4px !important\",\n            }}\n          >\n            <CustomDropdown\n              editField={editField}\n              data={configuration.importOptions.options}\n              value={\n                configuration?.configuredFields?.responseImportType?.value ??\n                configuration.importOptions.options[0]\n              }\n              onChangeHandler={configuration.importOptions.onChangeHandler}\n            />\n          </Flex>\n        )}\n\n        {configuration.configuredFields?.responseImportType?.value?.type ===\n          \"date\" && (\n          <Text\n            size=\"sm\"\n            weight=\"regular\"\n            css={{ color: \"$neutral600\", marginTop: \"-$6\" }}\n          >\n            {UI_LABELS.EXISTING_RESPONSES_IMPORTED.replace('{date}', configuration.configuredFields?.responseImportType?.value?.value)}\n          </Text>\n        )}\n\n        {configuration.importOptions.excludeResponse &&\n          configuration.configuredFields?.responseImportType?.value?.type ===\n            \"dateRange\" && (\n            <Configuration\n              field={configuration.importOptions.excludeResponse}\n              configuredFields={configuration.configuredFields}\n              responseImportType={\n                configuration.configuredFields?.responseImportType?.value?.value\n                  ?.label\n              }\n            />\n          )}\n      </Flex>\n    </Box>\n  );\n};\n\n"],"names":["Box","STYLES","Heading","UI_LABELS","Flex","Text","Tooltip","Configuration","CustomDropdown"],"mappings":"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"}
+{"version":3,"file":"ConfigurationSetup.js","sources":["../../../../src/single-mapping/components/ConfigurationSetup.tsx"],"sourcesContent":["import React from \"react\";\nimport { Box, Flex, Heading, Text, Tooltip } from \"@sparrowengg/twigs-react\";\nimport { ConfigurationField } from \"./ConfigurationField\";\nimport { CustomDropdown } from \"./CustomDropdown\";\nimport { ConfigurationType } from \"../types/configuration.types\";\n\ntype ConfigurationSetupProps = {\n  configuration: ConfigurationType;\n  surveyName: string;\n  editField: any;\n};\n\n/**\n * Configuration setup component that renders survey details and configuration fields\n */\nexport const ConfigurationSetup: React.FC<ConfigurationSetupProps> = ({\n  configuration,\n  surveyName,\n  editField,\n}) => {\n  const responseImportTypeValue = configuration.configuredFields?.responseImportType?.value;\n  const showExcludeResponse =\n    configuration.importOptions.excludeResponse &&\n    responseImportTypeValue?.type === \"dateRange\";\n\n  return (\n    <Box css={{ maxWidth: 488, width: \"100%\" }}>\n      <Heading size=\"h5\">Event Details</Heading>\n      \n      {/* Survey Name Display */}\n      <Flex gap=\"$2\" css={{ marginTop: \"$4\" }}>\n        <Text size=\"sm\" css={{ color: \"$neutral500\" }}>\n          Survey Name:\n        </Text>\n        <Tooltip\n          content={surveyName?.length > 25 ? surveyName : \"\"}\n          css={{\n            zIndex: \"9999999 !important\",\n            fontFamily: \"DM Sans !important\",\n          }}\n        >\n          <Box>\n            <Text\n              size=\"sm\"\n              weight=\"medium\"\n              truncate\n              css={{ color: \"$neutral800\", maxWidth: \"270px\" }}\n            >\n              {surveyName}\n            </Text>\n          </Box>\n        </Tooltip>\n      </Flex>\n\n      {/* Configuration Fields */}\n      <Flex\n        flexDirection=\"column\"\n        gap=\"$8\"\n        css={{\n          marginTop: \"$12\",\n          \"& label\": {\n            color: \"$neutral800\",\n          },\n        }}\n      >\n        {configuration.configurationFields?.map((field) => (\n          <ConfigurationField\n            key={field.id}\n            field={field}\n            configuredFields={configuration.configuredFields}\n          />\n        ))}\n\n        {/* Import Options Dropdown */}\n        {configuration.importOptions.showImportOptions && (\n          <Flex\n            gap=\"$2\"\n            flexDirection=\"column\"\n            css={{\n              marginTop: \"-4px !important\",\n            }}\n          >\n            <CustomDropdown\n              editField={editField}\n              data={configuration.importOptions.options}\n              value={\n                responseImportTypeValue ??\n                configuration.importOptions.options[0]\n              }\n              onChangeHandler={configuration.importOptions.onChangeHandler}\n            />\n          </Flex>\n        )}\n\n        {/* Date Import Message */}\n        {responseImportTypeValue?.type === \"date\" && (\n          <Text\n            size=\"sm\"\n            weight=\"regular\"\n            css={{ color: \"$neutral600\", marginTop: \"-$6\" }}\n          >\n            {`Existing responses from ${responseImportTypeValue?.value} will be imported`}\n          </Text>\n        )}\n\n        {/* Exclude Response Option */}\n        {showExcludeResponse && (\n          <ConfigurationField\n            field={configuration.importOptions.excludeResponse}\n            configuredFields={configuration.configuredFields}\n            responseImportType={responseImportTypeValue?.value?.label}\n          />\n        )}\n      </Flex>\n    </Box>\n  );\n};\n\n"],"names":["Box","Heading","Flex","Text","Tooltip","ConfigurationField","CustomDropdown"],"mappings":"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"}