@sparrowengg/integrations-templates-frontend 2.0.0 → 2.1.0-beta.2

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

@@ -0,0 +1,100 @@
+'use strict';
+
+var React = require('react');
+var Configuration = require('./Configuration.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');
+var text = require('../../node_modules/@sparrowengg/twigs-react/dist/es/text/text.js');
+var tooltip = require('../../node_modules/@sparrowengg/twigs-react/dist/es/tooltip/tooltip.js');
+
+const ConfigurationSetup = ({
+  configuration,
+  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: 488, width: "100%" } }, /* @__PURE__ */ React.createElement(heading.Heading, { size: "h5" }, index.UI_TEXT.EVENT_DETAILS), /* @__PURE__ */ React.createElement(flex.Flex, { gap: "$2", css: { marginTop: "$4" } }, /* @__PURE__ */ React.createElement(text.Text, { size: "sm", css: { color: "$neutral500" } }, index.UI_TEXT.SURVEY_NAME_LABEL), /* @__PURE__ */ React.createElement(
+    tooltip.Tooltip,
+    {
+      content: (surveyName == null ? void 0 : surveyName.length) > 25 ? surveyName : "",
+      css: {
+        zIndex: "9999999 !important",
+        fontFamily: index.FONT_FAMILIES.DM_SANS_IMPORTANT
+      }
+    },
+    /* @__PURE__ */ React.createElement(box.Box, null, /* @__PURE__ */ React.createElement(
+      text.Text,
+      {
+        size: "sm",
+        weight: "medium",
+        truncate: true,
+        css: { color: "$neutral800", maxWidth: "270px" }
+      },
+      surveyName
+    ))
+  )), /* @__PURE__ */ React.createElement(
+    flex.Flex,
+    {
+      flexDirection: "column",
+      gap: "$8",
+      css: {
+        marginTop: "$12",
+        "& label": {
+          color: "$neutral800"
+        }
+      }
+    },
+    (_a = configuration.configurationFields) == null ? void 0 : _a.map((field) => /* @__PURE__ */ React.createElement(
+      Configuration.Configuration,
+      {
+        key: field.id,
+        field,
+        configuredFields: configuration.configuredFields
+      }
+    )),
+    configuration.importOptions.showImportOptions && /* @__PURE__ */ React.createElement(
+      flex.Flex,
+      {
+        gap: "$2",
+        flexDirection: "column",
+        css: {
+          marginTop: "-4px !important"
+        }
+      },
+      /* @__PURE__ */ React.createElement(
+        CustomDropdown.CustomDropdown,
+        {
+          placeholder: configuration.importOptions.placeholder || index.UI_TEXT.CHOOSE,
+          editField,
+          data: configuration.importOptions.options,
+          isDisabled: configuration.importOptions.isDisabled,
+          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],
+          onChangeHandler: configuration.importOptions.onChangeHandler
+        }
+      )
+    ),
+    ((_g = (_f = (_e = configuration.configuredFields) == null ? void 0 : _e.responseImportType) == null ? void 0 : _f.value) == null ? void 0 : _g.type) === index.DATE_TYPES.DATE && /* @__PURE__ */ React.createElement(
+      text.Text,
+      {
+        size: "sm",
+        weight: "regular",
+        css: { color: "$neutral600", marginTop: "-$6" }
+      },
+      `${index.UI_TEXT.EXISTING_RESPONSES_IMPORT_MESSAGE} ${(_j = (_i = (_h = configuration.configuredFields) == null ? void 0 : _h.responseImportType) == null ? void 0 : _i.value) == null ? void 0 : _j.value} ${index.UI_TEXT.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) === index.DATE_TYPES.DATE_RANGE && /* @__PURE__ */ React.createElement(
+      Configuration.Configuration,
+      {
+        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
+      }
+    )
+  ));
+};
+
+exports.ConfigurationSetup = ConfigurationSetup;
+//# sourceMappingURL=ConfigurationSetup.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ConfigurationSetup.js","sources":["../../../../src/dynamic-mapping/components/ConfigurationSetup.tsx"],"sourcesContent":["import React from 'react';\nimport { Box, Flex, Heading, Text, Tooltip } from '@sparrowengg/twigs-react';\nimport { ConfigurationSetupProps } from '../types';\nimport { Configuration } from './Configuration';\nimport { CustomDropdown } from './CustomDropdown';\nimport { UI_TEXT, DATE_TYPES, FONT_FAMILIES } from '../constants';\n\nexport const ConfigurationSetup: React.FC<ConfigurationSetupProps> = ({\n  configuration,\n  surveyName,\n  editField,\n}) => {\n  return (\n    <Box css={{ maxWidth: 488, width: '100%' }}>\n      <Heading size=\"h5\">{UI_TEXT.EVENT_DETAILS}</Heading>\n      <Flex gap=\"$2\" css={{ marginTop: '$4' }}>\n        <Text size=\"sm\" css={{ color: '$neutral500' }}>\n          {UI_TEXT.SURVEY_NAME_LABEL}\n        </Text>\n        <Tooltip\n          content={surveyName?.length > 25 ? surveyName : ''}\n          css={{\n            zIndex: '9999999 !important',\n            fontFamily: FONT_FAMILIES.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      <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          <Configuration\n            key={field.id}\n            field={field}\n            configuredFields={configuration.configuredFields}\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              placeholder={configuration.importOptions.placeholder || UI_TEXT.CHOOSE}\n              editField={editField}\n              data={configuration.importOptions.options}\n              isDisabled={configuration.importOptions.isDisabled}\n              value={\n                (configuration?.configuredFields?.responseImportType as any)?.value ??\n                configuration.importOptions.options[0]\n              }\n              onChangeHandler={configuration.importOptions.onChangeHandler}\n            />\n          </Flex>\n        )}\n        {(configuration.configuredFields?.responseImportType as any)?.value?.type ===\n          DATE_TYPES.DATE && (\n          <Text\n            size=\"sm\"\n            weight=\"regular\"\n            css={{ color: '$neutral600', marginTop: '-$6' }}\n          >\n            {`${UI_TEXT.EXISTING_RESPONSES_IMPORT_MESSAGE} ${\n              (configuration.configuredFields?.responseImportType as any)?.value?.value\n            } ${UI_TEXT.WILL_BE_IMPORTED}`}\n          </Text>\n        )}\n        {configuration.importOptions.excludeResponse &&\n          (configuration.configuredFields?.responseImportType as any)?.value?.type ===\n            DATE_TYPES.DATE_RANGE && (\n            <Configuration\n              field={configuration.importOptions.excludeResponse}\n              configuredFields={configuration.configuredFields}\n              responseImportType={\n                (configuration.configuredFields?.responseImportType as any)?.value?.value\n                  ?.label\n              }\n            />\n          )}\n      </Flex>\n    </Box>\n  );\n};\n\n"],"names":["Box","Heading","UI_TEXT","Flex","Text","Tooltip","FONT_FAMILIES","Configuration","CustomDropdown","DATE_TYPES"],"mappings":"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"}

package/dist/cjs/dynamic-mapping/components/CustomAddNewSelect.js

@@ -0,0 +1,130 @@
+'use strict';
+
+var React = require('react');
+var index = require('../constants/index.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 box = require('../../node_modules/@sparrowengg/twigs-react/dist/es/box/box.js');
+var indexA301f526_esm = require('../../node_modules/react-select/dist/index-a301f526.esm.js');
+var flex = require('../../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js');
+var plus = require('../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/plus.js');
+var text = require('../../node_modules/@sparrowengg/twigs-react/dist/es/text/text.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 CustomAddNewSelect = ({ field }) => {
+  return /* @__PURE__ */ React.createElement(
+    select.Select,
+    {
+      isDisabled: field == null ? void 0 : field.disabled,
+      placeholder: field.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 === index.ADD_NEW_OPTION_VALUE) {
+    return /* @__PURE__ */ React.createElement(
+      tooltip.Tooltip,
+      {
+        content: props.data.tooltip || "",
+        css: {
+          zIndex: 999999999,
+          fontFamily: index.FONT_FAMILIES.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" }),
+          props.data.label || index.UI_TEXT.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)
+      },
+      index.UI_TEXT.IN_USE_ADDON
+    )
+  ));
+};
+const CustomSingleValue = (props) => {
+  if (props.data.value === index.ADD_NEW_OPTION_VALUE) {
+    return /* @__PURE__ */ React.createElement(indexA301f526_esm.c.SingleValue, __spreadValues({}, props), /* @__PURE__ */ React.createElement(flex.Flex, { css: { cursor: "pointer" }, alignItems: "center", gap: "$2" }, /* @__PURE__ */ React.createElement(plus.PlusIcon, { size: 16 }), /* @__PURE__ */ React.createElement(text.Text, { size: "sm" }, props.data.label)));
+  }
+  return /* @__PURE__ */ React.createElement(indexA301f526_esm.c.SingleValue, __spreadValues({}, props), /* @__PURE__ */ React.createElement(flex.Flex, { css: { cursor: "pointer" }, alignItems: "center", gap: "$2" }, /* @__PURE__ */ React.createElement(text.Text, { size: "sm" }, props.data.label)));
+};
+
+exports.CustomAddNewSelect = CustomAddNewSelect;
+//# sourceMappingURL=CustomAddNewSelect.js.map

package/dist/cjs/dynamic-mapping/components/CustomAddNewSelect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomAddNewSelect.js","sources":["../../../../src/dynamic-mapping/components/CustomAddNewSelect.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  Box,\n  Chip,\n  Flex,\n  Select,\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 { ConfigurationField } from '../types';\nimport { ADD_NEW_OPTION_VALUE, UI_TEXT, FONT_FAMILIES } from '../constants';\n\ninterface CustomAddNewSelectProps {\n  field: ConfigurationField;\n}\n\nexport const CustomAddNewSelect: React.FC<CustomAddNewSelectProps> = ({ field }) => {\n  return (\n    <Select\n      isDisabled={field?.disabled}\n      placeholder={field.placeholder || ''}\n      size=\"lg\"\n      css={{\n        cursor: 'pointer',\n      }}\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,\n          value: value,\n        });\n      }}\n      options={field.options}\n    />\n  );\n};\n\nconst CustomShareOption: React.FC<OptionProps<any>> = (props) => {\n  if (props.data.value === ADD_NEW_OPTION_VALUE) {\n    return (\n      <Tooltip\n        content={props.data.tooltip || ''}\n        css={{\n          zIndex: 999999999,\n          fontFamily: FONT_FAMILIES.DM_SANS_IMPORTANT,\n        }}\n      >\n        <Box>\n          <components.Option {...props}>\n            <Flex\n              justifyContent=\"center\"\n              alignItems=\"center\"\n              css={{ cursor: 'pointer', zIndex: 999999999 }}\n            >\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                {props.data.label || UI_TEXT.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\n            color=\"primary\"\n            size=\"sm\"\n            leftElement={<TickCircleFillIcon />}\n          >\n            {UI_TEXT.IN_USE_ADDON}\n          </Chip>\n        )}\n      </Flex>\n    </components.Option>\n  );\n};\n\nconst CustomSingleValue: React.FC<SingleValueProps<any>> = (props) => {\n  if (props.data.value === ADD_NEW_OPTION_VALUE) {\n    return (\n      <components.SingleValue {...props}>\n        <Flex css={{ cursor: 'pointer' }} alignItems=\"center\" gap=\"$2\">\n          <PlusIcon size={16} />\n          <Text size=\"sm\">{props.data.label}</Text>\n        </Flex>\n      </components.SingleValue>\n    );\n  }\n\n  return (\n    <components.SingleValue {...props}>\n      <Flex css={{ cursor: 'pointer' }} alignItems=\"center\" gap=\"$2\">\n        <Text size=\"sm\">{props.data.label}</Text>\n      </Flex>\n    </components.SingleValue>\n  );\n};\n\n"],"names":["Select","ADD_NEW_OPTION_VALUE","Tooltip","FONT_FAMILIES","Box","components","Flex","PlusIcon","UI_TEXT","Text","Chip","TickCircleFillIcon"],"mappings":"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"}

package/dist/cjs/dynamic-mapping/components/CustomDropdown.js

@@ -0,0 +1,367 @@
+'use strict';
+
+var React = require('react');
+var string = require('../../node_modules/@internationalized/date/dist/string.js');
+var dayjs_min = require('../../node_modules/dayjs/dayjs.min.js');
+var index$1 = require('../../commons/constants/index.js');
+var index = require('../constants/index.js');
+var dropdown = require('../../node_modules/@sparrowengg/twigs-react/dist/es/dropdown/dropdown.js');
+var input = require('../../node_modules/@sparrowengg/twigs-react/dist/es/input/input.js');
+var chevronDown = require('../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/chevron-down.js');
+var tooltip = require('../../node_modules/@sparrowengg/twigs-react/dist/es/tooltip/tooltip.js');
+var box = require('../../node_modules/@sparrowengg/twigs-react/dist/es/box/box.js');
+var flex = require('../../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js');
+var text = require('../../node_modules/@sparrowengg/twigs-react/dist/es/text/text.js');
+var calendar = require('../../node_modules/@sparrowengg/twigs-react/dist/es/calendar/calendar.js');
+var radio = require('../../node_modules/@sparrowengg/twigs-react/dist/es/radio/radio.js');
+var button = require('../../node_modules/@sparrowengg/twigs-react/dist/es/button/button.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 CustomDropdown = ({
+  data,
+  onChangeHandler,
+  value,
+  editField,
+  isDisabled,
+  placeholder
+}) => {
+  var _a, _b;
+  const [date, setDate] = React.useState(() => {
+    try {
+      return value ? string.parseDate(dayjs_min.default(value).format("YYYY-MM-DD")) : string.parseDate(dayjs_min.default().format("YYYY-MM-DD"));
+    } catch (e) {
+      return string.parseDate(dayjs_min.default().format("YYYY-MM-DD"));
+    }
+  });
+  const [days, setDays] = React.useState((_b = (_a = value == null ? void 0 : value.value) == null ? void 0 : _a.value) != null ? _b : 0);
+  const [open, setOpen] = React.useState(false);
+  const [hasBeenOpened, setHasBeenOpened] = React.useState(false);
+  React.useEffect(() => {
+    if (!(editField == null ? void 0 : editField.id) && !hasBeenOpened && !isDisabled) {
+      setOpen(true);
+      setHasBeenOpened(true);
+    }
+  }, [editField == null ? void 0 : editField.id, hasBeenOpened, isDisabled]);
+  const getDisplayValue = () => {
+    var _a2, _b2, _c;
+    if ((value == null ? void 0 : value.type) === index.DATE_TYPES.DATE) {
+      return `${value == null ? void 0 : value.label} > ${value == null ? void 0 : value.value}`;
+    }
+    if ((value == null ? void 0 : value.type) === index.DATE_TYPES.DATE_RANGE) {
+      const rangeValue = ((_a2 = value == null ? void 0 : value.value) == null ? void 0 : _a2.type) === index.DATE_TYPES.CUSTOM ? `${(_b2 = value == null ? void 0 : value.value) == null ? void 0 : _b2.value} ${index.UI_TEXT.DAYS.toLowerCase()}` : (_c = value == null ? void 0 : value.value) == null ? void 0 : _c.label;
+      return `${value == null ? void 0 : value.label} - ${rangeValue}`;
+    }
+    return value == null ? void 0 : value.label;
+  };
+  return /* @__PURE__ */ React.createElement(dropdown.DropdownMenu, { open, onOpenChange: setOpen, modal: false }, /* @__PURE__ */ React.createElement(dropdown.DropdownMenuTrigger, { asChild: true, disabled: isDisabled }, /* @__PURE__ */ React.createElement(
+    input.Input,
+    {
+      size: "lg",
+      rightIcon: /* @__PURE__ */ React.createElement(chevronDown.ChevronDownIcon, { size: 30, color: "#6A6A6A" }),
+      placeholder: placeholder || index.UI_TEXT.CHOOSE,
+      value: getDisplayValue(),
+      css: {
+        "& input": {
+          textAlign: "left !important"
+        }
+      }
+    }
+  )), /* @__PURE__ */ React.createElement(
+    dropdown.DropdownMenuContent,
+    {
+      css: {
+        width: "488px",
+        marginBlockStart: "$2",
+        p: {
+          margin: "0px !important"
+        },
+        zIndex: "99 !important"
+      },
+      className: index.CSS_CLASSES.DM_SANS
+    },
+    data.map((option) => {
+      var _a2;
+      if (!option.type) {
+        return /* @__PURE__ */ React.createElement(
+          tooltip.Tooltip,
+          {
+            key: option.id,
+            content: option.tooltip || "",
+            css: {
+              zIndex: "9999999 !important",
+              fontFamily: index.FONT_FAMILIES.DM_SANS_IMPORTANT
+            }
+          },
+          /* @__PURE__ */ React.createElement(box.Box, null, /* @__PURE__ */ React.createElement(
+            dropdown.DropdownMenuItem,
+            {
+              disabled: option == null ? void 0 : option.disabled,
+              css: {
+                cursor: (option == null ? void 0 : option.disabled) ? "not-allowed !important" : "pointer !important",
+                background: (value == null ? void 0 : value.type) === option.type ? "#4A9CA626 !important" : "transparent !important"
+              },
+              onClick: () => onChangeHandler({
+                id: index.CONFIGURATION_FIELD_IDS.RESPONSE_IMPORT_TYPE,
+                value: option
+              })
+            },
+            /* @__PURE__ */ React.createElement(
+              flex.Flex,
+              {
+                justifyContent: "space-between",
+                alignItems: "center",
+                css: {
+                  width: "100%"
+                }
+              },
+              /* @__PURE__ */ React.createElement(flex.Flex, { justifyContent: "center", flexDirection: "column" }, /* @__PURE__ */ React.createElement(
+                text.Text,
+                {
+                  size: "sm",
+                  weight: "regular",
+                  css: { color: "$neutral900" }
+                },
+                option.label
+              ), /* @__PURE__ */ React.createElement(
+                text.Text,
+                {
+                  size: "xs",
+                  weight: "regular",
+                  css: { color: "$neutral700" }
+                },
+                option.description
+              ))
+            )
+          ))
+        );
+      }
+      return /* @__PURE__ */ React.createElement(
+        tooltip.Tooltip,
+        {
+          key: option.id,
+          content: option.tooltip || "",
+          css: {
+            fontFamily: index.FONT_FAMILIES.DM_SANS_IMPORTANT,
+            zIndex: "9999999 !important"
+          }
+        },
+        /* @__PURE__ */ React.createElement(box.Box, null, /* @__PURE__ */ React.createElement(dropdown.DropdownMenuSub, null, /* @__PURE__ */ React.createElement(
+          dropdown.DropdownMenuSubTrigger,
+          {
+            disabled: option == null ? void 0 : option.disabled,
+            css: {
+              cursor: (option == null ? void 0 : option.disabled) ? "not-allowed !important" : "pointer !important",
+              background: (value == null ? void 0 : value.type) === option.type ? "#4A9CA626 !important" : "transparent !important"
+            }
+          },
+          /* @__PURE__ */ React.createElement(
+            flex.Flex,
+            {
+              justifyContent: "space-between",
+              alignItems: "center",
+              css: {
+                width: "100%"
+              }
+            },
+            /* @__PURE__ */ React.createElement(
+              flex.Flex,
+              {
+                css: { cursor: "pointer" },
+                justifyContent: "center",
+                flexDirection: "column"
+              },
+              /* @__PURE__ */ React.createElement(
+                text.Text,
+                {
+                  size: "sm",
+                  weight: "regular",
+                  css: { color: "$neutral900" }
+                },
+                option.label
+              ),
+              /* @__PURE__ */ React.createElement(
+                text.Text,
+                {
+                  size: "xs",
+                  weight: "regular",
+                  css: { color: "$neutral700" }
+                },
+                option.description
+              )
+            )
+          )
+        ), /* @__PURE__ */ React.createElement(
+          dropdown.DropdownMenuSubContent,
+          {
+            sideOffset: 10,
+            alignOffset: -5,
+            css: __spreadProps(__spreadValues({
+              padding: "0px !important",
+              maxHeight: "500px",
+              minWidth: "224px",
+              maxWidth: "260px",
+              margin: "0px !important"
+            }, option.type === "date" && {
+              border: "none !important"
+            }), {
+              p: {
+                margin: "0px !important"
+              },
+              marginBlockEnd: "$10 !important"
+            }),
+            className: index.CSS_CLASSES.DM_SANS
+          },
+          option.type === index.DATE_TYPES.DATE && /* @__PURE__ */ React.createElement(
+            calendar.Calendar,
+            __spreadProps(__spreadValues(__spreadValues({
+              footerActionText: index.UI_TEXT.APPLY,
+              size: "md",
+              value: date,
+              onChange: setDate
+            }, (option == null ? void 0 : option.minValue) && {
+              minValue: string.parseDate(option == null ? void 0 : option.minValue)
+            }), (option == null ? void 0 : option.maxValue) && {
+              maxValue: string.parseDate(option == null ? void 0 : option.maxValue)
+            }), {
+              footerAction: () => {
+                onChangeHandler({
+                  id: index.CONFIGURATION_FIELD_IDS.RESPONSE_IMPORT_TYPE,
+                  value: __spreadProps(__spreadValues({}, option), {
+                    value: dayjs_min.default(date.toString()).format("MMM D, YYYY")
+                  })
+                });
+                setOpen(false);
+              }
+            })
+          ),
+          option.type === index.DATE_TYPES.DATE_RANGE && /* @__PURE__ */ React.createElement(
+            flex.Flex,
+            {
+              css: {
+                paddingInline: "$4 !important",
+                paddingBlock: "$8 !important"
+              },
+              flexDirection: "column",
+              gap: "$4"
+            },
+            /* @__PURE__ */ React.createElement(
+              radio.RadioGroup,
+              {
+                defaultValue: value == null ? void 0 : value.value,
+                onChange: (selectedValue) => {
+                  var _a3;
+                  onChangeHandler({
+                    id: index.CONFIGURATION_FIELD_IDS.RESPONSE_IMPORT_TYPE,
+                    value: __spreadProps(__spreadValues({}, option), {
+                      value: {
+                        type: selectedValue,
+                        value: selectedValue,
+                        label: (_a3 = index$1.dynamicDateOptions.find(
+                          (opt) => opt.value === selectedValue
+                        )) == null ? void 0 : _a3.label
+                      }
+                    })
+                  });
+                }
+              },
+              index$1.dynamicDateOptions.map((dateOption) => /* @__PURE__ */ React.createElement(
+                box.Box,
+                {
+                  key: dateOption.value,
+                  css: {
+                    padding: "$4 !important"
+                  }
+                },
+                /* @__PURE__ */ React.createElement(radio.Radio, { value: dateOption.value }, dateOption.label)
+              ))
+            ),
+            ((_a2 = value == null ? void 0 : value.value) == null ? void 0 : _a2.type) === index.DATE_TYPES.CUSTOM && /* @__PURE__ */ React.createElement(
+              box.Box,
+              {
+                css: {
+                  paddingRight: "$4 !important",
+                  position: "relative"
+                }
+              },
+              /* @__PURE__ */ React.createElement(
+                input.Input,
+                {
+                  size: "md",
+                  variant: "filled",
+                  value: days,
+                  onChange: (e) => setDays(e.target.value)
+                }
+              ),
+              /* @__PURE__ */ React.createElement(
+                text.Text,
+                {
+                  css: {
+                    position: "absolute",
+                    right: "$8",
+                    top: "$3"
+                  }
+                },
+                index.UI_TEXT.DAYS
+              )
+            ),
+            /* @__PURE__ */ React.createElement(
+              flex.Flex,
+              {
+                justifyContent: "space-between",
+                css: {
+                  borderBlockStart: "$borderWidths$xs, solid, $neutral200 !important",
+                  padding: "$8"
+                }
+              },
+              /* @__PURE__ */ React.createElement(button.Button, { size: "sm", variant: "ghost", color: "secondary" }, index.UI_TEXT.CANCEL),
+              /* @__PURE__ */ React.createElement(
+                button.Button,
+                {
+                  size: "sm",
+                  variant: "ghost",
+                  color: "primary",
+                  onClick: () => {
+                    var _a3, _b2;
+                    onChangeHandler({
+                      id: index.CONFIGURATION_FIELD_IDS.RESPONSE_IMPORT_TYPE,
+                      value: __spreadProps(__spreadValues({}, option), {
+                        value: {
+                          type: (_a3 = value == null ? void 0 : value.value) == null ? void 0 : _a3.type,
+                          value: days,
+                          label: (_b2 = value == null ? void 0 : value.value) == null ? void 0 : _b2.label
+                        }
+                      })
+                    });
+                    setOpen(false);
+                  }
+                },
+                index.UI_TEXT.APPLY
+              )
+            )
+          )
+        )))
+      );
+    })
+  ));
+};
+
+exports.CustomDropdown = CustomDropdown;
+//# sourceMappingURL=CustomDropdown.js.map