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

package/dist/es/triggers/components/TriggerConditions.js

@@ -0,0 +1,293 @@
+import React__default, { useState } from 'react';
+import { UI_TEXT, SHARE_TYPES, topLevelCondition, PLACEHOLDERS, FONTS } from '../constants/index.js';
+import { Filter } from './Filter.js';
+import CustomPill from '../../commons/components/custom-pill.js';
+import SMSIcon from '../../commons/icons/sms.js';
+import WhatsAppIcon from '../../commons/icons/whatsapp.js';
+import EmailLetterIcon from '../../commons/icons/email-letter.js';
+import { useFetchChannels } from '../hooks/useFetchChannels.js';
+import { useTriggerFields } from '../hooks/useTriggerFields.js';
+import { isEmpty, filterChannelsByType } from '../utils/helpers.js';
+import { Flex } from '../../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js';
+import { Box } from '../../node_modules/@sparrowengg/twigs-react/dist/es/box/box.js';
+import { Heading } from '../../node_modules/@sparrowengg/twigs-react/dist/es/heading/heading.js';
+import { Text } from '../../node_modules/@sparrowengg/twigs-react/dist/es/text/text.js';
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from '../../node_modules/@sparrowengg/twigs-react/dist/es/dropdown/dropdown.js';
+import { ChevronDownIcon } from '../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/chevron-down.js';
+import { Button } from '../../node_modules/@sparrowengg/twigs-react/dist/es/button/button.js';
+import { PlusIcon } from '../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/plus.js';
+import { FormLabel } from '../../node_modules/@sparrowengg/twigs-react/dist/es/form-label/form-label.js';
+import { Select } from '../../node_modules/@sparrowengg/twigs-react/dist/es/select/select.js';
+import { c as components } from '../../node_modules/react-select/dist/index-a301f526.esm.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 getShareTypeIcon = (type) => {
+  switch (type) {
+    case SHARE_TYPES.EMAIL:
+      return /* @__PURE__ */ React__default.createElement(EmailLetterIcon, null);
+    case SHARE_TYPES.SMS:
+      return /* @__PURE__ */ React__default.createElement(SMSIcon, null);
+    case SHARE_TYPES.WHATSAPP:
+      return /* @__PURE__ */ React__default.createElement(WhatsAppIcon, null);
+    default:
+      return null;
+  }
+};
+const CustomShareOption = (props) => /* @__PURE__ */ React__default.createElement(components.Option, __spreadValues({}, props), /* @__PURE__ */ React__default.createElement(Flex, { css: { cursor: "pointer" }, alignItems: "center", gap: "$2" }, getShareTypeIcon(props.data.value), /* @__PURE__ */ React__default.createElement(Text, { size: "sm" }, props.label)));
+const CustomSingleValue = (props) => /* @__PURE__ */ React__default.createElement(components.SingleValue, __spreadValues({}, props), /* @__PURE__ */ React__default.createElement(Flex, { css: { cursor: "pointer" }, alignItems: "center", gap: "$2" }, getShareTypeIcon(props.data.value), /* @__PURE__ */ React__default.createElement(Text, { size: "sm" }, props.data.label)));
+const CustomMultiValue = (props) => /* @__PURE__ */ React__default.createElement(
+  CustomPill,
+  {
+    label: props.data.label,
+    onCloseHandler: () => {
+      var _a, _b;
+      return (_b = (_a = props.removeProps) == null ? void 0 : _a.onClick) == null ? void 0 : _b.call(_a);
+    },
+    variant: "success",
+    radius: "md",
+    fontFamily: FONTS.MONO
+  }
+);
+const CustomShareChannelOption = (props) => {
+  const icon = props.data.value === SHARE_TYPES.NEW_SHARE ? /* @__PURE__ */ React__default.createElement(PlusIcon, { size: 16, color: "#6A6A6A" }) : null;
+  return /* @__PURE__ */ React__default.createElement(components.Option, __spreadValues({}, props), /* @__PURE__ */ React__default.createElement(Flex, { css: { cursor: "pointer" }, alignItems: "center", gap: "$2" }, icon, /* @__PURE__ */ React__default.createElement(Text, { size: "sm" }, props.label)));
+};
+const CustomShareChannelSingleValue = (props) => {
+  const icon = props.data.value === SHARE_TYPES.NEW_SHARE ? /* @__PURE__ */ React__default.createElement(PlusIcon, { size: 16, color: "#6A6A6A" }) : null;
+  return /* @__PURE__ */ React__default.createElement(components.SingleValue, __spreadValues({}, props), /* @__PURE__ */ React__default.createElement(Flex, { css: { cursor: "pointer" }, alignItems: "center", gap: "$2" }, icon, /* @__PURE__ */ React__default.createElement(Text, { size: "sm" }, props.data.label)));
+};
+const SHARE_TYPE_OPTIONS = [
+  { id: 1, label: UI_TEXT.EMAIL, value: SHARE_TYPES.EMAIL },
+  { id: 2, label: UI_TEXT.SMS, value: SHARE_TYPES.SMS },
+  { id: 3, label: UI_TEXT.WHATSAPP, value: SHARE_TYPES.WHATSAPP }
+];
+const TriggerConditions = ({
+  fields,
+  setFields,
+  token,
+  apiURL,
+  hasNestedCondition,
+  surveyDetails,
+  shareRecipentOptions,
+  triggerDetails,
+  setTriggerDetails,
+  fieldOptions,
+  variableOptions
+}) => {
+  var _a, _b, _c, _d, _e, _f;
+  const [isEditing, setIsEditing] = useState(false);
+  const { channels } = useFetchChannels(token, apiURL, surveyDetails.surveyId);
+  const {
+    addFilterCondition,
+    addNestedFilterCondition,
+    setCurrentField,
+    removeCurrentFilter,
+    removeNestedField,
+    setNestedFieldCondition,
+    setTopLevelCondition
+  } = useTriggerFields(setFields);
+  const setTriggerField = (property, value) => {
+    setTriggerDetails((prev) => __spreadProps(__spreadValues({}, prev), {
+      [property]: value
+    }));
+  };
+  const handleShareTypeChange = (value) => {
+    setTriggerField("shareType", value);
+    setTriggerField("shareRecipient", null);
+    setTriggerField("shareChannel", null);
+  };
+  const hasValidFilters = (_a = fields.filters) == null ? void 0 : _a.some(
+    (filter) => {
+      var _a2;
+      return (_a2 = filter.conditions) == null ? void 0 : _a2.some((condition) => condition == null ? void 0 : condition.value);
+    }
+  );
+  const getChannelOptions = () => {
+    var _a2;
+    const shareType = (_a2 = triggerDetails.shareType) == null ? void 0 : _a2.value;
+    const filteredChannels = filterChannelsByType(channels, shareType);
+    if (filteredChannels.length > 0) {
+      return filteredChannels;
+    }
+    if (shareType !== SHARE_TYPES.WHATSAPP) {
+      return [{ label: UI_TEXT.NEW_SHARE, value: SHARE_TYPES.NEW_SHARE }];
+    }
+    return [];
+  };
+  const getRecipientOptions = () => {
+    var _a2;
+    const shareType = (_a2 = triggerDetails.shareType) == null ? void 0 : _a2.value;
+    return shareRecipentOptions.filter((option) => option.type === shareType);
+  };
+  return /* @__PURE__ */ React__default.createElement(
+    Flex,
+    {
+      justifyContent: "center",
+      alignItems: "center",
+      css: { marginTop: "$40" }
+    },
+    /* @__PURE__ */ React__default.createElement(Box, { css: { maxWidth: 488, width: "100%" } }, /* @__PURE__ */ React__default.createElement(Heading, { size: "h5" }, UI_TEXT.SET_CONDITION), /* @__PURE__ */ React__default.createElement(Flex, { alignItems: "center", css: { marginTop: "$12" } }, /* @__PURE__ */ React__default.createElement(Text, { size: "md", css: { color: "$neutral700", display: "inline-flex" } }, UI_TEXT.WHICH_MEETS, " "), /* @__PURE__ */ React__default.createElement(DropdownMenu, null, /* @__PURE__ */ React__default.createElement(DropdownMenuTrigger, { asChild: true }, /* @__PURE__ */ React__default.createElement(Flex, { alignItems: "center", css: { margin: "0 $2" } }, /* @__PURE__ */ React__default.createElement(
+      Text,
+      {
+        size: "md",
+        weight: "medium",
+        css: { color: "$neutral900", lineHeight: "$sm" }
+      },
+      (_b = topLevelCondition.find((c) => c.value === fields.condition)) == null ? void 0 : _b.label
+    ), /* @__PURE__ */ React__default.createElement(ChevronDownIcon, { size: 16, color: "#6A6A6A" }))), /* @__PURE__ */ React__default.createElement(
+      DropdownMenuContent,
+      {
+        align: "end",
+        sideOffset: 5,
+        css: { padding: "$4 0", minWidth: "$15" }
+      },
+      topLevelCondition.map((condition) => /* @__PURE__ */ React__default.createElement(
+        DropdownMenuItem,
+        {
+          key: condition.value,
+          onClick: () => setTopLevelCondition(condition.value),
+          css: __spreadValues({}, condition.value === fields.condition && {
+            background: "$primary100",
+            color: "$neutral900",
+            "&:hover": {
+              background: "$primary100",
+              color: "$neutral900"
+            }
+          })
+        },
+        condition.label
+      ))
+    )), /* @__PURE__ */ React__default.createElement(Text, { size: "md", css: { color: "$neutral700", display: "inline-flex" } }, UI_TEXT.OF_THESE_CONDITIONS)), /* @__PURE__ */ React__default.createElement(
+      Flex,
+      {
+        flexDirection: "column",
+        gap: "$12",
+        css: { marginTop: ((_c = fields.filters) == null ? void 0 : _c.length) ? "$12" : 0 }
+      },
+      (_d = fields.filters) == null ? void 0 : _d.map((filter, index) => /* @__PURE__ */ React__default.createElement(
+        Filter,
+        {
+          key: filter.id,
+          filters: filter,
+          fields,
+          hasNestedCondition,
+          index,
+          isEditing,
+          setIsEditing,
+          setCurrentField,
+          resetEditing: () => setIsEditing(false),
+          addNestedFilterCondition,
+          setNestedFieldCondition,
+          removeCurrentFilter,
+          removeNestedField,
+          fieldOptions
+        }
+      ))
+    ), /* @__PURE__ */ React__default.createElement(
+      Button,
+      {
+        css: { marginTop: "$8", marginLeft: "-$2" },
+        leftIcon: /* @__PURE__ */ React__default.createElement(PlusIcon, null),
+        variant: "ghost",
+        size: "md",
+        onClick: () => {
+          setIsEditing(true);
+          addFilterCondition();
+        }
+      },
+      UI_TEXT.ADD_CONDITION
+    ), hasValidFilters && /* @__PURE__ */ React__default.createElement(Flex, { flexDirection: "column", gap: "$12", css: { marginTop: "$40" } }, /* @__PURE__ */ React__default.createElement(Heading, { size: "h5" }, UI_TEXT.PASS_VARIABLE_TO_SURVEY), /* @__PURE__ */ React__default.createElement(Flex, { gap: "$2", flexDirection: "column" }, /* @__PURE__ */ React__default.createElement(FormLabel, { size: "xs", css: { fontWeight: "$5" } }, UI_TEXT.CHOOSE_FIELDS), /* @__PURE__ */ React__default.createElement(
+      Select,
+      {
+        placeholder: PLACEHOLDERS.SELECT_VARIABLES,
+        size: "lg",
+        isMulti: true,
+        closeMenuOnSelect: false,
+        isClearable: false,
+        value: triggerDetails.variables,
+        onChange: (field) => setTriggerField("variables", field),
+        css: {
+          p: { fontFamily: FONTS.MONO_FULL },
+          "& .twigs-select__control": {
+            overflow: "auto",
+            maxHeight: 488,
+            height: "100%"
+          },
+          ".twigs-select__value-container--is-multi": { gap: "$2" }
+        },
+        components: { MultiValue: CustomMultiValue },
+        options: variableOptions
+      }
+    ))), hasValidFilters && /* @__PURE__ */ React__default.createElement(Flex, { flexDirection: "column", gap: "$12", css: { marginBlock: "$40" } }, /* @__PURE__ */ React__default.createElement(Heading, { size: "h5" }, UI_TEXT.SEND_SURVEY), /* @__PURE__ */ React__default.createElement(Flex, { flexDirection: "column", gap: "$8" }, /* @__PURE__ */ React__default.createElement(Flex, { gap: "$2", flexDirection: "column" }, /* @__PURE__ */ React__default.createElement(FormLabel, { size: "xs", css: { fontWeight: "$5" } }, UI_TEXT.CHOOSE_SHARE_TYPE), /* @__PURE__ */ React__default.createElement(
+      Select,
+      {
+        placeholder: PLACEHOLDERS.SELECT_SHARE_TYPE,
+        size: "lg",
+        components: {
+          Option: CustomShareOption,
+          SingleValue: CustomSingleValue
+        },
+        styles: {
+          singleValue: (provided) => __spreadProps(__spreadValues({}, provided), {
+            display: "flex",
+            alignItems: "center"
+          })
+        },
+        value: triggerDetails.shareType,
+        onChange: handleShareTypeChange,
+        options: SHARE_TYPE_OPTIONS
+      }
+    )), !isEmpty(triggerDetails.shareType) && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(Flex, { gap: "$2", flexDirection: "column" }, /* @__PURE__ */ React__default.createElement(FormLabel, { size: "xs", css: { fontWeight: "$5" } }, UI_TEXT.CHOOSE_RECIPIENT), /* @__PURE__ */ React__default.createElement(
+      Select,
+      {
+        placeholder: PLACEHOLDERS.SELECT_RECIPIENT,
+        size: "lg",
+        onChange: (field) => setTriggerField("shareRecipient", field),
+        isDisabled: !((_e = triggerDetails.shareType) == null ? void 0 : _e.value),
+        value: triggerDetails.shareRecipient,
+        options: getRecipientOptions()
+      }
+    )), /* @__PURE__ */ React__default.createElement(Flex, { gap: "$2", flexDirection: "column" }, /* @__PURE__ */ React__default.createElement(FormLabel, { size: "xs", css: { fontWeight: "$5" } }, UI_TEXT.CHOOSE_SHARE_CHANNEL), /* @__PURE__ */ React__default.createElement(
+      Select,
+      {
+        placeholder: PLACEHOLDERS.SELECT_CHANNEL,
+        size: "lg",
+        components: {
+          Option: CustomShareChannelOption,
+          SingleValue: CustomShareChannelSingleValue
+        },
+        styles: {
+          singleValue: (provided) => __spreadProps(__spreadValues({}, provided), {
+            display: "flex",
+            alignItems: "center"
+          })
+        },
+        isDisabled: !((_f = triggerDetails.shareType) == null ? void 0 : _f.value),
+        value: triggerDetails.shareChannel,
+        onChange: (field) => setTriggerField("shareChannel", field),
+        options: getChannelOptions()
+      }
+    ))))))
+  );
+};
+
+export { TriggerConditions };
+//# sourceMappingURL=TriggerConditions.js.map

package/dist/es/triggers/components/TriggerConditions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TriggerConditions.js","sources":["../../../../src/triggers/components/TriggerConditions.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n  Box,\n  Button,\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuTrigger,\n  Flex,\n  FormLabel,\n  Heading,\n  Select,\n  Text,\n} from '@sparrowengg/twigs-react';\nimport { ChevronDownIcon, PlusIcon } from '@sparrowengg/twigs-react-icons';\nimport {\n  components,\n  OptionProps,\n  SingleValueProps,\n  MultiValueProps,\n} from 'react-select';\nimport { topLevelCondition, UI_TEXT, PLACEHOLDERS, FONTS, SHARE_TYPES } from '../constants';\nimport { Filter } from './Filter';\nimport CustomPill from '../../commons/components/custom-pill';\nimport SMSIcon from '../../commons/icons/sms';\nimport WhatsappIcon from '../../commons/icons/whatsapp';\nimport EmailLetterIcon from '../../commons/icons/email-letter';\nimport { useFetchChannels } from '../hooks/useFetchChannels';\nimport { useTriggerFields } from '../hooks/useTriggerFields';\nimport { TriggerComponentProps, ShareTypeOption, ChannelOption } from '../types';\nimport { SelectOption, TriggerDetails } from '../../commons/types/enhanced';\nimport { filterChannelsByType, isEmpty } from '../utils/helpers';\n\n/**\n * Get icon for share type\n */\nconst getShareTypeIcon = (type: string): React.ReactNode => {\n  switch (type) {\n    case SHARE_TYPES.EMAIL:\n      return <EmailLetterIcon />;\n    case SHARE_TYPES.SMS:\n      return <SMSIcon />;\n    case SHARE_TYPES.WHATSAPP:\n      return <WhatsappIcon />;\n    default:\n      return null;\n  }\n};\n\n/**\n * Custom option component for share type select\n */\nconst CustomShareOption: React.FC<OptionProps<ShareTypeOption>> = (props) => (\n  <components.Option {...props}>\n    <Flex css={{ cursor: 'pointer' }} alignItems=\"center\" gap=\"$2\">\n      {getShareTypeIcon(props.data.value)}\n      <Text size=\"sm\">{props.label}</Text>\n    </Flex>\n  </components.Option>\n);\n\n/**\n * Custom single value component for share type select\n */\nconst CustomSingleValue: React.FC<SingleValueProps<ShareTypeOption>> = (props) => (\n  <components.SingleValue {...props}>\n    <Flex css={{ cursor: 'pointer' }} alignItems=\"center\" gap=\"$2\">\n      {getShareTypeIcon(props.data.value)}\n      <Text size=\"sm\">{props.data.label}</Text>\n    </Flex>\n  </components.SingleValue>\n);\n\n/**\n * Custom multi-value component for variables select\n */\nconst CustomMultiValue: React.FC<MultiValueProps<SelectOption>> = (props) => (\n  <CustomPill\n    label={props.data.label}\n    onCloseHandler={() => props.removeProps?.onClick?.()}\n    variant=\"success\"\n    radius=\"md\"\n    fontFamily={FONTS.MONO}\n  />\n);\n\n/**\n * Custom option component for share channel select\n */\nconst CustomShareChannelOption: React.FC<OptionProps<SelectOption>> = (props) => {\n  const icon = props.data.value === SHARE_TYPES.NEW_SHARE ? <PlusIcon size={16} color=\"#6A6A6A\" /> : null;\n  return (\n    <components.Option {...props}>\n      <Flex css={{ cursor: 'pointer' }} alignItems=\"center\" gap=\"$2\">\n        {icon}\n        <Text size=\"sm\">{props.label}</Text>\n      </Flex>\n    </components.Option>\n  );\n};\n\n/**\n * Custom single value component for share channel select\n */\nconst CustomShareChannelSingleValue: React.FC<SingleValueProps<SelectOption>> = (props) => {\n  const icon = props.data.value === SHARE_TYPES.NEW_SHARE ? <PlusIcon size={16} color=\"#6A6A6A\" /> : null;\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/**\n * Share type options\n */\nconst SHARE_TYPE_OPTIONS: ShareTypeOption[] = [\n  { id: 1, label: UI_TEXT.EMAIL, value: SHARE_TYPES.EMAIL },\n  { id: 2, label: UI_TEXT.SMS, value: SHARE_TYPES.SMS },\n  { id: 3, label: UI_TEXT.WHATSAPP, value: SHARE_TYPES.WHATSAPP },\n];\n\n/**\n * TriggerConditions Component\n * Main component for setting up trigger conditions and sharing options\n */\nexport const TriggerConditions: React.FC<TriggerComponentProps> = ({\n  fields,\n  setFields,\n  token,\n  apiURL,\n  hasNestedCondition,\n  surveyDetails,\n  shareRecipentOptions,\n  triggerDetails,\n  setTriggerDetails,\n  fieldOptions,\n  variableOptions,\n}) => {\n  const [isEditing, setIsEditing] = useState(false);\n\n  // Fetch channels\n  const { channels } = useFetchChannels(token, apiURL, surveyDetails.surveyId);\n\n  // Get trigger field management functions\n  const {\n    addFilterCondition,\n    addNestedFilterCondition,\n    setCurrentField,\n    removeCurrentFilter,\n    removeNestedField,\n    setNestedFieldCondition,\n    setTopLevelCondition,\n  } = useTriggerFields(setFields);\n\n  /**\n   * Update trigger details field\n   */\n  const setTriggerField = (\n    property: keyof TriggerDetails,\n    value: SelectOption | null\n  ) => {\n    setTriggerDetails((prev: TriggerDetails) => ({\n      ...prev,\n      [property]: value,\n    }));\n  };\n\n  /**\n   * Handle share type change - reset dependent fields\n   */\n  const handleShareTypeChange = (value: SelectOption | null) => {\n    setTriggerField('shareType', value);\n    setTriggerField('shareRecipient', null);\n    setTriggerField('shareChannel', null);\n  };\n\n  /**\n   * Check if any filter has a valid value\n   */\n  const hasValidFilters = fields.filters?.some((filter) =>\n    filter.conditions?.some((condition) => condition?.value)\n  );\n\n  /**\n   * Get filtered channel options based on share type\n   */\n  const getChannelOptions = (): SelectOption[] => {\n    const shareType = triggerDetails.shareType?.value as string;\n    const filteredChannels = filterChannelsByType(channels, shareType);\n\n    if (filteredChannels.length > 0) {\n      return filteredChannels;\n    }\n\n    // Show \"New Share\" option only if not Whatsapp\n    if (shareType !== SHARE_TYPES.WHATSAPP) {\n      return [{ label: UI_TEXT.NEW_SHARE, value: SHARE_TYPES.NEW_SHARE }];\n    }\n\n    return [];\n  };\n\n  /**\n   * Get filtered recipient options based on share type\n   */\n  const getRecipientOptions = (): SelectOption[] => {\n    const shareType = triggerDetails.shareType?.value as string;\n    return shareRecipentOptions.filter((option) => option.type === shareType);\n  };\n\n  return (\n    <Flex\n      justifyContent=\"center\"\n      alignItems=\"center\"\n      css={{ marginTop: '$40' }}\n    >\n      <Box css={{ maxWidth: 488, width: '100%' }}>\n        {/* Condition Header */}\n        <Heading size=\"h5\">{UI_TEXT.SET_CONDITION}</Heading>\n        <Flex alignItems=\"center\" css={{ marginTop: '$12' }}>\n          <Text size=\"md\" css={{ color: '$neutral700', display: 'inline-flex' }}>\n            {UI_TEXT.WHICH_MEETS}{' '}\n          </Text>\n          <DropdownMenu>\n            <DropdownMenuTrigger asChild>\n              <Flex alignItems=\"center\" css={{ margin: '0 $2' }}>\n                <Text\n                  size=\"md\"\n                  weight=\"medium\"\n                  css={{ color: '$neutral900', lineHeight: '$sm' }}\n                >\n                  {topLevelCondition.find((c) => c.value === fields.condition)?.label}\n                </Text>\n                <ChevronDownIcon size={16} color=\"#6A6A6A\" />\n              </Flex>\n            </DropdownMenuTrigger>\n            <DropdownMenuContent\n              align=\"end\"\n              sideOffset={5}\n              css={{ padding: '$4 0', minWidth: '$15' }}\n            >\n              {topLevelCondition.map((condition) => (\n                <DropdownMenuItem\n                  key={condition.value}\n                  onClick={() => setTopLevelCondition(condition.value as 'AND' | 'OR')}\n                  css={{\n                    ...(condition.value === fields.condition && {\n                      background: '$primary100',\n                      color: '$neutral900',\n                      '&:hover': {\n                        background: '$primary100',\n                        color: '$neutral900',\n                      },\n                    }),\n                  }}\n                >\n                  {condition.label}\n                </DropdownMenuItem>\n              ))}\n            </DropdownMenuContent>\n          </DropdownMenu>\n          <Text size=\"md\" css={{ color: '$neutral700', display: 'inline-flex' }}>\n            {UI_TEXT.OF_THESE_CONDITIONS}\n          </Text>\n        </Flex>\n\n        {/* Filter Conditions */}\n        <Flex\n          flexDirection=\"column\"\n          gap=\"$12\"\n          css={{ marginTop: fields.filters?.length ? '$12' : 0 }}\n        >\n          {fields.filters?.map((filter, index) => (\n            <Filter\n              key={filter.id}\n              filters={filter}\n              fields={fields}\n              hasNestedCondition={hasNestedCondition}\n              index={index}\n              isEditing={isEditing}\n              setIsEditing={setIsEditing}\n              setCurrentField={setCurrentField}\n              resetEditing={() => setIsEditing(false)}\n              addNestedFilterCondition={addNestedFilterCondition}\n              setNestedFieldCondition={setNestedFieldCondition}\n              removeCurrentFilter={removeCurrentFilter}\n              removeNestedField={removeNestedField}\n              fieldOptions={fieldOptions}\n            />\n          ))}\n        </Flex>\n\n        <Button\n          css={{ marginTop: '$8', marginLeft: '-$2' }}\n          leftIcon={<PlusIcon />}\n          variant=\"ghost\"\n          size=\"md\"\n          onClick={() => {\n            setIsEditing(true);\n            addFilterCondition();\n          }}\n        >\n          {UI_TEXT.ADD_CONDITION}\n        </Button>\n\n        {/* Pass Variables Section */}\n        {hasValidFilters && (\n          <Flex flexDirection=\"column\" gap=\"$12\" css={{ marginTop: '$40' }}>\n            <Heading size=\"h5\">{UI_TEXT.PASS_VARIABLE_TO_SURVEY}</Heading>\n            <Flex gap=\"$2\" flexDirection=\"column\">\n              <FormLabel size=\"xs\" css={{ fontWeight: '$5' }}>\n                {UI_TEXT.CHOOSE_FIELDS}\n              </FormLabel>\n              <Select\n                placeholder={PLACEHOLDERS.SELECT_VARIABLES}\n                size=\"lg\"\n                isMulti\n                closeMenuOnSelect={false}\n                isClearable={false}\n                value={triggerDetails.variables}\n                onChange={(field) => setTriggerField('variables', field as SelectOption)}\n                css={{\n                  p: { fontFamily: FONTS.MONO_FULL },\n                  '& .twigs-select__control': {\n                    overflow: 'auto',\n                    maxHeight: 488,\n                    height: '100%',\n                  },\n                  '.twigs-select__value-container--is-multi': { gap: '$2' },\n                }}\n                components={{ MultiValue: CustomMultiValue }}\n                options={variableOptions}\n              />\n            </Flex>\n          </Flex>\n        )}\n\n        {/* Send Survey Section */}\n        {hasValidFilters && (\n          <Flex flexDirection=\"column\" gap=\"$12\" css={{ marginBlock: '$40' }}>\n            <Heading size=\"h5\">{UI_TEXT.SEND_SURVEY}</Heading>\n            <Flex flexDirection=\"column\" gap=\"$8\">\n              {/* Share Type */}\n              <Flex gap=\"$2\" flexDirection=\"column\">\n                <FormLabel size=\"xs\" css={{ fontWeight: '$5' }}>\n                  {UI_TEXT.CHOOSE_SHARE_TYPE}\n                </FormLabel>\n                <Select\n                  placeholder={PLACEHOLDERS.SELECT_SHARE_TYPE}\n                  size=\"lg\"\n                  components={{\n                    Option: CustomShareOption,\n                    SingleValue: CustomSingleValue,\n                  }}\n                  styles={{\n                    singleValue: (provided) => ({\n                      ...provided,\n                      display: 'flex',\n                      alignItems: 'center',\n                    }),\n                  }}\n                  value={triggerDetails.shareType}\n                  onChange={handleShareTypeChange}\n                  options={SHARE_TYPE_OPTIONS}\n                />\n              </Flex>\n\n              {!isEmpty(triggerDetails.shareType as Record<string, unknown>) && (\n                <>\n                  {/* Recipient */}\n                  <Flex gap=\"$2\" flexDirection=\"column\">\n                    <FormLabel size=\"xs\" css={{ fontWeight: '$5' }}>\n                      {UI_TEXT.CHOOSE_RECIPIENT}\n                    </FormLabel>\n                    <Select\n                      placeholder={PLACEHOLDERS.SELECT_RECIPIENT}\n                      size=\"lg\"\n                      onChange={(field) =>\n                        setTriggerField('shareRecipient', field as SelectOption)\n                      }\n                      isDisabled={!triggerDetails.shareType?.value}\n                      value={triggerDetails.shareRecipient}\n                      options={getRecipientOptions()}\n                    />\n                  </Flex>\n\n                  {/* Share Channel */}\n                  <Flex gap=\"$2\" flexDirection=\"column\">\n                    <FormLabel size=\"xs\" css={{ fontWeight: '$5' }}>\n                      {UI_TEXT.CHOOSE_SHARE_CHANNEL}\n                    </FormLabel>\n                    <Select\n                      placeholder={PLACEHOLDERS.SELECT_CHANNEL}\n                      size=\"lg\"\n                      components={{\n                        Option: CustomShareChannelOption,\n                        SingleValue: CustomShareChannelSingleValue,\n                      }}\n                      styles={{\n                        singleValue: (provided) => ({\n                          ...provided,\n                          display: 'flex',\n                          alignItems: 'center',\n                        }),\n                      }}\n                      isDisabled={!triggerDetails.shareType?.value}\n                      value={triggerDetails.shareChannel}\n                      onChange={(field) =>\n                        setTriggerField('shareChannel', field as SelectOption)\n                      }\n                      options={getChannelOptions()}\n                    />\n                  </Flex>\n                </>\n              )}\n            </Flex>\n          </Flex>\n        )}\n      </Box>\n    </Flex>\n  );\n};\n\n"],"names":["WhatsappIcon","React","_a"],"mappings":"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"}

package/dist/es/triggers/components/TriggerHeader.js

@@ -0,0 +1,128 @@
+import React__default, { useState } from 'react';
+import ArrowIcon from '../../commons/icons/arrow.js';
+import DraftModal from '../../commons/components/draftModal.js';
+import { isEventSetupValid, isTriggerValid } from '../utils/helpers.js';
+import { UI_TEXT, DRAFT } from '../constants/index.js';
+import { Flex } from '../../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js';
+import { IconButton } from '../../node_modules/@sparrowengg/twigs-react/dist/es/button/icon-button.js';
+import { ArrowLeftIcon } from '../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/arrow-left.js';
+import { Heading } from '../../node_modules/@sparrowengg/twigs-react/dist/es/heading/heading.js';
+import { Button } from '../../node_modules/@sparrowengg/twigs-react/dist/es/button/button.js';
+
+const TriggerHeader = ({
+  draftHandler,
+  navigateTriggerPage,
+  objects,
+  accounts,
+  actions,
+  onSaveTriggerLoader,
+  hasPreviousMapping,
+  isTriggerPage,
+  onSaveHandler,
+  navigateConfigurePage,
+  previousMappingHandler,
+  fields,
+  editFieldId,
+  eventFields,
+  triggerDetails
+}) => {
+  const [isDraftModalOpen, setIsDraftModalOpen] = useState(false);
+  const isEventSetupDisabled = !isEventSetupValid(
+    actions.value,
+    objects.value,
+    eventFields,
+    actions.options,
+    objects.options
+  );
+  const isSaveDisabled = !isTriggerValid(fields, triggerDetails);
+  const handleDraftSave = async () => {
+    await draftHandler(DRAFT.TYPE_TRIGGER, editFieldId);
+    await previousMappingHandler();
+    setIsDraftModalOpen(false);
+  };
+  const handleDraftCancel = async () => {
+    await previousMappingHandler();
+    setIsDraftModalOpen(false);
+  };
+  return /* @__PURE__ */ React__default.createElement(
+    Flex,
+    {
+      alignItems: "center",
+      justifyContent: "space-between",
+      css: {
+        position: "sticky",
+        width: "100%",
+        top: "1px",
+        zIndex: "99",
+        background: "#ffff",
+        borderBottom: "$borderWidths$xs solid $neutral200",
+        padding: "$8 $12"
+      }
+    },
+    isDraftModalOpen && /* @__PURE__ */ React__default.createElement(
+      DraftModal,
+      {
+        onSaveHandler: handleDraftSave,
+        onCloseHandler: () => setIsDraftModalOpen(false),
+        onCancel: handleDraftCancel
+      }
+    ),
+    /* @__PURE__ */ React__default.createElement(Flex, { gap: "$6", alignItems: "center" }, /* @__PURE__ */ React__default.createElement(
+      IconButton,
+      {
+        onClick: () => setIsDraftModalOpen(true),
+        color: "default",
+        icon: /* @__PURE__ */ React__default.createElement(ArrowLeftIcon, null),
+        size: "lg"
+      }
+    ), /* @__PURE__ */ React__default.createElement(Heading, { size: "h6" }, editFieldId ? UI_TEXT.EDIT_TRIGGER : UI_TEXT.NEW_TRIGGER)),
+    /* @__PURE__ */ React__default.createElement(
+      Flex,
+      {
+        alignItems: "center",
+        gap: "$4",
+        css: {
+          "& button": { background: "transparent !important", fontSize: "$md" }
+        }
+      },
+      /* @__PURE__ */ React__default.createElement(
+        Button,
+        {
+          css: { color: !isTriggerPage ? "$neutral900" : "$neutral800" },
+          color: "default",
+          variant: "ghost",
+          size: "md",
+          onClick: () => isTriggerPage && navigateConfigurePage()
+        },
+        UI_TEXT.EVENT_SETUP
+      ),
+      /* @__PURE__ */ React__default.createElement(ArrowIcon, null),
+      /* @__PURE__ */ React__default.createElement(
+        Button,
+        {
+          onClick: () => navigateTriggerPage(true),
+          css: { color: !isEventSetupDisabled ? "$neutral900" : "$neutral800" },
+          color: "default",
+          variant: "ghost",
+          size: "md",
+          disabled: isEventSetupDisabled
+        },
+        UI_TEXT.TRIGGER_CONDITIONS
+      )
+    ),
+    /* @__PURE__ */ React__default.createElement(
+      Button,
+      {
+        loading: onSaveTriggerLoader,
+        size: "lg",
+        disabled: isSaveDisabled,
+        onClick: () => onSaveHandler(editFieldId),
+        css: { visibility: isTriggerPage ? "visible" : "hidden" }
+      },
+      editFieldId ? UI_TEXT.UPDATE_TRIGGER : UI_TEXT.SAVE_TRIGGER
+    )
+  );
+};
+
+export { TriggerHeader };
+//# sourceMappingURL=TriggerHeader.js.map

package/dist/es/triggers/components/TriggerHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TriggerHeader.js","sources":["../../../../src/triggers/components/TriggerHeader.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n  Button,\n  Flex,\n  Heading,\n  IconButton,\n} from '@sparrowengg/twigs-react';\nimport { ArrowLeftIcon } from '@sparrowengg/twigs-react-icons';\nimport Arrow from '../../commons/icons/arrow';\nimport DraftModal from '../../commons/components/draftModal';\nimport { TriggerHeaderProps } from '../types';\nimport { isEventSetupValid, isTriggerValid } from '../utils/helpers';\nimport { UI_TEXT, DRAFT } from '../constants';\n\n/**\n * TriggerHeader Component\n * Displays the header with navigation, save button, and draft modal\n */\nexport const TriggerHeader: React.FC<TriggerHeaderProps> = ({\n  draftHandler,\n  navigateTriggerPage,\n  objects,\n  accounts,\n  actions,\n  onSaveTriggerLoader,\n  hasPreviousMapping,\n  isTriggerPage,\n  onSaveHandler,\n  navigateConfigurePage,\n  previousMappingHandler,\n  fields,\n  editFieldId,\n  eventFields,\n  triggerDetails,\n}) => {\n  const [isDraftModalOpen, setIsDraftModalOpen] = useState(false);\n\n  const isEventSetupDisabled = !isEventSetupValid(\n    actions.value,\n    objects.value,\n    eventFields,\n    actions.options,\n    objects.options\n  );\n\n  const isSaveDisabled = !isTriggerValid(fields, triggerDetails);\n\n  const handleDraftSave = async () => {\n    await draftHandler(DRAFT.TYPE_TRIGGER, editFieldId);\n    await previousMappingHandler();\n    setIsDraftModalOpen(false);\n  };\n\n  const handleDraftCancel = async () => {\n    await previousMappingHandler();\n    setIsDraftModalOpen(false);\n  };\n\n  return (\n    <Flex\n      alignItems=\"center\"\n      justifyContent=\"space-between\"\n      css={{\n        position: 'sticky',\n        width: '100%',\n        top: '1px',\n        zIndex: '99',\n        background: '#ffff',\n        borderBottom: '$borderWidths$xs solid $neutral200',\n        padding: '$8 $12',\n      }}\n    >\n      {isDraftModalOpen && (\n        <DraftModal\n          onSaveHandler={handleDraftSave}\n          onCloseHandler={() => setIsDraftModalOpen(false)}\n          onCancel={handleDraftCancel}\n        />\n      )}\n\n      <Flex gap=\"$6\" alignItems=\"center\">\n        <IconButton\n          onClick={() => setIsDraftModalOpen(true)}\n          color=\"default\"\n          icon={<ArrowLeftIcon />}\n          size=\"lg\"\n        />\n        <Heading size=\"h6\">\n          {editFieldId ? UI_TEXT.EDIT_TRIGGER : UI_TEXT.NEW_TRIGGER}\n        </Heading>\n      </Flex>\n\n      <Flex\n        alignItems=\"center\"\n        gap=\"$4\"\n        css={{\n          '& button': { background: 'transparent !important', fontSize: '$md' },\n        }}\n      >\n        <Button\n          css={{ color: !isTriggerPage ? '$neutral900' : '$neutral800' }}\n          color=\"default\"\n          variant=\"ghost\"\n          size=\"md\"\n          onClick={() => isTriggerPage && navigateConfigurePage()}\n        >\n          {UI_TEXT.EVENT_SETUP}\n        </Button>\n        <Arrow />\n        <Button\n          onClick={() => navigateTriggerPage(true)}\n          css={{ color: !isEventSetupDisabled ? '$neutral900' : '$neutral800' }}\n          color=\"default\"\n          variant=\"ghost\"\n          size=\"md\"\n          disabled={isEventSetupDisabled}\n        >\n          {UI_TEXT.TRIGGER_CONDITIONS}\n        </Button>\n      </Flex>\n\n      <Button\n        loading={onSaveTriggerLoader}\n        size=\"lg\"\n        disabled={isSaveDisabled}\n        onClick={() => onSaveHandler(editFieldId)}\n        css={{ visibility: isTriggerPage ? 'visible' : 'hidden' }}\n      >\n        {editFieldId ? UI_TEXT.UPDATE_TRIGGER : UI_TEXT.SAVE_TRIGGER}\n      </Button>\n    </Flex>\n  );\n};\n\n"],"names":["React","Arrow"],"mappings":"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"}

package/dist/es/triggers/components/chips/CustomChips.js

@@ -0,0 +1,63 @@
+import React__default from 'react';
+import { renderBooleanValue } from '../../utils/helpers.js';
+import { Chip } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/chip/chip.js';
+
+const CustomConditonChip = ({
+  children,
+  hasError = false
+}) => {
+  return /* @__PURE__ */ React__default.createElement(
+    Chip,
+    {
+      size: "lg",
+      css: {
+        backgroundColorOpacity: hasError ? ["#FDEDE8", 1] : ["$primary400", 0.2],
+        color: hasError ? "#E75030" : "$primary700",
+        padding: "$3 $1",
+        fontWeight: "$5",
+        lineHeight: "$sm"
+      }
+    },
+    children
+  );
+};
+const CustomFieldChip = ({
+  children,
+  setCurrentField,
+  currentFilter,
+  filters,
+  setIsEditing,
+  fieldType
+}) => {
+  const handleClick = () => {
+    const fieldsToResetMap = {
+      field: ["field", "operator", "value"],
+      operator: ["operator", "value"],
+      value: ["value"]
+    };
+    const fieldsToReset = fieldsToResetMap[fieldType] || ["value"];
+    fieldsToReset.forEach((field) => {
+      setCurrentField(null, currentFilter.id, filters.id, field);
+    });
+    setIsEditing(true);
+  };
+  return /* @__PURE__ */ React__default.createElement(
+    Chip,
+    {
+      size: "lg",
+      css: {
+        background: "transparent",
+        color: "$neutral800",
+        padding: "$3 $1",
+        fontWeight: "$7",
+        lineHeight: "$sm",
+        cursor: "pointer"
+      },
+      onClick: handleClick
+    },
+    renderBooleanValue(children)
+  );
+};
+
+export { CustomConditonChip, CustomFieldChip };
+//# sourceMappingURL=CustomChips.js.map

package/dist/es/triggers/components/chips/CustomChips.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomChips.js","sources":["../../../../../src/triggers/components/chips/CustomChips.tsx"],"sourcesContent":["import React from 'react';\nimport { Chip } from '@sparrowengg/twigs-react';\nimport { CustomConditonChipProps, CustomFieldChipProps, FilterFieldType } from '../../types';\nimport { renderBooleanValue } from '../../utils/helpers';\n\n/**\n * Custom chip for condition display with error state\n */\nexport const CustomConditonChip: React.FC<CustomConditonChipProps> = ({\n  children,\n  hasError = false,\n}) => {\n  return (\n    <Chip\n      size=\"lg\"\n      css={{\n        backgroundColorOpacity: hasError\n          ? ['#FDEDE8', 1]\n          : ['$primary400', 0.2],\n        color: hasError ? '#E75030' : '$primary700',\n        padding: '$3 $1',\n        fontWeight: '$5',\n        lineHeight: '$sm',\n      }}\n    >\n      {children}\n    </Chip>\n  );\n};\n\n/**\n * Custom chip for field values with edit functionality\n */\nexport const CustomFieldChip: React.FC<CustomFieldChipProps> = ({\n  children,\n  setCurrentField,\n  currentFilter,\n  filters,\n  setIsEditing,\n  fieldType,\n}) => {\n  /**\n   * Handle chip click - reset fields based on type\n   */\n  const handleClick = () => {\n    const fieldsToResetMap: Record<FilterFieldType, FilterFieldType[]> = {\n      field: ['field', 'operator', 'value'],\n      operator: ['operator', 'value'],\n      value: ['value'],\n    };\n\n    const fieldsToReset = fieldsToResetMap[fieldType] || ['value'];\n    \n    fieldsToReset.forEach((field) => {\n      setCurrentField(null, currentFilter.id, filters.id, field);\n    });\n    \n    setIsEditing(true);\n  };\n\n  return (\n    <Chip\n      size=\"lg\"\n      css={{\n        background: 'transparent',\n        color: '$neutral800',\n        padding: '$3 $1',\n        fontWeight: '$7',\n        lineHeight: '$sm',\n        cursor: 'pointer',\n      }}\n      onClick={handleClick}\n    >\n      {renderBooleanValue(children)}\n    </Chip>\n  );\n};\n\n"],"names":["React"],"mappings":";;;;AAQO,MAAM,qBAAwD,CAAC;AAAA,EACpE,QAAA;AAAA,EACA,QAAW,GAAA,KAAA;AACb,CAAM,KAAA;AACJ,EACE,uBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,IAAK,EAAA,IAAA;AAAA,MACL,GAAK,EAAA;AAAA,QACH,sBAAA,EAAwB,WACpB,CAAC,SAAA,EAAW,CAAC,CACb,GAAA,CAAC,eAAe,GAAG,CAAA;AAAA,QACvB,KAAA,EAAO,WAAW,SAAY,GAAA,aAAA;AAAA,QAC9B,OAAS,EAAA,OAAA;AAAA,QACT,UAAY,EAAA,IAAA;AAAA,QACZ,UAAY,EAAA,KAAA;AAAA,OACd;AAAA,KAAA;AAAA,IAEC,QAAA;AAAA,GACH,CAAA;AAEJ,EAAA;AAKO,MAAM,kBAAkD,CAAC;AAAA,EAC9D,QAAA;AAAA,EACA,eAAA;AAAA,EACA,aAAA;AAAA,EACA,OAAA;AAAA,EACA,YAAA;AAAA,EACA,SAAA;AACF,CAAM,KAAA;AAIJ,EAAA,MAAM,cAAc,MAAM;AACxB,IAAA,MAAM,gBAA+D,GAAA;AAAA,MACnE,KAAO,EAAA,CAAC,OAAS,EAAA,UAAA,EAAY,OAAO,CAAA;AAAA,MACpC,QAAA,EAAU,CAAC,UAAA,EAAY,OAAO,CAAA;AAAA,MAC9B,KAAA,EAAO,CAAC,OAAO,CAAA;AAAA,KACjB,CAAA;AAEA,IAAA,MAAM,aAAgB,GAAA,gBAAA,CAAiB,SAAS,CAAA,IAAK,CAAC,OAAO,CAAA,CAAA;AAE7D,IAAc,aAAA,CAAA,OAAA,CAAQ,CAAC,KAAU,KAAA;AAC/B,MAAA,eAAA,CAAgB,IAAM,EAAA,aAAA,CAAc,EAAI,EAAA,OAAA,CAAQ,IAAI,KAAK,CAAA,CAAA;AAAA,KAC1D,CAAA,CAAA;AAED,IAAA,YAAA,CAAa,IAAI,CAAA,CAAA;AAAA,GACnB,CAAA;AAEA,EACE,uBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,IAAK,EAAA,IAAA;AAAA,MACL,GAAK,EAAA;AAAA,QACH,UAAY,EAAA,aAAA;AAAA,QACZ,KAAO,EAAA,aAAA;AAAA,QACP,OAAS,EAAA,OAAA;AAAA,QACT,UAAY,EAAA,IAAA;AAAA,QACZ,UAAY,EAAA,KAAA;AAAA,QACZ,MAAQ,EAAA,SAAA;AAAA,OACV;AAAA,MACA,OAAS,EAAA,WAAA;AAAA,KAAA;AAAA,IAER,mBAAmB,QAAQ,CAAA;AAAA,GAC9B,CAAA;AAEJ;;;;"}